/* =========================================================
   DEKATRADE 20.14.42 — Stage 1: UX foundation + homepage
   Scope: global overflow safety + homepage desktop/tablet/mobile.
   Loaded last so production main.css/site.css swaps cannot undo it.
   ========================================================= */

/* Global safety net: do not allow media or long labels to escape the viewport. */
html{overflow-x:clip}
body{overflow-x:hidden}
img,video,iframe{max-width:100%}
button,input,select,textarea,a{max-width:100%}
.btn,.button,.text-link{min-width:0}

/* Long Russian/Kazakh product and section names must wrap instead of colliding. */
.home-v18-featured-card h2,
.home-v18-production-head h2,
.home-seo-navigation h2,
.home-v18-hero__copy h1,
.home-v18-hero__lead,
.home-mobile-hero-v18100__title,
.home-mobile-hero-v18100 p{
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:auto;
}

/* ---------- Desktop/tablet homepage hero ---------- */
@media(min-width:721px){
  .home-v18-hero{
    position:relative!important;
    min-height:600px!important;
    background:#082d54!important;
  }
  .home-v18-hero .home-v15-hero__bg{
    display:block!important;
    opacity:1!important;
    background-image:
      linear-gradient(90deg,
        rgba(3,20,40,.96) 0%,
        rgba(4,31,61,.92) 28%,
        rgba(5,42,78,.80) 48%,
        rgba(5,42,78,.42) 68%,
        rgba(5,42,78,.12) 100%),
      url('../images/home-hero-integrated-v15.6.webp')!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }
  .home-v18-hero .home-v15-hero__inner{
    min-height:600px!important;
    padding-top:44px!important;
    padding-bottom:44px!important;
    align-items:center!important;
  }
  .home-v18-hero__copy{
    width:min(820px,76%)!important;
    max-width:820px!important;
    padding:32px 36px 30px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:24px!important;
    background:linear-gradient(135deg,rgba(4,24,48,.78),rgba(4,24,48,.56))!important;
    box-shadow:0 20px 48px rgba(0,18,42,.24)!important;
    -webkit-backdrop-filter:blur(6px)!important;
    backdrop-filter:blur(6px)!important;
  }
  .home-v18-hero__copy h1{
    max-width:760px!important;
    margin:0 0 22px!important;
    color:#fff!important;
    font-size:clamp(40px,3.65vw,58px)!important;
    line-height:1.07!important;
    letter-spacing:-.025em!important;
    text-shadow:0 2px 16px rgba(0,0,0,.28)!important;
    text-wrap:balance!important;
  }
  .home-v18-hero__lead{
    max-width:720px!important;
    margin:0 0 24px!important;
    color:#f3f8ff!important;
    font-size:clamp(17px,1.45vw,20px)!important;
    line-height:1.55!important;
    text-shadow:0 1px 10px rgba(0,0,0,.26)!important;
  }
  .home-v18-hero__actions{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:12px!important;
    margin:0 0 24px!important;
  }
  .home-v18-hero__actions .btn{
    width:auto!important;
    min-width:190px!important;
    min-height:52px!important;
    padding:0 24px!important;
    border-radius:12px!important;
    font-size:16px!important;
    font-weight:800!important;
    line-height:1.2!important;
    white-space:normal!important;
    text-align:center!important;
  }
  .home-v18-hero__actions .btn:first-child,
  .home-v18-hero__actions a:first-child{
    background:#fff!important;
    color:#1555ad!important;
    border-color:#fff!important;
  }
  .home-v18-hero__actions .btn:nth-child(2),
  .home-v18-hero__actions a:nth-child(2){
    background:rgba(8,53,101,.74)!important;
    color:#fff!important;
    border-color:rgba(255,255,255,.74)!important;
  }
  .home-v18-hero__stats{
    width:100%!important;
    max-width:730px!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    margin:0!important;
    padding:10px 12px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:16px!important;
    background:rgba(1,20,43,.50)!important;
    box-shadow:none!important;
    backdrop-filter:blur(5px)!important;
  }
  .home-v18-hero__stats article{
    min-width:0!important;
    padding:8px 14px!important;
  }
  .home-v18-hero__stats strong{font-size:17px!important;color:#fff!important}
  .home-v18-hero__stats span{font-size:13px!important;color:#e9f3ff!important}
}

/* Tablet: preserve the photo, but dedicate enough width to readable copy. */
@media(min-width:721px) and (max-width:1100px){
  .home-v18-hero{min-height:560px!important}
  .home-v18-hero .home-v15-hero__inner{
    min-height:560px!important;
    padding-top:32px!important;
    padding-bottom:32px!important;
  }
  .home-v18-hero .home-v15-hero__bg{
    background-position:62% center!important;
  }
  .home-v18-hero__copy{
    width:min(690px,84%)!important;
    padding:28px 30px 26px!important;
  }
  .home-v18-hero__copy h1{
    font-size:clamp(36px,4.8vw,48px)!important;
    max-width:640px!important;
  }
  .home-v18-hero__lead{
    font-size:17px!important;
    line-height:1.5!important;
  }
  .home-v18-hero__actions .btn{min-width:178px!important}
  .home-v18-hero__stats{max-width:640px!important}
  .home-v18-hero__stats article{padding-inline:10px!important;gap:10px!important}
}

/* ---------- Mobile homepage hero ---------- */
@media(max-width:720px){
  .home-mobile-hero-v18100{
    min-height:660px!important;
    background-position:56% center!important;
  }
  .home-mobile-hero-v18100__shade{
    background:
      linear-gradient(180deg,
        rgba(3,15,31,.88) 0%,
        rgba(3,15,31,.72) 28%,
        rgba(3,15,31,.30) 53%,
        rgba(3,15,31,.42) 72%,
        rgba(3,15,31,.90) 100%)!important;
  }
  .home-mobile-hero-v18100__content{
    padding:24px 18px 20px!important;
  }
  .home-mobile-hero-v18100__title{
    max-width:100%!important;
    font-size:clamp(27px,8.4vw,36px)!important;
    line-height:1.08!important;
    letter-spacing:-.02em!important;
    color:#fff!important;
    text-shadow:0 2px 16px rgba(0,0,0,.48)!important;
  }
  .home-mobile-hero-v18100 p{
    max-width:100%!important;
    margin-top:16px!important;
    font-size:15px!important;
    line-height:1.5!important;
    color:#f4f8ff!important;
    text-shadow:0 2px 12px rgba(0,0,0,.48)!important;
  }
  .home-mobile-hero-v18100__stats{
    gap:0!important;
    background:rgba(1,20,43,.44)!important;
    border-radius:14px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    padding:10px 4px!important;
  }
  .home-mobile-hero-v18100__stats article{padding:0 5px!important}
  .home-mobile-hero-v18100__stats article+article{border-left:1px solid rgba(255,255,255,.16)!important}
  .home-mobile-hero-v18100__stats strong{font-size:15px!important}
  .home-mobile-hero-v18100__stats article>div>span{font-size:10px!important}
  .home-mobile-hero-v18100__actions{gap:10px!important;margin-top:12px!important}
  .home-mobile-hero-v18100__btn{
    min-height:52px!important;
    padding:10px 14px!important;
    line-height:1.2!important;
    white-space:normal!important;
    text-align:center!important;
  }
}

/* ---------- Homepage cards/gallery: defensive responsive rules ---------- */
.home-v18-featured-card,
.home-v18-featured-card__copy,
.home-v18-featured-card__image,
.home-v18-production-grid figure{min-width:0!important}
.home-v18-featured-card h2{line-height:1.16!important}
.home-v18-featured-card__button{white-space:normal!important;text-align:center!important}
.home-v18-production-grid img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
.home-v18-production-grid .is-lab img{object-position:center top!important}

/* Common homepage section titles: no clipping on tablet/mobile. */
.home-v18-production-head,
.home-v15-section-head,
.section-head{
  min-width:0!important;
}
.home-v18-production-head h2,
.home-v15-section-head h2,
.section-head h2{
  max-width:100%!important;
  overflow-wrap:break-word!important;
}

@media(max-width:900px){
  .home-v18-production-head,
  .home-v15-section-head,
  .section-head{
    gap:10px!important;
  }
  .home-v18-production-head .text-link,
  .home-v15-section-head .text-link,
  .section-head .text-link{
    white-space:normal!important;
  }
}

@media(max-width:480px){
  .home-v18-featured-card h2{font-size:17px!important;line-height:1.18!important}
  .home-v18-featured-card__button{font-size:12px!important}
}

/* DEKATRADE 20.14.50 — final homepage hero correction per client note:
   no dark card behind text; keep the approved image; tighten and lower the lead text
   so the paragraph wraps earlier and stays on the darker left side of the photo. */
@media(min-width:721px){
  .home-v18-hero{
    min-height:560px!important;
    background:#082d54!important;
  }
  .home-v18-hero .home-v15-hero__bg{
    background-image:
      linear-gradient(90deg,
        rgba(3,20,40,.62) 0%,
        rgba(4,31,61,.48) 26%,
        rgba(5,42,78,.22) 48%,
        rgba(5,42,78,.08) 70%,
        rgba(5,42,78,.02) 100%),
      url('../images/home-hero-integrated-v15.6.webp')!important;
    background-position:center center!important;
    background-size:cover!important;
  }
  .home-v18-hero .home-v15-hero__inner{
    min-height:560px!important;
    padding-top:72px!important;
    padding-bottom:86px!important;
    align-items:flex-start!important;
  }
  .home-v18-hero__copy{
    width:min(660px,58%)!important;
    max-width:660px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .home-v18-hero__copy h1{
    max-width:660px!important;
    margin:0 0 28px!important;
    font-size:clamp(34px,3.1vw,52px)!important;
    line-height:1.06!important;
    color:#fff!important;
    text-shadow:0 2px 12px rgba(0,0,0,.42),0 1px 2px rgba(0,0,0,.45)!important;
    text-wrap:balance!important;
  }
  .home-v18-hero__lead{
    max-width:600px!important;
    margin:0 0 26px!important;
    padding-top:6px!important;
    font-size:18px!important;
    line-height:1.58!important;
    color:#f5f8fd!important;
    text-shadow:0 2px 10px rgba(0,0,0,.38),0 1px 2px rgba(0,0,0,.42)!important;
  }
  .home-v18-hero__actions{
    margin:0 0 40px!important;
  }
  .home-v18-hero__stats{
    max-width:600px!important;
    background:rgba(1,20,43,.34)!important;
    border:1px solid rgba(255,255,255,.15)!important;
    backdrop-filter:blur(6px)!important;
  }
}

@media(min-width:721px) and (max-width:1100px){
  .home-v18-hero .home-v15-hero__bg{
    background-position:60% center!important;
  }
  .home-v18-hero__copy{
    width:min(580px,62%)!important;
    max-width:580px!important;
  }
  .home-v18-hero__copy h1{
    max-width:580px!important;
    font-size:clamp(32px,4.5vw,44px)!important;
  }
  .home-v18-hero__lead,
  .home-v18-hero__stats{
    max-width:540px!important;
  }
}