/* ═══════════════════════════════════════════════════
   New UI — shared typography (loads after page CSS)
   NEW_DASHBOARD_TYPOGRAPHY_LAYOUT_SPEC.md · DESIGN_PATTERNS.md
   ═══════════════════════════════════════════════════ */

/* ── Base ── */
body,
.ncp-shell,
.nui-page,
.prop-page-shell {
    font-family: var(--nd-font);
    font-size: 14px;
    line-height: 1.6;
    font-weight: 400;
    color: var(--nd-color-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--nd-font);
    color: var(--nd-color-text);
}

/* ── Display heroes — Playfair (photo / accent heroes) ── */
.nid-hero-title,
.nic-hero-title,
.ntd-hero-title,
.nd-dest-hero-title,
.nd-cat-hero-title {
    font-family: var(--nd-font-display);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.12;
}

.nid-hero-title {
    font-size: clamp(1.875rem, 3.8vw, 2.75rem);
    color: #fff;
}

.nic-hero-title {
    font-size: clamp(1.875rem, 3.8vw, 2.75rem);
    color: #fff;
}

.ntd-hero-title {
    font-size: clamp(1.875rem, 3.8vw, 2.875rem);
    color: #fff;
}

/* Listing pages — light hero still uses display serif per mockup */
.nd-dest-hero-title,
.nd-cat-hero-title {
    font-size: clamp(1.875rem, 3.4vw, 2.5rem);
    color: var(--nd-color-text);
}

/* Categories photo hero — dark overlay, white text */
.nd-cat-hero--photo .nd-cat-hero-title {
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
.nd-cat-hero--photo .nd-cat-hero-sub {
    color: rgba(255, 255, 255, .92);
}
.nd-cat-hero--photo .nd-cat-breadcrumb,
.nd-cat-hero--photo .nd-cat-breadcrumb a {
    color: rgba(255, 255, 255, .75);
}
.nd-cat-hero--photo .nd-cat-breadcrumb a:hover {
    color: #fff;
}
.nd-cat-hero--photo .nd-cat-breadcrumb span {
    color: rgba(255, 255, 255, .95);
}
.nd-cat-hero--photo .nd-cat-hero-chip {
    color: #fbbf24;
}

/* Photo heroes — Poppins (about, contact, blog, search) */
.ab-hero-title,
.ct-hero-title,
.nbl-hero-title,
.nbs-hero-title,
.nsr-hero-title {
    font-family: var(--nd-font);
    font-weight: 600;
    font-size: clamp(1.875rem, 3.8vw, 3rem);
    line-height: 1.18;
    letter-spacing: -0.02em;
}

/* ── Section H2 — Poppins 600 (never Playfair) ── */
.nui-section-title,
.nd-dest-section-title,
.nd-pkg-section-title,
.nd-pkg-title,
.nd-styles-title,
.nd-blog-section-title,
.nd-blog-title,
.nd-why-section-title,
.nd-why-title,
.nd-cat-section-title,
.ab-title,
.ct-section-title,
.nbl-section-title,
.nic-section-title,
.nid-section-title,
.ntd-section-title,
.nsr-section-title,
.prop-sec-title,
.nic-cat-dest-title {
    font-family: var(--nd-font) !important;
    font-size: clamp(1.5rem, 2.8vw, 2.125rem);
    font-weight: 600 !important;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--nd-color-text);
}

/* ── Dark green CTA bands — keep light text (not section H2 scale) ── */
.nd-dest-cta-title,
.nd-cta-title {
    font-family: var(--nd-font) !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em;
    color: #fff !important;
}

.nd-dest-cta-sub {
    font-family: var(--nd-font);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.72) !important;
}

.ntd-section-title {
    font-weight: 400 !important;
}

/* ── Small section / card headings — Poppins 600 ── */
.ntd-card-title,
.ntd-trip-card-title,
.ntd-journey-card-title,
.ntd-why-card-title,
.ntd-recent-card-title,
.nic-help-title,
.nid-help-title,
.nd-dest-empty h3,
.ab-mv-title,
.ab-why-title,
.ab-team-name,
.ab-award-title,
.ab-test-name,
.ct-info-title,
.tc-section-title,
.nbl-card-title,
.nbs-related-title,
.enq-filter-panel-title,
.enq-help-title,
.enq-why-title,
.bkd-inc-col-title,
.prop-sidebar-section-title {
    font-family: var(--nd-font);
    font-weight: 600;
}

/* ── Card / tour titles — 600 not 700/800 ── */
.nic-tour-name,
.nid-tour-name,
.nd-dest-card-name,
.nd-cat-style-name,
.nd-pkg-card-title,
.nsr-tour-name,
.nbs-card-title,
.nic-cat-dest-name,
.prop-pkg-type {
    font-family: var(--nd-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--nd-color-text);
}

/* ── Customer portal page titles ── */
.ncp-page-title,
.enq-page-title,
.page-title,
.prop-hero-title,
.bkd-title,
.bkd-trip-name,
.cd-welcome-greeting {
    font-family: var(--nd-font);
    font-weight: 700;
    line-height: 1.2;
    color: var(--nd-color-text);
}

.ncp-page-title,
.enq-page-title,
.page-title {
    font-size: clamp(1.25rem, 2.5vw, 1.5rem);
}

.prop-hero-title {
    font-size: clamp(1.375rem, 2.5vw, 1.625rem);
    font-weight: 700;
}

.bkd-title {
    font-size: clamp(1.25rem, 2.5vw, 1.375rem);
    font-weight: 700;
}

