/* ─────────────────────────────────────────────────────────────
   Landing Médicos Design System
   Color, type & elevation tokens — derived from the
   "Padrão Higuchi" medical-landing template (gold + ivory + serif)
   ───────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=DM+Sans:wght@400;500;600;700&display=swap');

:root {
  /* ── Brand color (Higuchi gold) ── */
  --gold:            #C5973B;   /* primary gold — buttons, accents, icon stroke */
  --gold-hover:      #B8860B;   /* hover/active darker gold, also used for body-on-gold text */
  --gold-deep:       #A07608;   /* darkest gold, used in shape gradients */
  --gold-light:      #D4A94A;   /* lighter gold, gradient secondary */
  --gold-soft:       #FFF8EC;   /* gold-tinted callout background */
  --gold-translucent:rgba(197, 151, 59, 0.35); /* #C5973B59 — card borders on dark */

  /* ── Neutrals ── */
  --ink:             #1A1A1A;   /* primary text / "dark-text" */
  --ink-strong:      #2C2C2C;   /* body strong, also dark surface fill */
  --ink-body:        #555555;   /* paragraph body */
  --ink-mute:        #666666;   /* body-light, captions, card description */
  --ink-soft:        #888888;   /* small meta — CRM line, footer copy */
  --ink-faint:       #AAAAAA;   /* labels on dark surfaces, e.g. "Nota no Google" */
  --ink-on-dark:     #CCCCCC;   /* list text in dark footer */
  --paper:           #FFFFFF;
  --paper-warm:      #FAFAF8;   /* icon-circle interior */

  /* ── Surfaces ── */
  --bg-default:      #FFFFFF;
  --bg-cream:        #F8F5F0;   /* sintomas / about backdrop */
  --bg-cream-alt:    #F5F5F0;   /* credentials bar */
  --bg-dark:         #2C2C2C;   /* numbers card, footer */
  --bg-darker:       #1A1A1A;   /* footer copyright strip */

  /* ── Borders / dividers ── */
  --border-card:     #F0F0F0;   /* white-card 1px border */
  --border-soft:     #EEE8DF;   /* cream surface card border */
  --border-divider: #E8E4DD;    /* hairline dividers above cream bg */
  --border-rule:     #D8D4CD;   /* short vertical rules between credentials */

  /* ── Semantic accents ── */
  --star:            #F4B400;   /* Google review stars */
  --whatsapp:        #25D366;   /* WhatsApp brand green */
  --review-blue:     #4A90D9;
  --review-orange:   #E8913A;
  --review-green:    #6A9E5A;

  /* ── Type ── */
  --font-serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --font-sans:  'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Display headings */
  --display-1: 600 52px/108% var(--font-serif);   /* hero h1 desktop */
  --display-2: 400 38px/120% var(--font-serif);   /* section h2 */
  --display-3: 400 32px/120% var(--font-serif);   /* mobile section h2 */
  --display-num: 700 80px/1   var(--font-serif);  /* "5 Estrelas" / big numbers */

  /* Body */
  --body-lg:    400 18px/160% var(--font-sans);
  --body-md:    400 16px/162% var(--font-sans);
  --body-sm:    400 14px/22px var(--font-sans);
  --body-xs:    400 13px/150% var(--font-sans);
  --body-tiny:  400 11px/150% var(--font-sans);

  /* Labels — uppercase eyebrow style */
  --eyebrow-lg: 600 17px/1.5 var(--font-sans);
  --eyebrow-md: 600 13px/1.5 var(--font-sans);
  --eyebrow-sm: 400 12px/1.5 var(--font-sans);

  --tracking-eyebrow: 0.08em;
  --tracking-meta:    0.18em;

  /* ── Radii ── */
  --r-xs:   5px;
  --r-sm:   8px;
  --r-md:   10px;
  --r-lg:   14px;
  --r-xl:   16px;   /* rounded-2xl, cards */
  --r-2xl:  20px;   /* rounded-20, dark numbers card */
  --r-pill: 9999px;

  /* ── Shadows / elevation ── */
  --shadow-card:  0 2px 8px rgba(0, 0, 0, 0.04);                 /* white card resting */
  --shadow-hover: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --shadow-sm:    0 1px 2px 0 rgba(0, 0, 0, 0.05);               /* testimonial card */
  --shadow-md:    0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);

  /* ── Motion ── */
  --ease:      cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:  150ms;
  --dur-base:  300ms;

  /* ── Layout ── */
  --maxw-content: 1280px;   /* max-w-7xl */
  --maxw-narrow:  1152px;   /* max-w-6xl */
  --maxw-card:    906px;    /* dark numbers card */
  --pad-section-x-desktop: 32px;
  --pad-section-y-desktop: 80px;
}

/* ─── Semantic element styles ─────────────────────────────── */

html { scroll-behavior: smooth; }

body {
  color: var(--ink);
  background: var(--bg-default);
  font: var(--body-md);
  -webkit-font-smoothing: antialiased;
}

h1, .h1 {
  font: var(--display-1);
  font-variant-caps: small-caps;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
}

h2, .h2 {
  font: var(--display-2);
  font-variant-caps: small-caps;
  color: var(--ink);
  margin: 0;
}

h3, .h3 {
  font: 700 15px/18px var(--font-sans);
  color: var(--ink);
  margin: 0;
}

p { margin: 0; color: var(--ink-body); }

.eyebrow {
  font: var(--eyebrow-md);
  text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow);
  color: var(--ink);
}

.meta {
  font: var(--body-tiny);
  color: var(--ink-soft);
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--gold); }