@import url("https://fonts.googleapis.com/css2?family=Literata:opsz,wght@7..72,400;7..72,500;7..72,600;7..72,700&family=Lexend:wght@400;500;600;700&family=Azeret+Mono:wght@400;500;600&display=swap");
/* Cleverbase gen1 — shared stylesheet. Tokens come from :root (variant.php). */
/* frftp.org: Literata for headlines — Google built it as a reading serif for long-form study, and
   this is a site about learning. Lexend for the body: it was designed off reading-proficiency
   research, which is the one typographic claim this site can honestly make. Azeret Mono carries
   the study-plan figures, where weeks and hours have to line up in a column. */
:root{--font-mono:"Azeret Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --warn:#8a4b14} /* rare secondary: reserved */

/* ---------- reset-ish ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-soft);color:var(--ink);
  font-family:var(--font-body);font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-dark);text-decoration:underline}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);line-height:1.22;color:var(--ink);
  margin:0 0 .5em;font-weight:700}
h1{font-size:2.1rem}h2{font-size:1.6rem}h3{font-size:1.3rem}h4{font-size:1.1rem}
p,ul,ol,blockquote,figure,table{margin:0 0 1.1rem}
blockquote{border-left:3px solid var(--accent);padding:.2rem 0 .2rem 1rem;color:var(--muted);font-style:italic}
hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- layout ---------- */
.container{max-width:var(--maxwidth);margin:0 auto;padding:0 20px}
.site-main{padding:34px 0 48px}
.layout{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start}
@media(max-width:960px){.layout{grid-template-columns:1fr}}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:12px;background:#fff;padding:8px 14px;z-index:1000;border-radius:var(--radius)}

/* ---------- header: composed from independent axes ----------
   header_style (structure) x brand_mark x nav_style x header_device = 875 combinations.
   Header-local tokens (--h-*) let one nav implementation work on both the dark shell and the
   light 'rule' structure, so the axes stay genuinely independent instead of fighting each other. */
.site-header{background:var(--shell);color:var(--shell-ink);
  --h-ink:var(--shell-ink);--h-muted:var(--shell-muted);
  --h-hair:rgba(255,255,255,.15);--h-hover:rgba(255,255,255,.08);--h-line:rgba(255,255,255,.30);
  --h-accent:var(--shell-ink)} /* on the dark shell the accent is too dark for text; borders still use --accent */
.site-header a{color:var(--h-ink)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--font-head);font-weight:700;font-size:1.4rem;line-height:1.1}
.brand img{max-height:46px;width:auto}
.brand .tagline{display:block;font-family:var(--font-body);font-weight:400;font-size:.72rem;
  color:var(--h-muted);letter-spacing:.02em;margin-top:2px}
.brand a:hover{text-decoration:none}

/* --- axis: header_device (the accent gesture) --- */
.hd-under3{border-bottom:3px solid var(--accent)}
.hd-top5{border-top:5px solid var(--accent)}
.hd-hairline{border-bottom:1px solid var(--h-line)}
.hd-double{border-bottom:1px solid var(--h-line);position:relative}
.hd-double::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--accent)}

/* --- axis: brand_mark --- */
.hm-rule .brand-text{display:inline-block;padding-top:8px;border-top:2px solid var(--accent)}
.hm-initial .bm-initial{font-size:1.32em;line-height:.85;color:var(--h-accent)}
.site-header--rule.hm-initial .bm-initial{color:var(--accent)}
.hm-bracket .bm-br{color:var(--h-accent);font-weight:400;margin:0 .1em;opacity:.75}
.site-header--rule.hm-bracket .bm-br{color:var(--accent);opacity:1}
.hm-dot .bm-dot{display:inline-block;width:.32em;height:.32em;border-radius:50%;
  background:var(--h-accent);margin-left:.2em;vertical-align:.12em}
.site-header--rule.hm-dot .bm-dot{background:var(--accent)}
.hm-stack .brand{flex-direction:column;align-items:flex-start;gap:0}
.hm-stack .tagline{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.15em;
  text-transform:uppercase;margin-top:5px}

/* --- the site signature slot (filled by the site's own gimmick) --- */
.header-mark{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;
  color:var(--h-muted);text-align:right;line-height:1.45;margin-left:auto}
.header-mark strong{color:var(--h-ink);font-weight:600}
.header-mark a{border-bottom:1px solid var(--h-hair)}
@media(max-width:960px){.header-mark{display:none}}

/* ---------- header structures ---------- */

/* masthead — centred brand over a nav on its own rule. Editorial / journal. */
.site-header--masthead .header-inner{flex-direction:column;justify-content:center;gap:0;padding:20px 0 0;min-height:0}
.site-header--masthead .brand{flex-direction:column;text-align:center;gap:8px;font-size:1.75rem;letter-spacing:.01em}
.site-header--masthead .brand .tagline{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;margin-top:4px}
.site-header--masthead .main-nav{width:100%;margin-top:16px;border-top:1px solid var(--h-hair)}
.site-header--masthead .main-nav ul{justify-content:center;padding:6px 0}
.site-header--masthead .nav-toggle{position:absolute;right:0;top:18px}
.site-header--masthead .container{position:relative}
.site-header--masthead .header-mark{position:absolute;left:0;top:22px;text-align:left;margin-left:0}

/* tiers — a thin utility strip above the main row. Institutional. */
.site-header--tiers .header-utility{background:rgba(0,0,0,.26);border-bottom:1px solid rgba(255,255,255,.10);font-size:.76rem}
.site-header--tiers .header-utility-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px}
.site-header--tiers .hu-kicker{color:var(--h-muted);letter-spacing:.11em;text-transform:uppercase}
.site-header--tiers .hu-mark{color:var(--h-muted);font-family:var(--font-mono);font-size:.72rem}
.site-header--tiers .hu-contact{color:var(--h-muted)}
.site-header--tiers .hu-contact:hover{color:var(--h-ink)}
.site-header--tiers .header-inner{min-height:64px}

