@font-face{font-family:"Oswald";src:url(../assets/fonts/oswald-var.woff2) format("woff2");font-weight:200 700;font-display:swap}
@font-face{font-family:"Old Standard";src:url(../assets/fonts/oldstandard-i.woff2) format("woff2");font-style:italic;font-display:swap}
:root{--paper:#e6c992;--paper-deep:#d9b577;--ink:#1d1710;--red:#9e2a1e;--green:#2f5a3a;--navy:#1b2440;--medal:#f7f3ea;--ring:#15120e;--gold:#c8a04a}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--ink);font:400 1rem/1.5 "Oswald",Arial Narrow,sans-serif;overflow-x:hidden;
 background-color:var(--paper);
 background-image:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .32  0 0 0 0 .15  0 0 0 1.2 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"),
  radial-gradient(ellipse at 50% 30%,rgba(255,240,205,.55),rgba(255,240,205,0) 60%),
  radial-gradient(ellipse at 50% 50%,rgba(0,0,0,0) 55%,rgba(110,70,20,.28) 100%)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--ink);color:var(--medal);padding:.5rem 1rem;z-index:10;font-size:1rem;letter-spacing:.08em}
.skip:focus{top:1rem}
.sheet{width:100%;max-width:1600px;margin:0 auto;padding:clamp(12px,2.6vw,40px) clamp(12px,2.6vw,40px) 1.5rem}
h1{margin:0}
.hero{margin:0;padding:clamp(4px,.5vw,8px);background:var(--ink);box-shadow:0 1px 0 rgba(255,255,255,.35),0 14px 30px -18px rgba(60,35,10,.7)}
.hero img{display:block;width:100%;height:auto;aspect-ratio:16/9}
.rule{margin:clamp(1.5rem,3.5vw,3rem) auto clamp(1rem,2.5vw,2rem);max-width:420px;height:7px;border-top:3px solid var(--green);border-bottom:1px solid var(--green)}

