:root{
  --void:#FBF8F2;
  --void-2:#EFE6D3;
  --void-3:#E3D6B8;
  --paper:#1A1620;
  --paper-dim:#453F35;
  --brass:#7A560B;
  --brass-light:#5C4008;
  --wine:#8C2F3D;
  --wine-light:#C25C6B;
  --sage:#4C6540;
  --line:rgba(26,22,32,0.14);
  --line-strong:rgba(26,22,32,0.28);
  --ease:cubic-bezier(.16,.84,.32,1);
  --maxw:1180px;
}
header, .marquee-strip, .diff, .contact, footer{
  --void:#211F2E;
  --void-2:#2A2739;
  --void-3:#332F45;
  --paper:#F6F2E9;
  --paper-dim:#C9C2B4;
  --brass:#C9972E;
  --brass-light:#E4C468;
  --sage:#8FA681;
  --line:rgba(246,242,233,0.12);
  --line-strong:rgba(246,242,233,0.22);
  background:var(--void);
  color:var(--paper);
}
.phone-stage{
  --void:#211F2E;
  --void-2:#2A2739;
  --void-3:#332F45;
  --paper:#F6F2E9;
  --paper-dim:#C9C2B4;
  --brass:#C9972E;
  --brass-light:#E4C468;
  --sage:#8FA681;
  --line:rgba(246,242,233,0.12);
  --line-strong:rgba(246,242,233,0.22);
  color:var(--paper);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--void);
  color:var(--paper);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
body::before{
  content:"";
  position:fixed; inset:0; z-index:9997; pointer-events:none;
  opacity:.045; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
h1,h2,h3{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; margin:0; line-height:1.05; letter-spacing:-0.01em; color:var(--paper); }
.mono{font-family:'IBM Plex Mono',monospace;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
a{color:inherit;}
img{max-width:100%; display:block;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--brass-light); display:flex; align-items:center; gap:8px; margin-bottom:14px;
}
.eyebrow::before{content:"&"; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:15px; display:inline-block; animation:spin-slow 10s linear infinite;}
@keyframes spin-slow{ to{ transform:rotate(360deg); } }

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
  .reveal.in{opacity:1; transform:translateY(0);}
  .reveal-stagger.in > *{opacity:1; transform:translateY(0);}
  .reveal-stagger > *{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
  .reveal-stagger.in > *:nth-child(1){transition-delay:.05s;}
  .reveal-stagger.in > *:nth-child(2){transition-delay:.15s;}
  .reveal-stagger.in > *:nth-child(3){transition-delay:.25s;}
  .reveal-stagger.in > *:nth-child(4){transition-delay:.35s;}
  .word{display:inline-block; overflow:hidden;}
  .word span{display:inline-block; transform:translateY(115%); animation:word-in .85s var(--ease) forwards;}
  .draw path, .draw circle{stroke-dasharray:400; stroke-dashoffset:400; transition:stroke-dashoffset 1.4s var(--ease);}
  .draw.in path, .draw.in circle{stroke-dashoffset:0;}
  .img-reveal{clip-path:inset(0 0 100% 0); transform:scale(1.15); transition:clip-path 1.1s var(--ease), transform 1.3s var(--ease);}
  .img-reveal.in{clip-path:inset(0 0 0% 0); transform:scale(1);}
  .tile-scroll{transition:transform .15s linear;}
}
@keyframes word-in{ to{ transform:translateY(0); } }

.progress-bar{position:fixed; top:0; left:0; height:2.5px; background:var(--brass); z-index:9999; width:0%; transition:width .1s linear;}

.cursor{
  position:fixed; top:0; left:0; width:24px; height:24px; border-radius:50%;
  border:1.5px solid var(--brass-light); pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%); transition:width .25s var(--ease), height .25s var(--ease), background .25s var(--ease);
  mix-blend-mode:difference;
}
.cursor.big{width:52px; height:52px; background:var(--brass); border-color:var(--brass);}
@media (hover:none), (pointer:coarse){ .cursor{display:none;} }

