/* ==========================================================
   HONDU MEX V3 — Visual claro / blanco / vidrio / aluminio
   Este archivo se carga encima del CSS original de TDM.
   ========================================================== */

:root{
  --hondu-white:#ffffff;
  --hondu-ice:#f5fcfd;
  --hondu-soft:#eef8fa;
  --hondu-panel:#ffffff;
  --hondu-aqua:#2ccbd3;
  --hondu-teal:#0798a5;
  --hondu-deep:#0f4c5c;
  --hondu-charcoal:#15232a;
  --hondu-muted:#60747c;
  --hondu-silver:#d7e3e7;
  --hondu-line:rgba(15,76,92,.12);
  --hondu-shadow:0 22px 70px rgba(15,76,92,.14);
  --hondu-shadow-soft:0 14px 34px rgba(15,76,92,.10);
}

html,
body{
  background:
    radial-gradient(circle at 12% 0%, rgba(44,203,211,.16), transparent 28%),
    radial-gradient(circle at 90% 8%, rgba(15,76,92,.10), transparent 30%),
    linear-gradient(180deg,#ffffff 0%,#f6fcfd 48%,#ffffff 100%) !important;
  color:var(--hondu-charcoal) !important;
}

body{
  color:var(--hondu-charcoal) !important;
}

/* Header / navigation */
.header{
  background:rgba(255,255,255,.86) !important;
  border-bottom:1px solid var(--hondu-line) !important;
  box-shadow:0 10px 34px rgba(15,76,92,.08) !important;
  backdrop-filter:blur(18px) saturate(150%);
}

.header .nav,
.nav{
  color:var(--hondu-charcoal) !important;
}

.brand{
  color:var(--hondu-charcoal) !important;
}

.brand-logo,
.app-logo{
  border-radius:18px !important;
  border:1px solid rgba(44,203,211,.25) !important;
  box-shadow:0 12px 24px rgba(15,76,92,.12) !important;
  background:#fff !important;
}

.brand-title,
.app-title{
  color:var(--hondu-charcoal) !important;
  letter-spacing:.02em !important;
}

.brand-sub,
.app-brand small{
  color:var(--hondu-teal) !important;
}

.nav-links a,
.mega-trigger{
  color:#263d45 !important;
}

.nav-links a:hover,
.nav-links a.active,
.mega-trigger:hover{
  color:var(--hondu-teal) !important;
}

.quote-btn,
.install-app-btn,
.btn,
button[type="submit"],
.app-top-action,
.app-mini-btn,
.assistant-primary{
  background:linear-gradient(135deg,var(--hondu-teal),var(--hondu-aqua)) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 16px 32px rgba(7,152,165,.24) !important;
}

.btn.light,
.mini-btn.light,
.assistant-secondary{
  background:rgba(255,255,255,.78) !important;
  color:var(--hondu-deep) !important;
  border:1px solid rgba(7,152,165,.22) !important;
  box-shadow:0 14px 28px rgba(15,76,92,.08) !important;
}

.btn.dark{
  background:linear-gradient(135deg,var(--hondu-deep),#143848) !important;
  color:#fff !important;
}

/* Main hero */
.hero{
  min-height:86vh !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.84) 39%,rgba(255,255,255,.36) 68%,rgba(255,255,255,.08) 100%),
    radial-gradient(circle at 78% 24%,rgba(44,203,211,.28),transparent 24%),
    linear-gradient(135deg,#ffffff 0%,#eaf9fb 46%,#cdeff4 100%) !important;
  background-color:#f8feff !important;
  color:var(--hondu-charcoal) !important;
  overflow:hidden !important;
}

.hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(120deg, transparent 0 45%, rgba(255,255,255,.48) 45% 47%, transparent 47% 100%),
    linear-gradient(90deg, transparent 0 68%, rgba(15,76,92,.12) 68% 68.3%, transparent 68.3% 100%),
    linear-gradient(0deg, transparent 0 56%, rgba(15,76,92,.10) 56% 56.3%, transparent 56.3% 100%) !important;
  pointer-events:none !important;
}

.hero::after{
  content:"" !important;
  position:absolute !important;
  right:5vw !important;
  top:18vh !important;
  width:min(44vw,640px) !important;
  height:min(50vh,520px) !important;
  border-radius:34px !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.58),rgba(255,255,255,.18)),
    linear-gradient(115deg,rgba(44,203,211,.34),rgba(255,255,255,.08) 48%,rgba(15,76,92,.18)),
    repeating-linear-gradient(90deg,rgba(15,76,92,.20) 0 3px,transparent 3px 24%),
    repeating-linear-gradient(0deg,rgba(15,76,92,.13) 0 2px,transparent 2px 33%) !important;
  border:1px solid rgba(255,255,255,.72) !important;
  box-shadow:var(--hondu-shadow) !important;
  backdrop-filter:blur(4px) !important;
  transform:perspective(900px) rotateY(-7deg) rotateX(2deg) !important;
  pointer-events:none !important;
}

.hero-content{
  position:relative !important;
  z-index:2 !important;
}

.eyebrow,
.kicker,
.app-pill,
.tag{
  color:var(--hondu-teal) !important;
  letter-spacing:.14em !important;
}

.hero h1,
.title,
.section-head h2,
.featured-catalog-head h2,
.app-section-head h2,
.page-title,
h1,h2,h3{
  color:var(--hondu-charcoal) !important;
}

.hero h1{
  text-shadow:none !important;
  max-width:800px !important;
}

.hero p,
.lead,
.section p,
.app-section-head p,
.clean-catalog-body p,
.home-service-body p{
  color:var(--hondu-muted) !important;
}

.hero-stats .stat,
.stat,
.home-service-card,
.clean-catalog-card,
.app-card-v362,
.quote-form-card,
.quote-panel,
.story-card,
.intro-box,
.cta,
.catalog-cover-preview,
.admin-item,
.admin-cover-card{
  background:rgba(255,255,255,.86) !important;
  border:1px solid var(--hondu-line) !important;
  box-shadow:var(--hondu-shadow-soft) !important;
  color:var(--hondu-charcoal) !important;
}

.hero-stats .stat b,
.stat b{
  color:var(--hondu-deep) !important;
}

.hero-stats .stat span,
.stat span{
  color:var(--hondu-muted) !important;
}

/* Sections */
.section{
  background:transparent !important;
}

.section.compact,
.featured-catalog-section{
  background:linear-gradient(180deg,#ffffff,#f4fbfc) !important;
}

.split,
.feature-photo,
.clean-catalog-media,
.home-service-media{
  border-radius:28px !important;
  overflow:hidden !important;
}

.feature-photo{
  box-shadow:var(--hondu-shadow) !important;
  border:1px solid var(--hondu-line) !important;
}

/* Service and catalog cards */
.home-service-card,
.clean-catalog-card{
  border-radius:26px !important;
  overflow:hidden !important;
  transition:transform .18s ease, box-shadow .18s ease !important;
}

.home-service-card:hover,
.clean-catalog-card:hover,
.app-card-v362:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 24px 60px rgba(7,152,165,.17) !important;
}

