/**
 * Hub comensal / QR — tokens de superficie guest (no pisan la plataforma B2B).
 * Plataforma: axions-brand-tokens.css
 *
 * Variables --go-* son canónicas aquí.
 * Alias legacy --bg-beige / --card-white se mantienen para CSS del hub.
 * NO redefinir --bg-page / --bg-surface / --text-primary (SSOT de marca).
 */
:root {
  --go-font-body: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --go-font-display: "Cormorant Garamond", "Fraunces", Georgia, "Times New Roman",
    serif;
  --go-text-xs: 0.75rem;
  --go-text-sm: 0.875rem;
  --go-text-base: 1rem;
  --go-text-lg: 1.125rem;
  --go-text-xl: 1.25rem;
  --go-text-2xl: 1.5rem;

  /* Lienzo hospitality Atelier (piedra clara + matiz frío) */
  --go-bg: #eceaf0;
  --go-surface: #f7f6f9;
  --go-muted: #faf9fb;
  --go-text: #14161c;
  --go-text-muted: #5a5f6a;
  --go-border: #ddd9e2;
  --go-brand: #b89b6a;
  --go-brand-hover: #a68958;
  --go-signal: #3d8fd1;
  --go-signal-hover: #2f78b5;

  --go-success: #16a34a;
  --go-danger: #dc2626;
  --go-warning: #d97706;
  --go-info: #3d8fd1;

  /* Legacy names usados por CSS del hub (scoped por clases .go-*) */
  --bg-beige: var(--go-bg);
  --card-white: var(--go-surface);
  --text-onyx: var(--go-text);
  --text-muted: var(--go-text-muted);
  /* Legacy gold → accent del local si existe (--brand / --go-accent) */
  --axions-gold: var(--go-accent, var(--brand, var(--go-brand)));
  --gold-hover: var(--go-accent, var(--brand, var(--go-brand-hover)));
  --gold-light: var(--go-muted);
  --trust-teal: var(--go-brand);
  --trust-teal-soft: var(--go-muted);
  --border-light: var(--go-border);
  --border-input: var(--go-border);

  --fire-charcoal: var(--go-text);
  --fire-red: var(--go-danger);
  --fire-red-soft: #fee2e2;
  --fire-yellow: var(--go-brand);
  --fire-gradient: linear-gradient(90deg, var(--go-text) 0%, var(--go-brand) 100%);
  --fire-gradient-alt: linear-gradient(90deg, var(--go-brand) 0%, var(--go-text) 100%);
  --fire-gradient-success: linear-gradient(90deg, var(--go-success) 0%, #22c55e 100%);
  --fire-gradient-warn: linear-gradient(90deg, var(--go-warning) 0%, #f59e0b 100%);

  --shadow-sm: 0 1px 2px rgba(18, 18, 18, 0.04);
  --shadow-md: 0 4px 12px rgba(18, 18, 18, 0.06);
  --shadow-card-hover: 0 10px 25px rgba(0, 0, 0, 0.05);
  --shadow-btn: 0 8px 24px rgba(18, 18, 18, 0.12);
  --shadow-btn-violet: 0 8px 24px rgba(18, 18, 18, 0.12);
  --axions-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --axions-transition: all 0.2s ease;

  accent-color: var(--go-brand) !important;
}

/* Solo tipografía: no tocar colores de plataforma */
:root {
  --ax-font-body: var(--go-font-body);
  --ax-font-sans: var(--go-font-body);
}

::selection {
  background: var(--go-brand);
  color: #0b1220 !important;
}

::-moz-selection {
  background: var(--go-brand);
  color: #0b1220 !important;
}

*:focus:not(:focus-visible) {
  outline: none !important;
}

*:focus-visible {
  outline: 2px solid var(--go-brand) !important;
  outline-offset: 2px;
}

@keyframes go-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  15% {
    transform: translateX(-8px);
  }
  30% {
    transform: translateX(8px);
  }
  45% {
    transform: translateX(-6px);
  }
  60% {
    transform: translateX(6px);
  }
  75% {
    transform: translateX(-3px);
  }
  90% {
    transform: translateX(3px);
  }
}

.go-shake {
  animation: go-shake 0.5s ease-in-out;
}

.fire-gradient-icon {
  background: linear-gradient(145deg, var(--go-brand), var(--go-text));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.fire-gradient-bg {
  background: var(--fire-gradient);
}

.wh2-gradient-text {
  background: var(--fire-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.wh2-gradient-text--electric {
  background: var(--fire-gradient-alt);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
