:root { color: #0B1E3A; font-family: Arial, Helvetica, sans-serif; }
* { box-sizing: border-box; }
body { background: #F5F8FC; margin: 0; }
a { color: inherit; text-decoration: none; }
.hero { background: url("assets/tournament.png") center/cover; color: #fff; min-height: 760px; padding: 28px max(5vw, 28px) 42px; position: relative; }
.hero::before { background: rgba(6, 27, 62, .76); content: ""; inset: 0; position: absolute; }
.hero > * { position: relative; }
nav { align-items: center; display: flex; justify-content: space-between; }
.brand { display: block; width: 142px; }
.brand img { display: block; filter: brightness(0) invert(1); height: auto; width: 100%; }
.footer-brand { width: 126px; }
.nav-actions { align-items: center; display: flex; font-size: .92rem; font-weight: 700; gap: 26px; }
.sign-in { border: 1px solid rgba(255,255,255,.6); padding: 10px 14px; }
.hero-content { max-width: 660px; padding-top: 132px; }
.eyebrow { color: #74D9FF; font-size: .76rem; font-weight: 800; letter-spacing: .08em; margin: 0 0 16px; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-family: Georgia, serif; font-size: 5.8rem; font-weight: 500; letter-spacing: 0; line-height: .95; margin-bottom: 28px; }
.hero-copy { color: #E2F4FD; font-size: 1.15rem; line-height: 1.55; max-width: 560px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.button { display: inline-block; font-size: .92rem; font-weight: 800; padding: 14px 18px; }
.primary { background: #29B6F6; color: #061B3E; }
.secondary { border: 1px solid rgba(255,255,255,.6); color: #fff; }
.hero-footnote { color: #DCEFFA; font-size: .82rem; margin-top: 28px; }
.intro { margin: 0 auto; max-width: 820px; padding: 125px 28px 92px; }
.intro .eyebrow, .statement .eyebrow { color: #087FC5; }
h2 { font-family: Georgia, serif; font-size: clamp(2.3rem, 4vw, 4rem); font-weight: 500; line-height: 1.03; margin-bottom: 25px; }
.intro > p:last-child { color: #5D6C80; font-size: 1.1rem; line-height: 1.65; max-width: 660px; }
.features { border-top: 1px solid #D8E3EE; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 5vw; }
.features article { border-right: 1px solid #D8E3EE; min-height: 310px; padding: 28px; }
.features article:last-child { border-right: 0; }
.feature-number { color: #0E73C9; font-size: .8rem; font-weight: 800; }
h3 { font-family: Georgia, serif; font-size: 1.7rem; font-weight: 500; margin: 68px 0 14px; }
.features p { color: #5D6C80; line-height: 1.55; }
.statement { align-items: flex-end; background: #061B3E; color: #fff; display: flex; justify-content: space-between; margin-top: 110px; padding: 82px 8vw; }
.statement h2 { margin-bottom: 0; max-width: 620px; }
footer { align-items: center; background: #061B3E; border-top: 1px solid #244E82; color: #fff; display: flex; justify-content: space-between; padding: 24px 8vw; }
footer p { color: #B8DDF1; font-size: .82rem; margin: 0; }
@media (max-width: 880px) { h1 { font-size: 4.4rem; } .hero-content { padding-top: 110px; } }
@media (max-width: 720px) { .hero { min-height: 680px; } .nav-actions > a:first-child { display: none; } .hero-content { padding-top: 110px; } h1 { font-size: 3.4rem; } .features { grid-template-columns: 1fr; } .features article { border-bottom: 1px solid #D8E3EE; border-right: 0; min-height: auto; } h3 { margin-top: 42px; } .statement { align-items: flex-start; flex-direction: column; gap: 28px; margin-top: 70px; } }
