/* Altmis — legal pages (privacy policy, terms & conditions) */

/* ─── Altmis design tokens (Global Design System v1) ─────────────── */
:root {
  /* seed six, bound to the Altmis brand palette */
  --bg:      #FAF9F7;   /* Off-White — page background */
  --surface: #FFFFFF;   /* Pure White — cards, raised areas */
  --fg:      #221B1E;   /* Charcoal — headings */
  --muted:   #7A7276;   /* Muted Grey — secondary text */
  --border:  #F0E1E8;   /* Border / divider */
  --accent:  #E0167C;   /* Primary Pink */

  /* brand extensions (all hex lives here only) */
  --accent-dark:  #B7115F;  /* pink hover / pressed */
  --accent-2:     #FF5FA2;  /* gradient end stop */
  --blush:        #FDF1F6;  /* blush tint section bg */
  --rose:         #FFF6FA;  /* soft rose card bg */
  --offwhite:     #FAF9F7;  /* off-white section bg */
  --ink:          #3A3238;  /* soft black body text */
  --trust:        #2F7D5A;  /* verified-patient green (sparing) */
  --grad:         linear-gradient(135deg, #E0167C, #FF5FA2);
  --accent-soft:  color-mix(in oklch, var(--accent) 14%, transparent);
  --shadow-soft:  0 8px 24px rgba(224, 22, 124, 0.08);
  --shadow-lift:  0 16px 40px rgba(224, 22, 124, 0.14);

  /* type */
  --font-display: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-body:    'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, monospace;

  /* scale */
  --fs-h1: clamp(40px, 5.2vw, 64px);
  --fs-h2: clamp(30px, 3.6vw, 44px);
  --fs-h3: 21px;
  --fs-lead: 17px;
  --fs-body: 15.5px;
  --fs-meta: 13px;

  /* spacing — 8pt grid */
  --gap-xs: 8px; --gap-sm: 12px; --gap-md: 20px;
  --gap-lg: 32px; --gap-xl: 56px; --gap-2xl: 96px;
  --container: 1180px;
  --gutter: 24px;

  --radius: 12px;
  --radius-card: 20px;
  --radius-pill: 999px;
  --header-h: 76px;
}

/* ─── type ─────────────────────────────────────────────────────── */
h1, .h1 { font-family: var(--font-display); font-size: var(--fs-h1); line-height: 1.08; letter-spacing: -0.01em; margin: 0; font-weight: 400; }

.meta { font-family: var(--font-mono); font-size: var(--fs-meta); color: var(--muted); }

.brand .brand-logo { height: 48px; width: auto; display: block; }

/* ─── page hero (compact) ──────────────────────────────────────── */
.page-hero { position: relative; overflow: hidden; padding-block: clamp(44px, 6vw, 72px); }

.hero-blob {
  position: absolute; top: -30%; right: -8%;
  width: min(560px, 58vw); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 22, 124, 0.14), rgba(255, 95, 162, 0.05) 62%, transparent 72%);
  filter: blur(10px); pointer-events: none;
}

.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--muted); margin-bottom: 22px; position: relative;
}

.breadcrumb a { color: var(--muted); transition: color 0.2s ease; }

.breadcrumb a:hover { color: var(--accent); }

.breadcrumb .sep { opacity: 0.55; }

.breadcrumb [aria-current] { color: var(--ink); font-weight: 500; }

.page-hero h1 { font-size: clamp(34px, 4.4vw, 52px); margin-bottom: 16px; position: relative; }

.page-hero h1 em { font-style: normal; color: var(--accent); }

.page-hero .lead { position: relative; color: color-mix(in oklch, var(--muted) 45%, var(--ink)); font-weight: 400; }

.page-hero .meta { position: relative; margin-top: 14px; }

/* ─── legal prose ──────────────────────────────────────────────── */
.legal-body { max-width: 780px; margin-inline: auto; }

.legal-body h2 {
  font-size: clamp(22px, 2.6vw, 28px); font-weight: 500;
  margin: 48px 0 14px; padding-top: 28px; border-top: 1px solid var(--border);
}

.legal-body h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

.legal-body h3 { font-size: 16.5px; font-weight: 600; margin: 24px 0 8px; }

.legal-body p { color: var(--ink); margin-bottom: 14px; }

.legal-body ul, .legal-body ol { margin: 0 0 14px; padding-left: 22px; color: var(--ink); }

.legal-body li { margin-bottom: 8px; }

.legal-body li::marker { color: var(--accent); }

.legal-body a { color: var(--accent); font-weight: 500; transition: color 0.2s ease; }

.legal-body a:hover { color: var(--accent-dark); text-decoration: underline; }

.legal-body strong { font-weight: 600; color: var(--fg); }

.legal-note {
  background: var(--rose); border: 1px solid var(--border); border-radius: var(--radius-card);
  padding: 22px 26px; margin: 28px 0; font-size: 14.5px; color: var(--ink);
}

.legal-note strong { color: var(--accent-dark); }

.legal-contact {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-card);
  box-shadow: var(--shadow-soft); padding: 28px 30px; margin-top: 40px;
}

.legal-contact h2 { border-top: 0; padding-top: 0; margin-top: 0; }

.legal-contact address { font-style: normal; line-height: 1.7; color: var(--ink); margin-bottom: 10px; }

/* ─── responsive: 1024px ───────────────────────────────────────── */
@media (max-width: 1024px) {
  .main-nav, .header-ctas { display: none; }
  .hamburger { display: flex; }
}

/* ─── responsive: 768px ────────────────────────────────────────── */
@media (max-width: 768px) {
  :root { --header-h: 68px; }
  body { padding-bottom: 54px; } /* clear the mobile CTA bar */
  .section { padding-block: 48px; }
  .page-hero { padding-block: 36px 44px; }
  .legal-body h2 { margin: 40px 0 12px; padding-top: 24px; }
  .legal-contact { padding: 24px 22px; }
  .wa-float { bottom: 76px; right: 16px; width: 52px; height: 52px; }
  .mobile-cta-bar { display: flex; }
  /* footer accordion */
  .footer-grid { grid-template-columns: 1fr; gap: 8px; padding-block: 48px 32px; }
  .f-col { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
  .f-acc {
    display: flex; width: 100%; align-items: center; justify-content: space-between;
    background: none; border: 0; padding: 16px 0;
    color: var(--surface); font-size: 13px; font-weight: 600;
    letter-spacing: 0.1em; text-transform: uppercase;
  }
  .f-acc::after { content: '+'; font-size: 18px; color: var(--accent-2); transition: transform 0.25s ease; }
  .f-col.open .f-acc::after { transform: rotate(45deg); }
  .f-col h4 { display: none; }
  .f-col .f-list { display: none; padding-bottom: 18px; }
  .f-col.open .f-list { display: flex; }
  .footer-bottom { justify-content: center; text-align: center; }
}