/* ============================================================
   GT Sport Cars — piel sobre la web de HCC   (maqueta v1 · 14/10/2026)
   Se carga DESPUÉS de style.css. Misma web, mismo código; solo cambia:
   - Colores: grafito y naranja (los rojos de style.css ya pasados a naranja).
   - Botones y selecciones con el estilo del programa (GUIA_ESTILO v2):
     semirredondeados, borde del color, degradado translúcido y brillo.
   - Paneles con 3 niveles de altura (sombras y luz superior = efecto 3D).
   - Pie con foto casi apagada (volante), como la web antigua de GT.
   ============================================================ */
:root {
  --radius: 10px;
  --or: #D9530E; --or-claro: #F7A56B; --or-glow: rgba(217,83,14,.55);
  /* Niveles: 0 fondo · 1 panel · 2 bloque dentro del panel (hundido) · 3 flotante */
  --n1: linear-gradient(180deg, #2B2F34 0%, #24272B 100%);
  --n1-sombra: inset 0 1px 0 rgba(255,255,255,.07), 0 1px 0 rgba(0,0,0,.35), 0 22px 40px -20px rgba(0,0,0,.85);
  --n2: linear-gradient(180deg, #1D2023 0%, #212428 100%);
  --n2-sombra: inset 0 2px 7px rgba(0,0,0,.5), inset 0 -1px 0 rgba(255,255,255,.04);
  --n3-sombra: inset 0 1px 0 rgba(255,255,255,.09), 0 28px 60px -22px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.04);
}
.ck-bar { display: none !important; }      /* maqueta: sin aviso de cookies */
.hero-fx { display: none !important; }     /* los destellos iban sobre los faros de la foto de HCC */

/* ---------- Nivel 0: fondo con un poco de luz arriba ---------- */
body { background: radial-gradient(1400px 700px at 50% -260px, #2A2E33 0%, rgba(27,29,32,0) 70%), #1B1D20; }

/* ---------- Nivel 1: paneles y tarjetas ---------- */
.panel, .card, .sede, .summary, .ticket, .dudas, .faq-tema {
  background: var(--n1); border: 1px solid #383C42; border-top-color: #4B5158; box-shadow: var(--n1-sombra); }
.site-header { box-shadow: 0 10px 30px -18px rgba(0,0,0,.9); }

/* ---------- Nivel 2: bloques dentro de un panel (hundidos) ---------- */
#cRes .res-card, .com-cupon, .res-panel, .regalo-box, .desc-box, .imagen-box, .pp-box {
  background: var(--n2); border: 1px solid #33373C; box-shadow: var(--n2-sombra); }
.panel .opt { background: var(--n2); box-shadow: var(--n2-sombra); border-width: 1px; border-color: #3A3F45; }

/* ---------- Nivel 3: lo que flota (resumen lateral, barra móvil) ---------- */
.sticky-side, .summary.sticky-side, .mbar { box-shadow: var(--n3-sombra); }

/* ---------- Experiencias: brillo naranja suave ---------- */
.card { box-shadow: var(--n1-sombra), 0 0 0 1px rgba(217,83,14,.10), 0 12px 34px -18px var(--or-glow); }
.card:hover { border-color: var(--or); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(217,83,14,.35), 0 18px 44px -14px rgba(217,83,14,.7); }
.price { color: var(--or-claro); }
.card h3 { color: var(--fg); }

/* ---------- Botones (estilo del programa) ---------- */
.btn { border-radius: 10px; border: 1px solid rgba(255,170,110,.45); color: #FFF3EA;
  background: linear-gradient(180deg, #D9530E 0%, #9E3A08 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 20px -12px var(--or-glow); text-shadow: 0 1px 0 rgba(0,0,0,.25); }
.btn:hover { color: #fff; background: linear-gradient(180deg, #EE6A1F 0%, #B8450B 100%); border-color: #FFB27A;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 0 1px rgba(217,83,14,.35), 0 12px 28px -10px rgba(217,83,14,.85); }
.btn.ghost, .btn.neutro { color: #E7E8E9; border-color: rgba(255,255,255,.2); background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)); box-shadow: inset 0 1px 0 rgba(255,255,255,.07); text-shadow: none; }
.btn.ghost:hover, .btn.neutro:hover { color: #fff; border-color: var(--or); background: linear-gradient(180deg, rgba(217,83,14,.32), rgba(217,83,14,.14)); box-shadow: 0 0 0 1px rgba(217,83,14,.25), 0 10px 24px -12px var(--or-glow); }
.btn.azul, .btn.verde, .btn.salir, .btn.anular { text-shadow: none; }
.nav .btn.nav-res { color: #FFF3EA; }
.btnres, .faq-a .btnres { border-radius: 10px; background: linear-gradient(180deg, #D9530E, #9E3A08); }

/* ---------- Selecciones: degradado translúcido + borde + brillo (nunca sólido) ---------- */
.opt { border-radius: 10px; }
.opt[aria-pressed="true"], .panel .opt[aria-pressed="true"] { border-color: var(--or); color: var(--fg);
  background: linear-gradient(180deg, rgba(217,83,14,.32), rgba(217,83,14,.13));
  box-shadow: 0 0 0 1px rgba(217,83,14,.3), 0 8px 20px -10px rgba(217,83,14,.9), inset 0 1px 0 rgba(255,255,255,.08); }
.opt:hover { border-color: rgba(217,83,14,.7); }

/* ---------- Píldoras (sedes, coches): chip del programa, no redonda ni mate ---------- */
.pill { border-radius: 6px; color: #FFD9BE; border-color: rgba(217,83,14,.55);
  background: linear-gradient(180deg, rgba(217,83,14,.26), rgba(217,83,14,.10)); box-shadow: 0 0 14px -6px rgba(217,83,14,.8), inset 0 1px 0 rgba(255,255,255,.06); }
.sede .row .pill + .pill { color: #CFE0FF; border-color: rgba(96,150,255,.5); background: linear-gradient(180deg, rgba(59,130,246,.24), rgba(30,64,175,.12)); box-shadow: 0 0 14px -6px rgba(59,130,246,.7), inset 0 1px 0 rgba(255,255,255,.06); }
.pill.ok { border-radius: 6px; }
.tag { border-radius: 6px; background: linear-gradient(180deg, #D9530E, #9E3A08); box-shadow: 0 4px 14px -4px rgba(0,0,0,.6); }
.chip-fecha { border-radius: 8px; }

/* ---------- Sedes en grande: próxima fecha destacada ---------- */
.prox-grande b.prox, b.prox { color: var(--or-claro); text-shadow: 0 0 18px rgba(217,83,14,.45); }
.sede img { filter: saturate(1.05) contrast(1.05); }

/* ---------- Pie con foto apagada (volante) ---------- */
.site-footer { position: relative; isolation: isolate; border-top: 1px solid #383C42;
  background: linear-gradient(180deg, rgba(12,13,14,.82), rgba(12,13,14,.94)), url(../../img/interior.jpg) center 35% / cover no-repeat, #0C0D0E; }
.site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--or), transparent); opacity: .8; }
.resenas { display: none !important; }   /* las reseñas de Google son de HCC: GT tendrá las suyas */