/* Deep Dives (5 Sep 2026). Drawn by novamira-sandbox/deep-dives-page.php. */
.soma-dv{--dv-max:1180px;background:var(--soma-base)}
.soma-dv h1,.soma-dv h2{text-wrap:balance}
.soma-dv p{margin:0}
.soma-dv a.soma-dv-ghost{background:transparent;color:var(--soma-white);box-shadow:inset 0 0 0 1.5px var(--soma-line-inverse)}
.soma-dv a.soma-dv-ghost:hover{background:var(--soma-white-12)}
.soma-dv-hero{background:var(--soma-primary);color:var(--soma-white);position:relative;overflow:hidden;padding:clamp(3rem,2rem + 4vw,6rem) var(--soma-gutter) clamp(1.75rem,1rem + 2vw,3rem)}
.soma-dv-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70% 90% at 15% 20%,rgba(13,124,104,.35) 0%,rgba(13,124,104,0) 60%),radial-gradient(50% 70% at 95% 100%,rgba(204,213,255,.18) 0%,rgba(204,213,255,0) 60%);pointer-events:none}
.soma-dv-hero__in{position:relative;max-width:var(--dv-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,1rem + 5vw,6rem);align-items:end}
.soma-dv-hero .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-dv-hero h1{color:var(--soma-white);font-size:clamp(2.3rem,1.1rem + 3.8vw,4rem);letter-spacing:-.01em;margin:18px 0 22px}
.soma-dv-lead{color:var(--soma-white-70);font-size:clamp(1.125rem,1.05rem + .35vw,1.375rem);line-height:1.6;max-width:36em}
.soma-dv-facts{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.soma-dv-facts div{background:var(--soma-white-12);border-radius:var(--soma-r-md);padding:16px 18px}
.soma-dv-facts dt{font-family:var(--soma-font-display);font-weight:600;font-size:clamp(1.75rem,1.4rem + 1.2vw,2.5rem);line-height:1;color:var(--soma-white);font-variant-numeric:tabular-nums}
.soma-dv-facts dd{margin:6px 0 0;font-size:.875rem;color:var(--soma-white-70)}
.soma-dv-chips{position:relative;max-width:var(--dv-max);margin:clamp(1.5rem,1rem + 2vw,2.5rem) auto 0}
.soma-dv .soma-dv-chips .soma-chip{background:var(--soma-white-12);color:var(--soma-white);text-decoration:none}
.soma-dv .soma-dv-chips .soma-chip:hover{background:rgba(255,255,255,.22);color:var(--soma-white)}
.soma-dv .soma-dv-chips .soma-chip--on{background:var(--soma-white);color:var(--soma-primary)}
.soma-dv .soma-dv-chips .soma-chip__n{opacity:.7}
@media (max-width:900px){.soma-dv-chips .soma-dd-filter{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.soma-dv-chips .soma-dd-filter::-webkit-scrollbar{display:none}.soma-dv .soma-dv-chips .soma-chip{white-space:nowrap}}
.soma-dv-sec{padding:clamp(2.5rem,1.5rem + 3vw,4.5rem) var(--soma-gutter)}
.soma-dv-sec--white{background:var(--soma-white)}
.soma-dv-sec__in{max-width:var(--dv-max);margin:0 auto}
/* The promoted picks are a whole .soma-section of their own, with its own
   background and gutters. Sitting it inside a padded, 1180-capped wrapper drew
   its base-coloured band as an inset panel with white margins and hard corners,
   and indented its contents twice. The wrapper steps aside so the band runs
   edge to edge like every other band on the site, and the band's own children
   hold the page's measure. (6 Sep 2026) */
.soma-dv .soma-dv-sec--white{padding:0}
.soma-dv .soma-dv-sec--white > .soma-dv-sec__in{max-width:none}
.soma-dv .soma-dv-sec--white .soma-section{align-items:center}
.soma-dv .soma-dv-sec--white .soma-section > *{width:100%;max-width:var(--dv-max)}
.soma-dv-note{margin-bottom:22px}
.soma-dv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,.75rem + 1vw,1.5rem)}
.soma-dv .soma-dv-card{display:flex;flex-direction:column;background:var(--soma-white);border-radius:var(--soma-r-lg);overflow:hidden;color:var(--soma-primary);text-decoration:none;transition:transform var(--soma-dur-lift) var(--soma-ease),box-shadow var(--soma-dur-lift) var(--soma-ease)}
.soma-dv .soma-dv-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px var(--soma-shadow)}
.soma-dv-card__media{display:block;aspect-ratio:16/9;background:var(--soma-primary-deep);overflow:hidden;border-left:5px solid var(--c)}
.soma-dv-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.soma-dv-card__body{display:flex;flex-direction:column;gap:8px;padding:20px 22px 22px;flex:1}
.soma-dv-card__field{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--c)}
.soma-dv-card__title{font-family:var(--soma-font-display);font-weight:600;font-size:1.45rem;line-height:1.15;text-wrap:balance}
.soma-dv-card__ex{color:var(--soma-text);font-size:.9375rem;line-height:1.55}
.soma-dv-card__meta{color:var(--soma-text);font-size:.8125rem;margin-top:auto;padding-top:6px}
.soma-dv-card__foot{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid var(--soma-line);font-weight:600;color:var(--soma-secondary);font-size:.9375rem}
.soma-dv-card__foot b{font-family:var(--soma-font-display);font-size:1.25rem;font-weight:600;color:var(--soma-primary)}
.soma-dv-end{background:var(--soma-primary);color:var(--soma-white);padding:clamp(3.5rem,2rem + 5vw,7rem) var(--soma-gutter)}
.soma-dv-end__in{max-width:var(--dv-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,1rem + 4vw,5rem);align-items:center}
.soma-dv-end .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-dv-end h2{color:var(--soma-white);font-size:clamp(2rem,1.3rem + 3vw,3.4rem);margin:14px 0 14px}
.soma-dv-end p{color:var(--soma-white-70);max-width:36em;font-size:1.0625rem}
.soma-dv-end__acts{display:flex;flex-direction:column;gap:10px;min-width:280px}
.soma-dv-end__acts .soma-btn{justify-content:center}
@media (max-width:1100px){
  .soma-dv-hero__in{grid-template-columns:1fr;align-items:start}
  .soma-dv-facts{max-width:560px}
  .soma-dv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .soma-dv-end__in{grid-template-columns:1fr}
  .soma-dv-end__acts{flex-direction:row;flex-wrap:wrap}
}
@media (max-width:640px){
  .soma-dv-hero h1{font-size:clamp(2rem,7.6vw,2.7rem)}
  .soma-dv-facts{grid-template-columns:1fr 1fr;gap:8px}
  .soma-dv-facts div{padding:12px 14px}
  .soma-dv-grid{grid-template-columns:1fr}
  .soma-dv-end__acts{flex-direction:column}
}

