/* ============================================================
   DELÍCIAS GOURMET — BASE
   Variáveis, reset, tipografia e utilitários
   ============================================================ */

:root {
  /* ---------- Paleta ---------- */
  --rosa-nevoa:   #FDF6F7;   /* fundo geral, quase branco */
  --rosa-claro:   #FAE7EB;   /* rosa clarinho da identidade */
  --rosa-suave:   #F3CBD5;
  --rosa-medio:   #E79AAE;
  --rosa-forte:   #D9557B;   /* rosa forte da marca */
  --rosa-escuro:  #B23B5E;

  --dourado-escuro: #A67C1F;
  --dourado:        #C9A227;
  --dourado-claro:  #E9CD7E;
  --dourado-luz:    #F7EBC0;

  --branco:       #FFFFFF;
  --creme:        #FFFBF7;

  --tinta:        #3A2A30;   /* texto principal */
  --tinta-suave:  #6E5A61;   /* texto secundário */
  --tinta-fraca:  #9C8A90;

  /* ---------- Gradientes ---------- */
  /* Brilhante — para fundos de botões e selos */
  --grad-dourado: linear-gradient(135deg, #A67C1F 0%, #D4AF37 22%, #F7EBC0 45%, #D4AF37 68%, #A67C1F 100%);
  /* Mais fechado — para TEXTO, onde o tom claro perderia legibilidade */
  --grad-dourado-texto: linear-gradient(120deg, #8A6414 0%, #B8912A 30%, #D9B84A 50%, #B8912A 72%, #8A6414 100%);
  --grad-rosa:    linear-gradient(135deg, #D9557B 0%, #E79AAE 100%);
  --grad-fundo:   linear-gradient(180deg, #FFFFFF 0%, #FDF6F7 100%);

  /* ---------- Tipografia ---------- */
  --font-titulo: 'Cormorant Garamond', 'Georgia', 'Times New Roman', serif;
  --font-corpo:  'Montserrat', 'Segoe UI', system-ui, -apple-system, sans-serif;

  /* ---------- Espaçamento ---------- */
  --secao-y:     clamp(4.5rem, 9vw, 8rem);
  --container:   1200px;
  --gutter:      clamp(1.25rem, 4vw, 2.5rem);

  /* ---------- Formas ---------- */
  --raio-sm: 10px;
  --raio:    18px;
  --raio-lg: 28px;
  --raio-xl: 40px;

  /* ---------- Sombras ---------- */
  --sombra-sm:  0 4px 14px rgba(178, 59, 94, .07);
  --sombra:     0 10px 30px rgba(178, 59, 94, .10);
  --sombra-lg:  0 24px 60px rgba(178, 59, 94, .16);
  --sombra-gold:0 12px 34px rgba(166, 124, 31, .28);

  /* ---------- Transições ---------- */
  --t-rapida: .2s cubic-bezier(.4, 0, .2, 1);
  --t:        .35s cubic-bezier(.4, 0, .2, 1);
  --t-lenta:  .6s cubic-bezier(.16, 1, .3, 1);

  --header-h: 78px;
}

/* ============================================================
   RESET
   ============================================================ */

*,
*::before,
*::after { box-sizing: border-box; }

* { margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-corpo);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
  color: var(--tinta);
  background: var(--rosa-nevoa);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

body.no-scroll { overflow: hidden; }

img,
picture,
video,
iframe { display: block; max-width: 100%; }

img { height: auto; }

button,
input,
textarea,
select {
  font: inherit;
  color: inherit;
}

button { background: none; border: 0; cursor: pointer; }

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

ul, ol { list-style: none; }

svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ============================================================
   TIPOGRAFIA
   ============================================================ */

h1, h2, h3, h4 {
  font-family: var(--font-titulo);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.01em;
  color: var(--tinta);
}

h1 { font-size: clamp(2.4rem, 5.6vw, 4.2rem); }
h2 { font-size: clamp(1.9rem, 4.2vw, 3.1rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.45rem); }

p { text-wrap: pretty; }

::selection {
  background: var(--rosa-forte);
  color: var(--branco);
}

/* Texto com acabamento dourado */
.text-gold {
  background: var(--grad-dourado-texto);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--dourado);
  font-style: italic;
}

/* ============================================================
   LAYOUT UTILITÁRIO
   ============================================================ */

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.container--narrow { max-width: 820px; }

.section { padding-block: var(--secao-y); position: relative; }

.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: center;
}

.skip-link {
  position: absolute;
  left: 50%;
  top: -60px;
  transform: translateX(-50%);
  z-index: 999;
  background: var(--rosa-forte);
  color: var(--branco);
  padding: .7rem 1.4rem;
  border-radius: 0 0 var(--raio-sm) var(--raio-sm);
  transition: top var(--t-rapida);
}
.skip-link:focus { top: 0; }

/* Foco visível e consistente */
:focus-visible {
  outline: 3px solid var(--rosa-forte);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ============================================================
   ANIMAÇÃO DE ENTRADA (scroll reveal)
   ============================================================ */

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity  .8s cubic-bezier(.16, 1, .3, 1),
    transform .8s cubic-bezier(.16, 1, .3, 1);
  transition-delay: calc(var(--d, 0) * 90ms);
  will-change: opacity, transform;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .reveal { opacity: 1; transform: none; }
}

/* ============================================================
   IMPRESSÃO
   ============================================================ */

@media print {
  .header, .fab-whats, .fab-top, .marquee, .hero__scroll { display: none !important; }
  body { background: #fff; }
  .reveal { opacity: 1; transform: none; }
}