/* ════════════════════════════════════════════════════════════ LA VIE RENTAL STUDIO — CUSTOM CSS ════════════════════════════════════════════════════════════ How to use in Squarespace: 1. Copy the entire contents of this file 2. Go to: Squarespace → Design → Custom CSS 3. Paste at the bottom of any existing CSS All styles are scoped to .lv-rental so they won't conflict with Squarespace's own styles. Wrap every section's HTML in
...
. ════════════════════════════════════════════════════════════ */ /* ───── FONTS ───── */ @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500;1,600&family=Great+Vibes&family=Pinyon+Script&family=Montserrat:wght@300;400;500;600;700&display=swap'); /* ───── COLOR TOKENS & CONTAINER ───── */ .lv-rental { --gold:#b8860b; --gold-light:#d4a843; --gold-dark:#8b6914; --cream:#2d1f2b; --text-light:#4a3548; --text-muted:#7a6078; --pink-bg:#fff0f3; --pink-light:#fff5f7; --card-bg:rgba(255,255,255,.55); --card-border:rgba(184,134,11,.2); position:relative; font-family:'Cormorant Garamond', serif; color:var(--cream); background:var(--pink-bg); overflow:hidden; } /* Scoped reset — only affects elements inside .lv-rental */ .lv-rental, .lv-rental *, .lv-rental *::before, .lv-rental *::after { box-sizing:border-box; } .lv-rental * { margin:0; padding:0; } .lv-rental img { display:block; max-width:100%; height:auto; } .lv-rental a { text-decoration:none; color:var(--gold); transition:color .3s; } /* Section IDs get scroll offset so the fixed nav doesn't cover them. Bump this higher if your fixed nav + Squarespace header combined is taller. */ .lv-rental section[id]{ scroll-margin-top:160px; } /* ════════════════════════════════════════════════════════════ FIXED TOP NAV (sticks at top of viewport across all sections) Paste the