/* ===========================================================================
   "Modern" typography — loaded AFTER every other stylesheet, and only when the Modern
   look is selected (Admin > Settings > Site typography, or ?look=modern to preview it in
   one browser — see Services/SiteLook.cs). Without this file the site is the "Classical"
   look: Fraunces serif headings, untouched.

   Swaps the display font to Inter and re-weights headings the way the Sample Gallery
   project does: large titles in Inter Light with slightly tightened tracking, section
   and card headings in Inter Regular, serif italic accents set upright.
   Only font family/weight/style/tracking change here — sizes and layout stay as they are.
   =========================================================================== */

:root {
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ---- Display titles: Inter Light, tight tracking ---- */
.hero-title,
.value-section-title,
.cta-title,
.featured-samples-title,
.refer-band-title,
.page-title,
.legal-header h1,
.auth-title,
.cover-title,
.tenant-name,
.tenant-404-card h1,
.photo-share-missing h1 {
  font-weight: 300;
  letter-spacing: -.02em;
}
.how-watermark { font-weight: 200; }

/* ---- Section and card headings: Inter Regular ---- */
.feature h3,
.value-section .feature h3,
.how-step-title,
.cta-mobile-text h3,
.plan-card-title,
.sample-card-title,
.login-step-title,
.people-panel-title,
.gallery-meta h3,
.empty-state h2,
.app-dialog h2,
.section-head h2,
.ui-confirm-title,
.legal-section h2,
.tenant-card-meta h2,
.gate-title,
.photo-share-section,
.photo-editor-title,
.photo-editor-pane-title,
.admin-modal h2,
.support-category-title,
.m-header-title,
.m-install-hero h1 {
  font-weight: 400;
  letter-spacing: -.01em;
}

/* ---- Serif italic accents → upright, light ---- */
.feature-num,
.value-section .feature-num,
.how-step-num {
  font-style: normal;
  font-weight: 300;
}
.cover-byline,
.tool-user-name,
.gallery-cover-placeholder,
.tenant-cover-placeholder {
  font-style: normal;
}
.cover-byline { font-weight: 500; }
/* Vintage's italic serif title is the point of that design in Classical; upright here. */
.cover-vintage .cover-title { font-style: normal; }

/* ---- Brand wordmarks stay solid ---- */
.brand-name,
.side-brand-name {
  font-weight: 600;
  letter-spacing: -.01em;
}
.cover-brand-n5 { font-weight: 600; }
