:root{--slate:#5f7590;--slate-d:#455a73;--rose:#c9737f;--blush:#fbe9ea;--cream:#fffaf3;--ink:#2b3442;--mut:#566172;--line:#eedadd;--wa:#1b7f45;--rose-d:#a4505f;--r:18px}
@media (prefers-color-scheme:dark){:root{--cream:#fffaf3}}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{overflow-x:clip;font-family:'Cairo',system-ui,sans-serif;background:var(--cream);color:var(--ink);line-height:1.7;padding-bottom:env(safe-area-inset-bottom)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}.narrow{max-width:880px}
.hdr{position:sticky;top:0;z-index:30;background:rgba(255,250,243,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:8px;padding-bottom:8px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{border-radius:50%;object-fit:cover;border:1px solid var(--line);background:#fff}
.brand b{display:block;color:var(--slate-d);font-size:1.15rem;line-height:1.1}
.brand small{font-size:.6rem;letter-spacing:.14em;color:var(--mut)}
.nav{display:none;gap:22px;font-weight:600;color:var(--slate)}
.nav a:hover{color:var(--rose)}
@media(min-width:800px){.nav{display:flex}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--slate);color:#fff;font:700 1rem 'Cairo';padding:12px 24px;border:0;border-radius:999px;cursor:pointer;transition:.2s}
.btn:hover{background:var(--slate-d);transform:translateY(-2px)}
.btn-sm{padding:8px 16px;font-size:.85rem}
.btn-ghost{background:#fff;color:var(--slate-d);border:1px solid var(--line)}
.btn-ghost:hover{background:var(--blush)}
.btn-wa{background:var(--wa);width:100%}.btn-wa:hover{background:#146536}
.chip{display:inline-block;background:var(--blush);color:var(--rose-d);font-weight:700;font-size:.8rem;padding:4px 14px;border-radius:999px}
.hero{background:linear-gradient(180deg,var(--blush),var(--cream));padding:28px 0 40px}
.hero-in{display:grid;gap:28px;align-items:center}
@media(min-width:900px){.hero-in{grid-template-columns:1fr 1fr}}
.hero-txt{text-align:center}
@media(min-width:900px){.hero-txt{text-align:right}}
.hero h1{font-size:clamp(1.9rem,5vw,3rem);line-height:1.3;color:var(--slate-d);margin:10px 0}
.hero h1 em{font-style:normal;color:var(--rose-d)}
.hero p{color:var(--mut);max-width:520px;margin:0 auto 18px}
@media(min-width:900px){.hero p{margin:0 0 18px}}
.cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
@media(min-width:900px){.cta{justify-content:flex-start}}
.trust{list-style:none;display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:16px;font-size:.85rem;color:var(--slate)}
@media(min-width:900px){.trust{justify-content:flex-start}}
.trust i{color:var(--rose)}
.slider{position:relative;aspect-ratio:4/5;max-height:520px;width:100%;border-radius:28px;overflow:hidden;border:5px solid #fff;box-shadow:0 20px 40px -18px rgba(69,90,115,.45);background:var(--blush)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .7s}
.slide.on{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover}
.slide span{position:absolute;bottom:0;inset-inline:0;padding:40px 16px 16px;color:#fff;font-weight:700;background:linear-gradient(transparent,rgba(30,40,55,.7))}
.arr{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.9);color:var(--slate-d);cursor:pointer;z-index:2}
.prev{right:10px}.next{left:10px}
.dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:2}
.dots i{width:8px;height:8px;border-radius:9px;background:rgba(255,255,255,.6);cursor:pointer;transition:.3s}
.dots i.on{width:22px;background:var(--rose)}
.sec{padding:48px 0}.alt{background:#fff;border-block:1px solid var(--line)}
.sec h2{text-align:center;font-size:1.7rem;color:var(--slate-d)}
.sub{text-align:center;color:var(--mut);margin-bottom:24px}
.cats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:800px){.cats{grid-template-columns:repeat(5,1fr)}}
.cat{background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:8px;text-align:center;cursor:pointer;font:inherit;transition:.25s}
.cat:hover{transform:translateY(-4px);box-shadow:0 12px 22px -12px rgba(201,115,127,.5)}
.cat img{aspect-ratio:1;object-fit:cover;border-radius:12px;width:100%}
.cat b{display:block;margin-top:6px;color:var(--slate-d);font-size:.95rem}
.tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:22px}
.tab{font:600 .85rem 'Cairo';padding:6px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--slate);cursor:pointer}
.tab.on,.tab:hover{background:var(--slate);color:#fff;border-color:var(--slate)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:700px){.grid{grid-template-columns:repeat(3,1fr);gap:16px}}
@media(min-width:1000px){.grid{grid-template-columns:repeat(4,1fr)}}
.item{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;text-align:right;font:inherit;padding:0;transition:.25s}
.item:hover{transform:translateY(-4px);box-shadow:0 14px 24px -14px rgba(69,90,115,.5)}
.item img{aspect-ratio:1;object-fit:cover;width:100%;transition:transform .4s}
.item:hover img{transform:scale(1.06)}
.item div{padding:8px 10px}.item small{color:var(--rose-d);font-weight:700;font-size:.7rem}
.item .t{font-size:.82rem;line-height:1.4;color:var(--ink);font-weight:600}
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:24px 0}
@media(min-width:800px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps div{background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:16px;text-align:center}
.steps i{font-size:1.5rem;color:var(--rose);margin-bottom:6px}
.steps b{display:block;color:var(--slate-d)}.steps p{font-size:.82rem;color:var(--mut)}
.policy{background:var(--blush);border-radius:var(--r);padding:18px 22px}
.policy h3{color:var(--slate-d);margin-bottom:6px}
.policy ul{padding-inline-start:20px;color:var(--ink);font-size:.92rem}
.order{display:grid;gap:18px}
@media(min-width:800px){.order{grid-template-columns:1.4fr 1fr;align-items:start}}
form{background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px;display:grid;gap:12px;box-shadow:0 12px 30px -20px rgba(69,90,115,.5)}
label{font-weight:700;font-size:.85rem;color:var(--slate-d);display:grid;gap:4px}
input,select,textarea{font:400 .95rem 'Cairo';padding:10px 12px;border:1px solid #e3e6ea;border-radius:12px;background:#fafbfc;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid #f0c6cb;border-color:var(--rose);background:#fff}
.row2{display:grid;gap:12px}
@media(min-width:520px){.row2{grid-template-columns:1fr 1fr}}
.hp{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;clip-path:inset(50%);overflow:hidden}
.preview{background:#fff;border:2px dashed var(--line);border-radius:24px;padding:16px;text-align:center;position:sticky;top:84px}
.preview small{color:var(--rose-d);font-weight:700}
.pv{margin:12px 0;padding:22px 12px;border-radius:16px;background:linear-gradient(135deg,var(--blush),#fff);border:1px solid var(--line)}
.pv i{color:var(--rose)}.pv .k{color:var(--slate-d);font-size:.9rem;font-weight:700}
.pv p{font-size:1.4rem;font-weight:800;color:var(--slate-d);word-break:break-word}
.pv span{color:var(--mut);font-size:.85rem}
.note{font-size:.75rem;color:var(--mut)}
.ftr{background:#fff;border-top:1px solid var(--line);padding:30px 0 90px;text-align:center;color:var(--mut)}
.ftr img{margin:0 auto 6px;border-radius:50%;object-fit:cover}
.ftr b{color:var(--slate-d);display:block}
.social{display:flex;gap:10px;justify-content:center;margin:14px 0}
.social a{width:40px;height:40px;border-radius:50%;background:var(--blush);color:var(--slate);display:flex;align-items:center;justify-content:center;transition:.2s}
.social a:hover{background:var(--slate);color:#fff}
.social a[hidden]{display:none}
.fab{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom));left:18px;z-index:40;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.7rem;box-shadow:0 10px 22px rgba(37,165,90,.4)}
dialog{border:0;border-radius:24px;padding:0;max-width:min(440px,92vw);width:100%;overflow:hidden;margin:auto}
dialog::backdrop{background:rgba(30,40,55,.6);backdrop-filter:blur(4px)}
dialog img{width:100%;max-height:60vh;object-fit:cover}
.qv-b{padding:16px;display:grid;gap:8px;justify-items:start}
.qv-b h3{color:var(--slate-d)}.qv-b p{color:var(--mut);font-size:.9rem}
.x{position:absolute;top:10px;left:10px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.9);font-size:1.4rem;cursor:pointer;z-index:2}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.hint{color:var(--mut);font-size:.78rem;display:block}
.imgpv{max-height:140px;width:auto;border-radius:12px;border:1px solid var(--line);margin-top:6px}
input[type=file]{padding:8px;background:#fff}
:focus-visible{outline:3px solid var(--slate);outline-offset:2px}
.btn:disabled{opacity:.6;cursor:wait}
[hidden]{display:none!important}
