:root { --red: #1765ae; --red-dark: #0d3e70; --yellow: #ffffff; --ink: #102237; --paper: #f4f8fc; --cream: #dceaf7; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", Arial, sans-serif; }
.container { width: min(1120px, calc(100% - 48px)); margin: 0 auto; }
.hero { min-height: 720px; overflow: hidden; color: #fff8e8; background: var(--red); position: relative; }
.hero::after { content: ""; position: absolute; width: 780px; height: 780px; border: 70px solid rgba(255,255,255,.2); border-radius: 50%; right: -350px; bottom: -500px; }
.nav { height: 92px; display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 2; border-bottom: 1px solid rgba(255,255,255,.24); }
.brand { color: #fff8e8; font: 600 1.28rem "Oswald", sans-serif; letter-spacing: .08em; text-decoration: none; }.brand span { color: var(--yellow); margin-right: 8px; }
.nav-links { display: flex; gap: 28px; }.nav-links a { color: #fff8e8; text-decoration: none; font-size: .87rem; }.nav-links a:hover { color: var(--yellow); }
.hero-content { min-height: 628px; position: relative; display: flex; align-items: center; z-index: 1; }.hero-copy { width: 56%; position: relative; z-index: 2; }
.crest { width: 92px; height: 92px; display: block; margin: 0 0 18px; object-fit: contain; border-radius: 4px; }.eyebrow { margin: 0 0 14px; color: var(--yellow); font: 600 .77rem "Oswald", sans-serif; letter-spacing: .18em; }.eyebrow.red { color: var(--red); }.hero h1, h2 { font-family: "Oswald", Impact, sans-serif; text-transform: uppercase; line-height: .94; letter-spacing: -.025em; }.hero h1 { margin: 0; font-size: clamp(4.2rem, 8vw, 7.3rem); font-weight: 600; }.hero h1 em { color: var(--yellow); font-style: normal; }.lead { max-width: 500px; line-height: 1.65; margin: 26px 0 30px; font-size: 1.04rem; }.button { display: inline-flex; gap: 25px; padding: 14px 19px; align-items: center; color: var(--ink); background: var(--yellow); text-decoration: none; text-transform: uppercase; font: 600 .82rem "Oswald", sans-serif; letter-spacing: .1em; }.button span { font-size: 1.3rem; }.hero-art { width: 650px; max-width: 63%; position: absolute; right: -45px; bottom: -12px; z-index: 1; }
.intro { padding: 120px 0 110px; display: grid; grid-template-columns: 90px 1.15fr 1fr; gap: 35px; align-items: start; }.section-number { margin: 0; color: var(--red); font: 600 1rem "Oswald", sans-serif; }.intro h2, .history h2, .honours h2, .ofi h2 { margin: 0; font-size: clamp(2.9rem, 5vw, 4.7rem); }.intro > p:last-child { margin: 28px 0 0; line-height: 1.8; }
.history { color: #fff8e8; padding: 105px 0 0; background: var(--ink); }.history-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 90px; }.history-text { font-size: 1.04rem; line-height: 1.8; }.history-text p { margin: 0 0 22px; }.timeline { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 75px; }.timeline article { min-height: 151px; padding: 23px 22px; border-top: 5px solid var(--yellow); border-right: 1px solid #484743; }.timeline article:last-child { border-right: 0; }.timeline b { display: block; color: var(--yellow); font: 500 1.8rem "Oswald", sans-serif; }.timeline span { font-size: .85rem; line-height: 1.45; display: block; margin-top: 8px; }
.honours { padding: 120px 0; }.honours-heading { display: grid; grid-template-columns: 90px 1fr; }.honours-heading .eyebrow { grid-column: 2; margin-top: -17px; }.honours-heading h2 { grid-column: 2; }.stat-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; margin-top: 55px; }.stat { min-height: 215px; padding: 30px; background: var(--cream); border-left: 1px solid #d9cdb4; }.stat.primary { color: #fff8e8; background: var(--red); border: none; }.stat span { display: block; font: 600 4.8rem/1 "Oswald", sans-serif; }.stat p { margin: 13px 0 0; line-height: 1.35; }.champions-list { margin-top: 48px; border-top: 1px solid #d8cdb6; }.champions-list div { display: grid; grid-template-columns: 200px 1fr; border-bottom: 1px solid #d8cdb6; padding: 15px 0; }.champions-list span { color: var(--red); font: 600 1.25rem "Oswald", sans-serif; }.champions-list p { margin: 0; }
.ofi { color: #fff8e8; padding: 110px 0; background: linear-gradient(105deg, var(--red) 0 71%, var(--yellow) 71%); }.ofi-grid { display: grid; grid-template-columns: 280px 1fr; gap: 90px; align-items: center; }.ofi-badge { width: 220px; height: 220px; padding-top: 45px; border: 8px solid var(--yellow); border-radius: 50%; text-align: center; font: 700 3.5rem/.8 "Oswald", sans-serif; color: var(--yellow); transform: rotate(-8deg); }.ofi-badge small { font-size: .73rem; line-height: 1.2; letter-spacing: .14em; }.ofi p:not(.eyebrow) { max-width: 650px; line-height: 1.75; }.ofi-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 31px 0 25px; border-top: 1px solid rgba(255,255,255,.5); border-bottom: 1px solid rgba(255,255,255,.5); }.ofi-stats article { min-height: 103px; padding: 16px 13px; border-right: 1px solid rgba(255,255,255,.35); }.ofi-stats article:last-child { border-right: 0; }.ofi-stats strong { display: block; color: var(--yellow); font: 600 2.8rem/.9 "Oswald", sans-serif; }.ofi-stats span { display: block; margin-top: 9px; font-size: .73rem; line-height: 1.3; text-transform: uppercase; letter-spacing: .05em; }.ofi-campaigns { border-top: 2px solid var(--yellow); }.ofi-campaigns article { display: grid; grid-template-columns: 80px 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.35); }.ofi-campaigns b { color: var(--yellow); font: 600 1.2rem "Oswald", sans-serif; }.ofi-campaigns strong, .ofi-campaigns span { display: block; }.ofi-campaigns strong { font-size: .92rem; }.ofi-campaigns span { margin-top: 3px; font-size: .8rem; line-height: 1.4; }.ofi .ofi-note { margin: 18px 0 0; color: rgba(255,255,255,.77); font-size: .73rem; line-height: 1.45; }
footer { color: #fff8e8; background: var(--ink); }.footer-inner { min-height: 145px; display: flex; gap: 30px; align-items: center; justify-content: space-between; }.footer-inner > div { display: flex; align-items: center; gap: 15px; }.footer-mark { padding: 10px; color: var(--ink); background: var(--yellow); font: 600 1.2rem "Oswald", sans-serif; }.footer-inner p { margin: 0; font: 500 .94rem "Oswald", sans-serif; letter-spacing: .06em; }.footer-inner small { color: #b7b4aa; font-family: "DM Sans", sans-serif; letter-spacing: 0; }.sources { color: #b7b4aa; text-align: right; font: .73rem "DM Sans", sans-serif !important; }.sources a { color: var(--yellow); }
@media (max-width: 720px) { .container { width: min(100% - 34px, 1120px); }.nav-links { display: none; }.hero { min-height: 690px; }.hero-content { min-height: 598px; align-items: flex-start; padding-top: 92px; }.hero-copy { width: 100%; }.hero h1 { font-size: clamp(3.7rem, 17vw, 5rem); }.lead { max-width: 380px; }.hero-art { max-width: none; width: 490px; opacity: .44; right: -180px; bottom: 8px; }.intro, .history-grid, .ofi-grid { display: block; }.intro { padding: 76px 0; }.intro .section-number { margin-bottom: 26px; }.intro > p:last-child { margin-top: 25px; }.history { padding-top: 77px; }.history-text { margin-top: 30px; }.timeline { grid-template-columns: repeat(2, 1fr); margin-top: 45px; }.timeline article:nth-child(2) { border-right: 0; }.timeline article { min-height: 130px; padding: 17px; }.honours { padding: 80px 0; }.honours-heading { grid-template-columns: 1fr; }.honours-heading .eyebrow, .honours-heading h2 { grid-column: auto; }.honours-heading .section-number { margin-bottom: 22px; }.honours-heading .eyebrow { margin-top: 0; }.stat-grid { grid-template-columns: 1fr; margin-top: 38px; }.stat { min-height: 150px; }.champions-list div { grid-template-columns: 130px 1fr; gap: 15px; }.ofi { padding: 80px 0; background: var(--red); }.ofi-badge { width: 160px; height: 160px; padding-top: 31px; font-size: 2.6rem; margin-bottom: 42px; }.ofi-stats { grid-template-columns: 1fr; }.ofi-stats article { min-height: 80px; display: flex; align-items: center; gap: 18px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.35); }.ofi-stats article:last-child { border-bottom: 0; }.ofi-stats span { margin: 0; }.footer-inner { padding: 30px 0; display: block; }.sources { margin-top: 22px !important; text-align: left; } }