/*
Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Description: Tema hijo de GeneratePress para el MVP de mercarenting.com
Author: Eduardo González — Sinergia Global
Template: generatepress
Version: 1.0.0
*/

    /* =========================================================
       MERCA RENTING — Landing Coming Soon
       CSS conforme al Manual de Identidad
       (Montserrat + Open Sans · #F58220 + #2D2D2D)
       ========================================================= */

    :root{
      --c-primary:        #F58220;
      --c-primary-hover:  #D96A10;
      --c-primary-bg:     #FFF3E6;
      --c-graphite:       #2D2D2D;
      --c-anthracite:     #404040;
      --c-text:           #666666;
      --c-text-soft:      #999999;
      --c-border:         #E8E8E8;
      --c-bg-alt:         #F5F5F5;
      --c-success:        #2E8B57;
      --c-error:          #DC3545;
      --c-info:           #0077B6;
      --c-oferta:         #E4002B; 
      --font-primary:     'Montserrat', sans-serif;
      --font-body:        'Open Sans', sans-serif;
      --radius:           6px;
      --radius-lg:        10px;
      --shadow-card:      0 4px 18px rgba(0,0,0,0.06);
      --shadow-card-hover:0 14px 36px rgba(0,0,0,0.12);
      --shadow-cta:       0 10px 30px rgba(245,130,32,0.35);
      --container:        1180px;

	/* Alias corporativos Merca Renting — compatibilidad documentación v3.1 */
	--mr-naranja:        var(--c-primary);
	--mr-naranja-hover:  var(--c-primary-hover);
	--mr-naranja-fondo:  var(--c-primary-bg);
	--mr-grafito:        var(--c-graphite);
	--mr-antracita:      var(--c-anthracite);
	--mr-texto:          var(--c-text);
	--mr-gris-medio:     var(--c-text-soft);
	--mr-gris-borde:     var(--c-border);
	--mr-gris-fondo:     var(--c-bg-alt);
	--mr-exito:          var(--c-success);
	--mr-error:          var(--c-error);
	--mr-info:           var(--c-info);
  --mr-oferta:         var(--c-oferta);
	--mr-font-titulo:    var(--font-primary);
	--mr-font-cuerpo:    var(--font-body);
    }

    *,*::before,*::after{box-sizing:border-box;}
    html{scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
    body{
      margin:0; font-family:var(--font-body); color:var(--c-text);
      line-height:1.6; font-size:16px; background:#fff;
      -webkit-font-smoothing:antialiased;
    }
    img{max-width:100%; height:auto; display:block;}
    a{color:var(--c-primary); transition:color .2s ease;}
    a:hover{color:var(--c-primary-hover);}

    h1,h2,h3,h4,h5,h6{
      font-family:var(--font-primary); color:var(--c-graphite);
      margin:0 0 16px; line-height:1.25;
    }

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

    /* ------------ Botones ------------ */
    .btn{
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      font-family:var(--font-primary); font-weight:700;
      text-transform:uppercase; letter-spacing:.5px;
      text-decoration:none; border:none; cursor:pointer;
      border-radius:var(--radius);
      transition:background .2s ease, transform .15s ease, box-shadow .2s ease;
      white-space:nowrap;
    }
    .btn-primary{background:var(--c-primary); color:#fff; padding:12px 22px; font-size:14px;}
    .btn-primary:hover{background:var(--c-primary-hover); color:#fff;}
    .btn-lg{padding:16px 36px; font-size:15px;}
    .btn-hero{box-shadow:var(--shadow-cta);}
    .btn-hero:hover{transform:translateY(-2px); box-shadow:0 14px 36px rgba(245,130,32,.45);}

    /* ------------ Header ------------ */
    .site-header{
      position:sticky; top:0; z-index:100;
      background:rgba(255,255,255,.96);
      backdrop-filter:saturate(180%) blur(8px);
      border-bottom:1px solid var(--c-border);
    }
    .site-header__inner{
      max-width:var(--container); margin:0 auto;
      padding:14px 24px; display:flex; align-items:center; justify-content:space-between;
    }
    .site-header__logo{display:inline-flex; align-items:center;}
    .site-header__logo img{height:38px;}

    /* ------------ Hero ------------ */
    .hero{
      position:relative; overflow:hidden; color:#fff;
      background:
        radial-gradient(1200px 600px at 80% 30%, rgba(245,130,32,.18), transparent 60%),
        radial-gradient(900px 500px at 10% 80%, rgba(245,130,32,.10), transparent 60%),
        linear-gradient(140deg, var(--c-graphite) 0%, var(--c-anthracite) 100%);
      padding:110px 24px 130px;
      text-align:center;
    }
    /* Patrón de puntos sutil */
    .hero::before{
      content:""; position:absolute; inset:0;
      background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
      background-size:24px 24px; opacity:.6; pointer-events:none;
    }
    /* Isotipo decorativo a la derecha */
    .hero::after{
      content:""; position:absolute;
      right:-120px; top:50%; transform:translateY(-50%);
      width:620px; height:620px;
      /* >>> IMAGEN 3: isotipo transparente (decorativo) <<< */
      background:url('IMG_ISOTIPO_TRANSPARENTE') center/contain no-repeat;
      opacity:.07; pointer-events:none;
    }
    .hero__content{position:relative; z-index:1; max-width:880px; margin:0 auto;}
    .hero__eyebrow{
      display:inline-block; font-family:var(--font-primary);
      font-size:12px; font-weight:600; letter-spacing:3px; text-transform:uppercase;
      color:var(--c-primary); padding:8px 16px;
      border:1px solid rgba(245,130,32,.5); border-radius:99px;
      background:rgba(245,130,32,.08);
      margin-bottom:28px;
    }
    .hero h1{
      color:#fff; font-weight:800;
      font-size:clamp(34px, 5.2vw, 56px);
      line-height:1.1; letter-spacing:-.5px;
      margin-bottom:24px;
    }
    .hero h1 .accent{color:var(--c-primary);}
    .hero__subtitle{
      font-size:clamp(16px, 1.6vw, 19px); line-height:1.6;
      color:rgba(255,255,255,.85); max-width:720px; margin:0 auto 40px;
    }
    /* Indicador de scroll */
    .hero__scroll{
      position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
      color:rgba(255,255,255,.55); font-size:11px;
      font-family:var(--font-primary); letter-spacing:2px; text-transform:uppercase;
      text-decoration:none; display:flex; flex-direction:column; align-items:center; gap:8px;
    }
    .hero__scroll svg{animation:bob 2s ease-in-out infinite;}
    @keyframes bob{0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);}}

    /* ------------ Bloques genéricos ------------ */
    section.block{padding:90px 24px;}
    .block__head{text-align:center; max-width:780px; margin:0 auto 56px;}
    .accent-line{
      display:block; width:56px; height:4px; background:var(--c-primary);
      border-radius:2px; margin:0 auto 22px;
    }
    .block h2{font-size:clamp(26px, 3.6vw, 38px); font-weight:700;}
    .block__lead{font-size:17px; color:var(--c-text); margin-top:8px;}

    /* ------------ ¿Qué es Merca Renting? ------------ */
    .what-is{background:#fff;}
    .what-is__content{max-width:820px; margin:0 auto; text-align:center;}
    .what-is__content p{font-size:18px; line-height:1.75; color:var(--c-text);}

    /* ------------ ¿A quién nos dirigimos? ------------ */
    .audience{background:var(--c-bg-alt);}
    .cards-grid{
      display:grid; gap:28px;
      grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
      max-width:1100px; margin:0 auto;
    }
    .card{
      background:#fff; border:1px solid var(--c-border);
      padding:40px 32px; border-radius:var(--radius-lg);
      box-shadow:var(--shadow-card);
      text-align:center; position:relative;
      transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .card::before{
      content:""; position:absolute; top:0; left:0; right:0; height:3px;
      background:linear-gradient(90deg, transparent, var(--c-primary), transparent);
      opacity:0; transition:opacity .25s ease;
      border-radius:var(--radius-lg) var(--radius-lg) 0 0;
    }
    .card:hover{transform:translateY(-6px); box-shadow:var(--shadow-card-hover); border-color:rgba(245,130,32,.4);}
    .card:hover::before{opacity:1;}
    .card__icon{
      width:72px; height:72px; margin:0 auto 22px;
      background:var(--c-primary-bg); color:var(--c-primary);
      border-radius:50%; display:flex; align-items:center; justify-content:center;
    }
    .card__icon svg{width:34px; height:34px;}
    .card h3{font-size:21px; font-weight:700; margin-bottom:12px;}
    .card p{color:var(--c-text); font-size:15px; line-height:1.6;}

    /* ------------ Ventajas ------------ */
    .advantages{background:#fff;}
    .adv-grid{
      display:grid; gap:36px 32px;
      grid-template-columns:repeat(auto-fit, minmax(290px, 1fr));
      max-width:1100px; margin:0 auto;
    }
    .adv{display:flex; gap:18px; align-items:flex-start;}
    .adv__icon{
      flex:0 0 52px; width:52px; height:52px;
      background:var(--c-primary); color:#fff;
      border-radius:var(--radius);
      display:flex; align-items:center; justify-content:center;
      box-shadow:0 6px 16px rgba(245,130,32,.25);
    }
    .adv__icon svg{width:26px; height:26px;}
    .adv__text h3{font-size:17px; font-weight:700; margin-bottom:6px;}
    .adv__text p{font-size:14px; line-height:1.55; color:var(--c-text); margin:0;}

    /* ------------ Banda “Estamos ultimando el portal” ------------ */
    .coming-soon-band{
      position:relative; overflow:hidden;
      background:linear-gradient(135deg, var(--c-primary) 0%, var(--c-primary-hover) 100%);
      color:#fff; padding:70px 24px; text-align:center;
    }
    .coming-soon-band::before{
      content:""; position:absolute; inset:0;
      background-image:radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px);
      background-size:20px 20px; opacity:.4; pointer-events:none;
    }
    .coming-soon-band .container{position:relative; z-index:1;}
    .coming-soon-band h2{color:#fff;}
    .coming-soon-band .accent-line{background:#fff;}
    .coming-soon-band p{
      color:rgba(255,255,255,.96); font-size:17px; line-height:1.65;
      max-width:760px; margin:0 auto;
    }

    /* ------------ Formulario ------------ */
    .lead-section{
      background:
        radial-gradient(800px 400px at 50% 0%, rgba(245,130,32,.10), transparent 60%),
        linear-gradient(180deg, var(--c-graphite) 0%, var(--c-anthracite) 100%);
      padding:90px 24px;
    }
    .lead-section h2{color:#fff;}
    .lead-section .block__lead{color:rgba(255,255,255,.85);}
    .lead-card{
      background:#fff; max-width:740px; margin:0 auto;
      padding:48px 44px; border-radius:var(--radius-lg);
      box-shadow:0 30px 80px rgba(0,0,0,.35);
      border-top:4px solid var(--c-primary);
    }
    .lead-card .privacy-foot{
      margin-top:18px; padding-top:18px;
      border-top:1px dashed var(--c-border);
      font-size:13px; color:var(--c-text-soft); text-align:center;
    }

    /* Placeholder visual del formulario para previsualización local
       (en WordPress lo sustituye el shortcode de WPForms) */
    .wpforms-placeholder{
      border:2px dashed var(--c-border); border-radius:var(--radius);
      padding:48px 24px; text-align:center; color:var(--c-text-soft);
      font-family:var(--font-primary); font-size:13px; letter-spacing:1px;
      text-transform:uppercase; background:var(--c-bg-alt);
    }

    /* ------------ Footer ------------ */
    .site-footer{
      background:var(--c-graphite); color:rgba(255,255,255,.72);
      padding:60px 24px 28px; font-size:14px;
    }
    .site-footer__top{
      max-width:var(--container); margin:0 auto;
      display:grid; gap:40px;
      grid-template-columns:2fr 1fr 1fr;
      padding-bottom:36px;
    }
    .site-footer__brand img{height:42px; margin-bottom:18px;}
    .site-footer__brand p{max-width:340px; color:rgba(255,255,255,.6);}
    .site-footer h4{
      color:#fff; font-family:var(--font-primary); font-weight:700;
      font-size:13px; text-transform:uppercase; letter-spacing:1.2px;
      margin-bottom:18px;
    }
    .site-footer__list{list-style:none; padding:0; margin:0;}
    .site-footer__list li{margin-bottom:8px; line-height:1.55;}
    .site-footer__list a{color:rgba(255,255,255,.72); text-decoration:none;}
    .site-footer__list a:hover{color:var(--c-primary);}
    .site-footer__bottom{
      max-width:var(--container); margin:0 auto;
      border-top:1px solid rgba(255,255,255,.08);
      padding-top:22px; text-align:center; font-size:13px;
      color:rgba(255,255,255,.5);
    }

    /* ------------ WPForms (overrides cuando renderice dentro de .lead-card) ------------ */
    .lead-card .wpforms-container .wpforms-field-label{
      font-family:var(--font-primary); color:var(--c-graphite); font-weight:600; font-size:14px;
    }
    .lead-card .wpforms-container input[type="text"],
    .lead-card .wpforms-container input[type="email"],
    .lead-card .wpforms-container input[type="tel"],
    .lead-card .wpforms-container input[type="number"],
    .lead-card .wpforms-container select,
    .lead-card .wpforms-container textarea{
      border:1px solid var(--c-border); border-radius:var(--radius);
      padding:12px 14px; font-family:var(--font-body); font-size:15px;
      transition:border-color .15s ease, box-shadow .15s ease;
    }
    .lead-card .wpforms-container input:focus,
    .lead-card .wpforms-container select:focus,
    .lead-card .wpforms-container textarea:focus{
      border-color:var(--c-primary); outline:none;
      box-shadow:0 0 0 3px rgba(245,130,32,.18);
    }
    .lead-card .wpforms-container button[type="submit"]{
      background:var(--c-primary) !important; color:#fff !important;
      border:none; padding:14px 36px; border-radius:var(--radius);
      font-family:var(--font-primary); font-weight:700; font-size:14px;
      text-transform:uppercase; letter-spacing:.5px; cursor:pointer;
      transition:background .2s ease, transform .15s ease;
    }
    .lead-card .wpforms-container button[type="submit"]:hover{
      background:var(--c-primary-hover) !important; transform:translateY(-1px);
    }

    /* ------------ Responsive ------------ */
    @media (max-width:768px){
      .site-header__inner{padding:12px 18px;}
      .site-header__logo img{height:28px;}
      .btn-primary{padding:10px 16px; font-size:13px;}
      .hero{padding:80px 20px 100px;}
      .hero::after{right:-200px; width:480px; height:480px; opacity:.05;}
      section.block{padding:64px 20px;}
      .lead-card{padding:32px 22px;}
      .coming-soon-band{padding:54px 20px;}
      .site-footer__top{grid-template-columns:1fr; gap:32px;}
      .site-footer{padding:48px 20px 24px;}
    }
    @media (max-width:480px){
      .hero{padding:64px 18px 90px;}
      .hero__eyebrow{font-size:11px; letter-spacing:2px; padding:6px 12px;}
    }

/* =============================================
   OVERRIDES GeneratePress — Landing Home
   ============================================= */
.widget-area { display: none; }

body.home .site.grid-container { max-width: 100%; padding: 0; }
body.home .site-content .content-area { width: 100% !important; }
body.home .inside-article { padding: 0 !important; max-width: 100% !important; background: transparent !important; }
body.home .entry-content { max-width: 100% !important; padding: 0 !important; margin: 0 !important; }
body.home .entry-header { display: none !important; }
body.home .site-header .inside-header { max-width: 100%; }
body.home .inside-navigation { max-width: 100%; }

/* Secciones full-bleed */
body.home .hero,
body.home .audience,
body.home .coming-soon-band,
body.home .lead-section,
body.home footer.site-footer { width: 100vw; margin-left: calc(-50vw + 50%); }

/* Ocultar header de la landing (el del tema ya cumple esa función) */
body.home .entry-content > header.site-header { display: none; }

/* Colores que GP sobreescribe */
body.home .hero h1 { color: #fff !important; }
body.home .hero h1 .accent { color: #F58220 !important; }
body.home .hero .hero__subtitle { color: rgba(255,255,255,.85) !important; }
body.home .coming-soon-band h2 { color: #fff !important; }
body.home .lead-section h2 { color: #fff !important; }
body.home .lead-section .block__lead { color: rgba(255,255,255,.85) !important; }
body.home footer.site-footer h4 { color: #fff !important; }

/* SVGs que GP infla por defecto */
body.home .card__icon svg { width: 34px !important; height: 34px !important; }
body.home .adv__icon svg { width: 26px !important; height: 26px !important; }

/* Labels del formulario a la izquierda */
body.home .wpforms-container .wpforms-field-label {
  text-align: left !important;
}
body.home .wpforms-container .wpforms-field {
  text-align: left !important;
}

/* Hero con imagen de fondo */
body.home .hero {
  background:
    linear-gradient(135deg, rgba(45,45,45,.82) 0%, rgba(64,64,64,.75) 100%),
    url('https://mercarenting.com/wp-content/uploads/hero-coche-renting-mercarenting.webp') center/cover no-repeat !important;
}


/* === Formulario en dos pasos (sin WPForms Pro) === */
body.home .wpforms-form .mr-step-2 { display: none; }
body.home .wpforms-form.mr-show-step-2 .mr-step-2 { display: block; }
body.home .wpforms-container .wpforms-form.mr-show-step-2 .mr-step-1-btn { display: none !important; }
body.home .wpforms-form:not(.mr-show-step-2) .wpforms-submit-container { display: none; }

/* Botón Continuar — forzar estilo */
body.home .wpforms-container .mr-step-1-btn {
  display: block !important;
  width: 100% !important;
  padding: 14px 36px !important;
  background: #F58220 !important;
  color: #fff !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-transform: uppercase !important;
  letter-spacing: .5px !important;
  border: none !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  margin-top: 16px !important;
  text-align: center !important;
  transition: background .2s ease !important;
}
body.home .wpforms-container .mr-step-1-btn:hover {
  background: #D96A10 !important;
}

.mr-step-divider {
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  color: #2D2D2D;
  font-size: 18px;
  margin: 30px 0 20px;
  padding-top: 24px;
  border-top: 2px solid #E8E8E8;
}

body.home .wpforms-container .wpforms-submit {
  width: 100% !important;
  padding: 14px 36px !important;
  font-size: 15px !important;
}
/* FIN === Formulario en dos pasos (sin WPForms Pro) === */


/* ============================================================
   MERCA RENTING · Ficha individual de vehículo (Hito 4 · Carril 2)
   Componentes .mr-* (BEM) sobre los tokens --c-* del :root.
   Clases nuevas y exclusivas del portal: no afecta a la landing.
   ============================================================ */

/* --- Contenedor general de la ficha --- */
.mr-vehicle-detail__article {
  max-width: var(--container);
  margin: 0 auto;
  padding: 32px 24px 64px;
  color: var(--c-text);
  font-family: var(--font-body);
}

.mr-vehicle-detail h1,
.mr-vehicle-detail h2,
.mr-vehicle-detail h3 {
  font-family: var(--font-primary);
  color: var(--c-graphite);
}

/* --- Hero --- */
.mr-vehicle-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  margin-bottom: 48px;
}

.mr-vehicle-hero__image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.mr-vehicle-hero__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
  padding: 24px;
  text-align: center;
  background: var(--c-bg-alt);
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-lg);
  color: var(--c-text-soft);
  font-family: var(--font-primary);
  font-weight: 600;
}

.mr-vehicle-hero__eyebrow {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--c-primary);
}

.mr-vehicle-hero__title {
  margin: 0 0 16px;
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  line-height: 1.15;
}

/* --- Badges --- */
.mr-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

/* Etiqueta DGT (familia dgt-*) */
[class*="mr-badge--dgt-"] {
  color: #fff;
  background: var(--c-text-soft); /* fallback si la etiqueta no está mapeada */
}

.mr-badge--dgt-eco  { background: linear-gradient(90deg, #0A9396 50%, #2E8B57 50%); }
.mr-badge--dgt-0,
.mr-badge--dgt-cero { background: #0077B6; }
.mr-badge--dgt-c    { background: #2E8B57; }
.mr-badge--dgt-b    { background: #E5A100; color: var(--c-graphite); }

.mr-ficha__badges {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .25rem 0 1rem;
}
.mr-ficha__badges .mr-badge { margin: 0; }

.mr-badge--oferta {
  background: var(--c-oferta);
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
}

/* --- Precio + selector de matriz --- */
.mr-price {
  margin: 20px 0 24px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.mr-price__label {
  margin: 0;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--c-text-soft);
}

.mr-price__amount {
  margin: 2px 0 4px;
  font-family: var(--font-primary);
  font-size: clamp(30px, 4vw, 42px);
  font-weight: 800;
  line-height: 1.1;
  color: var(--c-primary);
}

.mr-price__note {
  margin: 0 0 16px;
  font-size: 13px;
  color: var(--c-text-soft);
}

.mr-price__controls {
  display: grid;
  gap: 14px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}

.mr-price__control {
  display: grid;
  gap: 6px;
}

.mr-price__control-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-graphite);
}

.mr-price__select {
  width: 100%;
  padding: 10px 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--c-graphite);
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  cursor: pointer;
}

.mr-price__select:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-bg);
}

.mr-price__iva {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--c-text);
  cursor: pointer;
}

.mr-price__iva input {
  width: 16px;
  height: 16px;
  accent-color: var(--c-primary);
  cursor: pointer;
}

/* --- CTA --- */
.mr-vehicle-hero__cta {
  margin-top: 20px;
}

.mr-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  font-family: var(--font-primary);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--radius);
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.mr-button--primary {
  background: var(--c-primary);
  color: #fff;
  box-shadow: var(--shadow-cta);
}

.mr-button--primary:hover {
  background: var(--c-primary-hover);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(245, 130, 32, .45);
}

/* --- Secciones --- */
.mr-section {
  margin: 40px 0;
}

.mr-section > h2 {
  position: relative;
  margin: 0 0 20px;
  padding-bottom: 10px;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 700;
  border-bottom: 2px solid var(--c-border);
}

.mr-section > h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 56px;
  height: 2px;
  background: var(--c-primary);
}

/* --- Datos principales (specs) --- */
.mr-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0 32px;
}

.mr-specs__item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--c-border);
}

.mr-specs__label {
  font-size: 14px;
  color: var(--c-text);
}

.mr-specs__value {
  font-size: 15px;
  font-weight: 700;
  text-align: right;
  color: var(--c-graphite);
}

/* --- Servicios incluidos --- */
.mr-badge-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.mr-badge-list .mr-badge {
  padding: 8px 14px;
  font-weight: 500;
  background: var(--c-primary-bg);
  color: var(--c-graphite);
}

.mr-badge-list .mr-badge::before {
  content: "\2713";
  font-weight: 700;
  color: var(--c-primary);
}

/* --- Descripción --- */
.mr-vehicle-content {
  font-size: 16px;
  line-height: 1.7;
  color: var(--c-text);
}

.mr-vehicle-content p {
  margin: 0 0 14px;
}

/* --- Equipamiento --- */
.mr-equipment-group {
  margin-bottom: 24px;
}

.mr-equipment-group h3 {
  margin: 0 0 10px;
  font-size: 17px;
  font-weight: 700;
  text-transform: capitalize;
}

.mr-equipment-group ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 6px 24px;
}

