/* Cléia Peixoto Moda Feminina — marca base (etapa 1, modo direto, 12/11/2026)
   Cores tiradas do logo do Instagram (script caramelo, "MODA FEMININA" rosa-antigo)
   e da loja real (parede creme com molduras em arco, sofá terracota, piso de madeira). */
:root {
  /* cor */
  --creme: #F7F1EA;        /* parede da loja: fundo principal */
  --linho: #EFE3D6;        /* fundo alternado */
  --areia: #E6D3BF;        /* fios, molduras, divisores */
  --cafe: #33241D;         /* texto e seções escuras (13,3:1 no creme) */
  --cafe-2: #6B5246;       /* texto secundário (6,4:1 no creme) */
  --caramelo: #C98B4E;     /* script do logo: decorativo e sobre o café (5,2:1) */
  --caramelo-texto: #8F5326; /* caramelo para texto no claro (5,5:1 no creme) */
  --terracota: #8A4529;    /* sofá da loja: botão principal (6,3:1 com creme) */
  --terracota-viva: #A4532F; /* hover do botão (4,9:1 com creme) */
  --rosa-antigo: #8C525A;  /* "MODA FEMININA" do logo: rótulos */

  /* tipografia */
  --f-script: "Sacramento", "Segoe Script", cursive;     /* o nome, como no logo (traço contínuo) */
  --f-serif: "Cormorant", "Cormorant Garamond", Georgia, serif; /* títulos */
  --f-sans: "Jost", "Segoe UI", system-ui, sans-serif;   /* texto e versalete espaçado, como "MODA FEMININA" */

  --t-hero: clamp(3.4rem, 2rem + 6.2vw, 8.6rem);
  --t-h2: clamp(2.4rem, 1.6rem + 3.2vw, 4.8rem);
  --t-h3: clamp(1.5rem, 1.2rem + 1vw, 2.1rem);
  --t-script-xl: clamp(4.5rem, 1.5rem + 9vw, 11.5rem);
  --t-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --t-small: 0.875rem;
  --t-label: 0.78rem;
  --track-label: 0.32em;

  /* espaço (8 pt) */
  --s-1: 0.5rem; --s-2: 1rem; --s-3: 1.5rem; --s-4: 2rem; --s-5: 3rem;
  --s-6: 4rem; --s-7: 6rem; --s-8: 8rem; --s-9: 10rem;
  --margem: clamp(1.25rem, 4.5vw, 5rem);
  --largura: 1320px;

  /* forma: o arco das molduras da parede da loja */
  --arco: 999px 999px 0 0;
  --raio: 2px;

  /* motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
  --t-rapido: 180ms;
  --t-medio: 420ms;
  --t-lento: 900ms;
  --stagger: 70ms;

  --sombra: 0 24px 60px -28px rgba(51, 36, 29, 0.35);
}