.home-service-media.no-image{
  background:
    linear-gradient(135deg,rgba(44,203,211,.22),rgba(255,255,255,.6)),
    linear-gradient(180deg,#f8feff,#e4f7fa) !important;
}

.service-icon{
  color:var(--hondu-teal) !important;
}

.service-quote-pill,
.mini-btn{
  background:rgba(44,203,211,.10) !important;
  color:var(--hondu-deep) !important;
  border:1px solid rgba(44,203,211,.26) !important;
}

/* Catalog mega menu */
.catalog-mega{
  background:rgba(255,255,255,.94) !important;
  border:1px solid var(--hondu-line) !important;
  box-shadow:var(--hondu-shadow) !important;
  backdrop-filter:blur(16px) !important;
}

.mega-card{
  background:
    linear-gradient(135deg,rgba(255,255,255,.86),rgba(234,249,251,.82)) !important;
  border:1px solid rgba(44,203,211,.18) !important;
  color:var(--hondu-charcoal) !important;
}

.mega-card span,
.mega-card small{
  color:var(--hondu-charcoal) !important;
}

.mega-card small{
  color:var(--hondu-muted) !important;
}

/* CTA */
.cta{
  background:
    radial-gradient(circle at 85% 20%,rgba(44,203,211,.22),transparent 34%),
    linear-gradient(135deg,#ffffff,#effbfc) !important;
  color:var(--hondu-charcoal) !important;
}

/* Footer */
.footer{
  background:linear-gradient(135deg,#0f4c5c,#15232a) !important;
  color:#eefcff !important;
}

.footer a{
  color:#8be9ef !important;
}

/* Assistant */
.assistant-float{
  background:linear-gradient(135deg,var(--hondu-deep),var(--hondu-teal)) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.25) !important;
  box-shadow:0 18px 44px rgba(7,152,165,.28) !important;
}

.assistant-panel{
  background:#ffffff !important;
  color:var(--hondu-charcoal) !important;
  border-left:1px solid var(--hondu-line) !important;
  box-shadow:-24px 0 70px rgba(15,76,92,.16) !important;
}

.assistant-head{
  background:linear-gradient(135deg,#f8feff,#e8f9fb) !important;
  color:var(--hondu-charcoal) !important;
  border-bottom:1px solid var(--hondu-line) !important;
}

.assistant-message.bot{
  background:#eefbfc !important;
  color:var(--hondu-charcoal) !important;
}

.assistant-message.user{
  background:linear-gradient(135deg,var(--hondu-teal),var(--hondu-aqua)) !important;
  color:#fff !important;
}

.assistant-quick button{
  background:#ffffff !important;
  color:var(--hondu-deep) !important;
  border:1px solid rgba(44,203,211,.25) !important;
}

/* Forms */
input,
textarea,
select{
  background:#ffffff !important;
  color:var(--hondu-charcoal) !important;
  border:1px solid rgba(15,76,92,.18) !important;
  box-shadow:0 8px 18px rgba(15,76,92,.05) !important;
}

input:focus,
textarea:focus,
select:focus{
  border-color:var(--hondu-aqua) !important;
  box-shadow:0 0 0 4px rgba(44,203,211,.14) !important;
  outline:none !important;
}

/* Mobile app visual */
.app-body{
  background:
    radial-gradient(circle at 20% 10%,rgba(44,203,211,.20),transparent 32%),
    linear-gradient(180deg,#faffff,#ecf9fb) !important;
}

.phone,
.app-v362{
  background:#ffffff !important;
  border:1px solid rgba(15,76,92,.12) !important;
  box-shadow:0 28px 80px rgba(15,76,92,.18) !important;
}

.app-top{
  background:rgba(255,255,255,.92) !important;
  border-bottom:1px solid var(--hondu-line) !important;
  backdrop-filter:blur(16px) !important;
}

.app-hero{
  background:
    linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.64)),
    radial-gradient(circle at 78% 22%,rgba(44,203,211,.24),transparent 32%),
    linear-gradient(135deg,#ffffff,#def5f8) !important;
  color:var(--hondu-charcoal) !important;
  border:1px solid var(--hondu-line) !important;
  box-shadow:var(--hondu-shadow-soft) !important;
}

.app-quick-card,
.app-menu-list button,
.app-menu-list a{
  background:#ffffff !important;
  color:var(--hondu-charcoal) !important;
  border:1px solid var(--hondu-line) !important;
  box-shadow:0 12px 24px rgba(15,76,92,.07) !important;
}

.app-quick-card span{
  color:var(--hondu-teal) !important;
}

.bottom-nav,
.app-bottom{
  background:rgba(255,255,255,.95) !important;
  border-top:1px solid var(--hondu-line) !important;
  box-shadow:0 -12px 28px rgba(15,76,92,.08) !important;
}

.bottom-nav button,
.app-bottom button{
  color:#6a7d85 !important;
}

.bottom-nav button.active,
.app-bottom button.active{
  color:var(--hondu-teal) !important;
}

/* Admin visual */
.admin-body,
body.admin-body{
  background:#f6fcfd !important;
}

.admin-shell,
.admin-main{
  background:#f6fcfd !important;
  color:var(--hondu-charcoal) !important;
}

.admin-sidebar{
  background:linear-gradient(180deg,#0f4c5c,#15232a) !important;
}

.admin-panel,
.admin-card,
.admin-login-card{
  background:#ffffff !important;
  color:var(--hondu-charcoal) !important;
  border:1px solid var(--hondu-line) !important;
  box-shadow:var(--hondu-shadow-soft) !important;
}

/* Glass placeholders when old wood images are missing or still loading */
img[src*="hero-kitchen"],
img[src*="project-"]{
  filter:saturate(.88) brightness(1.12) contrast(.92) hue-rotate(155deg) !important;
}

/* Responsive */
@media (max-width: 900px){
  .hero{
    min-height:78vh !important;
  }
  .hero::after{
    opacity:.34 !important;
    right:-20vw !important;
    top:16vh !important;
    width:78vw !important;
  }
  .nav-links{
    background:rgba(255,255,255,.96) !important;
  }
}

@media (max-width: 640px){
  .hero::after{
    opacity:.22 !important;
  }
  .hero h1{
    font-size:clamp(2.2rem,12vw,4rem) !important;
  }
}


/* ==========================================================
   HONDU MEX V4 — Header logo profesional + portada más blanca
   ========================================================== */
.header{
  min-height:86px !important;
}

.brand{
  gap:14px !important;
  min-width:245px !important;
}

.brand-logo{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  object-fit:contain !important;
  padding:6px !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 12px 28px rgba(15,76,92,.13) !important;
}

.brand-title{
  font-family: Georgia, "Times New Roman", serif !important;
  font-size:1.38rem !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
  color:#12252d !important;
}

.brand-sub{
  margin-top:8px !important;
  font-size:.62rem !important;
  line-height:1.1 !important;
  letter-spacing:.36em !important;
  text-transform:uppercase !important;
  color:#0798a5 !important;
  white-space:nowrap !important;
}

.install-app-btn{
  font-size:0 !important;
}
.install-app-btn::after{
  content:"Instalar App" !important;
  font-size:.92rem !important;
}

.hero{
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 42%,rgba(255,255,255,.54) 70%,rgba(255,255,255,.20) 100%),
    radial-gradient(circle at 83% 26%,rgba(66,212,216,.22),transparent 28%),
    linear-gradient(135deg,#ffffff 0%,#f3fdfe 48%,#e6f8fb 100%) !important;
}

.hero h1{
  font-family: Georgia, "Times New Roman", serif !important;
  letter-spacing:.015em !important;
  color:#12252d !important;
}

.hero p{
  color:#526b74 !important;
}

.hero-stats .stat{
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(15,76,92,.09) !important;
  backdrop-filter:blur(10px) !important;
}

/* Logo/icon inside app header */
.app-logo{
  width:48px !important;
  height:48px !important;
  object-fit:contain !important;
  padding:5px !important;
  background:#fff !important;
}

@media (max-width: 980px){
  .brand{
    min-width:auto !important;
  }
  .brand-title{
    font-size:1.05rem !important;
    letter-spacing:.12em !important;
  }
  .brand-sub{
    display:none !important;
  }
  .brand-logo{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
  }
}

@media (max-width: 640px){
  .header{
    min-height:76px !important;
  }
}



/* ==========================================================
   HONDU MEX V5 — Hero blanco con visual de vidrio/aluminio
   ========================================================== */

:root{
  --hondu-hero-img:url('/assets/img/hondu-hero-glass-white.jpg');
}

.hero{
  min-height:82vh !important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.95) 36%,rgba(255,255,255,.55) 58%,rgba(255,255,255,.14) 88%),
    var(--hondu-hero-img) center right / cover no-repeat !important;
  background-color:#ffffff !important;
}

.hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 30% 20%,rgba(66,212,216,.08),transparent 26%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(239,250,252,.16)) !important;
  pointer-events:none !important;
}

