/* ============ TOKENS ============ */
:root{
  --navy:#111111;
  --navy-2:#1e1e1e;
  --gold:#c9a04a;
  --gold-dark:#a9822f;
  --sand:#f6efe1;
  --sand-2:#efe3c9;
  --white:#ffffff;
  --ink:#16202a;
  --ink-soft:#4a5568;
  --line:#e7e0cf;
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:10px;
  --shadow-soft:0 18px 40px -18px rgba(0,0,0,.45);
  --shadow-card:0 10px 30px -14px rgba(0,0,0,.35);
  --container:1180px;
  --font-head:'Plus Jakarta Sans','Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --metal-gradient:linear-gradient(120deg,#cfcfcf 0%,#c9a04a 22%,#f6ecc9 45%,#8f8f8f 60%,#e3c27a 78%,#d8d8d8 100%);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
#reserva,#vehiculos,#servicio,#contacto{scroll-margin-top:90px;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  font-family:var(--font-body);
  font-size:16px;
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  background:var(--navy); /* fallback if the photo or JS fails to load */
}

/* Background photo: always fills the screen edge to edge (no empty bars).
   Its vertical framing pans from the mountain (top of the photo) to the
   boats (bottom of the photo) as the visitor scrolls the page — see
   main.js initParallax, which drives the background-position. */
.bg-photo{
  position:fixed;
  inset:0;
  z-index:-1;
  background-color:var(--navy);
  background-image:
    linear-gradient(rgba(10,10,10,.6), rgba(10,10,10,.6)),
    url('assets/img/puerto-banus-hero.jpg');
  background-position:center center, center top;
  background-size:cover, cover;
  background-repeat:no-repeat;
}

h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;color:var(--navy);margin:0 0 .5em;line-height:1.15;letter-spacing:-0.01em;}
p{margin:0 0 1em;color:var(--ink-soft);}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
img,svg{display:block;max-width:100%;}

.container{max-width:var(--container);margin:0 auto;padding:0 24px;}

.skip-link{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;border-radius:0 0 8px 0;z-index:200;}
.skip-link:focus{left:0;}

.eyebrow{
  font-family:var(--font-head);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.8rem;
  color:var(--gold);
  margin:0 0 .6em;
}
.eyebrow.center{text-align:center;}
.section-title{font-size:clamp(1.6rem,2.6vw,2.3rem);color:#fff;}
.section-title.center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto;}
.section-sub{color:rgba(255,255,255,.82);}
.section-sub.center{text-align:center;max-width:600px;margin:0 auto 2.5em;}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-head);font-weight:600;
  border-radius:999px;border:2px solid transparent;
  padding:.85em 1.6em;font-size:.95rem;cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--gold);color:var(--navy);box-shadow:var(--shadow-card);}
.btn-primary:hover{background:var(--gold-dark);}
.btn-outline{border-color:rgba(255,255,255,.6);color:#fff;}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-sm{padding:.55em 1.1em;font-size:.85rem;}
.btn-lg{padding:1em 2em;font-size:1.05rem;}
.btn-block{width:100%;}

/* ============ HEADER ============ */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(17,17,17,.92);
  backdrop-filter:saturate(160%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:76px;color:#fff;}
.brand{display:flex;align-items:center;gap:.6em;}
.brand-mark{display:flex;align-items:center;line-height:0;}
.brand-mark img{display:block;height:28px;width:auto;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));}
.brand-text{font-family:var(--font-head);font-weight:800;font-size:1.15rem;letter-spacing:.01em;color:#fff;}
.brand-go{
  background:var(--metal-gradient);
  background-size:200% auto;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:shine 6s linear infinite;
}
@media (prefers-reduced-motion: reduce){.brand-go{animation:none;}}
@keyframes shine{
  0%{background-position:0% center;}
  100%{background-position:200% center;}
}
.brand-go-pulse{animation:shine 6s linear infinite, go-tap .2s ease;}
@keyframes go-tap{50%{transform:scale(1.18);}}
.brand-speed{
  display:inline-flex;flex-direction:column;gap:2px;
  margin-left:4px;vertical-align:middle;transform:translateY(-1px);
}
.brand-speed-bar{
  display:block;height:3px;border-radius:2px;
  background:var(--metal-gradient);
  background-size:200% auto;
  animation:shine 6s linear infinite;
}
.brand-speed-bar:nth-child(1){width:16px;}
.brand-speed-bar:nth-child(2){width:11px;}
.brand-speed-bar:nth-child(3){width:6px;}
@media (prefers-reduced-motion: reduce){.brand-speed-bar{animation:none;}}
.main-nav{display:flex;gap:2em;}
.main-nav a{font-weight:500;font-size:.95rem;opacity:.9;}
.main-nav a:hover{opacity:1;color:var(--gold);}
.header-actions{display:flex;align-items:center;gap:1.2em;}
.header-phone{display:flex;align-items:center;gap:.4em;font-size:.9rem;color:#fff;opacity:.9;}
.header-phone:hover{color:var(--gold);opacity:1;}

/* ============ LANGUAGE SWITCHER ============ */
.lang-switcher{display:flex;align-items:center;gap:6px;}
.lang-btn{
  width:26px;height:19px;padding:0;border:2px solid transparent;border-radius:4px;
  overflow:hidden;cursor:pointer;background:none;line-height:0;opacity:.55;
  transition:opacity .15s ease, border-color .15s ease, transform .15s ease;
}
.lang-btn svg{display:block;width:100%;height:100%;}
.lang-btn:hover{opacity:.9;transform:translateY(-1px);}
.lang-btn.active{opacity:1;border-color:var(--gold);}
#langSwitcherMobile{display:none;}

.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;background:none;border:none;cursor:pointer;}
.nav-toggle span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:transform .2s ease, opacity .2s ease;}

