/*
 * Dispatcher 101 type system: faces, tokens and role classes.
 *
 * Load on every page, after design.css, variant-site-colours.css and mockups.css
 * wherever those load. Spec and steps: dispatcher101-type-brief.md.
 *
 * Headings, buttons, navigation, prices: Barlow Condensed 700 / 800
 * Everything people read:                  Atkinson Hyperlegible Next 400 / 700
 * Labels and figures people copy:          Atkinson Hyperlegible Mono 400 / 500 / 700
 */


/* 1. Faces
   Self-hosted latin woff2 files in /wp-content/uploads/d101-draft/fonts/
   (SIL Open Font License 1.1; keep the OFL.txt files beside them). */

@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/BarlowCondensed-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/BarlowCondensed-ExtraBold.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/BarlowCondensed-BoldItalic.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/BarlowCondensed-ExtraBoldItalic.woff2") format("woff2");
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/AtkinsonHyperlegibleNext-Variable.woff2") format("woff2");
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/AtkinsonHyperlegibleNext-Variable-Italic.woff2") format("woff2");
}
@font-face {
  font-family: "Atkinson Hyperlegible Mono";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/wp-content/uploads/d101-draft/fonts/AtkinsonHyperlegibleMono-Variable.woff2") format("woff2");
}


/* 2. Tokens
   --d-head and --d-body keep the names design.css and mockups.css already use,
   so every rule that reads them switches face as soon as this file loads.
   Sizes run from the phone size at a 360px screen to the desktop size at a
   1280px screen (root font size is 16px). */

:root {
  --d-head: "Barlow Condensed", "Arial Narrow", sans-serif;
  --d-body: "Atkinson Hyperlegible Next", Verdana, sans-serif;
  --d-mono: "Atkinson Hyperlegible Mono", Consolas, Menlo, monospace;

  --fs-display: clamp(2.625rem, 1.7935rem + 3.6957vw, 4.75rem);  /* 42 → 76 */
  --fs-h1:      clamp(2.25rem, 1.7609rem + 2.1739vw, 3.5rem);    /* 36 → 56 */
  --fs-h2:      clamp(1.875rem, 1.5815rem + 1.3043vw, 2.625rem); /* 30 → 42 */
  --fs-h3:      clamp(1.5rem, 1.3043rem + 0.8696vw, 2rem);       /* 24 → 32 */
  --fs-h4:      clamp(1.25rem, 1.1522rem + 0.4348vw, 1.5rem);    /* 20 → 24 */
  --fs-lead:    clamp(1.1875rem, 1.1386rem + 0.2174vw, 1.3125rem); /* 19 → 21 */
  --fs-body:    clamp(1.0625rem, 1.038rem + 0.1087vw, 1.125rem); /* 17 → 18 */
  --fs-small:   clamp(0.9375rem, 0.913rem + 0.1087vw, 1rem);     /* 15 → 16 */
  --fs-caption: 0.875rem;                                         /* 14, the floor */
  --fs-button:  clamp(1.0625rem, 1.038rem + 0.1087vw, 1.125rem); /* 17 → 18 */
  --fs-nav:     1.0625rem;                                        /* 17 */
  --fs-price:   clamp(2.5rem, 2.3043rem + 0.8696vw, 3rem);       /* 40 → 48 */
  --fs-eyebrow: 0.875rem;                                         /* 14 */
  --fs-data:    clamp(0.9375rem, 0.913rem + 0.1087vw, 1rem);     /* 15 → 16 */

  --lh-display: 1;
  --lh-h1: 1.05;
  --lh-h2: 1.1;
  --lh-h3: 1.15;
  --lh-h4: 1.2;
  --lh-body: 1.6;    /* 1.55 on phones, below */
  --lh-text: 1.5;    /* lead, small, caption, data */
  --lh-label: 1.3;   /* capitals: eyebrows, labels */
  --lh-tight: 1;     /* one-line buttons and prices */

  --ls-caps: 0.05em;   /* Barlow capitals: buttons, navigation, tabs */
  --ls-label: 0.08em;  /* Mono capitals: eyebrows, labels, table headers */
  --ls-small: 0.01em;  /* lowercase Barlow at 24px and under; 14px captions */

  --measure: 640px;    /* widest body column on desktop: 60–75 characters */
}

@media (max-width: 767px) {
  :root { --lh-body: 1.55; }
}


/* 3. Base for the d101 layer */

body.elementor-template-canvas,
.d101 {
  font-family: var(--d-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-synthesis: none; /* a weight or style that isn't loaded never gets faked */
}

.d101 h1,
.d101 h2,
.d101 h3,
.d101 h4,
.d101 .elementor-heading-title {
  text-wrap: balance;
}

.d101 p,
.d101 li,
.d101 .elementor-widget-text-editor {
  text-wrap: pretty;
}


/* 4. Roles
   Use these classes on new content. The brief maps every existing selector in
   design.css and mockups.css to one of them; section 5 copies the declarations. */

.d101 .d-t-display {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-h1 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-h2 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-h3 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-h4 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  letter-spacing: var(--ls-small);
  text-transform: none;
}
.d101 .d-t-lead {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-lead);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-body {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-small {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-caption {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-caption);
  line-height: var(--lh-text);
  letter-spacing: var(--ls-small);
  text-transform: none;
}
.d101 .d-t-button {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-button);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}
.d101 .d-t-nav {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-nav);
  line-height: 1.2;
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}
.d101 .d-t-price {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-price);
  line-height: var(--lh-tight);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-figure {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}
.d101 .d-t-eyebrow {
  font-family: var(--d-mono);
  font-weight: 500;
  font-style: normal;
  font-size: var(--fs-eyebrow);
  line-height: var(--lh-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
}
.d101 .d-t-data {
  font-family: var(--d-mono);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}


/* 5. Role map
   One block per role: the existing selectors listed in the brief (section 4),
   each with that role's declarations from section 4 above. This file loads
   last and uses the same selectors, so these blocks replace the hard-coded px
   sizes at every breakpoint without editing design.css or mockups.css. */

/* 5. Role map
   Built from design.css, mockups.css and the other d101 stylesheets (d101-blog, d101-student, variant-checkout, d101-thankyou).
   Every selector that sets a font property is in exactly one block. Blocks marked !important replace rules that used !important. */

/* Display */
.d101 .d-hero h1,
.d101 .m-hero h1,
.d101 .m-chero h1.elementor-heading-title,
.d101 .m-home-hero h1.elementor-heading-title {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  letter-spacing: 0;
  text-transform: none;
}

/* Display, second line inside the H1 */
.d101 .d-hero h1 .d-l,
.d101 .m-home-hero h1 .d-l {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}

/* Page title (H1) */
.d101 h1,
.d101 .m-login-txt h1.elementor-heading-title,
.d101 .b-hero h1,
.d101 .s-hero h1,
.d101 .s-acct-hero h1,
body.course-item-popup #popup-content .course-item-title,
body.course-item-popup #popup-content h1,
body.page-id-10708 #t-hero h1 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  letter-spacing: 0;
  text-transform: none;
}

