/* ============================================================
   1) SECCIÓN — fondo navy + patrón  (.mmq)
   ============================================================ */
.mmq{
  --q-navy:#13304C;
  --q-navy-deep:#0E2740;
  --q-orange:#F26A21;
  --q-font:'Hanken Grotesk',system-ui,-apple-system,"Segoe UI",sans-serif;

  position:relative;
  background:var(--q-navy);
  color:#fff;
  padding:94px 0 108px;
  overflow:hidden;
  font-family:var(--q-font);
  -webkit-font-smoothing:antialiased;
}
.mmq *,.mmq *::before,.mmq *::after{box-sizing:border-box}

/* Reset defensivo SOLO dentro del bloque: neutraliza lo que el
   tema/Elementor le mete a párrafos, botones y campos.
   Va con :where() para que NO le gane a las clases de abajo. */
.mmq :where(img){display:block;max-width:100%}
.mmq :where(p,h2,h3){margin:0}
.mmq :where(button,input,select,textarea){
  font-family:inherit;line-height:normal;letter-spacing:normal;
  text-transform:none;box-shadow:none;
}
.mmq :where(button){-webkit-appearance:none;appearance:none}

/* Patrón de barras verticales */
.mmq::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-color:var(--q-navy);
  background-image:
    repeating-linear-gradient(0deg,  var(--q-navy) 0 13px, transparent 13px 58px),
    repeating-linear-gradient(90deg, rgba(126,162,204,.12) 0 30px, transparent 30px 44px);
}
/* Vignette + resplandor naranja */
.mmq::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 8%,   rgba(255,255,255,.05), transparent 45%),
    radial-gradient(65% 42% at 50% 20%,   rgba(242,106,33,.18),  transparent 62%),
    radial-gradient(140% 120% at 50% 100%,rgba(8,20,36,.5),      transparent 60%);
}

.mmq__in{
  position:relative;z-index:2;text-align:center;
  max-width:1180px;margin:0 auto;padding:0 40px;
}

/* Badge "★ LO MÁS USADO" */
.mmq__badge{
  display:inline-flex;align-items:center;gap:9px;
  font-weight:500;font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:#fff;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.20);
  padding:9px 18px;border-radius:999px;
}
.mmq__badge span{font-size:12px;line-height:1}

.mmq__title{
  font-weight:800;font-size:clamp(34px,4.8vw,56px);
  line-height:1.04;letter-spacing:-.025em;
  margin-top:22px;color:#fff;
}
.mmq__sub{
  font-weight:400;font-size:16px;line-height:1.55;
  color:#AEBECE;max-width:46ch;margin:16px auto 0;
}

@media (max-width:960px){
  .mmq{padding:64px 0 74px}
  .mmq__in{padding:0 24px}
}
@media (max-width:560px){
  .mmq__in{padding:0 18px}
}


/* ============================================================
   2) COTIZADOR (.mmc) — reemplaza la imagen placeholder
   ============================================================ */
.mmc{
  --navy:#213962;
  --navy-dark:#1B2F52;
  --navy-soft:#33507F;
  --orange:#FF6200;
  --orange-soft:#FFF3EA;
  --orange-line:#FFD9BE;
  --peach:#FFE6D3;
  --border:#E4E8EF;
  --grey:#F1F3F7;
  --white:#fff;
  --r-card:20px;
  --r-box:12px;
  --r-pill:999px;

  /* ← ancho de la tarjeta: cámbialo aquí y ya */
  --mmc-w:880px;

  font-family:var(--q-font);
  max-width:var(--mmc-w);
  margin:46px auto 0;
  background:var(--white);
  border-radius:var(--r-card);
  overflow:hidden;
  box-shadow:0 26px 60px rgba(6,18,34,.38);
  color:var(--navy);
  text-align:left;          /* corta el text-align:center de la sección */
}
.mmc :where(button){cursor:pointer;border:0;background:none;color:inherit}
.mmc :where(input,select,textarea){color:var(--navy)}
.mmc :where(p){margin:0}

/* Barra superior */
.mmc__topbar{
  background:var(--navy-dark);color:#fff;text-align:center;
  padding:11px 16px;font-size:13.5px;font-weight:600;letter-spacing:.01em;
}
.mmc__topbar em{color:var(--orange);font-style:normal;font-weight:600;margin-left:6px}
.mmc__topbar > span{opacity:.85;margin-right:4px}

