/* =====================================================================
   ravolution.agency — site.css (v2)
   Shared design system for every page. Area stylesheets (store.css,
   nevermissed.css, insights.css, legal.css) load AFTER this file.
   ---------------------------------------------------------------------
   Token contrast (WCAG AA, computed 2026-09-16):
     --ink        #15120f  11.2:1 cream · 12.7:1 cream-2 · 9.5:1 cream-3
     --dim        #504842   5.4:1 cream ·  6.1:1 cream-2 · 4.6:1 cream-3  (any text)
     --dim-2      #6a625d   3.6:1 cream ·  4.1:1 cream-2 · 3.0:1 cream-3  (ONLY ≥12px bold labels or decoration)
     --red-text   #a80a1f   4.6:1 cream ·  5.3:1 cream-2                  (red text under 24px)
     --red-display #d60e2b  3.2:1 cream ·  3.6:1 cream-2                  (red display text ≥24px bold only)
     --red        #e8102e   fills only; white on it = 4.6:1
     --red-2      #a80a1f   deep fill (hover); white on it = 7.7:1
     --green      #125432   5.4:1 cream ·  6.1:1 cream-2 · 4.6:1 cream-3
   Motion (v2): preloader, cursor follower, scroll progress, smart nav, staggered
   entrances + split headings + count-ups, 3D tilt/glare cards, magnetic buttons,
   ambient background, animated FAQ, view transitions. Fine-pointer gated; all
   respect prefers-reduced-motion. See the MOTION v2 block at the end of this file.
   ===================================================================== */

:root{
  --black:#050608;            /* hero only */
  --cream:#d1c7bd;            /* page */
  --cream-2:#dcd4cb;          /* cards */
  --cream-3:#c3b7aa;          /* footer / deeper panels */
  --field:#e8e2db;            /* form fields */
  --paper:#f4ecdd;            /* light text on dark panels (vault door) */
  --ink:#15120f;              /* type */
  --ink-2:#0e1016;            /* dark mock screens */
  --red:#e8102e;              /* brand red — fills, dots, rules (white text on top) */
  --red-2:#a80a1f;            /* deep red — hover fills */
  --red-text:#a80a1f;         /* red TEXT on stone (eyebrows, labels, links) */
  --red-display:#d60e2b;      /* red DISPLAY text ≥24px bold on stone */
  --red-glow:rgba(232,16,46,0.40);
  --red-soft:rgba(232,16,46,0.09);
  --white:#f4f6fb;
  --dim:#504842;              /* secondary text */
  --dim-2:#6a625d;            /* tertiary labels — ≥12px bold only */
  --line:rgba(21,18,15,0.14);
  --glass:rgba(255,255,255,0.28);
  --green:#125432;
  --shadow-card:0 10px 30px rgba(50,40,30,0.10);
  --nav-h:64px;
}

/* ============ RESET / BASE ============ */
*{margin:0;padding:0;box-sizing:border-box;}
[hidden]{display:none !important;}
@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth;}}
body{
  background:var(--cream);color:var(--ink);
  font-family:'Manrope',sans-serif;overflow-x:hidden;width:100%;
  -webkit-font-smoothing:antialiased;
}
body.menu-open{overflow:hidden;}
h1,h2,h3,.display{font-family:'Space Grotesk',sans-serif;letter-spacing:-0.02em;}
::selection{background:var(--red);color:#fff;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;}
::-webkit-scrollbar{width:8px;}
::-webkit-scrollbar-track{background:var(--cream);}
::-webkit-scrollbar-thumb{background:#c3b7aa;border-radius:10px;}

/* Accessibility primitives */
.visually-hidden{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;}
.skip-link{
  position:absolute;top:-200px;left:16px;z-index:1000;
  padding:12px 18px;border-radius:100px;background:var(--ink);color:var(--cream);
  font-size:12.5px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;
}
.skip-link:focus{top:16px;outline:2px solid var(--red);outline-offset:3px;}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;}
main:focus{outline:none;}

/* Page atmosphere (add these two divs at the top of <body> on stone pages) */
.bg-fixed{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 40% at 15% 30%, rgba(232,16,46,0.06), transparent 60%),
    radial-gradient(ellipse 50% 50% at 90% 70%, rgba(255,255,255,0.18), transparent 60%),
    linear-gradient(180deg, #d1c7bd 0%, #d7cec5 50%, #d1c7bd 100%);
}
.noise{
  position:fixed;inset:0;z-index:1;pointer-events:none;opacity:0.06;mix-blend-mode:multiply;
  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");
}

/* ============ NAV ============ */
nav#nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 20px 22px 24px;
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);
  background:rgba(209,199,189,0.35);
  border-bottom:1px solid transparent;
  color:var(--ink);
  transition:border-color .4s ease, background .4s ease, padding .4s ease, color .4s ease;
}
nav#nav.scrolled{border-bottom:1px solid var(--line);background:rgba(209,199,189,0.85);padding:14px 20px 14px 24px;color:var(--ink);}
/* dark variant — toggled by site.js while a [data-nav-dark] section sits under the nav */
nav#nav.on-dark{color:var(--paper);background:rgba(11,10,8,0.35);}
nav#nav.on-dark.scrolled{background:rgba(11,10,8,0.80);border-bottom-color:rgba(244,236,221,0.12);color:var(--paper);}
nav#nav.on-dark .logo span{color:var(--paper);}
nav#nav.on-dark .nav-cta{background:var(--paper);color:var(--black);}
.logo{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px;letter-spacing:0.06em;
  display:flex;align-items:center;gap:12px;
}
.logo span{color:var(--ink);}
.logo em{color:var(--red);font-style:normal;}
.logo .lr{font-weight:inherit;position:relative;display:inline-block;width:1.0em;text-align:center;margin-right:.1em;}
.logo .lr-logo{position:absolute;left:50%;top:48%;height:1.36em;transform:translate(-50%,-50%) scaleX(1.12) !important;width:auto;transform:translate(-50%,-50%);opacity:0;pointer-events:none;image-rendering:auto;}
.logo .lr.landed{color:transparent;}
.logo .lr.landed .lr-logo{opacity:1;}
.nav-links{display:none;}
nav > .nav-cta{display:none;}
.nav-links a{
  font-size:12.5px;color:inherit;opacity:.72;font-weight:600;letter-spacing:0.12em;
  position:relative;transition:opacity .3s ease;
}
.nav-links a::after{content:'';position:absolute;bottom:-6px;left:0;width:0;height:1px;background:var(--red);transition:width .3s ease;}
.nav-links a:hover{opacity:1;}
.nav-links a:hover::after{width:100%;}
.nav-cta{
  padding:11px 24px;border-radius:100px;background:var(--ink);color:var(--cream);
  font-size:12.5px;font-weight:800;letter-spacing:0.08em;display:inline-block;
  transition:background .35s ease, color .35s ease, box-shadow .35s ease;
}
.nav-cta:hover{background:var(--red);color:#fff;box-shadow:0 8px 24px var(--red-glow);}
/* burger is a real <button>; 44px touch target, 28px visual */
.burger{
  display:block;width:44px;height:44px;position:relative;cursor:pointer;z-index:110;
  background:none;border:0;padding:0;color:inherit;border-radius:8px;
}
.burger span{position:absolute;left:8px;width:28px;height:1.5px;background:currentColor;transition:transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s ease;}
.burger span:nth-child(1){top:12px;} .burger span:nth-child(2){top:21px;} .burger span:nth-child(3){top:30px;}
.burger.open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}

