/*
 * PALADI design system layer: unified section spacing and type scale.
 * Loaded last so it overrides the older per-section values.
 */

html {
  --sy: clamp(40px, 4.2vw, 64px);
  --sy-tight: 32px;
  --t-hero: clamp(64px, 7.4vw, 124px);
  --t-h2: clamp(40px, 4.6vw, 72px);
  --t-h3: clamp(24px, 2.2vw, 34px);
  --t-body: 16px;
  --t-lead: clamp(17px, 1.25vw, 19px);
  --t-label: 11px;
  --t-btn: 11px;
  --btn-h: 48px;
  --lh-head: 1.04;
  --ls-head: -.028em;
}
@media (max-width: 820px) {
  html {
    --sy: 36px;
    --sy-tight: 26px;
    --t-hero: clamp(38px, 10.5vw, 50px);
    --t-h2: clamp(34px, 9vw, 42px);
    --t-h3: 22px;
    --t-body: 15px;
    --t-lead: 16px;
    --t-label: 10px;
    --t-btn: 10px;
    --btn-h: 44px;
  }
}

/* ---------- A. Section spacing: one scale, top = bottom ---------- */
html .section-space,
html .home-story.section-space,
html .home-collection.section-space,
html .card-mechanic.section-space,
html .home-characters.section-space,
html .home-about.section-space,
html .about-story.section-space,
html .about-process.section-space,
html .about-press.section-space,
html .generic-page--commerce.section-space {
  padding-top: var(--sy) !important;
  padding-bottom: var(--sy) !important;
}
html .about-founder { padding-block: var(--sy) !important; }

/* Compact blocks */
html .product-editorial,
html .product-related.section-space,
html .character-navigation.section-space {
  padding-top: var(--sy-tight) !important;
  padding-bottom: var(--sy-tight) !important;
}
html .shop-hero { padding: var(--sy) 0 var(--sy-tight) !important; }
html .shop-products { padding-block: var(--sy-tight) var(--sy) !important; }

/* Dark split panels */
@media (min-width: 821px) {
  html .character-world { padding-block: var(--sy) !important; }
  html .home-closing__copy,
  html .about-final-cta__copy { padding-block: var(--sy) !important; }
}
@media (max-width: 820px) {
  html .home-closing__copy,
  html .about-final-cta__copy { padding-top: var(--sy) !important; padding-bottom: var(--sy) !important; }
  html .character-world { padding-top: var(--sy) !important; }
}

/* Sections that don't use .section-space */
html .character-design { padding-block: var(--sy) !important; }
html .character-design__mark { min-height: 440px; }

/* MO / XI desktop: tops aligned, headings get room to breathe */
@media (min-width: 821px) {
  html .character-world { align-items: flex-start !important; }
  html .character-world__copy { max-width: 58% !important; }
  html .character-world__copy h2 { font-size: clamp(36px, 3.6vw, 56px) !important; }
}

/* Mobile closing panels: keep the box clear of the copy */
@media (max-width: 820px) {
  html .home-closing__copy,
  html .about-final-cta__copy { max-width: 58% !important; }
  html .home-closing__visual,
  html .about-final-cta__visual { width: 46% !important; right: -12% !important; }
  html .home-closing__visual img,
  html .about-final-cta__visual img { max-height: 220px !important; }
  html .character-design__mark { min-height: 340px; }
}

/* ---------- B. Vietnamese-safe headings ---------- */
html .display-title,
html .reference-hero h1,
html .reference-hero__title-accent,
html .about-hero h1,
html .character-identity h1,
html .shop-hero h1,
html .generic-page__header h1,
html .product-summary h1,
html .home-collection__heading h2,
html .character-world__copy h2,
html .home-closing__copy h2,
html .about-founder__copy h2,
html .about-final-cta__copy h2,
html .about-press__heading h2,
html .product-editorial h2,
html .product-related__heading h2,
html .character-design__copy h2,
html .paladi-empty-cart h2 {
  line-height: var(--lh-head) !important;
  letter-spacing: var(--ls-head) !important;
}
html .reference-hero__title-accent { margin-top: .04em !important; }

/* ---------- C. Type scale ---------- */
html .reference-hero h1,
html .about-hero h1,
html .character-identity h1 { font-size: var(--t-hero) !important; }

html .display-title,
html .shop-hero h1,
html .generic-page__header h1,
html .home-collection__heading h2,
html .character-world__copy h2,
html .home-closing__copy h2,
html .about-founder__copy h2,
html .about-final-cta__copy h2,
html .about-press__heading h2,
html .product-editorial h2,
html .product-related__heading h2,
html .character-design__copy h2,
html .home-story__copy .display-title,
html .home-characters__heading .display-title,
html .character-story article .display-title { font-size: var(--t-h2) !important; }

html .home-character-row h3,
html .paladi-empty-cart h2,
html .product-summary h1 { font-size: var(--t-h3) !important; }

html .body-large,
html .reference-hero__body,
html .character-story__intro { font-size: var(--t-lead) !important; line-height: 1.65 !important; }

html .character-world__copy > p:last-of-type,
html .home-closing__copy > p:last-of-type,
html .about-founder__copy > p:last-child,
html .about-story__body > p:not(.body-large),
html .about-process__grid p,
html .home-character-row p,
html .home-about__author p,
html .character-story__paragraphs p,
html .generic-page__content { font-size: var(--t-body) !important; line-height: 1.65 !important; }

/* ---------- D. Minimum small-text sizes ---------- */
html .micro-label,
html .reference-hero .micro-label { font-size: var(--t-label) !important; }
html .paladi-product-card__meta,
html .paladi-product-card__badge,
html .home-character-row em,
html .home-story__visual figcaption,
html .home-character-row__index,
html .about-process__grid span { font-size: 10px !important; }

/* ---------- E. Buttons ---------- */
html .paladi-button,
html .reference-hero__actions .paladi-button,
html .home-story__copy .home-story__more--mobile,
html .home-closing__copy .paladi-button,
html .about-final-cta__copy .paladi-button,
html .home-about__copy .paladi-button--brand {
  min-height: var(--btn-h) !important;
  font-size: var(--t-btn) !important;
}
html .product-summary__buy .quantity,
html .product-summary__buy .single_add_to_cart_button { min-height: var(--btn-h) !important; height: var(--btn-h) !important; }

/* First collection (desktop): heading as the first column, two products beside it */
@media (min-width: 821px) {
  html .home-collection > .paladi-shell {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: clamp(28px, 3vw, 48px);
    align-items: end;
  }
  html .home-collection__heading { display: block; padding-bottom: 8px; }
  html .home-collection__heading h2 { font-size: clamp(40px, 3.8vw, 60px) !important; }
  html .home-collection__heading > p { margin-top: 22px; }
  html .home-product-stories { margin-top: 0; }
}

/* Hero: lift the copy and buttons off the bottom edge on desktop */
@media (min-width: 821px) {
  html .reference-hero__content { padding-bottom: clamp(64px, 9vh, 104px); }
  html .reference-hero__index { bottom: calc(clamp(64px, 9vh, 104px) + 18px); }
}