/* Page title (H1), !important */
body.page-id-23239 [data-id="3510ac7"] .elementor-heading-title {
  font-family: var(--d-head) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-h1) !important;
  line-height: var(--lh-h1) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Section heading (H2) */
.d101 h2.elementor-heading-title,
.d101 .m-h2-tight h2.elementor-heading-title,
.d101 .d-sec h2.elementor-heading-title,
.d101 .m-watch h2.elementor-heading-title,
.d101 .m-block h2.elementor-heading-title,
.d101 .m-form h2.elementor-heading-title,
.d101 .m-band h2.elementor-heading-title,
.d101 .m-qa h2.elementor-heading-title,
.d101 .m-intro-txt h2.elementor-heading-title,
.d101 .m-profile h2.elementor-heading-title,
.d101 .m-login-card h2.elementor-heading-title,
.d101 .i-state-t,
.d101 .i-h2,
.d101 .i-band-t,
.d101 .i-marq li,
.d101 .b-content h2,
.d101 .b-related h2,
body.course-item-popup #popup-content h2 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  letter-spacing: 0;
  text-transform: none;
}

/* Sub-section (H3) */
.d101 h3.elementor-heading-title,
.d101 .d-quote h3.elementor-heading-title,
.d101 .d-reason-txt h3.elementor-heading-title,
.d101 .d-point h3.elementor-heading-title,
.d101 .d-ask h3.elementor-heading-title,
.d101 .m-block .m-sub,
.d101 .m-block h3.elementor-heading-title,
.d101 .m-faq-side h3.elementor-heading-title,
.d101 .m-isnt-card h3,
.d101 .m-theme h3,
.d101 .m-quiz-result h3,
.d101 .m-calc h3,
.d101 .i-chap h3,
.d101 .b-content h3,
.d101 .woocommerce-MyAccount-content h2,
.d101 .woocommerce-MyAccount-content h3,
.d101 .s-acct-body legend,
body.course-item-popup #popup-content h3,
.d101 #learn-press-user-profile #profile-content h2,
.d101 #learn-press-user-profile #profile-content h3,
.d101 #learn-press-user-profile .profile-heading,
body.course-item-popup #popup-content .d101-lesson h3.dl-head,
body.page-id-23239 #c-payhead h3,
body.page-id-10708 #t-steps h2 {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}

/* Sub-section (H3), !important */
body.page-id-23239 [data-id="a7db54f"] .elementor-heading-title,
body.page-id-23239 [data-id="c0984ef"] .elementor-heading-title,
body.page-id-10708 [data-id="81db7d1"] .elementor-heading-title,
body.page-id-10708 .woocommerce-order-details__title,
body.page-id-10708 .woocommerce-column__title,
body.page-id-10708 .woocommerce-order h2 {
  font-family: var(--d-head) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Card title, FAQ question, curriculum section (H4) */
.d101 .d-card h3.elementor-heading-title,
.d101 .d-member h3.elementor-heading-title,
.d101 .d-plan h3.elementor-heading-title,
.d101 .m-learn-meta,
.d101 .m-price-name.elementor-widget h3.elementor-heading-title,
.d101 .m-price h3.elementor-heading-title,
.d101 .m-plan h3.elementor-heading-title,
.d101 .m-joe-list h4,
.d101 .d-cmp-more > summary,
.d101 .m-card footer,
.d101 .m-get b,
.d101 .m-why-card h4,
.d101 .m-tiles li,
.d101 .m-info h4,
.d101 .m-reason h4,
.d101 .m-fit b,
.d101 .m-step h4,
.d101 .m-need h4,
.d101 .m-tnav b,
.d101 .m-facts dt,
.d101 .m-policy small,
.d101 .m-story h4,
.d101 .m-login-marks b,
.d101 .m-login-new h3,
.d101 .m-steps-5 .m-step h4,
.d101 .m-res h3,
.d101 .m-swatch b,
.d101 .m-team-card h4,
.d101 .m-role h4,
.d101 .m-q legend,
.d101 .m-tool h3,
.d101 .i-pillar h3,
.d101 .i-pillars.is-5 .i-pillar h3,
.d101 .i-leader h3,
.d101 .i-guide b,
.d101 .i-card-txt b,
.d101 .i-contact b,
.d101 .b-card-title,
.d101 .b-content h4,
.d101 .b-inline-cta b,
.d101 .b-offer h3,
.d101 .s-link b,
.d101 .s-sec-t b,
.d101 .s-cur-sec summary b,
.d101 .s-card h3,
body.course-item-popup #popup-header .course-title,
body.course-item-popup #popup-header .course-title a,
body.course-item-popup #popup-sidebar .course-section-header,
body.course-item-popup #popup-sidebar .course-section__title,
body.course-item-popup #popup-content h4,
body.course-item-popup .lp-modal-header h3,
body.course-item-popup #popup-content .d101-lesson .dl-summary h3,
body.page-id-23239 .c-sum b,
body.page-id-23239 #c-access h4,
body.page-id-10708 table.shop_table tfoot tr:last-child th,
body.page-id-10708 table.shop_table tfoot tr:last-child td {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  letter-spacing: var(--ls-small);
  text-transform: none;
}

/* Card title, FAQ question, curriculum section (H4), !important */
.d101 .d-acc .e-n-accordion-item-title-text,
.d101 .d-acc .d-acc-body h1,
.d101 .d-acc .d-acc-body h2,
.d101 .d-acc .d-acc-body h3,
.d101 .d-acc .d-acc-body h4,
.d101 .m-syl .e-n-accordion-item-title-text,
body.page-id-23239 .c-total b,
body.page-id-23239 #payment ul.payment_methods li > label,
body.page-id-10708 .woocommerce-thankyou-order-received,
body.page-id-10708 .woocommerce-notice--success {
  font-family: var(--d-head) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-h4) !important;
  line-height: var(--lh-h4) !important;
  letter-spacing: var(--ls-small) !important;
  text-transform: none !important;
}

