/* Inner pages (/privacy/, /book/, 404.html). The homepage keeps its own styles inline for load speed;
   the tokens, buttons, header and footer below are copied from it, so change both together. */
@font-face{font-family:"Archivo Black";src:url(/fonts/archivo-black.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Archivo";src:url(/fonts/archivo-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{
  --paper:#EAE8E3;    /* site paper: ground */
  --paper-hi:#F4F4F0; /* lighter sheet: panels */
  --carbon:#111111;   /* ink, rules, dark bands */
  --graphite:#5B5A56; /* secondary text */
  --yellow:#FFDE59;   /* the logo's yellow: fields and highlights, never text on paper */
  --macro:"Archivo Black","Arial Black",sans-serif;
  --body:"Archivo","Helvetica Neue",Arial,sans-serif;
  --pad:clamp(16px,2.8vw,40px);
  --tape:repeating-linear-gradient(-45deg,var(--carbon) 0 14px,var(--yellow) 14px 28px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--carbon);font-family:var(--body);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100svh;display:flex;flex-direction:column}
main{flex:1}
img{display:block;max-width:100%}
a{color:inherit}
.macro{font-family:var(--macro);font-weight:400;text-transform:uppercase;letter-spacing:-.05em;line-height:.86}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);padding:12px 16px;z-index:10}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--carbon);outline-offset:3px}
.dark :focus-visible{outline-color:var(--yellow)}
.dark{background:var(--carbon);color:var(--paper)}

/* Buttons: yellow field, carbon text, square corners */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 26px;background:var(--yellow);color:var(--carbon);border:2px solid var(--carbon);
  font:700 15px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background-color .2s,color .2s}
.btn:hover{background:var(--carbon);color:var(--yellow)}

.tape{height:24px;background:var(--tape);border-block:2px solid var(--carbon)}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:auto 1fr auto;height:72px;background:var(--paper);border-bottom:2px solid var(--carbon)}
.top .plate{background:var(--carbon);display:flex;align-items:center;padding:0 28px}
.top .plate img{width:116px;height:auto}
.top nav{display:flex;align-items:center;gap:34px;padding-left:32px;border-left:2px solid var(--carbon);font-weight:600;font-size:16px}
.top nav a{text-decoration:none}
.top nav a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px;text-decoration-color:var(--yellow)}
.top .btn{min-height:0;height:100%;border-width:0 0 0 2px}

/* ---------- page title ---------- */
.title{padding:clamp(48px,6vw,88px) var(--pad) clamp(28px,3.4vw,44px)}
.title h1{font-size:clamp(3rem,7vw,7rem);margin-left:-.04em}
.title p{margin-top:clamp(16px,2vw,24px);font-weight:600;color:var(--graphite)}

/* ---------- privacy policy: one ruled sheet of plain text ---------- */
.sheet{background:var(--paper-hi);border-bottom:2px solid var(--carbon);padding:clamp(40px,5vw,72px) var(--pad) clamp(56px,7vw,104px)}
.prose{max-width:68ch;font-size:clamp(17px,1.3vw,19px);line-height:1.6}
.prose>*+*{margin-top:1em}
.prose h2{font-weight:800;font-size:clamp(21px,1.8vw,26px);line-height:1.2;letter-spacing:-.01em;margin-top:2.2em;padding-top:20px;border-top:2px solid var(--carbon);scroll-margin-top:96px}
.prose h2+*{margin-top:.8em}
.prose ul{list-style:none;display:grid;gap:6px}
.prose li{display:flex;gap:12px;align-items:baseline}
.prose li::before{content:"";flex:none;width:8px;height:8px;background:var(--carbon);transform:translateY(-2px)}
.prose a{text-decoration-thickness:2px;text-underline-offset:3px}
.prose a:hover{background:var(--yellow)}
.prose strong{font-weight:700}
.prose-details{border-top:2px solid var(--carbon)}
.prose-details div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:16px;padding:12px 0;border-bottom:1px solid #c9c7c1}
.prose-details dt{font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;padding-top:3px}

/* ---------- /book/: shown for a moment while the browser forwards to the calendar ---------- */
.redirect{display:grid;place-content:center;justify-items:start;gap:28px;padding:clamp(56px,8vw,120px) var(--pad);min-height:60svh}
.redirect .lede{font-family:var(--macro);font-size:clamp(2.2rem,5vw,4.4rem);text-transform:uppercase;letter-spacing:-.05em;line-height:.9;max-width:14ch}
#booking-link{display:inline-flex;align-items:center;min-height:56px;padding:0 26px;background:var(--yellow);border:2px solid var(--carbon);
  font:700 15px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background-color .2s,color .2s}
#booking-link:hover{background:var(--carbon);color:var(--yellow)}

/* ---------- 404 ---------- */
.lost{display:grid;align-content:center;justify-items:start;gap:clamp(20px,2.4vw,28px);padding:clamp(56px,8vw,120px) var(--pad);min-height:60svh}
.lost .code{font-family:var(--macro);font-size:clamp(6rem,18vw,16rem);line-height:.8;letter-spacing:-.06em;-webkit-text-stroke:2px var(--carbon);color:transparent;margin-left:-.04em}
.lost h1{font-size:clamp(2.6rem,6vw,5.6rem);max-width:14ch}
.lost .sub{font-size:clamp(18px,1.45vw,21px);max-width:40ch}
.lost .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.btn.ghost{background:transparent}
.btn.ghost:hover{background:var(--carbon);color:var(--yellow)}

/* ---------- footer ---------- */
footer{background:var(--carbon);color:var(--paper);padding:40px var(--pad);display:grid;grid-template-columns:auto 1fr auto;gap:40px;align-items:center;font-size:15px}
footer img{width:128px;height:auto}
footer nav{display:flex;gap:28px;font-weight:600}
footer nav a{text-decoration:none}
footer nav a:hover,footer nav a[aria-current]{color:var(--yellow)}
footer .contact{color:#c9c7c1;text-align:right}
footer .contact a{color:var(--paper);text-decoration:none}
footer .contact a:hover{color:var(--yellow)}

@media (max-width:1180px) and (min-width:900px){
  .top nav{gap:22px;padding-left:24px;font-size:15px}
  .top .plate{padding:0 22px}
}
@media (max-width:899px){
  body{font-size:17px}
  .top{height:60px;grid-template-columns:auto 1fr}
  .top .plate{padding:0 16px}
  .top .plate img{width:96px}
  .top nav{display:none}
  .top .btn{padding:0 16px;font-size:14px;border-left:2px solid var(--carbon)}
  .title h1{font-size:13vw}
  .lost .ctas .btn{flex:1 1 100%}
  .prose-details div{grid-template-columns:1fr;gap:2px}
  .prose h2{scroll-margin-top:76px}
  footer{grid-template-columns:1fr;gap:20px}
  footer .contact{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important}
}
