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

/* --- gt10-arrivalhall-css  <-  /novo/wp-content/mu-plugins/gt10_arrivalhall.css (5034 B) --- */
/* =========================================================================
   Grand Tour #10 - "Last light: the footer as an arrival hall"
   CSS-ONLY re-skin of the EXISTING footer (footer.footer-praxis), site-wide.

   Concept: the footer is the end of the journey. Reframe the site's dark
   "night band" footer as a calm arrival hall at last light - the reader has
   arrived. Rail-travel Instrument voice: restrained, premium.

   CONSTRAINTS honoured:
   - No markup change. Styles ONLY classes the footer already emits.
   - No new text nodes. The one word-mark ("ARRIVALS - END OF LINE") is a
     decorative, non-essential CSS ::before eyebrow on the existing tagline.
   - Site-wide safe: no horizontal overflow (all decoration is inset within
     the footer border-box; no 100vw, no negative margins, no width changes).
   - Grid columns are NEVER touched, so the theme's responsive collapse
     (2-col / 1-col) keeps working untouched at mobile.
   - Specificity won with a leading `body ` prefix instead of !important.
   - Reversible: remove the two files.

   Footer is DARK (theme: .footer-praxis { background:#14110D; color:#fff }).
   Instrument tokens used here (dark-band adapted):
     burnt-orange  #C75B22   (platform edge / perforation / eyebrow)
     dusk glow     rgba(199,91,34, .10 -> 0)   (last light)
   The theme's own on-dark greys (rgba(255,255,255,.x)) are preserved.
   ========================================================================= */

/* --- Wrapper: night band + a faint "last light" entering from the top edge.
   The solid #14110D is kept as the final background layer so contrast for the
   white/grey link text is unchanged; the warm radial only tints the padding
   band just below the platform edge. ----------------------------------------*/
body .footer-praxis {
	position: relative;               /* anchor the platform-edge ::before */
	background:
		radial-gradient(120% 62% at 50% 0%,
			rgba(199, 91, 34, 0.10) 0%,
			rgba(199, 91, 34, 0.035) 24%,
			transparent 56%),
		#14110D;
	padding-top: 92px;                /* calmer arrival breathing room (was 84px) */
}

/* --- Platform edge: a burnt-orange hairline at the very top, with a subtle
   ticket-perforation dashed line a few px below. Inset within the footer
   border-box (left/right:0), so it is full-bleed but cannot cause overflow. --*/
body .footer-praxis::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 8px;
	pointer-events: none;
	background:
		/* solid platform edge, 1px at the very top */
		linear-gradient(#C75B22, #C75B22) top / 100% 1px no-repeat,
		/* ticket perforation, 1px dashed, ~7px below the edge */
		repeating-linear-gradient(90deg,
			rgba(199, 91, 34, 0.55) 0 9px,
			transparent 9px 18px) bottom / 100% 1px no-repeat;
}

/* --- Arrival-hall eyebrow: a small mono departures-board label placed above
   the existing serif tagline. Decorative and non-essential (screen-reader
   users lose nothing; the tagline text itself is untouched). ----------------*/
body .footer-tagline {
	position: relative;
}
body .footer-tagline::before {
	content: "Arrivals \00B7 End of line";
	display: block;
	margin-bottom: 16px;
	font-family: 'IBM Plex Mono', ui-monospace, monospace;
	font-size: 10.5px;
	font-style: normal;               /* tagline itself is italic; keep label upright */
	font-weight: 500;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: #C75B22;
}

/* --- Column headings: keep the theme's mono uppercase label, add a short
   burnt-orange "platform marker" tick before each, and lift the grey a touch
   so the headings read as calm signage. -------------------------------------*/
body .footer-col-title {
	display: flex;
	align-items: center;
	gap: 10px;
	color: rgba(255, 255, 255, 0.5);
}
body .footer-col-title::before {
	content: "";
	flex: 0 0 auto;
	width: 12px;
	height: 1px;
	background: #C75B22;
	opacity: 0.85;
}
/* The heading may wrap an <a> (hub links); keep the tick+lift consistent. */
body .footer-col-title a {
	color: inherit;
}

/* --- Links: unchanged behaviour, only a calmer resting rhythm. --------------*/
body .footer-link {
	margin-bottom: 14px;
}

/* --- Powered-by rule + brand-contact divider: warm the hairline slightly so
   the dividers echo the platform edge rather than a cold grey line. ----------*/
body .footer-powered {
	border-top-color: rgba(199, 91, 34, 0.22);
}

/* --- Bottom bar: the concourse baseline. Warm its top rule, add arrival
   spacing, and give the copyright mono a fractionally wider track. ----------*/
body .footer-bottom {
	border-top-color: rgba(199, 91, 34, 0.22);
	padding-top: 30px;
	margin-top: 8px;
}
body .footer-copy {
	letter-spacing: 0.08em;
}

/* --- Motion: nothing here animates, but honour the preference defensively so
   any inherited transitions on these elements are stilled. -------------------*/
@media (prefers-reduced-motion: reduce) {
	body .footer-praxis,
	body .footer-praxis * {
		transition: none !important;
		animation: none !important;
	}
}

/* --- gt16-youarehere-css  <-  /novo/wp-content/mu-plugins/gt16_youarehere.css (3284 B) --- */
/* ==========================================================================
 * Grand Tour #16 - "You are here on every hub" (20 Jul 2026)
 * --------------------------------------------------------------------------
 * A calm transit-map "YOU ARE HERE" marker for HUB / INDEX pages only - the
 * pages that list a family's children as a grid of cards. On this site those
 * are the shared hub template <section class="hub-hero"> ... <div class="hubgrid">
 * (Methods, Industries, Analysis, Guides). Rail Instrument voice: monochrome
 * soft-ink label + a single burnt-orange node, IBM Plex Mono.
 *
 * CSS-ONLY, no markup change. The marker is a ::after pseudo-element on the
 * hub hero's eyebrow. It renders ONLY where a real <section class="hub-hero">
 * element exists in the DOM, i.e. on hub/index pages. Leaf/profile pages use
 * pf-hero and /about/, /, /glossary/, /br/ have NO hub-hero element, so they
 * receive nothing - the .hub-hero rule below simply never matches there.
 *
 * Not a duplicate of GT#2 (PLATFORM N, inside the .kicker) nor GT#17 (the
 * breadcrumb "you are here" node on nav.cnp-bc, which only exists on leaf /
 * profile heroes). This marks the reader's standing position at a hub title.
 *
 * Palette: soft-ink #6E6253, hairline #DED3BF, burnt-orange #C75B22.
 * Body-prefixed for specificity over the theme's late inline <style>; no
 * !important. No animation (prefers-reduced-motion respected by design; a
 * defensive guard is included below). No overflow.
 *
 * Deploy: gt16_youarehere.css + gt16_youarehere-enqueue.php in mu-plugins/.
 * Reversible: delete both files.
 * ========================================================================== */

/* The eyebrow row is display'd so the ::after can sit on its own line below the
   hub kicker (and below GT#2's PLATFORM token, which lives inside the kicker). */
body .hub-hero .eyebrow {
	position: relative;
}

/* The marker: burnt-orange ringed node + mono "YOU ARE HERE" label, one line,
   dropped just under the eyebrow, above the hub <h1>. Dot is drawn with a
   radial-gradient background (single pseudo-element, two-tone: orange core +
   hairline ring) so no extra markup is needed. */
body .hub-hero .eyebrow::after {
	content: "You are here";
	display: block;
	margin-top: .6rem;
	max-width: 100%;
	box-sizing: border-box;
	padding-left: 20px;

	font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #6E6253;                 /* soft-ink label */

	/* transit node: solid burnt-orange core (r=3px) wrapped in a hairline ring,
	   vertically centered on the label, positioned near the left edge. */
	background-image: radial-gradient(
		circle at 6px 50%,
		#C75B22 0 3px,              /* orange core */
		transparent 3px 4.5px,     /* gap */
		#DED3BF 4.5px 5.5px,       /* hairline ring */
		transparent 5.5px          /* clear */
	);
	background-repeat: no-repeat;

	/* no transition / animation is defined; nothing to reduce. */
}

/* Defensive: if any inherited transition ever applies, null it under RM. */
@media (prefers-reduced-motion: reduce) {
	body .hub-hero .eyebrow::after {
		transition: none;
		animation: none;
	}
}

/* --- gt17-breadcrumb-css  <-  /novo/wp-content/mu-plugins/gt17_breadcrumb.css (6016 B) --- */
/* ============================================================================
 * Grand Tour #17 — "Breadcrumbs by zone" / the route-line  (re-skin, 20 Jul 2026)
 * ----------------------------------------------------------------------------
 * CONCEPT
 *   The breadcrumb trail is the reader's route through the network. This file
 *   re-skins the EXISTING JS-injected breadcrumb (<nav class="cnp-bc">, built and
 *   inserted at the top of the pf-hero / ph-hero wrap) so it reads like a line on
 *   a transit map: stations (crumbs) connected by thin route-line segments, with
 *   the CURRENT crumb marked "you are here" by a small burnt-orange node.
 *
 *   Adds NO markup and NO second injector. The per-page ZONE / platform identity
 *   is already printed in the same hero by the GT#2 mu-plugin as a mono
 *   "PLATFORM N" token (Methods=1 … Glossary=6); duplicating it in the breadcrumb
 *   would be noise, so "by zone" is delivered here purely as the structural
 *   route-line motif that sits directly beneath that PLATFORM token. Pure CSS:
 *   reversible by dequeuing.
 *
 * LIVE STRUCTURE (verified against method + regional pages, 20 Jul 2026)
 *   <nav class="cnp-bc" aria-label="Breadcrumb">
 *     <a>Home</a><i>/</i><a>Methods & concepts</a><i>/</i>
 *     <span aria-current="page">…current…</span>
 *   </nav>
 *   Separators are <i>/</i> elements. Current crumb is the trailing
 *   <span aria-current="page"> (also :last-child). Two hero variants:
 *     .cnp-bc          -> DARK  hero (default, injected into .cc-pf .pf-hero .pf-wrap)
 *     .cnp-bc.bcdark   -> LIGHT/cream hero (.ph-hero .wrap)
 *
 * PALETTE (Instrument, exact — monochrome + the single burnt-orange accent)
 *   cream #F5EEE1 · card #FBF6EB · ink #2A211B · soft-ink #6E6253
 *   hairline #DED3BF · burnt-orange #C75B22
 *   No per-zone colour-coding: the zone cue is textual/structural, never a hue.
 * FONTS  IBM Plex Mono (breadcrumb labels)
 *
 * SPECIFICITY / SAFETY
 *   The site prints its own <style> for .cnp-bc LATE in <body> (right beside the
 *   builder script), which would beat an equal-specificity head stylesheet. Every
 *   rule here is therefore prefixed with `body` so it out-specifies the inline
 *   base rules (.cnp-bc a = 0,2,1  ->  body .cnp-bc a = 0,2,2, etc.). No
 *   !important is used. All colours are driven through two local custom
 *   properties (--gt17-line, --gt17-accent) set once per hero variant, so the
 *   route-line and node pseudo-elements retint automatically in both contexts.
 *   The container keeps its base flex-wrap, so long crumbs wrap — never overflow.
 * ========================================================================== */

/* --- 1. Container: mono voice, calm tracking, transit spacing ---------------
 * DARK-hero defaults live here; the .bcdark block below overrides the line tone
 * for the light/cream hero. Text colours are inherited from the base rules
 * (already tuned per hero) — we only add the route-line + node + accent. */
body .cnp-bc{
	--gt17-line:#7A6F60;    /* route-line track on the DARK hero (soft-ink tone) */
	--gt17-accent:#C75B22;  /* the single burnt-orange accent (node + hover)     */
	font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
	letter-spacing:.04em;   /* consistent, restrained mono tracking              */
	gap:4px 8px;
	align-items:center;     /* keeps text baseline aligned with the route-line   */
}

/* Light / cream hero: the track becomes a true hairline. */
body .cnp-bc.bcdark{
	--gt17-line:#DED3BF;    /* hairline route-line on the cream hero */
}

/* --- 2. Stations (the crumb links) ----------------------------------------- */
body .cnp-bc a{
	text-decoration:none;
	transition:color .18s ease;
}
/* Unify hover/focus to the single accent in both hero variants. */
body .cnp-bc a:hover,
body .cnp-bc a:focus-visible{
	color:var(--gt17-accent);
}

/* --- 3. The route-line separator (replaces each "/") -----------------------
 * Hide the literal slash glyph and draw a short track segment + a small ">"
 * chevron (direction of travel) in the hairline/soft-ink tone. Reads as the
 * connecting line between two stations on a transit map. */
body .cnp-bc i{
	display:inline-block;
	position:relative;
	width:22px;
	height:10px;
	font-size:0;            /* hide the "/" text            */
	line-height:0;
	color:transparent;
	vertical-align:middle;
	overflow:visible;
	font-style:normal;
}
/* the track */
body .cnp-bc i::before{
	content:"";
	position:absolute;
	top:50%;
	left:1px;
	right:6px;
	height:1.5px;
	transform:translateY(-50%);
	background:var(--gt17-line);
	border-radius:1px;
}
/* the arrowhead / chevron at the leading end */
body .cnp-bc i::after{
	content:"";
	position:absolute;
	top:50%;
	right:5px;
	width:4px;
	height:4px;
	transform:translateY(-50%) rotate(45deg);
	border-top:1.5px solid var(--gt17-line);
	border-right:1.5px solid var(--gt17-line);
	border-radius:.5px;
}

/* --- 4. "You are here": the current station (terminus) ---------------------
 * Semantic selector (aria-current) rather than :last-child — precise and it IS
 * the last child. A small burnt-orange node with a soft static ring marks the
 * reader's position; the text firms up to read as the destination. */
body .cnp-bc span[aria-current="page"]{
	position:relative;
	padding-left:16px;
	font-weight:500;
	color:#E7DDCB;          /* light terminus on the DARK hero */
}
body .cnp-bc span[aria-current="page"]::before{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	width:7px;
	height:7px;
	transform:translateY(-50%);
	border-radius:50%;
	background:var(--gt17-accent);
	box-shadow:0 0 0 3px rgba(199,91,34,.18);  /* soft "you are here" ring, static */
}
/* Cream hero: terminus text in ink for a clear end-of-line. */
body .cnp-bc.bcdark span[aria-current="page"]{
	color:#2A211B;
}

/* --- 5. Reduced motion: neutralise the only transition (link hover) --------- */
@media (prefers-reduced-motion: reduce){
	body .cnp-bc a{
		transition:none;
	}
}

/* --- gt46-marginnotes-css  <-  /novo/wp-content/mu-plugins/gt46_marginnotes.css (4454 B) --- */
/* ============================================================================
   Grand Tour flagship #46 - "Mono notes in the margin"
   costandprofitability.com  ·  Instrument voice (engineer's marginalia)
   CSS-ONLY. No markup change. Version 1.0 (20 Jul 2026)
   ----------------------------------------------------------------------------
   WHAT THIS DOES
   On WIDE desktop reading (method / regional profile pages, wrapper .cc-pf,
   template cnp-methods-profile-praxis), the EXISTING mono diagram caption
   (.cnp-diagram-fig > figcaption - already IBM Plex Mono, soft ink) is lifted
   out of its centred position UNDER the worked-example diagram and set as a
   calm left-hand margin-note BESIDE the diagram, with a thin hairline leader.
   Nothing is invented: only the caption that already exists is repositioned.

   WHY ONLY THIS ELEMENT (findings from live inspection, 20 Jul 2026)
   - The reading column .pf-narrow is a 2-col grid that engages above 920px:
       body .cc-pf .pf-sec .pf-narrow{grid-template-columns:clamp(200px,18vw,240px) minmax(0,1fr)}
     (from cnp-method-instrument.css). The LEFT column holds the
     position:sticky .pf-kicker, which travels the full section band. So the
     one WIDE margin is owned by the sticky kicker and cannot host a note there
     without collision.
   - The ONLY existing in-flow mono annotation on these pages is the diagram
     figcaption. It is a full descriptive sentence (~450px natural width) and
     it PROPS the shrink-wrapped figure's width - pulling it fully out of flow
     collapses the SVG (measured 454px -> 300px), so a naive float is unsafe.
   - The blog reading column (.article-content) carries NO in-flow mono
     caption / aside / pull-quote (plain prose + dropcaps). There is nothing
     genuine to reposition there, so this file INTENTIONALLY does nothing for
     the blog and nothing for any non-.cc-pf template.

   HOW IT STAYS SAFE (measured on channel-segment-profitability and
   cost-of-unused-capacity, incl. the figure-adjacent-to-kicker case)
   - The caption is placed in the reading column's own left strip, which we
     reserve deterministically (fixed 200px margin-left on the figure, figure
     width clamped to the remainder). This is independent of each diagram's
     natural width, so the SVG stays large & legible (~504px) and never
     collapses.
   - The note lives in grid COLUMN 2 (right of the 48px grid gap), ~56px clear
     of the sticky-kicker column (column 1). Because the separation is
     HORIZONTAL, the kicker can travel vertically all it likes and can never
     overlap the note. Collision is structurally impossible, not just avoided.
   - Everything is gated at min-width:1100px. At <=1099px the media query is
     inert: the caption reverts to its exact current centred, in-flow state and
     the mobile reading experience is untouched.
   - No overflow (figure stays within .pf-narrow; page scrollWidth unchanged).
     No animation, so prefers-reduced-motion is satisfied by construction.
   ============================================================================ */

@media (min-width: 1100px) {

  /* Reserve a fixed left margin strip and hold the diagram to the remainder,
     so the SVG keeps a stable, legible width once the caption leaves flow. */
  .cc-pf .pf-sec .cnp-diagram-fig {
    position: relative;
    margin-left: 200px;
    margin-right: auto;
    width: min(520px, calc(100% - 200px));
  }

  /* The existing mono caption, lifted into the reserved left strip as a
     calm engineer's margin-note. Kept inside grid column 2, clear of the
     sticky .pf-kicker column. */
  .cc-pf .pf-sec .cnp-diagram-fig > figcaption {
    position: absolute;
    top: 4px;
    right: 100%;            /* anchor to the figure's left edge ... */
    margin-right: 24px;     /* ... then a calm gutter before the diagram */
    width: 168px;
    margin-top: 0;
    padding-top: 13px;      /* room for the hairline leader */
    text-align: left;
    font-family: "IBM Plex Mono", ui-monospace, monospace;
    font-size: 11.5px;
    line-height: 1.55;
    color: #6E6253;         /* Instrument soft-ink (no new colour) */
  }

  /* Thin hairline leader, echoing the .pf-kicker rule mark. */
  .cc-pf .pf-sec .cnp-diagram-fig > figcaption::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 1px;
    background: #6E6253;
    opacity: .55;
  }
}

/* --- gt54-milestones-css  <-  /novo/wp-content/mu-plugins/gt54_milestones.css (4297 B) --- */
/* ============================================================================
   Grand Tour #54 - KPI/stat tiles become milestones
   ----------------------------------------------------------------------------
   Re-skins the site's numeric stat/KPI tiles into calm rail-travel JOURNEY
   MILESTONES (distance-posts on a rail line). CSS-ONLY, no markup change.

   Targets (real classes found live on costandprofitability.com):
     - .stats-band .stat-item  (big-number band; .stat-num.serif + .stat-label)
     - .praxis .case-metrics-band .case-metric  (.cm-val + .cm-label)

   Deliberately DOES NOT touch:
     - .cnp-inst-stat / .cnp-inst-stat__fig / .cnp-inst-stat__cap  (hero ticket
       -- prior hero regression noted; left fully alone)
     - .section-num  (section eyebrow, not a KPI tile)

   Palette: Instrument only --
     cream #F5EEE1 | card #FBF6EB | ink #2A211B | soft-ink #6E6253
     hairline #DED3BF | burnt-orange #C75B22
   No new colours, no motion (calm/engineered; reduced-motion inherently safe).
   All accents are INSET / in-flow -- no width or negative-margin change, so
   the grid tiles cannot overflow.
   ============================================================================ */

/* --- Tabular figures on the big serif number: milestone-marker legibility,
       and steadier data-countup (no glyph-width jitter while counting). ----- */
