*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(93,107,0,.10), transparent 24%),
    linear-gradient(180deg,#f7f9fb 0%,#eef2f5 100%);
  color:#16202a;
}
a{text-decoration:none;color:inherit}
.container{width:min(1120px,calc(100% - 32px));margin:0 auto}
.site-header,.site-footer{
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #d9e0e7;
}
.site-footer{
  border-top:1px solid #d9e0e7;
  border-bottom:0;
  margin-top:28px;
}
.header-bar,.footer-grid{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  padding:16px 0;
}
.brand{font-weight:800;letter-spacing:.01em}
.nav{display:flex;flex-wrap:wrap;gap:14px;color:#5f6b78}
.nav .is-active{color:#16202a;font-weight:700}
.main{padding:32px 0 56px}
.hero{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:18px;
}
.panel,.card{
  background:#fff;
  border:1px solid #d9e0e7;
  border-radius:16px;
  padding:22px;
  box-shadow:0 16px 44px rgba(16,24,40,.07);
}
.eyebrow,.badge{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.72rem;
  font-weight:800;
}
.eyebrow{color:#1d5f74}
.badge{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  background:#eef3d2;
  color:#445000;
}
h1,h2,p{margin-top:0}
h1{
  font-size:clamp(2rem,3vw,3.55rem);
  line-height:1.04;
  margin-bottom:14px;
}
p{line-height:1.65;color:#5f6b78}
.cta-row,.stat-grid,.cards,.portfolio,.form-grid,.split{
  display:grid;
  gap:14px;
}
.cta-row{
  grid-template-columns:repeat(2,max-content);
  margin-top:18px;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
}
.button.primary{background:#5d6b00;color:#fff}
.button.secondary{background:#fff;border-color:#d9e0e7}
.stat-grid{grid-template-columns:repeat(3,1fr);margin-top:18px}
.stat{
  padding:14px;
  border:1px solid #d9e0e7;
  border-radius:12px;
  background:#fbfcfd;
}
.stat strong{display:block;font-size:1.08rem}
.section{padding-top:30px}
.cards{grid-template-columns:repeat(3,1fr)}
.portfolio{grid-template-columns:repeat(2,1fr)}
.price-list{display:grid;gap:12px}
.price-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid #d9e0e7;
  padding-bottom:10px;
}
.calculator{display:grid;gap:14px}
label{
  display:block;
  font-size:.88rem;
  font-weight:700;
  margin-bottom:6px;
  color:#1f2a36;
}
input,select,textarea{
  width:100%;
  min-height:46px;
  border-radius:12px;
  border:1px solid #d9e0e7;
  padding:0 14px;
  font:inherit;
  background:#fff;
  color:#16202a;
}
textarea{min-height:120px;padding-top:12px}
.result{
  padding:16px;
  border-radius:12px;
  background:#f0f5e7;
  border:1px solid #d8e3ba;
}
.small{font-size:.92rem;color:#5f6b78}
.feature-image,
.hero-media img{
  display:block;
  width:100%;
  height:auto;
  border-radius:12px;
  object-fit:cover;
  border:1px solid #d9e0e7;
  margin-bottom:14px;
}
.hero-media{
  min-height:520px;
  background-size:cover;
  background-position:center;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
}
.hero-media::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(15,23,42,.08) 0%, rgba(15,23,42,.66) 100%);
}
.hero-media__overlay{
  position:relative;
  z-index:1;
  width:100%;
  padding:22px;
  display:grid;
  gap:14px;
  color:#fff;
}
.hero-media__overlay img{
  width:140px;
  height:auto;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.25));
}
.hero-media__overlay p{color:rgba(255,255,255,.88);margin:0}
@media (max-width:900px){
  .hero,.cards,.portfolio,.stat-grid,.form-grid,.split{grid-template-columns:1fr}
  .header-bar,.footer-grid{flex-direction:column;align-items:flex-start}
  .cta-row{grid-template-columns:1fr}
  .hero-media{min-height:320px}
}