/* Premium editorial layer: keeps commerce behavior intact while tightening the visual system. */
:root {
  --ink: #171815;
  --paper: #fcfbf8;
  --cream: #f1ece3;
  --rust: #b34f32;
  --olive: #4f5b48;
  --line: #d9d2c7;
  --display: "Manrope", sans-serif;
  --body: "DM Sans", sans-serif;
}

body { font-family: var(--body); background: var(--paper); }
.announce { background: var(--ink); color: #f7f1e8; height: 36px; font-size: 10px; letter-spacing: .16em; }
.announce span { color: #e3845d; }
.nav { height: 76px; background: rgba(252,251,248,.9); border-bottom: 1px solid rgba(23,24,21,.12); }
.brand { letter-spacing: .18em; font-size: 18px; }
.nav nav a { position: relative; font-size: 12px; letter-spacing: .04em; }
.nav nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: var(--rust); transition: right .25s ease; }
.nav nav a:hover::after { right: 0; }
.hero { height: min(760px, calc(100vh - 112px)); min-height: 620px; background: #ded5c8; }
.hero::after { background: linear-gradient(90deg, rgba(241,236,227,.7) 0%, rgba(241,236,227,.15) 48%, rgba(0,0,0,.08) 100%); }
.hero-copy { padding-top: 2vh; }
.hero-copy .eyebrow { color: var(--rust); font-size: 10px; letter-spacing: .25em; }
.hero-copy h1 { font-family: var(--display); font-size: clamp(58px, 8vw, 112px); line-height: .9; letter-spacing: -.075em; max-width: 720px; }
.hero-copy > p:not(.eyebrow) { font-size: 16px; max-width: 400px; color: #34342f; }
.hero-copy .btn { min-width: 218px; min-height: 54px; justify-content: space-between; border-radius: 2px; }
.hero-note { right: max(28px, calc((100% - 1180px)/2)); font-size: 9px; letter-spacing: .2em; }
.materials { padding-top: 88px; }
.materials-intro { align-items: end; }
.materials-intro h2, .section-head h2, .story-copy h2, .newsletter h2 { font-family: var(--display); letter-spacing: -.06em; }
.materials-intro h2 { font-size: clamp(40px, 5vw, 68px); line-height: .98; }
.materials-highlights article { background: #f5f1e9; border: 1px solid #e3ddd3; border-radius: 4px; padding: 28px; transition: transform .3s ease, box-shadow .3s ease; }
.materials-highlights article:hover { transform: translateY(-5px); box-shadow: 0 18px 35px rgba(48,39,29,.08); }
.shop { padding-top: 120px; }
.shop-controls { border: 1px solid #e1dbd1; box-shadow: 0 12px 32px rgba(38,31,23,.04); }
.filter-label { font-family: var(--display); font-weight: 700; letter-spacing: -.02em; }
.product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 34px 20px; }
.product-image { aspect-ratio: 4 / 5; border-radius: 3px; background: #eee9e0; }
.product-image img { transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.product-card:hover .product-image img { transform: scale(1.045); filter: saturate(1.04); }
.product-meta { padding-top: 16px; }
.product-meta h3 { font-family: var(--display); font-size: 14px; letter-spacing: -.025em; }
.product-meta strong { font-weight: 700; color: var(--rust); }
.story { margin-top: 20px; }
.story-art { background: var(--rust); }
.story-copy { padding-top: 100px; padding-bottom: 100px; }
.story-copy h2 { font-size: clamp(42px, 5vw, 72px); }
.reviews { padding: 130px 0; }
.reviews blockquote { font-size: clamp(28px, 4vw, 48px); }
.newsletter { background: var(--olive); padding-top: 76px; padding-bottom: 76px; }
.newsletter h2 { font-size: clamp(38px, 5vw, 64px); }
footer { padding-top: 88px; }
@media (max-width: 900px) { .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) {
  .hero { height: calc(100svh - 102px); min-height: 560px; }
  .hero::after { background: linear-gradient(0deg, rgba(14,15,13,.72), rgba(14,15,13,.04) 76%); }
  .hero-copy { color: #fff; padding-bottom: 58px; }
  .hero-copy > p:not(.eyebrow) { color: rgba(255,255,255,.86); }
  .hero-copy .eyebrow { color: #f1b092; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 12px; }
  .materials { padding-top: 64px; }
  .shop { padding-top: 78px; }
}
@media (max-width: 460px) {
  .product-grid { grid-template-columns: 1fr; gap: 38px; }
  .product-image { aspect-ratio: 1 / 1.08; }
  .product-meta h3 { font-size: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero-copy > * { animation: rise-in .7s both; }
  .hero-copy > *:nth-child(2) { animation-delay: .08s; }
  .hero-copy > *:nth-child(3) { animation-delay: .16s; }
  .hero-copy > *:nth-child(4) { animation-delay: .24s; }
  @keyframes rise-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
}