.mr-equipment-group li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--c-text);
}

.mr-equipment-group li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c-primary);
}

/* --- Bloque de captación (placeholder hasta Jornada 3) --- */
.mr-vehicle-lead {
  padding: 28px;
  background: var(--c-bg-alt);
  border-radius: var(--radius-lg);
}

.mr-vehicle-lead__pending {
  font-style: italic;
  color: var(--c-text-soft);
}

/* --- Responsive --- */
@media (max-width: 860px) {
  .mr-vehicle-hero {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 600px) {
  .mr-vehicle-detail__article { padding: 24px 18px 48px; }
  .mr-specs { grid-template-columns: 1fr; }
  .mr-button { width: 100%; }
}

/* --- Galería de la ficha --- */
.mr-gallery__main {
  margin: 0;
  overflow: hidden;
  background: var(--c-bg-alt);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.mr-gallery__main-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.mr-gallery__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.mr-gallery__thumb {
  width: 84px;
  height: 60px;
  padding: 0;
  overflow: hidden;
  background: none;
  border: 2px solid var(--c-border);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color .15s ease;
}

.mr-gallery__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mr-gallery__thumb:hover,
.mr-gallery__thumb.is-active {
  border-color: var(--c-primary);
}


/* --- Etiqueta DGT como distintivo redondo (estilo pegatina real) --- */
.mr-vehicle-hero .mr-badge[class*="mr-badge--dgt-"] {
  flex-direction: column;
  justify-content: center;
  gap: 0;
  width: 56px;
  height: 56px;
  padding: 0;
  border-radius: 50%;
  font-size: 0; /* oculta el texto "Etiqueta ECO" y deja solo la letra */
  line-height: 1;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}

.mr-vehicle-hero .mr-badge[class*="mr-badge--dgt-"]::after {
  font-family: var(--font-primary);
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}

.mr-badge--dgt-eco::after  { content: "ECO"; font-size: 15px !important; }
.mr-badge--dgt-c::after    { content: "C"; }
.mr-badge--dgt-b::after    { content: "B"; }
.mr-badge--dgt-0::after,
.mr-badge--dgt-cero::after { content: "0"; }

/* Etiqueta ECO: mitad verde / mitad azul como la pegatina oficial */
.mr-vehicle-hero .mr-badge--dgt-eco {
  background: linear-gradient(90deg, #5BB12F 50%, #009EE0 50%);
  color: #fff;
}

/* --- Toggle de IVA moderno (switch) --- */
.mr-price__iva {
  gap: 10px;
}

.mr-price__iva input {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  width: 40px;
  height: 22px;
  margin: 0;
  border-radius: 999px;
  background: var(--c-border);
  transition: background .2s ease;
}

.mr-price__iva input::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
  transition: transform .2s ease;
}

.mr-price__iva input:checked {
  background: var(--c-primary);
}

.mr-price__iva input:checked::before {
  transform: translateX(18px);
}

.mr-price__iva input:focus-visible {
  outline: 2px solid var(--c-primary);
  outline-offset: 2px;
}


/* ==========================================================================
   Lightbox de galería (ficha de vehículo)
   ========================================================================== */
body.mr-lightbox-open {
  overflow: hidden;
}

.mr-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 4vh 6vw;
  background: rgba(17, 17, 17, 0.92);
}

.mr-lightbox.is-open {
  display: flex;
}

.mr-lightbox__figure {
  margin: 0;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mr-lightbox__img {
  max-width: 100%;
  max-height: 86vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: var(--radius, 8px);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.mr-lightbox__close,
.mr-lightbox__nav {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.mr-lightbox__close:hover,
.mr-lightbox__nav:hover,
.mr-lightbox__close:focus-visible,
.mr-lightbox__nav:focus-visible {
  background: var(--c-primary, #F58220);
  color: #fff;
  outline: none;
}

.mr-lightbox__close {
  top: 1.25rem;
  right: 1.25rem;
  width: 3rem;
  height: 3rem;
  font-size: 2rem;
  line-height: 1;
  border-radius: 50%;
}

.mr-lightbox__nav {
  top: 50%;
  transform: translateY(-50%);
  width: 3.25rem;
  height: 3.25rem;
  font-size: 2.25rem;
  line-height: 1;
  border-radius: 50%;
}

.mr-lightbox__nav--prev {
  left: 1.25rem;
}

.mr-lightbox__nav--next {
  right: 1.25rem;
}

.mr-lightbox__counter {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.35rem 0.9rem;
  font-family: var(--font-body, sans-serif);
  font-size: 0.9rem;
  color: #fff;
  background: rgba(0, 0, 0, 0.45);
  border-radius: 999px;
}

@media (max-width: 600px) {
  .mr-lightbox {
    padding: 2vh 0;
  }

  .mr-lightbox__nav {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.9rem;
  }

  .mr-lightbox__nav--prev {
    left: 0.5rem;
  }

  .mr-lightbox__nav--next {
    right: 0.5rem;
  }

  .mr-lightbox__img {
    max-height: 80vh;
    border-radius: 0;
  }
}

/* ==========================================================================
   Modal de confirmación del formulario de la ficha
   ========================================================================== */
body.mr-modal-open {
  overflow: hidden;
}

.mr-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(17, 17, 17, 0.55);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.mr-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.mr-modal {
  position: relative;
  width: 100%;
  max-width: 460px;
  padding: 2.5rem 2rem 2rem;
  text-align: center;
  background: #fff;
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  transform: translateY(12px) scale(0.98);
  transition: transform 0.2s ease;
}

.mr-modal-overlay.is-open .mr-modal {
  transform: translateY(0) scale(1);
}

.mr-modal__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 1.25rem;
  border-radius: 50%;
  background: rgba(245, 130, 32, 0.12);
}

.mr-modal__icon svg {
  width: 34px;
  height: 34px;
  stroke: var(--c-primary, #F58220);
}

.mr-modal__body {
  font-family: var(--font-body, sans-serif);
  font-size: 1rem;
  line-height: 1.55;
  color: var(--c-graphite, #2D2D2D);
}

.mr-modal__body p {
  margin: 0 0 0.5rem;
}

.mr-modal__close-btn {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.75rem 2.2rem;
  font-family: var(--font-primary, sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background: var(--c-primary, #F58220);
  border: 0;
  border-radius: var(--radius, 8px);
  cursor: pointer;
  transition: background 0.15s ease;
}

.mr-modal__close-btn:hover {
  background: var(--c-primary-hover, #D96A10);
}

.mr-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  font-size: 1.6rem;
  line-height: 1;
  color: #999;
  background: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.mr-modal__close:hover {
  background: #f2f2f2;
  color: var(--c-graphite, #2D2D2D);
}

@media (max-width: 600px) {
  .mr-modal {
    padding: 2rem 1.25rem 1.5rem;
  }
}


/* =========================================================================
   CATÁLOGO DE VEHÍCULOS  ·  archive-vehiculo.php   [v2 · tarjeta rediseñada]
   Prefijos: .mr-catalog, .mr-filters, .mr-vehicle-card.
   Reutiliza tokens --c-*, --radius*, --shadow-card*, --container, --font-*.
   ESTE BLOQUE SUSTITUYE al bloque "CATÁLOGO DE VEHÍCULOS" anterior de style.css.
   ========================================================================= */

/* ---------- Contenedor y cabecera ---------- */
.mr-catalog__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 32px 24px 64px;
  font-family: var(--font-body);
  color: var(--c-text);
}

.mr-catalog__header {
  margin-bottom: 24px;
}

.mr-catalog__title {
  margin: 0 0 6px;
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  line-height: 1.15;
}

.mr-catalog__count {
  margin: 0;
  font-size: 15px;
  color: var(--c-text-soft);
}

/* ---------- Barra de filtros ---------- */
.mr-filters {
  margin: 0 0 32px;
  padding: 20px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.mr-filters__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 16px;
}

.mr-filters__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mr-filters__label {
  font-family: var(--font-primary);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--c-anthracite);
}

.mr-filters__select,
.mr-filters__input {
  width: 100%;
  padding: 10px 12px;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--c-graphite);
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  transition: border-color .15s ease, box-shadow .15s ease;
}

.mr-filters__select:focus,
.mr-filters__input:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-bg);
}

.mr-filters__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--c-border);
}

.mr-filters__submit {
  margin-left: auto;
}

.mr-filters__reset {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-text-soft);
  text-decoration: none;
}

.mr-filters__reset:hover {
  color: var(--c-primary);
}

/* ---------- Rejilla ---------- */
.mr-catalog__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 26px;
}

/* ============================ TARJETA (v2) ============================== */
.mr-vehicle-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: transform .18s ease, box-shadow .25s ease;
}

