/* news-content-v2/index.src.html, extracted by tools/extract_news.py. Do not edit here. */
/* ============ TOKENS ============ */
:root{
  --navy:#002F6D; --deep:#00224F; --night:#001A3E; --blue:#0074C8; --bright:#39B5E6; --cyan:#4FD1DC;
  --teal:#0AA5B5; --violet:#7C7CCE; --royal:#5E7FD0;
  --mist:#E9EEF0; --ink:#33404F; --mute:#5B6B7C; --line:rgba(0,46,109,.16); --line2:rgba(0,46,109,.09);
  --ff:'Orkney','Hanken Grotesk',system-ui,sans-serif;
  --gut:clamp(1.25rem,4.5vw,4rem); --max:1360px;
  --s3:clamp(2.6rem,5vw,4rem); --s4:clamp(4rem,8vw,7rem);
  --ease:cubic-bezier(.22,1,.36,1);
  --skew:104deg; /* the M's own diagonal */
  /* Joint Ventures: the homepage card's grey. #878787 marks squares and rules on light grounds
     (3.6:1 on white); #C9C9C9 draws lines on the graphite panels; --acc-ink carries accent text on
     light grounds (6.5:1 on white, 5.6:1 on mist). The grounds are graphite, not navy. */
  --acc:#878787;
  --acc-light:#C9C9C9;
  --acc-soft:rgba(135,135,135,.55);
  --acc-ghost:rgba(135,135,135,.2);
  --acc-ink:#5E5E5E;
  --tnight:#16181B; --tdeep:#24272B;
  --band-1:#FFFFFF;
  --band-2:var(--mist);
  --hero-grad:linear-gradient(152deg, #16181B 0%, #24272B 55%, #30343A 100%);
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth; overflow-x:clip}
/* anchor targets land clear of the sticky header */
section[id]{scroll-margin-top:90px}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{font-family:var(--ff); font-size:1.02rem; line-height:1.6; color:var(--ink); background:#fff;
  -webkit-font-smoothing:antialiased; overflow-x:clip; touch-action:manipulation}
h1,h2,h3{color:var(--navy); letter-spacing:0; text-wrap:balance; font-weight:700}
h2{font-weight:300; font-size:clamp(2rem,3.8vw,3.2rem); line-height:1.1; letter-spacing:-.016em}
p{text-wrap:pretty}
a{color:var(--blue)}
img{max-width:100%; display:block}
.wrap{max-width:var(--max); margin-inline:auto; padding-inline:var(--gut)}
.skip{position:fixed; top:0; left:-200%; z-index:900; background:var(--navy); color:#fff; padding:.8rem 1.2rem; text-decoration:none}
.skip:focus-visible{left:0}
:focus-visible{outline:2px solid var(--blue); outline-offset:3px}
.dkbg :focus-visible{outline-color:var(--cyan)}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.num{font-variant-numeric:tabular-nums}

/* reveals: visible by default; .js gates them off pre-view */
.io{opacity:1; transform:none}
html.js:not(.rm) .io:not(.in){opacity:0; transform:translateY(16px)}
html.js:not(.rm) .io{transition:opacity .8s var(--ease), transform .8s var(--ease)}
html.js:not(.rm) .stag > *{transition:opacity .7s var(--ease) var(--d,0ms), transform .7s var(--ease) var(--d,0ms)}
html.js:not(.rm) .stag:not(.in) > *{opacity:0; transform:translateY(14px)}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:.6rem; font-family:var(--ff); font-size:.98rem; font-weight:700;
  padding:.95rem 1.5rem; text-decoration:none; border:1px solid var(--navy); color:var(--navy); background:transparent;
  cursor:pointer; transition:background .3s ease, color .3s ease, border-color .3s ease}
.btn:hover{background:var(--navy); color:#fff}
.btn.solid{background:var(--navy); color:#fff}
.btn.solid:hover{background:var(--blue); border-color:var(--blue)}
.btn.inv{border-color:#fff; color:#fff}
.btn.inv:hover{background:#fff; color:var(--navy)}
.btn.inv.solid{background:#fff; color:var(--navy); border-color:#fff}
.btn.inv.solid:hover{background:var(--cyan); border-color:var(--cyan)}
.arw{display:inline-block; transition:transform .35s var(--ease)}
.btn:hover .arw,a:hover .arw{transform:translateX(5px)}

/* ============ HEADER: white, sticky ============ */
.hdr{position:sticky; top:0; z-index:600; background:#fff; border-bottom:1px solid var(--line2)}
.hdr-in{max-width:1500px; margin-inline:auto; padding:.95rem var(--gut); display:flex; align-items:center; gap:2rem}
.lg{display:flex; flex:none; position:relative}
.lg img{height:36px; width:auto; display:block}
.nav{display:flex; align-items:center; gap:1.7rem; margin-left:auto}
.nav > a,.nav button{font-family:var(--ff); font-size:.98rem; font-weight:500; color:var(--navy); text-decoration:none;
  background:none; border:0; -webkit-appearance:none; appearance:none; cursor:pointer; padding:.35rem 0;
  transition:color .3s ease}
.nav > a:hover,.nav button:hover{color:var(--blue)}
.lang{display:flex; gap:.7rem; padding-left:1.4rem; border-left:1px solid var(--line); font-size:.9rem}
.lang b{color:var(--navy); font-weight:700}
.lang a{color:var(--mute); text-decoration:none; font-weight:400}
.nav > a.back{font-weight:400; color:var(--mute)}
.nav > a.back:hover{color:var(--acc-ink)}
.hdr .btn{padding:.7rem 1.15rem; font-size:.9rem}
.burger{display:none; margin-left:auto; background:none; border:0; cursor:pointer; padding:.5rem; z-index:660}
.burger i{display:block; width:24px; height:2px; background:var(--navy); margin:5px 0; transition:transform .3s ease, opacity .3s ease, background .3s ease}
.mnav-open .burger i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mnav-open .burger i:nth-child(2){opacity:0}
.mnav-open .burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{display:none}
@media (max-width:1319px){
  .nav{display:none}
  .burger{display:block}
  .lg img{height:30px}
  .mnav{display:none; position:fixed; inset:0; z-index:560; background:#fff; padding:6rem var(--gut) 3rem; overflow:auto; overscroll-behavior:contain}
  .mnav-open .hdr{background:rgba(255,255,255,.98)}
  .mnav-open .mnav{display:block}
  .mnav a{display:block; font-size:1.35rem; font-weight:700; color:var(--navy); text-decoration:none;
    padding:.75rem 0; border-bottom:1px solid var(--line2)}
  .mnav a.sm{font-size:1rem; font-weight:400; color:var(--ink)}
  .mnav .mlang{margin-top:1.6rem; font-size:.95rem; color:var(--mute)}
  .mnav .mlang b{color:var(--navy)}
  .mnav .mlang a{display:inline; border:0; padding:0 0 0 .8rem; font-size:.95rem; font-weight:400; color:var(--mute)}
}


/* ============ CTA BAND: the directory closes back into one line ============ */
.ctab{position:relative; overflow:hidden; color:#fff; background:
  radial-gradient(60% 140% at 50% 50%, rgba(0,116,200,.45), rgba(0,116,200,0) 70%),
  linear-gradient(100deg, var(--deep) 0%, var(--navy) 50%, var(--deep) 100%)}
.ctab .wrap{padding-block:var(--s3); display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:1.6rem clamp(2rem,4vw,4rem); align-items:center}
.ctab h2{color:#fff}
.ctab .fx{display:block; width:100%; height:16px}
.cta-a,.cta-b{stroke:#fff; stroke-opacity:.55; stroke-width:2; vector-effect:non-scaling-stroke}
.cta-c{stroke:#60D0E4; stroke-width:3; vector-effect:non-scaling-stroke}
@media (max-width:820px){ .ctab .wrap{grid-template-columns:1fr} .ctab .btn{justify-self:start} }

/* ============ POP-UP ============ */
.talk-sub{margin-top:.8rem}
.tform{margin-top:1.4rem}
.talk-ways{margin-top:1.2rem; font-size:.86rem; color:var(--mute)}
.mast.m7{grid-template-columns:repeat(7,minmax(0,1fr)); gap:1.6rem 1.1rem}
.mast.m7 li{position:relative}
/* seven names in seven columns: the profile link sits on the photograph's corner, clear of the name */
.mast.m7 .ph .li{position:absolute; z-index:1; right:0; bottom:0}
.mast.m7 b{font-size:.92rem}
.mast.m7 li:hover img{filter:none}
.mast.m7 li:hover .ph::after{opacity:0}
@media (max-width:1100px){ .mast.m7{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:560px){ .mast.m7{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* ============ CONTACT ============ */
.contact{background:var(--band-2); color:var(--ink)}
.contact h2{color:var(--navy)}
.contact .wrap{padding-block:var(--s4); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2.4rem,6vw,6rem); align-items:center}
.contact .sub{margin-top:1.1rem; max-width:34rem; color:var(--ink)}
/* r13: social links, white square tiles with navy brand glyphs (Font Awesome Free 6 brand icons, CC BY 4.0,
   fontawesome.com). 34px tiles; the ::after widens each hit area to 44px. Colour change only on hover. */
.soc{display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:0 0 1.6rem; padding:0}
.soc a{position:relative; display:flex; align-items:center; justify-content:center; width:34px; height:34px; background:#fff; color:var(--navy); box-shadow:inset 0 0 0 1px var(--line); transition:background-color .2s ease, color .2s ease}
.soc a::after{content:""; position:absolute; inset:-5px}
.soc svg{display:block; width:18px; height:18px; fill:currentColor}
.soc a:hover{background:var(--navy); color:#fff}
.dkbg .soc a{box-shadow:none}
.dkbg .soc a:hover{background:var(--cyan); color:var(--navy)}
.ty .soc{margin:clamp(2.4rem,4.4vw,3.4rem) 0 0}
.ty .soc + .cways{margin-top:1.6rem}
html.rm .soc a{transition:none}
@media (prefers-reduced-motion:reduce){ .soc a{transition:none} }
/* the left column takes the homepage's register: hairline rows with a 2px accent rule that draws in */
.cways{margin-top:2.2rem; display:flex; flex-direction:column}
.cways a,.office{position:relative; padding:.95rem 0 .95rem 1.15rem; border-top:1px solid var(--line2)}
.cways a::before,.office::before{content:""; position:absolute; left:0; top:1rem; bottom:1rem; width:2px; background:var(--acc); transform-origin:top}
.cways a{display:flex; flex-wrap:wrap; gap:.3rem 1.4rem; align-items:baseline; text-decoration:none}
.cways .l{font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--mute); min-width:7rem}
.cways .v{font-size:1.12rem; font-weight:700; color:var(--navy); transition:color .3s ease}
.cways a:hover .v{color:var(--blue)}
.office{margin-top:0; font-style:normal; font-size:.98rem; color:var(--ink); line-height:1.65; border-bottom:1px solid var(--line2)}
.office b{display:block; color:var(--navy)}
html.js:not(.rm) .cways a::before,html.js:not(.rm) .office::before{transform:scaleY(0); transition:transform .8s var(--ease) var(--rd,0ms)}
html.js:not(.rm) .contact .in .cways a::before,html.js:not(.rm) .contact .in .office::before{transform:scaleY(1)}
.cform{background:#fff; padding:clamp(1.6rem,3vw,2.4rem); color:var(--ink); align-self:start}
.field{margin-bottom:1.15rem}
.field label{display:block; font-size:.8rem; font-weight:700; color:var(--navy); margin-bottom:.4rem}
.field input,.field select,.field textarea{width:100%; font-family:var(--ff); font-size:.98rem; color:var(--ink);
  background:#fff; border:1px solid rgba(0,46,109,.4); padding:.85rem 1rem}
.field select{background-color:#fff; color:var(--ink)}
.field textarea{min-height:6.5rem; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--blue); border-color:transparent}
.f-help{margin-top:.4rem; font-size:.8rem; color:var(--mute)}
.f-after{margin-top:1rem; font-size:.82rem; color:var(--mute)}
@media (max-width:960px){ .contact .wrap{grid-template-columns:1fr} }

/* ============ FOOTER ============ */
.ft{background:var(--deep); color:#B5C1D4}
.ft .wrap{padding-block:3.4rem 2.4rem}
.ft-top{display:grid; grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,.8fr)); gap:2.5rem}
.ft .lg2 img{height:42px; width:auto; display:block}
.ft p{font-size:.9rem; margin-top:1rem; max-width:24rem}
.ft h3{color:#fff; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.9rem}
.ft ul{list-style:none; display:flex; flex-direction:column; gap:.45rem}
.ft a{color:#B5C1D4; text-decoration:none; font-size:.92rem; display:inline-block; padding:.15rem 0}
.ft a:hover{color:#fff}
.ft a[hreflang]{text-decoration:underline; text-underline-offset:3px}
.ft-btm{margin-top:2.8rem; padding-top:1.6rem; border-top:1px solid rgba(182,194,214,.18);
  display:flex; flex-wrap:wrap; gap:1rem 3rem; justify-content:space-between; font-size:.82rem}
.ft-btm address{font-style:normal; line-height:1.6}
.ft-btm .ft-cr{flex-basis:100%; max-width:none; margin-top:0; font-size:.68rem; line-height:1.55; color:rgba(181,193,212,.48)}
.ft .ft-cr a{display:inline; padding:0; font-size:inherit; color:inherit; text-decoration:underline; text-underline-offset:2px}
.ft .ft-cr a:hover{color:#B5C1D4}
@media (max-width:900px){ .ft-top{grid-template-columns:1fr 1fr} }

/* ============ CONSENT: banner and policies ============ */
.ckb{position:fixed; left:0; right:0; bottom:0; z-index:800; background:var(--night); color:#C8D3E2;
  border-top:2px solid var(--blue); box-shadow:0 -14px 40px rgba(0,16,40,.3);
  transform:translateY(101%); transition:transform .55s var(--ease)}
.ckb.up{transform:none}
.ckb[hidden]{display:none}
.ckb-in{max-width:var(--max); margin-inline:auto; padding:1.15rem var(--gut) 1.25rem;
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.9rem 2.4rem; align-items:center}
.ckb p{font-size:.9rem; line-height:1.55; max-width:46rem}
.ckb-l{margin-top:.5rem; display:flex; gap:1.2rem; font-size:.8rem}
.ckb-a{display:flex; flex-wrap:wrap; gap:.6rem; justify-content:flex-end}
.ckb-a button{font-family:inherit; font-size:.82rem; font-weight:700; letter-spacing:.02em; cursor:pointer;
  padding:.72em 1.25em; border:1px solid rgba(200,211,226,.42); background:transparent; color:#DCE5F0;
  transition:background .25s ease, color .25s ease, border-color .25s ease}
.ckb-a button:hover{border-color:#fff; color:#fff}
.ckb-a button.solid{background:var(--blue); border-color:var(--blue); color:#fff}
.ckb-a button.solid:hover{background:var(--bright); border-color:var(--bright)}
.lnk{font-family:inherit; font-size:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer;
  text-decoration:underline; text-underline-offset:3px}
.ckb .lnk{color:#9FB4CE}
.ckb .lnk:hover{color:#fff}
.ckb-pref{grid-column:1/-1; display:none; border-top:1px solid rgba(200,211,226,.16); margin-top:.4rem; padding-top:1rem}
.ckb.open .ckb-pref{display:block}
.ckb-pref label{display:flex; gap:.7rem; align-items:flex-start; padding:.5rem 0; font-size:.86rem}
.ckb-pref input{margin-top:.28rem; width:1rem; height:1rem; flex:none; appearance:none; -webkit-appearance:none;
  border:1px solid rgba(200,211,226,.55); background:transparent; display:inline-grid; place-content:center; cursor:pointer}
.ckb-pref input::before{content:""; width:.55rem; height:.55rem; background:var(--bright); transform:scale(0); transition:transform .15s ease}
.ckb-pref input:checked::before{transform:scale(1)}
.ckb-pref input:disabled{border-color:rgba(200,211,226,.3); cursor:default}
.ckb-pref input:disabled::before{background:rgba(200,211,226,.55)}
.ckb-pref span b{display:block; color:#fff; font-weight:700}
.ckb-pref span i{font-style:normal; color:#93A7C0}
@media (max-width:820px){
  .ckb-in{grid-template-columns:1fr}
  .ckb-a{justify-content:flex-start}
}
dialog.pol{width:min(46rem,calc(100vw - 2rem)); max-height:min(80vh,44rem); margin:auto; border:0; padding:0; color:var(--ink);
  background:#fff; box-shadow:0 30px 80px rgba(0,20,50,.35); border-top:3px solid var(--acc)}
dialog.pol::backdrop{background:rgba(0,26,62,.62)}
.pol-in{padding:2.2rem clamp(1.4rem,4vw,2.6rem) 2.4rem; overflow:auto; max-height:inherit}
.pol h2{font-size:clamp(1.5rem,3vw,2.1rem)}
.pol p{margin-top:1rem; font-size:.95rem; line-height:1.68; max-width:38rem}
.pol .upd{margin-top:1.7rem; padding-top:1rem; border-top:1px solid var(--line2);
  font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; color:var(--mute)}
.pol-x{position:absolute; top:.65rem; right:.65rem; width:2.4rem; height:2.4rem; cursor:pointer;
  border:0; background:none; color:var(--mute); font-size:1.5rem; line-height:1; font-family:inherit}
.pol-x:hover{color:var(--navy)}
/* the consent block sits on the white form panel */
.consent{grid-column:1/-1; margin:.4rem 0 .3rem; padding-top:1rem; border-top:1px solid var(--line2)}
.consent label{display:flex; gap:.75rem; align-items:flex-start; padding:.4rem 0; font-size:.85rem; line-height:1.5;
  color:var(--ink); cursor:pointer}
.consent input{margin-top:.22rem; width:1rem; height:1rem; flex:none; appearance:none; -webkit-appearance:none;
  border:1px solid var(--navy); background:#fff; display:inline-grid; place-content:center; cursor:pointer}
.consent input::before{content:""; width:.55rem; height:.55rem; background:var(--blue); transform:scale(0); transition:transform .15s ease}
.consent input:checked::before{transform:scale(1)}
.consent .lnk{color:var(--blue); font-weight:700}
.consent .req{color:#B0402E; font-weight:700}
@media (prefers-reduced-motion:reduce){ .ckb{transition:none} }

/* gradient CTAs (ported from the KokonutUI gradient-button component) */
.btn{transition:background .3s ease, color .3s ease, border-color .3s ease, transform .18s ease, box-shadow .4s ease}
.btn:active{transform:scale(.97)}
.btn.solid{border:1px solid transparent;
  background:linear-gradient(var(--navy), var(--navy)) padding-box,
             linear-gradient(120deg, #0074C8, #60D0E4 55%, #002F6D) border-box}
.btn.solid:hover{color:#fff;
  background:linear-gradient(var(--blue), var(--blue)) padding-box,
             linear-gradient(120deg, #60D0E4, #0074C8 55%, #0074C8) border-box;
  box-shadow:0 10px 26px rgba(30,124,214,.32)}
.btn.inv.solid{border:1px solid transparent; color:var(--navy);
  background:linear-gradient(#fff, #fff) padding-box,
             linear-gradient(120deg, #60D0E4, #FFFFFF 45%, #0074C8) border-box}
.btn.inv.solid:hover{color:var(--navy);
  background:linear-gradient(var(--cyan), var(--cyan)) padding-box,
             linear-gradient(120deg, #FFFFFF, #60D0E4 55%, #0074C8) border-box;
  box-shadow:0 10px 26px rgba(79,163,232,.35)}


/* buttons on this page: the header CTA keeps its border (the nav link reset was removing it), and
   the white button warms to blue on hover, never to the division teal */
.nav > a.btn.hcta{border:1px solid var(--navy); padding:.7rem 1.15rem; color:var(--navy)}
.nav > a.btn.hcta:hover{color:#fff; background:var(--navy)}
.btn.inv.solid{background:linear-gradient(#fff, #fff) padding-box,
  linear-gradient(120deg, #FFFFFF, #CFE3F5 45%, #0074C8) border-box}
.btn.inv.solid:hover{color:#fff; background:linear-gradient(var(--blue), var(--blue)) padding-box,
  linear-gradient(120deg, #FFFFFF, #0074C8 55%, #002F6D) border-box; box-shadow:0 10px 26px rgba(0,116,200,.3)}
/* the shared contact band centres its columns; on this page the heading sits level with the form */
.contact .wrap{align-items:start}

/* one header for every Miranda page (3 Oct 2026): the same logo size, bar height, link size and link
   spacing on each page. Spacing tightens below 1440px, and every page switches to the menu at 1319px */
.hdr-in{min-height:78px}
.lg img{height:36px}
.nav{gap:1.7rem}
.nav > a,.nav .lang{white-space:nowrap}
.nav > a,.nav button{font-size:.98rem}
@media (max-width:1439px){ .nav{gap:1.15rem} }
@media (max-width:1319px){ .lg img{height:30px} }
/* one hero heading for every division (6 Oct 2026): the same size, weight, line height and tracking on
   each page, 60px at 1440px; the colour stays with each page's hero */
.hero h1{font-size:clamp(2.4rem,4.17vw,3.75rem); font-weight:300; line-height:1.08; letter-spacing:-.02em}
/* gradient CTAs (ported from the KokonutUI gradient-button component) */
.btn{transition:background .3s ease, color .3s ease, border-color .3s ease, transform .18s ease, box-shadow .4s ease}
.btn:active{transform:scale(.97)}
.btn.solid{border:1px solid transparent;
  background:linear-gradient(var(--navy), var(--navy)) padding-box,
             linear-gradient(120deg, #0074C8, #60D0E4 55%, #002F6D) border-box}
.btn.solid:hover{color:#fff;
  background:linear-gradient(var(--blue), var(--blue)) padding-box,
             linear-gradient(120deg, #60D0E4, #0074C8 55%, #0074C8) border-box;
  box-shadow:0 10px 26px rgba(30,124,214,.32)}
.btn.inv.solid{border:1px solid transparent; color:var(--navy);
  background:linear-gradient(#fff, #fff) padding-box,
             linear-gradient(120deg, #60D0E4, #FFFFFF 45%, #0074C8) border-box}
.btn.inv.solid:hover{color:var(--navy);
  background:linear-gradient(var(--cyan), var(--cyan)) padding-box,
             linear-gradient(120deg, #FFFFFF, #60D0E4 55%, #0074C8) border-box;
  box-shadow:0 10px 26px rgba(79,163,232,.35)}


/* buttons on this page: the header CTA keeps its border (the nav link reset was removing it), and
   the white button warms to blue on hover, never to the division teal */
.nav > a.btn.hcta{border:1px solid var(--navy); padding:.7rem 1.15rem; color:var(--navy)}
.nav > a.btn.hcta:hover{color:#fff; background:var(--navy)}
.btn.inv.solid{background:linear-gradient(#fff, #fff) padding-box,
  linear-gradient(120deg, #FFFFFF, #CFE3F5 45%, #0074C8) border-box}
.btn.inv.solid:hover{color:#fff; background:linear-gradient(var(--blue), var(--blue)) padding-box,
  linear-gradient(120deg, #FFFFFF, #0074C8 55%, #002F6D) border-box; box-shadow:0 10px 26px rgba(0,116,200,.3)}
/* the shared contact band centres its columns; on this page the heading sits level with the form */
.contact .wrap{align-items:start}

/* one header for every Miranda page (3 Oct 2026): the same logo size, bar height, link size and link
   spacing on each page. Spacing tightens below 1440px, and every page switches to the menu at 1319px */
.hdr-in{min-height:78px}
.lg img{height:36px}
.nav{gap:1.7rem}
.nav > a,.nav .lang{white-space:nowrap}
.nav > a,.nav button{font-size:.98rem}
@media (max-width:1439px){ .nav{gap:1.15rem} }
@media (max-width:1319px){ .lg img{height:30px} }
/* one hero heading for every division (6 Oct 2026): the same size, weight, line height and tracking on
   each page, 60px at 1440px; the colour stays with each page's hero */
.hero h1{font-size:clamp(2.4rem,4.17vw,3.75rem); font-weight:300; line-height:1.08; letter-spacing:-.02em}
/* ============ PARTNERSHIPS (6 Oct 2026) ============
   Five framed cards on mist, from Miranda's approved Partnerships text. At rest a card shows the photograph,
   the name, one sentence and an outlined expand button; opening it shows what the partnership covers and
   its people, in place. The lists are in the HTML even while the card is closed. */

/* the hero: one slim band, the title on the left and the line on the right */
.jx-hero{min-height:0; background:var(--hero-grad)}
.jx-hero::before{display:none}
.jx-in{position:relative; z-index:2; width:100%; max-width:var(--max); margin-inline:auto;
  padding:clamp(3.2rem,8vh,5.5rem) var(--gut) clamp(2.8rem,7vh,4.5rem);
  display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:1.4rem clamp(2rem,5vw,5rem); align-items:end}
.jx-in h1{font-size:clamp(3.2rem,6.4vw,5.75rem); line-height:1}
.jx-in .hero-lead{margin-top:0}
.jx-in .hero-cta{margin-top:1.8rem}
@media (max-width:900px){ .jx-in{grid-template-columns:minmax(0,1fr)} }

/* the anchored bar: the PDF's five links, held under the header. The shared header cannot carry them as
   well as its own (they would need about 1430px), so they sit here at every width */
#partnerships{scroll-margin-top:var(--hh,79px)}
.jx-nav{position:sticky; top:var(--hh,79px); z-index:500; background:#fff; border-bottom:1px solid var(--line)}
.jx-nav ol{position:relative; --fl:0px; --fr:0px; list-style:none; max-width:var(--max); margin-inline:auto; padding-inline:var(--gut);
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr))}
.jx-nav a{position:relative; display:block; padding:1.05rem .9rem 1.1rem 0; text-decoration:none; color:var(--mute); transition:color .3s ease}
.jx-nav a b{display:block; font-size:1rem; font-weight:500; line-height:1.3; color:inherit; white-space:nowrap}
.jx-nav a::before,.jx-nav a::after{content:""; position:absolute; left:0; right:.9rem; bottom:-1px; height:2px}
.jx-nav a::before{background:var(--line2)}
.jx-nav a::after{background:var(--blue); transform-origin:0 50%; transform:scaleX(0); transition:transform .45s var(--ease)}
.jx-nav a[aria-current="true"]::after{transform:scaleX(1)}
.jx-nav a:hover,.jx-nav a[aria-current="true"]{color:var(--navy)}
.jx-nav a[aria-current="true"] b{font-weight:700}
@media (max-width:760px){
  .jx-nav ol{display:flex; gap:1.5rem; overflow-x:auto; scrollbar-width:none}
  .jx-nav ol::-webkit-scrollbar{display:none}
  .jx-nav li{flex:none}
  .jx-nav a{padding-right:0}
  .jx-nav a::before,.jx-nav a::after{right:0}
}
.jx-nav ol.ov{-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--fl),#000 calc(100% - var(--fr)),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 var(--fl),#000 calc(100% - var(--fr)),transparent)}
.ov.st{--fl:2.5rem}
.ov:not(.end){--fr:2.5rem}

/* ---- the introduction and the cards ---- */
.jv-list{background:var(--mist); padding:clamp(3.5rem,7vw,6.5rem) 0}
.jv-wrap{max-width:var(--max); margin-inline:auto; padding-inline:var(--gut); display:grid; grid-template-columns:minmax(0,1fr); gap:clamp(3rem,6vw,5.5rem)}
.jv-intro{max-width:46rem}
.jv-intro p{font-size:clamp(1.2rem,1.6vw,1.45rem); font-weight:300; line-height:1.5; color:var(--navy); text-wrap:pretty}
.jv-intro p + p{margin-top:1rem; font-size:clamp(1.05rem,1.25vw,1.15rem); font-weight:400; color:var(--ink)}
section.vc{min-width:0; scroll-margin-top:calc(var(--hh,79px) + var(--nh,0px) + 1.5rem); background:#fff;
  border:1px solid var(--line2); box-shadow:0 48px 90px -64px rgba(0,26,62,.5)}
.vc-head{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); min-height:clamp(440px,56vh,560px)}
.vc.flip .vc-head{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.vc.flip .vc-photo{order:2}

.vc-copy{min-width:0; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(2.5rem,5vw,4.5rem) clamp(2rem,5.4vw,5rem)}
.vc-logo{align-self:flex-start; height:28px; width:auto; margin-bottom:clamp(1.4rem,2.6vw,2rem)}
.vc h2{font-size:clamp(2.4rem,4vw,3.5rem); font-weight:300; line-height:1.04; letter-spacing:-.02em; color:var(--navy); text-wrap:balance}
.vc-lead{margin-top:clamp(1rem,1.8vw,1.4rem); max-width:34rem; font-size:clamp(1.18rem,1.5vw,1.38rem); font-weight:300;
  line-height:1.45; color:var(--ink); text-wrap:pretty}
.vc-act{margin-top:clamp(1.8rem,3vw,2.6rem); display:flex; flex-wrap:wrap; gap:.8rem}
.vc-act .btn{padding:.95rem 1.4rem}
/* the outlined expand button: its arrow turns down while the card is open */
.vc-open .arw{transition:transform .4s var(--ease)}
.vc-open[aria-expanded="true"] .arw,.vc-open[aria-expanded="true"]:hover .arw{transform:rotate(90deg) translateX(-2px)}
.vc-chev{display:inline-block; width:8px; height:8px; margin:4px 2px 0 .15rem; border-right:2px solid currentColor;
  border-bottom:2px solid currentColor; transform:rotate(225deg)}

/* ---- the photograph and the partnership's own system, drawn on a canvas and steered by the cursor ---- */
.vc-photo{position:relative; min-width:0; overflow:hidden; background:var(--night)}
.vc-photo{touch-action:pan-y; -webkit-tap-highlight-color:transparent}
.vc-photo > img,.vc-fx{position:absolute; inset:0; width:100%; height:100%; display:block}
.vc-photo > img{object-fit:cover}
.vc-photo::after{content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,26,62,.1) 20%, rgba(0,26,62,.5))}
/* the canvas paints its own grade on the tower, the Bolsa and the library, so the shared shade steps aside */
.vc[data-fx="ratings"] .vc-photo::after,.vc[data-fx="strategic"] .vc-photo::after,.vc[data-fx="advisors"] .vc-photo::after{display:none}
.vc-fx{z-index:2}
.fx-chip{position:absolute; left:0; top:0; z-index:3; pointer-events:none; padding:.45rem .65rem;
  background:#fff; color:var(--navy); font-size:.8rem; font-weight:500; line-height:1.2; white-space:nowrap;
  box-shadow:0 10px 28px -12px rgba(0,26,62,.6); opacity:0; will-change:transform,opacity}
.fx-chip::after{content:""; position:absolute; left:calc(50% - 6px); bottom:-6px; width:12px; height:6px;
  background:inherit; clip-path:polygon(0 0,100% 0,50% 100%)}

/* ---- the card opens in place ---- */
.vc-more{height:0; overflow:hidden; overflow:clip}
.vc.open .vc-more,.vc.opening .vc-more{border-top:1px solid var(--line2)}
.vc-mi{padding:clamp(2.2rem,4.4vw,3.6rem) clamp(2rem,5.4vw,5rem) clamp(2.2rem,4.4vw,3.6rem)}
/* what it covers: each service named, with its line under it */
.cov{list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(2.4rem,5vw,4.5rem)}
.cov:has(> li:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){ .cov,.cov:has(> li:nth-child(3):last-child){grid-template-columns:minmax(0,1fr)} }
.cov li{padding:1.25rem 0 1.4rem; border-top:1px solid var(--line2)}
.cov h3{position:relative; padding-left:1.15rem; font-size:1.06rem; font-weight:700; line-height:1.35; color:var(--navy)}
.cov h3::before{content:""; position:absolute; left:0; top:.5em; width:6px; height:6px; background:var(--blue)}
.cov p{margin-top:.45rem; padding-left:1.15rem; font-size:.97rem; line-height:1.6; color:var(--ink); max-width:36rem}
/* the people */
.who{margin-top:clamp(1.6rem,3vw,2.4rem); padding-top:clamp(1.6rem,3vw,2.2rem); border-top:1px solid var(--line)}
.led{max-width:46rem; margin-bottom:1.6rem; font-size:clamp(1.05rem,1.3vw,1.15rem); line-height:1.65; color:var(--ink)}
.team{list-style:none; display:flex; flex-wrap:wrap; gap:1rem 3rem}
.team li,.adv li{display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .7rem}
.team b,.adv b{font-size:1.08rem; font-weight:700; color:var(--navy)}
.team .role,.team .fld,.adv .city{font-size:.95rem; color:var(--mute)}
.team .fld{display:inline-flex; align-items:center; gap:.7rem}
.team .fld::before{content:""; width:1px; height:.95em; background:var(--line)}
a.li{display:inline-grid; place-content:center; width:28px; height:28px; border:1px solid rgba(0,116,200,.45); color:var(--blue);
  transition:background .25s ease, color .25s ease, border-color .25s ease}
a.li svg{width:14px; height:14px; fill:currentColor}
a.li:hover,a.li:focus-visible{background:var(--blue); border-color:var(--blue); color:#fff}
/* the Senior Advisors: seven names, each with the city they work from */
.adv{list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr)); gap:0 clamp(1.6rem,3vw,2.6rem)}
.adv li{padding:1.1rem 0 1.2rem; border-top:1px solid var(--line2)}
.adv .city{flex-basis:100%; order:3}
.adv b{order:1; margin-right:auto}
.adv a.li{order:2}

.vc-foot{margin-top:clamp(2.2rem,4vw,3.2rem); padding-top:2rem; border-top:1px solid var(--line2);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem}
.vc-shut{font-family:var(--ff); font-size:.95rem; font-weight:700; color:var(--navy); background:none; border:0; padding:.6rem 0; cursor:pointer}
.vc-shut:hover{color:var(--blue)}

/* phones and narrow tablets: photograph above, words below */
@media (max-width:900px){
  .vc-head,.vc.flip .vc-head{grid-template-columns:minmax(0,1fr); min-height:0}
  .vc.flip .vc-photo{order:0}
  .vc-photo{aspect-ratio:4/3}
}
@media (max-width:560px){
  .vc-copy{padding:2rem 1.25rem 2.2rem}
  .vc-mi{padding:1.6rem 1.25rem 2rem}
  .vc-act .btn{flex:1 1 auto; justify-content:center}
  .jv-wrap{padding-inline:1rem}
  .fx-chip{font-size:.72rem}
}
@media (prefers-reduced-motion:reduce){ .vc-open .arw{transition:none} }
/* ============ NEWS & CONTENT v2 (7 Oct 2026, Miranda's brief) ============
   One page, seven tabs. Every card is the same component. Each section owns one colour: the tab underline and
   the square swatch in its tag. Tag text stays navy on white so it reads at small sizes. Square corners throughout. */
:root{--hh:79px; --paper:#F1F4F8; --kc:var(--navy)}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
[hidden]{display:none !important}
body{background:#fff}

/* ---- header: title left, search right ---- */
.nc-hd{background:#fff}
.nc-hd-in{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.6rem 3rem;
  padding-block:clamp(2.4rem,5vw,4.2rem) clamp(1.6rem,3vw,2.4rem)}
.nc-hd h1{color:var(--navy); font-size:clamp(2.4rem,4.17vw,3.75rem); font-weight:300; line-height:1.08; letter-spacing:-.02em}
.nc-sub{margin-top:.7rem; font-size:clamp(1.02rem,1.3vw,1.18rem); color:var(--mute); max-width:40rem}
.nc-s{flex:0 1 26rem; position:relative}
.nc-s::before{content:""; position:absolute; left:1rem; top:50%; width:.8rem; height:.8rem; margin-top:-.5rem;
  border:1.6px solid var(--mute); border-radius:50%; pointer-events:none}
.nc-s::after{content:""; position:absolute; left:1.72rem; top:50%; width:.42rem; height:1.6px; margin-top:.22rem;
  background:var(--mute); transform:rotate(45deg); pointer-events:none}
.nc-s input{width:100%; font:inherit; font-size:1rem; color:var(--navy); background:#fff; border:1px solid var(--line);
  border-radius:0; padding:.95rem 1rem .95rem 2.7rem; transition:border-color .25s ease, box-shadow .25s ease}
.nc-s input::placeholder{color:#7A8898}
.nc-s input:hover{border-color:rgba(0,46,109,.32)}
.nc-s input:focus{outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(0,116,200,.16)}

/* ---- tab bar: sticks under the header; the underline springs to the active tab in its colour ---- */
.nc-tabs{position:sticky; top:var(--hh); z-index:40; background:rgba(255,255,255,.94); backdrop-filter:saturate(1.4) blur(10px);
  -webkit-backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
.nc-tr{position:relative; display:flex; gap:clamp(1.2rem,2.6vw,2.6rem); overflow-x:auto; scrollbar-width:none}
.nc-tr::-webkit-scrollbar{display:none}
.nc-tr a{flex:none; position:relative; padding:1.15rem 0 1.05rem; font-size:1rem; font-weight:500; color:var(--mute);
  text-decoration:none; white-space:nowrap; transition:color .25s ease}
.nc-tr a:hover{color:var(--navy)}
.nc-tr a[aria-current]{color:var(--navy); font-weight:700}
.nc-tr a:focus-visible{outline:2px solid var(--blue); outline-offset:-2px}
.nc-ind{position:absolute; left:0; bottom:0; width:1px; height:3px; background:var(--kc); transform-origin:0 0; pointer-events:none}
html:not(.js) .nc-tr a[aria-current]::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--kc)}
.nc-tabs.srch .nc-ind{opacity:0}
.nc-tabs.srch .nc-tr a[aria-current]{color:var(--mute); font-weight:500}
@media (max-width:760px){
  .nc-tabs .wrap{padding-inline:0}
  .nc-tr{padding-inline:var(--gut); -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--gut),#000 calc(100% - 2.4rem),transparent)}
}

/* ---- body ---- */
.nc-body{background:var(--paper); padding-block:clamp(2.2rem,4.5vw,3.8rem) clamp(3.4rem,6vw,5.4rem)}
.pn-h{color:var(--navy); font-size:clamp(1.75rem,2.6vw,2.4rem); font-weight:300; line-height:1.15; letter-spacing:-.015em; margin-bottom:clamp(1.3rem,2.4vw,2rem)}
.pn-h2{color:var(--navy); font-size:clamp(1.45rem,2vw,1.8rem); font-weight:300; line-height:1.2; margin:clamp(2.2rem,4vw,3rem) 0 1.4rem}
.pn-i{font-size:clamp(1.02rem,1.25vw,1.15rem); line-height:1.65; color:var(--ink); max-width:44rem; margin:-.4rem 0 clamp(1.6rem,3vw,2.2rem)}

/* ---- the card: one component everywhere ---- */
.cg{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(1rem,1.8vw,1.6rem)}
@media (max-width:1023px){ .cg{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:639px){ .cg{grid-template-columns:1fr} }
.cd{position:relative; display:flex; flex-direction:column; background:#fff; box-shadow:0 1px 0 rgba(0,47,109,.06);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease)}
.cd:hover{transform:translateY(-3px); box-shadow:0 18px 40px -22px rgba(0,47,109,.38)}
.cd:active{transform:translateY(-1px)}
.cd:focus-within{outline:2px solid var(--blue); outline-offset:2px}
.cd-ph{position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--mist)}
.cd-ph img{width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease)}
.cd:hover .cd-ph img{transform:scale(1.045)}
.cd-ph.fb{background:linear-gradient(135deg, #DCE6F2 0%, color-mix(in srgb, var(--kc) 70%, #DCE6F2) 100%)}
.cd-tag{position:absolute; left:0; bottom:0; display:inline-flex; align-items:center; gap:.5rem; max-width:calc(100% - 1rem);
  background:#fff; color:var(--navy); font-size:.76rem; font-weight:700; line-height:1.2; padding:.5rem .8rem .5rem .75rem}
.cd-tag i{flex:none; width:8px; height:8px; background:var(--kc)}
.cd-b{display:flex; flex-direction:column; flex:1; padding:1.15rem 1.3rem 1.05rem}
.cd-t{font-size:1.1rem; font-weight:700; line-height:1.32; color:var(--navy); letter-spacing:-.005em;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.cd-a{color:inherit; text-decoration:none}
.cd-a::after{content:""; position:absolute; inset:0; z-index:1}
.cd-a:focus{outline:none}
.cd-x{margin-top:.55rem; font-size:.95rem; line-height:1.58; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.cd-f{display:flex; align-items:center; gap:.7rem; margin-top:auto; padding-top:1rem; font-size:.85rem; color:var(--mute)}
.cd-b > .cd-f{border-top:0}
.cd-x + .cd-f{margin-top:auto}
.cd-t + .cd-f,.cd-x + .cd-f{padding-top:1.1rem}
.cd-es{font-size:.7rem; font-weight:700; letter-spacing:.04em; color:var(--navy); border:1px solid var(--line); padding:.04rem .36rem; text-decoration:none}
.cd-go{margin-left:auto; display:inline-flex; align-items:center; gap:.4rem; font-weight:700; color:var(--navy); white-space:nowrap}
.cd:hover .cd-go{color:var(--blue)}
.cd:hover .cd-go .arw{transform:translateX(5px)}
.arw{display:inline-block; transition:transform .35s var(--ease)}

/* ---- Load more ---- */
.lm-w{display:flex; justify-content:center; margin-top:clamp(1.8rem,3.2vw,2.6rem)}
.lm,.lm-x{min-width:12rem; justify-content:center; background:transparent}

/* ---- links with an arrow ---- */
.go{display:inline-flex; align-items:center; gap:.45rem; font-size:.95rem; font-weight:700; color:var(--navy); text-decoration:none}
.go:hover{color:var(--blue)}
.go:focus-visible{outline:2px solid var(--blue); outline-offset:3px}

/* ---- Miranda Intelligence ---- */
/* 12 Oct: Miranda Investigation removed, so Chatters is one full-width box: text left, link right */
.ib{display:grid; grid-template-columns:1fr; margin-bottom:clamp(2rem,3.6vw,2.8rem)}
.ib-c{background:#fff; border-top:3px solid var(--blue); padding:1.4rem 1.5rem 1.35rem; display:flex; align-items:center; justify-content:space-between; gap:.8rem 2rem}
.ib-c h3{color:var(--navy); font-size:1.2rem; font-weight:700}
.ib-c p{color:var(--ink); line-height:1.6; max-width:34rem; margin-top:.35rem}
.ib-c .go{flex:none}
@media (max-width:639px){ .ib-c{flex-direction:column; align-items:flex-start} }
.fp{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:clamp(1.4rem,2.6vw,2rem); scroll-margin-top:calc(var(--hh) + 4.5rem)}
.fp button{font-family:var(--ff); font-size:.92rem; font-weight:500; color:var(--navy); background:#fff; border:1px solid var(--line);
  border-radius:0; padding:.6rem 1.05rem; cursor:pointer; transition:background .25s ease, color .25s ease, border-color .25s ease}
.fp button:hover{border-color:var(--navy)}
.fp button[aria-pressed="true"]{background:var(--navy); border-color:var(--navy); color:#fff}
.fp button:focus-visible{outline:2px solid var(--blue); outline-offset:2px}
@media (max-width:639px){ .fp{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-inline:calc(var(--gut) * -1); padding:2px var(--gut);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--gut),#000 calc(100% - 2.4rem),transparent);
  mask-image:linear-gradient(90deg,transparent 0,#000 var(--gut),#000 calc(100% - 2.4rem),transparent)}
  .fp::-webkit-scrollbar{display:none} .fp button{flex:none} }
/* chatter cards (12 Oct, SF25/SF26): photo under an Intelligence-blue overlay, no description on All chatters;
   ten cards sit 4, then 3 and 3 on a 12-column grid */
.cc-g{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:clamp(1rem,1.8vw,1.6rem)}
.cc{grid-column:span 3}
.cc.cc-w{grid-column:span 4}
@media (max-width:1023px){ .cc-g{grid-template-columns:repeat(2,minmax(0,1fr))} .cc,.cc.cc-w{grid-column:auto} }
@media (max-width:639px){ .cc-g{grid-template-columns:1fr} }
.cc{position:relative; isolation:isolate; overflow:hidden; min-height:clamp(12.5rem,18vw,16.5rem); background:#003A70; color:#fff;
  padding:1.35rem 1.4rem 1.2rem; display:flex; flex-direction:column; gap:.7rem;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease)}
.cc:hover{transform:translateY(-3px); box-shadow:0 18px 40px -22px rgba(0,47,109,.55)}
.cc:focus-within{outline:2px solid var(--blue); outline-offset:2px}
.cc-ph{position:absolute; inset:0; z-index:-1; background:#0A5FAE}
.cc-ph img{width:100%; height:100%; object-fit:cover; opacity:.92; mix-blend-mode:luminosity; transition:transform 1.1s var(--ease), opacity .5s ease}
.cc-ph::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,116,200,.6) 0%, rgba(0,116,200,.3) 40%, rgba(0,72,140,.7) 68%, rgba(0,47,109,.92) 100%)}
.cc:hover .cc-ph img{transform:scale(1.05); opacity:1}
.cc-h,.iv-h{display:flex; align-items:flex-start; justify-content:space-between; gap:1rem}
.cc h3{color:#fff; font-size:1.25rem; font-weight:700; line-height:1.25; text-wrap:balance; text-shadow:0 1px 12px rgba(0,30,70,.35)}
.cc .cc-go{color:#fff; margin-top:auto}
.cc .cc-go::after{content:""; position:absolute; inset:0; z-index:1}
.cc .cc-go:hover,.cc:hover .cc-go{color:#fff}
.cc:hover .cc-go .arw{transform:translateX(5px)}
.cc .cc-go:focus-visible{outline:none}
.iv-sub{margin-top:.2rem}
/* a single chatter's issues */
.iv-h h3{color:var(--navy); font-size:clamp(1.5rem,2.2vw,1.9rem); font-weight:300; line-height:1.2}
.iv-d{color:var(--ink); font-size:1.05rem; line-height:1.6; max-width:44rem; margin:.5rem 0 1.4rem}
.iv-l{list-style:none; background:#fff}
.iv-l li + li{border-top:1px solid var(--line2)}
.iv-l a{display:flex; align-items:center; gap:1rem 2rem; padding:1.05rem 1.3rem; text-decoration:none; transition:background .25s ease}
.iv-l a:hover{background:#F7F9FC}
.iv-l a:focus-visible{outline:2px solid var(--blue); outline-offset:-2px}
.iv-tx{flex:1; min-width:0; display:flex; flex-direction:column; gap:.3rem}
.iv-t{color:var(--navy); font-weight:700; line-height:1.4}
.iv-t .cd-es{margin-left:.5rem; vertical-align:2px}
.iv-s{color:var(--ink); font-size:.93rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-width:52rem}
.iv-m{display:flex; align-items:center; gap:1.6rem; flex:none; color:var(--mute); font-size:.9rem}
.iv-m time{min-width:9.6rem; text-align:right}
.iv-go{display:inline-flex; gap:.4rem; font-weight:700; color:var(--navy)}
.iv-l a:hover .iv-go{color:var(--blue)}
.iv-l a:hover .arw{transform:translateX(5px)}
@media (max-width:700px){ .iv-l a{flex-direction:column; align-items:flex-start; gap:.45rem} .iv-m{gap:.9rem} .iv-m time{min-width:0; text-align:left} }

/* ---- NewsWire ---- */
.nw{background:#fff; border-top:3px solid #5B6B7C; padding:clamp(1.4rem,2.6vw,2.2rem) clamp(1.3rem,2.6vw,2.4rem);
  display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:clamp(1.4rem,3.4vw,3.4rem); align-items:center}
.nw-r{border-left:1px solid var(--line2); padding-left:clamp(1.4rem,3vw,3rem)}
@media (max-width:899px){ .nw{grid-template-columns:1fr} .nw-r{border-left:0; padding-left:0} }
.nw p{font-size:clamp(1.02rem,1.25vw,1.12rem); line-height:1.65; color:var(--ink); max-width:46rem}
.nw-c{list-style:none; margin:0 0 1.4rem; border-top:1px solid var(--line2)}
.nw-c li{display:flex; align-items:center; gap:.7rem; font-size:.98rem; font-weight:700; color:var(--navy); padding:.72rem 0; border-bottom:1px solid var(--line2)}
.nw-c li::before{content:""; width:8px; height:8px; flex:none; background:#5B6B7C}
.nw-b{display:grid; gap:.6rem}
.nw-b .btn{justify-self:stretch; display:flex; justify-content:space-between}

/* ---- Travel Guides ---- */
.gd{list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(1rem,1.8vw,1.6rem)}
@media (max-width:900px){ .gd{grid-template-columns:1fr} }
.gd a{position:relative; display:flex; flex-direction:column; justify-content:flex-end; gap:1rem; min-height:clamp(15rem,22vw,18rem);
  padding:1.5rem; overflow:hidden; color:#fff; text-decoration:none; isolation:isolate}
.gd-ph{position:absolute; inset:0; z-index:-1; background:#2E2C5E}
.gd-ph img{width:100%; height:100%; object-fit:cover; opacity:.55; mix-blend-mode:luminosity; transition:transform 1.1s var(--ease), opacity .5s ease}
.gd-ph::after{content:""; position:absolute; inset:0; background:linear-gradient(165deg, rgba(124,124,206,.55) 0%, rgba(30,28,80,.92) 78%)}
.gd a:hover .gd-ph img{transform:scale(1.05); opacity:.7}
.gd-t{font-size:clamp(1.35rem,1.9vw,1.65rem); font-weight:400; line-height:1.2; text-wrap:balance}
.gd-b{align-self:flex-start; display:inline-flex; align-items:center; gap:.5rem; background:#fff; color:var(--navy); font-size:.92rem; font-weight:700; padding:.72rem 1rem}
.gd a:hover .gd-b{background:var(--cyan)}
.gd a:hover .arw{transform:translateX(5px)}
.gd a:focus-visible{outline:2px solid var(--blue); outline-offset:3px}

/* ---- search results ---- */
.rs-h{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:1rem}
.rs-x{background:transparent}
.rs-none{color:var(--ink); font-size:1.05rem}

@media (prefers-reduced-motion:reduce){
  .cd,.cc,.cd-ph img,.cc-ph img,.gd-ph img,.arw{transition:none}
  .cd:hover,.cc:hover{transform:none}
  .cd:hover .cd-ph img,.cc:hover .cc-ph img,.gd a:hover .gd-ph img{transform:none}
}