/* ============ HERO ============ */
.hero{
  position:relative;
  padding:70px 0 90px;
  overflow:hidden;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 85% 10%, rgba(201,160,74,.25), transparent 45%);
  pointer-events:none;
}
.hero-bg{display:none;}
.hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start;padding-bottom:60px;}
.hero-copy{color:#fff;padding-top:20px;}
.hero-copy .eyebrow{color:var(--gold);}
.hero-copy h1{color:#fff;font-size:clamp(2rem,3.6vw,3rem);max-width:620px;}
.hero-sub{color:rgba(255,255,255,.82);max-width:520px;font-size:1.05rem;}
.hero-badges{display:flex;flex-direction:column;gap:.5em;margin-top:1.4em;}
.hero-badges li{color:rgba(255,255,255,.9);font-size:.95rem;}

/* Booking card (glass panel over the background photo) */
.booking-card{
  position:relative;
  background:rgba(17,17,17,.38);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.22);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
  padding:28px;
  margin-top:8px;
  min-width:0;
}
.booking-title{font-size:1.2rem;margin-bottom:1em;color:#fff;}
.booking-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-bottom:18px;}
.booking-group{border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-md);padding:16px;margin:0;min-width:0;}
.booking-group legend{font-family:var(--font-head);font-weight:600;color:#fff;padding:0 6px;font-size:.9rem;}
.field{display:flex;flex-direction:column;gap:.35em;font-size:.82rem;font-weight:600;color:rgba(255,255,255,.92);margin-bottom:.8em;min-width:0;}
.field:last-child{margin-bottom:0;}
.field-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;}
.field select,.field input{
  width:100%;min-width:0;
  font-family:var(--font-body);font-size:.92rem;font-weight:400;
  padding:.6em .7em;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:rgba(255,255,255,.92);color:var(--ink);
}
.field select:focus,.field input:focus{outline:2px solid var(--gold);outline-offset:1px;}
.booking-note{min-height:1.2em;font-size:.85rem;color:var(--gold);font-weight:600;margin:.8em 0 0;text-align:center;}
.booking-selected{
  background:rgba(201,160,74,.18);border:1px solid rgba(201,160,74,.4);
  border-radius:10px;padding:.6em .8em;margin:0 0 16px;
  font-size:.85rem;font-weight:600;color:#fff;text-align:center;
}

.booking-summary{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  border-radius:10px;padding:14px 16px;margin:0 0 16px;font-size:.85rem;
}
.booking-summary-row{
  display:flex;justify-content:space-between;gap:12px;
  padding:.35em 0;color:rgba(255,255,255,.82);
}
.booking-summary-row strong{color:#fff;font-weight:600;}
.booking-summary-total{
  border-top:1px solid rgba(255,255,255,.2);margin-top:.2em;padding-top:.5em;
  font-weight:700;
}
.booking-summary-total span,.booking-summary-total strong{color:#fff;font-size:1rem;}
.booking-summary-deposit strong{color:var(--gold);}
.booking-summary-security{
  border-top:1px dashed rgba(255,255,255,.25);margin-top:.4em;padding-top:.6em;
  font-size:.78rem;color:rgba(255,255,255,.65);
}
.booking-summary-security strong{color:rgba(255,255,255,.85);font-weight:600;}

.vehicle-calc{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:rgba(255,255,255,.08);border-radius:8px;padding:.5em .7em;margin-bottom:1em;
  font-size:.78rem;color:rgba(255,255,255,.75);
}
.vehicle-calc label{display:flex;align-items:center;gap:.5em;}
.vehicle-calc-days{
  width:48px;padding:.25em .4em;border:1px solid rgba(255,255,255,.3);border-radius:6px;
  background:rgba(255,255,255,.92);color:var(--ink);font-size:.8rem;
}
.vehicle-calc-total{font-weight:700;color:var(--gold);font-size:.9rem;}

/* ============ MODES (glass panels over the background photo) ============ */
.modes{padding:90px 0;}
.modes-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:3em;}
.mode-card{
  background:rgba(17,17,17,.34);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius-md);padding:28px 22px;text-align:center;
  box-shadow:var(--shadow-card);transition:transform .2s ease;
}
.mode-card:hover{transform:translateY(-4px);}
.mode-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:72px;height:72px;border-radius:50%;background:var(--sand-2);margin-bottom:1em;
}
.mode-card h3{font-size:1.05rem;color:#fff;}
.mode-card p{font-size:.9rem;margin:0;color:rgba(255,255,255,.8);}

/* ============ FLEET ============ */
.fleet{padding:90px 0;}
.fleet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:26px;margin-top:1em;}

