/* 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}
}