/* The Frontline Reporting Index 2027: report page (v3).
   Loads after tandm.css and uses its tokens and components (gate-card, form,
   done, calc, ledger, statement, gap). Everything new is prefixed fri-. */

.fri-hero { position:relative; overflow:hidden; isolation:isolate; background:var(--night); color:var(--on-dark-text); padding:calc(var(--utility) + var(--header) + clamp(40px,5vw,72px)) 0 clamp(64px,7vw,104px); }
.fri-hero::before { content:""; position:absolute; inset:0; z-index:-1; background-image:var(--grain); opacity:.05; mix-blend-mode:overlay; }
.fri-hero .lf-bg { position:absolute; inset:0; z-index:-1; opacity:.55; -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.2),#000 70%); mask-image:linear-gradient(90deg,rgba(0,0,0,.2),#000 70%); }
.fri-hero .lf-bg img { width:100%; height:100%; object-fit:cover; object-position:right center; }
/* stacked (tablets and phones): the hero runs to 1,600-1,900px with the form in it,
   which scales the field up until only a bundle shows in the gutter beside the form;
   the cover carries the motif there */
@media (max-width:1060px) { .fri-hero .lf-bg { display:none; } }
.fri-hero .crumbs { margin-bottom:28px; }
.fri-hero-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--col-gap); align-items:start; }
.fri-hero-copy { grid-column:1 / span 7; }
.fri-hero-copy h1 { margin-top:20px; color:#fff; max-width:13ch; }
.fri-hero-copy .standfirst { margin-top:24px; max-width:44ch; font:400 var(--fs-lead)/1.42 var(--font-display); letter-spacing:-.012em; color:var(--ebony-200); }
.fri-hero-copy .standfirst b { font-weight:400; color:var(--azure-200); }
.fri-facts { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:24px; font-size:13.5px; color:var(--ebony-300); }
.fri-facts li { display:inline-flex; align-items:center; gap:18px; }
.fri-facts li + li::before { content:""; width:3px; height:3px; border-radius:50%; background:var(--ebony-500); margin-left:-10px; margin-right:-8px; }
.fri-stack { position:relative; margin-top:48px; height:clamp(280px,26vw,380px); max-width:560px; }
.fri-stack img { position:absolute; border-radius:3px; box-shadow:var(--shadow-ui-dark); height:100%; width:auto; }
.fri-stack-cover { left:0; top:0; z-index:3; transform:rotate(-2deg); }
.fri-stack-back1 { left:30%; top:4%; height:92% !important; z-index:2; transform:rotate(3deg); }
.fri-stack-back2 { left:56%; top:8%; height:84% !important; z-index:1; transform:rotate(7deg); opacity:.95; }
.fri-card { grid-column:8 / span 5; position:sticky; top:calc(var(--utility) + var(--header) + 24px); }
.fri-card h2 { font-size:30px; }

.fri-def { font:400 clamp(21px,1.9vw,27px)/1.35 var(--font-display); letter-spacing:-.014em; color:var(--ink); max-width:38ch; }
.fri-pov { margin-top:36px; padding:22px 24px; border-left:2px solid var(--signal); background:var(--paper-2); border-radius:0 var(--rad-2) var(--rad-2) 0; max-width:720px; }
.fri-pov p { font:400 19px/1.45 var(--font-display); color:var(--ink); letter-spacing:-.008em; }
.fri-pov cite { display:block; margin-top:10px; font:600 12px/1.3 var(--font-text); letter-spacing:.12em; text-transform:uppercase; font-style:normal; color:var(--action); }

.fri-inside { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--col-gap); row-gap:40px; align-items:start; }
.fri-toc { grid-column:1 / span 5; border-top:1px solid var(--ink); }
.fri-toc li { display:grid; grid-template-columns:64px 1fr; gap:16px; padding:14px 0; border-bottom:1px solid var(--rule); font-size:15.5px; color:var(--ink); }
.fri-toc .pg { color:var(--action); font-weight:600; font-variant-numeric:tabular-nums; }
.fri-pages { grid-column:7 / span 6; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.fri-pages img { border-radius:3px; box-shadow:var(--shadow-ui); border:1px solid var(--rule-soft); }
.fri-pages figcaption { margin-top:10px; font-size:13px; color:var(--muted); }
.fri-pages figcaption b { color:var(--action); font-weight:600; margin-right:6px; }

.fri-measures { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--rule-dark-2); border-left:1px solid var(--rule-dark); }
.fri-measures li { display:flex; flex-direction:column; padding:24px 22px 26px; border-right:1px solid var(--rule-dark); border-bottom:1px solid var(--rule-dark); min-height:250px; }
.fri-measures .n { font-size:12.5px; font-weight:600; letter-spacing:.06em; color:var(--azure-300); }
.fri-measures h3 { margin-top:16px; font-size:21px; line-height:1.2; letter-spacing:-.012em; color:#fff; }
.fri-measures p { margin-top:10px; font-size:15px; color:var(--ebony-300); }
.fri-measures .unit { margin-top:auto; padding-top:16px; font-size:13px; font-weight:600; color:var(--azure-200); }
.nobr { white-space:nowrap; }
.fri-measures-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px 40px; margin-top:40px; }
.fri-measures-foot p { max-width:64ch; color:var(--ebony-300); }

