/* the new header + "last call" footer, for pages that keep their own inside styles (journal, shop, playroom) */
:root{
  --espresso:#22130e; --cocoa:#4a2f24; --mocha:#7a5444; --latte:#b8977e;
  --cream:#f4e8d4; --paper:#fbf4e7; --burgundy:#6b1424; --wine:#3f0a14;
  --blush:#e8a3b1; --butter:#f1d06e; --brass:#c9a24f; --ink:#2a1812; --ink-soft:#5b4136;
  --red:#c8202e; --pen:#b3263a;
  --f-display:"Gloock","Bodoni 72",Didot,Georgia,serif;
  --f-serif:"Instrument Serif","Cormorant Garamond",Georgia,serif;
  --f-body:"Jost","Futura","Avenir Next",system-ui,sans-serif;
  --f-hand:"Caveat","Bradley Hand","Segoe Print",cursive;
  --f-mono:"Space Mono",ui-monospace,Menlo,Consolas,monospace;
  --f-news:"Anton","Impact","Arial Narrow",sans-serif;
  --gutter:clamp(18px,4vw,56px);
  --ease:cubic-bezier(.22,.8,.2,1);
  --spring:cubic-bezier(.3,1.35,.4,1);
}

.w-bridge{padding-top:76px}
.w-bridge .skip{position:absolute;left:-999px}
/* ── header ─────────────────────────────── */
.w-top{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:calc(14px + env(safe-area-inset-top,0px)) var(--gutter) 14px;transition:background .4s,backdrop-filter .4s;color:var(--cream)}
.w-top.solid{background:rgba(34,19,14,.95)}
.w-mark{font:400 22px/1 var(--f-display);text-decoration:none;white-space:nowrap}
.w-mark i{font-family:var(--f-serif);color:var(--blush)}
.w-nav{display:flex;gap:clamp(12px,2.4vw,30px);align-items:center;font:500 13px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase}
.w-nav a{text-decoration:none;opacity:.85}
.w-nav a:hover,.w-nav a[aria-current]{opacity:1;color:var(--butter)}
.w-nav .w-cta{border:1px solid var(--butter);color:var(--butter);border-radius:99px;padding:9px 14px;opacity:1}
@media (max-width:640px){.w-nav a:not(.w-cta){display:none}.w-mark{font-size:19px}}

/* ── last call (footer) ─────────────────── */
.w-last{position:relative;padding:clamp(90px,10vw,150px) var(--gutter) 40px;background:linear-gradient(180deg,rgba(63,10,20,.7),rgba(34,19,14,.96)),url(/assets/velvet.jpg) center/cover;overflow:hidden}
.w-last-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.4fr) minmax(0,.9fr);gap:clamp(20px,4vw,50px);align-items:center}
.w-last-title{font-family:var(--f-display);font-size:clamp(64px,9vw,150px);margin-top:14px;letter-spacing:-.02em}
.w-last-sub{margin-top:14px}
.w-last-actions{margin-top:30px;display:grid;gap:18px;justify-items:start}
.w-email{display:grid;gap:4px;text-align:left;border:0;background:var(--butter);color:var(--wine)!important;border-radius:6px;padding:14px 20px;box-shadow:0 14px 30px rgba(0,0,0,.35)}
.w-email span{font:400 clamp(18px,2vw,24px)/1.1 var(--f-display)}
.w-email small{font:600 10px/1 var(--f-body);letter-spacing:.2em;text-transform:uppercase}
.w-links{display:flex;flex-wrap:wrap;gap:16px;font:500 13px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase}
.w-links a{text-decoration:none;border-bottom:1px solid rgba(244,232,212,.4);padding-bottom:4px}
.w-last-drink{width:100%;max-width:220px;justify-self:center;filter:drop-shadow(0 30px 30px rgba(0,0,0,.6));rotate:-8deg}
.w-thread{background:#fff;color:#111;border-radius:22px;padding:16px;display:grid;gap:7px;font:15px/1.35 -apple-system,"SF Pro Text",system-ui,sans-serif;box-shadow:0 30px 60px rgba(0,0,0,.45);max-width:380px;justify-self:center}
.w-thread-who{font:500 11px/1 var(--f-body);color:#8a8a8e;text-align:center;margin-bottom:4px}
.bub{max-width:80%;padding:8px 12px;border-radius:18px}
.js .bub{opacity:0;transform:translateY(10px) scale(.96);transition:all .4s var(--spring)}
.js .bub.in{opacity:1;transform:none}
.bub.them{background:#e9e9eb;justify-self:start;border-bottom-left-radius:5px}
.bub.me{background:#b3264a;color:#fff;justify-self:end;border-bottom-right-radius:5px}
.w-fine{max-width:1200px;margin:clamp(60px,7vw,100px) auto 0;padding-top:22px;border-top:1px solid rgba(244,232,212,.18);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font:13px/1.4 var(--f-body);color:rgba(244,232,212,.6)}
.w-fine a{color:rgba(244,232,212,.85)}


.w-top,.w-last{font-family:var(--f-body);-webkit-font-smoothing:antialiased}
.w-top a,.w-last a{color:inherit}
.w-last{color:var(--cream)}
.w-last h2,.w-last p{margin:0}
.w-last h2{font-weight:400;line-height:.95}
.w-last-drink{display:block;max-width:100%}
@media (max-width:980px){.w-last-inner{grid-template-columns:minmax(0,1fr)}.w-last-drink{display:none}}

.w-bridge .w-top{background:rgba(34,19,14,.96)}

/* mobile menu: button top left, full-screen list of pages */
.w-menu{display:none;width:40px;height:40px;margin:0 -6px 0 -8px;padding:10px 9px;border:0;background:none;color:inherit;cursor:pointer;flex-direction:column;justify-content:space-between}
.w-menu i{display:block;height:2px;width:100%;background:currentColor;border-radius:2px;transition:transform .25s,opacity .2s}
.w-menu[aria-expanded="true"] i:nth-child(1){transform:translateY(8px) rotate(45deg)}
.w-menu[aria-expanded="true"] i:nth-child(2){opacity:0}
.w-menu[aria-expanded="true"] i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.w-panel{position:fixed;inset:0;z-index:79;background:#f5efe6;color:#2a1812;padding:96px 24px 40px;overflow-y:auto}
.w-panel[hidden]{display:none!important}
.w-panel nav{display:grid;border-top:2px solid #2a1812}
.w-panel a{display:block;padding:16px 0;border-bottom:1px solid rgba(42,24,18,.18);font:400 30px/1.1 "Gloock","Bodoni 72",Didot,Georgia,serif;color:#2a1812;text-decoration:none}
.w-panel a.w-panel-sub{padding:11px 0 11px 22px;font:italic 400 22px/1.2 "Instrument Serif",Georgia,serif;color:#6b1424}
.w-panel a.w-panel-cta{margin-top:26px;border:0;text-align:center;background:#6b1424;color:#fff7ef;font:600 14px/1 "Jost",system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;padding:18px}
html.menu-open{overflow:hidden}
html.menu-open .w-top{color:#2a1812!important;background:#f5efe6!important;box-shadow:none!important}
html.menu-open .w-top .w-mark i{color:#6b1424!important}
html.menu-open .w-nav .w-cta{border-color:#6b1424!important;color:#6b1424!important}
@media (max-width:640px){.w-menu{display:flex}.w-top{justify-content:flex-start}.w-nav{margin-left:auto}.w-mark{font-size:17px}}