/* ============================================================================
   FRAME — homepage-only visual layer (Phase 3A, trimmed in Phase 3B)
   The generator system (header, intro, workspace, type navigation, inputs,
   customise, preview, Download) now lives in generator-premium.css, shared
   with the 12 dedicated generator pages; this file must load AFTER it.
   What stays here is the homepage's marketing content below the tool: one
   section language (plain labels, flat hairline cards, untinted icons, FAQ
   as a list). Colours come from the shared --fr-* palette.
   ========================================================================= */

/* the older shared tokens, remapped for the homepage's content sections too */
#page-home{
  --accent:var(--fr-accent-strong);
  --accent-soft:var(--fr-accent-soft);
  --ink:var(--fr-ink);--ink-soft:var(--fr-ink-2);--ink-dim:var(--fr-dim);
  --border:var(--fr-line);--border-soft:var(--fr-line-soft);
  --ws-ink:var(--fr-ink);--ws-ink-2:var(--fr-ink-2);--ws-dim:var(--fr-dim);
  --ws-line:var(--fr-line);--ws-line-strong:var(--fr-line-strong);
  --ws-surface:var(--fr-stage);--ws-mist:var(--fr-stage);--ws-hover:var(--fr-hover);
  --ws-teal:var(--fr-ink);
}

/* -------------------------------------------------- 9. below the tool */
/* section labels: plain small text, not pills */
#page-home .strip-head .eyebrow,#page-home section .eyebrow{
  background:none!important;border:0!important;padding:0!important;border-radius:0!important;
  font-size:13px!important;font-weight:600!important;letter-spacing:0!important;color:var(--fr-accent-ink)!important;
}
#page-home section .eyebrow::before,#page-home section .eyebrow::after{display:none!important;}
/* one card language: hairline, 10px, flat, no lift */
#page-home .card,#page-home .template-card,#page-home .qrtype-card,#page-home .placement-card,
#page-home .placement-tips,#page-home .health-drop{
  border:1px solid var(--fr-line)!important;border-radius:var(--fr-r-md)!important;
  box-shadow:none!important;background:#fff!important;transform:none!important;
}
#page-home .card:hover,#page-home .template-card:hover,#page-home .qrtype-card:hover{
  border-color:var(--fr-line-strong)!important;box-shadow:none!important;transform:none!important;
}
/* icons without coloured tiles */
#page-home .card-icon,#page-home .qrtype-ico,#page-home .placement-ico,#page-home .health-drop-icon{
  background:none!important;border:0!important;width:auto!important;height:auto!important;
  justify-content:flex-start!important;color:var(--fr-ink-2)!important;border-radius:0!important;
}
/* FAQ: a list with hairlines, not a stack of cards */
#page-home .faq-item{
  background:transparent!important;border:0!important;border-bottom:1px solid var(--fr-line)!important;
  border-radius:0!important;box-shadow:none!important;margin:0!important;
}
#page-home .faq-item:first-of-type{border-top:1px solid var(--fr-line)!important;}
#page-home .checker-link,#page-home .explainer-item a{color:var(--fr-accent-ink)!important;}