@import url("typography-tokens.css?v=2026101204");

/* Four public pages: adapters for existing composition variants. */
:is(.home-page, .about-page, .cr-regular, .contact-page) {
  --reading-size: var(--ty-body-size);
  --lead-size: var(--ty-lead-size);
  --label-size: var(--ty-landing-label-size);
  --section-size: var(--ty-landing-section-size);
  --card-size: var(--ty-landing-card-size);
  font-size: var(--reading-size);
}

:is(.home-page, .about-page, .cr-regular, .contact-page) p {
  font-weight: var(--ty-body-weight);
  word-break: keep-all;
  overflow-wrap: break-word;
}

/* Labels carry real meaning; reserve 12/10px for short decorative metadata. */
.home-page .home-eyebrow,
.home-page #main-po-title .large-text,
.home-page #main-career-title-area .large-text,
.about-page :is(.about-eyebrow, .small-text),
.about-page :is(#about-instructor-title, #about-ob-title, #about-career-title-area) .large-text,
.cr-regular .cr-eyebrow,
.contact-page :is(#cont-title-text .large-text, .contact-form-intro .small-text, .location-info .small-text) {
  font-size: var(--label-size);
  font-weight: var(--ty-label-weight);
  line-height: var(--ty-landing-card-leading);
  letter-spacing: var(--ty-eyebrow-tracking);
}

.home-page :is(#main-po-title, .home-heading, #main-career-title-area, #main-ins-title) h2,
.about-page :is(.about-section-heading, #about-instructor-title, #about-ob-title, #about-career-title-area) h2,
.cr-regular .cr-section-head h2,
.contact-page #cont-title-text h1 {
  font-size: var(--section-size);
  font-weight: var(--ty-landing-heading-weight);
  line-height: var(--ty-landing-heading-leading);
  letter-spacing: var(--ty-landing-heading-tracking);
  text-wrap: balance;
}

.home-page :is(.home-learning-steps) h3,
.about-page :is(.about-journey-card, .about-ob-card-title, .about-ai-copy) h3,
.cr-regular :is(.cr-learning-grid, .cr-class-steps, .cr-start-cards, .cr-field-list) h3,
.contact-page :is(.contact-form-intro, .location-info) h3 {
  font-size: var(--card-size);
  font-weight: var(--ty-landing-heading-weight);
  line-height: var(--ty-landing-card-leading);
  letter-spacing: var(--ty-landing-card-tracking);
}

.home-page :is(.medium-text, .home-heading > p:last-child, .home-learning-steps p),
.about-page :is(.medium-text, .about-section-heading > p:last-child, .about-journey-card > p, .about-ai-copy > p:last-child),
.about-page .about-ob-card .medium-text,
.cr-regular :is(.cr-three article > p, .cr-learning-grid dd, .cr-field-list p, .cr-work-footer p, .cr-ai-method-copy > p:not(.cr-eyebrow)),
.contact-page :is(#cont-title-text .medium-text, .contact-form-note, .privacy-consent label, .location-info > p:not(.small-text)) {
  font-size: var(--reading-size);
  line-height: var(--ty-landing-body-leading);
  letter-spacing: var(--ty-landing-body-tracking);
}

.home-page .home-ai-copy > p:last-child,
.about-page #about-bn-lead,
.cr-regular .cr-lead {
  font-size: var(--lead-size);
  line-height: var(--ty-landing-body-leading);
}

.home-page :is(.home-link, .home-cta, .home-hero-contact),
.about-page .about-contact-link,
.cr-regular :is(.cr-button, .cr-text-link),
.contact-page :is(#submitBtn, .naver-booking-link strong) {
  font-size: var(--reading-size);
  line-height: 1.5;
}

/* One explicit label-to-heading gap, including AI and closing sections. */
.about-page .about-section-heading,
.contact-page #cont-title-text {
  gap: var(--space-12);
}

.about-page .about-section-heading h2 {
  margin-top: 0;
}

.about-page .about-ai-copy h3,
.about-page .about-ob-card-title h3,
.contact-page :is(.contact-form-intro, .location-info) h3 {
  margin-top: var(--space-12);
}

.cr-regular .cr-section-head .cr-eyebrow,
.cr-regular #project-builder > .cr-section-head .cr-eyebrow {
  margin: 0 0 var(--space-12);
}

.cr-regular .cr-ai-method .cr-eyebrow {
  margin: 0 0 var(--space-12);
}

.cr-regular .cr-section-head h2 {
  margin-top: 0;
}

.home-page .home-ai-copy .home-eyebrow {
  color: var(--brand-lime);
}

.home-page .home-ai-copy h3 {
  text-wrap: balance;
}

.contact-page .privacy-consent p {
  font-size: var(--label-size);
  line-height: 1.7;
}

.contact-page :is(.text-input, .textarea) {
  font-size: 16px;
  line-height: 1.6;
}

.contact-page :is(input, textarea)::placeholder {
  font-size: var(--reading-size);
  color: var(--gray-500);
}

@media (max-width: 767px) {
  :is(.home-page, .about-page, .cr-regular, .contact-page) {
    --reading-size: var(--ty-body-size);
    --lead-size: var(--ty-lead-size);
    --label-size: var(--ty-landing-label-size);
    --section-size: var(--ty-landing-section-size);
    --card-size: var(--ty-landing-card-size);
  }

  .home-page .main-bn-con-text p {
    font-size: var(--reading-size);
  }

  .home-page .home-hero-actions a {
    font-size: var(--reading-size);
  }

  .home-page .po-thumb-title .medium-text,
  .home-page .po-thumb-hover .btn-line-green {
    font-size: 12px;
    line-height: 1.5;
  }

  .contact-page .naver-booking-link strong {
    align-items: baseline;
  }

  .contact-page .naver-booking-link i {
    flex-shrink: 0;
  }
}