html { position: relative; min-height: 100%; }
body { margin: 0; background: #f3f0e8; color: #21352c; font-family: Georgia, 'Times New Roman', serif; line-height: 1.6; }
.landing-shell { box-sizing: border-box; display: grid; gap: 3rem; max-width: 72rem; min-height: calc(100vh - 5rem); margin: 0 auto; padding: 5rem 1.5rem 4rem; }
.hero { max-width: 42rem; }
.eyebrow { margin: 0 0 1rem; color: #9a5b38; font: 700 .8rem/1.2 Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
h1, h2 { margin: 0; font-weight: 400; letter-spacing: -.035em; line-height: 1.05; }
h1 { max-width: 11ch; font-size: clamp(3.4rem, 12vw, 7.5rem); }
h2 { font-size: clamp(2.5rem, 8vw, 5rem); }
.hero-copy { max-width: 34rem; margin: 2rem 0 0; color: #53645b; font-size: clamp(1.15rem, 2.5vw, 1.45rem); }
.product-card { max-width: 32rem; margin-left: auto; padding: 2rem; border: 1px solid #cbd2c5; border-radius: 1.25rem; background: #dfe6d8; box-shadow: 1rem 1rem 0 #e8dfcf; }
.product-card p:not(.eyebrow) { color: #46594d; }
.status-note { margin-bottom: 0; color: #21352c !important; font-weight: 700; }
.closing-note { align-self: end; margin: 0; color: #53645b; font: .85rem/1.4 Arial, sans-serif; }
footer { padding: 1.5rem; color: #6d776f; font: .75rem/1.4 Arial, sans-serif; text-align: center; }
@media (min-width: 700px) { .landing-shell { grid-template-columns: 1.1fr .9fr; align-content: center; padding: 4rem 3rem; } .product-card { margin-top: 5rem; } }