@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/host-grotesk-400.woff2) format('woff2')}
@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/host-grotesk-500.woff2) format('woff2')}
@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/host-grotesk-600.woff2) format('woff2')}
:root{--ink:#241F1A;--muted:#5A5044;--body:#3A332B;--paper:#F8F0E5;--card:#FFFDF8;--liq:#2E2822;--cream:#FCF1D7;--line:rgba(36,31,26,0.12);--gut:96px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:'Host Grotesk',system-ui,-apple-system,sans-serif;background-color:var(--paper);
 background-image:radial-gradient(rgba(255,255,255,0.95) 1px,transparent 1.5px),radial-gradient(rgba(150,100,60,0.18) 0.7px,transparent 1.2px);
 background-size:22px 22px,44px 44px;background-position:11px 11px,22px 22px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.tint::before{content:"";position:absolute;left:0;right:0;top:0;height:900px;background:linear-gradient(180deg,rgba(236,85,96,0.20),rgba(236,85,96,0));pointer-events:none;z-index:-1}
a{color:inherit}
img,svg{max-width:none}
.wrap{max-width:1440px;margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px;top:8px;background:var(--card);padding:8px 14px;border-radius:12px;z-index:10}
.skip:focus{left:12px}
:focus-visible{outline:2px solid #C83542;outline-offset:3px;border-radius:8px}
h1,h2,h3{font-weight:500;margin:0}
p{margin:0}
.h2{font-size:72px;line-height:0.98;letter-spacing:-0.05em}
/* nav */
.nav{display:flex;justify-content:space-between;align-items:center;height:96px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand span{font-size:28px;font-weight:500;letter-spacing:-0.04em}
.navr{display:flex;align-items:center;gap:36px}
.navr .lnk{font-size:16px;font-weight:500;text-decoration:none}
.pill{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:22px;background:var(--liq);color:var(--cream);
 text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap;box-shadow:inset 6px 6px 10px rgba(255,255,255,0.12),inset -6px -8px 12px rgba(0,0,0,0.4)}
/* store */
.store{display:flex;flex-direction:column;align-items:flex-start}
.store.center{align-items:center;text-align:center}
.storebtn{display:inline-flex;flex-direction:column;justify-content:center;height:64px;padding:0 30px;border-radius:18px;background:var(--liq);color:var(--cream);text-decoration:none;
 box-shadow:inset 6px 6px 10px rgba(255,255,255,0.12),inset -6px -8px 12px rgba(0,0,0,0.4)}
.storebtn small{font-size:13px;line-height:1.1;opacity:0.8}
.storebtn b{font-size:24px;line-height:1.1;font-weight:500;letter-spacing:-0.02em}
.storebtn.soon{opacity:0.92;cursor:default}
.store p{margin-top:12px;font-size:14px;line-height:1.45;color:var(--muted);max-width:420px}
/* hero */
.hero{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:48px 0 96px}
.hero-text{display:flex;flex-direction:column;gap:28px;max-width:640px}
.eyebrow{font-size:17px;font-weight:500;color:var(--muted)}
.hero h1{font-size:108px;line-height:0.92;letter-spacing:-0.055em}
.hero .sub{font-size:22px;line-height:1.45;color:var(--body);max-width:540px}
.art{position:relative;width:520px;height:520px;flex-shrink:0}
.card{background:var(--card);border-radius:20px;box-shadow:0 14px 30px rgba(60,40,20,0.12)}
/* beats */
.sec{padding:72px 0}
.beats{display:flex;gap:20px;margin-top:40px}
.beat{flex:1;border-radius:32px;background:var(--card);padding:36px;display:flex;flex-direction:column;gap:16px}
.beat h3{font-size:32px;letter-spacing:-0.045em;line-height:1}
.beat p{font-size:18px;line-height:1.5;color:var(--body)}
.chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:40px}
.chips .lab{font-size:17px;font-weight:500;color:var(--muted);margin-right:6px}
.chip{height:44px;padding:0 18px;border-radius:22px;background:var(--card);border:1px solid rgba(36,31,26,0.08);display:inline-flex;align-items:center;font-size:16px;font-weight:500}
/* tour */
.tour{display:flex;gap:96px;align-items:center;padding:80px 0}
.tour-l{flex:1;display:flex;flex-direction:column;gap:28px}
.lead{font-size:20px;line-height:1.5;color:var(--body);max-width:520px}
.tabs{display:flex;flex-direction:column}
.tab{all:unset;display:flex;gap:18px;cursor:pointer;padding:18px 0;border-top:1px solid rgba(36,31,26,0.10)}
.tab:focus-visible{outline:2px solid #C83542;outline-offset:2px}
.tab .bar{width:3px;border-radius:2px;background:rgba(36,31,26,0.12);flex-shrink:0}
.tab .tt{display:flex;flex-direction:column;gap:8px}
.tab .t{font-size:26px;font-weight:500;letter-spacing:-0.03em;color:rgba(36,31,26,0.6)}
.tab .d{display:none;font-size:18px;line-height:1.5;color:var(--body);max-width:420px}
.tab[aria-selected=true] .t{color:var(--ink)}
.tab[aria-selected=true] .d{display:block}
.tab[aria-selected=true] .bar{background:var(--ink)}
.stage{width:460px;height:760px;border-radius:48px;background:rgba(255,253,248,0.6);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.stage .panel[hidden]{display:none}
.phone{box-sizing:border-box;background:#1E1915;box-shadow:0 30px 60px rgba(60,40,20,0.22);flex-shrink:0}
.tour-m{display:none}
/* privacy band */
.band{margin:48px 0;border-radius:48px;background:var(--liq);color:var(--cream);padding:72px;display:flex;flex-direction:column;gap:44px;position:relative;overflow:hidden}
.band .h2{max-width:760px;position:relative}
.band .pts{display:flex;gap:48px;position:relative}
.band .pt{flex:1;display:flex;flex-direction:column;gap:10px}
.band .pt b{font-size:24px;font-weight:500;letter-spacing:-0.03em}
.band .pt span{font-size:17px;line-height:1.5;opacity:0.76}
.band a{font-size:16px;font-weight:500;text-underline-offset:4px;position:relative;align-self:flex-start}
.band .deco{position:absolute;right:-40px;top:-50px;opacity:0.9}
/* who */
.who{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:32px}
.who div{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1px solid rgba(36,31,26,0.14)}
.who b{font-size:26px;font-weight:500;letter-spacing:-0.035em}
.who span{font-size:17px;line-height:1.5;color:var(--body)}
/* note */
.note{padding:88px 0;display:flex;gap:72px;align-items:flex-start}
.note .h{flex-shrink:0;width:300px}
.note .h h2{font-size:40px;line-height:0.98;letter-spacing:-0.05em}
.note .b{display:flex;flex-direction:column;gap:22px;max-width:760px}
.note .b p{font-size:28px;line-height:1.4;letter-spacing:-0.02em}
.sign{display:flex;align-items:center;gap:16px;margin-top:8px}
.sign img{width:72px;height:72px;border-radius:50%;object-fit:cover;flex-shrink:0}
.sign b{font-size:18px;font-weight:500;display:block}
.sign span{font-size:14px;color:var(--muted)}
/* end */
.end{display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;padding:64px 0 0}
.end h2{font-size:88px;line-height:0.98;letter-spacing:-0.05em}
.end p.l{font-size:20px;line-height:1.5;color:var(--body);max-width:560px}
/* footer */
footer{margin-top:120px;padding:48px 0 56px;display:flex;justify-content:space-between;gap:48px}
footer .fl{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--muted)}
footer .cols{display:grid;grid-template-columns:repeat(2,auto);gap:64px;justify-content:start}
footer .col{display:flex;flex-direction:column;gap:12px}
footer .col span{font-size:14px;font-weight:500;color:var(--muted)}
footer .col a{font-size:16px;text-decoration:none}
footer .col a:hover,.navr .lnk:hover{text-decoration:underline;text-underline-offset:4px}
/* text pages */
.tp{display:flex;gap:96px;padding:56px 0 0;align-items:flex-start}
.tp-l{display:flex;flex-direction:column;gap:18px;width:380px;flex-shrink:0;position:sticky;top:32px}
.tp-l h1{font-size:96px;line-height:0.92;letter-spacing:-0.055em}
.tp-l p{font-size:20px;line-height:1.45;color:var(--body)}
.tp-l .upd{font-size:14px;color:var(--muted)}
.tp-r{flex:1;min-width:0;max-width:760px;display:flex;flex-direction:column;gap:36px}
.ls{display:flex;flex-direction:column;gap:12px;padding-top:28px;border-top:1px solid var(--line)}
.ls h2{font-size:26px;letter-spacing:-0.03em}
.ls p{font-size:18px;line-height:1.6;color:var(--body)}
.grp{display:flex;flex-direction:column}
.grp>span{font-size:15px;font-weight:500;color:var(--muted);padding-bottom:12px}
details{border-top:1px solid var(--line);padding:22px 0}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:22px;font-weight:500;letter-spacing:-0.02em}
summary::-webkit-details-marker{display:none}
summary i{font-style:normal;font-size:22px;color:var(--muted);transition:transform .2s}
details[open] summary i{transform:rotate(45deg)}
details p{margin:14px 0 0;font-size:18px;line-height:1.6;color:var(--body);max-width:680px}
.ask{border-radius:28px;background:var(--card);padding:24px 26px;display:flex;gap:14px;justify-content:space-between;align-items:center}
.ask b{font-size:18px;font-weight:500}
.scards{display:flex;gap:12px}
.scard{flex:1;border-radius:28px;background:var(--card);padding:24px;display:flex;flex-direction:column;gap:10px}
.scard h3{font-size:22px;letter-spacing:-0.03em}
.scard p{font-size:16px;line-height:1.55;color:var(--body)}
.press{display:flex;flex-direction:column;gap:18px;padding-top:40px}
.press .h2{font-size:56px}
.press>p{font-size:20px;line-height:1.5;color:var(--body)}
.fact{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:16px}
.fact span{color:var(--muted)}
.fact b{font-weight:500;text-align:right}
.e404{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center;padding:64px 0}
.e404 h1{font-size:72px;letter-spacing:-0.05em;line-height:0.95}
.e404 p{font-size:18px;color:var(--body)}

/* audit: 44pt tap targets */
.navr .lnk{display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
.brand{min-height:44px}
footer .col{gap:0}
footer .col span{padding-bottom:4px}
footer .col a{display:inline-flex;align-items:center;min-height:44px}
summary{min-height:44px}
.band a{display:inline-flex;align-items:center;min-height:44px}
.skip{min-height:44px;display:inline-flex;align-items:center}
/* audit: one moment of motion at a time. squishes play a few times when they come into view */
.knead.once{animation-iteration-count:3;animation-play-state:paused}
.knead.once.in{animation-play-state:running}
/* motion */
@keyframes knead{0%{transform:scale(1,1) rotate(0)}18%{transform:scale(1.08,.9) rotate(-2.5deg)}38%{transform:scale(.94,1.07) rotate(2deg)}58%{transform:scale(1.05,.93) rotate(-1deg)}78%{transform:scale(.97,1.04) rotate(1deg)}100%{transform:scale(1,1) rotate(0)}}
.knead{animation:knead 2.4s ease-in-out infinite;transform-origin:50% 92%}
.k1{animation-duration:2.6s;animation-delay:-.4s}.k2{animation-duration:2.9s;animation-delay:-1.3s}.k3{animation-duration:2.3s;animation-delay:-2s}
@keyframes ring{0%{transform:scale(.85);opacity:.5}100%{transform:scale(1.35);opacity:0}}
.ring{animation:ring 1.8s ease-out infinite}.ring2{animation-delay:.9s}
@keyframes gdot{0%,80%,100%{opacity:.18}40%{opacity:1}}.gd span{animation:gdot 1.4s infinite both}.gd span:nth-child(2){animation-delay:.2s}.gd span:nth-child(3){animation-delay:.4s}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-8px) rotate(4deg)}}.bob{animation:bob 2.2s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.knead,.ring,.gd span,.bob{animation:none}html{scroll-behavior:auto}}
/* tablet and phone */
@media (max-width:1180px){
 :root{--gut:48px}
 .hero h1{font-size:84px}.art{zoom:0.82}
 .tour{gap:48px}
}
@media (max-width:900px){
 :root{--gut:20px}
 .h2{font-size:42px}
 .nav{height:76px}.brand span{font-size:24px}.navr{gap:18px}.navr .lnk{font-size:15px}
 .hero{flex-direction:column;align-items:stretch;gap:12px;padding:20px 0 48px}
 .hero-text{gap:20px}.eyebrow{font-size:15px}.hero h1{font-size:58px}.hero .sub{font-size:18px}
 .art{zoom:0.66;align-self:center}
 .storebtn{height:60px;padding:0 26px}.storebtn b{font-size:22px}
 .sec{padding:40px 0}.beats{flex-direction:column;gap:12px;margin-top:24px}.beat{padding:26px}.beat h3{font-size:28px}.beat p{font-size:16px}
 .chips{margin-top:24px}.chips .lab{font-size:15px}.chip{height:38px;padding:0 14px;font-size:14px}
 .tour{display:none}
 .tour-m{display:flex;flex-direction:column;gap:22px;padding:40px 0}
 .tour-m .lead{font-size:17px}
 .rail{display:flex;gap:16px;overflow-x:auto;margin:0 calc(-1 * var(--gut));padding:4px 50px 8px;scroll-snap-type:x mandatory;scrollbar-width:none}
 .rail::-webkit-scrollbar{display:none}
 .slide{scroll-snap-align:center;flex-shrink:0;width:290px;display:flex;flex-direction:column;gap:16px;align-items:center}
 .slide .ph{width:290px;padding:24px 0;border-radius:36px;background:rgba(255,253,248,0.6);display:flex;justify-content:center}
 .slide>b{font-size:19px;font-weight:500;letter-spacing:-0.02em;text-align:center}
 .slide>span{font-size:15px;line-height:1.45;color:var(--body);text-align:center}
 .dots{display:flex;gap:6px;justify-content:center}
 .dots i{width:6px;height:6px;border-radius:3px;background:rgba(36,31,26,0.2);transition:width .2s,background .2s}
 .dots i.on{width:18px;background:var(--ink)}
 .band{margin:32px 0;border-radius:32px;padding:36px 26px;gap:28px}.band .pts{flex-direction:column;gap:24px}.band .pt b{font-size:21px}.band .pt span{font-size:16px}
 .band .deco{right:-110px;top:-90px;zoom:0.68;opacity:0.75}
 .who{grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.who b{font-size:22px}.who span{font-size:16px}
 .note{flex-direction:column;gap:24px;padding:44px 0}.note .h{width:auto}.note .h h2{font-size:32px}.note .b p{font-size:21px}
 .end{padding:32px 0 0}.end h2{font-size:46px}.end p.l{font-size:17px}.end .tg{zoom:0.8}
 footer{flex-direction:column;margin-top:72px;padding:36px 0 40px;gap:32px}footer .cols{gap:48px}
 .tp{flex-direction:column;gap:36px;padding:16px 0 0}.tp-l{width:auto;position:static}.tp-l h1{font-size:58px}.tp-l p{font-size:17px}
 .tp-r{gap:28px}.ls{padding-top:22px}.ls h2{font-size:22px}.ls p{font-size:16px}
 details{padding:18px 0}summary{font-size:18px}details p{font-size:16px}
 .ask{flex-direction:column;align-items:flex-start}
 .scards{flex-direction:column}.press{padding-top:20px}.press .h2{font-size:40px}.press>p{font-size:17px}
 .e404 h1{font-size:46px}
}