/* Lead */
.d101 .d-lead,
.d101 .d-hero-sub,
.d101 .d-hero-lead,
.d101 .d-qcar .elementor-testimonial__text,
.d101 .d-ask-txt,
.d101 .m-hero-sub,
.d101 .m-joe-q,
.d101 .m-watch-sub,
.d101 .m-band-sub,
.d101 .m-quote-big p,
.d101 .m-login-sub,
.d101 .i-band-sub,
.d101 .b-sub,
.d101 .b-content blockquote,
.d101 .s-hero-sub,
body.course-item-popup #popup-content .d101-lesson .dl-body p.dl-intro {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-lead);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Body */
body.elementor-template-canvas,
.d101,
.d101 .d-pane-txt .elementor-widget-text-editor,
.d101 .d-reason-txt .elementor-widget-text-editor,
.d101 .d-point .elementor-widget-text-editor,
.d101 .d-review-txt,
.d101 .d-acc .d-acc-body,
.d101 .m-joe-txt .elementor-widget-text-editor,
.d101 .m-cert p,
.d101 .m-block-txt,
.d101 .m-expert .elementor-widget-text-editor,
.d101 .m-intro-txt .elementor-widget-text-editor,
.d101 .m-faq-side .elementor-widget-text-editor,
.d101 .m-profile-txt .elementor-widget-text-editor,
.d101 .m-quiz-result p,
.d101 .m-how:not(.d-sec),
.d101 .i-split-txt p,
.d101 .i-chap p,
.d101.b-main,
.d101 .b-content,
.d101.s-acct-page,
body.course-item-popup #popup-content p,
body.course-item-popup #popup-content li,
body.course-item-popup #popup-content .d101-lesson .dl-body p,
body.course-item-popup #popup-content .d101-lesson .dl-body li,
body.course-item-popup #popup-content .d101-lesson .dl-callout p:first-child,
body.page-id-10708 #t-hero p {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: 0;
  text-transform: none;
}

/* Body, bold */
.d101 .m-policy b {
  font-family: var(--d-body);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: 0;
  text-transform: none;
}

/* Small */
.d101 .d-rate,
.d101 .d-cta-note,
.d101 .d-pills .elementor-icon-list-item,
.d101 .d-cmp-price span,
.d101 .d-stat-l,
.d101 .d-plan-price small,
.d101 .d-plan-note,
.d101 .d-guarantee,
.d101 .d-faq-sub,
.d101 .d-ftr-row,
.d101 .d-card .elementor-widget-text-editor,
.d101 .d-member .elementor-widget-text-editor,
.d101 .m-proof,
.d101 .m-glance span,
.d101 .m-lessons,
.d101 .m-price-val small,
.d101 .m-feats,
.d101 .m-price-alt,
.d101 .m-hfeats li,
.d101 .m-rev-head,
.d101 .m-hpills li,
.d101 .m-joe-ph,
.d101 .m-joe-list p,
.d101 .m-card p,
.d101 .m-rating small,
.d101 .m-get li,
.d101 .m-why-card p,
.d101 .m-info p,
.d101 .m-form-intro,
.d101 .m-reason p,
.d101 .m-badge span,
.d101 .m-offer-price span,
.d101 .m-fit span,
.d101 .m-step p,
.d101 .m-need p,
.d101 .m-need ul,
.d101 .m-tnav span,
.d101 .m-facts dd,
.d101 .m-dtable > div > *,
.d101 .m-story dl,
.d101 .m-story p,
.d101 .d-ftr-tag,
.d101 .d-ftr-col ul,
.d101 .d-ftr-contact ul,
.d101 .m-login-marks span,
.d101 .m-login-form .elementor-remember-me,
.d101 .m-login-form .elementor-field-type-checkbox,
.d101 .m-login-form label[for^="elementor-login-remember"],
.d101 .m-login-form .elementor-field-type-checkbox label,
.d101 .m-login-new ol,
.d101 .m-login-form .elementor-remember-me label,
.d101 .m-help-none,
.d101 .m-res li,
.d101 .m-res p,
.d101 .m-logo-card figcaption,
.d101 .m-swatch span,
.d101 .m-team-card p:not(.m-team-role),
.d101 .m-role p,
.d101 .m-result span,
.d101 .m-cstat span,
.d101 .m-tool p,
.d101 .m-orow span,
.d101 .i-fig span,
.d101 .i-ol li,
.d101 .i-pillar p,
.d101 .i-leader-txt p:not(.i-role),
.d101 .i-card-txt span,
.d101 .i-contact p,
.d101 .b-meta,
.d101 .b-chips a,
.d101 .b-card-ex,
.d101 .b-content table,
.d101 .b-tags a,
.d101 .b-inline-cta span,
.d101 .b-offer > p,
.d101 .b-offer-price span,
.d101 .s-up,
.d101 .s-link span,
.d101 .s-it,
.d101 .s-card p,
.d101 .s-parts li,
.d101 .s-check,
.d101 .s-ok,
.d101 .s-err,
.d101 .s-asked,
.d101 .s-cert-note,
.d101 .s-acct-body p,
.d101 .s-acct-body table td,
.d101 .s-acct-body .woocommerce-message,
.d101 .s-acct-body .woocommerce-info,
.d101 .s-acct-body .woocommerce-error,
body.course-item-popup #popup-header .items-progress,
body.course-item-popup #popup-header .items-completed,
body.course-item-popup #popup-sidebar .course-item-title,
body.course-item-popup #popup-content td,
.d101 #learn-press-user-profile table td,
body.course-item-popup #popup-content .d101-lesson .dl-summary li,
body.page-id-23239 .c-sum span,
body.page-id-23239 .c-sum-price,
body.page-id-23239 #c-access li,
body.page-id-10708 #t-steps li,
body.page-id-10708 #t-steps li + li,
body.page-id-10708 .t-help,
body.page-id-10708 table.shop_table th,
body.page-id-10708 table.shop_table td {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Small, !important */
body.page-id-23239 [data-id="cb07422"] .elementor-widget-text-editor,
body.page-id-23239 [data-id="cb07422"] .elementor-widget-text-editor * {
  font-family: var(--d-body) !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-size: var(--fs-small) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Small, bold */
.d101 .d-qcar .elementor-testimonial__name,
.d101 .d-cmp-row,
.d101 .m-joe-q cite,
.d101 .m-form label,
.d101 .m-quote-big cite,
.d101 .m-login-form label.elementor-field-label,
.d101 .m-login-form .elementor-lost-password,
.d101 .d-nav .elementor-nav-menu--main .sub-menu a.elementor-sub-item,
.d101 .d-nav .elementor-nav-menu--dropdown .sub-menu a,
.d101 .m-q-opts button,
.d101 .m-share span,
.d101 .m-field span,
.d101 .i-split-txt p.i-cite,
.d101 .i-list li,
.d101 .i-band-cite,
.d101 .i-go,
.d101 .b-content th,
.d101 .s-top li a,
.d101 .s-form label > span,
.d101 .s-acct-body label,
body.course-item-popup #popup-sidebar .course-item.current .course-item-title,
body.course-item-popup .course-item-nav .prev a,
body.course-item-popup .course-item-nav .next a,
.d101 #learn-press-user-profile .form-field label,
body.course-item-popup #popup-content .d101-lesson a.dl-file {
  font-family: var(--d-body);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Small, bold, !important */
body.page-id-23239 form.checkout .form-row > label,
body.page-id-23239 form.checkout .form-row label,
body.page-id-23239 #payment .form-row label {
  font-family: var(--d-body) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-small) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Caption (14px) */
.d101 .d-qcar .elementor-testimonial__title,
.d101 .d-ftr-row nav a,
.d101 .d-ftr-legal,
.d101 .m-price-sure,
.d101 .m-note,
.d101 .m-disclaimer,
.d101 .m-stick span,
.d101 .m-offer-ends small,
.d101 .m-offer-foot,
.d101 .m-home-hero .m-offer-foot,
.d101 .m-draftnote,
.d101 .m-story small,
.d101 .d-ftr-marks,
.d101 .m-quiz-result .m-note,
.d101 .m-calc-tip,
.d101 .m-field small,
.d101 .m-calc-note,
.d101 .i-figs-note,
.d101 .b-crumbs,
.d101 .b-card-meta,
.d101 .b-content figcaption,
.d101 .b-offer-small,
.d101 .s-sec-t small,
.d101 .s-cur-sec summary small,
.d101 .s-cur-sec li small,
.d101 .s-bar span,
.d101 .s-top li small,
.d101 .s-note,
.d101 .s-help,
body.page-id-23239 .c-help,
body.page-id-23239 #c-payhead p,
body.page-id-23239 #c-helpline {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-caption);
  line-height: var(--lh-text);
  letter-spacing: var(--ls-small);
  text-transform: none;
}