/* tile — brand sits in a filled accent block. Product / tool. */
.site-header--tile .brand{background:var(--accent);align-self:stretch;margin:0;padding:0 20px;gap:11px}
.site-header--tile .brand a,.site-header--tile .brand .brand-name{color:#fff}
.site-header--tile .brand .tagline{color:rgba(255,255,255,.82)}
.site-header--tile .header-inner{padding:0;min-height:78px;align-items:stretch}
.site-header--tile .header-inner>.nav-toggle,.site-header--tile .header-inner>.main-nav,
.site-header--tile .header-mark{align-self:center}
.site-header--tile .brand img{max-height:38px}

/* rule — LIGHT header. Reference / manual. */
.site-header--rule{background:var(--bg);color:var(--ink);
  --h-ink:var(--ink);--h-muted:var(--muted);--h-hair:var(--line);
  --h-hover:var(--bg-soft);--h-line:var(--line);--h-accent:var(--accent)}

/* ---------- axis: nav_style ---------- */
.main-nav ul{list-style:none;display:flex;align-items:center;gap:6px;margin:0;padding:0}
.main-nav a{display:block;font-size:.95rem;font-weight:500;color:var(--h-ink);
  transition:background .15s ease,color .15s ease,border-color .15s ease}
.main-nav a:hover{text-decoration:none}

.nv-pill .main-nav a{padding:9px 13px;border-radius:var(--radius)}
.nv-pill .main-nav a:hover{background:var(--h-hover)}
.nv-pill .main-nav .current-menu-item>a,.nv-pill .main-nav .current_page_item>a{background:var(--accent);color:#fff}

.nv-underline .main-nav ul{gap:22px}
.nv-underline .main-nav a{padding:6px 0;border-bottom:2px solid transparent}
.nv-underline .main-nav a:hover{border-bottom-color:var(--h-hair)}
.nv-underline .main-nav .current-menu-item>a,.nv-underline .main-nav .current_page_item>a{border-bottom-color:var(--accent)}

.nv-caps .main-nav ul{gap:20px}
.nv-caps .main-nav a{padding:7px 0;font-size:.79rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.nv-caps .main-nav a:hover{color:var(--h-accent)}
.nv-caps .main-nav .current-menu-item>a,.nv-caps .main-nav .current_page_item>a{color:var(--h-accent);
  box-shadow:inset 0 -2px 0 var(--accent)}

.nv-divider .main-nav ul{gap:0}
.nv-divider .main-nav li+li{border-left:1px solid var(--h-hair)}
.nv-divider .main-nav a{padding:6px 16px;font-size:.9rem}
.nv-divider .main-nav a:hover{color:var(--h-accent)}
.nv-divider .main-nav .current-menu-item>a,.nv-divider .main-nav .current_page_item>a{color:var(--h-accent);font-weight:700}

.nv-boxed .main-nav ul{gap:8px}
.nv-boxed .main-nav a{padding:8px 13px;border:1px solid var(--h-hair);border-radius:var(--radius);font-size:.86rem}
.nv-boxed .main-nav a:hover{border-color:var(--h-line)}
.nv-boxed .main-nav .current-menu-item>a,.nv-boxed .main-nav .current_page_item>a{background:var(--accent);border-color:var(--accent);color:#fff}

.nav-toggle{display:none;background:transparent;border:1px solid var(--h-line);color:var(--h-ink);
  border-radius:var(--radius);padding:8px 11px;font-size:1rem;cursor:pointer;line-height:1}

@media(max-width:768px){
  /* every combination collapses to the same one-column stack + burger */
  .nav-toggle{display:inline-flex}
  .main-nav{display:none;width:100%;order:3}
  .main-nav.open{display:block}
  .main-nav ul{flex-direction:column;align-items:stretch;gap:2px;padding-bottom:12px}
  .main-nav a{padding:11px 12px}
  .nv-divider .main-nav li+li{border-left:0;border-top:1px solid var(--h-hair)}
  .nv-underline .main-nav a{border-bottom:0}
  .header-inner{flex-wrap:wrap;min-height:0;padding:12px 0}
  .site-header--masthead .header-inner{padding:14px 0}
  .site-header--masthead .brand{font-size:1.35rem}
  .site-header--masthead .nav-toggle{position:static;margin-top:10px}
  .site-header--masthead .main-nav{margin-top:10px}
  .site-header--tiers .header-utility-inner{justify-content:center;gap:10px}
  .site-header--tiers .hu-contact,.site-header--tiers .hu-mark{display:none}
  .site-header--tile .header-inner{align-items:center;padding:10px 0}
  .site-header--tile .brand{padding:10px 14px;align-self:flex-start;border-radius:var(--radius)}
}

/* ---------- post cards / grid ---------- */
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 18px;
  padding-bottom:10px;border-bottom:1px solid var(--line)}
.section-head h2{margin:0;font-size:1.25rem}
.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
@media(max-width:560px){.post-grid{grid-template-columns:1fr}}

.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:box-shadow .16s ease,border-color .16s ease}
.card:hover{border-color:#e2ded7;box-shadow:0 6px 20px rgba(15,20,36,.09)}
.card .thumb{display:block;aspect-ratio:16/10;background:var(--bg-soft);overflow:hidden}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .thumb,.lead .thumb{position:relative}
.thumb-rating{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:.3em;padding:.32em .6em;border-radius:var(--radius);background:rgba(18,18,18,.85);color:#fff;font-size:.85rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;box-shadow:0 1px 5px rgba(0,0,0,.35)}
.thumb-rating .s{color:#f5b301;font-size:.95em}
.card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.card .cat{font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--accent)}
.card h3{margin:0;font-size:1.16rem;line-height:1.28}
.card h3 a{color:var(--ink)}
.card h3 a:hover{color:var(--accent);text-decoration:none}
.card .excerpt{color:var(--muted);font-size:.94rem;margin:0}
.card .meta{margin-top:auto;padding-top:6px;color:var(--muted);font-size:.8rem}
.card .meta time{display:block}
.meta .card-imdb{color:#b8860b;font-weight:800;font-size:.78rem;margin-right:.45rem;font-variant-numeric:tabular-nums}
.meta .card-film{color:var(--muted);font-weight:600;font-size:.78rem;font-variant-numeric:tabular-nums}

/* featured lead */
.lead{display:grid;grid-template-columns:1.15fr 1fr;gap:0;background:var(--bg);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;margin:0 0 34px}
.lead .thumb{aspect-ratio:auto;min-height:280px}
.lead .card-body{padding:26px 30px;justify-content:center;gap:12px}
.lead h2{font-size:1.9rem;line-height:1.18;margin:0}
.lead h2 a{color:var(--ink)}
.lead h2 a:hover{color:var(--accent);text-decoration:none}
.lead .excerpt{font-size:1rem;color:var(--muted)}
@media(max-width:760px){.lead{grid-template-columns:1fr}.lead .thumb{min-height:210px}}

/* ---------- FRONT-PAGE LANDING (front-page.php) ---------- */
/* full-width bands: neutralise the container width-clamp on the static front page only */
body.fp-landing .site-main{padding:0}
body.fp-landing .site-main > .container{max-width:none;padding:0}
.fp-wrap{max-width:var(--maxwidth);margin:0 auto;padding:0 24px}
a.btn{display:inline-flex;align-items:center;gap:8px}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--accent);
  border:1px solid var(--accent);border-radius:var(--radius);padding:11px 18px;font:inherit;font-weight:600;
  cursor:pointer;transition:background .15s ease,color .15s ease}
.btn-ghost:hover{background:var(--accent);color:#fff;text-decoration:none}
.fp-eyebrow{font-family:var(--font-mono);font-size:.72rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--accent);margin:0}

/* hero */
.fp-hero{padding:60px 0 54px}
/* Hero style 'banner': full-width dark editorial masthead (flows from the dark header) — alt silhouette to the split hero */
.fp-hero--banner{background:var(--shell);color:var(--shell-ink);padding:64px 0 60px;border-bottom:3px solid var(--accent)}
.fp-hero-banner{max-width:900px;text-align:center}
.fp-hero--banner .fp-eyebrow{color:var(--accent)}
.fp-hero--banner .fp-hero-text h1{color:#fff;font-size:clamp(2.4rem,5vw,3.7rem)}
.fp-hero--banner .fp-sub{color:var(--shell-muted);max-width:62ch;margin-left:auto;margin-right:auto;font-size:1.14rem}
.fp-hero--banner .fp-cta{justify-content:center}
.fp-hero--banner .btn-ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.fp-hero--banner .btn-ghost:hover{background:#fff;color:var(--shell)}
/* Hero style 'cover': full-bleed background image + dark gradient overlay + centered text */
.fp-hero--cover{background-size:cover;background-position:center;color:#fff;padding:96px 0 92px;border-bottom:3px solid var(--accent)}
.fp-hero--cover .fp-eyebrow{color:#fff;opacity:.92}
.fp-hero--cover .fp-hero-text h1{color:#fff;font-size:clamp(2.6rem,5.4vw,4rem);text-shadow:0 2px 18px rgba(0,0,0,.45)}
.fp-hero--cover .fp-sub{color:rgba(255,255,255,.9);max-width:60ch;margin-left:auto;margin-right:auto;font-size:1.16rem}
.fp-hero--cover .fp-cta{justify-content:center}
.fp-hero--cover .btn-ghost{color:#fff;border-color:rgba(255,255,255,.5)}
.fp-hero--cover .btn-ghost:hover{background:#fff;color:#15111e}
.fp-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:center}
.fp-hero-text h1{font-size:clamp(2.2rem,4.4vw,3.2rem);line-height:1.12;letter-spacing:-.01em;margin:16px 0 0;text-wrap:balance}
.fp-sub{font-size:1.1rem;color:var(--muted);margin:20px 0 0;max-width:52ch}
.fp-cta{display:flex;flex-wrap:wrap;gap:13px;margin:30px 0 0}
.fp-hero-media{position:relative}
.fp-hero-media img{width:100%;aspect-ratio:8/5;object-fit:cover;border-radius:10px;border:1px solid var(--line);
  box-shadow:0 24px 50px -28px rgba(20,32,31,.5)}
.fp-hero-badge{position:absolute;left:-16px;bottom:22px;background:var(--bg);border:1px solid var(--line);
  border-radius:var(--radius);padding:12px 15px;display:flex;align-items:center;gap:11px;max-width:232px;
  box-shadow:0 12px 30px -14px rgba(20,32,31,.35)}
.fp-hero-badge svg{width:22px;height:22px;color:var(--accent);flex:none}
.fp-hero-badge b{font-family:var(--font-body);font-size:.83rem;font-weight:700;display:block;color:var(--ink)}
.fp-hero-badge span{font-family:var(--font-body);font-size:.76rem;color:var(--muted)}
@media(max-width:600px){.fp-hero-badge{left:12px;right:12px;bottom:12px;max-width:none}}

/* hero style 'spec': brand-system spec panel (signature) — ink card, mono labels, accent swatch */
.fp-spec{background:var(--shell);color:var(--shell-ink);border-radius:calc(var(--radius) + 3px);
  padding:26px 26px 24px;border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden;
  box-shadow:0 30px 60px -30px rgba(15,20,36,.6)}
.fp-spec::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent)}
.fp-spec-head{display:flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:.66rem;
  font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--shell-muted)}
.fp-spec-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none;
  box-shadow:0 0 0 3px rgba(36,64,255,.28)}
.fp-spec-v{margin-left:auto;color:var(--accent)}
.fp-spec-mark{font-family:var(--font-head);font-weight:700;font-size:2rem;line-height:1;
  letter-spacing:-.02em;color:#fff;margin:16px 0 18px}
.fp-spec-rows{margin:0;display:flex;flex-direction:column}
.fp-spec-row{display:grid;grid-template-columns:74px 1fr;gap:14px;align-items:center;
  padding:11px 0;border-top:1px solid rgba(255,255,255,.09)}
.fp-spec-row dt{margin:0;font-family:var(--font-mono);font-size:.65rem;font-weight:700;
  letter-spacing:.1em;color:var(--shell-muted)}
.fp-spec-row dd{margin:0;font-family:var(--font-body);font-size:.9rem;font-weight:600;
  color:var(--shell-ink);display:flex;align-items:center;gap:9px}
.fp-spec-rows > .fp-spec-row:first-child dd{font-family:var(--font-mono);font-weight:700;letter-spacing:.02em}
.fp-spec-sw{width:16px;height:16px;border-radius:4px;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.fp-spec-note{font-family:var(--font-mono);font-size:.72rem;line-height:1.55;color:var(--shell-muted);
  margin:18px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.09)}
@media(max-width:900px){.fp-spec{max-width:460px}}

/* hero style 'label': gazetteer / museum object card (signature) — plate photo above a
   catalogue label. The structural devices are real: the number is the entry's post id,
   the rows are verifiable facts about that monument, and the card links to its article. */
.fp-label{background:var(--bg);border:1px solid var(--line);border-radius:calc(var(--radius) + 2px);
  overflow:hidden;box-shadow:0 26px 54px -30px rgba(15,26,51,.45);position:relative}
.fp-label::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gild);z-index:1}
.fp-label-plate{display:block;margin:0}
.fp-label-plate img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.fp-label-body{padding:20px 22px 22px}
.fp-label-head{display:flex;align-items:baseline;gap:10px;font-family:var(--font-mono);font-size:.66rem;
  font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.fp-label-no{margin-left:auto;color:var(--gild);letter-spacing:.08em}
.fp-label-name{font-family:var(--font-head);font-weight:600;font-size:1.72rem;line-height:1.15;
  margin:10px 0 0;color:var(--ink);letter-spacing:-.01em}
.fp-label-name a{color:inherit;text-decoration:none}
.fp-label-name a:hover{color:var(--accent)}
.fp-label-rows{margin:16px 0 0;display:flex;flex-direction:column}
.fp-label-row{display:grid;grid-template-columns:88px 1fr;gap:14px;align-items:baseline;
  padding:8px 0;border-top:1px solid var(--line)}
.fp-label-row dt{margin:0;font-family:var(--font-mono);font-size:.64rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fp-label-row dd{margin:0;font-size:.9rem;font-weight:400;color:var(--ink)}
.fp-label-link{display:inline-flex;align-items:center;gap:7px;margin:16px 0 0;font-family:var(--font-mono);
  font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);
  text-decoration:none;border-bottom:1px solid transparent}
.fp-label-link:hover{border-bottom-color:var(--accent)}
@media(max-width:900px){.fp-label{max-width:480px}}

/* credibility strip */
.fp-cred{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fp-cred-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.fp-cred-item{padding:26px 26px 26px 0;display:flex;gap:14px;align-items:flex-start}
.fp-cred-item + .fp-cred-item{padding-left:26px;border-left:1px solid var(--line)}
.fp-cred-item svg{width:26px;height:26px;color:var(--accent);flex:none;margin-top:2px}
.fp-cred-item b{font-family:var(--font-body);font-weight:700;font-size:.97rem;display:block;margin-bottom:3px;color:var(--ink)}
.fp-cred-item span{font-size:.86rem;color:var(--muted);line-height:1.5}

/* articles section (reuses .layout/.lead/.post-grid/.card + Magenet sidebar) */
.fp-articles{padding:58px 0}
.fp-articles .lead h3{font-size:1.8rem;line-height:1.16;margin:0}
.fp-articles .lead h3 a{color:var(--ink)}
.fp-articles .lead h3 a:hover{color:var(--accent);text-decoration:none}

/* topics */
.fp-topics{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:52px 0}
.section-head.fp-flat{border:0;margin-bottom:24px;padding:0}
.fp-topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.fp-topic{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:20px 18px;background:var(--bg-soft);
  transition:border-color .16s ease,background .16s ease}
.fp-topic:hover{border-color:var(--accent);background:#f6efe9;text-decoration:none}
.fp-topic .n{font-family:var(--font-head);font-weight:700;font-size:1.08rem;color:var(--ink);display:block}
.fp-topic .c{font-family:var(--font-body);font-size:.8rem;color:var(--muted);margin-top:5px;display:block}

/* tool feature band (dark shell) */
.fp-toolband{background:var(--shell);color:var(--shell-ink);padding:56px 0}
.fp-tool-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.fp-toolband .fp-eyebrow{color:var(--accent)}
.fp-toolband h2{color:var(--shell-ink);font-size:2.1rem;margin:14px 0 0}
.fp-toolband p{color:var(--shell-muted);margin:16px 0 26px;max-width:46ch}
.fp-tool-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:10px;padding:22px 26px}
.fp-tool-card .tl{font-family:var(--font-body);font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.fp-tool-card .row{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.1);
  font-family:var(--font-body);font-size:.94rem;color:var(--shell-ink)}
.fp-tool-card .row:last-child{border-bottom:0}
.fp-tool-card .row svg{width:19px;height:19px;color:#e0a56a;flex:none}

/* contact cta */
.fp-contact{padding:64px 0;text-align:center}
.fp-contact .fp-eyebrow{margin-bottom:10px}
.fp-contact h2{font-size:2rem}
.fp-contact p{color:var(--muted);max-width:52ch;margin:14px auto 26px}

/* landing responsive */
@media(max-width:900px){
  .fp-hero-grid,.fp-tool-grid{grid-template-columns:1fr;gap:30px}
  .fp-hero{padding:42px 0 40px}
  .fp-cred-grid{grid-template-columns:1fr 1fr}
  .fp-cred-item + .fp-cred-item{border-left:0}
  .fp-cred-item{padding:22px 20px 22px 0}
  .fp-cred-item:nth-child(n+3){border-top:1px solid var(--line);padding-top:22px}
}
@media(max-width:560px){
  .fp-cred-grid{grid-template-columns:1fr}
  .fp-cred-item:nth-child(n+2){border-top:1px solid var(--line);padding-top:22px}
}

/* ================= FRONT-PAGE BLOCK VARIANTS (per-site silhouette knobs) ================= */
/* Each repeating band has 2-4 structural variants chosen in variant.php so sites in the
   network differ in STRUCTURE, not only colour. Defaults keep the original look. */

/* --- TRUST: cards --- */
.fp-cred--cards{background:transparent;border-top:0;border-bottom:0}
.fp-cred--cards .fp-cred-grid{gap:16px;padding:34px 0}
.fp-cred--cards .fp-cred-item,
.fp-cred--cards .fp-cred-item + .fp-cred-item{flex-direction:column;gap:12px;padding:20px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--bg);transition:border-color .16s ease,box-shadow .16s ease}
.fp-cred--cards .fp-cred-item:hover{border-color:var(--accent);box-shadow:0 8px 24px -14px rgba(15,20,36,.35)}
.fp-cred--cards .fp-cred-ic{display:inline-flex;padding:9px;border-radius:var(--radius);background:var(--bg-soft)}
/* --- TRUST: ribbon (dark inline values) --- */
.fp-cred--ribbon{background:var(--shell);border-top:0;border-bottom:0;border-top:3px solid var(--accent)}
.fp-cred--ribbon .fp-cred-grid{display:flex;flex-wrap:wrap;gap:12px 28px;padding:20px 24px}
.fp-cred--ribbon .fp-cred-item,
.fp-cred--ribbon .fp-cred-item + .fp-cred-item{padding:0;border:0;align-items:center;gap:10px}
.fp-cred--ribbon .fp-cred-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none}
.fp-cred--ribbon b{color:#fff;font-size:.92rem;display:block}
.fp-cred--ribbon span{display:none}
/* --- TRUST: numbered (mono ordinals) --- */
.fp-cred--numbered .fp-cred-n{font-family:var(--font-mono);font-size:1.35rem;font-weight:700;color:var(--accent);
  flex:none;line-height:1;letter-spacing:-.02em;margin-top:1px}

/* --- TOPICS: pills --- */
.fp-topic-pills{display:flex;flex-wrap:wrap;gap:10px}
.fp-pill{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:999px;
  padding:9px 16px;background:var(--bg);font-family:var(--font-head);font-weight:600;font-size:.98rem;color:var(--ink);
  transition:border-color .16s ease,background .16s ease}
.fp-pill:hover{border-color:var(--accent);background:var(--bg-soft);text-decoration:none}
.fp-pill b{font-family:var(--font-mono);font-size:.72rem;font-weight:700;color:var(--accent);
  background:var(--bg-soft);border-radius:999px;padding:2px 9px;line-height:1.5}
.fp-pill:hover b{background:var(--bg)}
/* --- TOPICS: index (ranked list) --- */
.fp-topic-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.fp-topic-index li{border-bottom:1px solid var(--line)}
.fp-topic-index a{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:18px;padding:18px 4px;color:var(--ink)}
.fp-topic-index a:hover{text-decoration:none}
.fp-topic-index .ix{font-family:var(--font-mono);font-size:.82rem;font-weight:700;color:var(--muted)}
.fp-topic-index .n{font-family:var(--font-head);font-weight:700;font-size:1.3rem;letter-spacing:-.01em}
.fp-topic-index a:hover .n{color:var(--accent)}
.fp-topic-index .c{font-family:var(--font-mono);font-size:.74rem;color:var(--muted);white-space:nowrap}
.fp-topic-index .ar{color:var(--accent);display:inline-flex;opacity:0;transform:translateX(-5px);transition:.16s ease}
.fp-topic-index a:hover .ar{opacity:1;transform:none}
@media(max-width:560px){.fp-topic-index a{grid-template-columns:auto 1fr auto;gap:12px}.fp-topic-index .ar{display:none}.fp-topic-index .n{font-size:1.12rem}}

/* --- TOOLBAND: centered --- */
.fp-tool-centered{max-width:760px;margin:0 auto;text-align:center}
.fp-tool-centered h2{margin:14px 0 0}
.fp-tool-centered > p{color:var(--shell-muted);margin:16px auto 0;max-width:56ch}
.fp-tool-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 26px}
.fp-tool-chips span{font-family:var(--font-body);font-size:.86rem;color:var(--shell-ink);
  border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:8px 15px}
/* --- TOOLBAND: mock (mini tool preview) --- */
.fp-tool-mock{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:10px;
  padding:22px 24px;position:relative;overflow:hidden}
.fp-tool-mock::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent)}
.fp-tool-mock-head{display:flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:.66rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--shell-muted)}
.fp-tool-mock-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:16px 0 0;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}
.fp-tool-mock-stats > div{background:var(--shell);padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.fp-tool-mock-stats .k{font-family:var(--font-mono);font-size:.6rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--shell-muted)}
.fp-tool-mock-stats .v{font-family:var(--font-head);font-weight:700;font-size:1.5rem;color:#fff;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.fp-tool-mock-note{font-family:var(--font-mono);font-size:.7rem;color:var(--shell-muted);margin:14px 0 0}

/* --- CONTACT: band (dark) --- */
.fp-contact--band{background:var(--shell);color:var(--shell-ink)}
.fp-contact--band .fp-eyebrow{color:var(--accent)}
.fp-contact--band h2{color:#fff}
.fp-contact--band p{color:var(--shell-muted)}
.fp-contact--band .btn{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.fp-contact--band .btn:hover{background:#fff;color:var(--shell)}
/* --- CONTACT: split --- */
.fp-contact--split{text-align:left}
.fp-contact-split{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.fp-contact-lead h2{margin:12px 0 0}
.fp-contact-lead p{color:var(--muted);max-width:52ch;margin:14px 0 0}
.fp-contact-card{background:var(--shell);color:var(--shell-ink);border-radius:10px;padding:26px 28px;position:relative;overflow:hidden}
.fp-contact-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent)}
.fp-contact-card-k{font-family:var(--font-mono);font-size:.64rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--shell-muted);display:block}
.fp-contact-mail{display:inline-block;margin:12px 0 8px;font-family:var(--font-head);font-weight:700;font-size:1.3rem;
  color:#fff;overflow-wrap:anywhere}
.fp-contact-mail:hover{color:var(--accent);text-decoration:none}
.fp-contact-card-note{font-size:.82rem;color:var(--shell-muted);display:block}
@media(max-width:760px){.fp-contact-split{grid-template-columns:1fr;gap:24px}}

/* ---------- home magazine sections ---------- */
.cat-section{margin:0 0 38px}
.cat-section:last-child{margin-bottom:0}
.section-head .view-all{font-size:.84rem;font-weight:600;color:var(--accent);white-space:nowrap}
.section-head .view-all:hover{text-decoration:none;color:var(--accent-dark)}
.row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.row-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.row-3{grid-template-columns:1fr}}

/* ---------- single / page ---------- */
.entry{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:34px 40px 40px}
@media(max-width:600px){.entry{padding:22px 20px 26px}}
.entry-header{margin:0 0 22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.entry-header .cat{font-size:.74rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--accent)}
.entry-header h1{margin:.35rem 0 .5rem;font-size:2.3rem;line-height:1.15}
@media(max-width:600px){.entry-header h1{font-size:1.7rem}}
.entry-meta{color:var(--muted);font-size:.86rem;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.entry-featured{margin:0 0 24px;border-radius:var(--radius);overflow:hidden}
.entry-content{max-width:var(--measure)}
.entry-content > *{max-width:100%}
.entry-content h2{margin-top:1.7em}
.entry-content h3{margin-top:1.4em}
.entry-content img,.entry-content figure{border-radius:var(--radius)}
.entry-content a{text-decoration:underline;text-underline-offset:2px}
.entry-content ul,.entry-content ol{padding-left:1.3em}
.entry-content li{margin-bottom:.4rem}
.entry-content table{width:100%;border-collapse:collapse}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:8px 11px;text-align:left}
.entry-content th{background:var(--bg-soft)}

.page-hero{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:28px 40px;margin:0 0 24px}
.page-hero h1{margin:0;font-size:2.2rem}
@media(max-width:600px){.page-hero{padding:22px 20px}.page-hero h1{font-size:1.7rem}}

.post-tags{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.post-tags a{display:inline-block;border:1px solid var(--line);border-radius:var(--radius);padding:3px 10px;margin:0 6px 6px 0;color:var(--muted)}
.post-tags a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}

/* ---------- sidebar / widgets (Magenet lives here) ---------- */
.sidebar{position:sticky;top:20px;display:flex;flex-direction:column;gap:24px}
.widget{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:18px 18px 20px}
.widget-title{margin:0 0 14px;font-size:1rem;padding-bottom:9px;border-bottom:1px solid var(--line)}
.widget ul{list-style:none;margin:0;padding:0}
.widget li{padding:7px 0;border-bottom:1px solid var(--line);font-size:.93rem}
.widget li:last-child{border-bottom:0}
.widget a{color:var(--ink)}
.widget a:hover{color:var(--accent)}
/* keep Magenet's async container visible even before JS fills it */
.widget .mads-block{min-height:1px}

/* ---------- pagination ---------- */
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin:34px 0 0;justify-content:center}
.pagination .page-numbers{display:inline-flex;min-width:40px;height:40px;align-items:center;justify-content:center;
  padding:0 12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);color:var(--ink);font-size:.92rem}
.pagination a.page-numbers:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.pagination .page-numbers.current{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---------- footer (dark shell) ---------- */
.site-footer{background:var(--shell);color:var(--shell-muted);margin-top:40px;border-top:3px solid var(--accent)}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px;padding:44px 0 34px}
@media(max-width:760px){.footer-top{grid-template-columns:1fr;gap:26px}}
.site-footer h4{color:var(--shell-ink);font-size:1rem;margin:0 0 14px}
.site-footer a{color:var(--shell-muted)}
.site-footer a:hover{color:var(--shell-ink)}
/* Magenet money links: distinct light colour so they stand out from the dark footer text */
.mads-block a,[class*="magenet-monetization"] a,[class^="nw-magenet"] a{color:#fcd34d;text-decoration:underline;text-underline-offset:2px}
.mads-block a:hover,[class*="magenet-monetization"] a:hover,[class^="nw-magenet"] a:hover{color:#fde68a}
/* Full-width landing "Latest guides" (no sidebar — money lives in the footer here, not the sidebar) */
.fp-nosidebar{grid-template-columns:1fr}
.fp-nosidebar .post-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.fp-nosidebar .post-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.fp-nosidebar .post-grid{grid-template-columns:1fr}}
.footer-about p{margin:0;font-size:.92rem;line-height:1.6}
.footer-menu ul{list-style:none;margin:0;padding:0}
.footer-menu li{padding:5px 0;font-size:.92rem}
.footer-bottom{border-top:1px solid rgba(255,255,255,.09);padding:18px 0;font-size:.84rem;
  display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center}

/* ---------- small util ---------- */
.tool-embed{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
/* min-width:0 is required: a search input has an intrinsic min width and flex items default to
   min-width:auto, so without it the input refuses to shrink and shoves the button out of the
   sidebar card. max-width:100% keeps the whole form inside its container at any width. */
.searchform{display:flex;gap:8px;max-width:100%}
.searchform input[type=search]{flex:1 1 0;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius);font:inherit;max-width:100%}
.searchform button{flex:0 0 auto}
.btn,.searchform button{background:var(--accent);color:#fff;border:0;border-radius:var(--radius);padding:10px 16px;
  font:inherit;font-weight:600;cursor:pointer;transition:background .15s ease}
.btn:hover,.searchform button:hover{background:var(--accent-dark);text-decoration:none;color:#fff}

/* ---------- home intro band + YMYL medical disclaimer ---------- */
.home-intro{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 26px;margin:0 0 28px}
.home-intro h1{font-size:1.7rem;margin:0 0 .4em}
.home-intro-text{color:var(--muted);max-width:var(--measure);margin:0}
.med-note{margin:18px 0 0;padding:13px 15px;background:var(--bg-soft);
  border-left:3px solid var(--warn);border-radius:0 var(--radius) var(--radius) 0;
  font-size:.86rem;line-height:1.55;color:var(--muted);max-width:var(--measure)}
.med-note strong{color:var(--ink)}
.site-footer .med-note{background:transparent;border-left-color:var(--shell-muted);
  color:var(--shell-muted);max-width:none;margin-top:14px;padding:10px 0 10px 14px}
.site-footer .med-note strong{color:var(--shell-ink)}
@media(max-width:600px){.home-intro{padding:18px 16px}.home-intro h1{font-size:1.4rem}}

/* ---------- home landing blocks (front page = posts index, so these live in home.php) ---------- */
.home-hero{display:grid;grid-template-columns:1fr 400px;gap:38px;align-items:start;margin:0 0 22px}
.hh-text h1{font-size:2.25rem;margin:0 0 .45em;text-wrap:balance}
.hh-sub{color:var(--muted);max-width:var(--measure);margin:0 0 1.3rem;font-size:1.04rem}
.hh-cta{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.btn-ghost{display:inline-block;padding:10px 16px;border:1px solid var(--line);border-radius:var(--radius);
  color:var(--ink);font-weight:600;font-size:.95rem;background:var(--bg)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}

/* the signature: a translation card — jargon on the left, plain English on the right */
.hh-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.hh-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:11px 16px;background:var(--shell);color:var(--shell-ink);
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.09em;text-transform:uppercase}
.hh-card-n{color:var(--shell-muted)}
.hh-pairs{margin:0;padding:6px 16px}
.hh-pair{padding:13px 0;border-bottom:1px solid var(--line)}
.hh-pair:last-child{border-bottom:0}
.hh-pair dt{font-family:var(--font-mono);font-size:.82rem;font-weight:600;color:var(--accent);
  letter-spacing:.02em;margin:0 0 4px}
.hh-pair dd{margin:0;font-size:.92rem;line-height:1.5;color:var(--ink)}
.hh-card-more{display:block;padding:12px 16px;border-top:1px solid var(--line);background:var(--bg-soft);
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.home-med{margin:0 0 24px}

/* credibility strip */
.home-trust{list-style:none;display:flex;flex-wrap:wrap;gap:0;margin:0 0 30px;padding:0;
  background:var(--shell);border-radius:var(--radius);overflow:hidden}
.home-trust li{flex:1 1 auto;padding:13px 18px;color:var(--shell-ink);font-size:.86rem;font-weight:600;
  border-right:1px solid rgba(255,255,255,.10)}
.home-trust li:last-child{border-right:0;color:var(--shell-muted)}

/* tool band */
.home-toolband{display:grid;grid-template-columns:1fr 380px;gap:34px;align-items:center;
  background:var(--shell);color:var(--shell-ink);border-radius:var(--radius);padding:30px 32px;margin:40px 0 0}
.home-toolband h2{color:var(--shell-ink);margin:0 0 .4em;font-size:1.55rem}
.home-toolband p{color:var(--shell-muted);margin:0 0 1.1rem;max-width:52ch}
.htb-kicker{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--shell-muted);margin:0 0 .7em!important}
.htb-points{list-style:none;margin:0;padding:16px 18px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);border-radius:var(--radius)}
.htb-points li{position:relative;padding:0 0 0 22px;margin:0 0 10px;font-size:.88rem;color:var(--shell-ink);line-height:1.45}
.htb-points li:last-child{margin-bottom:0}
.htb-points li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;
  border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}

/* contact band */
.home-contact{display:grid;grid-template-columns:1fr 340px;gap:34px;align-items:center;margin:40px 0 0}
.home-contact h2{margin:0 0 .4em;font-size:1.5rem}
.home-contact p{color:var(--muted);margin:0;max-width:56ch}
.hc-kicker{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin:0 0 .7em!important}
.hc-card{background:var(--shell);border-radius:var(--radius);padding:22px 24px}
.hc-card-k{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--shell-muted);margin:0 0 .6em!important}
.hc-card-e{font-family:var(--font-head);font-size:1rem;font-weight:700;margin:0 0 .5em!important;
  overflow-wrap:anywhere}