.vehicle-card{
  background:rgba(17,17,17,.34);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border:1px solid rgba(255,255,255,.18);border-radius:var(--radius-lg);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow-card);
  transition:transform .2s ease, box-shadow .2s ease;
}
.vehicle-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px -16px rgba(17,17,17,.3);}
.vehicle-media{
  background:linear-gradient(160deg,var(--sand-2),var(--sand));
  display:flex;align-items:center;justify-content:center;height:150px;position:relative;
  overflow:hidden;
}
.vehicle-media img{width:100%;height:100%;object-fit:cover;display:block;}
.vehicle-dots{
  position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  display:flex;gap:6px;z-index:2;
}
.vehicle-dot{
  width:7px;height:7px;border-radius:50%;border:none;padding:0;
  background:rgba(255,255,255,.55);cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.vehicle-dot:hover{background:rgba(255,255,255,.85);}
.vehicle-dot.active{background:var(--gold);transform:scale(1.25);}
.vehicle-tag{
  position:absolute;top:12px;left:12px;background:var(--navy);color:#fff;
  font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  padding:.35em .7em;border-radius:999px;
}
.vehicle-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1;}
.vehicle-name{font-size:1.1rem;margin-bottom:.2em;color:#fff;}
.vehicle-cat{font-size:.82rem;color:rgba(255,255,255,.72);margin-bottom:.9em;}
.vehicle-specs{display:flex;flex-wrap:wrap;gap:.4em;margin-bottom:1.1em;}
.vehicle-specs span{
  font-size:.72rem;font-weight:600;background:var(--sand);color:var(--navy);
  padding:.3em .6em;border-radius:999px;
}
.vehicle-footer{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.vehicle-price{font-family:var(--font-head);font-weight:700;color:#fff;}
.vehicle-price span{display:block;font-size:.7rem;font-weight:500;color:rgba(255,255,255,.65);}
.vehicle-price strong{font-size:1.3rem;color:var(--gold);}

/* ============ CTA FINAL (glass panel over the background photo) ============ */
.cta-final{
  padding:100px 0;color:#fff;text-align:center;
}
.cta-inner{
  background:rgba(17,17,17,.34);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius-lg);
  padding:56px 40px;
  box-shadow:var(--shadow-soft);
}
.cta-eyebrow{color:var(--gold);}
.cta-inner h2{color:#fff;max-width:760px;margin-left:auto;margin-right:auto;font-size:clamp(1.6rem,3vw,2.3rem);}
.cta-sub{color:rgba(255,255,255,.82);max-width:600px;margin:0 auto 1.8em;}
.cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ============ FOOTER ============ */
.site-footer{background:#081b33;color:rgba(255,255,255,.75);padding:60px 0 0;}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;padding-bottom:40px;}
.footer-brand p{color:rgba(255,255,255,.6);margin-top:.6em;max-width:280px;font-size:.9rem;}
.footer-cols{display:flex;flex-wrap:wrap;gap:32px 60px;min-width:0;}
.footer-cols h4{color:#fff;font-size:.9rem;margin-bottom:.8em;}
.footer-cols a{display:block;color:rgba(255,255,255,.65);font-size:.9rem;margin-bottom:.5em;}
.footer-cols a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:20px 0;font-size:.8rem;text-align:center;color:rgba(255,255,255,.5);}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;}
  .modes-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:768px){
  .main-nav{
    position:absolute;top:76px;left:0;right:0;
    background:var(--navy);flex-direction:column;padding:16px 24px;gap:0;
    max-height:0;overflow:hidden;transition:max-height .25s ease;
  }
  .main-nav.open{max-height:420px;padding:16px 24px 22px;}
  .main-nav a{padding:.7em 0;border-bottom:1px solid rgba(255,255,255,.08);color:#fff;}
  .header-phone{display:none;}
  .header-actions{gap:.7em;}
  .nav-toggle{display:flex;}
  #langSwitcherDesktop{display:none;}
  #langSwitcherMobile{
    display:flex;gap:14px;margin-top:14px;padding-top:16px;
    border-top:1px solid rgba(255,255,255,.1);
  }
  #langSwitcherMobile .lang-btn{width:34px;height:24px;}
  .booking-grid{grid-template-columns:1fr;}
  .modes-grid{grid-template-columns:1fr 1fr;}
  .field-row{grid-template-columns:1fr 1fr;}
  .footer-inner{flex-direction:column;}
}

@media (max-width:520px){
  .footer-cols{gap:28px 32px;}
  .modes-grid{grid-template-columns:1fr;}
  .cta-actions{flex-direction:column;align-items:stretch;}
}

/* ============ WHATSAPP FAB ============ */
.whatsapp-fab{
  position:fixed;right:22px;bottom:22px;z-index:150;
  width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#25D366;box-shadow:0 12px 28px -8px rgba(0,0,0,.4);
  transition:transform .2s ease, box-shadow .2s ease;
}
.whatsapp-fab:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 16px 32px -8px rgba(0,0,0,.45);}
.whatsapp-fab::before{
  content:"";position:absolute;inset:0;border-radius:50%;
  box-shadow:0 0 0 0 rgba(37,211,102,.55);
  animation:wa-pulse 2.4s ease-out infinite;
}
@media (prefers-reduced-motion: reduce){.whatsapp-fab::before{animation:none;}}
@keyframes wa-pulse{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.55);}
  80%{box-shadow:0 0 0 16px rgba(37,211,102,0);}
  100%{box-shadow:0 0 0 16px rgba(37,211,102,0);}
}
@media (max-width:520px){
  .whatsapp-fab{width:54px;height:54px;right:16px;bottom:16px;}
}

/* ===== Steps modal (reservation wizard) ===== */
.steps-overlay{
  position:fixed;inset:0;z-index:200;background:rgba(17,17,17,.6);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:16px;
}
.steps-overlay[hidden]{display:none;}
.steps-modal{
  position:relative;background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);
  width:100%;max-width:620px;max-height:90vh;overflow-y:auto;padding:32px 28px 24px;
}
.steps-close{
  position:absolute;top:14px;right:14px;width:34px;height:34px;border:none;border-radius:50%;
  background:var(--sand);color:var(--navy);font-size:1.4rem;line-height:1;cursor:pointer;
}
.steps-close:hover{background:var(--sand-2);}
.steps-title{color:var(--navy);font-size:1.3rem;margin:0 0 20px;padding-right:30px;}