.hero::after{
  display:none !important;
}

.hero-content{
  max-width:650px !important;
  margin-left:max(7vw,80px) !important;
}

.hero h1{
  font-size:clamp(3.9rem,5.6vw,7rem) !important;
  line-height:.94 !important;
  letter-spacing:.005em !important;
  color:#11242c !important;
  text-shadow:0 10px 26px rgba(15,76,92,.12) !important;
}

.hero .eyebrow,
.hero [data-setting-text="home.eyebrow"]{
  color:#008d99 !important;
  letter-spacing:.18em !important;
  font-weight:900 !important;
}

.hero p{
  max-width:610px !important;
  color:#4f6a72 !important;
  font-size:1.15rem !important;
  line-height:1.78 !important;
}

.hero-actions .btn,
.hero-actions a{
  border-radius:18px !important;
  padding:16px 28px !important;
}

.hero-stats{
  gap:16px !important;
  margin-top:32px !important;
}

.hero-stats .stat{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(7,152,165,.12) !important;
  box-shadow:0 16px 36px rgba(15,76,92,.09) !important;
  border-radius:18px !important;
}

/* Make below section transition cleaner */
.hero + section,
.section:first-of-type{
  background:linear-gradient(180deg,#f6fdfe,#ffffff) !important;
}

@media (max-width: 1100px){
  .hero{
    background:
      linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.88) 55%,rgba(255,255,255,.38) 100%),
      var(--hondu-hero-img) center right / cover no-repeat !important;
  }
  .hero-content{
    margin-left:32px !important;
  }
  .hero h1{
    font-size:clamp(3rem,8vw,5rem) !important;
  }
}

@media (max-width: 760px){
  .hero{
    min-height:78vh !important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.88) 54%,rgba(255,255,255,.74) 100%),
      var(--hondu-hero-img) center bottom / cover no-repeat !important;
  }
  .hero-content{
    margin:0 22px !important;
    max-width:none !important;
  }
  .hero h1{
    font-size:clamp(2.55rem,13vw,4.2rem) !important;
  }
  .hero p{
    font-size:1rem !important;
  }
}



/* ==========================================================
   HONDU MEX V6 — FORCE HERO NO CACHE / NO BEIGE
   ========================================================== */
body .hero,
html body .hero,
body main .hero,
body section.hero{
  background-color:#ffffff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.94) 32%,rgba(255,255,255,.62) 55%,rgba(255,255,255,.18) 86%),
    url('/assets/img/hondu-hero-glass-white.jpg') !important;
  background-position:center right !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  min-height:82vh !important;
}

body .hero::after,
html body .hero::after{
  display:none !important;
  content:none !important;
}

body .hero::before,
html body .hero::before{
  background:
    radial-gradient(circle at 23% 12%,rgba(66,212,216,.10),transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(239,250,252,.10)) !important;
}

body .hero .hero-content,
html body .hero .hero-content{
  margin-left:max(7vw,80px) !important;
  max-width:660px !important;
}

body .hero h1,
html body .hero h1{
  font-size:clamp(3.8rem,5.35vw,6.6rem) !important;
  line-height:.94 !important;
}

body .hero p,
html body .hero p{
  max-width:600px !important;
}

/* Header logo stays clean */
body .brand-logo{
  content:url('/assets/img/hondu-logo-header.svg') !important;
}

@media (max-width: 900px){
  body .hero,
  html body .hero{
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 58%,rgba(255,255,255,.70) 100%),
      url('/assets/img/hondu-hero-glass-white.jpg') !important;
    background-position:center bottom !important;
  }
  body .hero .hero-content,
  html body .hero .hero-content{
    margin-left:24px !important;
    margin-right:24px !important;
  }
}



/* ==========================================================
   HONDU MEX V7 — Blanco premium / vidrio / cristal / aluminio
   ========================================================== */

:root{
  --hondu-hero-premium:url('/assets/img/hondu-hero-premium-white.jpg');
  --hondu-blue-deep:#173e66;
  --hondu-blue-soft:#dceef7;
  --hondu-line-soft:rgba(23,62,102,.12);
}

html body{
  background:#ffffff !important;
}

body .header{
  height:92px !important;
  min-height:92px !important;
  background:rgba(255,255,255,.94) !important;
  border-bottom:1px solid rgba(23,62,102,.08) !important;
  box-shadow:0 10px 34px rgba(23,62,102,.08) !important;
}

/* Header more like premium architectural brand */
body .brand-logo{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  border-radius:14px !important;
  padding:5px !important;
}
body .brand-title{
  font-size:1.32rem !important;
  letter-spacing:.18em !important;
}
body .brand-sub{
  font-size:.58rem !important;
  letter-spacing:.34em !important;
  color:#008d99 !important;
}

body .nav-links a,
body .mega-trigger{
  color:#1b2e3a !important;
  font-weight:800 !important;
}
body .nav-links a.active,
body .nav-links a:hover,
body .mega-trigger:hover{
  color:var(--hondu-blue-deep) !important;
}

body .quote-btn,
body .install-app-btn,
body .hero-actions .btn:first-child{
  background:linear-gradient(135deg,#173e66,#0a8f9a) !important;
  border-radius:10px !important;
  color:#fff !important;
  letter-spacing:.04em !important;
  text-transform:none !important;
  box-shadow:0 18px 38px rgba(23,62,102,.18) !important;
}

/* Hero premium white. This intentionally overrides older beige/force-hero. */
html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:760px !important;
  padding-top:110px !important;
  background-color:#ffffff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.91) 30%,rgba(255,255,255,.54) 48%,rgba(255,255,255,.10) 80%),
    var(--hondu-hero-premium) !important;
  background-position:center right !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  overflow:hidden !important;
}

html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
}
html body .hero::before,
body .hero::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.00) 70%,rgba(244,250,252,.20)),
    radial-gradient(circle at 18% 18%,rgba(0,141,153,.09),transparent 30%) !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(7vw,120px) !important;
  max-width:650px !important;
  transform:translateY(-10px) !important;
}

html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  color:#008d99 !important;
  font-size:.78rem !important;
  letter-spacing:.20em !important;
  font-weight:900 !important;
  margin-bottom:18px !important;
}

