/* ============================================================================
   BrandPush Report v3 - report.css  (base · primitives · hero · results · story)
   Editorial, banded, colour-forward reimagining. Plain (unlayered) rules so they
   reliably win over the base layer in tokens.css. Brand tokens reused throughout.
   ============================================================================ */

:root{
  /* generous report scale, display-forward */
  --rp-maxw: 1120px;
  --rp-narrow: 900px;
  --rp-gut: clamp(1.25rem, 0.7rem + 2.6vw, 2.5rem);

  --d-hero: clamp(3.4rem, 1.6rem + 8vw, 7rem);       /* brand name        */
  --d-stat: clamp(2.9rem, 1.7rem + 5vw, 4.9rem);     /* big headline stat */
  --d-mega: clamp(4.5rem, 2rem + 11vw, 10rem);       /* the reach moment  */
  --d-title: clamp(2rem, 1.4rem + 2.4vw, 3.1rem);    /* section titles     */
  --d-sub: clamp(1.3rem, 1.05rem + 0.9vw, 1.7rem);   /* small headlines    */

  --acc: var(--bp-coral);
  --acc-soft: var(--coral-50);
  --ink: var(--bp-navy);
  --amber: #E3A53C;
  --amber-soft: #FBF1DE;
}

/* ---- shell -------------------------------------------------------------- */
body{ background:#fff; color:var(--ink); font-size:var(--text-lg); }
.report{ overflow-x:clip; }
.inner{ max-width:var(--rp-maxw); margin-inline:auto; padding-inline:var(--rp-gut); }
.inner.narrow{ max-width:var(--rp-narrow); }

/* ---- section bands ------------------------------------------------------ */
.band{ position:relative; padding-block:clamp(4rem, 2.5rem + 6vw, 8rem); }
.band.pad-sm{ padding-block:clamp(3rem, 2rem + 3vw, 5rem); }
.band.canvas{ background:var(--bp-canvas); }
.band.paper{ background:#fff; }
.band.tint-violet{ background:linear-gradient(180deg,#fff, #F4F2FE 60%, #F1EFFD); }
.band.tint-coral{ background:linear-gradient(180deg,#FFF6F2,#FFF1EE); }
.band.dark{ background:var(--bp-indigo); color:var(--on-dark); }
.band.dark .kicker{ color:#FF97A2; }
.band + .band{ }
.band.hairtop{ border-top:1px solid var(--n-200); }

/* ---- editorial section head -------------------------------------------- */
.kicker{ display:inline-flex; align-items:center; gap:.5rem; font-size:var(--text-sm); font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--bp-coral); }
.kicker::before{ content:""; width:26px; height:2px; border-radius:2px; background:currentColor; opacity:.8; }
.kicker.center::before{ display:none; }
.sec-head{ max-width:44rem; }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-title{ font-size:var(--d-title); font-weight:800; line-height:1.05; letter-spacing:-.028em; margin-top:1rem; text-wrap:balance; }
.sec-title .hl{ color:var(--bp-coral); }
.sec-title .hlv{ color:var(--bp-violet); }
.hl-mark{ background:linear-gradient(180deg,transparent 56%, rgba(251,93,109,.32) 0); padding:0 .06em; border-radius:2px; }
.lede{ font-size:clamp(1.05rem,.98rem + .4vw,1.28rem); line-height:1.6; color:var(--n-600); margin-top:1.1rem; max-width:52ch; text-wrap:pretty; }
.sec-head.center .lede{ margin-inline:auto; }
.band.dark .lede{ color:var(--on-dark-soft); }
.band.dark .sec-title{ color:#fff; }

/* ---- buttons ----------------------------------------------------------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.55rem; font-size:var(--text-base); font-weight:700; padding:.85rem 1.4rem; border-radius:var(--r-full); transition:transform var(--dur-fast) var(--ease-out), background var(--dur-fast), box-shadow var(--dur-fast); white-space:nowrap; }
.btn:active{ transform:translateY(1px) scale(.99); }
.btn-sm{ padding:.5rem .85rem; font-size:var(--text-sm); gap:.4rem; }
.btn-coral{ background:var(--bp-coral); color:#fff; box-shadow:0 8px 20px -8px rgba(251,93,109,.7); }
.btn-coral:hover{ background:var(--bp-coral-deep); box-shadow:0 12px 26px -8px rgba(251,93,109,.75); transform:translateY(-1px); }
.btn-dark{ background:var(--bp-navy); color:#fff; }
.btn-dark:hover{ background:var(--color-primary-hover); transform:translateY(-1px); }
.btn-light{ background:#fff; color:var(--bp-navy); box-shadow:var(--shadow-sm); }
.btn-light:hover{ box-shadow:var(--shadow-md); transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--bp-navy); border:1.5px solid var(--n-300); }
.btn-ghost:hover{ border-color:var(--bp-navy); }
.band.dark .btn-ghost{ color:#fff; border-color:rgba(255,255,255,.28); }
.band.dark .btn-ghost:hover{ border-color:#fff; background:rgba(255,255,255,.06); }

a{ color:var(--bp-violet); }
a:hover{ color:var(--bp-coral); }

/* ---- chips / pills ----------------------------------------------------- */
.pillrow{ display:flex; flex-wrap:wrap; gap:.6rem; }
.pill{ display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .9rem; border-radius:var(--r-full); font-size:var(--text-sm); font-weight:600; }
.pill.line{ border:1px solid var(--n-200); background:#fff; color:var(--n-700); }
.pill.ok{ background:var(--green-soft); color:var(--green-solid); }
.pill.soft{ background:var(--color-surface-2); color:var(--n-700); }
.band.dark .pill.line{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); color:var(--on-dark); }
.pill .g{ color:var(--green); display:inline-flex; }

/* ============================================================================
   MASTHEAD / HERO
   ============================================================================ */
.hero{ position:relative; background:var(--bp-indigo); color:var(--on-dark); overflow:hidden; padding-block:clamp(1.6rem,1rem + 2vw,2.4rem) clamp(3.5rem,2rem + 6vw,6rem); }
.hero::before{ content:""; position:absolute; inset:0; background:
   radial-gradient(60% 80% at 88% -5%, rgba(251,93,109,.32), transparent 60%),
   radial-gradient(55% 75% at 4% 108%, rgba(108,92,231,.42), transparent 62%),
   radial-gradient(40% 60% at 62% 118%, rgba(251,93,109,.14), transparent 60%);
   pointer-events:none; }
.hero::after{ content:""; position:absolute; inset:0; opacity:.5; pointer-events:none; background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px); background-size:22px 22px; -webkit-mask-image:linear-gradient(180deg,#000,transparent 70%); mask-image:linear-gradient(180deg,#000,transparent 70%); }
.hero > .inner{ position:relative; z-index:1; }

.masthead{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:1.1rem 0; }
.brandlogo{ display:block; height:26px; width:auto; }
.brandlogo-link{ display:inline-block; line-height:0; text-decoration:none; color:inherit; }
.brandlogo-link:hover{ opacity:.92; }
.brandlogo-btn{ border:none; background:transparent; padding:0; cursor:pointer; font:inherit; }
.brandlogo .mark{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(150deg,#8b7bff,#6C5CE7); color:#fff; box-shadow:0 6px 16px -6px rgba(108,92,231,.9); }
.brandlogo .wm-a{ color:#fff; } .brandlogo .wm-b{ color:#a99bff; }
.masthead .mh-right{ display:flex; align-items:center; gap:.8rem; }
.mh-left{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.mh-actions{ display:flex; align-items:center; gap:.7rem; }
.export-wrap{ position:relative; }
.export-menu{ position:absolute; top:calc(100% + 8px); right:0; width:272px; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); z-index:var(--z-dropdown); padding:.4rem; transform-origin:top right; animation:pop .16s var(--ease-out); }
.export-item{ width:100%; display:flex; align-items:center; gap:.75rem; padding:.65rem .7rem; border-radius:var(--r-md); text-align:left; transition:background var(--dur-fast); }
.export-item:hover{ background:var(--color-surface-2); }
.ei-ic{ width:34px; height:34px; border-radius:9px; background:var(--color-surface-2); color:var(--bp-navy); display:grid; place-items:center; flex:none; }
.ei-tx{ display:flex; flex-direction:column; }
.ei-lab{ font-size:var(--text-sm); font-weight:700; color:var(--ink); }
.ei-sub{ font-size:var(--text-xs); color:var(--n-500); }
@keyframes pop{ from{ opacity:0; transform:scale(.96) } to{ opacity:1; transform:none } }
.report-tag{ display:inline-flex; align-items:center; gap:.5rem; font-size:var(--text-xs); font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-soft); padding:.5rem .85rem; border:1px solid rgba(255,255,255,.16); border-radius:var(--r-full); }
.report-tag .dot{ width:7px; height:7px; border-radius:50%; background:#37d99a; box-shadow:0 0 0 4px rgba(55,217,154,.18); }

.hero-grid{ margin-top:clamp(.4rem,.1rem + 1vw,1rem); display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(2rem,1rem + 4vw,4.5rem); align-items:start; }
.hero-brandrow{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:clamp(2.2rem,1.4rem + 3vw,3.4rem); }
.hero-eyebrow{ display:inline-flex; align-items:center; gap:.6rem; font-size:var(--text-sm); font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:#FF97A2; }
.hero-main{ min-width:0; }
.hero-name{ font-size:var(--d-hero); font-weight:800; line-height:.92; letter-spacing:-.04em; margin-top:1rem; color:#fff; max-width:15ch; overflow-wrap:break-word; text-wrap:balance; }
.hero-name .tm{ font-size:.28em; font-weight:700; vertical-align:super; color:var(--on-dark-soft); letter-spacing:0; }
.hero-lede{ font-size:clamp(1.1rem,1rem + .5vw,1.4rem); line-height:1.5; color:var(--on-dark); opacity:.92; margin-top:1.4rem; max-width:36ch; }
.hero-lede b{ color:#fff; font-weight:700; }
.hero-cta{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:.7rem; }
.hero .btn-ghost{ color:#fff; border-color:rgba(255,255,255,.3); }
.hero .btn-ghost:hover{ border-color:#fff; background:rgba(255,255,255,.07); }
.pill.goal{ background:rgba(251,93,109,.16); border:1px solid rgba(251,93,109,.34); color:#ffb9bf; }
.pill.goal b{ color:#fff; font-weight:700; }
.pill.goal svg{ color:#ff8e9a; }
.hero-meta{ margin-top:1.4rem; display:flex; flex-wrap:wrap; gap:.6rem; }

/* right rail: 3-card publication stack */
.hero-rail{ padding-top:0; margin-top:clamp(1rem,.4rem + 1.6vw,2.1rem); }
.rail-cap{ font-size:var(--text-xs); font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--on-dark-soft); margin:0 0 1rem .15rem; }
.card-stack{ position:relative; max-width:400px; }
.stk.s1{ position:relative; z-index:3; }
.stk.s2, .stk.s3{ position:absolute; inset:0; pointer-events:none; }
.stk.s2{ z-index:2; transform:translate(4.5%,5%) rotate(3deg); transform-origin:top center; }
.stk.s3{ z-index:1; transform:translate(9%,10.5%) rotate(6deg); transform-origin:top center; }
.stk.s2 .stkcard, .stk.s3 .stkcard{ height:100%; min-height:184px; background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; border-color:rgba(255,255,255,.18); }
.stkcard{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); color:#fff; border-radius:var(--r-2xl); padding:1.3rem 1.4rem; box-shadow:0 26px 52px -22px rgba(0,0,0,.6); }
.stk.s2 .stkcard{ box-shadow:0 22px 42px -26px rgba(0,0,0,.7); }
.stk.s3 .stkcard{ box-shadow:0 16px 34px -26px rgba(0,0,0,.62); }
.stk-top{ display:flex; align-items:center; gap:.7rem; }
.stk-id{ min-width:0; flex:1; }
.stk-name{ font-weight:800; font-size:1rem; color:#fff; letter-spacing:-.01em; }
.stk-secured{ font-size:var(--text-xs); color:#5fe0a8; font-weight:600; display:flex; align-items:center; gap:.3rem; margin-top:.1rem; }
.stk-live{ display:inline-flex; align-items:center; gap:.35rem; font-size:var(--text-2xs); font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#ff97a2; background:rgba(251,93,109,.18); padding:.28rem .5rem; border-radius:var(--r-full); flex:none; }
.stk-live .ld{ width:6px; height:6px; border-radius:50%; background:var(--bp-coral); }
.stk-head{ margin-top:1rem; font-size:1.12rem; line-height:1.3; font-weight:700; letter-spacing:-.015em; color:#fff; }
.stk-img{ margin-top:1.1rem; height:150px; border-radius:12px; overflow:hidden; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }
.stk-img img{ width:100%; height:100%; object-fit:cover; display:block; }

/* as-seen-on strip */
.asseen-strip{ position:relative; z-index:1; margin-top:clamp(2.8rem,1.5rem + 4vw,4.5rem); padding-top:2rem; border-top:1px solid rgba(255,255,255,.13); display:flex; align-items:center; gap:clamp(1rem,.5rem + 2vw,2.4rem); flex-wrap:wrap; }
.asseen-strip .as-lab{ font-size:var(--text-xs); font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--on-dark-soft); white-space:nowrap; }
.asseen-strip .as-logos{ display:flex; align-items:center; gap:clamp(1rem,.4rem + 2vw,2.2rem); flex-wrap:wrap; }
.asseen-strip .as-name{ font-size:clamp(1rem,.85rem + .5vw,1.35rem); font-weight:800; letter-spacing:-.01em; color:rgba(255,255,255,.82); }
.asseen-strip .as-more{ font-size:var(--text-sm); font-weight:700; color:#FF97A2; background:none; border:none; padding:0; cursor:pointer; transition:color .15s; }
.asseen-strip .as-more:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }

/* ============================================================================
   RESULTS AT A GLANCE  (big colourful stat grid)
   ============================================================================ */
.results{ }
.bigstats{ margin-top:clamp(2.5rem,1.5rem + 3vw,3.5rem); display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(.9rem,.5rem + 1vw,1.4rem); }
.bstat{ position:relative; border-radius:var(--r-2xl); padding:clamp(1.5rem,1.1rem + 1.5vw,2.2rem); overflow:hidden; background:#fff; border:1px solid var(--n-200); transition:transform var(--dur-normal) var(--ease-out), box-shadow var(--dur-normal); }
.bstat:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.bstat.feature{ color:#fff; border:none; }
.bstat .bs-eyebrow{ display:inline-flex; align-items:center; gap:.5rem; font-size:var(--text-xs); font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.bstat .bs-ic{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; margin-bottom:1rem; }
.bstat .bs-num{ font-size:var(--d-stat); font-weight:800; line-height:.95; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.bstat .bs-num .u{ font-size:.5em; font-weight:800; margin-left:.05em; letter-spacing:-.02em; }
.bstat .bs-lab{ margin-top:.7rem; font-size:var(--text-lg); font-weight:700; }
.bstat .bs-sub{ margin-top:.35rem; font-size:var(--text-sm); line-height:1.45; color:var(--n-500); }
.bstat.feature .bs-sub{ color:rgba(255,255,255,.72); }
.bstat .bs-glow{ position:absolute; width:180px; height:180px; border-radius:50%; right:-50px; top:-50px; filter:blur(10px); opacity:.5; pointer-events:none; }

/* spans */
.bstat.s-lg{ grid-column:span 6; }
.bstat.s-md{ grid-column:span 3; }
.bstat.s-sm{ grid-column:span 4; }

/* accent variants */
.bstat.a-coral, .bstat.a-violet, .bstat.a-navy{ color:#fff; }
.bstat.a-coral .bs-sub, .bstat.a-violet .bs-sub, .bstat.a-navy .bs-sub{ color:rgba(255,255,255,.75); }
.bstat.a-coral{ background:linear-gradient(155deg,#FF6E7D,#F03E56); }
.bstat.a-violet{ background:linear-gradient(155deg,#7d6cf0,#5b48d6); }
.bstat.a-navy{ background:linear-gradient(155deg,#2b2d5a,#1b1b3a); }
.bstat.a-coral .bs-ic{ background:rgba(255,255,255,.18); color:#fff; }
.bstat.a-violet .bs-ic{ background:rgba(255,255,255,.18); color:#fff; }
.bstat.a-navy .bs-ic{ background:rgba(255,255,255,.14); color:#fff; }
.bstat.a-coral .bs-eyebrow{ color:rgba(255,255,255,.85); }
.bstat.a-violet .bs-eyebrow{ color:rgba(255,255,255,.85); }
.bstat.a-navy .bs-eyebrow{ color:#a99bff; }
.bstat.a-navy .bs-glow{ background:radial-gradient(circle,var(--bp-violet),transparent 70%); opacity:.6; }
.bstat.a-green{ background:linear-gradient(155deg,#22B98A,#12936B); color:#fff; }
.bstat.a-green .bs-sub{ color:rgba(255,255,255,.78); }
.bstat.a-green .bs-ic{ background:rgba(255,255,255,.18); color:#fff; }
.bstat.a-green .bs-eyebrow{ color:rgba(255,255,255,.85); }
.bstat.a-green .bs-glow{ background:radial-gradient(circle,#fff,transparent 70%); opacity:.2; }
.bstat.a-green .bs-go{ background:rgba(255,255,255,.2); color:#fff; }
.bstat.a-coral .bs-glow{ background:radial-gradient(circle,#fff,transparent 70%); opacity:.18; }
.bstat.a-violet .bs-glow{ background:radial-gradient(circle,#fff,transparent 70%); opacity:.18; }

/* light stat card (paper) with coloured number */
.bstat.a-paper .bs-ic{ background:var(--coral-50); color:var(--bp-coral); }
.bstat.a-paper.g .bs-ic{ background:var(--green-soft); color:var(--green-solid); }
.bstat.a-paper .bs-num{ color:var(--ink); }
.bstat.a-paper .bs-eyebrow{ color:var(--n-500); }
/* clickable KPI */
.bstat.clickable{ cursor:pointer; text-align:left; width:100%; font:inherit; }
.bstat .bs-go{ position:absolute; top:1.1rem; right:1.1rem; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; opacity:.7; transition:transform var(--dur-fast), opacity var(--dur-fast); }
.bstat.a-paper .bs-go{ background:var(--color-surface-2); color:var(--n-500); }
.bstat.a-coral .bs-go, .bstat.a-violet .bs-go, .bstat.a-navy .bs-go{ background:rgba(255,255,255,.2); color:#fff; }
.bstat.clickable:hover .bs-go{ transform:translate(3px,-3px); opacity:1; }

/* supporting mini-stat rail */
.ministats{ margin-top:1.3rem; display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.9rem,.5rem + 1vw,1.4rem); }
.ministat{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-xl); padding:1.3rem 1.4rem; display:flex; flex-direction:column; gap:.15rem; }
.ministat .mnum{ font-size:1.9rem; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; color:var(--ink); }
.ministat .mnum.c{ color:var(--bp-coral); } .ministat .mnum.v{ color:var(--bp-violet); } .ministat .mnum.g{ color:var(--green-solid); }
.ministat .mlab{ font-size:var(--text-sm); color:var(--n-500); font-weight:500; line-height:1.35; }

/* ============================================================================
   FEATURED STORY
   ============================================================================ */
.story-lead{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(1.5rem,1rem + 3vw,3.5rem); align-items:center; margin-top:clamp(2rem,1.2rem + 2vw,3rem); }
.story-clip{ position:relative; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:clamp(1.6rem,1.1rem + 2vw,2.6rem); box-shadow:var(--shadow-md); }
.story-clip::before{ content:""; position:absolute; left:0; top:1.6rem; bottom:1.6rem; width:4px; border-radius:4px; background:linear-gradient(var(--bp-coral),var(--bp-violet)); }
.story-clip .sc-kick{ font-size:var(--text-xs); font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--bp-coral); }
.story-clip .sc-headline{ margin-top:1rem; font-size:clamp(1.5rem,1.15rem + 1.6vw,2.3rem); font-weight:800; line-height:1.14; letter-spacing:-.025em; color:var(--ink); }
.story-clip .sc-excerpt{ margin-top:1.1rem; font-size:1.08rem; line-height:1.62; color:var(--n-600); }
.story-clip .sc-byline{ margin-top:1.4rem; padding-top:1.2rem; border-top:1px solid var(--n-150); display:flex; align-items:center; gap:.6rem; font-size:var(--text-sm); color:var(--n-500); flex-wrap:wrap; }
.story-clip .sc-byline b{ color:var(--ink); }

.story-aside{ }
.story-aside .sa-title{ font-size:var(--d-sub); font-weight:800; letter-spacing:-.02em; line-height:1.15; }
.story-aside .sa-text{ margin-top:1rem; font-size:1.05rem; line-height:1.6; color:var(--n-600); }
.story-aside .sa-list{ margin-top:1.4rem; display:flex; flex-direction:column; gap:.85rem; }
.story-aside .sa-item{ display:flex; gap:.75rem; align-items:flex-start; font-size:var(--text-base); color:var(--n-700); }
.story-aside .sa-item .ck{ flex:none; width:24px; height:24px; border-radius:7px; background:var(--green-soft); color:var(--green-solid); display:grid; place-items:center; margin-top:1px; }

/* featured placement cards */
.feat-grid{ margin-top:clamp(2rem,1.2rem + 3vw,3.2rem); display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,.6rem + 1.2vw,1.5rem); }
.fcard{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:1.5rem; transition:transform var(--dur-normal) var(--ease-out), box-shadow var(--dur-normal), border-color var(--dur-normal); }
.fcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--n-300); }
.fcard .fc-head{ display:flex; align-items:center; gap:.75rem; }
.fcard .fc-id{ min-width:0; flex:1; }
.fcard .fc-name{ font-weight:800; font-size:1.05rem; letter-spacing:-.01em; }
.fcard .fc-secured{ font-size:var(--text-xs); color:var(--green-solid); font-weight:600; display:flex; align-items:center; gap:.3rem; margin-top:.15rem; }
.fcard .fc-ext{ color:var(--n-400); flex:none; }
.fcard:hover .fc-ext{ color:var(--bp-coral); }
.fcard .fc-tier{ margin-top:1.2rem; display:inline-flex; align-items:center; gap:.4rem; align-self:flex-start; font-size:var(--text-2xs); font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .6rem; border-radius:var(--r-full); background:var(--violet-50); color:var(--violet-700); }
.fcard .fc-metrics{ margin-top:1.1rem; padding-top:1.2rem; border-top:1px solid var(--n-150); display:grid; grid-template-columns:1fr 1fr; gap:1rem .8rem; }
.fcard .fm b{ display:block; font-size:1.5rem; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; color:var(--ink); }
.fcard .fm.hero-metric b{ color:var(--bp-coral); }
.fcard .fm span{ font-size:var(--text-xs); color:var(--n-500); }

/* outlet logo monogram/favicon (shared) */
.mono{ width:44px; height:44px; border-radius:11px; overflow:hidden; flex:none; background:#fff; border:1px solid var(--n-200); display:grid; place-items:center; }
.mono img{ width:100%; height:100%; object-fit:contain; padding:5px; }
.mono.ph, .mono.fav{ background:color-mix(in srgb, var(--tint) 12%, #fff); border-color:color-mix(in srgb, var(--tint) 22%, var(--n-200)); color:var(--tint); }
.mono.ph span{ font-weight:800; font-size:.95rem; letter-spacing:-.02em; }
.mono.sm{ width:38px; height:38px; border-radius:9px; }