:root{
  --bg:#0a0a0d;
  --bg-void:#000103;
  --surface:#151518;
  --surface-2:#1d1d22;
  --border:rgba(255,255,255,0.10);
  --border-strong:rgba(255,255,255,0.20);
  --ink:#f3f2ee;
  --text:#f3f2ee;
  --text-dim:#a6a5ac;
  --text-faint:#6d6c74;
  --gold:#c9a35a;
  --gold-light:#e2c48c;
  --radius:4px;
  --ease: cubic-bezier(.2,.7,.2,1);
  color-scheme: dark;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  padding-block: env(safe-area-inset-top,0px) env(safe-area-inset-bottom,0px);
  transition: background-color 1s var(--ease);
}
img{max-width:100%;}
[hidden]{display:none!important;}

h1,h2,h3{font-family:'Source Serif 4',Georgia,serif;font-weight:600;letter-spacing:-0.01em;margin:0;color:var(--ink);}
h1{font-size:clamp(2.8rem,5.4vw,4.6rem);line-height:1.06;}
h2{font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.14;}
h3{font-size:1.05rem;font-weight:600;font-family:'Inter',sans-serif;color:var(--ink);}
p{color:var(--text-dim);margin:0;}
a{color:inherit;text-decoration:none;}
br.lb{display:none;}
@media (min-width:720px){ br.lb{display:block;} }

.eyebrow{
  text-transform:uppercase;
  font-size:0.74rem;
  letter-spacing:0.14em;
  font-weight:600;
  color:var(--gold);
  margin:0 0 12px;
}

/* top info bar */
.topbar{background:#000; color:rgba(255,255,255,0.6);}
.topbar-inner{
  max-width:1180px; margin:0 auto; padding:7px 24px;
  font-size:0.78rem; letter-spacing:0.02em;
  padding-top: calc(7px + env(safe-area-inset-top,0px));
}
.topbar-sep{margin:0 8px; color:rgba(255,255,255,0.28);}

/* scroll-driven vignette — darkens toward the edges as the page is scrolled */
.scroll-vignette{
  position:fixed; inset:0; z-index:40; pointer-events:none;
  background:radial-gradient(ellipse at 50% 42%, transparent 35%, rgba(0,0,0,var(--vig,0)) 100%);
  transition:background .1s linear;
}

/* nav */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(10,10,13,0.78);
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
  border-bottom:1px solid var(--border);
  transition:background .3s var(--ease), box-shadow .3s var(--ease);
}
.nav.scrolled{
  background:rgba(6,6,8,0.92);
  box-shadow:0 10px 30px -14px rgba(0,0,0,0.7);
}
.nav-inner{
  max-width:1180px; margin:0 auto; padding:16px 24px;
  display:flex; align-items:center; gap:30px;
}
.brand{display:flex;align-items:center;gap:12px;}
.brand-mark{color:var(--gold); flex:none;}
.brand-text{display:flex; flex-direction:column; line-height:1.2;}
.brand-text{font-weight:700; font-size:1.02rem; color:var(--ink);}
.brand-text small{font-weight:500; font-size:0.68rem; color:var(--text-faint); letter-spacing:0.03em; text-transform:uppercase;}
.nav-links{display:flex;gap:26px;margin-right:auto;}
.nav-links a{font-size:0.9rem;color:var(--text-dim);transition:color .2s var(--ease); position:relative; padding-bottom:2px;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .25s var(--ease);}
.nav-links a:hover{color:var(--ink);}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left;}
.nav-toggle{display:none;background:none;border:0;flex-direction:column;gap:5px;cursor:pointer;padding:6px;margin-left:auto;}
.nav-toggle span{width:20px;height:2px;background:var(--ink);border-radius:2px;}
.nav-mobile{display:none;flex-direction:column;padding:6px 24px 16px;border-top:1px solid var(--border);}
.nav-mobile a{padding:10px 0;color:var(--text-dim);font-size:0.95rem;border-bottom:1px solid var(--border);}
.nav-mobile a:last-child{border-bottom:0;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 28px; border-radius:var(--radius); font-weight:600; font-size:0.9rem;
  border:1px solid transparent; cursor:pointer;
  transition:background .2s var(--ease), border-color .2s, color .2s, transform .2s var(--ease), box-shadow .2s var(--ease);
  white-space:nowrap; letter-spacing:0.01em;
}
.btn-primary{background:var(--ink); color:#0a0a0c;}
.btn-primary:hover{background:var(--gold); transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(201,163,90,0.4);}
.btn-outline{background:transparent; color:var(--ink); border-color:var(--border-strong);}
.btn-outline:hover{border-color:var(--gold); color:var(--gold-light); transform:translateY(-2px);}
.btn-block{width:100%;}
.btn:disabled{opacity:0.6;cursor:not-allowed; transform:none;}
.btn:active{transform:translateY(0) scale(0.98);}

/* hero */
.hero{
  max-width:1240px; margin:0 auto; padding:64px 24px clamp(72px,10vw,120px);
  position:relative; overflow:hidden;
}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; position:relative; z-index:1;}
.hero-inner{max-width:620px;}
.hero-sub{margin-top:26px; font-size:1.1rem; max-width:480px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:34px;}