html body .hero h1,
body .hero h1{
  font-size:clamp(3.15rem,4.35vw,5.75rem) !important;
  line-height:1.02 !important;
  letter-spacing:.018em !important;
  max-width:680px !important;
  color:#101b24 !important;
  text-shadow:0 14px 32px rgba(16,27,36,.11) !important;
  margin-bottom:24px !important;
}

html body .hero p,
body .hero p{
  max-width:560px !important;
  font-size:1.06rem !important;
  line-height:1.72 !important;
  color:#344d5d !important;
  margin-bottom:26px !important;
}

body .hero-actions{
  gap:16px !important;
  margin-top:18px !important;
}
body .hero-actions .btn,
body .hero-actions a{
  padding:15px 31px !important;
  border-radius:9px !important;
  min-width:190px !important;
  justify-content:center !important;
}
body .hero-actions .btn.light,
body .hero-actions a.light{
  background:rgba(255,255,255,.76) !important;
  color:#173e66 !important;
  border:1px solid rgba(23,62,102,.25) !important;
}

/* Make stats look like a sleek white glass card row */
body .hero-stats{
  margin-top:28px !important;
  gap:0 !important;
  width:min(720px,92vw) !important;
  border-radius:12px !important;
  overflow:hidden !important;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(23,62,102,.10) !important;
  box-shadow:0 18px 42px rgba(23,62,102,.12) !important;
  backdrop-filter:blur(12px) !important;
}
body .hero-stats .stat{
  flex:1 !important;
  border:0 !important;
  border-right:1px solid rgba(23,62,102,.13) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:18px 22px !important;
}
body .hero-stats .stat:last-child{
  border-right:0 !important;
}
body .hero-stats .stat b{
  color:#173e66 !important;
  font-size:1.02rem !important;
  letter-spacing:.08em !important;
}
body .hero-stats .stat span{
  color:#4f6878 !important;
  font-size:.78rem !important;
}

/* Services section starts like reference: bright, compact, premium */
body .section,
body .section.compact,
body .featured-catalog-section{
  background:#ffffff !important;
}

body .section-head,
body .featured-catalog-head{
  margin-bottom:26px !important;
}
body .section-head .kicker,
body .featured-catalog-head .kicker{
  color:#173e66 !important;
}
body .home-services-grid,
body [data-home-services-list]{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:14px !important;
}
body .home-service-card{
  border-radius:8px !important;
  background:#ffffff !important;
  border:1px solid rgba(23,62,102,.10) !important;
  box-shadow:0 10px 24px rgba(23,62,102,.08) !important;
}
body .home-service-media{
  height:95px !important;
  border-radius:0 !important;
  background:#f5fbfd !important;
}
body .home-service-media.no-image{
  background:
    linear-gradient(135deg,rgba(255,255,255,.65),rgba(220,238,247,.86)),
    linear-gradient(90deg,rgba(23,62,102,.12),transparent) !important;
}
body .home-service-body{
  padding:14px 16px !important;
}
body .home-service-body h3{
  font-family:inherit !important;
  color:#1b2e3a !important;
  font-size:.78rem !important;
  text-transform:uppercase !important;
  letter-spacing:.06em !important;
  margin-bottom:6px !important;
}
body .home-service-body p{
  display:none !important;
}
body .service-quote-pill{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  color:#173e66 !important;
}

/* General cards cleaner */
body .clean-catalog-card,
body .app-card-v362,
body .quote-panel,
body .quote-form-card,
body .story-card,
body .intro-box{
  border-radius:10px !important;
  border:1px solid rgba(23,62,102,.10) !important;
  box-shadow:0 12px 28px rgba(23,62,102,.08) !important;
  background:#fff !important;
}

/* Floating advisor more premium navy/turquoise */
body .assistant-float{
  background:linear-gradient(135deg,#173e66,#0a8f9a) !important;
  border-radius:999px !important;
  box-shadow:0 18px 40px rgba(23,62,102,.20) !important;
}

/* Mobile */
@media (max-width: 1200px){
  body .home-services-grid,
  body [data-home-services-list]{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  html body .hero .hero-content,
  body .hero .hero-content{
    margin-left:48px !important;
  }
}

@media (max-width: 760px){
  body .header{
    min-height:76px !important;
    height:76px !important;
  }
  html body .hero,
  body .hero{
    min-height:720px !important;
    padding-top:96px !important;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.90) 52%,rgba(255,255,255,.66) 100%),
      var(--hondu-hero-premium) !important;
    background-position:center bottom !important;
  }
  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
    transform:none !important;
  }
  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.42rem,11vw,3.75rem) !important;
  }
  body .hero-stats{
    flex-direction:column !important;
    width:100% !important;
  }
  body .hero-stats .stat{
    border-right:0 !important;
    border-bottom:1px solid rgba(23,62,102,.10) !important;
  }
  body .home-services-grid,
  body [data-home-services-list]{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}



/* ==========================================================
   HONDU MEX V8 — Showroom blanco premium
   ========================================================== */

:root{
  --hondu-hero-v8:url('/assets/img/hondu-hero-showroom-v8.jpg');
  --hondu-navy:#173e66;
  --hondu-ink:#101820;
  --hondu-metal:#bfced6;
}

/* Header closer to the reference */
body .header{
  height:84px !important;
  min-height:84px !important;
  background:rgba(255,255,255,.96) !important;
}

body .brand-logo{
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
  box-shadow:0 8px 20px rgba(23,62,102,.10) !important;
}

body .brand-title{
  font-family: Georgia, "Times New Roman", serif !important;
  font-size:1.22rem !important;
  letter-spacing:.19em !important;
  color:#111d26 !important;
}

body .brand-sub{
  letter-spacing:.31em !important;
  color:#008d99 !important;
}

/* Force hero to the new showroom image */
html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:690px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.90) 28%,rgba(255,255,255,.48) 48%,rgba(255,255,255,.04) 78%),
    var(--hondu-hero-v8) !important;
  background-position:center right !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
}

html body .hero::before,
body .hero::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.00),rgba(255,255,255,.00) 75%,rgba(246,250,252,.28)),
    radial-gradient(circle at 20% 18%,rgba(0,141,153,.07),transparent 32%) !important;
}

/* Text: more premium, less heavy than V7 */
html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(6vw,112px) !important;
  max-width:560px !important;
  transform:translateY(-2px) !important;
}

html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  font-size:.72rem !important;
  letter-spacing:.22em !important;
  margin-bottom:16px !important;
  color:#008d99 !important;
}

html body .hero h1,
body .hero h1{
  font-family: "Trebuchet MS", "Montserrat", Arial, sans-serif !important;
  font-size:clamp(2.9rem,3.85vw,5.05rem) !important;
  line-height:1.08 !important;
  letter-spacing:.035em !important;
  font-weight:900 !important;
  max-width:620px !important;
  color:#101820 !important;
  text-shadow:none !important;
  margin-bottom:24px !important;
}

html body .hero p,
body .hero p{
  max-width:500px !important;
  font-size:1.02rem !important;
  line-height:1.66 !important;
  color:#253a48 !important;
}

/* Buttons like premium reference */
body .hero-actions .btn,
body .hero-actions a{
  min-width:185px !important;
  border-radius:7px !important;
  padding:15px 28px !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  font-size:.82rem !important;
}

