/* /insights/ — Tier 1 page CSS. Loaded only by this page. Tokens, type scale and buttons come
   from styles.css; sizing is on @container page.

   Composition: a masthead line and a 7/5 lead spread (photograph on the A story only), a 3/8
   shelf of hairline editorial rows, a two-column text-only reference index, a Navy attribution
   band, and a close that leads with the next piece to read. Weight is carried by type size,
   imagery and rule work — never by a box. No equal-weight card wall anywhere.

   Below 620px every grid collapses to one column with no column gap: a 12-column grid with a
   40px column gap has a 440px minimum and would otherwise clip inside a 390px viewport. */

main{--ins-r:6px}
/* Sep 16, 2026 tightening pass: hub section rhythm reduced ~15% (88→74px), row gaps ~10–15%,
   library rows ~20%. Scoped to this page only (insights.css loads nowhere else). */
main>.sec{padding:74px 0}
@container page (max-width:900px){main>.sec{padding:56px 0}}
@container page (max-width:620px){main>.sec{padding:46px 0}}
.ins-h2{font-family:var(--font-display);font-weight:500;font-size:38px;line-height:1.08;letter-spacing:-.022em;color:var(--brand-navy);margin:0;max-width:22ch}
.ins-lead{margin-top:16px;font-size:17px;line-height:1.6;color:var(--text-secondary);max-width:48ch}
.ins-link{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:44px;font-family:var(--font-sans);font-size:14.5px;font-weight:600;color:var(--brand-navy);text-decoration:none;padding:11px 0}
.ins-link:hover{color:var(--brand-accent)}
figure{margin:0}
/* Visible production-state label: quiet, unmistakable, never styled like editorial metadata. */
.ins-state{display:inline-block;margin:9px 0 0;font-family:var(--font-sans);font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7a5a1f;background:rgba(163,109,45,.15);border-radius:3px;padding:3px 7px}
.ins-meta{margin:0;font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-eyebrow)}
.ins-cta{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-family:var(--font-sans);font-size:14px;font-weight:600;color:var(--brand-navy)}

/* ---- 1 masthead line and the lead spread ---- */
.ins-top__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:4px}
.ins-mast{grid-column:1 / -1;display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:14px;border-bottom:2px solid var(--brand-accent)}
.ins-mast__lib{margin:0;font-family:var(--font-sans);font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--text-secondary)}
/* The h1 is the masthead eyebrow: same type, same weight, same size — no visual change. */
.ins-mast__t{margin:0;font-family:var(--font-sans)}
/* The lead spread is its own grid inside the section grid. Named ins-spread, never ins-lead:
   ins-lead is the supporting-paragraph type style and the two must not collide. */
.ins-spread{grid-column:1 / -1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px}
.ins-lead__a{grid-column:1 / span 7;padding-top:40px}
/* align-self:start keeps the dividing rule the height of the B story rather than the height of
   the much taller A story, so the fifth column reads as a second story and not as an empty one. */