.steps-track{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px;gap:4px;}
.steps-step{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;text-align:center;
}
.steps-step::before{
  content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:var(--line);z-index:0;
}
.steps-step:first-child::before{display:none;}
.steps-step-circle{
  position:relative;z-index:1;width:32px;height:32px;border-radius:50%;background:var(--sand);
  border:2px solid var(--line);display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.85rem;color:var(--ink-soft);transition:all .2s ease;
}
.steps-step-label{font-size:.7rem;color:var(--ink-soft);font-weight:600;max-width:80px;}
.steps-step.active .steps-step-circle{background:var(--gold);border-color:var(--gold);color:#fff;}
.steps-step.active .steps-step-label{color:var(--navy);}
.steps-step.done .steps-step-circle{background:var(--navy);border-color:var(--navy);color:#fff;}
.steps-step.done .steps-step-circle::after{content:"✓";}
.steps-step.done::before{background:var(--navy);}

.steps-body{min-height:180px;}
.steps-panel h3{color:var(--navy);font-size:1rem;margin:0 0 12px;}
.steps-panel p{color:var(--ink-soft);font-size:.9rem;}

.steps-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
.steps-info-card{background:var(--sand);border-radius:var(--radius-sm);padding:12px 14px;}
.steps-info-card strong{display:block;color:var(--navy);font-size:.8rem;margin-bottom:4px;}
.steps-info-card span{color:var(--ink-soft);font-size:.85rem;}

.steps-vehicle-quick{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;background:var(--sand-2);
  border-radius:var(--radius-sm);padding:14px;
}
.steps-vehicle-quick div{font-size:.82rem;color:var(--ink);}
.steps-vehicle-quick strong{color:var(--navy);}

.steps-offer-card{
  display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:10px 12px;margin-bottom:10px;
}
.steps-offer-media{
  width:64px;height:48px;border-radius:8px;object-fit:cover;background:var(--sand);flex-shrink:0;
}
.steps-offer-body{flex:1;min-width:0;}
.steps-offer-body strong{display:block;color:var(--navy);font-size:.9rem;}
.steps-offer-body span{font-size:.78rem;color:var(--ink-soft);}
.steps-offer-diff{color:var(--gold-dark);font-weight:700;font-size:.8rem;}
.steps-offer-choose{
  border:1px solid var(--gold);color:var(--gold-dark);background:#fff;border-radius:8px;
  padding:.4em .8em;font-size:.78rem;font-weight:700;cursor:pointer;white-space:nowrap;
}
.steps-offer-choose:hover{background:var(--gold);color:#fff;}
.steps-offer-choose[disabled]{opacity:.5;cursor:default;}

.steps-req-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.steps-req-list li{
  display:flex;gap:10px;font-size:.88rem;color:var(--ink);background:var(--sand);
  border-radius:var(--radius-sm);padding:10px 12px;
}
.steps-req-list li::before{content:"✔";color:var(--gold-dark);font-weight:700;flex-shrink:0;}

.steps-summary-card{
  display:flex;gap:14px;border:1px solid var(--line);border-radius:var(--radius-md);padding:14px;margin-bottom:14px;
}
.steps-summary-media{width:110px;height:80px;border-radius:10px;object-fit:cover;background:var(--sand);flex-shrink:0;}
.steps-summary-body h4{margin:0 0 4px;color:var(--navy);font-size:1.05rem;}
.steps-summary-body p{margin:0;color:var(--ink-soft);font-size:.82rem;}
.steps-summary-rows{background:var(--sand);border-radius:var(--radius-sm);padding:12px 14px;}
.steps-summary-row{display:flex;justify-content:space-between;padding:.3em 0;font-size:.86rem;color:var(--ink);}
.steps-summary-row strong{color:var(--navy);}
.steps-summary-row.steps-summary-deposit{border-top:1px dashed var(--line);margin-top:.3em;padding-top:.5em;}
.steps-summary-row.steps-summary-deposit strong{color:var(--gold-dark);}
.steps-summary-row.steps-summary-grand{border-top:1px solid var(--line);margin-top:.3em;padding-top:.5em;font-weight:700;}
.steps-summary-row.steps-summary-grand span,.steps-summary-row.steps-summary-grand strong{color:var(--navy);font-size:1rem;}

/* Las dos casillas separadas: condiciones y privacidad */
.consent-box{
  margin-top:16px;padding:12px 14px;
  background:var(--sand);border-radius:var(--radius-sm);
}
.consent-line{
  display:flex;align-items:flex-start;gap:10px;cursor:pointer;
  padding:6px 8px;margin:0 -8px;border-radius:9px;
  transition:background .25s ease;
}
.consent-line + .consent-line{margin-top:2px;}
.consent-line input{
  margin-top:3px;flex-shrink:0;width:17px;height:17px;
  accent-color:var(--gold-dark);cursor:pointer;
}
.consent-line span{font-size:.82rem;color:var(--ink);line-height:1.45;}
.consent-line a{color:var(--gold-dark);font-weight:700;text-decoration:underline;}
.consent-line.falta{animation:consentAviso 1.6s ease;}
@keyframes consentAviso{
  0%,100%{background:transparent;}
  15%,65%{background:rgba(220,38,38,.14);}
}
.consent-hint{
  margin:8px 0 0;font-size:.72rem;color:var(--muted);line-height:1.35;
}
.consent-wrap{margin-top:4px;}
.consent-wrap .consent-box{background:rgba(255,255,255,.55);border:1px solid var(--line);}

.steps-actions .btn[disabled]{opacity:.45;cursor:not-allowed;}

.steps-actions{display:flex;justify-content:space-between;gap:10px;margin-top:22px;}
.steps-actions .btn{flex:0 0 auto;}
.steps-actions .btn:only-child{margin-left:auto;}

@media (max-width:560px){
  .steps-modal{padding:24px 18px 18px;}
  .steps-info-grid,.steps-vehicle-quick{grid-template-columns:1fr;}
  .steps-step-label{display:none;}
  .steps-summary-card{flex-direction:column;}
  .steps-summary-media{width:100%;height:120px;}
}

/* ===== Accepted payment methods ===== */
.pay-methods{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);text-align:center;}
.pay-methods-title{
  display:flex;align-items:center;justify-content:center;gap:.4em;margin:0 0 .7em;
  font-size:.78rem;font-weight:600;color:rgba(255,255,255,.85);
}
.pay-methods-list{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:0 0 .7em;}
.pay-card{
  display:flex;align-items:center;justify-content:center;gap:2px;
  width:46px;height:29px;border-radius:5px;background:#fff;
  font-family:var(--font-head);font-weight:800;font-size:.6rem;letter-spacing:.02em;
  box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.pay-visa{color:#1a1f71;}
.pay-amex{color:#016fd0;font-size:.55rem;}
.pay-applepay{color:#111;font-size:.62rem;}
.pay-mc{gap:0;}
.pay-mc-a,.pay-mc-b{width:13px;height:13px;border-radius:50%;}
.pay-mc-a{background:#eb001b;}
.pay-mc-b{background:#f79e1b;margin-left:-5px;mix-blend-mode:multiply;}
.pay-methods-note{margin:0;font-size:.7rem;color:rgba(255,255,255,.6);line-height:1.4;}

/* ===== Botón reservar por WhatsApp (Bizum) ===== */
.btn-whatsapp{
  background:#25D366;color:#0b2015;margin-top:10px;font-weight:700;
  box-shadow:0 8px 22px -10px rgba(37,211,102,.8);
}
.btn-whatsapp:hover{background:#1ebe5b;color:#fff;}
.btn-whatsapp svg{flex-shrink:0;}

/* ===== Aviso de moto ya reservada ===== */
.vehicle-aviso{
  margin:0;padding:.55em .9em;font-size:.78rem;font-weight:700;text-align:center;
  letter-spacing:.01em;line-height:1.35;
}
.vehicle-aviso.ocupada{background:#7f1d1d;color:#fecaca;}
.vehicle-aviso.proxima{background:rgba(201,160,74,.22);color:#f3e2bd;}

/* Las tres barras del logo también abren el panel privado (5 toques) */
.brand-speed{pointer-events:auto;cursor:default;}

/* ===== Visor de fotos a pantalla completa ===== */
.foto-visor{
  position:fixed;inset:0;z-index:300;background:rgba(8,8,8,.96);
  display:flex;align-items:center;justify-content:center;
  padding:64px 12px 84px;touch-action:pan-y;
}
.foto-visor[hidden]{display:none;}
.foto-marco{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
}
.foto-marco img{
  max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;border-radius:8px;
  box-shadow:0 22px 60px -22px rgba(0,0,0,.9);
  user-select:none;-webkit-user-drag:none;
}
.foto-titulo{
  position:absolute;top:20px;left:0;right:0;margin:0;text-align:center;
  color:#fff;font-family:var(--font-head);font-weight:700;font-size:1rem;
  padding:0 60px;pointer-events:none;
}
.foto-cerrar{
  position:absolute;top:14px;right:14px;z-index:2;
  width:42px;height:42px;border:none;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;font-size:1.7rem;line-height:1;
}
.foto-cerrar:hover{background:rgba(255,255,255,.28);}
.foto-flecha{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:48px;height:48px;border:none;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;font-size:2rem;line-height:1;
  display:flex;align-items:center;justify-content:center;padding-bottom:4px;
}
.foto-flecha:hover{background:var(--gold);color:#111;}
.foto-flecha.izq{left:14px;}
.foto-flecha.der{right:14px;}
.foto-pie{
  position:absolute;bottom:24px;left:0;right:0;
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.foto-contador{color:rgba(255,255,255,.75);font-size:.85rem;font-weight:600;}
.foto-puntos{display:flex;gap:8px;}
.foto-punto{
  width:9px;height:9px;border-radius:50%;border:none;cursor:pointer;padding:0;
  background:rgba(255,255,255,.3);
}
.foto-punto.activa{background:var(--gold);transform:scale(1.25);}

/* La foto de la tarjeta invita a pulsarla */
.vehicle-media.has-image{cursor:zoom-in;}
.vehicle-lupa{
  position:absolute;bottom:10px;right:10px;z-index:2;
  background:rgba(17,17,17,.62);color:#fff;border-radius:999px;
  padding:.3em .7em;font-size:.68rem;font-weight:700;pointer-events:none;
  backdrop-filter:blur(3px);
}
@media (max-width:560px){
  .foto-visor{padding:56px 6px 76px;}
  .foto-flecha{width:40px;height:40px;font-size:1.6rem;}
  .foto-flecha.izq{left:6px;}
  .foto-flecha.der{right:6px;}
  .foto-titulo{font-size:.9rem;padding:0 54px;}
}

/* ===== Logo de la marca (imagen) ===== */
.brand-logo{
  display:block;height:46px;width:auto;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));
  cursor:pointer;
}
.brand-logo-pie{height:60px;margin-bottom:.6em;}
@media (max-width:640px){
  .brand-logo{height:38px;}
  .brand-logo-pie{height:52px;}
}

/* ===== Reflejo dorado que recorre el logo ===== */
.brand-logo-wrap{position:relative;display:inline-block;line-height:0;}
.brand-logo-wrap::after{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(112deg,
    transparent 38%,
    rgba(255,255,255,.55) 46%,
    rgba(255,240,200,.92) 50%,
    rgba(255,214,110,.75) 54%,
    transparent 62%);
  background-size:260% 100%;
  -webkit-mask-image:url('assets/img/marbigo-logo.png');
  mask-image:url('assets/img/marbigo-logo.png');
  -webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  animation:logo-reflejo 5.5s linear infinite;
  mix-blend-mode:screen;
}
@keyframes logo-reflejo{
  0%{background-position:210% 0;}
  55%{background-position:-60% 0;}
  100%{background-position:-60% 0;}
}
@media (prefers-reduced-motion: reduce){.brand-logo-wrap::after{animation:none;opacity:0;}}


/* Una sola tarjeta destacada en "Elige cómo te mueves" */
.modes-grid-unica{
  grid-template-columns:minmax(0,520px);
  justify-content:center;
}
.modes-grid-unica .mode-card{text-align:center;padding:30px 28px;}
.modes-grid-unica .mode-icon{margin-left:auto;margin-right:auto;}



/* ===== Asistente IA — estilo futurista ===== */
.ayuda-fab{
  position:fixed;right:24px;bottom:100px;z-index:150;
  display:flex;align-items:center;gap:.55em;
  padding:.7em 1.15em .7em .85em;cursor:pointer;border-radius:999px;
  font-family:var(--font-head);font-weight:700;font-size:.85rem;letter-spacing:.01em;
  color:#fff;border:1px solid rgba(201,160,74,.55);
  background:linear-gradient(135deg, rgba(28,28,30,.92) 0%, rgba(17,17,17,.92) 55%, rgba(48,38,14,.92) 100%);
  backdrop-filter:blur(14px) saturate(160%);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  box-shadow:0 12px 30px -12px rgba(0,0,0,.85), 0 0 0 0 rgba(201,160,74,.45);
  transition:transform .2s ease, box-shadow .25s ease, border-color .2s ease;
  animation:ia-latido 3.6s ease-in-out infinite;
}
.ayuda-fab:hover{
  transform:translateY(-3px);
  border-color:var(--gold);
  box-shadow:0 16px 38px -12px rgba(0,0,0,.9), 0 0 22px -4px rgba(201,160,74,.55);
}
@keyframes ia-latido{
  0%,100%{box-shadow:0 12px 30px -12px rgba(0,0,0,.85), 0 0 0 0 rgba(201,160,74,.45);}
  50%{box-shadow:0 12px 30px -12px rgba(0,0,0,.85), 0 0 0 9px rgba(201,160,74,0);}
}
@media (prefers-reduced-motion: reduce){.ayuda-fab{animation:none;}}

.ayuda-robot{
  display:flex;color:var(--gold);
  filter:drop-shadow(0 0 6px rgba(201,160,74,.55));
}
/* Parpadeo real: los ojos se cierran y se abren */
.robot-ojo{
  transform-box:fill-box;transform-origin:center;
  animation:ia-parpadeo 4.5s ease-in-out infinite;
}
/* Parpadeo rápido y sutil: se nota el gesto, pero nunca se le ven
   los ojos cerrados (no bajan del 45% y dura apenas unas centésimas). */
@keyframes ia-parpadeo{
  0%,45.4%,100%{transform:scaleY(1);}
  46.2%{transform:scaleY(.45);}
  47%{transform:scaleY(1);}
  60.4%{transform:scaleY(1);}
  61.2%{transform:scaleY(.45);}
  62%{transform:scaleY(1);}
}
.robot-boca{animation:ia-sonrisa 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
@keyframes ia-sonrisa{
  0%,40%,100%{transform:scaleY(1);}
  65%{transform:scaleY(1.28);}
  80%{transform:scaleY(1);}
}
@media (prefers-reduced-motion: reduce){
  .robot-ojo,.robot-boca{animation:none;}
}

/* Panel con cristal difuminado */
.ayuda-panel{
  position:fixed;right:24px;bottom:100px;z-index:160;
  width:min(378px,calc(100vw - 32px));max-height:min(575px,calc(100vh - 140px));
  display:flex;flex-direction:column;overflow:hidden;
  border-radius:20px;
  background:linear-gradient(160deg, rgba(24,24,26,.82) 0%, rgba(14,14,15,.88) 100%);
  backdrop-filter:blur(26px) saturate(180%);
  -webkit-backdrop-filter:blur(26px) saturate(180%);
  border:1px solid rgba(201,160,74,.28);
  box-shadow:0 30px 70px -24px rgba(0,0,0,.92), 0 0 40px -18px rgba(201,160,74,.35);
  animation:ia-entrada .28s cubic-bezier(.2,.9,.3,1.2);
}
.ayuda-panel[hidden]{display:none;}
@keyframes ia-entrada{
  from{opacity:0;transform:translateY(14px) scale(.97);}
  to{opacity:1;transform:none;}
}
@media (prefers-reduced-motion: reduce){.ayuda-panel{animation:none;}}

.ayuda-cabecera{
  display:flex;align-items:flex-start;gap:12px;padding:17px 16px 15px;
  border-bottom:1px solid rgba(201,160,74,.22);
  background:linear-gradient(100deg, rgba(201,160,74,.14), transparent 70%);
}
.ayuda-avatar{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:38px;height:38px;border-radius:12px;color:var(--gold);
  background:rgba(201,160,74,.14);border:1px solid rgba(201,160,74,.35);
  filter:drop-shadow(0 0 5px rgba(201,160,74,.4));
}
.ayuda-cabecera > div{flex:1;min-width:0;}
.ayuda-titulo{margin:0;font-family:var(--font-head);font-weight:700;font-size:.97rem;color:#fff;}
.ayuda-sub{margin:.25em 0 0;font-size:.75rem;color:rgba(255,255,255,.55);line-height:1.4;}
.ayuda-cerrar{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.8);cursor:pointer;flex-shrink:0;
  width:29px;height:29px;border-radius:50%;font-size:1.25rem;line-height:1;
}
.ayuda-cerrar:hover{background:rgba(201,160,74,.28);color:#fff;border-color:var(--gold);}

.ayuda-lista{overflow-y:auto;padding:6px 0;flex:1;}
.ayuda-lista::-webkit-scrollbar{width:5px;}
.ayuda-lista::-webkit-scrollbar-thumb{background:rgba(201,160,74,.4);border-radius:3px;}
.ayuda-item{border-bottom:1px solid rgba(255,255,255,.07);}
.ayuda-item:last-child{border-bottom:none;}
.ayuda-preg{
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:13px 16px;font-family:inherit;font-size:.86rem;font-weight:600;
  color:rgba(255,255,255,.92);display:flex;justify-content:space-between;gap:10px;align-items:center;
  transition:background .15s ease,color .15s ease;
}
.ayuda-preg:hover{background:rgba(201,160,74,.12);color:#fff;}
.ayuda-preg .mas{
  color:var(--gold);font-size:1.15rem;flex-shrink:0;line-height:1;
  transition:transform .22s ease;
}
.ayuda-item.abierta{background:rgba(201,160,74,.08);}
.ayuda-item.abierta .mas{transform:rotate(45deg);}
.ayuda-resp{
  padding:0 16px 14px;margin:0;font-size:.83rem;line-height:1.6;
  color:rgba(255,255,255,.7);
  border-left:2px solid rgba(201,160,74,.45);margin-left:16px;padding-left:12px;
}
.ayuda-resp[hidden]{display:none;}

.ayuda-wa{
  display:flex;align-items:center;justify-content:center;gap:.5em;
  padding:14px;font-weight:700;font-size:.85rem;text-decoration:none;
  color:#0b2015;background:linear-gradient(135deg,#25D366,#1ebe5b);
  border-top:1px solid rgba(255,255,255,.12);
}
.ayuda-wa:hover{filter:brightness(1.08);color:#04140a;}

@media (max-width:560px){
  .ayuda-fab{right:16px;bottom:84px;padding:.6em .95em .6em .72em;font-size:.8rem;}
  .ayuda-panel{right:16px;left:16px;bottom:84px;width:auto;}
}

/* ===== El robot cobra vida ===== */
.ayuda-robot svg{animation:robot-respira 4.6s ease-in-out infinite;transform-origin:center bottom;}
@keyframes robot-respira{
  0%,100%{transform:translateY(0) rotate(0deg);}
  25%{transform:translateY(-1.2px) rotate(-3.2deg);}
  55%{transform:translateY(.5px) rotate(2.6deg);}
  80%{transform:translateY(-.6px) rotate(-1.2deg);}
}
/* La mirada va de un lado a otro */
.robot-mirada{
  transform-box:fill-box;transform-origin:center;
  animation:robot-mira 6.5s ease-in-out infinite;
}
@keyframes robot-mira{
  0%,18%{transform:translateX(0);}
  26%,38%{transform:translateX(1.5px);}
  46%,58%{transform:translateX(-1.5px);}
  66%,100%{transform:translateX(0);}
}
/* La antena late como una luz encendida */
.robot-antena{
  transform-box:fill-box;transform-origin:center;
  animation:robot-antena 2.2s ease-in-out infinite;
}
@keyframes robot-antena{
  0%,100%{opacity:.55;transform:scale(.82);}
  50%{opacity:1;transform:scale(1.15);}
}
@media (prefers-reduced-motion: reduce){
  .ayuda-robot svg,.robot-mirada,.robot-antena{animation:none;}
}

/* La ilustración del logo, sobre su fondo blanco */
.brand-mark img{
  height:60px;width:auto;background:#fff;
  border-radius:10px;padding:3px 6px;
  box-shadow:0 4px 14px -6px rgba(0,0,0,.6);
}
.site-header .header-inner{height:92px;}
.footer-brand .brand-mark img{height:68px;}
@media (max-width:640px){
  .brand-mark img{height:44px;border-radius:8px;padding:2px 5px;}
  .site-header .header-inner{height:76px;}
  .footer-brand .brand-mark img{height:54px;}
}

/* Fotos de catálogo (moto recortada sobre fondo transparente):
   se muestran enteras, no recortadas al marco. */
.vehicle-media.has-image{
  background:radial-gradient(circle at 50% 62%, rgba(201,160,74,.16), rgba(17,17,17,.55) 70%);
}
.vehicle-photo{object-fit:contain;padding:4px;}
.foto-marco img{background:transparent;}

/* Los botones de "Reservar" llevan justo a "Encuentra tu vehículo",
   dejando hueco para la barra superior fija. */
.ancla-reserva{
  position:absolute;top:-18px;left:0;width:1px;height:1px;
  pointer-events:none;
}

/* ===== Arreglo del logo en móvil =====
   La ilustración es apaisada (2,6:1). Dentro del flex del header se
   comprimía y salía deformada, y el nombre se partía en dos líneas. */
.brand{flex-shrink:0;min-width:0;}
.brand-mark{flex-shrink:0;}
.brand-mark img{flex-shrink:0;object-fit:contain;}
.brand-text{white-space:nowrap;}
.brand-speed{flex-shrink:0;}

@media (max-width:640px){
  .brand{gap:.4em;}
  .brand-mark img{height:38px;}
  .brand-text{font-size:1rem;}
  .header-actions{gap:.7em;}
}
@media (max-width:420px){
  .brand-mark img{height:34px;}
  .brand-text{font-size:.92rem;}
  .header-phone{display:none;}
}
@media (max-width:640px){
  .header-actions .btn-sm{padding:.5em .8em;font-size:.78rem;}
  .header-inner{gap:10px;}
}

/* ===== Sección de códigos QR ===== */
.qr-seccion{padding:70px 0 60px;}
.qr-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,320px));
  gap:22px;justify-content:center;margin-top:34px;
}
.qr-card{
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--radius-lg);
  padding:24px 22px 26px;text-align:center;
  transition:transform .2s ease, border-color .2s ease;
}
.qr-card:hover{transform:translateY(-4px);border-color:var(--gold);}
.qr-card img{
  width:170px;height:170px;margin:0 auto 18px;display:block;
  background:#fff;border-radius:12px;padding:9px;
  box-shadow:0 8px 22px -10px rgba(0,0,0,.7);
}
.qr-card h3{color:#fff;font-size:1.02rem;margin-bottom:.45em;}
.qr-card p{color:rgba(255,255,255,.65);font-size:.85rem;margin:0;line-height:1.5;}
@media (max-width:560px){
  .qr-seccion{padding:50px 0 40px;}
  .qr-card img{width:146px;height:146px;}
}

/* ===== Ficha de moto estilo catálogo ===== */
.vehicle-card{
  background:rgba(255,255,255,.58);
  backdrop-filter:blur(9px) saturate(135%);
  -webkit-backdrop-filter:blur(9px) saturate(135%);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 14px 38px -16px rgba(0,0,0,.55);
}
.vehicle-card .vehicle-media,
.vehicle-card .vehicle-media.has-image{
  background:linear-gradient(180deg,rgba(247,249,251,.22) 0%,rgba(255,255,255,.06) 100%);
  min-height:230px;
}
.vehicle-card .vehicle-photo{object-fit:contain;padding:14px 10px 6px;}
.vehicle-tag{background:#16202a;color:#fff;}
.vehicle-lupa{background:rgba(22,32,42,.72);}
.vehicle-dot{background:rgba(22,32,42,.28);}
.vehicle-dot.active{background:var(--gold-dark);}

.vehicle-body{padding:4px 22px 22px;}
.vehicle-name{
  font-size:1.18rem;font-weight:800;color:#000;
  text-transform:uppercase;letter-spacing:.01em;margin-bottom:.15em;line-height:1.2;
}
.vehicle-licencia{
  font-size:.9rem;font-weight:700;color:#000;margin:0 0 16px;
}

/* Fila de datos con separadores, como en una ficha de catálogo */
.ficha-tecnica{
  display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
  border-top:1px solid rgba(22,32,42,.1);border-bottom:1px solid rgba(22,32,42,.1);
  padding:14px 0;margin-bottom:16px;
}
.ficha-dato{
  display:flex;flex-direction:column;align-items:center;gap:7px;
  text-align:center;padding:0 4px;position:relative;
}
.ficha-dato + .ficha-dato::before{
  content:"";position:absolute;left:0;top:10%;height:80%;width:1px;background:rgba(22,32,42,.12);
}
.ficha-dato svg{
  width:27px;height:27px;fill:none;stroke:#000;stroke-width:2.1;
  stroke-linecap:round;stroke-linejoin:round;
}
.ficha-dato span{font-size:.78rem;font-weight:800;color:#000;line-height:1.25;}

/* Calculadora y pie, adaptados al fondo claro */
.vehicle-card .vehicle-calc{
  background:rgba(255,255,255,.72);color:#000;font-weight:700;border:1px solid rgba(0,0,0,.1);
}
.vehicle-card .vehicle-calc-days{
  background:#fff;border-color:#d8dee5;color:#16202a;
}
.vehicle-card .vehicle-calc-total{color:var(--gold-dark);}
.vehicle-card .vehicle-footer{border-top:1px solid rgba(22,32,42,.1);padding-top:14px;}
.vehicle-card .vehicle-price span,
.vehicle-card .vehicle-price{color:#000;font-weight:700;}
.vehicle-card .vehicle-price strong{color:#000;}
.vehicle-card .vehicle-aviso.proxima{background:#fff6e5;color:#8a5a00;}

@media (max-width:420px){
  .ficha-dato svg{width:23px;height:23px;}
  .ficha-dato span{font-size:.7rem;}
  .vehicle-body{padding:4px 16px 18px;}
}
/* Con pocas motos, la ficha mantiene un ancho de catálogo en vez de estirarse */
#fleetGrid{grid-template-columns:repeat(auto-fit,minmax(270px,400px));justify-content:center;}

/* El botón Reservar late, como el de WhatsApp y el asistente */
.vehicle-card .js-reservar{
  animation:reservar-latido 3s ease-in-out infinite;
}
.vehicle-card .js-reservar:hover{animation:none;}
@keyframes reservar-latido{
  0%,100%{box-shadow:var(--shadow-card), 0 0 0 0 rgba(201,160,74,.55);}
  50%{box-shadow:var(--shadow-card), 0 0 0 10px rgba(201,160,74,0);}
}
@media (prefers-reduced-motion: reduce){
  .vehicle-card .js-reservar{animation:none;}
}

/* El botón de reservar por WhatsApp late, como el resto de botones */
.btn-whatsapp{animation:wa-boton-latido 3s ease-in-out infinite;}
.btn-whatsapp:hover{animation:none;}
@keyframes wa-boton-latido{
  0%,100%{box-shadow:0 8px 22px -10px rgba(37,211,102,.8), 0 0 0 0 rgba(37,211,102,.5);}
  50%{box-shadow:0 8px 22px -10px rgba(37,211,102,.8), 0 0 0 11px rgba(37,211,102,0);}
}
@media (prefers-reduced-motion: reduce){ .btn-whatsapp{animation:none;} }

/* Foto de la moto rotulada en la tarjeta "Motos premium" */
.mode-foto{
  display:block;width:auto;height:290px;margin:0 auto 18px;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.6));
}
.modes-grid-unica .mode-card{padding:26px 28px 30px;}
@media (max-width:560px){ .mode-foto{height:230px;} }