.mr-vehicle-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-card-hover);
}

.mr-vehicle-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

/* ----- Media (imagen blanca, coche flotando) ----- */
.mr-vehicle-card__media {
  position: relative;
  aspect-ratio: 16 / 10;
  background: #fff;
  overflow: hidden;
}

.mr-vehicle-card__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 14px 16px;
  transition: transform .3s ease;
}

.mr-vehicle-card:hover .mr-vehicle-card__img {
  transform: scale(1.04);
}

.mr-vehicle-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 16px;
  text-align: center;
  font-family: var(--font-primary);
  font-weight: 600;
  color: var(--c-text-soft);
}

/* ----- Sello DGT circular (firma) ----- */
.mr-vehicle-card__dgt {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  flex-direction: column;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 50%;
  font-size: 0;
  line-height: 1;
  color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
}

.mr-vehicle-card__dgt::after {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
}

.mr-vehicle-card__dgt.mr-badge--dgt-eco::after {
  font-size: 12px;
}

.mr-vehicle-card__dgt.mr-badge--dgt-eco {
  background: linear-gradient(90deg, #5BB12F 50%, #009EE0 50%);
}

/* ----- Distintivo de oferta ----- */
.mr-vehicle-card__offer {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  padding: 6px 11px;
  font-family: var(--font-primary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: #fff;
  background: var(--c-oferta);
  border-radius: 999px;
  box-shadow: 0 2px 10px rgba(228, 0, 43, .4);
}

/* ----- Cuerpo ----- */
.mr-vehicle-card__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 16px 18px 18px;
  border-top: 1px solid var(--c-border);
}

.mr-vehicle-card__brand {
  margin: 0 0 3px;
  font-family: var(--font-primary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--c-primary);
}

.mr-vehicle-card__title {
  margin: 0 0 14px;
  font-family: var(--font-primary);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--c-graphite);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em; /* reserva 2 líneas: alinea precios entre tarjetas */
}

