/* ============================================================================
   /insights — the Insights hub (v4, simplified image grid)
   Scoped under `.hub` (on <main id="main" class="hub">) so nothing leaks into the
   shared nav, footer, or the article template. White + #F5F5F7 grounds, periwinkle
   the only full-bleed colour, 2px cards / 4px buttons, display headings weight 400.
   ============================================================================ */

.hub{
  --ink:#07080F; --ink-2:#12141D;
  --white:#FFFFFF; --grey:#F5F5F7; --grey-2:#F2F2F4;
  --peri:#5B5BF5; --peri-dk:#4A4ADB; --peri-lt:#B9B9FF;
  --line:#E4E4E8; --line-dk:#2A2C3B; --line-peri:rgba(255,255,255,.26);
  --body:#4A4A55; --mute:#8A8A96; --mute-dk:#9A9CAD;
  --sans:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:2px; --rb:4px;
  background:var(--white); color:var(--ink); font-family:var(--sans);
}
.hub *{box-sizing:border-box}
.hub a{color:inherit;text-decoration:none}
.hub :focus-visible{outline:2px solid var(--peri);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.hub *{transition:none!important}}

.hub .wrap{max-width:1200px;margin:0 auto;padding:0 40px}
@media(max-width:640px){.hub .wrap{padding:0 22px}}
.hub .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--peri);display:block}
.hub .h-lg{font-size:clamp(34px,4.6vw,54px);line-height:1.12;letter-spacing:-.03em;font-weight:400;margin:22px 0 0}
.hub .h-md{font-size:clamp(26px,3.2vw,34px);line-height:1.18;letter-spacing:-.028em;font-weight:400;margin:0}
.hub .peri{color:var(--peri)}
.hub .dek{font-size:15.5px;line-height:1.68;color:var(--body);max-width:56ch;margin:18px 0 0}
.hub .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* HERO + SEARCH */
.hub .hub-hero{padding:84px 0 24px}
.hub .hub-hero .h-lg{max-width:17ch}
.hub .hub-search{margin:34px 0 0;max-width:520px}
.hub .search-box{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:var(--rb);padding:0 15px;background:var(--white);transition:border-color .15s ease}
.hub .search-box:focus-within{border-color:var(--peri)}
.hub .search-box svg{width:18px;height:18px;color:var(--mute);flex:none}
.hub .search-box input{flex:1;min-width:0;border:0;outline:none;background:none;padding:13px 0;font-family:var(--sans);font-size:14.5px;color:var(--ink)}
.hub .search-box input::placeholder{color:var(--mute)}
.hub .search-box input::-webkit-search-cancel-button{-webkit-appearance:none}
/* Results line — empty at rest (hidden takes no space), announced when it fills. */
.hub .hub-results{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:16px 0 0}
.hub .hub-results[hidden]{display:none}

/* ARTICLE + CASE GRID (shared card) */
.hub .grid-sec{padding:26px 0 90px}
.hub .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 26px}
.hub .card{display:flex;flex-direction:column}
.hub .card:hover .card-t{color:var(--peri)}
.hub .thumb{aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--grey)}
.hub .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hub .card-t{font-size:20px;font-weight:500;line-height:1.28;letter-spacing:-.022em;margin:18px 0 0;transition:color .15s ease;max-width:26ch}
.hub .card-a{font-size:14.5px;line-height:1.6;color:var(--body);margin:10px 0 0}
.hub .card-a b{color:var(--ink);font-weight:500}
.hub .grid-empty{font-size:14.5px;line-height:1.6;color:var(--body);margin:8px 0 0}
.hub .grid-empty a{color:var(--peri);text-decoration:underline;text-underline-offset:2px}
.hub .grid-empty[hidden]{display:none}
@media(max-width:980px){.hub .grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.hub .grid{grid-template-columns:1fr;gap:38px}}

/* CASE STUDIES */
.hub .cases{background:var(--grey);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:80px 0 88px}
.hub .cases[hidden]{display:none}
.hub .cases .grid{margin-top:38px}
.hub .case-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--peri);margin-top:16px;display:block}
.hub .cases .card-t{margin-top:8px;font-size:19px}

/* GLOSSARY — full-bleed periwinkle */
.hub .gloss{background:var(--peri);color:#fff;padding:84px 0}
.hub .gloss-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start}
.hub .gloss .eyebrow{color:rgba(255,255,255,.7)}
.hub .gloss .h-md{color:#fff;margin-top:14px}
.hub .gloss .h-md .accent{color:#fff;font-style:italic}
.hub .gloss-copy p{font-size:14.5px;line-height:1.65;color:rgba(255,255,255,.84);margin:16px 0 0;max-width:42ch}
.hub .gloss .lnk{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-top:22px;display:inline-block;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:3px}
.hub .chips{display:flex;flex-wrap:wrap;gap:8px}
.hub .chip{font-size:13.5px;border:1px solid var(--line-peri);border-radius:var(--r);padding:9px 14px;color:#fff;transition:background .14s ease}
.hub .chip:hover{background:rgba(255,255,255,.14)}
@media(max-width:820px){.hub .gloss-grid{grid-template-columns:1fr;gap:28px}}

/* SUBSCRIBE STRIP */
.hub .sub{background:var(--grey);border-top:1px solid var(--line);padding:44px 0 48px}
.hub .sub-in{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.hub .sub h3{font-size:20px;font-weight:500;letter-spacing:-.022em;margin:10px 0 0;line-height:1.25}
.hub .sub p{font-size:13.5px;line-height:1.6;color:var(--body);margin:8px 0 0;max-width:52ch}
.hub .sub p a{color:var(--peri);text-decoration:underline;text-underline-offset:2px}
.hub .sub-cta{display:inline-flex;align-items:center;gap:8px;background:var(--peri);color:#fff;border-radius:var(--rb);padding:13px 24px;font-size:14px;font-weight:500;white-space:nowrap;transition:background .15s ease}
.hub .sub-cta:hover{background:var(--peri-dk)}
.hub .sub-right{min-width:0}
.hub .form{display:flex;gap:9px}
.hub .form input[type=email]{flex:1;min-width:0;background:var(--white);border:1px solid var(--line);border-radius:var(--rb);padding:12px 14px;color:var(--ink);font-family:var(--sans);font-size:14px}
.hub .form input::placeholder{color:var(--mute)}
.hub .form input:focus{border-color:var(--peri);outline:none}
.hub .form input.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.hub .form button{background:var(--peri);color:#fff;border:0;border-radius:var(--rb);padding:12px 22px;font-family:var(--sans);font-size:14px;font-weight:500;cursor:pointer}
.hub .form button:hover{background:var(--peri-dk)}
.hub .sub-feedback{font-size:13px;color:var(--body);margin:10px 0 0}
.hub .sub-feedback[hidden]{display:none}
@media(max-width:860px){.hub .sub-in{grid-template-columns:1fr;gap:22px}.hub .sub-right{min-width:0;width:100%}}