@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --primary:#533afd;
  --primary-deep:#4434d4;
  --primary-press:#2e2b8c;
  --primary-soft:#665efd;
  --primary-subdued:#b9b9f9;
  --brand-dark:#1c1e54;
  --ink:#0d253d;
  --ink-secondary:#273951;
  --ink-mute:#64748d;
  --canvas:#ffffff;
  --canvas-soft:#f6f9fc;
  --canvas-cream:#f5e9d4;
  --hairline:#e3e8ee;
  --hairline-input:#a8c3de;
  --ruby:#ea2261;
  --magenta:#f96bee;
  --lemon:#9b6829;
  --shadow-blue:#003770;
  --radius-xs:4px;
  --radius-sm:6px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-xl:16px;
  --radius-pill:9999px;
}

html{font-size:16px;scroll-behavior:smooth}

body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-weight:300;
  font-size:15px;
  line-height:1.4;
  color:var(--ink);
  background:var(--canvas);
  font-feature-settings:"ss01";
  -webkit-font-smoothing:antialiased;
}

a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}

img{max-width:100%;height:auto;display:block}

.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* ── HEADER ── */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:var(--canvas);
  border-bottom:1px solid var(--hairline);
  height:72px;
  display:flex;
  align-items:center;
}

.header-inner{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.site-logo{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  flex-shrink:0;
}

.logo-mark{
  width:36px;
  height:36px;
}

.logo-wordmark{
  font-size:18px;
  font-weight:500;
  color:var(--ink);
  letter-spacing:-0.3px;
  line-height:1;
}

.logo-wordmark span{color:var(--primary)}

.site-nav{display:flex;align-items:center;gap:4px}

.site-nav a{
  font-size:14px;
  font-weight:400;
  color:var(--ink-secondary);
  padding:8px 12px;
  border-radius:var(--radius-md);
  transition:color 0.15s,background 0.15s;
  text-decoration:none;
}

.site-nav a:hover{color:var(--ink);background:var(--canvas-soft)}
.site-nav a.active{color:var(--primary)}

.burger-btn{
  display:none;
  background:none;
  border:none;
  cursor:pointer;
  padding:8px;
  color:var(--ink);
}

/* ── GRADIENT MESH HERO ── */
.hero-mesh{
  position:relative;
  overflow:hidden;
  padding:80px 0 64px;
  background:var(--canvas);
}

.hero-mesh::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 10% 20%,#f5e9d4 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 30% 10%,#fed7aa 0%,transparent 50%),
    radial-gradient(ellipse 70% 60% at 60% 0%,#e0d7fd 0%,transparent 55%),
    radial-gradient(ellipse 50% 40% at 80% 20%,#533afd22 0%,transparent 50%),
    radial-gradient(ellipse 40% 30% at 95% 10%,#ea226133 0%,transparent 45%),
    radial-gradient(ellipse 30% 25% at 50% 50%,#f96bee11 0%,transparent 40%);
  opacity:0.9;
  z-index:0;
}

.hero-mesh .container{position:relative;z-index:1}

.hero-eyebrow{
  display:inline-flex;
  align-items:center;
  background:var(--primary-subdued);
  color:var(--primary-deep);
  font-size:10px;
  font-weight:400;
  letter-spacing:0.1px;
  text-transform:uppercase;
  padding:4px 8px;
  border-radius:var(--radius-pill);
  margin-bottom:20px;
}

.hero-title{
  font-size:48px;
  font-weight:300;
  line-height:1.15;
  letter-spacing:-0.96px;
  color:var(--ink);
  max-width:680px;
  margin-bottom:20px;
}

.hero-desc{
  font-size:16px;
  font-weight:300;
  color:var(--ink-secondary);
  max-width:520px;
  line-height:1.6;
  margin-bottom:32px;
}

/* ── SEASONAL SUMMARY BAND ── */
.season-band{
  background:var(--canvas-cream);
  padding:48px 0;
  border-radius:0;
}

.season-band-inner{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}

.season-stat{
  text-align:center;
}

.season-stat-num{
  font-size:32px;
  font-weight:300;
  letter-spacing:-0.64px;
  color:var(--ink);
  display:block;
  margin-bottom:4px;
}

.season-stat-label{
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:-0.39px;
}

/* ── COVERAGE LIST ── */
.coverage-section{padding:64px 0}

.section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:32px;
}

.section-title{
  font-size:26px;
  font-weight:300;
  letter-spacing:-0.26px;
  color:var(--ink);
}

.section-link{
  font-size:14px;
  color:var(--primary);
}

.coverage-list{display:flex;flex-direction:column;gap:0}

.coverage-item{
  display:grid;
  grid-template-columns:120px 1fr auto;
  align-items:start;
  gap:24px;
  padding:20px 0;
  border-bottom:1px solid var(--hairline);
  text-decoration:none;
  color:inherit;
  transition:background 0.1s;
}

.coverage-item:hover{background:var(--canvas-soft);padding-left:12px;padding-right:12px;margin:0 -12px;border-radius:var(--radius-md)}

.coverage-date{
  font-size:13px;
  color:var(--ink-mute);
  font-weight:400;
  letter-spacing:-0.39px;
  padding-top:3px;
  white-space:nowrap;
}

.coverage-content{}

.coverage-category{
  font-size:10px;
  font-weight:400;
  letter-spacing:0.1px;
  text-transform:uppercase;
  color:var(--primary-deep);
  background:var(--primary-subdued);
  padding:2px 6px;
  border-radius:var(--radius-pill);
  display:inline-block;
  margin-bottom:6px;
}

.coverage-title{
  font-size:18px;
  font-weight:300;
  color:var(--ink);
  letter-spacing:0;
  line-height:1.35;
  margin-bottom:6px;
}

.coverage-summary{
  font-size:14px;
  color:var(--ink-mute);
  line-height:1.5;
}

.coverage-read{
  font-size:13px;
  color:var(--ink-mute);
  white-space:nowrap;
  padding-top:3px;
}

/* ── GALLERY ── */
.gallery-section{
  padding:64px 0;
  background:var(--canvas-soft);
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:32px;
}

.gallery-card{
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:var(--canvas);
  box-shadow:rgba(0,55,112,0.08) 0 1px 3px;
}

.gallery-card img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}

.gallery-caption{
  padding:12px 16px;
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:-0.39px;
}

/* ── FEATURE CARDS ── */
.feature-section{padding:64px 0}

.feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:32px;
}

.feature-card{
  background:var(--canvas);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:32px;
  box-shadow:rgba(0,55,112,0.08) 0 1px 3px;
  text-decoration:none;
  color:inherit;
  display:block;
  transition:box-shadow 0.15s;
}

.feature-card:hover{box-shadow:rgba(0,55,112,0.08) 0 8px 24px,rgba(0,55,112,0.04) 0 2px 6px;text-decoration:none}

.card-category{
  font-size:10px;
  font-weight:400;
  letter-spacing:0.1px;
  text-transform:uppercase;
  color:var(--primary-deep);
  background:var(--primary-subdued);
  padding:2px 6px;
  border-radius:var(--radius-pill);
  display:inline-block;
  margin-bottom:12px;
}

.card-title{
  font-size:20px;
  font-weight:300;
  letter-spacing:-0.2px;
  color:var(--ink);
  line-height:1.3;
  margin-bottom:10px;
}

.card-excerpt{
  font-size:14px;
  color:var(--ink-mute);
  line-height:1.55;
  margin-bottom:16px;
}

.card-meta{
  font-size:13px;
  color:var(--ink-mute);
  display:flex;
  gap:12px;
}

/* ── BREADCRUMBS ── */
.breadcrumbs{
  padding:16px 0;
  font-size:13px;
  color:var(--ink-mute);
}

.breadcrumbs a{color:var(--ink-mute);text-decoration:none}
.breadcrumbs a:hover{color:var(--primary)}
.breadcrumbs span{margin:0 6px}

/* ── ARTICLE ── */
.article-wrap{max-width:780px;margin:0 auto;padding:48px 24px 64px}

.article-header{margin-bottom:40px}

.article-category{
  font-size:10px;
  font-weight:400;
  letter-spacing:0.1px;
  text-transform:uppercase;
  color:var(--primary-deep);
  background:var(--primary-subdued);
  padding:2px 6px;
  border-radius:var(--radius-pill);
  display:inline-block;
  margin-bottom:16px;
}

.article-title{
  font-size:38px;
  font-weight:300;
  letter-spacing:-0.76px;
  line-height:1.1;
  color:var(--ink);
  margin-bottom:16px;
}

.article-meta{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  font-size:13px;
  color:var(--ink-mute);
  padding:16px 0;
  border-top:1px solid var(--hairline);
  border-bottom:1px solid var(--hairline);
}

.article-summary{
  background:var(--canvas-soft);
  border-left:3px solid var(--primary);
  padding:20px 24px;
  border-radius:0 var(--radius-md) var(--radius-md) 0;
  margin:28px 0;
  font-size:16px;
  color:var(--ink-secondary);
  line-height:1.6;
}

.toc{
  background:var(--canvas-cream);
  border-radius:var(--radius-lg);
  padding:24px 28px;
  margin:28px 0;
}

.toc-title{
  font-size:13px;
  font-weight:400;
  letter-spacing:0.1px;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:12px;
}

.toc ol{padding-left:20px}
.toc li{margin:6px 0;font-size:14px}
.toc a{color:var(--primary-deep)}

.key-context{
  background:var(--brand-dark);
  color:#fff;
  border-radius:var(--radius-lg);
  padding:24px 28px;
  margin:28px 0;
}

.key-context-label{
  font-size:10px;
  font-weight:400;
  letter-spacing:0.5px;
  text-transform:uppercase;
  color:var(--primary-subdued);
  margin-bottom:10px;
  display:block;
}

.key-context p{font-size:15px;color:#cbd5e1;line-height:1.6}

.article-body h2{
  font-size:26px;
  font-weight:300;
  letter-spacing:-0.26px;
  color:var(--ink);
  margin:40px 0 16px;
}

.article-body h3{
  font-size:20px;
  font-weight:300;
  letter-spacing:-0.2px;
  color:var(--ink);
  margin:28px 0 12px;
}

.article-body p{
  font-size:16px;
  line-height:1.7;
  color:var(--ink-secondary);
  margin-bottom:20px;
}

.article-body img{
  border-radius:var(--radius-lg);
  margin:28px 0;
  width:100%;
}

.article-body figcaption{
  font-size:13px;
  color:var(--ink-mute);
  text-align:center;
  margin-top:-20px;
  margin-bottom:28px;
  letter-spacing:-0.39px;
}

.not-covered{
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:24px 28px;
  margin:40px 0;
}

.not-covered-title{
  font-size:14px;
  font-weight:500;
  color:var(--ink-mute);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:12px;
}

.not-covered ul{padding-left:20px}
.not-covered li{font-size:14px;color:var(--ink-mute);margin:6px 0;line-height:1.5}

.related-articles{margin:48px 0 0;padding:32px 0;border-top:1px solid var(--hairline)}

.related-title{
  font-size:18px;
  font-weight:300;
  color:var(--ink);
  margin-bottom:20px;
}

.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}

.related-card{
  background:var(--canvas-soft);
  border-radius:var(--radius-lg);
  padding:20px;
  text-decoration:none;
  display:block;
  border:1px solid var(--hairline);
  transition:box-shadow 0.15s;
}

.related-card:hover{box-shadow:rgba(0,55,112,0.08) 0 4px 12px;text-decoration:none}

.related-card-cat{
  font-size:10px;
  color:var(--primary-deep);
  text-transform:uppercase;
  letter-spacing:0.1px;
  margin-bottom:6px;
}

.related-card-title{font-size:16px;font-weight:300;color:var(--ink);line-height:1.35}
.related-card-date{font-size:13px;color:var(--ink-mute);margin-top:8px}

/* ── STATIC PAGES ── */
.page-wrap{max-width:780px;margin:0 auto;padding:48px 24px 64px}

.page-title{
  font-size:38px;
  font-weight:300;
  letter-spacing:-0.76px;
  color:var(--ink);
  margin-bottom:32px;
}

.page-body h2{
  font-size:22px;
  font-weight:300;
  letter-spacing:-0.22px;
  color:var(--ink);
  margin:36px 0 14px;
}

.page-body h3{
  font-size:18px;
  font-weight:300;
  color:var(--ink);
  margin:24px 0 10px;
}

.page-body p{
  font-size:16px;
  line-height:1.7;
  color:var(--ink-secondary);
  margin-bottom:18px;
}

.page-body ul,.page-body ol{padding-left:24px;margin-bottom:18px}
.page-body li{font-size:16px;line-height:1.7;color:var(--ink-secondary);margin:4px 0}

/* ── CONTACT FORM ── */
.form-group{margin-bottom:20px}

.form-label{
  display:block;
  font-size:14px;
  color:var(--ink-secondary);
  margin-bottom:6px;
}

.form-control{
  width:100%;
  background:var(--canvas);
  border:1px solid var(--hairline-input);
  border-radius:var(--radius-sm);
  padding:8px 12px;
  font-size:15px;
  font-family:inherit;
  font-weight:300;
  color:var(--ink);
  transition:border-color 0.15s;
}

.form-control:focus{outline:none;border-color:var(--primary)}

textarea.form-control{min-height:120px;resize:vertical}

.btn-primary{
  background:var(--primary);
  color:#fff;
  border:none;
  border-radius:var(--radius-pill);
  padding:8px 20px;
  font-size:16px;
  font-weight:400;
  cursor:pointer;
  transition:background 0.15s;
  font-family:inherit;
}

.btn-primary:hover{background:var(--primary-press)}
.btn-primary:disabled{opacity:0.6;cursor:not-allowed}

.form-confirm{
  display:none;
  background:var(--canvas-soft);
  border:1px solid var(--hairline);
  border-radius:var(--radius-md);
  padding:16px 20px;
  font-size:15px;
  color:var(--ink-secondary);
  margin-top:16px;
}

/* ── FOOTER ── */
.site-footer{
  background:var(--canvas);
  border-top:1px solid var(--hairline);
  padding:64px 24px;
  margin-top:auto;
}

.footer-inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:40px;
}