/* ----- Chips de specs con icono ----- */
.mr-vehicle-card__specs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.mr-vehicle-card__spec {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-anthracite);
  background: var(--c-bg-alt);
  border-radius: 8px;
}

.mr-vehicle-card__spec-icon {
  display: inline-flex;
  width: 15px;
  height: 15px;
  color: var(--c-primary);
}

.mr-vehicle-card__spec-icon svg {
  width: 100%;
  height: 100%;
}

/* ----- Precio ----- */
.mr-vehicle-card__price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--c-border);
}

.mr-vehicle-card__price-label {
  font-size: 12.5px;
  color: var(--c-text-soft);
}

.mr-vehicle-card__price-amount {
  font-family: var(--font-primary);
  font-size: 25px;
  font-weight: 800;
  line-height: 1;
  color: var(--c-primary);
}

.mr-vehicle-card__price-iva {
  font-size: 12px;
  color: var(--c-text-soft);
}

/* ----- CTA botón ----- */
.mr-vehicle-card__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
  padding: 11px 16px;
  font-family: var(--font-primary);
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: var(--c-primary);
  border: 1.5px solid var(--c-primary);
  border-radius: var(--radius);
  transition: background .18s ease, color .18s ease;
}

.mr-vehicle-card__cta-arrow {
  transition: transform .18s ease;
}

