:root { --primary:#F4C7C9; --secondary:#E9B7B9; --background:#FFF8F7; --surface:#fff; --text:#4A3032; --muted:#8C6A6D; --accent:#C98286; --line:#f0dcdd; --shadow:0 10px 30px rgba(119,70,73,.09); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--text); background:var(--background); font-family: Georgia, 'Times New Roman', serif; } a { color:inherit; text-decoration:none; } button { font:inherit; }
.container { width:min(100% - 32px, 1080px); margin-inline:auto; } .topbar { height:76px; display:flex; align-items:center; justify-content:space-between; } .brand { display:inline-flex; align-items:center; gap:9px; font-size:15px; letter-spacing:.01em; } .brand em { color:var(--accent); font-weight:normal; } .brand-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--primary); color:var(--text); font-size:11px; font-weight:bold; letter-spacing:-1px; }.instagram-link { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--line); border-radius:50%; background:var(--surface); }.instagram-link svg,.instagram-icon svg { width:18px; fill:none; stroke:var(--accent); stroke-width:1.7; }
.hero { min-height:540px; display:grid; align-items:center; gap:24px; padding:35px 0 52px; overflow:hidden; }.eyebrow { margin:0 0 11px; color:var(--accent); text-transform:uppercase; letter-spacing:.13em; font-family:Arial,sans-serif; font-size:10px; font-weight:bold; }.hero h1 { margin:0; max-width:540px; font-size:clamp(42px,12vw,70px); line-height:.98; letter-spacing:-.05em; font-weight:normal; }.hero h1 span { color:var(--accent); font-style:italic; }.intro { max-width:390px; margin:19px 0 27px; color:var(--muted); font:15px/1.6 Arial,sans-serif; }.button { display:inline-flex; justify-content:center; align-items:center; min-height:54px; padding:0 23px; border-radius:50px; font:600 14px Arial,sans-serif; transition:transform .2s ease, box-shadow .2s ease; }.button:hover { transform:translateY(-2px); }.button-primary { gap:10px; color:#fff; background:var(--accent); box-shadow:0 8px 18px rgba(201,130,134,.28); }.button-primary svg { width:18px; fill:none; stroke:currentColor; stroke-width:1.5; }
.hero-art { position:relative; height:220px; }.art-glow { position:absolute; inset:20px 20px 0 8%; border-radius:48% 52% 48% 52%; background:#f8dfdc; transform:rotate(-5deg); }.hero-card { position:absolute; inset:33px 16% 9px 12%; display:flex; flex-direction:column; justify-content:center; align-items:center; border:7px solid rgba(255,255,255,.7); border-radius:80px 80px 18px 18px; color:var(--text); background:#f2c2c4; box-shadow:var(--shadow); transform:rotate(4deg); }.hero-card span { font-size:13px; letter-spacing:.2em; text-transform:uppercase; }.hero-card strong { color:#fff8f7; font-size:29px; font-style:italic; font-weight:normal; }.hero-card i { position:absolute; right:22px; bottom:15px; color:#a9656a; font-size:24px; }.flower { position:absolute; z-index:2; color:#c88285; }.flower-one { top:12px; right:14%; font-size:25px; }.flower-two { bottom:3px; left:4%; font-size:30px; }
.section { padding:58px 0; }.section-heading h2,.instagram-card h2,.whatsapp-section h2 { margin:0; font-size:clamp(28px,7vw,39px); line-height:1.08; font-weight:normal; letter-spacing:-.04em; }.category-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:11px; margin-top:25px; }.category-card { min-height:147px; padding:17px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 4px 14px rgba(119,70,73,.035); }.category-icon { display:grid; place-items:center; width:35px; height:35px; margin-bottom:22px; border-radius:50%; color:var(--accent); background:#fff1ef; font-size:19px; }.category-card strong,.category-card small { display:block; }.category-card strong { font-size:17px; font-weight:normal; }.category-card small { margin-top:4px; color:var(--muted); font:11px Arial,sans-serif; }
.featured { padding-top:36px; }.row-heading { display:flex; align-items:end; justify-content:space-between; }.swipe-hint { padding-bottom:3px; color:var(--muted); font:11px Arial,sans-serif; white-space:nowrap; }.product-scroll { display:flex; gap:15px; margin:25px calc(50% - 50vw) 0; padding:0 16px 8px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x mandatory; }.product-scroll::-webkit-scrollbar { display:none; }.product-card { flex:0 0 210px; scroll-snap-align:start; padding:10px 10px 15px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 5px 18px rgba(119,70,73,.045); }.product-visual { display:grid; place-items:center; height:190px; border-radius:12px; text-align:center; color:rgba(74,48,50,.55); text-transform:uppercase; letter-spacing:.12em; font:10px/1.5 Arial,sans-serif; }.blush { background:#f7dfe0; }.rose { background:#efd0d1; }.sand { background:#f3e5df; }.product-type { margin:14px 0 5px; color:var(--accent); text-transform:uppercase; letter-spacing:.12em; font:10px Arial,sans-serif; }.product-card h3 { min-height:42px; margin:0; font-size:17px; font-weight:normal; line-height:1.2; }.product-card button { width:100%; margin-top:13px; padding:0; border:0; color:var(--accent); background:none; text-align:left; cursor:pointer; font:600 12px Arial,sans-serif; }.product-card button span { float:right; font-size:17px; }
.benefits { padding-bottom:34px; }.benefit-list { margin-top:24px; border-top:1px solid var(--line); }.benefit-list article { display:flex; gap:15px; padding:17px 0; border-bottom:1px solid var(--line); }.benefit-list article > span { display:grid; flex:0 0 36px; place-items:center; height:36px; border-radius:50%; color:var(--accent); background:#fceceb; font-size:18px; }.benefit-list h3 { margin:1px 0 4px; font-size:16px; font-weight:normal; }.benefit-list p { margin:0; color:var(--muted); font:12px/1.4 Arial,sans-serif; }
.social-section { padding:34px 0 45px; }.instagram-card { position:relative; overflow:hidden; padding:32px 24px; border-radius:22px; background:#f5d5d3; }.instagram-card:after { content:'✿'; position:absolute; right:-15px; bottom:-45px; color:rgba(255,255,255,.38); font-size:180px; }.instagram-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:23px; border-radius:50%; background:rgba(255,255,255,.65); }.instagram-card h2 { max-width:420px; font-size:31px; }.instagram-card > p:not(.eyebrow) { max-width:385px; margin:13px 0 21px; color:var(--muted); font:13px/1.55 Arial,sans-serif; }.text-link { position:relative; z-index:1; font:600 14px Arial,sans-serif; }.text-link span { margin-left:5px; color:var(--accent); }
.whatsapp-section { display:grid; gap:23px; padding:38px 24px; border-radius:22px 22px 0 0; color:#fff8f7; background:var(--text); }.whatsapp-section .eyebrow { color:#f2bfc1; }.whatsapp-section h2 { font-size:30px; }.button-dark { align-self:start; color:var(--text); background:#fff8f7; }.button-dark span { margin-left:10px; color:var(--accent); font-size:18px; } footer { padding:26px 0 34px; color:#fff8f7; background:var(--text); } footer .container { display:flex; flex-direction:column; gap:17px; border-top:1px solid rgba(255,255,255,.15); padding-top:22px; } footer .brand-mark { color:var(--text); background:#f0babc; } footer p { margin:0; color:#d5b9b9; font:11px Arial,sans-serif; }
@media (min-width:720px) { .container { width:min(100% - 64px,1080px); }.hero { grid-template-columns:1.1fr .9fr; min-height:580px; }.hero-art { height:330px; }.category-grid { grid-template-columns:repeat(4,1fr); }.product-scroll { margin:25px 0 0; padding:0 0 8px; }.product-card { flex-basis:calc((100% - 30px)/3); }.benefit-list { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }.benefit-list article { border-bottom:0; }.whatsapp-section { grid-template-columns:1fr auto; align-items:center; border-radius:22px; }.whatsapp-section .button { margin-top:18px; } footer { margin-top:50px; } footer .container { flex-direction:row; align-items:center; justify-content:space-between; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { transition:none!important; } }
