:root{--pink:#ee8aa6;--pinkbg:#fdf1f3;--lav:#f3edf8;--teal:#7ccfcf;--tealbg:#e8f6f5;--text:#4a4a4a;--card:#f9f7f6}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Quicksand,system-ui,sans-serif;color:var(--text);line-height:1.6;background:#fff}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}.narrow{max-width:620px}
h1,h2,h3,h4{margin:.3em 0;font-weight:600}
h2{color:var(--pink);text-align:center;font-size:2rem}.teal{color:var(--teal);text-align:left}
.lead{text-align:center;max-width:560px;margin:0 auto 32px}
.nav{position:sticky;top:0;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.06);z-index:10}
.navin{display:flex;justify-content:space-between;align-items:center;height:64px}
.navlogo{height:52px;display:block}nav{display:flex;gap:24px;align-items:center}
nav a{color:var(--text);text-decoration:none;font-weight:500}
.btn{display:inline-block;border:0;cursor:pointer;font:inherit;font-weight:600;text-decoration:none;border-radius:999px;padding:12px 28px}
.pill{background:var(--pink);color:#4a2a33!important;padding:8px 20px}
.grad{background:linear-gradient(90deg,#f19bb4,#d4a8dc);color:#fff;box-shadow:0 6px 16px rgba(238,138,166,.35)}
.outline{background:transparent;border:2px solid var(--teal);color:var(--teal)}.small{padding:8px 20px;font-size:.9rem}
.btn:hover{transform:translateY(-1px)}
.hero{position:relative;text-align:center;padding:24px 24px 56px;background:linear-gradient(#fdeef1,#fbf8f8);overflow:hidden}
.logobox{width:min(320px,80vw);margin:0 auto 24px;background:#fff;padding:16px}.logobox img{width:100%;display:block}
.hero h1{font-size:clamp(1.8rem,4vw,2.6rem)}.sub{font-size:1.15rem;margin:8px 0 28px}
.sp{position:absolute;color:#f0cf8a;font-size:1.4rem}.s1{left:7%;top:12%}.s2{right:15%;top:30%}.s3{left:17%;top:60%}.s4{right:10%;top:72%}
section{padding:64px 0}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:var(--card);border-radius:16px;padding:28px;text-align:center}
.step h3,.product h3{color:var(--pink);font-size:1.15rem}.ico{font-size:2.2rem}
.shop{background:#fff}.ph{aspect-ratio:4/3;border:2px dashed #e6c7d0;border-radius:12px;display:grid;place-items:center;color:#b48a96;background:var(--pinkbg);margin-bottom:12px}
.price{font-weight:700;color:var(--teal)}
.pearls{background:#fff}.pearls h4{font-size:1.1rem;margin-top:24px}
.pgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.pearl{border-radius:10px;padding:16px 10px;text-align:center;font-style:italic;font-size:.9rem;min-height:58px}
.pink{background:var(--pinkbg)}.lav{background:var(--lav)}
.about{background:var(--tealbg)}.aboutin{display:flex;gap:64px;align-items:center}
.avatar{flex:0 0 130px;height:130px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:3.2rem;box-shadow:0 8px 24px rgba(0,0,0,.08)}
dialog{border:0;border-radius:20px;max-width:520px;padding:32px}dialog::backdrop{background:rgba(80,60,70,.4)}
.order{background:var(--lav)}form.card{background:#fff;text-align:left;display:grid;gap:14px}
label{display:grid;gap:4px;font-weight:600}
input,select,textarea{font:inherit;padding:10px 12px;border:1.5px solid #e4d8e6;border-radius:10px;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pink);border-color:transparent}
.fine{font-size:.8rem;color:#888;margin:0}
footer{text-align:center;padding:32px;font-size:.9rem;background:#fff}.footlogo{height:70px}
@media(max-width:900px){.pgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.grid3{grid-template-columns:1fr}.pgrid{grid-template-columns:repeat(2,1fr)}
nav{gap:14px;font-size:.9rem}.navlogo{height:40px}.aboutin{flex-direction:column;gap:24px;text-align:center}.teal{text-align:center}section{padding:48px 0}}