:root{
  --bg:#F1F0F0; --surface:#ffffff; --ink:#272222; --muted:#6D6161;
  --forest:#4B0B00; --leaf:#BF2B00; --lane:#FF3E05; --cyan:#05C6FF; --purple:#BB05FF; --dark:#270a00; --line:#D7D4D4; --on-forest:#F1F0F0;
  --display:'Bricolage Grotesque','Arial Black',Arial,sans-serif;
  --body:'Figtree',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--bg:#272222;--surface:#494040;--ink:#F1F0F0;--muted:#B3ACAC;--forest:#4B0B00;--leaf:#FF8E85;--line:#6D6161;}
}
:root[data-theme="dark"]{--bg:#272222;--surface:#494040;--ink:#F1F0F0;--muted:#B3ACAC;--forest:#4B0B00;--leaf:#FF8E85;--line:#6D6161;}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--body)}
a{color:inherit}
:focus-visible{outline:3px solid var(--lane);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding:0 1.25rem}
h1,h2,h3{font-family:var(--display);line-height:1.05;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(1.8rem,4vw,2.5rem);font-weight:800;margin-bottom:1rem}
h3{font-size:1.2rem;font-weight:800;margin-bottom:.35rem}
p{margin:0 0 1rem;max-width:62ch}
section{padding:3.5rem 0;border-top:1px solid var(--line)}
.ph{background:color-mix(in srgb,var(--lane) 22%,transparent);padding:0 .25em;border-radius:3px}

/* hero */
header.hero{background:var(--lane);color:#4B0B00;padding:1.25rem 0 0;overflow:hidden}
.top{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-weight:600}
.top a{text-decoration:none}
.top .btn-sm{border:2px solid #4B0B00;padding:.35rem .9rem;border-radius:999px;color:#4B0B00}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:center;padding:3rem 0 4rem}
.hero h1{font-size:clamp(2.6rem,7vw,5rem);font-weight:800}
.hero p.lead{font-size:1.2rem;color:#4B0B00;margin:1.25rem 0 1.75rem}
.status{display:inline-block;background:#4B0B00;color:#FFEDEC;font-weight:600;padding:.3rem .8rem;border-radius:4px;margin-bottom:1.25rem}
.btn{display:inline-block;background:var(--lane);color:#021500;font-weight:600;text-decoration:none;padding:.85rem 1.5rem;border-radius:6px;border:0}
.btn:hover{filter:brightness(1.07)}
.btn.ghost{margin-left:.5rem;margin-left:.5rem}
.btn.dim{background:var(--surface);color:var(--muted);border:1px dashed var(--line);cursor:not-allowed}
/* bib */
.bib{background:#fff;color:#021500;border-radius:10px;padding:1.4rem 1.5rem 1.6rem;transform:rotate(2.5deg);box-shadow:0 18px 40px #0006;position:relative;max-width:360px;justify-self:center;width:100%}
.bib::before,.bib::after{content:"";position:absolute;top:10px;width:14px;height:14px;border-radius:50%;background:#D7D4D4}
.bib::before{left:12px}.bib::after{right:12px}
.bib .club{text-align:center;font-weight:600;margin-top:.6rem;font-size:.95rem}
.bib .num{font-family:var(--display);font-weight:800;font-size:clamp(6rem,17vw,9.5rem);line-height:.9;text-align:center;letter-spacing:-.04em;color:var(--lane)}
.bib .bar{height:6px;background:linear-gradient(90deg,#49FF05 25%,#FF3E05 0 50%,#05C6FF 0 75%,#BB05FF 0);margin:.6rem 0 .7rem}
.bib .row{display:flex;justify-content:space-between;font-weight:600;font-size:.95rem}
.lanes{height:14px;background:repeating-linear-gradient(90deg,#49FF05 0 50px,transparent 50px 66px,#FFEDEC 66px 116px,transparent 116px 132px,#05C6FF 132px 182px,transparent 182px 198px,#BB05FF 198px 248px,transparent 248px 264px);opacity:.9}

/* details */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-top:-2.2rem;position:relative}
.fact{background:var(--surface);padding:1.1rem 1.2rem}
.fact b{display:block;color:var(--muted);font-weight:500;font-size:.9rem}
.fact span{font-family:var(--display);font-weight:800;font-size:1.3rem}
.fees{margin-top:1.25rem;color:var(--muted)}
.btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.25rem}

.two{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem}
ul.clean{padding-left:1.1rem;margin:0}
ul.clean li{margin-bottom:.5rem}
.box{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:1.5rem}
.rules li{margin-bottom:.7rem}
a.more{font-weight:600;color:var(--leaf)}

/* story timeline (real sequence) */
.tl{list-style:none;margin:0;padding:0 0 0 1.4rem;border-left:4px solid var(--leaf)}
.tl li{margin-bottom:1.4rem;position:relative}
.tl li::before{content:"";position:absolute;left:calc(-1.4rem - 10px);top:.4rem;width:16px;height:16px;border-radius:50%;background:var(--forest);border:3px solid var(--bg)}
.tl strong{font-family:var(--display);font-size:1.15rem}
.tl .race strong{color:var(--leaf)}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.gallery div{aspect-ratio:4/3;border-radius:8px;background:linear-gradient(135deg,#BF2B00,#4B0B00);display:flex;align-items:flex-end;padding:.8rem;color:#fff;font-weight:600;font-size:.9rem}
.gallery div:nth-child(2){background:linear-gradient(135deg,#8600B8,#4B0B00)}
.gallery div:nth-child(3){background:linear-gradient(135deg,#00769A,#4B0B00)}

form{display:grid;gap:.9rem;max-width:560px}
label{font-weight:600;font-size:.95rem;display:grid;gap:.3rem}
input,textarea{font:inherit;padding:.7rem .8rem;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);width:100%}
.nm{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
button.btn{cursor:pointer;font:600 1rem var(--body);justify-self:start}
header.hero .btn{background:#4B0B00;color:#FFEDEC}
header.hero .btn.ghost{background:transparent;color:#4B0B00;border:2px solid #4B0B00}
header.hero :focus-visible{outline-color:#4B0B00}
footer{background:var(--forest);color:var(--on-forest);padding:2.5rem 0;margin-top:1rem}
footer a{margin-right:1.1rem}
footer small{display:block;margin-top:1rem;color:#D7D4D4}

@media (max-width:820px){
  .hero-grid,.two{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .nm{grid-template-columns:1fr}
  .btn.ghost{margin:.6rem 0 0}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Hero with a background image (set hero_image in the page template).
   The dark red overlay keeps the text readable on any photo. */
.hero.has-image{background:linear-gradient(rgba(75,11,0,.62),rgba(75,11,0,.62)),var(--hero-img) var(--hero-pos,center)/cover no-repeat;color:#FFEDEC}
.hero.has-image p.lead{color:#FFEDEC}
.hero.has-image .top .btn-sm{border-color:#FFEDEC;color:#FFEDEC}
header.hero.has-image .btn{background:var(--lane);color:#270a00}
header.hero.has-image .btn.ghost{background:transparent;color:#FFEDEC;border-color:#FFEDEC}
header.hero.has-image .status{background:var(--lane);color:#270a00}
header.hero.has-image :focus-visible{outline-color:#FFEDEC}

.btn.wa{background:#25D366;color:#072b12}