/* ===== Dr. Pishkar — Award-grade redesign | Premium medical-trust | RTL ===== */
:root{
  --indigo:#2e3082; --indigo-deep:#232560; --emerald:#13a04b; --emerald-600:#0f8a40;
  --ink:#14163a; --slate:#4b4f6b; --bg:#ffffff; --bg-2:#f5f6fb; --bg-ink:#181a44;
  --border:#e6e8f2; --gold:#f5b840;
  --grad:linear-gradient(135deg,#2e3082,#13a04b);
  --grad-soft:linear-gradient(135deg,rgba(46,48,130,.10),rgba(19,160,75,.10));
  --shadow-sm:0 2px 10px rgba(20,22,58,.06);
  --shadow:0 18px 50px -20px rgba(20,22,58,.28);
  --shadow-lg:0 40px 90px -30px rgba(20,22,58,.40);
  --r:22px; --r-sm:14px; --wrap:1200px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; font-family:Vazirmatn,system-ui,-apple-system,"Segoe UI",sans-serif;
  background:var(--bg); color:var(--ink); font-size:17px; line-height:1.85;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
}
img{max-width:100%; display:block; height:auto}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{line-height:1.3; margin:0; font-weight:800; letter-spacing:-.01em}
p{margin:0}
.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2rem)}
.grad-text{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.section{padding-block:clamp(3.6rem,8vw,6.5rem)}
:focus-visible{outline:3px solid var(--emerald); outline-offset:3px; border-radius:6px}

/* reveal */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1; transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important; transform:none!important; transition:none}}

/* ===== Header ===== */
.header{position:fixed; inset-block-start:0; inset-inline:0; z-index:60; transition:.35s var(--ease)}
.header .bar{display:flex; align-items:center; gap:1.4rem; justify-content:space-between;
  margin-block:14px; padding:.6rem .9rem .6rem 1.2rem; border-radius:18px;
  background:rgba(255,255,255,.72); backdrop-filter:blur(16px) saturate(1.4);
  border:1px solid transparent; transition:.35s var(--ease)}
.header.scrolled .bar{background:rgba(255,255,255,.9); border-color:var(--border); box-shadow:var(--shadow-sm)}
.brand{display:flex; align-items:center; gap:.65rem; font-weight:800}
.brand img{width:42px; height:42px}
.brand b{font-size:1.12rem; display:block; line-height:1.2}
.brand small{font-weight:600; color:var(--slate); font-size:.74rem}
.nav{display:flex; align-items:center; gap:.3rem}
.nav a{padding:.5rem .85rem; border-radius:10px; font-weight:600; color:var(--slate); font-size:.96rem; transition:.2s}
.nav a:hover{color:var(--indigo); background:var(--bg-2)}
.header-cta{display:flex; align-items:center; gap:.6rem}
.btn{display:inline-flex; align-items:center; gap:.5rem; font-weight:700; font-family:inherit; cursor:pointer;
  border:0; border-radius:13px; padding:.85rem 1.4rem; font-size:1rem; transition:.25s var(--ease); white-space:nowrap}