.stats-band .stat-num,
.praxis .case-metrics-band .case-metric .cm-val {
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

/* ============================================================================
   1) STATS BAND (dark ink band) -- centre-aligned distance posts
   ----------------------------------------------------------------------------
   Each tile gets ONE small burnt-orange "distance post" tick centred above the
   number, like a milestone marker standing on the rail line (the existing
   vertical hairline dividers between items read as the rail). In normal flow,
   auto-centred, fixed size -> adds only vertical height inside a band with 44px
   padding; no horizontal growth.
   ============================================================================ */
.stats-band .stat-item {
	position: relative;
}

.stats-band .stat-item::before {
	content: "";
	display: block;
	width: 2px;
	height: 14px;
	margin: 0 auto 12px;
	background: #C75B22;               /* burnt-orange -- the milestone post */
	border-radius: 1px;
}

/* Mono label reads as the station / distance label under the marker. */
.stats-band .stat-label {
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: 0.06em;
}

/* ============================================================================
   2) CASE-METRICS BAND (light praxis surface) -- left-edge distance posts
   ----------------------------------------------------------------------------
   These tiles are left-aligned, so the post sits at the start of each metric.
   Same single burnt-orange tick; a faint hairline is not added (the band
   already has a hairline top border) to keep it to ONE accent per tile.
   ============================================================================ */
.praxis .case-metrics-band .case-metric {
	position: relative;
}

.praxis .case-metrics-band .case-metric .cm-val {
	position: relative;
	padding-top: 14px;                 /* room for the inset post above */
}

.praxis .case-metrics-band .case-metric .cm-val::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 16px;
	height: 2px;
	background: #C75B22;               /* burnt-orange -- horizontal distance tick */
	border-radius: 1px;
}

/* Mono label as station/distance label, consistent with the band above. */
.praxis .case-metrics-band .case-metric .cm-label {
	letter-spacing: 0.06em;
}

/* ============================================================================
   Reduced-motion: this treatment is fully static (no transitions/animation),
   so there is nothing to disable. Declared for auditability only.
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
	.stats-band .stat-item::before,
	.praxis .case-metrics-band .case-metric .cm-val::before {
		transition: none;
		animation: none;
	}
}

/* --- gt61-nextstop-css  <-  /novo/wp-content/mu-plugins/gt61_nextstop.css (6475 B) --- */
/* ============================================================================
 * Grand Tour #61 — "The Next Stop card"  (re-skin, 19 Jul 2026)
 * ----------------------------------------------------------------------------
 * PURPOSE
 *   Re-skins the EXISTING onward-journey module rendered by the mu-plugin
 *   `journey3_cnp-continue-journey.php`  (wrapper: <section id="cnp-continue-journey">,
 *   cards: a.cj-card) into calm Instrument "NEXT STOP" ticket cards, evoking a
 *   connecting-service card on a rail platform.
 *
 *   This file adds NO new section and NO second recommendation engine. It reuses
 *   the plugin's curated 6-language next-destination map exactly as-is and only
 *   improves presentation + type. It is a pure stylesheet: reversible by dequeuing.
 *
 * SCOPE / SAFETY
 *   Every rule is scoped to `#cnp-continue-journey`, which the plugin emits ONLY on
 *   its ~29 curated method/regional source paths. It therefore no-ops on blog posts
 *   and any page without the module. It deliberately does NOT touch the theme's
 *   separate `.related` / "Keep exploring" related-topics block (a distinct element
 *   that renders just above this module on method/regional pages).
 *
 *   Selectors are prefixed with `body` so they out-specify the plugin's own inline
 *   <style id="cnp-cj-style"> (which is injected later in source, just before the
 *   footer). `body #id .class` (a=1,b=1,c=1) beats the plugin's `#id .class`
 *   (a=1,b=1,c=0). No !important is used, so the re-skin stays easy to override.
 *
 * TOKENS (Instrument, exact)
 *   cream/page #F5EEE1 · card #FBF6EB · ink #2A211B · soft-ink #6E6253
 *   hairline #DED3BF · burnt-orange #C75B22
 * FONTS  Newsreader (serif/headings) · IBM Plex Mono (labels/data) · Hanken (body)
 * ========================================================================== */

/* --- 1. Retint + refont via the plugin's own custom properties ---------------
 * The plugin draws everything through var(--cj-*), var(--font-serif) and
 * var(--font-mono). Overriding those values on the section (higher specificity)
 * re-colours and re-fonts the whole module without re-declaring each rule.
 * Notably: --font-serif was previously undefined, so headings fell back to
 * Fraunces; here we pin them to the site serif, Newsreader. */
body #cnp-continue-journey{
	--cj-cream:#FBF6EB;   /* card fill        */
	--cj-hair:#DED3BF;    /* hairline         */
	--cj-orange:#C75B22;  /* burnt-orange     */
	--cj-ink:#2A211B;     /* ink              */
	--cj-muted:#6E6253;   /* soft-ink         */
	--font-serif:'Newsreader',Georgia,'Times New Roman',serif;
	--font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
	/* local helper token: the page cream behind the cards, used for the
	   "punched" perforation notches so they read as torn out of the ticket. */
	--gt-page:#F5EEE1;
	padding-top:60px;
}

/* --- 2. Section eyebrow + heading: quieter, ticket-desk voice --------------- */
body #cnp-continue-journey .cj-eyebrow{
	color:var(--cj-orange);
	letter-spacing:.2em;
}
body #cnp-continue-journey .cj-heading{
	font-family:var(--font-serif);
	color:var(--cj-ink);
}

/* --- 3. The ticket card ----------------------------------------------------- */
body #cnp-continue-journey .cj-card{
	position:relative;
	background:var(--cj-cream);
	border:1px solid var(--cj-hair);
	border-radius:12px;
	padding:18px 22px 18px;
	overflow:hidden;                 /* keep notch scallops clipped to the card */
}

/* Kicker becomes the ticket header stub, above the tear line. */
body #cnp-continue-journey .cj-k{
	position:relative;
	color:var(--cj-orange);
	letter-spacing:.16em;
	margin:0 0 20px;
	padding-bottom:18px;
}

/* Perforation tear edge: a dashed hairline spanning the card, with two small
 * "punched" notches straddling the left/right borders (rail-ticket scallop).
 * Rendered as one multi-layer background on .cj-k::after — earlier layers paint
 * on top, so the notches sit over the dashed line ends. */
body #cnp-continue-journey .cj-k::after{
	content:"";
	position:absolute;
	left:-22px;                      /* reach the card's inner border edge (=padding) */
	right:-22px;
	bottom:0;
	height:13px;
	pointer-events:none;
	background:
		/* left notch: page-cream fill + hairline ring */
		radial-gradient(circle 6.5px at 0 50%,   var(--gt-page) 0 5.5px, var(--cj-hair) 5.5px 6.5px, transparent 6.6px) no-repeat,
		/* right notch */
		radial-gradient(circle 6.5px at 100% 50%, var(--gt-page) 0 5.5px, var(--cj-hair) 5.5px 6.5px, transparent 6.6px) no-repeat,
		/* dashed tear line, 1px tall, centred */
		repeating-linear-gradient(to right, var(--cj-hair) 0 5px, transparent 5px 11px) left center/100% 1px no-repeat;
}

/* Destination title in Newsreader. */
body #cnp-continue-journey .cj-t{
	font-family:var(--font-serif);
	color:var(--cj-ink);
	font-size:21px;
	line-height:1.2;
}

/* "Why go there" one-liner in soft-ink. */
body #cnp-continue-journey .cj-d{
	color:var(--cj-muted);
	font-size:14.5px;
}

/* --- 4. Fare footer: mono "PLATFORM N"  +  the plugin's localized "Open ->" -- */
body #cnp-continue-journey .cj-grid{
	counter-reset:gt-plat;
}
body #cnp-continue-journey .cj-card{
	counter-increment:gt-plat;
}
body #cnp-continue-journey .cj-go{
	display:flex;
	align-items:center;
	justify-content:space-between;
	width:100%;
	margin-top:4px;
	padding-top:14px;
	border-top:1px dashed var(--cj-hair);   /* stub-bottom perforation, mirrors the top tear */
	font-family:var(--font-mono);
	color:var(--cj-muted);
}
body #cnp-continue-journey .cj-go::before{
	content:"PLATFORM " counter(gt-plat);
	font-family:var(--font-mono);
	font-size:11px;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--cj-muted);
}
/* The plugin's arrow sits with the "Open" word on the right of the footer. */
body #cnp-continue-journey .cj-go .cj-arrow{
	color:var(--cj-orange);
}

/* --- 5. Hover: a gentle lift on the ticket (kept subtle) -------------------- */
body #cnp-continue-journey .cj-card:hover{
	border-color:var(--cj-orange);
	box-shadow:0 12px 28px -16px rgba(42,33,27,.38);
}

/* --- 6. Reduced motion: neutralise all transforms/transitions -------------- */
@media (prefers-reduced-motion: reduce){
	body #cnp-continue-journey .cj-card,
	body #cnp-continue-journey .cj-card:hover{
		transform:none;
		transition:none;
	}
	body #cnp-continue-journey .cj-arrow,
	body #cnp-continue-journey .cj-card:hover .cj-arrow{
		transform:none;
		transition:none;
	}
}

/* --- gt66-endofline-css  <-  /novo/wp-content/mu-plugins/gt66_endofline.css (5157 B) --- */
/* =====================================================================
   Grand Tour #66 - END OF LINE terminus mark
   ---------------------------------------------------------------------
   Rail Instrument voice: a calm buffer-stop at the end of the platform.
   At the very end of a long-form article's body - AFTER the reading
   column, BEFORE the onward-connection modules (.related / "Keep
   exploring" and #cnp-continue-journey / "NEXT STOP") and the footer -
   render ONE subtle terminus mark: a short centred hairline rule capped
   by a small burnt-orange buffer-stop tick, with a mono "END OF LINE"
   label beneath it.

   CSS-ONLY. No markup, no injector. Composed entirely from a single
   ::after pseudo-element on an EXISTING end-of-content anchor, so it
   self-limits to exactly the two article families and can never
   duplicate or collide with the onward-journey modules (which are later
   siblings, outside the anchor).

   ANCHORS (verified against live HTML, 20 Jul 2026):
     - Method / regional profile pages (template cnp-methods-profile /
       cnp-industry, e.g. /activity-based-costing/,
       /methods/time-driven-activity-based-costing/):
         <main id="content" class="cc-pf"> ... last <section.pf-sec> </main>
         <section class="related"> ... </section>
         <section id="cnp-continue-journey"> ... </section>
       -> main#content.cc-pf::after  = last child of <main>, i.e. the
          end of the article body, before .related / #cnp-continue-journey.
       The plain <main id="content"> used by the home, hubs, /about/,
       industry and landing templates has NO .cc-pf class, so it is
       untouched.

     - Blog posts (template cnp-blogpost-praxis, e.g.
       /blog/excel-killing-profitability-model/ and its /pt/ /es/ ...
       localisations):
         <div class="article-body"><div class="article-content"> ...prose... </div></div>
         <section class="related-section"> ("Keep reading") </section>
       -> .article-body .article-content::after = end of the prose,
          before the "Keep reading" related module. The .article-body
          wrapper is blog-only, so no other template can match.

   Monochrome + single burnt-orange accent. Instrument tokens
   (soft-ink #6E6253, hairline #DED3BF, accent #C75B22), IBM Plex Mono
   label. Restrained and small. Respects prefers-reduced-motion. No
   horizontal overflow. Reversible: delete this file (and its enqueue).
   ===================================================================== */

/* --- the terminus mark, shared by both article families ------------- */
main#content.cc-pf::after,
body .article-body .article-content::after{
	content:"END OF LINE";

	/* box: shrink to the label so the hairline is exactly label-width
	   and stays centred in the reading column, never edge-to-edge. */
	display:block;
	width:-moz-max-content;
	width:max-content;
	max-width:min(86%, 260px);
	box-sizing:border-box;
	margin-left:auto;
	margin-right:auto;
	padding-top:19px;                 /* gap between rule/tick and label */

	/* mono label */
	text-align:center;
	font-family:'IBM Plex Mono', var(--cnp-mono, var(--mono, ui-monospace)), ui-monospace, 'SFMono-Regular', Menlo, monospace;
	font-size:11px;
	line-height:1;
	letter-spacing:.32em;
	text-indent:.32em;                /* re-centre against trailing letter-spacing */
	text-transform:uppercase;
	color:var(--cnp-soft, #6E6253);   /* soft-ink */

	/* the platform rail: a short hairline, label-width, centred */
	border-top:1px solid var(--cnp-hair, #DED3BF);

	/* the buffer-stop: a small burnt-orange tick centred on the rail */
	background-image:linear-gradient(#C75B22, #C75B22);
	background-repeat:no-repeat;
	background-size:28px 3px;
	background-position:top center;

	-webkit-user-select:none;
	user-select:none;
}

/* --- per-anchor breathing room -------------------------------------- */
/* Method pages: the last <section.pf-sec> already carries 80px of
   bottom padding, so the mark needs almost nothing above it; keep a
   small gap below before .related picks up its own top spacing. */
main#content.cc-pf::after{
	margin-top:2px;
	margin-bottom:14px;
}

/* Blog posts: the last <p> only leaves a 24px gap, so lift the mark a
   little further off the prose; the .article-body / .related-section
   boundary supplies the space below. */
body .article-body .article-content::after{
	margin-top:44px;
	margin-bottom:10px;
}

/* --- motion: a single calm arrival, opt-in only -------------------- */
/* Default (incl. reduced-motion) = static and fully visible: the
   ::after has no hidden baseline state, so nothing to suppress. */
@media (prefers-reduced-motion:no-preference){
	main#content.cc-pf::after,
	body .article-body .article-content::after{
		animation:gt66-arrive .8s ease-out both;
	}
}
@keyframes gt66-arrive{
	from{ opacity:0; transform:translateY(6px); }
	to{   opacity:1; transform:translateY(0);   }
}

/* --- narrow screens: tighten the tracking so the label stays tidy --- */
@media (max-width:520px){
	main#content.cc-pf::after,
	body .article-body .article-content::after{
		letter-spacing:.26em;
		text-indent:.26em;
	}
}

/* --- gt68-69-station-css  <-  /novo/wp-content/mu-plugins/gt68_69_station.css (6001 B) --- */
/* ============================================================================
 * Grand Tour #68 + #69 — "Border post" & "Information desk"  (nav re-skin)
 * ----------------------------------------------------------------------------
 * CONCEPT (Instrument, rail-travel voice — RESTRAINED)
 *   #68  The language switcher becomes a small passport-control / border-post
 *        stamp: the "EN ▾" button gets a hairline frame with two faint
 *        burnt-orange corner ticks, so the current language reads like a
 *        stamped entry in a travel document. Its function, dropdown and flex
 *        layout are untouched.
 *   #69  The search affordance becomes an information desk: the nav lupa gains
 *        a subtle "desk-hairline" counter edge, and the full-screen overlay
 *        reads like an enquiry counter — a soft hairline ledge under the ink
 *        counter rule, with the caret picking up the accent. The lupa (left)
 *        and "Search" submit (right) already frame the counter like a service
 *        desk, so no markup and no heavy redecoration are needed.
 *
 * CSS-ONLY, adds no markup. Reversible by dequeuing.
 *
 * LIVE STRUCTURE (verified read-only against costandprofitability.com theme,
 * coachfocus-child/cnp-nav-praxis.php + cnp-praxis-discoverability.css, 20 Jul 2026)
 *   Right-hand controls sit inside a runtime wrapper <div> (not direct children
 *   of .nav-inner), so every selector below is a DESCENDANT selector, never `>`:
 *     button.nav-search#cnp-search-open            (34px round lupa)
 *     div#cnp-lang-wrap  >  button.nav-lang#cnp-lang-btn   ("EN ▾")
 *                           div.nav-lang-dropdown#cnp-lang-dropdown
 *   Search overlay (dialog appended after the nav):
 *     div.search-overlay#cnp-search-overlay[data-open]
 *       div.search-scrim · button.search-close
 *       div.search-inner
 *         div.search-eyebrow            (mono desk sign, orange rule)
 *         form.search-form              (flex: svg.lupa · input.search-input · button.search-submit)
 *         div.chips-wrap … .chips-label … .chip
 *
 * SPECIFICITY / SAFETY
 *   The base rules are .praxis .nav-lang (0,2,0), .nav-search / .search-form /
 *   .search-input (0,1,0). Every rule here is prefixed with the nav id
 *   (#cnp-nav-praxis) or the overlay id (#cnp-search-overlay) so it out-specifies
 *   the base (1,1,0 > 0,2,0) with NO !important. All decorative pseudo-elements
 *   are position:absolute, so they leave the flex flow of the (inline-)flex
 *   button/form and never reorder "EN ▾" or the counter fields. All new colour
 *   flows through four local custom properties holding the exact Instrument
 *   tokens.
 *
 * PALETTE (Instrument, exact — monochrome + the single burnt-orange accent)
 *   cream #F5EEE1 · card #FBF6EB · ink #2A211B · soft-ink #6E6253
 *   hairline #DED3BF · burnt-orange #C75B22
 * FONTS  IBM Plex Mono already loads site-wide (the lang label is already mono).
 * ========================================================================== */

/* Instrument tokens (exact) scoped to the two nav surfaces we touch. */
#cnp-nav-praxis,
#cnp-search-overlay{
	--gt-hair:#DED3BF;    /* hairline                          */
	--gt-ink:#2A211B;     /* ink                               */
	--gt-soft:#6E6253;    /* soft-ink                          */
	--gt-accent:#C75B22;  /* burnt orange — the single accent  */
}

/* --- #68  Language switcher as a border post -------------------------------
 * A small stamped "passport control" box: hairline frame + two faint accent
 * corner ticks; the current language firms to ink so it reads as a stamped
 * entry. Tiny and legible; the dropdown and its position are unchanged. */
#cnp-nav-praxis .nav-lang{
	position:relative;
	border:1px solid var(--gt-hair);
	border-radius:2px;
	padding:3px 9px;
	color:var(--gt-ink);
	transition:border-color .15s ease, color .15s ease;
}
/* Passport-stamp corner ticks (top-left + bottom-right). position:absolute
 * keeps them OUT of the button's inline-flex flow, so "EN" and "▾" never move. */
#cnp-nav-praxis .nav-lang::before,
#cnp-nav-praxis .nav-lang::after{
	content:"";
	position:absolute;
	width:5px;
	height:5px;
	border-color:var(--gt-accent);
	opacity:.5;
	pointer-events:none;
}
#cnp-nav-praxis .nav-lang::before{
	top:2px;
	left:2px;
	border-top:1px solid;
	border-left:1px solid;
}
#cnp-nav-praxis .nav-lang::after{
	bottom:2px;
	right:2px;
	border-bottom:1px solid;
	border-right:1px solid;
}
/* Border-post check-through: frame + label warm to the accent. */
#cnp-nav-praxis .nav-lang:hover,
#cnp-nav-praxis .nav-lang:focus-visible{
	border-color:var(--gt-accent);
	color:var(--gt-accent);
}

/* --- #69  Search as an information desk ------------------------------------
 * (a) Nav trigger: a subtle desk-hairline "counter edge" beneath the lupa.
 *     position:absolute keeps it out of the button's inline-flex flow. */
#cnp-nav-praxis .nav-search{
	position:relative;
}
#cnp-nav-praxis .nav-search::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:3px;
	width:15px;
	height:1px;
	transform:translateX(-50%);
	background:var(--gt-hair);
	transition:background .15s ease, width .15s ease;
	pointer-events:none;
}
#cnp-nav-praxis .nav-search:hover::after,
#cnp-nav-praxis .nav-search:focus-visible::after{
	background:var(--gt-accent);
	width:19px;
}

/* (b) Overlay = the enquiry counter. A soft hairline ledge runs directly under
 *     the existing 2px ink counter rule (border-bottom of .search-form), and
 *     the enquiry caret takes the accent. box-shadow adds no flex child and
 *     causes no layout overflow. */
#cnp-search-overlay .search-form{
	box-shadow:0 2px 0 0 var(--gt-hair);
}
#cnp-search-overlay .search-input{
	caret-color:var(--gt-accent);
}

/* --- Reduced motion: drop the only transitions we introduced. -------------- */
@media (prefers-reduced-motion: reduce){
	#cnp-nav-praxis .nav-lang,
	#cnp-nav-praxis .nav-search::after{
		transition:none;
	}
}