.mr-vehicle-card:hover .mr-vehicle-card__cta {
  background: #fff;
  color: var(--c-primary);
}

.mr-vehicle-card:hover .mr-vehicle-card__cta-arrow {
  transform: translateX(3px);
}

/* ---------- Estado vacío ---------- */
.mr-catalog__empty {
  padding: 48px 24px;
  text-align: center;
  background: var(--c-bg-alt);
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-lg);
  color: var(--c-text);
}

.mr-catalog__empty p {
  margin: 0 0 20px;
  font-size: 16px;
}

/* ---------- Paginación ---------- */
.mr-catalog__pagination {
  margin-top: 40px;
}

.mr-catalog__pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.mr-catalog__pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  font-family: var(--font-primary);
  font-weight: 600;
  color: var(--c-graphite);
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  text-decoration: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.mr-catalog__pagination .page-numbers:hover {
  border-color: var(--c-primary);
  color: var(--c-primary);
}

.mr-catalog__pagination .page-numbers.current {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff;
}

.mr-catalog__pagination .page-numbers.dots {
  border-color: transparent;
  background: transparent;
}

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .mr-catalog__inner { padding: 24px 18px 48px; }

  .mr-filters__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .mr-filters__submit { margin-left: 0; width: 100%; }

  .mr-filters__reset { text-align: center; }
}

@media (max-width: 480px) {
  .mr-catalog__grid { grid-template-columns: 1fr; }
}

/* ---------- Accesibilidad: movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  .mr-vehicle-card,
  .mr-vehicle-card__img,
  .mr-vehicle-card__cta,
  .mr-vehicle-card__cta-arrow {
    transition: none;
  }
  .mr-vehicle-card:hover { transform: none; }
  .mr-vehicle-card:hover .mr-vehicle-card__img { transform: none; }
  .mr-vehicle-card:hover .mr-vehicle-card__cta-arrow { transform: none; }
}


/* ==========================================================================
   CATÁLOGO · BARRA DE FILTROS / DRAWER (Hito 4 · Carril 2 · Fase B)
   Sin JS: panel inline usable (checkboxes multi → GET).
   Con JS (html.mr-js): panel lateral que abre/cierra el botón "Filtrar".
   ========================================================================== */

