/* TDM v3.6.9.3 — Hero premium en website y app
   Este archivo cambia también la pantalla principal normal (/index.html),
   no solamente /app/. */

body.home-page .hero{
  min-height:68svh!important;
  max-height:760px!important;
  align-items:flex-end!important;
  padding:120px 0 56px!important;
  background-position:center center!important;
  background-size:cover!important;
  border-radius:0 0 38px 38px!important;
  box-shadow:0 24px 70px rgba(55,32,18,.18)!important;
}
body.home-page .hero::before{
  background:
    linear-gradient(180deg,rgba(17,10,5,.04) 0%,rgba(17,10,5,.26) 44%,rgba(17,10,5,.82) 100%)!important;
  z-index:-1!important;
}
body.home-page .hero::after{
  height:95px!important;
  background:linear-gradient(0deg,var(--cream),rgba(247,241,232,0))!important;
}
body.home-page .hero-content{
  width:min(760px,92vw)!important;
  padding-top:0!important;
  margin-bottom:0!important;
}
body.home-page .hero h1{
  font-size:clamp(44px,5.6vw,76px)!important;
  line-height:.98!important;
  margin:16px 0 16px!important;
}
body.home-page .hero p{
  font-size:clamp(17px,1.55vw,21px)!important;
  max-width:620px!important;
  line-height:1.55!important;
}
body.home-page .hero-stats{
  margin-top:28px!important;
}
body.home-page .stat{
  padding:13px 16px!important;
  border-radius:18px!important;
  background:rgba(255,250,243,.14)!important;
}

/* Portadas internas del website: menos gigantes y más elegantes */
.page-hero,
.catalog-showroom-hero,
.quote-hero{
  min-height:54svh!important;
  max-height:620px!important;
  display:flex!important;
  align-items:flex-end!important;
  padding:128px 0 54px!important;
  border-radius:0 0 34px 34px!important;
  overflow:hidden!important;
  box-shadow:0 22px 64px rgba(55,32,18,.14)!important;
  background-position:center center!important;
  background-size:cover!important;
}
.page-hero::after,
.catalog-showroom-hero::after,
.quote-hero::after{
  background:linear-gradient(180deg,rgba(17,10,5,.06) 0%,rgba(17,10,5,.22) 45%,rgba(17,10,5,.76) 100%)!important;
}
.page-hero .container,
.catalog-showroom-hero .container,
.quote-hero .container{
  position:relative!important;
  z-index:2!important;
}
.page-hero .title,
.catalog-showroom-hero .title,
.quote-hero .title{
  color:#fffaf3!important;
  text-shadow:0 8px 22px rgba(0,0,0,.38)!important;
  font-size:clamp(38px,5.4vw,70px)!important;
  line-height:1!important;
}
.page-hero .lead,
.catalog-showroom-hero .lead,
.quote-hero .lead{
  color:#f6e5cf!important;
  text-shadow:0 5px 16px rgba(0,0,0,.32)!important;
  font-size:clamp(16px,1.6vw,20px)!important;
}
.page-hero .breadcrumbs,
.catalog-showroom-hero .breadcrumbs,
.quote-hero .breadcrumbs{
  color:#ffe1ac!important;
  text-shadow:0 5px 16px rgba(0,0,0,.35)!important;
  font-weight:950!important;
}

@media(max-width:760px){
  body.home-page .hero{
    min-height:52svh!important;
    max-height:520px!important;
    padding:92px 0 30px!important;
    border-radius:0 0 28px 28px!important;
  }
  body.home-page .hero-content{
    width:calc(100% - 32px)!important;
  }
  body.home-page .hero h1{
    font-size:34px!important;
    letter-spacing:-1.25px!important;
    line-height:1.02!important;
    margin:12px 0 10px!important;
  }
  body.home-page .hero p{
    font-size:14.5px!important;
    line-height:1.45!important;
    max-width:31ch!important;
    margin-bottom:0!important;
  }
  body.home-page .hero-actions{
    margin-top:18px!important;
    gap:9px!important;
  }
  body.home-page .hero-actions .btn{
    padding:11px 13px!important;
    font-size:13px!important;
    border-radius:999px!important;
  }
  body.home-page .hero-stats{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:7px!important;
    margin-top:18px!important;
  }
  body.home-page .stat{
    padding:9px 8px!important;
    border-radius:15px!important;
  }
  body.home-page .stat b{
    font-size:15px!important;
  }
  body.home-page .stat span{
    font-size:10px!important;
    line-height:1.15!important;
  }
  body.home-page .scroll-cue{
    display:none!important;
  }

  .page-hero,
  .catalog-showroom-hero,
  .quote-hero{
    min-height:45svh!important;
    max-height:430px!important;
    padding:88px 0 30px!important;
    border-radius:0 0 28px 28px!important;
  }
  .page-hero .container,
  .catalog-showroom-hero .container,
  .quote-hero .container{
    width:calc(100% - 32px)!important;
  }
  .page-hero .title,
  .catalog-showroom-hero .title,
  .quote-hero .title{
    font-size:32px!important;
    letter-spacing:-.8px!important;
  }
  .page-hero .lead,
  .catalog-showroom-hero .lead,
  .quote-hero .lead{
    font-size:14px!important;
    line-height:1.45!important;
    max-width:32ch!important;
  }
}

@media(max-width:390px){
  body.home-page .hero{
    min-height:50svh!important;
    padding-top:86px!important;
  }
  body.home-page .hero h1{
    font-size:31px!important;
  }
  body.home-page .hero p{
    font-size:13.5px!important;
  }
  body.home-page .hero-stats{
    grid-template-columns:1fr 1fr 1fr!important;
  }
}