/* SAMinfo theme — block-level geometry + behavior layer.
   Design tokens live in theme.json (--wp--preset--color--*, font families).
   This file only adds what theme.json can't express:
   scroll carousel, releasing sidebar, dept badges, parallax ad,
   distinct captions, responsive/mobile, brand-guide palette refinements.

   Palette slugs: base / base-2 / base-3 · ink / ink-2 / ink-3 ·
   navy / navy-2 / navy-deep · gold / gold-2 · rule · tag-*.
*/

:root {
  --sam-navy: var(--wp--preset--color--navy);
  --sam-gold: var(--wp--preset--color--gold);
  --sam-rule: var(--wp--preset--color--rule);
}

/* Focus rings are contrast-aware: navy reads on the site's light surfaces;
   gold reads on the navy bars/footer; navy reads on the gold Subscribe pill.
   One system, always visible — never gold-on-gold or navy-on-navy. */
:focus-visible {
  outline: 2px solid var(--wp--preset--color--navy);
  outline-offset: 2px;
  border-radius: 2px;
}
.sam-utility-bar :focus-visible,
.sam-primary-nav :focus-visible,
.sam-site-footer :focus-visible,
.sam-modal-inner :focus-visible,
.sam-search-panel :focus-visible {
  outline-color: var(--wp--preset--color--gold);
}
.sam-utility-subscribe:focus-visible,
.sam-drawer-subscribe:focus-visible {
  outline-color: var(--wp--preset--color--navy);
}

/* ── Type-role guards ─────────────────────────────────────────────
   theme.json sets sans headlines / serif body. These keep the role
   intact even where a block omits an explicit family. */
.wp-block-post-title,
.wp-block-query .wp-block-post-title,
.wp-block-heading {
  font-family: "Overpass", -apple-system, system-ui, sans-serif;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}
.wp-block-post-content,
.wp-block-post-content p,
.wp-block-post-excerpt,
.wp-block-post-excerpt p {
  font-family: "Spectral", Georgia, serif;
}

/* ── Header: masthead + utility + actions ─────────────────────── */
.sam-header-region { position: relative; }
/* Content gutters — keep the navy/white bars full-bleed but inset their
   content to match the <main> gutters (constrained children center at
   1320px, so without this they sit flush to the viewport edges < 1320). */
.sam-utility-bar,
.sam-site-header,
.sam-primary-nav,
.sam-subnav {
  padding-left: clamp(1rem, 2vw, 2rem);
  padding-right: clamp(1rem, 2vw, 2rem);
}
.sam-header-bar .sam-logo { flex: 0 0 auto; }
.sam-header-bar .sam-logo img { display: block; }
.sam-masthead-tagline { flex: 1; text-align: center; margin: 0; }

/* Utility items (social + sign-in/newsletter/subscribe) now live in the white
   masthead's right cluster (utility bar collapsed in) — so they read navy. */
.sam-header-right .sam-utility-social { display: flex; gap: 0.55rem; align-items: center; }
.sam-header-right .sam-utility-social a { display: inline-flex; color: var(--wp--preset--color--navy); text-decoration: none; transition: color 140ms ease; }
.sam-header-right .sam-utility-social a:hover { color: var(--wp--preset--color--orange); }
.sam-util-link { color: var(--wp--preset--color--navy); text-decoration: none; cursor: pointer; font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; transition: color 140ms ease; }
.sam-util-link:hover { color: var(--wp--preset--color--orange); }
/* Subscribe = single top-nav CTA, as a gold pill */
.sam-utility-subscribe { color: var(--wp--preset--color--navy) !important; background: var(--wp--preset--color--gold); padding: 0.4rem 0.8rem; border-radius: 2px; text-decoration: none; font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.sam-utility-subscribe:hover { background: var(--wp--preset--color--gold-2); color: var(--wp--preset--color--navy) !important; }

/* Sticky masthead row (logo / search / menu) */
.sam-site-header { position: sticky; top: 0; z-index: 50; box-shadow: 0 2px 14px -10px rgba(20,16,63,0.55); }
/* The masthead is sticky, but its short wrappers (the template-part <header> and
   .sam-header-region, both ~166px) were constraining it so it scrolled away.
   display:contents removes those boxes → the masthead's containing block becomes
   the tall page and it sticks for the whole scroll (DOM/interactivity intact). */
header.wp-block-template-part:has(.sam-header-region),
.sam-header-region { display: contents; }

/* Account for the WordPress admin bar (logged-in users): it's fixed at the top
   (32px desktop / 46px ≤782px) and overlays our fixed/sticky chrome. Offset the
   sticky masthead, drawer, search panel, and modals so nothing hides beneath it. */
.admin-bar .sam-site-header { top: 32px; }
.admin-bar .sam-drawer-panel { top: 32px; height: calc(100% - 32px); }
.admin-bar .sam-search-panel { margin-top: 32px; }
.admin-bar .sam-modal { padding-top: calc(1rem + 32px); }
@media (max-width: 782px) {
  .admin-bar .sam-site-header { top: 46px; }
  .admin-bar .sam-drawer-panel { top: 46px; height: calc(100% - 46px); }
  .admin-bar .sam-search-panel { margin-top: 46px; }
  .admin-bar .sam-modal { padding-top: calc(1rem + 46px); }
}

.sam-header-right { display: flex; align-items: center; gap: 0.95rem; flex: 0 0 auto; }
/* subtle divider before the search button */
.sam-header-right .sam-search-trigger { margin-left: 0.15rem; }
.sam-subscribe-btn {
  display: inline-flex; align-items: center;
  background: var(--wp--preset--color--navy); color: #fff;
  padding: 0.7rem 1.1rem; border-radius: 2px; text-decoration: none;
  font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.6875rem;
  letter-spacing: 0.12em; text-transform: uppercase; transition: background 150ms ease, color 150ms ease;
}
.sam-subscribe-btn:hover { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
.sam-search-trigger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--wp--preset--color--base-2); border: 1px solid var(--wp--preset--color--rule);
  color: var(--wp--preset--color--navy); cursor: pointer; transition: background 150ms ease, color 150ms ease;
}
.sam-search-trigger:hover { background: var(--wp--preset--color--navy); color: #fff; border-color: var(--wp--preset--color--navy); }

/* ── Primary nav (navy bar) ───────────────────────────────────── */
/* Typography (font, size, tracking, caps) lives in theme.json →
   styles.blocks.core/navigation. Only structural geometry + interaction
   states are here — they can't be expressed in theme.json for the
   core/navigation block. */
.sam-primary-nav .wp-block-navigation a { text-decoration: none; }
.sam-primary-nav .wp-block-navigation-item__content {
  padding: 1rem 1.15rem;
  display: block;
  position: relative;
  /* gold underline grows from the baseline on hover/current — one signal */
  box-shadow: inset 0 -3px 0 0 transparent;
  transition: box-shadow 160ms ease, background-color 160ms ease, color 160ms ease;
}
.sam-primary-nav .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.sam-primary-nav .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content {
  /* Clear, unmistakable rollover (was 0.07 — editors had to squint): the cell
     lightens and the orange accent fills the baseline. */
  background: rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 -3px 0 0 var(--wp--preset--color--gold);
  color: #fff;
}
/* Persistent gold underline on the section the reader is currently in */
.sam-primary-nav .current-menu-item > .wp-block-navigation-item__content,
.sam-primary-nav .current-menu-ancestor > .wp-block-navigation-item__content,
.sam-primary-nav .wp-block-navigation-item__content[aria-current] {
  box-shadow: inset 0 -3px 0 0 var(--wp--preset--color--gold);
}
/* Parent-item chevron: snug to the label, dims by default, warms to gold and
   flips when its menu is open — a quiet "there's more here" cue. */
.sam-primary-nav .wp-block-navigation-submenu__toggle .wp-block-navigation__submenu-icon,
.sam-primary-nav .wp-block-navigation-item .wp-block-navigation__submenu-icon {
  margin-left: 0.1rem;
  color: rgba(255, 255, 255, 0.6);
  transition: transform 180ms ease, color 160ms ease;
}
.sam-primary-nav .wp-block-navigation-item:hover .wp-block-navigation__submenu-icon,
.sam-primary-nav .wp-block-navigation-item:focus-within .wp-block-navigation__submenu-icon {
  color: var(--wp--preset--color--gold);
  transform: rotate(180deg);
}

/* ── Sub-nav "beats" rail (header, raw HTML) ──────────────────── */
.sam-subnav-inner { display: flex; align-items: center; gap: 1.25rem; }
.sam-subnav-label { flex: 0 0 auto; border-right: 1px solid var(--wp--preset--color--rule); padding-right: 1.1rem; font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--navy); }
.sam-subnav-links { display: flex; gap: 1.25rem; overflow-x: auto; scrollbar-width: none; }
.sam-subnav-links::-webkit-scrollbar { display: none; }
.sam-subnav-links a { white-space: nowrap; text-decoration: none; color: var(--wp--preset--color--ink-2); font-family: "Overpass", sans-serif; font-size: 0.8125rem; font-weight: 600; }
.sam-subnav-links a:hover { color: var(--wp--preset--color--navy); }
.sam-subnav-hot { color: var(--wp--preset--color--ink) !important; font-weight: 700 !important; }
.sam-subnav-hot::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--wp--preset--color--gold); margin-right: 0.4rem; vertical-align: middle; }

/* ── Dept sub-beats (department template, block-based) ────────── */
/* Dept sub-beats: not sticky (the masthead is the sticky row) */
.sam-subbeats { position: static; }
.sam-subbeats-links a { text-decoration: none; color: var(--wp--preset--color--ink-2); }
.sam-subbeats-links a:hover { color: var(--wp--preset--color--navy); }
.sam-subbeats-active a { color: var(--wp--preset--color--navy); box-shadow: inset 0 -2px 0 0 var(--wp--preset--color--navy); }
.sam-subbeats-label { border-right: 1px solid var(--wp--preset--color--rule); padding-right: 1.1rem; margin: 0; }
.sam-subbeats-links { overflow-x: auto; scrollbar-width: none; }
.sam-subbeats-links::-webkit-scrollbar { display: none; }

