/* Nuvinor responsive consistency layer — Step 11 */
html,body{max-width:100%;overflow-x:hidden}*,*::before,*::after{box-sizing:border-box}img,svg,video,canvas{max-width:100%;height:auto}a,button,input,textarea,select{min-width:0}section{scroll-margin-top:120px}

/* Equal-height homepage trust cards */
.home-trust-grid>.trust-card{display:flex;height:100%}.home-trust-grid .trust-card>div:last-child{display:flex;flex-direction:column}.home-trust-grid .trust-card p{flex:1}
.home-context-card>div{height:100%}

/* Equal blog cards */
.blog-card-grid{align-items:stretch}.blog-card{height:100%}.blog-card-image{width:100%}.blog-card-content{height:100%}
.blog-card h3{overflow-wrap:anywhere}

/* Standard interactive sizing */
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
input,textarea,select{font-size:16px}

/* Very small phones */
@media (max-width:479px){
  .xs\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xs\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xs\:inline{display:inline}.xs\:hidden{display:none}
  .home-trust-grid{grid-template-columns:1fr}
  .blog-card-grid{grid-template-columns:1fr}
  .home-context-section{padding-top:1.5rem;padding-bottom:1.5rem}
  .home-context-card{border-radius:1.25rem}
  .home-context-card h2{font-size:1.35rem;line-height:1.3}
  .home-context-card a{width:100%;justify-content:center}
  #navLinks{gap:.25rem;padding-left:.15rem;padding-right:.15rem}
  #navLinks>a,#categoriesToggle{font-size:.78rem;padding-left:.65rem;padding-right:.65rem}
}

@media (min-width:480px){
  .xs\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xs\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xs\:inline{display:inline}.xs\:hidden{display:none}
}

/* Phones and tablets */
@media (max-width:767px){
  body{font-size:14px}
  header{position:sticky;top:0}
  .latest-blogs-section .blog-card h3{min-height:auto}
  .latest-blogs-section .blog-card-image{aspect-ratio:16/10}
  .home-trust-strip .trust-card{min-height:auto}
  .home-context-card{box-shadow:0 8px 24px rgba(15,23,42,.06)}
  .home-context-card>div>div{min-height:0}
  .fixed.bottom-5.right-5{bottom:1rem;right:1rem;padding:.8rem}
}

/* Tablet */
@media (min-width:768px) and (max-width:1023px){
  .blog-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Desktop equal rhythm */
@media (min-width:1024px){
  .home-trust-grid>.trust-card{min-height:138px}
  .home-context-card>div>div{min-height:300px}
  .blog-card-grid>.blog-card{min-height:390px}
}

/* Step 13 — one width system for every homepage section */
:root{--nuv-home-max:1440px;--nuv-gutter:16px}
.nuv-home-shell{width:100%;max-width:var(--nuv-home-max);margin-left:auto;margin-right:auto;padding-left:var(--nuv-gutter);padding-right:var(--nuv-gutter)}
/* The hero is a shell itself; prevent padding from changing its visible outer width. */
section.nuv-home-shell>.bannerSwiper{width:100%}
/* Keep horizontal collections inside the viewport without widening the page. */
.nuv-home-shell .swiper,.nuv-home-shell [class*="overflow-x-auto"]{max-width:100%}
@media (min-width:640px){:root{--nuv-gutter:24px}}
@media (min-width:1024px){:root{--nuv-gutter:32px}}
@media (max-width:767px){
  .nuv-home-shell{max-width:100%}
  section.nuv-home-shell{margin-top:1rem;margin-bottom:1rem}
  .nuv-home-shell .grid{min-width:0}
  .nuv-home-shell img{max-width:100%}
}
@media (max-width:479px){:root{--nuv-gutter:14px}}
