/* ============================================================ LAVILA PILATES — style.css V7 Design system. Mobile-first. WCAG AA compliant. ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Jost:wght@300;400;500&display=swap'); /* ── Design tokens ─────────────────────────────────────────── */ :root { --sage-dark: #77857D; --sage-mid: #8AA494; --mint: #9ED8B3; --sand: #CDB499; --stone: #E1DAD3; --pale-sage: #D0DED5; --cream: #F8F5EF; --off-white: #F4F2EC; --near-white: #ECEAE4; --text-dark: #2A2A26; --text-body: #3A3A34; --text-muted: #5A5A54; --text-light: #8A8A84; --border: #DDD9D2; --border-light:#E8E4DC; --font-display: 'Cormorant Garamond', Georgia, serif; --font-body: 'Jost', system-ui, -apple-system, sans-serif; --container: 1200px; --gutter: clamp(1.25rem, 5vw, 3rem); --section-py:clamp(4rem, 8vw, 7rem); --ease-out: cubic-bezier(0.22, 1, 0.36, 1); } /* ── Reset ─────────────────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; } body { background: var(--cream); color: var(--text-body); font-family: var(--font-body); font-size: 1rem; font-weight: 300; line-height: 1.75; -webkit-font-smoothing: antialiased; } img { display: block; max-width: 100%; } a { color: var(--sage-dark); text-underline-offset: 3px; } /* ── LANGUAGE VISIBILITY ──────────────────────────────────── Strategy: CSS hides everything by default. The inline