/* --- gt-industry-fix-css  <-  /novo/wp-content/mu-plugins/gt_industry_fix.css (1868 B) --- */
/* =====================================================================
   Industry template - mobile / consistency polish   (prepared 20 Jul 2026)
   Scope: .cnp-ind only (industry sector pages, cnp-industry-praxis.php).
   Covers BUG #3 (Keep-exploring cards look sparse / uneven). It is
   cosmetic and OPTIONAL - the DOM-order bug (#1) and the empty diagram
   (#2) are fixed in the PHP / JS, not here.
   No !important; every rule is prefixed with .cnp-ind so it cannot leak.
   Reversible: dequeue / delete this file.
   ===================================================================== */

/* --- BUG #3 --- "Keep exploring" related cards -----------------------
   Live markup per card is only:
     <a><span class="k">Method</span><h4>Title</h4></a>
   i.e. a tiny kicker + a serif title and nothing else, so the cards read
   as near-empty blocks of uneven height with no "this is a link" cue.
   This makes every card the same height, gives the title room, and adds
   a quiet Instrument arrow affordance that animates on hover.            */

.cnp-ind .related a{
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 122px;
  padding-bottom: 44px;   /* clears the arrow */
}

.cnp-ind .related .k{
  display: block;
}

.cnp-ind .related h4{
  margin-top: 9px;
}

.cnp-ind .related a::after{
  content: "\2192";                       /* -> */
  position: absolute;
  left: 22px;
  bottom: 18px;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 16px;
  line-height: 1;
  color: var(--line2, #C9BEAA);
  transition: transform .15s ease, color .15s ease;
}

.cnp-ind .related a:hover::after{
  color: var(--orange, #C75B22);
  transform: translateX(3px);
}

@media (max-width: 760px){
  /* one column already; drop the fixed height so short cards don't gap */
  .cnp-ind .related a{
    min-height: 0;
  }
}

/* --- cnp-praxis-fonts-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-praxis-fonts-local.css (19524 B) --- */
/* Self-hosted Praxis fonts (19jul2026) — Newsreader + Hanken Grotesk + IBM Plex Mono,
   variable woff2 from Google Fonts, served locally (GDPR + no render-blocking 3rd-party).
   Generated from the exact css2 the site enqueued. font-display:swap preserved. */
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-02.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-03.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-04.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-02.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-03.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-04.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-02.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-03.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-04.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-02.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-03.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-04.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-02.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-03.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/hanken-grotesk-04.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-01.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-02.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-03.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-04.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-05.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-06.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-07.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-08.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-09.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-10.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-11.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-12.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-13.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-14.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/ibm-plex-mono-15.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-01.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-02.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-03.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-01.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-02.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-03.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-01.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-02.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-03.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-04.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-05.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-06.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-04.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-05.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-06.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-04.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-05.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/novo/wp-content/themes/coachfocus-child/fonts/newsreader-06.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- cnp-praxis-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-praxis.css (27368 B) --- */
/* ══════════════════════════════════════════════════════════════
   CNP-PRAXIS.CSS — CostandProfitability.com Design System
   Direction: Praxis (Editorial Authority)
   Version: 1.0 — 31 May 2026

   This file contains ALL shared design tokens, typography,
   layout primitives, and animations for the Praxis redesign.
   Enqueued globally via functions.php.
   ══════════════════════════════════════════════════════════════ */

/* ─── 1. Design Tokens ─────────────────────── */
:root {
  /* Data language — use ONLY for profit/loss semantics */
  --red:          #D11F4B;
  /* zip63/65: aliases for Claude Design industry pages (it-pages.css / industry-pages.css) */
  --ink2:         #4A4138;
  --ink-dark:     #14110D;
  --paper2:       #EDE6D8;
  --muted2:       #9A8E7E;
  --line2:        #C9BEAA;
  --surface2:     #FAF7F0;
  --green:        #1C7A57;
  --green-bright: #1D9E75;

  /* Brand spine */
  --orange:        #C75B22;
  --orange-bright: #E2761A;

  /* Ink / neutrals (warm) */
  --ink:    #1A1714;
  --ink-2:  #4A4138;
  --muted:  #756859;
  --muted-2:#9A8E7E;

  /* Surfaces (warm paper) */
  --paper:   #F3EEE4;
  --paper-2: #EDE6D8;
  --surface: #FBF9F3;

  /* Hairlines */
  --line:   #DCD3C2;
  --line-2: #C9BEAA;
}

/* ─── 2. Reset & Base ──────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body.praxis {
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
  font-size: 16px;
}

.praxis a { color: inherit; text-decoration: none; }
.praxis img { display: block; max-width: 100%; }
.praxis button { font-family: inherit; cursor: pointer; }
.praxis ::selection { background: var(--orange); color: #fff; }

/* ─── 3. Typography ────────────────────────── */
.praxis h1, .praxis h2, .praxis h3,
.praxis .serif { font-family: 'Newsreader', Georgia, serif; }
.praxis .mono  { font-family: 'IBM Plex Mono', monospace; }

/* Hero H1 */
.praxis .h1-hero {
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -0.022em;
}

/* Section H2 */
.praxis .h2-section {
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.015em;
}

/* Card H3 */
.praxis .h3-card {
  font-size: 21px;
  font-weight: 500;
  line-height: 1.2;
}

/* Body text */
.praxis .body-text {
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink-2);
}

/* Emphasis word (italic orange in headings) */
.praxis .em-orange {
  font-style: italic;
  color: var(--orange);
}
.praxis .em-orange-bright {
  font-style: italic;
  color: var(--orange-bright);
}

/* ─── 4. Layout Primitives ──────────────────── */
.praxis .container {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 40px;
}
.praxis .container-narrow {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 40px;
}

/* Section padding */
.praxis .section-pad {
  padding: 110px 0;
}
.praxis .section-pad-sm {
  padding: 80px 0;
}

/* ─── 5. Eyebrow & Section Number ───────────── */
.praxis .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.7rem;
  white-space: nowrap;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .eyebrow::before {
  content: '';
  width: 26px;
  height: 1px;
  background: var(--orange);
  flex-shrink: 0;
}
.praxis .eyebrow-dark {
  color: rgba(255,255,255,0.55);
}

.praxis .section-num {
  display: flex;
  align-items: baseline;
  gap: 14px;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 28px;
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .section-num .n {
  color: var(--orange);
}
.praxis .section-num .rule {
  flex: 0 0 36px;
  height: 1px;
  background: var(--line-2);
}
.praxis .section-num-dark {
  color: rgba(255,255,255,0.5);
}
.praxis .section-num-dark .rule {
  background: rgba(255,255,255,0.2);
}

/* ─── 6. Buttons ────────────────────────────── */
.praxis .btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 15px 26px;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16,0.8,0.3,1);
  border-radius: 2px;
  font-family: 'Hanken Grotesk', sans-serif;
  border: 1px solid transparent;
  white-space: nowrap;
  text-decoration: none;
}

.praxis .btn-primary {
  background: var(--orange);
  color: #fff;
  border-color: var(--orange);
}
.praxis .btn-primary:hover {
  background: #A8481A;
  border-color: #A8481A;
}

.praxis .btn-ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-2);
}
.praxis .btn-ghost:hover {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}

.praxis .btn-dark {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,0.25);
}
.praxis .btn-dark:hover {
  background: #fff;
  color: var(--ink);
  border-color: #fff;
}

/* Arrow glyph for buttons */
.praxis .btn-arrow {
  width: 15px;
  height: 11px;
  flex-shrink: 0;
}

/* ─── 7. Navigation ─────────────────────────── */
.praxis .nav-praxis {
  position: sticky;
  top: 0;
  z-index: 500;
  transition: all 0.4s;
}
.praxis .nav-praxis.transparent {
  background: transparent;
  border-bottom: 1px solid transparent;
}
.praxis .nav-praxis.solid {
  background: rgba(243,238,228,0.86);
  backdrop-filter: blur(14px) saturate(1.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  border-bottom: 1px solid var(--line);
}
.praxis .nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 78px;
}
.praxis .nav-logo { height: 52px; width: auto; cursor: pointer; }
.praxis .nav-logo-link { flex-shrink: 0; display: inline-flex; align-items: center; }
.praxis .nav-links {
  display: flex;
  gap: 30px;
  align-items: center;
}
.praxis .nav-link {
  font-size: 14.5px;
  font-weight: 500;
  cursor: pointer;
  color: var(--ink-2);
  transition: color 0.2s;
  text-decoration: none;
}
.praxis .nav-link:hover,
.praxis .nav-link.active {
  color: var(--orange);
}
.praxis .nav-lang {
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--muted);
  font-family: 'IBM Plex Mono', monospace;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px 2px;
}
.praxis .nav-lang-dropdown {
  position: absolute;
  top: 120%;
  right: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(26,23,20,0.12);
  z-index: 20;
}
.praxis .nav-lang-option {
  display: block;
  width: 78px;
  text-align: left;
  padding: 9px 16px;
  font-size: 12px;
  letter-spacing: 0.08em;
  background: transparent;
  border: none;
  color: var(--ink-2);
  cursor: pointer;
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .nav-lang-option:hover { background: var(--paper-2); }
.praxis .nav-lang-option.active { background: var(--paper-2); color: var(--orange); }

/* Mobile nav */
.praxis .nav-hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}
.praxis .nav-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--ink);
  margin: 5px 0;
  transition: all 0.3s;
}

/* ─── 8. Footer ─────────────────────────────── */
.praxis .footer-praxis {
  background: #14110D;
  color: #fff;
  padding-top: 84px;
}
.praxis .footer-grid {
  display: grid;
  grid-template-columns: 1.7fr 1fr 1fr 1.1fr;
  gap: 48px;
  padding-bottom: 64px;
}
.praxis .footer-col-title {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin-bottom: 22px;
  font-weight: 500;
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .footer-link {
  display: block;
  font-size: 15px;
  margin-bottom: 13px;
  color: rgba(255,255,255,0.66);
  cursor: pointer;
  transition: color 0.2s;
  text-decoration: none;
}
.praxis .footer-link:hover { color: #fff; }
.praxis .footer-tagline {
  font-family: 'Newsreader', Georgia, serif;
  font-size: 21px;
  line-height: 1.45;
  color: rgba(255,255,255,0.8);
  max-width: 330px;
  font-weight: 300;
  font-style: italic;
}
.praxis .footer-powered {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.1);
}
.praxis .footer-powered span {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding: 26px 0 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
}
.praxis .footer-copy {
  font-size: 11.5px;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.35);
  font-family: 'IBM Plex Mono', monospace;
}

/* ─── 9. Cards & Panels ─────────────────────── */
.praxis .card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 4px;
}
.praxis .card-raised {
  box-shadow: 0 30px 60px -40px rgba(26,23,20,0.3);
}

/* Window chrome (for CostCtrl screenshots) */
.praxis .window-chrome {
  border-radius: 5px;
  overflow: hidden;
  border: 1px solid var(--line);
}
.praxis .window-chrome-dark {
  border-color: rgba(255,255,255,0.14);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,0.6);
}
.praxis .window-dots {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 15px;
  border-bottom: 1px solid var(--line);
  background: #F6F2E9;
}
.praxis .window-dots-dark {
  background: #211D17;
  border-bottom-color: rgba(255,255,255,0.08);
}
.praxis .window-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}
.praxis .window-dot-r { background: var(--red); }
.praxis .window-dot-o { background: var(--orange); }
.praxis .window-dot-g { background: var(--green); }
.praxis .window-caption {
  font-size: 11px;
  color: var(--muted);
  margin-left: 8px;
  font-family: 'IBM Plex Mono', monospace;
}
.praxis .window-dots-dark .window-caption {
  color: rgba(255,255,255,0.5);
}

/* ─── 10. Dark Sections ─────────────────────── */
.praxis .dark-section {
  background: var(--ink);
  color: #fff;
}
.praxis .dark-section .body-text {
  color: rgba(255,255,255,0.66);
}

/* CTA Band (before footer) */
.praxis .cta-band {
  background: var(--ink);
  color: #fff;
  padding: 110px 0;
  position: relative;
  overflow: hidden;
}
.praxis .cta-band .glow {
  position: absolute;
  inset: 0;
  opacity: 0.5;
  background: radial-gradient(120% 90% at 85% 10%, rgba(199,91,34,0.22), transparent 55%);
  pointer-events: none;
}
.praxis .cta-band .lede,
.praxis .cta-band p {
  color: rgba(255,255,255,0.78) !important;
}

/* ─── 11. Reveal Animation ──────────────────── */
.praxis .reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 1.1s cubic-bezier(0.16,0.8,0.3,1),
              transform 1.1s cubic-bezier(0.16,0.8,0.3,1);
}
.praxis .reveal.in {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .praxis .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ─── 12. Scrollbar ─────────────────────────── */
.praxis ::-webkit-scrollbar { width: 11px; height: 11px; }
.praxis ::-webkit-scrollbar-track { background: var(--paper-2); }
.praxis ::-webkit-scrollbar-thumb {
  background: var(--line-2);
  border-radius: 0;
  border: 3px solid var(--paper-2);
}

/* ─── 13. Range Slider (Scenario Studio) ────── */
.praxis .lever-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #FBF9F3;
  border: 2px solid var(--orange);
  box-shadow: 0 2px 8px rgba(199,91,34,0.35);
  cursor: pointer;
  margin-top: 0;
}
.praxis .lever-input::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #FBF9F3;
  border: 2px solid var(--orange);
  box-shadow: 0 2px 8px rgba(199,91,34,0.35);
  cursor: pointer;
}
.praxis .lever-input::-webkit-slider-runnable-track {
  background: transparent;
}

/* ─── 14. Responsive ────────────────────────── */
@media (max-width: 1080px) {
  .praxis .nav-links { display: none !important; }
  .praxis .nav-hamburger { display: block; }
  .praxis .studio-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 760px) {
  .praxis .container { padding: 0 20px; }
  .praxis .container-narrow { padding: 0 20px; }
  .praxis .section-pad { padding: 70px 0; }
  .praxis .hero-grid { grid-template-columns: 1fr !important; }
  .praxis .split-2 { grid-template-columns: 1fr !important; }
  .praxis .cols-3 { grid-template-columns: 1fr !important; }
  .praxis .cols-4 { grid-template-columns: 1fr 1fr !important; }
  .praxis .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .praxis .h1-hero { font-size: clamp(32px, 8vw, 48px); }
  .praxis .nav-inner { height: 64px; }
  .praxis .nav-logo { height: 42px; width: auto; }

    /* Scenario Studio mobile fix */
    .studio-grid { grid-template-columns: 1fr !important; }
    .studio-controls { min-width: 0; }

    /* Prevent inline-width overflow */
    .praxis h1, .praxis h2, .praxis p, .praxis div { max-width: 100%; box-sizing: border-box; }

    /* Journey bar mobile */
    .journey-bar .journey-steps { flex-direction: column; gap: 12px; }
    .journey-bar .journey-step .journey-line { display: none; }

    /* Scope table horizontal scroll */
    .scope-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

    /* Problem cards stack */
    .problem-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 480px) {
  .praxis .footer-grid { grid-template-columns: 1fr !important; }
  .praxis .cols-4 { grid-template-columns: 1fr !important; }
  .praxis .btn { padding: 13px 20px; font-size: 13.5px; }
    .praxis .container { padding: 0 16px; }
    .praxis .hero h1 { font-size: 2rem; }
    .praxis .section-pad { padding: 48px 0; }
}

/* ─── 15. Utility ───────────────────────────── */
.praxis .text-center { text-align: center; }
.praxis .mb-0 { margin-bottom: 0; }
.praxis .mb-8 { margin-bottom: 8px; }
.praxis .mb-16 { margin-bottom: 16px; }
.praxis .mb-24 { margin-bottom: 24px; }
.praxis .mb-32 { margin-bottom: 32px; }
.praxis .mb-48 { margin-bottom: 48px; }
.praxis .mt-auto { margin-top: auto; }
.praxis .gap-16 { gap: 16px; }
.praxis .gap-28 { gap: 28px; }
/* ════════════════════════════════════════════════════════════════
   PATCH — Auditoria 10 Jun 2026 · Lotes 1-4
   Resolve: var(--accent) indefinida (P1), contraste terracota em
   texto pequeno (P1, WCAG AA), estados de foco ausentes (P2).
   Aditivo: nenhuma regra existente e alterada.
   ════════════════════════════════════════════════════════════════ */
:root {
  --accent: #A8481A;
  --orange-text: #A8481A;
}
.praxis .nav-link:hover,
.praxis .nav-link.active,
.praxis .footer-link:hover,
.praxis p a:not(.btn):not([class*="btn"]),
.praxis .lede a:not(.btn) {
  color: var(--orange-text);
}
.praxis .btn-primary {
  background: var(--orange-text);
  border-color: var(--orange-text);
}
.praxis .btn-primary:hover {
  background: #8F3D16;
  border-color: #8F3D16;
}
.praxis :focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
  border-radius: 2px;
}
.praxis .hero-dark :focus-visible,
.praxis .footer-praxis :focus-visible,
.praxis .not-block :focus-visible,
.praxis .dark :focus-visible,
.praxis [data-theme="dark"] :focus-visible {
  outline-color: #F3EEE4;
}


/* ===== Home CTAs reorganizados (demo-strip + fieldnotes--strip) 27jun2026 ===== */
/* ════════════════════════════════════════════════════════════════
   ADIÇÃO a cnp-praxis.css - reorganização dos CTAs do fim da home
   27 jun 2026 · aditivo, escopado em .praxis, não toca regras existentes
   Colar no FIM de cnp-praxis.css.
   ════════════════════════════════════════════════════════════════ */

/* ── A. Live demo strip (compacto) ─────────────────────────────── */
.praxis .demo-strip{display:grid;grid-template-columns:0.82fr 1.18fr;gap:48px;align-items:center;}
.praxis .demo-strip-media{position:relative;border-radius:5px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:0 24px 50px -34px rgba(26,23,20,0.4);}
.praxis .demo-strip-media .window-dots{display:flex;align-items:center;gap:7px;padding:10px 14px;border-bottom:1px solid var(--line);background:#F6F2E9;}
.praxis .demo-strip-media .window-caption{font-size:10.5px;color:var(--muted);margin-left:6px;font-family:'IBM Plex Mono',monospace;}
.praxis .demo-strip-media .live-pill{position:absolute;top:11px;right:12px;display:inline-flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);background:rgba(28,122,87,0.1);padding:3px 8px;border-radius:2px;}
.praxis .demo-strip-media .live-pill span{width:5px;height:5px;border-radius:50%;background:var(--green-bright);}
.praxis .demo-strip-chart{padding:18px 18px 14px;}
.praxis .demo-eyebrow{margin-bottom:16px;}
.praxis .demo-strip-body h2{font-size:clamp(23px,2.5vw,31px);font-weight:400;line-height:1.16;letter-spacing:-0.015em;margin-bottom:13px;}
.praxis .demo-strip-body p{font-size:15.5px;line-height:1.62;color:var(--ink-2);max-width:480px;margin-bottom:24px;}
.praxis .demo-strip-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.praxis .demo-strip-meta{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--muted);letter-spacing:.02em;}

