/* ===== cnp-critical-tail.css  (built from 5 live sheets, head order) ===== */

/* --- cnp-a11y-css  <-  /novo/wp-content/themes/coachfocus-child/a11y_cnp-a11y.css (1483 B) --- */
/* ============================================================
   CNP A11Y  -  prepared 18 Jul 2026, NOT deployed.
   Semantic/ARIA accessibility support only. No visual change
   to existing content.

   Provides:
   1. .cnp-skip-link  - a "Skip to content" link that is
      off-screen until it receives keyboard focus, then reveals
      at the top-left. Nothing visible changes for mouse users.
   2. .cnp-sr-only    - generic visually-hidden utility (kept
      for any future screen-reader-only text). Not required by
      the current edits but handy and inert.

   Deploy: drop a11y_cnp-a11y.css in the coachfocus-child theme
   root and enable the a11y_cnp-a11y-enqueue.php mu-plugin (same
   pattern as aud-mobile-polish-enqueue.php). Loads site-wide.
   Reversible: delete the mu-plugin to remove entirely.
   ============================================================ */

.cnp-skip-link{
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100000;
  background: #1A1714;
  color: #FFFFFF;
  padding: 10px 16px;
  border-radius: 0 0 6px 0;
  font-family: 'Inter', -apple-system, system-ui, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}
.cnp-skip-link:focus{
  left: 0;
  outline: 2px solid #D85A1F;
  outline-offset: 2px;
}