/* Caption (14px), !important */
body.page-id-23239 .c-total small,
body.page-id-23239 [data-id="73d7f3d"],
body.page-id-23239 [data-id="73d7f3d"] *,
body.page-id-23239 [data-id="b949669"] a,
body.page-id-23239 #c-email-help {
  font-family: var(--d-body) !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-size: var(--fs-caption) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: var(--ls-small) !important;
  text-transform: none !important;
}

/* Caption (14px), bold */
.d101 .m-policy .m-need-inline,
.d101 .d-ftr-more,
body.course-item-popup #popup-content .d101-lesson .dl-meta span,
body.page-id-23239 .c-stagenote {
  font-family: var(--d-body);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-caption);
  line-height: var(--lh-text);
  letter-spacing: var(--ls-small);
  text-transform: none;
}

/* Caption (14px), bold, !important */
body.page-id-23239 [data-id="64374af"],
body.page-id-23239 [data-id="afd58b6"] {
  font-family: var(--d-body) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-caption) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: var(--ls-small) !important;
  text-transform: none !important;
}

/* Button */
.d101 .d-btn .elementor-button,
.d101 .d-btn-o .elementor-button,
.d101 .d-btn-sm .elementor-button,
.d101 .d-btn-plan .elementor-button,
.d101 .d-center .d-btn .elementor-button,
.d101 .m-btn-w .elementor-button,
.d101 .m-btn-b .elementor-button,
.d101 .m-price .d-btn .elementor-button,
.d101 .m-card-video .elementor-custom-embed-image-overlay::after,
.d101 .m-plan .d-btn .elementor-button,
.d101 .m-form input[type=submit],
.d101 .m-form button[type=submit],
.d101 .m-btns .elementor-button,
.d101 .m-stick a,
.d101 .m-more,
.d101 .m-login-form button.elementor-button,
.d101 .m-qbtn,
.d101 .m-share button,
.d101 .m-tool-go,
.d101 .b-search button,
.d101 .b-btn,
.d101 .s-btn,
.d101 .s-acct-body .button,
.d101 .s-acct-body button[type="submit"],
body.course-item-popup .lp-button,
body.course-item-popup .lp-button.button-complete-lesson,
body.course-item-popup .lp-modal-footer .lp-button,
.d101 #learn-press-user-profile .lp-button,
.d101 #learn-press-user-profile button[type="submit"],
.d101 #learn-press-user-profile input[type="submit"],
.d101 .m-form input[type="submit"],
.d101 .m-form button[type="submit"] {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-button);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}

/* Button, !important */
body.page-id-23239 #place_order,
body.page-id-10708 [data-id="e98ac19"] .elementor-button {
  font-family: var(--d-head) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-button) !important;
  line-height: var(--lh-tight) !important;
  letter-spacing: var(--ls-caps) !important;
  text-transform: uppercase !important;
}

/* Button with a label over four words: sentence case. On the Course page this also keeps "Unlimited" and "per Month" exactly as typed, which the Facebook purchase-value tags read from the button text */
.d101:has(.m-cpage) a.elementor-button[href*="add-to-cart"] {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-button);
  line-height: var(--lh-tight);
  letter-spacing: 0;
  text-transform: none;
  text-transform: none !important;
}

/* Navigation, tabs */
.d101 .d-nav .elementor-nav-menu--main a.elementor-item,
.d101 .d-hdr-links a,
.d101 .d-ftr-nav a,
.d101 .d-nav .elementor-nav-menu--dropdown a,
.d101 .m-anchors a,
.d101 .d-hdr-links a.d-login,
.d101 .d-hdr-links a.d-logout,
.d101 .i-link,
.d101 .b-pages .page-numbers,
.d101 .s-back,
.d101 .woocommerce-MyAccount-navigation li a,
.d101 #learn-press-user-profile .lp-profile-nav-tabs > li > a,
.d101 #learn-press-user-profile .lp-profile-nav-tabs li ul a,
.d101 #learn-press-user-profile .profile-tab-sections a,
.d101 #learn-press-user-profile .learn-press-tabs__nav a,
.d101 #learn-press-user-profile .learn-press-tabs__nav label {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-nav);
  line-height: 1.2;
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}

/* Navigation, tabs, !important */
.d101 .d-tabs .e-n-tab-title,
.d101 .d-nav .elementor-nav-menu--dropdown li.menu-call-button > a,
.d101 .d-nav .elementor-nav-menu--dropdown li.menu-call-button > a:hover {
  font-family: var(--d-head) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-nav) !important;
  line-height: 1.2 !important;
  letter-spacing: var(--ls-caps) !important;
  text-transform: uppercase !important;
}

/* Price */
.d101 .d-cmp-price b,
.d101 .d-plan-price .elementor-heading-title,
.d101 .m-price-val .elementor-heading-title,
.d101 .m-stick b,
.d101 .m-offer-price strong,
.d101 .m-price .m-offer-price strong,
.d101 .b-offer-price b,
body.page-id-23239 .c-sum span strong,
body.page-id-23239 .c-sum-price strong {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-price);
  line-height: var(--lh-tight);
  letter-spacing: 0;
  text-transform: none;
}