.mmc__body{padding:26px 34px 30px}

.mmc__brand{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:22px}
.mmc__brand-name{font-weight:700;letter-spacing:.06em;font-size:17px}

/* Stepper */
.mmc__steps{display:flex;align-items:flex-start;justify-content:center;margin-bottom:26px}
.mmc__step{display:flex;flex-direction:column;align-items:center;gap:7px;width:74px}
.mmc__dot{
  width:30px;height:30px;border-radius:50%;background:var(--grey);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#B4BECD;transition:.25s;
}
.mmc__step.is-current .mmc__dot,.mmc__step.is-done .mmc__dot{background:var(--navy);color:#fff}
.mmc__slabel{font-size:11.5px;font-weight:600;color:#AEB8C7;text-align:center;transition:.25s}
.mmc__step.is-current .mmc__slabel{color:var(--navy)}
.mmc__line{flex:0 1 62px;height:2px;background:var(--border);margin-top:14px;border-radius:2px;transition:.25s}
.mmc__line.is-done{background:var(--navy);height:2.5px}

/* Pantallas */
.mmc__screens{position:relative}
.mmc__screen{display:none}
.mmc__screen.is-active{display:block;animation:mmcIn .28s ease}
@keyframes mmcIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.mmc__screen.is-active{animation:none}}

.mmc__eyebrow{
  text-align:center;color:var(--orange);font-size:11.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px;
}
.mmc__title{
  text-align:center;font-size:31px;line-height:1.2;font-weight:800;
  margin:0 0 10px;letter-spacing:-.01em;color:var(--navy);
}
.mmc__sub{text-align:center;color:#8794A8;font-size:15px;margin:0 0 24px}
.mmc__title + .mmc__grid2,.mmc__title + .mmc__field,.mmc__title + .mmc__opts{margin-top:22px}

/* Campos */
.mmc__input,.mmc__textarea{
  width:100%;border:1.5px solid var(--border);background:#fff;
  padding:16px 22px;font-size:15px;outline:none;transition:.2s;
}
.mmc__input{border-radius:var(--r-pill)}
.mmc__input::placeholder,.mmc__textarea::placeholder{color:#A9B3C2}
.mmc__input:focus,.mmc__textarea:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,98,0,.10)}
.mmc__grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mmc__field{margin-bottom:14px}
.mmc__input--date{text-align:center;color:var(--navy)}
.mmc__textarea{border-radius:var(--r-box);min-height:96px;resize:vertical;padding:14px 18px}
.mmc__pill{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;border:1.5px solid var(--border);border-radius:var(--r-pill);
  padding:14px 22px;font-size:15px;background:#fff;
}
.mmc__pill > span{color:#7C89A0}
.mmc__select{border:0;background:none;outline:none;font-size:15px;font-weight:600;text-align:right}

.mmc__ghost-orange{
  display:block;margin:16px auto 0;border:1.5px solid var(--orange);color:var(--orange) !important;
  background:#fff !important;border-radius:var(--r-pill);padding:13px 26px;font-size:14.5px;font-weight:700;transition:.2s;
}
.mmc__ghost-orange:hover{background:var(--orange-soft) !important;color:var(--orange) !important;border-color:var(--orange) !important}
.mmc__ghost-orange.is-on{background:var(--orange) !important;color:#fff !important;border-color:var(--orange) !important}
.mmc__ghost-orange.is-on:hover{background:#E85800 !important;color:#fff !important}

/* Tarjetas de opción
   Colores de marca fijados con !important en TODOS los estados
   (normal / hover / seleccionado) — el tema/Elementor trae su
   propio color de acento en :hover y sin esto se cuela. */
.mmc__opts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mmc__opt{
  display:flex;align-items:center;gap:14px;text-align:left;
  border:1.5px solid var(--border);border-radius:var(--r-box);
  padding:18px 20px;font-size:15px;font-weight:600;background:#fff !important;color:var(--navy) !important;transition:.2s;
}
.mmc__opt:hover{border-color:var(--orange) !important;background:var(--orange-soft) !important;color:var(--navy) !important}
.mmc__opt .mmc__box{width:22px;height:22px;border-radius:7px;background:var(--peach) !important;flex:0 0 auto;transition:.2s}
.mmc__opt:hover .mmc__box{background:var(--orange) !important}
.mmc__opt.is-on{background:var(--navy) !important;border-color:var(--navy) !important;color:#fff !important}
.mmc__opt.is-on:hover{background:var(--navy-soft) !important;border-color:var(--navy-soft) !important;color:#fff !important}
.mmc__opt.is-on .mmc__box{background:rgba(255,255,255,.28) !important}
.mmc__opt.is-on:hover .mmc__box{background:rgba(255,255,255,.28) !important}

.mmc__choices{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.mmc__choice{
  border:1.5px solid var(--border);border-radius:var(--r-pill);
  padding:13px 26px;font-size:14.5px;font-weight:600;background:#fff !important;color:var(--navy) !important;transition:.2s;
}
.mmc__choice:hover{border-color:var(--orange) !important;background:var(--orange-soft) !important;color:var(--orange) !important}
.mmc__choice.is-on{background:var(--navy) !important;border-color:var(--navy) !important;color:#fff !important}
.mmc__choice.is-on:hover{background:var(--navy-soft) !important;border-color:var(--navy-soft) !important;color:#fff !important}

.mmc__stack{display:flex;flex-direction:column;gap:13px;max-width:640px;margin:0 auto}
.mmc__stack .mmc__choice{width:100%;text-align:center;padding:16px 20px}

/* Callout */
.mmc__note{
  display:flex;align-items:center;gap:16px;justify-content:space-between;
  background:var(--orange-soft);border:1.5px solid var(--orange-line);
  border-radius:var(--r-box);padding:16px 18px;margin-top:22px;
}
.mmc__note-eyebrow{
  color:var(--orange);font-size:10.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;margin-bottom:6px;
}
.mmc__note-txt{font-size:13.5px;line-height:1.5;color:var(--navy)}
.mmc__tile{
  width:44px;height:44px;border-radius:10px;background:var(--navy);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
}

.mmc__map{
  height:150px;border-radius:var(--r-box);background:var(--grey);
  display:flex;align-items:center;justify-content:center;
  color:#A6B0C0;font-size:13.5px;margin-bottom:16px;
}

/* Inventario — 2 modos (se retiró "Visita guiada con IA") */
.mmc__modes{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:22px}
.mmc__mode{
  text-align:left;border:1.5px solid var(--border);border-radius:var(--r-box);
  padding:16px;background:#fff !important;transition:.2s;
}
.mmc__mode:hover{border-color:var(--orange) !important;background:var(--orange-soft) !important}
.mmc__mode-num{color:var(--orange) !important;font-size:11px;font-weight:700;margin-bottom:8px}
.mmc__mode-name{font-size:14.5px;font-weight:700;margin-bottom:5px;color:var(--navy) !important}
.mmc__mode-desc{font-size:12px;line-height:1.45;color:#93A0B2 !important}
.mmc__mode.is-on{background:var(--navy) !important;border-color:var(--navy) !important}
.mmc__mode.is-on:hover{background:var(--navy-soft) !important;border-color:var(--navy-soft) !important}
.mmc__mode.is-on .mmc__mode-name{color:#fff !important}
.mmc__mode.is-on .mmc__mode-desc{color:#B7C4D8 !important}
.mmc__mode.is-on .mmc__mode-num{color:var(--orange) !important}

.mmc__stats{display:flex;justify-content:center;gap:44px;margin:6px 0 20px}
.mmc__stat{text-align:center}
.mmc__stat b{display:block;font-size:23px;font-weight:800;line-height:1.1}
.mmc__stat b.is-orange{color:var(--orange)}
.mmc__stat span{font-size:12px;color:#93A0B2}

.mmc__rows{display:flex;flex-direction:column;gap:11px}
.mmc__row{
  display:flex;align-items:center;gap:14px;
  border:1.5px solid var(--border);border-radius:var(--r-box);padding:13px 16px;
}
.mmc__row-info{flex:1;min-width:0}
.mmc__row-name{font-size:14.5px;font-weight:700}
.mmc__row-desc{font-size:12px;color:#93A0B2;margin-top:2px}
.mmc__thumb{
  width:56px;height:42px;border-radius:8px;background:var(--grey);flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;color:#B6BFCC;font-size:10.5px;
  background-size:cover;background-position:center;
}
.mmc__count{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.mmc__step-btn{
  width:26px;height:26px;border-radius:50%;background:var(--grey);color:#7F8DA2;
  font-size:16px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s;
}
.mmc__step-btn:hover{background:#E4E8EF}
.mmc__step-btn--plus{background:var(--orange);color:#fff}
.mmc__step-btn--plus:hover{background:#E85800}
.mmc__qty{min-width:16px;text-align:center;font-size:14.5px;font-weight:700}
.mmc__photo-btn{
  background:var(--navy);color:#fff;border-radius:8px;
  padding:10px 16px;font-size:12.5px;font-weight:700;flex:0 0 auto;transition:.2s;
}
.mmc__photo-btn:hover{background:var(--navy-soft)}
.mmc__manual-label{font-size:13.5px;color:#7C89A0;margin:20px 0 8px}

/* Revisión */
.mmc__review{background:var(--grey);border-radius:var(--r-box);padding:10px 22px;max-width:640px;margin:0 auto}
.mmc__review-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;font-size:14.5px}
.mmc__review-row + .mmc__review-row{border-top:1px solid #E3E7EE}
.mmc__review-row b{font-weight:700}
.mmc__review-empty{text-align:center;color:#93A0B2;padding:20px 0;font-size:14px}

/* Cotización */
.mmc__ticket{
  border:1.5px solid var(--orange-line);background:var(--orange-soft);
  border-radius:var(--r-box);padding:26px;max-width:660px;margin:0 auto;
}
.mmc__folio{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#A9927F;margin-bottom:8px}
.mmc__price{font-size:33px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.mmc__price-note{font-size:12.5px;color:#A0AABB;margin:6px 0 20px}
.mmc__line-row{display:flex;justify-content:space-between;font-size:14.5px;padding:7px 0}
.mmc__line-row span:first-child{color:#5F708A}
.mmc__line-row span:last-child{font-weight:700}
.mmc__cta{
  display:block;width:100%;text-align:center;background:var(--orange) !important;color:#fff !important;
  border-radius:10px;padding:17px;font-size:15.5px;font-weight:700;margin-top:20px;transition:.2s;
}
.mmc__cta:hover{background:#E85800 !important;color:#fff !important}
.mmc__cta--alt{background:#fff !important;color:var(--navy) !important;border:1.5px solid var(--border);margin-top:11px;font-weight:600}
/* Bug reportado: en hover el texto se ponía blanco sobre fondo
   blanco (el tema no dejaba fijo el color). Ahora queda fijo. */
.mmc__cta--alt:hover{background:var(--orange-soft) !important;color:var(--navy) !important;border-color:var(--orange) !important}

/* Footer del cotizador */
.mmc__footer{
  display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--border);padding:18px 34px;background:#fff;
}
.mmc__footer.is-hidden{display:none}
.mmc__btn{border-radius:var(--r-pill);padding:14px 26px;font-size:14.5px;font-weight:700;transition:.2s}
.mmc__btn--ghost{border:1.5px solid var(--border);color:var(--navy) !important;background:#fff !important}
.mmc__btn--ghost:hover{border-color:var(--orange) !important;color:var(--navy) !important;background:var(--orange-soft) !important}
.mmc__btn--ghost.is-hidden{visibility:hidden}
.mmc__btn--primary{background:var(--orange) !important;color:#fff !important;box-shadow:0 8px 18px rgba(255,98,0,.28)}
.mmc__btn--primary:hover{background:#E85800 !important;color:#fff !important}
.mmc__btn--primary[disabled]{background:#C3CBD8 !important;color:#fff !important;box-shadow:none;cursor:not-allowed}
.mmc :focus-visible{outline:2px solid var(--orange) !important;outline-offset:2px}

@media (max-width:640px){
  .mmc{margin-top:32px;border-radius:16px}
  .mmc__body{padding:22px 18px 24px}
  .mmc__title{font-size:23px}
  .mmc__grid2,.mmc__opts,.mmc__modes{grid-template-columns:1fr}
  .mmc__step{width:64px}
  .mmc__line{flex-basis:26px}
  .mmc__slabel{font-size:10.5px}
  .mmc__footer{padding:14px 18px}
  .mmc__btn{padding:13px 20px;font-size:13.5px}
  .mmc__stats{gap:30px}
  .mmc__price{font-size:27px}
  .mmc__row{flex-wrap:wrap}
  .mmc__photo-btn{width:100%;text-align:center}
}