header{
  position:sticky; top:0; z-index:50;
  background:rgba(33,31,46,0.9); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s var(--ease);
}
header.scrolled{box-shadow:0 10px 30px -18px rgba(0,0,0,.6);}
nav.wrap{display:flex; align-items:center; justify-content:space-between; height:78px;}
.logo{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:19px; display:flex; align-items:center; gap:6px; text-decoration:none;}
.logo span{color:var(--brass);}
.navlinks{display:flex; gap:32px; list-style:none; margin:0; padding:0;}
.navlinks a{text-decoration:none; font-size:14.5px; font-weight:500; color:var(--paper); position:relative; padding-bottom:4px;}
.navlinks a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--brass); transition:width .3s var(--ease);}
.navlinks a:hover::after, .navlinks a.active::after{width:100%;}
.cta-btn{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--brass); color:var(--void); padding:11px 22px; border-radius:999px; text-decoration:none;
  font-size:14px; font-weight:600; white-space:nowrap; border:none; cursor:pointer; font-family:'Inter',sans-serif;
  display:inline-block; transition:transform .2s var(--ease);
}
.cta-btn::before{content:""; position:absolute; inset:0; z-index:-1; background:var(--wine); transform:translateY(101%); transition:transform .35s var(--ease);}
.cta-btn:hover::before{transform:translateY(0);}
.cta-btn:hover{transform:translateY(-1px); color:var(--paper);}
.cta-btn.ghost{background:transparent; color:var(--paper); border:1.5px solid var(--line-strong);}
.cta-btn.ghost::before{background:var(--paper); }
.cta-btn.ghost:hover{color:var(--void);}
.burger{display:none; background:none; border:none; cursor:pointer; padding:8px; z-index:60;}
.burger span{display:block; width:22px; height:2px; background:var(--paper); margin:5px 0; transition:transform .3s ease, opacity .3s ease;}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.hero-pin{padding:90px 0 40px; position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:40px; background:var(--void); color:var(--paper);}
.hero-bg-grid{position:absolute; inset:0; z-index:0; opacity:.5;
  background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px; mask-image:radial-gradient(ellipse 80% 60% at 60% 20%, black 10%, transparent 75%);
}
.hero-amp{
  position:absolute; font-family:'Bricolage Grotesque',sans-serif; font-weight:800;
  font-size:min(50vw, 600px); line-height:1; color:transparent; -webkit-text-stroke:1.5px var(--line-strong);
  right:-9%; top:-16%; z-index:0; user-select:none; pointer-events:none; transition:transform .2s linear;
}
.hero-intro{position:relative; z-index:1; text-align:center; max-width:640px; transition:opacity .2s ease-out, transform .2s ease-out;}
.hero-intro h1{font-size:clamp(38px,4.6vw,62px); line-height:1.14; margin-bottom:22px;}
.hero-intro h1 em{font-style:normal; color:var(--brass);}
.hero-intro .lead{font-size:18px; line-height:1.6; color:var(--paper-dim); max-width:480px; margin:0 auto 32px; opacity:0; animation:fade-up .8s var(--ease) .5s forwards;}
@keyframes fade-up{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; justify-content:center; opacity:0; animation:fade-up .8s var(--ease) .65s forwards;}
.scroll-hint{position:absolute; left:50%; bottom:18px; transform:translateX(-50%); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--paper-dim); opacity:.65; animation:hint-bob 2s ease-in-out infinite; z-index:2;}
@keyframes hint-bob{ 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(6px);} }

.zoom-hero .hero{height:250vh;}
.zoom-hero .hero-pin{position:sticky; top:78px; height:calc(100vh - 78px); height:calc(100dvh - 78px); padding:56px 0 0; z-index:1;}
.hero-reveal{position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:center; pointer-events:none; padding:0 24px;}
.hero-reveal-text{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(38px,9vw,128px); text-align:center; line-height:1.05; color:var(--paper); letter-spacing:-.02em; max-width:92%; opacity:0; transform:scale(.85); will-change:transform, opacity;}
.hero-reveal-text span{color:var(--brass);}
.phone-stage{position:relative; z-index:1; height:520px; display:flex; align-items:center; justify-content:center; perspective:1300px;}
@keyframes tile-pop{ 0%{opacity:0; transform:translateY(60px) scale(.7) rotate(var(--r));} 60%{opacity:1;} 100%{opacity:1; transform:translateY(0) scale(1) rotate(var(--r));} }

