/* ============================================================
   global.css — Dra. Amanda Ramos · AR Odontologia e Estética
   ✏️ EDITAR: Ajuste as variáveis em :root para mudar cores
   ============================================================ */

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

:root {
  /* Paleta extraída da logo */
  --primary:       #C4A99A;   /* bege rosado — cor dominante */
  --primary-deep:  #8B6F62;   /* marrom quente — letras A da logo */
  --primary-pale:  #F5EDE8;   /* creme claro */
  --secondary:     #1A1A1A;   /* preto line art */
  --accent:        #D4B5A8;   /* dourado rosado suave */
  --cream:         #FAF6F3;   /* fundo geral */
  --white:         #FFFFFF;
  --text:          #1A1A1A;
  --text-mid:      #5C4A42;
  --text-light:    #9E8880;

  /* Tipografia */
  --font-display:  'Playfair Display', Georgia, serif;
  --font-body:     'DM Sans', system-ui, sans-serif;
  --font-light:    'Cormorant Garamond', Georgia, serif;

  /* Espaçamentos */
  --section-pad:   96px 5%;
  --section-pad-m: 64px 5%;
  --radius:        12px;
  --radius-lg:     24px;
}

/* Reset */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--text);
  overflow-x: hidden;
  line-height: 1.6;
}

img {
  max-width: 100%;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
}

/* Títulos de seção */
.sec-label {
  display: inline-block;
  font-family: var(--font-body);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--primary-deep);
  margin-bottom: .75rem;
}

.sec-title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 4vw, 3rem);
  font-weight: 400;
  color: var(--secondary);
  line-height: 1.2;
  margin-bottom: 1rem;
}

.sec-title em {
  font-style: italic;
  color: var(--primary-deep);
}

.sec-body {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--text-mid);
  max-width: 540px;
  line-height: 1.75;
}

/* Fade-in via IntersectionObserver */
.fi {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .7s ease, transform .7s ease;
}
.fi.v {
  opacity: 1;
  transform: none;
}
.fi-d1 { transition-delay: .1s; }
.fi-d2 { transition-delay: .2s; }
.fi-d3 { transition-delay: .3s; }
.fi-d4 { transition-delay: .4s; }

@media (max-width: 600px) {
  :root {
    --section-pad:   56px 5%;
    --section-pad-m: 48px 5%;
  }
}