.footer-brand-name{
  font-size:18px;
  font-weight:500;
  color:var(--ink);
  margin-bottom:8px;
  letter-spacing:-0.3px;
}

.footer-brand-desc{
  font-size:13px;
  color:var(--ink-mute);
  line-height:1.6;
  max-width:280px;
  letter-spacing:-0.39px;
}

.footer-col-title{
  font-size:13px;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:0.1px;
  color:var(--ink-mute);
  margin-bottom:14px;
}

.footer-links{list-style:none;display:flex;flex-direction:column;gap:10px}

.footer-links a{
  font-size:14px;
  color:var(--ink-mute);
  text-decoration:none;
  transition:color 0.15s;
  letter-spacing:-0.39px;
}

.footer-links a:hover{color:var(--primary)}

.footer-bottom{
  max-width:1200px;
  margin:32px auto 0;
  padding-top:24px;
  border-top:1px solid var(--hairline);
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:-0.39px;
}

/* ── COOKIE BANNER ── */
.cookie-banner{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:var(--brand-dark);
  color:#fff;
  padding:20px 24px;
  z-index:200;
  display:none;
}

.cookie-banner.visible{display:block}

.cookie-inner{
  max-width:1200px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
}

.cookie-text{font-size:14px;color:#cbd5e1;line-height:1.5;flex:1;min-width:200px}
.cookie-text a{color:var(--primary-subdued)}

.cookie-actions{display:flex;gap:10px;flex-shrink:0}

.btn-cookie-accept{
  background:var(--primary);
  color:#fff;
  border:none;
  border-radius:var(--radius-pill);
  padding:8px 16px;
  font-size:14px;
  font-weight:400;
  cursor:pointer;
  font-family:inherit;
}

.btn-cookie-reject{
  background:transparent;
  color:#cbd5e1;
  border:1px solid #3d4f6a;
  border-radius:var(--radius-pill);
  padding:8px 16px;
  font-size:14px;
  cursor:pointer;
  font-family:inherit;
}

.btn-cookie-settings{
  background:transparent;
  color:#7c93b0;
  border:none;
  font-size:13px;
  cursor:pointer;
  text-decoration:underline;
  font-family:inherit;
  padding:0;
}

/* ── MOBILE NAV ── */
.mobile-nav{
  display:none;
  position:fixed;
  inset:0;
  background:var(--canvas);
  z-index:150;
  flex-direction:column;
  padding:80px 24px 40px;
  gap:8px;
  overflow-y:auto;
}

.mobile-nav.open{display:flex}

.mobile-nav a{
  font-size:22px;
  font-weight:300;
  color:var(--ink);
  padding:12px 0;
  border-bottom:1px solid var(--hairline);
  text-decoration:none;
}

.mobile-nav-close{
  position:absolute;
  top:20px;
  right:20px;
  background:none;
  border:none;
  cursor:pointer;
  font-size:28px;
  color:var(--ink);
  line-height:1;
}

/* ── RESPONSIVE ── */
@media(max-width:1023px){
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .season-band-inner{grid-template-columns:repeat(2,1fr)}
  .footer-inner{grid-template-columns:1fr 1fr}
}

@media(max-width:767px){
  .site-nav{display:none}
  .burger-btn{display:flex;align-items:center;justify-content:center}
  .hero-title{font-size:32px;letter-spacing:-0.64px}
  .coverage-item{grid-template-columns:1fr;gap:8px}
  .coverage-date{display:none}
  .coverage-read{display:none}
  .feature-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:1fr}
  .season-band-inner{grid-template-columns:repeat(2,1fr)}
  .footer-inner{grid-template-columns:1fr}
  .related-grid{grid-template-columns:1fr}
  .article-title{font-size:28px}
  .page-title{font-size:28px}
  .cookie-inner{flex-direction:column;align-items:flex-start}
  .cookie-actions{flex-wrap:wrap}
}