/* hero stack — dimensional tilted cards with an ambient glow behind, echoes a product-shot */
.hero-stack{
  position:relative; height:420px; perspective:1400px;
}
.hero-glow{
  position:absolute; top:50%; left:50%; width:720px; height:720px;
  background:radial-gradient(circle, rgba(201,163,90,0.22) 0%, rgba(201,163,90,0.08) 35%, transparent 68%);
  transform:translate(-50%,-50%); border-radius:50%; filter:blur(10px);
  animation:glowPulse 7s ease-in-out infinite; pointer-events:none;
}
@keyframes glowPulse{0%,100%{opacity:0.75; transform:translate(-50%,-50%) scale(1);} 50%{opacity:1; transform:translate(-50%,-50%) scale(1.06);}}
.stack-card{
  position:absolute; background:var(--surface); border:1px solid var(--border);
  border-radius:10px; padding:20px 22px;
  box-shadow:0 30px 60px -16px rgba(0,0,0,0.6), 0 8px 20px -10px rgba(0,0,0,0.5);
  transform-style:preserve-3d;
  animation:stackFloat 8s ease-in-out infinite;
}
.stack-card-1{
  width:320px; top:4%; left:4%;
  transform:rotateX(32deg) rotateY(-30deg) rotateZ(6deg) translateZ(0px);
  z-index:1; animation-delay:0s;
}
.stack-card-2{
  width:250px; top:46%; left:38%;
  transform:rotateX(32deg) rotateY(-30deg) rotateZ(6deg) translateZ(70px);
  z-index:2; animation-delay:0.6s;
}
.stack-card-3{
  width:188px; top:8%; left:66%;
  transform:rotateX(32deg) rotateY(-30deg) rotateZ(6deg) translateZ(130px);
  z-index:3; animation-delay:1.2s;
}
@keyframes stackFloat{0%,100%{margin-top:0px;} 50%{margin-top:-10px;}}
.stack-head{display:flex; align-items:center; gap:7px; font-size:0.72rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:14px; font-weight:600;}
.stack-dot{width:7px; height:7px; border-radius:50%; background:#3ddc84; display:inline-block; box-shadow:0 0 8px rgba(61,220,132,0.7);}
.stack-line{display:flex; justify-content:space-between; align-items:baseline; font-size:0.84rem; margin-bottom:5px;}
.stack-line span{color:var(--text-dim);}
.stack-line strong{color:var(--ink); font-weight:600;}
.stack-bar{height:4px; background:var(--surface-2); border-radius:3px; overflow:hidden; margin-bottom:14px;}
.stack-bar:last-child{margin-bottom:0;}
.stack-bar i{display:block; height:100%; background:var(--gold); border-radius:3px;}
.flow-row{display:flex; align-items:center; gap:6px; font-size:0.78rem; flex-wrap:wrap;}
.node{background:var(--surface-2); border:1px solid var(--border); padding:5px 10px; border-radius:6px; color:var(--text-dim); font-weight:500;}
.node-done{color:var(--gold-light); border-color:var(--gold); background:rgba(201,163,90,0.14);}
.arrow{color:var(--text-faint);}
.stack-metric{font-family:'Source Serif 4',serif; font-size:2.6rem; color:var(--ink); line-height:1;}
.stack-metric span{font-family:'Inter',sans-serif; font-size:0.9rem; color:var(--text-faint); font-weight:500; margin-left:6px;}

/* sections */
.section{max-width:1180px; margin:0 auto; padding:clamp(64px,11vw,160px) 24px; position:relative; z-index:1;}
.section-alt{border-top:1px solid var(--border); border-bottom:1px solid var(--border); max-width:none; padding-left:0; padding-right:0;}
.section-alt > *{max-width:1180px; margin-left:auto; margin-right:auto; padding-left:24px; padding-right:24px;}
.section-head{max-width:640px; margin-bottom:clamp(40px,6vw,72px);}
.section-sub{margin-top:12px; font-size:1.05rem;}

/* about — asymmetric split, text-led not card-led */
.about-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:72px; align-items:start;}
.about-body p{margin-bottom:18px; font-size:1.08rem; line-height:1.65;}
.about-body p:last-child{margin-bottom:0;}

