/**
 * Liliana — site-wide typography tokens (Montserrat)
 * Desktop: titles 18px, body 16px
 * Mobile (≤576px): titles 14px, body 12px
 */

:root {
    --l-font-sans: "Montserrat", sans-serif;
    --l-font-display: "Gilda", serif;

    --l-text-body: 16px;
    --l-text-body-sm: 14px;
    --l-text-caption: 12px;
    --l-text-title: 18px;

    --l-line-body: 1.5;
    --l-line-title: 1.35;
    --l-line-tight: 1.25;

    --l-bp-mobile: 576px;
}

@media screen and (max-width: 576px) {
    :root {
        --l-text-body: 12px;
        --l-text-body-sm: 12px;
        --l-text-caption: 11px;
        --l-text-title: 14px;
    }
}

/* ── Base ─────────────────────────────────────────────── */

body {
    font-family: var(--l-font-sans);
    font-size: var(--l-text-body);
    line-height: var(--l-line-body);
}

p,
li,
dd,
dt,
blockquote,
address,
figcaption,
label,
.field-label,
.form-label,
.description,
.card-text,
.card-content,
.card-content-item,
.meta,
.page-metas .meta,
.breadcrumb,
.text-body {
    font-size: var(--l-text-body);
    line-height: var(--l-line-body);
}

small,
.caption,
.text-caption,
.text-muted,
.card-meta,
.member-info .member-secondary-name {
    font-size: var(--l-text-caption);
    line-height: var(--l-line-body);
}

/* ── Unified title scale ──────────────────────────────── */

h1,
h2,
h3,
h4,
h5,
h6,
.heading .title-area .heading-title,
.heading-box .title-area .heading-title,
.page-more-links h2,
.card .card-title,
.card-primary-title,
.member-card .card-primary-title,
.member-info .member-name .member-primary-name h1,
.member-meta-mobile .member-name,
.app-bar .app-bar-title h1,
.app-bar .app-bar-title .app-bar-title-text,
.app-bar .app-bar-title .app-bat-title-text,
#header .category-title,
.section-title,
.page-work-single .page-title .brand-name,
.field-type-checkbox-member .field-content .checkmark span.member-name,
.model-name .name-primary,
.model-name h1,
.l-typography-title {
    font-size: var(--l-text-title);
    line-height: var(--l-line-title);
}

/* Archive/page titles after <!-- start page title --> */
.page-title h1,
.page-title h2 {
    font-size: 24px;
    line-height: 1.5;
}

/* Secondary UI labels (nav items, filters, tabs) */
.heading-box .heading-filters li a,
#header .menu-nav ul a,
#header .category-content a,
.btn:not(.btn-icon),
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.page-more-links .link-item {
    font-size: var(--l-text-body);
    line-height: var(--l-line-body);
}

/* Buttons follow body scale */
.btn {
    font-size: var(--l-text-body);
}

/* ── Display / marketing exceptions (keep larger) ───────── */

.super-slider .item-title,
.join-group h2,
.heading-box.king-layout .heading-title,
.special-hero-card .card-title,
.papular-tag .section-title:not(.no-default) {
    /* Intentionally not harmonized — hero / marketing display type */
}

/* ── Page-specific harmonization ──────────────────────── */

@media screen and (max-width: 576px) {
    body {
        font-size: var(--l-text-body);
    }

    .heading .title-area .heading-title {
        font-size: var(--l-text-title);
    }

    .heading .action-area a {
        font-size: var(--l-text-body-sm);
    }

    .heading-box .heading-filters li a {
        font-size: var(--l-text-body-sm);
    }

    .member-info .member-name .member-primary-name h1 {
        font-size: var(--l-text-title);
    }

    .member-info .member-name .member-secondary-name {
        font-size: var(--l-text-caption);
    }

    .page-more-links h2 {
        font-size: var(--l-text-title);
    }

    .page-more-links .link-item {
        font-size: var(--l-text-body);
    }

    .card .card-title,
    .member-card .card-primary-title {
        font-size: var(--l-text-title);
    }

    .page-title h1,
    .page-title h2,
    .page-news .page-title h1 {
        font-size: 24px;
    }
}

@media screen and (min-width: 577px) {
    .page-more-links h2 {
        font-size: var(--l-text-title);
    }

    .page-more-links .link-item {
        font-size: var(--l-text-body);
    }
}

/* Home sections — align with global tokens */
.section-title:not(.no-default) {
    font-size: var(--l-text-title);
}

@media screen and (max-width: 576px) {
  .section-title:not(.no-default),
  .about-liliana .section-title,
  .members-highlight .section-title {
    font-size: var(--l-text-title) !important;
  }
}

/* Fashion member — use site font stack */
.member-fashion,
.member-fashion :where(p, li, span, a, button, input, select, textarea, label) {
    font-family: var(--l-font-sans);
}

/* Package page — same scale as the rest of the site */
.liliana-package-main,
.liliana-package-main :where(h1, h2, h3, h4, h5, h6, p, li, span, a, summary, button) {
    font-family: var(--l-font-sans);
}

/* Add member/model placeholder tile (bookmark, hiring, …) */
.add-more span {
    display: block;
    text-align: center;
    line-height: var(--l-line-title);
    font-weight: 300;
    margin: 0;
}

.add-more span:first-child {
    font-size: 38px;
    line-height: 1;
    margin-bottom: 14px;
}

.add-more span:last-child {
    font-size: var(--l-text-title);
}

@media screen and (max-width: 576px) {
    .add-more span:first-child {
        font-size: 28px;
        margin-bottom: 10px;
    }
}