.hc-card-e a{color:var(--shell-ink)}
.hc-card-n{font-size:.8rem;color:var(--shell-muted);margin:0!important}

@media(max-width:900px){
  .home-hero,.home-toolband,.home-contact{grid-template-columns:1fr;gap:24px}
  .hh-text h1{font-size:1.8rem}
  .home-toolband{padding:24px 20px}
}
@media(max-width:600px){
  .home-trust{flex-direction:column}
  .home-trust li{border-right:0;border-bottom:1px solid rgba(255,255,255,.10)}
  .home-trust li:last-child{border-bottom:0}
}


/* ---------- hero card: schedule variant (offset column + label) ---------- */
.hh-pair--sched{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:baseline}
.hh-pair--sched dt{font-family:var(--font-mono);font-size:1.05rem;font-weight:600;color:var(--accent);
  margin:0;text-align:right;font-variant-numeric:tabular-nums}
.hh-pair--sched .hh-wk{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-left:3px}
.hh-pair--sched dd{font-size:.94rem;line-height:1.45}
.home-hero--solo{grid-template-columns:1fr}

/* ---------- language switcher (Polylang: en + pt_BR) ---------- */
/* Sits inside the nav so it collapses into the burger with everything else on a phone. */
.lang-switch{list-style:none;display:flex;align-items:center;gap:4px;margin:0 0 0 14px;
  padding:0 0 0 14px;border-left:1px solid var(--h-hair)}