/* Full-screen menu dialog (#siteMenu) — [hidden] when closed */
.mobile-menu{
  position:fixed;inset:0;z-index:95;background:var(--cream);
  display:flex;align-items:center;justify-content:center;padding:100px 24px 40px;
  opacity:0;pointer-events:none;transition:opacity .4s ease;overflow-y:auto;
}
.mobile-menu.open{opacity:1;pointer-events:all;}
.menu-inner{width:min(560px,90vw);display:flex;flex-direction:column;align-items:flex-start;margin:auto 0;}
.menu-label{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--red-text);font-weight:700;margin-bottom:28px;}
.menu-links{display:flex;flex-direction:column;width:100%;border-top:1px solid var(--line);}
.menu-links a{display:flex;align-items:baseline;gap:22px;padding:18px 0;border-bottom:1px solid var(--line);
  font-family:'Space Grotesk';font-weight:700;font-size:clamp(28px,4.5vw,44px);letter-spacing:-.01em;color:var(--ink);text-transform:uppercase;transition:color .25s ease;}
.menu-links a i{font-family:'Space Grotesk';font-style:normal;font-weight:600;font-size:12px;letter-spacing:.14em;color:var(--red-text);min-width:2.2em;}
.menu-links a:hover{color:var(--red-text);}
.menu-links a[aria-current="page"]{color:var(--red-text);}
.menu-links a[aria-current="page"] i{color:var(--ink);}
.menu-secondary{display:flex;flex-wrap:wrap;gap:4px 26px;margin-top:18px;}
.menu-secondary a{display:inline-block;padding:10px 0;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:color .25s ease;}
.menu-secondary a:hover{color:var(--red-text);}
.menu-cta{display:inline-block !important;margin-top:26px;padding:15px 30px;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;background:var(--ink);color:var(--cream);}
.menu-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:8px 24px;font-size:12px;letter-spacing:.06em;color:var(--dim);}
.menu-foot a{color:var(--dim);text-decoration:none;padding:6px 0;display:inline-block;}
.menu-foot a:hover{color:var(--ink);}