/* Price, !important */
body.page-id-23239 .c-total strong {
  font-family: var(--d-head) !important;
  font-weight: 800 !important;
  font-style: normal !important;
  font-size: var(--fs-price) !important;
  line-height: var(--lh-tight) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Old price */
.d101 .m-offer-price s,
.d101 .m-price-val s,
.d101 .m-stick b s,
.d101 .b-offer-price s,
body.page-id-23239 .c-sum-price s {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  letter-spacing: 0;
  text-transform: none;
  text-decoration: line-through;
}

/* Key figure, big */
.d101 .d-stat-v .elementor-heading-title,
.d101 .m-rating-big,
.d101 .m-badge b,
.d101 .m-story-n,
.d101 .m-result b,
.d101 .m-cstat b,
.d101 .i-fig b,
.d101 .s-tile b {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-price);
  line-height: var(--lh-tight);
  letter-spacing: 0;
  text-transform: none;
}

/* Key figure, row */
.d101 .d-perks b,
.d101 .m-proof b,
.d101 .m-glance b,
.d101 .m-rev-head b,
.d101 .m-rating b,
.d101 .s-prog-row b {
  font-family: var(--d-head);
  font-weight: 800;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}

/* Eyebrow, label, table header */
.d101 .d-perks span,
.d101 .d-mini,
.d101 .d-plan-tag .elementor-heading-title,
.d101 .d-who b,
.d101 .d-cmp-head,
.d101 .d-cta-note p,
.d101 .m-eyebrow,
.d101 .m-price-tag .elementor-heading-title,
.d101 .m-offer-price em,
.d101 .m-price-val em,
.d101 .m-plan-clock > span,
.d101 .m-home-hero .m-eyebrow,
.d101 .m-chero .m-eyebrow,
.d101 .m-need-tag,
.d101 .m-dtable > div:first-child > *,
.d101 .d-ftr-col h4,
.d101 .m-login-txt .m-eyebrow,
.d101 .m-team-role,
.d101 .m-quiz-count,
.d101 .i-chap-k,
.d101 .i-role,
.d101 .i-tag,
.d101 .b-eyebrow,
.d101 .b-card-cat,
.d101 .b-offer-tag,
.d101 .s-cur-sec li em,
.d101 .s-tile span,
.d101 .s-acct-body table th,
.d101 #learn-press-user-profile table th,
body.course-item-popup #popup-content .d101-lesson a.dl-file::before,
body.page-id-23239 .c-sum-price em,
body.page-id-23239 .c-offer-tag,
body.page-id-23239 #c-secure,
body.page-id-23239 #c-steps li {
  font-family: var(--d-mono);
  font-weight: 500;
  font-style: normal;
  font-size: var(--fs-eyebrow);
  line-height: var(--lh-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
}

/* Eyebrow, label, table header, !important */
body.page-id-10708 ul.woocommerce-order-overview li {
  font-family: var(--d-mono) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: var(--fs-eyebrow) !important;
  line-height: var(--lh-label) !important;
  letter-spacing: var(--ls-label) !important;
  text-transform: uppercase !important;
}

