/* کلینیک لبخند — clean mint and deep teal with a coral pulse. El Messiri headlines, Vazirmatn text. */
:root{--bg:#F6FBFA;--mint:#E3F3F0;--mint2:#CBEAE4;--ink:#0B2B2A;--ink2:#47605E;--teal:#0F766E;--coral:#F07167;--line:#D3E6E2;--r:20px}
body{background:var(--bg);color:var(--ink);font:400 16px/1.9 "Vazirmatn",system-ui,sans-serif}
h1,h2,h3{font-family:"El Messiri","Vazirmatn",serif;line-height:1.35;margin:0}
a{color:var(--teal)}
.cbtn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.4rem;border-radius:14px;border:2px solid var(--teal);background:var(--teal);color:#fff;font-weight:800;text-decoration:none;transition:transform .15s,box-shadow .2s}
.cbtn:hover{box-shadow:0 10px 24px -10px rgb(15 118 110/.6)}
.cbtn:active{transform:translateY(1px)}
.cbtn--line{background:transparent;color:var(--teal)}

.ch{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:1.5rem;padding:.8rem max(1.2rem,calc(50% - 570px));background:rgb(246 251 250/.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ch__logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.ch__logo svg{width:34px;height:34px;fill:var(--teal)}
.ch__logo span{display:grid;font:700 1.15rem/1.2 "El Messiri",serif}
.ch__logo small{font:500 .72rem/1.4 "Vazirmatn",sans-serif;color:var(--ink2)}
.ch__nav{display:flex;gap:1.2rem;margin-inline-start:auto}
.ch__nav a{text-decoration:none;color:var(--ink2);font-weight:700;font-size:.95rem}
.ch__nav a:hover{color:var(--teal)}
.ch__call{padding:.5rem 1rem;border-radius:12px;background:var(--coral);color:#fff;font-weight:800;text-decoration:none}
@media (max-width:760px){.ch__nav{display:none}.ch__call{margin-inline-start:auto}}

main{max-width:1140px;margin:auto;padding:0 1.2rem}
.chero{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center;padding:3.5rem 0 2.5rem}
.chero__k{display:inline-block;margin:0;padding:.25rem .8rem;border-radius:999px;background:var(--mint);color:var(--teal);font-weight:800;font-size:.85rem}
.chero__k::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--coral);margin-inline-end:.5rem;animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.25}}
.chero h1{font-size:clamp(2.2rem,1.4rem + 3vw,3.6rem);margin:1rem 0;font-weight:700}
.chero__p{color:var(--ink2);font-size:1.1rem;max-width:34rem}
.chero__cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem}
.chero__facts{display:flex;gap:1.6rem;flex-wrap:wrap;margin:2rem 0 0}
.chero__facts dt{font:700 1.3rem/1.2 "El Messiri",serif;color:var(--teal)}
.chero__facts dd{margin:0;color:var(--ink2);font-size:.85rem}
.chero__art svg{width:100%}
.smile{stroke-dasharray:300;stroke-dashoffset:300;animation:draw 1.4s .3s cubic-bezier(.6,0,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.spark path{transform-origin:center;transform-box:fill-box;animation:tw 2.4s infinite}
.spark path:nth-child(2){animation-delay:-1.2s}
@keyframes tw{50%{transform:scale(.6) rotate(45deg);opacity:.5}}
@media (max-width:820px){.chero{grid-template-columns:1fr}.chero__art{max-width:340px;justify-self:center}}

.csec{padding:3rem 0}
.csec h2{font-size:clamp(1.8rem,1.4rem + 1.4vw,2.5rem)}
.csec__p{color:var(--ink2);margin:.3rem 0 1.4rem}
.svcs{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.svc{display:flex;flex-direction:column;gap:.5rem;padding:1.3rem;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.svc svg{width:40px;height:40px;padding:8px;border-radius:12px;background:var(--mint);fill:none;stroke:var(--teal);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.svc h3{font-size:1.25rem}
.svc p{margin:0;color:var(--ink2);font-size:.92rem;line-height:1.85}
.svc dl{display:flex;gap:1.5rem;margin:.3rem 0;font-size:.85rem}
.svc dt{color:var(--ink2)}.svc dd{margin:0;font-weight:800}
.svc a{margin-top:auto;font-weight:800;font-size:.9rem}
@media (max-width:900px){.svcs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.svcs{grid-template-columns:1fr}}

.docs{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.2rem}
.doc{padding:1.4rem;border-radius:var(--r);background:var(--mint);text-align:center;display:grid;justify-items:center;gap:.3rem}
.doc__av{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,var(--a),var(--b));color:#fff;font:700 1.4rem/1 "Vazirmatn",sans-serif;letter-spacing:.05em;font-style:normal}
.doc__av--sm{width:40px;height:40px;font-size:.8rem}
.doc h3{font-size:1.2rem;margin-top:.4rem}
.doc p{margin:0;color:var(--ink2);font-size:.9rem}
.doc ul{list-style:none;padding:0;margin:.5rem 0 0;display:flex;flex-wrap:wrap;gap:.3rem;justify-content:center}
.doc li{font-size:.75rem;padding:.1rem .6rem;border-radius:999px;background:#fff;color:var(--teal);font-weight:700}
@media (max-width:820px){.docs{grid-template-columns:1fr}}

/* booking */
.book{background:#fff;border:1px solid var(--line);border-radius:28px;padding:2rem;margin:2rem 0;box-shadow:0 30px 60px -40px rgb(11 43 42/.4)}
.bsteps{list-style:none;display:flex;gap:.3rem;padding:0;margin:0 0 1.4rem}
.bsteps li{flex:1;display:flex;gap:.35rem;align-items:center;white-space:nowrap;font-size:.8rem;font-weight:800;color:var(--ink2);padding-top:.6rem;border-top:4px solid var(--mint2)}
.bsteps b{display:grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--mint)}
.bsteps li.on b,.bsteps li.done b{background:var(--teal);color:#fff}
.bsteps li.on{color:var(--teal);border-color:var(--teal)}
.bsteps li.done{border-color:var(--teal)}
.bk__s{border:0;margin:0;padding:0;min-width:0}
.bk__s legend{font:700 1.3rem/1.4 "El Messiri",serif;margin-bottom:.8rem}
.bk__s legend small{font:500 .8rem "Vazirmatn",sans-serif;color:var(--ink2)}
.opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.6rem}
.opt{position:relative;cursor:pointer}
.opt[hidden]{display:none}
.opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.opt span{display:grid;grid-template-columns:auto 1fr;column-gap:.6rem;align-items:center;height:100%;padding:.85rem 1rem;border-radius:16px;border:2px solid var(--line);transition:border-color .15s,background .15s}
.opt span b{grid-column:-2/-1}.opt span small{grid-column:-2/-1;color:var(--ink2)}
.opt span i{grid-row:span 2}
.opt input:checked+span{border-color:var(--teal);background:var(--mint)}
.opt input:focus-visible+span{outline:3px solid var(--coral);outline-offset:2px}
.cal{max-width:520px}
.cal__wd,.cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem;text-align:center}
.cal__wd span{font-size:.8rem;font-weight:800;color:var(--ink2)}
.day{position:relative;aspect-ratio:1;border-radius:14px;border:0;background:var(--mint);font-weight:800;color:var(--ink);display:grid;place-items:center;line-height:1.1}
.day small{display:block;font-size:.62rem;font-weight:600;color:var(--ink2)}
.day:disabled{background:transparent;color:#B7C9C6;cursor:not-allowed}
.day[aria-checked="true"]{background:var(--teal);color:#fff}
.day[aria-checked="true"] small{color:#CFF}
.day.is-empty{visibility:hidden}
.slots{display:flex;flex-wrap:wrap;gap:.4rem}
.slot{padding:.55rem .9rem;border-radius:12px;border:2px solid var(--line);background:#fff;font-weight:800}
.slot[aria-checked="true"]{border-color:var(--teal);background:var(--teal);color:#fff}
.slot:disabled{opacity:.35;text-decoration:line-through}
.bk__sum{padding:1rem;border-radius:16px;background:var(--mint);margin-bottom:1rem;line-height:2.1}
.bk__row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.fld{display:grid;gap:.2rem;font-size:.85rem;color:var(--ink2);font-weight:700}
.fld input{padding:.7rem .9rem;border-radius:12px;border:2px solid var(--line);font-size:1rem;color:var(--ink);background:#fff}
.fld input:focus{outline:0;border-color:var(--teal)}
.ck{display:flex;gap:.5rem;align-items:center;margin-top:.8rem;color:var(--ink2)}
.bk__nav{display:flex;justify-content:space-between;margin-top:1.5rem}
.bk__nav [data-next]{margin-inline-start:auto}
.bk__err{color:#B42318;font-weight:700;min-height:1.5em;margin:.5rem 0 0}
.done{text-align:center;display:grid;justify-items:center;gap:.6rem;padding:1rem}
.done svg{width:64px;height:64px;padding:14px;border-radius:50%;background:var(--teal);fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{from{transform:scale(.3)}}
.done h3{font-size:1.8rem}.done p{margin:0;color:var(--ink2)}.done small{color:var(--ink2)}
@media (max-width:640px){.book{padding:1.2rem}.bk__row{grid-template-columns:1fr}.bsteps li:not(.on){font-size:0}.bsteps li:not(.on) b{font-size:.8rem}}

/* before / after */
.ba{display:grid;grid-template-columns:.7fr 1.3fr;gap:2rem;align-items:center}
.baw{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:2;user-select:none}
.baw__img{position:absolute;inset:0;width:100%;height:100%}
.baw__after{clip-path:inset(0 0 0 var(--x))}
[dir="rtl"] .baw__after{clip-path:inset(0 var(--x) 0 0)}
.baw input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.baw__h{position:absolute;top:0;bottom:0;right:var(--x);width:3px;background:#fff;pointer-events:none;box-shadow:0 0 0 1px rgb(0 0 0/.08)}
.baw__h::after{content:"⇆";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--teal);font-weight:800;box-shadow:0 6px 16px rgb(0 0 0/.2)}
.baw__lbl{position:absolute;top:.8rem;padding:.2rem .7rem;border-radius:999px;background:rgb(0 0 0/.55);color:#fff;font-weight:800;font-size:.8rem}
.baw__lbl--b{right:.8rem}.baw__lbl--a{left:.8rem}
@media (max-width:820px){.ba{grid-template-columns:1fr}}

.faq{display:grid;gap:.5rem;max-width:760px}
.faq details{border-radius:16px;background:#fff;border:1px solid var(--line);padding:.9rem 1.1rem}
.faq summary{cursor:pointer;font-weight:800}
.faq p{margin:.5rem 0 0;color:var(--ink2)}
.cf{text-align:center;padding:2rem 1rem 6rem;color:var(--ink2);border-top:1px solid var(--line);font-size:.9rem}
.cf p{margin:.2rem 0}