.phone-glow{position:absolute; width:380px; height:380px; border-radius:50%; background:radial-gradient(circle, rgba(201,151,46,0.32), rgba(140,47,61,0.16) 45%, transparent 72%); filter:blur(54px); z-index:0; pointer-events:none; animation:glow-pulse 7s var(--ease) infinite; transition:opacity .2s ease-out;}
@keyframes glow-pulse{ 0%,100%{opacity:.55; transform:scale(1);} 50%{opacity:1; transform:scale(1.1);} }

.phone-zoom{transform-origin:center center; will-change:transform; transition:transform .2s ease-out, opacity .2s ease-out;}
.phone-float{position:relative; z-index:1; animation:phone-float 6.5s var(--ease) infinite;}
@keyframes phone-float{ 0%,100%{transform:translateY(0) rotate(-1deg);} 50%{transform:translateY(-16px) rotate(1deg);} }

.phone{width:228px; height:466px; padding:12px; border-radius:46px; position:relative;
  background:linear-gradient(160deg, var(--void-2), var(--void-3));
  border:1px solid var(--line-strong);
  box-shadow:0 50px 90px -34px rgba(0,0,0,.75), 0 0 0 1px rgba(0,0,0,.35) inset, inset 0 1px 0 rgba(255,255,255,.1), inset -1px 0 0 rgba(255,255,255,.04);
  transition:transform .35s var(--ease); will-change:transform;
}
.phone-btn{position:absolute; background:var(--void-2); border:1px solid var(--line-strong);}
.phone-btn.mute{left:-3px; top:112px; width:3px; height:24px; border-radius:3px 0 0 3px;}
.phone-btn.vol{left:-3px; top:150px; width:3px; height:44px; border-radius:3px 0 0 3px;}
.phone-btn.power{right:-3px; top:146px; width:3px; height:62px; border-radius:0 3px 3px 0;}
.phone-island{position:absolute; top:14px; left:50%; transform:translateX(-50%); width:64px; height:20px; background:#040406; border-radius:12px; z-index:6; box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);}
.phone-island::after{content:""; position:absolute; right:6px; top:50%; transform:translateY(-50%); width:5px; height:5px; border-radius:50%; background:#1c2a33; box-shadow:0 0 2px 1px rgba(120,160,190,.25);}

.phone-statusbar{position:absolute; top:15px; left:26px; right:26px; height:18px; z-index:6; display:flex; align-items:center; justify-content:space-between; pointer-events:none;}
.phone-statusbar .sb-time{font-family:'Inter',sans-serif; font-weight:600; font-size:12px; color:var(--paper); letter-spacing:.01em;}
.phone-statusbar .sb-icons{display:flex; align-items:center; gap:4px;}
.phone-statusbar .sb-bars{display:flex; align-items:flex-end; gap:1.5px; height:9px;}
.phone-statusbar .sb-bars span{width:2.5px; background:var(--paper); border-radius:.5px;}
.phone-statusbar .sb-bars span:nth-child(1){height:40%;}
.phone-statusbar .sb-bars span:nth-child(2){height:60%;}
.phone-statusbar .sb-bars span:nth-child(3){height:80%;}
.phone-statusbar .sb-bars span:nth-child(4){height:100%;}
.phone-statusbar .sb-wifi{width:13px; height:9px; fill:none; stroke:var(--paper); stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round;}
.phone-statusbar .sb-batt{width:20px; height:10px; border:1.2px solid var(--paper); border-radius:2.5px; padding:1.5px; opacity:.95;}
.phone-statusbar .sb-batt::after{content:""; position:absolute; right:-3px; top:50%; transform:translateY(-50%); width:1.5px; height:4px; background:var(--paper); border-radius:0 1px 1px 0; opacity:.7;}
.phone-statusbar .sb-batt-fill{width:78%; height:100%; background:var(--paper); border-radius:1px; display:block;}

.phone-screen{position:relative; z-index:1; width:100%; height:100%; border-radius:36px; overflow:hidden; background:linear-gradient(190deg, var(--void) 0%, var(--void-2) 100%);}
.phone-screen::after{content:""; position:absolute; inset:0; z-index:5; pointer-events:none;
  background:linear-gradient(120deg, transparent 32%, rgba(255,255,255,.05) 44%, rgba(255,255,255,.09) 49%, rgba(255,255,255,.03) 54%, transparent 68%);
}
.hand-back, .hand-thumb{position:absolute; left:50%; top:50%; width:405px; height:811px; margin-left:-203px; margin-top:-274px; pointer-events:none; overflow:visible;}
.hand-back{z-index:0;}
.hand-thumb{z-index:7;}
.app-slide{position:absolute; inset:0; padding:44px 15px 16px; display:flex; flex-direction:column; gap:12px; opacity:0; transform:translateY(14px); transition:opacity .7s var(--ease), transform .7s var(--ease); pointer-events:none;}
.app-slide.is-active{opacity:1; transform:translateY(0); pointer-events:auto; z-index:2;}

.app-topbar{display:flex; align-items:center; gap:7px;}
.app-topbar .status-dot{width:6px; height:6px; border-radius:50%; box-shadow:0 0 0 3px rgba(201,151,46,.22); flex-shrink:0;}
.app-brand{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:14.5px;}

.stories-row{display:flex; gap:9px;}
.story-ring{width:34px; height:34px; border-radius:50%; padding:2px; flex-shrink:0; position:relative; background:conic-gradient(from 180deg, var(--brass), var(--brass-light), var(--wine-light), var(--brass));}
.story-ring::after{content:""; position:absolute; inset:2px; border-radius:50%; background:var(--void-2);}
.story-ring.you{background:var(--line-strong);}
.story-ring.you span{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:7.5px; color:var(--paper-dim); z-index:1;}

.mini-card{background:rgba(246,242,233,0.045); border:1px solid var(--line); border-radius:15px; padding:11px; display:flex; flex-direction:column; gap:9px;}
.mini-head{display:flex; align-items:center; gap:8px;}
.mini-avatar{width:24px; height:24px; border-radius:50%; flex-shrink:0;}
.mini-name{display:block; font-size:11.5px; font-weight:600; font-family:'Inter',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mini-time{display:block; font-family:'IBM Plex Mono',monospace; font-size:9px; color:var(--paper-dim); margin-top:2px;}
.mini-media{height:104px; border-radius:9px; background-size:220% 220%; animation:media-pan 9s ease-in-out infinite;}
@keyframes media-pan{ 0%,100%{background-position:0% 0%;} 50%{background-position:100% 100%;} }

.app-ig .mini-avatar{background:linear-gradient(135deg, var(--brass), var(--brass-light));}
.app-ig .mini-media{background-image:linear-gradient(135deg, var(--void-3), var(--brass));}
.app-ig .status-dot{background:var(--brass);}
.mini-actions{display:flex; align-items:center; gap:12px; margin-top:2px;}
.mini-actions .ico{width:18px; height:18px; fill:none; stroke:var(--paper); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; transform-origin:center;}
.mini-actions .ico.heart{animation:heart-pop 3.6s ease-in-out infinite;}
@keyframes heart-pop{
  0%, 14%{transform:scale(1); fill:none; stroke:var(--paper);}
  20%{transform:scale(1.3); fill:var(--wine-light); stroke:var(--wine-light);}
  30%, 100%{transform:scale(1); fill:var(--wine-light); stroke:var(--wine-light);}
}
.mini-likes{font-size:11px; color:var(--paper-dim);}
.mini-likes strong{color:var(--paper); font-weight:700;}

.app-fb .mini-avatar{background:linear-gradient(135deg, var(--wine), var(--wine-light));}
.app-fb .mini-media{background-image:linear-gradient(135deg, var(--void-3), var(--wine));}
.app-fb .status-dot{background:var(--wine-light); box-shadow:0 0 0 3px rgba(194,92,107,.22);}
.skeleton-lines{display:flex; flex-direction:column; gap:6px;}
.skeleton-lines span{height:7px; border-radius:4px; background:var(--line-strong); display:block;}
.skeleton-lines span.short{width:55%;}
.mini-reactions{display:flex; flex-wrap:wrap; font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--paper-dim);}
.mini-reactions span{position:relative; padding:0 10px;}
.mini-reactions span:first-child{padding-left:0;}
.mini-reactions span:not(:first-child)::before{content:"·"; position:absolute; left:0; color:var(--line-strong);}

.app-site .status-dot{background:var(--sage); box-shadow:0 0 0 3px rgba(143,166,129,.22);}
.site-window{border-radius:14px; overflow:hidden; border:1px solid var(--line); background:rgba(246,242,233,0.03); display:flex; flex-direction:column;}
.browser-bar{display:flex; gap:5px; padding:9px 11px; border-bottom:1px solid var(--line); background:rgba(0,0,0,.16);}
.browser-bar span{width:6px; height:6px; border-radius:50%; background:var(--line-strong);}
.browser-bar span:first-child{background:var(--wine-light);}
.site-hero-mini{height:64px; margin:11px; border-radius:8px; background-image:linear-gradient(135deg, var(--void-3), var(--sage)); background-size:220% 220%; animation:media-pan 10s ease-in-out infinite;}
.site-lines{padding:0 11px; display:flex; flex-direction:column; gap:6px;}
.site-lines span{height:6.5px; border-radius:4px; background:var(--line-strong); display:block;}
.site-lines span.short{width:42%;}
.site-btn{margin:13px 11px 14px; align-self:flex-start; background:var(--brass); color:var(--void); font-size:10.5px; font-weight:600; padding:7px 13px; border-radius:999px; font-family:'Inter',sans-serif;}

.orbit-chip{position:absolute; border-radius:999px; box-shadow:0 18px 34px -18px rgba(0,0,0,.6); animation:tile-pop .9s var(--ease) both; z-index:3; transition:opacity .2s ease-out;}
.chip-bob{display:flex; align-items:center; gap:8px; padding:9px 13px; border-radius:999px; background:var(--void-3); border:1px solid var(--line); white-space:nowrap; animation:chip-bob 5s var(--ease) infinite;}
@keyframes chip-bob{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-9px);} }
.chip-num{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--brass-light); font-weight:600;}
.chip-tag{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--brass-light); background:rgba(201,151,46,.15); padding:3px 8px; border-radius:999px;}
.chip-text{font-size:11.5px; color:var(--paper-dim); font-family:'Inter',sans-serif;}
.chip-ring{width:16px; height:16px; border-radius:50%; background:conic-gradient(from 180deg, var(--brass), var(--wine-light), var(--brass)); flex-shrink:0;}
.chip-ico{width:15px; height:15px; fill:none; stroke:var(--brass-light); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0;}