.lang-switch a{display:block;padding:5px 9px;border-radius:var(--radius);
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;color:var(--h-muted)}
.lang-switch a:hover{color:var(--h-ink);background:var(--h-hover);text-decoration:none}
.lang-switch .is-current a{color:var(--h-ink);box-shadow:inset 0 0 0 1px var(--h-hair)}
@media(max-width:768px){
  .lang-switch{margin:8px 0 0;padding:8px 0 0;border-left:0;border-top:1px solid var(--h-hair)}
}

/* ---------- Magenet widget ----------
   The plugin prints the paid link server-side and leaves the container EMPTY on pages it has no
   link for. Keep the container in the DOM (never display:none — that would hide money the day the
   slot fills), but drop the card chrome so an empty slot does not read as a broken box. The inner
   .magenet_widget_box is itself a .widget, which would otherwise draw a second card inside the
   first. On this site the homepage and /the-new-umoma-opens-its-doors-2/ are both sold URLs, so
   this widget area must render on the posts index AND on pages. */
.widget_magenet_widget .magenet_widget_box{background:none;border:0;padding:0;border-radius:0}
.widget_magenet_widget:has(.mads-block:empty){padding:0;border:0;background:none}

/* Two .btn-ghost:hover rules exist above: the first fills the button with the accent, the later
   one only recolours border + label without resetting that background — together they render a
   solid accent button with accent-coloured text on it. One deliberate hover: stays hollow. */
