/* GENERADO por scripts/generar-tokens-css.rb desde packages/design-tokens/tokens.json (Romina v2). No editar a mano. */

@font-face {
  font-family: "Cinzel";
  src: url("../fonts/Cinzel-Variable.ttf") format("truetype-variations");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "EB Garamond";
  src: url("../fonts/EBGaramond-Variable.ttf") format("truetype-variations");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Allura";
  src: url("../fonts/Allura-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  src: url("../fonts/Manrope-Variable.ttf") format("truetype-variations");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --touch-target: 56px;
  --kiosk-tile: 200px;
  --container: 1200px;
  --radius-none: 0px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --border-hairline: 1px;
  --border-control: 1.5px;
  --border-accent: 2px;
  --font-display: "Cinzel", "Trajan Pro", Georgia, serif;
  --font-serif: "EB Garamond", Garamond, Georgia, serif;
  --font-script: "Allura", "Snell Roundhand", cursive;
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
}

[data-theme="claro"], :root {
  color-scheme: light;
  --bg: #faf6f0;
  --bg-raised: #fffdf9;
  --bg-sunken: #f2ece3;
  --bg-brand: #1d3127;
  --bg-brand-strong: #142419;
  --bg-sand: #dac29d;
  --overlay: rgba(20,36,25,0.55);
  --border: #e7dfd3;
  --border-strong: #968a79;
  --border-brand: #a67b39;
  --text: #1c2520;
  --text-muted: #5d625a;
  --text-brand: #142419;
  --text-accent: #7a5a24;
  --text-on-brand: #e4d7c5;
  --text-on-brand-muted: #b9c2b8;
  --text-link: #1d3127;
  --logo-verde: #142419;
  --logo-marfil: #e4d7c5;
  --logo-bronce: #a67b39;
  --accent: #a67b39;
  --accent-soft: #f1e6d4;
  --text-on-accent: #0b140f;
  --action-fill: #1d3127;
  --action-fill-hover: #2b4539;
  --action-text: #faf6f0;
  --focus-ring: #8a6428;
  --success: #1e6b5a;
  --warning: #8a5a12;
  --danger: #a8321f;
  --promo-fill: #a94c33;
  --text-on-promo: #fffdf9;
  --disabled-fill: #ece5da;
  --disabled-text: #9a9185;
  --local-bosque: #2c4f3f;
  --local-salvia: #9eb193;
  --local-terracota: #c36a4e;
  --local-durazno: #edd6b8;
  --local-ocre: #cda366;
  --local-rubor: #f1c8b8;
  --text-on-local: #101712;
  --text-on-local-dark: #faf6f0;
  --tenant-accent: var(--accent);
  --bg-wood: var(--bg-sand);
  --flamboyan-fill: var(--promo-fill);
  --text-on-flamboyan: var(--text-on-promo);
  --flamboyan: var(--danger);
  --ambar: var(--warning);
  --selva-soft: var(--success);
  --madera: var(--text-accent);
  --shadow-card: 0 1px 2px rgba(20,36,25,0.06), 0 6px 20px rgba(20,36,25,0.08);
  --shadow-raised: 0 4px 12px rgba(20,36,25,0.10), 0 16px 40px rgba(20,36,25,0.12);
  --shadow-focus: 0 0 0 2px #faf6f0, 0 0 0 5px #8a6428;
  --shadow-glow: var(--shadow-raised);
  --glass: rgba(255,253,249,0.72);
  --glass-border: rgba(28,37,32,0.08);
  --glass-hi: rgba(255,255,255,0.8);
  --glow-a: rgba(218,194,157,0.35);
  --glow-b: rgba(158,177,147,0.30);
  --glow-c: rgba(237,214,184,0.28);
}

[data-theme="oscuro"] {
  color-scheme: dark;
  --bg: #0f1a14;
  --bg-raised: #17251d;
  --bg-sunken: #0a130e;
  --bg-brand: #223a2e;
  --bg-brand-strong: #142419;
  --bg-sand: #3b3124;
  --overlay: rgba(5,10,7,0.72);
  --border: #2a3a31;
  --border-strong: #6f7d73;
  --border-brand: #c9a063;
  --text: #f1e9dd;
  --text-muted: #b7b3a7;
  --text-brand: #e4d7c5;
  --text-accent: #d4ae72;
  --text-on-brand: #e4d7c5;
  --text-on-brand-muted: #b9c2b8;
  --text-link: #e4d7c5;
  --logo-verde: #142419;
  --logo-marfil: #e4d7c5;
  --logo-bronce: #a67b39;
  --accent: #c9a063;
  --accent-soft: #2c3326;
  --text-on-accent: #0b140f;
  --action-fill: #e4d7c5;
  --action-fill-hover: #f1e9dd;
  --action-text: #142419;
  --focus-ring: #d4ae72;
  --success: #6cc2a4;
  --warning: #e0b060;
  --danger: #ef8a70;
  --promo-fill: #a94c33;
  --text-on-promo: #fffdf9;
  --disabled-fill: #1c2a22;
  --disabled-text: #5f6b63;
  --local-bosque: #2c4f3f;
  --local-salvia: #9eb193;
  --local-terracota: #c36a4e;
  --local-durazno: #edd6b8;
  --local-ocre: #cda366;
  --local-rubor: #f1c8b8;
  --text-on-local: #101712;
  --text-on-local-dark: #faf6f0;
  --tenant-accent: var(--accent);
  --bg-wood: var(--bg-sand);
  --flamboyan-fill: var(--promo-fill);
  --text-on-flamboyan: var(--text-on-promo);
  --flamboyan: var(--danger);
  --ambar: var(--warning);
  --selva-soft: var(--success);
  --madera: var(--text-accent);
  --shadow-card: 0 1px 0 rgba(0,0,0,0.5), 0 8px 24px rgba(0,0,0,0.4);
  --shadow-raised: 0 8px 32px rgba(0,0,0,0.55);
  --shadow-focus: 0 0 0 2px #0f1a14, 0 0 0 5px #d4ae72;
  --shadow-glow: var(--shadow-raised);
  --glass: rgba(23,37,29,0.72);
  --glass-border: rgba(241,233,221,0.10);
  --glass-hi: rgba(241,233,221,0.06);
  --glow-a: rgba(201,160,99,0.16);
  --glow-b: rgba(34,58,46,0.6);
  --glow-c: rgba(237,214,184,0.28);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: #0f1a14;
    --bg-raised: #17251d;
    --bg-sunken: #0a130e;
    --bg-brand: #223a2e;
    --bg-brand-strong: #142419;
    --bg-sand: #3b3124;
    --overlay: rgba(5,10,7,0.72);
    --border: #2a3a31;
    --border-strong: #6f7d73;
    --border-brand: #c9a063;
    --text: #f1e9dd;
    --text-muted: #b7b3a7;
    --text-brand: #e4d7c5;
    --text-accent: #d4ae72;
    --text-on-brand: #e4d7c5;
    --text-on-brand-muted: #b9c2b8;
    --text-link: #e4d7c5;
    --logo-verde: #142419;
    --logo-marfil: #e4d7c5;
    --logo-bronce: #a67b39;
    --accent: #c9a063;
    --accent-soft: #2c3326;
    --text-on-accent: #0b140f;
    --action-fill: #e4d7c5;
    --action-fill-hover: #f1e9dd;
    --action-text: #142419;
    --focus-ring: #d4ae72;
    --success: #6cc2a4;
    --warning: #e0b060;
    --danger: #ef8a70;
    --promo-fill: #a94c33;
    --text-on-promo: #fffdf9;
    --disabled-fill: #1c2a22;
    --disabled-text: #5f6b63;
    --local-bosque: #2c4f3f;
    --local-salvia: #9eb193;
    --local-terracota: #c36a4e;
    --local-durazno: #edd6b8;
    --local-ocre: #cda366;
    --local-rubor: #f1c8b8;
    --text-on-local: #101712;
    --text-on-local-dark: #faf6f0;
    --tenant-accent: var(--accent);
    --bg-wood: var(--bg-sand);
    --flamboyan-fill: var(--promo-fill);
    --text-on-flamboyan: var(--text-on-promo);
    --flamboyan: var(--danger);
    --ambar: var(--warning);
    --selva-soft: var(--success);
    --madera: var(--text-accent);
    --shadow-card: 0 1px 0 rgba(0,0,0,0.5), 0 8px 24px rgba(0,0,0,0.4);
    --shadow-raised: 0 8px 32px rgba(0,0,0,0.55);
    --shadow-focus: 0 0 0 2px #0f1a14, 0 0 0 5px #d4ae72;
    --shadow-glow: var(--shadow-raised);
    --glass: rgba(23,37,29,0.72);
    --glass-border: rgba(241,233,221,0.10);
    --glass-hi: rgba(241,233,221,0.06);
    --glow-a: rgba(201,160,99,0.16);
    --glow-b: rgba(34,58,46,0.6);
    --glow-c: rgba(237,214,184,0.28);
  }
}