.chip-1{top:0; left:2px; --r:-6deg; animation-delay:.1s;}
.chip-1 .chip-bob{animation-delay:0s;}
.chip-2{top:64px; right:-6px; --r:5deg; animation-delay:.25s;}
.chip-2 .chip-bob{animation-delay:-1.3s;}
.chip-3{bottom:90px; left:-10px; --r:4deg; animation-delay:.4s;}
.chip-3 .chip-bob{animation-delay:-2.6s;}
.chip-4{bottom:0; right:14px; --r:-4deg; animation-delay:.55s;}
.chip-4 .chip-bob{animation-delay:-3.9s;}

.marquee-strip{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--void-2); overflow:hidden; padding:16px 0; position:relative; z-index:1;}
.marquee-track{display:flex; width:max-content; animation:marquee 28s linear infinite;}
.marquee-track span{font-family:'IBM Plex Mono',monospace; font-size:13.5px; color:var(--paper-dim); padding:0 28px; display:flex; align-items:center; gap:28px; white-space:nowrap;}
.marquee-track span::after{content:"✦"; color:var(--brass);}
@keyframes marquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

section{padding:110px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:clamp(28px,3vw,40px);}
.section-head p{font-size:16.5px; color:var(--paper-dim); margin-top:14px; line-height:1.6;}
.hl{position:relative; display:inline-block;}
.hl::after{content:""; position:absolute; left:0; bottom:2px; width:100%; height:8px; background:rgba(201,151,46,0.28); z-index:-1; transform:scaleX(0); transform-origin:left; transition:transform .7s var(--ease) .2s;}
.reveal.in .hl::after{transform:scaleX(1);}

