/* ==========================================================================
   SPCCU design system · v2
   Values mirror the Elementor kit (Site Settings → Global Colours / Fonts),
   which the plugin writes on import. Components are styled by class so the
   SPCCU widgets render identically in the editor and on the front end.
   ========================================================================== */

:root {
  --green-950: #062614;
  --green-900: #0b3a20;
  --green-800: #114a2a;
  --green-700: #0a6b1c;     /* Primary */
  --green-600: #0d8c00;     /* Logo green: marks and rules only */
  --green-100: #e5efe6;
  --green-50: #f2f6f2;
  --ink: #121c16;
  --text: #36443c;
  --muted: #5a6860;
  --line: #d9e0db;
  --line-2: #b8c4bc;
  --surface: #f4f6f4;
  --blue: #0b3a20;          /* Online banking: deep brand green */
  --blue-dark: #062614;
  --focus: #1d6fd1;
  --amber: #99500a;         /* Member notices only */
  --amber-bg: #fbf3e4;

  --f-head: "Libre Franklin", "Franklin Gothic Medium", Arial, sans-serif;
  --f-body: "Public Sans", "Segoe UI", Arial, sans-serif;

  --t-display: clamp(2.125rem, 1.45rem + 2.4vw, 3.25rem);
  --t-h1: clamp(2rem, 1.55rem + 1.7vw, 2.875rem);
  --t-h2: clamp(1.5rem, 1.28rem + 0.9vw, 2rem);
  --t-h3: 1.1875rem;
  --t-body: 1.0625rem;
  --t-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --t-small: 0.875rem;
  --t-label: 0.75rem;

  --w: 1200px;
  --g: clamp(1.125rem, 0.5rem + 2.6vw, 2.5rem);
  --pad: clamp(3.5rem, 2.4rem + 4.2vw, 6.25rem);
  --r: 3px;
  --ease: 180ms cubic-bezier(0.25, 0.6, 0.3, 1);
}

/* Base ------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
body { margin: 0; background: #fff; color: var(--text); font: 400 var(--t-body)/1.62 var(--f-body); -webkit-font-smoothing: antialiased; font-feature-settings: "kern"; }
img, svg { max-width: 100%; display: block; }
img { height: auto; }
:where(.spccu) h1, :where(.spccu) h2, :where(.spccu) h3, :where(.spccu) h4 { font-family: var(--f-head); color: var(--ink); font-weight: 600; margin: 0 0 0.5em; text-wrap: balance; }
:where(.spccu) h1 { font-size: var(--t-h1); line-height: 1.1; letter-spacing: -0.02em; }
:where(.spccu) h2 { font-size: var(--t-h2); line-height: 1.18; letter-spacing: -0.015em; }
:where(.spccu) h3 { font-size: var(--t-h3); line-height: 1.3; letter-spacing: -0.005em; }
:where(.spccu) h4 { font-size: 1rem; line-height: 1.35; }
:where(.spccu) p { margin: 0 0 1em; }
:where(.spccu) ul, :where(.spccu) ol { margin: 0 0 1em; padding-left: 1.15em; }
a { color: var(--green-700); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--green-900); text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.on-dark :focus-visible { outline-color: #fff; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 1rem; top: -5rem; z-index: 300; padding: 0.75rem 1rem; background: var(--ink); color: #fff; }
.skip:focus { top: 1rem; color: #fff; }
[hidden] { display: none !important; }

.wrap { width: 100%; max-width: calc(var(--w) + 2 * var(--g)); margin-inline: auto; padding-inline: var(--g); }
.band { padding-block: var(--pad); }
.band--tight { padding-block: calc(var(--pad) * 0.62); }
.band--surface { background: var(--surface); }
.band--rule { border-top: 1px solid var(--line); }
.nowrap { white-space: nowrap; }
.num { font-variant-numeric: tabular-nums lining-nums; }
.lead { font-size: var(--t-lead); color: var(--muted); }
.muted { color: var(--muted); }
.small { font-size: var(--t-small); }
.label { font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.icon { width: 1.2em; height: 1.2em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* Section head: title on a hairline, optional link at the right */
.sh { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 0.35rem 2rem; padding-bottom: 1rem; margin-bottom: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); border-bottom: 1px solid var(--ink); }
.sh h2 { margin: 0; }
.sh .sh-link { grid-column: 2; grid-row: 1; }
.sh p { grid-column: 1 / -1; margin: 0; color: var(--muted); max-width: 46rem; }
@media (max-width: 559px) { .sh { grid-template-columns: 1fr; } .sh .sh-link { grid-column: 1; grid-row: 3; margin-top: 0.4rem; } }
.sh-link { font-weight: 600; text-decoration: none; display: inline-flex; gap: 0.35rem; align-items: center; white-space: nowrap; }
.sh-link:hover { text-decoration: underline; }
.on-dark .sh { border-color: rgba(255, 255, 255, 0.5); }

/* Buttons ---------------------------------------------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 48px; padding: 0.65rem 1.4rem; border: 1px solid transparent; border-radius: var(--r); font: 600 0.9688rem/1.2 var(--f-body); text-align: center; text-decoration: none; cursor: pointer; transition: background var(--ease), color var(--ease), border-color var(--ease); }
.btn .icon { width: 1.05rem; height: 1.05rem; }
.btn--primary { background: var(--green-700); color: #fff; }
.btn--primary:hover { background: var(--green-900); color: #fff; }
.btn--bank { background: var(--blue); color: #fff; }
.btn--bank:hover { background: var(--blue-dark); color: #fff; }
.btn--line { border-color: var(--line-2); color: var(--ink); background: #fff; }
.btn--line:hover { border-color: var(--ink); color: var(--ink); }
.btn--white { background: #fff; color: var(--green-900); }
.btn--white:hover { background: var(--green-100); color: var(--green-900); }
.btn--clear { border-color: rgba(255, 255, 255, 0.55); color: #fff; }
.btn--clear:hover { border-color: #fff; background: rgba(255, 255, 255, 0.08); color: #fff; }
.btn--sm { min-height: 42px; padding: 0.45rem 1rem; font-size: 0.9063rem; }
.btn--block { width: 100%; }
.btns { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.go { display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 600; text-decoration: none; }
.go .icon { width: 1rem; height: 1rem; transition: transform var(--ease); }
.go:hover { text-decoration: underline; }
.go:hover .icon { transform: translateX(2px); }

/* Our controls are reset explicitly so global button styles never leak in */
.spccu .nav-top, .spccu .tab, .spccu .chip, .spccu .slider-tab, .spccu .menu-btn, .spccu .slider-pause { background-color: transparent; box-shadow: none; text-transform: none; letter-spacing: normal; }

/* Utility bar + header -------------------------------------------------- */
.util { background: var(--surface); border-bottom: 1px solid var(--line); font-size: 0.8125rem; color: var(--muted); }
.util .wrap { display: flex; justify-content: space-between; gap: 1rem; max-width: calc(1320px + 2 * var(--g)); }
.util ul { display: flex; flex-wrap: wrap; gap: 0 1.5rem; margin: 0; padding: 0; list-style: none; }
.util a, .util span { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 36px; color: inherit; text-decoration: none; }
.util a:hover { color: var(--ink); text-decoration: underline; }
.util .icon { width: 0.95rem; height: 0.95rem; }

.site-header, .elementor-location-header { position: sticky; top: -37px; z-index: 100; }
.admin-bar .site-header, .admin-bar .elementor-location-header { top: -5px; }
.hdr { position: relative; background: #fff; border-bottom: 1px solid var(--line); }
.hdr > .wrap { display: flex; align-items: center; gap: 1.5rem; min-height: 80px; max-width: calc(1320px + 2 * var(--g)); }
.logo { display: flex; align-items: center; gap: 0.8rem; margin-right: auto; color: var(--ink); text-decoration: none; }
.logo img { width: 46px; height: auto; }
.logo b { display: block; font: 600 1.0313rem/1.15 var(--f-head); letter-spacing: -0.01em; white-space: nowrap; }
.logo span { display: block; font-size: 0.75rem; color: var(--muted); white-space: nowrap; }
.logo:hover { color: var(--ink); }
.hdr-cta { display: flex; gap: 0.6rem; flex: none; }
.hdr-cta .btn { white-space: nowrap; }
.menu-btn { display: none; }

.nav > ul { display: flex; margin: 0; padding: 0; list-style: none; }
.nav-top { position: relative; display: inline-flex; align-items: center; gap: 0.3rem; min-height: 80px; padding: 0 0.85rem; background: none; border: 0; font: 500 0.9688rem/1 var(--f-body); color: var(--ink); text-decoration: none; cursor: pointer; white-space: nowrap; }
.nav-top::after { content: ""; position: absolute; left: 0.85rem; right: 0.85rem; bottom: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transition: transform var(--ease); }
.nav-top:hover, .nav-top[aria-expanded="true"] { color: var(--green-700); }
.nav-top:hover::after, .nav-top[aria-expanded="true"]::after, .nav-top.is-current::after { transform: scaleX(1); }
.nav-top .icon { width: 0.85rem; height: 0.85rem; transition: transform var(--ease); }
.nav-top[aria-expanded="true"] .icon { transform: rotate(180deg); }
.mega { position: absolute; left: 0; right: 0; top: 100%; display: none; background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); box-shadow: 0 18px 30px -24px rgba(6, 38, 20, 0.45); }
.has-mega.open > .mega { display: block; }
.mega .wrap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; padding-block: 2rem 2.25rem; max-width: calc(1320px + 2 * var(--g)); }
.mega h3 { margin: 0 0 0.75rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--line); font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega a { display: block; padding: 0.38rem 0; color: var(--ink); text-decoration: none; font-size: 0.9688rem; }
.mega a:hover { color: var(--green-700); text-decoration: underline; }
.mega-feature { padding: 1.25rem 1.4rem; background: var(--surface); }
.mega-feature p { font-size: 0.9375rem; margin: 0 0 0.9rem; }
.mega-feature b { display: block; font: 600 1.0625rem/1.3 var(--f-head); color: var(--ink); margin-bottom: 0.35rem; }
.drawer-head, .drawer-cta { display: none; }

@media (max-width: 1439px) { .hdr-cta .btn--line { display: none; } }
@media (max-width: 1239px) {
  .hdr > .wrap { min-height: 68px; gap: 0.75rem; }
  .menu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; min-width: 48px; height: 48px; margin-right: -0.6rem; padding: 0 0.6rem; background: none; border: 0; color: var(--ink); font: 600 0.875rem var(--f-body); cursor: pointer; }
  .menu-btn .icon { width: 1.5rem; height: 1.5rem; }
  .nav { position: fixed; inset: 0; z-index: 200; background: #fff; overflow-y: auto; overscroll-behavior: contain; visibility: hidden; opacity: 0; transform: translateY(-8px); transition: opacity 200ms ease, transform 200ms ease, visibility 0s 200ms; }
  .nav.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 68px; padding: 0 var(--g); border-bottom: 1px solid var(--line); }
  .nav > ul { display: block; padding: 0 var(--g); }
  .nav > ul > li { border-bottom: 1px solid var(--line); }
  .nav-top { width: 100%; min-height: 60px; padding: 0; justify-content: space-between; font: 600 1.1875rem/1.2 var(--f-head); }
  .nav-top::after { display: none; }
  .mega { position: static; border: 0; box-shadow: none; }
  .mega .wrap { grid-template-columns: 1fr; gap: 1.25rem; padding: 0 0 1.5rem; }
  .mega a { padding: 0.6rem 0; font-size: 1rem; }
  .mega-feature { display: none; }
  .drawer-cta { display: grid; gap: 0.6rem; padding: 1.5rem var(--g) 2.5rem; }
  .drawer-cta p { margin: 0.75rem 0 0; font-size: 0.9375rem; color: var(--muted); }
}
@media (max-width: 719px) {
  .util .u-wide { display: none; }
  .logo img { width: 40px; }
  .logo b { font-size: 0.9688rem; }
  .logo span { display: none; }
  .hdr-cta { display: none; }
}

