/* SOURCE: csv75-premium-unificado.css */
/* CSV75 — Unificación Premium de tarjetas y controles
   Objetivo: dar profundidad coherente sin alterar estructura ni responsive. */
:root{
  --csv75-gold:#d5a11e;
  --csv75-gold-soft:rgba(213,161,30,.42);
  --csv75-ink:#07192d;
  --csv75-shadow:0 18px 42px rgba(4,20,38,.14),0 4px 12px rgba(4,20,38,.08);
  --csv75-shadow-hover:0 24px 54px rgba(4,20,38,.20),0 7px 18px rgba(4,20,38,.11);
}

/* Tarjetas / paneles principales: marco fino dorado + profundidad controlada */
:where(
  .card,.csv-premium-card,.panel,.help-card,.touch-card,.service-card,.quick-card,
  .contact-card,.alliance-card,.station-card,.promo,.promo-card,.intro-box,.cta,
  .form-shell,.csv-utility-card,.csv-trust-shell,.csv-station-cert,.v-card,
  .station-meta,.toggle-card,.fact,.notice,.warning,.step,.field
){
  border:1px solid var(--csv75-gold-soft)!important;
  box-shadow:var(--csv75-shadow)!important;
  outline:1px solid rgba(7,25,45,.07);
  outline-offset:-2px;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,filter .24s ease;
}

/* Marco interior muy sutil: aspecto de pieza acabada */
:where(.card,.csv-premium-card,.panel,.help-card,.touch-card,.service-card,.quick-card,
.contact-card,.alliance-card,.station-card,.promo,.promo-card,.intro-box,.cta,.form-shell,
.csv-utility-card,.csv-trust-shell,.csv-station-cert,.v-card){
  background-clip:padding-box;
}

@media (hover:hover) and (pointer:fine){
  :where(a.card,a.csv-premium-card,a.help-card,a.touch-card,a.service-card,a.quick-card,
  a.contact-card,a.station-card,a.csv-station-cert,.is-interactive.card,.is-interactive.csv-premium-card):hover{
    transform:translateY(-4px)!important;
    border-color:rgba(213,161,30,.78)!important;
    box-shadow:var(--csv75-shadow-hover)!important;
  }
}

/* Botones: mismo lenguaje visual premium, conservando sus colores funcionales */
:where(a.btn,button.btn,.station-action,.card-actions a,.touch-action,.csv-aenor-more){
  border:1px solid rgba(213,161,30,.62)!important;
  box-shadow:0 10px 24px rgba(4,20,38,.14),inset 0 1px 0 rgba(255,255,255,.42)!important;
  font-weight:800;
  letter-spacing:.005em;
}

:where(.btn.outline,.btn.alt){
  border-color:rgba(213,161,30,.72)!important;
  box-shadow:0 9px 22px rgba(4,20,38,.10),inset 0 1px 0 rgba(255,255,255,.9)!important;
}

:where(.btn.dark,.station-action.dark){
  border-color:rgba(213,161,30,.76)!important;
  box-shadow:0 12px 28px rgba(4,20,38,.22),inset 0 1px 0 rgba(255,255,255,.15)!important;
}

@media (hover:hover) and (pointer:fine){
  :where(a.btn,button.btn,.station-action,.card-actions a,.touch-action,.csv-aenor-more):hover{
    transform:translateY(-2px)!important;
    box-shadow:0 15px 32px rgba(4,20,38,.20),0 0 0 1px rgba(213,161,30,.18)!important;
  }
}

/* Píldoras/chips: profundidad menor para no competir con las tarjetas */
:where(.csv-pill--light,.csv-pill--navy,.service-chip,.help-chip,.utility-pill,.v-badge){
  border:1px solid rgba(213,161,30,.35)!important;
  box-shadow:0 7px 16px rgba(4,20,38,.08),inset 0 1px 0 rgba(255,255,255,.42)!important;
}

