@import url("styles-base.css?v=2");

/* Compact layout revision */
html,body{overflow-x:hidden}
html{scroll-padding-top:78px}
.site-header{height:74px;background:#fff;backdrop-filter:none}
.nav-wrap{width:100%;max-width:1160px;min-width:0;padding:0 24px}
.brand{width:58px;height:58px;flex:0 0 58px}
.brand img{width:58px;height:58px}
.site-header nav{min-width:0;gap:23px;font-size:11px}
.nav-contact{padding:9px 14px!important}
.hero{min-height:570px}
.hero-content{width:100%;max-width:1160px;padding:52px 24px 88px}
.hero h1{font-size:clamp(54px,6.4vw,88px);line-height:.9}
.tagline{font-size:clamp(20px,2.2vw,28px);margin:22px 0}
.hero-actions{margin-top:30px}
.hero-note{padding:14px 4vw;font-size:9px}
.welcome{padding:65px 24px}
.section{padding:96px 24px}
.split,.quality-layout,.section-heading,.service-grid,.resources{width:100%;max-width:1100px;min-width:0}
.split>*,.quality-layout>*,.section-heading>*,.service-grid>*,.resources>*{min-width:0}
.image-main{height:500px}
.product-card>img{height:215px}

@media(max-width:1100px){
  .site-header nav{position:fixed;inset:74px 0 auto;background:#fff;display:none;flex-direction:column;align-items:flex-start;padding:30px;gap:12px;box-shadow:0 15px 30px rgba(0,0,0,.12)}
  .site-header nav.open{display:flex}
  .menu-toggle{display:block}
  .split,.quality-layout,.section-heading,.service-grid,.resources{grid-template-columns:1fr}
  .image-stack{max-width:620px}
  .peat-story{grid-template-columns:1fr}
  .peat-story-image{min-height:420px}
  .product-grid{grid-template-columns:1fr}
  .product-card{display:grid;grid-template-columns:.85fr 1.15fr}
  .product-card>img{height:100%;min-height:300px}
  .package-grid{grid-template-columns:1fr}
  .quality-image img{height:500px}
  .contact{grid-template-columns:1fr}
  .contact-photo{min-height:420px}
  .site-footer{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}

@media(max-width:600px){
  html{scroll-padding-top:68px}
  .site-header{height:68px}
  .nav-wrap{padding:0 16px}
  .brand,.brand img{width:52px;height:52px}
  .brand{flex-basis:52px}
  .site-header nav{inset:68px 0 auto}
  .hero{min-height:540px}
  .hero-content{padding:44px 20px 88px}
  .hero h1{font-size:clamp(48px,16vw,58px)}
  .tagline{font-size:21px;margin:18px 0}
  .welcome{padding:58px 20px}
  .section{padding:76px 20px}
  .image-main{height:380px}
  .product-card{display:flex}
  .product-card>img{height:220px;min-height:0}
  .contact-panel{padding:65px 20px}
}