/* ── B. Field Notes strip (compacto) · modifier do partil ──────── */
/* classes do partial mantidas: .cnp-fieldnotes .ey .p .cnp-fn-form .micro */
.praxis .cnp-fieldnotes--strip{display:grid;grid-template-columns:1.05fr 0.95fr;gap:54px;align-items:center;padding:6px 0;}
.praxis .cnp-fieldnotes--strip .ey{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-text);margin-bottom:12px;}
.praxis .cnp-fieldnotes--strip h3{font-family:'Newsreader',Georgia,serif;font-size:clamp(23px,2.3vw,30px);font-weight:400;line-height:1.15;letter-spacing:-0.012em;margin-bottom:10px;}
.praxis .cnp-fieldnotes--strip .p{font-size:15px;line-height:1.6;color:var(--ink-2);max-width:460px;margin:0;}
.praxis .cnp-fieldnotes--strip .cnp-fn-form{display:flex;gap:10px;}
.praxis .cnp-fieldnotes--strip .cnp-fn-form input[type=email]{flex:1;min-width:0;height:50px;padding:0 16px;border:1px solid var(--line-2);border-radius:2px;background:#fff;font-family:'Hanken Grotesk',sans-serif;font-size:15px;color:var(--ink);}
.praxis .cnp-fieldnotes--strip .cnp-fn-form input[type=email]::placeholder{color:var(--muted-2);}
.praxis .cnp-fieldnotes--strip .cnp-fn-form input[type=email]:focus{outline:2px solid var(--orange);outline-offset:1px;border-color:var(--orange);}
.praxis .cnp-fieldnotes--strip .cnp-fn-form button{height:50px;padding:0 22px;border:1px solid var(--orange-text);background:var(--orange-text);color:#fff;border-radius:2px;font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:14.5px;white-space:nowrap;transition:background .2s;}
.praxis .cnp-fieldnotes--strip .cnp-fn-form button:hover{background:#8F3D16;border-color:#8F3D16;}
.praxis .cnp-fieldnotes--strip .micro{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.02em;color:var(--muted);margin-top:12px;}

/* ── Responsivo (ambos os blocos) ──────────────────────────────── */
@media (max-width:820px){
  .praxis .demo-strip{grid-template-columns:1fr;gap:30px;}
  .praxis .cnp-fieldnotes--strip{grid-template-columns:1fr;gap:24px;}
  .praxis .cnp-fieldnotes--strip .cnp-fn-form{flex-direction:column;}
  .praxis .cnp-fieldnotes--strip .cnp-fn-form button{width:100%;}
}

/* ─── UI/UX consistência de largura (27 jun 2026) ───
   Largura Praxis canónica = 1240px em TODAS as páginas. Os templates de
   indústria definiam .cnp-ind{--maxw:1140px} inline (style no head), deixando
   as páginas de indústria 100px mais estreitas. !important para uniformizar. */
:root{ --maxw:1240px; }
.wrap{ max-width:1240px; margin-left:auto; margin-right:auto; padding-left:40px; padding-right:40px; box-sizing:border-box; }
.cnp-ind .wrap, body.cnp-industrynew .wrap, .cnp-newpage .wrap{ max-width:1240px !important; }
@media (max-width:1080px){ .wrap{ padding-left:20px; padding-right:20px; } }
@media (max-width:480px){ .wrap{ padding-left:16px; padding-right:16px; } }

/* ─── Blocos interativos injetados: alinhar ao container 1240 (27 jun) ───
   cc-estimator/cc-livemodel/cc-toggle/cc-learnnext eram inseridos sem wrapper,
   ficando full-width (1351) ou com larguras dispares na mesma página.
   Normalizar a 1240 centrado (sem padding extra: os componentes já têm o seu). */
.cc-estimator, .cc-livemodel, .cc-toggle, .cc-learnnext{
  max-width:1240px; margin-left:auto; margin-right:auto; box-sizing:border-box;
}
.cc-demo > .wrap, .cc-demo .wrap{ max-width:1240px !important; }

/* ─── mega "Work with us": CTA inline na coluna Start here (27 jun) ───
   Era uma 4ª coluna/banda separada; movido para dentro da 3ª coluna
   para o mega ficar com 3 colunas limpas (igual ao Expertise). */
.mega-cta-inline{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--line,#DCD3C2);
  display:flex; flex-direction:column; gap:10px; align-items:flex-start;
}
.mega-cta-inline .txt{
  font-family:'Newsreader',serif; font-size:15px; line-height:1.4; color:var(--ink,#1A1714);
}
.mega-cta-inline .txt em{ font-style:italic; color:var(--orange,#C75B22); }

/* ====== PRAXIS LAYOUT SYSTEM — FASE 1 (tokens + modificadores novos) 28jun2026 ======
   Aditivo e seguro: só define tokens e classes NOVAS que ainda não existem no site.
   NÃO altera .narrow/.sec/.related/h1-h3 existentes (essas vêm em fases seguintes).
   Reverter: apagar deste marcador até FIM-FASE-1. */
:root{
  --w-wide:1240px; --w-feature:980px; --w-read:760px;
  --rail-pad:clamp(20px,5vw,56px);
  --sp-zone:clamp(88px,9vw,132px); --sp-sec:clamp(60px,7vw,96px);
  --sp-xl:48px; --sp-lg:32px; --sp-md:22px; --sp-sm:14px; --sp-xs:8px;
  --t-display:clamp(40px,5.2vw,66px); --t-h2:clamp(28px,3.3vw,41px); --t-h3:clamp(20px,1.9vw,24px);
  --t-lede:clamp(19px,1.6vw,22px); --t-body:17.5px; --t-small:14px; --t-eyebrow:11.5px;
  --measure-read:66ch; --hair:#DCD3C2; --hair-2:#C9BEAA; --ease:cubic-bezier(.2,.6,.2,1);
}
/* modificadores NOVOS de largura (opt-in; nenhum elemento atual os usa) */
.wrap--feature > *{ max-width:var(--w-feature); margin-inline:auto; }
.wrap--read > *{ max-width:var(--w-read); margin-inline:auto; }
.measure{ max-width:var(--w-read); margin-inline:auto; }
.measure p{ max-width:var(--measure-read); }
.measure--left{ margin-inline:0; max-width:var(--w-read); }
/* secção de leitura com cabeçalho rail (opt-in) */
.sec--read .sec__head{ max-width:var(--w-wide); margin:0 auto var(--sp-lg); padding-top:var(--sp-md); border-top:1px solid var(--hair); display:flex; align-items:baseline; gap:14px; }
.sec--read .sec__head .kicker{ flex:0 0 auto; }
.sec--read .sec__body{ max-width:var(--w-read); margin-inline:auto; }
/* ritmo opt-in (classes novas; .sec/.section-pad base NÃO alterados nesta fase) */
.sec--zone{ padding-block:var(--sp-zone); }
.sec--tight{ padding-block:var(--sp-xl); }
.sec--endcap{ border-bottom:1px solid var(--hair); }
/* micro-detalhes opt-in (classes novas) */
.kicker--rule::before, .eyebrow--rule::before{ content:""; display:inline-block; width:22px; height:1px; background:var(--orange,#C75B22); vertical-align:middle; margin-right:10px; transform:translateY(-2px); }
.rule{ border:0; border-top:1px solid var(--hair); margin-block:var(--sp-xl); }
a:focus-visible, button:focus-visible{ outline:2px solid var(--orange,#C75B22); outline-offset:3px; border-radius:3px; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }
/* ====== FIM-FASE-1 ====== */


/* === CNP-12JUL-MOBILE-HEADER: mobile header fix ===
   The header's orange CTA (a.btn.btn-primary, ~280px) overflowed the bar on
   phones and pushed the hamburger off-screen; it is redundant on mobile (also
   present in the hero and inside the mobile menu). Scoped to #cnp-nav-praxis so
   the separate #cnp-mobile-menu (.acc-link CTA) is untouched. Also stops the
   language switcher from being squeezed to a few px. */
@media (max-width: 1080px) {
  #cnp-nav-praxis .btn.btn-primary { display: none !important; }
  #cnp-nav-praxis .nav-lang { flex: 0 0 auto; white-space: nowrap; }
  #cnp-nav-praxis #cnp-lang-wrap { flex: 0 0 auto; }
  #cnp-nav-praxis .nav-lang-dropdown { min-width: 88px; }
}


/* --- Footer laptop/tablet overflow fix (added 21 Jul 2026) ---------------
   .footer-grid is forced to 8 cols via inline style; between ~761px and full
   desktop that + the 48px gap overflows (page-wide horizontal scrollbar).
   Collapse to fewer/wider cols + smaller gap for that band only. Bounded
   ranges keep the existing <=760/<=480 mobile rules untouched. !important
   beats the inline template. Reversible: delete this block. */
@media (min-width: 901px) and (max-width: 1200px) {
  .praxis .footer-grid {
    grid-template-columns: 1.4fr repeat(3, 1fr) !important;
    gap: 40px 32px !important;
  }
}
@media (min-width: 761px) and (max-width: 900px) {
  .praxis .footer-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 36px 28px !important;
  }
}
/* --- end footer overflow fix --------------------------------------------- */

/* --- cnp-praxis-discoverability-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-praxis-discoverability.css (31332 B) --- */
/* ---───────────────────────────────────────────────────────────
   cnp-praxis-discoverability.css
   Mega-menu · Search overlay · Related cross-linking · 5-col footer.
   Enqueue site-wide (depends on the Praxis tokens below — already
   present if cnp-praxis.css is loaded; re-declared here so this file
   is drop-in safe on its own). Never blue. Orange = #C75B22.
   ---────────────────────────────────────────────────────────--- */
:root {
  --orange:#C75B22; --orange-bright:#E2761A; --orange-faint:rgba(199,91,34,0.10);
  --ink:#1A1714; --ink-2:#4A4138; --muted:#756859; --muted-2:#9A8E7E;
  --paper:#F3EEE4; --paper-2:#EDE6D8; --surface:#FBF9F3;
  --line:#DCD3C2; --line-2:#C9BEAA; --night:#1A1714;
}


/* --- Nav extensions ---─────────────────────────────────────--- */
.nav-links { gap: 26px; }
#navSimple { display: inline-flex; align-items: center; gap: 26px; }
#navSimple a { font-size: 14px; color: var(--ink-2); white-space: nowrap; transition: color .15s; }
#navSimple a:hover { color: var(--orange); }

.nav-item { position: relative; }

/* Expertise trigger */
.nav-trigger {
  display: inline-flex; align-items: center; gap: 6px;
  background: none; border: 0; cursor: pointer;
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 14px; color: var(--ink-2);
  padding: 0; transition: color .15s;
}
.nav-trigger:hover, .nav-trigger[aria-expanded="true"] { color: var(--orange); }
.nav-trigger .chev {
  width: 9px; height: 9px; transition: transform .2s ease;
}
.nav-trigger[aria-expanded="true"] .chev { transform: rotate(180deg); }

/* Search lupa */
.nav-search {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  background: none; border: 1px solid transparent; border-radius: 50%;
  cursor: pointer; color: var(--ink-2);
  transition: color .15s, border-color .15s, background .15s;
}
.nav-search:hover { color: var(--orange); border-color: var(--line-2); }
.nav-search svg { width: 17px; height: 17px; }

.nav-lang {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--muted); display: inline-flex; gap: 7px; align-items: center;
}
.nav-lang button {
  background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; letter-spacing: inherit; color: var(--muted-2);
  transition: color .15s;
}
.nav-lang button:hover { color: var(--orange); }
.nav-lang button.on { color: var(--ink); }
.nav-lang .div { color: var(--line-2); }

/* --- Mega-menu ---──────────────────────────────────────────--- */
.mega {
  position: fixed; top: 84px; right: 24px; left: auto;
  transform: translateY(-6px);
  width: min(1280px, calc(100vw - 48px));
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 4px;
  box-shadow: 0 30px 70px -28px rgba(26,23,20,0.32), 0 2px 0 rgba(26,23,20,0.02);
  opacity: 0; visibility: hidden;
  transition: opacity .2s ease, transform .22s cubic-bezier(.16,.8,.3,1), visibility .2s;
  z-index: 60;
  overflow: hidden;
}
.mega[data-open="true"] {
  opacity: 1; visibility: visible;
  transform: translateY(0);
}
.mega-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1.15fr;
  gap: 0;
}
.mega-col {
  padding: 30px 24px 26px;
  border-right: 1px solid var(--line);
}
.mega-col:last-child { border-right: 0; }
.mega-col.mega-proof { background: var(--paper); }

.mega-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--orange);
  margin: 0 0 16px;
  display: flex; align-items: center; gap: 10px;
}
.mega-label::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.mega-label.sub { margin-top: 26px; color: var(--muted); }
.mega-label.sub::after { background: var(--line); }
/* 26 jun: fix mega column alignment + variable column counts */
.mega-col > .mega-label.sub:first-child { margin-top: 0; }
.mega-grid.mega-grid-3 { grid-template-columns: repeat(3, 1fr); }
.mega-grid.mega-grid-4 { grid-template-columns: repeat(3, 1fr) 1.15fr; }

.mega-list { list-style: none; margin: 0; padding: 0; }
.mega-list li { margin: 0; }
.mega-link {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px; margin: 0 -9px;
  border-radius: 3px;
  font-size: 14px; color: var(--ink);
  line-height: 1.3;
  transition: background .14s, color .14s;
}
.mega-link:hover { background: var(--orange-faint); color: var(--orange); }
.mega-link .star { color: var(--orange); font-size: 11px; line-height: 1; }
.mega-link .tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase;
  color: #fff; background: var(--orange);
  padding: 2px 6px; border-radius: 2px; margin-left: auto;
}
.mega-link.is-new { /* hidden-page that now gets a link — subtle dot */ }
.mega-link.is-new::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--orange); flex: 0 0 auto;
}

/* industries single column (5 items) */
.mega-industries { columns: 1; }
.mega-industries li { break-inside: avoid; }

/* See all → hub link at the foot of each thematic column */
.mega-seeall {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 14px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--orange);
  transition: gap .16s, color .16s;
}
.mega-seeall:hover { color: #A8481A; gap: 11px; }
.mega-seeall svg { width: 13px; height: 9px; }

/* Featured case study mini-card */
.mega-feature {
  display: block;
  margin-top: 12px;
  padding: 16px 16px 15px;
  background: var(--ink);
  border-radius: 4px;
  color: #fff;
  position: relative; overflow: hidden;
  transition: transform .2s ease;
}
.mega-feature:hover { transform: translateY(-2px); color: #fff; }
.mega-feature::after {
  content: ''; position: absolute; top: -40px; right: -40px;
  width: 150px; height: 150px;
  background: radial-gradient(circle, rgba(226,118,26,0.4) 0%, rgba(226,118,26,0) 65%);
  pointer-events: none;
}
.mega-feature .kicker {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--orange-bright); display: flex; align-items: center; gap: 6px;
}
.mega-feature .ttl {
  font-family: 'Newsreader', serif; font-size: 18px; line-height: 1.2;
  color: #fff; margin: 8px 0 4px; position: relative;
}
.mega-feature .sub {
  font-size: 12.5px; color: rgba(255,255,255,0.62); position: relative;
  line-height: 1.45;
}

.mega-proofbtn {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 14px; width: 100%; justify-content: center;
  padding: 12px 16px; border-radius: 3px;
  background: var(--orange); color: #fff;
  font-size: 13.5px; font-weight: 600;
  transition: background .18s;
}
.mega-proofbtn:hover { background: #A8481A; color: #fff; }
.mega-proofbtn svg { transition: transform .2s; }
.mega-proofbtn:hover svg { transform: translateX(3px); }

/* footer CTA band of the mega */
.mega-cta {
  grid-column: 1 / -1;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 18px 34px;
  background: var(--paper-2);
  border-top: 1px solid var(--line);
}
.mega-cta .txt {
  font-family: 'Newsreader', serif; font-size: 18px; color: var(--ink);
}
.mega-cta .txt em { font-style: italic; color: var(--orange); }

/* --- Search overlay ---─────────────────────────────────────--- */
.search-overlay {
  position: fixed; inset: 0; z-index: 200;
  display: flex; flex-direction: column;
  background: rgba(243,238,228,0.94);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  opacity: 0; visibility: hidden;
  transition: opacity .28s ease, visibility .28s;
}
.search-overlay[data-open="true"] { opacity: 1; visibility: visible; }
.search-scrim { position: absolute; inset: 0; }

.search-close {
  position: absolute; top: 26px; right: 32px; z-index: 3;
  width: 46px; height: 46px; border-radius: 50%;
  background: none; border: 1px solid var(--line-2); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--ink); transition: background .18s, color .18s, transform .18s;
}
.search-close:hover { background: var(--ink); color: #fff; transform: rotate(90deg); }

.search-inner {
  position: relative; z-index: 2;
  width: 100%; max-width: 880px; margin: 0 auto;
  padding: 0 40px;
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  overflow-y: auto;
}
.search-eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 18px;
  display: flex; align-items: center; gap: 12px;
}
.search-eyebrow::before { content: ''; width: 26px; height: 1px; background: var(--orange); }

.search-form {
  display: flex; align-items: center; gap: 14px;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 14px;
}
.search-form svg.lupa { width: 26px; height: 26px; color: var(--muted); flex: 0 0 auto; }
.search-input {
  flex: 1; border: 0; background: none; outline: none;
  font-family: 'Newsreader', Georgia, serif;
  font-size: clamp(26px, 4.4vw, 44px); font-weight: 400;
  color: var(--ink); letter-spacing: -0.02em;
}
.search-input::placeholder { color: var(--muted-2); }
.search-submit {
  flex: 0 0 auto;
  background: var(--orange); color: #fff; border: 0; cursor: pointer;
  border-radius: 3px; padding: 12px 22px;
  font-family: 'Hanken Grotesk', sans-serif; font-size: 14px; font-weight: 600;
  display: inline-flex; align-items: center; gap: 8px;
  transition: background .18s;
}
.search-submit:hover { background: #A8481A; }

.search-hint {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; letter-spacing: 0.06em; color: var(--muted-2);
  margin-top: 12px;
}
.search-hint kbd {
  font-family: 'IBM Plex Mono', monospace; font-size: 10.5px;
  background: var(--paper-2); border: 1px solid var(--line-2);
  border-radius: 3px; padding: 1px 6px; color: var(--ink-2);
}

.chips-wrap { margin-top: 48px; }
.chips-group { margin-bottom: 26px; }
.chips-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 12px;
}
.chips { display: flex; flex-wrap: wrap; gap: 9px; }
.chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 14px; border-radius: 100px;
  background: var(--surface); border: 1px solid var(--line);
  font-size: 13.5px; color: var(--ink);
  transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.chip:hover { background: var(--orange-faint); border-color: var(--orange); color: var(--orange); transform: translateY(-1px); }
.chip .star { color: var(--orange); font-size: 11px; }
.chip.feat { background: var(--ink); border-color: var(--ink); color: #fff; }
.chip.feat:hover { background: var(--orange); border-color: var(--orange); color: #fff; }
.chip.feat .star { color: var(--orange-bright); }
.chip.feat:hover .star { color: #fff; }

/* --- Search results page (search.php) ---──────────────────--- */
.results-hero { padding: 60px 0 40px; border-bottom: 1px solid var(--line); }
.results-hero h1 { font-size: clamp(34px, 4.5vw, 56px); }
.results-hero h1 em { font-style: italic; color: var(--orange); }
.results-meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--muted); margin-top: 14px;
}
.results-search {
  display: flex; align-items: center; gap: 12px;
  margin-top: 28px; max-width: 560px;
  background: var(--surface); border: 1px solid var(--line-2);
  border-radius: 4px; padding: 8px 8px 8px 16px;
}
.results-search svg { width: 20px; height: 20px; color: var(--muted); flex: 0 0 auto; }
.results-search input {
  flex: 1; border: 0; background: none; outline: none;
  font-family: 'Hanken Grotesk', sans-serif; font-size: 16px; color: var(--ink);
}
.results-pager {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin-top: 28px; padding-top: 26px; border-top: 1px solid var(--line);
  font-family: 'IBM Plex Mono', monospace; font-size: 12px;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.results-pager .pg { color: var(--ink-2); display: inline-flex; align-items: center; gap: 8px; }
.results-pager .pg[aria-disabled="true"] { color: var(--muted-2); }
.results-pager a.pg:hover { color: var(--orange); }
.results-pager .pg-nums { display: inline-flex; gap: 14px; align-items: center; }
.results-pager .pg-nums b { color: var(--orange); }
.results-pager .pg-nums a { color: var(--muted); }
.results-pager .pg-nums a:hover { color: var(--orange); }
.result-list { list-style: none; margin: 0; padding: 0; }
.result-item {
  padding: 30px 0; border-bottom: 1px solid var(--line);
  display: grid; grid-template-columns: 90px 1fr; gap: 24px;
}
.result-item .idx {
  font-family: 'IBM Plex Mono', monospace; font-size: 12px;
  color: var(--muted-2); letter-spacing: 0.08em; padding-top: 6px;
}
.result-item h3 { margin-bottom: 8px; }
.result-item h3 a:hover { color: var(--orange); }
.result-item .excerpt { color: var(--ink-2); font-size: 16px; max-width: 64ch; }
.result-item .crumbpath {
  font-family: 'IBM Plex Mono', monospace; font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted);
  margin-top: 10px;
}

/* --- Related topics section (cross-linking) ---────────────--- */
.related { padding: 84px 0; background: var(--paper-2); border-top: 1px solid var(--line); }
/* Fix 17 Jun: conter o .wrap do Related (algumas paginas tinham-no full-width) */
.related > .wrap { max-width: 1240px; margin: 0 auto; padding: 0 40px; box-sizing: border-box; }
.related-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 24px; margin-bottom: 32px; flex-wrap: wrap;
}
.related-head h2 { font-size: clamp(26px, 3vw, 36px); }
.related-from {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--muted); padding: 6px 12px; border: 1px solid var(--line);
  border-radius: 100px; background: var(--surface); white-space: nowrap;
}
.related-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;
}
.rcard {
  display: flex; flex-direction: column;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 4px; padding: 22px 22px 20px;
  min-height: 188px;
  transition: border-color .18s, transform .18s, box-shadow .18s;
}
.rcard:hover {
  border-color: var(--orange); transform: translateY(-3px);
  box-shadow: 0 18px 40px -24px rgba(26,23,20,0.3);
}
.rcard .rk {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 14px;
}
.rcard h3 {
  font-family: 'Newsreader', serif; font-size: 21px; line-height: 1.18;
  color: var(--ink); margin-bottom: 8px; font-weight: 400;
}
.rcard:hover h3 { color: var(--orange); }
.rcard p { font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.rcard .arrow {
  margin-top: auto; padding-top: 16px;
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'IBM Plex Mono', monospace; font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted);
  transition: color .18s, gap .18s;
}
.rcard:hover .arrow { color: var(--orange); gap: 12px; }