.ins-lead__b{grid-column:9 / span 4;align-self:start;padding-top:40px;border-left:1px solid var(--line);padding-left:40px;padding-bottom:8px}
.ins-a,.ins-b{display:block;text-decoration:none;color:inherit}
.ins-a__ph{margin-bottom:26px}
/* Neutral production image slot: intended ratio, stated. No photography, no generated image. */
.ins-slot{position:relative;aspect-ratio:var(--ins-ar,3 / 2);border-radius:var(--ins-r);background:var(--brand-fog);border:1px solid rgba(0,43,84,.14);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:16px;overflow:hidden}
.ins-slot__t{display:flex;flex-direction:column;gap:6px}
.ins-slot__r{font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sky-800,#1B5E8C)}
.ins-slot__f{font-family:var(--font-sans);font-size:12.5px;line-height:1.4;color:var(--text-secondary);max-width:30ch}
/* Click/drop-to-fill overlay: invisible while the slot is empty (the locked placeholder shows
   through and states the brief), the supplied image takes the frame once filled. */
.ins-slot{cursor:pointer}
.ins-slot image-slot{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.ins-slot image-slot::part(frame){background:transparent}
.ins-slot image-slot::part(empty){opacity:0}
/* Final installed imagery: real photograph at the slot's ratio and radius, no placeholder chrome. */
.ins-slot--filled{cursor:auto;border:0;background:none;padding:0}
.ins-slot--filled picture{display:contents}
.ins-slot__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:var(--ins-r)}
/* Play indicator over installed imagery: website UI, never part of the image. One 68px Navy
   disc, optically centred on the thumbnail, with a white keyline and a soft shadow so it holds
   over both light and dark photography. Sized identically on every Insights video thumbnail.
   LOCKED sitewide (approved Aug 2026): size 68px desktop / 56px at <=700px, absolute centring,
   Navy .85 rising to .93 on hover, 2px solid white border, 0 4px 16px rgba(0,25,45,.28) shadow,
   scale(1.05) at 180ms on cubic-bezier(.2,.6,.2,1), suppressed under prefers-reduced-motion.
   Do not alter any of those values without a newly identified accessibility or usability issue.
   It applies to installed imagery AND to a briefed placeholder shown in a content list (the close's
   reading card), so a list video always reads as playable at the same size. */
.ins-slot.ins-slot--filled .ins-slot__play,.ins-cl__nph .ins-slot .ins-slot__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:68px;height:68px;margin:0;background:rgba(0,43,84,.85);border:2px solid #fff;box-shadow:0 4px 16px rgba(0,25,45,.28);filter:none;transition:background var(--ins-t,180ms) cubic-bezier(.2,.6,.2,1),transform 180ms cubic-bezier(.2,.6,.2,1)}
.ins-slot.ins-slot--filled .ins-slot__play::after,.ins-cl__nph .ins-slot .ins-slot__play::after{left:27px;top:23px;border-left:19px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
a:hover .ins-slot--filled .ins-slot__play,.ins-slot--filled:hover .ins-slot__play,.ins-cl__nph:hover .ins-slot__play{background:rgba(0,43,84,.93);transform:translate(-50%,-50%) scale(1.05)}
a:focus-visible .ins-slot--filled .ins-slot__play,.ins-cl__nph:focus-visible .ins-slot__play{background:rgba(0,43,84,.93)}
@media (prefers-reduced-motion:reduce){.ins-slot--filled .ins-slot__play,.ins-cl__nph .ins-slot__play{transition:none}a:hover .ins-slot--filled .ins-slot__play,.ins-slot--filled:hover .ins-slot__play,.ins-cl__nph:hover .ins-slot__play{transform:translate(-50%,-50%)}}
/* The 56px step is on @container page, like every other size on this page — a viewport media query
   would not fire for the page shell in embedded or scaled contexts. */
@container page (max-width:700px){.ins-slot.ins-slot--filled .ins-slot__play,.ins-cl__nph .ins-slot .ins-slot__play{width:56px;height:56px}.ins-slot.ins-slot--filled .ins-slot__play::after,.ins-cl__nph .ins-slot .ins-slot__play::after{left:22px;top:19px;border-left:16px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent}}
/* Video uses the same slot, with one restrained indicator — never a separate card treatment. */
.ins-slot__play{flex:none;width:46px;height:46px;border:1.5px solid rgba(0,43,84,.42);border-radius:50%;position:relative}
.ins-slot__play::after{content:"";position:absolute;left:18px;top:14px;border-left:13px solid rgba(0,43,84,.52);border-top:9px solid transparent;border-bottom:9px solid transparent}
.ins-slot--sm{gap:7px;padding:12px}
.ins-slot--sm .ins-slot__r{font-size:9px;letter-spacing:.12em}
.ins-slot--sm .ins-slot__f{font-size:10.5px}
.ins-slot--sm .ins-slot__play{width:30px;height:30px}
.ins-slot--sm .ins-slot__play::after{left:11px;top:9px;border-left:9px solid rgba(0,43,84,.52);border-top:6px solid transparent;border-bottom:6px solid transparent}
.ins-slot--xs{gap:0;padding:8px}
.ins-slot--xs .ins-slot__r{font-size:7.5px;letter-spacing:.1em}
.ins-slot--xs .ins-slot__f{display:none}
.ins-slot--xs .ins-slot__play{width:22px;height:22px;margin-bottom:5px}
.ins-slot--xs .ins-slot__play::after{left:8px;top:6px;border-left:7px solid rgba(0,43,84,.52);border-top:5px solid transparent;border-bottom:5px solid transparent}
/* The secondary story: same tier ratio, smaller frame than the lead. */
.ins-b__ph{margin-bottom:18px}
.ins-a__h{font-family:var(--font-display);font-weight:500;font-size:44px;line-height:1.06;letter-spacing:-.026em;color:var(--brand-navy);margin:14px 0 0;max-width:20ch;text-wrap:pretty}
.ins-a__s{margin-top:16px;font-size:18.5px;line-height:1.6;color:var(--text-secondary);max-width:52ch}
.ins-a:hover .ins-a__h,.ins-b:hover .ins-b__h{color:var(--brand-accent)}
.ins-b__h{font-family:var(--font-display);font-weight:500;font-size:26px;line-height:1.14;letter-spacing:-.018em;color:var(--brand-navy);margin:12px 0 0;text-wrap:pretty}
.ins-b__s{margin-top:12px;font-size:16px;line-height:1.6;color:var(--text-secondary)}
/* The filter is a quiet row of controls, not a toolbar. It renders only when it would change
   what is on screen, so it is never furniture. Treatment matches the sitewide editorial
   filter strip: 2px navy top rule, faint bottom hairline, no fill. */
.ins-filter{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;margin-top:44px;padding:8px 0;border-top:2px solid var(--brand-navy);border-bottom:1px solid rgba(215,218,223,.55)}
.ins-filter__l{font-family:var(--font-sans);font-weight:700;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-eyebrow,#2E7FB8);margin-right:16px}
.ins-filter__b{min-height:44px;padding:11px 14px;background:none;border:0;border-bottom:2px solid transparent;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--text-secondary);cursor:pointer}
.ins-filter__b:hover{color:var(--brand-navy)}
.ins-filter__b.is-on{color:var(--brand-navy);border-bottom-color:var(--brand-navy)}
.ins-filter__b:focus-visible{outline:2px solid var(--brand-accent);outline-offset:2px}
.ins-top__dev{grid-column:1 / -1}

/* ---- 2 the shelf: two editorial columns of hairline rows, the first row full-width ---- */
.ins-shelf__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px}
.ins-shelf__head{grid-column:1 / span 3;position:sticky;top:120px;align-self:start}
.ins-shelf__head .ins-h2{font-size:26px;max-width:14ch}
.ins-shelf__list{grid-column:5 / span 8;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;border-top:1px solid rgba(0,43,84,.18)}
.ins-row{display:grid;grid-template-columns:minmax(0,1fr);gap:0 32px;padding:22px 0 24px;border-bottom:1px solid rgba(0,43,84,.14);text-decoration:none;color:inherit;align-content:start}
.ins-row__ph{margin-bottom:14px}
.ins-row--wide{grid-column:1 / -1;grid-template-columns:300px minmax(0,1fr)}
.ins-row--wide .ins-row__ph{margin-bottom:0}
.ins-row__h{font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.2;letter-spacing:-.014em;color:var(--brand-navy);margin:10px 0 0;text-wrap:pretty}
.ins-row--wide .ins-row__h{font-size:24px;letter-spacing:-.016em}
.ins-row:hover .ins-row__h{color:var(--brand-accent)}
.ins-row__s{margin:9px 0 0;font-size:15px;line-height:1.58;color:var(--text-secondary);max-width:52ch}
.ins-shelf__dev{grid-column:1 / -1}

/* ---- 3 reference: text-only index, two columns ---- */
.ins-ref__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px}
.ins-ref__head{grid-column:1 / span 12}
.ins-ref__c{margin-top:12px;border-top:2px solid var(--brand-navy)}
.ins-ref__c--a{grid-column:1 / span 5}
.ins-ref__c--b{grid-column:7 / span 6}
.ins-ref__ph{width:104px;flex:none}
.ins-ref__b{min-width:0}
.ins-ref__r{display:grid;grid-template-columns:104px minmax(0,1fr) auto;column-gap:18px;align-items:start;padding:18px 0 19px;border-bottom:1px solid rgba(0,43,84,.14);text-decoration:none;color:inherit}
.ins-ref__t{font-family:var(--font-display);font-weight:500;font-size:21px;line-height:1.18;letter-spacing:-.014em;color:var(--brand-navy);margin:0}
.ins-ref__d{margin:6px 0 0;font-size:15px;line-height:1.55;color:var(--text-secondary);max-width:46ch}
.ins-ref__a{font-family:var(--font-sans);font-size:15px;color:var(--brand-navy);transition:transform 180ms cubic-bezier(.2,.6,.2,1)}
.ins-ref__r:hover .ins-ref__t{color:var(--brand-accent)}
.ins-ref__r:hover .ins-ref__a{transform:translateX(4px);color:var(--brand-accent)}
.ins-ref__r--flat{grid-template-columns:104px minmax(0,1fr)}
.ins-ref__dev{grid-column:1 / -1}