.display-xl {
  font-family: var(--font-display);
  font-size: calc(64px * var(--escala-letra, 1));
  line-height: calc(68px * var(--escala-letra, 1));
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
.display-lg {
  font-family: var(--font-display);
  font-size: calc(40px * var(--escala-letra, 1));
  line-height: calc(48px * var(--escala-letra, 1));
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.display-md {
  font-family: var(--font-display);
  font-size: calc(28px * var(--escala-letra, 1));
  line-height: calc(36px * var(--escala-letra, 1));
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.display-sm {
  font-family: var(--font-display);
  font-size: calc(20px * var(--escala-letra, 1));
  line-height: calc(28px * var(--escala-letra, 1));
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.script-lg {
  font-family: var(--font-script);
  font-size: calc(44px * var(--escala-letra, 1));
  line-height: calc(52px * var(--escala-letra, 1));
  font-weight: 400;
}
.script-md {
  font-family: var(--font-script);
  font-size: calc(32px * var(--escala-letra, 1));
  line-height: calc(40px * var(--escala-letra, 1));
  font-weight: 400;
}
.lead {
  font-family: var(--font-serif);
  font-size: calc(22px * var(--escala-letra, 1));
  line-height: calc(32px * var(--escala-letra, 1));
  font-weight: 400;
}
.serif-body {
  font-family: var(--font-serif);
  font-size: calc(18px * var(--escala-letra, 1));
  line-height: calc(28px * var(--escala-letra, 1));
  font-weight: 400;
}
.eyebrow-lg {
  font-family: var(--font-sans);
  font-size: calc(14px * var(--escala-letra, 1));
  line-height: calc(20px * var(--escala-letra, 1));
  font-weight: 500;
  letter-spacing: 0.32em;
  text-transform: uppercase;
}
.eyebrow {
  font-family: var(--font-sans);
  font-size: calc(12px * var(--escala-letra, 1));
  line-height: calc(16px * var(--escala-letra, 1));
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.title-lg {
  font-family: var(--font-sans);
  font-size: calc(24px * var(--escala-letra, 1));
  line-height: calc(32px * var(--escala-letra, 1));
  font-weight: 700;
}
.title-md {
  font-family: var(--font-sans);
  font-size: calc(20px * var(--escala-letra, 1));
  line-height: calc(28px * var(--escala-letra, 1));
  font-weight: 700;
}
.title-sm {
  font-family: var(--font-sans);
  font-size: calc(16px * var(--escala-letra, 1));
  line-height: calc(24px * var(--escala-letra, 1));
  font-weight: 700;
}
.body-lg {
  font-family: var(--font-sans);
  font-size: calc(18px * var(--escala-letra, 1));
  line-height: calc(28px * var(--escala-letra, 1));
  font-weight: 400;
}
.body {
  font-family: var(--font-sans);
  font-size: calc(16px * var(--escala-letra, 1));
  line-height: calc(24px * var(--escala-letra, 1));
  font-weight: 400;
}
.body-sm {
  font-family: var(--font-sans);
  font-size: calc(14px * var(--escala-letra, 1));
  line-height: calc(20px * var(--escala-letra, 1));
  font-weight: 500;
}
.caption {
  font-family: var(--font-sans);
  font-size: calc(12px * var(--escala-letra, 1));
  line-height: calc(16px * var(--escala-letra, 1));
  font-weight: 600;
}
.button {
  font-family: var(--font-sans);
  font-size: calc(16px * var(--escala-letra, 1));
  line-height: calc(24px * var(--escala-letra, 1));
  font-weight: 700;
  letter-spacing: 0.01em;
}
.price {
  font-family: var(--font-sans);
  font-size: calc(20px * var(--escala-letra, 1));
  line-height: calc(28px * var(--escala-letra, 1));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.figure {
  font-family: var(--font-sans);
  font-size: calc(56px * var(--escala-letra, 1));
  line-height: calc(60px * var(--escala-letra, 1));
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.kiosk-title {
  font-family: var(--font-sans);
  font-size: calc(32px * var(--escala-letra, 1));
  line-height: calc(40px * var(--escala-letra, 1));
  font-weight: 700;
}
.kiosk-body {
  font-family: var(--font-sans);
  font-size: calc(22px * var(--escala-letra, 1));
  line-height: calc(32px * var(--escala-letra, 1));
  font-weight: 500;
}
.kiosk-price {
  font-family: var(--font-sans);
  font-size: calc(28px * var(--escala-letra, 1));
  line-height: calc(36px * var(--escala-letra, 1));
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}