/* services — full-width editorial rows, not identical cards */
.service-rows{display:flex; flex-direction:column;}
.service-row{
  display:grid; grid-template-columns:72px 1fr 1.3fr; gap:32px; align-items:start;
  padding:clamp(40px,5vw,64px) 0; border-top:1px solid var(--border);
}
.service-rows .service-row:last-child{border-bottom:1px solid var(--border);}
.service-row-num{font-family:'Source Serif 4',serif; font-size:1.4rem; color:var(--gold);}
.service-row-title{font-size:clamp(1.5rem,2.6vw,2rem); align-self:start;}
.service-row-rev{grid-template-columns:72px 1.3fr 1fr;}
.service-row-rev .service-row-title{order:3;}
.service-row-body p{font-size:1.02rem; margin-bottom:18px; max-width:46ch;}
.plain-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px;}
.plain-list li{font-size:0.92rem; color:var(--text-dim); padding-left:18px; position:relative;}
.plain-list li::before{content:"—"; position:absolute; left:0; color:var(--gold);}

/* capabilities — bento cards, each with a distinct small schematic visual */
.bento-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border);}
.bento-card{background:var(--surface); padding:32px; display:flex; flex-direction:column; transition:background .25s var(--ease);}
.bento-card:hover{background:var(--surface-2);}
.bento-card h3{margin-bottom:8px; font-size:1.08rem;}
.bento-card p{font-size:0.92rem;}
.bento-visual{
  height:120px; border-radius:8px; background:var(--surface-2); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px; padding:16px; overflow:hidden;
}
.mini-flow{display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:center;}
.mini-node{background:var(--surface); border:1px solid var(--border-strong); border-radius:6px; padding:6px 10px; font-size:0.74rem; color:var(--text-dim); font-weight:500;}
.mini-node-done{color:var(--gold-light); border-color:var(--gold); background:rgba(201,163,90,0.14);}
.mini-connector{width:16px; height:1px; background:var(--border-strong);}
.mini-task{display:flex; align-items:center; gap:8px; font-size:0.78rem; color:var(--text-dim); width:100%; margin-bottom:8px;}
.mini-task:last-child{margin-bottom:0;}
.mini-check{width:14px; height:14px; border-radius:50%; background:var(--gold); flex:none; position:relative;}
.mini-check::after{content:"";position:absolute; left:4px; top:3px; width:4px; height:7px; border:solid #0a0a0c; border-width:0 1.5px 1.5px 0; transform:rotate(45deg);}
.mini-task-pending .mini-check{background:var(--surface); border:1.5px solid var(--border-strong);}
.mini-task-pending .mini-check::after{display:none;}
.mini-chart{display:flex; align-items:flex-end; gap:8px; height:100%;}
.mini-chart i{display:block; width:14px; height:var(--h); background:var(--text-dim); border-radius:2px 2px 0 0; opacity:0.85;}
.mini-chart i:nth-child(4){background:var(--gold); opacity:1;}

/* approach */
.approach-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column;}
.approach-list li{display:flex; gap:32px; padding:clamp(24px,3.4vw,36px) 0; border-top:1px solid var(--border); align-items:flex-start; transition:padding-left .3s var(--ease);}
.approach-list li:last-child{border-bottom:1px solid var(--border);}
.approach-list li:hover{padding-left:10px;}
.approach-num{font-family:'Source Serif 4',serif; font-size:clamp(1.6rem,2.6vw,2.2rem); color:var(--gold); flex:none; width:56px;}
.approach-list h3{margin-bottom:6px; font-size:1.15rem;}
.approach-list p{font-size:0.98rem; max-width:560px;}

