/* ============================================================================
   project-frontline21.css — THE FRONTLINE21 PROJECT ENVIRONMENT
   ----------------------------------------------------------------------------
   Frontline21's voice is a contrast between declaration and explanation, and
   the type system IS that contrast: Quantico Bold declares, Poppins explains.
   The case study says so in its own words, so the campaign cannot be presented
   honestly in Radikal.

   SCOPE — everything here is inside @layer project and every selector is
   inside .project-content[data-project="frontline21"]. Unlayered universal
   components (navigation, the closing, the metadata footer, page utilities)
   beat this layer without !important, so neither face can reach them.

   LICENCE — Quantico (Matthew Desmond) and Poppins (Indian Type Foundry) are
   both SIL Open Font License 1.1. The licence texts ship alongside the faces
   in assets/fonts/frontline21/. Roman cuts only; no italic file is delivered,
   so no italic can render even if one were requested.
   ========================================================================== */

@font-face{
  font-family:'Quantico';
  src:url('../fonts/frontline21/quantico-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Quantico';
  src:url('../fonts/frontline21/quantico-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';
  src:url('../fonts/frontline21/poppins-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';
  src:url('../fonts/frontline21/poppins-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}

@layer project{
  .project-content[data-project="frontline21"]{
    --fl-declare:'Quantico', sans-serif;   /* uncompromising declaration */
    --fl-explain:'Poppins', sans-serif;    /* humble, economical explanation */
    font-family:var(--fl-explain);
    font-weight:400;
    /* Legacy page sheets in this environment ask for --font-system and
       --font-meaning. Redefining them HERE means every one of those rules
       resolves to this project's typefaces without a single selector being
       rewritten — and re-defining them again on the universal components
       hands the shell back its own voice inside the same document. */
    --font-system:  var(--fl-explain);
    --font-meaning: var(--fl-declare);
    --font-meaning-fallback: var(--fl-explain);
    --font-display: var(--fl-declare);
    --font:         var(--fl-explain);
    /* the page's own local tokens, redefined at the boundary rather than at
       :root — :root is shared with the global navigation. */
    --f21-display:  var(--fl-declare);
    --f21-body:     var(--fl-explain);
    font-synthesis:none;
  }

  /* --- DECLARATION: Quantico Bold ---------------------------------------
     Major display statements, large pull quotes, campaign headings. Quantico
     is a squared geometric face: it needs its tracking opened at small sizes
     and closed at display sizes, and it must never be asked for a weight
     between 400 and 700 because only those two cuts are delivered. */
  .project-content[data-project="frontline21"] :where(h1,h2,h3),
  .project-content[data-project="frontline21"] .fl-declare,
  .project-content[data-project="frontline21"] .pullquote__line{
    font-family:var(--fl-declare);
    font-weight:700;
    letter-spacing:-.012em;
    text-transform:uppercase;
  }
  .project-content[data-project="frontline21"] :where(h4,h5,h6){
    font-family:var(--fl-explain);
    font-weight:500;
    letter-spacing:.01em;
  }

  /* --- EXPLANATION: Poppins ---------------------------------------------- */
  .project-content[data-project="frontline21"] :where(p,li,dd,dt,figcaption,
    small,td,th,label,blockquote,summary){
    font-family:var(--fl-explain);
  }
  .project-content[data-project="frontline21"] :where(figcaption,small,
    .caption,.label,.meta){
    font-weight:400;
    letter-spacing:.02em;
  }
  .project-content[data-project="frontline21"] :where(b,strong){font-weight:500}

  /* Poppins ships no italic here and the portfolio forbids obliques. */
  .project-content[data-project="frontline21"] :where(em,i,cite){
    font-style:normal;font-weight:500;
  }
}