:root { --bw-ink:#071012; --bw-cream:#f1e6ce; --bw-gold:#d7a84b; --bw-rust:#8e3825; --bw-sea:#0b3437; }
.black-tide-landing { min-height:100vh; color:var(--bw-cream); background:var(--bw-ink); }
.bw-nav { position:absolute; inset:0 0 auto; z-index:5; height:84px; padding:0 clamp(22px,5vw,76px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #f1e6ce24; }
.bw-back { text-transform:uppercase; letter-spacing:.14em; font:700 10px var(--font-mono); color:#d9c9aa; }
.bw-host-status { display:flex; align-items:center; gap:16px; color:#d9c9aa; font:700 10px var(--font-mono); letter-spacing:.12em; text-transform:uppercase; }
.bw-hero { min-height:100vh; position:relative; overflow:hidden; background:url('/blacktide/black-tide-hero.png') center/cover no-repeat,linear-gradient(118deg,#061012 12%,#0b2426 60%,#071012 100%); }
.bw-visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.bw-lead { position:relative; z-index:2; max-width:680px; margin:0; padding:104px clamp(24px,7vw,108px) 0; color:#f1e6ce; font-size:clamp(16px,1.5vw,20px); line-height:1.7; text-shadow:0 2px 18px #000,0 0 24px #000c; }
.bw-actions { position:absolute; z-index:2; left:clamp(24px,7vw,108px); bottom:56px; display:flex; flex-wrap:wrap; gap:14px; }
.bw-button { display:inline-flex; align-items:center; justify-content:center; gap:28px; min-height:58px; padding:0 24px; text-transform:uppercase; letter-spacing:.12em; font:800 10px var(--font-mono); border:1px solid #f1e6ce42; }
.bw-button-gold { color:#100f0a; background:var(--bw-gold); border-color:var(--bw-gold); box-shadow:7px 7px 0 #0005; }
.bw-button-ghost { color:var(--bw-cream); background:#051012cc; backdrop-filter:blur(8px); }
@media (max-width:520px) { .bw-nav{height:72px}.bw-back{display:none}.bw-host-status .bw-back{display:inline}.bw-lead{padding:92px 20px 0}.bw-actions{left:20px;right:20px;bottom:32px;display:grid}.bw-button{width:100%} }

/* Readable type floor for landing-page labels and actions. */
.bw-back { font-size:12px; }
.bw-button { font-size:13px; }
@media (max-width:520px) { .bw-button{font-size:14px} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important} }