/* Black Ledger V21: public page corrections, loaded last on every public page.
   public-v18.css forces section.block to ivory with !important, which overrode the
   :is(.dark-section,.intelligence-preview) bands: their light text sat on ivory (measured 1.05:1 to 2.09:1). */
section.block:is(.dark-section,.intelligence-preview){background:#0c0b0a!important;color:#fbfaf6!important}
:is(.dark-section,.intelligence-preview) :is(h1,h2,h3,h4,b,strong){color:#fbfaf6!important}
:is(.dark-section,.intelligence-preview) :is(p,li,.section-head p,.card p){color:#b8b2a7!important}
:is(.dark-section,.intelligence-preview) :is(.eyebrow,.card-num,.path>i,.path>span,.preview-head>span){color:#cdb683!important}
:is(.dark-section,.intelligence-preview) time{color:#b8b2a7!important}
:is(.dark-section,.intelligence-preview) .card,:is(.dark-section,.intelligence-preview) :is(.calendar-preview,.news-preview){background:transparent!important;border-color:#302f2b!important}
:is(.dark-section,.intelligence-preview) .btn{color:#fbfaf6!important;border-color:#5a5349!important;background:transparent!important}
:is(.dark-section,.intelligence-preview) .btn.primary{background:#fbfaf6!important;color:#0c0b0a!important;border-color:#fbfaf6!important}

/* Market ticker: the flex layout lived only in the academy stylesheet, so on public
   pages the status, quotes and link stacked into three rows. */
.bl-market-ticker{display:flex!important;align-items:center;min-height:40px;overflow:hidden}
.bl-market-ticker .ticker-window{flex:1;min-width:0;overflow:hidden}

/* Pricing labels. */
.price-card .price-state{color:#6b4f1d!important}
.price-card span.btn{opacity:1!important;color:#5f5a52!important;border-color:#d6d1c7!important;background:transparent!important}
:is(.dark-section,.intelligence-preview) :is(small,.preview-currency){color:#a8a297!important}

/* Type scale: 12 · 13 · 14 · 16 · 20 · 24 · 32 · 40 · display. */
html{font-synthesis-weight:none}
small{font-size:13px}
.path>span{font-size:12px!important;letter-spacing:.06em}
.ticker-status>b{font-size:12px!important;font-weight:600!important}
.ticker-calendar-link{font-size:13px!important;font-weight:500!important}
details>summary{font-size:20px!important;font-weight:500!important}
.steps-mini b{font-size:14px!important}
:is(.comparison,.quote-block) div>p,.quote-block>p{font-size:20px!important}

/* Weights: the system uses 400/500/600 only; V18 left 700 to 900 on labels, ticker and preview text. */
b,strong,.notice b,.ticker-cell>b,.ticker-cell>strong,.preview-head>b,.form-card label,.price-card .price-state{font-weight:600!important}
.path>i,.preview-event>time,.preview-head>span{font-weight:500!important}
.path>i{font-family:var(--font-ui)!important;font-variant-numeric:tabular-nums}
/* The product mock's brand line fell back to Georgia; Newsreader is reserved for titles. */
.screen-top .screen-brand{font-family:var(--font-ui)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.12em}
/* Card and plan titles are UI headings, not display type. */
:is(.card,.price-card,.news-preview)>h3{font-family:var(--font-ui)!important;font-weight:500!important}
.content article h2{font-family:var(--font-ui)!important;font-size:24px!important;font-weight:500!important;line-height:1.25!important}
.content article h3{font-family:var(--font-ui)!important;font-size:20px!important;font-weight:500!important}
/* 48px above a card title read as a gap between unrelated blocks; 24px keeps it on the 8px rhythm. */
.card h3{margin:24px 0 8px!important}

/* Controls take the 6px radius. */
.form-card :is(input,textarea,select){border-radius:6px!important}

/* Header primary action: a dark-header era rule painted it ivory on the ivory header. */
.site-header .btn.gold{background:var(--bl-ink)!important;border-color:var(--bl-ink)!important;color:#fff!important}
.site-header .btn{white-space:nowrap}
.nav-login-v21{display:none!important}

/* Anchored sections land below the sticky header (106px row plus 40px ticker). */
section[id]{scroll-margin-top:146px}

/* Ticker status lines up with the page shell instead of a 1180px guess. */
.bl-market-ticker .ticker-status{padding-left:max(40px,calc((100% - 1200px)/2))!important}

/* Contact form inline validation (public-v21.js). */
.form-card .field-error-v21{display:block;margin:8px 0 16px;font-size:13px;line-height:1.4;color:#9f3434}
.form-card [aria-invalid="true"]{border-color:#9f3434!important}

/* Collapsed navigation below 1081px: the index page's seven links overflowed the row by 31px at 901px.
   public.css only collapses at 900px, so the hide rules are repeated here for 901 to 1080. */
@media(max-width:1080px){
  .site-header .nav-row:not(.open) .nav-links,.site-header .nav-actions .outline{display:none!important}
  /* The menu glyph was ivory on the ivory header (1.05:1) and 28px. */
  .site-header .menu{display:inline-flex!important;align-items:center;justify-content:center;width:44px;height:44px;padding:0;color:var(--bl-ink)!important;font-size:24px!important;line-height:1;cursor:pointer;border-radius:6px}
  /* V18 pins the row height, so the old wrap-open layout spilled links over the hero.
     The panel now drops from the header, which is sticky and so anchors it. */
  .site-header .nav-row,.site-header .nav-row.open{position:static!important;height:106px!important;flex-wrap:nowrap!important;padding:0!important;align-items:center!important}
  .site-header .nav-row.open .nav-links{display:flex!important;position:absolute;top:106px;left:0;right:0;z-index:30;flex-direction:column;align-items:stretch;gap:0!important;padding:8px 40px 16px!important;background:var(--bl-ivory);border-bottom:1px solid var(--bl-border)}
  .site-header .nav-row.open .nav-links a{display:flex;align-items:center;min-height:48px;font-size:16px!important;border-bottom:1px solid var(--bl-border-light)}
  .site-header .nav-row.open .nav-links a:last-child{border-bottom:0}
  .site-header .nav-row.open .nav-login-v21{display:flex!important}
}
@media(max-width:900px){
  .site-header .nav-row,.site-header .nav-row.open{height:84px!important}
  .site-header .nav-row.open .nav-links{top:84px;padding:8px 20px 16px!important}
  section[id]{scroll-margin-top:124px}
  .bl-market-ticker .ticker-status{padding-left:20px!important}
  .section-head p{font-size:16px!important}
}
@media(max-width:560px){
  /* 16px side gutter on phones. */
  .shell{width:min(100% - 32px,1200px)!important}
  .site-header .nav-row.open .nav-links{padding:8px 16px 16px!important}
  .wordmark img{height:28px!important}
  .nav-actions{gap:8px!important}
  .nav-actions .btn{padding:12px 16px!important}
  .bl-market-ticker .ticker-status{padding-left:16px!important}
  .hero h1,.page-hero h1{font-size:40px!important;line-height:1.1!important}
  .hero p,.page-hero p,.screen p{font-size:16px!important}
  .cta-box{padding:32px 16px!important}
}

/* Credential verifier: it shipped a separate SaaS look (24px radii, 900 weight, cool greys). */
body.verify-page{background:var(--bl-ivory,#F7F4EC);color:#0F0E0D;padding:48px 40px;font-family:Inter,system-ui,sans-serif}
.verify-page .wrap{max-width:800px}
.verify-page .brand{font-size:12px;font-weight:600;letter-spacing:.12em;color:#6b665e}
.verify-page h1{font-family:Newsreader,Georgia,serif;font-size:56px;font-weight:400;line-height:1.05;margin:16px 0}
.verify-page .muted{color:#6b665e;font-size:16px;line-height:1.5}
.verify-page .card{background:#fffdf8;border:1px solid #d6d0c5;border-radius:8px;padding:24px;margin-top:32px;box-shadow:none}
.verify-page .upload{border:1px dashed #a9a298;border-radius:6px;padding:24px}
.verify-page .result{margin-top:16px;padding:16px;border-radius:6px;background:#f1ede3;font-size:16px;line-height:1.5}
.verify-page .result.valid{background:#eef4ee;border:1px solid #b9cfbc}
.verify-page .result.invalid{background:#f7ecea;border:1px solid #dfbdb7}
.verify-page .grid{gap:8px}
.verify-page .grid div{border-radius:4px;padding:12px;background:#fffdf8}
.verify-page .grid span{color:#6b665e;font-size:12px}
@media(max-width:560px){body.verify-page{padding:32px 16px}.verify-page h1{font-size:40px}}

/* 1081 to 1180px: tighten the link row so seven links and two actions fit. */
@media(min-width:1081px) and (max-width:1180px){.nav-links{gap:20px!important;font-size:14px!important}}
/* Display titles step 72 / 56 / 40 instead of a fluid clamp that produced 48 to 70.8px. */
.hero h1,.page-hero h1{font-size:72px!important}
@media(max-width:1199px){.hero h1,.page-hero h1{font-size:56px!important;line-height:1.05!important}}
/* Smallest phones (320px): logo, primary action and menu overflowed by 32px. */
@media(max-width:360px){.wordmark img{height:22px!important}.nav-actions .btn{padding:12px!important;font-size:13px!important}}
@media(max-width:560px){.hero h1,.page-hero h1{font-size:40px!important;line-height:1.1!important}}

/* Home ledger rows: the competency name and its type label are inline siblings with no space, so they
   rendered as "Position SizingApplied competency". Put the label on its own line under the name. */
.ledger-row>div>small{display:block;margin-top:4px}