/* ---- 4 attribution: one Navy band, one statement ---- */
.ins-attr{background:var(--brand-navy);color:var(--text-inverse)}
.ins-attr__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:64px;padding-bottom:68px;align-items:end}
.ins-attr__copy{grid-column:1 / span 7}
.ins-attr__h{font-family:var(--font-display);font-weight:500;font-size:35px;line-height:1.1;letter-spacing:-.022em;color:var(--text-inverse);margin:10px 0 0;max-width:24ch}
.ins-attr__l{margin-top:18px;font-size:17px;line-height:1.6;color:var(--sky-300);max-width:46ch}
.ins-attr__routes{grid-column:9 / span 4;display:flex;flex-direction:column;border-top:1px solid rgba(145,195,235,.3)}
.ins-attr__routes .ins-link{color:var(--brand-sky);border-bottom:1px solid rgba(145,195,235,.18)}
.ins-attr__routes .ins-link:hover{color:var(--text-inverse)}
.ins-attr__dev{grid-column:1 / -1}

/* ---- 5 close: the next piece to read, then one action ---- */
/* Paper close: the attribution band above stays Navy, so the page breathes once before the Navy footer. */
.ins-cl{background:var(--brand-paper);color:var(--text-primary);border-top:1px solid var(--line)}
.ins-cl__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 40px;padding-top:64px;padding-bottom:76px}
.ins-cl__read{grid-column:1 / span 6}
/* A video in the reading column: compact 3:2 thumbnail beside the headline.
   LOCKED (approved Aug 2026) and the REUSABLE PATTERN for any future video in this slot:
   220px 3:2 thumbnail / 24px gap / copy column; 14px under the KEEP READING eyebrow; the locked
   sitewide play overlay centred on the thumbnail (never restyled per instance); hierarchy is
   Newsreader 31px title → 10px → 15px Instrument Sans description on a 46ch measure → 16px →
   the record's own CTA (Watch video) in sky-800; thumbnail/play opens the modal player, the
   headline goes to the full post. Responsive: stacked and capped at 260px from 1240px to 900px
   (where the column is 6 of 12), 220px side-by-side once the column is full width, stacked and
   capped at 280px below 620px. Any new video record inherits all of this from its own data — no
   per-record styling. No changes without a newly identified accessibility or usability issue. */
