
body {
  display: grid;
  grid-template-areas:
    "header"
    "main"
    "footer";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto 1fr auto;
  min-height: 100vh;
}
header { grid-area: header; }
main { grid-area: main; }
footer { grid-area: footer; }
.page-container { width: 1200px; max-width: 100%; margin: 0 auto; padding: 0 8px; }
.page-shell { animation: slideIn 0.5s ease; animation-fill-mode: both; }
.section-head { margin-bottom: 20px; max-width: 720px; }
.section-title { margin-bottom: 8px; }
.section-lede { color: var(--text-secondary); margin-bottom: 0; }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.catalog-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 24px; align-items: start; }
.frame-strip { display: grid; grid-template-columns: 1fr; gap: 12px; }
.feature-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.split-row { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: start; }
.faq-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }
.product-layout {
  display: grid;
  grid-template-areas: "gallery buy";
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}
.product-gallery { grid-area: gallery; }
.buy-panel { grid-area: buy; }
.cart-layout {
  display: grid;
  grid-template-areas: "lines checkout";
  grid-template-columns: 1.25fr 1fr;
  gap: 24px;
  align-items: start;
}
.cart-lines { grid-area: lines; }
.cart-checkout { grid-area: checkout; }
.prose { max-width: 820px; }
.trust-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 1024px) {
  .catalog-grid { grid-template-columns: 1fr; }
  .feature-row { grid-template-columns: repeat(2, 1fr); }
  .product-layout { grid-template-areas: "gallery" "buy"; grid-template-columns: 1fr; }
  .cart-layout { grid-template-areas: "lines" "checkout"; grid-template-columns: 1fr; }
  .faq-list { grid-template-columns: 1fr; gap: 0; }
  .split-row { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .hero-grid { grid-template-columns: 1fr; }
  .feature-row { grid-template-columns: 1fr; }
  .trust-row { grid-template-columns: repeat(2, 1fr); }
}
