:root{--ink:#141414;--ink2:#1c1c1c;--ink3:#242424;--orange:#FF6B35;--orange-dk:#d9531f;--cream:#F7F5F2;--slate:#6B6660;--white:#fff;--line:rgba(20,20,20,.10);--glass:rgba(255,255,255,.06);--glassb:rgba(255,255,255,.12)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Sora',system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;position:relative;z-index:2}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.mono{font-family:'IBM Plex Mono',monospace;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:12px}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14.5px;padding:13px 26px;border-radius:10px;transition:.2s;cursor:pointer;border:1.5px solid transparent;position:relative}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 8px 22px rgba(255,107,53,.28)}
.btn-primary:hover{background:var(--orange-dk);transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,107,53,.4)}
.btn-ghost{border-color:currentColor;background:transparent}
.btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-dark{border-color:var(--ink);color:var(--ink)}.btn-dark:hover{background:var(--ink);color:#fff}
#progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--orange),#ffab7d);width:0;z-index:200}
/* header */
header{position:sticky;top:0;z-index:80;background:rgba(20,20,20,.72);backdrop-filter:blur(16px) saturate(140%);border-bottom:1px solid rgba(255,255,255,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.nav-links{display:flex;gap:26px;align-items:center}
.nav-links a{font-size:14.5px;color:#cfccc6;transition:.15s;position:relative}
.nav-links a:not(.btn):after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:var(--orange);transition:width .22s}
.nav-links a:hover:after,.nav-links a.active:after{width:100%}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav .btn-primary{padding:10px 20px;color:#fff}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.burger span{width:24px;height:2px;background:#fff;transition:.2s;display:block}
.mobile{display:none;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:80px;z-index:79}
.mobile a{display:block;color:#cfccc6;padding:14px 28px;border-top:1px solid rgba(255,255,255,.05);font-size:15px}
.mobile a:hover{color:#fff;background:rgba(255,255,255,.03)}
@media(max-width:920px){.nav-links a:not(.btn){display:none}.nav .btn-primary{display:none}.burger{display:flex}}
/* reveal */
@media (prefers-reduced-motion:no-preference){
 .reveal{opacity:0;transform:translateY(30px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1)}
 .reveal.in{opacity:1;transform:none}
 .d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}
 @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}
 @keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(18px)}}
 @keyframes spin{to{transform:rotate(360deg)}}
 @keyframes drift{0%,100%{transform:translate(0,0)}33%{transform:translate(30px,-20px)}66%{transform:translate(-20px,20px)}}
}
/* hero */
.hero{background:radial-gradient(1200px 600px at 80% -10%,#20140f 0%,var(--ink) 55%);color:#fff;position:relative;overflow:hidden;min-height:88vh;display:flex;align-items:center}
#net{position:absolute;inset:0;z-index:0;opacity:.9}
.hero .wrap{padding:70px 28px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
@media(max-width:920px){.hero-grid{grid-template-columns:1fr;gap:34px}.hero{min-height:auto}}
.hero .mono{color:var(--orange);display:block;margin-bottom:20px}
.hero h1{font-size:clamp(38px,5.6vw,66px);font-weight:600;line-height:1.04;letter-spacing:-.022em;max-width:17ch}
.hero h1 .sig{background:linear-gradient(120deg,var(--orange),#ffb488);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p{font-size:clamp(16.5px,2vw,19px);font-weight:300;color:#cbc7c0;max-width:52ch;margin:24px 0 34px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}.hero .btn-ghost{color:#fff}
.hero-card{border-radius:20px;overflow:hidden;position:relative;border:1px solid var(--glassb);background:var(--glass);backdrop-filter:blur(6px);box-shadow:0 30px 80px rgba(0,0,0,.45);will-change:transform}
.hero-card img{width:100%;height:100%;min-height:420px;object-fit:cover}
.hero-card .badge{position:absolute;left:18px;bottom:18px;background:rgba(20,20,20,.7);backdrop-filter:blur(8px);border:1px solid var(--glassb);border-radius:12px;padding:10px 14px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.hstat{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.12);margin-top:64px}
@media(max-width:700px){.hstat{grid-template-columns:repeat(2,1fr);gap:24px 0}}
.hstat>div{padding:26px 20px 0}.hstat .n{font-size:34px;font-weight:600;letter-spacing:-.02em}.hstat .l{color:#9a958d;font-size:13.5px;font-weight:300;margin-top:4px}
.hstat .n span{color:var(--orange)}
/* page hero (inner) */
.phero{background:radial-gradient(900px 500px at 85% -20%,#20140f,var(--ink) 60%);color:#fff;position:relative;overflow:hidden;padding:96px 0 80px}
.phero .mono{color:var(--orange);display:block;margin-bottom:18px}
.phero h1{font-size:clamp(34px,5vw,58px);font-weight:600;line-height:1.05;letter-spacing:-.02em;max-width:18ch}
.phero h1 .sig{color:var(--orange)}
.phero p{font-size:18px;font-weight:300;color:#cbc7c0;max-width:60ch;margin-top:20px}
.orb{position:absolute;border-radius:50%;z-index:0;pointer-events:none;filter:blur(30px)}
.orb.a{width:340px;height:340px;background:radial-gradient(circle,rgba(255,107,53,.28),transparent 70%);right:-40px;top:-60px;animation:drift 16s ease-in-out infinite}
.orb.b{width:260px;height:260px;background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%);left:-60px;bottom:-80px;animation:float2 12s ease-in-out infinite}
/* sections */
section{padding:92px 0;position:relative}
.dark{background:var(--ink);color:#fff;overflow:hidden}
.eyebrow{color:var(--orange);display:block;margin-bottom:16px}
.sec-title{font-size:clamp(28px,4vw,44px);font-weight:600;letter-spacing:-.018em;line-height:1.08;max-width:22ch}
.dark .sec-title{color:#fff}
.sec-intro{font-size:18px;font-weight:300;color:var(--slate);margin-top:16px;max-width:64ch}
.dark .sec-intro{color:#c9c5be}
.center{text-align:center}.center .sec-title,.center .sec-intro{margin-left:auto;margin-right:auto}
/* pillars */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:52px}
@media(max-width:820px){.pillars{grid-template-columns:1fr}}
.pillar{background:var(--ink);color:#fff;border-radius:22px;padding:42px 38px;position:relative;overflow:hidden;transition:.25s}
.pillar:hover{transform:translateY(-5px)}
.pillar:after{content:"";position:absolute;right:-40px;bottom:-40px;width:150px;height:150px;border-radius:50%;border:22px solid rgba(255,107,53,.14);transition:.5s}
.pillar:hover:after{transform:scale(1.18)}
.pillar .tag{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.pillar h3{font-size:26px;font-weight:600;margin:14px 0 12px;letter-spacing:-.01em}
.pillar p{color:#c9c5be;font-weight:300;font-size:16px;margin-bottom:22px}
.pillar a{font-weight:600;color:var(--orange);font-size:14.5px;position:relative;z-index:2}.pillar a:hover{color:#fff}
/* tilt cards */
.tilt{transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease;transform-style:preserve-3d;will-change:transform}
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:52px;perspective:1000px}
@media(max-width:900px){.vgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.vgrid{grid-template-columns:1fr}}
.vcard{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:30px 26px}
.vcard:hover{box-shadow:0 26px 50px rgba(20,20,20,.14);border-color:rgba(255,107,53,.5)}
.vcard .num{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:15px;color:#fff;background:linear-gradient(135deg,var(--orange),#ff8a5c);width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(255,107,53,.32)}
.vcard h4{font-size:18px;font-weight:600;margin:18px 0 10px}
.vcard p{font-size:14.5px;font-weight:300;color:var(--slate)}
/* products grid */
.bgmark{position:absolute;right:-140px;top:40px;width:560px;height:560px;opacity:.05;z-index:0;animation:spin 70s linear infinite}
.prod{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:52px;perspective:1200px}
@media(max-width:820px){.prod{grid-template-columns:1fr}}
.pcard{background:rgba(255,255,255,.04);border:1px solid var(--glassb);border-radius:18px;padding:34px 32px;backdrop-filter:blur(6px)}
.pcard:hover{border-color:var(--orange);box-shadow:0 26px 60px rgba(0,0,0,.5)}
.pcard .ico{width:54px;height:54px;border-radius:14px;background:rgba(255,107,53,.14);display:flex;align-items:center;justify-content:center;margin-bottom:20px;transition:.22s}
.pcard:hover .ico{background:var(--orange);transform:translateZ(20px)}
.pcard .ico svg{width:27px;height:27px;stroke:var(--orange);fill:none;stroke-width:1.8;transition:.22s}
.pcard:hover .ico svg{stroke:#fff}
.pcard h4{font-size:21px;font-weight:600;margin-bottom:6px}
.pcard .st{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);margin-bottom:12px;display:block}
.pcard p{color:#c1bdb6;font-weight:300;font-size:15px}
/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;margin-top:36px}
.split.rev .tx{order:2}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:28px}.split.rev .tx{order:0}}
.tx .num{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;color:var(--orange)}
.tx h3{font-size:clamp(25px,3.4vw,34px);font-weight:600;letter-spacing:-.015em;margin:10px 0 14px;max-width:16ch}
.tx p{font-size:16.5px;font-weight:300;color:var(--slate);max-width:48ch}
.dark .tx p{color:#c9c5be}
.tx ul{list-style:none;margin:20px 0 0}
.tx li{font-size:15.5px;font-weight:300;color:var(--slate);padding:8px 0 8px 26px;position:relative}
.dark .tx li{color:#c9c5be}
.tx li:before{content:"";position:absolute;left:0;top:16px;width:9px;height:9px;border-radius:50%;background:var(--orange)}
.imwrap{border-radius:20px;overflow:hidden;position:relative;border:1px solid var(--line);box-shadow:0 30px 70px rgba(20,20,20,.12);min-height:340px}
.imwrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.imwrap.dk{border-color:var(--glassb);background:#141414}
.imwrap .ph{position:absolute;inset:0;background:linear-gradient(140deg,#242424,#0e0e0e);display:flex;align-items:center;justify-content:center}
.imwrap .ph svg{width:60%;height:60%;opacity:.5}
/* services grid */
.svc{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--white);margin-top:52px}
@media(max-width:820px){.svc{grid-template-columns:1fr}}
.svc>div{padding:34px 32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:.2s}
.svc>div:hover{background:#faf8f5}
.svc>div:nth-child(2n){border-right:none}
.svc .num{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;color:var(--orange)}
.svc h4{font-size:19px;font-weight:600;margin:8px 0 8px}
.svc p{font-size:15px;font-weight:300;color:var(--slate)}
/* serve */
.serve{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px}
@media(max-width:900px){.serve{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.serve{grid-template-columns:1fr}}
.scard{border-top:3px solid var(--orange);padding-top:18px;transition:.2s}
.scard:hover{border-top-width:7px}
.scard h4{font-size:17px;font-weight:600;margin-bottom:8px}
.scard p{font-size:14px;font-weight:300;color:var(--slate)}
.dark .scard p{color:#c9c5be}
/* process */
.proc{margin-top:52px}
.pstep{display:grid;grid-template-columns:130px 1fr;gap:30px;padding:28px 0;border-top:1px solid var(--line);align-items:start}
.dark .pstep{border-top-color:rgba(255,255,255,.12)}
@media(max-width:640px){.pstep{grid-template-columns:1fr;gap:8px}}
.pstep .k{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:15px;color:var(--orange)}
.pstep h4{font-size:20px;font-weight:600;margin-bottom:8px}
.pstep p{font-size:15.5px;font-weight:300;color:var(--slate);max-width:60ch}
.dark .pstep p{color:#c9c5be}
/* cta */
.ctaband{background:linear-gradient(135deg,#1c1c1c,#0e0e0e);color:#fff;border-radius:24px;padding:74px 48px;text-align:center;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.06)}
.ctaband:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,107,53,.26),transparent 70%);left:50%;top:-200px;transform:translateX(-50%);animation:float 9s ease-in-out infinite}
.ctaband h2{font-size:clamp(28px,4.4vw,46px);font-weight:600;letter-spacing:-.015em;max-width:22ch;margin:0 auto;position:relative}
.ctaband p{color:#c9c5be;font-weight:300;font-size:18px;margin:16px auto 30px;max-width:52ch;position:relative}
.ctaband .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative}
.ctaband .btn-ghost{border-color:#fff;color:#fff}.ctaband .btn-ghost:hover{background:#fff;color:var(--ink)}
/* insights */
.ins{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
@media(max-width:820px){.ins{grid-template-columns:1fr}}
.icard{background:var(--white);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.22s;display:block}
.icard:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(20,20,20,.1)}
.icard .top{height:156px;background:linear-gradient(140deg,#242424,#0e0e0e);position:relative;overflow:hidden}
.icard .top:after{content:"";position:absolute;right:-30px;bottom:-30px;width:120px;height:120px;border-radius:50%;border:16px solid rgba(255,107,53,.2)}
.icard .top .lbl{position:absolute;left:22px;top:20px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.icard .body{padding:24px 24px 28px}
.icard .cat{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}
.icard h4{font-size:18px;font-weight:600;margin:10px 0 8px}
.icard p{font-size:14px;font-weight:300;color:var(--slate)}
/* marquee */
.partners{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.marquee{overflow:hidden;margin-top:36px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mtrack{display:flex;gap:16px;width:max-content;animation:scrollx 28s linear infinite}
@keyframes scrollx{to{transform:translateX(calc(-50% - 8px))}}
.marquee:hover .mtrack{animation-play-state:paused}
.pchip{border:1px solid var(--line);border-radius:12px;padding:16px 26px;font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.06em;color:var(--slate);background:var(--white);white-space:nowrap}
/* contact form */
.cgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;margin-top:8px}
@media(max-width:820px){.cgrid{grid-template-columns:1fr;gap:36px}}
form{display:flex;flex-direction:column;gap:16px}
label{font-size:13px;font-weight:500;margin-bottom:-8px}
input,textarea{font-family:inherit;font-size:15px;padding:14px 16px;border:1px solid var(--line);border-radius:11px;background:var(--white);color:var(--ink);width:100%;transition:.18s}
input:focus,textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,107,53,.14)}
textarea{min-height:140px;resize:vertical}
.note{font-size:12.5px;color:var(--slate);font-weight:300}
.det .row{padding:18px 0;border-bottom:1px solid var(--line)}.det .row:first-child{padding-top:0}
.det a{color:var(--orange);font-weight:500}
.det .k{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin-bottom:6px}
/* footer */
footer{background:var(--ink);color:#fff;padding:66px 0 40px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px}
@media(max-width:820px){.foot{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot{grid-template-columns:1fr}}
.foot h5{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8a857e;margin-bottom:14px}
.foot a{display:block;color:#cbc7c0;font-size:14px;padding:5px 0}.foot a:hover{color:#fff}
.foot .tag{color:#8a857e;font-weight:300;margin-top:12px;font-size:14.5px;max-width:34ch}
.foot .mail{color:var(--orange);font-weight:500}
.foot-bot{border-top:1px solid rgba(255,255,255,.12);margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;color:#6f6a63;font-size:12.5px;font-weight:300}