:root{
  --ink:#0a0a0f;
  --ink-2:#0f0f14;
  --panel:#141419;
  --panel-2:#1b1c22;
  --line:rgba(255,255,255,.14);
  --line-soft:rgba(255,255,255,.08);
  --text:#fff;
  --muted:#c4c4cb;
  --dim:#8f8f99;
  --red:#e00a3c;
  --red-dark:#b90831;
  --red-glow:rgba(224,10,60,.35);
  --gem:#4dbcf2;
  --shadow:10px 10px 0 rgba(224,10,60,.9);
  --font:'Manrope',Arial,sans-serif;
  --display:'Oswald','Arial Narrow',Arial,sans-serif;
  --header-h:72px;
  color-scheme:dark;
  accent-color:var(--red);
}
html{box-sizing:border-box;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--font);font-size:1rem;line-height:1.7;overflow-x:hidden}
body.menu-open{overflow:hidden}
img{display:block;max-width:100%;height:auto}
svg{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
.container{width:min(1440px,calc(100% - 40px));margin-inline:auto}
.container--narrow{width:min(860px,calc(100% - 40px))}
.skip-link{position:absolute;left:-999px;top:auto}
.skip-link:focus{left:12px;top:12px;z-index:99;background:#fff;color:#000;padding:8px 12px}

/* Typography */
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.05;margin:0 0 18px;letter-spacing:.005em;text-transform:uppercase;text-wrap:balance}
h1{font-size:clamp(2.3rem,1.3rem + 4vw,4.6rem);line-height:.98}
h2{font-size:clamp(1.8rem,1.25rem + 2.2vw,3rem)}
h3{font-size:clamp(1.15rem,1rem + .6vw,1.45rem)}
p{margin:0 0 16px;color:var(--muted);text-wrap:pretty}
ul,ol{margin:0 0 18px;padding-left:22px;color:var(--muted)}
li+li{margin-top:7px}
ol li::marker{color:var(--red);font-family:var(--display);font-weight:600}
ul li::marker{color:var(--red)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;color:var(--red);font-family:var(--display);font-size:.82rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.eyebrow::before{content:'';width:24px;height:3px;background:currentColor}

/* Buttons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:10px 26px;border:2px solid var(--red);border-radius:0;background:var(--red);color:#fff;font-family:var(--display);font-size:1rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;text-align:center;transition:transform .16s,box-shadow .16s,border-color .16s,background-color .16s}
.button:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 #fff}
.button--secondary{background:transparent;border-color:rgba(255,255,255,.5);color:var(--text)}
.button--secondary:hover{border-color:#fff;background:rgba(255,255,255,.04)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .button{transition:none}
  .button:hover{transform:none}
}

/* Sections & grids */
.section{padding:64px 0;scroll-margin-top:calc(var(--header-h) + 16px)}
.prose-section{border-top:1px solid var(--line-soft)}
.content-grid{display:grid;gap:32px}
.copy{max-width:760px;min-width:0}
.copy > :last-child{margin-bottom:0}
.copy p + h2,.copy ol + h2,.copy ul + h2{margin-top:44px}

/* Photos: whole image in its own proportions, frame unchanged */
.photo{width:100%;margin:0;border:2px solid #fff;border-radius:0;box-shadow:var(--shadow);background:var(--panel);overflow:hidden;min-width:0}
.photo img{width:100%;height:auto}
.photo--square{max-width:620px;justify-self:center}
.photo--portrait{max-width:440px;justify-self:center}

/* Tables */
.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:24px 0;scrollbar-color:var(--red) var(--panel)}
.table-responsive table{width:100%}
table{border-collapse:collapse;background:var(--panel);border:1px solid var(--line)}
th,td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}
th{color:var(--red);font-family:var(--display);font-size:.88rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;background:var(--panel-2)}
td{color:var(--muted)}
td:first-child{color:#fff;font-weight:600}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:rgba(255,255,255,.025)}

/* FAQ */
.faq{display:grid;gap:10px;max-width:980px}
.faq details{background:var(--panel);border:1px solid var(--line);transition:border-color .2s}
.faq details[open]{border-color:rgba(224,10,60,.6)}
.faq summary{position:relative;display:block;padding:18px 56px 18px 20px;font-weight:800;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq summary::after{content:'';position:absolute;right:22px;top:50%;width:14px;height:2px;margin-top:-1px;background:var(--red);transition:transform .2s}
.faq summary::after{transform:rotate(90deg)}
.faq details[open] summary::after{transform:rotate(0deg)}
.faq details p{padding:0 20px 18px;margin:0}

/* Callout */
.callout{padding:28px;border:2px solid var(--red);background:linear-gradient(135deg,rgba(224,10,60,.16),transparent 50%),var(--panel);box-shadow:10px 10px 0 rgba(224,10,60,.8)}
.callout p{color:#e7e7e9}

/* Legal pages */
.breadcrumbs{padding-top:32px;margin-bottom:18px;font-size:.88rem;color:var(--dim)}
.breadcrumbs a{color:var(--red)}
.breadcrumbs a:hover{text-decoration:underline}
.legal{min-height:52vh;padding-bottom:80px}
.legal h1{font-size:clamp(2.1rem,1.4rem + 3vw,3.6rem);margin-bottom:24px}
.legal h2{font-size:clamp(1.3rem,1.1rem + .9vw,1.75rem);margin:40px 0 12px}
.legal-body{font-size:1.02rem}
.legal-body p,.legal-body ul{max-width:72ch}
.legal-body > p:first-child{font-size:1.1rem;color:#dcdce1}

@media (min-width:760px){
  .section{padding:92px 0}
}
@media (min-width:1024px){
  .content-grid{gap:56px}
  .content-grid--2{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center}
  .content-grid--2.reverse{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
  .content-grid--2.reverse > .copy{order:2}
  .content-grid--2.reverse > .photo{order:1}
  .content-grid--2.is-tall{align-items:start}
  .content-grid--2.is-tall > .photo{position:sticky;top:calc(var(--header-h) + 28px)}
}
@media (min-width:1280px){
  .content-grid{gap:72px}
}
@media (max-width:1023px){
  .container,.container--narrow{width:min(calc(100% - 32px),760px)}
  .copy{max-width:none}
}
@media (max-width:480px){
  .photo{box-shadow:6px 6px 0 rgba(224,10,60,.9)}
  .button{padding:10px 18px}
  th,td{padding:10px 12px}
}