/* industries — flowing editorial list, not a feature grid */
.industry-list{
  list-style:none; margin:0 auto; padding:0 24px; max-width:1180px;
  display:flex; flex-wrap:wrap; column-gap:48px; row-gap:0;
}
.industry-list li{
  font-family:'Source Serif 4',serif; font-weight:500; font-size:clamp(1.4rem,3vw,2.2rem);
  color:var(--ink); padding:14px 0; position:relative; cursor:default;
  transition:color .25s var(--ease);
}
.industry-list li::after{
  content:""; position:absolute; left:0; bottom:9px; width:100%; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.industry-list li:hover{color:var(--gold-light);}
.industry-list li:hover::after{transform:scaleX(1);}

/* faq */
.faq-list{max-width:760px;}
.faq-item{border-top:1px solid var(--border);}
.faq-item:last-child{border-bottom:1px solid var(--border);}
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:20px;
  background:none; border:0; padding:22px 0; cursor:pointer; text-align:left;
  font-family:'Inter',sans-serif; font-size:1rem; font-weight:600; color:var(--ink);
}
.faq-icon{position:relative; width:18px; height:18px; flex:none;}
.faq-icon::before, .faq-icon::after{content:""; position:absolute; background:var(--gold); border-radius:1px;}
.faq-icon::before{top:50%; left:0; width:18px; height:2px; transform:translateY(-50%);}
.faq-icon::after{left:50%; top:0; width:2px; height:18px; transform:translateX(-50%); transition:transform .25s var(--ease);}
.faq-q[aria-expanded="true"] .faq-icon::after{transform:translateX(-50%) rotate(90deg); opacity:0;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s var(--ease);}
.faq-a p{padding-bottom:22px; max-width:60ch; font-size:0.96rem;}

/* contact */
.section-contact{padding-bottom:84px;}
.contact-wrap{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:0;
  border:1px solid var(--border); border-radius:6px; overflow:hidden;
}
.contact-copy{background:var(--bg-void); color:var(--text); padding:48px; display:flex; flex-direction:column; justify-content:center;}
.contact-copy .eyebrow{color:var(--gold-light);}
.contact-copy h2{color:var(--ink);}
.contact-copy .section-sub{color:rgba(255,255,255,0.6);}
.contact-details{margin:30px 0 0; padding:0; display:flex; flex-direction:column; gap:16px;}
.contact-details div{display:flex; flex-direction:column; gap:3px;}
.contact-details dt{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:rgba(255,255,255,0.4);}
.contact-details dd{margin:0; font-size:0.95rem; color:var(--ink);}
.contact-details a{color:var(--gold-light); font-weight:600;}