.services{background:var(--void-2);}
.svc-grid{display:grid; grid-template-columns:1.4fr 1fr; gap:24px;}
.svc-card{border-radius:18px; padding:38px; display:flex; flex-direction:column; justify-content:space-between; min-height:340px; transition:transform .25s var(--ease), border-color .3s ease; border:1px solid var(--line); position:relative; overflow:hidden; will-change:transform;}
.svc-card:hover{border-color:var(--brass);}
.svc-card::after, .price-card::after, .value-card::after{content:""; position:absolute; inset:0; z-index:0; opacity:0; pointer-events:none; background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%), rgba(201,151,46,0.16), transparent 70%); transition:opacity .35s ease;}
.svc-card:hover::after, .price-card:hover::after, .value-card:hover::after{opacity:1;}
.svc-card > *, .price-card > *, .value-card > *{position:relative; z-index:1;}
.svc-card.main{background:var(--void-3);}
.svc-card.side{background:transparent;}
.svc-card h3{font-size:25px; margin-bottom:12px;}
.svc-card p{font-size:15px; line-height:1.6; color:var(--paper-dim); margin:0 0 20px;}
.svc-list{list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; gap:10px;}
.svc-list li{font-size:14.5px; display:flex; gap:10px; align-items:baseline;}
.svc-list li::before{content:"—"; color:var(--brass); flex-shrink:0;}
.svc-badge{align-self:flex-start; font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; padding:6px 12px; border-radius:999px; background:rgba(201,151,46,0.15); color:var(--brass-light);}