/* Data */
.d101 .m-stick span i,
.d101 .m-share code {
  font-family: var(--d-mono);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Data, 500 */
.d101 .d-ftr-contact a[href^="tel"] {
  font-family: var(--d-mono);
  font-weight: 500;
  font-style: normal;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Data, key figures 700 */
.d101 .m-clock b,
body.page-id-23239 .c-clock b,
body.page-id-10708 ul.woocommerce-order-overview li strong {
  font-family: var(--d-mono);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Data, calculator inputs */
.d101 .m-field input {
  font-family: var(--d-mono);
  font-weight: 500;
  font-style: normal;
  font-size: var(--fs-body);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Data at H4 size */
.d101 .m-orow b {
  font-family: var(--d-mono);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  letter-spacing: 0;
  text-transform: none;
}

/* Data at H3 size */
.d101 .m-orow.is-big b {
  font-family: var(--d-mono);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  letter-spacing: 0;
  text-transform: none;
}

/* Step and list numbers */
.d101 .m-syl .e-n-accordion-item::before,
.d101 .m-tiles li::before,
.d101 .m-step::before,
.d101 .m-login-new li::before,
.d101 .m-q legend span,
.d101 .i-ol li::before,
.d101 .i-num,
.d101 .s-sec-n,
body.course-item-popup #popup-content .d101-lesson ol.dl-list > li::marker,
body.page-id-23239 #c-steps li::before,
body.page-id-23239 .c-num,
body.page-id-10708 #t-steps li::before {
  font-family: var(--d-mono);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Form inputs (16px, so iOS does not zoom) */
.d101 .m-form input[type=text],
.d101 .m-form input[type=email],
.d101 .m-form input[type=tel],
.d101 .m-form textarea,
.d101 .m-form select,
.d101 .m-login-form input.elementor-field,
.d101 .b-search input,
.d101 .s-form input[type="text"],
.d101 .s-form input[type="email"],
.d101 .s-form textarea,
.d101 .s-acct-body .input-text,
.d101 .s-acct-body input[type="text"],
.d101 .s-acct-body input[type="email"],
.d101 .s-acct-body input[type="password"],
.d101 .s-acct-body input[type="tel"],
.d101 .s-acct-body select,
.d101 .s-acct-body textarea,
body.course-item-popup #popup-sidebar input[type="search"],
body.course-item-popup #popup-sidebar input[type="text"],
.d101 #learn-press-user-profile input[type="text"],
.d101 #learn-press-user-profile input[type="email"],
.d101 #learn-press-user-profile input[type="password"],
.d101 #learn-press-user-profile textarea,
.d101 #learn-press-user-profile select {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: 1rem;
  line-height: 1.375;
  letter-spacing: 0;
  text-transform: none;
}

/* Search input */
.d101 .m-help-search input {
  font-family: var(--d-body);
  font-weight: 400;
  font-style: normal;
  font-size: var(--fs-body);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}

/* Form inputs, face and size only (their line height centres them), !important */
body.page-id-23239 form.checkout input.input-text,
body.page-id-23239 form.checkout input[type=text],
body.page-id-23239 form.checkout input[type=tel],
body.page-id-23239 form.checkout input[type=email],
body.page-id-23239 .select2-selection__rendered,
body.page-id-23239 .select2-results__option,
body.page-id-23239 #payment input.input-text,
body.page-id-23239 #payment input[type=tel],
body.page-id-23239 #payment input[type=text] {
  font-family: var(--d-body) !important;
  font-weight: 400 !important;
  font-size: 1rem !important;
}

/* Text face only */
body.course-item-popup,
body.course-item-popup #popup-course,
.d101 #learn-press-user-profile,
body.course-item-popup #popup-content .d101-lesson,
body.page-id-23239,
body.page-id-10708 {
  font-family: var(--d-body);
}

/* Heading face only */
body.course-item-popup #popup-header .popup-header__inner,
body.course-item-popup .lp-modal-header {
  font-family: var(--d-head);
  font-weight: 700;
}

/* Bold at 700 (600 is not a weight in this system) */
.d101 .m-info a,
.d101 .m-need-inline,
.d101 .m-facts a,
.d101 .m-help-none a,
.d101 .m-help-topic .d-acc a,
.d101 .m-res li a,
.d101 .b-content a {
  font-weight: 700;
}

/* Header "Log in" under the icon, at 1024px and below: caption, 14px (it was 11px) */
@media (max-width: 1024px) {
.d101 .d-hdr-links a.d-login {
  font-family: var(--d-body);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-caption);
  line-height: var(--lh-text);
  letter-spacing: var(--ls-small);
  text-transform: none;
}
}


/* 6. Components (brief step 4)
   Small layout changes so nothing falls under the 14px floor. Colours are the ones already used. */

/* Countdown: one line of Mono figures (02d 21h 31m 58s) in one white pill instead of four boxes with 8-10px unit words.
   The unit comes from each figure's own data-u ("d", "h", "m", "s"); the unit words stay in the page for screen readers. */
.d101 .m-clock,
.d101 .m-offer-top .m-clock,
body.page-id-23239 .c-clock {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: baseline;
  gap: .5em;
  padding: 5px 10px;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(10, 37, 64, .14);
}
.d101 .m-clock span,
.d101 .m-offer-top .m-clock span,
body.page-id-23239 .c-clock span {
  display: inline;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
.d101 .m-clock b,
body.page-id-23239 .c-clock b {
  font-family: var(--d-mono);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
  color: var(--d-navy, #0a2540);
  font-variant-numeric: tabular-nums;
}
.d101 .m-clock b::after,
body.page-id-23239 .c-clock b::after {
  content: attr(data-u);
  font-weight: 500;
}

/* The red parts keep their original look (owner, 6 Nov 2026: "the red part is taking too much space... Maybe original font
   and size there?"). Original sizes, in Barlow Condensed because Akrobat goes with the new system. The countdown in the offer
   box's red strip stays one line, so it sits beside "Limited time offer" again. */
.d101 .m-offer-top .m-clock {
  gap: .35em;
  padding: 3px 8px;
}
.d101 .m-offer-top .m-clock b {
  font-family: var(--d-head);
  font-weight: 800;
  font-size: 20px;
  line-height: 22px;
  letter-spacing: 0;
}
.d101 .m-offer-top .m-clock b::after {
  font-weight: 700;
}
.d101 .m-tb-price s {
  font-weight: 700;
}
@media (max-width: 767px) {
  .d101 .m-offer-top .m-clock b {
    font-size: 17px;
    line-height: 19px;
  }
}

/* Course page headline on phones: one size down (H1, 36px) with the same words (owner, 6 Nov 2026: "2 smaller on phone").
   At the display size it took 4 lines and pushed the offer box down 104px. Only the course page uses this hero. */
@media (max-width: 767px) {
  .d101 .m-chero h1.elementor-heading-title {
    font-size: var(--fs-h1);
    line-height: var(--lh-h1);
  }
  /* The same choice for the two other headlines that took 4 lines on phones: Benefits (page 39906) and Free lesson (39911). */
  body:is(.page-id-39906, .page-id-39911) .d101 .m-hero h1.elementor-heading-title {
    font-size: var(--fs-h1);
    line-height: var(--lh-h1);
  }
}
/* The struck-out old price in the red bar was pink at 82% opacity on red (3.55:1). Plain white passes (4.6:1). */
.d101 .m-tb-price s {
  opacity: 1;
  color: #fff;
}

/* The short rule before a hero's label is 26px; 16px on phones keeps a four-word label on one line. */
@media (max-width: 767px) {
  .d101 :is(.m-chero, .m-home-hero, .d-hero, .m-hero) .m-eyebrow {
    gap: 8px;
  }
  .d101 :is(.m-chero, .m-home-hero, .d-hero, .m-hero) .m-eyebrow::before {
    flex-basis: 16px;
  }
}
.d101 .m-clock i,
.d101 .m-offer-top .m-clock i,
body.page-id-23239 .c-clock i {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Comparison table headers on phones: the course columns are 66-68px wide and the names are up to 90px in 14px Mono capitals,
   so they spilled into each other. Below 768px the header row uses Small 700 as typed ("Logistics" is 63px), the brief's own
   fallback for a label that can't be an eyebrow. From 768px the columns are 135px and the headers stay eyebrows. */
@media (max-width: 767px) {
  .d101 .d-cmp-head,
  .d101 .d-cmp-head > * {
    font-family: var(--d-body);
    font-weight: 700;
    font-size: var(--fs-small);
    line-height: var(--lh-text);
    letter-spacing: 0;
    text-transform: none;
  }
}

/* Bold and italic everywhere. The theme sets b and strong to 600, a weight this system doesn't use, so they become 700.
   Bold italic isn't loaded (Atkinson italic is 400 only), so bold inside italic, or italic inside bold, stays upright. */
html body :is(b, strong) {
  font-weight: 700;
}
html body :is(em, i) :is(b, strong),
html body :is(b, strong) :is(em, i) {
  font-style: normal;
}

/* Lesson player (LearnPress): parts LearnPress styles by id, which the role map's selectors can't reach. */
body.course-item-popup #popup-content .lp-button,
body.course-item-popup #popup-content #lp-button {
  font-family: var(--d-head);
  font-weight: 700;
  font-style: normal;
  font-size: var(--fs-button);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding-block: 0;
}
@media (max-width: 767px) {
  body.course-item-popup #popup-content .lp-button,
  body.course-item-popup #popup-content #lp-button {
    min-height: 48px;
  }
}
body.course-item-popup #popup-sidebar .section-count-items {
  font-family: var(--d-mono);
  font-weight: 400;
  font-size: var(--fs-data);
  line-height: var(--lh-text);
  letter-spacing: 0;
}
body.course-item-popup #popup-header .items-progress .number {
  font-family: var(--d-body);
  font-weight: 400;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
}
/* Lesson lengths in the lesson list were #8a8a8a on white (3.45:1). The site's muted grey passes (6.4:1). */
body.course-item-popup .course-item__right .duration,
.lp-course-curriculum .course-item .duration {
  color: #5b626c;
}

