/* CSV65 · Sistema definitivo de píldoras y botones
   Capa final de consistencia visual. No altera contenido, enlaces, JS ni CTA naranjas. */
:root{
  --csv-pill-navy:#082b4d;
  --csv-pill-blue-top:#65caff;
  --csv-pill-blue-mid:#0868df;
  --csv-pill-blue-bottom:#043a9f;
  --csv-pill-gold:#d7a52e;
  --csv-pill-gold-dark:#85570a;
}

/* Base común: geometría, legibilidad y contenido siempre por encima del brillo. */
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill){
  position:relative!important;
  isolation:isolate!important;
  opacity:1!important;
  font-weight:800!important;
  line-height:1.15!important;
  text-decoration:none!important;
  -webkit-font-smoothing:antialiased;
}
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill)>*{
  position:relative!important;
  z-index:3!important;
  opacity:1!important;
}

/* BLANCAS · texto azul oscuro, marco dorado, volumen y brillo plástico. */
:where(a.btn.outline,button.btn.outline,.utility-pill:not(.csv-object--call),
.csv-object--route.btn.outline,body.centro-viajero .traveler-actions>a,
body.centro-viajero .touch-action){
  color:var(--csv-pill-navy)!important;
  -webkit-text-fill-color:var(--csv-pill-navy)!important;
  border:1.5px solid var(--csv-pill-gold)!important;
  background:
    linear-gradient(180deg,#fff 0%,rgba(255,255,255,.98) 34%,#f2f6f9 66%,#dbe5ed 100%)!important;
  box-shadow:
    inset 0 3px 2px #fff,
    inset 0 -7px 13px rgba(8,43,77,.14),
    inset 0 0 0 2px rgba(255,255,255,.60),
    0 2px 0 var(--csv-pill-gold-dark),
    0 9px 18px rgba(3,22,42,.22),
    0 18px 34px rgba(190,139,27,.18)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.98)!important;
}
:where(a.btn.outline,button.btn.outline,.utility-pill:not(.csv-object--call),
.csv-object--route.btn.outline,body.centro-viajero .traveler-actions>a,
body.centro-viajero .touch-action):visited,
:where(a.btn.outline,button.btn.outline,.utility-pill:not(.csv-object--call),
.csv-object--route.btn.outline,body.centro-viajero .traveler-actions>a,
body.centro-viajero .touch-action) :where(span,strong,b,em,small,i,svg,use,path){
  color:var(--csv-pill-navy)!important;
  -webkit-text-fill-color:var(--csv-pill-navy)!important;
  stroke:currentColor!important;
  text-shadow:0 1px 0 rgba(255,255,255,.98)!important;
}

/* AZULES · azul corporativo uniforme y texto/iconos blancos. */
:where(a.btn.alt,button.btn.alt,a.btn.dark,button.btn.dark,
.csv-object--call,.csv-utility-actions .btn:not(.outline),
.csv-aenor-actions .btn:not(.outline),#informacion-oficial .actions .btn:not(.outline),
.services-section .actions .btn:not(.outline),.v-link,.v-call){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  border:1px solid rgba(255,255,255,.78)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,.10) 31%,transparent 48%),
    radial-gradient(120% 108% at 50% -10%,var(--csv-pill-blue-top) 0%,var(--csv-pill-blue-mid) 48%,var(--csv-pill-blue-bottom) 100%)!important;
  box-shadow:
    inset 0 2px 1px rgba(255,255,255,.92),
    inset 0 -6px 10px rgba(0,22,69,.30),
    inset 0 0 0 2px rgba(255,255,255,.14),
    0 2px 0 #032c7b,
    0 9px 16px rgba(6,23,43,.22),
    0 16px 32px rgba(14,111,224,.34)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.50)!important;
}
:where(a.btn.alt,button.btn.alt,a.btn.dark,button.btn.dark,
.csv-object--call,.csv-utility-actions .btn:not(.outline),
.csv-aenor-actions .btn:not(.outline),#informacion-oficial .actions .btn:not(.outline),
.services-section .actions .btn:not(.outline),.v-link,.v-call):visited,
:where(a.btn.alt,button.btn.alt,a.btn.dark,button.btn.dark,
.csv-object--call,.csv-utility-actions .btn:not(.outline),
.csv-aenor-actions .btn:not(.outline),#informacion-oficial .actions .btn:not(.outline),
.services-section .actions .btn:not(.outline),.v-link,.v-call) :where(span,strong,b,em,small,i,svg,use,path){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  stroke:currentColor!important;
}