/* ============ HERO ============ */
.hero{position:relative;min-height:100vh;color:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:0 48px;overflow:hidden;}
.hero-pin{position:relative;flex:1;display:flex;flex-direction:column;justify-content:center;min-height:100vh;}
/* scroll-pinned 3D sequence (class added by hero-3d.js only when WebGL runs and motion is allowed) */
.hero.is-track{display:block;height:300vh;min-height:0;padding:0;overflow:visible;}
.hero.is-track .hero-pin{position:sticky;top:0;height:100vh;height:100svh;min-height:0;padding:0 48px;overflow:hidden;}
.hero.is-track .hero-content{opacity:calc(1 - var(--tf,0));transform:translate3d(0,calc(var(--tf,0) * -40px),0);will-change:opacity,transform;}
.hero-bg{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.hero-bg .orb{position:absolute;border-radius:50%;filter:blur(60px);will-change:transform;}
.hero-bg .orb-1{width:52vw;height:52vw;max-width:760px;max-height:760px;left:-14%;top:-18%;background:radial-gradient(circle,rgba(232,16,46,0.16),rgba(232,16,46,0) 70%);animation:heroDrift1 34s ease-in-out infinite alternate;}
.hero-bg .orb-2{width:38vw;height:38vw;max-width:560px;max-height:560px;right:-10%;top:8%;background:radial-gradient(circle,rgba(255,255,255,0.5),rgba(255,255,255,0) 70%);animation:heroDrift2 28s ease-in-out infinite alternate;}
.hero-bg .orb-3{width:30vw;height:30vw;max-width:440px;max-height:440px;left:22%;bottom:-16%;background:radial-gradient(circle,rgba(232,16,46,0.10),rgba(232,16,46,0) 70%);animation:heroDrift3 40s ease-in-out infinite alternate;}
.hero-bg .hero-dark{position:absolute;inset:0;opacity:var(--dk,0);background:radial-gradient(ellipse 70% 55% at 50% 42%,#2a0d14 0%,#14101a 45%,#0b0c11 100%);pointer-events:none;}
.hero-bg .hero-3d{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s ease .3s;}
.hero-bg .hero-3d.is-on{opacity:1;}
@keyframes heroDrift1{to{transform:translate(6%,8%) scale(1.08);}}
@keyframes heroDrift2{to{transform:translate(-8%,6%) scale(0.94);}}
@keyframes heroDrift3{to{transform:translate(5%,-6%) scale(1.06);}}
.hero-content{position:relative;z-index:5;max-width:1400px;margin:0 auto;width:100%;padding:110px 0 80px;}
.hero-label{
  display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:0.16em;color:var(--red-text);
  font-weight:700;margin-bottom:28px;text-transform:uppercase;
}
.hero-label::before{content:'';width:24px;height:1px;background:var(--red-text);}
.hero h1{font-size:clamp(40px,6.6vw,96px);line-height:1.0;font-weight:700;color:var(--ink);max-width:1100px;text-transform:uppercase;}
.hero h1 .line{display:block;overflow:hidden;}
.hero h1 .line span{display:block;opacity:0;transform:translateY(28px);animation:riseIn .9s cubic-bezier(.2,.7,.2,1) forwards;}
.hero h1 .line:nth-child(1) span{animation-delay:.1s;}
.hero h1 .line:nth-child(2) span{animation-delay:.25s;}
.hero h1 .line:nth-child(3) span{animation-delay:.4s;}
.hero-sub{opacity:0;animation:riseIn .9s cubic-bezier(.2,.7,.2,1) .6s forwards;}
@keyframes riseIn{to{opacity:1;transform:translateY(0);}}
.hero h1 .accent{color:var(--red-display);}
.hero-sub{margin-top:32px;font-size:18px;line-height:1.6;color:var(--dim);max-width:560px;}
.hero-ctas{margin-top:44px;display:flex;gap:18px;flex-wrap:wrap;}

/* ============ BUTTONS ============ */
.btn-primary{
  padding:16px 32px;border-radius:100px;background:var(--red);color:#fff;border:0;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:13.5px;letter-spacing:0.08em;display:inline-block;text-align:center;line-height:1.2;
  transition:background .4s ease, box-shadow .4s ease;box-shadow:0 10px 30px rgba(232,16,46,0.25);
}
.btn-primary:hover{box-shadow:0 16px 40px var(--red-glow);background:var(--red-2);}
.btn-secondary{
  padding:16px 32px;border-radius:100px;border:1px solid rgba(21,18,15,0.22);color:var(--ink);cursor:pointer;
  font-family:inherit;font-weight:700;font-size:13.5px;letter-spacing:0.08em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:border-color .4s ease, background .4s ease;background:var(--glass);display:inline-block;text-align:center;line-height:1.2;
}
.btn-secondary:hover{border-color:var(--red);background:var(--red-soft);}
.btn-primary:disabled,.btn-secondary:disabled{opacity:.6;cursor:wait;}
.linklike{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left;letter-spacing:inherit;}

/* ============ MARQUEE ============ */
.marquee{position:relative;z-index:4;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;overflow:hidden;background:var(--cream-2);}
.marquee-track{display:flex;width:max-content;animation:marquee 28s linear infinite;}
@keyframes marquee{to{transform:translateX(-50%);}}
.marquee-track span{
  font-family:'Space Grotesk';font-size:13px;letter-spacing:0.28em;font-weight:600;
  white-space:nowrap;padding-right:1.4em;
  color:transparent;
  background:linear-gradient(120deg, var(--dim) 0%, var(--dim) 42%, #fff 50%, var(--dim) 58%, var(--dim) 100%);
  background-size:250% 100%;background-position:120% 0;
  -webkit-background-clip:text;background-clip:text;
  animation:shine 2s linear infinite;
}
@keyframes shine{to{background-position:-120% 0;}}
.marquee-track em{color:var(--red);font-style:normal;padding:0 .4em;-webkit-text-fill-color:var(--red);}

/* ============ SECTIONS ============ */
section{position:relative;z-index:3;padding:160px 48px;}
#pillars{padding-bottom:60px;}
.container{max-width:1300px;margin:0 auto;}
html.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1);}
html.js .reveal.reveal-left{transform:translateX(-26px);}
html.js .reveal.reveal-scale{transform:scale(.96) translateY(12px);}
html.js .reveal.in{opacity:1;transform:none;}
.eyebrow{font-size:12px;letter-spacing:0.18em;color:var(--red-text);font-weight:700;text-transform:uppercase;margin-bottom:20px;display:flex;align-items:center;gap:14px;}
.eyebrow b{font-family:'Space Grotesk';color:var(--ink);font-weight:600;}
.eyebrow::after{content:'';width:40px;height:1px;background:var(--line);}
.section-head h2{font-size:clamp(30px,4.2vw,54px);font-weight:700;line-height:1.08;color:var(--ink);max-width:900px;}
.section-head h2 em{font-style:normal;color:var(--red-display);}
.section-head h2 .red{color:var(--red-display);display:block;}
.section-head p{margin-top:22px;font-size:17px;color:var(--dim);max-width:600px;line-height:1.7;}
.section-head h2.h-signal{font-size:clamp(36px,5vw,64px);line-height:1.02;}
.section-head h2.h-contact{font-size:clamp(40px,5.6vw,72px);line-height:.98;text-transform:uppercase;}
.section-head p.lead-signal{font-size:16.5px;max-width:420px;}
.section-head p.lead-contact{max-width:420px;font-style:italic;}

/* ============ NUMBERS ============ */
.numbers{padding-top:120px;padding-bottom:120px;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:60px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;}
.stat{background:var(--cream-2);padding:44px 32px;position:relative;overflow:hidden;transition:background .4s ease;}
.stat::before{content:'';position:absolute;top:-60%;left:-20%;width:140%;height:140%;background:radial-gradient(circle, rgba(232,16,46,0.12), transparent 60%);opacity:0;transition:opacity .5s ease;pointer-events:none;}
.stat:hover{background:#e3dcd4;} .stat:hover::before{opacity:1;}
.stat-num{font-family:'Space Grotesk';font-size:clamp(44px,5vw,68px);font-weight:700;line-height:1;color:var(--ink);letter-spacing:-0.03em;}
.stat-num sup{font-size:0.38em;color:var(--red-text);vertical-align:top;margin-left:2px;font-weight:600;}
.stat-label{margin-top:16px;font-size:12px;letter-spacing:0.14em;color:var(--dim);font-weight:700;text-transform:uppercase;line-height:1.5;}

/* ============ VENTURES (project cards) ============ */
.work-grid{display:grid;grid-template-columns:1fr;gap:28px;margin-top:70px;}
.project-card{
  position:relative;border-radius:24px;border:1px solid var(--line);
  background:var(--cream-2);box-shadow:var(--shadow-card);
  overflow:hidden;display:grid;grid-template-columns:1fr 1fr;color:var(--ink);
  transition:border-color .5s ease, box-shadow .5s ease;
}
.project-card:hover{border-color:rgba(232,16,46,0.35);box-shadow:0 30px 60px rgba(50,40,30,0.20), 0 0 40px rgba(232,16,46,0.08);}
.project-card:nth-child(even) .project-visual{order:2;}
.project-visual{
  position:relative;min-height:360px;overflow:hidden;
  background:radial-gradient(circle at 30% 20%, rgba(232,16,46,0.18), transparent 60%), var(--ink-2);
  display:flex;align-items:center;justify-content:center;
}
.project-visual .mock{
  width:82%;border-radius:12px;border:1px solid rgba(255,255,255,0.1);
  background:linear-gradient(160deg,#141620,#0a0c12);padding:14px;
  box-shadow:0 30px 60px rgba(0,0,0,0.5);
}
.mock-bar{display:flex;gap:6px;margin-bottom:12px;align-items:center;}
.mock-bar span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,0.15);}
.mock-bar i{margin-left:auto;font-family:'Space Grotesk';font-size:12px;letter-spacing:0.16em;color:rgba(244,246,251,0.55);font-style:normal;}
.mock-body{height:170px;border-radius:8px;background:linear-gradient(135deg, rgba(232,16,46,0.14), rgba(255,255,255,0.02));position:relative;overflow:hidden;padding:18px;display:flex;flex-direction:column;gap:10px;}
.mock-body::after{content:'';position:absolute;inset:0;background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.06) 50%, transparent 70%);transform:translateX(-100%);}
.mock-row{height:10px;border-radius:4px;background:rgba(255,255,255,0.08);}
.mock-row.red{background:rgba(232,16,46,0.55);width:46%;height:14px;}
.mock-row.w60{width:60%;} .mock-row.w80{width:80%;} .mock-row.w40{width:40%;}
.mock-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:auto;}
.mock-grid span{height:38px;border-radius:6px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.06);}
.mock-chat{display:flex;flex-direction:column;gap:8px;margin-top:auto;}
.mock-chat span{padding:7px 10px;border-radius:10px;font-size:12px;line-height:1.3;max-width:82%;color:var(--white);}
.mock-chat .in{background:#181b26;align-self:flex-start;border-bottom-left-radius:3px;}
.mock-chat .out{background:var(--red);align-self:flex-end;border-bottom-right-radius:3px;}
.mock-body--web{gap:9px;}
.mock-web__nav{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.mock-web__nav b{width:34px;height:10px;border-radius:3px;background:rgba(255,255,255,0.22);margin-right:auto;}
.mock-web__nav i{width:22px;height:6px;border-radius:3px;background:rgba(255,255,255,0.10);}
.mock-lock{margin:auto;font-family:'Space Grotesk';font-size:12px;letter-spacing:0.3em;color:rgba(244,246,251,0.55);text-align:center;}
/* process-flow mock: call -> AI -> printed ticket (NeverMissed card) */
.mock-body--flow{justify-content:center;}
.mock-flow{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;}
.flow-icons{position:relative;display:flex;align-items:center;width:100%;padding:0 calc(100% / 6 - 19px);}
.flow-node{flex:0 0 auto;display:flex;}
.flow-ic{position:relative;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#1c1f2c,#0e0f16);border:1px solid rgba(255,255,255,0.14);box-shadow:0 8px 20px rgba(0,0,0,0.4);z-index:2;}
.flow-ic svg{width:16px;height:16px;}
.flow-node--active .flow-ic{background:linear-gradient(160deg,var(--red),#7f0a1c);box-shadow:0 0 22px rgba(232,16,46,0.6);border-color:transparent;}
.flow-node:not(.flow-node--active) .flow-ic::before{
  content:'';position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(232,16,46,0.55);opacity:0;
  animation:flowPing 3.2s ease-out infinite;
}
.flow-node:first-child .flow-ic::before{animation-delay:0s;}
.flow-node:last-child .flow-ic::before{animation-delay:1.9s;}
.flow-line{flex:1 1 auto;height:2px;background:rgba(255,255,255,0.14);margin:0 -1px;border-radius:2px;}
.flow-glow{position:absolute;top:50%;left:0;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;
  background:#fff;box-shadow:0 0 4px #fff,0 0 16px 5px rgba(232,16,46,0.85);z-index:3;
  animation:flowTravel 3.2s linear infinite;}
.flow-labels{display:flex;width:100%;padding:0;}
.flow-labels span{flex:1 1 0;padding:0 4px;text-align:center;line-height:1.35;text-wrap:balance;font-family:'Space Grotesk';font-size:9.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:rgba(244,246,251,0.55);}
.flow-labels span:nth-child(2){color:#fff;}
@keyframes flowTravel{0%{left:16.67%;opacity:0;}6%{opacity:1;}94%{opacity:1;}100%{left:83.33%;opacity:0;}}
@keyframes flowPing{0%{transform:scale(0.7);opacity:0.9;}70%{transform:scale(1.4);opacity:0;}100%{opacity:0;}}

/* vault-library scene (Vaults card) — same door recipe as the real /vaults/ door */
.mock-body--vault{padding:0;background:none;}
.mock-vault{position:absolute;inset:0;overflow:hidden;
  background:radial-gradient(ellipse 70% 90% at 82% 45%, rgba(232,16,46,0.55), transparent 62%),
    radial-gradient(ellipse 90% 70% at 72% 100%, rgba(232,16,46,0.30), transparent 60%), #0b0a08;}
.mock-vault__lamp{position:absolute;left:15%;bottom:10%;width:64px;height:64px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,196,120,0.55),transparent 70%);filter:blur(5px);
  animation:mockLampFlicker 3.6s ease-in-out infinite;}
.mock-vault__books{position:absolute;left:0;top:0;bottom:0;width:56%;display:flex;align-items:flex-end;gap:3px;padding-left:16px;}
.mock-vault__books i{display:block;width:7px;border-radius:1px 1px 0 0;background:linear-gradient(180deg,#4a2c22,#1c110d);}
.mock-vault__books i:nth-child(3n){background:linear-gradient(180deg,#5a1b20,#20090b);}
.mock-vault__books i:nth-child(4n){background:linear-gradient(180deg,#3a3126,#15110c);}
.mock-vault__books i:nth-child(5n){background:linear-gradient(180deg,#4a2c22,#1c110d);opacity:0.85;}
.mock-vault__door{position:absolute;right:-16%;top:50%;width:250px;height:250px;border-radius:50%;
  transform:translateY(-50%);
  background:conic-gradient(from 90deg,#201d19 0deg,#35302a 40deg,#191612 90deg,#2c2823 140deg,#17140f 190deg,#322d27 240deg,#1a1712 300deg,#201d19 360deg);
  box-shadow:0 0 0 1px rgba(244,236,221,0.12),0 0 70px rgba(232,16,46,0.55),0 0 130px rgba(232,16,46,0.30),inset 0 0 40px rgba(0,0,0,0.85);
  animation:mockDoorBreathe 8s ease-in-out infinite;}
.mock-vault__ring{position:absolute;inset:8%;border-radius:50%;border:1px solid rgba(244,236,221,0.14);
  background:repeating-conic-gradient(rgba(244,236,221,0.06) 0deg 1.4deg, transparent 1.4deg 30deg);
  animation:mockDoorSpin 60s linear infinite reverse;}
.mock-vault__handle{position:absolute;inset:24%;border-radius:50%;border:1.5px solid rgba(244,236,221,0.22);
  animation:mockDoorSpin 10s linear infinite;}
.mock-vault__handle i{position:absolute;left:50%;top:50%;width:112%;height:3px;margin:-1.5px 0 0 -56%;border-radius:2px;
  background:linear-gradient(90deg,transparent 0%,rgba(244,236,221,0.3) 18%,rgba(244,236,221,0.3) 82%,transparent 100%);}
.mock-vault__handle i:nth-child(2){transform:rotate(60deg);}
.mock-vault__handle i:nth-child(3){transform:rotate(120deg);}
.mock-vault__core{position:absolute;inset:38%;border-radius:50%;
  background:radial-gradient(circle at 38% 32%,#2b2721 0%,#171310 60%,#0c0a07 100%);
  border:1px solid rgba(244,236,221,0.1);box-shadow:inset 0 0 18px rgba(0,0,0,0.9);}
@keyframes mockDoorSpin{to{transform:rotate(360deg);}}
@keyframes mockDoorBreathe{0%,100%{transform:translateY(-50%) scale(1);}50%{transform:translateY(-50%) scale(1.025);}}
@keyframes mockLampFlicker{0%,100%{opacity:1;}50%{opacity:0.7;}}
.mock-lock b{display:block;font-size:34px;color:rgba(255,255,255,0.08);letter-spacing:0;margin-bottom:6px;}
.project-info{padding:52px;display:flex;flex-direction:column;justify-content:center;}
.project-tag{display:inline-flex;align-items:center;gap:8px;font-size:12px;padding:6px 12px;border-radius:100px;background:var(--red-soft);color:var(--red-text);border:1px solid rgba(232,16,46,0.25);margin-bottom:20px;width:fit-content;font-weight:700;letter-spacing:0.08em;}
.project-tag.live{background:rgba(28,127,75,0.10);color:var(--green);border-color:rgba(28,127,75,0.3);}
.project-tag.live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);}
.project-tag.soon{background:rgba(21,18,15,0.06);color:var(--dim);border-color:var(--line);}
.project-cat{font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--red-text);font-weight:700;margin-bottom:16px;}
.project-info h3{font-size:clamp(26px,2.6vw,34px);font-weight:700;margin-bottom:14px;color:var(--ink);text-transform:uppercase;line-height:1.05;}
.project-info p{font-size:15.5px;color:var(--dim);line-height:1.7;margin-bottom:26px;}
.project-info p em{color:var(--ink);font-style:normal;font-weight:600;}
.view-project{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;font-weight:800;letter-spacing:0.1em;color:var(--ink);width:fit-content;transition:color .3s ease;}
.project-card:hover .view-project{color:var(--red-text);}

/* ============ SELECTED WORK (cards grid) ============ */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:70px;}
.service-card{
  padding:40px 32px;border-radius:20px;border:1px solid var(--line);background:var(--cream-2);
  position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:260px;
  transition:border-color .5s ease, background .5s ease, box-shadow .5s ease;
}
.service-card::before{content:'';position:absolute;top:-60%;left:-20%;width:140%;height:140%;background:radial-gradient(circle, rgba(232,16,46,0.12), transparent 60%);opacity:0;transition:opacity .5s ease;pointer-events:none;}
.service-card:hover{border-color:rgba(232,16,46,0.3);background:#e3dcd4;box-shadow:0 24px 50px rgba(50,40,30,0.16);}
.service-card:hover::before{opacity:1;}
.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;}
.service-num{font-family:'Space Grotesk';font-size:13px;color:var(--red-text);font-weight:700;letter-spacing:0.1em;}
.card-arrow{color:var(--dim-2);font-size:18px;transition:color .4s ease;}
.service-card:hover .card-arrow{color:var(--ink);}
.service-card h3{font-size:20px;font-weight:700;margin-bottom:12px;color:var(--ink);text-transform:uppercase;}
.service-card p{font-size:14.5px;color:var(--dim);line-height:1.7;margin-bottom:26px;}
.card-tag{margin-top:auto;font-size:12px;letter-spacing:0.14em;font-weight:700;color:var(--dim-2);display:inline-flex;align-items:center;gap:8px;}
.card-tag.live{color:var(--green);}
.card-tag.live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);}

/* ============ TRUST STRIP (guarantee) ============ */
section.guarantee{padding-top:0;}
.trust-strip{
  list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;
}
.trust-item{background:var(--cream-2);padding:34px 30px 32px;position:relative;}
.trust-item::before{content:'';display:block;width:24px;height:2px;background:var(--red);margin-bottom:20px;border-radius:2px;}
.trust-item h3{font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:0.02em;color:var(--ink);margin-bottom:10px;line-height:1.2;}
.trust-item p{font-size:14px;line-height:1.65;color:var(--dim);}
.trust-strip.compact{grid-template-columns:1fr 1fr;border-radius:16px;}
.trust-strip.compact .trust-item{padding:18px 18px 16px;}
.trust-strip.compact .trust-item::before{width:18px;margin-bottom:12px;}
.trust-strip.compact .trust-item h3{font-size:13px;margin-bottom:6px;}
.trust-strip.compact .trust-item p{font-size:13px;}

/* ============ SOCIALS ============ */
.soc-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}
.soc-grid h2 em{font-family:'Space Grotesk';font-style:italic;font-weight:400;color:var(--red-text);text-transform:lowercase;}
.soc-list{border-top:1px solid var(--line);}
.soc-row{
  display:grid;grid-template-columns:60px 1fr auto 30px;align-items:center;gap:20px;
  padding:26px 0;border-bottom:1px solid var(--line);transition:background .4s ease;
}
.soc-idx{font-family:'Space Grotesk';font-size:12px;color:var(--red-text);font-weight:700;letter-spacing:0.1em;}
.soc-name{font-family:'Space Grotesk';font-size:22px;font-weight:700;letter-spacing:0.02em;}
.soc-handle{font-size:12px;letter-spacing:0.16em;color:var(--dim-2);font-weight:700;padding:6px 12px;border:1px solid var(--line);border-radius:100px;}
.soc-arrow{color:var(--dim-2);text-align:right;transition:transform .35s var(--ease-out), color .3s;}
a.soc-row{color:inherit;}
a.soc-row .soc-handle{color:var(--ink);border-color:rgba(21,18,15,0.35);}
a.soc-row:hover .soc-name,a.soc-row:hover .soc-arrow{color:var(--red-text);}
a.soc-row:hover .soc-arrow{transform:translate(3px,-3px);}
.soc-label{font-size:12px;letter-spacing:0.18em;color:var(--dim-2);font-weight:700;margin-bottom:14px;}
.soc-label b{color:var(--red-text);font-weight:700;margin-right:10px;}

/* ============ STORE (feature panel) ============ */
.store-section{
  border-radius:32px;border:1px solid var(--line);
  background:linear-gradient(160deg, #c3b7aa, #dcd4cb);box-shadow:0 20px 60px rgba(50,40,30,0.14);
  padding:100px 60px;margin:0 48px;position:relative;overflow:hidden;text-align:center;
}
.store-section::before{content:'';position:absolute;top:-30%;right:-10%;width:60%;height:100%;background:radial-gradient(circle, rgba(232,16,46,0.14), transparent 65%);pointer-events:none;}
.store-section::after{content:'';position:absolute;bottom:-40%;left:-10%;width:50%;height:100%;background:radial-gradient(circle, rgba(232,16,46,0.08), transparent 65%);pointer-events:none;}
.store-section .eyebrow{justify-content:center;}
.store-section .eyebrow::after{display:none;}
.store-section h2{font-size:clamp(40px,7vw,104px);font-weight:700;line-height:.95;position:relative;z-index:2;text-transform:uppercase;color:var(--ink);}
.store-section h2 .red{color:var(--red-display);display:block;}
.store-section p{margin:26px auto 44px;max-width:520px;font-size:18px;color:var(--dim);position:relative;z-index:2;line-height:1.6;font-style:italic;}
.store-mark{width:88px;height:88px;margin:0 auto 34px;border-radius:22px;box-shadow:0 20px 50px rgba(232,16,46,0.3);position:relative;z-index:2;}
.store-btns{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;position:relative;z-index:2;}

/* ============ FAQ (details/summary) ============ */
.faq{margin-top:56px;border-top:1px solid var(--line);max-width:960px;}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:22px 0;min-height:44px;
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(17px,1.6vw,21px);letter-spacing:-0.01em;color:var(--ink);
  transition:color .3s ease;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::marker{content:'';}
.faq summary::after{
  content:'+';flex:0 0 auto;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;
  display:grid;place-items:center;font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:20px;line-height:1;color:var(--red-text);
  transition:transform .3s ease, background .3s ease;
}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--red-soft);}
.faq summary:hover{color:var(--red-text);}
.faq .faq-a{padding:0 58px 26px 0;font-size:15.5px;line-height:1.7;color:var(--dim);max-width:760px;}
.faq .faq-a p+p{margin-top:12px;}
.faq .faq-a a{color:var(--ink);border-bottom:1px solid var(--line);transition:color .3s ease, border-color .3s ease;}
.faq .faq-a a:hover{color:var(--red-text);border-color:var(--red-text);}

/* ============ FORMS (generic) ============ */
.form-label,.ama-label{display:block;font-size:12px;letter-spacing:0.18em;color:var(--red-text);font-weight:700;margin-bottom:12px;text-transform:uppercase;}
.input,
.ama-form textarea,.ama-form input[type=email],.ama-form input[type=text]{
  width:100%;background:var(--field);border:1px solid var(--line);border-radius:14px;color:var(--ink);
  font-family:'Manrope',sans-serif;font-size:15px;padding:16px 18px;outline:none;transition:border-color .3s ease, box-shadow .3s ease;resize:vertical;min-height:52px;
}
.input::placeholder,.ama-form textarea::placeholder,.ama-form input::placeholder{color:var(--dim);opacity:1;}
.input:focus,.ama-form textarea:focus,.ama-form input[type=email]:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft);}
.form-row,.ama-row{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:14px;}
.btn-form,.ama-form button[type=submit]{
  padding:0 28px;min-height:52px;border-radius:14px;border:none;background:var(--red);color:#fff;cursor:pointer;
  font-family:'Manrope',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:0.1em;text-transform:uppercase;white-space:nowrap;
  transition:background .35s ease, box-shadow .35s ease;box-shadow:0 8px 24px rgba(232,16,46,0.25);
}
.btn-form:hover,.ama-form button[type=submit]:hover{background:var(--red-2);}
.btn-form:disabled,.ama-form button:disabled{opacity:.6;cursor:wait;}
.honey,#amaHoney{position:absolute;left:-9999px;opacity:0;height:0;width:0;}
.form-note,.ama-note{margin-top:18px;font-size:12px;letter-spacing:0.14em;color:var(--dim);font-weight:700;text-transform:uppercase;line-height:1.7;}
.form-note[data-state=ok],.ama-note[data-state=ok]{color:var(--green);}
.form-note[data-state=err],.ama-note[data-state=err]{color:var(--red-text);}
.form-card{border-radius:24px;border:1px solid var(--line);background:var(--cream-2);box-shadow:0 20px 50px rgba(50,40,30,0.12);padding:36px;position:relative;}

/* ============ NEWSLETTER (The Dispatch) ============ */
.dispatch-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.newsletter{border-radius:24px;border:1px solid var(--line);background:var(--cream-2);box-shadow:0 20px 50px rgba(50,40,30,0.12);padding:36px;position:relative;}
.newsletter .form-row{margin-top:0;}
.newsletter-inline{display:grid;grid-template-columns:1fr auto;gap:10px;}
.newsletter-inline .input{padding:12px 14px;font-size:14px;border-radius:12px;min-height:46px;}
.newsletter-inline .btn-form{padding:0 18px;min-height:46px;border-radius:12px;font-size:12px;box-shadow:none;}

/* ============ CONTACT ============ */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:start;}
.contact-grid h2{text-transform:uppercase;}
.contact-grid h2 .red{color:var(--red-display);display:block;}
.contact-direct{margin-top:34px;font-size:12px;letter-spacing:0.14em;color:var(--dim-2);font-weight:700;line-height:2;}
.contact-mail{display:block;font-family:'Space Grotesk';font-size:clamp(16px,1.6vw,20px);letter-spacing:0.04em;color:var(--ink);border-bottom:1px solid var(--line);width:fit-content;padding-bottom:4px;transition:border-color .3s, color .3s;}
.contact-mail:hover{color:var(--red-text);border-color:var(--red-text);}
.ama-form{border-radius:24px;border:1px solid var(--line);background:var(--cream-2);box-shadow:0 20px 50px rgba(50,40,30,0.12);padding:36px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;}

/* ============ PROSE (small text blocks) ============ */
.prose-lite{font-size:15px;line-height:1.7;color:var(--dim);max-width:640px;}
.prose-lite p+p,.prose-lite ul,.prose-lite ol{margin-top:14px;}
.prose-lite ul,.prose-lite ol{padding-left:1.2em;}
.prose-lite strong,.prose-lite b{color:var(--ink);font-weight:700;}
.prose-lite a{color:var(--ink);border-bottom:1px solid var(--line);transition:color .3s ease, border-color .3s ease;}
.prose-lite a:hover{color:var(--red-text);border-color:var(--red-text);}

/* ============ FOOTER ============ */
footer{border-top:1px solid var(--line);padding:70px 48px 32px;position:relative;z-index:3;background:var(--cream-3);color:var(--ink);}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px;max-width:1300px;margin:0 auto;}
.footer-brand .logo{margin-bottom:18px;width:fit-content;}
.footer-brand p{font-size:14.5px;color:var(--dim);line-height:1.7;max-width:300px;}
.footer-mini{margin-top:22px;max-width:340px;}
.footer-mini .form-note{margin-top:10px;font-size:12px;line-height:1.5;}
.footer-col h2{font-family:'Manrope',sans-serif;font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--dim-2);margin-bottom:16px;font-weight:700;
  text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:7px;}
.footer-col a,.footer-col .linklike{display:block;font-size:14px;color:var(--dim);padding:5px 0;transition:color .3s ease;letter-spacing:0.04em;line-height:1.4;}
.footer-col a:hover,.footer-col .linklike:hover{color:var(--ink);}
.footer-soon{display:block;font-size:14px;color:var(--dim);padding:5px 0;letter-spacing:0.04em;line-height:1.4;}
.footer-soon small{font-size:12px;letter-spacing:0.1em;margin-left:8px;border:1px solid var(--line);padding:1px 7px;border-radius:100px;vertical-align:middle;color:var(--dim);}
.footer-col a.soon{color:var(--dim);cursor:default;}
.footer-col a.soon:hover{color:var(--dim);}
.footer-col a.soon small{font-size:12px;letter-spacing:0.1em;margin-left:8px;border:1px solid var(--line);padding:1px 7px;border-radius:100px;vertical-align:middle;}
.footer-bottom{
  display:grid;grid-template-columns:1fr auto;gap:10px 40px;align-items:end;padding-top:28px;border-top:1px solid var(--line);
  font-size:12px;color:var(--dim);line-height:1.8;letter-spacing:0.06em;max-width:1300px;margin:0 auto;text-transform:uppercase;
}
.footer-bottom b{color:var(--ink);font-weight:700;}
.footer-promise{grid-column:1 / -1;color:var(--dim);}
.footer-trust{grid-column:1 / -1;color:var(--dim-2);font-weight:700;}
.footer-copy{text-align:right;}

/* ============ STICKY CTA (mobile only) ============ */
.sticky-cta{display:none;}
@media (max-width:720px){
  .sticky-cta{
    display:flex;align-items:center;justify-content:center;
    position:fixed;left:16px;right:16px;bottom:16px;z-index:90;min-height:52px;
    border-radius:100px;background:var(--red);color:#fff;
    font-weight:800;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;
    box-shadow:0 12px 30px rgba(232,16,46,0.30);
    transition:opacity .3s ease, visibility .3s ease;
  }
  .sticky-cta.is-hidden{opacity:0;visibility:hidden;pointer-events:none;}
  body.has-sticky-cta{padding-bottom:88px;}
}

/* ============ CONSENT BANNER ============ */
.consent{
  position:fixed;left:24px;bottom:24px;z-index:120;
  width:min(420px, calc(100vw - 48px));
  border-radius:20px;border:1px solid var(--line);background:var(--cream-2);
  box-shadow:0 20px 50px rgba(50,40,30,0.22);padding:22px 22px 20px;color:var(--ink);
}
.consent h2{font-size:15px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;margin-bottom:8px;}
.consent p{font-size:13.5px;line-height:1.6;color:var(--dim);}
.consent-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px;}
.consent-actions .btn-primary,.consent-actions .btn-secondary{padding:12px 20px;font-size:12px;min-height:44px;}
.consent-actions .btn-secondary{background:transparent;}
.consent-actions a{margin-left:auto;padding:10px 0;font-size:12px;font-weight:700;letter-spacing:0.06em;color:var(--dim);border-bottom:1px solid var(--line);transition:color .3s ease, border-color .3s ease;}
.consent-actions a:hover{color:var(--red-text);border-color:var(--red-text);}

/* ============ TOAST ============ */
.toast{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:130;
  max-width:calc(100vw - 32px);padding:12px 20px;border-radius:100px;
  background:var(--ink);color:var(--cream);font-size:12.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;text-align:center;
  box-shadow:0 14px 34px rgba(0,0,0,0.25);
  opacity:0;visibility:hidden;transition:opacity .3s ease, visibility .3s ease;
}
.toast.show{opacity:1;visibility:visible;}

.magnetic{display:inline-block;}

/* ============ RESPONSIVE ============ */
@media (max-width:1000px){
  .stats-grid{grid-template-columns:1fr 1fr;}
  .services-grid{grid-template-columns:1fr 1fr;}
  .trust-strip{grid-template-columns:1fr 1fr;}
  .footer-top{grid-template-columns:1fr 1fr 1fr;gap:36px;}
  .footer-brand{grid-column:1 / -1;}
}
@media (max-width:900px){
  .hero{padding:0 24px;}
  .hero.is-track{height:265vh;padding:0;} .hero.is-track .hero-pin{padding:0 24px;}
  section{padding:100px 24px;}
  section.guarantee{padding-top:0;}
  .services-grid{grid-template-columns:1fr;}
  .project-card{grid-template-columns:1fr !important;}
  .project-card .project-visual{order:-1 !important;min-height:0;padding:30px 0;}
  .project-visual .mock{width:86%;}
  .mock-body--flow{height:150px;}
  .flow-labels span{font-size:10px;letter-spacing:0.06em;}
  .project-info{padding:32px;}
  .soc-grid,.contact-grid,.dispatch-grid{grid-template-columns:1fr;gap:40px;}
  .store-section{margin:0;padding:70px 28px;border-radius:24px;}
  .footer-top{grid-template-columns:1fr 1fr;gap:36px;}
  footer{padding:60px 24px 28px;}
  .footer-bottom{grid-template-columns:1fr;}
  .footer-copy{text-align:left;}
  nav#nav{padding:16px 8px 16px 14px;}
  nav#nav.scrolled{padding:10px 8px 10px 14px;}
  .faq .faq-a{padding-right:0;}
}
@media (max-width:720px){
  .footer-col a,.footer-col .linklike,.footer-soon{padding:11px 0;}
  .menu-secondary a{padding:12px 0;}
}
@media (max-width:520px){
  .logo{font-size:15px;gap:9px;}
  .stats-grid{grid-template-columns:1fr;}
  .trust-strip{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
  .hero-ctas,.store-btns{flex-direction:column;}
  .btn-primary,.btn-secondary{text-align:center;}
  .soc-row{grid-template-columns:40px 1fr auto;}
  .soc-arrow{display:none;}
  .ama-row,.form-row{grid-template-columns:1fr;}
  .ama-form button[type=submit],.btn-form{padding:16px;}
  .ama-form,.newsletter,.form-card{padding:24px;}
  .faq summary{font-size:17px;padding:18px 0;}
  .consent{left:0;right:0;bottom:0;width:auto;border-radius:20px 20px 0 0;padding:20px 20px 22px;}
  .consent-actions a{margin-left:0;}
  .menu-links a{font-size:clamp(24px,7vw,32px);padding:14px 0;}
  .mobile-menu{padding:88px 20px 32px;}
}
/* =====================================================================
   MOTION v2 — preloader, cursor, scroll progress, smart nav, entrance
   system, 3D tilt + glare, magnetic buttons, ambient background, FAQ,
   store micro-interactions, view transitions. All hover/mouse effects
   are gated to fine pointers; everything respects reduced motion.
   ===================================================================== */
:root{--ease-out:cubic-bezier(.2,.8,.2,1);--ease-inout:cubic-bezier(.65,0,.35,1);}

/* ---- preloader (first visit per session only; JS-gated, self-killing) ---- */
.preloader{display:none;position:fixed;inset:0;z-index:300;background:var(--cream);align-items:center;justify-content:center;
  transition:transform .8s var(--ease-inout), opacity .45s ease .35s;animation:plKill 1ms linear 3.4s forwards;}
html.is-loading .preloader{display:flex;}
.preloader.done{display:flex;transform:translateY(-101%);opacity:0;pointer-events:none;}
.preloader-mark{display:flex;flex-direction:column;align-items:center;gap:22px;transition:opacity .25s ease, transform .35s ease;}
.preloader.done .preloader-mark{opacity:0;transform:translateY(-16px);}
.pl-logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:24px;letter-spacing:.06em;color:var(--ink);display:inline-flex;align-items:center;animation:plIn .7s var(--ease-out) both;}
.pl-logo em{color:var(--red);font-style:normal;}
.pl-logo .lr{position:relative;display:inline-block;width:1em;text-align:center;margin-right:.1em;color:transparent;}
.pl-logo .lr-logo{position:absolute;left:50%;top:48%;height:1.36em;width:auto;transform:translate(-50%,-50%) scaleX(1.12);}
.pl-bar{display:block;width:180px;height:2px;background:var(--line);border-radius:2px;overflow:hidden;}
.pl-bar i{display:block;height:100%;width:100%;background:var(--red);transform-origin:0 50%;transform:scaleX(0);animation:plBar 1.15s var(--ease-inout) .1s forwards;}
@keyframes plBar{to{transform:scaleX(1);}}
@keyframes plIn{from{opacity:0;transform:translateY(10px);}}
@keyframes plKill{to{opacity:0;visibility:hidden;}}
html.is-loading .hero h1 .line span,html.is-loading .hero-sub{animation-play-state:paused;}

/* ---- scroll progress + smart nav ---- */
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--red);transform-origin:0 50%;transform:scaleX(var(--p,0));z-index:120;pointer-events:none;opacity:0;transition:opacity .3s ease;}
.scroll-progress.show{opacity:1;}
nav#nav{transition:border-color .4s ease, background .4s ease, padding .4s ease, color .4s ease, transform .5s var(--ease-out);}
nav#nav.nav-hidden{transform:translateY(-110%);}
nav#nav.nav-hidden:focus-within,body.menu-open nav#nav{transform:none;}
.logo em{display:inline-block;transition:transform .35s var(--ease-out);}
.logo:hover em{transform:scale(1.5);}

