/* ============ Reset ============ */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html, body { height: 100%; }
body { line-height: 1.6; -webkit-font-smoothing: antialiased; }
img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; color: inherit; background: transparent; border: none; outline: none; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
ul, ol { list-style: none; }
table { border-collapse: collapse; width: 100%; }

/* ============ Typography ============ */
.t-display { font-family: var(--font-serif); font-size: var(--fs-display); font-weight: 600; color: var(--ink-deep); letter-spacing: 0.5px; }
.t-h1 { font-family: var(--font-serif); font-size: var(--fs-h1); font-weight: 600; color: var(--ink-deep); letter-spacing: 0.5px; }
.t-h2 { font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 500; color: var(--ink-deep); }
.t-h3 { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 500; color: var(--ink-deep); }
.t-body { font-size: var(--fs-body); color: var(--ink-deep); }
.t-cap { font-size: var(--fs-caption); color: var(--ink-soft); }
.t-mini { font-size: var(--fs-mini); color: var(--ink-mute); letter-spacing: 0.5px; }
.t-price { font-family: var(--font-num); color: var(--accent-clay); font-feature-settings: "tnum"; font-weight: 500; }
.t-price-lg { font-family: var(--font-num); color: var(--accent-clay); font-size: var(--fs-price-lg); font-weight: 500; }
.t-num { font-feature-settings: "tnum"; }
.t-serif { font-family: var(--font-serif); }
.t-tomato { color: var(--accent-tomato); }
.t-moss { color: var(--brand-moss); }
.t-clay { color: var(--accent-clay); }
.t-soft { color: var(--ink-soft); }
.t-mute { color: var(--ink-mute); }

/* ============ Layout Helpers ============ */
.flex { display: flex; }
.flex-col { display: flex; flex-direction: column; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.flex-end { display: flex; align-items: center; justify-content: flex-end; }
.gap-1 { gap: var(--space-1); }
.gap-2 { gap: var(--space-2); }
.gap-3 { gap: var(--space-3); }
.gap-4 { gap: var(--space-4); }
.gap-5 { gap: var(--space-5); }
.gap-6 { gap: var(--space-6); }
.flex-1 { flex: 1; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.w-full { width: 100%; }
.relative { position: relative; }
.absolute { position: absolute; }

/* ============ Decorative ============ */
.deco-line { height: 1px; background: var(--line-faint); margin: var(--space-4) 0; }
.deco-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-tomato); display: inline-block; }
.deco-leaf { color: var(--brand-moss); font-size: 16px; }

/* ============ Animations ============ */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.fade-in { animation: fadeIn 0.4s ease both; }
.fade-up { animation: fadeUp 0.5s ease both; }