/* ---- Barra superior con el botón "Filtrar" (solo con JS) ---- */
.mr-catalog__toolbar {
  display: none;
  margin-bottom: 1.5rem;
}
html.mr-js .mr-catalog__toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.mr-filtros-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.mr-filtros-toggle__icon {
  display: inline-flex;
}
.mr-filtros-toggle__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.375rem;
  background: #fff;
  color: var(--c-primary);
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
}

/* ---- Panel (sin JS: tarjeta inline) ---- */
.mr-filtros-drawer {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  padding: 1.5rem;
  margin-bottom: 2rem;
}
.mr-filtros-drawer__head {
  display: none; /* solo con JS */
}
.mr-filtros-drawer__body {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem 2rem;
}
.mr-filtros-drawer__foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.25rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--c-border);
}

/* ---- Facetas ---- */
.mr-facet {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.mr-facet__title {
  font-family: var(--font-primary);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--c-text-soft);
  padding: 0;
  margin: 0 0 0.625rem;
}
.mr-facet__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.mr-facet__item {
  margin: 0;
}
.mr-facet__item.is-zero {
  opacity: 0.4;
}
.mr-facet__label {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.375rem 0.5rem;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 0.15s ease;
}
.mr-facet__label:hover {
  background: var(--c-bg-alt);
}
.mr-facet__label input {
  accent-color: var(--c-primary);
  width: 1.05rem;
  height: 1.05rem;
  flex: 0 0 auto;
  margin: 0;
}
.mr-facet__name {
  flex: 1 1 auto;
  color: var(--c-graphite);
  font-size: 0.95rem;
}
.mr-facet__count {
  flex: 0 0 auto;
  color: var(--c-text-soft);
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
}

/* Cuota */
.mr-facet__cuota {
  display: flex;
  gap: 0.75rem;
}
.mr-facet__cuota-field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  flex: 1 1 0;
  font-size: 0.8rem;
  color: var(--c-text-soft);
}

/* IVA dentro del panel */
.mr-facet--iva {
  margin-top: 0.25rem;
}

/* ---- Con JS: drawer lateral ---- */
html.mr-js .mr-filtros-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1000;
  width: min(380px, 90vw);
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: -8px 0 30px rgba(0, 0, 0, 0.18);
  padding: 0;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.28s ease;
  overflow: hidden;
}
html.mr-js .mr-filtros-drawer.is-open {
  transform: translateX(0);
}
html.mr-js .mr-filtros-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--c-border);
  flex: 0 0 auto;
}
html.mr-js .mr-filtros-drawer__title {
  margin: 0;
  font-size: 1.15rem;
}
.mr-filtros-drawer__close {
  border: 0;
  background: none;
  cursor: pointer;
  line-height: 1;
  font-size: 1.75rem;
  color: var(--c-text-soft);
  padding: 0 0.25rem;
}
.mr-filtros-drawer__close:hover {
  color: var(--c-graphite);
}
html.mr-js .mr-filtros-drawer__body {
  display: block;
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 1.5rem;
  gap: 0;
}
html.mr-js .mr-filtros-drawer__body .mr-facet {
  margin-bottom: 1.5rem;
}
html.mr-js .mr-filtros-drawer__foot {
  margin: 0;
  padding: 1.25rem 1.5rem;
  flex: 0 0 auto;
  justify-content: space-between;
  border-top: 1px solid var(--c-border);
}

/* Backdrop (solo con JS, al abrir) */
.mr-filtros-backdrop {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity 0.28s ease;
}
.mr-filtros-backdrop.is-open {
  opacity: 1;
}

/* Bloquea el scroll del fondo con el drawer abierto */
body.mr-filtros-abierto {
  overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  html.mr-js .mr-filtros-drawer,
  .mr-filtros-backdrop {
    transition: none;
  }
}



/* ============================================================
   FICHA · Formulario de captación en el hero (WPForms 228)
   Pegar al final de style.css. "Menos es más": sin etiquetas
   externas, el nombre del campo va dentro (placeholder).
   ============================================================ */

/* Tarjeta del formulario, bajo el precio/selector en la columna derecha */
.mr-vehicle-lead {
  max-width: none;
  margin: 1.75rem 0 0;
  padding: 1.5rem;
  background: var(--c-bg-alt);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
}
.mr-vehicle-lead .mr-vehicle-lead__title {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--c-graphite);
  font-size: 1.2rem;
  margin: 0 0 0.2rem;
}
.mr-vehicle-lead .mr-vehicle-lead__ref {
  margin: 0 0 1rem;
  font-size: 0.9rem;
  color: var(--c-text-soft);
}
.mr-vehicle-lead .mr-vehicle-lead__ref strong {
  color: var(--c-text);
}

/* --- Limpieza de WPForms --- */

/* oculta el título de cada campo (lo sustituye el placeholder) */
.mr-vehicle-lead .wpforms-field-label {
  display: none;
}
/* campos portadores Modelo / Referencia: ocultos por completo */
.mr-vehicle-lead .wpforms-field.mr-field-modelo,
.mr-vehicle-lead .wpforms-field.mr-field-referencia {
  display: none;
}
/* espaciado compacto entre campos */
.mr-vehicle-lead .wpforms-field {
  padding: 0;
  margin: 0 0 0.75rem;
}
/* inputs, textarea y select: ancho completo y estilo unificado */
.mr-vehicle-lead .wpforms-field input[type="text"],
.mr-vehicle-lead .wpforms-field input[type="email"],
.mr-vehicle-lead .wpforms-field input[type="tel"],
.mr-vehicle-lead .wpforms-field input[type="number"],
.mr-vehicle-lead .wpforms-field textarea,
.mr-vehicle-lead .wpforms-field select {
  width: 100%;
  max-width: 100%;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--c-graphite);
  line-height: 1.4;
  box-shadow: none;
}
.mr-vehicle-lead .wpforms-field textarea {
  min-height: 90px;
  resize: vertical;
}
.mr-vehicle-lead .wpforms-field input:focus,
.mr-vehicle-lead .wpforms-field textarea:focus,
.mr-vehicle-lead .wpforms-field select:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-bg);
}
.mr-vehicle-lead .wpforms-field ::placeholder {
  color: var(--c-text-soft);
  opacity: 1;
}

/* consentimiento: checkbox en línea, texto pequeño */
.mr-vehicle-lead .wpforms-field-checkbox ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mr-vehicle-lead .wpforms-field-checkbox li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0;
}
.mr-vehicle-lead .wpforms-field-checkbox input[type="checkbox"] {
  margin-top: 0.2rem;
  flex: 0 0 auto;
}
.mr-vehicle-lead .wpforms-field-label-inline {
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--c-text);
  font-weight: 400;
}

/* botón Enviar: naranja, a todo el ancho */
.mr-vehicle-lead .wpforms-submit-container {
  margin-top: 0.25rem;
}
.mr-vehicle-lead button.wpforms-submit {
  width: 100%;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  padding: 0.9rem 1.5rem;
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.18s ease;
}
.mr-vehicle-lead button.wpforms-submit:hover {
  background: var(--c-primary-hover);
  transform: translateY(-1px);
}

/* errores de validación */
.mr-vehicle-lead .wpforms-error {
  color: #c0392b;
  font-size: 0.8rem;
  margin-top: 0.25rem;
}
.mr-vehicle-lead .wpforms-field input.wpforms-error,
.mr-vehicle-lead .wpforms-field textarea.wpforms-error,
.mr-vehicle-lead .wpforms-field select.wpforms-error {
  border-color: #c0392b;
}