.btn-ghost:hover,.btn-ghost:focus-visible{background:transparent;border-color:var(--accent);
  color:var(--accent);text-decoration:none}

/* ============================================================================
   frftp.org — the study plan (front-page hero signature)
   Every other thing on this site is an article you read once. The plan is the one
   thing you finish. So the landing opens with the planner's own worked example —
   real arithmetic, the same function the tool page runs — laid out as the schedule
   it produces. Boldness is spent here; everything below stays quiet.
   ========================================================================== */
.hh-plan{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden}
.hh-plan-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:11px 16px;background:var(--shell);color:var(--shell-ink);
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.11em;text-transform:uppercase}
.hh-plan-head .pl-n{color:var(--shell-muted)}

/* the three inputs, stated as figures so the reader can check the sum themselves */
.hh-plan-figs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
.hh-plan-figs div{padding:13px 14px;border-left:1px solid var(--line)}
.hh-plan-figs div:first-child{border-left:0}
.hh-plan-figs dt{font-family:var(--font-mono);font-size:.58rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.hh-plan-figs dd{margin:0;font-family:var(--font-mono);font-size:1.15rem;font-weight:600;
  color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.1}
.hh-plan-figs .pl-unit{font-size:.66rem;font-weight:500;color:var(--muted);margin-left:2px}

/* the schedule itself: one row per checkpoint, week number in the accent */
.hh-plan-rows{list-style:none;margin:0;padding:0}
.hh-plan-rows li{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:baseline;
  padding:10px 16px;border-top:1px solid var(--line)}
.hh-plan-rows li:first-child{border-top:0}
.hh-plan-rows .pl-wk{font-family:var(--font-mono);font-size:.78rem;font-weight:600;
  color:var(--accent);font-variant-numeric:tabular-nums}
.hh-plan-rows .pl-what{font-size:.9rem;line-height:1.4;color:var(--ink)}
.hh-plan-rows .pl-when{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.hh-plan-rows li.is-done .pl-what{color:var(--ink);font-weight:600}
.hh-plan-more{display:block;padding:12px 16px;border-top:1px solid var(--line);
  background:var(--bg-soft);font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:600}
.hh-plan-more:hover{background:var(--shell);color:var(--shell-ink);text-decoration:none}

@media(max-width:520px){
  .hh-plan-figs{grid-template-columns:1fr 1fr}
  .hh-plan-figs div:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}
}

/* ============================================================================
   The study planner (the gimmick page) — [frftp_studyplan]
   Server-rendered with a worked example so it still answers the question with
   JavaScript off; the script only recomputes.
   ========================================================================== */
.spl{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);overflow:hidden}
.spl-knobs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px;
  padding:22px 22px 20px;background:var(--bg-soft);border-bottom:1px solid var(--line)}
