/* ==========================================================================
   Editorial, light. Paper grounds and navy type; the banner and the two
   deliberate dark anchors keep their weight so the page still has a spine.
   ========================================================================== */
:root{
  --paper:#FFFFFF;
  --paper-2:#EEF3F7;
  --paper-3:#DCE5EC;
  --line:#D2DDE6;
  --text:#0E2C43;
  --text-mute:#4A6076;
  --brass:#F0A83C;          /* fill, carries ink text */
  --brass-ink:#7A5410;      /* 6.77:1 on white */
  --brass-lite:#8A5F14;
}
body{background:var(--paper);color:var(--text)}

/* dark sections become paper */
.dark{background:var(--paper-2);color:var(--text)}
.dark h1,.dark h2,.dark h3{color:var(--text)}
.dark .lede{color:var(--text-mute)}
.dark .eyebrow{color:var(--brass-ink)}
.dark .eyebrow::before{background:var(--brass-ink)}

/* header */
.alertbar{background:var(--text);color:#F2F6F9}
.alertbar a{color:#FFC15E}
.site-head{background:var(--paper);border-bottom:1px solid var(--line)}
.brand img{filter:invert(1)}
.nav a{color:var(--text-mute)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--text)}
.nav a::after{background:var(--brass-ink)}
.burger{border-color:var(--line)}
.burger span{background:var(--text)}
.drawer{background:var(--paper)}
.drawer a{color:var(--text);border-bottom-color:var(--line)}
.head-callback{color:var(--text-mute)}

/* the banner keeps its weight — it is the one dark moment up top */
.hero--roll{background:#14324B}
.slide__bg img{opacity:.30}

/* featured strip, panels, slabs */
.featured{background:var(--paper);border-bottom-color:var(--line)}
.fs__item{border-left-color:var(--line);color:var(--text)}
.fs__ref{color:var(--text-mute)}
.panel{background:var(--paper)}
.panel__grid{background:#1B4A6E}
.offset{background:var(--paper-2)}
.offset__card{background:#fff;box-shadow:0 24px 60px -30px rgba(14,44,67,.28)}
.offset__art{background:#14324B;box-shadow:0 24px 60px -30px rgba(14,44,67,.28)}
.offset__slab--tl{background:#C9DAE7}
.offset__slab--br{background:var(--brass)}

/* components */
.btn-line{border-color:var(--text);color:var(--text)}
.btn-line:hover{background:var(--text);color:#fff}
/* the banner stays dark, so its outline button keeps the light modifier */
.hero--roll .btn-line--light{border-color:rgba(255,255,255,.62);color:#fff}
.hero--roll .btn-line--light:hover{background:#fff;color:#14324B;border-color:#fff}
.areas{background:transparent;border:0}
.area{background:#fff;color:var(--text);min-height:0;
  box-shadow:0 2px 4px rgba(14,44,67,.08), 0 16px 34px -14px rgba(14,44,67,.32)}
.area::after{display:none}
.area img{position:relative;height:210px;filter:grayscale(.7) contrast(1.04) brightness(.95);z-index:0}
.area:hover img,.area:focus-visible img{filter:grayscale(0) brightness(1);transform:scale(1.05)}
.area__body{min-height:0;padding:24px 26px 28px;justify-content:flex-start}
.area h3{color:var(--text)}
.area p{color:var(--text-mute);max-height:none;opacity:1;margin-top:10px}
.area__num{display:none}
.tile{background:#fff;border-color:var(--line)}
.tile__more{color:var(--brass-ink)}
.areas-index__h{color:var(--brass-ink)}
.stats{background:var(--line);border-color:var(--line)}
.stat{background:var(--paper)}
.stat dt{color:var(--brass-ink)}
.stat dd{color:var(--text-mute)}
.split__media img{filter:grayscale(.3) contrast(1.02)}
.page-head.dark{background:var(--paper-2)}
.page-head--area .hero__bg img{opacity:.26}
.page-head--area .hero__bg::after{
  background:linear-gradient(96deg,rgba(238,243,247,.96) 0%,rgba(238,243,247,.8) 48%,rgba(238,243,247,.45) 100%)}
.crumbs{color:var(--text-mute)}

/* form on paper */
.field label{color:var(--text-mute)}
.field input,.field select,.field textarea{background:#fff;border-color:var(--line);color:var(--text)}
.field select option{background:#fff;color:var(--text)}
.form .consent,.form-note{color:var(--text-mute)}
.form .consent a,.form-note a{color:var(--brass-ink)!important}
.info-list dt,.info-list .k{color:var(--brass-ink)}
.trust-rating a{color:var(--text-invert-mute)}

/* the two dark anchors */
.cta.dark{background:#14324B;color:#F2F6F9}
.cta.dark h2{color:#F2F6F9}
.cta.dark .lede{color:#B9CBD9}
.cta.dark .eyebrow{color:#FFC15E}
.cta.dark .eyebrow::before{background:#FFC15E}
.cta.dark .btn--ghost{border-color:#F2F6F9;color:#F2F6F9}
.cta.dark .btn--ghost:hover{background:#F2F6F9;color:#14324B}
.site-foot{background:#14324B;color:#B9CBD9}
.site-foot .foot-grid h3{color:#F2F6F9}
.callbar{background:#14324B}
.cm__lines line{stroke:#FFC15E}
.cm__dot{fill:#FFC15E}
.cm__dot--hub{stroke:#FFC15E}
.courtmap figcaption strong{color:#FFC15E}

/* the banner stays dark in this theme, so the lead line keeps the bright amber
   rather than the paper-ground accent */
.hero--roll .hero__lead{color:#FFC15E}
.hero--roll .hero__sub{color:#C3D3E0}
.hero--roll .trustbar ul{color:#B9CBD9}
.hero--roll .trust-rating a{color:#B9CBD9}
.hero--roll .trust-rating strong{color:#FFC15E}
.info-note{color:var(--text-mute)}
.caps{background:var(--paper)}
.cap:hover{background:var(--paper-2)}
.chip{border-color:var(--line);color:var(--text)}
.chip:hover{border-color:var(--brass);background:var(--brass);color:#0C2233}
.about__map{background:#14324B}
.caps .area{background:#fff;
  box-shadow:0 2px 5px rgba(14,44,67,.08), 0 18px 38px -18px rgba(14,44,67,.30)}
.caps .area:hover,.caps .area:focus-visible{
  box-shadow:0 5px 12px rgba(14,44,67,.12), 0 32px 60px -20px rgba(14,44,67,.38)}
.caps .area__num{color:var(--brass-ink)}