.cnp-sr-only{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* --- aud-mobile-polish-css  <-  /novo/wp-content/themes/coachfocus-child/aud-d_mobile-polish.css (1390 B) --- */
/* ============================================================
   AUD-D MOBILE POLISH - prepared 18 Jul 2026, NOT deployed.
   Quick wins from the aud-d mobile audit (see aud-d_findings.md
   S3-3, S3-4, S3-5, S3-7, S2-9, S1-11). Additive, mobile-scoped.
   Deploy: coachfocus-child theme root + enqueue after the
   instrument CSS (same pattern as fab3_elevate.css), or append
   to the existing instrument stylesheet.
   ============================================================ */

@media (max-width: 640px){

  /* S3-3 · topic chips: reach ~40px tap height */
  a.chip{
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  /* S3-4 · language switcher: real tap target */
  #cnp-lang-btn{
    padding: 10px 12px;
    min-height: 40px;
  }

  /* S3-7 · micro-label floor: 11px minimum for the mono kickers */
  .cnp-inst-admit,
  .cnp-inst-card__label,
  .hv2-cap,
  .tg-illus,
  .g-tag{
    font-size: 11px !important;
  }

  /* S3-5 · glossary tags + chip strip scroll hint */
  .g-chip{
    min-height: 38px;
  }

  /* S1-11 · footer legal line floor */
  .footer-copy{
    font-size: 12px;
  }
}

/* S2-9 · caption contrast: muted #9A8E7E (~2.7:1) -> soft-ink
   #6E6253 (~4.6:1) for small informational captions, all widths */
figure.fig figcaption,
.cnp-diagram-fig figcaption{
  color: #6E6253;
}

/* --- cnp-cta-contrast-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-cta-contrast.css (611 B) --- */
/* cnp-cta-contrast.css · 19 Jul 2026
   Contrast fix: the .cta-band was flipped from a dark night-band to a light
   Instrument cream band (heading -> ink), but the subtitle .body-text kept its
   old white colour (rgba(255,255,255,.78)) -> nearly invisible on cream (Miguel
   flagged it on the home). Repaint the CTA-band body copy in soft-ink. Scoped to
   .cta-band only; the dark .ccwk-band and other dark bands are untouched.
   Reversible: delete this file + enqueue. */
body .cta-band .body-text,
body .cta-band p:not(.eyebrow):not([class*="eyebrow"]){
  color: var(--cnp-soft, #6E6253) !important;
}

/* --- cnp-mobile-type-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-mobile-type.css (4457 B) --- */
/* cnp-mobile-type.css  ·  v4  ·  19 Jul 2026
   Mobile (<=540px) reading system. Goal: ONE coherent, uniform scale + font
   roles, since the desktop Instrument mix of serif/sans/mono at body level
   reads as non-uniform on a phone. Desktop (>540px) is untouched.
   FONT ROLES on mobile:  body & caption text = Hanken (sans);  headings =
   Newsreader (serif, untouched);  labels/data/eyebrows/meta = IBM Plex (mono).
   SIZE SCALE on mobile:  body 18 · caption 15 · label 13 · table-head 12.5.
   !important needed to win base rules at equal specificity. Reversible: delete
   this file + its enqueue. */
@media (max-width: 540px){

  /* ---- font roles: pull serif/mono body text to sans (headings stay serif) ---- */
  .pf-lede, .pf-answer, .pf-answer p, .pf-cta, .pf-cta p,
  .tg-foot, .tg-foot p, .tg-intro,
  figure figcaption, figcaption{
    font-family: 'Hanken Grotesk', system-ui, -apple-system, sans-serif !important;
  }

  /* ---- body / reading: 18 ---- */
  .pf-narrow p, .pf-narrow li,
  .article-content p, .article-content li,
  .entry-content p, .entry-content li,
  .cc-pf p, .cc-pf li,
  .pf-answer, .pf-answer p, .pf-lede, .pf-cta p,
  .tg-intro, .tg-foot p, .pf-swcol p, .faq-a p{
    font-size: 18px !important;
    line-height: 1.62 !important;
  }

  /* ---- captions / secondary explainers: 15 ---- */
  figure figcaption, figcaption, small{
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  /* ---- labels / eyebrows / meta / read-tags / breadcrumb / footer: 13 ---- */
  .pf-kicker, .pf-eyebrow, .tg-eyebrow, .tg-illus, .eyebrow,
  .al, .fl, .cj-k, .cj-eyebrow, .swh, .tg-k,
  .cnp-updated, .rd, .rt, .cj-go, .cc-term,
  nav.cnp-bc a, .cnp-bc a, .cnp-bc span, .pf-crumb a, .pf-crumb span,
  .footer-copy, .footer-link, .footer-col-title{
    font-size: 13px !important;
  }

  /* ---- table headers / tiny data: 12.5 ---- */
  .pf-narrow th, .pf-sec th, .cc-pf th, table th, th.num{
    font-size: 12.5px !important;
  }

  /* ---- departure line (decorative mono) ---- */
  .dl-l, .dl-t{ font-size: 12px !important; }
  .dl-arrow{ font-size: 11px !important; }

  /* ---- full-bleed diagrams (a touch more room = slightly larger SVG text) ---- */
  figure.cnp-fig, figure.cnp-diagram-fig{
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
  }
}

/* Time-equation diagram: portrait variant on phones (19 Jul 2026). */
.cnp-diagram-fig .cnp-eq-mobile{display:none;}
@media (max-width:540px){
  .cnp-diagram-fig .cnp-eq-desktop{display:none;}
  .cnp-diagram-fig .cnp-eq-mobile{display:block;}
}

/* ============================================================
   cnp-mobile-type.css · EXTENSION v5 · 19 Jul 2026
   Extends the v4 <=540px prose normalization to the SEO-landing
   (.cnp-redesign), INDUSTRY-pillar (ph- / .numsec), METHOD-COMPARISON
   (.cc-cpg) and METHODS-HUB (.cc-hub) templates.
   PRIMARY PROSE ONLY -> 18 / 1.62 / Hanken; serif "In short" answer
   boxes + serif/undersized ledes pulled to Hanken. Card / tile / note /
   stat / table / CTA-band descriptions are deliberately NOT touched.
   Desktop (>540px) untouched. Reversible: delete this block.
   ============================================================ */
@media (max-width: 540px){

  /* SEO landing (.cnp-redesign): process-step copy (p.s-desc).
     .seo-content p & .cnp-rich p are already Hanken 18.5 -> left as-is. */
  .cnp-redesign .step p,

  /* INDUSTRY pillar (ph- template): numbered-section narrative + the 4
     process-step tiles. steps4 is single-column at <=540px, so 18 is safe. */
  .numsec p, .steps4 p,

  /* METHOD-COMPARISON (.cc-cpg): section prose + intro lede. */
  .cc-cpg .cp-sec p, .cc-cpg .cp-lede,

  /* METHODS-HUB (.cc-hub): section intro + hero lede. */
  .cc-hub .hb-intro, .cc-hub .hb-lede,

  /* FAQ / "In short" answer boxes across these templates.
     .cc-answer/.answer are sans@17 inline; .cp-answer/.hb-answer are
     Newsreader@18 -> unify all to Hanken 18. */
  .cc-answer p, .answer p, .cc-cpg .cp-answer p, .cc-hub .hb-answer p{
    font-size: 18px !important;
    line-height: 1.62 !important;
    font-family: 'Hanken Grotesk', system-ui, -apple-system, sans-serif !important;
  }

}

/* --- cnp-ritmo-hero-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-ritmo-hero.css (6365 B) --- */
/* ════════════════════════════════════════════════════════════════════════
   CNP-RITMO-HERO.CSS - Harmonização do ritmo vertical + tratamento de hero
   costandprofitability.com · 30 jun 2026 · Praxis · Never blue

   PORQUÊ
   Cada template foi construído com a sua própria escala de espaçamento
   vertical (42–84px) e dois tratamentos de hero diferentes (faixa escura vs
   contido sobre papel). Este ficheiro impõe UMA escala e UMA regra de hero a
   todos os templates, sem tocar na largura/rail (já corrigido) nem no conteúdo.

   COMO USAR
   Enqueue UMA vez, GLOBALMENTE, e por ÚLTIMO (depois de site.css, cnp-praxis.css
   e de qualquer CSS de cluster: industry-pages, it-pages, glossary, guide,
   profile, cnpnp). É puramente aditivo e idempotente - remover o ficheiro
   reverte tudo. Usa !important só para garantir a vitória independentemente da
   ordem de enqueue; não altera especificidade de mais nada.

   O QUE TOCA  →  só padding/margin VERTICAL + cor/fundo do hero.
   O QUE NÃO TOCA  →  rail horizontal, max-width, conteúdo, estrutura, classes.
   ════════════════════════════════════════════════════════════════════════ */

/* ─── 1. Escala canónica de ritmo vertical ─────────────────────────────────
   Fluida: respira em ecrãs largos (≈96px), fecha em mobile (≈64px). Substitui
   as escalas divergentes por uma só. Herdada por todos os scopes via :root. */
:root{
  --sec-y:    clamp(64px, 7vw, 96px);   /* padding padrão ENTRE secções       */
  --sec-y-sm: clamp(48px, 5vw, 68px);   /* secção mais curta (answer, related) */
  --hero-y:   clamp(56px, 6vw, 92px);   /* respiração do topo do hero          */
}

/* ─── 2. Ritmo aplicado a cada template ────────────────────────────────────
   Base / Home / How-we-work / Métodos / Indústrias / Newpages - usam .sec     */
.sec    { padding-top: var(--sec-y)    !important; padding-bottom: var(--sec-y)    !important; }
.sec-sm { padding-top: var(--sec-y-sm) !important; padding-bottom: var(--sec-y-sm) !important; }

/* Hero de referência (Indústrias / IT / Newpages) - contido sobre papel.
   Só ajusta a respiração do topo ao token; horizontal e fundo intactos.       */
.ph-hero        { padding-top: var(--hero-y) !important; }
.cnpnp .ph-hero { padding-top: var(--hero-y) !important; }

/* Fecho de página (endcta) - alinhar ao mesmo ritmo                           */
.endcta         { padding-top: var(--sec-y) !important; }
.cnpnp .endcta  { padding-top: var(--sec-y) !important; }

/* Glossário (.cc-gloss) - secções e corpo ao ritmo canónico                   */
.cc-gloss .g-body    { margin-top:    var(--sec-y-sm) !important; }
.cc-gloss .g-section { margin-bottom: var(--sec-y)    !important; }

/* Guia (.cc-guide) - divisória entre secções ao ritmo canónico                */
.cc-guide .gd-section { margin-top: 0 !important; padding-top: var(--sec-y) !important; }
.cc-guide .gd-section:first-of-type { padding-top: 0 !important; }

/* Regional / Perfis de método (.cc-pf)                                        */
.cc-pf .pf-sec { padding-top: var(--sec-y) !important; padding-bottom: var(--sec-y) !important; }

/* ─── 3. Regra única de hero: CONTIDO SOBRE PAPEL, dentro do rail ───────────
   Como a how-we-work / indústrias. Converte as três faixas escuras
   (glossário, guia, regional) para o mesmo tratamento editorial sobre papel:
   sem fundo escuro, sem cartão, sem glow, texto em tinta, eyebrow laranja.
   Cores literais da paleta Praxis (robusto a qualquer scope).                 */

/* fundo + caixa: neutralizar a faixa escura */
.cc-gloss .g-hero,
.cc-guide .gd-hero,
.cc-pf   .pf-hero{
  background: transparent !important;
  color: #1A1714 !important;            /* --ink */
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-top: var(--hero-y) !important;
  padding-bottom: 12px !important;
  padding-left: 0 !important;           /* alinhar o hero ao rail (não é o rail */
  padding-right: 0 !important;          /*  - o rail vive no wrapper exterior)  */
}
/* remover o halo radial laranja dos heroes escuros */
.cc-gloss .g-hero::after,
.cc-guide .gd-hero::after,
.cc-pf   .pf-hero::after{ display: none !important; }

/* eyebrow → laranja sobre papel (era laranja-claro sobre escuro) */
.cc-gloss .g-eyebrow,
.cc-guide .gd-eyebrow,
.cc-pf   .pf-eyebrow{ color: #C75B22 !important; }       /* --orange */
.cc-gloss .g-eyebrow::before,
.cc-guide .gd-eyebrow::before,
.cc-pf   .pf-eyebrow::before{ background: #C75B22 !important; }

/* lede / parágrafos do hero → tinta secundária (era claro sobre escuro) */
.cc-gloss .g-hero p,
.cc-guide .gd-lede,
.cc-pf   .pf-lede{ color: #4A4138 !important; }          /* --ink2 */
.cc-pf .pf-lede + .pf-lede{ color: #756859 !important; } /* --muted */

/* meta mono do hero → muted; ênfases → tinta */
.cc-gloss .g-hero .g-meta,
.cc-guide .gd-herometa{ color: #756859 !important; }     /* --muted */
.cc-gloss .g-hero .g-meta b,
.cc-guide .gd-herometa b{ color: #1A1714 !important; }   /* --ink */

/* Regional: a "answer box" escura deixava de sobrepor a faixa (margin -28px).
   Sobre papel, assenta-a em fluxo normal, logo abaixo do hero. */
.cc-pf .pf-answer{ margin-top: 16px !important; }

/* (h1 e os <em> laranja do hero mantêm-se - leem perfeitamente sobre papel.) */


/* --- 4. Regional (.cc-pf): alinhar a coluna ao rail do site (era 1000px) --- */
/* O .pf-wrap usava max-width:1000px centrado (conteudo ~176-246px), nao o rail
   do site (1240 + 40px = conteudo a 96px). Alinhar para uniformidade total. */
.cc-pf .pf-wrap{ max-width:1240px !important; padding-left:40px !important; padding-right:40px !important; }
@media(max-width:1080px){ .cc-pf .pf-wrap{ padding-left:20px !important; padding-right:20px !important; } }
@media(max-width:480px){ .cc-pf .pf-wrap{ padding-left:16px !important; padding-right:16px !important; } }