body .hero-actions .btn:first-child,
body .quote-btn{
  background:linear-gradient(135deg,#173e66,#0b566c) !important;
  color:#fff !important;
}

body .hero-actions .btn.light,
body .hero-actions a.light{
  background:rgba(255,255,255,.70) !important;
  color:#173e66 !important;
  border:1px solid rgba(23,62,102,.28) !important;
}

/* Stats row more like reference */
body .hero-stats{
  width:min(720px,92vw) !important;
  margin-top:24px !important;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(23,62,102,.12) !important;
  border-radius:8px !important;
  box-shadow:0 18px 36px rgba(23,62,102,.10) !important;
}

body .hero-stats .stat{
  padding:15px 21px !important;
}

body .hero-stats .stat b{
  font-size:.92rem !important;
  text-transform:uppercase !important;
}

body .hero-stats .stat span{
  font-size:.72rem !important;
}

/* Top services more premium but not too cramped */
body .section-head h2,
body .featured-catalog-head h2{
  font-family:"Trebuchet MS", Arial, sans-serif !important;
  letter-spacing:.05em !important;
}

body .home-services-grid,
body [data-home-services-list]{
  margin-top:8px !important;
}

/* Advisor button a little cleaner */
body .assistant-float{
  background:linear-gradient(135deg,#173e66,#008d99) !important;
  padding:16px 25px !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:720px !important;
    padding-top:94px !important;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 52%,rgba(255,255,255,.66) 100%),
      var(--hondu-hero-v8) !important;
    background-position:center bottom !important;
  }
  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
  }
  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.35rem,10vw,3.7rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V9 — Hero realista blanco premium
   ========================================================== */
:root{
  --hondu-hero-v9:url('/assets/img/hondu-hero-realista-v9.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:700px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.975) 0%,rgba(255,255,255,.93) 25%,rgba(255,255,255,.56) 44%,rgba(255,255,255,.12) 72%),
    var(--hondu-hero-v9) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::before,
body .hero::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.00),rgba(255,255,255,.00) 74%,rgba(244,249,251,.18)),
    radial-gradient(circle at 20% 17%,rgba(0,141,153,.05),transparent 32%) !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.8vw,100px) !important;
  max-width:540px !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.72rem,3.55vw,4.6rem) !important;
  line-height:1.07 !important;
  letter-spacing:.028em !important;
  max-width:560px !important;
  color:#0f1820 !important;
  margin-bottom:22px !important;
}

html body .hero p,
body .hero p{
  max-width:480px !important;
  font-size:1.01rem !important;
  color:#304654 !important;
}

body .hero-actions .btn,
body .hero-actions a{
  min-width:182px !important;
  padding:14px 26px !important;
}

body .hero-stats{
  width:min(760px,92vw) !important;
  background:rgba(255,255,255,.84) !important;
  border:1px solid rgba(23,62,102,.10) !important;
  box-shadow:0 14px 30px rgba(23,62,102,.09) !important;
}

body .hero-stats .stat{
  padding:14px 20px !important;
}

/* keep page bright/clean */
body .section,
body .featured-catalog-section,
body .section.compact{
  background:#ffffff !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:720px !important;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.965) 0%,rgba(255,255,255,.90) 49%,rgba(255,255,255,.66) 100%),
      var(--hondu-hero-v9) !important;
    background-position:center center !important;
  }
  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
  }
  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.3rem,9.8vw,3.5rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V10 — Hero local realista / blanco premium
   Imagen metida dentro del ZIP, no depende de Supabase URL.
   ========================================================== */
:root{
  --hondu-hero-v10:url('/assets/img/hondu-hero-local-realista-v10.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:700px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.965) 0%,rgba(255,255,255,.89) 25%,rgba(255,255,255,.48) 44%,rgba(255,255,255,.05) 75%),
    var(--hondu-hero-v10) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
}

html body .hero::before,
body .hero::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.00),rgba(255,255,255,.00) 76%,rgba(246,250,252,.22)),
    radial-gradient(circle at 19% 19%,rgba(0,141,153,.055),transparent 31%) !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.8vw,100px) !important;
  max-width:540px !important;
  transform:translateY(-4px) !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.68rem,3.48vw,4.45rem) !important;
  line-height:1.08 !important;
  letter-spacing:.028em !important;
  max-width:560px !important;
  color:#101820 !important;
  text-shadow:none !important;
}

html body .hero p,
body .hero p{
  max-width:485px !important;
  font-size:1.01rem !important;
  line-height:1.66 !important;
  color:#293f4d !important;
}

body .hero-actions .btn,
body .hero-actions a{
  min-width:182px !important;
  padding:14px 26px !important;
  border-radius:7px !important;
}

body .hero-stats{
  width:min(760px,92vw) !important;
  background:rgba(255,255,255,.84) !important;
  border:1px solid rgba(23,62,102,.10) !important;
  box-shadow:0 14px 30px rgba(23,62,102,.09) !important;
}

/* Better header spacing with current logo */
body .header{
  height:84px !important;
  min-height:84px !important;
}

body .brand-logo{
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:720px !important;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.965) 0%,rgba(255,255,255,.90) 50%,rgba(255,255,255,.67) 100%),
      var(--hondu-hero-v10) !important;
    background-position:center center !important;
  }

  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
  }

  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.3rem,9.8vw,3.5rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V11 — Hero sin fog / sin humo / imagen clara
   ========================================================== */
:root{
  --hondu-hero-v11:url('/assets/img/hondu-hero-local-realista-v10.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:700px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:var(--hondu-hero-v11) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::before,
body .hero::before,
html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.8vw,100px) !important;
  max-width:520px !important;
  transform:translateY(-4px) !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.68rem,3.45vw,4.35rem) !important;
  line-height:1.08 !important;
  letter-spacing:.026em !important;
  color:#0f1720 !important;
  text-shadow:none !important;
  max-width:520px !important;
}

html body .hero p,
body .hero p{
  color:#2b404d !important;
  max-width:460px !important;
  text-shadow:none !important;
}

html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  color:#008d99 !important;
  text-shadow:none !important;
}

body .hero-stats{
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(23,62,102,.08) !important;
  box-shadow:0 10px 24px rgba(23,62,102,.07) !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:720px !important;
    background-image:var(--hondu-hero-v11) !important;
    background-position:center center !important;
  }

  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
  }

  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.26rem,9.6vw,3.45rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V12 — Cristalino, claro, sin parpadeo
   ========================================================== */
:root{
  --hondu-hero-v12:url('/assets/img/hondu-hero-cristalino-v12.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:700px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:var(--hondu-hero-v12) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::before,
body .hero::before,
html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.8vw,100px) !important;
  max-width:520px !important;
  transform:none !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.62rem,3.35vw,4.2rem) !important;
  line-height:1.08 !important;
  letter-spacing:.022em !important;
  color:#0f1720 !important;
  text-shadow:none !important;
  max-width:520px !important;
}

html body .hero p,
body .hero p,
html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  text-shadow:none !important;
}

html body .hero p,
body .hero p{
  color:#263a47 !important;
  max-width:460px !important;
}

body .hero-stats{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(23,62,102,.07) !important;
  box-shadow:0 8px 20px rgba(23,62,102,.05) !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:720px !important;
    background-image:var(--hondu-hero-v12) !important;
    background-position:center center !important;
  }

  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 24px !important;
    max-width:none !important;
  }

  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.18rem,9.1vw,3.35rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V13 — Cristalino con texto limpio
   ========================================================== */