/* Header phone number: the child theme forces it to 14px regular with !important. Phone numbers are data (Mono 500). */
html body .d101 .d-nav li.menu-call-button > a.elementor-item,
html body .d101 .d-nav li.menu-call-button > a {
  font-family: var(--d-mono) !important;
  font-weight: 500 !important;
  font-size: var(--fs-data) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Measure: long text stops at 640px on wide screens, 60-75 characters a line. Boxes, images and videos keep their width. */
.d101 .d-ftr-legal p,
.d101 .d-acc .d-acc-body > :is(p, ul, ol, blockquote),
.d101 .b-content > :is(p, ul, ol, blockquote),
body.course-item-popup #popup-content .d101-lesson .dl-body > :is(p, ul, ol, blockquote) {
  max-width: var(--measure);
}

/* Offer bar at the top: original sizes and one line (see "The red parts" above). Its countdown never wraps. */
.d101 .m-tb-clock {
  white-space: nowrap;
}

/* Labels over four words go in sentence case (brief, section 2). A short script in the preview marks them with .d-t-long,
   because CSS can't count words. Buttons keep the button face; eyebrows and text links become Small 700. */
.d101 .d-t-long,
.d101 .d-t-long .elementor-button-text {
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.d101 :is(.m-eyebrow, .b-eyebrow, .i-link, .i-chap-k, .i-tag, .i-role, .m-need-tag, .m-offer-tag, .b-card-cat, .s-back).d-t-long {
  font-family: var(--d-body) !important;
  font-weight: 700 !important;
  font-size: var(--fs-small) !important;
  line-height: var(--lh-text) !important;
}

/* Elementor's kit makes everything inside a form inherit the form's size with !important, so the form roles need it too. */
.d101 .m-login-form label.elementor-field-label,
.d101 .m-login-form .elementor-lost-password,
.d101 .m-form label {
  font-size: var(--fs-small) !important;
}
.d101 .m-login-form .elementor-remember-me,
.d101 .m-login-form .elementor-field-type-checkbox,
.d101 .m-login-form .elementor-field-type-checkbox label,
.d101 .m-login-form label[for^="elementor-login-remember"] {
  font-size: var(--fs-small) !important;
}
.d101 .m-login-form input.elementor-field,
.d101 .m-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea, select) {
  font-size: 1rem !important;
}
.d101 .m-login-form button.elementor-button,
.d101 .m-form :is(input[type="submit"], button[type="submit"]) {
  font-size: var(--fs-button) !important;
}

/* Long unbroken values such as email addresses and web addresses wrap inside their column instead of running past it. */
.d101 .m-facts dd,
.d101 .m-policy b {
  overflow-wrap: anywhere;
}
body.course-item-popup #popup-content .d101-lesson .dl-body :is(p, li) {
  overflow-wrap: break-word;
}
/* Calculator results: a long value ("1 day 8 h 49 min") wraps under its label instead of being cut off. */
.d101 .m-orow b {
  white-space: normal;
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Inputs. The kit's "input:not([type=button]):not([type=submit])" outranks one class, and sets 18px. Doubling .d101 puts
   these back on top without !important. */
.d101.d101 .m-field input {
  font-family: var(--d-mono);
  font-weight: 500;
  font-size: var(--fs-body);
  line-height: var(--lh-text);
  letter-spacing: 0;
}
.d101.d101 .m-help-search input {
  font-family: var(--d-body);
  font-weight: 400;
  font-size: var(--fs-body);
  line-height: var(--lh-text);
  letter-spacing: 0;
}
.d101.d101 .b-search input,
.d101.d101 .s-form :is(input[type="text"], input[type="email"], textarea),
.d101.d101 .s-acct-body :is(.input-text, input[type="text"], input[type="email"], input[type="password"], input[type="tel"], select, textarea),
.d101.d101 #learn-press-user-profile :is(input[type="text"], input[type="email"], input[type="password"], select, textarea) {
  font-family: var(--d-body);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.375;
  letter-spacing: 0;
}

/* Blog page numbers: the theme forces 800 on every .page-numbers with !important; navigation is 700. */
.d101.d101 .b-pages .page-numbers {
  font-weight: 700 !important;
}

/* Measure on the calculator pages' "how it works" text. */
.d101 .m-how:not(.d-sec) > p {
  max-width: var(--measure);
}

/* Measure for Elementor text blocks: paragraphs and lists stop at 640px. */
.d101 .elementor-widget-text-editor :is(p, ul, ol) {
  max-width: var(--measure);
}

/* Sticky buy bar (phones): price in the price role, link in the button role, its second line at 14px.
   The page keeps room at the bottom so the bar never covers the last content. */
/* At 40px for the price and 14px for the line under it, that line wrapped beside the button and the bar grew to about 98px.
   So the price and the button share the first row (48px, the button's height) and the line runs the full width under them:
   48 + 21 + 10px padding = 79px. */