.ins-cl__nx{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start;margin-top:14px}
.ins-cl__nx--text{display:block}
.ins-cl__nph{display:block;position:relative;text-decoration:none;border-radius:var(--ins-r)}
.ins-cl__nph .ins-slot{margin:0}
/* Placeholder chrome stays quiet under the play button until the real thumbnail lands. */
.ins-cl__nph .ins-slot .ins-slot__r{position:absolute;left:10px;bottom:8px;margin:0}
.ins-cl__nph .ins-slot .ins-slot__f{display:none}
.ins-cl__next{display:block;margin-top:14px;text-decoration:none}
.ins-cl__nx .ins-cl__next{margin-top:0}
.ins-cl__nh{font-family:var(--font-display);font-weight:500;font-size:31px;line-height:1.12;letter-spacing:-.02em;color:var(--text-heading);margin:0;max-width:22ch}
.ins-cl__nd{font-family:var(--font-sans);font-size:15px;line-height:1.6;color:var(--text-secondary);margin:10px 0 0;max-width:46ch}
.ins-cl__na{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-family:var(--font-sans);font-size:14px;font-weight:600;color:var(--sky-800,#1B5E8C)}
.ins-cl__next:hover .ins-cl__nh{color:var(--sky-800,#1B5E8C)}
.ins-cl__act{grid-column:8 / span 5}
.ins-cl--solo .ins-cl__act{grid-column:1 / span 7}
.ins-cl__h{font-family:var(--font-display);font-weight:500;font-size:35px;line-height:1.08;letter-spacing:-.024em;color:var(--text-heading);margin:4px 0 0;max-width:18ch}
.ins-cl__a{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;margin-top:26px}
.ins-cl__a .ds-btn--primary{background:var(--brand-navy);border-color:var(--brand-navy);color:#fff}
.ins-cl__a .ds-btn--primary:hover{background:var(--navy-600);border-color:var(--navy-600);color:#fff}
.ins-cl__tel{display:inline-flex;align-items:center;min-height:44px;font-family:var(--font-sans);font-size:14.5px;font-weight:600;color:var(--sky-800,#1B5E8C);text-decoration:none}
.ins-cl__tel:hover{color:var(--brand-navy)}
.ins-cl__sec{display:flex;flex-wrap:wrap;gap:0 30px;margin-top:18px;padding-top:8px;border-top:1px solid var(--line)}
.ins-cl__sec .ins-link{color:var(--sky-800,#1B5E8C)}
.ins-cl__sec .ins-link:hover{color:var(--brand-navy)}
.ins-cl__dev{grid-column:1 / -1}

/* ---- motion: html.ins is added by insights-motion.js only ---- */
.ins .ins-rv>*{opacity:0;transform:translateY(10px)}
.ins .ins-rv.is-in>*{opacity:1;transform:none;transition:opacity 300ms cubic-bezier(.2,.6,.2,1),transform 300ms cubic-bezier(.2,.6,.2,1)}
.ins .ins-row,.ins .ins-ref__r{opacity:0;transform:translateY(10px)}
.ins .ins-shelf.is-in .ins-row,.ins .ins-ref.is-in .ins-ref__r{opacity:1;transform:none;transition:opacity 560ms cubic-bezier(.2,.6,.2,1),transform 560ms cubic-bezier(.2,.6,.2,1)}
.ins .ins-shelf.is-in .ins-row:nth-child(2),.ins .ins-ref.is-in .ins-ref__r:nth-child(2){transition-delay:70ms}
.ins .ins-shelf.is-in .ins-row:nth-child(3),.ins .ins-ref.is-in .ins-ref__r:nth-child(3){transition-delay:140ms}
.ins .ins-shelf.is-in .ins-row:nth-child(n+4){transition-delay:190ms}
@media (prefers-reduced-motion:no-preference){
  .ins .ins-a__ph .ins-slot{animation:ins-settle 1300ms cubic-bezier(.2,.6,.2,1) 100ms both}
  .ins .ins-mast,.ins .ins-lead__a>*,.ins .ins-lead__b>*{animation:ins-rise 720ms cubic-bezier(.2,.6,.2,1) both}
  .ins .ins-mast{animation-delay:80ms}
  .ins .ins-lead__a>*{animation-delay:200ms}
  .ins .ins-lead__b>*{animation-delay:320ms}
}
@keyframes ins-settle{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
@keyframes ins-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
/* Filtering swaps in place: opacity only, never a layout jump under the reader's cursor. */
.ins-filtering .ins-row,.ins-filtering .ins-ref__r{transition:opacity 200ms cubic-bezier(.2,.6,.2,1)}
[data-ins-hidden="true"]{display:none}

/* ---- responsive ---- */
@container page (max-width:1240px){
  .ins-a__h{font-size:38px}
  .ins-h2{font-size:32px}
  .ins-attr__h,.ins-cl__h{font-size:30px}
  .ins-cl__nh{font-size:27px}
  .ins-cl__nx{grid-template-columns:minmax(0,1fr);gap:16px}
  .ins-cl__nph{max-width:260px}
  .ins-row--wide{grid-template-columns:248px minmax(0,1fr)}
}
@container page (max-width:900px){
  .ins-lead__a,.ins-lead__b{grid-column:1 / -1}
  .ins-lead__b{border-left:0;padding-left:0;padding-top:26px;border-top:1px solid var(--line);margin-top:14px}
  .ins-a__h{font-size:32px;max-width:24ch}
  .ins-a__s{font-size:17px}
  .ins-filter{margin-top:32px}
  .ins-shelf__head,.ins-shelf__list{grid-column:1 / -1}
  .ins-shelf__head{position:static}
  .ins-shelf__list{margin-top:22px}
  .ins-row--wide{grid-template-columns:200px minmax(0,1fr)}
  .ins-ref__head,.ins-ref__c--a,.ins-ref__c--b{grid-column:1 / -1}
  .ins-ref__c--b{border-top:0}
  .ins-attr__g{padding-top:58px;padding-bottom:62px}
  .ins-attr__copy,.ins-attr__routes{grid-column:1 / -1}
  .ins-attr__routes{margin-top:26px}
  .ins-cl__g{padding-top:56px;padding-bottom:68px}
  .ins-cl__read,.ins-cl__act,.ins-cl--solo .ins-cl__act{grid-column:1 / -1}
  .ins-cl__nx{grid-template-columns:220px minmax(0,1fr);gap:24px}
  .ins-cl__act{margin-top:38px}
}
@container page (max-width:620px){
  .ins-top__g,.ins-spread,.ins-shelf__g,.ins-ref__g,.ins-attr__g,.ins-cl__g{grid-template-columns:minmax(0,1fr);column-gap:0}
  .ins-shelf__list{grid-template-columns:minmax(0,1fr);column-gap:0}
  .ins-a__h{font-size:27px}
  .ins-b__h{font-size:22px}
  .ins-h2{font-size:25px}
  .ins-row,.ins-row--wide{grid-template-columns:minmax(0,1fr)}
  .ins-row__ph,.ins-row--wide .ins-row__ph{margin-bottom:14px}
  .ins-ref__r,.ins-ref__r--flat{grid-template-columns:78px minmax(0,1fr)}
  .ins-ref__ph{width:78px}
  .ins-ref__t{font-size:19px}
  .ins-attr__h,.ins-cl__h{font-size:25px}
  .ins-cl__nh{font-size:23px}
  .ins-cl__nx{grid-template-columns:minmax(0,1fr);gap:16px}
  .ins-cl__nph{max-width:280px}
/* Modal video player: Navy scrim, no autoplay, focus-trapped by insights-motion.js. Inert until
   a record carries a verified video id. */
}
.ins-vm[hidden]{display:none}
.ins-vm{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,27,54,.42);backdrop-filter:blur(2px)}
.ins-vm__d{position:relative;width:min(1040px,100%);background:var(--brand-navy);border-radius:6px;overflow:hidden;box-shadow:0 18px 50px rgba(0,43,84,.28)}
.ins-vm__f{display:block;width:100%;aspect-ratio:16 / 9;border:0}
.ins-vm__x{position:absolute;top:10px;right:10px;width:40px;height:40px;display:grid;place-items:center;background:rgba(0,43,84,.85);border:2px solid #fff;border-radius:50%;color:#fff;font-size:16px;line-height:1;cursor:pointer}
.ins-vm__x:hover{background:rgba(0,43,84,.93)}
.ins-vm__t{margin:0;padding:14px 62px 16px 18px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.02em;color:#fff}


/* ===== Sep 2026 hub redesign: Watch & Learn, Events, Videos landing ===== */
.ins-wl{}
.ins-wl__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 24px}
.ins-wl__head{grid-column:1/-1;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:26px}
.ins-wl__head .ins-h2{margin:6px 0 0;max-width:20ch}
.ins-wl__head .ins-link{white-space:nowrap;flex:none}
.ins-wl__cards{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px}
.ins-wl__c{text-decoration:none;display:block}
.ins-wl__c .ins-slot{margin-bottom:14px}
.ins-wl__c .ins-meta{margin:0}
.ins-wl__t{font-family:var(--font-display);font-weight:500;font-size:21px;line-height:1.2;letter-spacing:-.01em;color:var(--brand-navy);margin:8px 0 0}
.ins-wl__s{font-family:var(--font-sans);font-size:14.5px;line-height:1.55;color:var(--text-secondary);margin:8px 0 0}
.ins-wl__c:hover .ins-wl__t{color:var(--sun-700)}
@media(max-width:900px){.ins-wl__cards{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ins-wl__cards{grid-template-columns:1fr}.ins-wl__head{flex-direction:column;align-items:flex-start;gap:12px}}

/* From Alliance Portfolio events — Navy band: one lead video + secondary rows (Sep 16, 2026) */
.ins-ev{background:var(--brand-navy);color:#fff;padding:64px 0}
.ins-ev__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 24px;align-items:start}
.ins-ev__head{grid-column:1/span 4}
.ins-ev__lead{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 32px;align-items:center;text-decoration:none;padding-bottom:26px}
.ins-ev__lph{grid-row:1}
.ins-ev__lb{grid-row:1}
.ins-ev__lt{font-family:var(--font-display);font-weight:500;font-size:29px;line-height:1.12;letter-spacing:-.016em;color:#fff;margin:8px 0 0;text-wrap:pretty}
.ins-ev__lead:hover .ins-ev__lt{color:var(--brand-sky)}
.ins-ev__s--lead{font-size:15px;max-width:44ch}
.ins-ev__cta{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-family:var(--font-sans);font-size:14px;font-weight:600;color:var(--brand-sky)}
.ins-ev__rows{grid-column:1/-1}
.ins-ev__h{font-family:var(--font-display);font-weight:500;font-size:32px;line-height:1.1;letter-spacing:-.018em;color:#fff;margin:14px 0 0;max-width:14ch}
.ins-ev__l{font-family:var(--font-sans);font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.78);margin:16px 0 0;max-width:34ch}
.ins-ev__list{grid-column:6/span 7;display:grid;grid-template-columns:minmax(0,1fr)}
.ins-ev__r{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;text-decoration:none;padding:18px 0;border-top:1px solid rgba(255,255,255,.16)}
.ins-ev__r:last-child{border-bottom:1px solid rgba(255,255,255,.16)}
.ins-ev__ph{width:150px}
.ins-ev .ins-meta,.ins-ev .ins-meta.inv{color:var(--sky-300);margin:0}
.ins-ev .ins-meta .dot,.ins-ev .ins-meta span[aria-hidden]{color:rgba(145,195,235,.6)}
.ins-ev__t{font-family:var(--font-display);font-weight:500;font-size:22px;line-height:1.2;color:#fff;margin:7px 0 0}
.ins-ev__s{font-family:var(--font-sans);font-size:14px;line-height:1.5;color:rgba(255,255,255,.72);margin:7px 0 0;max-width:52ch}
.ins-ev__r:hover .ins-ev__t{color:var(--brand-sky)}
@media(max-width:900px){.ins-ev__head{grid-column:1/-1;margin-bottom:26px}.ins-ev__list{grid-column:1/-1}.ins-ev__lead{grid-template-columns:minmax(0,1fr);gap:16px}.ins-ev__lph{grid-row:auto}.ins-ev__lb{grid-row:auto}}
@media(max-width:600px){.ins-ev__r{grid-template-columns:120px 1fr;gap:16px}.ins-ev__ph{width:120px}.ins-mkt__sub{grid-template-columns:120px minmax(0,1fr)}}

/* Videos landing (Sep 16, 2026 library revision) */
.ins-vhero{}
.ins-vhero__h{font-family:var(--font-display);font-weight:500;font-size:52px;line-height:1.02;letter-spacing:-.022em;color:var(--brand-navy);margin:12px 0 0}
.ins-vhero__l{font-family:var(--font-sans);font-size:19px;line-height:1.55;color:var(--text-secondary);margin:18px 0 0;max-width:60ch}
.ins-vhero--compact .ins-vhero__h{font-size:40px}
.ins-vhero--compact .ins-vhero__l{font-size:17px;margin-top:14px;max-width:66ch}
@media(max-width:600px){.ins-vhero__h{font-size:38px}.ins-vhero--compact .ins-vhero__h{font-size:30px}}
/* Videos page (Sep 16, 2026 thirds-grid revision): ONE 12-col system — full-width headings,
   4-col cards (3-up desktop / 2-up tablet / 1-up mobile), ~76px section rhythm. */
.vv>.sec{padding:76px 0}
@container page (max-width:900px){.vv>.sec{padding:54px 0}}
.vv-gs__head{max-width:70ch}
.vv-gs__head .eyebrow{margin-top:14px}
.vv-gs__head .ins-h2{margin-top:10px}
.vv-gs__head .ins-shelf__lead{max-width:64ch}
.vv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 28px;margin-top:30px}
.vv-c{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.vv-c__eb{font-family:var(--font-sans);font-weight:700;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--sky-800);margin:14px 0 0}
.vv-c .ins-hist{margin-top:8px}
.vv-c__t{font-family:var(--font-display);font-weight:500;font-size:21px;line-height:1.2;letter-spacing:-.012em;color:var(--brand-navy);margin:8px 0 0;text-wrap:pretty}
.vv-c:hover .vv-c__t{color:var(--brand-accent)}
.vv-c__d{font-family:var(--font-sans);font-size:13px;color:var(--text-muted);margin:6px 0 0}
.vv-c__s{font-family:var(--font-sans);font-size:14px;line-height:1.55;color:var(--text-secondary);margin:8px 0 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* events: same columns, slightly quieter type */
.vv-c--ev .vv-c__t{font-size:19px;color:var(--text-primary)}
.vv-c--ev:hover .vv-c__t{color:var(--brand-navy)}
/* archive: restrained imagery, year prominent, watch arrow */
.vv-c--ar .ins-slot--sm,.vv-c--ar image-slot{opacity:.82;filter:saturate(.85)}
.vv-c--ar .vv-c__eb{color:var(--text-muted);font-size:12px;letter-spacing:.1em}
.vv-c--ar .vv-c__t{font-size:18px;color:var(--text-secondary)}
.vv-c--ar:hover .vv-c__t{color:var(--brand-navy)}
.vv-c--ar .vv-c__s{-webkit-line-clamp:2}
.vv-c__a{font-family:var(--font-sans);font-size:12.5px;font-weight:600;color:var(--sky-800);margin-top:10px}
/* full library: dense 3-col text-first utility grid */
.vv-x__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px}
.vv-x__r{display:block;text-decoration:none;color:inherit;padding:14px 0;border-bottom:1px solid rgba(0,43,84,.12)}
.vv-x__eb{font-family:var(--font-sans);font-weight:700;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);margin:0 0 5px}
.vv-x__t{font-family:var(--font-display);font-weight:500;font-size:16.5px;line-height:1.3;letter-spacing:-.008em;color:var(--brand-navy);margin:0;text-wrap:pretty}
.vv-x__t .ins-x__a{font-size:14px}
.vv-x__r:hover .vv-x__t{color:var(--brand-accent)}
/* Educational Series + Animated Learning Series: 4-up on wide viewports (Sep 2026) */
@container page (min-width:1001px){#education .vv-grid,#animated .vv-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 22px}}
@container page (max-width:1000px){.vv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vv-x__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container page (max-width:620px){.vv-grid{grid-template-columns:minmax(0,1fr);gap:34px}.vv-x__grid{grid-template-columns:minmax(0,1fr)}}
/* Editorial control strip: a thin navy rule, typography-driven controls, no filled ground.
   The strip reads as part of the publication layout, never as a toolbar. */
.vv-fbar{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:baseline;gap:16px 44px;margin:30px 0 0;padding:20px 0 18px;background:none;border-top:2px solid var(--brand-navy);border-bottom:1px solid rgba(215,218,223,.55)}
.vv-fbar__l{font-family:var(--font-sans);font-weight:700;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-eyebrow,#2E7FB8);margin-right:24px}
.vv-f{position:relative}
.vv-f__btn{display:flex;flex-direction:column;align-items:flex-start;gap:3px;background:none;border:0;padding:0 20px 0 0;cursor:pointer;position:relative;min-width:0;text-align:left;font-family:var(--font-sans)}
.vv-f__btn:focus-visible{outline:2px solid var(--brand-accent);outline-offset:4px}
.vv-f__l{font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.vv-f__v{font-size:15.5px;font-weight:500;color:var(--brand-navy);line-height:1.3;padding-bottom:4px;border-bottom:1px solid rgba(0,43,84,.28);transition:border-color 180ms cubic-bezier(.2,.6,.2,1)}
.vv-f__btn:hover .vv-f__v,.vv-f.is-open .vv-f__v{border-bottom-color:var(--brand-navy)}
.vv-f__ch{position:absolute;right:2px;bottom:11px;width:8px;height:5px;color:var(--text-muted);transition:transform 180ms cubic-bezier(.2,.6,.2,1)}
.vv-f__btn:hover .vv-f__ch{color:var(--brand-navy)}
.vv-f.is-open .vv-f__ch{transform:rotate(180deg)}
.vv-f__menu{display:none;position:absolute;left:0;top:calc(100% + 6px);z-index:30;min-width:210px;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 24px rgba(0,43,84,.10);padding:6px 0}
.vv-f.is-open .vv-f__menu{display:block}
.vv-f__menu .ins-x__f{display:block;width:100%;text-align:left;background:none;border:0;font-family:var(--font-sans);font-size:14px;color:var(--text-primary);padding:9px 16px;cursor:pointer}
.vv-f__menu .ins-x__f:hover{background:var(--brand-fog)}
.vv-f__menu .ins-x__f.is-on{color:var(--brand-navy);font-weight:600;background:none;position:relative;padding-left:28px}
.vv-f__menu .ins-x__f.is-on::before{content:"";position:absolute;left:14px;top:50%;transform:translateY(-50%);width:6px;height:6px;background:var(--brand-accent)}
.vv-f__menu .ins-x__f:focus-visible{outline:2px solid var(--brand-accent);outline-offset:-2px}
.vv-fbar__clear{background:none;border:0;font-family:var(--font-sans);font-size:12.5px;font-weight:600;color:var(--sky-800);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px}
.vv-fbar__clear:hover{color:var(--sun-700)}
.vv-fbar__count{margin:0 12px 0 auto;font-family:var(--font-sans);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-variant-numeric:tabular-nums;color:var(--text-muted)}
.vv .vv-x__grid{margin-top:26px}
@container page (max-width:900px){.vv-fbar{gap:14px 30px}.vv-fbar__count{margin-left:0;flex-basis:100%}}
@container page (max-width:620px){.vv-fbar{flex-direction:column;align-items:stretch;gap:18px}.vv-f__btn{width:100%}.vv-f__v{display:block;width:100%}.vv-f__ch{bottom:12px}.vv-fbar__count{margin:0;flex-basis:auto}}
/* legacy event/archive row styles removed in the thirds-grid revision */


/* ===== Sep 2026 Featured refinement: 7/5 lead + 3 stacked supporting items ===== */
.ins-spread--feat{display:grid;grid-template-columns:7fr 5fr;gap:0 52px;align-items:start}
.ins-spread--feat>.ins-lead__a{grid-column:1/2;padding-top:40px}
.ins-spread--feat>.ins-feat__side{grid-column:2/3;padding-top:40px}
.ins-feat__side{display:flex;flex-direction:column}
.ins-feat__i{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:start;text-decoration:none;padding:22px 0;border-top:1px solid var(--line)}
.ins-feat__i:first-child{padding-top:0;border-top:0}
.ins-feat__ph{width:150px}
.ins-feat__b .ins-meta{margin:0}
.ins-feat__b .ins-state{margin-top:6px}
.ins-feat__h{font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.18;letter-spacing:-.01em;color:var(--brand-navy);margin:7px 0 0}
.ins-feat__s{font-family:var(--font-sans);font-size:14px;line-height:1.5;color:var(--text-secondary);margin:7px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ins-feat__i:hover .ins-feat__h{color:var(--sun-700)}
@container page (max-width:900px){.ins-spread--feat{grid-template-columns:minmax(0,1fr);gap:0}.ins-spread--feat>.ins-lead__a,.ins-spread--feat>.ins-feat__side{grid-column:1/-1}.ins-feat__side{margin-top:30px;border-top:1px solid var(--line)}.ins-feat__i:first-child{padding-top:22px;border-top:0}}
@media(max-width:560px){.ins-feat__i{grid-template-columns:120px 1fr;gap:14px}.ins-feat__ph{width:120px}}


/* ===== Sep 15, 2026 launch hub: curated audience shelves, historical labels, market perspective, explore ===== */
.ins-shelf__lead{margin:14px 0 0;font-size:15px;line-height:1.58;color:var(--text-secondary);max-width:32ch}
.ins-shelf__head .eyebrow{margin:14px 0 0}
.ins-shelf__head .eyebrow+.ins-h2{margin-top:10px}
.ins-hist{display:inline-block;margin:8px 0 0;font-family:var(--font-sans);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sky-800)}
.ins-hist--inv{color:var(--brand-sky);margin:6px 0 0}
/* Market perspective: compact two-story single column */
.ins-mkt__list{grid-template-columns:minmax(0,1fr)}
.ins-mkt__sub{grid-template-columns:180px minmax(0,1fr)}
.ins-mkt__sub .ins-row__h{font-size:20px}
.ins-mkt__hist{grid-column:1 / -1;margin-top:8px;padding-top:18px}
.ins-mkt__hh{margin:0 0 4px;font-family:var(--font-sans);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.ins-mkt__h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;padding:13px 0;border-bottom:1px solid rgba(0,43,84,.14);text-decoration:none}
.ins-mkt__ht{font-family:var(--font-display);font-weight:500;font-size:17px;line-height:1.25;color:var(--brand-navy)}
.ins-mkt__h:hover .ins-mkt__ht{color:var(--brand-accent)}
.ins-mkt__hm{font-family:var(--font-sans);font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--text-muted)}
.ins-x__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 40px}
.ins-x__head{grid-column:1 / -1;display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ins-x__head .ins-h2{margin:10px 0 0}
.ins-x__head .eyebrow{margin:14px 0 0;width:100%}
.ins-x__head .rule48{display:block}
.ins-x__count{margin:0;font-family:var(--font-sans);font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--text-muted)}
/* The library uses the sitewide vv-fbar strip; sticky on desktop so the controls stay at hand
   while the list scrolls (opaque ground only while pinned, never a filled block). */
@container page (min-width:901px){.vv-fbar--sticky{position:sticky;top:96px;background:var(--white,#fff);z-index:5}}
.ins-x__f{min-height:40px;padding:9px 10px;background:none;border:0;border-bottom:2px solid transparent;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--text-secondary);cursor:pointer}
.ins-x__f:hover{color:var(--brand-navy)}
.ins-x__f.is-on{color:var(--brand-navy);border-bottom-color:var(--brand-navy)}
.ins-x__list{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
.ins-x__r{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;border-bottom:1px solid rgba(0,43,84,.14);text-decoration:none;color:inherit}
.ins-x__r .ins-meta{margin:0}
.ins-x__r .ins-hist{margin:4px 0 0}
.ins-x__t{font-family:var(--font-display);font-weight:500;font-size:17.5px;line-height:1.25;letter-spacing:-.01em;color:var(--brand-navy);margin:6px 0 0;text-wrap:pretty}
.ins-x__r:hover .ins-x__t{color:var(--brand-accent)}
.ins-x__a{font-family:var(--font-sans);font-size:15px;color:var(--brand-navy);flex:none;transition:transform 180ms cubic-bezier(.2,.6,.2,1)}
.ins-x__r:hover .ins-x__a{transform:translateX(4px);color:var(--brand-accent)}
.ins-x__r[data-ins-hidden="true"]{display:none}
.ins-x__dev{grid-column:1 / -1}
.ins-filtering .ins-x__r,.ins-filtering .ins-wl__c,.ins-filtering .ins-ev__r{transition:opacity 200ms cubic-bezier(.2,.6,.2,1)}
@container page (max-width:900px){
  .ins-x__list{grid-template-columns:minmax(0,1fr)}
  .ins-shelf__lead{max-width:52ch}
}
@container page (max-width:620px){
  .ins-x__grp{width:100%}
  .ins-x__t{font-size:16px}
}

.ins-feat__i .ins-slot__f{display:none}/* hide the dev-brief caption in the small featured thumbnail (avoids a 5px clip; real thumbnails fill the slot) */
/* Featured supporting column ONLY: smaller play overlay (the filled 68px indicator is too large
   at this card size). Scoped to .ins-feat__i; keeps translucent Navy / white border / white
   triangle + centering from the base filled rule. Does NOT touch Watch & Learn, other video
   cards, the video-detail player, or the Featured lead. */
.ins-feat__i .ins-slot--filled .ins-slot__play,.ins-feat__i .ins-slot--sm .ins-slot__play{width:34px;height:34px;z-index:2;background:rgba(0,43,84,.62);border:1px solid #fff}
.ins-feat__i .ins-slot--filled .ins-slot__play::after,.ins-feat__i .ins-slot--sm .ins-slot__play::after{content:"";left:13px;top:10px;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;opacity:1}
@container page (max-width:700px){
  .ins-feat__i .ins-slot--filled .ins-slot__play,.ins-feat__i .ins-slot--sm .ins-slot__play{width:30px;height:30px}
  .ins-feat__i .ins-slot--filled .ins-slot__play::after,.ins-feat__i .ins-slot--sm .ins-slot__play::after{left:11px;top:9px;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
}