/* ==========================================================================
   FICHA · Maquetación "sidebar" (estilo Renting Finders)
   Columna IZQUIERDA larga: galería + datos + servicios + descripción +
   equipamiento (bloques contiguos, rellenan el alto -> sin huecos).
   Columna DERECHA: precio + selector + formulario, ocupa toda la columna.
   En MÓVIL: una sola columna en orden del DOM (galería -> precio/formulario
   -> resto), de modo que el formulario queda arriba.
   ========================================================================== */
.mr-ficha {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
  gap: 32px 44px;
  align-items: start;
  margin-bottom: 48px;
}
.mr-ficha > * { grid-column: 1; }          /* galería + bloques de info -> izquierda */
.mr-ficha__aside {
  grid-column: 2;
  grid-row: 1 / span 30;                    /* ocupa la columna derecha completa */
}

@media (max-width: 900px) {
  .mr-ficha { grid-template-columns: 1fr; gap: 28px; }
  .mr-ficha__aside { grid-column: 1; grid-row: auto; }
}

/* Bloques de información (encabezado compacto, no el grande de sección) */
.mr-ficha-block { margin: 0; }
.mr-ficha-block__title {
  position: relative;
  margin: 0 0 16px;
  padding-bottom: 8px;
  font-family: var(--font-primary);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--c-graphite);
  border-bottom: 2px solid var(--c-border);
}
.mr-ficha-block__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 44px;
  height: 2px;
  background: var(--c-primary);
}

/* Datos principales en tarjetas (etiqueta + valor) */
.mr-spec-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.mr-spec-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
}
.mr-spec-card__label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--c-text-soft);
}
.mr-spec-card__value {
  font-family: var(--font-primary);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--c-graphite);
}

/* Servicios incluidos en tarjetas con check */
.mr-services-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.mr-service-card {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 11px 14px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  font-size: 0.9rem;
  line-height: 1.35;
  color: var(--c-graphite);
}
.mr-service-card__icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  color: var(--c-primary);
  stroke: currentColor;
  fill: none;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 540px) {
  .mr-services-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   FICHA · Formulario WPForms — refuerzo
   Apunta a .wpforms-form + !important para GANAR a la especificidad propia de
   WPForms: oculta las etiquetas externas (el nombre va dentro, como placeholder),
   aprieta el espaciado entre campos y deja los inputs a ancho completo.
   ========================================================================== */
.mr-vehicle-lead .wpforms-form .wpforms-field-label {
  display: none !important;
}

.mr-vehicle-lead .wpforms-form .wpforms-field {
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  border: 0 !important;
}

/* campos portadores (Modelo / Referencia): ocultos por completo */
.mr-vehicle-lead .wpforms-form .wpforms-field.mr-field-modelo,
.mr-vehicle-lead .wpforms-form .wpforms-field.mr-field-referencia,
.mr-vehicle-lead .mr-field-oculto {
  display: none !important;
}

.mr-vehicle-lead .wpforms-form input[type="text"],
.mr-vehicle-lead .wpforms-form input[type="email"],
.mr-vehicle-lead .wpforms-form input[type="tel"],
.mr-vehicle-lead .wpforms-form input[type="number"],
.mr-vehicle-lead .wpforms-form textarea,
.mr-vehicle-lead .wpforms-form select {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.mr-vehicle-lead .wpforms-form textarea {
  min-height: 70px !important;
}

/* el texto del consentimiento (checkbox) SÍ se ve */
.mr-vehicle-lead .wpforms-form .wpforms-field-label-inline {
  display: inline !important;
}


/* === FICHA · Formulario: tipografía más fina (estilo Total Renting) === */
.mr-vehicle-lead .wpforms-form input[type="text"],
.mr-vehicle-lead .wpforms-form input[type="email"],
.mr-vehicle-lead .wpforms-form input[type="tel"],
.mr-vehicle-lead .wpforms-form input[type="number"],
.mr-vehicle-lead .wpforms-form textarea,
.mr-vehicle-lead .wpforms-form select {
  font-size: 0.875rem !important;   /* 14px */
  line-height: 1.4 !important;
  padding: 0.6rem 0.8rem !important;
}
.mr-vehicle-lead .wpforms-form input::placeholder,
.mr-vehicle-lead .wpforms-form textarea::placeholder {
  font-size: 0.875rem !important;
}

/* texto de los checkboxes (consentimiento + marketing: field_11 y field_16) */
.mr-vehicle-lead .wpforms-form .wpforms-field-label-inline {
  font-size: 0.8rem !important;     /* ~13px */
  font-weight: 400 !important;
  line-height: 1.4 !important;
  color: var(--c-text) !important;
}

/* === FICHA · Etiqueta DGT: solo el texto "Etiqueta X" ===
   La pegatina ::after (la letra) se reserva para las tarjetas del catálogo
   (.mr-vehicle-card__dgt). En la ficha el texto ya lo pinta el PHP, así que
   aquí anulamos el ::after para que no salga duplicada. */
.mr-ficha__aside .mr-badge[class*="mr-badge--dgt-"]::after {
  content: none !important;
}

/* === Etiquetas DGT · colores oficiales unificados (catálogo + ficha) ===
   ECO: verde (izquierda) + azul (derecha), igual en todas partes.
   0 emisiones: azul total con el "0" en blanco. */

.mr-badge--dgt-eco {
  background: linear-gradient(90deg, #5BB12F 50%, #009EE0 50%) !important;
  color: #fff !important;
}

/* «0 emisiones»: cubre dgt-0, dgt-0-emisiones, dgt-cero, dgt-cero-emisiones */
[class*="mr-badge--dgt-0"],
[class*="mr-badge--dgt-cero"] {
  background: #009EE0 !important;
  color: #fff !important;
}

/* la pegatina redonda del catálogo muestra el "0" (en la ficha va el texto) */
.mr-vehicle-card__dgt[class*="mr-badge--dgt-0"]::after,
.mr-vehicle-card__dgt[class*="mr-badge--dgt-cero"]::after {
  content: "0" !important;
}

/* Barra de scroll: reservar siempre el carril para que el contenido
   a ancho completo no quede descentrado (hueco a la derecha) */
html {
  scrollbar-gutter: stable both-edges;
}

/* ==========================================================================
   CONTACTO — misma identidad que la ficha (.mr-vehicle-lead) + tarjetas
   ========================================================================== */

/* Tarjetas: datos y formulario */
.mr-contacto .mr-contacto__info,
.mr-contacto .mr-contacto__form {
  background: var(--c-bg-alt);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  padding: 1.75rem;
}

/* Títulos de sección */
.mr-contacto h3 {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--c-graphite);
  font-size: 1.2rem;
  margin: 0 0 1rem;
}

/* Datos de contacto */
.mr-contacto .mr-contacto__info p { color: var(--c-text); line-height: 1.7; }
.mr-contacto .mr-contacto__info a { color: var(--c-primary); text-decoration: none; font-weight: 600; }
.mr-contacto .mr-contacto__info a:hover { text-decoration: underline; }

/* --- WPForms en Contacto: mismo estilo que la ficha, con etiquetas visibles --- */
.mr-contacto .wpforms-field-label {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--c-graphite);
  font-size: 0.9rem;
  margin: 0 0 0.35rem;
}
.mr-contacto .wpforms-field { padding: 0; margin: 0 0 0.85rem; }
.mr-contacto .wpforms-field input[type="text"],
.mr-contacto .wpforms-field input[type="email"],
.mr-contacto .wpforms-field input[type="tel"],
.mr-contacto .wpforms-field input[type="number"],
.mr-contacto .wpforms-field textarea,
.mr-contacto .wpforms-field select {
  width: 100%;
  max-width: 100%;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--c-graphite);
  line-height: 1.4;
  box-shadow: none;
}
.mr-contacto .wpforms-field textarea { min-height: 120px; resize: vertical; }
.mr-contacto .wpforms-field input:focus,
.mr-contacto .wpforms-field textarea:focus,
.mr-contacto .wpforms-field select:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-bg);
}
.mr-contacto .wpforms-field ::placeholder { color: var(--c-text-soft); opacity: 1; }

