/* Mirvari Dental — iki səhifəli klinika saytı. Ağ fon, dərin yaşıl‑firuzəyi vurğu, Commissioner (Manrope-da "Ə" yoxdur). Təmiz, sakit, etibarlı. */
:root{
  --fon:#FFFFFF; --boz:#F2F6F5; --ink:#0F2A2E; --ink2:#46605F; --ink3:#6A807E; --xett:#DCE6E4;
  --yasil:#0F6E68; --yasilT:#0B5550; --yasilAcik:#E0F1EE; --mirvari:#F3EFE6; --tund:#0F2A2E; --tundInk:#B9CCC9;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:120px; -webkit-text-size-adjust:100%}
body{margin:0; background:var(--fon); color:var(--ink); font:16px/1.6 'Commissioner', system-ui, sans-serif; -webkit-font-smoothing:antialiased}
img{display:block; max-width:100%}
h1,h2,h3,p,figure{margin:0}
.ik{flex:none}
:focus-visible{outline:2px solid var(--yasil); outline-offset:3px}
.mKap{max-width:1200px; margin:0 auto; padding:0 20px}
@media(min-width:768px){.mKap{padding:0 40px}}

/* Düymələr */
.mBtn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:50px; padding:0 24px; border-radius:12px;
  background:var(--yasil); color:#fff; border:1.5px solid var(--yasil); font:700 15.5px/1 'Commissioner', sans-serif; text-decoration:none; cursor:pointer;
  transition:background-color .15s, color .15s, border-color .15s}