/* ── Search overlay (Interactivity API) ───────────────────────── */
.sam-search-overlay { position: fixed; inset: 0; z-index: 1000; display: none; }
.sam-search-overlay.is-open { display: block; }
.sam-search-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; cursor: pointer; background: rgba(20,16,63,0.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.sam-search-panel { position: relative; background: var(--wp--preset--color--base); border-bottom: 4px solid var(--wp--preset--color--gold); max-height: 100vh; overflow-y: auto; animation: sam-slide-down 220ms cubic-bezier(.2,.6,.2,1); }
@keyframes sam-slide-down { from { transform: translateY(-12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.sam-search-panel .inner { max-width: 1320px; margin: 0 auto; padding: 2.25rem 2rem; }
.sam-search-form { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; padding-bottom: 1.25rem; border-bottom: 1px solid var(--wp--preset--color--rule); }
.sam-search-form .prefix { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--wp--preset--color--navy); padding: 0 0.5rem; }
.sam-search-form input { border: 0; padding: 0.75rem 0; font-family: "Overpass", sans-serif; font-size: 1.75rem; font-weight: 700; outline: 0; background: transparent; color: var(--wp--preset--color--ink); width: 100%; }
.sam-search-form input::placeholder { color: var(--wp--preset--color--ink-3); font-weight: 500; }
.sam-search-form .close { width: 40px; height: 40px; border: 1px solid var(--wp--preset--color--rule); background: transparent; cursor: pointer; font-size: 1.4rem; line-height: 1; color: var(--wp--preset--color--ink-2); border-radius: 50%; }
.sam-search-form .close:hover { background: var(--wp--preset--color--ink); color: #fff; border-color: var(--wp--preset--color--ink); }
.sam-search-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; padding: 1.1rem 0; border-bottom: 1px solid var(--wp--preset--color--rule); }
.sam-search-filters .filter-chip { padding: 0.5rem 0.9rem; border: 1px solid var(--wp--preset--color--rule); font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--ink-2); border-radius: 2px; }
.sam-search-filters .filter-chip.active { background: var(--wp--preset--color--navy); color: #fff; border-color: var(--wp--preset--color--navy); }
.sam-search-body { display: grid; grid-template-columns: repeat(3,1fr); gap: 2.25rem; padding-top: 1.5rem; }
.sam-search-col h4 { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.6875rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--navy); margin: 0 0 0.85rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--wp--preset--color--navy); }
.sam-search-col ul { list-style: none; padding: 0; margin: 0; }
.sam-search-col li { padding: 0.6rem 0; border-bottom: 1px solid var(--wp--preset--color--rule); }
.sam-search-col a { display: block; color: var(--wp--preset--color--ink); font-size: 0.9375rem; line-height: 1.4; text-decoration: none; }
.sam-search-col a:hover { color: var(--wp--preset--color--navy); }
.sam-search-col .meta { display: block; font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.625rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--ink-3); margin-top: 0.25rem; }

/* ── Modals: subscribe + login (Interactivity API) ────────────── */
.sam-modal { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; padding: 1rem; }
.sam-modal.is-open { display: flex; }
.sam-modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; cursor: pointer; background: rgba(20,16,63,0.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.sam-modal-inner { position: relative; z-index: 1; background: var(--wp--preset--color--base); border-radius: 2px; box-shadow: 0 24px 60px -16px rgba(20,16,63,0.45); max-width: 460px; width: 100%; padding: 2.5rem; }
.sam-modal-close { position: absolute; top: 0.85rem; right: 0.85rem; width: 36px; height: 36px; border: 0; background: transparent; cursor: pointer; font-size: 1.5rem; line-height: 1; color: var(--wp--preset--color--ink-3); border-radius: 50%; }
.sam-modal-close:hover { background: var(--wp--preset--color--base-2); color: var(--wp--preset--color--ink); }
.sam-modal-eyebrow { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.6875rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--wp--preset--color--navy); margin-bottom: 0.85rem; }
.sam-modal-inner h2 { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 1.875rem; line-height: 1.05; letter-spacing: -0.018em; margin: 0 0 0.6rem; color: var(--wp--preset--color--ink); }
.sam-modal-inner > p { color: var(--wp--preset--color--ink-2); font-size: 0.9375rem; line-height: 1.5; margin: 0 0 1.25rem; }
.sam-modal-btn { display: flex; justify-content: center; padding: 0.9rem; background: var(--wp--preset--color--navy); color: #fff; text-decoration: none; font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; border-radius: 2px; }
.sam-modal-btn:hover { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
.sam-modal-formrow { display: flex; gap: 0.5rem; margin-top: 0.25rem; }
.sam-modal-formrow input { flex: 1 1 auto; min-width: 0; padding: 0.75rem 0.85rem; border: 1px solid var(--wp--preset--color--rule); border-radius: 2px; font-family: "Overpass", sans-serif; font-size: 0.9375rem; }
.sam-modal-formrow input:focus { outline: 2px solid var(--wp--preset--color--navy); outline-offset: -2px; }
.sam-modal-formrow .sam-modal-btn { flex: 0 0 auto; padding: 0.75rem 1.1rem; }
.sam-plans { display: grid; gap: 0.5rem; margin-bottom: 1rem; }
.sam-plan { display: flex; padding: 0.85rem 1rem; border: 1px solid var(--wp--preset--color--rule); justify-content: space-between; align-items: baseline; gap: 0.75rem; font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.875rem; color: var(--wp--preset--color--ink); border-radius: 2px; text-decoration: none; }
.sam-plan:hover { border-color: var(--wp--preset--color--navy); }
.sam-plan.featured { border-color: var(--wp--preset--color--gold); background: color-mix(in oklab, var(--wp--preset--color--gold) 8%, var(--wp--preset--color--base)); }
.sam-plan .price { font-weight: 900; }
.sam-plan .term { font-size: 0.6875rem; color: var(--wp--preset--color--ink-3); letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; }
.sam-modal-foot { padding-top: 1rem; margin-top: 1rem; border-top: 1px solid var(--wp--preset--color--rule); text-align: center; font-size: 0.8125rem; color: var(--wp--preset--color--ink-3); }
.sam-modal-foot a { color: var(--wp--preset--color--navy); font-weight: 700; text-decoration: none; cursor: pointer; }

/* ── Header bands flush (no block-gap between utility/masthead/nav/beats) ── */
.sam-header-region > * { margin-top: 0 !important; margin-bottom: 0 !important; }

/* ── Masthead menu toggle (mobile only) ───────────────────────── */
.sam-nav-toggle { display: none; align-items: center; gap: 0.5rem; background: transparent; border: 0; cursor: pointer; color: var(--wp--preset--color--navy); font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; padding: 0; }
.sam-nav-toggle-bars { width: 20px; height: 14px; position: relative; display: inline-block; }
.sam-nav-toggle-bars span { position: absolute; left: 0; right: 0; height: 2px; background: currentColor; border-radius: 2px; }
.sam-nav-toggle-bars span:nth-child(1) { top: 0; }
.sam-nav-toggle-bars span:nth-child(2) { top: 6px; }
.sam-nav-toggle-bars span:nth-child(3) { top: 12px; }

/* ── Mobile drawer (Interactivity API) ────────────────────────── */
.sam-drawer { position: fixed; inset: 0; z-index: 1000; display: none; }
.sam-drawer.is-open { display: block; }
.sam-drawer-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; cursor: pointer; background: rgba(20,16,63,0.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.sam-drawer-panel { position: absolute; top: 0; right: 0; height: 100%; width: min(360px, 88vw); background: var(--wp--preset--color--base); overflow-y: auto; padding: 1.25rem 1.5rem 2rem; box-shadow: -12px 0 40px -16px rgba(20,16,63,0.5); display: flex; flex-direction: column; gap: 1.25rem; animation: sam-slide-in 220ms cubic-bezier(.2,.6,.2,1); }
@keyframes sam-slide-in { from { transform: translateX(24px); opacity: 0.4; } to { transform: translateX(0); opacity: 1; } }
.sam-drawer-head { display: flex; justify-content: space-between; align-items: center; }
.sam-drawer-title { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--navy); }
.sam-drawer-close { width: 36px; height: 36px; border: 0; background: transparent; cursor: pointer; font-size: 1.6rem; line-height: 1; color: var(--wp--preset--color--ink-3); border-radius: 50%; }
.sam-drawer-close:hover { background: var(--wp--preset--color--base-2); color: var(--wp--preset--color--ink); }
/* drawer nav = the WP/Ollie menu (ref 4) rendered vertically */
.sam-drawer-nav ul { list-style: none; margin: 0; padding: 0; gap: 0 !important; }
.sam-drawer-nav .wp-block-navigation-item { width: 100%; }
.sam-drawer-nav .wp-block-navigation-item__content { display: block; padding: 0.9rem 0; border-bottom: 1px solid var(--wp--preset--color--rule); color: var(--wp--preset--color--ink); text-decoration: none; }
.sam-drawer-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--navy); }
.sam-drawer-issue { padding-top: 0.5rem; }
.sam-drawer-issue a { text-decoration: none; }
.sam-drawer-cta { display: grid; gap: 0.6rem; margin-top: auto; }
.sam-drawer-subscribe { display: block; text-align: center; padding: 0.9rem; background: var(--wp--preset--color--navy); color: #fff; font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; border-radius: 2px; text-decoration: none; }
.sam-drawer-subscribe:hover { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
.sam-drawer-signin { text-align: center; font-family: "Overpass", sans-serif; font-size: 0.8125rem; color: var(--wp--preset--color--ink-3); text-decoration: none; }
.sam-drawer-signin:hover { color: var(--wp--preset--color--navy); }
/* Drawer submenu (e.g. Mountain Departments) — always-open inline list,
   never a right-side flyout box. Override every core positioning prop. */
.sam-drawer-nav .wp-block-navigation-item__content { font-family: "Overpass", sans-serif; }
/* Collapsible accordion submenus: the has-child item stacks (label row with a
   caret; submenu drops full-width INLINE below when tapped — not a flyout).
   Core toggles open/closed via openSubmenusOnClick; we only fix positioning. */
.sam-drawer-nav .wp-block-navigation-item.has-child { display: block !important; width: 100%; }
.sam-drawer-nav .wp-block-navigation__submenu-container {
  position: static !important;
  transform: none !important; left: auto !important; right: auto !important; top: auto !important;
  width: 100% !important; min-width: 0 !important;
  border: 0 !important; box-shadow: none !important; background: transparent !important;
  padding: 0 !important; margin: 0 !important;
}
.sam-drawer-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 0.6rem 0; font-size: 0.875rem; font-weight: 600;
  color: var(--wp--preset--color--ink-2);
}
.sam-drawer-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--navy); }
/* Parent label row: full-width with the caret pushed to the right edge */
.sam-drawer-nav .wp-block-navigation-item.has-child > .wp-block-navigation-submenu__toggle,
.sam-drawer-nav .wp-block-navigation-item.has-child > .wp-block-navigation-item__content { display: flex; justify-content: space-between; align-items: center; width: 100%; padding-left: 0; padding-right: 0; }
.sam-drawer-nav .wp-block-navigation__submenu-icon { color: var(--wp--preset--color--ink-3); margin-left: auto; }
/* Drawer issue thumbnail — small fixed size, never upscaled (avoids pixelation) */
.sam-drawer-issue-row { align-items: flex-start; }
.sam-drawer-issue-row > .wp-block-post-featured-image { flex: 0 0 112px; width: 112px; }
.sam-drawer-issue-row .wp-block-post-featured-image img { width: 100%; height: auto; border-radius: 2px; display: block; }