/* ---- back to top ---- */
.to-top{position:fixed;right:22px;bottom:22px;z-index:89;width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;padding:0;
  background:var(--ink);color:var(--cream);display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.22);
  opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .35s ease, visibility .35s ease, transform .5s var(--ease-out), background .3s ease;}
.to-top.show{opacity:1;visibility:visible;transform:none;}
.to-top:hover{background:var(--red);}
.to-top svg{width:18px;height:18px;position:relative;z-index:2;}
.to-top svg.ring{position:absolute;left:-4px;top:-4px;width:calc(100% + 8px);height:calc(100% + 8px);z-index:1;}
.to-top svg.ring circle{fill:none;stroke:var(--red);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--p,0));transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset .12s linear;}
.to-top:hover svg.ring circle{stroke:var(--cream);}
@media (max-width:720px){.to-top{right:16px;bottom:16px;width:46px;height:46px;} body.has-sticky-cta .to-top{bottom:84px;}}

/* ---- cursor follower: magnetic snap outline (fine pointers only; native cursor stays) ---- */
.cursor{display:none;}
@media (hover:hover) and (pointer:fine){
  html.js .cursor{display:block;position:fixed;left:0;top:0;z-index:250;pointer-events:none;opacity:0;transition:opacity .3s ease;}
  html.js .cursor.show{opacity:1;}
  .cursor-ring{position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;border:1.5px solid #fff;mix-blend-mode:difference;will-change:transform;
    transition:width .26s cubic-bezier(.2,.9,.3,1),height .26s cubic-bezier(.2,.9,.3,1),border-radius .26s cubic-bezier(.2,.9,.3,1),border-color .2s ease,background .2s ease;}
  .cursor.hover .cursor-ring{border-color:var(--red);background:rgba(232,16,46,.10);mix-blend-mode:normal;}
  .cursor-dot{position:absolute;left:0;top:0;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--red);will-change:transform;transition:opacity .2s ease;}
  .cursor.hover .cursor-dot{opacity:0;}
}

