/*
 * World Business Watch - front end styles
 */
:root{
  --ink:#10202F;
  --ink-soft:#33465A;
  --paper:#FAF9F6;
  --paper-deep:#F1EFE9;
  --cobalt:#14489F;
  --cobalt-deep:#0D2F6B;
  --gain:#0B7A53;
  --loss:#B93A32;
  --rule:#D8D4CB;
  --rule-dark:#22364B;
  --serif:'Source Serif 4', Georgia, serif;
  --sans:'Archivo', 'Helvetica Neue', Arial, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.5;font-size:16px}
a{color:inherit;text-decoration:none}
a:hover{color:var(--cobalt)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--cobalt);outline-offset:2px}
img{max-width:100%;display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.serif{font-family:var(--serif)}

/* ---------- Market strip ---------- */
/* Two halves: MARKETS (quotes + delayed pill) and FLASH (headlines). In each
   the content glides left as a ticker, pausing on hover; the track is
   rendered twice so the loop has no seam. Halves sit side by side on wide
   screens and stack on narrow ones. */
.market-strip{background:var(--ink);color:#E7ECF2;font-size:12.5px;white-space:nowrap;border-bottom:3px solid var(--cobalt)}
.market-strip .wrap{display:flex;align-items:stretch;gap:0;padding-top:0;padding-bottom:0}
.strip-half{display:flex;align-items:center;flex:1 1 50%;min-width:0;padding:8px 0}
.strip-flash{border-left:1px solid var(--rule-dark);padding-left:16px}
.strip-label{font-weight:700;letter-spacing:.04em;color:#fff;padding-right:14px;border-right:1px solid var(--rule-dark);flex-shrink:0;display:inline-flex;align-items:center;gap:7px}
.strip-ticks{flex:1 1 auto;min-width:0;display:flex;overflow:hidden;margin:0 14px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent)}
.strip-flash .strip-ticks{margin-right:0}
@keyframes strip-scroll{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.strip-track{display:flex;flex-shrink:0;align-items:center;animation:strip-scroll 60s linear infinite}
.strip-flash .strip-track{animation-duration:75s}
.strip-ticks:hover .strip-track,.strip-ticks:focus-within .strip-track{animation-play-state:paused}
.tick{display:inline-flex;gap:6px;align-items:baseline;padding-right:16px;margin-right:16px;border-right:1px solid var(--rule-dark);flex-shrink:0}
.tick .sym{color:#9FB0C2;font-weight:600}
.tick .val{font-weight:600;color:#fff}
.tick .chg{font-weight:700}
.up{color:#4FC08D}
.down{color:#E58B84}
.flat{color:#9FB0C2}
/* Flash headlines */
.flash-pulse{width:7px;height:7px;border-radius:50%;background:var(--loss);box-shadow:0 0 0 0 rgba(185,58,50,.6);animation:flash-pulse 2.2s infinite}
@keyframes flash-pulse{70%{box-shadow:0 0 0 7px rgba(185,58,50,0)}100%{box-shadow:0 0 0 0 rgba(185,58,50,0)}}
.flash-item{color:#E7ECF2;font-weight:500;padding-right:18px;margin-right:18px;border-right:1px solid var(--rule-dark);flex-shrink:0}
.flash-item:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
/* Status pill: green dot = delayed feed running, amber = showing the last quotes received */
.strip-time{display:inline-flex;align-items:center;gap:7px;margin-left:auto;margin-right:16px;padding:3px 10px 3px 8px;border:1px solid var(--rule-dark);border-radius:999px;color:#9FB0C2;font-size:11.5px;font-weight:600;letter-spacing:.02em;flex-shrink:0;cursor:help}
.strip-dot{width:7px;height:7px;border-radius:50%;background:#4FC08D;box-shadow:0 0 0 3px rgba(79,192,141,.18)}
.strip-time.is-stale{color:#F0C674;border-color:rgba(240,198,116,.35)}
.strip-time.is-stale .strip-dot{background:#F0C674;box-shadow:0 0 0 3px rgba(240,198,116,.18)}
@media (max-width:1200px){
  .strip-time-long{display:none}
}
@media (max-width:900px){
  /* stacked: markets row, then flash row */
  .market-strip .wrap{flex-direction:column}
  .strip-half{flex-basis:auto;padding:7px 0}
  .strip-markets{border-bottom:1px solid var(--rule-dark)}
  .strip-flash{border-left:none;padding-left:0}
  .strip-track{animation-duration:42s}
  .strip-flash .strip-track{animation-duration:55s}
  .strip-time{margin-right:0}
}
@media (max-width:640px){
  .market-strip{font-size:12px}
  .strip-half{padding:6px 0}
  .strip-label{padding-right:10px}
  .strip-ticks{margin:0 10px}
  .strip-track{animation-duration:30s}
  .strip-flash .strip-track{animation-duration:40s}
  .strip-time{padding:2px 8px 2px 7px;font-size:11px}
}
/* Reduced motion: no gliding; the tracks scroll by touch/wheel instead. */
@media (prefers-reduced-motion:reduce){
  .strip-track{animation:none}
  .strip-track[aria-hidden]{display:none}
  .flash-pulse{animation:none}
  .strip-ticks{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:none;mask-image:none}
  .strip-ticks::-webkit-scrollbar{display:none}
}

/* ---------- Masthead ---------- */
.masthead{background:var(--paper);border-bottom:1px solid var(--rule)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:22px;padding-bottom:18px;gap:16px}
.mast-left{font-size:12.5px;color:var(--ink-soft);line-height:1.6;min-width:150px}
.mast-left strong{color:var(--ink)}
.brand{text-align:center}
.brand h1,.brand .brand-name{font-family:var(--serif);font-weight:900;font-size:clamp(28px,4.4vw,50px);letter-spacing:-0.015em;line-height:1}
.brand h1 .watch,.brand .brand-name .watch{color:var(--cobalt)}
.brand .tagline{font-size:12.5px;color:var(--ink-soft);margin-top:6px;letter-spacing:.10em}
.mast-right{display:flex;gap:10px;align-items:center;justify-content:flex-end;min-width:150px}
.btn{font-family:var(--sans);font-size:13px;font-weight:600;padding:9px 18px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;transition:background .15s,color .15s}
.btn:hover{background:var(--ink);color:#fff}
.btn.solid{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
.btn.solid:hover{background:var(--cobalt-deep);border-color:var(--cobalt-deep)}

/* ---------- Navigation ---------- */
/* Sticky bar of top-level sections; each opens a drop-down of its
   subsections on hover or keyboard focus. No overflow clipping on .wrap at
   desktop widths - an overflow-x:auto ancestor would crop the drop-downs. */
.nav{background:var(--paper);border-bottom:2px solid var(--ink);position:sticky;top:0;z-index:50}
.nav .wrap{display:flex;align-items:stretch;justify-content:center;gap:0}
.nav-list{display:flex;align-items:stretch;list-style:none;margin:0;padding:0}
.nav-item{position:relative}
.nav-item>a{display:block;font-size:14px;font-weight:600;padding:13px 17px;white-space:nowrap;border-bottom:3px solid transparent;transition:border-color .15s,color .15s}
.nav-item>a:hover,.nav-item:focus-within>a{border-bottom-color:var(--cobalt);color:var(--ink)}
.nav-item>a.active{border-bottom-color:var(--cobalt);color:var(--cobalt)}
.nav .search-link{margin-left:auto;display:flex;align-items:center;padding:0 0 0 17px;color:var(--ink-soft);border-bottom:3px solid transparent;transition:color .15s}
.nav .search-link:hover{color:var(--cobalt)}
.search-icon{display:block}
.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}

/* Drop-down panel */
.nav-item.has-sub>a::after{content:"";display:inline-block;width:5px;height:5px;margin:0 0 3px 7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);opacity:.55}
.sub{position:absolute;top:100%;left:0;min-width:236px;padding-top:0;background:#fff;border:1px solid var(--rule);border-top:2px solid var(--cobalt);box-shadow:0 14px 34px -14px rgba(16,32,47,.35);
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .14s,transform .14s,visibility 0s .14s;z-index:60}
.nav-item:hover>.sub,.nav-item:focus-within>.sub{opacity:1;visibility:visible;transform:none;transition:opacity .14s,transform .14s,visibility 0s}
.sub ul{list-style:none;margin:0;padding:8px 0}
.sub a{display:block;font-family:var(--serif);font-size:15px;font-weight:600;line-height:1.3;padding:9px 18px;border-left:3px solid transparent;color:var(--ink);white-space:nowrap}
.sub a:hover{background:var(--paper-deep);border-left-color:var(--cobalt);color:var(--cobalt)}
.sub a.active{border-left-color:var(--cobalt);color:var(--cobalt)}
/* Panels on the right half of the bar open leftwards so they never leave the viewport */
.nav-item:nth-last-child(-n+3)>.sub{left:auto;right:0}

/* Mobile menu: a Menu button that opens a drawer of <details> groups.
   Hidden on desktop; on small screens it replaces the bar. */
.nav-mobile{display:none}
@media (max-width:1020px){
  .nav .wrap{justify-content:space-between;align-items:center}
  .nav-list{display:none}
  .nav .search-link{margin-left:0;order:2;padding:12px 0 12px 12px}
  .nav-mobile{display:block;order:1}
  .nav-mobile>summary{list-style:none}
  .nav-mobile>summary::-webkit-details-marker{display:none}
  .nav-menu-btn{display:flex;align-items:center;gap:10px;padding:13px 0;font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;user-select:none}
  .nav-menu-btn:hover{color:var(--cobalt)}
  /* three bars drawn on one span; open = an X */
  .nav-burger{position:relative;width:20px;height:14px;flex-shrink:0}
  .nav-burger::before,.nav-burger::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor;transition:transform .18s,top .18s,box-shadow .18s}
  .nav-burger::before{top:0;box-shadow:0 6px 0 currentColor}
  .nav-burger::after{top:12px}
  .nav-mobile[open] .nav-burger::before{top:6px;transform:rotate(45deg);box-shadow:none}
  .nav-mobile[open] .nav-burger::after{top:6px;transform:rotate(-45deg)}
  .nav-mobile[open] .nav-menu-text{color:var(--cobalt)}
  /* the drawer hangs below the sticky bar */
  .nav-drawer{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:2px solid var(--ink);box-shadow:0 20px 40px -20px rgba(16,32,47,.35);max-height:calc(100vh - 52px);overflow-y:auto;z-index:60}
  .drawer-home,.drawer-group>summary{display:block;padding:14px 24px;font-family:var(--serif);font-size:17px;font-weight:700;color:var(--ink);border-top:1px solid var(--rule);cursor:pointer}
  .drawer-home.active,.drawer-group>summary.active{color:var(--cobalt)}
  .drawer-group>summary{list-style:none;position:relative;padding-right:48px;user-select:none}
  .drawer-group>summary::-webkit-details-marker{display:none}
  .drawer-group>summary::after{content:"";position:absolute;right:26px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:2px solid var(--ink-soft);border-bottom:2px solid var(--ink-soft);transform:rotate(45deg);transition:transform .18s}
  .drawer-group[open]>summary{background:var(--paper-deep)}
  .drawer-group[open]>summary::after{transform:rotate(-135deg);margin-top:-2px}
  .drawer-group ul{list-style:none;margin:0;padding:6px 0 10px;background:#fff}
  .drawer-group li a{display:block;padding:10px 24px 10px 36px;font-size:15px;color:var(--ink-soft);border-left:3px solid transparent}
  .drawer-group li a:hover,.drawer-group li a.active{color:var(--cobalt);border-left-color:var(--cobalt)}
  .drawer-group li a.drawer-all{font-weight:600;color:var(--ink)}
  .drawer-foot{display:flex;gap:10px;padding:16px 24px 20px;border-top:1px solid var(--rule)}
  .drawer-foot a{flex:1;text-align:center;font-size:14px;font-weight:600;padding:11px 14px;border:1.5px solid var(--ink);color:var(--ink)}
  .drawer-foot a.drawer-subscribe{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
}

/* Anchored targets sit below the sticky bar, not under it */
[id]{scroll-margin-top:64px}

/* Section page: strip of the section's subsections under the heading */
.subnav{display:flex;flex-wrap:wrap;gap:8px;margin:-8px 0 26px}
.subnav a{font-size:13px;font-weight:600;padding:6px 13px;border:1px solid var(--rule);color:var(--ink-soft);transition:border-color .15s,color .15s,background .15s}
.subnav a:hover{border-color:var(--cobalt);color:var(--cobalt)}
.subnav a.active{background:var(--cobalt);border-color:var(--cobalt);color:#fff}

/* ---------- Section headers ---------- */
.sec-head{display:flex;align-items:baseline;gap:16px;border-top:2.5px solid var(--ink);padding-top:10px;margin-bottom:22px}
.sec-head h2{font-family:var(--serif);font-size:24px;font-weight:700;letter-spacing:-.01em}
.sec-head .sub{font-size:13px;color:var(--ink-soft)}
.sec-head .more{margin-left:auto;font-size:13px;font-weight:600;color:var(--cobalt);white-space:nowrap}
.sec-head .more:hover{color:var(--cobalt-deep)}
.kicker{font-size:12.5px;font-weight:700;color:var(--cobalt);letter-spacing:.02em;display:block;margin-bottom:6px}
.meta{font-size:12px;color:var(--ink-soft)}
.meta b{color:var(--ink);font-weight:600}

/* ---------- Lead package ---------- */
.lead-zone{padding:34px 0 40px;border-bottom:1px solid var(--rule)}
.lead-grid{display:grid;grid-template-columns:1.9fr 1fr 1fr;gap:32px}
.lead-story .art{aspect-ratio:16/9;background:linear-gradient(135deg,var(--cobalt-deep),var(--cobalt) 55%,#3E6FC4);position:relative;margin-bottom:16px;overflow:hidden}
.lead-story .art .art-tag{position:absolute;left:0;bottom:0;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:7px 14px;letter-spacing:.03em}
.lead-story h3{font-family:var(--serif);font-size:clamp(26px,3vw,38px);font-weight:900;line-height:1.12;letter-spacing:-.015em;margin-bottom:12px}
.lead-story .standfirst{font-family:var(--serif);font-size:17.5px;color:var(--ink-soft);line-height:1.55;margin-bottom:12px}
.lead-col h4, .stack h4{font-family:var(--serif);font-size:19px;font-weight:700;line-height:1.25;margin-bottom:8px}
.stack article{padding:16px 0;border-bottom:1px solid var(--rule)}
.stack article:first-child{padding-top:0}
.stack article:last-child{border-bottom:none;padding-bottom:0}
.briefing-rail{background:var(--ink);color:#E7ECF2;padding:22px 22px 18px;align-self:start}
.briefing-rail .rail-head{font-family:var(--serif);font-size:20px;font-weight:700;color:#fff;padding-bottom:12px;border-bottom:1px solid var(--rule-dark);margin-bottom:6px}
.briefing-rail .rail-note{font-size:12px;color:#9FB0C2;margin-bottom:6px}
.briefing-rail ol{list-style:none;counter-reset:brief}
.briefing-rail li{counter-increment:brief;padding:13px 0;border-bottom:1px solid var(--rule-dark);display:flex;gap:12px;font-size:14.5px;line-height:1.4}
.briefing-rail li:last-child{border-bottom:none}
.briefing-rail li::before{content:counter(brief);font-family:var(--serif);font-weight:700;font-size:18px;color:var(--cobalt);background:#fff;min-width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.briefing-rail a{color:#E7ECF2}
.briefing-rail a:hover{color:#fff;text-decoration:underline}
.rail-cta{display:inline-block;margin-top:14px;font-size:13px;font-weight:700;color:#fff;border:1.5px solid #fff;padding:8px 16px}
.rail-cta:hover{background:#fff;color:var(--ink)}

/* ---------- Latest wire ---------- */
.wire{background:var(--paper-deep);border-bottom:1px solid var(--rule)}
.wire .wrap{display:flex;gap:26px;align-items:baseline;padding-top:12px;padding-bottom:12px;overflow-x:auto;font-size:13.5px}
.wire .wire-label{font-weight:700;color:var(--loss);white-space:nowrap;display:flex;align-items:center;gap:7px}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--loss);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.wire a{white-space:nowrap;color:var(--ink-soft)}
.wire a b{color:var(--ink);font-weight:600}
.wire time{color:var(--cobalt);font-weight:700;margin-right:5px}

/* ---------- Generic news grids ---------- */
.section{padding:42px 0}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card .art{aspect-ratio:16/10;margin-bottom:12px;background:var(--paper-deep)}
.card h4{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.28;margin-bottom:7px}
.card p{font-size:13.5px;color:var(--ink-soft);margin-bottom:8px}
.tone-a{background:linear-gradient(160deg,#153B6E,#1E5CA8)}
.tone-b{background:linear-gradient(160deg,#3B2F17,#8A6A22)}
.tone-c{background:linear-gradient(160deg,#12403A,#1F7A63)}
.tone-d{background:linear-gradient(160deg,#3D1F2A,#8A3B52)}
.tone-e{background:linear-gradient(160deg,#20242B,#4C5666)}
.tone-f{background:linear-gradient(160deg,#4A2A10,#A05C1E)}

/* ---------- Capital tracker ---------- */
.capital{background:var(--ink);color:#E7ECF2}
.capital .sec-head{border-top-color:#fff}
.capital .sec-head h2{color:#fff}
.capital .sec-head .sub{color:#9FB0C2}
.capital table{width:100%;border-collapse:collapse;font-size:14px}
.capital th{text-align:left;font-size:12px;font-weight:600;color:#9FB0C2;padding:10px 14px;border-bottom:1px solid var(--rule-dark)}
.capital td{padding:13px 14px;border-bottom:1px solid var(--rule-dark);vertical-align:top}
.capital tr:hover td{background:#182B3E}
.capital .co{font-weight:700;color:#fff}
.capital .amt{font-family:var(--serif);font-weight:700;font-size:16px;color:#fff;white-space:nowrap}
.chip{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 9px;border:1px solid var(--rule-dark);color:#BCC9D6;white-space:nowrap}
.cap-note{font-size:12.5px;color:#9FB0C2;margin-top:14px}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-scroll table{min-width:520px}

/* ---------- Industry radar ---------- */
.radar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--rule);border-width:1px 0 0 1px}
.radar-cell{border:1px solid var(--rule);border-width:0 1px 1px 0;padding:20px}
.radar-cell h3{font-family:var(--serif);font-size:18px;font-weight:700;padding-bottom:10px;margin-bottom:12px;border-bottom:2px solid var(--cobalt);display:flex;justify-content:space-between;align-items:baseline}
.radar-cell h3 a:hover{color:var(--cobalt)}
.radar-cell ul{list-style:none}
.radar-cell li{font-size:14px;line-height:1.42;padding:8px 0;border-bottom:1px dotted var(--rule)}
.radar-cell li:last-child{border-bottom:none}
.radar-cell li a{font-weight:500}

/* ---------- Leadership ---------- */
.leader-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px}
.convo{background:var(--paper-deep);padding:26px;border-top:3px solid var(--cobalt)}
.convo .q{font-family:var(--serif);font-size:clamp(21px,2.2vw,27px);font-weight:700;line-height:1.25;margin:10px 0 14px}
.convo .who{font-size:13.5px;color:var(--ink-soft)}
.convo .who b{color:var(--ink)}
.moves li{list-style:none;padding:12px 0;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.45}
.moves li:last-child{border-bottom:none}
.moves .co{font-weight:700}
.watch-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.watch-tabs span{font-size:12px;font-weight:700;border:1px solid var(--rule);padding:4px 10px;color:var(--ink-soft)}
.watch-tabs span.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---------- Markets ---------- */
.mkt-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mkt-col h3{font-family:var(--serif);font-size:17px;font-weight:700;border-bottom:2px solid var(--ink);padding-bottom:8px;margin-bottom:10px}
.mkt-num{display:flex;justify-content:space-between;font-size:13.5px;padding:7px 0;border-bottom:1px dotted var(--rule)}
.mkt-num .v{font-weight:700}
.mkt-col article{padding-top:12px;font-size:14px;line-height:1.4}
.mkt-col article a{font-weight:600}

/* ---------- Regions ---------- */
.region-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;border-left:1px solid var(--rule)}
.region-col{border-right:1px solid var(--rule);padding:0 16px}
.region-col h3{font-family:var(--serif);font-size:16.5px;font-weight:700;margin-bottom:10px}
.region-col h3 span{display:block;font-family:var(--sans);font-size:11.5px;font-weight:600;color:var(--cobalt);margin-bottom:3px}
.region-col ul{list-style:none}
.region-col li{font-size:13.5px;line-height:1.42;padding:7px 0;border-top:1px dotted var(--rule)}

/* ---------- Research ---------- */
.research{background:var(--paper-deep)}
.res-card{background:#fff;border:1px solid var(--rule);padding:20px;display:flex;flex-direction:column;gap:8px}
.res-card .type{font-size:11.5px;font-weight:700;color:#fff;background:var(--cobalt);align-self:flex-start;padding:3px 9px}
.res-card h4{font-family:var(--serif);font-size:17.5px;font-weight:700;line-height:1.3}
.res-card p{font-size:13px;color:var(--ink-soft)}
.res-card .get{margin-top:auto;font-size:13px;font-weight:700;color:var(--cobalt);padding-top:8px}

/* ---------- Franchises ---------- */
.franchise{border-top:2.5px solid var(--ink)}
.fr-band{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--rule);border-right:none}
.fr-item{border-right:1px solid var(--rule);padding:20px 18px;position:relative}
.fr-item .cadence{font-size:11.5px;font-weight:700;color:var(--ink-soft)}
.fr-item h4{font-family:var(--serif);font-size:17px;font-weight:700;line-height:1.25;margin:7px 0 6px}
.fr-item p{font-size:12.5px;color:var(--ink-soft)}
.fr-item:hover{background:var(--paper-deep)}
/* Read Now call to action on a franchise that has its own page. A soft
   blink (opacity), not the harsh CSS blink; the global reduced-motion rule
   stops it for people who asked for no animation. */
.fr-cta{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:13px;font-weight:700;letter-spacing:.02em;color:#fff;background:var(--cobalt);padding:7px 14px;animation:cta-blink 1.6s ease-in-out infinite}
.fr-item.has-cta:hover .fr-cta{animation:none;background:var(--cobalt-deep)}
@keyframes cta-blink{0%,100%{opacity:1}50%{opacity:.45}}

/* ---------- Newsletter ---------- */
.newsletter{background:var(--cobalt);color:#fff}
.newsletter .wrap{display:flex;align-items:center;gap:30px;padding-top:34px;padding-bottom:34px;flex-wrap:wrap}
.newsletter h2{font-family:var(--serif);font-size:26px;font-weight:900}
.newsletter p{font-size:14px;color:#D6E1F5;max-width:420px}
.newsletter form{display:flex;gap:0;margin-left:auto;flex:1;max-width:440px;min-width:280px}
.newsletter input{flex:1;font-family:var(--sans);font-size:14px;padding:12px 16px;border:none;min-width:0}
.newsletter button{font-family:var(--sans);font-size:14px;font-weight:700;background:var(--ink);color:#fff;border:none;padding:12px 22px;cursor:pointer}
.newsletter button:hover{background:#000}

/* ---------- Footer ---------- */
footer{background:var(--ink);color:#9FB0C2;font-size:13.5px}
.foot-brand{padding:38px 0 26px;border-bottom:1px solid var(--rule-dark)}
.foot-brand .name{font-family:var(--serif);font-size:26px;font-weight:900;color:#fff}
.foot-brand .name .watch{color:#5C87D6}
.foot-brand p{margin-top:8px;max-width:560px}
.foot-map{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;padding:28px 0}
.foot-map h5{font-size:13px;font-weight:700;color:#fff;margin-bottom:12px}
.foot-map ul{list-style:none}
.foot-map li{padding:4px 0}
.foot-map a:hover{color:#fff}
.foot-legal{border-top:1px solid var(--rule-dark);padding:18px 0;display:flex;gap:22px;flex-wrap:wrap;font-size:12.5px}
.foot-legal .copy{margin-right:auto}

/* ---------- Responsive ---------- */
/* Nine sections plus Search need ~1090px at the desktop padding; tighten it
   a little before the bar would start clipping the Search link. */
@media (max-width:1200px){
  .nav-item>a{padding:13px 12px}
  .nav-item.has-sub>a::after{margin-left:5px}
}
@media (max-width:1020px){
  .lead-grid{grid-template-columns:1fr 1fr}
  .briefing-rail{grid-column:1 / -1}
  .grid-4,.mkt-grid{grid-template-columns:repeat(2,1fr)}
  .grid-3,.radar-grid{grid-template-columns:repeat(2,1fr)}
  .leader-grid{grid-template-columns:1fr 1fr}
  .convo{grid-column:1 / -1}
  .region-grid{grid-template-columns:repeat(3,1fr);border-left:none}
  .region-col{padding:0 14px 14px;border-left:1px solid var(--rule)}
  .fr-band{grid-template-columns:repeat(2,1fr);border-right:1px solid var(--rule)}
  .fr-item:nth-child(odd){border-left:none}
  .foot-map{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:640px){
  .masthead .wrap{flex-direction:column;gap:10px}
  .mast-left{display:none}
  .mast-right{min-width:0}
  .lead-grid,.grid-4,.grid-3,.radar-grid,.leader-grid,.mkt-grid{grid-template-columns:1fr}
  .region-grid{grid-template-columns:1fr}
  .fr-band{grid-template-columns:1fr}
  .foot-map{grid-template-columns:repeat(2,1fr)}
  .newsletter form{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}