/* ── Footer link contrast (was dark navy on navy — failed WCAG) ── */
.sam-site-footer a { color: #cfd2e6; }
.sam-site-footer a:hover { color: var(--wp--preset--color--gold); }
.sam-site-footer .sam-footer-head { color: #ffffff; }
/* Footer content gutters (was flush to container edges) */
.sam-site-footer { padding-left: clamp(1rem, 2vw, 2rem); padding-right: clamp(1rem, 2vw, 2rem); }
.sam-site-credit { color: #9aa0c4; }
.sam-site-credit a { color: #cfd2e6; font-weight: 700; }
.sam-site-credit a:hover { color: var(--wp--preset--color--gold); }

/* Social icons (utility bar) */
.sam-utility-social a { display: inline-flex; align-items: center; line-height: 0; }
.sam-utility-social svg { display: block; }

/* ── Desktop primary-nav dropdowns ────────────────────────────── */
.sam-primary-nav .wp-block-navigation__submenu-container {
  background: #ffffff;
  border: 1px solid var(--wp--preset--color--rule);
  border-top: 2px solid var(--wp--preset--color--gold);
  box-shadow: 0 22px 48px -26px rgba(20, 16, 63, 0.5);
  padding: 0.4rem 0;
  min-width: 248px;
  border-radius: 0 0 4px 4px;
  margin-top: 0;
  /* Core toggles opacity/visibility on hover/focus-within; we add the rise. */
  transform: translateY(8px);
  transition: opacity 180ms cubic-bezier(.2,.7,.2,1), transform 180ms cubic-bezier(.2,.7,.2,1);
}
.sam-primary-nav .wp-block-navigation-item:hover > .wp-block-navigation__submenu-container,
.sam-primary-nav .wp-block-navigation-item:focus-within > .wp-block-navigation__submenu-container,
.sam-primary-nav .wp-block-navigation__submenu-container.is-open {
  transform: translateY(0);
}
.sam-primary-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 0.55rem 1.4rem;
  color: var(--wp--preset--color--ink);
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.875rem;
  box-shadow: none;
  transition: background-color 140ms ease, color 140ms ease, padding-left 140ms ease;
}
.sam-primary-nav .wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.sam-primary-nav .wp-block-navigation__submenu-container .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content {
  background: var(--wp--preset--color--base-2);
  color: var(--wp--preset--color--navy);
  padding-left: 1.65rem; /* subtle nudge toward the reader */
  box-shadow: none;
}
@media (prefers-reduced-motion: reduce) {
  .sam-primary-nav .wp-block-navigation__submenu-container { transform: none; transition: opacity 120ms ease; }
  .sam-primary-nav .wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content { padding-left: 1.4rem; }
}

/* ── Headline News cards — tighter padding (was too loose) ────── */
.sam-headlines-track .sam-headline-card > .wp-block-group { padding: 0.75rem 0.85rem 0.9rem !important; }
.sam-headlines-track .sam-headline-card > .wp-block-group { row-gap: 0.35rem; }
.sam-headlines-track .sam-headline-signup { padding: 1.25rem 1.1rem !important; }

/* ── SAM Picks sidebar — v2 side-cards (light card, image beside text) ── */
.sam-pick-item {
  background: var(--wp--preset--color--base-2) !important;
  border-bottom: 0 !important; border-radius: 2px;
  padding: 0.85rem 1rem !important; margin-bottom: 0.6rem;
  transition: background 150ms ease;
}
.sam-pick-item:hover { background: var(--wp--preset--color--base-3) !important; }
/* Flex row (not wp:columns — avoids core's mobile stacking): text + 72px thumb */
.sam-pick-row { align-items: center; }
.sam-pick-text { flex: 1 1 auto; min-width: 0; }
.sam-pick-text .wp-block-post-title a { text-decoration: none; }
.sam-pick-thumb { flex: 0 0 72px; margin: 0; }
.sam-pick-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 2px; display: block; }
.sam-pick-thumb:not(:has(img)) { display: none; }
.sam-cat-tag { margin-bottom: 0.4rem; }

/* ════════════════════════════════════════════════════════════════
   REFINEMENT PASS — colored tags, drawer carets, cards, magazine, footer
   ════════════════════════════════════════════════════════════════ */

/* ── Color-coded category tags as soft tinted PILLS (v2 style) ──
   filter adds .sam-term--{slug}; default is a navy pill, topic groups
   override with their tag color + a 12% tint background. */
.sam-term {
  display: inline-block; padding: 0.25rem 0.55rem; border-radius: 3px;
  font-weight: 800; line-height: 1.15;
  color: var(--wp--preset--color--navy) !important;
  background: color-mix(in oklab, var(--wp--preset--color--navy) 10%, #ffffff) !important;
}
.sam-term:hover { filter: brightness(0.97); }
.sam-term--technology, .sam-term--lift-operations, .sam-term--lifts-ropeways, .sam-term--rfid {
  color: var(--wp--preset--color--tag-tech) !important;
  background: color-mix(in oklab, var(--wp--preset--color--tag-tech) 12%, #ffffff) !important;
}
.sam-term--snowmaking, .sam-term--grooming, .sam-term--mountain-ops, .sam-term--summer-operations, .sam-term--summer-ops, .sam-term--environmental-sustainability, .sam-term--i-am-a-snowmaker {
  color: var(--wp--preset--color--tag-ops) !important;
  background: color-mix(in oklab, var(--wp--preset--color--tag-ops) 12%, #ffffff) !important;
}
.sam-term--marketing, .sam-term--best-worst-in-marketing, .sam-term--classified, .sam-term--classifieds {
  color: var(--wp--preset--color--tag-biz) !important;
  background: color-mix(in oklab, var(--wp--preset--color--tag-biz) 12%, #ffffff) !important;
}
.sam-term--faces-and-places, .sam-term--leadership-development, .sam-term--10-under-30, .sam-term--people {
  color: var(--wp--preset--color--tag-people) !important;
  background: color-mix(in oklab, var(--wp--preset--color--tag-people) 12%, #ffffff) !important;
}

/* ── Drawer submenu rows: parent <li> is a flex row so the label link and
   the caret toggle sit on ONE line; the submenu <ul> wraps full-width below.
   (Core renders label <a> + caret <button> + submenu <ul> as li children.) ── */
.sam-drawer-nav .wp-block-navigation-item.has-child {
  display: flex !important; flex-wrap: wrap; align-items: center;
  border-bottom: 1px solid var(--wp--preset--color--rule);
}
.sam-drawer-nav .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
  flex: 1 1 auto !important; width: auto !important; border-bottom: 0 !important;
  justify-content: flex-start !important;
}
.sam-drawer-nav .wp-block-navigation-item.has-child > .wp-block-navigation-submenu__toggle {
  flex: 0 0 auto !important; width: auto !important; display: flex !important; align-items: center;
  background: transparent; border: 0; cursor: pointer; padding: 0.9rem 0 0.9rem 0.6rem; margin: 0;
  color: var(--wp--preset--color--ink-3);
}
.sam-drawer-nav .wp-block-navigation__submenu-icon { display: flex !important; align-items: center; margin: 0 !important; }
.sam-drawer-nav .wp-block-navigation__submenu-icon svg { width: 13px; height: 13px; transition: transform 160ms ease; }
.sam-drawer-nav .wp-block-navigation-submenu__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sam-drawer-nav .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container { flex: 1 1 100% !important; }
/* Simple (no-submenu) items full-width too, so every divider spans the row */
.sam-drawer-nav .wp-block-navigation-item:not(.has-child) { width: 100%; }
.sam-drawer-nav .wp-block-navigation-item:not(.has-child) > .wp-block-navigation-item__content { display: block; width: 100%; }
.sam-drawer-nav .wp-block-navigation__container { width: 100%; }

/* ── SAM Picks row spacing handled in the SAM Picks side-card block above ── */

/* ── Classifieds featured card: handle no image gracefully ────── */
/* Don't stretch the featured card to match the taller job list */
.sam-classifieds > .wp-block-columns { align-items: flex-start; }
.sam-featured-job .wp-block-columns { align-items: flex-start; margin-bottom: 0; }
.sam-featured-job:not(:has(.wp-block-post-featured-image img)) .wp-block-column:first-child { display: none; }
.sam-featured-job:not(:has(.wp-block-post-featured-image img)) .wp-block-column:last-child > .wp-block-group { padding: 1.4rem 1.5rem !important; }
.sam-class-row:last-child { border-bottom: 0 !important; }

/* ── From the Magazine: clean cover (no giant navy letterbox) ─── */
.sam-magazine .wp-block-post-featured-image {
  background: var(--wp--preset--color--base-2) !important;
  padding: 0.75rem !important; display: flex; justify-content: center; align-items: center;
  aspect-ratio: auto !important; border: 1px solid var(--wp--preset--color--rule);
  max-width: 260px; margin-left: auto; margin-right: auto;
}
.sam-magazine .wp-block-post-featured-image img {
  aspect-ratio: auto !important; width: auto !important; max-width: 100%;
  max-height: 300px; object-fit: contain; box-shadow: 0 6px 18px -10px rgba(20,16,63,0.4);
}
/* WP's columnCount grid is a FIXED 5 columns — on phones it collapsed to one
   narrow, centred, boxed cover that looked sparse/odd. Give it an explicit
   responsive grid and let covers fill their cells on smaller screens. */
.sam-magazine .wp-block-post-template { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 1.25rem !important; }
@media (max-width: 980px) { .sam-magazine .wp-block-post-template { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 600px) {
  .sam-magazine .wp-block-post-template { grid-template-columns: repeat(2, 1fr) !important; }
  .sam-magazine .wp-block-post-featured-image { max-width: none !important; padding: 0.5rem !important; }
  .sam-magazine .wp-block-post-featured-image img { max-height: none !important; }
}

/* ── Footer link lists: no bullets ────────────────────────────── */
.sam-site-footer .wp-block-list { list-style: none; padding-left: 0; margin-left: 0; }
.sam-site-footer .wp-block-list li { margin-left: 0; }

/* ── Section labels ───────────────────────────────────────────── */
.sam-section-label .wp-block-heading { margin: 0; }
.sam-section-label a { text-decoration: none; }
.sam-section-label a:hover { color: var(--wp--preset--color--gold-2); }

/* ── Byline separators ────────────────────────────────────────── */
.sam-byline .wp-block-post-date::before,
.sam-cover-card .wp-block-post-date::before {
  content: "·";
  margin: 0 0.45rem;
  color: var(--wp--preset--color--ink-3);
}

/* ── Story / card hover lift ──────────────────────────────────── */
.sam-headline-card,
.sam-cal-item,
.sam-tool-card,
.sam-magazine-item,
.sam-featured-job {
  transition: background-color 160ms ease, border-color 160ms ease;
}
/* One consistent hover signal site-wide: the card DARKENS (no move up/down). */
.sam-headline-card:hover,
.sam-cal-item:hover,
.sam-tool-card:hover,
.sam-featured-job:hover {
  background-color: var(--wp--preset--color--base-2);
  border-color: var(--wp--preset--color--navy);
}
.sam-headline-card:hover :is(.wp-block-post-featured-image, figure) img,
.sam-featured-job:hover img,
.sam-dept-card:hover img,
.sam-magazine-item:hover img { filter: brightness(0.93); }
.sam-headline-card :is(.wp-block-post-featured-image, figure) img,
.sam-featured-job img, .sam-dept-card img, .sam-magazine-item img { transition: filter 160ms ease; }
.wp-block-post-featured-image { overflow: hidden; }
/* Image hover = darken only (no scale/zoom) — one consistent motion site-wide. */
.sam-featured-lead:hover .wp-block-post-featured-image img { filter: brightness(0.93); }

/* ── HEADLINE NEWS — horizontal scroll-snap carousel ──────────────
   Two queries + a signup card share one flex track via display:contents
   so the lead-gen card lands at slot 4 (New Yorker "Lede" pattern). */
.sam-headlines-track {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 1rem;
  scrollbar-width: thin;
}
.sam-headlines-track::-webkit-scrollbar { height: 6px; }
.sam-headlines-track::-webkit-scrollbar-thumb { background: var(--wp--preset--color--rule); border-radius: 3px; }
.sam-headlines-track > .wp-block-query,
.sam-headlines-track .wp-block-post-template,
.sam-headlines-track .wp-block-post-template > li { display: contents; }
.sam-headlines-track .sam-headline-card,
.sam-headlines-track .sam-headline-signup {
  flex: 0 0 auto;
  width: clamp(260px, 26vw, 320px);
  scroll-snap-align: start;
}
.sam-headline-card { display: flex; flex-direction: column; }
.sam-headline-card a { text-decoration: none; }
.sam-headline-signup { display: flex; flex-direction: column; justify-content: center; }
.sam-headline-signup a { text-decoration: none; }

/* Headline-News horizontal-scroll affordance: arrow buttons only (the edge
   fade read too heavy over the navy signup card). Classes (at-start / at-end /
   no-overflow) are toggled from scroll position by callbacks.headlinesInit so
   the "more" arrow shows only while there's more to reveal. */
.sam-headlines-scroller { position: relative; }

.sam-hl-arrow {
  position: absolute; top: calc((100% - 1rem) / 2); transform: translateY(-50%); z-index: 3;
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--wp--preset--color--rule);
  background: var(--wp--preset--color--base); color: var(--wp--preset--color--navy);
  font-size: 1.6rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px -4px rgba(3,0,77,0.28);
  transition: background 140ms ease, color 140ms ease, opacity 160ms ease, transform 140ms ease;
}
.sam-hl-arrow:hover { background: var(--wp--preset--color--navy); color: #fff; }
.sam-hl-prev { left: 10px; opacity: 0; pointer-events: none; }
.sam-hl-next { right: 10px; }
.sam-headlines-scroller:not(.at-start) .sam-hl-prev { opacity: 1; pointer-events: auto; }
.sam-headlines-scroller.at-end .sam-hl-next { opacity: 0; pointer-events: none; }
.sam-headlines-scroller.no-overflow .sam-hl-arrow { opacity: 0; pointer-events: none; }
@media (hover: none) { .sam-hl-arrow { display: none; } } /* touch: native swipe + fades suffice */

/* Signup + CTA forms */
.sam-signup-form { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0; }
.sam-signup-form input {
  flex: 1 1 140px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.32);
  color: #fff;
  padding: 0.7rem 0.8rem;
  border-radius: 2px;
  font-family: "Overpass", sans-serif;
  font-size: 0.875rem;
}
.sam-signup-form input::placeholder { color: rgba(255,255,255,0.65); }
.sam-signup-form button,
.sam-cta-form button {
  background: var(--wp--preset--color--gold);
  color: var(--wp--preset--color--navy);
  border: 0;
  padding: 0.7rem 1.1rem;
  border-radius: 2px;
  font-family: "Overpass", sans-serif;
  font-weight: 800;
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 150ms ease;
}
.sam-signup-form button:hover,
.sam-cta-form button:hover { background: var(--wp--preset--color--gold-2); }
.sam-cta-form { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0; }
.sam-cta-form input {
  flex: 1 1 200px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.32);
  color: #fff;
  padding: 0.95rem 1rem;
  border-radius: 2px;
  font-family: "Overpass", sans-serif;
  font-size: 1rem;
}
.sam-cta-form input::placeholder { color: rgba(255,255,255,0.65); }

/* ── THE LATEST — feed rows + sidebar ─────────────────────────── */
.sam-feed-row:first-child { padding-top: 0 !important; }
.sam-latest-feed a,
.sam-popular a,
.sam-class-list a { text-decoration: none; }
.sam-popular-row:last-child { border-bottom: 0 !important; }

/* ── EVENTS — full-width color-coded calendar (Award/Contest/Event) ──── */
.sam-eventcal-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; padding-bottom: 0.75rem; border-bottom: 2px solid var(--wp--preset--color--navy); }
.sam-eventcal-title { font-family: "Overpass", sans-serif; font-size: 2rem; font-weight: 800; letter-spacing: -0.018em; color: var(--wp--preset--color--navy); margin: 0; }
.sam-eventcal-legend { display: flex; gap: 1.1rem; font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--ink-2); }
.sam-eventcal-legend .lg { display: inline-flex; align-items: center; gap: 0.4rem; }
.sam-eventcal-legend .lg::before { content: ""; width: 9px; height: 9px; border-radius: 2px; }
.lg-award::before   { background: var(--wp--preset--color--orange); }
.lg-contest::before { background: #2563EB; }
.lg-event::before   { background: var(--wp--preset--color--accent-green, #2EC27E); }

.sam-eventcal { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; background: #fff; border: 1px solid var(--wp--preset--color--rule); border-radius: 2px; overflow: hidden; }
.sam-eventcal .cal-card { position: relative; display: grid; grid-template-rows: auto auto auto 1fr auto; gap: 0.4rem; padding: 1.5rem 1.2rem 1.25rem; border-right: 1px solid var(--wp--preset--color--rule); text-decoration: none; transition: background 160ms ease; }
.sam-eventcal .cal-card:last-child { border-right: 0; }
.sam-eventcal .cal-card:hover { background: var(--wp--preset--color--base-2); }
.sam-eventcal .cal-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.cal-card.type-award::before   { background: var(--wp--preset--color--orange); }
.cal-card.type-contest::before { background: #2563EB; }
.cal-card.type-event::before   { background: var(--wp--preset--color--accent-green, #2EC27E); }
.sam-eventcal .cal-date { display: flex; align-items: baseline; gap: 0.4rem; }
.sam-eventcal .cal-date .mo { font-family: "Overpass", sans-serif; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--ink-2); }
.sam-eventcal .cal-date .dy { font-family: "Overpass", sans-serif; font-size: 2rem; font-weight: 800; line-height: 1; letter-spacing: -0.02em; color: var(--wp--preset--color--navy); }
.sam-eventcal .cal-type { font-family: "Overpass", sans-serif; font-size: 0.625rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.cal-card.type-award .cal-type   { color: var(--wp--preset--color--orange); }
.cal-card.type-contest .cal-type { color: #1d4ed8; }
.cal-card.type-event .cal-type   { color: #1f9d63; }
.sam-eventcal .cal-title { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 1.0625rem; line-height: 1.15; letter-spacing: -0.01em; color: var(--wp--preset--color--navy); }
.sam-eventcal .cal-dek { font-family: "Spectral", Georgia, serif; font-size: 0.8125rem; line-height: 1.4; color: var(--wp--preset--color--ink-2); }
.sam-eventcal .cal-cta { justify-self: start; margin-top: 0.3rem; font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--navy); border-bottom: 2px solid var(--wp--preset--color--orange); padding-bottom: 2px; }
.sam-eventcal-foot { margin-top: 1rem; text-align: right; }
.sam-eventcal-foot a { font-family: "Overpass", sans-serif; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--navy); text-decoration: none; }
@media (max-width: 1100px) { .sam-eventcal { grid-template-columns: repeat(3, 1fr); } .sam-eventcal .cal-card:nth-child(3n) { border-right: 0; } }
@media (max-width: 720px)  { .sam-eventcal { grid-template-columns: repeat(2, 1fr); } .sam-eventcal .cal-card:nth-child(3n) { border-right: 1px solid var(--wp--preset--color--rule); } .sam-eventcal .cal-card:nth-child(2n) { border-right: 0; } }
@media (max-width: 520px)  { .sam-eventcal { grid-template-columns: 1fr; } .sam-eventcal .cal-card { border-right: 0; border-bottom: 1px solid var(--wp--preset--color--rule); } }

/* ── INITIATIVES — navy lead + calendar list (legacy) ─────────── */
.sam-init-lead { display: flex; flex-direction: column; height: 100%; }
.sam-init-lead a { text-decoration: none; }
.sam-cal-item a { text-decoration: none; }
/* No side-stripe: the gold accent lives in the category eyebrow (gold-2)
   and the hover state. The card keeps its full 1px rule border. */

/* ── MOUNTAIN DEPARTMENTS — photo cards (scaled middle-ground) ─── */
/* Dynamic saminfo/dept-card block: each card's photo is the latest
   article image for that department; editorial chrome overlays it. */
.sam-dept-grid { gap: 1rem; }
.sam-dept-cover {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 232px;
  border-radius: 3px;
  overflow: hidden;
  isolation: isolate;
  text-decoration: none;
  background: var(--wp--preset--color--navy-2, #1B2A8A);
}
/* Odd-count closer: the 7th department spans the full grid row */
.sam-dept-cover--wide { grid-column: 1 / -1; min-height: 200px; }
.sam-dept-cover--wide .sam-dept-cover__dek { max-width: 52ch; }
.sam-dept-cover__img {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover;
  background-position: center;
  /* lift the photo a touch so it reads through the scrim */
  filter: brightness(1.04) saturate(1.06);
  transition: filter 300ms ease, transform 600ms cubic-bezier(.2,.6,.2,1);
}
/* Lighter scrim: a localized bottom gradient (only where text sits) plus a
   faint full-card navy tint for brand cohesion — keeps the dark feel while
   letting the upper ~55% of the photo show clearly. */
.sam-dept-cover__shade {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to top,
      rgba(2,0,51,0.88) 0%, rgba(2,0,51,0.55) 26%, rgba(2,0,51,0.12) 52%, rgba(2,0,51,0) 72%),
    linear-gradient(rgba(3,0,77,0.14), rgba(3,0,77,0.14));
}
.sam-dept-cover.is-imageless .sam-dept-cover__shade {
  background: linear-gradient(155deg,
    var(--wp--preset--color--navy-2, #1B2A8A), var(--wp--preset--color--navy, #03004D));
}
.sam-dept-cover__meta {
  position: relative; z-index: 2;
  width: 100%;
  padding: 1.15rem 1.25rem 1.3rem;
}
.sam-dept-cover__num {
  display: block;
  font-family: "Overpass", sans-serif;
  font-weight: 800;
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--orange, #FA4500);
  margin-bottom: 0.4rem;
}
.sam-dept-cover__title {
  display: block;
  font-family: "Overpass", sans-serif;
  font-weight: 800;
  font-size: 1.3125rem;
  line-height: 1.08;
  letter-spacing: -0.015em;
  color: #fff;
  margin-bottom: 0.4rem;
  text-shadow: 0 1px 14px rgba(2,0,51,0.6);
}
.sam-dept-cover__dek {
  display: block;
  font-family: "Spectral", Georgia, serif;
  font-size: 0.875rem;
  line-height: 1.4;
  color: rgba(255,255,255,0.9);
  max-width: 34ch;
  text-shadow: 0 1px 10px rgba(2,0,51,0.55);
}
.sam-dept-cover__more {
  display: inline-block;
  margin-top: 0.7rem;
  font-family: "Overpass", sans-serif;
  font-weight: 700;
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  padding-bottom: 2px;
  border-bottom: 2px solid var(--wp--preset--color--orange, #FA4500);
}
/* Unified hover: darken only, no movement (site-wide motion rule) */
.sam-dept-cover:hover .sam-dept-cover__img { filter: brightness(0.8); }
.sam-dept-cover:focus-visible {
  outline: 3px solid var(--wp--preset--color--orange, #FA4500);
  outline-offset: 2px;
}

/* ── CLASSIFIEDS ──────────────────────────────────────────────── */
.sam-featured-job { overflow: hidden; }
.sam-class-row:last-child { border-bottom: 0 !important; }
.sam-feat-label { display: inline-block; border-radius: 2px; align-self: flex-start; }

/* Featured listing cards — saminfo/classified-feature block (typed) */
.sam-class-stack { display: flex; flex-direction: column; gap: 1rem; }
.sam-class-feature { display: flex; flex-wrap: nowrap; align-items: stretch; border-radius: 2px; overflow: hidden; }
.sam-class-feature__thumb { flex: 0 0 110px; width: 110px; display: block; line-height: 0; background: var(--wp--preset--color--base-2); }
.sam-class-feature__img { width: 110px; height: 110px; object-fit: cover; display: block; transition: filter 160ms ease; }
.sam-class-feature__body { padding: 0.9rem 1rem; display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.sam-class-feature__body .sam-feat-label { margin: 0 0 0.1rem; }
.sam-class-feature__title { margin: 0; font-family: "Overpass", sans-serif; font-weight: 700; font-size: 1rem; line-height: 1.2; }
.sam-class-feature__title a { color: var(--wp--preset--color--ink); text-decoration: none; }
.sam-class-feature__title a:hover { color: var(--wp--preset--color--orange); }
.sam-class-feature__date { font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--ink-2); }
.sam-class-feature:hover .sam-class-feature__img { filter: brightness(0.93); }

/* Layout A — navy featured anchor + uniform text-card grid (more placements).
   Classified listings have no images in the data, so these are clean text cards
   with a listing-type chip rather than empty image boxes. */
/* Featured listing = image cover card (curated photo + listing overlaid) */
.sam-class-feat.wp-block-cover { height: 100%; border-radius: 2px; overflow: hidden; }
.sam-class-feat .wp-block-cover__image-background { transition: transform 600ms cubic-bezier(.2,.6,.2,1), filter 300ms ease; }
.sam-class-feat:hover .wp-block-cover__image-background { transform: scale(1.04); filter: brightness(1.04); }
.sam-class-feat .sam-feat-label { display: inline-block; align-self: flex-start; border-radius: 2px; }
.sam-class-feat .wp-block-post-title { margin: 0; }
.sam-class-feat .wp-block-post-title a { color: #fff; text-decoration: none; }
.sam-class-feat .wp-block-query, .sam-class-feat .wp-block-post-template { width: 100%; }

.sam-class-grid { gap: 0.85rem !important; }
/* let each grid cell's card fill the (row-stretched) cell so dates align */
.sam-class-grid > li { display: flex; }
/* saminfo/classified-card — image-or-monogram tile + body */
.sam-class-card { width: 100%; height: 100%; display: flex; flex-direction: column; border: 1px solid var(--wp--preset--color--rule); border-radius: 2px; overflow: hidden; background: #fff; text-decoration: none; transition: border-color 140ms ease, box-shadow 140ms ease; }
.sam-class-card:hover { border-color: var(--wp--preset--color--navy); box-shadow: 0 8px 20px -14px rgba(3,0,77,0.5); }
.sam-class-card__tile { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; height: 96px; background: #fff; border-bottom: 1px solid var(--wp--preset--color--rule); overflow: hidden; }
/* listings carry employer LOGOS — contain (don't crop) on a clean white tile */
.sam-class-card__tile img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; padding: 0.6rem 0.9rem; transition: transform 160ms ease; }
.sam-class-card:hover .sam-class-card__tile img { transform: scale(1.03); }
.sam-class-card__mono + br { display: none; }
.sam-class-card__mono { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 1.5rem; letter-spacing: 0.04em; color: var(--wp--preset--color--navy); }
/* body fills the (row-stretched) card; date pinned to the bottom so every
   card's date lines up regardless of how many lines the title runs. */
.sam-class-card__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.3rem; padding: 0.75rem 0.85rem 0.8rem; }
.sam-class-card .sam-class-type { font-family: "Overpass", sans-serif; font-size: 0.5625rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--orange); }
.sam-class-card__title { flex: 1 1 auto; font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.8125rem; line-height: 1.25; color: var(--wp--preset--color--navy); }
.sam-class-card:hover .sam-class-card__title { color: var(--wp--preset--color--orange); }
.sam-class-card__date { margin-top: auto; padding-top: 0.4rem; font-family: "Overpass", sans-serif; font-size: 0.625rem; font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--ink-2); }
@media (max-width: 980px) { .sam-class-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 640px) { .sam-class-grid { grid-template-columns: repeat(2, 1fr) !important; } }

/* ── Mountain Department badge (official SAM artwork, self-contained) ── */
.sam-dept-badge-lg { margin: 0; }
.sam-dept-badge-lg img { display: block; width: 132px; height: auto; }
/* Homepage Mountain Departments section mark */
.sam-mdept-head { align-items: center; }
.sam-mdept-mark { flex: 0 0 auto; }
.sam-mdept-mark img { display: block; }
.sam-toolkit a { text-decoration: none; }
.sam-media-kit a.wp-block-button__link { text-decoration: none; }

/* ── ARTICLE: header two-col, body, sidebar ───────────────────── */
.sam-article-head-text .wp-block-post-title { margin-top: 0; }
.sam-byline-row .wp-block-post-author-name a { text-decoration: none; }

/* Captions visually distinct from (serif) body → sans, gold rule. */
.wp-block-image figcaption,
.wp-block-post-featured-image figcaption,
.sam-image-full figcaption {
  font-family: "Overpass", sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 0.8125rem !important;
  line-height: 1.45 !important;
  color: var(--wp--preset--color--ink-2) !important;
  padding-top: 0.5rem;
  position: relative;
}
.wp-block-image figcaption::before,
.wp-block-post-featured-image figcaption::before,
.sam-image-full figcaption::before {
  content: "";
  display: block;
  width: 28px; height: 2px;
  background: var(--wp--preset--color--gold);
  margin-bottom: 0.45rem;
}

/* Exec summary — newline bullets, compact */
.sam-exec-summary-body {
  margin: 0; padding: 0;
  white-space: pre-line;
  font-family: "Spectral", Georgia, serif;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--wp--preset--color--ink);
}

/* Drop cap — serif, navy (consistent with serif body) */
.single .wp-block-post-content > p:first-of-type::first-letter,
.sam-dropcap::first-letter {
  font-family: "Spectral", Georgia, serif;
  font-weight: 800;
  font-size: 4.4em;
  line-height: 0.82;
  float: left;
  color: var(--wp--preset--color--navy);
  margin: 0.06em 0.12em 0 0;
}

/* Article body link contrast */
.wp-block-post-content a {
  color: var(--wp--preset--color--navy);
  text-decoration: underline;
  text-decoration-color: var(--wp--preset--color--gold);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

/* Pull quotes */
.wp-block-pullquote,
.sam-pullquote {
  margin: 3rem 0;
  padding: 1.5rem 0;
  border-top: 2px solid var(--wp--preset--color--navy);
  border-bottom: 1px solid var(--wp--preset--color--rule);
  text-align: left;
}
.wp-block-pullquote::before,
.sam-pullquote::before {
  content: "";
  display: block;
  width: 36px; height: 2px;
  background: var(--wp--preset--color--gold);
  margin: 0 0 0.75rem;
}
.wp-block-pullquote p,
.sam-pullquote p {
  font-family: "Spectral", Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: 1.875rem;
  line-height: 1.3;
  color: var(--wp--preset--color--navy);
}

/* HORIZONTAL PARALLAX AD — full-width navy band, subtle fixed sheen */
.sam-parallax-ad {
  position: relative;
  background-image: linear-gradient(110deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0) 55%);
  background-attachment: fixed;
}
.sam-parallax-ad::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0;
  height: 3px;
  background: var(--wp--preset--color--gold);
}

/* ── Ad-slot guards ───────────────────────────────────────────────
   Keep oversized creatives (e.g. a video served into a banner slot)
   from blowing out the layout. Caps each IAB slot to its format. */
.sam-ad { display: block; margin-inline: auto; }
.sam-ad img, .sam-ad video { display: block; width: 100%; height: auto; object-fit: contain; }
.sam-ad--leaderboard-728x90 { max-width: 728px; }
.sam-ad--leaderboard-728x90 img, .sam-ad--leaderboard-728x90 video { max-height: 120px; }
.sam-ad--billboard-970x250 { max-width: 970px; }
.sam-ad--billboard-970x250 img, .sam-ad--billboard-970x250 video { max-height: 260px; }
.sam-ad--sidebar-300x250 { max-width: 300px; }
.sam-ad--sidebar-300x250 img, .sam-ad--sidebar-300x250 video { max-height: 260px; }

/* ── Callout variations (editor block-variations) ─────────────── */
.sam-callout { margin-block: 1.5rem; padding: 1rem 1.5rem; background: var(--wp--preset--color--base-2); }
/* Callout system reads as a family: a top accent rule sets the type.
   navy = context, gold = by-the-numbers. (Top rules, not side stripes.) */
.sam-callout-context { border-top: 2px solid var(--wp--preset--color--navy); }
.sam-callout-numbers { border-top: 2px solid var(--wp--preset--color--gold); background: var(--wp--preset--color--base-2); }
.sam-callout-numbers strong {
  font-family: "Overpass", sans-serif; font-weight: 800; font-size: 1.75rem;
  color: var(--wp--preset--color--navy); display: inline-block; margin-right: 0.5rem;
}
/* Editor's note is a quiet aside — the italic serif carries it; a hairline
   top rule sets it off without a colored stripe. */
.sam-callout-editors-note {
  border-top: 1px solid var(--wp--preset--color--rule); background: transparent;
  font-family: "Spectral", Georgia, serif; font-style: italic;
  font-size: 0.9375rem; color: var(--wp--preset--color--ink-2);
}
.sam-callout-methodology { background: var(--wp--preset--color--base-2); border: 1px solid var(--wp--preset--color--rule); font-size: 0.9375rem; }
.sam-callout .sam-callout-label {
  font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 800;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--wp--preset--color--navy); margin-bottom: 0.5rem;
}

/* Inline-right + full-bleed images */
.sam-image-inline-right { float: right; margin: 0.5rem 0 1rem 1.5rem; max-width: 50%; }
.sam-image-inline-right img { width: 100%; height: auto; }
.sam-image-full, .sam-image-full.alignfull { margin-block: 2rem; }
.sam-image-full figcaption { max-width: 1080px; margin: 0.5rem auto 0; padding: 0 1rem; }

/* Save Article button */
.sam-save-button:hover {
  background: var(--wp--preset--color--base-2);
  border-color: var(--wp--preset--color--navy);
  color: var(--wp--preset--color--navy);
}
.sam-save-button[data-saved="1"] {
  border-color: var(--wp--preset--color--gold);
  color: var(--wp--preset--color--navy);
}

/* Magazine cover letterboxing (small Joomla source images) */
.sam-magazine .wp-block-post-featured-image {
  display: flex; justify-content: center;
  background: var(--wp--preset--color--navy); padding: 1rem;
}
.sam-magazine .wp-block-post-featured-image img {
  max-width: min(100%, 250px) !important; max-height: 320px;
  object-fit: contain; box-shadow: 0 8px 24px -8px rgba(0,0,0,0.4);
}

/* Empty-image guard */
.wp-block-post-featured-image:not(:has(img)) { display: none; }

/* Skip link */
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus {
  position: static; display: inline-block; padding: 8px 12px;
  background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy);
  font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.6875rem;
  letter-spacing: 0.14em; text-transform: uppercase;
}

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE / MOBILE
   - Featured content stacks first (lead column is first in DOM)
   - Dept cards reflow + hide latest text
   - Carousel single-item snap
   - Sub-navs hide on mobile
   ════════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 980px) {
  .sam-dept-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .sam-article-head .wp-block-columns { flex-wrap: wrap; }
}

/* Phone */
@media (max-width: 781px) {
  /* Masthead: hide center tagline, keep logo + subscribe */
  .sam-masthead-tagline { display: none; }

  /* Beats rail stays, but scrolls horizontally (label hidden to save room) */
  .sam-subnav-label { display: none; }
  .sam-subnav-links { font-size: 0.8125rem; -webkit-overflow-scrolling: touch; }
  .sam-subbeats { position: static; }
  .sam-subbeats-links { font-size: 0.75rem; }

  /* Masthead fit: smaller logo, compact actions */
  .sam-header-bar .sam-logo img { width: 150px !important; }
  .sam-subscribe-btn { padding: 0.6rem 0.85rem; font-size: 0.625rem; }
  .sam-search-trigger { width: 38px; height: 38px; }

  /* The masthead's right cluster was overflowing the row (horizontal scroll):
     too many items for a phone. Drop the secondary utility links + social into
     the drawer; keep Subscribe + search + Menu. Allow the bar to wrap and never
     exceed the viewport as a safety net. */
  .sam-header-right .sam-util-link,
  .sam-header-right .sam-utility-social { display: none; }
  .sam-header-right { gap: 0.55rem; flex-wrap: wrap; justify-content: flex-end; min-width: 0; }
  .sam-header-bar { flex-wrap: wrap; row-gap: 0.5rem; }
  /* Safety net against a stray horizontal scroll from the bar — clip the header
     itself (the drawer is a SIBLING, not a child, so it isn't affected). */
  .sam-site-header { overflow-x: clip; }

  /* Search overlay → single column, slimmer */
  .sam-search-panel .inner { padding: 1.25rem; }
  .sam-search-form { grid-template-columns: 1fr auto; }
  .sam-search-form .prefix { display: none; }
  .sam-search-form input { font-size: 1.375rem; }
  .sam-search-body { grid-template-columns: 1fr; gap: 1.5rem; }

  /* Modals → snug padding */
  .sam-modal-inner { padding: 1.75rem; }

  /* Mobile uses the masthead toggle + custom drawer; hide the desktop nav
     bar and the masthead Subscribe button (Subscribe lives in the drawer). */
  .sam-primary-nav { display: none; }
  .sam-subscribe-btn { display: none; }
  .sam-nav-toggle { display: inline-flex; }

  /* Featured: lead stacks above picks (lead is first in DOM) */
  .sam-featured .wp-block-column { flex-basis: 100% !important; }

  /* The Latest: feed stacks above sidebar; feed rows go single-col */
  .sam-latest .wp-block-columns,
  .sam-feed-row,
  .sam-initiatives .wp-block-columns,
  .sam-classifieds .wp-block-columns,
  .sam-featured-job .wp-block-columns,
  .sam-vendor-spotlight .wp-block-columns,
  .sam-dept-embed .wp-block-columns,
  .sam-media-kit .wp-block-columns,
  .sam-article-body .wp-block-columns,
  .sam-newsletter .wp-block-columns,
  .sam-dept-newsletter .wp-block-columns { flex-wrap: wrap; }
  .sam-latest .wp-block-column,
  .sam-feed-row .wp-block-column,
  .sam-initiatives .wp-block-column,
  .sam-classifieds .wp-block-column,
  .sam-featured-job .wp-block-column,
  .sam-article-body .wp-block-column,
  .sam-newsletter .wp-block-column { flex-basis: 100% !important; }

  /* Article header: featured image first on mobile */
  .sam-article-head .wp-block-columns { flex-direction: column-reverse; }
  .sam-article-head .wp-block-column { flex-basis: 100% !important; }

  /* Article body: don't wrap text around floated/inline images on mobile —
     it creates cramped columns + awkward drop-cap wrap. Stack them. */
  .wp-block-post-content img,
  .wp-block-post-content .alignleft,
  .wp-block-post-content .alignright,
  .wp-block-post-content .sam-image-inline-right {
    float: none !important;
    display: block;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 1rem;
    max-width: 100% !important;
    height: auto;
  }

  /* Releasing sidebar never sticky on mobile (also enforced in JS) */
  .sam-sidebar { position: static !important; }

  /* Department hero: badge centers above text */
  .sam-dept-hero .wp-block-columns { flex-wrap: wrap; }
  .sam-dept-hero .wp-block-column { flex-basis: 100% !important; }
  .sam-dept-stats { order: 3; }

  /* Carousel: ~1.1 cards visible, snap through */
  .sam-headlines-track .sam-headline-card,
  .sam-headlines-track .sam-headline-signup { width: 84%; }

  /* Dept cards: compact, hide tagline text to save vertical space */
  .sam-dept-grid { grid-template-columns: 1fr !important; }
  .sam-dept-card p { display: none; }
  .sam-dept-badge { width: 32px; height: 32px; font-size: 1rem; }

  /* Tighter section rhythm */
  .sam-headlines, .sam-latest, .sam-initiatives, .sam-depts,
  .sam-classifieds, .sam-magazine { padding-top: 2rem !important; padding-bottom: 2rem !important; }
  .sam-newsletter, .sam-media-kit { padding: 2rem 1.25rem !important; }

  /* Footer columns stack */
  .sam-site-footer .wp-block-columns { flex-direction: column; gap: 1.5rem; }

  /* Section heading scale */
  .sam-section-label .wp-block-heading { font-size: clamp(1.375rem, 1.1rem + 2vw, 2rem) !important; }
  .single .wp-block-post-title { font-size: clamp(1.75rem, 1.3rem + 3vw, 2.5rem) !important; }
}

/* Narrowest — aggressive word breaking + declutter the utility bar */
@media (max-width: 540px) {
  .wp-block-post-title, .wp-block-heading { overflow-wrap: anywhere; }
  .sam-utility-social { display: none; }
  .sam-utility-row { justify-content: flex-end; }
}

/* Phones: keep the masthead to a single clean row — logo + Subscribe + search +
   hamburger (the "Menu" word and a larger logo pushed the row past ~405px, wider
   than common phones). Subscribe stays (key CTA; also in the drawer). */
@media (max-width: 600px) {
  .sam-header-bar .sam-logo img { width: 132px !important; }
  .sam-nav-toggle-label { display: none; }
  .sam-header-right { gap: 0.45rem; }
  .sam-utility-subscribe { padding: 0.38rem 0.7rem; font-size: 0.625rem; }
}

/* ── MEGA MENU — nav variant B (Topics · Latest · Recommends) ──────── */
.sam-mega-nav { position: relative; }
.sam-mega-row { align-items: stretch; }
/* WP gives any group with a background `padding:1.25em 2.375em` via a
   zero-specificity :where() rule. We keep the left/right gutter (set above) but
   zero the vertical padding so the bar hugs the links — the hover/active
   highlight then fills the full bar height and the orange underline sits flush
   at the bottom edge (instead of floating with navy space above and below). */
.sam-primary-nav.sam-mega-nav { padding-top: 0; padding-bottom: 0; }
.sam-mnav-link {
  display: flex; align-items: center; padding: 1.15rem 1.15rem; color: #fff;
  font: 700 0.8125rem/1 "Overpass", sans-serif; letter-spacing: 0.08em; text-transform: uppercase;
  box-shadow: inset 0 -3px 0 0 transparent; transition: background 160ms ease, box-shadow 160ms ease;
}
.sam-mnav-link span { margin-left: 0.35rem; font-size: 0.7em; opacity: 0.7; }
.sam-mnav-link:hover,
.sam-has-mega:hover .sam-mnav-trigger,
.sam-has-mega:focus-within .sam-mnav-trigger,
.sam-has-sub:hover .sam-mnav-trigger,
.sam-has-sub:focus-within .sam-mnav-trigger {
  background: rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 -3px 0 0 var(--wp--preset--color--gold);
  color: #fff;
}

/* ── DROPDOWN TYPE: VARIANT A — horizontal "Beats" sub-nav strip ────────
   Same trigger + flush positioning as the mega (.sam-has-mega), but the panel
   is a single horizontal row of links (the old always-on Beats rail, now
   revealed on hover/focus). Toggle a main nav item between the two styles by
   wrapping it in .sam-has-sub (this) vs .sam-has-mega (the Nat-Geo panel). */
.sam-subnav-drop {
  position: absolute; left: 0; right: 0; top: calc(100% - 24px);
  background: #fff;
  border: 1px solid var(--wp--preset--color--rule);
  border-top: 0;
  box-shadow: 0 28px 64px -32px rgba(3, 0, 77, 0.55);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
  z-index: 60;
}
.sam-has-sub:hover .sam-subnav-drop,
.sam-has-sub:focus-within .sam-subnav-drop {
  opacity: 1; visibility: visible; transform: none; transition-delay: 0s;
}
.sam-subnav-drop .sam-subnav-inner {
  max-width: 1320px; margin: 0 auto;
  padding: 0.9rem clamp(1rem, 2vw, 2rem);
}
.sam-mega {
  position: absolute; left: 0; right: 0;
  /* The panel's containing block resolves to a centered zero-ish context inside
     the flex nav, so a plain `top:100%` drops it ~24px below the bar, leaving a
     visible gap. The bar is a fixed 53px (no fluid padding), so this constant
     correction seats the panel flush under it. Verified in-browser (gap = 0). */
  top: calc(100% - 24px);
  background: #fff;
  border: 1px solid var(--wp--preset--color--rule);
  border-top: 0;
  box-shadow: 0 28px 64px -32px rgba(3, 0, 77, 0.55);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
  z-index: 60;
}
.sam-has-mega:hover .sam-mega,
.sam-has-mega:focus-within .sam-mega {
  opacity: 1; visibility: visible; transform: none; transition-delay: 0s;
}
.sam-mega-grid { max-width: 1320px; margin: 0 auto; }
.sam-mega-col { padding: 1.75rem 1.75rem 2rem; }
.sam-mega-topics { flex: 0 0 260px; background: var(--wp--preset--color--base-2); }
.sam-mega-latest { flex: 1; }
.sam-mega-recommends { flex: 0 0 300px; background: var(--wp--preset--color--base-2); }
/* Eyebrow with a short orange rule after the label (Nat-Geo style) */
.sam-mega-eyebrow {
  display: flex; align-items: center; gap: 0.55rem;
  font: 800 11px/1 "Overpass", sans-serif; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--wp--preset--color--ink-2); margin-bottom: 1.25rem;
}
.sam-mega-eyebrow::after {
  content: ""; flex: 1; height: 2px; max-width: 2.25rem;
  background: var(--wp--preset--color--orange);
}
.sam-mega-topics a { display: block; font: 800 1.1875rem/1.15 "Overpass", sans-serif; color: var(--wp--preset--color--navy); margin-bottom: 0.9rem; letter-spacing: -0.012em; transition: color 140ms ease; }
.sam-mega-topics a:hover { color: var(--wp--preset--color--orange); }
.sam-mega-topics .sam-mega-all { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--orange); margin-top: 0.55rem; }
/* Latest — horizontal thumbnail cards. Single column by default; 2-up when the
   Latest column itself is wide enough (container query, not viewport — so it can
   never crush the text the way a fixed 2-col grid did). */
.sam-mega-latest { container-type: inline-size; }
.sam-mega-latest .wp-block-post-template { display: flex; flex-direction: column; gap: 1rem; }
.sam-mega-latest .wp-block-post-template > li { margin: 0; min-width: 0; }
.sam-mega-card { align-items: center; gap: 0.8rem; }
.sam-mega-latest .wp-block-post-featured-image {
  flex: 0 0 80px; width: 80px; margin: 0;
}
.sam-mega-latest .wp-block-post-featured-image img {
  display: block; width: 80px; height: 58px; object-fit: cover; border-radius: 2px;
  background: var(--wp--preset--color--base-2);
}
.sam-mega-card__text { flex: 1 1 auto; min-width: 0; }
.sam-mega-card__text .wp-block-post-title {
  margin: 0; color: var(--wp--preset--color--ink); overflow-wrap: break-word;
}
.sam-mega-latest .wp-block-post-title a { color: var(--wp--preset--color--ink); transition: color 140ms ease; }
.sam-mega-latest .wp-block-post-title a:hover { color: var(--wp--preset--color--orange); }
/* Two columns once the Latest column can comfortably hold two cards */
@container (min-width: 430px) {
  .sam-mega-latest .wp-block-post-template { flex-flow: row wrap; column-gap: 1.75rem; row-gap: 1.25rem; }
  .sam-mega-latest .wp-block-post-template > li { flex: 1 1 calc(50% - 0.875rem); }
}

/* Mega menu narrows gracefully between the drawer breakpoint (782px) and desktop */
@media (max-width: 1100px) {
  .sam-mega-col { padding: 1.25rem 1.25rem 1.5rem; }
  .sam-mega-topics { flex-basis: 210px; }
  .sam-mega-recommends { flex-basis: 250px; }
  .sam-mega-topics a { font-size: 1.0625rem; margin-bottom: 0.7rem; }
}
@media (max-width: 980px) {
  /* Reclaim the Recommends column for the Latest list when space is tight */
  .sam-mega-recommends { display: none; }
  .sam-mega-topics { flex-basis: 200px; }
}

/* Main content top padding — CSS-driven so phones get less whitespace above the
   hero/slider than desktop. */
.sam-main { padding-top: 2.5rem; }
@media (max-width: 600px) { .sam-main { padding-top: 1.25rem; } }

/* ── HERO: "The News" rail + Spotlight callout carousel ─────────── */
.sam-featured .wp-block-columns { align-items: stretch; }

/* Spotlight carousel — a curated, rotating set of promo CALLOUTS (classifieds,
   subscribe, events, magazine), not a post feed. A flex row of full-width slides
   is translated in PIXELS by the store (positionHero in view.js): the glide runs
   on the Web Animations API and the final inline transform holds position, since
   a CSS transition on transform was perpetually restarted by re-application. */
.sam-hero-carousel { position: relative; height: 100%; min-height: 400px; border-radius: 3px; overflow: hidden; background: var(--wp--preset--color--navy); }
.sam-hc-eyebrow { position: absolute; top: 0; left: 0; z-index: 3; font-family: "Overpass", sans-serif; font-size: 0.625rem; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.5); padding: 0.9rem 1.4rem; }
.sam-hc-viewport { position: relative; height: 100%; overflow: hidden; }
.sam-hc-track { display: flex; height: 100%; margin: 0; padding: 0; list-style: none; will-change: transform; }
.sam-hc-slide { position: relative; flex: 0 0 100%; width: 100%; height: 100%; margin: 0; }

/* Callout slide */
.sam-spot { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 100%; overflow: hidden; padding: clamp(1.4rem, 0.8rem + 2.2vw, 2.4rem); padding-top: 2.5rem; color: rgba(255,255,255,0.92); }
.sam-spot-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.sam-spot-shade { position: absolute; inset: 0; z-index: 1; background: linear-gradient(115deg, rgba(2,0,51,0.92) 0%, rgba(2,0,51,0.66) 52%, rgba(2,0,51,0.32) 100%); }
.sam-spot-body { position: relative; z-index: 2; }
/* Tones — soft same-hue radial lift over a brand base (token-driven, no slop). */
.sam-spot--navy   { background: radial-gradient(125% 95% at 88% 8%, color-mix(in oklab, var(--wp--preset--color--navy), white 14%), transparent 58%), var(--wp--preset--color--navy); }
.sam-spot--ink    { background: radial-gradient(125% 95% at 88% 8%, color-mix(in oklab, var(--wp--preset--color--navy), white 10%), transparent 58%), color-mix(in oklab, var(--wp--preset--color--navy), black 38%); }
.sam-spot--blue   { background: radial-gradient(125% 95% at 88% 8%, color-mix(in oklab, var(--wp--preset--color--navy), white 30%), transparent 60%), color-mix(in oklab, var(--wp--preset--color--navy), white 14%); }
.sam-spot--orange { background: radial-gradient(125% 95% at 88% 8%, color-mix(in oklab, var(--wp--preset--color--orange), white 16%), transparent 60%), var(--wp--preset--color--orange); color: var(--wp--preset--color--navy); }
/* Featured-article slide — image-backed, so it gets a stronger scrim than the
   colour-panel callouts (dark at the text edge, with a bottom lift). */
.sam-spot--feature { background: var(--wp--preset--color--navy); }
.sam-spot--feature .sam-spot-shade { background: linear-gradient(95deg, rgba(2,0,51,0.94) 0%, rgba(2,0,51,0.76) 46%, rgba(2,0,51,0.40) 78%, rgba(2,0,51,0.28) 100%), linear-gradient(to top, rgba(2,0,51,0.5) 0%, rgba(2,0,51,0) 55%); }

.sam-spot-kicker { font-family: "Overpass", sans-serif; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--gold); margin-bottom: 0.7rem; }
.sam-spot--orange .sam-spot-kicker { color: var(--wp--preset--color--navy); opacity: 0.7; }
.sam-spot-title { font-family: "Overpass", sans-serif; font-weight: 800; font-size: clamp(1.5rem, 1rem + 1.9vw, 2.2rem); line-height: 1.05; letter-spacing: -0.02em; color: #fff; margin: 0 0 0.65rem; max-width: 18ch; }
.sam-spot--orange .sam-spot-title { color: var(--wp--preset--color--navy); }
.sam-spot-text { font-family: "Spectral", Georgia, serif; font-size: clamp(0.95rem, 0.92rem + 0.25vw, 1.06rem); line-height: 1.45; color: rgba(255,255,255,0.84); margin: 0 0 1.05rem; max-width: 46ch; }
.sam-spot--orange .sam-spot-text { color: color-mix(in oklab, var(--wp--preset--color--navy), transparent 12%); }
.sam-spot-cta { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.sam-spot-cta-btn { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.8rem 1.3rem; border-radius: 2px; border: 0; cursor: pointer; text-decoration: none; background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); transition: background 140ms ease, transform 140ms ease; }
.sam-spot-cta-btn:hover { background: #fff; transform: translateY(-1px); }
.sam-spot--orange .sam-spot-cta-btn { background: var(--wp--preset--color--navy); color: #fff; }
.sam-spot--orange .sam-spot-cta-btn:hover { background: #fff; color: var(--wp--preset--color--navy); }
.sam-spot-cta-link { font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.02em; text-decoration: none; color: inherit; opacity: 0.82; background: none; border: 0; border-bottom: 1px solid transparent; padding: 0 0 1px; cursor: pointer; transition: opacity 140ms ease, border-color 140ms ease; }
.sam-spot-cta-link:hover { opacity: 1; border-bottom-color: currentColor; }

/* Controls sit in the bottom band, away from the left-aligned slide content:
   arrows paired bottom-right, dots bottom-left. (Centred side-arrows used to
   cover the headline.) */
.sam-hc-arrow { position: absolute; bottom: 1.05rem; z-index: 4; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255,255,255,0.18); color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: background 140ms ease; }
.sam-hc-arrow:hover { background: var(--wp--preset--color--orange); }
.sam-hc-prev { right: 4rem; } .sam-hc-next { right: 1.05rem; }
.sam-hc-dots { position: absolute; bottom: 1.3rem; left: 1.6rem; z-index: 4; display: flex; gap: 0.45rem; }
.sam-hc-dot { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,0.42); cursor: pointer; transition: background 140ms ease, transform 140ms ease; }
.sam-hc-dot:hover { background: rgba(255,255,255,0.7); }
.sam-hc-dot.is-active { background: var(--wp--preset--color--gold); transform: scale(1.3); }

/* "The News" rail — recent headlines list + newsletter signup */
.sam-newsrail { display: flex; flex-direction: column; height: 100%; background: var(--wp--preset--color--base-2); border: 1px solid var(--wp--preset--color--rule); border-radius: 3px; padding: 1.1rem 1.35rem 1rem; }
.sam-newsrail-top { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; margin: 0 0 0.55rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--wp--preset--color--navy); }
.sam-newsrail-head { font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.8125rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--orange); margin: 0; }
.sam-newsrail-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; flex: 1 1 auto; counter-reset: none; }
.sam-newsrail-item { padding: 0.5rem 0; border-bottom: 1px solid var(--wp--preset--color--rule); }
.sam-newsrail-item:first-child { padding-top: 0; }
.sam-newsrail-link { display: block; font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.9rem; line-height: 1.18; letter-spacing: -0.01em; color: var(--wp--preset--color--navy); text-decoration: none; }
.sam-newsrail-item:first-child .sam-newsrail-link { font-size: 1rem; }
.sam-newsrail-link:hover { color: var(--wp--preset--color--orange); }
.sam-newsrail-date { display: block; font-family: "Overpass", sans-serif; font-size: 0.6875rem; letter-spacing: 0.05em; text-transform: uppercase; color: color-mix(in oklab, var(--wp--preset--color--navy), transparent 48%); margin-top: 0.22rem; }
.sam-newsrail-foot { margin-top: 0.7rem; padding-top: 0.7rem; border-top: 1px solid var(--wp--preset--color--rule); display: flex; flex-direction: column; gap: 0.6rem; }
.sam-newsrail-all { font-family: "Overpass", sans-serif; font-weight: 700; font-size: 0.7rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--navy); text-decoration: none; white-space: nowrap; }
.sam-newsrail-all:hover { color: var(--wp--preset--color--orange); }
.sam-newsrail-signup { cursor: pointer; border: 0; background: var(--wp--preset--color--navy); color: #fff; font-family: "Overpass", sans-serif; font-weight: 800; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.62rem 1rem; border-radius: 2px; transition: background 140ms ease; }
.sam-newsrail-signup:hover { background: var(--wp--preset--color--orange); }

@media (max-width: 900px) {
  .sam-featured .wp-block-columns { flex-wrap: wrap; }
  .sam-featured .wp-block-column { flex-basis: 100% !important; }
  .sam-hero-carousel { min-height: 320px; }
}

/* Phones: let the slide HUG its content + a compact control band instead of a
   fixed min-height (which left a big gap below short content). Auto-height makes
   the carousel as tall as the tallest slide's content; a small bottom band holds
   the centred [‹ • • • ›] row. Placed AFTER the 900px rule so these win. */
@media (max-width: 600px) {
  .sam-hero-carousel, .sam-hc-viewport, .sam-hc-track, .sam-hc-slide { height: auto; }
  .sam-hero-carousel { min-height: 0; }
  .sam-spot { justify-content: flex-start; padding-top: 1.5rem; padding-bottom: 3.5rem; }
  .sam-hc-arrow { display: flex; top: auto; bottom: 1rem; width: 34px; height: 34px; font-size: 1.25rem; background: rgba(255,255,255,0.22); }
  .sam-hc-prev { left: calc(50% - 88px); right: auto; }
  .sam-hc-next { right: calc(50% - 88px); left: auto; }
  .sam-hc-dots { left: 50%; right: auto; transform: translateX(-50%); bottom: 1.5rem; }
}