/* ---- entrance: split headings ---- */
.split .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.06em .02em .12em 0;margin:-.06em 0 -.12em 0;}
.split .wi{display:inline-block;transform:translateY(112%);transition:transform .8s var(--ease-out);}
.split.in .wi{transform:none;}

/* ---- 3D tilt + glare (JS sets transform inline; CSS owns the glare) ---- */
.tilt{position:relative;will-change:transform;}
.tilt .glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:6;opacity:0;transition:opacity .45s ease;
  background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.34), transparent 42%);mix-blend-mode:soft-light;}
.tilt.is-tilting .glare{opacity:1;}
.cover--big.tilt .glare{background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.32), transparent 46%);mix-blend-mode:normal;}
.cover--big.tilt.is-tilting .glare{opacity:.85;}

/* ---- hover polish (fine pointers only) ---- */
@media (hover:hover) and (pointer:fine){
  .btn-primary,.btn-secondary,.nav-cta,.btn-form,.btn-sm,.chip,.share-btn,.legal-toc a,.nf-links a,.basket-link{transition:transform .45s var(--ease-out), box-shadow .45s ease, background .35s ease, border-color .35s ease, color .35s ease;}
  .btn-primary:hover,.btn-secondary:hover,.nav-cta:hover,.btn-form:hover,.btn-sm:hover,.chip:hover,.share-btn:hover,.legal-toc a:hover,.nf-links a:hover,.basket-link:hover{transform:translateY(-2px);}
  .btn-primary,.btn-form,.nav-cta{position:relative;overflow:hidden;}
  .btn-primary::after,.btn-form::after,.nav-cta::after{content:'';position:absolute;top:-10%;left:-80%;width:55%;height:120%;pointer-events:none;
    background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.26) 50%,transparent 100%);transform:skewX(-18deg);transition:left .75s var(--ease-out);}
  .btn-primary:hover::after,.btn-form:hover::after,.nav-cta:hover::after{left:135%;}
  .footer-col a,.menu-secondary a,.menu-foot a{transition:color .3s ease, transform .35s var(--ease-out);}
  .footer-col a:hover,.menu-secondary a:hover{transform:translateX(4px);}
  .view-project svg{transition:transform .4s var(--ease-out);}
  .project-card:hover .view-project svg,.post-card:hover .view-project svg{transform:translateX(6px);}
  .marquee:hover .marquee-track{animation-play-state:paused;}
  .stat .stat-num{transition:transform .5s var(--ease-out);}
  .stat:hover .stat-num{transform:translateY(-3px);}
  .trust-item::before,.shelf-card::before{transition:width .4s var(--ease-out);}
  .trust-item:hover::before{width:48px;}
  .menu-links a{transition:color .25s ease, padding-left .35s var(--ease-out);}
  .menu-links a:hover{padding-left:10px;}
  .menu-links a i{transition:color .25s ease;}
  .faq summary::after{transition:transform .4s var(--ease-out), background .3s ease, color .3s ease;}
  .input:hover,.ama-form textarea:hover,.ama-form input[type=email]:hover{border-color:rgba(21,18,15,.3);}
}

