/* ============================================================
   BRU DESIGN STUDIO — warm cream & tan · liquid-glass finish
   brand: #c7a17a  ·  paper: #f7ead0  ·  WCAG-AA contrast
   Shared across index.html, about.html, blog.html, blog-post.html
   ============================================================ */
:root{
  --bg:#f7ead0; --bg-2:#f0dfbe; --surface:#fcf5e7; --surface-2:#f4e7cd;
  --ink:#2e2418; --muted:#6b5a40; --line:rgba(46,36,24,.13); --line-2:rgba(46,36,24,.22);
  --brand:#c7a17a; --brand-deep:#7e5a2b; --espresso:#241b10;
  --focus:#1f6feb;
  --shadow:0 26px 60px -34px rgba(70,45,20,.5);
  --maxw:1160px; --ease:cubic-bezier(.22,.61,.36,1);
  --lg:linear-gradient(135deg,rgba(255,255,255,.6),rgba(255,251,243,.28));
  --lg-strong:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,250,240,.44));
  --lg-brd:rgba(255,255,255,.72);
  --lg-blur:saturate(1.8) blur(22px);
  --lg-sh:inset 0 1px 0 rgba(255,255,255,.95), inset 0 -14px 32px -10px rgba(255,255,255,.32), 0 22px 50px -30px rgba(70,45,20,.55);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:transparent;color:var(--ink);font-family:"Inter",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;}
.page-bg{position:fixed;inset:0;z-index:-2;background:var(--bg);}
.orbs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}
.orbs span{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;will-change:transform;}
.orbs .o1{width:48vw;height:48vw;left:-12vw;top:-10vw;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 42%,transparent),transparent 70%);animation:drift1 26s ease-in-out infinite;}
.orbs .o2{width:44vw;height:44vw;right:-10vw;top:24vh;background:radial-gradient(circle,color-mix(in srgb,#e7cfa3 60%,transparent),transparent 70%);animation:drift2 32s ease-in-out infinite;}
.orbs .o3{width:46vw;height:46vw;left:22vw;bottom:-14vw;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 34%,transparent),transparent 70%);animation:drift3 30s ease-in-out infinite;}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(8vw,6vh) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-7vw,4vh) scale(1.08)}}
@keyframes drift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(4vw,-6vh) scale(1.14)}}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes sheen{to{background-position:200% center}}

h1,h2,h3,h4{margin:0;line-height:1.05;font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;letter-spacing:0;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--brand);color:#fff;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,10vh,128px) clamp(18px,5vw,40px);}

.glass{position:relative;background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);
  border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,0) 42%);opacity:.85;}
.glass>*{position:relative;z-index:1;}

/* accessibility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip{position:fixed;top:-60px;left:16px;z-index:200;background:var(--espresso);color:#fff;padding:12px 18px;border-radius:10px;font-weight:700;transition:top .25s;}
.skip:focus{top:14px;}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px;}

.tag{display:inline-flex;align-items:center;gap:9px;font-family:"Inter",sans-serif;font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-deep);}
.tag::before{content:"";width:22px;height:2px;background:var(--brand-deep);border-radius:2px;}
.muted{color:var(--muted);}

.btn{display:inline-flex;align-items:center;gap:9px;cursor:pointer;border:none;font-family:"Inter",sans-serif;font-weight:700;font-size:15px;
  padding:14px 28px;border-radius:999px;color:#fff;background:var(--espresso);box-shadow:0 14px 34px -16px rgba(36,27,16,.8);
  transition:transform .2s var(--ease),filter .2s,box-shadow .2s;min-height:48px;text-align:center;}
.btn:hover{transform:translateY(-2px);filter:brightness(1.3);}
.btn.ghost{background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);color:var(--ink);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);}
.btn.ghost:hover{color:var(--brand-deep);filter:none;}
.btn svg{width:18px;height:18px;}

/* ============ NAV ============ */
#nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:12px clamp(16px,4vw,40px);transition:background .4s,backdrop-filter .4s,box-shadow .4s;}
#nav.scrolled{background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);
  border-bottom:1px solid var(--lg-brd);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 12px 34px -22px rgba(70,45,20,.5);}
.brand{display:flex;align-items:center;gap:11px;min-width:0;flex-shrink:1;}
.brand .mark{height:46px;width:auto;flex:0 0 auto;display:block;}
.brand .brand-text{white-space:nowrap;font-family:"Cormorant Garamond",serif;font-weight:600;font-size:21px;line-height:1;letter-spacing:.01em;}
.brand .brand-text small{display:block;font-family:"Inter",sans-serif;font-weight:600;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-top:3px;}
.nav-cluster{display:flex;align-items:center;gap:10px;flex-shrink:0;}
@media(max-width:600px){.brand .brand-text{font-size:18px;}.brand .brand-text small{display:none;}}
.nav-links{display:flex;align-items:center;gap:4px;}
.nav-links a{font-family:"Inter",sans-serif;font-weight:600;font-size:14px;padding:9px 13px;border-radius:999px;color:var(--muted);transition:color .2s,background .2s;}
.nav-links a:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent);}
.nav-links a[aria-current="page"]{color:var(--ink);background:color-mix(in srgb,var(--brand) 22%,transparent);}
.nav-cta{background:var(--espresso);color:#fff!important;padding:10px 18px!important;}
.nav-cta:hover{filter:brightness(1.3);}

.hamburger{display:none;width:44px;height:44px;border:1px solid var(--lg-brd);border-radius:12px;background:var(--lg);
  backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;}
.hamburger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .3s;}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
@media(max-width:880px){
  .hamburger{display:flex;}
  .nav-links{position:absolute;top:calc(100% + 8px);right:clamp(12px,4vw,40px);left:clamp(12px,4vw,40px);
    flex-direction:column;align-items:stretch;gap:6px;padding:12px;border-radius:18px;display:none;
    background:var(--lg-strong);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);
    border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);}
  .nav-links.open{display:flex;}
  .nav-links a{padding:13px 14px;font-size:16px;color:var(--ink);}
  .nav-cta{text-align:center;}
}

/* ============ ROTATING SEAL ============ */
.seal{position:relative;width:var(--sz,150px);height:var(--sz,150px);flex:0 0 auto;display:grid;place-items:center;}
.seal .ring{position:absolute;inset:0;animation:spin 18s linear infinite;}
.seal .ring text{font-family:"Inter",sans-serif;font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;}
.seal .core{position:relative;z-index:1;width:46%;height:46%;border-radius:50%;display:grid;place-items:center;}
.seal .core img{width:78%;height:auto;}