:root{
  --hondu-hero-v13:url('/assets/img/hondu-hero-cristalino-v13.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:690px !important;
  padding-top:96px !important;
  background-color:#ffffff !important;
  background-image:var(--hondu-hero-v13) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::before,
body .hero::before,
html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.4vw,92px) !important;
  max-width:500px !important;
  transform:none !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.42rem,3.08vw,3.95rem) !important;
  line-height:1.10 !important;
  letter-spacing:.018em !important;
  font-weight:850 !important;
  color:#0f1720 !important;
  text-shadow:none !important;
  max-width:500px !important;
  margin-bottom:22px !important;
}

html body .hero p,
body .hero p{
  max-width:445px !important;
  color:#263a47 !important;
  text-shadow:none !important;
}

html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  color:#008d99 !important;
  text-shadow:none !important;
  letter-spacing:.20em !important;
}

body .hero-actions .btn,
body .hero-actions a{
  min-width:172px !important;
  padding:13px 24px !important;
}

body .hero-stats{
  width:min(690px,92vw) !important;
  background:rgba(255,255,255,.64) !important;
  border:1px solid rgba(23,62,102,.06) !important;
  box-shadow:0 8px 18px rgba(23,62,102,.04) !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:710px !important;
    background-image:var(--hondu-hero-v13) !important;
    background-position:center center !important;
  }

  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 22px !important;
    max-width:none !important;
  }

  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.08rem,8.8vw,3.25rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V15 — Base V13, solo hero limpio
   ========================================================== */