.btn svg{width:1.1em; height:1.1em}
.btn-primary{background:var(--grad); color:#fff; box-shadow:0 12px 28px -10px rgba(19,160,75,.6)}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 18px 36px -12px rgba(19,160,75,.7)}
.btn-ghost{background:var(--bg-2); color:var(--indigo); border:1px solid var(--border)}
.btn-ghost:hover{background:#fff; border-color:var(--indigo)}
.btn-light{background:#fff; color:var(--indigo)}
.btn-light:hover{transform:translateY(-2px); box-shadow:var(--shadow)}
.menu-toggle,.menu-close{display:none; background:none; border:0; cursor:pointer; color:var(--ink); padding:.4rem}
.menu-toggle svg,.menu-close svg{width:28px; height:28px}

/* ===== Hero ===== */
.hero{position:relative; padding-block:clamp(7rem,15vw,10rem) clamp(3rem,7vw,5rem); overflow:hidden}
.hero::before,.hero::after{content:""; position:absolute; border-radius:50%; filter:blur(80px); opacity:.5; z-index:0}
.hero::before{width:520px; height:520px; background:radial-gradient(circle,rgba(46,48,130,.45),transparent 70%); inset-block-start:-120px; inset-inline-end:-100px}
.hero::after{width:480px; height:480px; background:radial-gradient(circle,rgba(19,160,75,.40),transparent 70%); inset-block-end:-160px; inset-inline-start:-120px}
.hero-grid{position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.eyebrow{display:inline-flex; align-items:center; gap:.5rem; font-weight:700; font-size:.86rem; color:var(--indigo);
  background:var(--grad-soft); border:1px solid rgba(46,48,130,.16); padding:.45rem 1rem; border-radius:100px}
.eyebrow::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--emerald)}
.hero h1{font-size:clamp(2.3rem,5.2vw,3.8rem); margin-block:1.3rem 1.1rem; font-weight:800}
.lead{font-size:clamp(1.05rem,1.6vw,1.2rem); color:var(--slate); max-width:60ch}
.hero-cta{display:flex; flex-wrap:wrap; gap:.9rem; margin-block-start:2rem}
.hero-trust{display:flex; align-items:center; gap:.9rem; margin-block-start:2.2rem}
.avatars{display:flex}
.avatars span{width:42px; height:42px; border-radius:50%; display:grid; place-items:center; color:#fff; font-weight:700;
  border:3px solid #fff; margin-inline-start:-12px; background:var(--grad); box-shadow:var(--shadow-sm)}
.avatars span:first-child{margin-inline-start:0}
.stars{color:var(--gold); letter-spacing:2px; font-size:.95rem}
.hero-trust span{font-size:.9rem; color:var(--slate)}

/* hero visual */
.hero-visual{position:relative}
.hero-photo{position:relative; border-radius:28px; overflow:hidden; box-shadow:var(--shadow-lg);
  border:1px solid var(--border); aspect-ratio:16/13}
.hero-photo img{width:100%; height:100%; object-fit:cover}
.hero-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(160deg,transparent 55%,rgba(35,37,96,.35))}
.float-card{position:absolute; z-index:3; background:rgba(255,255,255,.92); backdrop-filter:blur(10px);
  border:1px solid var(--border); border-radius:16px; padding:.85rem 1.1rem; box-shadow:var(--shadow);
  display:flex; align-items:center; gap:.7rem; font-weight:700; font-size:.92rem}
.float-card i{width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:var(--grad-soft); color:var(--indigo)}
.float-card i svg{width:20px; height:20px}
.float-card small{display:block; font-weight:600; color:var(--slate); font-size:.78rem}
.fc1{inset-block-start:8%; inset-inline-start:-6%}
.fc2{inset-block-end:9%; inset-inline-end:-5%}
@media (max-width:520px){.fc1,.fc2{position:static; margin-block-start:.7rem; inset:auto}}

/* ===== Marquee strip ===== */
.strip{background:var(--bg-ink); color:#fff; padding-block:1.05rem; overflow:hidden}
.strip .row{display:flex; align-items:center; gap:2.2rem; justify-content:center; flex-wrap:wrap; font-weight:600; color:#c9cbe6}
.strip .x{color:var(--emerald)}

/* ===== Stats ===== */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem}
.stat{background:var(--bg-2); border:1px solid var(--border); border-radius:var(--r); padding:1.8rem 1.2rem; text-align:center}
.stat b{display:block; font-size:clamp(1.9rem,4vw,2.6rem); font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.stat span{color:var(--slate); font-weight:600; font-size:.95rem}

/* ===== Section head ===== */
.sec-head{margin-block-end:2.8rem}
.sec-head.center{text-align:center; max-width:62ch; margin-inline:auto}
.sec-head h2{font-size:clamp(1.7rem,3.6vw,2.6rem); margin-block:.8rem .7rem}
.sec-head .lead{margin-inline:auto}

/* ===== Cards ===== */
.cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.card{background:#fff; border:1px solid var(--border); border-radius:var(--r); padding:2rem 1.7rem; transition:.3s var(--ease); position:relative; overflow:hidden}
.card::before{content:""; position:absolute; inset-block-start:0; inset-inline:0; height:4px; background:var(--grad); transform:scaleX(0); transform-origin:inline-start; transition:.4s var(--ease)}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow); border-color:transparent}
.card:hover::before{transform:scaleX(1)}
.ico{width:58px; height:58px; border-radius:16px; display:grid; place-items:center; background:var(--grad-soft); color:var(--indigo); margin-block-end:1.2rem}
.ico svg{width:28px; height:28px}
.card h3{font-size:1.25rem; margin-block-end:.6rem}
.card p{color:var(--slate); font-size:.98rem; margin-block-end:1.1rem}
.more{display:inline-flex; align-items:center; gap:.4rem; font-weight:700; color:var(--emerald-600); font-size:.95rem}
.more svg{width:1em; height:1em; transition:.25s}
.more:hover svg{transform:translateX(-4px)}

/* ===== Bento specialties ===== */
.bento{display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem}
.spec{display:flex; align-items:center; gap:.75rem; background:#fff; border:1px solid var(--border); border-radius:var(--r-sm); padding:.95rem 1.05rem; transition:.25s var(--ease)}
.spec:hover{border-color:var(--emerald); box-shadow:var(--shadow-sm); transform:translateY(-3px)}
.spec i{width:40px; height:40px; flex:0 0 auto; border-radius:11px; display:grid; place-items:center; background:var(--grad-soft); color:var(--indigo)}
.spec i svg{width:21px; height:21px}
.spec span{font-weight:700; font-size:.96rem; line-height:1.3}
.spec small{display:block; font-weight:500; color:var(--slate); font-size:.72rem; letter-spacing:.02em}
.more-pill{grid-column:1/-1}

/* ===== Steps ===== */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; counter-reset:s}
.step{position:relative; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--r); padding:1.8rem 1.4rem}
.step .n{width:46px; height:46px; border-radius:13px; background:var(--grad); color:#fff; display:grid; place-items:center; font-weight:800; font-size:1.2rem; margin-block-end:1rem}
.step h3{font-size:1.1rem; margin-block-end:.5rem}
.step p{color:var(--slate); font-size:.92rem}

/* ===== Split feature ===== */
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.split .eyebrow{margin-block-end:1rem}
.split h2{font-size:clamp(1.6rem,3.4vw,2.4rem); margin-block-end:1rem}
.feat-list{display:grid; gap:1.1rem; margin-block-start:1.6rem}
.feat{display:flex; gap:.9rem; align-items:flex-start}
.feat i{width:44px; height:44px; flex:0 0 auto; border-radius:12px; display:grid; place-items:center; background:var(--grad-soft); color:var(--emerald-600)}
.feat i svg{width:22px; height:22px}
.feat b{display:block; font-size:1.02rem}
.feat p{color:var(--slate); font-size:.92rem}
.feat-photo{border-radius:24px; overflow:hidden; box-shadow:var(--shadow-lg); border:1px solid var(--border); position:relative; aspect-ratio:4/3}
.feat-photo img{width:100%; height:100%; object-fit:cover}
.feat-photo .tag{position:absolute; inset-block-end:1rem; inset-inline-start:1rem; background:rgba(255,255,255,.94); backdrop-filter:blur(8px); border-radius:12px; padding:.6rem .9rem; font-weight:700; font-size:.9rem; display:flex; align-items:center; gap:.5rem}
.feat-photo .tag i{width:30px;height:30px;border-radius:9px;background:var(--grad);color:#fff;display:grid;place-items:center}
.feat-photo .tag i svg{width:17px;height:17px}
.media-panel{background:var(--grad); border-radius:24px; padding:2rem; box-shadow:var(--shadow-lg)}
.glass-row{display:flex; align-items:center; gap:.85rem; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); border-radius:14px; padding:.9rem 1.1rem; margin-block-end:.8rem; color:#fff}
.glass-row:last-child{margin-block-end:0}
.glass-row .dot{width:30px; height:30px; flex:0 0 auto; border-radius:50%; background:rgba(255,255,255,.22); display:grid; place-items:center}
.glass-row .dot svg{width:17px; height:17px}
.glass-row b{font-size:.98rem; display:block}
.glass-row span{font-size:.82rem; color:rgba(255,255,255,.8)}

/* ===== Exams ===== */
.exam-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem}
.exam{background:#fff; border:1px solid var(--border); border-radius:var(--r); padding:1.5rem 1rem; text-align:center; transition:.25s var(--ease)}
.exam:hover{transform:translateY(-4px); box-shadow:var(--shadow-sm); border-color:var(--indigo)}
.exam .flag{font-size:2.1rem; margin-block-end:.5rem}
.exam b{display:block; font-size:1.05rem}
.exam span{font-size:.8rem; color:var(--slate); font-weight:600}

/* ===== Testimonials ===== */
.quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.quote{background:#fff; border:1px solid var(--border); border-radius:var(--r); padding:1.8rem; margin:0}
.quote .stars{margin-block-end:.9rem}
.quote blockquote{margin:0 0 1.2rem}
.quote p{color:var(--ink); font-size:1rem; line-height:1.9}
.who{display:flex; align-items:center; gap:.8rem}
.who .av{width:46px; height:46px; border-radius:50%; background:var(--grad); color:#fff; display:grid; place-items:center; font-weight:800}
.who b{display:block; font-size:.96rem}
.who span{font-size:.82rem; color:var(--slate)}

/* ===== FAQ ===== */
.faq{max-width:840px; margin-inline:auto; display:grid; gap:.8rem}
.qa{background:#fff; border:1px solid var(--border); border-radius:var(--r-sm); padding:0 1.3rem; transition:.25s}
.qa[open]{border-color:var(--indigo); box-shadow:var(--shadow-sm)}
.qa summary{list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:1.15rem; font-weight:700; font-size:1.02rem}
.qa summary::-webkit-details-marker{display:none}
.qa .pm{width:30px; height:30px; flex:0 0 auto; border-radius:9px; background:var(--grad-soft); color:var(--indigo); display:grid; place-items:center; transition:.3s var(--ease)}
.qa .pm svg{width:18px; height:18px}
.qa[open] .pm{transform:rotate(135deg); background:var(--grad); color:#fff}
.qa .ans{color:var(--slate); font-size:.96rem; padding-block-end:1.2rem; line-height:1.95}

/* ===== CTA band ===== */
.cta-band{background:var(--grad); border-radius:30px; padding:clamp(2.4rem,5vw,4rem); text-align:center; color:#fff; position:relative; overflow:hidden}
.cta-band::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% -20%,rgba(255,255,255,.22),transparent 50%)}
.cta-band>*{position:relative}
.cta-band h2{font-size:clamp(1.6rem,3.6vw,2.5rem); margin-block-end:.9rem}
.cta-band p{color:rgba(255,255,255,.92); max-width:60ch; margin-inline:auto; margin-block-end:1.8rem}
.cta-band .hero-cta{justify-content:center}

/* ===== Footer ===== */
.footer{background:var(--bg-ink); color:#c9cbe6; padding-block:3.5rem 1.6rem; margin-block-start:0}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2rem}
.footer .brand b{color:#fff}
.footer .brand small{color:#9a9cc4}
.footer-grid>div>p{margin-block:1rem; font-size:.92rem; color:#9a9cc4; line-height:1.9}
.footer h4{color:#fff; font-size:1.02rem; margin-block-end:1.1rem}
.footer ul{list-style:none; margin:0; padding:0; display:grid; gap:.6rem}
.footer ul a{color:#c9cbe6; font-size:.92rem; transition:.2s}
.footer ul a:hover{color:var(--emerald)}
.socials{display:flex; gap:.6rem; margin-block-start:1.2rem}
.socials a{width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.08); display:grid; place-items:center; color:#c9cbe6; transition:.25s}
.socials a:hover{background:var(--grad); color:#fff; transform:translateY(-2px)}
.socials svg{width:19px; height:19px}
.foot-contact{display:grid; gap:.7rem}
.foot-contact li{display:flex; align-items:center; gap:.6rem; font-size:.9rem}
.foot-contact svg{width:18px; height:18px; flex:0 0 auto; color:var(--emerald)}
.foot-bottom{border-block-start:1px solid rgba(255,255,255,.1); margin-block-start:2.5rem; padding-block-start:1.5rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.82rem; color:#9a9cc4}

/* ===== To-top ===== */
.to-top{position:fixed; inset-block-end:1.4rem; inset-inline-start:1.4rem; z-index:50; width:48px; height:48px; border-radius:14px; border:0; cursor:pointer; background:var(--grad); color:#fff; display:grid; place-items:center; opacity:0; transform:translateY(15px); pointer-events:none; transition:.3s var(--ease); box-shadow:var(--shadow)}
.to-top.show{opacity:1; transform:none; pointer-events:auto}
.to-top svg{width:22px; height:22px}

/* ===== Mobile menu ===== */
.mobile-menu{position:fixed; inset:0; z-index:80; background:rgba(24,26,68,.55); backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:.3s}
.mobile-menu.open{opacity:1; pointer-events:auto}
.mobile-menu .panel{position:absolute; inset-block:0; inset-inline-end:0; width:min(320px,82vw); background:#fff; padding:1.4rem; transform:translateX(-100%); transition:.35s var(--ease); display:flex; flex-direction:column; gap:.3rem}
[dir=rtl] .mobile-menu .panel{transform:translateX(100%)}
.mobile-menu.open .panel{transform:none}
.mobile-menu .panel a{padding:.85rem 1rem; border-radius:11px; font-weight:600; color:var(--ink)}
.mobile-menu .panel a:hover{background:var(--bg-2)}
.mm-head{display:flex; justify-content:space-between; align-items:center; margin-block-end:1rem}

/* ===== Responsive ===== */
@media (max-width:1024px){
  .bento,.exam-grid{grid-template-columns:repeat(3,1fr)}
  .stats,.steps{grid-template-columns:repeat(2,1fr)}
  .cards-3,.quotes{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .nav,.header-cta .btn-ghost{display:none}
  .menu-toggle{display:grid; place-items:center}
  .hero-grid,.split{grid-template-columns:1fr}
  .hero-visual{order:-1}
  .split .media-panel{order:-1}
  .cards-3,.quotes{grid-template-columns:1fr}
  .bento{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  body{font-size:16px}
  .stats,.exam-grid,.bento{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column}
}
