/* Insights hub + article (CHANGELOG #39). The block below is the design's own stylesheet, copied unchanged from the
   approved Claude Design export "Insights & Perspectives" (Toni, 2026-11-11). Additions for real content follow it,
   under "Not in the design". */
.in-h{background:var(--soft);padding:132px 0 0;position:relative}
.in-hg{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(32px,6vw,96px);align-items:end;padding:28px 0 clamp(56px,6vw,96px)}
.in-h h1{font-size:clamp(52px,8.4vw,136px);line-height:.88;letter-spacing:-.055em;color:var(--navy);margin-top:22px}
.in-h h1 em{font-style:normal;color:var(--orange)}
.in-sub{font-family:'Bricolage Grotesque',sans-serif;font-weight:500;font-size:clamp(20px,1.8vw,26px);line-height:1.35;letter-spacing:-.01em;max-width:30ch;margin-top:28px;color:var(--black)}
.in-idx{border-top:3px solid var(--navy)}
.in-idx small{display:block;padding:12px 0;font:700 12px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:#5b6066}
.in-idx a{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:12px 0;border-top:1.5px solid rgba(25,56,77,.2);font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:19px;letter-spacing:-.02em;color:var(--navy);transition:padding .35s var(--ease),color .2s}
.in-idx a:hover{color:var(--orange);padding-left:8px}.in-idx a span{font-size:13px;color:#5b6066;font-weight:600;font-family:Manrope,sans-serif}
.in-smp{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font:600 13px/1.4 Manrope,sans-serif;color:#4a4f55}.in-smp i{font:800 11px 'Bricolage Grotesque';letter-spacing:.14em;text-transform:uppercase;background:var(--black);color:#fff;padding:3px 8px;font-style:normal}
@media(max-width:900px){.in-h{padding-top:108px}.in-hg{grid-template-columns:minmax(0,1fr);align-items:start}}

/* placeholder imagery */
.ph{position:relative;overflow:hidden;background:var(--navy);color:#fff;aspect-ratio:var(--ar,16/10);isolation:isolate}
.ph::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 2px,transparent 2px 14px);z-index:-1}
.ph::after{content:"";position:absolute;right:-6%;bottom:-14%;width:46%;aspect-ratio:1;background:var(--c2,var(--orange));clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);opacity:.92;transition:transform .8s var(--ease)}
.ph:hover::after,a:hover>.ph::after{transform:rotate(90deg) scale(1.06)}
.ph b{position:absolute;left:14px;bottom:12px;font:600 11px/1.3 ui-monospace,Menlo,monospace;letter-spacing:.04em;opacity:.8;max-width:70%;font-weight:600}
.ph.o{background:var(--orange);--c2:var(--navy)}.ph.t{background:var(--teal);--c2:var(--navy)}.ph.d{background:var(--navy-d,#122B3B);--c2:var(--teal)}.ph.s{background:#e4e3e1;color:var(--navy);--c2:var(--orange)}.ph.s::before{background:repeating-linear-gradient(135deg,rgba(25,56,77,.08) 0 2px,transparent 2px 14px)}

/* meta */
.in-m{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font:600 14px Manrope,sans-serif;color:#5b6066}
.in-m i{font-style:normal;width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.6}
.cat{display:inline-block;font:800 11px 'Bricolage Grotesque';letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.cat.chip{background:var(--navy);color:#fff;padding:4px 10px}

/* featured */
.in-f{padding:clamp(48px,6vw,88px) 0 clamp(40px,5vw,72px)}
.in-fg{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:center}
.in-fg .ph{--ar:4/3;box-shadow:14px 14px 0 var(--black);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.in-fg a.im:hover .ph{transform:translate(-5px,-5px);box-shadow:19px 19px 0 var(--orange)}
.in-ft{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.in-ft h2{font-size:clamp(34px,4.2vw,64px);line-height:.96;letter-spacing:-.045em;color:var(--navy)}
.in-ft p{font-size:19px;max-width:44ch;color:#33383d}
.in-ft .tag{display:inline-flex;align-items:center;gap:10px;font:700 13px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:var(--orange)}.in-ft .tag::before{content:"";width:22px;height:3px;background:currentColor}
@media(max-width:900px){.in-fg{grid-template-columns:minmax(0,1fr)}.in-fg .ph{box-shadow:8px 8px 0 var(--black)}}

/* topics */
.in-tp{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-top:2px solid var(--navy);border-bottom:2px solid var(--navy);padding:0}
.in-tp .wrap{display:flex;align-items:center;gap:24px}
.in-tp label{flex:none;font:800 12px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:#5b6066}
.in-tl{display:flex;overflow-x:auto;scrollbar-width:none;gap:0;margin:0 calc(var(--px)*-1);padding:0 var(--px);flex:1}.in-tl::-webkit-scrollbar{display:none}
.in-tl button{flex:none;border:0;background:none;padding:18px 18px;font:700 16px 'Bricolage Grotesque',sans-serif;letter-spacing:-.01em;color:var(--navy);cursor:pointer;position:relative;white-space:nowrap;min-height:56px;transition:color .2s}
.in-tl button::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:4px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.in-tl button:hover{color:var(--orange)}.in-tl button[aria-pressed=true]{color:var(--orange)}.in-tl button[aria-pressed=true]::after{transform:none}
.in-tl button:focus-visible{outline:3px solid var(--orange);outline-offset:-3px}
@media(max-width:760px){.in-tp label{display:none}}

/* latest */
.in-l{padding:clamp(48px,6vw,88px) 0 clamp(56px,7vw,104px)}
.in-lh{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px;margin-bottom:clamp(28px,3.4vw,48px)}
.in-lh h2{font-size:clamp(38px,5vw,76px);letter-spacing:-.05em;color:var(--navy);margin-top:14px}.in-lh p{font-weight:600;color:#5b6066}
.in-gr{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(20px,2.4vw,36px);grid-auto-flow:dense}
.cd{display:flex;flex-direction:column;gap:14px;color:var(--black);position:relative;grid-column:span 4;transition:opacity .4s}
.cd[hidden]{display:none}
.cd h3{font-size:clamp(22px,2vw,28px);line-height:1.08;letter-spacing:-.03em;color:var(--navy);transition:color .25s;text-wrap:balance}
.cd:hover h3{color:var(--orange)}.cd:hover{color:var(--black)}
.cd p{font-size:16px;color:#4a4f55;max-width:46ch}
.cd .ph{transition:transform .5s var(--ease),box-shadow .5s var(--ease)}.cd:hover .ph{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--orange)}
.cd.l{grid-column:span 7}.cd.l h3{font-size:clamp(30px,3.4vw,48px);letter-spacing:-.04em}.cd.l .ph{--ar:16/9}
.cd.m{grid-column:span 5}
.cd.ty{grid-column:span 5;background:var(--navy);color:#fff;padding:clamp(24px,2.6vw,36px);justify-content:space-between;gap:28px;min-height:340px;border:0;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.cd.ty:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--orange);color:#fff}
.cd.ty h3{color:#fff;font-size:clamp(30px,3.2vw,46px);line-height:1;letter-spacing:-.045em}.cd.ty:hover h3{color:#fff}
.cd.ty .cat{color:#ff8a52}.cd.ty .in-m{color:rgba(255,255,255,.78)}.cd.ty p{color:rgba(255,255,255,.86)}
.cd.ty.o{background:var(--orange)}.cd.ty.o .cat,.cd.ty.o .in-m,.cd.ty.o p{color:#fff}.cd.ty.o:hover{box-shadow:8px 8px 0 var(--navy)}
.cd.ty .q{font:800 120px/.6 'Bricolage Grotesque';opacity:.18;height:48px;margin-top:6px}
.cd.tx{grid-column:span 4;border-top:3px solid var(--navy);padding-top:18px}
.in-em{grid-column:1/-1;background:#fff;border:2px dashed var(--grey);padding:48px 24px;text-align:center;color:#5b6066;font-weight:600}.in-em[hidden]{display:none}
.in-em b{display:block;font:800 26px 'Bricolage Grotesque';letter-spacing:-.03em;color:var(--navy);margin-bottom:6px}
.in-mo{display:flex;justify-content:center;margin-top:clamp(32px,4vw,56px)}
.in-mo button{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:17px;background:#fff;color:var(--navy);border:2px solid var(--navy);padding:16px 28px;cursor:pointer;transition:background .3s,color .3s,box-shadow .3s}
.in-mo button:hover{background:var(--navy);color:#fff;box-shadow:6px 6px 0 var(--orange)}.in-mo[hidden]{display:none}
@media(max-width:1000px){.cd,.cd.m,.cd.ty,.cd.tx{grid-column:span 6}.cd.l{grid-column:1/-1}}
@media(max-width:620px){.cd,.cd.l,.cd.m,.cd.ty,.cd.tx{grid-column:1/-1}.cd.ty{min-height:0}}

/* spotlight */
.in-sp{background:var(--navy-d,#122B3B);color:#fff;padding:clamp(72px,9vw,136px) 0}
.in-spg{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,104px);align-items:start}
.in-sp h2{font-size:clamp(38px,5vw,76px);letter-spacing:-.05em;color:#fff;margin:16px 0 22px}.in-sp .intro{font-size:19px;color:rgba(255,255,255,.86);max-width:36ch}
.in-sp .eb{color:#ff8a52}
.in-sl{border-top:2px solid #fff}
.in-sl a{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:8px 22px;align-items:start;padding:26px 0;border-bottom:1.5px solid rgba(255,255,255,.28);color:#fff;position:relative;transition:padding .45s var(--ease),background .3s}
.in-sl a:hover{padding-left:16px;padding-right:16px;background:var(--orange);color:#fff}
.in-sl .n{font:800 15px 'Bricolage Grotesque';color:#ff8a52;padding-top:6px;transition:color .3s}.in-sl a:hover .n{color:#fff}
.in-sl .ty{font:800 11px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.85);display:block;margin-bottom:8px}
.in-sl h3{font-size:clamp(24px,2.8vw,40px);letter-spacing:-.04em;line-height:1;color:#fff;text-wrap:balance}.in-sl p{margin-top:10px;font-size:16px;color:rgba(255,255,255,.82);max-width:48ch}
.in-sl .ar{font:700 26px 'Bricolage Grotesque';transition:transform .4s var(--ease);padding-top:2px}.in-sl a:hover .ar{transform:translateX(6px)}
.in-sl .tm{display:block;font:600 13px Manrope;color:rgba(255,255,255,.78);text-align:right;margin-top:6px}
@media(max-width:900px){.in-spg{grid-template-columns:minmax(0,1fr)}}@media(max-width:560px){.in-sl a{grid-template-columns:36px minmax(0,1fr)}.in-sl .ar,.in-sl .tm{display:none}}

/* subscribe */
.in-sb{background:var(--orange);color:#fff;padding:clamp(64px,8vw,120px) 0;position:relative;overflow:hidden}
.in-sb::after{content:"";position:absolute;right:-8vw;top:50%;width:min(44vw,560px);aspect-ratio:1;background:var(--navy);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);transform:translateY(-50%);opacity:.95}
.in-sbg{position:relative;z-index:1;max-width:640px}
.in-sb h2{color:#fff;font-size:clamp(40px,5.6vw,88px);letter-spacing:-.05em;margin:16px 0 20px}.in-sb .eb{color:#fff}.in-sb p{font-size:20px;color:#fff;max-width:36ch}
.in-fm{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;max-width:560px}
.in-fm input{flex:1 1 240px;min-width:0;font:500 17px Manrope,sans-serif;padding:17px 18px;border:2px solid var(--black);background:#fff;color:var(--black);border-radius:0;outline:0}
.in-fm input:focus{box-shadow:5px 5px 0 var(--black)}
.in-fm .btn{background:var(--black)}.in-fm .btn::before{background:var(--navy)}
.in-ok{display:none;margin-top:32px;font:800 24px 'Bricolage Grotesque';letter-spacing:-.02em}.in-sb.done .in-fm{display:none}.in-sb.done .in-ok{display:block}
.in-fn{margin-top:14px;font-size:14px;font-weight:600;color:#fff}
@media(max-width:900px){.in-sb::after{width:70vw;right:-30vw;top:auto;bottom:-20vw;transform:none;opacity:.5}}

/* pathways */
.in-pw{padding:clamp(64px,8vw,112px) 0;background:#fff}
.in-pw h2{font-size:clamp(32px,4vw,56px);letter-spacing:-.045em;color:var(--navy);margin:14px 0 clamp(24px,3vw,40px);max-width:20ch}
.in-pl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:3px solid var(--navy)}
.in-pl a{display:flex;flex-direction:column;gap:10px;padding:26px 26px 30px 0;color:var(--navy);transition:background .35s,color .35s,padding .4s var(--ease)}
.in-pl a+a{border-left:1.5px solid rgba(25,56,77,.2);padding-left:26px}
.in-pl a:hover{background:var(--navy);color:#fff;padding-left:26px}.in-pl a:hover small{color:rgba(255,255,255,.85)}
.in-pl b{font:800 clamp(24px,2.4vw,34px) 'Bricolage Grotesque';letter-spacing:-.04em;line-height:1}.in-pl small{font-size:15px;color:#4a4f55;font-weight:500;max-width:30ch}
.in-pl span{font:700 15px 'Bricolage Grotesque';color:var(--orange);margin-top:auto;padding-top:14px;transition:transform .4s var(--ease)}.in-pl a:hover span{transform:translateX(6px);color:#ff8a52}
@media(max-width:800px){.in-pl{grid-template-columns:1fr}.in-pl a,.in-pl a+a{padding:22px 0;border-left:0;border-bottom:1.5px solid rgba(25,56,77,.2)}.in-pl a:hover{padding-left:16px;padding-right:16px}}

/* article */
.ar-h{background:var(--soft);padding:132px 0 clamp(40px,5vw,72px)}
.ar-bc{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font:600 14px Manrope;color:#5b6066;min-height:44px}.ar-bc a{color:var(--navy);display:inline-flex;align-items:center;min-height:44px}.ar-bc a:hover{color:var(--orange)}.ar-bc span[aria-hidden]{opacity:.5}
.ar-hg{max-width:1040px;margin-top:20px}
.ar-h h1{font-size:clamp(42px,6.6vw,104px);line-height:.92;letter-spacing:-.05em;color:var(--navy);margin:18px 0 28px;text-wrap:balance}
.ar-in{font-family:'Bricolage Grotesque',sans-serif;font-weight:500;font-size:clamp(22px,2.2vw,32px);line-height:1.3;letter-spacing:-.015em;max-width:34ch}
.ar-by{display:flex;flex-wrap:wrap;gap:16px 40px;margin-top:36px;padding-top:20px;border-top:2px solid var(--navy)}
.ar-by div{display:flex;flex-direction:column;gap:2px}.ar-by small{font:700 11px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:#5b6066}.ar-by b{font:700 17px 'Bricolage Grotesque';color:var(--navy)}
.ar-fi{margin:0;padding:0}.ar-fi .wrap{padding-top:clamp(24px,3vw,40px)}.ar-fi .ph{--ar:21/9;box-shadow:14px 14px 0 var(--black)}
.ar-fi figcaption{font-size:14px;color:#5b6066;margin-top:22px;font-weight:600}
@media(max-width:700px){.ar-fi .ph{--ar:4/3;box-shadow:8px 8px 0 var(--black)}.ar-h{padding-top:108px}}
.ar-b{padding:clamp(48px,6vw,88px) 0 clamp(56px,7vw,96px)}
.ar-bg{display:grid;grid-template-columns:240px minmax(0,700px) 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.ar-toc{position:sticky;top:110px;font-size:14px}.ar-toc b{display:block;font:800 12px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:#5b6066;padding-bottom:12px;border-bottom:3px solid var(--navy);margin-bottom:6px}
.ar-toc a{display:block;padding:9px 0 9px 14px;border-left:3px solid transparent;margin-left:-3px;color:var(--navy);font-weight:600;line-height:1.35;transition:color .2s,border-color .2s}
.ar-toc a:hover{color:var(--orange)}.ar-toc a.on{border-left-color:var(--orange);color:var(--orange)}
.ar-sh{margin-top:26px;display:flex;flex-direction:column;gap:6px}.ar-sh a,.ar-sh button{all:unset;cursor:pointer;color:var(--navy);font:700 14px 'Bricolage Grotesque';padding:6px 0;min-height:32px;box-sizing:border-box}.ar-sh a:hover,.ar-sh button:hover{color:var(--orange)}
.prose{font-size:20px;line-height:1.72;color:#22272b}
.prose>*+*{margin-top:1.4em}
.prose h2{font-size:clamp(30px,3.2vw,42px);letter-spacing:-.04em;line-height:1.02;color:var(--navy);margin-top:2.2em;scroll-margin-top:110px}
.prose h3{font-size:24px;letter-spacing:-.025em;color:var(--navy);margin-top:1.8em}
.prose a{color:var(--orange);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}.prose a:hover{color:var(--navy)}
.prose ul,.prose ol{padding-left:0;display:grid;gap:.7em}.prose ul li{padding-left:30px;position:relative}.prose ul li::before{content:"";position:absolute;left:2px;top:.62em;width:10px;height:10px;background:var(--orange);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.prose ol{counter-reset:o}.prose ol li{counter-increment:o;padding-left:44px;position:relative}.prose ol li::before{content:counter(o);position:absolute;left:0;top:.1em;width:30px;height:30px;border:1.5px solid var(--navy);border-radius:50%;font:700 14px/27px 'Bricolage Grotesque';text-align:center;color:var(--navy)}
.prose blockquote{margin:2.2em 0;padding:0;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:clamp(28px,3vw,40px);line-height:1.08;letter-spacing:-.035em;color:var(--navy);position:relative;padding-top:34px}
.prose blockquote::before{content:"";position:absolute;top:0;left:0;width:48px;height:8px;background:var(--orange)}
.prose blockquote cite{display:block;margin-top:16px;font:600 15px Manrope;font-style:normal;letter-spacing:0;color:#5b6066}
.prose figure{margin:2.2em 0}.prose figure .ph{--ar:16/9}.prose figcaption{font-size:14px;color:#5b6066;margin-top:12px;font-weight:600}
.prose .note{background:var(--soft);padding:22px 26px;font-size:17px;line-height:1.6;border-top:4px solid var(--navy)}.prose .note b{font:800 12px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:var(--orange);display:block;margin-bottom:6px}
.prose>p:first-child::first-line{font-weight:700}
.ar-end{margin-top:3em;padding-top:28px;border-top:2px solid var(--navy);display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center}
.ar-av{width:64px;height:64px;border-radius:50%;background:var(--navy);display:grid;place-items:center;overflow:hidden}.ar-av img{width:70%;height:auto;display:block}
.ar-end b{font:800 20px 'Bricolage Grotesque';color:var(--navy);display:block;letter-spacing:-.02em}.ar-end span{font-size:15px;color:#4a4f55;font-weight:500;line-height:1.5;display:block}
.ar-sv{margin-top:36px;background:var(--navy);color:#fff;padding:26px 28px;display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;box-shadow:8px 8px 0 var(--orange)}
.ar-sv div{flex:1 1 260px}.ar-sv small{font:800 11px 'Bricolage Grotesque';letter-spacing:.18em;text-transform:uppercase;color:#ff8a52}.ar-sv b{display:block;font:800 24px/1.1 'Bricolage Grotesque';letter-spacing:-.03em;margin-top:6px}
.ar-sv .btn{background:var(--orange)}.ar-sv .btn::before{background:#fff}.ar-sv .btn:hover{color:var(--navy)}
.ar-rl{background:var(--soft);padding:clamp(56px,7vw,104px) 0}
.ar-rl .in-lh{margin-bottom:32px}
.ar-rl .in-gr .cd{grid-column:span 4}
.ar-bk{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:40px;padding-top:20px;border-top:2px solid var(--navy)}
@media(max-width:1100px){.ar-bg{grid-template-columns:minmax(0,700px);justify-content:center}.ar-toc{position:static;border:1.5px solid rgba(25,56,77,.25);padding:16px 20px;background:#fff}.ar-toc b{border:0;padding-bottom:4px}.ar-sh{flex-direction:row;gap:18px;flex-wrap:wrap}.ar-rl .in-gr .cd{grid-column:span 6}}
@media(max-width:620px){.prose{font-size:18px}.ar-rl .in-gr .cd{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.ph::after,.cd,.cd .ph,.in-sl a{transition:none!important}}

/* ── Not in the design ─────────────────────────────────────────────────────────────────────────────────────────────
   The design draws every image as a placeholder (.ph, a coloured panel with a diamond). A real image sits inside the
   same frame, same ratio, same shadow and hover, and the placeholder art is hidden behind it. An article without an
   image in an image slot keeps the design's placeholder art, without its label. */
.ph.img::before,.ph.img::after{display:none}
.ph.img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ar-av.ph-img img{width:100%;height:100%;object-fit:cover}
/* The article body: elements the design's .prose does not style yet. */
.prose figure img{display:block;width:100%;height:auto}
.prose hr{border:0;height:16px;background:var(--k) repeat-x 0 center/120px 16px}
.prose li>p{margin:0}
/* A 30-minute preview from the workspace. */
.ar-pv{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--orange);color:#fff;font:600 15px Manrope,sans-serif;padding:12px 0}