/* CTA card variant — the conversion card */
.rcard.cta {
  background: var(--ink); border-color: var(--ink); color: #fff;
  position: relative; overflow: hidden;
}
.rcard.cta::after {
  content: ''; position: absolute; top: -50px; right: -50px;
  width: 180px; height: 180px;
  background: radial-gradient(circle, rgba(226,118,26,0.36) 0%, rgba(226,118,26,0) 65%);
  pointer-events: none;
}
.rcard.cta:hover { transform: translateY(-3px); border-color: var(--orange-bright); }
.rcard.cta .rk { color: var(--orange-bright); position: relative; }
.rcard.cta h3 { color: #fff; position: relative; }
.rcard.cta:hover h3 { color: #fff; }
.rcard.cta p { color: rgba(255,255,255,0.66); position: relative; }
.rcard.cta .arrow { color: #fff; position: relative; }
.rcard.cta:hover .arrow { color: var(--orange-bright); }

/* --- Enriched 5-column footer ---──────────────────────────--- */
.bigfooter { background: #14110D; color: rgba(255,255,255,0.62); padding: 72px 0 34px; }
.bigfooter .fgrid {
  display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 36px;
  padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,0.1);
}
.bigfooter .fbrand {
  font-family: 'Newsreader', serif; font-size: 21px; color: #fff;
  display: inline-flex; align-items: center; gap: 9px; margin-bottom: 16px;
}
.bigfooter .fbrand .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange-bright); }
.bigfooter .fblurb { font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,0.5); max-width: 30ch; }
.bigfooter .fcol h4 {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--orange-bright); font-weight: 500; margin: 0 0 16px;
}
.bigfooter .fcol ul { list-style: none; margin: 0; padding: 0; }
.bigfooter .fcol li { margin-bottom: 9px; }
.bigfooter .fcol a {
  font-size: 13.5px; color: rgba(255,255,255,0.62);
  display: inline-flex; align-items: center; gap: 6px; transition: color .15s;
}
.bigfooter .fcol a:hover { color: #fff; }
.bigfooter .fcol a .star { color: var(--orange-bright); font-size: 10px; }
.bigfooter .flegal {
  display: flex; justify-content: space-between; align-items: center;
  gap: 20px; flex-wrap: wrap; padding-top: 26px;
  font-family: 'IBM Plex Mono', monospace; font-size: 11px;
  letter-spacing: 0.06em; color: rgba(255,255,255,0.42);
}
.bigfooter .flegal a { color: rgba(255,255,255,0.5); }
.bigfooter .flegal a:hover { color: #fff; }
.bigfooter .flegal .links { display: flex; gap: 22px; flex-wrap: wrap; }

/* --- Mobile menu ---───────────────────────────────────────--- */
.nav-burger {
  display: none;
  width: 40px; height: 40px; border: 1px solid var(--line-2); border-radius: 3px;
  background: none; cursor: pointer; align-items: center; justify-content: center;
  color: var(--ink);
}
.nav-burger svg { width: 20px; height: 20px; }

.mobile-menu {
  position: fixed; inset: 0; z-index: 150;
  background: var(--paper);
  transform: translateX(100%); transition: transform .3s cubic-bezier(.16,.8,.3,1);
  display: flex; flex-direction: column; overflow-y: auto;
}
.mobile-menu[data-open="true"] { transform: translateX(0); }
.mobile-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px; border-bottom: 1px solid var(--line);
}
.mobile-body { padding: 10px 22px 40px; }
.mobile-link {
  display: block; padding: 16px 0; font-size: 18px;
  font-family: 'Newsreader', serif; color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.acc-trigger {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 16px 0; background: none; border: 0; cursor: pointer;
  border-bottom: 1px solid var(--line);
  font-family: 'Newsreader', serif; font-size: 18px; color: var(--ink);
}
.acc-trigger .chev { width: 12px; height: 12px; transition: transform .22s; color: var(--orange); }
.acc-trigger[aria-expanded="true"] .chev { transform: rotate(180deg); }
.acc-panel { display: none; padding: 6px 0 14px; }
.acc-panel[data-open="true"] { display: block; }
.acc-sub {
  font-family: 'IBM Plex Mono', monospace; font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange);
  margin: 16px 0 8px;
}
.acc-link { display: flex; align-items: center; gap: 8px; padding: 9px 0; font-size: 15.5px; color: var(--ink-2); }
.acc-link:hover { color: var(--orange); }
.acc-link .star { color: var(--orange); font-size: 10px; }

/* Mega-menu: collapse 5 columns gracefully on narrower desktops */
@media (max-width: 1180px) {
  .mega-grid { grid-template-columns: 1fr 1fr 1fr; }
  .mega-col { border-bottom: 1px solid var(--line); }
  .mega-col.mega-proof { grid-column: 1 / -1; border-bottom: 0; }
}
@media (max-width: 920px) {
  .mega-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 980px) {
  .related-grid { grid-template-columns: 1fr 1fr; }
  .bigfooter .fgrid { grid-template-columns: 1fr 1fr 1fr; gap: 30px; }
  .bigfooter .fbrand-col { grid-column: 1 / -1; }
}
@media (max-width: 880px) {
  .nav-links { display: none; }
  .nav-burger { display: flex; }
  .nav-search.always { display: flex; }
}
@media (max-width: 620px) {
  .related-grid { grid-template-columns: 1fr; }
  .bigfooter .fgrid { grid-template-columns: 1fr 1fr; }
  .search-inner { padding: 0 22px; }
  .search-close { top: 16px; right: 18px; }
}

/* Field notes email capture (Brevo) — 19 jun */
.cnp-fieldnotes{background:var(--surface,#FBF9F3);border:1px solid var(--line,#DCD3C2);border-radius:10px;padding:32px 34px;margin:48px auto;max-width:1240px;box-sizing:border-box;}
.cnp-fieldnotes .fn-ey{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--orange,#C75B22);font-weight:600;margin:0;}
.cnp-fieldnotes .fn-h{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:27px;line-height:1.12;margin:8px 0 6px;color:var(--ink,#1A1714);}
.cnp-fieldnotes .fn-p{margin:0;color:var(--ink-2,#4A4138);font-size:15px;max-width:60ch;line-height:1.55;}
.cnp-fieldnotes .fn-form{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.cnp-fieldnotes .fn-form input[type=email]{flex:1;min-width:240px;padding:13px 15px;border:1px solid var(--line,#DCD3C2);border-radius:6px;font-size:15px;font-family:'Hanken Grotesk',sans-serif;background:#fff;color:var(--ink,#1A1714);}
.cnp-fieldnotes .fn-form input[type=email]:focus{outline:2px solid var(--orange,#C75B22);outline-offset:1px;border-color:var(--orange,#C75B22);}
.cnp-fieldnotes .fn-form button{padding:13px 24px;border:none;border-radius:6px;background:var(--orange,#C75B22);color:#fff;font-weight:600;font-size:15px;cursor:pointer;font-family:'Hanken Grotesk',sans-serif;transition:filter .18s;}
.cnp-fieldnotes .fn-form button:hover{filter:brightness(1.07);}
.cnp-fieldnotes .fn-mi{font-size:12.5px;color:var(--muted,#9A8E7E);margin:10px 0 0;}
@media(max-width:680px){.cnp-fieldnotes{padding:26px 22px;}.cnp-fieldnotes .fn-form input[type=email]{min-width:100%;}}


/* ════════════════════════════════════════════════════════════
   ZIP60 ADDITIONS · Work-with-us mega + home services + search type
   Appended 24 Jun 2026. Builds on existing .mega/.result-item.
   ════════════════════════════════════════════════════════════ */
:root { --orange-faint: rgba(199,91,34,0.08); }

/* Mega: flagship tag on the Work mega service link */
.mega-link.is-flagship { font-weight: 600; }
.mega-link .mega-tag {
  display: inline-block; margin-left: 8px; font-family: 'IBM Plex Mono', monospace;
  font-size: 8.5px; letter-spacing: 0.12em; text-transform: uppercase;
  color: #fff; background: var(--orange); border-radius: 100px; padding: 2px 7px; vertical-align: middle;
}
.mega-link .star { color: var(--orange); font-size: 9px; margin-right: 5px; }

/* --- Home · "Work with us" services section --- */

/* --- Home · "Work with us" services section (NEW) ---───────--- */
.svc { background: var(--paper-2); border-top: 1px solid var(--line); }
.svc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 38px; }
.svc-card {
  display: flex; flex-direction: column;
  background: var(--surface); border: 1px solid var(--line);
  border-top: 3px solid var(--line-2); border-radius: 4px;
  padding: 32px 32px 28px;
  transition: border-color .18s, transform .18s, box-shadow .18s;
}
.svc-card:hover { transform: translateY(-3px); box-shadow: 0 22px 50px -30px rgba(26,23,20,0.34); }
.svc-card.anchor { border-top-color: var(--orange); }
.svc-card.anchor:hover { border-color: var(--orange); }
.svc-card .k {
  font-family: 'IBM Plex Mono', monospace; font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange);
  display: flex; align-items: center; gap: 10px; margin-bottom: 18px;
}
.svc-card .k .badge { background: var(--green); color: #fff; border-radius: 100px; padding: 3px 10px; font-size: 9px; letter-spacing: 0.1em; white-space: nowrap; }
.svc-card h3 { font-family: 'Newsreader', serif; font-weight: 500; font-size: clamp(24px, 2.6vw, 31px); line-height: 1.13; color: var(--ink); margin: 0 0 12px; }
.svc-card h3 em { font-style: italic; color: var(--orange); }
.svc-card > p { font-size: 15.5px; line-height: 1.55; color: var(--ink-2); max-width: 46ch; }
.svc-card .svc-meta { font-family: 'IBM Plex Mono', monospace; font-size: 11.5px; color: var(--muted); margin-top: auto; padding-top: 18px; }
.svc-card .arrow {
  margin-top: 20px; display: inline-flex; align-items: center; gap: 9px;
  font-family: 'Hanken Grotesk', sans-serif; font-weight: 600; font-size: 14.5px; color: var(--orange);
}
.svc-card .arrow svg { transition: transform .2s; }
.svc-card:hover .arrow svg { transform: translateX(3px); }
.svc-rail {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  margin-top: 22px; padding-top: 26px; border-top: 1px solid var(--line);
}
.svc-rail .lab { font-family: 'IBM Plex Mono', monospace; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-right: 2px; }
.svc-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 100px;
  padding: 9px 16px; font-size: 14px; color: var(--ink);
  transition: border-color .15s, color .15s, transform .15s;
}
.svc-pill:hover { border-color: var(--orange); color: var(--orange); transform: translateY(-1px); }
.svc-pill .star { color: var(--orange); font-size: 10px; }
@media (max-width: 820px) { .svc-grid { grid-template-columns: 1fr; } }

/* --- Search results · type pill + breadcrumb + orange titles --- */
.result-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 11px; }
.result-type {
  font-family: 'IBM Plex Mono', monospace; font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-2); background: var(--paper-2);
  border: 1px solid var(--line); border-radius: 100px; padding: 3px 11px;
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.result-type .star { color: var(--orange); font-size: 10px; line-height: 1; }
.result-type.is-service { color: #fff; background: var(--orange); border-color: var(--orange); }
.result-type.is-persona { color: var(--orange); background: var(--orange-faint); border-color: transparent; }
.result-item h3 a { color: var(--orange); }
.result-item h3 a:hover { color: #A8481A; }
.result-item .crumbpath {
  font-family: 'IBM Plex Mono', monospace; font-size: 10.5px;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted);
  display: inline-flex; align-items: center; gap: 8px; min-width: 0;
}
.result-item .result-url {
  font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--muted-2);
  margin-top: 13px; letter-spacing: 0.01em; word-break: break-word;
}

/* --- Search results · responsive collapse (the mobile fix) --- */
@media (max-width: 620px) {
  .result-item { grid-template-columns: 1fr; gap: 0; padding: 20px 18px; }
  .result-item .idx { display: none; }
  .results-search, .results-search-form { flex-wrap: wrap; max-width: none; }
  .results-search input, .results-search-form input { min-width: 0; }
  .results-search .btn, .results-search-form button { width: 100%; justify-content: center; }
}

/* zip64 fix: search page .wrap was full-width (no container). Constrain to Praxis 1240px like the rest. */
.cnp-search .results-hero > .wrap,
.cnp-search .section > .wrap,
.cnp-search section > .wrap { max-width: 1240px; margin: 0 auto; padding: 0 40px; box-sizing: border-box; }
@media (max-width: 620px) {
  .cnp-search .results-hero > .wrap,
  .cnp-search .section > .wrap,
  .cnp-search section > .wrap { padding: 0 22px; }
}

/* 24 jun: fix Related grid horizontal overflow (dark CTA card bleeding off).
   Grid items default to min-width:auto and refuse to shrink below content,
   blowing the grid past 1240px. Force shrinkable cells. */
.related-grid { max-width: 100%; }
.related-grid > .rcard, .related-grid > a.rcard { min-width: 0; overflow: hidden; }
.rcard .rk, .rcard h3, .rcard p { overflow-wrap: anywhere; }

/* 24 jun fix #2: on the new industry template a generic theme rule was setting
   .related{display:grid}, collapsing the inner .wrap to ~440px and breaking
   the related grid. Force block layout + full-width wrap. */
body.cnp-industrynew .related { display: block !important; }
body.cnp-industrynew .related > .wrap { width: 100%; max-width: 1240px; margin: 0 auto; box-sizing: border-box; }
.related { display: block; }

/* ============================================================
   cnp-nav-methods-rebalance.css  ·  FRENTE 1
   28 jun 2026 · Claude Design → Cowork
   Append to cnp-praxis-discoverability.css (or enqueue after it).
   Pairs with the sub-grouped Methods column in cnp-nav-praxis.php.
   Praxis. Never blue. Builds on existing .mega / .mega-label.sub.
   ============================================================ */

/* The Methods column now carries two labelled sub-groups (Core costing /
   Strategy, planning & frameworks). Tighten its rhythm so the extra header row
   does not make the column tower over Analysis/Guides. */
.mega-col-methods .mega-label.sub { margin-top: 18px; }
.mega-col-methods .mega-list .mega-link { padding-top: 5px; padding-bottom: 5px; }

/* Keep the foot link pinned with a hair of breathing room after the 2nd group */
.mega-col-methods .mega-seeall { margin-top: 16px; }

/* Mobile accordion: the two sub-headers already use .acc-sub; nothing else needed.
   This guard just keeps the first sub-header from doubling the gap under the
   Expertise accordion trigger. */
.acc-panel > .acc-sub:first-child { margin-top: 12px; }

/* 1 Jul 2026 (Cowork): make "Strategy, planning & frameworks" sub-label match "Core costing"
   (orange + line), per Miguel. Only the colour differed; line was already present. */
.mega-col-methods .mega-label.sub { color: var(--orange); }

/* --- cnp-praxis-system-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-praxis-system.css (15584 B) --- */
/* ════════════════════════════════════════════════════════════════════════
   cnp-praxis-system.css  -  Sistema de design transversal (Praxis)
   29 jun 2026 · costandprofitability.com · coachfocus-child (body.praxis)

   4 frentes (faseável):
     FASE 1 · Rail de largura único (1240) alinhado header ↔ conteúdo
     FASE 2 · Escala tipográfica única (h1/h2/h3/lede tokens)  + cânone de títulos
     FASE 3 · Ritmo vertical sóbrio
     FASE 4 · Related → cartões

   Escopado em .praxis (site) e .cnpnp (newpages). Aditivo. Carregar DEPOIS
   de cnp-praxis.css. Nada aqui inventa cores novas; usa os tokens da marca.
   ════════════════════════════════════════════════════════════════════════ */

:root{
  /* largura mestra - a MESMA aresta para header, faixas e conteúdo */
  --rail: 1240px;
  --rail-pad: 40px;          /* recuo lateral; conteúdo vai de calc((100%-rail)/2 + pad) */
  --read-max: 78ch;          /* medida de leitura GENEROSA (não estreitar abaixo disto) */

  /* escala tipográfica fluida única (afinada com olho de design) */
  --t-h1: clamp(40px, 5.0vw, 60px);
  --t-h2: clamp(29px, 3.2vw, 40px);
  --t-h3: clamp(20px, 1.7vw, 23px);
  --t-lede: clamp(18px, 1.5vw, 21px);
  --t-eyebrow: 0.72rem;

  --lh-title: 1.12;
  --lh-h3: 1.22;
  --lh-body: 1.65;

  /* ritmo vertical SÓBRIO (Miguel achou o anterior exagerado) */
  --sec-pad: clamp(48px, 4.5vw, 64px);     /* secção padrão */
  --sec-pad-zone: clamp(60px, 5.5vw, 80px);/* abertura de zona temática (pouco maior) */
  --sec-pad-tight: clamp(32px, 3vw, 44px); /* faixas finas (proof, eyebrow) */
}

/* ════════════════════════════════════════════════════════════════════════
   FASE 1 - RAIL DE LARGURA ÚNICO
   ════════════════════════════════════════════════════════════════════════ */

/* O container canónico passa a derivar da largura mestra. Mantém 1240/40
   como hoje, mas agora é a ÚNICA fonte de verdade. */
.praxis .container,
.cnpnp .container{
  max-width: var(--rail);
  margin-inline: auto;
  padding-inline: var(--rail-pad);
  width: 100%;
}

/* Helper para qualquer wrapper que NÃO use .container (mu-plugins, faixas). */
.praxis .cnp-rail,
.cnpnp .cnp-rail{
  max-width: var(--rail);
  margin-inline: auto;
  padding-inline: var(--rail-pad);
  width: 100%;
}

/* ── HEADER: alinhar o rail do header à mesma aresta do conteúdo ──
   No live o header útil era ~1160 (mais estreito 40px de cada lado).
   Trazemos o inner do header para 1240/40 = mesma borda do .container. */
.praxis .site-header > .container,
.praxis .site-header__inner,
.praxis .cnp-header__inner,
.praxis header.praxis-header .inner,
.praxis .nav-praxis__inner{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%;
}

/* ── BARRA "Proven where it counts" (mu-plugin cnp-home-proof.php, .cc-proof) ──
   Wrapper é full-width; o inner ficava < 1240 e parecia curto. Forçar rail. */
.praxis .cc-proof,
.praxis .cc-proof__inner,
.praxis .cc-proof .cc-proof__wrap{
  max-width: none;
}
.praxis .cc-proof__inner,
.praxis .cc-proof__wrap{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%;
}

/* ── "Work with us" (home) - wrapper próprio, não usava .container ──
   Selector defensivo: qualquer secção .cnp-work / [data-section="work-with-us"]. */
.praxis .cnp-work > div,
.praxis .cnp-work__inner,
.praxis [data-section="work-with-us"] > div:first-child{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%;
}

/* GLOSSARIO (cnp-glossary-praxis): wrappers proprios .g-* nao usavam .container.
   Alinhar hero/tools/sections ao mesmo rail 1240/40 do resto do site. */
.praxis .g-hero > div,
.praxis .g-tools > div,
.praxis .g-body > .g-section{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%;
  box-sizing: border-box;
}
/* filhos diretos da section ja herdam o recuo do pai: sem padding duplo */
.praxis .g-section > .g-sechead,
.praxis .g-section > .g-grid{ padding-inline: 0 !important; max-width: none !important; }

/* GUIA (cnp-guide-praxis): wrappers .gd-* proprios. Alinhar TODO o layout ao rail. */
.praxis .gd-hero > div{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%; box-sizing: border-box;
}
/* layout 2 colunas (indice dos passos + corpo): conter no rail, alinhar a sidebar,
   e deixar a coluna de leitura usar o espaco (sem vazio grande a direita). */
.praxis .gd-layout{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  box-sizing: border-box;
  grid-template-columns: 220px minmax(0,1fr) !important;
  column-gap: 64px !important;
}
.praxis .gd-body{ max-width: none !important; }
@media (max-width: 900px){
  .praxis .gd-layout{ grid-template-columns: 1fr !important; }
}

/* DASHBOARD (cnp-dashboard-praxis): header .p-h proprio. Alinhar ao rail. */
.praxis .p-h{
  max-width: var(--rail) !important;
  margin-inline: auto !important;
  padding-inline: var(--rail-pad) !important;
  width: 100%; box-sizing: border-box;
}

/* Medida de leitura: larga por defeito. .narrow alinha à leitura generosa,
   nunca abaixo do atual. (Miguel rejeita 760/62ch.) */
.praxis .narrow,
.praxis .container-narrow,
.cnpnp .narrow{
  max-width: var(--read-max);
  margin-inline: auto;
  padding-inline: var(--rail-pad);
}

/* ════════════════════════════════════════════════════════════════════════
   FASE 2 - ESCALA TIPOGRÁFICA ÚNICA
   O mesmo nível de título tem SEMPRE o mesmo tamanho, em todos os templates.
   ════════════════════════════════════════════════════════════════════════ */
.praxis h1, .cnpnp h1,
.praxis .h1, .cnpnp .h1,
.praxis .h1-hero{
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 400;
  font-size: var(--t-h1);
  line-height: var(--lh-title);
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.praxis h2, .cnpnp h2,
.praxis .h2, .cnpnp .h2,
.praxis .h2-section{
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 400;
  font-size: var(--t-h2);
  line-height: var(--lh-title);
  letter-spacing: -0.015em;
  text-wrap: balance;
}

.praxis h3, .cnpnp h3,
.praxis .h3, .cnpnp .h3{
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 500;
  font-size: var(--t-h3);
  line-height: var(--lh-h3);
  letter-spacing: -0.01em;
}

/* lede / subtítulos - uniformes e a USAR a largura (ver Fase 2-bis) */
.praxis .lede, .cnpnp .lede,
.praxis .ph-def, .cnpnp .ph-def,
.praxis .section-lede{
  font-size: var(--t-lede);
  line-height: 1.6;
  color: var(--ink-2, #4A4138);
}

/* eyebrows uniformes */
.praxis .eyebrow, .cnpnp .eyebrow,
.praxis .section-num,
.praxis .kicker, .cnpnp .kicker{
  font-family: 'IBM Plex Mono', monospace;
  font-size: var(--t-eyebrow);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 500;
}

/* ── ALVOS ESPECÍFICOS que estavam fora de escala (medições do Miguel) ──
   "Work with us" h2 estava a 24px, "In short" a 28px. Sobem ao nível h2. */
.praxis .cnp-work h2,
.praxis [data-section="work-with-us"] h2,
.praxis .cnp-inshort h2,
.praxis .in-short h2{
  font-size: var(--t-h2) !important;
  line-height: var(--lh-title) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   FASE 2-bis - TEXTO USA A LARGURA (não partir frases curtas)
   ════════════════════════════════════════════════════════════════════════ */
/* ledes e parágrafos de apoio usam a largura disponível; só leitura longa
   tem medida-máxima confortável (generosa). NUNCA 62ch. */
.praxis .lede, .cnpnp .lede,
.praxis .section-lede,
.praxis .cnp-work .lede,
.praxis [data-section="work-with-us"] .lede{
  max-width: none;       /* usa a largura do rail; frases curtas não quebram */
  text-wrap: pretty;
}
/* corpo de leitura longo (artigos, definições) - medida generosa */
.praxis .prose, .cnpnp .prose,
.praxis .article-body, .cnpnp .article-body,
.praxis .rich-text p{
  max-width: var(--read-max);
  text-wrap: pretty;
}

/* ════════════════════════════════════════════════════════════════════════
   FASE 2-ter - CÂNONE DE QUEBRA DE TÍTULO + KEYWORD
   Regra (codificada):
   · Afirmação sóbria + reviravolta/tese → quebra deliberada na fronteira,
     keyword colorida SÓ na 2ª unidade (em-orange). Um destaque por título.
   · Afirmação única e direta → linha única, sem cor.
   Markup: <h_ class="title-turn">Sober part.<br class="title-br">
            <em class="em-orange">The turn.</em></h_>
   A quebra de impacto só acima de 720px; em mobile reflui naturalmente.
   ════════════════════════════════════════════════════════════════════════ */
.praxis .em-orange, .cnpnp .em-orange{
  font-style: italic;
  color: var(--orange, #C75B22);
}
.praxis .title-turn, .cnpnp .title-turn{ text-wrap: balance; }
/* a quebra controlada: visível só em ecrã largo */
.praxis .title-br, .cnpnp .title-br{ display: none; }
@media (min-width: 720px){
  .praxis .title-turn .title-br,
  .cnpnp .title-turn .title-br{ display: inline; }
  /* quando há quebra de impacto, não deixar o balance reflowar contra ela */
  .praxis .title-turn, .cnpnp .title-turn{ text-wrap: pretty; }
}
/* keyword-only (1-3 palavras-âncora dentro de uma frase, sem quebra) */
.praxis .kw, .cnpnp .kw{ color: var(--orange, #C75B22); font-style: italic; }

/* ════════════════════════════════════════════════════════════════════════
   FASE 3 - RITMO VERTICAL SÓBRIO
   ════════════════════════════════════════════════════════════════════════ */
.praxis .section,
.praxis .sec,
.cnpnp .sec,
.cnpnp .section{
  padding-top: var(--sec-pad);
  padding-bottom: var(--sec-pad);
}
/* abertura de zona temática - só ligeiramente maior */
.praxis .section--zone,
.praxis .sec--zone,
.cnpnp .sec--zone,
.praxis [data-zone-start]{
  padding-top: var(--sec-pad-zone);
}
/* faixas finas */
.praxis .sec--tight,
.cnpnp .sec--tight,
.praxis .cc-proof,
.praxis .cnp-eyebrow-band{
  padding-top: var(--sec-pad-tight);
  padding-bottom: var(--sec-pad-tight);
}
/* secções coladas: sem dupla folga (a de baixo de uma + a de cima da seguinte) */
.praxis .sec + .sec,
.cnpnp .sec + .sec,
.praxis .section + .section{
  padding-top: 0;
}
/* remate antes do footer */
.praxis .cta-band + footer,
.praxis .section:last-of-type{
  /* nada extra; o CTA band já tem o seu padding. Evita folga dupla. */
}

/* ════════════════════════════════════════════════════════════════════════
   FASE 4 - RELATED → CARTÕES (uniformizar para todo o site)
   Cânone único; substitui listas simples e variações de .rcard.
   ════════════════════════════════════════════════════════════════════════ */
.praxis .related-grid,
.cnpnp .related-grid,
.praxis .rgrid,
.praxis .keep-exploring__grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
  margin-top: 28px;
}
.praxis .rcard,
.cnpnp .rcard,
.praxis .related-grid > a,
.praxis .keep-exploring__grid > a{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--surface, #FBF9F3);
  border: 1px solid var(--line, #DCD3C2);
  border-radius: 8px;
  padding: 24px 24px 22px;
  text-decoration: none;
  color: var(--ink, #1A1714);
  overflow: hidden;
  transition: border-color .18s, transform .18s, box-shadow .18s;
}
.praxis .rcard::before,
.praxis .related-grid > a::before,
.praxis .keep-exploring__grid > a::before{
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--orange, #C75B22);
  transform: scaleX(0); transform-origin: left;
  transition: transform .22s ease;
}
.praxis .rcard:hover,
.praxis .related-grid > a:hover,
.praxis .keep-exploring__grid > a:hover{
  border-color: var(--line-2, #C9BEAA);
  transform: translateY(-2px);
  box-shadow: 0 16px 40px -22px rgba(26,23,20,0.3);
}
.praxis .rcard:hover::before,
.praxis .related-grid > a:hover::before,
.praxis .keep-exploring__grid > a:hover::before{ transform: scaleX(1); }
.praxis .rcard .rk,
.praxis .rcard .r-kicker{
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--orange-text, #A8481A);
}
.praxis .rcard h3,
.praxis .rcard h4,
.praxis .rcard .r-title{
  font-family: 'Newsreader', serif; font-weight: 500;
  font-size: 20px; line-height: 1.2; margin: 2px 0 0;
}
.praxis .rcard p,
.praxis .rcard .r-desc{
  font-size: 14px; line-height: 1.55; color: var(--ink-2, #4A4138); margin: 0;
}
.praxis .rcard .r-more{
  margin-top: auto; padding-top: 12px;
  font-family: 'Hanken Grotesk', sans-serif; font-weight: 600; font-size: 13.5px;
  color: var(--orange-text, #A8481A);
}

/* ════════════════════════════════════════════════════════════════════════
   MOBILE (validado a 360px) - frases PT/ES mais longas não devem partir layout
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 680px){
  :root{ --rail-pad: 22px; }
  .praxis .related-grid,
  .cnpnp .related-grid{ grid-template-columns: 1fr; }
}

/* --- cnp-endcta-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-endcta.css (5296 B) --- */
/* ════════════════════════════════════════════════════════════════════════
   CNP-ENDCTA.CSS - Bloco-CTA premium (o "endCTA" definitivo) · Praxis
   costandprofitability.com · 30 jun 2026 · Never blue

   PORQUÊ
   As páginas novas terminam com um .endcta simples (texto centrado + 2 botões).
   As páginas-pilar antigas terminam sem CTA. Este ficheiro eleva o .endcta a um
   PAINEL premium sobre papel quente, e dá um modelo de markup único para colar
   onde falta. Drop-in: mantém a classe .endcta - as páginas que já a têm ganham
   o upgrade só com o enqueue; as que não têm, recebem o bloco-modelo.

   COMO USAR
   Enqueue globalmente, DEPOIS de site.css e industry-pages.css. Usa os tokens
   Praxis já definidos em :root (--paper, --surface, --orange, --ink...). Aditivo.

   ORANGE: o botão primário usa o laranja Praxis do site (--orange #C75B22,
   hover --orange-bright #E2761A) - o mesmo de todos os botões do site, para
   coerência. (#F08319 é o laranja do PRODUTO CostCtrl, usado na app, não aqui.)
   ════════════════════════════════════════════════════════════════════════ */

/* ── Painel ────────────────────────────────────────────────────────────────
   .endcta passa de faixa simples a painel centrado sobre papel. Funciona tanto
   no markup novo (.wrap > .endcta) como no legado (.wrap.endcta): o max-width
   do painel ganha à largura do rail e centra. */
.endcta{
  max-width:940px;
  margin:0 auto;
  text-align:center;
  border:1px solid var(--line);
  border-top:1px solid var(--line);           /* anula o border-top antigo de faixa */
  border-radius:18px;
  background:
    radial-gradient(120% 140% at 50% -20%, rgba(199,91,34,0.06), transparent 60%),
    linear-gradient(180deg, var(--surface) 0%, var(--paper) 100%);
  padding:clamp(46px,6vw,72px) clamp(28px,5vw,68px) clamp(40px,5vw,60px);
  box-shadow:0 1px 0 rgba(255,255,255,0.6) inset, 0 24px 60px -38px rgba(20,17,13,0.45);
}

/* marca de dois pontos (motivo do logótipo) acima do eyebrow */
.endcta-mark{
  display:block;width:20px;height:7px;margin:0 auto 22px;
  background:
    radial-gradient(circle 3.5px at 3.5px 3.5px, var(--orange) 96%, transparent),
    radial-gradient(circle 3.5px at 16.5px 3.5px, var(--orange) 96%, transparent);
}

/* eyebrow centrado (o markup já põe justify-content:center inline; reforço) */
.endcta .eyebrow{justify-content:center;margin-bottom:14px;}

/* título-gancho serif */
.endcta h2{
  font-family:'Newsreader',Georgia,serif;font-weight:500;
  font-size:clamp(30px,4vw,46px);line-height:1.06;letter-spacing:-0.01em;
  max-width:20ch;margin:0 auto;color:var(--ink);text-wrap:balance;
}
.endcta h2 em{font-style:italic;color:var(--orange);}

/* subtítulo */
.endcta p{
  font-size:clamp(16px,1.6vw,18px);line-height:1.55;color:var(--ink2);
  max-width:58ch;margin:18px auto 0;text-wrap:pretty;
}

/* botões - maiores e centrados */
.endcta .herocta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:30px;}
.endcta .btn{padding:15px 30px;font-size:15.5px;border-radius:5px;}
.endcta .btn-primary{box-shadow:0 10px 24px -12px rgba(199,91,34,0.7);}

/* microcopy de reasseguro (linha mono com pontos médios) */
.endcta-assure{
  list-style:none;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:6px 16px;margin:26px 0 0;padding:0;
}
.endcta-assure li{
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.07em;
  text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:16px;
}
.endcta-assure li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--line2);}

/* ── Variante escura (opcional, para fim de página de impacto) ──────────────
   Adicionar a classe .endcta--dark ao bloco. */
.endcta--dark{
  background:
    radial-gradient(120% 140% at 50% -10%, rgba(226,118,26,0.16), transparent 60%),
    var(--ink-dark);
  border-color:rgba(255,255,255,0.10);
  box-shadow:0 30px 70px -40px rgba(0,0,0,0.7);
}
.endcta--dark h2{color:#fff;}
.endcta--dark h2 em{color:var(--orange-bright);}
.endcta--dark p{color:#E0D6C6;}
.endcta--dark .kicker{color:var(--orange-bright);}
.endcta--dark .eyebrow::before{background:var(--orange-bright);}
.endcta--dark .btn-ghost{color:var(--paper);border-color:rgba(255,255,255,0.28);}
.endcta--dark .btn-ghost:hover{border-color:var(--orange-bright);color:#fff;}
.endcta--dark .endcta-assure li{color:rgba(243,238,228,0.62);}
.endcta--dark .endcta-assure li+li::before{background:rgba(255,255,255,0.22);}

/* ── Responsivo ────────────────────────────────────────────────────────────*/
@media(max-width:560px){
  .endcta{border-radius:14px;}
  .endcta .herocta .btn{width:100%;justify-content:center;}
}

/* --- cnp-blog-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-blog.css (9519 B) --- */
/*
   CNP-BLOG.CSS - Lote 6 - CSS comum dos posts, externalizado FIEL ao inline live (1 jul 2026).
   Gerado do bloco <style> Article layout do cnp-blogpost-praxis.php LIVE (verbatim) + regra whatsapp-float.
   Enfileirar depois de cnp-praxis.css. Aditivo. Look identico ao pixel.
*/
/* Article layout */
.praxis .article-hero {
  padding: 140px 0 48px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.praxis .article-hero .container {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 24px;
}
.praxis .back-link {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-2);
  text-decoration: none;
  letter-spacing: 0.02em;
  transition: color 0.2s;
}
.praxis .back-link:hover {
  color: var(--orange);
}
.praxis .category-badge {
  display: inline-block;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--orange);
  background: rgba(232, 119, 34, 0.08);
  padding: 5px 12px;
  border-radius: 3px;
  margin-top: 28px;
}
.praxis .article-hero h1 {
  font-family: 'Newsreader', serif;
  font-size: 42px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--ink);
  margin: 20px 0 24px;
  letter-spacing: -0.02em;
}
.praxis .author-line {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 8px;
}
.praxis .author-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}
.praxis .author-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.praxis .author-name {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
}
.praxis .author-date {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12.5px;
  color: var(--ink-3);
  letter-spacing: 0.01em;
}

/* Article content */
.praxis .article-body {
  max-width: 920px;
  margin: 0 auto;
  padding: 56px 24px 72px;
}
.praxis .article-content p {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 18.5px;
  line-height: 1.78;
  color: var(--ink-2);
  margin-bottom: 24px;
}
.praxis .article-content h2 {
  font-family: 'Newsreader', serif;
  font-size: 30px;
  font-weight: 500;
  margin: 46px 0 16px;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.praxis .article-content h3 {
  font-family: 'Newsreader', serif;
  font-size: 24px;
  font-weight: 500;
  margin: 36px 0 12px;
  color: var(--ink);
}
.praxis .article-content blockquote {
  font-family: 'Newsreader', serif;
  font-size: 25px;
  line-height: 1.4;
  font-style: italic;
  color: var(--ink);
  border-left: 3px solid var(--orange);
  padding-left: 28px;
  margin: 40px 0;
}
.praxis .article-content ul,
.praxis .article-content ol {
  margin: 20px 0;
  padding-left: 24px;
}
.praxis .article-content li {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink-2);
  margin-bottom: 8px;
}
.praxis .article-content img {
  border-radius: 4px;
  margin: 32px 0;
  max-width: 100%;
  height: auto;
}
.praxis .article-content strong {
  font-weight: 600;
  color: var(--ink);
}
.praxis .article-content a {
  color: var(--orange);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.praxis .article-content a:hover {
  color: var(--orange-bright);
}
.praxis .article-content figure {
  margin: 36px 0;
}
.praxis .article-content figcaption {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  color: var(--ink-3);
  margin-top: 8px;
  text-align: center;
}

/* Drop intro */
.praxis .article-content .drop-intro {
  font-family: 'Newsreader', serif;
  font-size: 23px;
  font-style: italic;
  line-height: 1.6;
  color: var(--ink);
}

/* Author bio card */
.praxis .author-card {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 24px 64px;
}
.praxis .author-card-inner {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 32px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 6px;
}
.praxis .author-card-img {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.praxis .author-card-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.praxis .author-card-name {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
}
.praxis .author-card-role {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--orange);
}
.praxis .author-card-bio {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-2);
  margin-top: 4px;
}

/* Related posts */
.praxis .related-section {
  background: var(--paper-2);
  border-top: 1px solid var(--line);
  padding: 64px 0 80px;
}
.praxis .related-section .container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px;
}
.praxis .related-section h3 {
  font-family: 'Newsreader', serif;
  font-size: 28px;
  font-weight: 400;
  color: var(--ink);
  margin-bottom: 32px;
}
.praxis .related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.praxis .related-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 28px 24px;
  text-decoration: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.praxis .related-card:hover {
  border-color: var(--orange);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.praxis .related-card .cat-badge {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--orange);
}
.praxis .related-card .card-title {
  font-family: 'Newsreader', serif;
  font-size: 19px;
  font-weight: 400;
  color: var(--ink);
  margin: 10px 0 8px;
  line-height: 1.3;
}
.praxis .related-card .card-excerpt {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-3);
}

/* Responsive */
@media (max-width: 760px) {
  .praxis .article-hero h1 { font-size: 30px; }
  .praxis .article-content .drop-intro { font-size: 20px; }
  .praxis .article-content h2 { font-size: 26px; }
  .praxis .article-content blockquote { font-size: 21px; }
  .praxis .related-grid { grid-template-columns: 1fr; }
  .praxis .author-card-inner { flex-direction: column; align-items: center; text-align: center; }
}

  /* === Classes do conteúdo editorial (data-needed trio + futuros posts) === */
  .praxis .article-content table { width:100%; border-collapse:collapse; font-size:14px; margin:24px 0; background:var(--surface,#FBF9F3); }
  .praxis .article-content th { font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; background:var(--ink,#1A1714); color:#EDE6D8; text-align:left; padding:10px 12px; font-weight:500; }
  .praxis .article-content td { padding:10px 12px; border-bottom:1px solid var(--line,#DCD3C2); vertical-align:top; }
  .praxis .article-content .callout { border-left:3px solid var(--orange,#C75B22); background:rgba(199,91,34,0.10); padding:14px 18px; margin:22px 0; border-radius:0 3px 3px 0; color:var(--ink-2,#4A4138); }
  .praxis .article-content .cta-inline { background:var(--surface,#FBF9F3); border:1px solid var(--line,#DCD3C2); border-radius:3px; padding:24px 28px; margin:36px 0; }
  .praxis .article-content .cta-inline b { font-family:'Newsreader',serif; font-size:19px; font-weight:500; }
  .praxis .article-content .cta-inline .btn, .praxis .article-content a.btn { display:inline-flex; padding:13px 24px; font-size:14.5px; font-weight:600; border-radius:2px; background:var(--orange,#C75B22); color:#fff; text-decoration:none; margin-top:12px; }
  .praxis .article-content .fig { margin:30px 0; }
  .praxis .article-content .fig svg { width:100%; height:auto; display:block; background:var(--surface,#FBF9F3); border:1px solid var(--line,#DCD3C2); border-radius:3px; }
  .praxis .article-content .fig figcaption { font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.04em; color:var(--muted,#756859); margin-top:10px; }
  .praxis .article-content .eyebrow { display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:0.06em; color:var(--orange,#C75B22); background:rgba(199,91,34,0.10); padding:5px 12px; border-radius:3px; }
  .praxis .article-content details.faq { border-bottom:1px solid var(--line,#DCD3C2); }
  .praxis .article-content details.faq summary { list-style:none; cursor:pointer; padding:22px 0; font-weight:600; font-size:16px; display:flex; justify-content:space-between; gap:24px; }
  .praxis .article-content details.faq summary::-webkit-details-marker { display:none; }
  .praxis .article-content details.faq summary::after { content:'+'; color:var(--orange,#C75B22); font-size:20px; }
  .praxis .article-content details.faq[open] summary::after { content:'\2013'; }
  .praxis .article-content details.faq p { margin:0 0 22px; font-size:15px; color:var(--ink-2,#4A4138); }

/* ── WhatsApp float (estava inline em cada post; mesma regra) ─────────────── */
.whatsapp-float{position:fixed;bottom:24px;right:24px;width:56px;height:56px;background-color:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.18);z-index:999;transition:transform .18s;}
.whatsapp-float:hover{transform:scale(1.06);}

/* --- cnp-hub-nav-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-hub-nav.css (8007 B) --- */
/* ════════════════════════════════════════════════════════════════════════
   CNP-HUB-NAV.CSS - Lote 5 · Hubs de pilar + navegacao inter-pilar · Praxis
   costandprofitability.com · 30 jun 2026 · Never blue

   Dois componentes, um ficheiro:
     1. .pillar-hub      - indice visual dos filhos de um pilar (cartoes Praxis)
     2. .crosspillar     - bloco de fim de pagina: "voltar ao pilar" + saltar
                           para 3-4 pilares vizinhos

   Codificacao por FAMILIA de pilar (so como ponto/keyline, mantem o papel):
     --fam-method    laranja Praxis   #C75B22
     --fam-industry  verde            #1D9E75
     --fam-ai        vermelho         #E51A4B
     --fam-tools     escuro           #2A2928
   Aplicar a familia com a classe .fam-method / .fam-industry / .fam-ai /
   .fam-tools no contentor (.pillar-hub, .crosspillar) ou no cartao.

   Enqueue DEPOIS de site.css e industry-pages.css. Usa os tokens Praxis de
   :root. Aditivo e idempotente.
   ════════════════════════════════════════════════════════════════════════ */

:root{
  --fam-method:#C75B22;
  --fam-industry:#1D9E75;
  --fam-ai:#E51A4B;
  --fam-tools:#2A2928;
}
.fam-method  { --fam:var(--fam-method); }
.fam-industry{ --fam:var(--fam-industry); }
.fam-ai      { --fam:var(--fam-ai); }
.fam-tools   { --fam:var(--fam-tools); }
[class*="fam-"]{ }                 /* fallback */
.pillar-hub, .crosspillar{ --fam:var(--fam-method); } /* default familia */

/* ── 1. HUB DE PILAR ───────────────────────────────────────────────────────
   Cabecalho do hub + grelha de cartoes-filho. Vive dentro de .wrap. */
.pillar-hub-head{
  border-top:1px solid var(--line);
  padding-top:clamp(28px,4vw,44px);
  margin-bottom:clamp(26px,3.5vw,40px);
}
.pillar-hub-head .fam-tag{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--fam);margin-bottom:14px;
}
.pillar-hub-head .fam-tag::before{
  content:"";width:8px;height:8px;border-radius:50%;background:var(--fam);
}
.pillar-hub-head h2{
  font-family:'Newsreader',serif;font-weight:500;font-size:clamp(26px,3.4vw,40px);
  line-height:1.08;letter-spacing:-0.01em;max-width:24ch;
}
.pillar-hub-head p{
  color:var(--ink2);font-size:16.5px;line-height:1.55;max-width:62ch;
  margin-top:12px;text-wrap:pretty;
}

.pillar-hub-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.hub-card{
  display:flex;flex-direction:column;gap:0;position:relative;
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:24px 24px 22px;overflow:hidden;
  transition:border-color .16s,transform .16s,box-shadow .16s;
}
.hub-card::before{                 /* keyline de familia a esquerda */
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--fam);
  opacity:.85;
}
.hub-card:hover{
  border-color:var(--fam);transform:translateY(-3px);
  box-shadow:0 18px 40px -28px rgba(20,17,13,.5);
}
.hub-card .num{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;
  color:var(--muted);
}
.hub-card h3{
  font-family:'Newsreader',serif;font-weight:500;font-size:21px;line-height:1.18;
  margin:10px 0 0;color:var(--ink);text-wrap:balance;
}
.hub-card p{
  font-size:14px;line-height:1.5;color:var(--ink2);margin:9px 0 0;text-wrap:pretty;
}
.hub-card .go{
  margin-top:16px;font-family:'IBM Plex Mono',monospace;font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--fam);
  display:inline-flex;align-items:center;gap:7px;
}
.hub-card .go::after{content:"\2192";transition:transform .16s;}
.hub-card:hover .go::after{transform:translateX(4px);}

/* cartao destacado (ex: pagina-pilar principal / comecar aqui) */
.hub-card.lead{
  grid-column:span 3;flex-direction:row;align-items:center;gap:28px;
  background:linear-gradient(180deg,var(--surface) 0%,var(--paper) 100%);
}
.hub-card.lead .lead-body{flex:1;}
.hub-card.lead h3{font-size:26px;}
.hub-card.lead .go{margin-top:12px;}
.hub-card.lead .lead-aside{
  flex:none;font-family:'Newsreader',serif;font-style:italic;font-size:17px;
  color:var(--muted);max-width:22ch;text-align:right;
}

/* ── 2. BLOCO INTER-PILAR (fim de pagina profunda) ────────────────────────
   "Ver tudo em [Pilar]" + cartoes pequenos de pilares vizinhos. */
.crosspillar{
  border-top:1px solid var(--line);
  margin-top:clamp(40px,5vw,64px);
  padding-top:clamp(32px,4vw,48px);
}
.crosspillar .back{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--fam);
  border-radius:8px;padding:20px 24px;
  transition:border-color .16s,transform .16s;
}
.crosspillar .back:hover{border-color:var(--fam);transform:translateX(2px);}
.crosspillar .back .b-tag{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--fam);
}
.crosspillar .back .b-title{
  font-family:'Newsreader',serif;font-weight:500;font-size:21px;color:var(--ink);
  line-height:1.15;
}
.crosspillar .back .b-go{
  margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--fam);white-space:nowrap;
  display:inline-flex;align-items:center;gap:8px;
}
.crosspillar .back .b-go::after{content:"\2192";transition:transform .16s;}
.crosspillar .back:hover .b-go::after{transform:translateX(4px);}

.crosspillar .neigh-label{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin:28px 0 14px;
}
.crosspillar .neigh{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
}
.neigh-card{
  position:relative;display:flex;flex-direction:column;gap:8px;
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:16px 16px 16px 18px;
  transition:border-color .16s,transform .16s;
}
.neigh-card::before{
  content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:3px;
  background:var(--nfam,var(--fam));
}
.neigh-card:hover{border-color:var(--nfam,var(--fam));transform:translateY(-2px);}
.neigh-card .nf{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--nfam,var(--fam));
  display:inline-flex;align-items:center;gap:7px;
}
.neigh-card .nf::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--nfam,var(--fam));}
.neigh-card h4{
  font-family:'Newsreader',serif;font-weight:500;font-size:16.5px;line-height:1.2;
  color:var(--ink);margin:0;text-wrap:balance;
}
/* helpers para a familia de cada cartao vizinho */
.nf-method  { --nfam:var(--fam-method); }
.nf-industry{ --nfam:var(--fam-industry); }
.nf-ai      { --nfam:var(--fam-ai); }
.nf-tools   { --nfam:var(--fam-tools); }

/* ── Responsivo ────────────────────────────────────────────────────────────*/
@media(max-width:880px){
  .pillar-hub-grid{grid-template-columns:repeat(2,1fr);}
  .hub-card.lead{grid-column:span 2;}
  .crosspillar .neigh{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:560px){
  .pillar-hub-grid{grid-template-columns:1fr;}
  .hub-card.lead{grid-column:span 1;flex-direction:column;align-items:flex-start;gap:14px;}
  .hub-card.lead .lead-aside{text-align:left;}
  .crosspillar .neigh{grid-template-columns:1fr;}
  .crosspillar .back .b-go{margin-left:0;width:100%;}
}

/* --- cnp-blog-praxis-css  <-  /novo/wp-content/themes/coachfocus-child/cnp-blog-praxis.css (4540 B) --- */
/* Praxis rich blocks + section rhythm for blog article bodies. Cowork 1 Jul 2026. */

/* ---- Section rhythm: give each H2 a marked start and generous vertical space ---- */
.praxis .article-content h2{
  position:relative;
  margin-top:78px;
  margin-bottom:22px;
  padding-top:30px;
  font-family:'Newsreader',Georgia,serif;
  font-weight:500;
  font-size:clamp(28px,3vw,38px);
  line-height:1.15;
  letter-spacing:-0.015em;
  color:#1A1714;
}
.praxis .article-content h2::before{
  content:"";position:absolute;top:0;left:0;width:34px;height:2px;background:#C75B22;
}
.praxis .article-content h2 em{font-style:italic;color:#C75B22;}
.praxis .article-content h3{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:24px;line-height:1.2;color:#1A1714;margin-top:44px;margin-bottom:12px;}
.praxis .article-content > p{font-size:18.5px;line-height:1.75;color:#4A453E;margin:0 0 22px;}
.praxis .article-content .drop-intro{font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:23px;line-height:1.4;color:#1A1714;}
.praxis .article-content ul,.praxis .article-content ol{margin:6px 0 26px;padding-left:2px;}
.praxis .article-content ul li,.praxis .article-content ol li{font-size:18px;line-height:1.7;color:#4A453E;margin-bottom:12px;}

/* ---- GEO box "In short" (citable Q&A) ---- */
.article-content .geo{background:#FBF9F3;border-left:3px solid #C75B22;border-radius:12px;padding:30px 34px;margin:44px 0;}
.article-content .geo .g-label{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#1C7A57;display:block;margin-bottom:12px;}
.article-content .geo .g-q{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:25px;line-height:1.25;color:#1A1714;margin:0 0 14px;}
.article-content .geo .g-a{font-size:16.5px;line-height:1.68;color:#4A453E;margin:0;}

/* ---- Pull-quote callout ---- */
.article-content .pcallout{border-top:1px solid #DCD3C2;border-bottom:1px solid #DCD3C2;padding:28px 0;margin:48px 0;font-family:'Newsreader',Georgia,serif;font-size:26px;line-height:1.32;color:#1A1714;font-style:italic;}
.article-content .pcallout em{color:#C75B22;font-style:italic;}

/* ---- Diagram figure (dark, full-column) ---- */
.article-content .routefig{background:#211D17;border-radius:14px;padding:34px 34px 24px;margin:52px 0;}
.article-content .routefig svg{width:100%;height:auto;display:block;}
.article-content .routefig .rf-cap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:#9A8E7E;margin-top:16px;letter-spacing:.04em;}

/* ---- Stat band (destaque de numeros) ---- */
.article-content .statband{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:48px 0;padding:30px 0;border-top:1px solid #DCD3C2;border-bottom:1px solid #DCD3C2;}
.article-content .statband .st .n{font-family:'Newsreader',Georgia,serif;font-weight:500;font-size:42px;line-height:1;color:#C75B22;}
.article-content .statband .st .l{font-size:14.5px;line-height:1.4;color:#4A453E;margin-top:8px;}
@media(max-width:720px){.article-content .statband{grid-template-columns:1fr;gap:18px;}.article-content .geo .g-q,.article-content .pcallout{font-size:21px;}}

/* ---- Section width: match the home 1240px rail; readable text column + full-width rich blocks ---- */
.praxis .article-body{ max-width:1240px !important; padding-left:40px; padding-right:40px; }
.praxis .article-content{ max-width:none; }
.praxis .article-content > p,
.praxis .article-content > h2,
.praxis .article-content > h3,
.praxis .article-content > ul,
.praxis .article-content > ol,
.praxis .article-content > blockquote{
  max-width:760px; margin-left:0; margin-right:auto;
}
.praxis .article-content > .geo,
.praxis .article-content > .statband,
.praxis .article-content > .routefig,
.praxis .article-content > .pcallout,
.praxis .article-content > .cta-inline,
.praxis .article-content > figure,
.praxis .article-content > .author-card{
  max-width:1160px; margin-left:0; margin-right:auto;
}
@media(max-width:1000px){ .praxis .article-body{ padding-left:22px; padding-right:22px; } .praxis .article-content > p,.praxis .article-content > h2,.praxis .article-content > h3,.praxis .article-content > ul,.praxis .article-content > ol{ max-width:none; } }

/* Hero: match home 1240px rail so it aligns with the article body */
.praxis .article-hero .container{ max-width:1240px !important; padding-left:40px !important; padding-right:40px !important; }
.praxis .article-hero .container > *{ max-width:900px; }

/* --- praxis-type-css  <-  /novo/wp-content/themes/coachfocus-child/praxis/praxis-type.css (5311 B) --- */
/* ============================================================
   PRAXIS TYPE - the typographic system ("o caro esta aqui")
   costandprofitability.com - FABLE, 05 Jul 2026
   Enqueue AFTER cnp-praxis.css, BEFORE praxis-motion.css.
   Newsreader (serif display) / Hanken Grotesk (body) / IBM Plex Mono (labels).
   ============================================================ */

:root{
  /* ---------- modular scale (1.25 major third, tuned) ---------- */
  --tp-xs:   12px;   /* mono micro-labels */
  --tp-sm:   13.5px; /* captions, meta */
  --tp-base: 16px;   /* body */
  --tp-md:   18px;   /* ledes on content pages */
  --tp-lg:   21px;   /* ledes on top pages, pull-quote base */
  --tp-h4:   clamp(19px, 1.6vw, 22px);
  --tp-h3:   clamp(22px, 2.2vw, 27px);
  --tp-h2:   clamp(27px, 3.2vw, 38px);
  --tp-h1:   clamp(36px, 5vw, 58px);
  --tp-hero: clamp(40px, 5.6vw, 66px);

  /* ---------- line heights ---------- */
  --lh-display: 1.05;   /* h1/hero */
  --lh-head:    1.14;   /* h2/h3 */
  --lh-body:    1.62;   /* body copy */
  --lh-tight:   1.4;    /* captions, cards */

  /* ---------- letter spacing ---------- */
  --ls-display: -0.015em;  /* serif display sizes */
  --ls-head:    -0.008em;
  --ls-mono:     0.1em;    /* mono labels, uppercase */

  /* ---------- measure ---------- */
  --measure-body: 66ch;
  --measure-lede: 58ch;
  --measure-head: 24ch;

  /* ---------- vertical rhythm (spacing scale, 8px base) ---------- */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 40px;
  --sp-5: 64px; --sp-6: 96px; --sp-7: 144px;
  /* section paddings: top pages breathe more */
  --sec-pad: var(--sp-6);
  --sec-pad-hero: clamp(64px, 9vh, 112px);
}

/* ---------- headings ---------- */
.tp h1, .tp-h1{ font-family:'Newsreader',serif; font-weight:500;
  font-size:var(--tp-h1); line-height:var(--lh-display); letter-spacing:var(--ls-display);
  max-width:var(--measure-head); text-wrap:balance; }
.tp h2, .tp-h2{ font-family:'Newsreader',serif; font-weight:500;
  font-size:var(--tp-h2); line-height:var(--lh-head); letter-spacing:var(--ls-head);
  max-width:32ch; text-wrap:balance; }
.tp h3, .tp-h3{ font-family:'Newsreader',serif; font-weight:500;
  font-size:var(--tp-h3); line-height:var(--lh-head); }
.tp h4, .tp-h4{ font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:var(--tp-h4); }

/* title-turn: last words of a display heading in italic orange (site canon).
   Markup: <h1>Watch your profit <em class="turn">change shape.</em></h1> */
.turn, .tp h1 em, .tp h2 em{ font-style:italic; color:var(--orange, #C75B22); }

/* ---------- body ---------- */
.tp p, .tp-body{ font-family:'Hanken Grotesk',sans-serif; font-size:var(--tp-base);
  line-height:var(--lh-body); max-width:var(--measure-body); text-wrap:pretty; }
.tp .lede, .tp-lede{ font-size:var(--tp-lg); line-height:1.55; max-width:var(--measure-lede);
  color:var(--ink2, #4A443C); text-wrap:pretty; }

/* ---------- mono labels (kickers, captions, axes) ---------- */
.tp-label{ font-family:'IBM Plex Mono',monospace; font-size:var(--tp-xs);
  letter-spacing:var(--ls-mono); text-transform:uppercase; font-weight:500; }

/* ---------- editorial details ---------- */
/* drop cap: first paragraph of an article. Markup: <p class="dropcap"> */
.dropcap::first-letter{
  font-family:'Newsreader',serif; font-weight:500;
  font-size:3.1em; line-height:.82; float:left;
  padding:6px 10px 0 0; color:var(--orange, #C75B22);
}
/* lead-in: first phrase in small caps. Markup: <span class="leadin">First words</span> */
.leadin{ font-weight:700; letter-spacing:.04em; font-variant:small-caps; }

/* typographic quotes for pull quotes
   Markup: <blockquote class="pullquote"><span class="qt">Quote text.</span><span class="cite">Author</span></blockquote>
   The quotes wrap the .qt span so the closing quote lands at the END of the
   text, never orphaned after the block-level .cite. */
.pullquote{ font-family:'Newsreader',serif; font-style:italic; font-weight:400;
  font-size:clamp(21px, 2.6vw, 28px); line-height:1.35; max-width:44ch;
  padding-left:22px; border-left:3px solid var(--orange, #C75B22); text-wrap:pretty; }
.pullquote .qt::before{ content:"\201C"; }
.pullquote .qt::after{ content:"\201D"; }
.pullquote .cite{ display:block; margin-top:12px; font-family:'IBM Plex Mono',monospace;
  font-style:normal; font-size:var(--tp-xs); letter-spacing:var(--ls-mono);
  text-transform:uppercase; color:var(--muted, #8A8071); }
.pullquote .cite::before{ content:""; } /* no dash: guardrail, mono caps is enough */

/* widow/orphan control everywhere it matters */
.tp h1,.tp h2,.tp h3{ text-wrap:balance; }
.tp p, .tp li, .tp .lede{ text-wrap:pretty; }

/* ---------- vertical rhythm helpers ---------- */
.sec-rhythm{ padding-block:var(--sec-pad); }
.sec-rhythm.hero{ padding-block:var(--sec-pad-hero) var(--sp-5); }
.tp h2 + p{ margin-top:var(--sp-2); }
.tp p + p{ margin-top:var(--sp-2); }
.tp .lede{ margin-top:var(--sp-3); }

/* blog/SEO pages inherit ONLY this file (not hero art):
   wrap article body in .tp.article */
.tp.article p{ margin-top:var(--sp-2); }
.tp.article h2{ margin-top:var(--sp-4); }
.tp.article h3{ margin-top:var(--sp-3); }
.tp.article ul, .tp.article ol{ max-width:var(--measure-body); padding-left:1.2em; }
.tp.article li{ line-height:var(--lh-body); margin-top:6px; }

/* --- praxis-motion-css-css  <-  /novo/wp-content/themes/coachfocus-child/praxis/praxis-motion.css (4466 B) --- */
/* ============================================================
   PRAXIS MOTION - motion tokens + micro-interactions kit
   costandprofitability.com - FABLE, 05 Jul 2026
   Pure CSS + one tiny JS observer (praxis-motion.js).
   Enqueue AFTER cnp-praxis.css. No libs.
   Everything respects prefers-reduced-motion.
   ============================================================ */

:root{
  /* durations */
  --mt-fast: 160ms;
  --mt-base: 300ms;
  --mt-slow: 560ms;
  --mt-reveal: 700ms;
  /* easings */
  --me-out: cubic-bezier(.22,.61,.36,1);       /* standard out */
  --me-spring: cubic-bezier(.34,1.36,.44,1);   /* gentle overshoot, hovers only */
  --me-inout: cubic-bezier(.6,0,.3,1);         /* section transitions */
  /* distances */
  --mv-rise: 22px;
  --mv-lift: -3px;
}

/* ---------- 1. reveal-on-scroll (fade + subtle rise, staggered) ----------
   Markup: add .reveal to any block. Optional data-reveal-delay="1..6"
   for manual stagger, or put .reveal children inside a .reveal-group
   for automatic stagger. praxis-motion.js flips .is-in. */
.reveal{ opacity:0; transform:translateY(var(--mv-rise)); }
.reveal.is-in{
  opacity:1; transform:none;
  transition: opacity var(--mt-reveal) var(--me-out), transform var(--mt-reveal) var(--me-out);
}
.reveal[data-reveal-delay="1"].is-in{ transition-delay: 60ms; }
.reveal[data-reveal-delay="2"].is-in{ transition-delay: 120ms; }
.reveal[data-reveal-delay="3"].is-in{ transition-delay: 180ms; }
.reveal[data-reveal-delay="4"].is-in{ transition-delay: 240ms; }
.reveal[data-reveal-delay="5"].is-in{ transition-delay: 300ms; }
.reveal[data-reveal-delay="6"].is-in{ transition-delay: 360ms; }
.reveal-group > .reveal:nth-child(2).is-in{ transition-delay: 90ms; }
.reveal-group > .reveal:nth-child(3).is-in{ transition-delay: 180ms; }
.reveal-group > .reveal:nth-child(4).is-in{ transition-delay: 270ms; }
.reveal-group > .reveal:nth-child(5).is-in{ transition-delay: 360ms; }
.reveal-group > .reveal:nth-child(n+6).is-in{ transition-delay: 450ms; }

/* ---------- 2. editorial link underline (animated) ----------
   Apply .lk to inline text links in body copy and nav footers. */
.lk{ position:relative; text-decoration:none;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px; background-repeat:no-repeat; background-position:0 100%;
  transition:background-size var(--mt-base) var(--me-out), color var(--mt-fast) ease;
}
.lk:hover{ background-size:100% 1px; }

/* ---------- 3. card lift ----------
   Apply .liftable to cards. Uses shadow tokens tuned to the paper palette. */
.liftable{ transition:transform var(--mt-base) var(--me-out), box-shadow var(--mt-base) var(--me-out), border-color var(--mt-base) ease; }
.liftable:hover{ transform:translateY(var(--mv-lift));
  box-shadow:0 24px 48px -28px rgba(26,23,20,.28); }

/* ---------- 4. CTA arrow slide ----------
   Markup: <a class="btn btn-primary arr">Label <span class="a">\2192</span></a> */
.arr .a{ display:inline-block; transition:transform var(--mt-base) var(--me-spring); }
.arr:hover .a{ transform:translateX(4px); }

/* ---------- 5. count-up numbers ----------
   Markup: <span class="countup" data-count-to="1335000" data-count-format="eur">0</span>
   formats: int | eur | pct. praxis-motion.js animates on first reveal
   (setTimeout scheduler, NOT rAF: rAF stalls in throttled tabs/iframes). */
.countup{ font-variant-numeric:tabular-nums; }

/* ---------- 6. section transitions ----------
   Sections get a soft settle as they enter; heros get a slower cadence. */
.sec-settle{ opacity:0; transform:translateY(14px); }
.sec-settle.is-in{ opacity:1; transform:none;
  transition:opacity var(--mt-slow) var(--me-inout), transform var(--mt-slow) var(--me-inout); }

/* ---------- 7. editorial highlight (heros + pull quotes) ----------
   .hl paints a soft orange wash behind key words once revealed. */
.hl{ background-image:linear-gradient(rgba(199,91,34,.16),rgba(199,91,34,.16));
  background-size:0% 42%; background-repeat:no-repeat; background-position:0 78%;
  transition:background-size 900ms var(--me-out) 300ms; }
.is-in .hl, .hl.is-in{ background-size:100% 42%; }

/* ---------- reduced motion: everything lands instantly ---------- */
@media (prefers-reduced-motion: reduce){
  .reveal, .sec-settle{ opacity:1 !important; transform:none !important; transition:none !important; }
  .lk, .liftable, .arr .a, .hl{ transition:none !important; }
  .hl{ background-size:100% 42%; }
}

/* --- praxis-heroart-css  <-  /novo/wp-content/themes/coachfocus-child/praxis/praxis-heroart.css (6045 B) --- */
/* ============================================================
   PRAXIS HERO ART - signature art direction for top-page heros
   costandprofitability.com - FABLE, 05 Jul 2026
   Generative, no stock: the whale-curve arc as the house motif,
   plus editorial grain and asymmetric composition helpers.
   Pure CSS/SVG (inline data URIs), zero requests, zero JS.
   ============================================================ */

/* ---------- the canvas ----------
   Wrap any hero in .heroart and pick a variant. The art layers sit
   behind the content (z-index) and never intercept the pointer. */
.heroart{ position:relative; overflow:hidden; }
.heroart > *{ position:relative; z-index:2; }
.heroart::before, .heroart::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; }

/* ---------- editorial grain (all variants) ----------
   A faint paper grain: feTurbulence via data URI, tiled. */
.heroart::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply; opacity:.5;
}

/* ---------- variant 1: the whale arc (home, /whale-curve/) ----------
   The cumulative curve as a faint monumental arc, peak off-centre right. */
.heroart.arc::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640' fill='none' preserveAspectRatio='xMidYMax slice'%3E%3Cpath d='M-40 600 C 240 190, 560 120, 820 160 C 1060 197, 1240 340, 1460 520' stroke='%23C75B22' stroke-opacity='0.22' stroke-width='2.5'/%3E%3Cpath d='M-40 630 C 260 280, 620 210, 880 245 C 1100 275, 1260 400, 1460 570' stroke='%231A1714' stroke-opacity='0.08' stroke-width='1.5'/%3E%3C/svg%3E");
  background-size:cover; background-position:center bottom;
}

/* ---------- variant 2: ranked bars (work-with-us, services) ----------
   The margin-ranked bar field, fading into the tail. */
.heroart.bars::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640' preserveAspectRatio='xMidYMax slice'%3E%3Cg fill='%23C75B22'%3E%3Crect x='60' y='470' width='16' height='130' opacity='.16'/%3E%3Crect x='104' y='492' width='16' height='108' opacity='.15'/%3E%3Crect x='148' y='508' width='16' height='92' opacity='.14'/%3E%3Crect x='192' y='521' width='16' height='79' opacity='.12'/%3E%3Crect x='236' y='532' width='16' height='68' opacity='.11'/%3E%3Crect x='280' y='541' width='16' height='59' opacity='.10'/%3E%3Crect x='324' y='549' width='16' height='51' opacity='.09'/%3E%3Crect x='368' y='556' width='16' height='44' opacity='.08'/%3E%3Crect x='412' y='562' width='16' height='38' opacity='.07'/%3E%3Crect x='456' y='567' width='16' height='33' opacity='.06'/%3E%3Crect x='500' y='572' width='16' height='28' opacity='.055'/%3E%3Crect x='544' y='576' width='16' height='24' opacity='.05'/%3E%3Crect x='588' y='580' width='16' height='20' opacity='.045'/%3E%3Crect x='632' y='583' width='16' height='17' opacity='.04'/%3E%3C/g%3E%3Cg fill='%23C43D2B'%3E%3Crect x='1180' y='600' width='16' height='14' opacity='.10'/%3E%3Crect x='1224' y='600' width='16' height='20' opacity='.12'/%3E%3Crect x='1268' y='600' width='16' height='28' opacity='.14'/%3E%3Crect x='1312' y='600' width='16' height='38' opacity='.16'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover; background-position:center bottom;
}

/* ---------- variant 3: time-equation plate (authority/events, about) ----------
   Faint oversized mono figures: the discipline as texture. */
.heroart.eq::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640'%3E%3Ctext x='1370' y='180' text-anchor='end' font-family='IBM Plex Mono,monospace' font-size='120' fill='%231A1714' fill-opacity='0.045'%3E26 + 12x%3C/text%3E%3Ctext x='1370' y='320' text-anchor='end' font-family='IBM Plex Mono,monospace' font-size='120' fill='%231A1714' fill-opacity='0.045'%3E+ 26u%3C/text%3E%3Ctext x='1370' y='460' text-anchor='end' font-family='IBM Plex Mono,monospace' font-size='120' fill='%23C75B22' fill-opacity='0.07'%3E= EUR/min%3C/text%3E%3C/svg%3E");
  background-size:cover; background-position:center;
}

/* ---------- variant 4: dark stage (star pages, CTA bands) ----------
   For dark heros: the arc in bright orange over ink. */
.heroart.dark{ background:var(--ink-dark, #1A1714); color:var(--paper, #F3EEE4); }
.heroart.dark::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640' fill='none' preserveAspectRatio='xMidYMax slice'%3E%3Cpath d='M-40 600 C 240 190, 560 120, 820 160 C 1060 197, 1240 340, 1460 520' stroke='%23E2761A' stroke-opacity='0.3' stroke-width='2.5'/%3E%3Cpath d='M-40 630 C 260 280, 620 210, 880 245 C 1100 275, 1260 400, 1460 570' stroke='%23F3EEE4' stroke-opacity='0.07' stroke-width='1.5'/%3E%3C/svg%3E");
  background-size:cover; background-position:center bottom;
}
.heroart.dark::after{ mix-blend-mode:screen; opacity:.35; }

/* ---------- asymmetric composition helpers ----------
   The house layout: content pinned left on a 7/5 split, art breathing right. */
.heroart .hero-split{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:40px; align-items:end; }
@media(max-width:860px){ .heroart .hero-split{ grid-template-columns:1fr; } }

/* photo treatment for star pages: duotone-leaning, never raw stock */
.heroart .hero-photo{ position:relative; border-radius:12px; overflow:hidden; }
.heroart .hero-photo img{ display:block; width:100%; height:100%; object-fit:cover;
  filter:saturate(.82) contrast(1.04); }
.heroart .hero-photo::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(199,91,34,.18), rgba(26,23,20,.22));
  mix-blend-mode:multiply; }

/* --- praxis-hero-system-css  <-  /novo/wp-content/themes/coachfocus-child/praxis/praxis-hero-system.css (5671 B) --- */
/* ============================================================
   PRAXIS HERO SYSTEM - taxonomia de heros + ritmo + count-up
   costandprofitability.com - FABLE, 06 Jul 2026
   Enfileirar DEPOIS de praxis-heroart.css (ultimo CSS praxis).
   Nao substitui nada: afina os wrappers existentes por template.
   Guardrails: hero instantaneo (compativel com cnp-hero-visible),
   reduced-motion, nunca azul, sem em-dash.
   ============================================================ */

/* ============================================================
   1. TAXONOMIA (mapa template -> variante; Cowork aplica as
      classes via mu-plugin por path/selector)

   TIER A  Pilar/Expertise  .hero-dark      = heroart dark (ja e o padrao)
   TIER B  Hub              .hub-hero       + .heroart.arc
           Insights hub     .hero-insights  + .heroart.eq
           About            .hero-about     + .heroart.eq  (aplicado)
   TIER C  Industria        .ph-hero        + .heroart.bars
           Work with us     .wwu-hero       + .heroart.bars (aplicado)
   TIER D  Produto          .pv-hero        + .heroart.eq
   PROPRIO Home (scrolly), Regionais (.cc-pf .pf-hero), Eventos (.ev-hero dark)
   ============================================================ */

/* ---------- 2. acolhimento da hero art nos wrappers claros ----------
   Todos os heros claros ganham o mesmo contrato quando recebem .heroart:
   conteudo acima da arte, arte presa ao fundo, sem esticar a dobra. */
.hub-hero.heroart, .ph-hero.heroart, .pv-hero.heroart,
.hero-insights.heroart, .hero-about.heroart, .wwu-hero.heroart{
  position:relative; overflow:hidden;
}
.hub-hero.heroart::before, .ph-hero.heroart::before, .pv-hero.heroart::before,
.hero-insights.heroart::before, .hero-about.heroart::before, .wwu-hero.heroart::before{
  background-position:center bottom;
}
/* nos claros a arte esmorece no topo para o header nao lutar com ela */
.hub-hero.heroart::before, .ph-hero.heroart::before, .pv-hero.heroart::before,
.hero-insights.heroart::before{
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 32%);
          mask-image:linear-gradient(180deg, transparent 0%, #000 32%);
}

/* ---------- 3. entrada de hero (substitui o .reveal no hero) ----------
   O conteudo do hero e VISIVEL desde o primeiro frame (cnp-hero-visible
   garante isso). Esta entrada e um rise curtissimo, so transform,
   opacity nunca abaixo de 1: zero flash, zero CLS de leitura.
   Markup: adicionar .hero-enter ao wrapper do hero; nada por elemento. */
@media (prefers-reduced-motion: no-preference){
  .hero-enter h1{ animation:heroRise 480ms var(--me-out, cubic-bezier(.22,.61,.36,1)) both; }
  .hero-enter .lede{ animation:heroRise 480ms var(--me-out, cubic-bezier(.22,.61,.36,1)) 90ms both; }
  .hero-enter .herocta, .hero-enter .hero-cta-pair{ animation:heroRise 480ms var(--me-out, cubic-bezier(.22,.61,.36,1)) 170ms both; }
  @keyframes heroRise{ from{ transform:translateY(10px); } to{ transform:none; } }
}
/* IMPORTANTE (Cowork): dentro dos wrappers de hero, REMOVER .reveal do
   eyebrow/H1/lede/CTA e usar .hero-enter no wrapper. O mu-plugin
   cnp-hero-visible.php pode manter-se como cinto de seguranca. */

/* ---------- 4. par de CTA no hero (todos os tiers) ----------
   Contrato unico: um par primario + secundario, gap 12, wrap. */
.hero-cta-pair{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; align-items:center; }
.hero-cta-pair .btn-ghost{ opacity:.92; }
/* em palco escuro o ghost precisa de contorno claro */
.hero-dark .hero-cta-pair .btn-ghost, .heroart.dark .hero-cta-pair .btn-ghost,
.ev-hero .hero-cta-pair .btn-ghost{
  border-color:rgba(243,238,228,.35); color:var(--paper, #F3EEE4);
}
.hero-dark .hero-cta-pair .btn-ghost:hover, .heroart.dark .hero-cta-pair .btn-ghost:hover,
.ev-hero .hero-cta-pair .btn-ghost:hover{ border-color:var(--orange-bright, #E2761A); color:var(--orange-bright, #E2761A); }

/* ---------- 5. ritmo vertical por tipo de seccao ----------
   A escala do praxis-type (--sp-*) aplicada a tres densidades.
   Resolve as folgas ~200px: stats colam-se a seccao anterior. */
.sec-rhythm{ padding-block:var(--sp-6, 96px); }              /* seccao standard */
.sec-rhythm.tight{ padding-block:var(--sp-5, 64px); }        /* seccoes de apoio, FAQ, prova */
.sec-rhythm.flush-top{ padding-block-start:var(--sp-3, 24px); } /* stats/faixas logo apos hero ou seccao-mae */
.sec-rhythm.hero{ padding-block:var(--sec-pad-hero, clamp(64px,9vh,112px)) var(--sp-5, 64px); }
/* faixa de estatisticas: SEMPRE flush-top + fio superior subtil */
.stat-band{ padding-block:var(--sp-4, 40px); border-top:1px solid var(--line, #E5DFD1); }
.stat-band + .sec-rhythm{ padding-block-start:var(--sp-5, 64px); }

/* ---------- 6. count-up: estilos de apoio ----------
   Regras de aplicacao no MAPA (que numeros, formatos, ranges).
   Aqui so o contrato visual: tabular nums e o sufixo mono. */
.countup{ font-variant-numeric:tabular-nums; }
.stat-range{ font-variant-numeric:tabular-nums; } /* ranges NAO levam count-up */

/* ---------- 7. moeda: padrao unico ----------
   Padrao do site: EUR prefixado com o simbolo, espaco fino, sem "EUR" por
   extenso em numeros (so em texto corrido). Ex.: €1,3M / €150k.
   (Regra editorial; a classe so garante os algarismos tabulares.) */
.eur{ font-variant-numeric:tabular-nums; white-space:nowrap; }

/* ---------- 8. mobile ----------
   H1 do hero e grelhas de stats abaixo de 400px. */
@media(max-width:400px){
  .tp h1, .tp-h1{ font-size:clamp(30px, 9.5vw, 36px); }
  .hero-cta-pair .btn{ width:100%; justify-content:center; }
  .stat-band [class*="grid"], .statgrid{ grid-template-columns:1fr !important; }
}

/* --- praxis-heroart-regional-css  <-  /novo/wp-content/themes/coachfocus-child/praxis/praxis-heroart-regional.css (3216 B) --- */
/* ============================================================
   PRAXIS HEROART - variante REGIONAL (item 5, ronda 06 Jul)
   Para as ~170 paginas regionais (BR / LatAm / regionais EN-ES-PT).
   Substitui o heroart.arc generico que o Cowork aplicou.
   Motivo: "meridianos" - linhas de longitude/latitude abstratas
   (geografia neutra, SEM bandeiras, SEM mapas literais) + o arco
   da casa a atravessa-las: o metodo viaja.
   Mesmas convencoes do praxis-heroart.css: data-URI, zero requests,
   grain herdado do wrapper .heroart, currentColor-friendly.
   Enfileirar DEPOIS de praxis-heroart.css.
   ============================================================ */

/* aplicar: <section class="heroart regional"> (substitui .arc nas regionais) */
.heroart.regional::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640' fill='none' preserveAspectRatio='xMidYMax slice'%3E%3C!-- meridianos: arcos de longitude, neutros --%3E%3Cpath d='M200 -40 C 320 160, 320 480, 200 680' stroke='%231A1714' stroke-opacity='0.055' stroke-width='1.5'/%3E%3Cpath d='M480 -40 C 560 160, 560 480, 480 680' stroke='%231A1714' stroke-opacity='0.05' stroke-width='1.5'/%3E%3Cpath d='M760 -40 C 800 160, 800 480, 760 680' stroke='%231A1714' stroke-opacity='0.045' stroke-width='1.5'/%3E%3Cpath d='M1040 -40 C 1040 160, 1040 480, 1040 680' stroke='%231A1714' stroke-opacity='0.04' stroke-width='1.5'/%3E%3C!-- paralelos --%3E%3Cpath d='M-40 200 C 400 168, 1000 168, 1440 200' stroke='%231A1714' stroke-opacity='0.05' stroke-width='1.5'/%3E%3Cpath d='M-40 400 C 400 376, 1000 376, 1440 400' stroke='%231A1714' stroke-opacity='0.045' stroke-width='1.5'/%3E%3C!-- o arco da casa atravessa: o metodo viaja --%3E%3Cpath d='M-40 560 C 300 300, 700 220, 1440 330' stroke='%23C75B22' stroke-opacity='0.2' stroke-width='2.5'/%3E%3Ccircle cx='1085' cy='273' r='5' fill='%23C75B22' fill-opacity='0.45'/%3E%3C/svg%3E");
  background-size:cover; background-position:center;
}

/* variante escura (regionais com hero dark, se existirem) */
.heroart.regional.dark::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 640' fill='none' preserveAspectRatio='xMidYMax slice'%3E%3Cpath d='M200 -40 C 320 160, 320 480, 200 680' stroke='%23F3EEE4' stroke-opacity='0.06' stroke-width='1.5'/%3E%3Cpath d='M480 -40 C 560 160, 560 480, 480 680' stroke='%23F3EEE4' stroke-opacity='0.055' stroke-width='1.5'/%3E%3Cpath d='M760 -40 C 800 160, 800 480, 760 680' stroke='%23F3EEE4' stroke-opacity='0.05' stroke-width='1.5'/%3E%3Cpath d='M1040 -40 C 1040 160, 1040 480, 1040 680' stroke='%23F3EEE4' stroke-opacity='0.045' stroke-width='1.5'/%3E%3Cpath d='M-40 200 C 400 168, 1000 168, 1440 200' stroke='%23F3EEE4' stroke-opacity='0.055' stroke-width='1.5'/%3E%3Cpath d='M-40 400 C 400 376, 1000 376, 1440 400' stroke='%23F3EEE4' stroke-opacity='0.05' stroke-width='1.5'/%3E%3Cpath d='M-40 560 C 300 300, 700 220, 1440 330' stroke='%23E2761A' stroke-opacity='0.26' stroke-width='2.5'/%3E%3Ccircle cx='1085' cy='273' r='5' fill='%23E2761A' fill-opacity='0.5'/%3E%3C/svg%3E");
}

/* nada mais muda: grain, z-index e pointer-events herdam de .heroart */
