/* Marina Pizza · Design tokens
   Single source of truth — color, type, scale, motion. */

:root{
  /* Color · brand */
  --c-fondo:        #F5EEDE;
  --c-fondo-2:      #F5E9DC;
  --c-fondo-3:      #EFE6D2;
  --c-primario:     #C8252B;
  --c-primario-h:   #A91E24;
  --c-primario-p:   #8C181D;
  --c-primario-s:   #FBE5E6;
  --c-texto:        #1A1410;
  --c-texto-2:      #3D332C;
  --c-texto-3:      #6B5E55;
  --c-texto-4:      #9C8F84;
  --c-acento:       #5A6240;
  --c-acento-s:     #E5E7DC;
  --c-white:        #FFFFFF;
  --c-paper:        #FAFAFA;

  /* Semantic */
  --c-success:      #5A6240;
  --c-danger:       #C8252B;
  --c-warning:      #C9892D;
  --c-info:         #2D6E7E;

  /* Type */
  --serif: "Playfair Display", "Times New Roman", serif;
  --body:  "Lora", Georgia, serif;

  /* Spacing scale · 4-pt grid */
  --s-0:   0;
  --s-1:   4px;
  --s-2:   8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-8:  32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;
  --s-24: 96px;
  --s-32: 128px;

  /* Radii */
  --r-xs:  2px;
  --r-sm:  4px;
  --r-md:  6px;
  --r-lg:  10px;
  --r-xl:  16px;
  --r-2xl: 24px;
  --r-full: 999px;

  /* Shadows · warm, low contrast */
  --sh-xs: 0 1px 0 rgba(26,20,16,0.04);
  --sh-sm: 0 1px 2px rgba(26,20,16,0.06), 0 1px 1px rgba(26,20,16,0.04);
  --sh-md: 0 4px 12px rgba(26,20,16,0.08), 0 2px 4px rgba(26,20,16,0.05);
  --sh-lg: 0 12px 32px rgba(26,20,16,0.10), 0 4px 8px rgba(26,20,16,0.06);
  --sh-xl: 0 28px 60px rgba(26,20,16,0.14), 0 8px 16px rgba(26,20,16,0.06);

  /* Motion */
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --ease-emph:    cubic-bezier(0.2, 0.9, 0.1, 1);
  --t-fast: 120ms;
  --t-base: 200ms;
  --t-slow: 320ms;
  --t-xl:   620ms;

  /* Borders */
  --bd-color:    rgba(26,20,16,0.10);
  --bd-color-2:  rgba(26,20,16,0.18);
  --bd-color-3:  rgba(26,20,16,0.30);
  --bd: 1px solid var(--bd-color);

  /* Layout */
  --container: 1240px;
  --gutter: clamp(20px, 4vw, 48px);

  /* Type scale (page-level) */
  --fs-display: clamp(48px, 7vw, 96px);
  --fs-h1:      clamp(36px, 5vw, 64px);
  --fs-h2:      clamp(28px, 3.6vw, 44px);
  --fs-h3:      clamp(22px, 2.4vw, 30px);
}

@media (prefers-reduced-motion: reduce){
  :root{
    --t-fast: 0ms;
    --t-base: 0ms;
    --t-slow: 0ms;
    --t-xl:   0ms;
  }
  *, *::before, *::after{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}