/* NARANJAS · se conserva el acabado existente; solo se protege la lectura. */
:where(a.btn,button.btn):not(.alt):not(.outline):not(.dark):not(.nav-wa):not(.csv-object--whatsapp){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.55)!important;
}
:where(a.btn,button.btn):not(.alt):not(.outline):not(.dark):not(.nav-wa):not(.csv-object--whatsapp)
:where(span,strong,b,em,small,i,svg,use,path){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  stroke:currentColor!important;
}

/* WhatsApp mantiene su verde oficial y texto blanco. */
:where(.csv-object--whatsapp,.nav-wa,.wa-open),
:where(.csv-object--whatsapp,.nav-wa,.wa-open):visited,
:where(.csv-object--whatsapp,.nav-wa,.wa-open) :where(span,strong,b,em,small,i,svg,use,path){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  stroke:currentColor!important;
}

/* Interacciones coherentes sin desplazar la composición. */
@media (hover:hover){
  :where(a.btn.outline,button.btn.outline,.utility-pill:not(.csv-object--call),
  body.centro-viajero .traveler-actions>a,body.centro-viajero .touch-action):hover{
    transform:translateY(-3px) scale(1.01)!important;
    filter:brightness(1.025)!important;
  }
}
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.v-link,.v-call,.nav-wa,.wa-open):focus-visible{
  outline:3px solid #fff!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 6px rgba(8,104,223,.38),0 14px 30px rgba(6,23,43,.25)!important;
}

@media(max-width:650px){
  :where(a.btn,button.btn,.utility-pill,.traveler-actions>a,.touch-action,.v-link){
    min-height:50px!important;
    line-height:1.16!important;
    text-align:center!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

/* ========================================================================== 
   CSV65 GOLD MASTER · CAPA PROTEGIDA CONTRA REGRESIONES
   --------------------------------------------------------------------------
   REGLAS BASE:
   1) No redefinir colores de texto de botones fuera de esta hoja.
   2) Mantener un mínimo táctil de 44 px y foco visible.
   3) Los CTA naranjas y WhatsApp conservan su identidad cromática.
   4) Cualquier variante nueva debe reutilizar estas variables.
   ========================================================================== */
:root{
  --csv-pill-radius:999px;
  --csv-pill-min-height:46px;
  --csv-pill-padding-block:.78rem;
  --csv-pill-padding-inline:1.25rem;
  --csv-pill-gap:.55rem;
  --csv-pill-font-size:clamp(.88rem,.82rem + .18vw,1rem);
  --csv-pill-transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,filter .22s ease,background-color .22s ease;
  --csv-focus-ring:#8fd3ff;
}

/* Geometría única para todos los controles de acción. */
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill){
  min-height:var(--csv-pill-min-height)!important;
  padding:var(--csv-pill-padding-block) var(--csv-pill-padding-inline)!important;
  border-radius:var(--csv-pill-radius)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:var(--csv-pill-gap)!important;
  max-width:100%;
  font-size:var(--csv-pill-font-size)!important;
  letter-spacing:.012em!important;
  transition:var(--csv-pill-transition)!important;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

/* Evita iconos deformados y desplazamientos verticales. */
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill) :where(svg,img,.icon,.csv-icon){
  flex:0 0 auto!important;
  width:1.15em;
  height:1.15em;
  object-fit:contain;
}

/* Estado pulsado sin alterar el flujo ni provocar saltos de layout. */
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill):active{
  transform:translateY(1px) scale(.985)!important;
  filter:saturate(.98) brightness(.98)!important;
}

/* Foco WCAG: visible incluso sobre fondos claros, oscuros o fotográficos. */
:where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
.traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
.v-link,.v-call,.nav-wa,.wa-open,.repsol-pill):focus-visible{
  outline:3px solid var(--csv-focus-ring)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 6px rgba(255,255,255,.92),0 0 0 9px rgba(8,43,77,.72),0 14px 30px rgba(6,23,43,.24)!important;
}

/* Respeta preferencias de accesibilidad y reduce trabajo de composición. */
@media (prefers-reduced-motion:reduce){
  :where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
  .traveler-actions>a,.csv-object--call,.csv-object--route,.csv-object--official,
  .v-link,.v-call,.nav-wa,.wa-open,.repsol-pill){
    transition:none!important;
    animation:none!important;
    scroll-behavior:auto!important;
  }
}

@media(max-width:650px){
  :where(a.btn,button.btn,.utility-pill,.station-action,.touch-action,.touch-btn,
  .traveler-actions>a,.v-link,.v-call){
    width:auto;
    max-width:100%;
    min-height:48px!important;
    padding:.8rem 1.05rem!important;
  }
}