/* =================================================================
 * routes/gifting.css — Gifting "Arrive with a story to tell." (Rev6 §4.9)
 * Hero + Bone-room patterns come from components.css; this is the
 * gifting-specific staging (occasions, note, goods).
 * ================================================================= */

.vv-gift__head { margin-bottom: clamp(28px, 4vw, 48px); }
.vv-gift__title { font-family: var(--vv-font-display); font-weight: 400; font-size: clamp(1.9rem, 4vw, 3rem); color: var(--vv-bone); margin: 12px 0 16px; }
.vv-gift__body { font-family: var(--vv-font-body); font-size: 1.2rem; color: var(--vv-bone-70); max-width: 46ch; margin-bottom: 22px; }
/* Final visual pass (owner): the full-bleed hero carried the default act
   padding above it — kill the dead space at the top of the page. */
.vv-gift-hero { padding-top: 0; }
/* …and the primary CTA sat flush under its paragraph — give it air. */
.vv-gift__copy .vv-btn--primary { margin-top: 14px; }
.vv-gift-hero .vv-eyebrow { color: var(--vv-bone-70); }

/* Occasions — four type-only Lit-Door cards */
.vv-gift__occasions { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.5vw, 20px); }
.vv-gift__occasion .vv-litdoor__label { padding: clamp(18px, 2vw, 24px); }
.vv-gift__occasion-name { display: block; font-family: var(--vv-font-display); font-size: 1.3rem; color: var(--vv-bone); margin-bottom: 10px; }
.vv-gift__occasion-body { display: block; font-family: var(--vv-font-body); font-size: 1rem; line-height: 1.5; color: var(--vv-bone-70); }
@media (max-width: 899px) { .vv-gift__occasions { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .vv-gift__occasions { grid-template-columns: 1fr; } }

.vv-gift__wax-img, .vv-gift__poppet-img { width: 100%; }

/* The Note — keepsake cards */
.vv-gift__note { text-align: center; }
/* A7-fix: .vv-gift__body carries max-width:46ch but no auto side-margins, so in the
   centered Note section the paragraph pinned left and read as off-center. */
.vv-gift__note .vv-gift__body { margin-inline: auto; }
.vv-gift__cards { list-style: none; display: flex; gap: clamp(14px, 3vw, 28px); justify-content: center; flex-wrap: wrap; margin-top: 24px; }
.vv-gift__cards li { font-family: var(--vv-font-ui); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--vv-brass); border: 1px solid var(--vv-border-gold); padding: 16px 24px; }

/* The Goods — three merch cards */
.vv-gift__goods { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 28px); }
.vv-gift__good-name { display: block; font-family: var(--vv-font-display); font-size: 1.2rem; color: var(--vv-bone); }
.vv-gift__shop-all { display: block; text-align: center; margin-top: clamp(24px, 3vw, 40px); }
@media (max-width: 720px) { .vv-gift__goods { grid-template-columns: 1fr; } }