/* ============================================================
   home.css — sections specific to the home page:
   hero carousel, about, divisions, capability, reach, CTA.
   ============================================================ */

/* ---------- HERO CAROUSEL ---------- */
.hero{position:relative;height:100vh;min-height:620px;overflow:hidden}
.hero-progress{position:absolute;top:0;left:0;height:3px;background:var(--crimson);z-index:6;width:0}
.hero-track{display:flex;height:100%;transition:transform .9s var(--ease)}
.hero-slide{position:relative;min-width:100%;height:100%;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,20,48,.93) 0%,rgba(10,20,48,.64) 46%,rgba(10,20,48,.3) 100%)}
.scene{position:absolute;inset:0;background-size:cover;background-position:center right}
.scene-1{background-image:url('../assets/img/hero-1.jpg')}
.scene-2{background-image:url('../assets/img/hero-2.jpg')}
.scene-3{background-image:url('../assets/img/hero-3.jpg')}
.scene-4{background-image:url('../assets/img/hero-4.jpg')}
.hero-content{position:absolute;inset:0;z-index:4;display:flex;align-items:center}
.hero-content .wrap{width:100%}
.hero-text{max-width:700px;color:#fff;transform:translateY(20px);opacity:0;transition:all .8s var(--ease) .15s}
.hero-slide.active .hero-text{transform:none;opacity:1}
.hero-text .eyebrow{color:var(--steel-light)}
.hero-text h1{font-size:clamp(42px,6.6vw,88px);font-weight:700;margin:22px 0 0;letter-spacing:-.035em;max-width:16ch}
.hero-text h1 .hl{color:var(--crimson-2)}
.hero-text p{margin-top:22px;font-size:clamp(16px,1.6vw,20px);max-width:52ch;color:var(--muted)}
.hero-actions{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap}
.hero-dots{position:absolute;left:0;right:0;bottom:34px;z-index:6;display:flex;gap:12px;justify-content:center}
.hero-dots button{width:38px;height:5px;border-radius:100px;border:none;background:rgba(234,241,255,.3);cursor:pointer;transition:background .3s,width .3s;padding:0}
.hero-dots button.active{background:var(--crimson);width:54px}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid var(--line);color:#fff;font-size:20px;cursor:pointer;backdrop-filter:blur(6px);transition:background .25s;display:grid;place-items:center}
.hero-arrow:hover{background:rgba(255,255,255,.22)}
.hero-arrow.prev{left:26px}
.hero-arrow.next{right:26px}

/* ---------- ABOUT ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.about-copy h2{font-size:clamp(30px,4vw,50px)}
.about-copy p{margin-top:20px;color:var(--muted);font-size:17px}
.about-copy .ticks{margin-top:28px;display:flex;flex-direction:column;gap:14px}
.about-copy .ticks div{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.about-copy .ticks div::before{content:"▲";color:var(--crimson);font-size:10px;margin-top:5px}
/* group photo mosaic */
.about-mosaic{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:14px;aspect-ratio:1/1.02}
.m-tile{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background-size:cover;background-position:center;min-height:0}
.m-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,48,.05),rgba(10,20,48,.45))}
.m-tile span{position:absolute;left:14px;bottom:12px;z-index:2;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(234,241,255,.72);font-weight:600}
.m-a{grid-row:span 2}
.m-facility{background-image:url('../assets/img/group-1.jpg')}
.m-people{background-image:url('../assets/img/group-2.jpg')}
.m-product{background-image:url('../assets/img/group-3.jpg')}
.m-badge{position:absolute;left:-18px;bottom:26px;z-index:3;background:var(--crimson);color:#fff;border-radius:14px;padding:16px 20px;box-shadow:0 18px 40px -16px rgba(214,35,43,.8);display:flex;flex-direction:column;line-height:1}
.m-badge b{font-family:'Space Grotesk';font-weight:700;font-size:34px;letter-spacing:-.02em}
.m-badge span{font-size:11px;letter-spacing:.06em;margin-top:6px;color:rgba(255,255,255,.9)}

/* ---------- DIVISIONS (expanding panels) ---------- */
.divisions{background:var(--navy-2)}
.panels{display:flex;gap:14px;height:480px}
.epanel{position:relative;flex:1;border-radius:var(--r);overflow:hidden;cursor:pointer;transition:flex .55s var(--ease);min-width:0;border:1px solid var(--line)}
.epanel:hover{flex:3.4}
.epanel .ebg{position:absolute;inset:0;transition:transform .6s var(--ease)}
.epanel:hover .ebg{transform:scale(1.06)}
.epanel .ebg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,48,.15),rgba(10,20,48,.85))}
.epanel .einner{position:absolute;inset:0;z-index:2;padding:28px;display:flex;flex-direction:column;justify-content:flex-end}
.epanel .eidx{position:absolute;top:24px;left:28px;font-size:12px;letter-spacing:.16em;font-weight:600;color:var(--ice);opacity:.8}
.epanel h3{font-size:clamp(20px,2.4vw,30px);writing-mode:vertical-rl;transform:rotate(180deg);transition:writing-mode 0s,transform .3s;white-space:nowrap}
.epanel:hover h3{writing-mode:horizontal-tb;transform:none}
.epanel .edesc{max-height:0;opacity:0;overflow:hidden;transition:max-height .4s var(--ease),opacity .4s,margin .4s}
.epanel:hover .edesc{max-height:120px;opacity:1;margin-top:12px}
.epanel .edesc p{font-size:14.5px;color:rgba(234,241,255,.85);max-width:42ch}
.epanel .emore{margin-top:14px;display:inline-flex;gap:8px;font-size:13px;font-weight:600;color:var(--crimson-2);opacity:0;transition:opacity .4s .1s}
.epanel:hover .emore{opacity:1}
.eb-garments{background:url('../assets/img/hero-2.jpg') center/cover}
.eb-home{background:url('../assets/img/hero-3.jpg') center/cover}
.eb-cones{background:url('../assets/img/hero-4.jpg') center/cover}
/* eb-tech kept for the Technology division when it returns */
.eb-tech{background:linear-gradient(135deg,#0e1b40,#0a1430);border-style:dashed}
.epanel.ghost{cursor:default}
.epanel.ghost .einner{justify-content:center;align-items:center;text-align:center}
.epanel.ghost h3{writing-mode:horizontal-tb;transform:none;color:var(--muted);font-size:18px}

/* ---------- CAPABILITY ---------- */
.caps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cap{border:1px solid var(--line);border-radius:var(--r);padding:28px;background:rgba(255,255,255,.02);transition:transform .3s,border-color .3s,background .3s}
.cap:hover{transform:translateY(-6px);border-color:var(--steel);background:rgba(46,91,186,.08)}
.cap .capn{font-family:'Space Grotesk';font-weight:700;font-size:14px;color:var(--crimson);letter-spacing:.1em}
.cap h4{font-size:20px;margin:14px 0 10px}
.cap p{font-size:14.5px;color:var(--muted)}

/* quality & certifications strip */
.certs{margin-top:40px;border-top:1px solid var(--line);padding-top:36px}
.cert-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px}
.cert{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:12px;padding:16px 24px 16px 16px;background:rgba(255,255,255,.02);min-width:180px;transition:transform .3s,border-color .3s,background .3s}
.cert:hover{transform:translateY(-4px);border-color:var(--crimson);background:rgba(214,35,43,.06)}
.cert .seal{flex:none;width:44px;height:44px;border-radius:50%;border:2px solid var(--steel);display:grid;place-items:center;color:var(--steel-light);font-size:20px;font-weight:700}
.cert-txt b{display:block;font-family:'Space Grotesk';font-weight:700;font-size:18px;letter-spacing:-.01em}
.cert-txt span{display:block;font-size:12.5px;color:var(--muted);margin-top:3px}

/* ---------- REACH ---------- */
.reach{background:var(--navy-2)}
.reach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.rcard{border:1px solid var(--line);border-radius:var(--r);padding:30px;transition:background .3s,transform .3s}
.rcard:hover{background:rgba(214,35,43,.1);transform:translateY(-5px)}
.rcard .fig{font-family:'Space Grotesk';font-weight:700;font-size:44px;color:#fff;letter-spacing:-.03em}
.rcard .lab{margin-top:10px;font-size:14px;color:var(--muted)}

/* ---------- CTA ---------- */
.cta-inner{position:relative;border-radius:28px;overflow:hidden;padding:84px 48px;text-align:center;
  background:radial-gradient(120% 140% at 0% 0%,rgba(46,91,186,.6),transparent 55%),linear-gradient(135deg,var(--crimson),#9c1218)}
.cta-inner::after{content:"";position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px);background-size:46px 46px}
.cta-inner>*{position:relative;z-index:1}
.cta-inner h2{font-size:clamp(30px,4.4vw,56px);color:#fff}
.cta-inner p{margin:18px auto 32px;font-size:19px;color:rgba(255,255,255,.9);max-width:50ch}
.cta-inner .btn{background:#fff;color:var(--crimson);font-weight:700}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .about-grid{grid-template-columns:1fr;gap:36px}
  .panels{flex-direction:column;height:auto}
  .epanel{flex:none;height:200px}
  .epanel:hover{flex:none}
  .epanel h3{writing-mode:horizontal-tb;transform:none}
  .epanel .edesc{max-height:120px;opacity:1;margin-top:12px}
  .epanel .emore{opacity:1}
  .caps{grid-template-columns:1fr 1fr}
  .reach-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .caps{grid-template-columns:1fr}
  .reach-grid{grid-template-columns:1fr}
  .hero-arrow{display:none}
}