/* ============================================================
   LUMA Integration — Home (front page) styles
   Extracted verbatim from the design prototype's inline <style>.
   ============================================================ */

/* ---- hero ---- */
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--charcoal);}
.hero image-slot{position:absolute;inset:0;width:100%;height:100%;background:var(--charcoal-deep);}
.hero .hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;will-change:transform;}
.hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(28,31,33,.62) 0%,rgba(28,31,33,.22) 30%,rgba(28,31,33,.34) 58%,rgba(24,27,29,.9) 100%),
    linear-gradient(90deg,rgba(24,27,29,.55) 0%,rgba(24,27,29,.12) 48%,rgba(24,27,29,0) 100%);}
.hero-inner{position:relative;z-index:2;max-width:var(--container);margin:0 auto;width:100%;padding:0 var(--gutter) clamp(64px,8vw,104px);}
.hero h1{color:#fff;max-width:16ch;}
.hero .lead{color:rgba(255,255,255,.82);max-width:46ch;margin-top:24px;}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px;}
.hero-scroll{position:absolute;right:var(--gutter);bottom:clamp(64px,8vw,104px);z-index:2;
  writing-mode:vertical-rl;font-size:13px;letter-spacing:.18em;color:rgba(255,255,255,.6);text-transform:uppercase;}

.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,96px);align-items:start;}
.creds{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,30px);margin-top:8px;}
.cred .n{font-weight:800;font-size:clamp(28px,2.6vw,40px);letter-spacing:-.03em;line-height:1;}
.cred .t{font-size:14.5px;color:var(--stone);margin-top:8px;}

.svc-head{display:none;}
/* pinned flip services */
.svc-pin{position:relative;background:var(--charcoal);}
.svc-pin-track{position:relative;}
.svc-pin-stage{position:sticky;top:0;height:100vh;overflow:hidden;}
.svc-slide{position:absolute;inset:0;opacity:0;visibility:hidden;
  transition:opacity .7s var(--ease),visibility .7s var(--ease);}
.svc-slide.is-active{opacity:1;visibility:visible;}
.svc-slide-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transform:scale(1.08);transition:transform 1.6s var(--ease);}
.svc-slide.is-active .svc-slide-bg{transform:scale(1);}
.svc-slide-scrim{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(18,20,22,.92) 0%,rgba(18,20,22,.6) 42%,rgba(18,20,22,.15) 75%,rgba(18,20,22,0) 100%),
    linear-gradient(0deg,rgba(18,20,22,.5),rgba(18,20,22,0) 40%);}
.svc-slide-inner{position:relative;z-index:2;height:100%;max-width:var(--container);margin:0 auto;
  padding:0 var(--gutter);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px;color:#fff;
  opacity:0;transform:translateY(38px);transition:opacity .6s var(--ease),transform .8s cubic-bezier(.16,1,.3,1);}
.svc-slide.is-active .svc-slide-inner{opacity:1;transform:none;transition-delay:.12s;}
@media(prefers-reduced-motion:reduce){
  .svc-slide-bg,.svc-slide-inner{transition:none;}
  .svc-slide-inner{transform:none;}
}
.svc-slide-kicker{font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);}
.svc-slide-kicker b{color:var(--gold);font-size:16px;}
.svc-slide-title{font-size:clamp(38px,6vw,84px);font-weight:800;letter-spacing:-.035em;line-height:.98;max-width:14ch;}
.svc-slide-lead{font-size:clamp(17px,1.5vw,21px);line-height:1.55;color:rgba(255,255,255,.82);max-width:46ch;}
.svc-slide-list{list-style:none;margin:2px 0 4px;padding:0;display:flex;flex-wrap:wrap;gap:10px 26px;max-width:48ch;}
.svc-slide-list li{position:relative;padding-left:20px;font-size:15.5px;font-weight:500;color:rgba(255,255,255,.86);}
.svc-slide-list li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--gold);}
.svc-slide-inner .btn{margin-top:8px;}
/* progress nav */
.svc-pin-nav{position:absolute;left:0;right:0;bottom:clamp(28px,5vh,56px);z-index:5;
  max-width:var(--container);margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;gap:20px;}
.svc-pin-nav .idx{font-size:14px;font-weight:600;letter-spacing:.08em;color:rgba(255,255,255,.5);
  font-variant-numeric:tabular-nums;white-space:nowrap;}
.svc-pin-nav .idx b{color:var(--gold);font-size:18px;}
.svc-pin-ticks{display:flex;gap:10px;flex:1;max-width:420px;}
.svc-pin-ticks .tk{flex:1;height:2px;background:rgba(255,255,255,.18);border-radius:2px;overflow:hidden;}
.svc-pin-ticks .tk span{display:block;height:100%;width:0;background:var(--gold);
  box-shadow:0 0 10px rgba(192,156,102,.6);transition:width .1s linear;}
