/* NCCM v43 — stronger mobile/app visual cleanup
   Goal: make changes obvious on mobile; preserve desktop. */
@media (max-width:760px){
  /* HOME: force a brighter mobile hero so the kitchen does not look buried */
  html body.home-page .nccm-app-hero-card{
    background-image:url('/assets/img/hero-kitchen-bright-v23.jpg')!important;
    background-position:center 56%!important;
    background-size:cover!important;
    min-height:318px!important;
    box-shadow:0 16px 38px rgba(0,0,0,.18)!important;
    border-radius:0 0 28px 28px!important;
  }
  html body.home-page .nccm-app-hero-shade{
    background:
      linear-gradient(90deg,rgba(9,6,4,.18),rgba(9,6,4,.10) 58%,rgba(9,6,4,.02)),
      linear-gradient(0deg,rgba(0,0,0,.10),rgba(0,0,0,0) 56%)!important;
  }
  html body.home-page .nccm-app-hero-card::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    pointer-events:none!important;
    z-index:1!important;
    background:
      linear-gradient(180deg,rgba(255,245,232,.28),rgba(255,245,232,.08) 46%,rgba(255,245,232,0)),
      radial-gradient(circle at 22% 18%,rgba(255,255,255,.30),transparent 32%)!important;
    mix-blend-mode:screen!important;
  }
  html body.home-page .nccm-app-hero-content{z-index:3!important;}
  html body.home-page .nccm-app-hero-content h1{
    text-shadow:0 4px 15px rgba(0,0,0,.38)!important;
  }
  html body.home-page .nccm-app-hero-content p{
    text-shadow:0 3px 12px rgba(0,0,0,.35)!important;
  }

  /* CATALOG: remove the duplicated lower quote button area completely */
  html body.catalog-app-index #categorias .page-intro,
  html body.catalog-app-index #categorias .page-intro .btn,
  html body.catalog-app-index #categorias .page-intro > div{
    display:none!important;
  }
  html body.catalog-app-index #categorias.section{
    padding:8px 0 10px!important;
  }
  html body.catalog-app-index .catalog-showroom-grid{
    padding-top:0!important;
  }

  /* SERVICES / PROJECTS / GALLERY:
     Replace the large white box with an open, premium intro strip. */
  html body.services-page .section:first-of-type,
  html body.projects-page .section:first-of-type,
  html body.gallery-page .section:first-of-type{
    padding:18px 0 8px!important;
    background:linear-gradient(180deg,#fff7ed,#f4eadb)!important;
  }

  html body.services-page .page-intro,
  html body.projects-page .page-intro,
  html body.gallery-page .page-intro{
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
    margin:0 14px 14px!important;
    padding:0 0 16px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    display:block!important;
    position:relative!important;
  }
  html body.services-page .page-intro::before,
  html body.projects-page .page-intro::before,
  html body.gallery-page .page-intro::before{
    content:""!important;
    display:block!important;
    width:58px!important;
    height:3px!important;
    border-radius:99px!important;
    background:linear-gradient(90deg,#c7975e,#e8c78f)!important;
    margin:0 0 12px!important;
  }
  html body.services-page .page-intro > div,
  html body.projects-page .page-intro > div,
  html body.gallery-page .page-intro > div{
    display:block!important;
  }
  html body.services-page .page-intro .kicker,
  html body.projects-page .page-intro .kicker,
  html body.gallery-page .page-intro .kicker{
    display:block!important;
    font-size:10px!important;
    line-height:1.1!important;
    letter-spacing:4.5px!important;
    color:#b57c3c!important;
    margin:0 0 7px!important;
    text-transform:uppercase!important;
  }
  html body.services-page .page-intro .title,
  html body.projects-page .page-intro .title,
  html body.gallery-page .page-intro .title{
    display:block!important;
    font-size:clamp(26px,8vw,34px)!important;
    line-height:.98!important;
    letter-spacing:-.8px!important;
    color:#1d1009!important;
    margin:0 0 8px!important;
    max-width:100%!important;
  }
  html body.services-page .page-intro .lead,
  html body.projects-page .page-intro .lead,
  html body.gallery-page .page-intro .lead{
    display:block!important;
    font-size:14px!important;
    line-height:1.42!important;
    color:#6b5749!important;
    margin:0 0 13px!important;
    max-width:100%!important;
  }
  html body.services-page .page-intro .btn,
  html body.projects-page .page-intro .btn,
  html body.gallery-page .page-intro .btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:0!important;
    padding:11px 16px!important;
    border-radius:16px!important;
    background:linear-gradient(135deg,#c7975e,#e8c78f)!important;
    color:#20130c!important;
    font-size:13px!important;
    font-weight:1000!important;
    box-shadow:0 12px 24px rgba(199,151,94,.18)!important;
  }

  /* Make first content grid/cards start closer and cleaner */
  html body.services-page [data-dyn-services-list],
  html body.projects-page [data-dyn-projects-list],
  html body.gallery-page [data-dyn-gallery-list],
  html body.gallery-page .masonry{
    margin-top:6px!important;
    padding-top:0!important;
  }

  /* Secondary CTA boxes after projects/services should not become huge blocks on mobile */
  html body.services-page .section.compact,
  html body.projects-page .section.compact,
  html body.gallery-page .section.compact{
    padding:12px 0 18px!important;
    background:#fff7ed!important;
  }
  html body.services-page .cta,
  html body.projects-page .cta,
  html body.gallery-page .cta{
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
    margin:0 14px!important;
    padding:15px!important;
    border-radius:22px!important;
    min-height:0!important;
  }
  html body.services-page .cta .title,
  html body.projects-page .cta .title,
  html body.gallery-page .cta .title{
    font-size:clamp(23px,7vw,30px)!important;
    line-height:1.02!important;
  }

  /* CONTACT: turn empty quote-looking box into compact CTA and compress contact cards */
  html body.contact-page .section{
    padding:14px 0 14px!important;
  }
  html body.contact-page .split{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0 14px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  html body.contact-page .story-card{
    width:100%!important;
    max-width:100%!important;
    margin:0 0 12px!important;
    padding:14px!important;
    border-radius:22px!important;
    background:rgba(255,250,243,.96)!important;
    border:1px solid rgba(88,54,31,.10)!important;
    box-shadow:0 12px 26px rgba(42,24,13,.08)!important;
  }
  html body.contact-page .contact-social-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin:8px 0 0!important;
  }
  html body.contact-page .contact-method{
    min-height:0!important;
    padding:12px 14px!important;
    border-radius:18px!important;
    background:#fffaf3!important;
    box-shadow:none!important;
    border:1px solid rgba(88,54,31,.09)!important;
    display:grid!important;
    grid-template-columns:88px 1fr!important;
    gap:8px!important;
    align-items:center!important;
  }
  html body.contact-page .contact-method h3{
    margin:0!important;
    font-size:15px!important;
    line-height:1.1!important;
    color:#1f130d!important;
  }
  html body.contact-page .contact-method b{
    display:block!important;
    text-align:left!important;
    font-size:14px!important;
    line-height:1.25!important;
    color:#111!important;
    overflow-wrap:anywhere!important;
  }
  html body.contact-page .cta{
    width:100%!important;
    max-width:100%!important;
    margin:0 0 12px!important;
    min-height:0!important;
    height:auto!important;
    padding:16px!important;
    border-radius:22px!important;
    background:linear-gradient(135deg,#2a170f,#4b2b1a 58%,#8d5c31)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    box-shadow:0 16px 32px rgba(42,24,13,.16)!important;
    color:#fff7ed!important;
  }
  html body.contact-page .cta .kicker{
    color:#e8c78f!important;
    font-size:10px!important;
    letter-spacing:3.5px!important;
    margin:0 0 7px!important;
  }
  html body.contact-page .cta .title{
    color:#fffaf3!important;
    font-size:clamp(23px,6.8vw,30px)!important;
    line-height:1.03!important;
    margin:0 0 8px!important;
  }
  html body.contact-page .cta p{
    color:#f3ddbd!important;
    font-size:13.5px!important;
    line-height:1.4!important;
    margin:0 0 14px!important;
  }
  html body.contact-page .cta .btn{
    display:inline-flex!important;
    min-height:0!important;
    padding:12px 17px!important;
    border-radius:16px!important;
    background:linear-gradient(135deg,#c7975e,#e8c78f)!important;
    color:#20130c!important;
    font-size:13px!important;
    font-weight:1000!important;
  }
}

@media (max-width:390px){
  html body.home-page .nccm-app-hero-card{min-height:294px!important;}
  html body.services-page .page-intro .title,
  html body.projects-page .page-intro .title,
  html body.gallery-page .page-intro .title{font-size:30px!important;}
}
