:root { --ink:#211a18; --paper:#f6f0e7; --coral:#e46f55; --lavender:#afa0d5; --line:rgba(33,26,24,.18); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope, sans-serif; } main { max-width:1440px; margin:auto; overflow:hidden; }
.nav { display:flex; align-items:center; gap:34px; padding:27px 5.5vw; border-bottom:1px solid var(--line); } .logo { color:inherit; text-decoration:none; font-family:"Playfair Display", serif; font-size:25px; margin-right:auto; } .logo em { font-family:"Dancing Script", cursive; font-size:33px; font-style:normal; } .nav-link { color:inherit; font-size:12px; font-weight:700; text-decoration:none; text-transform:uppercase; letter-spacing:.1em; } .nav-button,.primary-button,.checkout { color:white; background:var(--ink); padding:13px 19px; text-decoration:none; font-size:12px; font-weight:800; letter-spacing:.05em; }
.hero { min-height:650px; display:grid; grid-template-columns:1.05fr .95fr; }.hero-copy { padding:11vw 4vw 7vw 5.5vw; }.eyebrow { margin:0 0 18px; font-size:10px; font-weight:800; letter-spacing:.16em; }.hero h1,.section-head h2,.offer h2 { margin:0; font-family:"Playfair Display",serif; font-size:clamp(48px,6vw,86px); line-height:.98; font-weight:700; letter-spacing:-.055em; }.hero h1 span { color:var(--coral); }.intro,.offer-copy { max-width:420px; font-size:16px; line-height:1.7; margin:30px 0; }.primary-button { display:inline-flex; gap:23px; align-items:center; }.primary-button span,.checkout span { font-size:20px; line-height:10px; }
.hero-art { position:relative; min-height:600px; background:#dfd2c6; overflow:hidden; }.art-script { position:absolute; top:13%; left:8%; z-index:2; font:700 clamp(66px,9vw,135px) "Dancing Script",cursive; color:#8e6055; transform:rotate(-8deg); }.art-serif { position:absolute; right:9%; top:34%; z-index:2; font:700 clamp(44px,6vw,80px)/.9 "Playfair Display",serif; text-align:right; }.art-sans { position:absolute; left:10%; bottom:14%; z-index:2; font-size:clamp(13px,1.5vw,19px); font-weight:800; letter-spacing:-.05em; }.orb { position:absolute; border-radius:50%; }.orb-one { width:390px; height:390px; right:-110px; top:-95px; background:var(--lavender); }.orb-two { width:260px; height:260px; bottom:-120px; left:-90px; background:var(--coral); }
.collection { padding:105px 5.5vw; border-top:1px solid var(--line); }.section-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:45px; }.section-head h2 { font-size:clamp(34px,4vw,56px); }.font-grid { display:grid; grid-template-columns:1fr 1fr 1fr; border:1px solid var(--line); }.font-card { min-height:345px; padding:25px; display:flex; flex-direction:column; border-right:1px solid var(--line); }.font-card:last-child { border:0; }.font-card p,.font-card span { font-size:10px; font-weight:800; letter-spacing:.12em; }.font-card h3 { margin:28px 0 15px; font-size:14px; }.font-card span { margin-top:auto; opacity:.65; }.sample { font-size:34px; line-height:1.12; letter-spacing:-.05em; }.dancing { background:#e5a79d; }.dancing .sample { font:700 54px/1 "Dancing Script",cursive; margin-top:35px; }.playfair { background:#c8bbdf; }.playfair .sample { font:700 43px/.95 "Playfair Display",serif; }.manrope .sample { font-weight:800; }
.offer { padding:100px 12vw; background:var(--ink); color:var(--paper); display:grid; grid-template-columns:1fr 390px; gap:10vw; align-items:center; }.offer h2 i { color:#e7a497; font-family:"Dancing Script",cursive; font-style:normal; letter-spacing:-.02em; }.offer-copy { color:#d9cdc3; }.price-card { position:relative; padding:42px; color:var(--ink); background:#f7ece1; }.badge { position:absolute; top:-17px; right:25px; width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:var(--coral); color:#fff; font-size:15px; font-weight:800; }.price-label { margin:0 0 22px; font-size:10px; font-weight:800; letter-spacing:.14em; }.old-price { margin:0; font:700 22px "Playfair Display",serif; text-decoration:line-through; opacity:.6; }.price { margin:0; font:700 60px/1 "Playfair Display",serif; letter-spacing:-.06em; }.price-note { font-size:11px; opacity:.6; }.checkout { display:flex; justify-content:space-between; margin:28px 0 15px; }.price-card small { font-size:10px; font-weight:700; } footer { max-width:1440px; margin:auto; display:flex; justify-content:space-between; padding:24px 5.5vw; font-size:10px; font-weight:800; letter-spacing:.13em; }
@media(max-width:700px) { .nav { padding:20px; gap:15px; }.nav-link { display:none; }.hero,.offer { grid-template-columns:1fr; }.hero-copy { padding:90px 25px 60px; }.hero-art { min-height:430px; }.collection { padding:75px 20px; }.section-head { display:block; }.section-head h2 { margin-top:20px; }.font-grid { grid-template-columns:1fr; }.font-card { min-height:250px; border-right:0; border-bottom:1px solid var(--line); }.offer { padding:75px 25px; gap:40px; }.price-card { padding:30px; }.price { font-size:52px; } footer { padding:20px; } footer span { display:none; } }