.mBtn:hover{background:var(--yasilT); border-color:var(--yasilT)}
.mBtnX{background:#fff; color:var(--ink); border-color:var(--xett)}
.mBtnX:hover{background:#fff; border-color:var(--ink)}
.mBtnSm{min-height:42px; padding:0 18px; font-size:14.5px}
.mBtnTam{width:100%}
.mBtnAg{background:#fff; color:var(--ink); border-color:#fff}
.mBtnAg:hover{background:var(--mirvari); border-color:var(--mirvari)}
.mLink{display:inline-flex; align-items:center; gap:6px; color:var(--yasil); font-weight:700; text-decoration:none}
.mLink:hover{text-decoration:underline; text-underline-offset:4px}
.mSoluk{color:var(--ink3); font-size:14.5px}

/* Üst zolaq və başlıq */
.mUstZolaq{display:none; background:var(--boz); border-bottom:1px solid var(--xett); font-size:13.5px; color:var(--ink2)}
.mUZIc{display:flex; align-items:center; gap:28px; height:40px}
.mUZIc span{display:inline-flex; align-items:center; gap:7px}
.mUZIc .ik{color:var(--yasil)}
.mUZIc .mDil{margin-left:auto}
.mDil{color:var(--ink2); font-weight:600; text-decoration:none}
.mDil:hover{color:var(--yasil)}
.mUst{position:sticky; top:0; z-index:40; background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--xett)}
.mUstIc{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 20px; padding-top:12px}
.mLogo{display:inline-flex; align-items:center; gap:10px; color:var(--yasil); text-decoration:none}
.mLogo span{font-size:21px; font-weight:800; letter-spacing:-.02em; color:var(--ink)}
.mLogo small{margin-left:5px; font-size:16px; font-weight:500; color:var(--ink3)}
/* telefonda menyu başlığın altında üfüqi sətirdir */
.mNav{order:3; width:100%; display:flex; gap:22px; margin:0 -20px; padding:0 20px 12px; overflow-x:auto; font-size:14.5px; font-weight:600; scrollbar-width:none}
.mNav::-webkit-scrollbar{display:none}
.mNav a{color:var(--ink2); text-decoration:none}
.mNav a:hover,.mNav a[aria-current]{color:var(--yasil)}
.mUstSag{display:flex; align-items:center; gap:14px}
@media(max-width:400px){.mUstSag .mBtnSm{padding:0 14px; font-size:14px}}
@media(min-width:960px){
  .mUstZolaq{display:block}
  .mUstIc{flex-wrap:nowrap; height:68px; padding-top:0}
  .mNav{order:0; width:auto; margin:0; padding:0; gap:30px; font-size:15px; overflow:visible}
  .mDilMobil{display:none}
}

/* Hero */
.mHero{padding:28px 0 0}
.mHeroIc{display:grid; gap:28px; align-items:center}
.mNisan{display:inline-flex; align-items:center; gap:8px; padding:7px 14px 7px 10px; border-radius:999px; background:var(--yasilAcik); color:var(--yasilT);
  font-size:14px; font-weight:700}
.mHero h1{margin-top:18px; font-size:clamp(2.3rem, 7.4vw, 3.9rem); font-weight:800; line-height:1.06; letter-spacing:-.035em}
.mHeroAlt{margin-top:18px; max-width:520px; font-size:17.5px; color:var(--ink2)}
.mDuymeler{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px}
.mHeroFoto{order:-1; aspect-ratio:16/10; border-radius:22px; overflow:hidden; background:var(--boz)}
.mHeroFoto img{width:100%; height:100%; object-fit:cover}
.mFakt{list-style:none; margin:36px 0 0; padding:22px 0; display:grid; gap:16px; border-top:1px solid var(--xett)}
.mFakt li{display:grid; gap:2px}
.mFakt b{font-size:17px; font-weight:800}
.mFakt span{font-size:14.5px; color:var(--ink3)}
@media(min-width:720px){.mFakt{grid-template-columns:repeat(3, 1fr)}}
@media(min-width:960px){
  .mHero{padding:56px 0 0}
  .mHeroIc{grid-template-columns:1.05fr 1fr; gap:56px}
  .mHeroFoto{order:0; aspect-ratio:6/5}
  .mFakt{margin-top:48px}
}

/* Bölmələr */
.mBolme{padding:64px 0}
@media(min-width:960px){.mBolme{padding:96px 0}}
.mBoz{background:var(--boz)}
.mBas{max-width:640px; margin-bottom:32px}
.mBasSira{max-width:none; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 40px}
.mBasSira > div{max-width:640px}
.mBolme h2{font-size:clamp(1.9rem, 4.6vw, 2.7rem); font-weight:800; letter-spacing:-.03em; line-height:1.1}
.mBas p{margin-top:12px; color:var(--ink2); font-size:16.5px}

/* Xidmətlər */
.mXidmetler{list-style:none; margin:0; padding:0; display:grid; gap:16px}
@media(min-width:640px){.mXidmetler{grid-template-columns:repeat(2, 1fr)}}
@media(min-width:1024px){.mXidmetler{grid-template-columns:repeat(3, 1fr); gap:20px}}
.mXidmetler a{display:flex; flex-direction:column; height:100%; border-radius:18px; overflow:hidden; background:#fff; border:1px solid var(--xett);
  color:inherit; text-decoration:none; transition:border-color .15s, transform .2s}
.mXidmetler a:hover{border-color:var(--yasil); transform:translateY(-3px)}
.mXidmetler img{width:100%; aspect-ratio:16/10; object-fit:cover; background:var(--boz)}
.mXIc{display:flex; flex-direction:column; gap:6px; padding:18px 20px 20px; flex:1}
.mXIc b{font-size:18.5px; font-weight:800; letter-spacing:-.01em}
.mXIc span{color:var(--ink2); font-size:15px}
.mXIc em{margin-top:auto; padding-top:8px; font-style:normal; font-weight:800; color:var(--yasil)}

/* Niyə */
.mNiye{display:grid; gap:32px; align-items:center}
@media(min-width:960px){.mNiye{grid-template-columns:1fr 1fr; gap:72px}}
.mNiyeFoto{aspect-ratio:1; border-radius:22px; overflow:hidden; background:var(--boz)}
.mNiyeFoto img{width:100%; height:100%; object-fit:cover}
.mNiyeList{list-style:none; margin:24px 0 0; padding:0; display:grid}
.mNiyeList li{padding:20px 0; border-top:1px solid var(--xett)}
.mNiyeList h3{font-size:18px; font-weight:800}
.mNiyeList p{margin-top:6px; color:var(--ink2); font-size:15.5px}

/* Həkimlər */
.mHekimler{list-style:none; margin:0; padding:0; display:grid; gap:24px}
@media(min-width:640px){.mHekimler{grid-template-columns:repeat(3, 1fr)}}
.mHekimler li{display:grid; gap:2px}
.mHekimler img{width:100%; aspect-ratio:6/7; object-fit:cover; object-position:top; border-radius:18px; background:#E6EEEC; margin-bottom:14px}
.mHekimler b{font-size:18px; font-weight:800}
.mHekimler span{color:var(--ink2); font-size:15px}
.mHekimler small{color:var(--yasil); font-size:14px; font-weight:700}

/* Qəbul forması */
.mQebul{display:grid; gap:32px}
@media(min-width:960px){.mQebul{grid-template-columns:.9fr 1.1fr; gap:72px; align-items:start}}
.mQebulMetn > p:not(.mSoluk){margin-top:12px; color:var(--ink2); font-size:16.5px; max-width:440px}
.mQebulD{display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 14px}
.mForma{display:grid; gap:14px; padding:24px; border-radius:20px; background:var(--boz); border:1px solid var(--xett)}
.mForma label{display:grid; gap:6px}
.mForma label span{font-size:14px; font-weight:700; color:var(--ink2)}
.mForma input,.mForma select{width:100%; min-height:50px; padding:0 14px; border-radius:12px; border:1.5px solid var(--xett); background:#fff;
  font:inherit; font-size:16px; color:var(--ink); -webkit-appearance:none; appearance:none}
.mForma select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%2346605F' stroke-width='2'/%3E%3C/svg%3E") right 12px center/18px no-repeat; padding-right:40px}
.mForma input:focus,.mForma select:focus{outline:none; border-color:var(--yasil)}
.mIki{display:grid; gap:14px}
@media(min-width:560px){.mIki{grid-template-columns:1fr 1fr}}
.mGizli{font-size:13px; color:var(--ink3); text-align:center}

/* Rəylər */
.mReyler{display:grid; gap:16px}
@media(min-width:900px){.mReyler{grid-template-columns:repeat(3, 1fr); gap:20px}}
.mReyler figure{padding:24px; border-radius:18px; background:#fff; border:1px solid var(--xett)}
.mReyler blockquote{margin:0; font-size:16.5px; line-height:1.55}
.mReyler figcaption{margin-top:14px; font-weight:700; color:var(--ink3); font-size:14.5px}

/* Suallar */
.mFaqIc{display:grid; gap:24px}
@media(min-width:960px){.mFaqIc{grid-template-columns:1fr 2fr; gap:72px}}
.mFaq{border-top:1px solid var(--xett)}
.mFaq details{border-bottom:1px solid var(--xett)}
.mFaq summary{list-style:none; display:flex; justify-content:space-between; gap:16px; padding:20px 0; font-weight:700; font-size:17px; cursor:pointer}
.mFaq summary::-webkit-details-marker{display:none}
.mFaq summary::after{content:'+'; flex:none; font-size:22px; line-height:1; color:var(--yasil)}
.mFaq details[open] summary::after{content:'−'}
.mFaq p{padding:0 0 20px; color:var(--ink2)}

/* Qiymətlər səhifəsi */
.mQiymetSeh{padding-top:48px}
.mQiymetSeh h1{font-size:clamp(2.3rem, 6vw, 3.4rem); font-weight:800; letter-spacing:-.035em}
.mCedveller{display:grid; gap:20px}
@media(min-width:960px){.mCedveller{grid-template-columns:1fr 1fr; gap:24px}}
.mCedvel{padding:22px 24px 8px; border-radius:18px; border:1px solid var(--xett)}
.mCedvel h2{font-size:20px; letter-spacing:-.01em; margin-bottom:8px}
.mCedvel table{width:100%; border-collapse:collapse; font-size:15.5px}
.mCedvel th{text-align:left; font-weight:500; color:var(--ink2); padding:12px 12px 12px 0}
.mCedvel td{text-align:right; font-weight:800; white-space:nowrap; padding:12px 0}
.mCedvel tr + tr th,.mCedvel tr + tr td{border-top:1px solid var(--xett)}
.mQiymetCta{margin-top:32px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding:24px; border-radius:18px; background:var(--yasilAcik)}
.mQiymetCta p{font-weight:700; font-size:17px; max-width:560px}

/* Əlaqə (tünd) */
.mTund{background:var(--tund); color:#fff}
.mTund p{color:var(--tundInk)}
.mTund .mLink{color:#fff}
.mElaqe{display:grid; gap:28px}
@media(min-width:960px){.mElaqe{grid-template-columns:1fr 1fr; align-items:end}}
.mUnvan{margin-top:14px; font-size:19px; color:#fff!important}
.mElaqeD{display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px; margin-top:20px}
.mAlt{padding:22px 0 26px; background:var(--tund); border-top:1px solid rgba(255,255,255,.1); color:var(--tundInk); font-size:13.5px}
.mAltIc{display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto} .mXidmetler a{transition:none}}
