.nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:68px;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font:500 1.05rem var(--sans);letter-spacing:.3em;text-transform:uppercase}
.brand img{height:30px;width:auto}
nav{display:flex;align-items:center;gap:1.6rem;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase}
nav a{text-decoration:none}nav a:not(.btn):hover{color:var(--pink-deep)}
@media(max-width:760px){nav a:not(.btn){display:none}.brand span{font-size:.85rem;letter-spacing:.22em}}

.hero{background:radial-gradient(900px 500px at 85% 20%,var(--pink-soft),transparent 70%),var(--blush);overflow:hidden}
.hero-in{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:2rem;padding-block:clamp(3rem,9vw,7rem)}
.hero h1{font-size:clamp(2.6rem,6.2vw,5rem);margin:.8rem 0 1.2rem}
.hero h1 em{color:var(--pink-deep)}
.lead{max-width:34rem;color:var(--muted);font-size:1.08rem;margin-bottom:2rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap}
.hero-art img{width:min(420px,100%);margin-inline:auto;filter:drop-shadow(0 30px 40px rgba(185,70,119,.18))}
@media(max-width:820px){.hero-in{grid-template-columns:1fr}.hero-art{display:none}}

.sec{padding-block:clamp(3.5rem,8vw,6.5rem)}
.sec.tint{background:var(--blush)}
.sec-head{text-align:center;margin-bottom:2.5rem}
.sec-head h2{font-size:clamp(2rem,4vw,3rem);margin-top:.5rem}

.filters{display:flex;gap:.8rem;justify-content:center;margin-bottom:2rem;flex-wrap:wrap}
.filters select{width:auto;min-width:170px;border-radius:999px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.6rem}
.empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:3rem 1rem;font-family:var(--serif);font-size:1.4rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.25s;cursor:pointer;text-align:left;font:inherit;color:inherit;padding:0}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card .ph{aspect-ratio:3/4;background:var(--blush);display:grid;place-items:center;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card .ph .noimg{width:40%;opacity:.35}
.card .info{padding:1rem 1.1rem 1.2rem;display:grid;gap:.25rem}
.card h3{font-size:1.45rem}
.card .meta{color:var(--muted);font-size:.85rem}
.card .price{margin-top:.4rem;font-weight:500}
.card .price small{color:var(--muted);font-weight:300}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem}
.steps span{font:italic 500 2.2rem var(--serif);color:var(--pink)}
.steps h3{font-size:1.6rem;margin:.2rem 0 .4rem}.steps p{color:var(--muted)}

.about{display:grid;grid-template-columns:auto 1fr;gap:3rem;align-items:center}
.about img{width:min(320px,70vw)}
.about h2{font-size:clamp(2rem,4vw,3rem);margin:.5rem 0 1rem}
.about p:not(.eyebrow){color:var(--muted);max-width:36rem}
@media(max-width:720px){.about{grid-template-columns:1fr;text-align:center}.about img{margin-inline:auto}}

footer{border-top:1px solid var(--line);padding-block:2rem}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;color:var(--muted);font-size:.85rem}
.foot img{height:22px;width:auto}

dialog{border:0;border-radius:20px;padding:0;width:min(900px,calc(100% - 24px));max-height:calc(100dvh - 24px);box-shadow:0 30px 80px rgba(0,0,0,.3);overflow:auto}
dialog::backdrop{background:rgba(17,17,17,.55);backdrop-filter:blur(3px)}
.x{position:absolute;right:12px;top:10px;z-index:2}.x button{border:0;background:#fff;width:36px;height:36px;border-radius:50%;font-size:1.4rem;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.15)}
.dlg-in{display:grid;grid-template-columns:.8fr 1.2fr}
.dlg-in>form,.dlg-in>#done{padding:2rem}
.dlg-pic{background:var(--blush);min-height:260px}.dlg-pic img{width:100%;height:100%;object-fit:cover}
.dlg-in h3{font-size:2.1rem;margin:.3rem 0}
.muted{color:var(--muted);margin-bottom:1.2rem}
.total{font:500 1.5rem var(--serif);margin:.2rem 0 1.2rem;color:var(--pink-deep)}
.taken{background:var(--pink-soft);color:var(--pink-deep);padding:.6rem .9rem;border-radius:10px;font-size:.85rem;margin-bottom:.8rem}
.err{color:var(--bad);margin-bottom:.8rem;font-size:.9rem}
.fine{font-size:.78rem;color:var(--muted);margin-top:.9rem}
#send{width:100%}
#done p{margin:1rem 0 1.5rem;color:var(--muted)}
@media(max-width:720px){.dlg-in{grid-template-columns:1fr}.dlg-pic{min-height:0;aspect-ratio:4/3}}