.diff{background:var(--void); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.diff-grid{display:grid; grid-template-columns:auto 1fr; gap:44px; align-items:center;}
.diff-icon{width:110px; height:110px; flex-shrink:0;}
.diff h2{font-size:clamp(24px,2.6vw,32px); margin-bottom:12px;}
.diff p{font-size:16px; color:var(--paper-dim); line-height:1.65; max-width:560px;}
.diff .tagline{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--brass-light); margin-top:14px; display:block;}

#process{background:var(--void);}
.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--line);}
.step{padding:32px 26px 32px 0; border-right:1px solid var(--line); transition:background .3s ease;}
.step:hover{background:rgba(201,151,46,0.05);}
.step:last-child{border-right:none;}
.step .num{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--brass); margin-bottom:18px; display:block;}
.step h3{font-size:19px; margin-bottom:10px;}
.step p{font-size:14.5px; color:var(--paper-dim); line-height:1.55; margin:0;}

.track{background:var(--void-2);}
.track-grid{display:grid; grid-template-columns:1fr 1.3fr; gap:60px; align-items:center;}
.big-count{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(70px,9vw,128px); color:var(--brass); line-height:1;}
.big-count-label{font-size:15px; color:var(--paper-dim); margin-top:6px; max-width:280px;}
.track-facts{display:flex; flex-direction:column; gap:0;}
.fact{display:flex; gap:18px; padding:20px 0; border-top:1px solid var(--line); align-items:baseline;}
.fact:last-child{border-bottom:1px solid var(--line);}
.fact .fnum{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--brass); flex-shrink:0; width:26px;}
.fact p{margin:0; font-size:15.5px; color:var(--paper);}