:root{
  --hondu-hero-v15:url('/assets/img/hondu-hero-v15-limpio.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  min-height:690px !important;
  padding-top:94px !important;
  background-color:#ffffff !important;
  background-image:var(--hondu-hero-v15) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

html body .hero::before,
body .hero::before,
html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

html body .hero .hero-content,
body .hero .hero-content{
  margin-left:max(5.2vw,88px) !important;
  max-width:485px !important;
  transform:none !important;
}

html body .hero h1,
body .hero h1{
  font-family:"Trebuchet MS","Montserrat",Arial,sans-serif !important;
  font-size:clamp(2.25rem,2.8vw,3.55rem) !important;
  line-height:1.12 !important;
  letter-spacing:.016em !important;
  font-weight:800 !important;
  color:#101820 !important;
  text-shadow:none !important;
  max-width:480px !important;
  margin-bottom:20px !important;
}

html body .hero p,
body .hero p{
  color:#263a47 !important;
  max-width:430px !important;
  line-height:1.58 !important;
  text-shadow:none !important;
}

html body .hero .eyebrow,
body .hero .eyebrow,
body .hero [data-setting-text="home.eyebrow"]{
  color:#0096a0 !important;
  letter-spacing:.20em !important;
  text-shadow:none !important;
}

body .hero-actions{
  margin-top:20px !important;
}

body .hero-stats{
  background:rgba(255,255,255,.60) !important;
  border:1px solid rgba(23,62,102,.06) !important;
  box-shadow:0 8px 18px rgba(23,62,102,.04) !important;
}

@media (max-width: 900px){
  html body .hero,
  body .hero{
    min-height:710px !important;
    background-image:var(--hondu-hero-v15) !important;
    background-position:center center !important;
  }

  html body .hero .hero-content,
  body .hero .hero-content{
    margin:0 22px !important;
    max-width:none !important;
  }

  html body .hero h1,
  body .hero h1{
    font-size:clamp(2.06rem,8.6vw,3.15rem) !important;
  }
}



/* ==========================================================
   HONDU MEX V16 — Hero editable desde Admin
   ========================================================== */
:root{
  --hondu-hero-v16:url('/assets/img/hondu-hero-v15-limpio.png');
}

html body .hero,
body .hero,
body main .hero,
body section.hero{
  background-image:var(--hondu-hero-v16) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-color:#ffffff !important;
}

html body .hero::before,
body .hero::before,
html body .hero::after,
body .hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

.admin-hero-editor{
  display:grid;
  gap:18px;
  padding:20px;
  border:1px solid rgba(7,152,165,.18);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff,#f4fbfc);
  box-shadow:0 18px 42px rgba(15,76,92,.08);
}

.admin-hero-preview{
  min-height:250px;
  border-radius:18px;
  border:1px solid rgba(15,76,92,.14);
  background:#eff8fa center/cover no-repeat;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
}

.admin-hero-preview span{
  width:100%;
  padding:12px 16px;
  background:rgba(15,76,92,.72);
  color:white;
  font-weight:800;
  letter-spacing:.04em;
}

.admin-hero-editor input[type="file"]{
  padding:12px;
  background:#fff;
  border:1px dashed rgba(7,152,165,.36);
}

.admin-hero-editor input[type="color"]{
  min-height:48px;
  padding:6px;
}

.admin-hero-editor .admin-tabs-note{
  margin:0;
  background:rgba(44,203,211,.08);
  border:1px solid rgba(44,203,211,.16);
  color:#214b58;
}

body .hero h1{
  text-shadow:none !important;
}

body .hero-content{
  position:relative !important;
  z-index:2 !important;
}



/* ==========================================================
   HONDU MEX V17 — Subir imágenes directo en Admin
   ========================================================== */
.hondu-upload-box{
  margin-top:10px;
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(7,152,165,.20);
  border-radius:14px;
  background:linear-gradient(180deg,#ffffff,#f4fbfc);
}

.hondu-upload-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.hondu-upload-btn,
.hondu-clear-image{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:800;
  cursor:pointer;
  font-size:.88rem;
}

.hondu-upload-btn{
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
  box-shadow:0 10px 22px rgba(0,109,117,.16);
}

.hondu-clear-image{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}

.hondu-upload-status{
  font-size:.82rem;
  color:#4f6878;
  line-height:1.35;
}

.hondu-upload-status.loading{
  color:#006D75;
  font-weight:800;
}

.hondu-upload-status.ok{
  color:#087f5b;
  font-weight:800;
}

.hondu-upload-status.error{
  color:#b42318;
  font-weight:800;
}

.hondu-upload-preview{
  width:100%;
  min-height:160px;
  border-radius:12px;
  background:center/cover no-repeat;
  border:1px solid rgba(15,76,92,.13);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}

.admin-field input[data-setting*="Image"],
.admin-field input[data-setting="image"],
.admin-field input[data-field="image_url"],
.admin-field input[data-page-hero-input]{
  font-family:monospace;
  font-size:.78rem;
}



/* ==========================================================
   HONDU MEX V18 — Imagen directa desde Admin sin URL manual
   ========================================================== */
.hondu-image-field-v18{
  position:relative;
}

.hondu-upload-box.v18{
  margin-top:8px;
  display:grid;
  gap:11px;
  padding:14px;
  border:1px solid rgba(7,152,165,.20);
  border-radius:16px;
  background:linear-gradient(180deg,#ffffff,#f2fbfc);
  box-shadow:0 10px 26px rgba(15,76,92,.07);
}

.hondu-upload-title{
  color:#0f4c5c;
  font-weight:900;
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.hondu-upload-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.hondu-upload-btn,
.hondu-clear-image,
.hondu-manual-url{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  font-size:.88rem;
}

.hondu-upload-btn{
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
  box-shadow:0 10px 22px rgba(0,109,117,.16);
}

.hondu-clear-image{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}

.hondu-manual-url{
  color:#5d4630;
  background:#f6ead8;
  border:1px solid rgba(190,139,67,.22);
}

.hondu-upload-status{
  font-size:.82rem;
  color:#4f6878;
  line-height:1.35;
}

.hondu-upload-status.loading{
  color:#006D75;
  font-weight:900;
}

.hondu-upload-status.ok{
  color:#087f5b;
  font-weight:900;
}

.hondu-upload-status.error{
  color:#b42318;
  font-weight:900;
}

.hondu-upload-preview{
  width:100%;
  min-height:170px;
  border-radius:13px;
  background:center/cover no-repeat;
  border:1px solid rgba(15,76,92,.13);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}

.admin-field input[data-setting*="Image"],
.admin-field input[data-field="image_url"],
.admin-field input[data-page-hero-input],
.admin-field input[data-home-hero-url]{
  font-family:monospace;
  font-size:.76rem;
}



/* ==========================================================
   HONDU MEX V19 — Servicios con imagen + mejor encuadre
   ========================================================== */

/* Mejor encuadre general: que no se vean estiradas ni demasiado abiertas */
.hero,
.page-hero,
.page-hero-admin-preview,
.hondu-upload-preview,
.clean-catalog-media,
.home-service-media,
.feature-photo,
.project-card .project-media,
.gallery-card .gallery-media{
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* Tarjetas de servicios en Inicio / Servicios */
.home-service-media{
  position:relative !important;
  width:100% !important;
  min-height:220px !important;
  height:220px !important;
  overflow:hidden !important;
  border-radius:18px 18px 0 0 !important;
  background:#edf8fa center center / cover no-repeat !important;
}

.home-service-media img,
.clean-catalog-media img,
.feature-photo img,
.project-card img,
.gallery-card img{
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
}

/* Si una imagen se guardó como data URL, que se comporte igual que URL normal */
[data-home-services-list] article,
[data-dyn-services-list] article{
  overflow:hidden !important;
}

[data-home-services-list] .home-service-card,
[data-dyn-services-list] .home-service-card{
  background:#fff !important;
  border-radius:20px !important;
}

/* Admin: que las imágenes de Servicios sean obvias */
.hondu-service-image-admin-card .hondu-upload-box.v18,
.hondu-service-image-admin-card .hondu-upload-box{
  border:2px solid rgba(0,154,165,.24) !important;
  background:linear-gradient(180deg,#ffffff,#eefbfc) !important;
}

.hondu-service-image-admin-card .hondu-upload-title{
  color:#006D75 !important;
}

.hondu-upload-preview{
  background-size:cover !important;
  background-position:center center !important;
  min-height:190px !important;
}

/* Ocultar URL manual por defecto pero dejar el botón para Adán */
.hondu-image-field-v18 > label,
.hondu-image-field-v18 > input[data-field="image_url"],
.hondu-image-field-v18 > input[data-setting*="Image"],
.hondu-image-field-v18 > input[data-page-hero-input],
.hondu-image-field-v18 > input[data-home-hero-url]{
  display:none;
}



/* ==========================================================
   HONDU MEX V20 — Catálogo arreglado + subida de imágenes
   ========================================================== */
.hondu-image-field-v20 > label,
.hondu-image-field-v20 > input[data-field="image_url"],
.hondu-image-field-v20 > input[data-cover-field*="image"],
.hondu-image-field-v20 > input[data-page-hero-input],
.hondu-image-field-v20 > input[data-home-hero-url],
.hondu-image-field-v20 > input[data-extra-image]{
  display:none;
}
.hondu-upload-box.v20{
  margin-top:8px;
  display:grid;
  gap:11px;
  padding:14px;
  border:1px solid rgba(7,152,165,.22);
  border-radius:16px;
  background:linear-gradient(180deg,#ffffff,#f2fbfc);
  box-shadow:0 10px 26px rgba(15,76,92,.07);
}
.hondu-upload-title{
  color:#0f4c5c;
  font-weight:900;
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.hondu-upload-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.hondu-upload-btn,
.hondu-clear-image,
.hondu-manual-url{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  font-size:.88rem;
}
.hondu-upload-btn{
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
  box-shadow:0 10px 22px rgba(0,109,117,.16);
}
.hondu-clear-image{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}
.hondu-manual-url{
  color:#5d4630;
  background:#f6ead8;
  border:1px solid rgba(190,139,67,.22);
}
.hondu-upload-status{
  font-size:.82rem;
  color:#4f6878;
  line-height:1.35;
}
.hondu-upload-status.loading{
  color:#006D75;
  font-weight:900;
}
.hondu-upload-status.ok{
  color:#087f5b;
  font-weight:900;
}
.hondu-upload-status.error{
  color:#b42318;
  font-weight:900;
}
.hondu-upload-preview,
.catalog-cover-preview,
.page-hero-admin-preview,
.clean-catalog-media,
.home-service-media{
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.hondu-upload-preview{
  width:100%;
  min-height:190px;
  border-radius:13px;
  background:center/cover no-repeat;
  border:1px solid rgba(15,76,92,.13);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}
.clean-catalog-media{
  min-height:245px !important;
  height:245px !important;
  overflow:hidden !important;
}
.clean-catalog-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.admin-item[data-item="catalog"]{
  border:1px solid rgba(0,154,165,.18) !important;
}
.admin-item[data-item="catalog"] .hondu-upload-box.v20,
.admin-cover-card .hondu-upload-box.v20{
  border:2px solid rgba(0,154,165,.24) !important;
}



/* ==========================================================
   HONDU MEX V21 — Guardar rápido en portada de Inicio
   ========================================================== */
.hondu-hero-quick-save-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  padding:16px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(0,154,165,.10),rgba(255,255,255,.96));
  border:1px solid rgba(0,154,165,.22);
}

.hondu-hero-quick-save-row span{
  color:#40616b;
  font-size:.9rem;
  line-height:1.35;
  flex:1;
  min-width:230px;
}

.hondu-hero-quick-save{
  min-width:230px;
  justify-content:center;
  box-shadow:0 12px 28px rgba(0,109,117,.15);
}

@media(max-width:700px){
  .hondu-hero-quick-save{
    width:100%;
  }
}



/* ==========================================================
   HONDU MEX V22 — Logo editable + logo en bloque de Inicio
   ========================================================== */
.admin-logo-editor{
  display:grid;
  gap:18px;
  padding:20px;
  border:1px solid rgba(7,152,165,.22);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff,#f4fbfc);
  box-shadow:0 18px 42px rgba(15,76,92,.08);
}

.admin-logo-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.admin-logo-box{
  display:grid;
  gap:12px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(15,76,92,.12);
  background:rgba(255,255,255,.84);
}

.admin-logo-preview{
  min-height:170px;
  border-radius:14px;
  background:#eef9fa center/contain no-repeat;
  border:1px dashed rgba(0,154,165,.28);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);
}

.admin-logo-preview.hero{
  min-height:220px;
}

.hondu-logo-quick-save{
  min-width:210px;
}

.brand-logo.hondu-dynamic-logo{
  object-fit:contain !important;
}

.brand-logo[data-logo-shape="circle"]{
  border-radius:999px !important;
  background:#fff !important;
  padding:4px !important;
}

.brand-logo[data-logo-shape="wide"]{
  width:132px !important;
  max-width:132px !important;
  height:54px !important;
  object-fit:contain !important;
}

.hondu-hero-logo-block{
  display:none;
  place-items:start;
  gap:14px;
  width:min(520px,100%);
  padding:24px;
  border-radius:28px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 24px 55px rgba(15,76,92,.12);
  backdrop-filter:blur(10px);
}

.hondu-hero-logo-block img{
  width:100%;
  max-width:360px;
  height:auto;
  object-fit:contain;
  display:block;
}

.hondu-hero-logo-caption{
  color:#0f4c5c;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:.86rem;
}

.hondu-hero-logo-block[data-logo-size="small"] img{max-width:250px;}
.hondu-hero-logo-block[data-logo-size="medium"] img{max-width:360px;}
.hondu-hero-logo-block[data-logo-size="large"] img{max-width:460px;}
.hondu-hero-logo-block[data-logo-size="xlarge"] img{max-width:560px;}

.hero-content.hondu-hero-logo-mode{
  align-items:flex-start !important;
}

@media(max-width:800px){
  .admin-logo-grid{
    grid-template-columns:1fr;
  }
  .hondu-hero-logo-block{
    padding:18px;
    border-radius:22px;
  }
  .hondu-hero-logo-block img{
    max-width:310px;
  }
}



/* ==========================================================
   HONDU MEX V23 — Estadísticas reparadas
   ========================================================== */
.stats-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0;
}
.stats-actions button{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
}
.stats-actions button.secondary{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}
.stats-actions button.danger{
  background:#b42318;
}
.stats-device-box{
  margin:12px 0 18px;
  padding:14px;
  border-radius:14px;
  background:#f7fbfc;
  border:1px solid rgba(0,109,117,.14);
  color:#234955;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.stats-notice{
  padding:12px 14px;
  border-radius:14px;
  font-weight:900;
  margin:10px 0;
}
.stats-notice.counting{
  background:#fff8e5;
  color:#805400;
  border:1px solid rgba(128,84,0,.18);
}
.stats-notice.locked{
  background:#ecfdf3;
  color:#087f5b;
  border:1px solid rgba(8,127,91,.18);
}



/* ==========================================================
   HONDU MEX V24 — Fix imágenes, catálogo, servicios, galería, logo y stats
   ========================================================== */

/* Toast guardado arriba derecha */
.hondu-toast-stack{
  position:fixed;
  right:18px;
  top:86px;
  z-index:999999;
  display:grid;
  gap:10px;
  max-width:min(380px,calc(100vw - 36px));
}
.hondu-toast{
  transform:translateX(20px);
  opacity:0;
  transition:.25s ease;
  padding:13px 16px;
  border-radius:16px;
  color:#fff;
  font-weight:900;
  box-shadow:0 18px 42px rgba(12,35,48,.18);
  background:linear-gradient(135deg,#006D75,#009AA5);
}
.hondu-toast.show{
  transform:translateX(0);
  opacity:1;
}
.hondu-toast.error{
  background:#b42318;
}

/* Imagen completa en el cuadro: sin ventanita blanca */
.home-service-media,
.clean-catalog-media,
.gallery-card .gallery-media,
.project-card .project-media,
.feature-photo,
.page-hero-admin-preview,
.catalog-cover-preview,
.hondu-upload-preview{
  background-color:transparent !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  overflow:hidden !important;
}

.home-service-media img,
.clean-catalog-media img,
.gallery-card img,
.project-card img,
.feature-photo img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
  background:transparent !important;
}

.home-service-media,
.clean-catalog-media{
  min-height:240px !important;
  height:240px !important;
}

/* Quitar blanco atrás del logo flotante */
.hondu-hero-logo-block,
.hondu-hero-logo-block.hondu-logo-floating-no-box{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  padding:0 !important;
  border-radius:0 !important;
}
.hondu-hero-logo-block img{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
}
.hondu-hero-logo-caption{
  display:none !important;
}

/* Admin uploader V24 */
.hondu-image-field-v24 > label,
.hondu-image-field-v24 > input[data-field="image_url"],
.hondu-image-field-v24 > input[data-cover-field*="image"],
.hondu-image-field-v24 > input[data-page-hero-input],
.hondu-image-field-v24 > input[data-home-hero-url],
.hondu-image-field-v24 > input[data-extra-image],
.hondu-image-field-v24 > input[data-hondu-logo-input]{
  display:none;
}
.hondu-upload-box.v24{
  margin-top:8px;
  display:grid;
  gap:11px;
  padding:14px;
  border:2px solid rgba(0,154,165,.20);
  border-radius:16px;
  background:linear-gradient(180deg,#ffffff,#f2fbfc);
  box-shadow:0 10px 26px rgba(15,76,92,.07);
}
.hondu-upload-title{
  color:#0f4c5c;
  font-weight:900;
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.hondu-upload-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.hondu-upload-btn,
.hondu-save-image-now,
.hondu-clear-image,
.hondu-manual-url{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  font-size:.88rem;
}
.hondu-upload-btn,
.hondu-save-image-now{
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
  box-shadow:0 10px 22px rgba(0,109,117,.16);
}
.hondu-clear-image{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}
.hondu-manual-url{
  color:#5d4630;
  background:#f6ead8;
  border:1px solid rgba(190,139,67,.22);
}
.hondu-upload-status{
  font-size:.84rem;
  color:#4f6878;
  line-height:1.35;
}
.hondu-upload-status.loading{
  color:#006D75;
  font-weight:900;
}
.hondu-upload-status.ok{
  color:#087f5b;
  font-weight:900;
}
.hondu-upload-status.error{
  color:#b42318;
  font-weight:900;
}
.hondu-upload-preview{
  width:100%;
  min-height:210px;
  border-radius:13px;
  background:center/cover no-repeat;
  border:1px solid rgba(15,76,92,.13);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}

/* Nota visible en galerías/repetidores */
.hondu-repeat-note-v24{
  margin:0 0 16px;
  padding:13px 15px;
  border-radius:14px;
  background:#ecfdf3;
  border:1px solid rgba(8,127,91,.18);
  color:#075f44;
  font-weight:800;
}

/* Stats no se queda visualmente atorado */
.stats-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0;
}
.stats-actions button{
  border:0;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#006D75,#009AA5);
}
.stats-actions button.secondary{
  color:#17404a;
  background:#e9f6f8;
  border:1px solid rgba(0,109,117,.14);
}
.stats-actions button.danger{
  background:#b42318;
}
.stats-device-box{
  margin:12px 0 18px;
  padding:14px;
  border-radius:14px;
  background:#f7fbfc;
  border:1px solid rgba(0,109,117,.14);
  color:#234955;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.stats-notice{
  padding:12px 14px;
  border-radius:14px;
  font-weight:900;
  margin:10px 0;
}
.stats-notice.counting{
  background:#fff8e5;
  color:#805400;
  border:1px solid rgba(128,84,0,.18);
}
.stats-notice.locked{
  background:#ecfdf3;
  color:#087f5b;
  border:1px solid rgba(8,127,91,.18);
}



/* HONDU MEX V25 — Estadísticas no-loading */
.stats-notice code,
.stats-device-box code{
  background:rgba(15,76,92,.08);
  padding:2px 5px;
  border-radius:6px;
}



/* ==========================================================
   HONDU MEX V27 — WhatsApp destino de pruebas
   ========================================================== */
.admin-whatsapp-test-box{
  display:grid;
  gap:16px;
  padding:20px;
  border-radius:18px;
  border:2px solid rgba(0,154,165,.22);
  background:linear-gradient(180deg,#ffffff,#f2fbfc);
  box-shadow:0 18px 42px rgba(15,76,92,.08);
}
.admin-whatsapp-test-box input{
  font-size:1.08rem;
  font-weight:900;
  letter-spacing:.04em;
}