/* consentimiento */
.mr-contacto .wpforms-field-checkbox ul { list-style: none; margin: 0; padding: 0; }
.mr-contacto .wpforms-field-checkbox li { display: flex; align-items: flex-start; gap: 0.5rem; margin: 0; }
.mr-contacto .wpforms-field-checkbox input[type="checkbox"] { margin-top: 0.2rem; flex: 0 0 auto; }
.mr-contacto .wpforms-field-label-inline { font-size: 0.82rem; line-height: 1.45; color: var(--c-text); font-weight: 400; }

/* botón enviar naranja a todo el ancho */
.mr-contacto .wpforms-submit-container { margin-top: 0.25rem; }
.mr-contacto button.wpforms-submit {
  width: 100%;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  padding: 0.9rem 1.5rem;
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.18s ease;
}
.mr-contacto button.wpforms-submit:hover { background: var(--c-primary-hover); transform: translateY(-1px); }

/* errores */
.mr-contacto .wpforms-error { color: #c0392b; font-size: 0.8rem; margin-top: 0.25rem; }
.mr-contacto .wpforms-field input.wpforms-error,
.mr-contacto .wpforms-field textarea.wpforms-error,
.mr-contacto .wpforms-field select.wpforms-error { border-color: #c0392b; }

/* mapa */
.mr-contacto__map {
  position: relative; padding-bottom: 48%; height: 0; overflow: hidden;
  border-radius: var(--radius-lg); border: 1px solid var(--c-border); margin-top: 0.5rem;
}
.mr-contacto__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* responsive */
@media (max-width: 768px) {
  .mr-contacto .mr-contacto__info { margin-bottom: 1.25rem; }
}

/* === Contacto · refuerzo de especificidad sobre WPForms (botón y campos) === */
.mr-contacto .wpforms-container button.wpforms-submit,
.mr-contacto .wpforms-container input.wpforms-submit {
  background-color: var(--c-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius) !important;
  width: 100% !important;
  padding: 0.9rem 1.5rem !important;
  font-family: var(--font-primary) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  box-shadow: none !important;
  transition: background-color 0.18s ease, transform 0.18s ease !important;
}
.mr-contacto .wpforms-container button.wpforms-submit:hover,
.mr-contacto .wpforms-container input.wpforms-submit:hover {
  background-color: var(--c-primary-hover) !important;
  transform: translateY(-1px) !important;
}

.mr-contacto .wpforms-container input[type="text"],
.mr-contacto .wpforms-container input[type="email"],
.mr-contacto .wpforms-container input[type="tel"],
.mr-contacto .wpforms-container input[type="number"],
.mr-contacto .wpforms-container textarea,
.mr-contacto .wpforms-container select {
  border: 1px solid var(--c-border) !important;
  border-radius: var(--radius) !important;
  background-color: #fff !important;
  padding: 0.75rem 0.9rem !important;
  box-shadow: none !important;
}
.mr-contacto .wpforms-container input:focus,
.mr-contacto .wpforms-container textarea:focus,
.mr-contacto .wpforms-container select:focus {
  border-color: var(--c-primary) !important;
  box-shadow: 0 0 0 3px var(--c-primary-bg) !important;
}

/* ==========================================================================
   CABECERA · menú estilo Total Renting (tipografía + teléfono + CTA)
   ========================================================================== */

/* Tipografía de marca en el menú (Montserrat, ya cargada en --font-primary) */
.main-navigation .menu-item > a {
  font-family: var(--font-primary);
  font-weight: 600;
}

/* Alineación vertical de los dos items especiales */
.main-navigation .menu-item.mr-menu-phone,
.main-navigation .menu-item.mr-menu-cta {
  display: flex;
  align-items: center;
}
.main-navigation .menu-item.mr-menu-phone { margin-left: 0.5rem; }
.main-navigation .menu-item.mr-menu-cta { margin-left: 0.4rem; }

/* Teléfono en píldora con borde */
.main-navigation .menu-item.mr-menu-phone > a {
  display: inline-flex;
  align-items: center;
  border: 2px solid var(--c-primary);
  color: var(--c-primary) !important;
  background: transparent !important;
  border-radius: 999px;
  padding: 0.5rem 1.1rem !important;
  font-weight: 700;
  line-height: 1 !important;
  transition: background-color 0.18s ease, color 0.18s ease;
}
.main-navigation .menu-item.mr-menu-phone > a::before {
  content: "";
  width: 16px;
  height: 16px;
  margin-right: 0.45rem;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.main-navigation .menu-item.mr-menu-phone > a:hover {
  background-color: var(--c-primary) !important;
  color: #fff !important;
}

/* Botón CTA relleno */
.main-navigation .menu-item.mr-menu-cta > a {
  display: inline-flex;
  align-items: center;
  background-color: var(--c-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px;
  padding: 0.55rem 1.3rem !important;
  font-weight: 700;
  line-height: 1 !important;
  transition: background-color 0.18s ease, transform 0.18s ease;
}
.main-navigation .menu-item.mr-menu-cta > a:hover {
  background-color: var(--c-primary-hover) !important;
  transform: translateY(-1px);
}

/* Móvil: que no salgan estirados dentro del menú hamburguesa */
@media (max-width: 768px) {
  .main-navigation .menu-item.mr-menu-phone > a,
  .main-navigation .menu-item.mr-menu-cta > a {
    display: inline-flex;
    margin: 0.4rem 0;
  }
}

/* ==========================================================================
   FOOTER de marca — Merca Renting
   ========================================================================== */
.mr-footer {
  width: 100%;
  background: var(--c-graphite);
  color: rgba(255,255,255,0.72);
  font-family: var(--font-body);
}
.mr-footer__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: clamp(2.5rem, 5vw, 3.5rem) 1.25rem;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 2.5rem;
}
.mr-footer__logo { display: block; height: 43px; width: auto; margin: 0 0 1.1rem; }
.mr-footer__claim { font-size: 0.92rem; line-height: 1.65; margin: 0 0 1.25rem; max-width: 38ch; }
.mr-footer__data { font-size: 0.9rem; line-height: 1.7; margin: 0; }
.mr-footer__data a { color: #fff; text-decoration: none; }
.mr-footer__data a:hover { color: var(--c-primary); }

.mr-footer__title {
  font-family: var(--font-primary);
  font-weight: 700;
  color: #fff;
  font-size: 1rem;
  margin: 0 0 1rem;
}
.mr-footer__links { list-style: none; margin: 0; padding: 0; }
.mr-footer__links li { margin: 0 0 0.6rem; }
.mr-footer__links a {
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  font-size: 0.92rem;
  transition: color 0.15s ease;
}
.mr-footer__links a:hover { color: var(--c-primary); }

.mr-footer__bar { border-top: 1px solid rgba(255,255,255,0.12); }
.mr-footer__bar-inner { max-width: var(--container); margin: 0 auto; padding: 1.25rem; text-align: center; }
.mr-footer__bar p { margin: 0; font-size: 0.82rem; color: rgba(255,255,255,0.55); }

/* Responsive */
@media (max-width: 860px) {
  .mr-footer__inner { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .mr-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 540px) {
  .mr-footer__inner { grid-template-columns: 1fr; }
}