.price-slider{max-width:600px; margin:0 auto; position:relative;}
.price-viewport{overflow:hidden; border-radius:18px;}
.price-track{display:flex; transition:transform .55s var(--ease);}
.price-track > .price-card{flex:0 0 100%; box-sizing:border-box; border-radius:0;}
.price-card{border:1px solid var(--line); border-radius:18px; padding:38px 34px; display:flex; flex-direction:column; background:var(--void-2); transition:transform .25s var(--ease), border-color .3s ease; position:relative; overflow:hidden; will-change:transform;}
.price-card:hover{border-color:var(--brass);}
.price-card.alt{background:var(--void-3);}
.price-card .plan{font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--brass-light); margin-bottom:10px;}
.price-card h3{font-size:24px; margin-bottom:10px;}
.price-card .devis{font-family:'IBM Plex Mono',monospace; font-size:13.5px; color:var(--paper-dim); margin:16px 0 22px; line-height:1.6;}
.price-list{list-style:none; padding:0; margin:0 0 28px; display:flex; flex-direction:column; gap:12px; flex-grow:1;}
.price-list li{font-size:14.5px; display:flex; gap:10px; align-items:flex-start; color:var(--paper);}
.price-list li::before{content:"✓"; color:var(--brass); font-weight:700; flex-shrink:0;}

.price-nav{display:flex; align-items:center; justify-content:center; gap:22px; margin-top:28px;}
.price-arrow{width:42px; height:42px; border-radius:50%; background:var(--void-2); border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:background .25s ease, border-color .25s ease, transform .2s ease;}
.price-arrow svg{width:18px; height:18px; fill:none; stroke:var(--paper); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.price-arrow:hover{background:var(--brass); border-color:var(--brass); transform:scale(1.06);}
.price-arrow:hover svg{stroke:var(--void);}
.price-dots{display:flex; align-items:center; gap:9px;}
.price-dot{width:8px; height:8px; border-radius:50%; background:var(--line-strong); border:none; cursor:pointer; padding:0; transition:background .25s ease, transform .25s ease;}
.price-dot.active{background:var(--brass); transform:scale(1.35);}

.faq-list{max-width:760px; display:flex; flex-direction:column; gap:0;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px; background:none; border:none; padding:24px 4px; text-align:left; cursor:pointer; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:18px; color:var(--paper);}
.faq-q span{transition:color .25s ease;}
.faq-item:hover .faq-q span{color:var(--brass);}
.faq-chevron{width:20px; height:20px; flex-shrink:0; fill:none; stroke:var(--brass); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .35s var(--ease);}
.faq-item.open .faq-chevron{transform:rotate(180deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s var(--ease);}
.faq-a p{font-size:15.5px; line-height:1.65; color:var(--paper-dim); margin:0 4px 24px; max-width:600px;}
.faq-item.open .faq-a{max-height:200px;}

.contact{background:var(--void-3); position:relative; overflow:hidden;}
.contact-amp{position:absolute; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:420px; color:transparent; -webkit-text-stroke:1px rgba(246,242,233,0.06); left:-6%; bottom:-22%; line-height:1; pointer-events:none; animation:spin-slow 70s linear infinite;}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; position:relative; z-index:1;}
.contact h2{font-size:clamp(28px,3.4vw,42px); margin-bottom:18px;}
.contact p.lead{font-size:16.5px; color:var(--paper-dim); line-height:1.6; max-width:420px; margin-bottom:28px;}
.contact-info{display:flex; flex-direction:column; gap:14px; font-family:'IBM Plex Mono',monospace; font-size:14px;}
.contact-info a{text-decoration:none; color:var(--paper); border-bottom:1px solid var(--line-strong); width:fit-content; transition:border-color .2s ease, color .2s ease;}
.contact-info a:hover{border-color:var(--brass); color:var(--brass-light);}
form{display:flex; flex-direction:column; gap:14px;}
form input, form textarea, form select{width:100%; padding:14px 16px; border-radius:10px; border:1px solid var(--line-strong); background:rgba(246,242,233,0.05); color:var(--paper); font-family:'Inter',sans-serif; font-size:14.5px;}
form select option{color:var(--void);}
form input::placeholder, form textarea::placeholder{color:var(--paper-dim);}
form input:focus, form textarea:focus, form select:focus{outline:none; border-color:var(--brass); box-shadow:0 0 0 3px rgba(201,151,46,0.2);}
form textarea{resize:vertical; min-height:110px;}
form button{position:relative; overflow:hidden; isolation:isolate; background:var(--brass); color:var(--void); border:none; padding:15px 26px; border-radius:10px; font-weight:600; font-size:15px; cursor:pointer; font-family:'Inter',sans-serif; transition:transform .2s var(--ease);}
form button:hover{transform:translateY(-2px);}
.form-note{font-size:12.5px; color:var(--paper-dim);}

footer{background:var(--void); color:var(--paper-dim); padding:34px 0; border-top:1px solid var(--line);}
.foot-wrap{display:flex; justify-content:space-between; align-items:center; font-size:13px; flex-wrap:wrap; gap:10px;}
.foot-wrap .logo{color:var(--paper); font-size:16px;}
.foot-links{display:flex; gap:20px; list-style:none; padding:0; margin:0;}
.foot-links a{text-decoration:none; font-size:13px; color:var(--paper-dim); transition:color .2s ease;}
.foot-links a:hover{color:var(--brass-light);}

.founder-hero{padding-top:70px;}
.founder-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center;}
.founder-photo{aspect-ratio:4/5; border-radius:18px; background:var(--void-2); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; color:var(--paper-dim); position:relative; overflow:hidden; transform-origin:bottom;}
.founder-photo span{font-family:'IBM Plex Mono',monospace; font-size:12.5px; position:relative; z-index:1;}
.founder-photo img{width:100%; height:100%; object-fit:cover; display:block; position:relative; z-index:0;}
.founder-name{font-size:clamp(32px,4vw,52px); margin-bottom:6px;}
.founder-role{font-family:'IBM Plex Mono',monospace; color:var(--brass-light); font-size:14px; margin-bottom:24px; display:block;}
.founder-bio p{font-size:16.5px; line-height:1.75; color:var(--paper-dim); margin:0 0 18px;}
.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; border-top:1px solid var(--line); padding-top:44px; margin-top:20px;}
.value-card{padding:14px; position:relative; overflow:hidden; border-radius:14px; transition:transform .25s var(--ease); will-change:transform;}
.value-card .num{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--brass); display:block; margin-bottom:12px;}
.value-card h3{font-size:19px; margin-bottom:10px;}
.value-card p{font-size:14.5px; color:var(--paper-dim); line-height:1.6; margin:0;}