/* ---- menu: staggered link entrance ---- */
.mobile-menu .menu-links a,.mobile-menu .menu-secondary,.mobile-menu .menu-cta,.mobile-menu .menu-foot,.mobile-menu .menu-label{opacity:0;transform:translateY(18px);}
.mobile-menu.open .menu-links a,.mobile-menu.open .menu-secondary,.mobile-menu.open .menu-cta,.mobile-menu.open .menu-foot,.mobile-menu.open .menu-label{animation:menuIn .6s var(--ease-out) forwards;}
.mobile-menu.open .menu-label{animation-delay:.05s;}
.mobile-menu.open .menu-links a:nth-child(1){animation-delay:.10s;}
.mobile-menu.open .menu-links a:nth-child(2){animation-delay:.16s;}
.mobile-menu.open .menu-links a:nth-child(3){animation-delay:.22s;}
.mobile-menu.open .menu-links a:nth-child(4){animation-delay:.28s;}
.mobile-menu.open .menu-links a:nth-child(5){animation-delay:.34s;}
.mobile-menu.open .menu-secondary{animation-delay:.42s;}
.mobile-menu.open .menu-cta{animation-delay:.48s;}
.mobile-menu.open .menu-foot{animation-delay:.54s;}
@keyframes menuIn{to{opacity:1;transform:none;}}