.contact-form{background:var(--surface); padding:48px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.field{display:flex; flex-direction:column; gap:7px; margin-bottom:16px;}
.field label{font-size:0.82rem; color:var(--text-dim); font-weight:500;}
.optional{color:var(--text-faint); font-weight:400;}
.field input, .field textarea{
  background:var(--surface-2); border:1px solid var(--border-strong); border-radius:3px; padding:11px 13px;
  color:var(--text); font-family:inherit; font-size:0.95rem; resize:vertical; outline:none;
  transition:border-color .2s;
}
.field input:focus, .field textarea:focus{border-color:var(--gold);}
.hp-field{position:absolute; left:-9999px; width:1px; height:1px; opacity:0;}
.form-status{min-height:20px; font-size:0.86rem; margin:12px 0 0; text-align:center;}
.form-status.ok{color:#4caf7d;}
.form-status.err{color:#e0735a;}

/* footer */
.footer{background:var(--bg-void); color:rgba(255,255,255,0.55);}
.footer-top{
  max-width:1180px; margin:0 auto; padding:72px 24px 48px;
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px;
}
.footer-brand{display:flex; gap:14px; max-width:280px;}
.footer-brand strong{color:#fff; font-size:0.98rem; display:block;}
.footer-brand p{font-size:0.85rem; color:rgba(255,255,255,0.5); margin-top:6px; line-height:1.6;}
.footer-col{display:flex; flex-direction:column; gap:12px;}
.footer-col h4{color:rgba(255,255,255,0.4); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; font-weight:600; margin:0 0 2px;}
.footer-col a{font-size:0.9rem; color:rgba(255,255,255,0.75); transition:color .2s var(--ease);}
.footer-col a:hover{color:var(--gold-light);}
.footer-address{font-size:0.9rem; color:rgba(255,255,255,0.6); line-height:1.5;}
.footer-inner{
  max-width:1180px; margin:0 auto; padding:24px 24px calc(24px + env(safe-area-inset-bottom,0px));
  border-top:1px solid rgba(255,255,255,0.1);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:0.8rem;
}

/* reveal animation — subtle */
.reveal{opacity:0; transform:translateY(12px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

/* responsive */
@media (max-width:980px){
  .hero{padding-top:40px;}
  .hero-grid{grid-template-columns:1fr; gap:8px;}
  .hero-stack{height:300px; margin-top:12px;}
  .stack-card-1{width:78%; left:0; top:0;}
  .stack-card-2{width:62%; left:20%; top:48%;}
  .stack-card-3{width:44%; left:58%; top:6%;}
  .hero-glow{width:480px; height:480px;}
  .about-grid{grid-template-columns:1fr; gap:28px;}
  .service-row, .service-row-rev{grid-template-columns:44px 1fr;}
  .service-row-title, .service-row-rev .service-row-title{order:0; grid-column:2;}
  .service-row-num{grid-row:1; grid-column:1;}
  .service-row-body{grid-column:2;}
  .bento-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr; gap:32px;}
  .footer-brand{grid-column:1 / -1; max-width:none;}
  .contact-wrap{grid-template-columns:1fr;}
  .nav-links{display:none;}
  .nav-cta{display:none;}
  .nav-toggle{display:flex;}
  .nav-mobile.open{display:flex;}
}
@media (max-width:620px){
  .hero-stack{height:240px;}
  .stack-card{padding:14px 16px; border-radius:8px;}
  .stack-head{font-size:0.62rem; margin-bottom:9px;}
  .stack-line{font-size:0.72rem;}
  .stack-metric{font-size:1.9rem;}
  .node{font-size:0.68rem; padding:4px 7px;}
  .industry-list{column-gap:28px;}
  .industry-list li{font-size:1.5rem; width:100%;}
  .form-row{grid-template-columns:1fr;}
  .approach-list li{gap:18px;}
  .contact-copy, .contact-form{padding:32px 24px;}
  .footer-top{grid-template-columns:1fr; padding-top:48px;}
  .footer-inner{flex-direction:column; align-items:flex-start;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .reveal{transition:none; opacity:1; transform:none;}
  .hero-glow, .stack-card{animation:none;}
}