/*
 * Yuvau Digital — Global Display Heading System v1
 * Purpose: keep the site's oversized editorial headings while preventing
 * awkward one/two-word stacking, over-wide lines and mobile overflow.
 * Loaded last by enqueue.php so this layer normalizes page-specific display rules.
 */

:root{
  --yu-heading-xl: clamp(2.75rem, 5.2vw, 5.6rem);
  --yu-heading-lg: clamp(2.3rem, 4.25vw, 4.55rem);
  --yu-heading-md: clamp(1.85rem, 3.2vw, 3.35rem);
  --yu-heading-line: 1.04;
  --yu-heading-tight: -0.027em;
}

/* Baseline safety. Do not add artificial word spacing: it makes large
 * display headings look fragmented and worsens wrapping at narrow widths. */
h1,h2,h3,h4,h5,h6{
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

/* Shared major-display targets across the site's custom page systems. */
.yu-homepage .yu-home-hero__title--live,
.yu-homepage .yu-home-why-v2__top h2,
.yu-homepage .yu-home-services__header h2,
.yu-homepage .yu-home-results__intro h2,
.yu-homepage .yu-home-faq__intro h2,
.yu-homepage .yu-home-final-cta__copy h2,
.yu-google-page .yg-hero__copy h1,
.yu-google-page .yg-head h2,
.yu-google-page .yg-editorial h2,
.yu-google-page .yg-signature__copy h2,
.yu-google-page .yg-measurement h2,
.yu-google-page .yg-why h2,
.yu-google-page .yg-final__card h2,
.yu-meta-page .yu-meta-hero h1,
.yu-meta-page .yu-meta-copy-block h2,
.yu-meta-page .yu-meta-section-head h2,
.yu-meta-page .yu-meta-final h2,
.yu-meta-page .yu-meta-proof h2,
.ywd-page .ywd-hero h1,
.ywd-page .ywd-heading h2,
.ywd-page .ywd-two-col h2,
.ywd-page .ywd-proof-card h2,
.ywd-page .ywd-final-card h2,
.yseo-page .yseo-hero__copy h1,
.yseo-page .yseo-heading h2,
.yseo-page .yseo-simple h2,
.yseo-page .yseo-why__grid h2,
.yseo-page .yseo-final-card h2,
.yff-page .yff-hero__copy h1,
.yff-page .yff-heading h2,
.yff-page .yff-final-card h2,
.yu-sm-page .ys-hero__copy h1,
.yu-sm-page .ys-section-head h2,
.yu-sm-page .ys-two-col h2,
.yu-sm-page .ys-final-card h2,
.ywm27-page .ywm-hero__copy h1,
.ywm27-page .ywm-section-head h2,
.ywm27-page .ywm-story__copy h2,
.ywm27-page .ywm-final h2,
.yu-wa-page .yw-wa-hero__copy h1,
.yu-wa-page .yw-headline h2,
.yu-wa-page .yw-final h2,
.yu-tm-page .yt-hero h1,
.yu-tm-page .yt-section-head h2,
.yu-tm-page .yt-results__head h2,
.yu-tm-page .yt-trust__head h2,
.yu-tm-page .yt-flow__copy h2,
.yu-tm-page .yt-cta h2,
.ydm-page .ydm-hero h1,
.ydm-page .ydm-section-head h2,
.ydm-page .ydm-story h2,
.ydm-page .ydm-final h2,
.yc-course-page h1,
.yc-course-page h2{
  text-wrap: balance;
  max-inline-size: 100%;
  min-inline-size: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
  line-height: var(--yu-heading-line);
  letter-spacing: var(--yu-heading-tight);
}

/* Keep the display scale intentionally bold, but cap the largest systems. */
.yu-homepage .yu-home-hero__title--live,
.yu-google-page .yg-hero__copy h1,
.yu-meta-page .yu-meta-hero h1,
.ywd-page .ywd-hero h1,
.yseo-page .yseo-hero__copy h1,
.yff-page .yff-hero__copy h1,
.yu-sm-page .ys-hero__copy h1,
.ywm27-page .ywm-hero__copy h1,
.yu-wa-page .yw-wa-hero__copy h1,
.yu-tm-page .yt-hero h1,
.ydm-page .ydm-hero h1,
.yc-course-page h1{
  font-size: var(--yu-heading-xl);
}

.yu-homepage .yu-home-why-v2__top h2,
.yu-homepage .yu-home-services__header h2,
.yu-homepage .yu-home-results__intro h2,
.yu-homepage .yu-home-faq__intro h2,
.yu-homepage .yu-home-final-cta__copy h2,
.yu-google-page .yg-head h2,
.yu-google-page .yg-editorial h2,
.yu-google-page .yg-signature__copy h2,
.yu-google-page .yg-measurement h2,
.yu-google-page .yg-why h2,
.yu-google-page .yg-final__card h2,
.yu-meta-page .yu-meta-copy-block h2,
.yu-meta-page .yu-meta-section-head h2,
.yu-meta-page .yu-meta-final h2,
.ywd-page .ywd-heading h2,
.ywd-page .ywd-two-col h2,
.ywd-page .ywd-proof-card h2,
.ywd-page .ywd-final-card h2,
.yseo-page .yseo-heading h2,
.yseo-page .yseo-simple h2,
.yseo-page .yseo-why__grid h2,
.yseo-page .yseo-final-card h2,
.yff-page .yff-heading h2,
.yff-page .yff-final-card h2,
.yu-sm-page .ys-section-head h2,
.yu-sm-page .ys-two-col h2,
.yu-sm-page .ys-final-card h2,
.ywm27-page .ywm-section-head h2,
.ywm27-page .ywm-story__copy h2,
.ywm27-page .ywm-final h2,
.yu-wa-page .yw-headline h2,
.yu-wa-page .yw-final h2,
.yu-tm-page .yt-section-head h2,
.yu-tm-page .yt-results__head h2,
.yu-tm-page .yt-trust__head h2,
.yu-tm-page .yt-flow__copy h2,
.yu-tm-page .yt-cta h2,
.ydm-page .ydm-section-head h2,
.ydm-page .ydm-story h2,
.ydm-page .ydm-final h2,
.yc-course-page h2{
  font-size: var(--yu-heading-lg);
}

/* Respect component-specific dark backgrounds without changing color. */
.yu-google-page .yg-final__card h2,
.yu-tm-page .yt-flow__copy h2,
.yu-tm-page .yt-cta h2,
.yu-wa-page .yw-final h2,
.ydm-page .ydm-final h2{
  line-height: 1.035;
}

/* Section-head text blocks should not become ultra-wide just because the
 * viewport is wide. A moderate measure improves hierarchy and readability. */
.yu-homepage .yu-home-services__header h2,
.yu-homepage .yu-home-results__intro h2,
.yu-homepage .yu-home-faq__intro h2,
.yu-google-page .yg-head h2,
.yu-google-page .yg-editorial h2,
.yu-google-page .yg-signature__copy h2,
.yu-google-page .yg-measurement h2,
.yu-google-page .yg-why h2,
.yu-meta-page .yu-meta-copy-block h2,
.yu-meta-page .yu-meta-section-head h2,
.ywd-page .ywd-heading h2,
.ywd-page .ywd-two-col h2,
.yseo-page .yseo-heading h2,
.yseo-page .yseo-simple h2,
.yseo-page .yseo-why__grid h2,
.yff-page .yff-heading h2,
.yu-tm-page .yt-section-head h2,
.yu-tm-page .yt-flow__copy h2,
.ydm-page .ydm-section-head h2,
.ydm-page .ydm-story h2{
  max-width: 22ch;
}

/* Homepage display H2 can use a wider measure because its composition has a
 * two-column layout on larger screens. */
.yu-homepage .yu-home-why-v2__top h2{max-width: 15.5ch;}

/* Course pages use a slightly calmer display rhythm than marketing heroes. */
.yc-course-page h1{max-width: 16ch;}
.yc-course-page h2{max-width: 18ch;}

/* Mobile: preserve impact without turning every heading into a vertical
 * poster. The 360–430px range gets the most important correction. */
@media (max-width: 767px){
  :root{
    --yu-heading-xl: clamp(2.15rem, 8.5vw, 3rem);
    --yu-heading-lg: clamp(1.95rem, 7.4vw, 2.65rem);
    --yu-heading-md: clamp(1.65rem, 6vw, 2.15rem);
    --yu-heading-line: 1.045;
  }

  .yu-homepage .yu-home-hero__title--live,
  .yu-google-page .yg-hero__copy h1,
  .yu-meta-page .yu-meta-hero h1,
  .ywd-page .ywd-hero h1,
  .yseo-page .yseo-hero__copy h1,
  .yff-page .yff-hero__copy h1,
  .yu-sm-page .ys-hero__copy h1,
  .ywm27-page .ywm-hero__copy h1,
  .yu-wa-page .yw-wa-hero__copy h1,
  .yu-tm-page .yt-hero h1,
  .ydm-page .ydm-hero h1,
  .yc-course-page h1{
    max-width: 18ch;
    margin-inline: 0;
  }

  .yu-homepage .yu-home-why-v2__top h2,
  .yu-homepage .yu-home-services__header h2,
  .yu-homepage .yu-home-results__intro h2,
  .yu-homepage .yu-home-faq__intro h2,
  .yu-homepage .yu-home-final-cta__copy h2,
  .yu-google-page .yg-head h2,
  .yu-google-page .yg-editorial h2,
  .yu-google-page .yg-signature__copy h2,
  .yu-google-page .yg-measurement h2,
  .yu-google-page .yg-why h2,
  .yu-google-page .yg-final__card h2,
  .yu-meta-page .yu-meta-copy-block h2,
  .yu-meta-page .yu-meta-section-head h2,
  .yu-meta-page .yu-meta-final h2,
  .ywd-page .ywd-heading h2,
  .ywd-page .ywd-two-col h2,
  .ywd-page .ywd-proof-card h2,
  .ywd-page .ywd-final-card h2,
  .yseo-page .yseo-heading h2,
  .yseo-page .yseo-simple h2,
  .yseo-page .yseo-why__grid h2,
  .yseo-page .yseo-final-card h2,
  .yff-page .yff-heading h2,
  .yff-page .yff-final-card h2,
  .yu-sm-page .ys-section-head h2,
  .yu-sm-page .ys-two-col h2,
  .yu-sm-page .ys-final-card h2,
  .ywm27-page .ywm-section-head h2,
  .ywm27-page .ywm-story__copy h2,
  .ywm27-page .ywm-final h2,
  .yu-wa-page .yw-headline h2,
  .yu-wa-page .yw-final h2,
  .yu-tm-page .yt-section-head h2,
  .yu-tm-page .yt-results__head h2,
  .yu-tm-page .yt-trust__head h2,
  .yu-tm-page .yt-flow__copy h2,
  .yu-tm-page .yt-cta h2,
  .ydm-page .ydm-section-head h2,
  .ydm-page .ydm-story h2,
  .ydm-page .ydm-final h2,
  .yc-course-page h2{
    max-width: 20ch;
    margin-inline: 0;
  }

  /* The home Why section is intentionally narrower to stop single-word
   * lines such as “Digital / Marketing / Agency?”. */
  .yu-homepage .yu-home-why-v2__top h2{max-width: 16ch;}

  /* Let centered components remain centered while retaining the same measure. */
  .yff-heading--center h2,
  .ywd-heading--center h2,
  .yu-google-page .yg-head h2,
  .yu-google-page .yg-editorial h2{
    margin-inline: auto;
  }
}

@media (max-width: 420px){
  :root{
    --yu-heading-xl: clamp(2rem, 7.9vw, 2.7rem);
    --yu-heading-lg: clamp(1.85rem, 7vw, 2.45rem);
  }

  .yu-homepage .yu-home-hero__title--live,
  .yu-google-page .yg-hero__copy h1,
  .yu-meta-page .yu-meta-hero h1,
  .ywd-page .ywd-hero h1,
  .yseo-page .yseo-hero__copy h1,
  .yff-page .yff-hero__copy h1,
  .yu-sm-page .ys-hero__copy h1,
  .ywm27-page .ywm-hero__copy h1,
  .yu-wa-page .yw-wa-hero__copy h1,
  .yu-tm-page .yt-hero h1,
  .ydm-page .ydm-hero h1,
  .yc-course-page h1{max-width: 17.5ch;}
}

/* Small, functional card headings should stay compact rather than inheriting
 * the large editorial display scale. */
.yu-homepage .yu-home-services__card h3,
.yu-homepage .yu-home-faq__question-text,
.yu-google-page .yg-case-card strong,
.yu-google-page .yg-process-panel h3,
.yu-meta-page .yu-meta-funnel-row strong,
.yu-meta-page .yu-meta-case strong,
.yff-page .yff-price-card h3,
.yff-page .yff-benefit-grid h3,
.yff-page .yff-process-grid h3,
.yu-sm-page .ys-service-grid strong,
.yu-tm-page .yt-process__list strong,
.yc-course-page .yc-reason-card h3,
.yc-course-page .yc-learning-grid h3,
.yc-course-page .yc-placement-grid h3{
  line-height: 1.18;
  letter-spacing: -0.015em;
  text-wrap: balance;
}

/* Founder decorative annotation was intentionally removed in v0.1.22. */
.yu-homepage .yu-home-founder__content::after,
.yu-home-founder__content::after,
.yu-home-founder__visual-note{
  display:none !important;
  content:none !important;
}


/* v0.1.27 — HOMEPAGE HERO ONLY: restore the desktop live-hero display scale.
 * The global display-heading safety net intentionally scales H1s, but the
 * homepage video hero has its own measured composition. Keep this override
 * scoped strictly to the homepage hero so service pages and all other sections
 * remain untouched. */
@media (min-width:1025px){
  .yu-homepage .yu-home-hero--video .yu-home-hero__copy{
    width:min(720px,62%);
  }
  .yu-homepage .yu-home-hero--video .yu-home-hero__title--live{
    max-width:650px;
    font-size:clamp(3.15rem,4.55vw,4.25rem);
    line-height:1.01;
    letter-spacing:-.02em;
  }
  .yu-homepage .yu-home-hero--video .yu-home-mobile-line{
    white-space:normal;
  }
}