/* ---- ambient background (site-wide, slow) + living grain ---- */
.bg-fixed{overflow:hidden;}
.bg-fixed::before,.bg-fixed::after{content:'';position:absolute;border-radius:50%;filter:blur(50px);will-change:transform;}
.bg-fixed::before{width:60vw;height:60vw;max-width:900px;max-height:900px;left:-22%;top:-28%;background:radial-gradient(circle,rgba(232,16,46,0.09),rgba(232,16,46,0) 70%);animation:ambA 38s ease-in-out infinite alternate;}
.bg-fixed::after{width:50vw;height:50vw;max-width:760px;max-height:760px;right:-18%;bottom:-24%;background:radial-gradient(circle,rgba(255,255,255,0.42),rgba(255,255,255,0) 70%);animation:ambB 31s ease-in-out infinite alternate;}
@keyframes ambA{to{transform:translate(14%,18%) scale(1.12);}}
@keyframes ambB{to{transform:translate(-16%,-12%) scale(0.9);}}
.noise{inset:-10%;width:120%;height:120%;animation:grain 1.8s steps(6) infinite;}
@keyframes grain{0%{transform:translate(0,0);}17%{transform:translate(-2%,1%);}34%{transform:translate(1%,-2%);}51%{transform:translate(-1%,-1%);}68%{transform:translate(2%,1%);}85%{transform:translate(-2%,2%);}100%{transform:translate(0,0);}}
@media (max-width:720px){.noise{animation:none;} .bg-fixed::before,.bg-fixed::after{filter:blur(30px);} .hero-bg .orb{filter:blur(40px);}}

