/* ==========================================================================
   page-base.css — typography + button normalizer for FAQ, shipping, contact.
   Surgical: only fonts, sizes, eyebrows, hero scale, and primary button
   styling. Leaves all background panels / cards / form inputs to the
   page's own CSS so existing dark surfaces don't get tinted to white.
   Load AFTER the page's own stylesheet so overrides win.
   ========================================================================== */

/* --- 1. Body font: match the homepage's DM Sans body stack ---------------- */
html, body {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

/* --- 2. Eyebrows: mono caps gold accent (homepage pattern) ---------------- */
.eyebrow,
.policy-eyebrow,
.faq-cat-head .eyebrow,
.faq-side .eyebrow,
.contact-hero .eyebrow,
.faq-hero .eyebrow,
.policy-hero .eyebrow,
.before-faq .eyebrow,
.press-band .eyebrow,
.info-head .eyebrow {
    font-family: 'IBM Plex Mono', 'Menlo', Consolas, monospace !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: #E9C46A !important;
    font-weight: 600 !important;
}

/* --- 3. Hero h1: Fraunces serif at homepage scale ------------------------ */
.faq-title,
.policy-title,
.contact-hero h1 {
    font-family: 'Fraunces', Georgia, 'Times New Roman', serif !important;
    font-weight: 500 !important;
    font-size: clamp(2.8rem, 7vw, 5.6rem) !important;
    line-height: 0.98 !important;
    letter-spacing: -0.025em !important;
    color: #ffffff !important;
}

/* --- 4. Italic gold accent (matches homepage .italic-gold / hero em) ----- */
.faq-title em,
.policy-title em,
.contact-hero h1 em,
.policy-h2 em,
.contact-info h2 em,
.before-faq h2 em,
.press-band h2 em,
.italic-gold {
    font-family: 'Fraunces', Georgia, serif !important;
    font-style: italic !important;
    color: #E9C46A !important;
    font-weight: 500 !important;
}

/* --- 5. Section h2: Fraunces serif, smaller scale ------------------------ */
.policy-h2,
.section-h2,
.faq-cat-title,
.contact-info h2,
.before-faq h2,
.press-band h2 {
    font-family: 'Fraunces', Georgia, serif !important;
    font-weight: 500 !important;
    font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
    color: #ffffff !important;
}

/* --- 6. Hero subtitles / lede paragraphs --------------------------------- */
.faq-subtitle,
.policy-subtitle,
.contact-hero-sub {
    font-family: 'DM Sans', sans-serif !important;
    font-size: clamp(1.05rem, 1.5vw, 1.25rem) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
}

/* --- 7. Primary buttons: gold pill matching homepage hero CTA ------------- */
.btn-primary,
.btn-primary.big {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.55rem !important;
    padding: 1rem 1.6rem !important;
    border-radius: 999px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    letter-spacing: 0.01em !important;
    text-decoration: none !important;
    border: 1px solid rgba(233, 196, 106, 0.6) !important;
    background: linear-gradient(180deg, #f3d57a 0%, #E9C46A 55%, #d4ad55 100%) !important;
    color: #1a1208 !important;
    box-shadow: 0 12px 28px -12px rgba(233, 196, 106, 0.55), inset 0 1px 0 rgba(255,255,255,0.35);
    transition: transform 200ms ease, box-shadow 200ms ease;
    cursor: pointer;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 34px -12px rgba(233, 196, 106, 0.7), inset 0 1px 0 rgba(255,255,255,0.45);
}
.btn-ghost {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.55rem !important;
    padding: 1rem 1.6rem !important;
    border-radius: 999px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.92rem !important;
    background: transparent !important;
    color: #f4eedc !important;
    border: 1.5px solid rgba(244, 238, 220, 0.35) !important;
    text-decoration: none !important;
    transition: border-color 200ms ease, background 200ms ease;
}
.btn-ghost:hover {
    background: rgba(244, 238, 220, 0.06) !important;
    border-color: #E9C46A !important;
}

/* --- 8. Underline links inside policy body use gold --------------------- */
.policy-body a:not(.btn-primary):not(.btn-ghost),
.faq-a a:not(.btn-primary):not(.btn-ghost) {
    color: #E9C46A !important;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}