/* ============ HERO (home) ============ */
.hero{position:relative;padding:clamp(120px,18vh,180px) clamp(18px,5vw,48px) clamp(40px,7vh,80px);max-width:1240px;margin:0 auto;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center;}
@media(max-width:920px){.hero{grid-template-columns:1fr;gap:36px;text-align:center;}}
.hero-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start;position:relative;z-index:2;}
@media(max-width:920px){.hero-copy{align-items:center;}}
.hero h1{font-size:clamp(46px,7.4vw,90px);line-height:1.0;letter-spacing:-.01em;max-width:15ch;}
.hero h1 em{font-style:italic;color:var(--brand-deep);}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .hero h1 em{background:linear-gradient(100deg,#7e5a2b,#9c7444,#7e5a2b);background-size:200% auto;
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:sheen 6s linear infinite;}
}
.hero-sub{font-size:clamp(16px,1.8vw,20px);line-height:1.6;color:var(--muted);max-width:54ch;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
@media(max-width:920px){.hero-actions{justify-content:center;}}
.hero-meta{display:flex;gap:26px;flex-wrap:wrap;margin-top:6px;color:var(--muted);font-size:13.5px;font-weight:600;}
@media(max-width:920px){.hero-meta{justify-content:center;}}
.hero-meta b{display:block;font-family:"Cormorant Garamond",serif;font-weight:700;font-size:30px;color:var(--ink);line-height:1;}
.hero-meta div span{display:block;margin-top:4px;font-weight:600;}

.stage{position:relative;perspective:1600px;}
.stage .glow{position:absolute;width:80%;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);z-index:0;
  background:conic-gradient(from 0deg,transparent,color-mix(in srgb,var(--brand) 75%,transparent),transparent 55%,color-mix(in srgb,#e7cfa3 70%,transparent),transparent);
  filter:blur(46px);opacity:.7;border-radius:50%;animation:spin 18s linear infinite;}
.browser{position:relative;z-index:1;border-radius:18px;overflow:hidden;border:1px solid var(--lg-brd);
  box-shadow:var(--lg-sh),var(--shadow);transform-style:preserve-3d;transition:transform .3s ease-out;will-change:transform;}
.browser .bbar{display:flex;align-items:center;gap:8px;padding:11px 14px;background:var(--lg-strong);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border-bottom:1px solid var(--lg-brd);}
.browser .dot{width:11px;height:11px;border-radius:50%;}
.browser .dot.r{background:#d9a05f;} .browser .dot.y{background:#e6c486;} .browser .dot.g{background:#bda079;}
.browser .url{flex:1;margin-left:8px;height:24px;border-radius:7px;background:rgba(255,255,255,.4);
  display:flex;align-items:center;gap:7px;padding:0 12px;font-size:11.5px;color:var(--muted);font-weight:600;}
.browser .url svg{width:11px;height:11px;flex:0 0 auto;}
.browser .screen{position:relative;aspect-ratio:16/11;overflow:hidden;background:#1a130d;}

/* HERO SHOWREEL */
.rh{position:absolute;inset:0;}
.rh-slide{position:absolute;inset:0;opacity:0;transform:scale(1.05);overflow:hidden;
  transition:opacity .9s var(--ease),transform 1.3s var(--ease);}
.rh-slide.active{opacity:1;transform:scale(1);}
.rh-slide .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.rh-slide .scrim{position:absolute;inset:0;z-index:1;}
.rh-slide .eyebrow{font-family:"Inter",sans-serif;font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;}
.rh-slide h4{font-size:clamp(20px,3.2vw,34px);line-height:1.03;max-width:15ch;}
.rh-slide i{font-style:normal;font-size:11px;font-weight:700;display:inline-flex;align-items:center;white-space:nowrap;}
.b-outline{padding:9px 18px;border-radius:999px;border:1.5px solid currentColor;}
.b-square{padding:10px 17px;border-radius:6px;}
.b-pill{padding:9px 17px;border-radius:999px;}
.b-bar{padding:11px 22px;border-radius:9px;font-size:12px;font-weight:800;letter-spacing:.03em;}

.s-barber{background:linear-gradient(150deg,#241a12,#0f0a06);}
.s-barber .scrim{background:linear-gradient(0deg,rgba(12,8,5,.82),rgba(12,8,5,.5));}
.s-barber .c{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:26px 30px 50px;color:#f4e7d2;}
.s-barber .word{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:17px;letter-spacing:.42em;text-transform:uppercase;padding-left:.42em;color:#e9c98c;}
.s-barber .eyebrow{color:#d9b066;}
.s-barber h4{font-family:"Cormorant Garamond",serif;font-weight:700;max-width:15ch;letter-spacing:.01em;}
.s-barber .b-outline{color:#f4e7d2;border-color:rgba(244,231,210,.7);}

.s-plumb{display:flex;background:linear-gradient(140deg,#eef3f8,#dbe6f1);}
.s-plumb .left{position:relative;z-index:2;width:55%;padding:clamp(16px,2.6vw,28px);display:flex;flex-direction:column;gap:12px;justify-content:center;
  background:linear-gradient(160deg,#f3f7fb,#e2ecf5);color:#16283a;}
.s-plumb .right{position:relative;flex:1;background:linear-gradient(140deg,#9fb6cf,#6f8bab);overflow:hidden;}
.s-plumb .brandrow{display:flex;align-items:center;gap:8px;font-weight:800;font-size:13px;}
.s-plumb .brandrow .d{width:13px;height:13px;border-radius:4px;background:#2f6fd6;}
.s-plumb .brandrow .nv{margin-left:auto;font-size:9.5px;font-weight:700;color:#5d7088;letter-spacing:.06em;text-transform:uppercase;}
.s-plumb .eyebrow{color:#2563c0;}
.s-plumb h4{font-family:"Inter",sans-serif;font-weight:800;letter-spacing:-.02em;color:#16283a;}
.s-plumb .b-square{background:#2f6fd6;color:#fff;align-self:flex-start;}
@media(max-width:520px){.s-plumb{flex-direction:column;}.s-plumb .left{width:100%;flex:0 0 auto;}.s-plumb .right{display:block;width:100%;flex:1 1 auto;min-height:44%;}}

.s-travel{background:linear-gradient(140deg,#f0e3c8,#e7d4b0);}
.s-travel .scrim{background:linear-gradient(0deg,rgba(40,28,14,.3),transparent 55%);}
.s-travel .card{position:absolute;left:clamp(16px,3vw,26px);bottom:clamp(40px,8%,52px);z-index:2;max-width:62%;overflow:hidden;
  padding:18px 20px;border-radius:18px;display:flex;flex-direction:column;gap:7px;
  background:linear-gradient(135deg,rgba(255,250,242,.5),rgba(255,246,234,.3));
  backdrop-filter:blur(11px) saturate(1.5);-webkit-backdrop-filter:blur(11px) saturate(1.5);
  border:1px solid rgba(255,255,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 18px 40px -20px rgba(40,28,14,.55);}
.s-travel .card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0) 46%);}
.s-travel .card>*{position:relative;z-index:1;}
.s-travel .card b{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:15px;color:#3f2c10;letter-spacing:.02em;text-shadow:0 1px 1px rgba(255,250,240,.5);}
.s-travel .card h4{font-family:"Cormorant Garamond",serif;font-weight:700;color:#2f2110;text-shadow:0 1px 2px rgba(255,250,240,.45);}
.s-travel .price{font-size:11px;font-weight:700;color:#875c14;letter-spacing:.02em;}
.s-travel .b-pill{background:#a9772a;color:#fff;align-self:flex-start;margin-top:3px;}

.s-gym{background:linear-gradient(140deg,#1c1730,#0f0c1c);}
.s-gym .scrim{background:linear-gradient(0deg,rgba(10,8,18,.85),transparent 56%);}
.s-gym .chip{position:absolute;top:14px;right:14px;z-index:2;font-family:"Inter",sans-serif;font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:#14111f;background:#c6f24f;padding:6px 11px;border-radius:999px;}
.s-gym .c{position:absolute;left:clamp(16px,3vw,28px);right:clamp(16px,3vw,28px);bottom:clamp(42px,9%,56px);z-index:2;display:flex;flex-direction:column;gap:10px;color:#f0eefb;}
.s-gym .eyebrow{color:#c6f24f;}
.s-gym h4{font-family:"Inter",sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(22px,3.8vw,40px);}
.s-gym .b-bar{background:#c6f24f;color:#14111f;align-self:flex-start;}

.rh-ticker{position:absolute;left:0;right:0;bottom:0;z-index:6;height:28px;overflow:hidden;display:flex;align-items:center;
  background:rgba(18,13,8,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,.14);}
.rh-ticker .tk{display:flex;width:max-content;white-space:nowrap;animation:marquee 24s linear infinite;}
.rh-ticker span{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(247,234,208,.82);padding:0 14px;display:inline-flex;align-items:center;gap:14px;}
.rh-ticker span::after{content:"✦";color:var(--brand);font-size:.8em;}

.hero .hero-seal{position:absolute;right:-22px;top:-30px;z-index:5;--sz:108px;}
@media(max-width:920px){.hero .hero-seal{display:none;}}

/* ============ SECTIONS ============ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.reveal.in{opacity:1;transform:none;}
.sec-head{max-width:64ch;margin:0 auto;text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center;}
.sec-head .tag{justify-content:center;}
.sec-head h2{font-size:clamp(36px,5.4vw,66px);line-height:1.02;letter-spacing:-.01em;}
.sec-head h2 em{font-style:italic;color:var(--brand-deep);}
.sec-head p{font-size:clamp(16px,1.7vw,18.5px);line-height:1.65;color:var(--muted);max-width:56ch;}
.wm-dog{position:absolute;pointer-events:none;opacity:.05;width:min(40vw,420px);z-index:0;}

/* PROBLEM */
.problem{position:relative;overflow:hidden;}
.problem .wm-dog{left:-6%;bottom:-8%;}
.flip{max-width:880px;margin:50px auto 0;}
.flip .row{display:grid;grid-template-columns:1fr 56px 1fr;align-items:center;gap:8px;padding:24px 4px;border-top:1px solid var(--line);}
.flip .row:last-child{border-bottom:1px solid var(--line);}
.flip .from{text-align:right;color:var(--muted);font-size:16px;line-height:1.4;}
.flip .from s{text-decoration-color:var(--line-2);}
.flip .to{text-align:left;color:var(--ink);font-size:17.5px;font-weight:600;line-height:1.4;}
.flip .to b{color:var(--brand-deep);font-weight:700;}
.flip .ar{justify-self:center;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--brand-deep);
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);}
.flip .ar svg{width:17px;height:17px;}
@media(max-width:640px){
  .flip .row{grid-template-columns:1fr;gap:8px;text-align:center;padding:22px 4px;}
  .flip .from,.flip .to{text-align:center;}
  .flip .ar{transform:rotate(90deg);margin:2px auto;}
}

/* BELIEF */
.belief{position:relative;text-align:center;overflow:hidden;}
.belief .wm-dog{left:50%;top:48%;transform:translate(-50%,-50%);width:min(56vw,560px);opacity:.06;}
.belief .inner{position:relative;z-index:1;}
.belief .pull{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(32px,5.6vw,68px);line-height:1.08;letter-spacing:-.01em;max-width:20ch;margin:0 auto;}
.belief .pull em{font-style:italic;color:var(--brand-deep);}
.belief .by{margin-top:26px;color:var(--muted);font-size:16px;font-weight:600;line-height:1.6;max-width:48ch;margin-inline:auto;}
.belief .by b{color:var(--ink);}

/* CAPABILITIES / VALUES open grid */
.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(22px,4vw,54px);margin-top:50px;}
@media(max-width:900px){.cap-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.cap-grid{grid-template-columns:1fr;}}
.cap{position:relative;padding:30px 0 30px;border-top:1px solid var(--line);transition:border-color .3s;}
.cap:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--line));}
.cap .cico{position:relative;width:52px;height:52px;border-radius:15px;display:grid;place-items:center;margin-bottom:18px;color:var(--espresso);
  background:linear-gradient(140deg,rgba(199,161,122,.95),rgba(217,184,143,.7));border:1px solid var(--lg-brd);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 12px 26px -16px var(--brand);transition:transform .4s var(--ease);}
.cap:hover .cico{transform:rotate(-7deg) scale(1.07);}
.cap .cico svg{width:25px;height:25px;}
.cap h3{font-size:25px;line-height:1.12;margin-bottom:8px;transition:color .3s;}
.cap:hover h3{color:var(--brand-deep);}
.cap p{font-size:14.5px;line-height:1.62;color:var(--muted);margin:0;}

/* WORK */
.work{position:relative;}
/* tighten the gap between What we build and Selected work */
.capabilities .wrap{padding-bottom:clamp(8px,1.5vh,22px);}
.work .wrap{padding-top:clamp(16px,2.5vh,34px);}
.case{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(26px,4vw,56px);align-items:center;margin-top:48px;}
@media(max-width:900px){.case{grid-template-columns:1fr;}}
.case .ctext{display:flex;flex-direction:column;gap:16px;align-items:flex-start;}
.case .k{font-family:"Inter",sans-serif;font-weight:800;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-deep);display:flex;align-items:center;gap:9px;}
.case h3{font-size:clamp(30px,4vw,46px);line-height:1.04;}
.case p{color:var(--muted);font-size:16px;line-height:1.65;margin:0;}
.case p b{color:var(--ink);}
.case .chips{display:flex;flex-wrap:wrap;gap:8px;}
.case .chips span{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:700;color:var(--brand-deep);
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);border-radius:999px;padding:7px 14px;}
.frame{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--lg-brd);box-shadow:var(--lg-sh),var(--shadow);}
.frame .fbar{display:flex;align-items:center;gap:8px;padding:10px 13px;background:var(--lg-strong);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border-bottom:1px solid var(--lg-brd);}
.frame .fbar .dot{width:10px;height:10px;border-radius:50%;}
.frame .fbar .url{flex:1;margin-left:6px;height:23px;border-radius:7px;background:rgba(255,255,255,.4);
  display:flex;align-items:center;gap:7px;padding:0 12px;font-size:11.5px;color:var(--muted);font-weight:600;}
.reel{position:relative;aspect-ratio:2/1;background:#1c150d;overflow:hidden;}
.reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;will-change:opacity;}
.reel .l-sketch{z-index:1;filter:grayscale(1) contrast(1.05);animation:dtSketch 12s ease-in-out infinite;}
.reel .l-color{z-index:2;opacity:0;animation:dtColor 12s ease-in-out infinite;}
.reel .l-night{z-index:3;opacity:0;animation:dtNight 12s ease-in-out infinite;}
@keyframes dtSketch{0%{opacity:1}9%{opacity:1}22%{opacity:0}90%{opacity:0}100%{opacity:1}}
@keyframes dtColor{0%{opacity:0}13%{opacity:0}27%{opacity:1}48%{opacity:1}62%{opacity:0}100%{opacity:0}}
@keyframes dtNight{0%{opacity:0}58%{opacity:0}71%{opacity:1}88%{opacity:1}100%{opacity:0}}
.reel .stage-lbl{position:absolute;top:12px;left:12px;z-index:5;font-family:"Inter",sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:#fff;padding:6px 11px;border-radius:999px;background:rgba(18,13,8,.42);backdrop-filter:blur(6px);}
.reel .cap-strip{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;color:#fff;z-index:5;
  display:flex;justify-content:space-between;align-items:center;gap:12px;background:linear-gradient(0deg,rgba(20,14,9,.85),transparent);}
.reel .cap-strip b{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:20px;}
.reel .cap-strip .pill{font-family:"Inter",sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;display:flex;align-items:center;gap:7px;}
.reel .cap-strip .pill::before{content:"";width:8px;height:8px;border-radius:50%;background:#ff6b5e;box-shadow:0 0 0 0 rgba(255,107,94,.7);animation:pulse 1.8s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,107,94,.6)}70%{box-shadow:0 0 0 9px rgba(255,107,94,0)}100%{box-shadow:0 0 0 0 rgba(255,107,94,0)}}

/* PROCESS */
.steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(26px,4vw,50px);margin-top:56px;}
@media(max-width:780px){.steps{grid-template-columns:1fr;gap:36px;}}
.steps::before{content:"";position:absolute;top:33px;left:12%;right:12%;height:1px;
  background:linear-gradient(90deg,transparent,var(--line-2),var(--line-2),transparent);z-index:0;}
@media(max-width:780px){.steps::before{display:none;}}
.step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;}
@media(max-width:780px){.step{align-items:center;text-align:center;}}
.step .num{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;margin-bottom:18px;
  font-family:"Cormorant Garamond",serif;font-weight:700;font-size:30px;color:var(--brand-deep);
  background:var(--lg-strong);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);}
.step h3{font-size:27px;margin-bottom:9px;}
.step p{color:var(--muted);font-size:14.8px;line-height:1.6;margin:0;max-width:34ch;}
.step .when{margin-top:14px;font-family:"Inter",sans-serif;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--brand-deep);text-transform:uppercase;}

/* SERVICES */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:54px;align-items:stretch;}
@media(max-width:880px){.svc-grid{grid-template-columns:1fr;max-width:440px;margin-inline:auto;}}
.plan{position:relative;border-radius:24px;padding:34px 30px;display:flex;flex-direction:column;gap:16px;
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);will-change:transform;}
.plan:hover{transform:translateY(-14px) scale(1.025);box-shadow:var(--lg-sh),0 44px 70px -30px rgba(36,27,16,.55);z-index:3;}
.plan.feat:hover{transform:translateY(-14px) scale(1.06);box-shadow:var(--lg-sh),0 50px 80px -30px rgba(126,90,43,.7);}
.plan.signature:hover{box-shadow:0 50px 80px -28px rgba(20,14,7,.8);}
@media(max-width:880px){.plan:hover,.plan.feat:hover{transform:translateY(-8px);}}
.plan::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 40%);opacity:.8;}
.plan>*{position:relative;z-index:1;}
.plan.feat{background:var(--lg-strong);z-index:2;box-shadow:var(--lg-sh),0 34px 60px -34px rgba(126,90,43,.6);}
.plan.feat::after{content:"";position:absolute;inset:-26px;border-radius:38px;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--brand) 38%,transparent),transparent 78%);filter:blur(10px);}
@media(max-width:880px){.plan.feat{transform:none;}}
.plan .ribbon{position:absolute;top:-12px;left:30px;z-index:3;background:var(--espresso);color:#fff;font-family:"Inter",sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 13px;border-radius:999px;box-shadow:0 10px 24px -12px rgba(36,27,16,.7);}
.plan .pname{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:31px;line-height:1;}
.plan .ptag{font-size:13.5px;color:var(--muted);line-height:1.5;margin-top:-8px;}
.plan .pdiv{height:1px;background:var(--line);margin:2px 0;}
.plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.plan li{display:flex;gap:10px;font-size:14.5px;line-height:1.45;color:var(--muted);}
.plan li b{color:var(--ink);font-weight:700;}
.plan li svg{flex:0 0 auto;width:17px;height:17px;color:var(--brand-deep);margin-top:2px;}
.svc-cta{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:42px;}
.svc-cta .note{color:var(--muted);font-size:14px;max-width:58ch;text-align:center;line-height:1.6;}

/* FAQ */
.faq{max-width:780px;margin:46px auto 0;}
.qa{border-bottom:1px solid var(--line);}
.qa:first-child{border-top:1px solid var(--line);}
.qa summary{list-style:none;cursor:pointer;padding:22px 6px;font-weight:700;font-size:18px;font-family:"Cormorant Garamond",serif;
  display:flex;align-items:center;justify-content:space-between;gap:14px;transition:color .2s;}
.qa summary:hover{color:var(--brand-deep);}
.qa summary::-webkit-details-marker{display:none;}
.qa summary .pm{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--brand-deep);
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);transition:transform .3s var(--ease);}
.qa[open] summary .pm{transform:rotate(45deg);}
.qa .qa-body{padding:0 6px 22px;color:var(--muted);font-size:15px;line-height:1.65;max-width:64ch;}

/* CLOSER */
.closer{text-align:center;}
.closer .wrap{display:flex;flex-direction:column;align-items:center;gap:18px;}
.closer h2{font-size:clamp(34px,5.2vw,62px);line-height:1.04;max-width:18ch;}
.closer h2 em{font-style:italic;color:var(--brand-deep);}
.closer p{color:var(--muted);font-size:clamp(16px,1.7vw,18px);line-height:1.6;max-width:48ch;}

/* ============ PAGE HERO (about / blog) ============ */
.page-hero{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(140px,20vh,200px) clamp(18px,5vw,40px) clamp(20px,4vh,40px);
  text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px;}
.page-hero .tag{justify-content:center;}
.page-hero h1{font-size:clamp(42px,6.4vw,80px);line-height:1.02;letter-spacing:-.01em;max-width:17ch;}
.page-hero h1 em{font-style:italic;color:var(--brand-deep);}
.page-hero p{font-size:clamp(16px,1.8vw,20px);line-height:1.6;color:var(--muted);max-width:58ch;}

/* PROSE (about story / blog post body) */
.prose{max-width:70ch;margin:0 auto;}
.prose>*:first-child{margin-top:0;}
.prose p{font-size:17.5px;line-height:1.85;color:var(--ink);margin:0 0 22px;}
.prose p.lead{font-size:21px;line-height:1.7;color:var(--ink);font-family:"Cormorant Garamond",serif;font-style:italic;}
.prose h2{font-size:clamp(28px,3.6vw,42px);margin:46px 0 16px;}
.prose h3{font-size:25px;margin:34px 0 10px;}
.prose ul,.prose ol{margin:0 0 22px;padding-left:1.25em;color:var(--ink);font-size:17.5px;line-height:1.85;}
.prose li{margin-bottom:8px;}
.prose blockquote{margin:30px 0;padding:6px 0 6px 24px;border-left:3px solid var(--brand);
  font-family:"Cormorant Garamond",serif;font-style:italic;font-size:24px;line-height:1.4;color:var(--ink);}
.prose a{color:var(--brand-deep);text-decoration:underline;text-underline-offset:3px;}
.prose img{max-width:100%;height:auto;border-radius:16px;margin:14px 0;}

/* ABOUT extras */
.about-portrait{max-width:760px;margin:0 auto;border-radius:22px;overflow:hidden;border:1px solid var(--lg-brd);box-shadow:var(--lg-sh),var(--shadow);
  aspect-ratio:16/8;display:grid;place-items:center;background:linear-gradient(140deg,#efe2c6,#e4d0a8);position:relative;}
.about-portrait img{width:120px;height:auto;opacity:.9;}
.about-portrait .ph{position:absolute;bottom:14px;left:0;right:0;text-align:center;font-family:"Inter",sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);}

/* ============ BLOG ============ */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:18px;}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr;}}
.post-card{position:relative;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh);
  transition:transform .3s var(--ease),box-shadow .3s;}
.post-card.linked:hover{transform:translateY(-5px);box-shadow:var(--lg-sh),var(--shadow);}
.post-card .thumb{aspect-ratio:16/10;position:relative;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(140deg,#e9d6b2,#d9bd8c);}
.post-card .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.post-card .thumb .dog{width:74px;opacity:.5;}
.post-card .pc-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:9px;flex:1;}
.post-card .cat{font-family:"Inter",sans-serif;font-weight:800;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);}
.post-card h3{font-size:23px;line-height:1.14;}
.post-card .excerpt{color:var(--muted);font-size:14.5px;line-height:1.6;}
.post-card .pmeta{margin-top:auto;padding-top:8px;color:var(--muted);font-size:12.5px;font-weight:600;display:flex;gap:10px;align-items:center;}
.post-card.soon{opacity:.7;}
.post-card.soon .badge{font-family:"Inter",sans-serif;font-weight:800;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  border:1px solid var(--line-2);border-radius:999px;padding:5px 11px;align-self:flex-start;}

.blog-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:0;border-radius:24px;overflow:hidden;margin-top:18px;
  background:var(--lg-strong);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:var(--lg-sh),var(--shadow);
  transition:transform .3s var(--ease);}
.blog-feature:hover{transform:translateY(-4px);}
@media(max-width:760px){.blog-feature{grid-template-columns:1fr;}}
.blog-feature .bf-img{position:relative;min-height:240px;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(140deg,#e7d2a6,#d5b27e);}
.blog-feature .bf-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.blog-feature .bf-img .dog{width:96px;opacity:.5;}
.blog-feature .bf-body{padding:clamp(26px,4vw,44px);display:flex;flex-direction:column;gap:13px;justify-content:center;}
.blog-feature .cat{font-family:"Inter",sans-serif;font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);display:flex;align-items:center;gap:9px;}
.blog-feature h2{font-size:clamp(26px,3.4vw,40px);line-height:1.06;}
.blog-feature p{color:var(--muted);font-size:15.5px;line-height:1.65;margin:0;}
.blog-feature .pmeta{color:var(--muted);font-size:12.5px;font-weight:600;}
.blog-feature .more{font-family:"Inter",sans-serif;font-weight:700;font-size:14px;color:var(--brand-deep);display:inline-flex;align-items:center;gap:7px;margin-top:4px;}
.blog-feature .more svg{width:16px;height:16px;}

/* BLOG POST article */
.post{max-width:760px;margin:0 auto;padding:clamp(120px,16vh,170px) clamp(18px,5vw,40px) 0;}
.post .back{display:inline-flex;align-items:center;gap:7px;font-family:"Inter",sans-serif;font-weight:700;font-size:13px;color:var(--brand-deep);margin-bottom:24px;}
.post .back svg{width:15px;height:15px;}
.post .post-head{text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:32px;}
.post .post-head .cat{font-family:"Inter",sans-serif;font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);}
.post .post-head h1{font-size:clamp(32px,5vw,58px);line-height:1.04;max-width:20ch;}
.post .post-head .post-meta{color:var(--muted);font-size:13.5px;font-weight:600;display:flex;gap:12px;align-items:center;justify-content:center;}
.post .post-hero{border-radius:18px;overflow:hidden;aspect-ratio:16/9;margin-bottom:40px;border:1px solid var(--lg-brd);box-shadow:var(--lg-sh),var(--shadow);
  display:grid;place-items:center;background:linear-gradient(140deg,#e9d6b2,#d6b585);}
.post .post-hero img{width:100%;height:100%;object-fit:cover;}
.post .post-hero .dog{width:110px;opacity:.5;}

/* FOOTER */
footer{padding:48px clamp(18px,5vw,40px) 40px;max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;border-top:1px solid var(--line);}
footer .fbrand{justify-self:start;display:flex;align-items:center;gap:11px;font-family:"Cormorant Garamond",serif;font-weight:600;font-size:21px;}
footer .fbrand img{height:44px;width:auto;}
footer .fmeta{justify-self:center;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.7;}
footer .fsoc{justify-self:end;display:flex;gap:9px;}
@media(max-width:680px){footer{grid-template-columns:1fr;justify-items:center;text-align:center;}
  footer .fbrand,footer .fmeta,footer .fsoc{justify-self:center;}}
footer .fmeta a{color:var(--brand-deep);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
footer .fsoc a{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--ink);
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);border:1px solid var(--lg-brd);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);transition:all .2s;}
footer .fsoc a:hover{color:var(--brand-deep);transform:translateY(-2px);}
footer .fsoc svg{width:19px;height:19px;}
.copyright{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,5vw,40px) 48px;text-align:center;color:var(--muted);font-size:12.5px;}
.copyright a{color:var(--brand-deep);text-decoration:underline;text-underline-offset:2px;}

/* ============ CONTACT FORM ============ */
.form-wrap{max-width:640px;margin:0 auto;}
.form{display:flex;flex-direction:column;gap:18px;margin-top:8px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media(max-width:560px){.form-row{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:7px;}
.field label{font-family:"Inter",sans-serif;font-weight:700;font-size:13px;color:var(--ink);}
.field label .req{color:var(--brand-deep);}
.field input,.field select,.field textarea{width:100%;font-family:"Inter",sans-serif;font-size:15px;color:var(--ink);
  background:var(--lg);backdrop-filter:var(--lg-blur);-webkit-backdrop-filter:var(--lg-blur);
  border:1px solid var(--lg-brd);border-radius:12px;padding:13px 15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  transition:border-color .2s,box-shadow .2s;}
.field textarea{resize:vertical;min-height:140px;line-height:1.6;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 3px color-mix(in srgb,var(--brand) 32%,transparent);}
.field .hint{font-size:12px;color:var(--muted);}
.captcha{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;}
.captcha .q{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:23px;color:var(--ink);
  background:var(--lg);border:1px solid var(--lg-brd);border-radius:12px;padding:9px 18px;box-shadow:var(--lg-sh);white-space:nowrap;min-height:50px;display:flex;align-items:center;}
.captcha .field{flex:1;min-width:150px;}
.hp{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.form-status{font-size:14.5px;font-weight:600;line-height:1.5;padding:13px 16px;border-radius:12px;display:none;}
.form-status.show{display:block;}
.form-status.ok{color:#2c6a45;background:color-mix(in srgb,#3c7a58 16%,transparent);border:1px solid color-mix(in srgb,#3c7a58 30%,transparent);}
.form-status.err{color:#8f3623;background:color-mix(in srgb,#c0432e 13%,transparent);border:1px solid color-mix(in srgb,#c0432e 30%,transparent);}
.form .btn{align-self:flex-start;}

/* ============ LEGAL / PROSE PAGE ============ */
.legal{max-width:760px;margin:0 auto;padding:clamp(12px,3vh,30px) clamp(18px,5vw,40px) 0;}
.legal .prose p,.legal .prose li{font-size:16px;line-height:1.8;}
.legal .prose h2{font-size:clamp(24px,3vw,34px);}
.legal .updated{color:var(--muted);font-size:13.5px;font-weight:600;margin-bottom:6px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  .reveal{opacity:1;transform:none;}
  .reel .l-sketch,.reel .l-color{opacity:0;} .reel .l-night{opacity:1;}
  .rh-slide{opacity:0;} .rh-slide.active{opacity:1;transform:none;}
}

/* ============================================================
   SIGNATURE UPGRADE — v4 · 3D · parallax · bespoke motion
   ============================================================ */

/* Custom cursor removed — native cursor preserved */
.cursor-dot,.cursor-ring{display:none;}

/* ── Three.js hero canvas ── */
#heroCanvas{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;}
.hero{overflow:hidden;}
.hero-copy{position:relative;z-index:2;}
.stage{position:relative;z-index:1;}

/* ── Marquee ribbon ── */
.marquee-band{
  overflow:hidden;padding:18px 0;
  background:var(--espresso);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);}
.mq-track{
  display:flex;width:max-content;
  animation:marquee 32s linear infinite;}
.mq-track span{
  font-family:"Cormorant Garamond",serif;font-size:17px;font-weight:600;font-style:italic;
  color:rgba(247,234,208,.78);white-space:nowrap;
  padding:0 0;display:inline-flex;align-items:center;gap:0;}
.mq-track span::before{content:"✦";color:var(--brand);font-style:normal;font-size:11px;padding:0 22px;}

/* ── Signature plan card ── */
.plan.signature{
  background:linear-gradient(148deg,#1c130a 0%,#2e1e0e 55%,#1a110a 100%);
  border-color:rgba(199,161,122,.28);color:#f7ead0;
  box-shadow:var(--lg-sh),0 40px 70px -30px rgba(199,161,122,.25),inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease);}
.plan.signature::before{
  background:linear-gradient(160deg,rgba(199,161,122,.12),transparent 42%);opacity:1;}
/* animated gradient border */
.plan.signature::after{
  content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:0;pointer-events:none;
  padding:1px;
  background:linear-gradient(130deg,rgba(199,161,122,.8),rgba(199,161,122,.15) 40%,rgba(199,161,122,.6) 70%,rgba(199,161,122,.15));
  background-size:300% 300%;
  animation:sigBorder 5s ease infinite;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;}
@keyframes sigBorder{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.plan.signature>*{position:relative;z-index:1;}
.plan.signature .pname{color:#f7ead0;}
.plan.signature .ptag{color:rgba(247,234,208,.6);}
.plan.signature li{color:rgba(247,234,208,.82);}
.plan.signature li b{color:#f7ead0;font-weight:700;}
.plan.signature li svg{color:var(--brand);}
.plan.signature .pdiv{background:rgba(255,255,255,.1);}
.sig-ribbon{background:linear-gradient(90deg,var(--brand-deep),var(--brand))!important;color:#fff!important;}
@media(max-width:880px){.plan.signature{transform:none;}}

/* ── word-split heading animation ──
   Each word rises inside an overflow mask. The padding + matching
   negative margins give serif descenders (g, y, p) and italic
   overhangs room so glyphs never get clipped, without moving layout. */
.hw-wrap{display:inline-block;overflow:hidden;vertical-align:bottom;
  padding:.08em .12em .22em .04em;margin:-.08em -.12em -.22em -.04em;}
.hw{display:inline-block;}

/* ── capability card 3D hover ── */
.cap{transform-style:preserve-3d;transition:transform .4s var(--ease),border-color .3s;}

/* ── section parallax depth ── */
.problem,.belief,.capabilities,.work,.process,.services,.faqsec,.closer{position:relative;}

/* ── step connector line animate ── */
.steps::before{transform-origin:left;transition:transform 1.2s var(--ease);}
/* drawn on scroll when GSAP is active (html.fx set by main.js) */
html.fx .steps::before{transform:scaleX(0);}
html.fx .steps.drawn::before{transform:scaleX(1);}

/* ── closer CTA spotlight ── */
.closer{position:relative;overflow:hidden;}
.closer::before{content:"";position:absolute;top:-40%;left:50%;transform:translateX(-50%);
  width:600px;height:600px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--brand) 18%,transparent),transparent);
  filter:blur(40px);animation:pulse 6s ease-in-out infinite;}
.closer .wrap{position:relative;z-index:1;}

/* ── magnetic button override ── */
[data-magnetic]{transition:transform .35s var(--ease),filter .2s,box-shadow .2s!important;}
[data-magnetic]:hover{transform:translateY(-2px)!important;}

/* ============================================================
   SHOWCASE PREVIEWS — animated client-site demos (museum + car wash)
   ============================================================ */
/* two-column layout — matches the case-study frame size, sits off to the side */
.showcase-case{margin-top:clamp(36px,6vh,60px);}
.showcase-case.reverse{grid-template-columns:1.1fr 1fr;}
@media(max-width:900px){.showcase-case.reverse{grid-template-columns:1fr;}}
.showcase-case .frame{box-shadow:var(--lg-sh),0 40px 80px -30px rgba(36,27,16,.55);}
/* right column: the website example with its tags underneath */
.show-col{display:flex;flex-direction:column;gap:18px;}
.show-col .chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.show-col .chips span{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:700;color:var(--brand-deep);
  background:color-mix(in srgb,var(--brand) 16%,transparent);border:1px solid var(--lg-brd);border-radius:999px;padding:7px 14px;}
/* text column sits to the side, left-aligned (not centered) */
.showcase-case .sec-head{text-align:left;align-items:flex-start;margin:0;max-width:none;}
.showcase-case .sec-head .tag{justify-content:flex-start;}
.showcase-case .sec-head p{max-width:46ch;}
.showcase-case .belief-text{text-align:left;}
.showcase-case .belief-text .tag{justify-content:flex-start;margin-bottom:22px;}
.showcase-case .belief-text .pull{margin:0;max-width:18ch;font-size:clamp(30px,4.4vw,52px);}
.showcase-case .belief-text .by{margin:22px 0 0;max-width:42ch;}

/* shared scene chrome */
.scene{position:relative;overflow:hidden;background:#0a0a0c;}
.scene .s-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.scene .s-nav{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;align-items:center;justify-content:space-between;
  padding:clamp(12px,2.4vw,20px) clamp(14px,3vw,26px);}
.scene .s-name{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:clamp(16px,2.6vw,24px);line-height:1;letter-spacing:.02em;display:flex;flex-direction:column;gap:3px;}
.scene .s-name small{font-family:"Inter",sans-serif;font-weight:700;font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;opacity:.72;}
.scene .s-links{display:flex;gap:clamp(10px,2vw,22px);}
.scene .s-links b{font-family:"Inter",sans-serif;font-weight:600;font-size:clamp(9px,1.3vw,12px);letter-spacing:.04em;opacity:.85;}
@media(max-width:560px){.scene .s-links b:nth-child(1){display:none;}}

/* ── MUSEUM (premium · camera glides; centered "now on display" modal) ── */
.gallery{aspect-ratio:4/3;}
.gallery .s-bg{position:absolute;inset:auto;top:0;left:0;width:150%;height:150%;max-width:none;object-fit:cover;
  transform:translate(0,-15%);animation:galleryPan 30s ease-in-out infinite;will-change:transform;}
@keyframes galleryPan{
  0%{transform:translate(0,-14%)}
  25%{transform:translate(-15%,-19%)}
  50%{transform:translate(-30%,-12%)}
  75%{transform:translate(-15%,-19%)}
  100%{transform:translate(0,-14%)}
}
.gallery .g-grade{position:absolute;inset:0;z-index:1;
  background:radial-gradient(125% 105% at 50% 46%,transparent 30%,rgba(5,5,8,.72) 100%),linear-gradient(180deg,rgba(5,5,8,.55),transparent 22%,transparent 60%,rgba(5,5,8,.9));}
.gallery .s-name,.gallery .s-links b{color:#f3ead6;}
.gallery .s-name{text-shadow:0 2px 18px rgba(0,0,0,.6);}

/* bottom-left museum info + opening hours */
.gallery .g-info{position:absolute;left:clamp(14px,3vw,28px);bottom:clamp(14px,5.5%,28px);z-index:6;max-width:38%;}
.gallery .g-eyebrow{display:block;margin-bottom:8px;font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(8px,1.1vw,10.5px);letter-spacing:.2em;text-transform:uppercase;color:#c9a96a;}
.gallery .g-tag{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:clamp(14px,2.1vw,22px);line-height:1.1;color:#f6efe0;margin:6px 0 9px;text-shadow:0 4px 24px rgba(0,0,0,.7);}
.gallery .g-hours{display:inline-flex;align-items:center;gap:8px;font-family:"Inter",sans-serif;font-weight:600;font-size:clamp(8.5px,1.15vw,11.5px);letter-spacing:.03em;color:rgba(246,239,224,.86);}
.gallery .g-hours svg{width:13px;height:13px;flex:0 0 auto;color:#c9a96a;}

/* centered "Now on display" modal — stays under a quarter of the scene */
.gallery .g-modal{position:absolute;top:50%;left:50%;z-index:7;width:clamp(128px,27%,210px);
  background:rgba(13,11,9,.8);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
  border:1px solid rgba(201,169,106,.5);border-radius:7px;overflow:hidden;
  box-shadow:0 34px 80px -22px rgba(0,0,0,.85);
  opacity:0;transform:translate(-50%,-48%) scale(.9);}
/* the exhibit card pops in 3s after the gallery scrolls into view, then gently floats */
.showcase-case.in .g-modal{animation:modalIn .8s cubic-bezier(.2,.85,.3,1) 3s forwards, modalFloat 7s ease-in-out 3.8s infinite;}
@keyframes modalIn{from{opacity:0;transform:translate(-50%,-48%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes modalFloat{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.015)}}
.gallery .g-modal-img{aspect-ratio:4/5;overflow:hidden;}
.gallery .g-modal-img img{width:100%;height:100%;object-fit:cover;display:block;}
.gallery .g-modal-cap{padding:clamp(8px,1.5vw,13px) clamp(10px,1.7vw,15px);text-align:center;border-top:1px solid rgba(201,169,106,.32);}
.gallery .g-modal-k{display:block;font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(7px,.95vw,9px);letter-spacing:.24em;text-transform:uppercase;color:#c9a96a;margin-bottom:4px;}
.gallery .g-modal-cap b{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(13px,1.95vw,18px);color:#fff;line-height:1.12;}
@media(max-width:560px){.gallery .g-modal{width:clamp(96px,30%,150px);}.gallery .g-modal-img{aspect-ratio:1/1;}}

/* ── CAR WASH (immersive / hardworking) ── */
.carwash{aspect-ratio:4/3;}
.carwash .s-bg{animation:cwZoom 16s ease-in-out infinite alternate;}
@keyframes cwZoom{0%{transform:scale(1.04)}100%{transform:scale(1.12)}}
.carwash .c-grade{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(4,16,34,.72),transparent 24%,transparent 40%,rgba(4,14,30,.9)),linear-gradient(90deg,rgba(4,14,30,.55),transparent 30%);}
.carwash .s-name,.carwash .s-links b{color:#eaf4ff;}
.carwash .s-name small{color:#7fc4ff;opacity:1;}
.carwash .c-hero{position:absolute;left:clamp(14px,3vw,28px);top:clamp(48px,12%,82px);z-index:6;}
.carwash .c-eyebrow{font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(8px,1.1vw,10.5px);letter-spacing:.22em;text-transform:uppercase;color:#7fc4ff;}
.carwash .c-title{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:clamp(22px,4.6vw,46px);line-height:1.02;color:#fff;margin:6px 0 0;text-shadow:0 4px 24px rgba(0,0,0,.6);}

/* how it works — stage tracker */
.carwash .c-track{position:absolute;left:clamp(14px,3vw,28px);right:clamp(14px,3vw,28px);bottom:clamp(58px,20%,104px);z-index:6;}
.carwash .c-rail{position:relative;height:6px;border-radius:99px;background:rgba(255,255,255,.18);overflow:visible;}
.carwash .c-fill{position:absolute;left:0;top:0;bottom:0;width:6%;border-radius:99px;
  background:linear-gradient(90deg,#1b6fd6,#38a8ff,#7fe0ff);box-shadow:0 0 14px rgba(56,168,255,.8);animation:cwFill 9s cubic-bezier(.6,.0,.4,1) infinite;}
.carwash .c-car{position:absolute;top:50%;left:6%;width:clamp(26px,4.5vw,40px);height:auto;transform:translate(-50%,-58%);z-index:2;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.5));animation:cwCar 9s cubic-bezier(.6,.0,.4,1) infinite;}
@keyframes cwFill{0%{width:5%}88%{width:100%}100%{width:100%}}
@keyframes cwCar{0%{left:5%}88%{left:100%}100%{left:100%}}
.carwash .c-stages{display:flex;justify-content:space-between;margin-top:12px;gap:4px;}
.carwash .c-stages .st{font-family:"Inter",sans-serif;font-weight:700;font-size:clamp(7.5px,1.15vw,11px);letter-spacing:.03em;color:rgba(234,244,255,.45);
  text-align:center;flex:1;position:relative;padding-top:13px;transition:color .2s;}
.carwash .c-stages .st::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25);}
.carwash .c-stages .st{animation:stPulse 9s linear infinite;}
.carwash .c-stages .st-1{animation-delay:0s}.carwash .c-stages .st-2{animation-delay:1.5s}.carwash .c-stages .st-3{animation-delay:3s}
.carwash .c-stages .st-4{animation-delay:4.5s}.carwash .c-stages .st-5{animation-delay:6s}.carwash .c-stages .st-6{animation-delay:7.5s}
@keyframes stPulse{0%{color:rgba(234,244,255,.45)}3%{color:#bfe6ff}14%{color:#bfe6ff}20%{color:rgba(234,244,255,.45)}100%{color:rgba(234,244,255,.45)}}
@media(max-width:560px){.carwash .c-stages .st:nth-child(3),.carwash .c-stages .st:nth-child(5){display:none;}}

/* services / plans */
.carwash .c-plans{position:absolute;right:clamp(14px,3vw,28px);bottom:clamp(14px,4%,22px);z-index:6;display:flex;gap:8px;}
.carwash .c-plans .pl{font-family:"Inter",sans-serif;font-weight:700;font-size:clamp(8px,1.15vw,11px);color:#eaf4ff;
  display:flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;background:rgba(10,30,60,.5);border:1px solid rgba(127,196,255,.3);backdrop-filter:blur(4px);}
.carwash .c-plans .pl b{font-family:"Cormorant Garamond",serif;font-weight:700;font-size:1.25em;color:#7fe0ff;}
.carwash .c-plans .pl.feat{background:linear-gradient(120deg,#1b6fd6,#38a8ff);border-color:transparent;color:#fff;box-shadow:0 8px 22px -8px rgba(56,168,255,.8);}
.carwash .c-plans .pl.feat b{color:#fff;}
@media(max-width:560px){.carwash .c-plans .pl:not(.feat){display:none;}}

/* reduced-motion: freeze to a clean readable state */
@media (prefers-reduced-motion: reduce){
  .gallery .s-bg{transform:translate(-15%,-16%);}
  .gallery .g-modal{opacity:1;transform:translate(-50%,-50%) scale(1);}
  .carwash .c-fill{width:64%;}.carwash .c-car{left:64%;}
  .carwash .c-stages .st-4{color:#bfe6ff;}
}

/* ============================================================
   HIGH-TECH UPGRADE — v12 · live demo cursors · dashboard demo
   scroll progress · grain · frame tilt · button shine
   ============================================================ */

/* ── film grain (whole site, very subtle) ── */
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size:140px 140px;}

/* ── scroll progress bar (injected by main.js) ── */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:95;pointer-events:none;}
.scroll-progress span{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);
  background:linear-gradient(90deg,var(--brand-deep),var(--brand),#e9c98c);box-shadow:0 0 12px rgba(199,161,122,.55);}

/* ── button shine sweep ── */
.btn{position:relative;overflow:hidden;}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-80%;width:55%;transform:skewX(-24deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transition:left .55s ease;}
.btn:hover::after{left:130%;}

/* ── mockup frames: quick 3D tilt (JS drives transform) ── */
.reveal.in.frame{transition:transform .16s ease-out,opacity .9s var(--ease);will-change:transform;}

/* ── shared "live" pulsing dot ── */
@keyframes ldPulse{0%{box-shadow:0 0 0 0 rgba(62,240,176,.55)}70%{box-shadow:0 0 0 7px rgba(62,240,176,0)}100%{box-shadow:0 0 0 0 rgba(62,240,176,0)}}

/* ════ SIMULATED CURSOR — glides to each demo's CTA and clicks ════ */
.sim-cursor{position:absolute;z-index:9;width:19px;height:19px;opacity:0;pointer-events:none;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.55));}
.sim-cursor svg{width:100%;height:100%;display:block;}
.rh-slide.active .sim-cursor{animation:simGlide 4.2s ease-in-out .1s both;}
@keyframes simGlide{
  0%,36%{opacity:0;transform:translate(52px,-64px)}
  46%{opacity:1}
  60%{transform:translate(0,0)}
  64%{transform:translate(0,0) scale(.8)}
  69%{transform:translate(0,0) scale(1)}
  88%{opacity:1;transform:translate(0,0)}
  100%{opacity:0;transform:translate(6px,10px)}
}
.sim-cursor::after{content:"";position:absolute;left:-7px;top:-7px;width:32px;height:32px;border-radius:50%;
  border:2px solid rgba(255,255,255,.9);opacity:0;transform:scale(.3);}
.rh-slide.active .sim-cursor::after{animation:simRipple 4.2s ease-out .1s both;}
@keyframes simRipple{0%,62%{opacity:0;transform:scale(.3)}66%{opacity:.9;transform:scale(.55)}82%{opacity:0;transform:scale(1.7)}100%{opacity:0}}
/* the clicked button presses down in sync */
.rh-slide.active .sim-target{animation:simPress 4.2s ease .1s both;}
@keyframes simPress{0%,62%{transform:scale(1);filter:brightness(1)}66%{transform:scale(.93);filter:brightness(1.35)}72%,100%{transform:scale(1);filter:brightness(1)}}
/* per-slide landing spots (tip of the arrow lands on the CTA center) */
.s-barber .sim-cursor{left:calc(50% - 5px);bottom:24.5%;}
.s-plumb  .sim-cursor{left:16.5%;bottom:16%;}
.s-travel .sim-cursor{left:18.8%;bottom:17.3%;}
.s-gym    .sim-cursor{left:14%;bottom:13.3%;}

/* ════ HERO SLIDE MICRO-UI ════ */
/* barbershop: booking slots pop in */
.s-barber .slots{display:flex;align-items:center;gap:7px;margin:-2px 0 0;}
.s-barber .slots .sl-l{font-family:"Inter",sans-serif;font-size:8.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,231,210,.6);}
.s-barber .slots .sl{font-family:"Inter",sans-serif;font-size:10.5px;font-weight:700;color:#e9c98c;
  border:1px solid rgba(233,201,140,.45);border-radius:999px;padding:4px 10px;opacity:0;transform:translateY(8px);}
.s-barber.active .slots .sl{animation:slotIn .5s var(--ease) forwards;}
.s-barber.active .slots .sl:nth-child(2){animation-delay:.85s}
.s-barber.active .slots .sl:nth-child(3){animation-delay:1.0s}
.s-barber.active .slots .sl:nth-child(4){animation-delay:1.15s}
@keyframes slotIn{to{opacity:1;transform:none}}

/* plumbing: live dispatch badge */
.s-plumb .live-badge{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;color:#2563c0;letter-spacing:.02em;
  background:rgba(47,111,214,.1);border:1px solid rgba(47,111,214,.28);border-radius:999px;padding:5px 11px;}
.live-dot{width:7px;height:7px;border-radius:50%;background:#21a862;flex:0 0 auto;animation:ldPulse 1.8s infinite;}

/* travel: rotating destination deals */
.s-travel .dests{position:relative;display:block;height:15px;overflow:visible;}
.s-travel .dests b{position:absolute;left:0;top:0;font-family:"Inter",sans-serif;font-size:10.5px;font-weight:700;color:#875c14;white-space:nowrap;opacity:0;}
.s-travel.active .dests b{animation:destCycle 4.2s linear infinite;}
.s-travel.active .dests .d2{animation-delay:1.4s}
.s-travel.active .dests .d3{animation-delay:2.8s}
@keyframes destCycle{0%{opacity:0;transform:translateY(6px)}5%,28%{opacity:1;transform:none}33%,100%{opacity:0;transform:translateY(-4px)}}

/* gym: live member counter + EKG pulse */
.s-gym .gym-live{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  font-family:"Inter",sans-serif;font-size:10.5px;font-weight:700;color:#f0eefb;
  background:rgba(20,17,31,.66);border:1px solid rgba(198,242,79,.35);border-radius:999px;padding:6px 12px;
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
.s-gym .gym-live b{color:#c6f24f;}
.s-gym .gym-live .ekg{width:32px;height:13px;flex:0 0 auto;}
.s-gym .gym-live .ekg path{stroke:#c6f24f;stroke-width:1.6;fill:none;stroke-linejoin:round;
  stroke-dasharray:34 30;stroke-dashoffset:64;}
.s-gym.active .gym-live .ekg path{animation:ekg 2s linear infinite;}
@keyframes ekg{to{stroke-dashoffset:-64}}

/* ════ NORTHSTAR — analytics dashboard demo (5th hero slide) ════ */
.s-dash{background:radial-gradient(120% 140% at 85% -10%,#123042 0%,#0a1620 46%,#070d13 100%);color:#dff3f5;
  display:flex;flex-direction:column;gap:clamp(8px,1.6vw,13px);
  padding:clamp(12px,2.4vw,20px) clamp(14px,3vw,24px) calc(28px + clamp(10px,2%,16px));}
.s-dash .dash-gridlines{position:absolute;inset:0;z-index:0;opacity:.55;
  background-image:linear-gradient(rgba(85,220,205,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(85,220,205,.055) 1px,transparent 1px);
  background-size:34px 34px;}
.s-dash::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 42%,rgba(88,231,214,.07) 50%,transparent 58%);transform:translateX(-100%);}
.s-dash.active::before{animation:dashSweep 4.2s ease-in-out infinite;}
@keyframes dashSweep{to{transform:translateX(100%)}}
.s-dash>*{position:relative;z-index:2;}
.s-dash .dash-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.s-dash .d-logo{display:inline-flex;align-items:center;gap:7px;font-family:"Inter",sans-serif;font-weight:800;font-size:11px;letter-spacing:.22em;}
.s-dash .d-logo i{width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#39d5c8,#1e9cd7);}
.s-dash .d-nav{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:600;letter-spacing:.05em;color:rgba(223,243,245,.55);}
.s-dash .d-live{display:inline-flex;align-items:center;gap:6px;font-family:"Inter",sans-serif;font-size:9px;font-weight:800;letter-spacing:.18em;color:#3ef0b0;}
.s-dash .d-live i{width:7px;height:7px;border-radius:50%;background:#3ef0b0;animation:ldPulse 1.6s infinite;}
.s-dash .dash-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(6px,1.2vw,10px);}
.s-dash .kpi{background:rgba(13,32,44,.72);border:1px solid rgba(88,231,214,.16);border-radius:10px;
  padding:clamp(7px,1.4vw,11px) clamp(8px,1.6vw,13px);display:flex;flex-direction:column;gap:2px;
  opacity:0;transform:translateY(10px);}
.s-dash.active .kpi{animation:kpiIn .55s var(--ease) forwards;}
.s-dash.active .kpi:nth-child(2){animation-delay:.14s}
.s-dash.active .kpi:nth-child(3){animation-delay:.28s}
@keyframes kpiIn{to{opacity:1;transform:none}}
.s-dash .kpi small{font-family:"Inter",sans-serif;font-size:8.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(223,243,245,.5);}
.s-dash .kpi b{font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(13px,2.2vw,19px);color:#eafcfd;line-height:1.15;font-variant-numeric:tabular-nums;}
.s-dash .kpi .up{font-family:"Inter",sans-serif;font-size:9px;font-weight:700;color:#3ef0b0;}
.s-dash .dash-chart{flex:1;min-height:0;border:1px solid rgba(88,231,214,.14);border-radius:10px;
  background:rgba(10,25,35,.6);overflow:hidden;padding:6px;}
.s-dash .dash-chart svg{width:100%;height:100%;display:block;}
.s-dash .dash-chart .line{stroke:#39d5c8;stroke-width:2;stroke-linecap:round;fill:none;
  stroke-dasharray:520;stroke-dashoffset:520;filter:drop-shadow(0 0 6px rgba(57,213,200,.7));}
.s-dash.active .dash-chart .line{animation:chartDraw 2.4s cubic-bezier(.5,0,.3,1) .35s forwards;}
@keyframes chartDraw{to{stroke-dashoffset:0}}
.s-dash .dash-chart .area{opacity:0;}
.s-dash.active .dash-chart .area{animation:areaIn 1.2s ease 1.5s forwards;}
@keyframes areaIn{to{opacity:1}}
.s-dash .dash-bars{display:flex;align-items:flex-end;gap:5px;height:clamp(18px,4vw,28px);}
.s-dash .dash-bars span{flex:1;height:100%;border-radius:3px 3px 0 0;opacity:.92;
  background:linear-gradient(180deg,#2fd3c4,#14607f);transform:scaleY(.08);transform-origin:bottom;--h:.5;}
.s-dash.active .dash-bars span{animation:barGrow .8s var(--ease) forwards;}
.s-dash .dash-bars span:nth-child(1){--h:.42}
.s-dash .dash-bars span:nth-child(2){--h:.60;animation-delay:.06s}
.s-dash .dash-bars span:nth-child(3){--h:.48;animation-delay:.12s}
.s-dash .dash-bars span:nth-child(4){--h:.78;animation-delay:.18s}
.s-dash .dash-bars span:nth-child(5){--h:.64;animation-delay:.24s}
.s-dash .dash-bars span:nth-child(6){--h:.88;animation-delay:.30s}
.s-dash .dash-bars span:nth-child(7){--h:1;animation-delay:.36s}
@keyframes barGrow{to{transform:scaleY(var(--h))}}
@media(max-width:560px){.s-dash .d-nav{display:none;}}

/* ════ MUSEUM — light sweep · open-now badge · ticket button ════ */
.gallery .g-sweep{position:absolute;inset:0;z-index:5;pointer-events:none;
  background:linear-gradient(105deg,transparent 44%,rgba(255,236,200,.075) 50%,transparent 56%);
  transform:translateX(-120%);animation:gSweep 9s ease-in-out infinite;}
@keyframes gSweep{0%,55%{transform:translateX(-120%)}90%,100%{transform:translateX(120%)}}
.gallery .g-open{display:inline-flex;align-items:center;gap:6px;margin-bottom:7px;
  font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(8px,1vw,9.5px);letter-spacing:.18em;text-transform:uppercase;color:#7ee2a8;}
.gallery .g-open i{width:7px;height:7px;border-radius:50%;background:#3ef08a;animation:ldPulse 1.8s infinite;}
.gallery .g-tickets{position:absolute;right:clamp(14px,3vw,28px);bottom:clamp(14px,5.5%,28px);z-index:7;
  font-style:normal;font-family:"Inter",sans-serif;font-size:clamp(9px,1.2vw,11.5px);font-weight:700;letter-spacing:.06em;color:#14100a;
  background:linear-gradient(120deg,#e3bd7a,#c9a96a);padding:9px 16px;border-radius:999px;overflow:hidden;
  box-shadow:0 12px 30px -12px rgba(201,169,106,.85);}
.gallery .g-tickets::after{content:"";position:absolute;top:0;bottom:0;left:-70%;width:50%;transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:tkShine 3.6s ease-in-out infinite;}
@keyframes tkShine{0%,55%{left:-70%}90%,100%{left:130%}}
@media(max-width:560px){.gallery .g-tickets{padding:7px 12px;}}

/* ════ CAR WASH — foam bubbles · live wash counter ════ */
.carwash .c-bubbles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;}
.carwash .c-bubbles span{position:absolute;bottom:-16px;border-radius:50%;opacity:0;
  background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.85),rgba(190,230,255,.25) 62%,transparent 72%);
  animation:bubbleUp 7s linear infinite;}
@keyframes bubbleUp{0%{opacity:0;transform:translateY(0) translateX(0) scale(.7)}8%{opacity:.85}55%{transform:translateY(-230px) translateX(8px) scale(1)}88%{opacity:.45}100%{opacity:0;transform:translateY(-430px) translateX(-6px) scale(1.15)}}
.carwash .c-bubbles span:nth-child(1){left:6%;width:9px;height:9px;animation-delay:0s;animation-duration:6.4s}
.carwash .c-bubbles span:nth-child(2){left:14%;width:6px;height:6px;animation-delay:2.1s;animation-duration:7.6s}
.carwash .c-bubbles span:nth-child(3){left:23%;width:12px;height:12px;animation-delay:4.4s;animation-duration:6.8s}
.carwash .c-bubbles span:nth-child(4){left:32%;width:7px;height:7px;animation-delay:1.2s;animation-duration:8.2s}
.carwash .c-bubbles span:nth-child(5){left:41%;width:10px;height:10px;animation-delay:3.6s;animation-duration:7s}
.carwash .c-bubbles span:nth-child(6){left:52%;width:6px;height:6px;animation-delay:5.3s;animation-duration:6.2s}
.carwash .c-bubbles span:nth-child(7){left:61%;width:13px;height:13px;animation-delay:.7s;animation-duration:8.6s}
.carwash .c-bubbles span:nth-child(8){left:70%;width:8px;height:8px;animation-delay:2.9s;animation-duration:6.6s}
.carwash .c-bubbles span:nth-child(9){left:78%;width:10px;height:10px;animation-delay:4.9s;animation-duration:7.4s}
.carwash .c-bubbles span:nth-child(10){left:86%;width:7px;height:7px;animation-delay:1.8s;animation-duration:7.9s}
.carwash .c-bubbles span:nth-child(11){left:93%;width:11px;height:11px;animation-delay:3.2s;animation-duration:6.9s}
.carwash .c-bubbles span:nth-child(12){left:47%;width:5px;height:5px;animation-delay:6s;animation-duration:7.2s}
.carwash .c-live{position:absolute;right:clamp(14px,3vw,28px);top:clamp(48px,12%,82px);z-index:6;
  display:inline-flex;align-items:center;gap:8px;font-family:"Inter",sans-serif;font-weight:700;font-size:clamp(8px,1.1vw,10.5px);color:#eaf4ff;
  background:rgba(10,30,60,.55);border:1px solid rgba(127,196,255,.3);border-radius:999px;padding:7px 12px;
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
.carwash .c-live i{width:7px;height:7px;border-radius:50%;background:#3ef0b0;flex:0 0 auto;animation:ldPulse 1.8s infinite;}
.carwash .c-live b{color:#7fe0ff;font-size:1.15em;font-variant-numeric:tabular-nums;}
@media(max-width:560px){.carwash .c-live{display:none;}}

/* ════ DOWNTOWN REEL — animated phase tracker ════ */
.phase-lbl{display:inline-flex;gap:12px;}
.phase-lbl .ph{display:inline-flex;align-items:center;gap:6px;opacity:.4;font-weight:700;}
.phase-lbl .ph::before{content:"";width:6px;height:6px;border-radius:50%;background:#ffd9a0;box-shadow:0 0 8px rgba(255,217,160,.8);}
.phase-lbl .ph-1{animation:ph1 12s ease-in-out infinite;}
.phase-lbl .ph-2{animation:ph2 12s ease-in-out infinite;}
.phase-lbl .ph-3{animation:ph3 12s ease-in-out infinite;}
@keyframes ph1{0%,16%{opacity:1}24%,88%{opacity:.4}96%,100%{opacity:1}}
@keyframes ph2{0%,20%{opacity:.4}30%,52%{opacity:1}62%,100%{opacity:.4}}
@keyframes ph3{0%,64%{opacity:.4}72%,86%{opacity:1}96%,100%{opacity:.4}}

/* ── reduced motion: freeze everything new at a readable state ── */
@media (prefers-reduced-motion: reduce){
  .sim-cursor,.carwash .c-bubbles,.gallery .g-sweep{display:none;}
  .s-dash .kpi{opacity:1;transform:none;}
  .s-dash .dash-chart .line{stroke-dashoffset:0;}
  .s-dash .dash-chart .area{opacity:1;}
  .s-dash .dash-bars span{transform:scaleY(var(--h));}
  .s-barber .slots .sl{opacity:1;transform:none;}
  .s-travel .dests .d1{opacity:1;}
  .phase-lbl .ph{opacity:1;}
  body::after{display:none;}
}