/* Mobile action bar */
.mbar { display: none; }
@media (max-width: 719px) {
  body.spccu-site { padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
  .mbar { position: fixed; inset: auto 0 0; z-index: 90; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; background: #fff; border-top: 1px solid var(--line-2); padding-bottom: env(safe-area-inset-bottom); }
  .mbar a { display: grid; justify-items: center; align-content: center; gap: 0.2rem; min-height: 62px; color: var(--ink); text-decoration: none; font: 600 0.6875rem/1 var(--f-body); }
  .mbar a + a { border-left: 1px solid var(--line); }
  .mbar .icon { width: 1.35rem; height: 1.35rem; }
  .mbar .is-bank { background: var(--blue); color: #fff; }
}

/* Slider ----------------------------------------------------------------- */
.slider { position: relative; background: var(--green-900); color: #cfe0d4; }
.slides { display: grid; }
.slide { grid-area: 1 / 1; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: clamp(31rem, 26rem + 12vw, 38rem); opacity: 0; visibility: hidden; transition: opacity 600ms ease, visibility 0s 600ms; }
.slide.is-active { opacity: 1; visibility: visible; transition-delay: 0s; }
.slide-copy { display: flex; flex-direction: column; justify-content: center; padding: 4rem 3.5rem 8.5rem max(var(--g), calc((100vw - var(--w)) / 2)); }
.slide-kicker { margin: 0 0 1.25rem; font: 600 0.8125rem/1.3 var(--f-body); letter-spacing: 0.06em; text-transform: uppercase; color: #9fd0a8; }
.slider .slide-title { margin: 0 0 1.1rem; font: 600 var(--t-display)/1.06 var(--f-head); letter-spacing: -0.025em; color: #fff; max-width: 14ch; }
.slide-text { max-width: 31rem; margin: 0 0 2rem; font-size: var(--t-lead); line-height: 1.55; }
.slide-media { position: relative; overflow: hidden; background: var(--green-800); }
.spccu .slide-media img { max-width: none; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 7s linear; }
.slide.is-active .slide-media img { transform: scale(1); }
.slide-fact { position: absolute; right: 0; bottom: 0; max-width: 20rem; padding: 1.1rem 1.4rem; background: #fff; color: var(--ink); font-size: 0.875rem; line-height: 1.4; }
.slide-fact b { display: block; font: 600 1.625rem/1.1 var(--f-head); letter-spacing: -0.02em; color: var(--green-700); margin-bottom: 0.2rem; }
.slider-nav { position: absolute; left: max(var(--g), calc((100vw - var(--w)) / 2)); bottom: 2.5rem; width: calc(41.666% - max(var(--g), calc((100vw - var(--w)) / 2)) - 3.5rem); display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0.75rem; }
.slider-tab { position: relative; min-height: 48px; padding: 0.9rem 0 0; background: none; border: 0; border-top: 2px solid rgba(255, 255, 255, 0.22); color: rgba(255, 255, 255, 0.62); font: 500 0.8125rem/1.25 var(--f-body); text-align: left; cursor: pointer; }
.slider-tab::before { content: ""; position: absolute; left: 0; top: -2px; height: 2px; width: 0; background: #fff; }
.slider-tab[aria-selected="true"] { color: #fff; }
.slider-tab[aria-selected="true"]::before { width: 100%; }
.slider.is-playing .slider-tab[aria-selected="true"]::before { animation: spccu-progress var(--dur, 7s) linear forwards; }
.slider-tab:hover { color: #fff; }
.slider-pause { position: absolute; right: -2.75rem; bottom: 0; width: 40px; height: 40px; display: grid; place-items: center; background: none; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; color: #fff; cursor: pointer; }
.slider-pause .icon { width: 0.9rem; height: 0.9rem; }
@keyframes spccu-progress { from { width: 0; } to { width: 100%; } }
@media (max-width: 1023px) {
  .slide { grid-template-columns: 1fr; grid-template-rows: auto 1fr; min-height: 0; }
  .slide-media { order: -1; aspect-ratio: 16 / 10; }
  .slide-copy { justify-content: start; padding: 2rem var(--g) 7rem; }
  .slider .slide-title { max-width: 18ch; }
  .slide-fact { max-width: 15rem; padding: 0.8rem 1rem; }
  .slide-fact b { font-size: 1.25rem; }
  .slider-nav { left: var(--g); right: calc(var(--g) + 3rem); width: auto; bottom: 1.75rem; }
}
@media (max-width: 559px) {
  .slide-media { aspect-ratio: 4 / 3; }
  .slide-text { margin-bottom: 1.5rem; }
  .slide-copy .btns .btn { flex: 1 1 100%; }
  .slider-tab { font-size: 0.75rem; }
}

/* Online banking + tasks ------------------------------------------------- */
.access { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: stretch; }
.tasks { display: flex; flex-direction: column; }
.tasks ul { flex: 1; align-content: stretch; }
.olb { padding: 1.5rem 1.75rem 1.25rem; border: 1px solid var(--line); border-top: 3px solid var(--green-700); background: var(--surface); }
.olb .two { gap: 0.75rem; }
.olb-note { margin: 0.75rem 0 0; font-size: 0.8125rem; color: var(--muted); }
.olb h2 { display: flex; align-items: center; gap: 0.6rem; font-size: 1.375rem; margin-bottom: 1rem; }
.olb h2 .icon { color: var(--green-700); }
.olb > p { font-size: 0.9375rem; color: var(--muted); margin-bottom: 1.25rem; }
.olb form { display: grid; gap: 0.9rem; }
.olb-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem 1rem; margin-top: 1rem; padding-top: 0.9rem; border-top: 1px solid var(--line); font-size: 0.9063rem; }
.olb-links a { color: var(--green-700); font-weight: 600; }
.tasks h2 { font-size: 1.375rem; padding-bottom: 0.9rem; margin: 0; border-bottom: 1px solid var(--ink); }
.tasks ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; margin: 0; padding: 0; list-style: none; }
.tasks li { border-bottom: 1px solid var(--line); }
.tasks a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 100%; min-height: 64px; padding: 0.6rem 0; color: var(--ink); text-decoration: none; font: 500 1.0313rem/1.3 var(--f-body); }
.tasks a small { display: block; font-size: 0.8438rem; color: var(--muted); font-weight: 400; margin-top: 0.1rem; }
.tasks a .icon { color: var(--green-700); width: 1.1rem; height: 1.1rem; transition: transform var(--ease); }
.tasks a:hover { color: var(--green-700); }
.tasks a:hover .icon { transform: translateX(3px); }
@media (max-width: 899px) { .access { grid-template-columns: 1fr; } .olb { order: 2; } }
@media (max-width: 559px) { .tasks ul { grid-template-columns: 1fr; } .tasks a small { display: none; } .tasks a { min-height: 56px; } .olb { padding: 1.25rem; } }

/* Product explorer (tabs) ----------------------------------------------- */
.tabs-list { display: flex; gap: 0; margin: 0 0 1.75rem; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.tabs-list::-webkit-scrollbar { display: none; }
.tab { position: relative; min-height: 52px; padding: 0 1.4rem; background: none; border: 0; color: var(--muted); font: 600 1.0625rem/1 var(--f-head); cursor: pointer; white-space: nowrap; }
.tab:first-child { padding-left: 0; }
.tab::after { content: ""; position: absolute; left: 1.4rem; right: 1.4rem; bottom: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transition: transform var(--ease); }
.tab:first-child::after { left: 0; }
.tab[aria-selected="true"] { color: var(--ink); }
.tab[aria-selected="true"]::after { transform: scaleX(1); }
.tab:hover { color: var(--ink); }
.px-panel { display: block; }
.px-intro h3 { font-size: 1.25rem; }
.px-intro p { font-size: 0.9688rem; }
.px-intro img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 1.25rem; }
.px-intro p { color: var(--muted); }
@media (max-width: 899px) { .px-panel { grid-template-columns: 1fr; gap: 1.25rem; } }
@media (max-width: 479px) { .px-intro { grid-template-columns: 1fr; } .px-intro img { display: none; } .tab { padding: 0 1rem; font-size: 1rem; } .tab::after { left: 1rem; right: 1rem; } }

/* Product tiles: equal cells on shared hairlines, figure-led */
.px-lead { display: flex; justify-content: space-between; gap: 2rem; margin: 0 0 1.5rem; max-width: 44rem; color: var(--muted); }
.tiles { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--line); border: 1px solid var(--line); }
.tiles li { display: flex; background: #fff; }
.tile { position: relative; display: flex; flex-direction: column; width: 100%; min-height: 12.25rem; padding: 1.4rem 1.5rem 1.3rem; color: var(--text); text-decoration: none; transition: background var(--ease); }
.tile::before { content: ""; position: absolute; inset: -1px auto auto -1px; right: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transform-origin: left; transition: transform 220ms ease; }
.tile:hover { background: var(--green-50); color: var(--text); }
.tile:hover::before { transform: scaleX(1); }
.tile h3 { margin: 0 0 0.4rem; font-size: 1.125rem; color: var(--ink); }
.tile p { margin: 0; font-size: 0.9063rem; line-height: 1.5; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tile-fig { margin-top: auto; padding-top: 1.25rem; }
.tile-fig span { display: block; font: 600 0.6875rem/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.tile-fig b { display: block; margin-top: 0.2rem; font: 600 1.5rem/1.15 var(--f-head); letter-spacing: -0.015em; color: var(--green-700); font-variant-numeric: tabular-nums; }
.tile > .icon { position: absolute; right: 1.35rem; bottom: 1.5rem; width: 1.1rem; height: 1.1rem; color: var(--green-700); transition: transform var(--ease); }
.tile:hover > .icon { transform: translateX(3px); }
.tile--all { background: var(--surface); }
.tiles li.tile-all-cell.is-wide { grid-column: 1 / -1; }
.tiles li.tile-all-cell.is-wide .tile { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.5rem; min-height: 0; padding-block: 1.1rem; }
.tiles li.tile-all-cell.is-wide .tile p { -webkit-line-clamp: 1; }
.tiles li.tile-all-cell.is-wide .tile > .icon { position: static; }
.tiles li.tile-all-cell.is-wide h3 { margin: 0; }
.tile--all h3 { color: var(--green-700); }
.tile--all p { -webkit-line-clamp: 3; }
@media (max-width: 1023px) { .tiles { grid-template-columns: repeat(min(var(--cols, 4), 2), minmax(0, 1fr)); } .tile { min-height: 11.5rem; } }
@media (max-width: 559px) {
  .tiles { grid-template-columns: 1fr; }
  .tile { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 1rem; min-height: 0; padding: 1.1rem 1.1rem; }
  .tile h3 { grid-column: 1; }
  .tile p { grid-column: 1; -webkit-line-clamp: 1; }
  .tile-fig { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0; padding: 0; text-align: right; }
  .tile-fig b { font-size: 1.125rem; }
  .tile > .icon { display: none; }
  .tile--all { display: block; }
}

/* Explorer list: name + one key figure, two columns, easy to scan */
.plist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.plist li { border-bottom: 1px solid var(--line); }
.plist a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.15rem 1rem; min-height: 76px; padding: 0.85rem 0; color: var(--ink); text-decoration: none; }
.plist b { font: 600 1.0625rem/1.3 var(--f-head); }
.plist span { grid-column: 1; font-size: 0.875rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.plist span strong { color: var(--ink); font-weight: 600; }
.plist .icon { grid-column: 2; grid-row: 1 / span 2; color: var(--green-700); width: 1rem; height: 1rem; transition: transform var(--ease); }
.plist a:hover b { color: var(--green-700); text-decoration: underline; text-underline-offset: 0.18em; }
.plist a:hover .icon { transform: translateX(3px); }
@media (max-width: 719px) { .plist { grid-template-columns: 1fr; } .plist a { min-height: 64px; } }

/* Ledger rows: the core product list ------------------------------------ */
.ledger { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.ledger-group { margin: 2rem 0 0; padding: 0 0 0.6rem; border-bottom: 1px solid var(--ink); }
.ledger-group:first-child { margin-top: 0; }
.row { display: grid; grid-template-columns: minmax(0, 1fr) 11rem 1.25rem; gap: 0.25rem 2rem; align-items: center; padding: 1.15rem 0; border-bottom: 1px solid var(--line); color: var(--text); text-decoration: none; transition: background var(--ease); }
a.row:hover { background: linear-gradient(90deg, var(--green-50), transparent); color: var(--text); }
.row h3 { margin: 0 0 0.15rem; font-size: 1.0938rem; }
a.row:hover h3 { color: var(--green-700); text-decoration: underline; text-underline-offset: 0.18em; }
.row p { margin: 0; font-size: 0.9375rem; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.row-fig { text-align: right; }
.row-fig span { display: block; font-size: 0.75rem; color: var(--muted); letter-spacing: 0.02em; }
.row-fig b { font: 600 1.125rem/1.25 var(--f-head); color: var(--ink); font-variant-numeric: tabular-nums; }
.row > .icon { color: var(--green-700); }
@media (max-width: 559px) { .row { grid-template-columns: minmax(0, 1fr) auto; } .row > .icon { display: none; } .row p { font-size: 0.875rem; } .row-fig b { font-size: 1rem; } }

/* Inner pages run tighter than the homepage */
body:not(.home) .band { padding-block: clamp(2.75rem, 2rem + 2.6vw, 4.5rem); }
body:not(.home) .band--tight { padding-block: clamp(2.25rem, 1.75rem + 2vw, 3.5rem); }

/* Page header key figures */
.phd-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border: 1px solid var(--line); background: var(--surface); }
.phd-stats > div { padding: 1.1rem 1.25rem; }
.phd-stats > div + div { border-left: 1px solid var(--line); }
.phd-stats dt { font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.4rem; }
.phd-stats dd { margin: 0; font: 600 1.375rem/1.15 var(--f-head); color: var(--green-700); letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
@media (max-width: 559px) { .phd-stats dd { font-size: 1.0625rem; } .phd-stats > div { padding: 0.85rem; } }

/* Key figures strip */
.figs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: 1px; margin: 0; background: var(--line); border: 1px solid var(--line); }
.figs > div { padding: 1.4rem 1.5rem; background: #fff; }
.figs dt { font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.5rem; }
.figs dd { margin: 0; font: 600 1.5rem/1.15 var(--f-head); color: var(--ink); letter-spacing: -0.015em; }
.figs p { margin: 0.35rem 0 0; font-size: 0.875rem; color: var(--muted); }

/* Comparison table (category pages) ------------------------------------ */
.cmp { width: 100%; border-collapse: collapse; font-size: 0.9688rem; table-layout: fixed; }
.cmp col.c-name { width: 40%; }
.cmp col.c-act { width: 7.5rem; }
.cmp--0 col.c-name { width: auto; }
.cmp caption span { margin-left: 0.5rem; font: 400 0.875rem var(--f-body); color: var(--muted); }
.cmp caption { text-align: left; padding: 0 0 1rem; font: 600 1.375rem/1.3 var(--f-head); color: var(--ink); }
.cmp th, .cmp td { padding: 1.1rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.cmp thead th { padding-block: 0.75rem; border-bottom: 1px solid var(--ink); font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.cmp th:first-child, .cmp td:first-child { padding-left: 0; }
.cmp th:last-child, .cmp td:last-child { padding-right: 0; }
.cmp tbody th { font-weight: 400; width: 34%; }
.cmp tbody th a { display: block; font: 600 1.0938rem/1.3 var(--f-head); color: var(--ink); text-decoration: none; margin-bottom: 0.2rem; }
.cmp tbody th a:hover { color: var(--green-700); text-decoration: underline; }
.cmp tbody th span { font-size: 0.875rem; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cmp td.act { text-align: right; }
.cmp tbody tr:hover { background: var(--green-50); }
.cmp .n { font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; overflow-wrap: anywhere; padding-right: 1.25rem; }
.cmp .go { white-space: nowrap; }
.cmp td.dim { color: var(--muted); font-weight: 400; }
@media (max-width: 799px) {
  .cmp thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .cmp colgroup { display: none; }
  .cmp tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem 1rem; padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
  .cmp tbody th, .cmp td { display: block; width: auto; padding: 0; border: 0; }
  .cmp tbody th { grid-column: 1 / -1; }
  .cmp td::before { content: attr(data-label); display: block; margin-bottom: 0.2rem; font: 600 0.6875rem/1.2 var(--f-body); letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  .cmp td.act { grid-column: 1 / -1; }
  .cmp td.act::before { display: none; }
  .cmp .n { white-space: normal; }
}

/* Rates ------------------------------------------------------------------ */
.rates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 5vw, 4.5rem); }
.rates--one { grid-template-columns: 1fr; }
.rt { width: 100%; border-collapse: collapse; }
.rt caption { text-align: left; padding: 0 0 0.75rem; border-bottom: 1px solid var(--ink); font: 600 1.1875rem/1.3 var(--f-head); color: var(--ink); }
.rt caption span { display: block; font: 400 0.875rem/1.4 var(--f-body); color: var(--muted); margin-top: 0.15rem; }
.rt th, .rt td { padding: 0.95rem 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: baseline; }
.rt th { font-weight: 400; padding-right: 1rem; }
.rt th a { color: var(--ink); text-decoration: none; font-weight: 600; }
.rt th a:hover { color: var(--green-700); text-decoration: underline; }
.rt th small { display: block; font-size: 0.8438rem; color: var(--muted); margin-top: 0.1rem; }
.rt td { text-align: right; white-space: nowrap; font: 600 1.375rem/1 var(--f-head); color: var(--green-700); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.rt td small { display: block; margin-top: 0.3rem; font: 400 0.75rem/1.2 var(--f-body); color: var(--muted); letter-spacing: 0; }
.rt td.ask { font: 500 0.875rem/1.3 var(--f-body); color: var(--muted); }
.rates-note { grid-column: 1 / -1; margin: 0; font-size: 0.8438rem; color: var(--muted); }
@media (max-width: 899px) { .rates { grid-template-columns: 1fr; } }
@media (max-width: 479px) { .rt td { font-size: 1.1875rem; } }

/* Rate board: intro + one switchable rate table */
.rb { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.rb-intro h2 { margin-bottom: 0.6rem; }
.rb-intro p { color: var(--muted); max-width: 26rem; }
.rb-note { font-size: 0.875rem; padding-left: 0.9rem; border-left: 2px solid var(--line-2); }
.rb-intro .btns { margin-top: 1.5rem; }
.rb-panel { background: #fff; border: 1px solid var(--line); }
.rb-switch { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-bottom: 1px solid var(--line); }
.rb-tab { position: relative; min-height: 56px; padding: 0 1.25rem; background: var(--surface); border: 0; color: var(--muted); font: 600 1rem/1.2 var(--f-head); cursor: pointer; }
.rb-tab + .rb-tab { border-left: 1px solid var(--line); }
.rb-tab[aria-selected="true"] { background: #fff; color: var(--ink); box-shadow: inset 0 3px 0 var(--green-700); }
.rb-tab[aria-selected="true"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: #fff; }
.rb-tab:hover { color: var(--ink); }
.rb-table { width: 100%; border-collapse: collapse; }
.rb-table thead th { padding: 0.85rem 1.5rem 0.6rem; text-align: left; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.rb-table thead th:last-child { text-align: right; }
.rb-table tbody th, .rb-table td { padding: 0.9rem 1.5rem; border-top: 1px solid var(--line); text-align: left; vertical-align: middle; }
.rb-table tbody th { font-weight: 400; }
.rb-table tbody th a { color: var(--ink); font-weight: 600; text-decoration: none; }
.rb-table tbody th a:hover { color: var(--green-700); text-decoration: underline; }
.rb-table tbody th small { display: block; margin-top: 0.1rem; font-size: 0.8125rem; color: var(--muted); }
.rb-table td { text-align: right; white-space: nowrap; }
.rb-table td b { display: block; font: 600 1.375rem/1.1 var(--f-head); color: var(--green-700); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.rb-table td small { display: block; margin-top: 0.15rem; font-size: 0.75rem; color: var(--muted); }
.rb-table td.ask { font-size: 0.875rem; color: var(--muted); }
.rb-table tbody tr:hover { background: var(--green-50); }
@media (max-width: 899px) { .rb { grid-template-columns: 1fr; gap: 1.5rem; } .rb-intro p { max-width: none; } }
@media (max-width: 559px) { .rb-table tbody th, .rb-table td { padding: 0.85rem 1rem; } .rb-table thead th { padding-inline: 1rem; } .rb-table td b { font-size: 1.1875rem; } .rb-tab { padding: 0 0.75rem; font-size: 0.9375rem; } }

/* Membership band -------------------------------------------------------- */
.own { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: var(--green-900); color: #cfe0d4; }
.own-media { position: relative; min-height: 26rem; }
.spccu .own-media img { max-width: none; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.own-copy { padding: var(--pad) max(var(--g), calc((100vw - var(--w)) / 2)) var(--pad) clamp(2rem, 5vw, 5rem); }
.own-copy h2 { color: #fff; font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem); max-width: 16ch; }
.own-copy > p { max-width: 34rem; }
.own dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin: 2rem 0 2.25rem; padding: 1.25rem 0 0; border-top: 1px solid rgba(255, 255, 255, 0.25); }
.own dt { font-size: 0.8125rem; color: #9fbfa8; margin-bottom: 0.35rem; }
.own dd { margin: 0; font: 600 1.25rem/1.2 var(--f-head); color: #fff; font-variant-numeric: tabular-nums; }
/* Light variant: white band, photograph framed inside the grid */
.own--light { background: #fff; color: var(--text); max-width: calc(var(--w) + 2 * var(--g)); margin-inline: auto; padding: var(--pad) var(--g); grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.own--light .own-media { min-height: 0; aspect-ratio: 4 / 3.4; }
.own--light .own-copy { padding: 0; }
.own--light .own-copy h2 { color: var(--ink); }
.own--light dl { border-top: 1px solid var(--ink); }
.own--light dl > div + div { border-left: 1px solid var(--line); padding-left: 1.25rem; }
.own--light dt { color: var(--muted); }
.own--light dd { color: var(--green-700); }
@media (max-width: 899px) { .own--light { padding: 3rem var(--g); } .own--light .own-media { aspect-ratio: 16 / 9; } .own--light .own-copy { padding: 0; } }
@media (max-width: 479px) { .own--light dl > div + div { border-left: 0; padding-left: 0; } }
@media (max-width: 899px) { .own { grid-template-columns: 1fr; } .own-media { min-height: 0; aspect-ratio: 16 / 9; } .own-copy { padding: 2.75rem var(--g) 3rem; } }
@media (max-width: 479px) { .own dl { grid-template-columns: 1fr 1fr; } .own dd { font-size: 1.0625rem; } }

/* News + notices --------------------------------------------------------- */
.updates { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); }
.notices { margin: 0; padding: 0; list-style: none; }
.notices li { border-bottom: 1px solid var(--line); }
.notices a { display: block; padding: 1.1rem 0 1.1rem 1.1rem; border-left: 3px solid var(--amber); color: var(--ink); text-decoration: none; }
.notices a:hover b { text-decoration: underline; color: var(--amber); }
.notices time, .nl time, .post-meta time { font-size: 0.8125rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.notices b { display: block; margin-top: 0.2rem; font: 600 1.0313rem/1.35 var(--f-head); }
.notice-tag { display: inline-flex; align-items: center; gap: 0.3rem; margin-right: 0.5rem; font: 600 0.6875rem/1 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); }
.notice-tag .icon { width: 0.85rem; height: 0.85rem; stroke-width: 2; }
.nl { margin: 0; padding: 0; list-style: none; }
.nl li { border-bottom: 1px solid var(--line); }
.nl a { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 1.25rem; padding: 1.1rem 0; color: var(--text); text-decoration: none; }
.nl img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: top; background: var(--surface); }
.nl .ph-img { aspect-ratio: 4 / 3; background: var(--surface); }
.nl h3 { margin: 0.2rem 0 0.35rem; font-size: 1.0938rem; color: var(--ink); }
.nl p { margin: 0; font-size: 0.9375rem; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nl a:hover h3 { color: var(--green-700); text-decoration: underline; }
.nl--wide a { grid-template-columns: 12rem minmax(0, 1fr); gap: 1.75rem; padding: 1.5rem 0; }
.nl--wide h3 { font-size: 1.25rem; }
.cat { font: 600 0.6875rem/1 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--green-700); margin-right: 0.6rem; }
.cat--notice { color: var(--amber); }
@media (max-width: 899px) { .updates { grid-template-columns: 1fr; } }
@media (max-width: 559px) { .nl a, .nl--wide a { grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1rem; padding: 1rem 0; } .nl h3, .nl--wide h3 { font-size: 1rem; } .nl p { display: none; } }

/* Home news: image-led stories + notice strip */
.stories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem clamp(1.5rem, 3vw, 2.5rem); margin: 0; padding: 0; list-style: none; }
.story { display: block; color: var(--text); text-decoration: none; }
.story-img { position: relative; aspect-ratio: 1; margin-bottom: 1.1rem; overflow: hidden; background: var(--green-50); border: 1px solid var(--line); }
.spccu .story-img img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: contain; transition: transform 300ms ease; }
.spccu .story:hover .story-img img { transform: scale(1.03); }
.story-meta { display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: baseline; margin: 0 0 0.5rem; font-size: 0.8125rem; color: var(--muted); }
.story h3 { margin: 0 0 0.5rem; font-size: 1.25rem; line-height: 1.3; color: var(--ink); }
.story:hover h3 { color: var(--green-700); text-decoration: underline; text-underline-offset: 0.18em; }
.story-text { margin: 0; font-size: 0.9375rem; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.notices-reg { margin-top: clamp(3rem, 2.25rem + 2.5vw, 4.25rem); }
.nr-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-bottom: 0.85rem; border-bottom: 2px solid var(--amber); }
.nr-head h3 { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: 1.25rem; }
.nr-head h3 .icon { width: 1.1rem; height: 1.1rem; color: var(--amber); }
.nr-head .go { font-size: 0.9375rem; }
.nr-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); margin: 0; padding: 0; list-style: none; }
.nr-list li { border-bottom: 1px solid var(--line); }
.nr-list a { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1.25rem; align-items: start; padding: 1.25rem 0; color: var(--text); text-decoration: none; }
.nr-list time { display: block; padding-right: 1rem; white-space: nowrap; border-right: 1px solid var(--line); font-size: 0.75rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); font-variant-numeric: tabular-nums; }
.nr-list time b { display: block; font: 600 1.75rem/1 var(--f-head); letter-spacing: -0.02em; color: var(--ink); margin-bottom: 0.25rem; }
.nr-list h4 { margin: 0 0 0.3rem; font: 600 1.0625rem/1.35 var(--f-head); color: var(--ink); }
.nr-list p { margin: 0; font-size: 0.875rem; line-height: 1.5; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.nr-list a:hover h4 { color: var(--amber); text-decoration: underline; text-underline-offset: 0.18em; }
@media (max-width: 719px) { .nr-list { grid-template-columns: 1fr; } .nr-list a { grid-template-columns: 5rem minmax(0, 1fr); gap: 1rem; } .nr-list time { padding-right: 1rem; } .nr-list time b { font-size: 1.5rem; } }
@media (max-width: 479px) { .nr-head { flex-direction: column; gap: 0.35rem; } }
@media (max-width: 899px) { .stories { grid-template-columns: 1fr 1fr; } .stories:not(.stories--grid) li:first-child { grid-column: 1 / -1; } .stories:not(.stories--grid) li:first-child .story-img { aspect-ratio: 4 / 3; } }
@media (max-width: 559px) {
  .stories { grid-template-columns: 1fr; gap: 1.75rem; }
  .stories--grid li .story, .stories li:not(:first-child) .story { display: grid; grid-template-columns: 7rem minmax(0, 1fr); column-gap: 1rem; }
  .stories--grid li .story-img, .stories li:not(:first-child) .story-img { grid-row: span 3; margin: 0; aspect-ratio: 1; }
  .stories--grid li .story-text, .stories li:not(:first-child) .story-text { display: none; }
  .stories--grid li h3, .stories li:not(:first-child) h3 { font-size: 1.0625rem; }
}

/* Contact band (above footer) ------------------------------------------ */
.cband { background: var(--surface); border-top: 1px solid var(--line); }
.cband-grid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 2.5rem; padding-block: 2.75rem; }
.cband-grid > div:first-child p { max-width: 20rem; }
.cband h2 { font-size: 1.375rem; margin: 0 0 0.35rem; }
.cband h3 { display: flex; align-items: center; gap: 0.45rem; margin: 0.3rem 0 0.5rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.cband h3 .icon { width: 1rem; height: 1rem; color: var(--green-700); }
.cband p { margin: 0; font-size: 0.9688rem; }
.cband a { color: var(--ink); font-weight: 600; text-decoration: none; }
.cband a:hover { color: var(--green-700); text-decoration: underline; }
.cband .hours { font-variant-numeric: tabular-nums; }
@media (max-width: 899px) { .cband-grid { grid-template-columns: 1fr 1fr; } .cband-grid > div:first-child { grid-column: 1 / -1; } }
@media (max-width: 479px) { .cband-grid { grid-template-columns: 1fr; gap: 1.25rem; } .cband a { display: inline-block; padding: 0.3rem 0; } }

/* Footer ----------------------------------------------------------------- */
.ftr { background: var(--green-950); color: #a7bfae; font-size: 0.9375rem; }
.ftr a { color: #dbe8de; text-decoration: none; }
.ftr a:hover { color: #fff; text-decoration: underline; }
.ftr-main { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 2.5rem; padding-block: 3.5rem 3rem; }
.ftr .logo { color: #fff; margin-bottom: 1.25rem; }
.ftr .logo img { background: #fff; padding: 3px; border-radius: 4px; }
.ftr .logo span { color: #a7bfae; }
.ftr-about p { max-width: 24rem; }
.ftr h2 { margin: 0 0 1rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; color: #fff; }
.ftr ul { margin: 0; padding: 0; list-style: none; }
.ftr li a { display: inline-block; padding: 0.3rem 0; }
.ftr-social { display: flex; gap: 0.5rem; margin-top: 1.25rem; }
.ftr-social a { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 50%; }
.ftr-social a:hover { background: rgba(255, 255, 255, 0.08); }
.ftr-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 2rem; padding-block: 1.25rem 1.75rem; border-top: 1px solid rgba(255, 255, 255, 0.14); font-size: 0.8125rem; }
.ftr-legal ul { display: flex; flex-wrap: wrap; gap: 0 1.5rem; }
@media (max-width: 899px) { .ftr-main { grid-template-columns: 1fr 1fr; } .ftr-about { grid-column: 1 / -1; } }
@media (max-width: 479px) { .ftr-main { grid-template-columns: 1fr; gap: 0; padding-top: 2.75rem; } .ftr-about { margin-bottom: 1.5rem; } .ftr-col { border-top: 1px solid rgba(255, 255, 255, 0.14); padding: 1.25rem 0; } .ftr li a { padding: 0.5rem 0; } }

/* Page header ------------------------------------------------------------ */
.phd { border-bottom: 1px solid var(--line); }
.phd .wrap { padding-block: 1.5rem clamp(2.25rem, 1.5rem + 2.5vw, 3.75rem); }
.phd-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1.75rem 4.5rem; align-items: center; }
.phd h1 { max-width: 20ch; margin-bottom: 0.4em; }
.phd .lead { max-width: 42rem; margin: 0; }
.phd .btns { margin-top: 1.75rem; }
.phd-grid:not(:has(.phd-media, .phd-stats)) { grid-template-columns: minmax(0, 1fr); }
.phd-media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.crumbs { margin: 0 0 clamp(1.75rem, 1rem + 2vw, 3rem); font-size: 0.8438rem; color: var(--muted); }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 0.15rem 0.5rem; margin: 0; padding: 0; list-style: none; }
.crumbs li + li::before { content: "›"; margin-right: 0.5rem; color: var(--line-2); }
.crumbs a { color: var(--muted); }
.crumbs a:hover { color: var(--ink); }
.crumbs [aria-current] { color: var(--ink); }
@media (max-width: 899px) { .phd-grid { grid-template-columns: 1fr; } .phd-media { order: -1; margin-inline: calc(var(--g) * -1); } .phd-media img { aspect-ratio: 16 / 9; } }
@media (max-width: 559px) { .crumbs li:not(:nth-last-child(-n + 2)) { display: none; } .crumbs li:nth-last-child(2)::before { display: none; } }

/* Product page ----------------------------------------------------------- */
.prod { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; gap: clamp(2.5rem, 6vw, 5.5rem); align-items: start; }
.prod-main { max-width: 46rem; }
.prod-main > section + section { margin-top: 2.75rem; padding-top: 2.25rem; border-top: 1px solid var(--line); }
.prod-main h2 { font-size: clamp(1.3125rem, 1.2rem + 0.5vw, 1.5rem); }
.prod-main .entry h2 { margin-top: 2.25rem; padding-top: 2.25rem; border-top: 1px solid var(--line); }
.prod-main .entry > :first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.ticks { list-style: none; padding: 0; margin: 0; }
.ticks li { position: relative; padding: 0.6rem 0 0.6rem 1.9rem; border-bottom: 1px solid var(--line); }
.ticks li:first-child { border-top: 1px solid var(--line); }
.ticks li::before { content: ""; position: absolute; left: 0.2rem; top: 1.05rem; width: 0.8rem; height: 0.45rem; border-left: 2px solid var(--green-700); border-bottom: 2px solid var(--green-700); transform: rotate(-45deg); }
.reqs { counter-reset: r; list-style: none; padding: 0; margin: 0; }
.reqs li { counter-increment: r; display: grid; grid-template-columns: 2rem 1fr; padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.reqs li:first-child { border-top: 1px solid var(--line); }
.reqs li::before { content: counter(r); font: 600 0.875rem/1.7 var(--f-head); color: var(--green-700); font-variant-numeric: tabular-nums; }
.howto, :where(.spccu) ol.howto { counter-reset: s; list-style: none; padding: 0; margin: 0 0 1.75rem; display: grid; gap: 0; max-width: 46rem; }
.howto li { margin: 0; }
.howto li { counter-increment: s; display: grid; grid-template-columns: 2.75rem 1fr; gap: 0 0.75rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.howto li::before { content: counter(s); display: grid; place-items: center; width: 2rem; height: 2rem; border: 1px solid var(--green-700); border-radius: 50%; color: var(--green-700); font: 600 0.9375rem/1 var(--f-head); }
.howto b { display: block; color: var(--ink); font-weight: 600; }
.howto span { color: var(--muted); font-size: 0.9688rem; }
.glance { position: sticky; top: 104px; border: 1px solid var(--line); background: #fff; }
.admin-bar .glance { top: 136px; }
.glance-head { padding: 1.1rem 1.4rem; border-bottom: 1px solid var(--line); background: var(--surface); }
.glance-head h2 { margin: 0; font-size: 1rem; }
.glance dl { margin: 0; padding: 0 1.4rem; }
.glance dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.85rem 0; border-bottom: 1px solid var(--line); }
.glance dt { font-size: 0.875rem; color: var(--muted); }
.glance dd { margin: 0; text-align: right; font: 600 1.0625rem/1.3 var(--f-head); color: var(--ink); font-variant-numeric: tabular-nums; }
.glance dd small { display: block; font: 400 0.75rem/1.3 var(--f-body); color: var(--muted); }
.glance-act { display: grid; gap: 0.6rem; padding: 1.25rem 1.4rem; }
.glance-who { padding: 1.1rem 1.4rem 1.3rem; border-top: 1px solid var(--line); font-size: 0.875rem; }
.glance-who b { display: block; color: var(--ink); font-size: 0.9375rem; }
.glance-who .label { display: block; margin-bottom: 0.2rem; }
.glance-who a { display: inline-block; margin-top: 0.35rem; overflow-wrap: anywhere; }
.flag { margin: 1.25rem 0 0; padding: 0.8rem 1rem; border-left: 3px solid var(--amber); background: var(--amber-bg); font-size: 0.875rem; color: #5f3305; }
.flag b { font-weight: 600; }
.note { margin: 0 0 0.75rem; padding-left: 1rem; border-left: 2px solid var(--line-2); }
.dl-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.dl-list li { border-bottom: 1px solid var(--line); }
.dl-list a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.9rem 0; font-weight: 600; text-decoration: none; color: var(--ink); }
.dl-list a span { font: 600 0.6875rem/1 var(--f-body); letter-spacing: 0.06em; color: var(--muted); }
.dl-list a:hover { color: var(--green-700); text-decoration: underline; }
.data { width: 100%; border-collapse: collapse; font-size: 0.9688rem; }
.data th, .data td { padding: 0.8rem 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.data thead th { border-bottom: 1px solid var(--ink); font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.data tbody th { font-weight: 400; padding-right: 1.5rem; }
.data .r { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; color: var(--ink); white-space: nowrap; }
@media (max-width: 999px) {
  .prod { grid-template-columns: 1fr; }
  .glance { position: static; order: -1; }
  .glance dl { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.25rem; }
  .glance dl > div { display: block; }
  .glance dd { text-align: left; margin-top: 0.15rem; }
  .glance-act { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 479px) { .glance-act { grid-template-columns: 1fr; } .glance dl { padding: 0 1.1rem; } .glance-head, .glance-act, .glance-who { padding-inline: 1.1rem; } }

/* Calculator */
.calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border: 1px solid var(--line); }
.calc-in { display: grid; gap: 1rem; padding: 1.5rem; align-content: start; }
.calc-out { padding: 1.5rem; background: var(--surface); border-left: 1px solid var(--line); }
.calc-out output { display: block; margin: 0.3rem 0 1.1rem; font: 600 clamp(1.75rem, 1.4rem + 1.4vw, 2.25rem)/1.1 var(--f-head); color: var(--green-700); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.calc-out dl { display: grid; grid-template-columns: 1fr auto; gap: 0.4rem 1rem; margin: 0 0 1rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: 0.9375rem; }
.calc-out dd { margin: 0; text-align: right; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.calc-out p { margin: 0; font-size: 0.8125rem; color: var(--muted); }
@media (max-width: 719px) { .calc { grid-template-columns: 1fr; } .calc-out { border-left: 0; border-top: 1px solid var(--line); } }

/* Forms ------------------------------------------------------------------ */
.fld { display: grid; gap: 0.35rem; }
.fld label { font-weight: 600; font-size: 0.9063rem; color: var(--ink); }
.fld .hint { font-size: 0.8125rem; color: var(--muted); }
.spccu input[type="text"], .spccu input[type="email"], .spccu input[type="password"], .spccu input[type="tel"], .spccu input[type="number"], .spccu input[type="search"], .spccu select, .spccu textarea { width: 100%; min-height: 48px; padding: 0.6rem 0.85rem; border: 1px solid var(--line-2); border-radius: var(--r); background: #fff; color: var(--ink); font: 400 1rem/1.4 var(--f-body); }
.spccu textarea { min-height: 9rem; resize: vertical; }
.spccu input:focus, .spccu select:focus, .spccu textarea:focus { outline: 0; border-color: var(--green-700); box-shadow: 0 0 0 3px rgba(10, 107, 28, 0.18); }
.olb input:focus { border-color: var(--green-700); box-shadow: 0 0 0 3px rgba(10, 107, 28, 0.18); }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 559px) { .two { grid-template-columns: 1fr; } }
.form-msg { margin: 0; padding: 0.8rem 1rem; border-left: 3px solid var(--green-700); background: var(--green-50); font-size: 0.9375rem; }
.form-msg--err { border-color: #b3261e; background: #fbeceb; }

/* Document library ------------------------------------------------------- */
.lib-bar { display: flex; flex-wrap: wrap; align-items: end; gap: 0.75rem 1rem; margin-bottom: 1.25rem; }
.lib-bar .fld { flex: 1 1 10rem; }
.lib-bar .fld--q { flex: 2 1 18rem; }
.lib-count { margin: 0 0 0.75rem; font-size: 0.875rem; color: var(--muted); }
.lib { width: 100%; border-collapse: collapse; }
.lib thead th { padding: 0.75rem 1rem 0.75rem 0; border-bottom: 1px solid var(--ink); text-align: left; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.lib td, .lib tbody th { padding: 1rem 1rem 1rem 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; font-size: 0.9375rem; }
.lib tbody th { font-weight: 600; color: var(--ink); width: 52%; }
.lib tbody th small { display: block; font-weight: 400; color: var(--muted); font-size: 0.8438rem; margin-top: 0.15rem; }
.lib td.y { font-variant-numeric: tabular-nums; }
.lib td:last-child, .lib th:last-child { text-align: right; padding-right: 0; }
.lib a.get { display: inline-flex; align-items: center; gap: 0.45rem; min-height: 44px; padding: 0 0.9rem; border: 1px solid var(--line-2); border-radius: var(--r); font-weight: 600; font-size: 0.875rem; text-decoration: none; color: var(--ink); white-space: nowrap; }
.lib a.get:hover { border-color: var(--green-700); color: var(--green-700); }
.lib a.get .icon { width: 1rem; height: 1rem; }
.lib a.get em { font-style: normal; font-size: 0.6875rem; letter-spacing: 0.06em; color: var(--muted); }
.lib-empty { padding: 2rem 0; color: var(--muted); }
@media (max-width: 719px) {
  .lib thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .lib tr { display: grid; grid-template-columns: 1fr auto; gap: 0.3rem 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
  .lib tbody th, .lib td { display: block; padding: 0; border: 0; width: auto; }
  .lib tbody th { grid-column: 1 / -1; }
  .lib td.c, .lib td.y { font-size: 0.8125rem; color: var(--muted); grid-row: 2; }
  .lib td.c { grid-column: 1; }
  .lib td.y { display: none; }
  .lib td:last-child { grid-column: 1 / -1; text-align: left; margin-top: 0.5rem; }
  .lib a.get { width: 100%; justify-content: center; min-height: 48px; }
}

/* People ----------------------------------------------------------------- */
.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12.5rem), 1fr)); gap: 2.25rem 1.75rem; margin: 0; padding: 0; list-style: none; }
.person img, .person .ph { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 22%; background: var(--surface); margin-bottom: 0.9rem; filter: saturate(0.92); }
.person .ph { display: grid; place-items: center; background: var(--green-100); color: #6f8a77; font: 600 2.25rem var(--f-head); letter-spacing: 0.02em; }
.person h3 { margin: 0 0 0.15rem; font-size: 1.0313rem; }
.person p { margin: 0; font-size: 0.875rem; color: var(--muted); line-height: 1.45; }
.person a { display: inline-block; margin-top: 0.45rem; font-size: 0.8438rem; overflow-wrap: anywhere; }
.roster { width: 100%; border-collapse: collapse; }
.roster th, .roster td { padding: 1rem 0; border-bottom: 1px solid var(--line); text-align: left; }
.roster th { font: 600 1.0625rem/1.3 var(--f-head); color: var(--ink); }
.roster td { text-align: right; color: var(--muted); }
.roster tr:first-child > * { border-top: 1px solid var(--ink); }
.lead-person { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.lead-person img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: top; }
@media (max-width: 559px) { .people { grid-template-columns: 1fr 1fr; gap: 1.75rem 1rem; } .lead-person { grid-template-columns: 1fr; } .lead-person img { max-width: 16rem; } }

/* Timeline ---------------------------------------------------------------- */
.tl { margin: 0; padding: 0; list-style: none; }
.tl li { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 2rem; padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
.tl li:first-child { border-top: 1px solid var(--ink); }
.tl time { font: 600 1.375rem/1.25 var(--f-head); color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.tl p { margin: 0; max-width: 46rem; }
.tl .ctx { display: block; margin-bottom: 0.2rem; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.tl li.wider time { color: var(--muted); font-weight: 500; }
.tl li.key { background: linear-gradient(90deg, var(--green-50), transparent 70%); }
.tl li.key p { color: var(--ink); font-weight: 600; }
@media (max-width: 559px) { .tl li { grid-template-columns: 1fr; gap: 0.25rem; } .tl time { font-size: 1.125rem; } }

/* Our History ------------------------------------------------------------ */
:root { --hdr-h: 81px; }
@media (max-width: 1239px) { :root { --hdr-h: 69px; } }
.hx-nav { position: sticky; top: var(--hdr-h); z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.admin-bar .hx-nav { top: calc(var(--hdr-h) + 32px); }
.hx-nav .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.hx-eras { position: relative; display: flex; margin: 0; padding: 0; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
.hx-eras::-webkit-scrollbar { display: none; }
.hx-eras a { position: relative; display: block; padding: 0.85rem 1.5rem 0.9rem 0; margin-right: 1.5rem; color: var(--muted); text-decoration: none; font: 600 0.9688rem/1.25 var(--f-head); white-space: nowrap; }
.hx-eras a span { display: block; font: 500 0.75rem/1.3 var(--f-body); letter-spacing: 0.04em; font-variant-numeric: tabular-nums; margin-bottom: 0.15rem; }
.hx-eras a::after { content: ""; position: absolute; left: 0; right: 1.5rem; bottom: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transform-origin: left; transition: transform 250ms ease; }
.hx-eras a:hover { color: var(--ink); }
.hx-eras a[aria-current] { color: var(--ink); }
.hx-eras a[aria-current]::after { transform: scaleX(1); }
.hx-toggle { display: inline-flex; align-items: center; gap: 0.6rem; flex: none; font-size: 0.875rem; color: var(--muted); cursor: pointer; }
.hx-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hx-switch { position: relative; width: 2.5rem; height: 1.4rem; border-radius: 999px; background: var(--line-2); transition: background var(--ease); }
.hx-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: calc(1.4rem - 6px); height: calc(1.4rem - 6px); border-radius: 50%; background: #fff; transition: transform var(--ease); }
.hx-toggle input:checked + .hx-switch { background: var(--green-700); }
.hx-toggle input:checked + .hx-switch::after { transform: translateX(1.1rem); }
.hx-toggle input:focus-visible + .hx-switch { outline: 2px solid var(--focus); outline-offset: 2px; }
.hx-ch { padding-block: clamp(3rem, 2rem + 4vw, 5.5rem); scroll-margin-top: calc(var(--hdr-h) + 64px); }
.hx-ch--alt { background: var(--surface); }
.hx-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: start; }
.hx-intro { position: sticky; top: calc(var(--hdr-h) + 96px); }
.hx-intro .hx-num { margin: 0 0 0.75rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.hx-intro .hx-years { margin: 0 0 0.5rem; font: 600 clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem)/1 var(--f-head); letter-spacing: -0.03em; color: var(--green-700); font-variant-numeric: tabular-nums; }
.hx-intro h2 { margin-bottom: 1rem; }
.hx-intro p { color: var(--text); }
.hx-intro figure { margin: 1.75rem 0 0; }
.hx-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.hx-intro figcaption { margin-top: 0.5rem; font-size: 0.8125rem; color: var(--muted); }
.hx-list { position: relative; margin: 0; padding: 0.25rem 0 0; list-style: none; }
.hx-list::before { content: ""; position: absolute; left: 0.4375rem; top: 0.75rem; bottom: 0.75rem; width: 2px; background: var(--line); }
.hx-item { position: relative; padding: 0 0 2rem 2.75rem; transition: opacity 400ms ease, transform 400ms ease; }
.hx-item:last-child { padding-bottom: 0; }
.hx-item::before { content: ""; position: absolute; left: 0; top: 0.3rem; width: 1rem; height: 1rem; border-radius: 50%; background: #fff; border: 2px solid var(--green-700); }
.hx-ch--alt .hx-item::before { background: var(--surface); }
.hx-item time { display: block; margin-bottom: 0.2rem; font: 600 1.25rem/1.3 var(--f-head); color: var(--ink); font-variant-numeric: tabular-nums; }
.hx-item p { margin: 0; max-width: 38rem; }
.hx-item--key::before { background: var(--green-700) !important; box-shadow: 0 0 0 4px var(--green-100); }
.hx-item--key time { color: var(--green-700); font-size: 1.5rem; }
.hx-item--key p { color: var(--ink); font-weight: 500; font-size: 1.0625rem; }
.hx-item--wider::before { border-color: var(--line-2); }
.hx-item--wider time { color: var(--muted); font-weight: 500; }
.hx-item--wider p { color: var(--muted); font-size: 0.9375rem; }
.hx-tag { display: inline-block; margin-bottom: 0.3rem; font: 600 0.6875rem/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.hx.hide-wider [data-wider-item] { display: none; }
.hx-item.is-pending { opacity: 0; transform: translateY(10px); }
.hx-route { margin-top: clamp(2.5rem, 2rem + 2vw, 3.5rem); }
.hx-route h3 { margin: 0 0 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); font-size: 1.125rem; }
.hx-route ol { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin: 0; padding: 0; list-style: none; counter-reset: stop; }
.hx-route li { position: relative; padding: 1.75rem 1rem 0 0; counter-increment: stop; }
.hx-route li::before { content: ""; position: absolute; left: 0; right: 0; top: 0.4375rem; height: 2px; background: var(--line-2); }
.hx-route li::after { content: ""; position: absolute; left: 0; top: 0; width: 1rem; height: 1rem; border-radius: 50%; background: #fff; border: 2px solid var(--green-700); }
.hx-route li.is-start::after { border-color: var(--muted); }
.hx-route li.is-end::before { right: auto; width: 0; }
.hx-route li.is-end::after { background: var(--green-700); box-shadow: 0 0 0 4px var(--green-100); }
.hx-route b { display: block; font: 600 0.9688rem/1.3 var(--f-head); color: var(--ink); }
.hx-route span { display: block; margin-top: 0.2rem; font-size: 0.8125rem; color: var(--muted); }
.hx-ch--alt .hx-route li::after { background: var(--surface); }
.hx-ch--alt .hx-route li.is-end::after { background: var(--green-700); }
@media (max-width: 899px) {
  .hx-nav .wrap { flex-direction: column; align-items: stretch; gap: 0; padding-inline: 0; }
  .hx-eras { padding-inline: var(--g); }
  .hx-toggle { padding: 0.6rem var(--g); border-top: 1px solid var(--line); }
  .hx-grid { grid-template-columns: 1fr; }
  .hx-intro { position: static; }
  .hx-route ol { grid-auto-flow: row; }
  .hx-route li { padding: 0 0 1.25rem 2rem; }
  .hx-route li::before { left: 0.4375rem; right: auto; top: 1rem; bottom: 0; width: 2px; height: auto; }
  .hx-route li.is-end::before { display: none; }
}
@media (max-width: 559px) { .hx-eras a { padding-right: 0.25rem; margin-right: 1.25rem; font-size: 0.875rem; } .hx-eras a::after { right: 0.25rem; } .hx-item { padding-left: 2.25rem; } }
.people--strip { grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 1.75rem 1.25rem; }
@media (max-width: 1023px) { .people--strip { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.people--strip h3 { font-size: 0.9375rem; }
.people--strip p { font-variant-numeric: tabular-nums; }
@media (max-width: 559px) { .people--strip { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 1rem; margin-inline: calc(var(--g) * -1); padding-inline: var(--g); scrollbar-width: none; } .people--strip li { flex: 0 0 9rem; scroll-snap-align: start; } }
.statement-quote { margin: 0; max-width: 46rem; font: 500 clamp(1.375rem, 1.1rem + 1.2vw, 2rem)/1.35 var(--f-head); letter-spacing: -0.01em; color: var(--ink); }
.statement-quote::before { content: "“"; display: block; font: 600 4rem/0.6 var(--f-head); color: var(--green-700); margin-bottom: 0.75rem; }

/* One rule only: a section head already draws the dark line */
.sh + :is(.idx, .defs, .faq, .links-list, .ledger, .tl, .contact-dl, .vs),
.sh + .prose > .faq:first-child { border-top: 0 !important; }
.sh + .roster tr:first-child > *, .sh + .tl li:first-child, .sh + .idx li { border-top: 0 !important; }

/* Comparison table */
.vs { width: 100%; border-collapse: collapse; table-layout: fixed; }
.vs th, .vs td { padding: 1.1rem 1.25rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.vs thead th { padding-block: 0.9rem; font: 600 1rem/1.3 var(--f-head); color: var(--muted); border-bottom: 1px solid var(--line-2); }
.vs thead th.vs-us { color: #fff; background: var(--green-900); }
.vs thead th:first-child { width: 22%; padding-left: 0; }
.vs tbody th { padding-left: 0; font: 600 1rem/1.35 var(--f-head); color: var(--ink); }
.vs td.vs-us { background: var(--green-50); color: var(--ink); font-weight: 500; border-left: 1px solid var(--green-100); border-right: 1px solid var(--green-100); }
.vs td { color: var(--muted); }
@media (max-width: 719px) {
  .vs thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .vs, .vs tbody, .vs tr { display: block; }
  .vs tr { display: grid; grid-template-columns: 1fr 1fr; padding: 1rem 0; border-bottom: 1px solid var(--line); }
  .vs tbody th { grid-column: 1 / -1; padding: 0 0 0.6rem; border: 0; }
  .vs td { display: block; padding: 0.75rem; border: 0; }
  .vs td::before { content: attr(data-label); display: block; margin-bottom: 0.3rem; font: 600 0.6875rem/1.2 var(--f-body); letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
}

/* Topic explorer (master-detail) */
.ex { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); border: 1px solid var(--line); background: #fff; }
.ex--img { grid-template-columns: minmax(0, 3fr) minmax(0, 3fr) minmax(0, 6fr); }
.ex-media { display: grid; place-items: center; padding: 2rem; border-right: 1px solid var(--line); background: var(--surface); }
.spccu .ex-img { width: 100%; max-width: 14rem; height: auto; }
.ex-tabs { display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--surface); }
.ex-tab { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 56px; padding: 0.85rem 1.25rem; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-left: 3px solid transparent; color: var(--muted); font: 600 0.9688rem/1.3 var(--f-head); text-align: left; cursor: pointer; }
.ex-tab:last-child { border-bottom: 0; }
.ex-tab .icon { width: 1rem; height: 1rem; opacity: 0; transition: opacity var(--ease), transform var(--ease); }
.ex-tab:hover { color: var(--ink); background: #fff; }
.ex-tab[aria-selected="true"] { color: var(--ink); background: #fff; border-left-color: var(--green-700); margin-right: -1px; }
.ex-tab[aria-selected="true"] .icon { opacity: 1; color: var(--green-700); }
.ex-panel { padding: clamp(1.5rem, 1rem + 2vw, 2.75rem); }
.ex-count { margin: 0 0 0.75rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); font-variant-numeric: tabular-nums; }
.ex-panel h3 { font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem); margin-bottom: 0.9rem; }
.ex-panel p { max-width: 38rem; font-size: 1.0625rem; line-height: 1.65; }
@media (max-width: 899px) {
  .ex, .ex--img { grid-template-columns: 1fr; }
  .ex-media { border-right: 0; border-bottom: 1px solid var(--line); padding: 1.5rem; }
  .spccu .ex-img { max-width: 9rem; }
  .ex-tabs { flex-direction: row; overflow-x: auto; scrollbar-width: none; border-right: 0; border-bottom: 1px solid var(--line); }
  .ex-tab { flex: none; min-height: 52px; border-bottom: 0; border-left: 0; border-right: 1px solid var(--line); border-top: 3px solid transparent; white-space: nowrap; }
  .ex-tab[aria-selected="true"] { border-top-color: var(--green-700); margin-right: 0; }
  .ex-tab .icon { display: none; }
}

/* Statement panels */
.stmts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); }
.stmt { padding: clamp(1.75rem, 1.2rem + 2.5vw, 3.5rem); }
.stmt + .stmt { border-left: 1px solid var(--line); }
.stmt--deep { background: var(--green-900); }
.stmt-label { margin: 0 0 1.25rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.stmt--deep .stmt-label { color: #9fd0a8; }
.stmt-text { margin: 0; font: 500 clamp(1.375rem, 1.1rem + 1.2vw, 2rem)/1.3 var(--f-head); letter-spacing: -0.015em; color: var(--ink); text-wrap: balance; }
.stmt--deep .stmt-text { color: #fff; }
@media (max-width: 719px) { .stmts { grid-template-columns: 1fr; } .stmt + .stmt { border-left: 0; border-top: 1px solid var(--line); } }

/* Verse */
.spccu .verse { margin: 0 auto; max-width: 36rem; text-align: center; }
.verse h2 { margin-bottom: 1.5rem; }
.verse blockquote { margin: 0; font-size: 1.125rem; line-height: 1.85; color: var(--text); }
.verse blockquote p:first-child { font-style: italic; color: var(--muted); }

/* Committees */
.cmtes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.cmte { border: 1px solid var(--line); background: #fff; }
.cmte header { padding: 1.1rem 1.25rem; border-bottom: 1px solid var(--line); border-top: 3px solid var(--green-700); }
.cmte h3 { margin: 0; font-size: 1.0625rem; }
.cmte header p { margin: 0.15rem 0 0; font-size: 0.8125rem; color: var(--muted); }
.cmte ul { margin: 0; padding: 0; list-style: none; }
.cmte li { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 1rem; align-items: center; padding: 0.9rem 1.25rem; border-bottom: 1px solid var(--line); }
.cmte li:last-child { border-bottom: 0; }
.av { display: block; width: 4.5rem; height: 4.5rem; border-radius: 50%; overflow: hidden; background: var(--green-100); box-shadow: 0 0 0 1px var(--line); }
.spccu .av img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center 10%; transform: scale(1.15); transform-origin: 50% 30%; }
.av-ph { display: grid; place-items: center; width: 100%; height: 100%; font: 600 1.125rem var(--f-head); color: #6f8a77; }
.cmte b { display: block; font: 600 0.9688rem/1.3 var(--f-head); color: var(--ink); }
.cmte li span:not(.av):not(.av-ph) { font-size: 0.8125rem; color: var(--muted); }
.cmte li.is-officer { background: var(--green-50); }
.cmte li.is-officer div > span { color: var(--green-700) !important; font-weight: 600; }
@media (max-width: 999px) { .cmtes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 639px) { .cmtes { grid-template-columns: 1fr; } }

/* Callout */
.callout { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem 3rem; align-items: center; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border: 1px solid var(--line); border-left: 4px solid var(--green-700); background: #fff; }
.callout h2 { font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem); margin-bottom: 0.4rem; }
.callout .label { margin: 0 0 0.6rem; }
.callout p:last-child { margin-bottom: 0; }
.callout p { text-wrap: pretty; }
@media (max-width: 719px) { .callout { grid-template-columns: 1fr; } }

/* Staff directory */
.person-dept { margin: 0 0 0.2rem !important; font: 600 0.6875rem/1.3 var(--f-body) !important; letter-spacing: 0.08em; text-transform: uppercase; color: var(--green-700) !important; }

/* Pull quote in profiles */
.pq { margin: 0 0 1.5rem; padding: 0 0 0 1.25rem; border-left: 3px solid var(--green-700); }
.pq p { margin: 0 0 0.5rem; font: 500 clamp(1.125rem, 1rem + 0.5vw, 1.375rem)/1.45 var(--f-head); color: var(--ink); }
.pq footer { font-size: 0.875rem; color: var(--muted); }

/* Tenure timeline */
.tenure { margin: 0 0 2.75rem; }
.tenure-bar { display: flex; margin: 0; padding: 0; list-style: none; height: 3.25rem; border: 1px solid var(--line); }
.tenure-bar li { flex: 0 0 var(--w); display: grid; place-items: center; overflow: hidden; border-right: 1px solid #fff; background: var(--green-700); color: #fff; font: 600 0.75rem/1 var(--f-body); }
.tenure-bar li.t1 { background: var(--green-800); }
.tenure-bar li:last-child { border-right: 0; }
.tenure-bar b { white-space: nowrap; }
.tenure-axis { display: flex; justify-content: space-between; margin-top: 0.5rem; font-size: 0.8125rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.tenure-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem 1.5rem; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.tenure-years { margin: 0 0 0.2rem !important; font: 600 0.9375rem/1.3 var(--f-head) !important; color: var(--green-700) !important; font-variant-numeric: tabular-nums; }
.tenure-years span { font: 400 0.8125rem var(--f-body); color: var(--muted); }
.tenure-now { margin: 2.25rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--line); color: var(--muted); }
@media (max-width: 899px) { .tenure-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tenure-bar b { display: none; } }
@media (max-width: 559px) { .tenure-list { grid-template-columns: 1fr 1fr; gap: 1.5rem 1rem; } .tenure-bar { height: 2.25rem; } }

/* Expandable portraits + photo viewer */
.zoom { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.zoom > img { display: block; }
.zoom-hint { position: absolute; right: 0.5rem; bottom: 1.4rem; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--ink); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); opacity: 0; transform: scale(0.9); transition: opacity var(--ease), transform var(--ease); }
.zoom-hint .icon { width: 1.05rem; height: 1.05rem; }
.zoom:hover .zoom-hint, .zoom:focus-visible .zoom-hint { opacity: 1; transform: none; }
.av.zoom { width: 4.5rem; height: 4.5rem; border-radius: 50%; overflow: hidden; }
.av.zoom .zoom-hint { inset: 0; width: auto; height: auto; border-radius: 50%; background: rgba(6, 38, 20, 0.45); color: #fff; box-shadow: none; transform: none; }
.lead-person .zoom-hint { bottom: 0.75rem; right: 0.75rem; }
@media (hover: none) { .zoom-hint { opacity: 1; transform: none; width: 1.9rem; height: 1.9rem; } .av.zoom .zoom-hint { opacity: 0; } }
.lb { max-width: min(92vw, 44rem); max-height: 92vh; padding: 0; border: 0; background: transparent; overflow: visible; }
.lb::backdrop { background: rgba(6, 26, 14, 0.82); }
.lb[open] { animation: lb-in 200ms ease; }
@keyframes lb-in { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: none; } }
.lb figure { margin: 0; background: #fff; }
.spccu .lb img { display: block; max-width: 100%; max-height: calc(92vh - 4.5rem); width: auto; height: auto; margin: 0 auto; object-fit: contain; }
.lb figcaption { padding: 0.9rem 1.25rem; font: 600 1rem/1.4 var(--f-head); color: var(--ink); border-top: 1px solid var(--line); }
.lb-close { position: absolute; top: -0.9rem; right: -0.9rem; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #fff; color: var(--ink); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); cursor: pointer; }
@media (max-width: 559px) { .lb-close { top: 0.5rem; right: 0.5rem; } }

/* Product page v3 */
.pfacts { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); margin: 2rem 0 0; border-top: 1px solid var(--ink); }
.pfacts > div { padding: 0.9rem 1rem 0 0; }
.pfacts > div + div { padding-left: 1rem; border-left: 1px solid var(--line); }
.pfacts dt { font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.35rem; }
.pfacts dd { margin: 0; font: 600 1.375rem/1.15 var(--f-head); color: var(--green-700); letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.pfacts dd small { display: block; margin-top: 0.2rem; font: 400 0.75rem/1.3 var(--f-body); color: var(--muted); letter-spacing: 0; }
@media (max-width: 559px) { .pfacts { grid-template-columns: 1fr 1fr; row-gap: 1rem; } .pfacts > div:nth-child(odd) { padding-left: 0; border-left: 0; } .pfacts dd { font-size: 1.125rem; } }
.pnav { position: sticky; top: var(--hdr-h); z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.admin-bar .pnav { top: calc(var(--hdr-h) + 32px); }
.pnav ul { display: flex; gap: 0; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.pnav ul::-webkit-scrollbar { display: none; }
.pnav a { position: relative; display: block; padding: 1rem 0; margin-right: 1.75rem; color: var(--muted); font: 600 0.9375rem/1.2 var(--f-head); text-decoration: none; white-space: nowrap; }
.pnav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transform-origin: left; transition: transform 250ms ease; }
.pnav a:hover, .pnav a[aria-current] { color: var(--ink); }
.pnav a[aria-current]::after { transform: scaleX(1); }
[data-spy-target] { scroll-margin-top: calc(var(--hdr-h) + 72px); }
.glance-head p { margin: 0.35rem 0 0; font-size: 0.875rem; color: var(--muted); }
.glance-head h2 { font-size: 1.125rem !important; }
.ticks--2 { columns: 2; column-gap: 2rem; }
.ticks--2 li { break-inside: avoid; }
.prod-main .howto { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; counter-reset: s; }
.prod-main .howto li { display: block; padding: 1rem 0 0; border-bottom: 0; border-top: 3px solid var(--line); }
.prod-main .howto li:first-child { border-top-color: var(--green-700); }
.prod-main .howto li::before { margin-bottom: 0.75rem; }
@media (max-width: 719px) { .prod-main .howto { grid-template-columns: 1fr; gap: 0; } .prod-main .howto li { display: grid; grid-template-columns: 2.75rem 1fr; padding: 1rem 0; border-top: 0; border-bottom: 1px solid var(--line); } .prod-main .howto li::before { margin: 0; } .ticks--2 { columns: 1; } }
.checklist { border: 1px solid var(--line); }
.cl-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; padding: 0.85rem 1rem; background: var(--surface); border-bottom: 1px solid var(--line); }
.cl-count { margin: 0; font-size: 0.9375rem; color: var(--muted); }
.cl-count b { color: var(--ink); font: 600 1.0625rem var(--f-head); font-variant-numeric: tabular-nums; }
.cl-meter { flex: 1 1 8rem; height: 6px; border-radius: 999px; background: var(--line); overflow: hidden; }
.cl-meter span { display: block; height: 100%; width: 0; background: var(--green-700); transition: width 250ms ease; }
.reqs--check { counter-reset: none; }
.reqs--check li { display: block; padding: 0; border-bottom: 1px solid var(--line); }
.reqs--check li:first-child { border-top: 0; }
.reqs--check li:last-child { border-bottom: 0; }
.reqs--check li::before { content: none; }
.reqs--check label { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 0.85rem; align-items: start; padding: 0.85rem 1rem; cursor: pointer; transition: background var(--ease); }
.reqs--check label:hover { background: var(--green-50); }
.reqs--check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cl-box { position: relative; width: 1.35rem; height: 1.35rem; margin-top: 0.1rem; border: 1.5px solid var(--line-2); border-radius: 4px; background: #fff; transition: background var(--ease), border-color var(--ease); }
.cl-box::after { content: ""; position: absolute; left: 0.38rem; top: 0.15rem; width: 0.4rem; height: 0.7rem; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform 150ms ease; }
.reqs--check input:checked + .cl-box { background: var(--green-700); border-color: var(--green-700); }
.reqs--check input:checked + .cl-box::after { transform: rotate(45deg) scale(1); }
.reqs--check input:checked ~ span:last-child { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--line-2); }
.reqs--check input:focus-visible + .cl-box { outline: 2px solid var(--focus); outline-offset: 2px; }
.cl-note { margin: 0; padding: 0.75rem 1rem; border-top: 1px solid var(--line); font-size: 0.8125rem; color: var(--muted); background: var(--surface); }
.dl-list a span { display: inline-flex; align-items: center; gap: 0.35rem; white-space: nowrap; }
.dl-list a span .icon { width: 1rem; height: 1rem; }
.planpick { margin: 0 0 1.5rem; border: 1px solid var(--line); }
.pp-btns { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-bottom: 1px solid var(--line); }
.pp-btns button { min-height: 52px; border: 0; border-right: 1px solid var(--line); background: var(--surface); color: var(--muted); font: 600 1.0625rem var(--f-head); cursor: pointer; transition: background var(--ease), color var(--ease); }
.pp-btns button:last-child { border-right: 0; }
.pp-btns button:hover { background: #fff; color: var(--ink); }
.pp-btns button[aria-checked="true"] { background: var(--green-700); color: #fff; }
.pp-out { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; padding: 1.25rem 1.5rem; align-items: end; }
.pp-out b { display: block; margin-top: 0.3rem; font: 600 clamp(1.75rem, 1.4rem + 1.4vw, 2.25rem)/1 var(--f-head); color: var(--green-700); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pp-out p { grid-column: 1 / -1; margin: 0; font-size: 0.875rem; color: var(--muted); }
.pp-table tr { transition: background var(--ease); }
.pp-table tr.is-on > * { background: var(--green-50); color: var(--ink); font-weight: 600; }
.pbar { display: none; }
@media (max-width: 719px) {
  body:has(.pbar) .mbar { display: none; }
  .pbar { position: fixed; inset: auto 0 0; z-index: 90; display: grid; grid-template-columns: 1.4fr 1fr; gap: 0.6rem; padding: 0.6rem var(--g) calc(0.6rem + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--line-2); box-shadow: 0 -8px 20px -16px rgba(0, 0, 0, 0.4); }
  .pbar .btn { min-height: 46px; }
}
@media print {
  body:has(.checklist.is-printing) * { visibility: hidden; }
  body:has(.checklist.is-printing) .checklist.is-printing, body:has(.checklist.is-printing) .checklist.is-printing * { visibility: visible; }
  .checklist.is-printing { position: absolute; left: 0; top: 0; width: 100%; }
  .checklist.is-printing [data-print] { display: none; }
}

/* Resources ------------------------------------------------------------- */
.stories--grid { row-gap: 2.75rem; }
.lead-story { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding-bottom: clamp(2rem, 1.5rem + 2vw, 3rem); border-bottom: 1px solid var(--line); color: var(--text); text-decoration: none; }
.lead-story .story-img { aspect-ratio: 4 / 3; margin: 0; }
.lead-story h2 { font-size: clamp(1.625rem, 1.3rem + 1.4vw, 2.25rem); margin: 0.3rem 0 0.75rem; }
.lead-story p { color: var(--muted); }
.lead-story .label { color: var(--green-700); margin: 0 0 0.5rem; }
.lead-story:hover h2 { color: var(--green-700); text-decoration: underline; text-underline-offset: 0.15em; }
.lead-story:hover .story-img img { transform: scale(1.03); }
@media (max-width: 899px) { .lead-story { grid-template-columns: 1fr; } }
.news-tools { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 0 1.5rem; border-bottom: 1px solid var(--line); margin-bottom: 1rem; }
.news-tools .chips { margin: 0; border: 0; flex: 1 1 32rem; }
.news-q { flex: 0 1 18rem; padding-bottom: 0.5rem; }
.news-q input { min-height: 42px !important; }
@media (max-width: 719px) { .news-tools { border: 0; } .news-tools .chips { border-bottom: 1px solid var(--line); } .news-q { flex: 1 1 100%; padding-top: 0.75rem; } }
.hub { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 1.25rem; }
.hub-card { display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid var(--line); background: #fff; color: var(--text); text-decoration: none; }
.hub-card h3 { margin: 0.4rem 0 0.6rem; font-size: 1.1875rem; }
.hub-card p { margin: 0 0 1rem; font-size: 0.9375rem; color: var(--muted); }
.hub-card .go { margin-top: auto; }
.hub-card .label { display: flex; align-items: center; gap: 0.4rem; margin: 0; }
.hub-card .label .icon { width: 1rem; height: 1rem; }
.hub-card--img { display: grid; grid-template-columns: 9rem 1fr; gap: 1.25rem; align-items: start; }
.hub-card--img .story-img { margin: 0; }
.hub-card--notice { border-top: 4px solid var(--amber); }
.hub-card--notice .label { color: var(--amber); }
.hub-card--docs { border-top: 4px solid var(--green-700); }
.hub-card--docs > a:not(.go) { display: block; padding: 0.75rem 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.hub-card--docs > a b { display: block; font: 600 0.9688rem/1.35 var(--f-head); }
.hub-card--docs > a span { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.8125rem; color: var(--muted); }
.hub-card--docs > a span .icon { width: 0.9rem; height: 0.9rem; }
.hub-card--docs .go { margin-top: 1rem; }
a.hub-card:hover h3, .hub-card--docs > a:hover b { color: var(--green-700); text-decoration: underline; }
@media (max-width: 999px) { .hub { grid-template-columns: 1fr 1fr; } .hub-card--img { grid-column: 1 / -1; } }
@media (max-width: 639px) { .hub { grid-template-columns: 1fr; } .hub-card--img { grid-template-columns: 6.5rem 1fr; } }
.tips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
.tip { display: flex; flex-direction: column; padding: 1.75rem; border: 1px solid var(--line); border-top: 3px solid var(--green-700); background: #fff; }
.tip .label { margin: 0 0 0.6rem; color: var(--green-700); }
.tip h3 { font-size: 1.25rem; margin-bottom: 0.75rem; }
.tip p { font-size: 0.9688rem; }
.tip-next { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0 1rem; margin-top: auto; padding: 1rem 1.1rem; background: var(--green-50); color: var(--ink); text-decoration: none; }
.tip-next span { grid-column: 1; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.tip-next b { grid-column: 1; font: 600 1rem/1.3 var(--f-head); }
.tip-next .icon { grid-column: 2; grid-row: 1 / span 2; color: var(--green-700); transition: transform var(--ease); }
.tip-next:hover b { color: var(--green-700); text-decoration: underline; }
.tip-next:hover .icon { transform: translateX(3px); }
@media (max-width: 799px) { .tips { grid-template-columns: 1fr; } .tip { padding: 1.25rem; } }
.doc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 0.75rem; margin-bottom: 1.75rem; }
.doc-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 0.25rem; min-height: 5.5rem; padding: 1rem 1.1rem; border: 1px solid var(--line); background: #fff; color: var(--muted); text-align: left; cursor: pointer; transition: border-color var(--ease), background var(--ease); }
.doc-tile b { font: 600 1.75rem/1 var(--f-head); color: var(--ink); font-variant-numeric: tabular-nums; }
.doc-tile span { font: 600 0.875rem/1.3 var(--f-body); }
.doc-tile:hover { border-color: var(--green-700); color: var(--ink); }
.doc-tile[aria-pressed="true"] { background: var(--green-700); border-color: var(--green-700); color: #fff; }
.doc-tile[aria-pressed="true"] b { color: #fff; }
.doc-new { display: inline-block; margin-left: 0.4rem; padding: 0.15rem 0.4rem; background: var(--green-100); color: var(--green-700); font: 700 0.625rem/1.2 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; vertical-align: 0.15em; }
@media (max-width: 559px) { .doc-tiles { grid-template-columns: 1fr 1fr; } .doc-tile { min-height: 4.5rem; } .doc-tile b { font-size: 1.375rem; } }
.doc-ico { display: grid; place-items: center; width: 2.75rem; height: 3.25rem; border: 1.5px solid var(--line-2); border-radius: 3px; background: var(--surface); color: var(--green-700); font: 700 0.625rem/1 var(--f-body); letter-spacing: 0.06em; flex: none; }
.docfeat { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.25rem; }
.docfeat-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1.25rem; align-items: center; padding: 1.5rem; border: 1px solid var(--line); border-top: 4px solid var(--green-700); background: #fff; color: var(--text); text-decoration: none; }
.docfeat-card .label { margin: 0 0 0.35rem; color: var(--green-700); }
.docfeat-card h3 { margin: 0 0 0.25rem; font-size: 1.125rem; }
.docfeat-card p { margin: 0; font-size: 0.875rem; color: var(--muted); }
.docfeat-card:hover h3 { color: var(--green-700); text-decoration: underline; }
@media (max-width: 559px) { .docfeat-card { grid-template-columns: auto 1fr; } .docfeat-card .btn { grid-column: 1 / -1; } }
.faq-tools { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: center; justify-content: space-between; margin-bottom: 1.75rem; }
.faq-tools .news-q { flex: 1 1 18rem; padding: 0; }
.faq-group { margin: 2.25rem 0 0.75rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-700); }
.faq-wrap > .faq-group:first-of-type { margin-top: 0; }
.ftabs { border: 1px solid var(--line); background: #fff; }
.ftabs-list { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.ftab { display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem; min-height: 4.5rem; padding: 1rem 1.25rem; border: 0; border-right: 1px solid var(--line); background: var(--surface); color: var(--muted); text-align: left; cursor: pointer; }
.ftab:last-child { border-right: 0; }
.ftab b { font: 600 1rem/1.25 var(--f-head); }
.ftab span { font-size: 0.8125rem; }
.ftab:hover { color: var(--ink); background: #fff; }
.ftab[aria-selected="true"] { background: #fff; color: var(--ink); box-shadow: inset 0 3px 0 var(--green-700); }
.ftabs-panel { padding: clamp(1.25rem, 1rem + 2vw, 2.5rem); }
.ftabs-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; }
.ftabs-panel h3 { font-size: 1.375rem; margin-bottom: 0.4rem; }
.ftabs-panel .howto { margin-top: 1.25rem; }
.ftabs-panel .howto span { color: var(--text); }
.form-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.form-list li { border-bottom: 1px solid var(--line); }
.form-list a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1rem 0; color: var(--text); text-decoration: none; }
.form-list b { display: block; font: 600 1rem/1.35 var(--f-head); color: var(--ink); }
.form-list a > div span { font-size: 0.875rem; color: var(--muted); }
.form-list .icon { color: var(--green-700); }
.form-list a:hover b { color: var(--green-700); text-decoration: underline; }
.form-empty { padding: 1.25rem; background: var(--surface); border-left: 3px solid var(--line-2); }
.form-empty p:last-child { margin: 0; }
@media (max-width: 899px) { .ftabs-list { grid-auto-columns: minmax(9rem, 1fr); } .ftabs-grid { grid-template-columns: 1fr; } }
.links-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.25rem; border: 0 !important; }
.links-cards li { border: 1px solid var(--line); background: #fff; }
.links-cards a { grid-template-columns: 6rem minmax(0, 1fr) auto; padding: 1.5rem; height: 100%; }
.links-cards img { max-height: 3.5rem; margin-inline: auto; }
.phd--notice { background: linear-gradient(var(--amber-bg), var(--amber-bg)) top / 100% 6px no-repeat; }
.notice-banner { display: flex; align-items: center; gap: 0.6rem; margin: 0 0 1.25rem; padding: 0.75rem 1rem; background: var(--amber-bg); border-left: 4px solid var(--amber); color: #5f3305; font-weight: 600; font-size: 0.9375rem; }
.notice-banner .icon { color: var(--amber); width: 1.1rem; height: 1.1rem; }
.spccu .article-fig { margin: 0 0 2.25rem; }
.article-fig .zoom { max-width: 32rem; }
.spccu .article-fig img { max-width: 100%; border: 1px solid var(--line); margin: 0; }
.article-fig .zoom-hint { bottom: 0.75rem; right: 0.75rem; }
.article-fig figcaption { margin-top: 0.5rem; font-size: 0.8125rem; color: var(--muted); }
.share { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-top: 2.5rem; padding: 1.25rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.share .label { margin-right: 0.25rem; }
.share a, .share button { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 40px; padding: 0 0.9rem; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: 600 0.875rem var(--f-body); text-decoration: none; cursor: pointer; }
.share .icon { width: 1rem; height: 1rem; }
.share a:hover, .share button:hover { border-color: var(--green-700); color: var(--green-700); }
.postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1.5rem; }
.postnav a { display: block; padding: 1rem 0; color: var(--ink); text-decoration: none; }
.postnav a.next { text-align: right; grid-column: 2; }
.postnav b { display: block; margin-top: 0.25rem; font: 600 1rem/1.35 var(--f-head); }
.postnav a:hover b { color: var(--green-700); text-decoration: underline; }
@media (max-width: 559px) { .postnav { grid-template-columns: 1fr; gap: 0; } .postnav a.next { grid-column: 1; text-align: left; border-top: 1px solid var(--line); } }

/* Scrollable tab rows on small screens hint that more tabs follow */
@media (max-width: 899px) { .tabs-list, .pnav ul, .hx-eras { -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); padding-right: 2rem; } }

/* Contact page */
.ct-status { display: inline-flex; align-items: center; gap: 0.6rem; margin-bottom: 1.5rem; padding: 0.55rem 1rem; border: 1px solid var(--line); border-radius: 999px; font-size: 0.9375rem; }
.ct-status b { font-weight: 600; color: var(--ink); }
.ct-dot { width: 0.6rem; height: 0.6rem; border-radius: 50%; background: var(--line-2); }
.ct-status.is-open .ct-dot { background: #1f9d3a; box-shadow: 0 0 0 4px rgba(31, 157, 58, 0.18); }
.ct-status.is-closed .ct-dot { background: #b3261e; }
.ct-ways { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--line); border: 1px solid var(--line); }
.ct-ways li { display: flex; background: #fff; }
.ct-ways a { display: flex; flex-direction: column; gap: 0.3rem; width: 100%; padding: 1.5rem; color: var(--text); text-decoration: none; transition: background var(--ease); }
.ct-ways .icon { width: 1.5rem; height: 1.5rem; color: var(--green-700); margin-bottom: 0.6rem; }
.ct-ways b { font: 600 1.1875rem/1.3 var(--f-head); color: var(--ink); overflow-wrap: anywhere; }
.ct-ways a > span:last-child { font-size: 0.875rem; color: var(--muted); }
.ct-ways a:hover { background: var(--green-50); }
.ct-ways a:hover b { color: var(--green-700); text-decoration: underline; }
@media (max-width: 899px) { .ct-ways { grid-template-columns: 1fr 1fr; } }
@media (max-width: 479px) { .ct-ways a { padding: 1.1rem; } .ct-ways b { font-size: 1rem; } .ct-ways a > span:last-child { display: none; } }
.ct-topics { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); border: 1px solid var(--line); }
.ct-topic-list { display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--surface); }
.ct-topic { padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.ct-topic .label { margin: 0 0 0.5rem; color: var(--green-700); }
.ct-topic h3 { font-size: 1.5rem; margin-bottom: 0.4rem; }
.ct-person { display: grid; grid-template-columns: 3.5rem 1fr; gap: 1rem; align-items: center; margin: 1.5rem 0; padding: 1rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ct-person .av { width: 3.5rem; height: 3.5rem; }
.ct-person b { display: block; font: 600 1.0625rem/1.3 var(--f-head); color: var(--ink); }
.ct-person span:not(.av):not(.av-ph) { font-size: 0.875rem; color: var(--muted); }
.ct-more { margin: 1.25rem 0 0; }
@media (max-width: 899px) { .ct-topics { grid-template-columns: 1fr; } .ct-topic-list { flex-direction: row; overflow-x: auto; scrollbar-width: none; border-right: 0; border-bottom: 1px solid var(--line); } .ct-topic-list .ex-tab { flex: none; border-bottom: 0; border-left: 0; border-right: 1px solid var(--line); border-top: 3px solid transparent; white-space: nowrap; } .ct-topic-list .ex-tab[aria-selected="true"] { border-top-color: var(--green-700); margin-right: 0; } .ct-topic-list .ex-tab .icon { display: none; } }
.ct-visit { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.ct-map { position: relative; min-height: 26rem; border: 1px solid var(--line); background: var(--green-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M0 20h40M20 0v40' stroke='%23d9e0db' stroke-width='1'/%3E%3C/svg%3E"); }
.ct-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ct-addr { position: absolute; left: 1rem; bottom: 1rem; display: grid; gap: 0.2rem; max-width: 20rem; padding: 1.1rem 1.25rem; background: #fff; box-shadow: 0 10px 24px -14px rgba(0, 0, 0, 0.45); font-size: 0.875rem; color: var(--muted); }
.ct-addr .label { margin: 0 0 0.25rem; }
.ct-addr b { font: 600 1rem/1.3 var(--f-head); color: var(--ink); }
.ct-addr .btn { justify-self: start; margin-top: 0.75rem; }
.ct-hours h2 { font-size: 1.5rem; padding-bottom: 0.8rem; border-bottom: 1px solid var(--ink); }
.ct-hours table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.ct-hours th, .ct-hours td { padding: 0.75rem 0.75rem; border-bottom: 1px solid var(--line); text-align: left; font-weight: 400; }
.ct-hours td { text-align: right; color: var(--ink); }
.ct-hours tr.is-today { background: #fff; box-shadow: inset 3px 0 0 var(--green-700); }
.ct-hours tr.is-today > * { font-weight: 600; color: var(--ink); }
.ct-hours tr.is-today th::after { content: "Today"; margin-left: 0.5rem; padding: 0.1rem 0.4rem; background: var(--green-100); color: var(--green-700); font: 700 0.625rem/1.4 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; vertical-align: 0.15em; }
.ct-hours p { margin-top: 0.9rem; }
@media (max-width: 899px) { .ct-visit { grid-template-columns: 1fr; } .ct-map { min-height: 20rem; } }
@media (max-width: 479px) { .ct-addr { position: relative; left: auto; bottom: auto; max-width: none; margin-top: 20rem; box-shadow: none; border-top: 1px solid var(--line); } .ct-map { min-height: 0; } .ct-map iframe { height: 20rem; } }
.ct-tips { margin: 0; padding: 0; list-style: none; }
.ct-tips li { padding: 0.75rem 0 0.75rem 1.25rem; border-bottom: 1px solid var(--line); position: relative; color: var(--muted); }
.ct-tips li::before { content: ""; position: absolute; left: 0; top: 1.3rem; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--green-700); }

/* Mega menu: column headings link to their category */
.mega h3 a.mega-head { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0; color: var(--green-700); font: inherit; letter-spacing: inherit; text-decoration: none; }
.mega h3 a.mega-head .icon { width: 0.85rem; height: 0.85rem; transition: transform var(--ease); }
.mega h3 a.mega-head:hover { text-decoration: underline; }
.mega h3 a.mega-head:hover .icon { transform: translateX(2px); }
/* Comparison table: rate is the headline figure */
.cmp td.n--rate:not(.dim) { font: 600 1.25rem/1.2 var(--f-head); color: var(--green-700); letter-spacing: -0.01em; }
.cmp td.n--rate.dim { font-size: 0.875rem; }

/* Mega menu: browse-all link (one slim line) */
.mega:has(.mega-all) > .wrap:first-child { padding-bottom: 1.25rem; }
.mega-all .wrap { padding-block: 0 !important; }
.mega-all a { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.7rem 0 0.85rem; border-top: 1px solid var(--line); width: 100%; color: var(--green-700); font: 600 0.875rem/1.3 var(--f-body); text-decoration: none; }
.mega-all a b { font: inherit; }
.mega-all span { display: none; }
.mega-all .icon { width: 0.9rem; height: 0.9rem; transition: transform var(--ease); }
.mega-all a:hover { text-decoration: underline; }
.mega-all a:hover .icon { transform: translateX(2px); }
@media (max-width: 1239px) { .mega-all a { border-top: 0; padding: 0.4rem 0 1.25rem; font-size: 0.9375rem; } .mega:has(.mega-all) > .wrap:first-child { padding-bottom: 0.5rem; } }

/* Product catalogue */
.cat-sec { padding-block: clamp(2.75rem, 2rem + 3vw, 4.5rem); scroll-margin-top: calc(var(--hdr-h) + 56px); }
.cat-sec--alt { background: var(--surface); }
.cat-sec + .cat-sec:not(.cat-sec--alt) { border-top: 1px solid var(--line); }
.cat-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.cat-intro { position: sticky; top: calc(var(--hdr-h) + 80px); }
.cat-intro .label { margin: 0 0 0.6rem; color: var(--green-700); }
.cat-intro h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); margin-bottom: 0.75rem; }
.cat-intro p:not(.label) { color: var(--muted); font-size: 0.9688rem; margin-bottom: 1.5rem; }
.cat-intro .btn .icon { order: 2; }
.cat-list .ledger { border-top: 1px solid var(--ink); }
.cat-list .ledger-group { margin-top: 2rem; }
.cat-list .ledger-group:first-child { margin-top: 0; }
.cat-list .ledger-group + .ledger { border-top: 0; }
.cat-sec--alt .row { background: transparent; }
@media (max-width: 899px) { .cat-grid { grid-template-columns: 1fr; gap: 1.25rem; } .cat-intro { position: static; } .cat-intro p:not(.label) { margin-bottom: 1rem; } }

/* FAQ page */
.faq-layout { display: grid; grid-template-columns: 18rem minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.faq-side { position: sticky; top: calc(var(--hdr-h) + 24px); display: grid; gap: 1.75rem; }
.faq-topics { display: grid; border-top: 1px solid var(--ink); }
.faq-topics .label { margin: 0; padding: 0.75rem 0 0.5rem; }
.faq-topic { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 44px; padding: 0.5rem 0.75rem; border: 0; border-left: 3px solid transparent; background: none; color: var(--text); font: 500 0.9688rem/1.3 var(--f-body); text-align: left; cursor: pointer; }
.faq-topic b { min-width: 1.75rem; padding: 0.1rem 0.45rem; border-radius: 999px; background: var(--surface); color: var(--muted); font: 600 0.75rem/1.4 var(--f-body); text-align: center; font-variant-numeric: tabular-nums; }
.faq-topic:hover { background: var(--green-50); color: var(--ink); }
.faq-topic[aria-pressed="true"] { border-left-color: var(--green-700); background: var(--green-50); color: var(--ink); font-weight: 600; }
.faq-topic[aria-pressed="true"] b { background: var(--green-700); color: #fff; }
.faq-help { display: grid; gap: 0.6rem; padding: 1.25rem; border: 1px solid var(--line); background: var(--surface); }
.faq-help .label { margin: 0; }
.faq-help p:not(.label) { margin: 0 0 0.4rem; font-size: 0.9375rem; color: var(--muted); }
.faq-help .go { margin-top: 0.3rem; font-size: 0.9375rem; }
.faq-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.faq-bar .lib-count { margin: 0; }
.faq-group-title { margin: 2.5rem 0 0; padding-bottom: 0.75rem; font-size: 1.375rem; border-bottom: 1px solid var(--ink); }
.faq-bar + .faq-group-title, .faq-group-title:first-of-type { margin-top: 0; }
.faq-main .faq { border-top: 0; }
.faq-main .faq summary { font-size: 1.0625rem; }
.faq-main .faq details[open] { background: linear-gradient(90deg, var(--green-50), transparent 60%); }
.faq-main .faq details[open] summary { color: var(--green-700); }
.faq-main .ans { padding-left: 0; max-width: 44rem; }
.ans-link { margin: 0.25rem 0 0 !important; }
.ans-link button { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0; border: 0; background: none; color: var(--muted); font: 500 0.8125rem var(--f-body); cursor: pointer; }
.ans-link button:hover { color: var(--green-700); text-decoration: underline; }
.ans-link .icon { width: 0.9rem; height: 0.9rem; }
details:target summary { color: var(--green-700); }
@media (max-width: 899px) {
  .faq-layout { grid-template-columns: 1fr; gap: 1.5rem; }
  .faq-side { position: static; gap: 1rem; }
  .faq-topics { display: flex; gap: 0.5rem; overflow-x: auto; scrollbar-width: none; border-top: 0; padding-bottom: 0.25rem; }
  .faq-topics .label { display: none; }
  .faq-topic { flex: none; min-height: 40px; border: 1px solid var(--line); border-radius: 999px; padding: 0.4rem 0.9rem; }
  .faq-topic[aria-pressed="true"] { border-color: var(--green-700); }
  .faq-help { display: none; }
}

/* Logo strip */
.logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; }
.logos-text { margin: 0; max-width: 24rem; font-size: 0.9688rem; color: var(--muted); }
.logos-text .go { display: inline-flex; margin-top: 0.35rem; }
.logos ul { display: flex; flex-wrap: wrap; align-items: center; gap: 2rem 3rem; margin: 0; padding: 0; list-style: none; }
.logos a { display: block; }
.spccu .logos img { width: auto; max-width: 9rem; height: 3.25rem; object-fit: contain; filter: grayscale(1); opacity: 0.75; transition: filter var(--ease), opacity var(--ease); }
.logos a:hover img, .logos a:focus-visible img { filter: none; opacity: 1; }
@media (max-width: 719px) { .logos ul { gap: 1.5rem 2rem; } .spccu .logos img { height: 2.5rem; max-width: 7rem; } }

/* Prose / content blocks ------------------------------------------------ */
.prose { max-width: 46rem; }
.prose h2 { margin-top: 2em; }
.prose h3 { margin-top: 1.75em; }
.prose > :first-child { margin-top: 0; }
.prose li { margin-bottom: 0.35em; }
.prose img { margin-block: 1.5rem; }
.split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.split--even { grid-template-columns: 1fr 1fr; }
.side-col img { max-width: 13rem; }
@media (max-width: 899px) { .split, .split--even { grid-template-columns: 1fr; } }
.side-col { position: sticky; top: 110px; }
@media (max-width: 899px) { .side-col { position: static; } }
.statement { margin: 0; font: 500 clamp(1.5rem, 1.15rem + 1.5vw, 2.25rem)/1.25 var(--f-head); letter-spacing: -0.015em; color: var(--ink); max-width: 30ch; }
.defs { margin: 0; border-top: 1px solid var(--ink); }
.defs > div { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 0.5rem 2.5rem; padding: 1.4rem 0; border-bottom: 1px solid var(--line); }
.defs dt { font: 600 1.0938rem/1.35 var(--f-head); color: var(--ink); }
.defs dd { margin: 0; }
@media (max-width: 719px) { .defs > div { grid-template-columns: 1fr; } }
.faq { border-top: 1px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; min-height: 64px; padding: 1rem 0; cursor: pointer; list-style: none; font: 600 1.0938rem/1.35 var(--f-head); color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--green-700); }
.faq summary .icon { color: var(--green-700); transition: transform var(--ease); }
.faq details[open] summary .icon { transform: rotate(45deg); }
.faq .ans { padding: 0 3rem 1.25rem 0; max-width: 46rem; }
.links-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.links-list li { border-bottom: 1px solid var(--line); }
.links-list a { display: grid; grid-template-columns: 7rem minmax(0, 1fr) auto; gap: 0.25rem 2rem; align-items: center; padding: 1.4rem 0; text-decoration: none; color: var(--text); }
.links-list img { max-height: 3rem; width: auto; }
.links-list h3 { margin: 0 0 0.2rem; font-size: 1.0938rem; }
.links-list p { margin: 0; font-size: 0.9375rem; color: var(--muted); }
.links-list .icon { color: var(--green-700); }
.links-list a:hover h3 { color: var(--green-700); text-decoration: underline; }
@media (max-width: 559px) { .links-list a { grid-template-columns: 4.5rem minmax(0, 1fr); } .links-list .icon { display: none; } }
.idx { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2.5rem; border-top: 1px solid var(--ink); }
.idx li { border-bottom: 1px solid var(--line); }
.idx a { display: block; padding: 1.25rem 0; text-decoration: none; color: var(--text); }
.idx b { display: flex; justify-content: space-between; gap: 1rem; font: 600 1.125rem/1.3 var(--f-head); color: var(--ink); margin-bottom: 0.25rem; }
.idx b .icon { color: var(--green-700); width: 1rem; height: 1rem; margin-top: 0.2rem; }
.idx span { font-size: 0.9375rem; color: var(--muted); }
.idx a:hover b { color: var(--green-700); text-decoration: underline; }
@media (max-width: 899px) { .idx { grid-template-columns: 1fr 1fr; } }
@media (max-width: 559px) { .idx { grid-template-columns: 1fr; } }

/* Contact page ---------------------------------------------------------- */
.contact { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.contact-map { width: 100%; height: 100%; min-height: 26rem; border: 0; background: var(--surface); }
.contact-dl { margin: 0; border-top: 1px solid var(--ink); }
.contact-dl > div { padding: 1.1rem 0; border-bottom: 1px solid var(--line); }
.contact-dl dt { margin-bottom: 0.3rem; }
.contact-dl dd { margin: 0; }
.contact-dl a { font-weight: 600; color: var(--ink); text-decoration: none; display: inline-flex; min-height: 32px; align-items: center; }
.contact-dl a:hover { color: var(--green-700); text-decoration: underline; }
.contact-dl table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.contact-dl th, .contact-dl td { padding: 0.2rem 0; text-align: left; font-weight: 400; }
.contact-dl td { text-align: right; color: var(--ink); }
@media (max-width: 899px) { .contact { grid-template-columns: 1fr; } .contact-map { min-height: 18rem; } }

/* Article ---------------------------------------------------------------- */
.post-meta { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; margin-bottom: 0.9rem; }
.article { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: clamp(2.5rem, 6vw, 5.5rem); }
.article-fig img { max-width: 32rem; border: 1px solid var(--line); margin-bottom: 2rem; }
@media (max-width: 999px) { .article { grid-template-columns: 1fr; } }
.chips { display: flex; flex-wrap: wrap; gap: 0 1.5rem; margin: 0 0 1.5rem; border-bottom: 1px solid var(--line); }
.chip { position: relative; min-height: 48px; padding: 0; background: none; border: 0; color: var(--muted); font: 600 0.9375rem/1 var(--f-body); cursor: pointer; }
.chip::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--green-700); transform: scaleX(0); transition: transform var(--ease); }
.chip[aria-pressed="true"] { color: var(--ink); }
.chip[aria-pressed="true"]::after { transform: scaleX(1); }
.chip:hover { color: var(--ink); }
@media (max-width: 719px) { .chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--g) * -1); padding-inline: var(--g); } .chip { white-space: nowrap; } }
.more-wrap { margin-top: 2rem; }

/* Elementor integration: SPCCU widgets control their own spacing */
.elementor-widget[class*="elementor-widget-spccu-"] > .elementor-widget-container { margin: 0; padding: 0; }
.e-con.spccu-flush { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px; }
.e-con.spccu-boxed > .e-con-inner { max-width: calc(var(--w) + 2 * var(--g)); padding-inline: var(--g); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation: none !important; }
  .slide-media img { transform: none !important; }
}
@media print { .util, .hdr, .mbar, .pbar, .pnav, .ftr, .cband, .slider-nav { display: none !important; } }

/* ==========================================================================
   Mobile layer. Phones (≤719px) get a layout of their own rather than a
   stacked desktop; small tablets (720–1023px) and landscape phones are
   tuned separately. Desktop rules above are unaffected.
   ========================================================================== */

/* Elements that only exist for phones */
.m-access, .cband-quick, .drawer-quick, .drawer-label { display: none; }
details.ftr-col > summary { list-style: none; cursor: default; pointer-events: none; }
details.ftr-col > summary::-webkit-details-marker { display: none; }
details.ftr-col > summary .icon { display: none; }

/* App-style menu (all collapsed-nav widths) */
@media (max-width: 1239px) {
  .nav { background: var(--surface); }
  .drawer-head { background: #fff; }
  .drawer-quick { display: grid; gap: 0.75rem; padding: 1rem var(--g) 0.5rem; }
  .dq-bank { display: grid; grid-template-columns: 2.75rem 1fr auto; align-items: center; gap: 0.9rem; padding: 1rem 1.1rem; border-radius: 12px; background: var(--green-900); color: #fff; text-decoration: none; }
  .dq-bank > .icon:first-child { width: 2.75rem; height: 2.75rem; padding: 0.65rem; border-radius: 50%; background: rgba(255, 255, 255, 0.12); }
  .dq-bank b { display: block; font: 600 1.0625rem/1.25 var(--f-head); }
  .dq-bank small { color: #b9d4c0; font-size: 0.8125rem; }
  .dq-bank > .icon:last-child { width: 1.1rem; height: 1.1rem; }
  .dq-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; }
  .dq-grid a { display: grid; justify-items: center; align-content: center; gap: 0.45rem; min-height: 5.25rem; padding: 0.75rem 0.4rem; border-radius: 12px; background: #fff; border: 1px solid var(--line); color: var(--ink); text-align: center; text-decoration: none; font: 600 0.8125rem/1.2 var(--f-body); }
  .dq-grid .icon { width: 1.5rem; height: 1.5rem; color: var(--green-700); }
  .dq-grid a:active, .dq-bank:active { transform: scale(0.98); }
  .drawer-label { display: block; margin: 1rem var(--g) 0.25rem; font: 600 var(--t-label)/1.3 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
  .nav > ul { margin: 0 var(--g); padding: 0 1rem; border-radius: 12px; background: #fff; border: 1px solid var(--line); }
  .nav > ul > li:last-child { border-bottom: 0; }
  .nav-top { min-height: 56px; font: 600 1.0625rem/1.2 var(--f-head); }
  .nav-top .icon { width: 1rem; height: 1rem; color: var(--muted); }
  .mega .wrap { gap: 0.25rem; padding: 0 0 0.75rem; }
  .mega h3 { margin: 0.75rem 0 0.25rem; padding: 0; border: 0; }
  .mega a { padding: 0.55rem 0; color: var(--text); }
  .drawer-cta { padding: 1.25rem var(--g) 2rem; }
  .dq-contact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
  .dq-contact a { display: flex; align-items: center; justify-content: center; gap: 0.4rem; min-height: 48px; border-radius: 10px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font: 600 0.875rem var(--f-body); text-decoration: none; }
  .dq-contact .icon { width: 1.1rem; height: 1.1rem; color: var(--green-700); }
  .drawer-cta p { margin: 0.9rem 0 0; text-align: center; font-size: 0.8125rem; color: var(--muted); }
}

@media (max-width: 719px) {
  :root { --pad: 2.75rem; --g: 1.25rem; --t-h1: 1.875rem; --t-h2: 1.4375rem; --t-display: 1.875rem; }
  body:not(.home) .band { padding-block: 2.25rem; }
  body:not(.home) .band--tight { padding-block: 1.75rem; }
  .sh { margin-bottom: 1.25rem; padding-bottom: 0.75rem; }
  .sh p { font-size: 0.9375rem; }

  /* Header: the utility bar repeats the bottom bar, so it goes */
  .util { display: none; }
  .site-header, .elementor-location-header { top: 0; }
  .hdr > .wrap { min-height: 60px; }
  .logo b { font-size: 0.9375rem; }
  .menu-btn span { display: none; }

  /* Bottom action bar */
  .mbar { grid-template-columns: repeat(4, 1fr); box-shadow: 0 -6px 18px -14px rgba(0, 0, 0, 0.5); }
  .mbar a { min-height: 58px; font-size: 0.6875rem; letter-spacing: 0.01em; }
  .mbar a + a { border-left: 0; }
  .mbar .is-bank { margin: 6px 0 6px 6px; border-radius: 10px; min-height: 46px; }
  .mbar a:not(.is-bank) .icon { color: var(--green-700); }

  /* Buttons share a row and fill it */
  .btns { gap: 0.6rem; }
  .btns > .btn { flex: 1 1 auto; padding-inline: 0.9rem; white-space: nowrap; }
  .btn { min-height: 48px; }

  /* Hero slider: photo, then a compact panel; never more than ~70% of the screen */
  .slide-media { aspect-ratio: 16 / 9; }
  .slide-media img { object-position: center 30%; }
  .slide-copy { padding: 1.25rem var(--g) 3.75rem; }
  .slide-kicker { margin-bottom: 0.6rem; font-size: 0.6875rem; }
  .slider .slide-title { margin-bottom: 0.6rem; font-size: 1.75rem; line-height: 1.12; }
  .slide-text { margin-bottom: 1.1rem; font-size: 0.9688rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .slide-copy .btns .btn { flex: 1 1 auto; min-height: 46px; padding-inline: 0.75rem; font-size: 0.875rem; }
  .slide-fact { right: 0.75rem; bottom: 0.75rem; max-width: 12rem; padding: 0.55rem 0.8rem; font-size: 0.75rem; border-radius: 8px; }
  .slide-fact b { font-size: 1.125rem; }
  .slider-nav { left: var(--g); right: calc(var(--g) + 2.75rem); bottom: 1.4rem; gap: 0.4rem; }
  .slider-tab { min-height: 24px; padding: 0; font-size: 0; color: transparent; border-top-width: 3px; }
  .slider-tab::before { top: -3px; height: 3px; }
  .slider-pause { right: -2.6rem; bottom: -0.55rem; width: 34px; height: 34px; }

  /* Home: banking card + quick actions replace the desktop sign-in panel and task list */
  .band--access { padding-block: 1.25rem 2rem; }
  .access > .olb, .access > .tasks { display: none; }
  .m-access { display: grid; gap: 0.9rem; }
  .m-bank { display: grid; grid-template-columns: 2.5rem 1fr auto; align-items: center; gap: 0.85rem; padding: 0.9rem 1rem; border-radius: 12px; background: var(--green-900); color: #fff; text-decoration: none; }
  .m-bank > .icon:first-child { width: 2.5rem; height: 2.5rem; padding: 0.6rem; border-radius: 50%; background: rgba(255, 255, 255, 0.12); }
  .m-bank b { display: block; font: 600 1rem/1.25 var(--f-head); }
  .m-bank small { color: #b9d4c0; font-size: 0.8125rem; }
  .m-bank:hover { color: #fff; }
  .m-tasks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
  .m-tasks a { display: grid; justify-items: center; align-content: center; gap: 0.45rem; min-height: 5rem; padding: 0.7rem 0.35rem; border-radius: 12px; border: 1px solid var(--line); background: #fff; color: var(--ink); text-align: center; text-decoration: none; font: 600 0.8125rem/1.2 var(--f-body); }
  .m-tasks .icon { width: 1.45rem; height: 1.45rem; color: var(--green-700); }
  .m-tasks a:active, .m-bank:active { transform: scale(0.98); }

  /* Home news: lead story, then compact rows */
  .stories { gap: 1.25rem; }
  .stories li:first-child .story-img { aspect-ratio: 4 / 3; }
  .stories li:not(:first-child) .story { grid-template-columns: 5.5rem minmax(0, 1fr); }
  .story h3 { font-size: 1.125rem; }
  .notices-reg { margin-top: 2rem; }
  .nr-list a { padding: 0.9rem 0; }
  .nr-list p { display: none; }

  /* Product tiles: rows with the figure on the right */
  .tiles .tile { padding: 0.95rem 1rem; }
  .tiles li.tile-all-cell .tile, .tiles li.tile-all-cell.is-wide .tile { display: flex; flex-direction: row; align-items: center; justify-content: space-between; min-height: 0; padding: 0.9rem 1rem; }
  .tiles li.tile-all-cell .tile p { display: none; }
  .tiles li.tile-all-cell .tile > .icon { position: static; display: block; }
  .px-lead { font-size: 0.9375rem; margin-bottom: 1rem; }

  /* Rates: heading, then the table, then the small print */
  .rb { gap: 1rem; }
  .rb-intro { display: contents; }
  .rb-intro h2 { order: 1; margin: 0; }
  .rb-intro > p:not(.rb-note) { order: 2; margin: 0; font-size: 0.9375rem; }
  .rb-panel { order: 3; }
  .rb-note { order: 4; margin: 0; font-size: 0.8125rem; }
  .rb-intro .btns { order: 5; margin: 0; }
  .rb-tab { min-height: 48px; font-size: 0.875rem; white-space: nowrap; }
  .rb-table thead { display: none; }
  .rb-table tbody th small { font-size: 0.75rem; }

  /* Membership band */
  .own--light { padding: 2.25rem var(--g); gap: 1.25rem; }
  .own--light .own-media { aspect-ratio: 16 / 9; }
  .own-copy h2 { font-size: 1.625rem; }
  .own-copy > p:nth-of-type(2) { display: none; }
  .own dl { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; margin: 1.25rem 0 1.5rem; }
  .own--light dl > div + div { border-left: 1px solid var(--line); padding-left: 0.75rem; }
  .own dd { font-size: 1rem; }
  .own dt { font-size: 0.75rem; }

  /* Partner logos */
  .logos { gap: 1rem; }
  .logos ul { width: 100%; justify-content: space-between; gap: 0.75rem; flex-wrap: nowrap; }
  .spccu .logos img { height: 2rem; max-width: 6.5rem; }

  /* Contact band: three actions and one line of details */
  .cband .wrap.cband-grid { display: block; padding-block: 1.75rem; }
  .cband-grid > div:not(.cband-quick) { display: none; }
  .cband-grid > div:first-child { display: block; margin-bottom: 1rem; }
  .cband-grid > div:first-child p { display: none; }
  .cband h2 { font-size: 1.25rem; margin: 0; }
  .cband-quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
  .cband-quick a { display: flex; align-items: center; justify-content: center; gap: 0.4rem; min-height: 48px; border-radius: 10px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font: 600 0.875rem var(--f-body); text-decoration: none; }
  .cband-quick .icon { width: 1.1rem; height: 1.1rem; color: var(--green-700); }
  .cband-quick p { grid-column: 1 / -1; margin: 0.4rem 0 0; font-size: 0.8125rem; color: var(--muted); text-align: center; }
  .cband-quick p a { display: inline; min-height: 0; border: 0; background: none; padding: 0; font: inherit; color: var(--green-700); text-decoration: underline; }

  /* Footer: link groups collapse */
  .ftr-main { padding-block: 2rem 0.5rem; }
  .ftr-about { margin-bottom: 0.75rem; }
  .ftr-about p:first-of-type { font-size: 0.875rem; }
  details.ftr-col { padding: 0; border-top: 1px solid rgba(255, 255, 255, 0.14); }
  details.ftr-col > summary { display: flex; align-items: center; justify-content: space-between; min-height: 54px; pointer-events: auto; cursor: pointer; }
  details.ftr-col > summary h2 { margin: 0; }
  details.ftr-col > summary .icon { display: block; width: 1rem; height: 1rem; color: #a7bfae; transition: transform var(--ease); }
  details.ftr-col[open] > summary .icon { transform: rotate(180deg); }
  details.ftr-col ul { padding-bottom: 0.75rem; }
  details.ftr-col li a { padding: 0.55rem 0; }
  .ftr-legal { padding-bottom: 1.25rem; font-size: 0.75rem; }

  /* Page headers */
  .phd .wrap { padding-block: 1rem 1.75rem; }
  .crumbs { margin-bottom: 1rem; font-size: 0.8125rem; }
  .phd h1 { margin-bottom: 0.35em; }
  .phd .lead { font-size: 1rem; }
  .phd .btns { margin-top: 1.25rem; }
  .phd-stats > div { padding: 0.75rem 0.7rem; }
  .phd-stats dt { font-size: 0.625rem; }
  .phd-stats dd { font-size: 1.0625rem; }

  /* Comparison tables: one tappable row per product */
  .cmp caption { font-size: 1.125rem; }
  .cmp tr { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.2rem 1rem; padding: 0.95rem 0; }
  .cmp tbody th { grid-column: 1; grid-row: 1; padding: 0 0 0.15rem; }
  .cmp tbody th a { font-size: 1rem; margin: 0; }
  .cmp tbody th a::after { content: ""; position: absolute; inset: 0; }
  .cmp tbody th span { -webkit-line-clamp: 1; font-size: 0.8125rem; }
  .cmp td:nth-of-type(1) { grid-column: 2; grid-row: 1 / span 3; align-self: center; text-align: right; max-width: 6.5rem; }
  .cmp td:nth-of-type(1)::before { display: none; }
  .cmp td.n--rate:not(.dim) { font-size: 1.0625rem; line-height: 1.15; }
  .cmp td:nth-of-type(2), .cmp td:nth-of-type(3) { grid-column: 1; font-size: 0.8125rem; font-weight: 600; }
  .cmp td:nth-of-type(2)::before, .cmp td:nth-of-type(3)::before { display: inline; margin: 0 0.35rem 0 0; font-size: 0.625rem; }
  .cmp td.dim:not(.n--rate) { display: none; }
  .cmp td.act { display: none; }
  .cmp tbody tr:active { background: var(--green-50); }

  /* Product pages: the bottom bar carries Apply/Call, so the side card moves below */
  .prod { gap: 2rem; }
  .glance { order: 2; }
  .glance-act { display: none; }
  .glance-head { padding: 0.9rem 1.1rem; }
  .pfacts { margin-top: 1.5rem; }
  .prod-main > section + section { margin-top: 2rem; padding-top: 1.75rem; }
  .calc .two { grid-template-columns: 1.4fr 1fr; }
  .calc-in, .calc-out { padding: 1.1rem; }
  .phd-media img { aspect-ratio: 16 / 9; }

  /* Documents: compact rows with an icon download button */
  .doc-tiles { display: flex; gap: 0.5rem; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--g) * -1) 1rem; padding: 0 var(--g) 0.25rem; }
  .doc-tile { flex: none; flex-direction: row; align-items: baseline; gap: 0.4rem; min-height: 40px; padding: 0.45rem 0.9rem; border-radius: 999px; }
  .doc-tile b { font-size: 0.9375rem; }
  .doc-tile span { font-size: 0.8125rem; white-space: nowrap; }
  .lib-bar { gap: 0.6rem; }
  .lib-bar .fld label { font-size: 0.8125rem; }
  .lib tr { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.15rem 0.85rem; padding: 0.85rem 0; }
  .lib tbody th { grid-column: 1; grid-row: 1; font-size: 0.9375rem; }
  .lib td.c { grid-column: 1; grid-row: 2; }
  .lib td:last-child { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
  .lib a.get { width: 46px; min-height: 46px; padding: 0; justify-content: center; border-radius: 50%; font-size: 0; }
  .lib a.get em { display: none; }
  .lib a.get .icon { width: 1.15rem; height: 1.15rem; }
  .docfeat-card { padding: 1.1rem; gap: 0.85rem; }

  /* Forms picker */
  .ftabs-list { display: flex; overflow-x: auto; scrollbar-width: none; }
  .ftab { flex: none; min-height: 3.75rem; padding: 0.7rem 1rem; }
  .ftabs-panel { padding: 1.1rem; }
  .form-list a { grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.75rem; }

  /* History */
  .hx-ch { padding-block: 2.25rem; }
  .hx-intro .hx-years { font-size: 2.125rem; }
  .hx-intro.is-collapsible:not(.is-expanded) > p:nth-of-type(n + 4) { display: none; }
  .hx-more { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; margin: 0 0 0.5rem; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: 600 0.875rem var(--f-body); cursor: pointer; }
  .hx-grid { gap: 1.5rem; }
  .hx-item { padding-bottom: 1.5rem; }
  .hx-item time { font-size: 1.125rem; }
  .hx-item--key time { font-size: 1.25rem; }
  .statement-quote { font-size: 1.25rem; }
  .statement-quote::before { font-size: 3rem; }

  /* About components */
  .ex-panel { padding: 1.1rem; }
  .ex-panel p { font-size: 1rem; }
  .stmt { padding: 1.5rem; }
  .stmt-text { font-size: 1.3125rem; }
  .cmte li { grid-template-columns: 3.5rem minmax(0, 1fr); padding: 0.75rem 1rem; }
  .av, .av.zoom { width: 3.5rem; height: 3.5rem; }
  .verse blockquote { font-size: 1rem; }
  .callout { padding: 1.25rem; }
  .tenure-list { gap: 1.25rem 0.75rem; }

  /* Contact page */
  .ct-status { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 0.25rem 0.6rem; width: 100%; border-radius: 12px; padding: 0.75rem 1rem; }
  .ct-status .ct-dot { margin-top: 0.45rem; }
  .ct-status [data-status-detail] { flex-basis: 100%; padding-left: 1.2rem; font-size: 0.8125rem; }
  .ct-topic { padding: 1.1rem; }
  .ct-topic h3 { font-size: 1.25rem; }
  .ct-map iframe { height: 14rem; }
  .ct-addr { margin-top: 14rem; }

  /* News and articles */
  .lead-story h2 { font-size: 1.375rem; }
  .lead-story > div > p:not(.label):not(.story-meta) { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .share { gap: 0.5rem; }
  .share a, .share button { flex: 1 1 auto; justify-content: center; }

  /* FAQs */
  .faq summary { min-height: 56px; font-size: 1rem; }
  .faq-group-title { font-size: 1.125rem; margin-top: 1.75rem; }
  .faq-bar { margin-bottom: 0.5rem; }

  /* Product pages: the pinned Apply/Call bar replaces the duplicate in-page row */
  .pbar { box-shadow: 0 -6px 18px -14px rgba(0, 0, 0, 0.5); }
  body:has(.pbar) .phd .btns { display: none; }
  .prod-main .btns > .btn { flex: 1 1 100%; }

  /* Contact: topic tabs scroll with a fade, form submit fills the row */
  .ct-topics .ct-topic-list { -webkit-mask-image: linear-gradient(90deg, #000 80%, transparent); mask-image: linear-gradient(90deg, #000 80%, transparent); }
  .form button[type="submit"] { width: 100%; }
  .ct-tips li { font-size: 0.9375rem; }
  .ct-ways li:nth-child(4) b { font-size: 0.9375rem; }

  /* Lightbox fills the phone */
  .lb { max-width: 100vw; max-height: 100dvh; }
  .spccu .lb img { max-height: calc(100dvh - 5rem); }
}

/* Very narrow phones */
@media (max-width: 374px) {
  .m-tasks, .dq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .logo b { font-size: 0.875rem; }
  .slider .slide-title { font-size: 1.5625rem; }
}

/* Small tablets: two columns where they fit */
@media (min-width: 720px) and (max-width: 1023px) {
  .access { grid-template-columns: 1fr; }
  .olb .two { grid-template-columns: 1fr 1fr; }
  .tasks ul { grid-template-columns: 1fr 1fr; }
  .stories { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stories:not(.stories--grid) li:first-child { grid-column: auto; }
  .cmp td.act .go { font-size: 0.875rem; }
  .slide-media { aspect-ratio: 21 / 9; }
}

/* Phones held sideways: short screens get a slim header, a compact slider and
   no sticky panels, so content is never hidden behind fixed elements. */
@media (orientation: landscape) and (max-height: 520px) and (max-width: 1239px) {
  .util { display: none; }
  .site-header, .elementor-location-header { position: relative; top: 0; }
  .hdr > .wrap { min-height: 56px; }
  .logo span { display: none; }
  .hdr-cta .btn { min-height: 40px; }
  .hx-nav, .pnav { position: static; }
  .glance, .side-col, .faq-side, .cat-intro, .hx-intro { position: static; }

  .slide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none; min-height: 0; }
  .slide-media { order: 0; aspect-ratio: auto; min-height: 17rem; }
  .slide-copy { justify-content: center; padding: 1.25rem 1.5rem 3.75rem var(--g); }
  .slide-kicker { margin-bottom: 0.5rem; font-size: 0.6875rem; }
  .slider .slide-title { font-size: 1.5rem; margin-bottom: 1rem; }
  .slide-text { display: none; }
  .slide-copy .btns { flex-wrap: nowrap; }
  .slide-copy .btns .btn { flex: 1 1 auto; min-height: 42px; padding-inline: 0.75rem; font-size: 0.875rem; }
  .slider-nav { left: var(--g); right: auto; width: calc(50% - var(--g) - 4rem); bottom: 1.25rem; }
  .slider-tab { min-height: 20px; padding: 0; font-size: 0; }
  .slider-pause { right: -2.9rem; bottom: -0.5rem; width: 34px; height: 34px; }
  .slide-fact { max-width: 13rem; padding: 0.6rem 0.9rem; }
  .slide-fact b { font-size: 1.125rem; }

  .phd-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); align-items: start; }
  .phd-media { order: 0; margin: 0; }
  .phd-media img { aspect-ratio: 4 / 3; }
  .lb .spccu img, .spccu .lb img { max-height: calc(100dvh - 4rem); }
}
@media (orientation: landscape) and (max-height: 520px) and (max-width: 719px) {
  .mbar { display: none; }
  body.spccu-site { padding-bottom: 0; }
}