@media (max-width: 767px) {
  .d101 .m-stick {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 10px;
    row-gap: 0;
    padding-block: 5px calc(5px + env(safe-area-inset-bottom));
  }
  .d101 .m-stick > div {
    display: contents;
  }
  .d101 .m-stick b {
    grid-column: 1;
    grid-row: 1;
    white-space: nowrap;
  }
  .d101 .m-stick a {
    grid-column: 2;
    grid-row: 1;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
  }
  .d101 .m-stick span {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  body:has(.d101 .m-stick) {
    padding-bottom: calc(80px + env(safe-area-inset-bottom));
  }
}


/* 7. Pages outside the d101 layer (brief step 6)
   The Elementor kit, MaxCoach (Kirki) and the child theme are site-wide settings, so they can't sit behind the ?d101type=1 preview.
   While the preview runs, these rules do the same job from this file. At go-live the kit gets the same values in Site Settings,
   and these rules then only repeat them. "html" in front lifts them over the kit's own CSS wherever that loads. */

/* Kit 22906, global fonts: Primary Barlow 700, Secondary Barlow 800, Text Atkinson Next 400, Accent Atkinson Mono 500.
   Custom typographies fa81686 (menu) and 1824543 (buttons) as the brief sets them. Sizes of the other globals stay. */
html body.elementor-kit-22906 {
  --e-global-typography-primary-font-family: "Barlow Condensed";
  --e-global-typography-primary-font-weight: 700;
  --e-global-typography-secondary-font-family: "Barlow Condensed";
  --e-global-typography-secondary-font-weight: 800;
  --e-global-typography-text-font-family: "Atkinson Hyperlegible Next";
  --e-global-typography-text-font-weight: 400;
  --e-global-typography-accent-font-family: "Atkinson Hyperlegible Mono";
  --e-global-typography-accent-font-weight: 500;
  --e-global-typography-fa81686-font-family: "Barlow Condensed";
  --e-global-typography-fa81686-font-weight: 700;
  --e-global-typography-fa81686-font-size: 17px;
  --e-global-typography-fa81686-text-transform: uppercase;
  --e-global-typography-fa81686-letter-spacing: 0.05em;
  --e-global-typography-1824543-font-family: "Barlow Condensed";
  --e-global-typography-1824543-font-weight: 700;
  --e-global-typography-1824543-font-size: 18px;
  --e-global-typography-1824543-line-height: 1;
  --e-global-typography-1824543-text-transform: uppercase;
  --e-global-typography-1824543-letter-spacing: 0.05em;
  --e-global-typography-0622fed-font-family: "Atkinson Hyperlegible Next";
  --e-global-typography-0663f2e-font-family: "Barlow Condensed";
  font-family: var(--d-body);
  font-synthesis: none;
}
@media (max-width: 767px) {
  html body.elementor-kit-22906 {
    --e-global-typography-1824543-font-size: 17px;
  }
}

/* The kit's body font (Futura PT), its form fields and its button typography. :where() keeps these below every d101 rule. */
html body.elementor-kit-22906 :where(input:not([type="button"], [type="submit"]), textarea, select, .elementor-field-textual) {
  font-family: var(--d-body);
}
html body.elementor-kit-22906 :where(button, input[type="button"], input[type="submit"], .elementor-button) {
  font-family: var(--d-head);
  font-weight: 700;
}

/* The old header and footer (Elementor templates 22762 and 22760). Their menus take only size, weight and line height from
   the kit's menu typography (fa81686), so face, capitals and spacing are set here; at go-live the kit carries them too.
   The header button uses the kit's "Text 14px" typography and wrapped onto two lines; it takes the button role.
   ":not(#d101)" lifts these over Elementor's per-widget rules without !important. */
html body :is(.elementor-22762, .elementor-22760) .elementor-nav-menu .elementor-item:not(#d101) {
  font-family: var(--d-head);
  font-weight: 700;
  font-size: var(--fs-nav);
  line-height: 1.2;
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}
html body :is(.elementor-22762, .elementor-22760) .elementor-nav-menu--dropdown .sub-menu .elementor-sub-item:not(#d101),
html body :is(.elementor-22762, .elementor-22760) .elementor-nav-menu--main .sub-menu .elementor-sub-item:not(#d101) {
  font-family: var(--d-body);
  font-weight: 700;
  font-size: var(--fs-small);
  line-height: var(--lh-text);
  letter-spacing: 0;
  text-transform: none;
}
html body :is(.elementor-22762, .elementor-22760) .elementor-button:not(#d101) {
  font-family: var(--d-head);
  font-weight: 700;
  font-size: var(--fs-button);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  white-space: nowrap;
}

/* The kit's custom CSS: the "#page h1 ..." rule, from "Open Sans" to the heading face. */
html #page h1, html #page h2, html #page h3, html #page h4, html #page h5, html #page h6, html #page th,
html #page [class*="hint--"]:after, html #page .heading, html #page .heading-typography,
html #page .answer-options .answer-option .option-title .option-title-content,
html #page .elementor-accordion .elementor-tab-title a, html #page .elementor-counter .elementor-counter-title,
html #page .entry-event-info .meta-label, html #page .entry-course-info .meta-label {
  font-family: var(--d-head);
}

/* Tooltips ("Close", "Print", "Share" on the compare plugin's bar, outside #page): the theme sets them in Poppins 600, so
   Poppins was still downloaded. */
html body [class*="hint--"]::after {
  font-family: var(--d-body);
  font-weight: 700;
}

/* MaxCoach (Kirki) declares Poppins for body text, headings, buttons and the menu, directly and through its own variables. */
html {
  --maxcoach-typography-body-font-family: "Atkinson Hyperlegible Next";
  --maxcoach-typography-headings-font-family: "Barlow Condensed";
  --maxcoach-typography-headings-font-weight: 700;
}
html body {
  font-family: var(--d-body);
}
html body :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--d-head);
}
html body .header-03 .menu--primary > ul > li > a {
  font-family: var(--d-head);
  font-weight: 700;
}
/* The kit makes h1-h6 600, which this system doesn't load, and links inside headings 400. */
html #page :is(h1, h2, h3, h4, h5, h6) {
  font-weight: 700;
}
html #page :is(h1, h2, h3, h4, h5, h6) a,
html body .d101 :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title) a {
  font-weight: inherit;
}
/* Theme "modern heading" kickers (the grey "Acknowledgment" over a heading on Terms): an eyebrow, and dark enough to read
   (it was #9f9db0 on white, 2.65:1). */
html #page .tm-modern-heading .heading-secondary {
  font-family: var(--d-mono);
  font-weight: 500;
  font-size: var(--fs-eyebrow);
  line-height: var(--lh-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: #5b626c;
}
/* Paragraphs in old page content that carry their own font in a style attribute (Futura on Terms). */
html body :is(p, li, td, span, div, a, strong, em, b)[style*="font-family"] {
  font-family: var(--d-body) !important;
}
html body :is(h1, h2, h3, h4, h5, h6)[style*="font-family"] {
  font-family: var(--d-head) !important;
}
/* Line length on the old pages' text blocks, as on the d101 pages. */
html #page .elementor-widget-text-editor :is(p, ul, ol) {
  max-width: var(--measure);
}

/* WooCommerce notification pop-up ("Someone in ... purchased", "... people seeing this"): Helvetica at 10-14px before.
   Message and time as captions (14px), the course name in small bold. The plugin styles it by id, so these use !important. */
html body #message-purchased,
html body #message-purchased p.wn-notification-message-container,
html body #message-purchased small {
  font-family: var(--d-body) !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-size: var(--fs-caption) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: var(--ls-small) !important;
}
html body #message-purchased p.wn-notification-message-container,
html body #message-purchased p.wn-notification-message-container * {
  white-space: normal !important;
  overflow-wrap: anywhere;
}
html body #message-purchased a.wn-popup-product-title-with-link,
html body #message-purchased a {
  font-family: var(--d-body) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: var(--fs-small) !important;
  line-height: var(--lh-text) !important;
  letter-spacing: 0 !important;
}

/* The checkout and thank-you stylesheets name Akrobat and Open Sans through their own variables. */
body.page-id-23239 {
  --c-head: var(--d-head);
  --c-body: var(--d-body);
}
body.page-id-10708 {
  --t-head: var(--d-head);
  --t-body: var(--d-body);
}

/* Child theme: the checkout's country and state fields were set to plain sans-serif. */
html body .elementor-widget-woocommerce-checkout-page .woocommerce #customer_details .form-row .select2-container--default .select2-selection__rendered {
  font-family: var(--d-body);
}