/*
Theme Name:  Sabana Bakery
Theme URI:   https://sabanabakery.com
Author:      Juan David
Description: Tema custom para Sabana Bakery — panadería artesanal en Chía. Zero plugins.
Version:     1.0.0
Text Domain: sabana-bakery
*/

/* ==========================================================================
   DESIGN TOKENS — CSS Custom Properties
   ========================================================================== */

:root {
  /* Colores */
  --color-primary:                #343e4f;
  --color-primary-container:      #4b5567;
  --color-secondary:              #8d4f16;
  --color-secondary-fixed:        #ffdcc4;
  --color-background:             #fff9ee;
  --color-surface:                #fff9ee;
  --color-surface-container-low:  #faf3e5;
  --color-surface-container:      #f4eddf;
  --color-surface-container-high: #efe7d9;
  --color-surface-container-lowest: #ffffff;
  --color-on-surface:             #151c25;
  --color-on-surface-variant:     #45474c;
  --color-glass-nav:              rgba(245, 241, 232, 0.80);
  --color-whatsapp:               #25d366; /* Mantener para el botón flotante si se desea, pero los CTAs del Hero cambiarán */
  --color-cta-primary:            #8d4f16; /* Nuevo token para CTAs unificados */
  --color-error:                  #ba1a1a;

  /* Tipografía */
  --font-family: 'Montserrat', system-ui, sans-serif;
  --font-bold:     700;
  --font-semibold: 600;
  --font-medium:   500;
  --font-regular:  400;

  /* Escala tipográfica — mobile first */
  --text-h1:    2.5rem;   /* desktop: 5rem */
  --text-h2:    2rem;     /* desktop: 3rem */
  --text-h3:    1.25rem;  /* desktop: 1.5rem */
  --text-body:  1rem;
  --text-label: 0.75rem;
  --text-price: 1.125rem;
  --line-height: 1.6;

  /* Border radius */
  --radius-card:    1rem;
  --radius-section: 1.5rem;
  --radius-chip:    9999px;
  --radius-button:  0.75rem;

  /* Layout */
  --max-width: 1280px;
  --gutter:    1.5rem;

  /* Breakpoints (para referencia — usar en media queries directamente) */
  /* --bp-tablet:  768px  */
  /* --bp-desktop: 1280px */

  /* Elevación */
  --shadow-card:  0px 12px 32px rgba(47, 54, 64, 0.06);
  --shadow-float: 0px 24px 48px rgba(47, 54, 64, 0.10);

  /* Transiciones */
  --transition-fast: 0.15s ease;
  --transition-base: 0.3s ease;
}

/* ==========================================================================
   TIPOGRAFÍA — @font-face Montserrat self-hosted
   ========================================================================== */

@font-face {
  font-family: 'Montserrat';
  font-style:  normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/montserrat-v31-latin-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Montserrat';
  font-style:  normal;
  font-weight: 500;
  font-display: swap;
  src: url('assets/fonts/montserrat-v31-latin-500.woff2') format('woff2');
}

@font-face {
  font-family: 'Montserrat';
  font-style:  normal;
  font-weight: 600;
  font-display: swap;
  src: url('assets/fonts/montserrat-v31-latin-600.woff2') format('woff2');
}

@font-face {
  font-family: 'Montserrat';
  font-style:  normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/montserrat-v31-latin-700.woff2') format('woff2');
}