/* ---- hero: mouse spotlight + parallax orbs (home) ---- */
.hero::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .6s ease;
  background:radial-gradient(560px circle at var(--mx,50%) var(--my,40%), rgba(255,255,255,.22), transparent 60%);}
.hero.has-mouse::after{opacity:1;}
.hero-bg{transform:translate(var(--px,0px),var(--py,0px));transition:transform .9s var(--ease-out);}

/* ---- vault door: mouse parallax ---- */
#vault-intro .vi-door-wrap{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--ds,1));opacity:var(--do,1);transition:transform .35s var(--ease-out), opacity .3s ease;transform-style:preserve-3d;will-change:transform,opacity;}
#vault-intro .vi-head{transform:translate(var(--px,0px),var(--py,0px));transition:transform .8s var(--ease-out);}

/* ---- forms, toast, cart micro-interactions ---- */
.is-sending{color:transparent !important;position:relative;pointer-events:none;}
.is-sending::after{content:'';position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:none;transform:none;transition:none;
  border:2px solid rgba(127,127,127,.35);border-top-color:var(--red);animation:spin .7s linear infinite;}
.btn-primary.is-sending::after,.btn-form.is-sending::after{border-color:rgba(255,255,255,.35);border-top-color:#fff;}
@keyframes spin{to{transform:rotate(360deg);}}
.toast{transform:translate(-50%,14px) scale(.96);transition:opacity .35s ease, visibility .35s ease, transform .5s var(--ease-out);}
.toast.show{transform:translate(-50%,0) scale(1);}
[data-cart-count].bump{animation:bump .55s var(--ease-out);}
@keyframes bump{0%{transform:scale(1);}35%{transform:scale(1.45);}100%{transform:scale(1);}}
.is-added{background:var(--ink) !important;color:var(--cream) !important;border-color:var(--ink) !important;}

/* ---- cross-page transitions (progressive enhancement) ---- */
@view-transition{navigation:auto;}
::view-transition-old(root){animation:vtOut .22s ease both;}
::view-transition-new(root){animation:vtIn .34s cubic-bezier(.2,.8,.2,1) both;}
@keyframes vtOut{to{opacity:0;transform:translateY(-8px);}}
@keyframes vtIn{from{opacity:0;transform:translateY(10px);}}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}
  html.js .reveal,.reveal{opacity:1;transform:none;}
  .split .wi{transform:none;}
  .hero h1 .line span,.hero-sub{opacity:1;transform:none;}
  .preloader,.cursor{display:none !important;}
  .mobile-menu .menu-links a,.mobile-menu .menu-secondary,.mobile-menu .menu-cta,.mobile-menu .menu-foot,.mobile-menu .menu-label{opacity:1;transform:none;}
  .bg-fixed::before,.bg-fixed::after,.noise,.hero-bg .orb{animation:none !important;}
  ::view-transition-old(root),::view-transition-new(root){animation:none !important;}
}

/* refund request form (Refunds & Delivery page) */
.refund-form{margin-top:32px;scroll-margin-top:calc(var(--nav-h) + 32px);}
.legal-prose .refund-form h3,.refund-form h3{margin-top:0 !important;padding-top:0;border:0;font-family:'Space Grotesk';font-size:22px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--ink);margin:0 0 4px;}
.refund-form .ama-label{display:block;margin-top:18px;}
.refund-form .ama-opt{color:var(--dim-2);letter-spacing:.06em;}
.refund-form .btn-form{margin-top:20px;}

/* iOS zooms into any field under 16px: keep form text at 16px on touch screens */
@media (hover:none) and (pointer:coarse){input,textarea,select,.input{font-size:16px !important;}}
.footer-legal{grid-column:1 / -1;text-transform:none;font-size:11px;letter-spacing:.04em;color:var(--dim-2);line-height:1.6;}
.footer-legal a{color:inherit;text-decoration:underline;text-underline-offset:2px;}
