@import url('https://api.fontshare.com/v2/css?f[]=switzer@300,400,500,600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: none; text-size-adjust: none; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; scroll-behavior: smooth; scroll-padding-top: var(--space-20); }
body { min-height: 100dvh; line-height: 1.65; font-family: var(--font-body); font-size: var(--text-base); color: var(--color-text); background-color: var(--color-bg); }
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
ul[role='list'], ol[role='list'] { list-style: none; }
input, button, textarea, select { font: inherit; color: inherit; }
h1, h2, h3, h4, h5, h6 { text-wrap: balance; line-height: 1.15; font-family: var(--font-display); font-weight: 400; }
p, li, figcaption { text-wrap: pretty; max-width: 68ch; }
a { color: inherit; text-decoration: none; }
::selection { background: color-mix(in oklab, var(--color-primary) 25%, transparent); color: var(--color-text); }
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; border-radius: var(--radius-sm); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }
button { cursor: pointer; background: none; border: none; }
a, button, [role='button'], input, textarea, select { transition: color var(--transition-interactive), background var(--transition-interactive), border-color var(--transition-interactive), box-shadow var(--transition-interactive), opacity var(--transition-interactive); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
.container { width: 100%; max-width: var(--content-wide); margin-inline: auto; padding-inline: clamp(var(--space-6), 5vw, var(--space-16)); }
.container--narrow { max-width: var(--content-default); }
.section { padding-block: clamp(var(--space-12), 8vw, var(--space-32)); }
.btn { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-8); font-family: var(--font-body); font-size: var(--text-sm); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; border-radius: var(--radius-full); cursor: pointer; white-space: nowrap; }
.btn-primary { background: var(--color-primary); color: var(--color-text-inverse); border: 1.5px solid var(--color-primary); }
.btn-primary:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); }
.btn-outline { background: transparent; color: var(--color-primary); border: 1.5px solid var(--color-primary); }
.btn-outline:hover { background: var(--color-primary-highlight); }
.btn-ghost { background: transparent; color: var(--color-text); border: 1.5px solid var(--color-border); }
.btn-ghost:hover { border-color: var(--color-text-muted); }
.divider-ornament { display: flex; align-items: center; gap: var(--space-4); color: var(--color-gold); margin-block: var(--space-8); }
.divider-ornament::before, .divider-ornament::after { content: ''; flex: 1; height: 1px; background: var(--color-gold); opacity: 0.4; }
.tag { display: inline-block; padding: var(--space-1) var(--space-3); font-size: var(--text-xs); font-family: var(--font-body); font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-primary); background: var(--color-primary-highlight); border-radius: var(--radius-full); }
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: var(--shadow-sm); transition: box-shadow var(--transition-interactive), transform var(--transition-interactive); }
.card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