.fri-lanes { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:var(--col-gap); }
.fri-lane { grid-column:span 6; padding:26px 28px; border:1px solid var(--rule); border-radius:var(--rad-3); }
.fri-lane .label { margin-bottom:12px; }
.fri-boundary { grid-column:1 / -1; padding:26px 28px; border-radius:var(--rad-3); background:var(--deep); color:var(--azure-100); }
.fri-boundary .label { color:var(--azure-300); margin-bottom:10px; }
.fri-boundary p:last-child { font:400 clamp(20px,1.8vw,25px)/1.35 var(--font-display); letter-spacing:-.012em; color:#fff; max-width:52ch; }
.fri-calc-head { margin:clamp(64px,7vw,104px) 0 28px; max-width:72ch; }
.fri-calc-head p { margin-top:12px; color:var(--muted); }

.fri-edition { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--col-gap); row-gap:40px; align-items:start; }
.fri-edition-main { grid-column:1 / span 7; }
.fri-edition-text { margin-top:18px; font:400 clamp(20px,1.7vw,24px)/1.4 var(--font-display); letter-spacing:-.012em; color:var(--ink); }
.fri-press { grid-column:9 / span 4; padding:24px; border:1px solid var(--rule); border-radius:var(--rad-3); background:#fff; }
.fri-press h2 { margin-top:12px; }
.fri-press p { margin-top:12px; }

.fri-sticky { position:fixed; left:50%; bottom:18px; z-index:90; display:flex; align-items:center; gap:16px; padding:8px 8px 8px 18px; border-radius:var(--rad-3); background:rgba(35,40,56,.94); color:#fff; box-shadow:var(--shadow-ui-dark); transform:translateX(-50%); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); font-size:14px; border:1px solid rgba(255,255,255,.1); }
.fri-sticky .btn { height:38px; }

@media (max-width:1060px) {
  .fri-hero-copy, .fri-card { grid-column:1 / -1; }
  .fri-card { position:relative; top:auto; margin-top:40px; }
  .fri-toc, .fri-pages { grid-column:1 / -1; }
  .fri-measures { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fri-edition-main, .fri-press { grid-column:1 / -1; }
}
@media (max-width:620px) {
  .fri-measures { grid-template-columns:1fr; }
  .fri-measures li { min-height:0; }
  .fri-lane { grid-column:1 / -1; }
  .fri-stack { height:240px; }
  .fri-sticky span { display:none; }
  .fri-sticky { padding:8px; }
}