.houses{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,4vw,4rem);max-width:760px}
.house a{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);padding:.75rem .5rem 1rem;border-radius:12px;outline:none;transition:transform .25s ease}
.badge{display:block;flex:none;width:clamp(150px,20vw,240px);height:clamp(150px,20vw,240px);border-radius:50%;filter:drop-shadow(0 6px 8px rgba(70,40,10,.28));transition:transform .25s ease,filter .25s ease}
.badge img{display:block;width:100%;height:100%;object-fit:contain}
/* Motorworks: official shield set inside a cream medallion with thin dark + gold rings to match the two round badges */
.badge.medallion{background:var(--medal);border:solid var(--ring);border-width:clamp(3px,.45vw,5px);box-shadow:inset 0 0 0 clamp(2px,.3vw,3px) var(--gold),inset 0 0 0 clamp(6px,.9vw,9px) var(--medal),inset 0 0 0 clamp(7px,1vw,10px) var(--ring);display:flex;align-items:center;justify-content:center}
.badge.medallion picture{display:flex;align-items:center;justify-content:center;height:70%;width:100%}
.badge.medallion img{width:auto;height:100%}
.cap{margin-top:1rem;text-align:center;line-height:1.3}
.cap .role{display:block;font-weight:600;font-size:1.05rem;letter-spacing:.3em;padding-left:.3em;text-transform:uppercase}
.cap .name{display:block;font-family:"Old Standard",Georgia,serif;font-style:italic;font-size:1rem;letter-spacing:.02em;color:#4a3a22;margin-top:.2rem}
.house a:hover .badge,.house a:focus-visible .badge{transform:translateY(-6px);filter:drop-shadow(0 14px 14px rgba(70,40,10,.35))}
.house a:focus-visible{box-shadow:0 0 0 3px var(--paper),0 0 0 6px var(--navy)}
.house a:focus-visible .role{text-decoration:underline;text-underline-offset:.3em}
.foot{margin:clamp(2rem,5vw,4rem) auto 0;padding-top:1rem;border-top:1px solid rgba(29,23,16,.35);max-width:1100px;text-align:center;font-family:Georgia,serif;font-size:1rem;color:#4a3a22}
.foot p{margin:.25rem 0}
/* 18 Oct 2026: Monte DeLeon Racing GT4 programme teaser below the houses */
.gt4-teaser{margin:clamp(2rem,5vw,4rem) auto 0;max-width:1100px;display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding:clamp(1.25rem,3vw,2.5rem);border-top:3px solid var(--green);border-bottom:1px solid var(--green)}
.gt4-print{display:block;padding:clamp(4px,.5vw,8px);background:var(--ink);box-shadow:0 14px 30px -18px rgba(60,35,10,.7);transition:transform .25s ease}
.gt4-print img{display:block;width:100%;height:auto;aspect-ratio:2/3}
.gt4-print:hover,.gt4-print:focus-visible{transform:translateY(-4px)}
.gt4-print:focus-visible,.gt4-copy .go a:focus-visible,.gt4-copy p:not(.go) a:focus-visible{outline:3px solid var(--navy);outline-offset:4px}
.gt4-copy .kicker{margin:0 0 .4rem;font-weight:600;font-size:1.05rem;letter-spacing:.3em;text-transform:uppercase}
.gt4-copy h2{margin:0;font-family:"Old Standard",Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(1.8rem,3.2vw,2.6rem);line-height:1.15;color:var(--navy)}
.gt4-copy .ent{margin:.4rem 0 1rem;font-family:Georgia,serif;font-size:1rem;color:#4a3a22}
.gt4-copy p{font-family:Georgia,serif;font-size:1.0625rem;line-height:1.6;margin:0 0 .75rem;max-width:56ch}
.gt4-copy .go{margin-top:1.25rem}
.gt4-copy .go a{display:inline-block;font-family:"Oswald",Arial Narrow,sans-serif;font-weight:600;font-size:1rem;letter-spacing:.24em;text-transform:uppercase;color:var(--medal);background:var(--navy);padding:.8rem 1.4rem;text-decoration:none}
.gt4-copy .go a:hover{background:var(--red)}
/* 24 Oct 2026: inline text links in the teaser copy (e.g. the coaching link) follow the Le Mans page text links: ink colour, thin underline; red on hover like the Read button */
.gt4-copy p:not(.go) a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;transition:color .2s ease}
.gt4-copy p:not(.go) a:hover{color:var(--red)}
@media (max-width:640px){
 .houses{grid-template-columns:1fr;gap:1.75rem}
 .gt4-teaser{grid-template-columns:1fr;justify-items:center;text-align:center}
 .gt4-print{width:min(240px,70vw)}
 .gt4-copy p{margin-left:auto;margin-right:auto}
 .gt4-copy .go a{letter-spacing:.14em}
 .badge{width:min(200px,58vw);height:min(200px,58vw)}
 .cap .role{font-size:1rem}
}
@media (prefers-reduced-motion:reduce){.badge,.house a,.gt4-print{transition:none}.house a:hover .badge{transform:none}}

/* v26 (20 Oct 2026): brand story line */
.story{max-width:900px;margin:clamp(2rem,5vw,3.5rem) auto 0;padding:0 1.25rem;text-align:center}
.story-line{margin:0;font-family:"Old Standard",Georgia,serif;font-style:italic;font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.2;color:var(--navy)}
.story-sub{margin:.75rem auto 0;max-width:60ch;font-family:Georgia,serif;font-size:1.0625rem;line-height:1.6}

/* 24 Oct 2026 pre-launch fixes: poster badge hotspots and home button */
.hero{position:relative}
.hotspot{position:absolute;display:block;border-radius:50%;width:calc((100% - 2*clamp(4px,.5vw,8px))*.108);aspect-ratio:1/1;top:calc(clamp(4px,.5vw,8px) + (100% - 2*clamp(4px,.5vw,8px))*.63);transform:none;outline:none}
.hs-mw{left:calc(clamp(4px,.5vw,8px) + (100% - 2*clamp(4px,.5vw,8px))*.101)}
.hs-mdr{left:calc(clamp(4px,.5vw,8px) + (100% - 2*clamp(4px,.5vw,8px))*.227)}
.hotspot:hover,.hotspot:focus-visible{box-shadow:0 0 0 3px var(--medal),0 0 0 6px var(--navy)}
.story .home-go{margin:1.5rem 0 0}
.story .home-go a{display:inline-block;font-family:"Oswald",Arial Narrow,sans-serif;font-weight:600;font-size:1rem;letter-spacing:.24em;text-transform:uppercase;color:var(--medal);background:var(--navy);padding:.8rem 1.4rem;text-decoration:none}
.story .home-go a:hover{background:var(--red)}
.story .home-go a:focus-visible{outline:3px solid var(--navy);outline-offset:4px}
@media (max-width:640px){.story .home-go a{letter-spacing:.14em}}
.foot .ent{font-family:"Oswald",Arial Narrow,sans-serif;letter-spacing:.08em;margin-top:.6rem}
