:root{--ink:#fff4f3;--muted:#b8a7c7;--green:#7938b3;--surface:#1a0d25}
body{background:radial-gradient(ellipse at 15% 30%,#331350 0,transparent 45%),linear-gradient(150deg,#100916,#250f39 55%,#0f0915);color:var(--ink)}
header{background:rgba(19,9,28,.9);border-color:rgba(227,196,255,.12)}
.brand-dot{color:#c08dee}.nav-links{color:#cdbeda}.nav-links a:hover{color:#ffffff}.menu span{background:#f1e8f9}
a:focus-visible,button:focus-visible{outline-color:#cea0f6}
.hero{background:radial-gradient(ellipse at 22% 40%,#421867,transparent 70%),linear-gradient(120deg,#170b21,#2d0f48)}
:root .hero-photo{left:43%;background-image:url('ride-coast.webp');background-position:center 66%;transform:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 8%,rgba(0,0,0,.65) 19%,#000000 33%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 8%,rgba(0,0,0,.65) 19%,#000000 33%)}
.hero-shade{background:linear-gradient(90deg,#1f0c30 2%,rgba(33,12,52,.94) 35%,rgba(33,12,52,.24) 62%,rgba(24,8,39,.06)),linear-gradient(0deg,rgba(22,8,34,.62),transparent 30%)}
.hero-copy{max-width:780px}.hero h1{font-size:clamp(60px,6.2vw,88px)}
.hero .eyebrow,.hero-description,.hero-bottom,.hero-index{color:#e3d4f0}
.green{background:linear-gradient(110deg,#7a39b4,#4d177c);color:#ffffff;box-shadow:0 8px 32px #0d051544;border:1px solid #b17be166}.green:hover{background:linear-gradient(110deg,#8d47cc,#5f2395)}
.intro .eyebrow,.section-heading .eyebrow,.about-label .eyebrow{color:#c08ded}
.intro h2 span,.about h2 span{color:#b391d2}.intro-description,.ride-types p,.section-heading>p,.about-copy>p{color:#c0b0cf}
.ride-types>div{border-color:#af80d838}.type-number{color:#c08ded}
.moments{background:linear-gradient(135deg,#1d0e2a,#341451 80%,#1c0c2b)}
.photo-grid{grid-template-columns:1fr 1fr;max-width:1320px;margin:auto}.photo-card{height:700px;background-color:#27113b}
.coast{background-image:url('ride-summit.webp');background-position:center bottom}.bike{background-image:url('ride-portrait.webp');background-position:center 70%}
.card-shade{background:linear-gradient(0deg,rgba(17,6,27,.94),rgba(23,8,37,.18) 40%,transparent 65%)}
.card-copy .eyebrow,.card-copy>p:last-child{color:#eadcf6}
.about-monogram{color:#a060d8}.about-copy .signature{color:#e7ccff}
.closing{background:radial-gradient(ellipse at top,#602891,transparent 80%),linear-gradient(110deg,#2e0e4b,#4a1b73,#220c36)}
.closing .eyebrow{color:#d3b3ef}.dark{background:#1a0c26;border:1px solid #c6a2e64d}.dark:hover{background:#341450}
footer{background:linear-gradient(100deg,#130a1b,#200d30)}footer p,footer>span{color:#b7a6c6}
@media(max-width:800px){:root .hero-photo{left:32%}.hero-copy{padding-top:90px}.hero-shade{background:linear-gradient(90deg,rgba(25,8,40,.94),rgba(33,12,52,.72) 35%,rgba(33,12,52,.08)),linear-gradient(0deg,#190b25aa,transparent 50%)}.hero h1{font-size:64px}.photo-card{height:580px}}
@media(max-width:560px){.nav-links{background:#1d0d2b}.hero{height:960px;min-height:960px;max-height:none}:root .hero-photo{left:0;top:330px;background-position:center 70%;-webkit-mask-image:linear-gradient(180deg,transparent,#000000 22%);mask-image:linear-gradient(180deg,transparent,#000000 22%)}.hero-shade{background:linear-gradient(180deg,#250e3a 0%,#2a0f42 30%,rgba(35,11,57,.85) 36%,rgba(35,11,57,0) 52%),linear-gradient(0deg,#180826dd,transparent 25%)}.hero-copy{padding:44px 28px;max-width:none}.hero h1{font-size:48px;line-height:1.16;margin-bottom:18px}.hero .eyebrow{margin-bottom:20px}.hero-description{font-size:16px;line-height:1.7;margin-bottom:21px}.button{padding:13px 22px}.hero-bottom{font-size:12px}.hero-bottom>span{max-width:180px}.photo-card{height:600px}.photo-grid{grid-template-columns:1fr}.coast{background-position:center bottom}.bike{background-position:center 75%}.card-copy{bottom:32px}.card-copy h3{font-size:28px}}

/* Full-bleed photo hero with a uniform overlay. */
:root .hero-photo{inset:0;background-position:center 25%;background-size:cover;-webkit-mask-image:none;mask-image:none}
.hero-shade{background:rgba(14,5,22,.38)}
.hero-copy{text-shadow:0 2px 18px rgba(0,0,0,.35)}
.hero-bottom,.hero-index{text-shadow:0 1px 8px rgba(0,0,0,.6)}
@media(max-width:800px){:root .hero-photo{inset:0;background-position:60% 25%}.hero-shade{background:rgba(14,5,22,.4)}}
@media(max-width:560px){.hero{height:calc(100svh - 64px);min-height:790px;max-height:1100px}:root .hero-photo{inset:0;background-position:center 58%;-webkit-mask-image:none;mask-image:none}.hero-shade{background:rgba(14,5,22,.32)}.hero-copy{padding:48px 28px}.hero h1{font-size:48px}.hero-description{font-size:16px}}

/* Desktop: a taller full-bleed composition preserves the rider and bicycle. */
@media(min-width:801px){.hero{height:calc(100svh - 72px);min-height:0;max-height:none}:root .hero-photo{background-image:url('ride-coast.webp');background-position:center 29%}.hero-copy{padding-top:clamp(40px,10vh,105px)}.hero-index{top:42%}}

@media(min-width:801px) and (max-height:700px){.hero-copy{padding-top:30px}.hero h1{font-size:clamp(48px,5.4vw,72px);margin-bottom:18px}.hero .eyebrow{margin-bottom:18px}.hero-description{font-size:18px;line-height:1.6;margin-bottom:22px}}

/* Anchor the helmet near the top while preserving the one-screen desktop frame. */
@media(min-width:801px){:root .hero-photo{background-position:center calc(20px - 45.5vw)}}

.medals{padding-top:100px;padding-bottom:70px}.medals-heading{display:block;margin-bottom:40px}.medals-heading .eyebrow{color:#c08ded}.medals-heading h2{font-size:clamp(32px,3.6vw,50px);line-height:1.28;letter-spacing:-1.7px;font-weight:650;margin:0}.medals-heading>p:last-child{font-size:17px;line-height:1.8;color:#c0b0cf;margin:24px 0 0}.medals-photo{margin:0}.medals-photo img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid #bd9bdc26}.medals-photo figcaption{font-size:14px;color:#c0b0cf;margin-top:16px;text-align:right}@media(max-width:560px){.medals{padding-top:65px;padding-bottom:35px}.medals-heading{margin-bottom:28px}.medals-heading h2{font-size:32px;letter-spacing:-1px}.medals-heading>p:last-child{font-size:16px}.medals-photo img{border-radius:10px}}

/* Shared navigation language */
.header{height:76px;background:rgba(14,8,20,.84);backdrop-filter:blur(24px);border-bottom:1px solid rgba(241,225,255,.11)}.nav{max-width:none;height:76px;justify-content:flex-start;gap:34px;padding:0 clamp(22px,4vw,64px)}.nav .brand{font-size:30px;letter-spacing:-2px;margin-right:18px}.nav-links{display:flex;align-items:center;gap:8px;color:#ad9cbd;font-size:14px}.nav-links a{padding:10px 14px;border-radius:999px;transition:.2s color,.2s background}.nav-links a:hover,.nav-links a.active{color:#ffffff;background:rgba(255,255,255,.07)}.nav-cta{margin-left:auto;gap:10px;color:#ad9cbd;font-size:12px;font-weight:500}.nav-cta b{font-weight:500}.visitor-tag{font-size:11px;color:#c596ef;border:1px solid #a261db44;background:#9c59d814;padding:5px 9px;border-radius:999px}.home-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#ba7af2,#511e7f);font-weight:750;color:white;font-style:normal}.hero{height:calc(100svh - 76px)}
@media(max-width:900px){body{padding-bottom:88px}.nav-links{position:fixed;left:14px;right:14px;bottom:12px;z-index:40;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:6px;border:1px solid rgba(241,225,255,.11);border-radius:18px;background:rgba(23,13,32,.92);backdrop-filter:blur(24px);box-shadow:0 16px 50px #00000088}.nav-links a{padding:11px 5px;text-align:center;font-size:12px}.nav-cta{display:flex}.hero{height:calc(100svh - 76px)}}
@media(max-width:560px){.header,.nav{height:66px}.nav{padding:0 22px}.nav .brand{font-size:28px}.nav-cta b,.visitor-tag{display:none}.nav-links{left:8px;right:8px;bottom:8px;background:rgba(23,13,32,.94);padding:6px}.hero{height:calc(100svh - 66px)}}

/* Mobile navigation stays inside the header so iOS never re-anchors it. */
@media(max-width:900px){body{padding-bottom:0}.header{height:124px;backdrop-filter:none;-webkit-backdrop-filter:none}.nav{height:66px;padding:0 22px;position:relative}.nav-links{position:absolute;top:66px;bottom:auto;left:8px;right:8px;z-index:40;grid-template-columns:repeat(4,minmax(0,1fr));box-shadow:0 10px 30px #00000066}.nav-links a{white-space:nowrap}.hero{height:calc(100svh - 124px)}}
@media(max-width:560px){.header{height:124px}.hero{height:calc(100svh - 124px);min-height:730px}.hero-copy{padding-top:38px}}

@media(max-width:560px){:root .hero-photo{background-image:url("ride-coast-mobile.webp")}}