/* === The field filter, on the list ======================================
   Moved out of the hero and onto the list it filters. It pins under the site
   header while the list is on screen and releases at the end of it, so the
   reader can switch field without scrolling back, and the rest of the page
   pays nothing for it. One row always — two rows pinned would take a quarter
   of a laptop viewport once the header is counted. */
.soma-dv-chips--stick{
  position:sticky;top:81px;z-index:20;
  background:var(--soma-base);
  padding:14px 0 12px;
  margin:0 0 clamp(1.5rem,1rem + 1.5vw,2.25rem);
  box-shadow:0 10px 12px -12px rgba(19,21,39,.35);
}
body.admin-bar .soma-dv-chips--stick{top:113px}
/* Never wrap: the seven field names plus All fields do not fit one row on any
   width, so the row scrolls sideways instead — the same behaviour the narrow
   breakpoint already used, now used everywhere. */
.soma-dv-chips--stick .soma-dd-filter{
  flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
  padding-bottom:2px;
}
.soma-dv-chips--stick .soma-dd-filter::-webkit-scrollbar{display:none}
.soma-dv-chips--stick .soma-chip{flex:none;white-space:nowrap}
/* The chips were built for the dark hero: white text on 12% white. On the light
   bar that is white on near-white, so every unselected field read as blank.
   They invert for this surface — ink on white, hairline edge, and the current
   field as a filled dark pill so it is unmistakable. */
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip{
  background:var(--soma-white);color:var(--soma-text);
  border:1px solid var(--soma-line);
}
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip:hover{
  color:var(--soma-primary);border-color:var(--soma-primary);
}
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip--on,
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip--on:hover{
  background:var(--soma-primary);color:var(--soma-white);border-color:var(--soma-primary);
}
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip b,
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip span,
.soma-dv-sec--list .soma-dv-chips--stick .soma-chip i{color:inherit;opacity:.6}


/* soma: green closing band */
/* The band and the footer were the same navy, so the page's last call to action
   dissolved into the footer. Green separates them. */
.soma-dv-end{background:var(--soma-secondary)}
.soma-dv-end .soma-eyebrow{color:rgba(255,255,255,.72)}
.soma-dv-end p{color:rgba(255,255,255,.82)}
.soma-dv-end__acts .soma-btn:not(.soma-dv-ghost){background:var(--soma-white);color:var(--soma-secondary);border-color:var(--soma-white)}
/* templates.css turns every .soma-page link navy on hover, which blacks out
   links on a coloured surface. Hold white here. */
section.soma-dv-end a:hover,section.soma-dv-end a:focus-visible{color:var(--soma-white)}
section.soma-dv-end .soma-dv-end__acts a.soma-btn:not(.soma-dv-ghost):hover,
section.soma-dv-end .soma-dv-end__acts a.soma-btn:not(.soma-dv-ghost):focus-visible{color:var(--soma-secondary)}