@media (max-width:980px){
  .navlinks{display:flex; position:fixed; inset:78px 0 0 0; flex-direction:column; gap:0; background:var(--void); padding:20px 32px; transform:translateX(100%); transition:transform .35s var(--ease); height:calc(100vh - 78px);}
  .navlinks.open{transform:translateX(0);}
  .navlinks li{border-bottom:1px solid var(--line);}
  .navlinks a{display:block; padding:18px 0; font-size:18px;}
  .burger{display:block;}
  .svc-grid{grid-template-columns:1fr;}
  .diff-grid{grid-template-columns:1fr; text-align:left;}
  .process-grid{grid-template-columns:1fr 1fr;}
  .step{border-right:none; border-bottom:1px solid var(--line); padding:26px 0;}
  .track-grid{grid-template-columns:1fr; gap:30px;}
  .contact-grid{grid-template-columns:1fr; gap:44px;}
  .hero-amp{font-size:90vw; top:-8%; right:-20%;}
  .founder-grid{grid-template-columns:1fr;}
  .values-grid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .wrap{padding:0 20px;}
  section{padding:72px 0;}
  .chip-2, .chip-4{display:none;}
}
@media (max-height:1050px){
  .zoom-hero .hero-intro .lead{display:none;}
  .zoom-hero .hero-pin{gap:20px;}
  .zoom-hero .phone-stage{transform:scale(.78); transform-origin:center; height:400px;}
}
@media (max-height:750px){
  .zoom-hero .scroll-hint{display:none;}
  .zoom-hero .hero-intro h1{font-size:30px; margin-bottom:12px;}
  .zoom-hero .hero-intro .eyebrow{margin-bottom:8px;}
  .zoom-hero .hero-pin{gap:12px;}
  .zoom-hero .phone-stage{transform:scale(.58); transform-origin:center; height:310px;}
}