.spl-knob label{display:block;font-family:var(--font-mono);font-size:.62rem;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin:0 0 7px}
.spl-knob input,.spl-knob select{width:100%;padding:9px 11px;border:1px solid var(--line);
  border-radius:var(--radius);font:inherit;font-size:.95rem;background:var(--bg);color:var(--ink)}
.spl-knob .spl-hint{display:block;margin:6px 0 0;font-size:.74rem;color:var(--muted);line-height:1.45}

.spl-out{padding:22px}
.spl-headline{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0 0 20px;
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.spl-headline div{padding:15px 16px;border-left:1px solid var(--line)}
.spl-headline div:first-child{border-left:0}
.spl-headline .k{display:block;font-family:var(--font-mono);font-size:.6rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 5px}
.spl-headline .v{display:block;font-family:var(--font-mono);font-size:1.5rem;font-weight:600;
  color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.1}
.spl-headline .u{font-size:.7rem;font-weight:500;color:var(--muted);margin-left:3px}
.spl-headline div.is-key{background:var(--bg-soft);box-shadow:inset 3px 0 0 var(--accent)}
.spl-headline div.is-key .v{color:var(--accent)}

.spl-track{list-style:none;margin:0 0 18px;padding:0;border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden}
.spl-track li{display:grid;grid-template-columns:58px 1fr 110px 92px;gap:12px;align-items:baseline;
  padding:11px 15px;border-top:1px solid var(--line);font-size:.9rem}
.spl-track li:first-child{border-top:0}
.spl-track li.spl-head{background:var(--bg-soft);font-family:var(--font-mono);font-size:.6rem;
  font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.spl-track .t-wk{font-family:var(--font-mono);font-weight:600;color:var(--accent);
  font-variant-numeric:tabular-nums}
.spl-track .t-h,.spl-track .t-d{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);
  font-variant-numeric:tabular-nums}
.spl-track .t-what{line-height:1.4}

.spl-note{margin:0;padding:15px 17px;background:var(--bg-soft);border:1px solid var(--line);
  border-radius:var(--radius);font-size:.86rem;line-height:1.6;color:var(--muted)}
.spl-note strong{color:var(--ink)}
.spl-warn{margin:0 0 16px;padding:13px 15px;border-left:3px solid var(--warn);
  background:var(--bg-soft);border-radius:0 var(--radius) var(--radius) 0;
  font-size:.86rem;line-height:1.55;color:var(--muted)}
.spl-warn strong{color:var(--ink)}

@media(max-width:700px){
  .spl-headline{grid-template-columns:1fr}
  .spl-headline div{border-left:0;border-top:1px solid var(--line)}
  .spl-headline div:first-child{border-top:0}
  .spl-headline div.is-key{box-shadow:inset 0 3px 0 var(--accent)}
  .spl-track li{grid-template-columns:44px 1fr 68px;gap:9px;padding:10px 12px}
  .spl-track li > :nth-child(4){display:none}
  .spl-out{padding:16px}
}

/* ---------- site-specific trims ---------- */
/* Literata is a text serif, so display sizes need pulling in a touch to stay tight */
h1,h2,h3{letter-spacing:-.008em}
/* counts are data: line the digits up */
.fp-topic-index .c,.home-trust li{font-variant-numeric:tabular-nums}
/* card hover: border + a thin shadow, no lift */
.card:hover{border-color:#d5cbdb;box-shadow:0 6px 18px rgba(36,27,43,.10)}
/* the hero is two-column on desktop; the plan card needs the shared collapse at phone widths */
@media(max-width:900px){.home-hero{grid-template-columns:1fr;gap:26px}}