/* =========================================================
   Chocolatier Doces & Café — tokens de design
   Cores tiradas do logo e das fotos do salão.
   ========================================================= */

@font-face {
  font-family: "Fraunces";
  /* Fraunces instanciada: SOFT=100 e WONK=0 fixos, eixos opsz e wght livres (400–700) */
  src: url("../assets/fonts/fraunces-soft.woff2") format("woff2-variations");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fraunces";
  src: url("../assets/fonts/fraunces-soft-italic.woff2") format("woff2-variations");
  font-weight: 400 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  src: url("../assets/fonts/manrope-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Paleta da casa */
  --rosa-parede: #F6D3D9;   /* paredes do salão — fundo principal */
  --rosa-quente: #F3C2CC;   /* parte de baixo do gradiente do hero */
  --rosa-cadeira: #F1B9C6;  /* cadeiras e balões — superfícies */
  --cerejeira: #E64B6B;     /* flores da parede — destaques gráficos */
  --cerejeira-texto: #A3324F; /* versão AA para texto sobre rosa */
  --cereja: #B0122E;        /* cerejas da floresta negra — detalhe pontual */
  --cacau: #4A2A22;         /* traço do logo — texto e botões */
  --cacau-suave: #6E4A40;   /* texto secundário */
  --ganache: #2A1611;       /* seções escuras e rodapé */
  --caramelo: #C98A3D;      /* detalhes quentes (gráficos) */
  --caramelo-texto: #8A5320;/* preço — AA sobre creme e rosa */
  --neon: #FFB04A;          /* neon ondulado do salão */
  --madeira: #B9835A;       /* mesas */
  --salvia: #D3DED7;        /* parede menta — respiro */
  --creme: #FFF7F2;         /* porcelana */

  /* Tipografia */
  --f-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --f-texto: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  --t-hero: clamp(2.75rem, 11.5vw, 5.75rem);
  --t-h2: clamp(2.1rem, 8vw, 3.75rem);
  --t-h3: clamp(1.35rem, 4.6vw, 1.75rem);
  --t-lead: clamp(1.05rem, 3.6vw, 1.25rem);
  --t-corpo: 1rem;
  --t-pequeno: 0.875rem;

  /* Espaço */
  --gutter: 20px;
  --secao: clamp(72px, 14vw, 140px);
  --largura: 1180px;

  /* Raios — a hierarquia é intencional:
     arco = foto de produto, pílula = ação, suave = superfícies */
  --raio-arco: 999px 999px 28px 28px;
  --raio-pilula: 999px;
  --raio-suave: 22px;
  --raio-mini: 12px;

  /* Sombras quentes (nunca cinza) */
  --sombra-1: 0 1px 0 rgba(74, 42, 34, .06), 0 10px 24px -14px rgba(74, 42, 34, .35);
  --sombra-2: 0 30px 60px -30px rgba(74, 42, 34, .45);
  --brilho-neon: drop-shadow(0 0 2px #FFD9A0) drop-shadow(0 0 6px rgba(255, 176, 74, .9)) drop-shadow(0 0 16px rgba(255, 150, 40, .55));

  /* Movimento */
  --ease-saida: cubic-bezier(.2, .8, .2, 1);
  --ease-mola: cubic-bezier(.34, 1.56, .64, 1);

  /* Alturas fixas da interface */
  --header-h: 64px;
  --dock-h: 72px;

  /* Textura de papel (ruído SVG) */
  --papel: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .29 0 0 0 0 .16 0 0 0 0 .13 0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

@media (min-width: 768px) {
  :root { --gutter: 32px; }
}
@media (min-width: 1024px) {
  :root { --gutter: 48px; --header-h: 76px; }
}