.bkd-trip-name {
    font-size: 1.125rem;
    font-weight: 600;
}

/* ── Body / meta / labels ── */
.nid-hero-sub,
.nic-hero-sub,
.nd-dest-hero-sub,
.nd-cat-hero-sub,
.ab-hero-sub,
.ct-hero-sub,
.nbl-hero-sub,
.nsr-hero-sub,
.prop-hero-meta-val,
.enq-card-title,
.ncp-page-sub,
.page-sub,
.nui-page-sub {
    font-family: var(--nd-font);
    font-weight: 400;
}

.prop-hero-meta-label,
.enq-card-meta,
.bkd-info-label,
.ntd-itin-day-label,
.ntd-itin-stat-label {
    font-family: var(--nd-font);
    font-weight: 500;
    color: var(--nd-color-caption);
}

/* ── Chips & badges ── */
.nic-chip,
.nid-chip,
.nd-dest-chip,
.nd-cat-chip,
.ab-hero-chip,
.ct-hero-chip,
.nbl-chip,
.nsr-chip,
.tc-chip,
.prop-hero-badge {
    font-family: var(--nd-font);
    font-weight: 700;
    letter-spacing: 0.08em;
}

/* ── Buttons & CTAs ── */
.nic-tour-btn-outline,
.nic-tour-btn-fill,
.nid-tour-btn-outline,
.nid-tour-btn-fill,
.nd-dest-search-btn,
.nd-cat-search-btn,
.nic-help-btn,
.nid-help-btn,
.prop-sidebar-btn,
.enq-card-btn,
.lead-cap-submit,
.nui-btn-primary,
.nui-btn-green {
    font-family: var(--nd-font);
    font-weight: 600;
}

/* ── Price emphasis ── */
.prop-pkg-price,
.nd-pkg-price,
.nic-tour-price,
.nid-tour-price {
    font-family: var(--nd-font);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* ── Stats numbers — tabular, not ultra-bold ── */
.ab-hero-stat-num,
.ab-story-badge-num,
.cd-stat-num {
    font-family: var(--nd-font);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* ── Itinerary accordion (shared partial) ── */
.ntd-itin-header,
.ntd-itin-header .ntd-itin-day-title,
.ntd-itin-header .ntd-itin-day-label,
.ntd-itin-header .ntd-itin-day-sub,
.ntd-itin-desc,
.ntd-itin-hl-item {
    font-family: var(--nd-font);
    font-weight: 400;
}

.ntd-itin-sub-title {
    font-family: var(--nd-font);
    font-weight: 500;
}

.ntd-itin-num {
    font-family: var(--nd-font);
    font-weight: 700;
}

/* ── Nav / tabs ── */
.ntd-tab-btn,
.nid-dur-tab,
.nic-dur-tab,
.nd-dest-sf-label {
    font-family: var(--nd-font);
}

.ntd-tab-btn {
    font-weight: 500;
}

.ntd-tab-btn.active {
    font-weight: 600;
}

/* ── Breadcrumbs ── */
.nui-breadcrumb,
.prop-breadcrumb,
.bkd-breadcrumb,
.nid-breadcrumb,
.nic-breadcrumb,
.nd-dest-breadcrumb {
    font-family: var(--nd-font);
    font-size: 12px;
    font-weight: 400;
}

.nui-breadcrumb span,
.prop-breadcrumb span,
.bkd-breadcrumb span,
.nd-dest-breadcrumb span {
    font-weight: 500;
}

/* ── Reduce legacy ultra-bold (800/900 → spec weights) ── */
.enq-card-ref,
.bkd-pay-total,
.bkd-step-label.active,
.bkd-day-title {
    font-weight: 600;
}

/* ── Auth pages (standalone — when mobile-friendly linked) ── */
.nl-form-title,
.fp-form-title,
.nr-form-title {
    font-family: var(--nd-font);
    font-weight: 700;
    line-height: 1.2;
}

.nl-form-sub,
.fp-form-sub,
.nr-form-sub {
    font-family: var(--nd-font);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.6;
    color: var(--nd-color-muted);
}

/* ── Responsive type scale ── */
@media (max-width: 767px) {
    .ab-hero-title,
    .ct-hero-title,
    .nbl-hero-title,
    .nbs-hero-title,
    .nsr-hero-title {
        font-size: clamp(1.75rem, 6.5vw, 2.25rem);
    }

    .nid-hero-title,
    .nic-hero-title,
    .ntd-hero-title,
    .nd-dest-hero-title,
    .nd-cat-hero-title {
        font-size: clamp(1.625rem, 5.5vw, 2rem);
    }

    .nui-section-title,
    .nd-dest-section-title,
    .nic-section-title,
    .nid-section-title,
    .ntd-section-title,
    .nd-cat-section-title,
    .nd-pkg-section-title,
    .nd-blog-section-title,
    .nd-why-section-title {
        font-size: clamp(1.375rem, 4vw, 1.5rem);
    }

    .prop-hero-title {
        font-size: 1.25rem;
    }

    .nd-dest-cta-title,
    .nd-cta-title {
        font-size: 1.05rem !important;
    }
}

@media (max-width: 575px) {
    body,
    .ncp-shell {
        font-size: 14px;
    }

    .nui-section-title,
    .nd-dest-section-title,
    .nic-section-title,
    .nid-section-title,
    .nd-cat-section-title,
    .nd-pkg-section-title,
    .nd-blog-section-title,
    .nd-why-section-title {
        font-size: 1.375rem;
    }
}