/* ─── Shared fonts & base reset ──────────────────────────────────────────── */

@font-face {
  font-family: 'Inter';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hiA.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuGKYAZ9hiA.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYAZ9hiJ-Ek-_EeA.woff2') format('woff2');
}

@font-face {
  font-family: 'Proxima Nova Advanced';
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url('https://http2.mlstatic.com/storage/pog-cm-admin/calm-assets/proxima-nova-bold--b7c049bd.otf') format('opentype');
}

/* ─── Shared typography ──────────────────────────────────────────────────── */
/* Default text font is Proxima Nova; only titles use Proxima Nova Advanced
   (rule below). We restate the family on common text-bearing descendants
   because (a) form elements have UA fonts and (b) CALM may inject global
   font rules that break the natural inheritance chain. */

.new-landing-hero-section,
.new-landing-feature-tabs-section,
.new-landing-business-types-section,
.new-landing-point-section,
.new-landing-tutorials-section,
.new-landing-contacts-section,
.new-landing-faqs-section,
.new-landing-closing-section,
.new-landing-hero-section p,
.new-landing-feature-tabs-section p,
.new-landing-business-types-section p,
.new-landing-point-section p,
.new-landing-tutorials-section p,
.new-landing-contacts-section p,
.new-landing-faqs-section p,
.new-landing-closing-section p,
.new-landing-hero-section span,
.new-landing-feature-tabs-section span,
.new-landing-business-types-section span,
.new-landing-point-section span,
.new-landing-tutorials-section span,
.new-landing-contacts-section span,
.new-landing-faqs-section span,
.new-landing-closing-section span,
.new-landing-hero-section a,
.new-landing-feature-tabs-section a,
.new-landing-business-types-section a,
.new-landing-point-section a,
.new-landing-tutorials-section a,
.new-landing-contacts-section a,
.new-landing-faqs-section a,
.new-landing-closing-section a,
.new-landing-hero-section li,
.new-landing-feature-tabs-section li,
.new-landing-business-types-section li,
.new-landing-point-section li,
.new-landing-tutorials-section li,
.new-landing-contacts-section li,
.new-landing-faqs-section li,
.new-landing-closing-section li,
.new-landing-hero-section button,
.new-landing-feature-tabs-section button,
.new-landing-business-types-section button,
.new-landing-point-section button,
.new-landing-tutorials-section button,
.new-landing-contacts-section button,
.new-landing-faqs-section button,
.new-landing-closing-section button,
.new-landing-hero-section input,
.new-landing-feature-tabs-section input,
.new-landing-business-types-section input,
.new-landing-point-section input,
.new-landing-tutorials-section input,
.new-landing-contacts-section input,
.new-landing-faqs-section input,
.new-landing-closing-section input,
.new-landing-hero-section label,
.new-landing-feature-tabs-section label,
.new-landing-business-types-section label,
.new-landing-point-section label,
.new-landing-tutorials-section label,
.new-landing-contacts-section label,
.new-landing-faqs-section label,
.new-landing-closing-section label,
.new-landing-hero-section textarea,
.new-landing-feature-tabs-section textarea,
.new-landing-business-types-section textarea,
.new-landing-point-section textarea,
.new-landing-tutorials-section textarea,
.new-landing-contacts-section textarea,
.new-landing-faqs-section textarea,
.new-landing-closing-section textarea,
.new-landing-hero-section select,
.new-landing-feature-tabs-section select,
.new-landing-business-types-section select,
.new-landing-point-section select,
.new-landing-tutorials-section select,
.new-landing-contacts-section select,
.new-landing-faqs-section select,
.new-landing-closing-section select {
  font-family: 'Proxima Nova', sans-serif !important;
  font-feature-settings: 'salt' on, 'calt' off;
}

/* Titles are the ONLY elements that use Proxima Nova Advanced.
   This rule comes after the default-font rule so it wins by source order
   at equal specificity + !important. */
.new-landing-hero-section__title,
.new-landing-feature-section__title,
.new-landing-business-types-section__title,
.new-landing-point-section__title,
.new-landing-tutorials-section__title,
.new-landing-tutorials-section__card-title,
.new-landing-tutorials-section__player-title,
.new-landing-contacts-section__title,
.new-landing-faqs-section__title,
.new-landing-closing-section__title {
  font-family: 'Proxima Nova Advanced', 'Proxima Nova', sans-serif !important;
}

/* ─── Andes-like button styles ───────────────────────────────────────────── */

.landing-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  padding: 14px 24px;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 0.2s ease, opacity 0.2s ease;
  box-sizing: border-box;
}

.landing-btn--loud {
  background-color: #4850E5;
  color: #fff;
}

.landing-btn--loud:hover {
  background-color: #3d44c9;
  color: #fff;
}

.landing-btn--loud-on-fill {
  background-color: #fff;
  color: #282834;
}

.landing-btn--loud-on-fill:hover {
  background-color: #f0f0f0;
  color: #282834;
}

.landing-btn--quiet {
  background: transparent;
  color: #282834;
  padding: 8px 16px;
}

.landing-btn--quiet:hover {
  background-color: rgba(40, 40, 52, 0.08);
}

.landing-btn--full-width {
  width: 100%;
}

.landing-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: background-color 0.2s ease;
}

.landing-icon-btn:hover {
  background-color: rgba(40, 40, 52, 0.08);
}

/* ─── Full-viewport sections ─────────────────────────────────────────────── */
/* Each section fills the screen minus the navbar (64px) and page padding (8px).
   Hero is intentionally excluded — it manages its own height in hero_section.css
   so the next section peeks at the viewport bottom. */

.new-landing-feature-tabs-section,
.new-landing-business-types-section,
.new-landing-point-section,
.new-landing-tutorials-section,
.new-landing-contacts-section,
.new-landing-faqs-section,
.new-landing-closing-section {
  box-sizing: border-box;
  min-height: calc(100vh - 72px);
  min-height: calc(100dvh - 72px);
  margin: 8px;
}

/* Scroll snap on feature_tabs_section is handled in JS (feature_tabs_section.js)
   because CALM's scroll container is the document root, which is not an
   allowed CSS selector. */

/* ─── Hide CALM-injected navbar when rendered inside a webview ───────────── */
/* The is-webview flag is added on the document root by hero_section.js,
   reading the {is_webview} placeholder defined in Global Settings.
   Update selectors below if CALM's navbar uses different classes. */
.is-webview .nav-header,
.is-webview .nav-header-full_v2 {
  display: none !important;
}

.is-webview .new-landing-hero-section__nav-actions,
.is-webview .new-landing-hero-section__logo {
  display: none;
}