/* En móvil mantenemos profundidad, pero reducimos sombras para legibilidad y rendimiento */
@media(max-width:700px){
  :where(.card,.csv-premium-card,.panel,.help-card,.touch-card,.service-card,.quick-card,
  .contact-card,.alliance-card,.station-card,.promo,.promo-card,.intro-box,.cta,.form-shell,
  .csv-utility-card,.csv-trust-shell,.csv-station-cert,.v-card,.station-meta,.toggle-card,
  .fact,.notice,.warning,.step,.field){
    box-shadow:0 12px 26px rgba(4,20,38,.12),0 3px 8px rgba(4,20,38,.06)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  :where(.card,.csv-premium-card,.panel,.help-card,.touch-card,.service-card,.quick-card,
  .contact-card,.station-card,a.btn,button.btn,.station-action,.card-actions a){transition:none!important}
}


/* SOURCE: csv76-tarjetas-premium-cuadradas.css */
/* CSV76 — Tarjetas premium cuadradas
   Corrige exclusivamente las tarjetas de servicios que habían quedado
   como cápsulas/óvalos. No altera botones, badges ni controles. */

.service-chip{
  border-radius:16px !important;
  border:1px solid rgba(213,161,30,.46) !important;
  background:linear-gradient(155deg,#ffffff 0%,#fbfcfe 68%,#f5f8fb 100%) !important;
  box-shadow:
    0 18px 38px rgba(4,20,38,.13),
    0 4px 10px rgba(4,20,38,.07),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  outline:1px solid rgba(7,25,45,.07);
  outline-offset:-2px;
  overflow:hidden;
}

.service-chip::after{
  border-radius:14px !important;
}

@media (hover:hover) and (pointer:fine){
  .service-chip:hover{
    transform:translateY(-4px) !important;
    border-color:rgba(213,161,30,.78) !important;
    box-shadow:
      0 24px 50px rgba(4,20,38,.18),
      0 7px 16px rgba(4,20,38,.10),
      inset 0 1px 0 rgba(255,255,255,.98) !important;
  }
}

/* En móvil mantenemos el aspecto de tarjeta, sin volverla ovalada. */
@media(max-width:700px){
  .service-chip{
    border-radius:15px !important;
    box-shadow:
      0 12px 26px rgba(4,20,38,.12),
      0 3px 8px rgba(4,20,38,.06) !important;
  }
  .service-chip::after{
    border-radius:13px !important;
  }
}


/* SOURCE: csv79-regresiones-mobile.css */

/* CSV79 — Reparación de regresiones móviles y coherencia visual
   Capa final deliberadamente específica. No modifica el módulo de precios CSV77. */

:root{
  --csv79-navy:#082b4d;
  --csv79-navy-deep:#06172b;
  --csv79-gold:#d5a11e;
  --csv79-alert-bg:#fff7df;
  --csv79-alert-ink:#493100;
}

/* REGLA DEFINITIVA DE PÍLDORAS
   Blanca = texto azul. Azul = texto blanco. */
.csv-pill--light,
.csv-pill--light:visited{
  color:var(--csv79-navy)!important;
  -webkit-text-fill-color:var(--csv79-navy)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 48%,#e9f0f6 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.95)!important;
}
.csv-pill--light :is(span,strong,b,em,small,i,svg,path,use){
  color:var(--csv79-navy)!important;
  -webkit-text-fill-color:var(--csv79-navy)!important;
  stroke:currentColor!important;
}
.csv-pill--navy,
.csv-pill--navy:visited,
a.btn.alt.csv-pill--navy,
a.btn.dark.csv-pill--navy{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:linear-gradient(180deg,#276aa8 0%,#124f87 46%,#082b4d 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.48)!important;
}
.csv-pill--navy :is(span,strong,b,em,small,i,svg,path,use){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  stroke:currentColor!important;
}

/* Aviso operacional visible */
.csv-service-alert{
  position:relative;
  z-index:15;
  background:linear-gradient(180deg,#fffaf0,#fff2cb);
  border-top:1px solid rgba(213,161,30,.55);
  border-bottom:1px solid rgba(213,161,30,.68);
  color:var(--csv79-alert-ink);
}
.csv-service-alert .wrap{
  padding:14px 0;
  display:flex;
  align-items:center;
  gap:12px;
}
.csv-service-alert__icon{
  flex:0 0 36px;width:36px;height:36px;border-radius:50%;
  display:grid;place-items:center;
  background:#f5b400;color:#2f2200;font-weight:950;font-size:1.15rem;
  box-shadow:0 5px 14px rgba(111,77,0,.18);
}
.csv-service-alert__copy{min-width:0;line-height:1.35;font-size:.94rem}
.csv-service-alert__copy strong{display:block;color:#382700;margin-bottom:2px}
.csv-service-alert__copy a{font-weight:900;text-decoration:underline;text-underline-offset:2px}

/* HOME: imagen corporativa completa, sin franja vacía */
body .hero-card.csv-brand-plaque .csv-logo-stage{
  width:100%!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  min-height:0!important;
  background:#efe5d2!important;
  overflow:hidden!important;
}
body .hero-card.csv-brand-plaque .csv-logo-stage > .csv-logo-main{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:none!important;
  margin:0!important;
}

/* NUESTRA HISTORIA: anula alturas/resizes históricos */
body.csv69-story-page .hero{
  min-height:0!important;
  height:auto!important;
  display:block!important;
  overflow:hidden!important;
  padding:58px 0 52px!important;
}
body.csv69-story-page .hero > .wrap.hero-grid{
  min-height:0!important;
  height:auto!important;
  align-items:center!important;
}
body.csv69-story-page .hero-mark{
  width:min(100%,420px)!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  padding:14px!important;
  margin:0 auto!important;
  transform:none!important;
  overflow:hidden!important;
}
body.csv69-story-page .hero-mark > img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:none!important;
}
body.csv69-story-page main,
body.csv69-story-page main>section{
  min-height:0!important;
}

/* Movilidad: píldora blanca legible y botones de teléfono con etiqueta */
body.movilidad-asistencia .traveler-actions .csv-pill--light{
  color:var(--csv79-navy)!important;
  -webkit-text-fill-color:var(--csv79-navy)!important;
}
body.movilidad-asistencia .utility-strip .csv-object--call{
  width:auto!important;
  min-width:150px!important;
  padding:.75rem 1rem!important;
  gap:9px!important;
}
body.movilidad-asistencia .utility-strip .csv-object--call .csv-call-premium-icon{
  width:46px!important;height:46px!important;
}

/* WhatsApp flotante: evita tapar el último control útil */
.floatbar{bottom:max(18px,env(safe-area-inset-bottom))!important}
@media(max-width:700px){
  .floatbar{right:14px!important}
}

/* Evita huecos heredados por min-height en móvil, salvo componentes que realmente lo requieren */
@media(max-width:700px){
  body.csv69-story-page .hero,
  body.csv69-story-page .hero-grid,
  body.csv69-story-page .hero-mark,
  body.csv69-story-page main>section{
    min-height:0!important;
  }
  body.csv69-story-page .hero-grid{
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  body.csv69-story-page .hero-mark{
    max-width:330px!important;
  }
  body.csv69-story-page .hero h1{
    font-size:clamp(2.5rem,12vw,3.5rem)!important;
  }
  .csv-service-alert .wrap{padding:11px 0;align-items:flex-start}
  .csv-service-alert__copy{font-size:.88rem}
}

/* Header: la capa JS añade csv79-header-up al detectar subida. */
header,.site-header,.header{
  will-change:transform;
}
body.csv79-header-up header,
body.csv79-header-up .site-header,
body.csv79-header-up .header{
  transform:translateY(0)!important;
}


/* SOURCE: csv83-nav-mobile.css */
/* CSV83 — navegación móvil única y corrección iPhone/Safari */
@media(max-width:900px){
  body>header{
    position:sticky!important;top:0!important;z-index:1200!important;
    transform:translate3d(0,0,0)!important;
    transition:transform .24s cubic-bezier(.22,.61,.36,1)!important;
    pointer-events:auto!important;visibility:visible!important;opacity:1!important;
  }
  body>header.csv83-hidden{transform:translate3d(0,-105%,0)!important}
  body>header.csv83-visible{transform:translate3d(0,0,0)!important}
  body>header .nav{position:relative!important;z-index:1!important}
  body>header .menu-toggle,body>header .brand,body>header .nav-wa{pointer-events:auto!important;touch-action:manipulation!important}

  /* iOS: no congelar todo el body al abrir el menú. */
  body.menu-open{overflow:visible!important;touch-action:auto!important}
  body>header .menu{
    position:fixed!important;
    top:calc(var(--csv-header-h,88px) + env(safe-area-inset-top,0px))!important;
    left:12px!important;right:12px!important;bottom:auto!important;
    max-height:calc(100dvh - var(--csv-header-h,88px) - 24px)!important;
    overflow:auto!important;-webkit-overflow-scrolling:touch!important;
    z-index:1210!important;pointer-events:auto!important;
    background:rgba(255,255,255,.985)!important;
  }
  body>header .menu.open{display:flex!important}
  body>header .menu a{pointer-events:auto!important;touch-action:manipulation!important;color:#435064!important}

  /* Salud / contactos: reserva columna real para el icono y evita números cortados. */
  .traveler-page .v-list .v-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 78px!important;
    grid-template-rows:auto auto!important;
    column-gap:12px!important;row-gap:8px!important;
    align-items:center!important;
    padding:20px 16px 20px 20px!important;
    min-width:0!important;overflow:hidden!important;
  }
  .traveler-page .v-list .v-row>b{grid-column:1!important;grid-row:1!important;min-width:0!important}
  .traveler-page .v-list .v-row>span{
    grid-column:1!important;grid-row:2!important;min-width:0!important;max-width:100%!important;
    white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;line-height:1.35!important;
  }
  .traveler-page .v-list .v-row>a.csv-object--call{
    grid-column:2!important;grid-row:1/span 2!important;
    width:70px!important;height:70px!important;min-width:70px!important;
    padding:0!important;display:grid!important;place-items:center!important;justify-self:center!important;align-self:center!important;
  }
  .traveler-page .v-list .v-row>a.csv-object--call .csv-call-premium-icon{width:66px!important;height:66px!important;max-width:66px!important}
}

/* Landscape: evitar alturas heredadas y lienzos vacíos en iPhone. */
@media(max-width:950px) and (orientation:landscape){
  html,body{min-height:100%!important;height:auto!important}
  main,main>section,.hero,.traveler-hero{min-height:0!important;height:auto!important}
  body>header .menu{top:72px!important;max-height:calc(100dvh - 84px)!important}
}


/* SOURCE: csv86-1-contraste-pildoras-footer.css */
/* CSV86.1 — corrección quirúrgica de contraste y logo footer.
   No altera estructura, layout, navegación, precios, responsive ni contenidos. */
:root{--csv861-navy:#082b4d;}

/* Píldora clara: SIEMPRE fondo claro + texto azul oscuro. */
a.csv-pill--light,
a.csv-pill--light:link,
a.csv-pill--light:visited,
button.csv-pill--light,
.btn.csv-pill--light,
.btn.alt.csv-pill--light,
.btn.dark.csv-pill--light,
.btn.outline.csv-pill--light{
  color:var(--csv861-navy)!important;
  -webkit-text-fill-color:var(--csv861-navy)!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 52%,#e9f0f6 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
  text-shadow:none!important;
}
.csv-pill--light :is(span,strong,b,em,small,i){
  color:var(--csv861-navy)!important;
  -webkit-text-fill-color:var(--csv861-navy)!important;
  text-shadow:none!important;
}
.csv-pill--light :is(svg,path,use){color:var(--csv861-navy)!important;stroke:currentColor!important;}

/* Píldora azul: SIEMPRE fondo azul + texto blanco. */
a.csv-pill--navy,
a.csv-pill--navy:link,
a.csv-pill--navy:visited,
button.csv-pill--navy,
.btn.csv-pill--navy,
.btn.alt.csv-pill--navy,
.btn.dark.csv-pill--navy,
.btn.outline.csv-pill--navy{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:linear-gradient(180deg,#276aa8 0%,#124f87 46%,#082b4d 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
}
.csv-pill--navy :is(span,strong,b,em,small,i){color:#fff!important;-webkit-text-fill-color:#fff!important;}
.csv-pill--navy :is(svg,path,use){color:#fff!important;stroke:currentColor!important;}

/* Centro de ayuda/footer: el PNG/WebP del logo es transparente; no crear placa blanca. */
footer .footer-grid>div:first-child>img,
footer img[src*="csv-logo-premium"],
footer img[alt="CSV Vinromà"]{
  background:transparent!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}


/* SOURCE: csv86-4-ajustes-finales.css */
/* CSV86.4 — ajustes finales verificados.
   Alcance: 1) proporción de logotipo CSV en footers legacy;
            2) alineación/legibilidad de acciones de asistencia mecánica.
   No modifica navegación, contenidos, precios, formularios ni scripts. */

/* Footers antiguos con el logo como <img> directo: limitar tamaño y preservar proporción. */
footer .footer-grid > div:first-child > img[src*="csv-logo-premium"]{
  display:block!important;
  width:min(220px,100%)!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  max-width:220px!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:left center!important;
  margin:0 0 18px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  transform:none!important;
}

/* Movilidad y asistencia: las tres acciones deben formar una fila coherente.
   Se anula SOLO aquí la conversión global de los botones de llamada a círculos sueltos. */
.movilidad-asistencia .utility-strip{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:18px!important;
}
.movilidad-asistencia .utility-strip > a.utility-pill{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  min-height:78px!important;
  max-height:none!important;
  margin:0!important;
  padding:12px 18px!important;
  border-radius:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:14px!important;
  overflow:hidden!important;
  text-align:left!important;
}

/* Las llamadas 011/112 vuelven a ser píldoras completas con icono + texto legible. */
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--call{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.07) 34%,rgba(255,255,255,0) 50%),
    linear-gradient(180deg,#276aa8 0%,#124f87 48%,#082b4d 100%)!important;
  border:1px solid rgba(213,161,30,.72)!important;
  box-shadow:inset 0 2px 1px rgba(255,255,255,.75),inset 0 -4px 9px rgba(0,22,69,.24),0 8px 18px rgba(6,23,43,.20)!important;
}
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--call > img.csv-call-premium-icon{
  display:block!important;
  position:relative!important;
  flex:0 0 54px!important;
  width:54px!important;
  height:54px!important;
  min-width:54px!important;
  min-height:54px!important;
  max-width:54px!important;
  max-height:54px!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  border-radius:50%!important;
  transform:none!important;
}
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--call > span{
  display:block!important;
  position:relative!important;
  z-index:2!important;
  flex:1 1 auto!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  font-weight:850!important;
  line-height:1.15!important;
  text-shadow:0 1px 2px rgba(0,0,0,.38)!important;
}

/* La acción de ruta conserva el acabado claro y alineación equivalente. */
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--route{
  color:#082b4d!important;
  -webkit-text-fill-color:#082b4d!important;
}
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--route .csv-object__icon{
  flex:0 0 50px!important;
  width:50px!important;
  height:50px!important;
  margin:0!important;
}
.movilidad-asistencia .utility-strip > a.utility-pill.csv-object--route .csv-object__label{
  display:block!important;
  color:#082b4d!important;
  -webkit-text-fill-color:#082b4d!important;
}

@media(max-width:820px){
  .movilidad-asistencia .utility-strip{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .movilidad-asistencia .utility-strip > a.utility-pill{
    min-height:70px!important;
  }
  .movilidad-asistencia .utility-strip > a.utility-pill.csv-object--call > img.csv-call-premium-icon{
    flex-basis:50px!important;
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    min-height:50px!important;
    max-width:50px!important;
    max-height:50px!important;
  }
  footer .footer-grid > div:first-child > img[src*="csv-logo-premium"]{
    width:min(190px,72vw)!important;
    max-width:190px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    object-position:center!important;
  }
}

/* CSV86.7 — Hero HOME: mapa territorial fotorealista aprobado. Solo afecta a la imagen interna de la placa principal. */
body .hero-card.csv-brand-plaque .csv-logo-stage{
  aspect-ratio:3/2!important;
  background:#0b2435!important;
}
body .hero-card.csv-brand-plaque .csv-logo-stage > .csv-logo-main{
  width:100%!important;
  height:100%!important;
  aspect-ratio:3/2!important;
  object-fit:cover!important;
  object-position:center center!important;
  border-radius:clamp(18px,3vw,31px)!important;
}
@media(max-width:650px){
  body .hero-card.csv-brand-plaque .csv-logo-stage,
  body .hero-card.csv-brand-plaque .csv-logo-stage > .csv-logo-main{
    aspect-ratio:3/2!important;
  }
}


/* SOURCE: csv96-stability-verified.css */
/* CSV96 · Stability / Responsive / Contrast invariants
   Loaded LAST on every page. This file intentionally defines only final
   visual invariants that must not be reversed by historical CSS layers. */
:root{
  --csv96-navy:#071a31;
  --csv96-muted:#516273;
  --csv96-gold:rgba(213,161,30,.54);
  --csv96-card-bg:linear-gradient(155deg,#ffffff 0%,#fbfcfe 68%,#f4f7fa 100%);
}

/* -------------------------------------------------------------------------
   1) CONTRAST CONTRACT
   Light pill = light surface + dark navy text.
   Navy pill  = navy surface + pure white text.
   Descendants inherit the same visible color to avoid white-on-white bugs.
   ------------------------------------------------------------------------- */
:where(a,button).csv-pill--light,
:where(a,button).csv-pill--light:link,
:where(a,button).csv-pill--light:visited,
.btn.csv-pill--light,
.btn.alt.csv-pill--light,
.btn.dark.csv-pill--light,
.btn.outline.csv-pill--light{
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 52%,#e9f0f6 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
  text-shadow:none!important;
}
.csv-pill--light :is(span,strong,b,em,small,i){
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
  text-shadow:none!important;
}
.csv-pill--light :is(svg,path,use){color:var(--csv96-navy)!important;stroke:currentColor!important}

:where(a,button).csv-pill--navy,
:where(a,button).csv-pill--navy:link,
:where(a,button).csv-pill--navy:visited,
.btn.csv-pill--navy,
.btn.alt.csv-pill--navy,
.btn.dark.csv-pill--navy,
.btn.outline.csv-pill--navy{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:linear-gradient(180deg,#276aa8 0%,#124f87 46%,#082b4d 100%)!important;
  border-color:rgba(213,161,30,.72)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.28)!important;
}
.csv-pill--navy :is(span,strong,b,em,small,i){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.csv-pill--navy :is(svg,path,use){color:#fff!important;stroke:currentColor!important}

/* -------------------------------------------------------------------------
   2) SERVICE CARDS — one architecture on phone, tablet and desktop.
   They are CARDS, never capsules/pills.
   ------------------------------------------------------------------------- */
.service-cloud{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
  grid-auto-rows:1fr!important;
}
.service-chip{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  min-height:154px!important;
  height:100%!important;
  padding:22px 20px!important;
  border-radius:16px!important;
  border:1px solid var(--csv96-gold)!important;
  outline:1px solid rgba(7,25,45,.055)!important;
  outline-offset:-2px!important;
  background:var(--csv96-card-bg)!important;
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
  box-shadow:0 13px 28px rgba(4,20,38,.10),0 3px 8px rgba(4,20,38,.05),inset 0 1px 0 rgba(255,255,255,.98)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  align-items:flex-start!important;
  gap:0!important;
  text-align:left!important;
  overflow:hidden!important;
}
.service-chip::before{border-radius:14px!important;opacity:.34!important}
.service-chip::after{border-radius:14px!important}
.service-chip > i{
  width:34px!important;
  height:34px!important;
  min-height:34px!important;
  display:grid!important;
  place-items:center!important;
  margin:0 0 12px!important;
  line-height:1!important;
  color:#175c96!important;
  -webkit-text-fill-color:#175c96!important;
}
.service-chip > i .csv-icon{width:1.55rem!important;height:1.55rem!important}
.service-chip > b{
  display:block!important;
  margin:0 0 7px!important;
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
  font-size:1.06rem!important;
  font-weight:800!important;
  line-height:1.22!important;
  letter-spacing:-.01em!important;
}
.service-chip > span{
  display:block!important;
  margin:0!important;
  color:var(--csv96-muted)!important;
  -webkit-text-fill-color:var(--csv96-muted)!important;
  font-size:.94rem!important;
  line-height:1.48!important;
  text-wrap:pretty!important;
}
a.service-chip{text-decoration:none!important}

/* Section headings: controlled editorial hierarchy instead of oversized text. */
#servicios .section-head,
#ayuda-conductor .section-head{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(280px,.75fr)!important;
  align-items:end!important;
  gap:28px!important;
  margin-bottom:28px!important;
}
#servicios .section-head h2,
#ayuda-conductor .section-head h2{
  max-width:760px!important;
  margin:6px 0 0!important;
  font-size:clamp(2rem,3.1vw,3.05rem)!important;
  line-height:1.05!important;
  letter-spacing:-.035em!important;
  text-wrap:balance!important;
}
#servicios .section-head p,
#ayuda-conductor .section-head p{
  max-width:520px!important;
  margin:0!important;
  font-size:1rem!important;
  line-height:1.58!important;
  color:var(--csv96-muted)!important;
  -webkit-text-fill-color:var(--csv96-muted)!important;
  text-wrap:pretty!important;
}

@media(max-width:1000px){
  .service-cloud{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
  .service-chip{min-height:148px!important}
  #servicios .section-head,#ayuda-conductor .section-head{
    grid-template-columns:minmax(0,1fr) minmax(260px,.78fr)!important;
    gap:22px!important;
  }
}

@media(max-width:650px){
  .service-cloud{grid-template-columns:1fr!important;gap:14px!important;grid-auto-rows:auto!important}
  .service-chip{
    min-height:0!important;
    height:auto!important;
    padding:20px 18px!important;
    border-radius:14px!important;
    box-shadow:0 10px 22px rgba(4,20,38,.10),0 2px 6px rgba(4,20,38,.05),inset 0 1px 0 rgba(255,255,255,.98)!important;
  }
  .service-chip::before,.service-chip::after{border-radius:12px!important}
  .service-chip > i{margin-bottom:10px!important}
  .service-chip > b{font-size:1.04rem!important;margin-bottom:6px!important}
  .service-chip > span{font-size:.93rem!important;line-height:1.45!important}
  #servicios .section-head,#ayuda-conductor .section-head{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:10px!important;
    margin-bottom:22px!important;
  }
  #servicios .section-head h2,#ayuda-conductor .section-head h2{
    font-size:clamp(2rem,9.2vw,2.45rem)!important;
    line-height:1.06!important;
  }
  #servicios .section-head p,#ayuda-conductor .section-head p{
    max-width:100%!important;
    font-size:.97rem!important;
    line-height:1.52!important;
  }
}

/* Keep physical feedback subtle and consistent; no geometry change on interaction. */
@media(hover:hover) and (pointer:fine){
  .service-chip:hover{
    transform:translateY(-3px)!important;
    border-radius:16px!important;
    border-color:rgba(213,161,30,.78)!important;
    box-shadow:0 19px 38px rgba(4,20,38,.14),0 5px 12px rgba(4,20,38,.07),inset 0 1px 0 #fff!important;
  }
}
.service-chip:active{transform:translateY(1px) scale(.993)!important}
@media(prefers-reduced-motion:reduce){.service-chip{transition:none!important}}

/* Legacy button variants that do not yet carry an explicit csv-pill token.
   This closes the historic V19/CSV48 contradiction that could leave a light
   surface with white text after cascade overrides. */
.btn.alt:not(.csv-pill--navy),
.btn.outline:not(.csv-pill--navy),
.utility-pill:not(.csv-pill--navy):not(.csv-object--call){
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 52%,#e9f0f6 100%)!important;
  text-shadow:none!important;
}
.btn.alt:not(.csv-pill--navy) :is(span,strong,b,em,small,i),
.btn.outline:not(.csv-pill--navy) :is(span,strong,b,em,small,i),
.utility-pill:not(.csv-pill--navy):not(.csv-object--call) :is(span,strong,b,em,small,i){
  color:var(--csv96-navy)!important;
  -webkit-text-fill-color:var(--csv96-navy)!important;
}
.btn.dark:not(.csv-pill--light){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:linear-gradient(180deg,#276aa8 0%,#124f87 46%,#082b4d 100%)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.28)!important;
}
.btn.dark:not(.csv-pill--light) :is(span,strong,b,em,small,i){color:#fff!important;-webkit-text-fill-color:#fff!important}

/* CSV97 — invariant: recovered mobile header is fully interactive at any scroll position. */
@media(max-width:980px){
 body>header.csv83-visible{transform:translate3d(0,0,0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
 body>header.csv83-hidden{transform:translate3d(0,-105%,0)!important;pointer-events:none!important}
 body>header.csv83-visible .menu-toggle,body>header.csv83-visible .menu,body>header.csv83-visible .menu a{pointer-events:auto!important}
 body>header{will-change:transform;transition:transform .22s cubic-bezier(.2,.7,.2,1),opacity .18s ease!important}
}

/* CSV97 — price-row status keeps card geometry stable during refresh. */
.manual-badge.csv-price-freshness{min-height:22px;display:flex;align-items:center}


/* SOURCE: csv100-control-calidad.css */

/* CSV100 · Control de calidad final
   Última capa: semántica visual, consistencia responsive y prevención de regresiones. */

:root{
  --csv100-navy:#06172b;
  --csv100-blue:#0b4b86;
  --csv100-white:#ffffff;
  --csv100-line:#dbe3ea;
}

/* Never allow layout-wide accidental horizontal scrolling */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%}

/* ACTION PILLS: exactly two approved contrast systems */
a.csv-pill--navy,
button.csv-pill--navy,
.btn.csv-pill--navy,
input[type="submit"].csv-pill--navy{
  background:var(--csv100-navy)!important;
  background-image:none!important;
  color:var(--csv100-white)!important;
  -webkit-text-fill-color:var(--csv100-white)!important;
  border-color:var(--csv100-navy)!important;
}
.csv-pill--navy :is(span,strong,b,em,small,i){
  color:var(--csv100-white)!important;
  -webkit-text-fill-color:var(--csv100-white)!important;
}
.csv-pill--navy :is(svg,path,use){color:var(--csv100-white)!important;stroke:currentColor!important}

a.csv-pill--light,
button.csv-pill--light,
.btn.csv-pill--light,
.link.csv-pill--light{
  background:var(--csv100-white)!important;
  background-image:none!important;
  color:var(--csv100-navy)!important;
  -webkit-text-fill-color:var(--csv100-navy)!important;
  border-color:var(--csv100-line)!important;
}
.csv-pill--light :is(span,strong,b,em,small,i){
  color:var(--csv100-navy)!important;
  -webkit-text-fill-color:var(--csv100-navy)!important;
}
.csv-pill--light :is(svg,path,use){color:var(--csv100-navy)!important;stroke:currentColor!important}

/* All real button/link pills have adequate touch target and clear pointer */
:is(a,button).csv-pill--navy,
:is(a,button).csv-pill--light,
a.btn,button.btn{
  min-height:44px;
  cursor:pointer!important;
}

/* Informational chips/badges are explicitly NOT interactive */
:is(.help-chip,.v-badge,.manual-badge,.promo-live-badge,.station-visual-badge,.csv-cert-badge){
  cursor:default!important;
  transform:none!important;
  user-select:text;
}
:is(.help-chip,.v-badge,.manual-badge,.promo-live-badge,.station-visual-badge,.csv-cert-badge):hover{
  transform:none!important;
}

/* A service card only gets an interactive lift when it actually is a link/button */
.service-chip:not(a):not(button),
.card:not(a):not(button){
  cursor:default;
}
@media(hover:hover){
  .service-chip:not(a):not(button):hover{
    transform:none!important;
  }
}

/* JS actions must be real buttons but retain link/card appearance */
.csv-link-button{
  appearance:none;
  border:0;
  padding:0;
  margin:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
footer .csv-link-button{
  display:block;
  color:inherit;
  opacity:.92;
  padding:4px 0;
}
.csv-contact-button{
  appearance:none;
  width:100%;
  font:inherit;
  text-align:left;
  cursor:pointer;
}

/* Native upload input: readable, neutral and not confused with primary CTA */
.csv-file-input{
  width:100%;
  min-height:48px;
  padding:8px;
  border:1px solid var(--csv100-line);
  border-radius:14px;
  background:#fff;
  color:var(--csv100-navy);
}
.csv-file-input::file-selector-button{
  min-height:36px;
  margin-right:10px;
  padding:7px 12px;
  border:0;
  border-radius:999px;
  background:var(--csv100-navy);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}

/* Card/grid composition: equal rhythm without forcing content heights */
.grid,
.service-cloud,
.contact-cards,
.csv99-quick-grid,
.csv99-station-cards,
.csv99-contact-grid{
  align-items:stretch;
}
.grid > .card,
.service-cloud > .service-chip,
.contact-cards > .contact-card,
.csv99-quick-grid > .csv99-quick-card,
.csv99-station-cards > .csv99-station-mini,
.csv99-contact-grid > .csv99-contact-action{
  min-width:0;
  height:100%;
}

/* Prevent text from forcing cards/buttons outside their grid tracks */
:is(.card,.service-chip,.contact-card,.csv99-quick-card,.csv99-station-mini,.csv99-contact-action,
     .btn,.csv-pill--navy,.csv-pill--light){
  overflow-wrap:anywhere;
}

/* HERO: approved 1536×1024 composition is itself 3:2, so show it uncropped */
body .hero-card.csv-brand-plaque .csv-logo-stage{
  width:100%!important;
  aspect-ratio:3/2!important;
  overflow:hidden!important;
}
body .hero-card.csv-brand-plaque .csv-logo-stage > .csv-logo-main{
  display:block!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:3/2!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Desktop/tablet/mobile grid synchronization */
@media(max-width:1100px){
  .csv99-station-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:900px){
  .service-cloud{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:650px){
  .csv99-station-cards,
  .service-cloud,
  .csv99-quick-grid,
  .csv99-contact-grid{grid-template-columns:1fr!important}
  :is(a,button).csv-pill--navy,
  :is(a,button).csv-pill--light,
  a.btn,button.btn{max-width:100%}
}

/* Landscape tablets: retain two-column hierarchy rather than oversized desktop tracks */
@media(min-width:651px) and (max-width:1100px) and (orientation:landscape){
  .csv99-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .csv99-contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Reduced motion: no usability depends on animation */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}


/* SOURCE: csv104-final.css */

/* CSV101 · Cristal + burbujas 3D + Butano/Compartir */
:root{
 --csv101-glass:rgba(255,255,255,.72);
 --csv101-glass-line:rgba(255,255,255,.78);
 --csv101-glass-shadow:0 18px 48px rgba(6,23,43,.13), inset 0 1px 0 rgba(255,255,255,.92);
 --csv101-navy:#06172b;
}

/* The page behaves like a polished glass plane; important cards float above it. */
:is(.csv99-quick-card,.csv99-station-mini,.csv99-contact-action,.service-family-grid .card,
    .station-card,.contact-card,.csv-signup-card,.csv-premium-card){
  position:relative;
  isolation:isolate;
}
:is(.csv99-quick-card,.csv99-station-mini,.csv99-contact-action,.service-family-grid .card,
    .station-card,.contact-card,.csv-signup-card)::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 18% 8%,rgba(255,255,255,.88),transparent 28%),
    linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,255,255,.07) 45%,rgba(7,49,91,.05));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88);
}

/* Small specular 'bubble' reflection — depth without visual clutter. */
:is(.csv99-quick-card,.csv99-station-mini,.service-family-grid .card,.csv-signup-card)::after{
  content:"";
  position:absolute;
  top:10px;
  right:12px;
  width:18px;
  height:18px;
  border-radius:50%;
  pointer-events:none;
  opacity:.58;
  background:radial-gradient(circle at 32% 28%,#fff 0 16%,rgba(255,255,255,.5) 18% 36%,rgba(255,255,255,.08) 62%,transparent 68%);
  filter:drop-shadow(0 4px 6px rgba(6,23,43,.10));
}

/* Butano new-customer glass card */
.csv101-butano-alta{
  margin-top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:20px 22px;
  border:1px solid rgba(232,181,74,.46);
  border-radius:24px;
  background:
    radial-gradient(circle at 5% 0%,rgba(255,255,255,.92),transparent 28%),
    linear-gradient(135deg,rgba(255,250,241,.94),rgba(255,255,255,.68));
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
  box-shadow:var(--csv101-glass-shadow);
}
.csv101-butano-copy{min-width:0}
.csv101-butano-copy strong{display:block;color:var(--csv101-navy);font-size:1.12rem}
.csv101-butano-copy p{margin:5px 0 0;color:#637184;max-width:760px}
.csv101-kicker{display:block;margin-bottom:4px;color:#b76a00;font-size:.74rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.csv101-butano-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 17px;
  border-radius:999px;
  white-space:nowrap;
  text-decoration:none;
  font-weight:900;
}

/* Share = unmistakable floating glass bubble. */
.csv101-share-fab{
  position:fixed;
  right:18px;
  bottom:88px;
  z-index:1200;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:48px;
  padding:6px 13px 6px 6px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:999px;
  background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(238,246,255,.70));
  color:var(--csv101-navy);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
  box-shadow:
    0 14px 36px rgba(6,23,43,.20),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -8px 18px rgba(25,94,153,.05);
  cursor:pointer;
  font:inherit;
  transition:transform .18s ease,box-shadow .18s ease;
}
.csv101-share-orb{
  position:relative;
  display:grid;
  place-items:center;
  width:38px;height:38px;
  border-radius:50%;
  color:#fff;
  background:
    radial-gradient(circle at 30% 22%,rgba(255,255,255,.92) 0 7%,transparent 8%),
    radial-gradient(circle at 35% 28%,#5b98cd 0,#174f83 45%,#062b51 78%);
  box-shadow:
    inset 0 1px 4px rgba(255,255,255,.8),
    inset 0 -8px 15px rgba(0,0,0,.18),
    0 7px 15px rgba(6,23,43,.24);
}
.csv101-share-label{font-size:.84rem;font-weight:900;letter-spacing:.01em}
@media(hover:hover){
 .csv101-share-fab:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 19px 42px rgba(6,23,43,.25),inset 0 1px 0 #fff}
}
.csv101-share-fab:active{transform:translateY(1px) scale(.98)}

@media(max-width:650px){
 .csv101-butano-alta{align-items:flex-start;flex-direction:column}
 .csv101-butano-button{width:100%}
 .csv101-share-fab{right:14px;bottom:82px}
 .csv101-share-label{display:none}
 .csv101-share-fab{padding:5px;border-radius:50%}
 .csv101-share-orb{width:42px;height:42px}
}
@media(prefers-reduced-motion:reduce){
 .csv101-share-fab{transition:none}
}


/* CSV102 preproduction fixes: protect floating controls from legacy enhancers. */
html body .csv101-share-fab{
  position:fixed!important;
  right:18px!important;
  left:auto!important;
  top:auto!important;
  bottom:96px!important;
}
@media(max-width:650px){html body .csv101-share-fab{right:14px!important;bottom:84px!important}}

/* Definitive pill contrast. Preserve glass depth while enforcing the approved palette. */
html body :is(a,button,input[type="submit"]).csv-pill--navy{
  --csv46-a:#2c77b7!important;
  --csv46-b:#0b4b86!important;
  --csv46-c:#06172b!important;
  background:linear-gradient(145deg,#2c77b7 0%,#0b4b86 46%,#06172b 100%) padding-box,
             linear-gradient(145deg,#f8fbff,#aab9c9 46%,#526477 78%,#fff) border-box!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.32)!important;
}
html body :is(a,button,input[type="submit"]).csv-pill--navy :is(span,strong,b,em,small,i){
  color:#fff!important;-webkit-text-fill-color:#fff!important;
}
html body :is(a,button).csv-pill--light{
  --csv46-a:#fff!important;
  --csv46-b:#f5f9fd!important;
  --csv46-c:#e3ecf5!important;
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(246,250,254,.96) 52%,rgba(225,235,245,.94)) padding-box,
             linear-gradient(145deg,#fff,#b7c5d4 52%,#788a9d 84%,#fff) border-box!important;
  color:#06172b!important;
  -webkit-text-fill-color:#06172b!important;
  text-shadow:none!important;
}
html body :is(a,button).csv-pill--light :is(span,strong,b,em,small,i){
  color:#06172b!important;-webkit-text-fill-color:#06172b!important;text-shadow:none!important;
}


/* CSV102.1 — definitive action palette, beats legacy high-specificity selectors. */
html body :is(a,button,input[type="submit"]).csv-pill--navy:not(#csv-never){
  --csv46-a:#347ebc!important;--csv46-b:#0b4b86!important;--csv46-c:#06172b!important;
  background:
    radial-gradient(circle at 28% 8%,rgba(255,255,255,.72) 0 4%,rgba(255,255,255,.18) 11%,transparent 28%),
    linear-gradient(155deg,#347ebc 0%,#0b4b86 48%,#06172b 100%)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.30)!important;
}
html body :is(a,button,input[type="submit"]).csv-pill--navy:not(#csv-never) :is(span,strong,b,em,small,i){color:#fff!important;-webkit-text-fill-color:#fff!important}
html body :is(a,button).csv-pill--light:not(#csv-never){
  --csv46-a:#fff!important;--csv46-b:#f7fbff!important;--csv46-c:#e4edf6!important;
  background:
    radial-gradient(circle at 28% 8%,rgba(255,255,255,.98) 0 6%,rgba(255,255,255,.52) 16%,transparent 34%),
    linear-gradient(155deg,#fff 0%,#f7fbff 50%,#e4edf6 100%)!important;
  color:#06172b!important;-webkit-text-fill-color:#06172b!important;text-shadow:none!important;
  border-color:rgba(6,23,43,.13)!important;
}
html body :is(a,button).csv-pill--light:not(#csv-never) :is(span,strong,b,em,small,i){color:#06172b!important;-webkit-text-fill-color:#06172b!important;text-shadow:none!important}

/* Real approved logo floating on a frosted glass plate over the map hero. */
.csv-logo-stage{position:relative!important;isolation:isolate}
.csv102-hero-logo-glass{
  position:absolute;z-index:6;left:7%;right:7%;top:3.5%;height:39%;
  display:grid;place-items:center;padding:1.5% 4%;border-radius:clamp(14px,2.2vw,28px);
  background:linear-gradient(145deg,rgba(4,20,38,.86),rgba(8,38,67,.69));
  border:1px solid rgba(255,255,255,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -18px 34px rgba(0,0,0,.12),0 15px 34px rgba(6,23,43,.24);
  -webkit-backdrop-filter:blur(16px) saturate(115%);backdrop-filter:blur(16px) saturate(115%);
  overflow:hidden;pointer-events:none;
}
.csv102-hero-logo-glass::before{
  content:"";position:absolute;left:7%;right:7%;top:5%;height:35%;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.32),transparent);filter:blur(2px);pointer-events:none
}
.csv102-hero-logo-glass img{display:block;width:min(94%,760px);height:94%;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.22));position:relative;z-index:2}
@media(max-width:650px){
  .csv102-hero-logo-glass{left:5%;right:5%;top:3%;height:40%;padding:1% 3%;border-radius:14px}
  .csv102-hero-logo-glass img{width:96%;height:96%}
}


/* CSV103 · HERO FINAL — fotografía real Sant Mateu + mapa corporativo.
   Evita cualquier screenshot/maqueta antigua embebida como fondo. */
html body.home-page .hero::before{
  background-image:
    linear-gradient(90deg,rgba(3,15,29,.965) 0%,rgba(3,15,29,.88) 38%,rgba(3,15,29,.52) 68%,rgba(3,15,29,.28) 100%),
    radial-gradient(circle at 74% 24%,rgba(255,206,104,.17),transparent 34%),
    url('/assets/sant-mateu-zona-repostaje-1600.webp')!important;
  background-size:cover!important;
  background-position:center 48%!important;
  background-repeat:no-repeat!important;
}
@media(max-width:980px){
  html body.home-page .hero::before{
    background-image:
      linear-gradient(180deg,rgba(3,15,29,.93) 0%,rgba(3,15,29,.84) 43%,rgba(3,15,29,.62) 72%,rgba(3,15,29,.48) 100%),
      radial-gradient(circle at 68% 22%,rgba(255,206,104,.14),transparent 35%),
      url('/assets/sant-mateu-zona-repostaje-960.webp')!important;
    background-position:center 46%!important;
  }
}
/* Make the approved transparent full logo actually visible over the baked map mark. */
html body .csv102-hero-logo-glass img{
  display:block!important;
  width:92%!important;
  height:92%!important;
  max-width:92%!important;
  max-height:92%!important;
  min-width:0!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:0!important;
  margin:auto!important;
}
@media(max-width:650px){
  html body .csv102-hero-logo-glass img{width:94%!important;height:94%!important;max-width:94%!important;max-height:94%!important}
}
/* CSV103.1: lock approved hero logo inside the frosted plate. */
html body .csv102-hero-logo-glass > img{
  position:absolute!important;
  inset:8%!important;
  width:84%!important;
  height:84%!important;
  max-width:none!important;
  max-height:none!important;
  min-width:0!important;
  min-height:0!important;
  object-fit:contain!important;
  object-position:center!important;
  aspect-ratio:auto!important;
}
/* CSV103.2: desktop logo plate proportion closer to the approved horizontal lock-up. */
@media(min-width:651px){
  html body .csv102-hero-logo-glass{left:16%!important;right:16%!important;height:39%!important}
}


/* CSV104 final verification: the official horizontal logo fully covers the baked mark in the territorial artwork. */
html body .csv102-hero-logo-glass{
  left:10%!important;right:10%!important;top:2.2%!important;height:34%!important;
  background:linear-gradient(145deg,rgba(4,20,38,.94),rgba(8,38,67,.88))!important;
  -webkit-backdrop-filter:blur(22px) saturate(120%)!important;backdrop-filter:blur(22px) saturate(120%)!important;
}
html body .csv102-hero-logo-glass > img{inset:7%!important;width:86%!important;height:86%!important}
@media(max-width:650px){
 html body .csv102-hero-logo-glass{left:5%!important;right:5%!important;top:2%!important;height:35%!important}
 html body .csv102-hero-logo-glass > img{inset:6%!important;width:88%!important;height:88%!important}
}


/* SOURCE: csv108-master.css */
/* CSV108 MASTER · final visual contract */
:root{--csv-navy:#0D2340;--csv-navy2:#06172b;--csv-white:#fff;--csv-gold:#d8a63a;}
html,body{max-width:100%;overflow-x:hidden}
img,svg,video{max-width:100%}

/* Mobile header: fixed, hides on downward scroll and returns immediately on upward scroll. */
@media(max-width:900px){
 body.csv108-nav-ready>header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;z-index:9999!important;transform:translate3d(0,0,0)!important;transition:transform .18s ease!important;will-change:transform!important}
 body.csv108-nav-ready>header.csv108-header-hidden{transform:translate3d(0,-115%,0)!important;pointer-events:none!important}
 body.csv108-nav-ready>header.csv108-header-visible{transform:translate3d(0,0,0)!important;pointer-events:auto!important}
 .csv108-header-spacer{display:block!important;width:100%!important}
}
@media(min-width:901px){.csv108-header-spacer{display:none!important;height:0!important}}

/* Pill contract: white => navy text; navy => white text. */
html body :is(a,button,.btn,.back,.secondary).csv-pill--light,
html body .csv-pill--light{
 background:#fff!important;background-image:linear-gradient(155deg,#fff 0%,#f6f9fc 65%,#eaf0f5 100%)!important;
 color:var(--csv-navy)!important;-webkit-text-fill-color:var(--csv-navy)!important;text-shadow:none!important;
 border-color:rgba(13,35,64,.18)!important;
}
html body .csv-pill--light *{color:var(--csv-navy)!important;-webkit-text-fill-color:var(--csv-navy)!important;text-shadow:none!important}
html body :is(a,button,.btn).csv-pill--navy,
html body .csv-pill--navy{background:var(--csv-navy2)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html body .csv-pill--navy *{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* Hero: exact user-approved sun/mountains image, inside and outside the glass card. */
html body.home-page .hero{position:relative;isolation:isolate;background:var(--csv-navy2)!important}
html body.home-page .hero::before{
 content:""!important;position:absolute!important;inset:0!important;z-index:-2!important;
 background-image:linear-gradient(90deg,rgba(3,15,29,.90) 0%,rgba(3,15,29,.73) 42%,rgba(3,15,29,.34) 78%,rgba(3,15,29,.18) 100%),url('/assets/sant-mateu-zona-repostaje-1600.webp')!important;
 background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;opacity:1!important;
}
html body.home-page .hero-card.csv-brand-plaque .csv-logo-stage{aspect-ratio:3/2!important;overflow:hidden!important;background:#071a30!important}
html body.home-page .hero-card.csv-brand-plaque .csv-logo-stage>img.csv-logo-main{
 display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;opacity:1!important;
}
/* The approved Hero is shown intact; no duplicate logo overlay is placed over it. */
/* Approved full logo wherever CSV corporate logo is shown. */
html body img[data-csv-logo='official-full']{object-fit:contain!important;aspect-ratio:auto!important;height:auto!important}
html body footer img[data-csv-logo='official-full']{width:min(100%,430px)!important;max-height:none!important}

/* Glass / depth language without making informational elements look clickable. */
:is(.csv99-quick-card,.csv99-station-mini,.csv99-contact-action,.service-family-grid .card,.station-card,.contact-card,.csv-signup-card){
 box-shadow:0 18px 46px rgba(6,23,43,.12),inset 0 1px 0 rgba(255,255,255,.94)!important;
}
:is(.help-chip,.v-badge,.manual-badge,.promo-live-badge,.station-visual-badge,.csv-cert-badge){cursor:default!important;transform:none!important}
:is(a,button).csv-pill--light,:is(a,button).csv-pill--navy,a.btn,button.btn{min-height:44px;cursor:pointer!important}

/* Responsive card rhythm. */
.grid,.service-cloud,.contact-cards,.csv99-quick-grid,.csv99-station-cards,.csv99-contact-grid{align-items:stretch}
:is(.card,.service-chip,.contact-card,.csv99-quick-card,.csv99-station-mini,.csv99-contact-action){min-width:0;overflow-wrap:anywhere}
@media(max-width:1100px){.csv99-station-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:650px){.csv99-station-cards,.service-cloud,.csv99-quick-grid,.csv99-contact-grid{grid-template-columns:1fr!important}}
/* Share must be self-explanatory on mobile, not icon-only. */
@media(max-width:650px){
 html body .csv101-share-fab{padding:5px 12px 5px 5px!important;border-radius:999px!important;max-width:calc(100vw - 28px)!important}
 html body .csv101-share-label{display:inline!important;color:#0D2340!important;-webkit-text-fill-color:#0D2340!important;font-weight:900!important}
}


/* SOURCE: csv109-architecture.css */

/* CSV109 · Arquitectura clara CSV / Repsol */
.csv109-repsol-nav{
  position:relative;
}
.csv109-repsol-nav::after{
  content:"";
  display:inline-block;
  width:6px;height:6px;margin-left:5px;border-radius:50%;
  background:#f5a400;vertical-align:middle;
}
.csv109-architecture{padding:22px 0 56px;background:#fff}
.csv109-architecture-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.csv109-architecture-card{
  min-width:0;padding:26px;border-radius:26px;border:1px solid #dfe6ed;
  box-shadow:0 16px 42px rgba(6,23,43,.08);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(247,250,253,.84));
  position:relative;overflow:hidden;
}
.csv109-architecture-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 14% 0%,rgba(255,255,255,.95),transparent 28%);
}
.csv109-architecture-card>span{
  position:relative;display:block;font-size:.72rem;letter-spacing:.1em;font-weight:900;
  color:#6a7888;margin-bottom:7px;
}
.csv109-architecture-card h2{position:relative;margin:0 0 8px;color:#06172b;font-size:clamp(1.45rem,3vw,2.05rem)}
.csv109-architecture-card p{position:relative;color:#637184;margin:0 0 18px;max-width:650px}
.csv109-architecture-card--repsol{border-color:rgba(245,164,0,.34);background:linear-gradient(145deg,#fffdfa,#fff7e8)}
.csv109-architecture-links{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.csv109-architecture-links a{
  padding:8px 11px;border-radius:999px;background:#eef4f8;color:#0D2340;font-size:.82rem;font-weight:850
}
.csv109-architecture-cta{position:relative;display:inline-flex;padding:10px 15px;border-radius:999px;font-weight:900}

.csv109-hub-link{display:inline-flex!important;align-items:center;justify-content:center;padding:9px 13px;border-radius:999px;font-weight:850;margin-top:12px}

.csv109-repsol-hero{
  padding:78px 0 54px;
  background:
    radial-gradient(circle at 82% 12%,rgba(245,164,0,.22),transparent 28%),
    linear-gradient(135deg,#06172b,#10385f);
  color:#fff;
}
.csv109-repsol-hero h1{font-size:clamp(2.4rem,6vw,5rem);line-height:.98;margin:8px 0 16px}
.csv109-repsol-hero p{max-width:800px;color:#dbe6ef;font-size:1.05rem;line-height:1.65}
.csv109-repsol-section{padding:64px 0}
.csv109-repsol-soft{background:#f7f9fb}
.csv109-repsol-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.csv109-repsol-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.csv109-repsol-card{
  display:flex;flex-direction:column;min-width:0;min-height:260px;padding:24px;border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(248,250,252,.86));
  border:1px solid #dfe6ed;box-shadow:0 16px 42px rgba(6,23,43,.08);color:#06172b;
}
.csv109-repsol-card:hover{transform:translateY(-2px);box-shadow:0 20px 48px rgba(6,23,43,.13)}
.csv109-repsol-kicker{font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#b66a00;margin-bottom:8px}
.csv109-repsol-card strong{font-size:1.25rem;line-height:1.2}
.csv109-repsol-card p{color:#637184;line-height:1.55}
.csv109-repsol-cta{margin-top:auto;font-weight:900;color:#0b4b86}
.csv109-repsol-note{padding:0 0 70px;background:#f7f9fb}
.csv109-note-card{padding:22px 24px;border-radius:22px;background:#fff7e8;border:1px solid rgba(245,164,0,.34)}
.csv109-note-card strong{display:block;color:#06172b;font-size:1.08rem}.csv109-note-card p{margin:5px 0 0;color:#637184}

.csv109-services-split{padding:24px 0 0}
.csv109-split-row{
  display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;
  border-radius:20px;background:#f7f9fb;border:1px solid #dfe6ed
}
.csv109-split-row strong{display:block;color:#06172b;font-size:1.03rem;margin-top:3px}

@media(max-width:900px){
  .csv109-architecture-grid,.csv109-repsol-grid,.csv109-repsol-grid--2{grid-template-columns:1fr}
  .csv109-split-row{align-items:flex-start;flex-direction:column}
  .csv109-split-row>a{width:100%;text-align:center}
}


/* CSV109.1 · Identidad principal CSV + encabezado móvil robusto */
.csv109-brand{
  display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none
}
.csv109-brand>img{
  width:48px!important;height:48px!important;object-fit:cover!important;border-radius:14px;
  box-shadow:0 7px 18px rgba(6,23,43,.16)
}
.csv109-brand-copy{display:flex;flex-direction:column;min-width:0;line-height:1.05}
.csv109-brand-copy strong{color:#06172b;font-size:.96rem;white-space:nowrap}
.csv109-brand-copy small{margin-top:4px;color:#687587;font-size:.58rem;white-space:nowrap}
header .navlinks{display:flex;align-items:center;gap:14px}
header .navlinks a{font-weight:800;color:#06172b;font-size:.88rem}
@media(max-width:650px){
  .csv109-brand>img{width:42px!important;height:42px!important;border-radius:12px}
  .csv109-brand-copy strong{font-size:.82rem}
  .csv109-brand-copy small{display:none}
  header .navlinks{gap:9px;min-width:0}
  header .navlinks a{font-size:.73rem;white-space:nowrap}
}

@media(max-width:900px){
 body.csv109-nav-ready>header{
   position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;
   z-index:9999!important;transform:translate3d(0,0,0)!important;
   transition:transform .12s ease-out!important;will-change:transform!important
 }
 body.csv109-nav-ready>header.csv109-hidden{
   transform:translate3d(0,-115%,0)!important;pointer-events:none!important
 }
 body.csv109-nav-ready>header.csv109-visible{
   transform:translate3d(0,0,0)!important;pointer-events:auto!important
 }
 .csv109-header-spacer{display:block!important;width:100%!important}
}
@media(min-width:901px){.csv109-header-spacer{display:none!important;height:0!important}}