.svc-pin-ticks .tk.done span,.svc-pin-ticks .tk.active span{width:100%;}
@media(prefers-reduced-motion:reduce),(max-width:0px){
  .svc-pin-track{height:auto !important;}
  .svc-pin-stage{position:static;height:auto;overflow:visible;}
  .svc-slide{position:relative;inset:auto;opacity:1;transform:none;transition:none;min-height:90vh;}
}

/* capabilities — dedicated larger section */
.caps-head{max-width:680px;margin:0 auto clamp(40px,5vw,64px);text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:18px;}
.caps-head .gold-rule{margin:0 auto;}
.caps-head .lead{max-width:54ch;}
.caps-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.capx{background:var(--paper);padding:clamp(28px,3vw,42px);display:flex;gap:22px;align-items:flex-start;
  transition:background .25s var(--ease);}
.capx:hover{background:var(--porcelain);}
.capx-n{font-size:14px;font-weight:600;color:var(--gold-deep);padding-top:5px;
  font-variant-numeric:tabular-nums;flex-shrink:0;}
.capx-body{display:flex;flex-direction:column;gap:9px;}
.capx-body h3{font-size:clamp(19px,1.5vw,23px);font-weight:600;letter-spacing:-.02em;color:var(--ink);}
.capx-body p{font-size:15.5px;line-height:1.5;color:var(--ink-soft);max-width:44ch;}

/* featured project slider */
.featured{position:relative;min-height:90vh;overflow:hidden;background:var(--charcoal);}
.fslides{position:absolute;inset:0;}
.fslide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1s var(--ease),visibility 1s var(--ease);}
.fslide.is-active{opacity:1;visibility:visible;}
.fslide-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.05);transition:transform 8s ease-out;}
.fslide.is-active .fslide-bg{transform:scale(1.13);}
.fslide-scrim{position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(24,27,29,.5) 0%,rgba(24,27,29,.12) 36%,rgba(24,27,29,.34) 64%,rgba(20,22,24,.9) 100%),
    linear-gradient(90deg,rgba(20,22,24,.6) 0%,rgba(20,22,24,.14) 52%,rgba(20,22,24,0) 100%);}
.fslide-inner{position:absolute;inset:0;display:flex;align-items:flex-end;padding-bottom:clamp(128px,17vh,200px);}
.fslide-inner .container{width:100%;}
.fslide-text{max-width:640px;display:flex;flex-direction:column;align-items:flex-start;gap:18px;
  opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s cubic-bezier(.16,1,.3,1);}
.fslide.is-active .fslide-text{opacity:1;transform:none;transition-delay:.28s;}
.fslide:not(.is-active) .fslide-text{transition:none;}
.fslide-text .h2{color:#fff;}
.fslide-head{display:flex;flex-direction:column;gap:7px;}
.fslide-loc{font-size:16px;color:rgba(255,255,255,.72);}
.fslide-text .lead{color:rgba(255,255,255,.82);max-width:46ch;}
.fslide-text .tags{display:flex;gap:9px;flex-wrap:wrap;}
.fslide-text .tag{color:rgba(255,255,255,.86);border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.07);}
.fslide-text .btn{margin-top:6px;}
@media(prefers-reduced-motion:reduce){
  .fslide-bg{transition:none;}.fslide.is-active .fslide-bg{transform:scale(1.05);}
  .fslide-text{transition:opacity .4s linear;transform:none;}
}

/* slider controls */
.fnav{position:absolute;left:0;right:0;bottom:clamp(36px,6vh,60px);z-index:6;}
.fnav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.fcount{font-size:15px;color:rgba(255,255,255,.7);letter-spacing:.04em;}
.fcount .fcur{color:#fff;font-weight:600;}
.fnav-right{display:flex;align-items:center;gap:22px;}
.fdots{display:flex;gap:10px;}
.fdot{width:30px;height:3px;border-radius:2px;background:rgba(255,255,255,.28);border:0;padding:0;cursor:pointer;transition:background .25s var(--ease);}
.fdot.is-active{background:var(--gold);}
.farrows{display:flex;gap:10px;}
.farrow{width:50px;height:50px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.04);
  color:#fff;font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease);}
.farrow:hover{background:#fff;border-color:#fff;color:var(--charcoal);}
.farrow:active{transform:scale(.94);}

.collab-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,80px);align-items:center;}
.steps{display:flex;flex-direction:column;}
.step{display:grid;grid-template-columns:auto 1fr;gap:22px;padding:24px 0;border-top:1px solid var(--line-dk);}
.step:last-child{border-bottom:1px solid var(--line-dk);}
.step .k{font-size:15px;font-weight:600;color:var(--gold);padding-top:3px;}
.step h4{font-size:20px;font-weight:600;color:#fff;letter-spacing:-.01em;margin-bottom:7px;}
.step p{font-size:15.5px;color:rgba(255,255,255,.6);}

.cta-band{text-align:center;}
.cta-inner{max-width:680px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:26px;}

@media(max-width:980px){
  .intro-grid,.collab-grid{grid-template-columns:1fr;}
  .featured{min-height:80vh;}
}
@media(max-width:680px){
  .caps-grid{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .hero-scroll{display:none;}
}
