/* ===================================================================
   مجمع أراك طابا الطبي — Inner pages (about / clinics / doctors / contact / booking)
   Professional, calm variant of the brand — no promo/offer styling.
   Reuses tokens + components from style.css.
   =================================================================== */

/* ---------- Simple header (no promo ribbon) ---------- */
.site-header-inner{padding-block:0}
.header-inner-simple{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0}
.header-inner-simple .brand{flex:none}
.header-inner-simple .brand-logo{height:52px}
.main-nav-inner{display:flex;flex-wrap:nowrap;gap:18px;white-space:nowrap}
.main-nav-inner a{font-size:.95rem}
.main-nav-inner a.active{color:var(--teal)}
.main-nav-inner a.active::after{transform:scaleX(1)}
.header-actions{display:flex;align-items:center;gap:14px}

/* nav hamburger (mobile) */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;border:none;background:none;cursor:pointer;padding:0}
.nav-toggle span{display:block;width:100%;height:2.4px;border-radius:2px;background:var(--ink);transition:transform .3s var(--ease),opacity .2s}
.nav-toggle.open span:nth-child(1){transform:translateY(7.4px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7.4px) rotate(-45deg)}

/* ---------- Page hero banner ---------- */
.page-hero{position:relative;overflow:hidden;padding:64px 0 56px;background:linear-gradient(150deg,var(--ink),var(--petrol) 65%,var(--teal));color:#eafafb}
.page-hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(55% 70% at 90% 0%, rgba(70,199,206,.24), transparent 60%),
    radial-gradient(45% 60% at 4% 100%, rgba(30,138,146,.22), transparent 60%),
    radial-gradient(rgba(255,255,255,.06) 1.2px, transparent 1.4px);
  background-size:auto,auto,26px 26px;
}
.page-hero::after{
  content:"";position:absolute;z-index:0;pointer-events:none;
  width:340px;height:340px;border-radius:50%;filter:blur(70px);
  background:rgba(70,199,206,.22);inset-block-start:-120px;inset-inline-end:8%;
  animation:float1 14s ease-in-out infinite;
}
.page-hero .container{position:relative;z-index:1}
.page-hero .eyebrow{color:var(--aqua)}
.page-hero .eyebrow::before{filter:brightness(0) saturate(100%) invert(78%) sepia(28%) saturate(541%) hue-rotate(126deg) brightness(97%) contrast(92%)}
.page-hero h1{color:#fff;font-size:clamp(1.9rem,4vw,2.9rem);margin-top:14px}
.page-hero p{color:#cfeaec;font-size:1.1rem;margin-top:14px;max-width:56ch}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:.86rem;color:#a9d0d3;margin-bottom:6px}
.breadcrumb a{color:#a9d0d3;transition:color .2s}
.breadcrumb a:hover{color:#fff}
.breadcrumb span{opacity:.6}

/* ---------- Generic content sections ---------- */
.content-section{padding:88px 0}
.content-section-alt{background:var(--alt)}

/* ---------- About: story block ---------- */
.story-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.story-copy h2{font-size:clamp(1.7rem,3.2vw,2.4rem);margin-bottom:16px}
.story-copy p{color:var(--muted);font-size:1.05rem;margin-bottom:16px}
.story-media{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/5;max-height:520px}
.story-media img{width:100%;height:100%;object-fit:cover}

/* ---------- Values grid ---------- */
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.value-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:30px 24px;box-shadow:var(--shadow-sm);text-align:center;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.value-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.value-icon{width:58px;height:58px;margin:0 auto 18px;display:grid;place-items:center;border-radius:16px;background:var(--mint);color:var(--teal);font-size:1.6rem}
.value-card h3{font-size:1.1rem;margin-bottom:8px}
.value-card p{color:var(--muted);font-size:.92rem}

/* ---------- Timeline / mission-vision ---------- */
.mv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.mv-card{background:linear-gradient(155deg,var(--teal),var(--ink));border-radius:var(--r-lg);padding:34px 30px;color:#eafafb;box-shadow:var(--shadow-lg)}
.mv-card h3{color:#fff;font-size:1.25rem;margin-bottom:10px;display:flex;align-items:center;gap:10px}
.mv-card p{color:#d7f0f1;font-size:.98rem}

/* ---------- Clinics (detailed) ---------- */
.clinics-list{display:grid;gap:22px}
.clinic-row{
  display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:26px 28px;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.clinic-row:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.clinic-icon{width:64px;height:64px;flex:none;display:grid;place-items:center;border-radius:18px;background:var(--mint);color:var(--teal)}
.clinic-icon svg{width:32px;height:32px}
.clinic-body h3{font-size:1.2rem;margin-bottom:6px}
.clinic-body p{color:var(--muted);font-size:.95rem}
.clinic-cta{flex:none}
@media (max-width:760px){
  .clinic-row{grid-template-columns:auto 1fr;padding:22px 20px}
  .clinic-cta{grid-column:1 / -1}
}

/* ---------- Doctors / team departments ---------- */
.dept-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.dept-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:30px 26px;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.dept-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.dept-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.dept-ic{width:52px;height:52px;flex:none;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,var(--teal),var(--teal-bright));color:#fff;font-size:1.3rem}
.dept-head h3{font-size:1.1rem}
.dept-card p{color:var(--muted);font-size:.94rem;margin-bottom:14px}
.dept-tags{display:flex;flex-wrap:wrap;gap:8px}
.dept-tag{font-size:.8rem;font-weight:600;color:var(--teal);background:var(--mint);padding:5px 12px;border-radius:var(--r-pill)}
.team-note{background:var(--mint);border:1px solid var(--mint-200);border-radius:var(--r-md);padding:22px 26px;display:flex;gap:14px;align-items:flex-start;margin-top:36px}
.team-note span{font-size:1.4rem;flex:none}
.team-note p{color:var(--ink);font-size:.96rem}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.contact-cards{display:grid;gap:16px}
.contact-card{display:flex;gap:16px;align-items:flex-start;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;box-shadow:var(--shadow-sm)}
.contact-card .cc-ic{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:13px;background:var(--mint);color:var(--teal);font-size:1.2rem}
.contact-card h4{font-family:var(--font-display);color:var(--ink);font-size:1.02rem;margin-bottom:4px}
.contact-card p{color:var(--muted);font-size:.94rem}
.contact-map{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);border:6px solid #fff}
.contact-map iframe{width:100%;height:100%;min-height:420px;border:0;filter:saturate(.95)}

/* ---------- Booking page ---------- */
.booking-page-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:50px;align-items:start}
.booking-side h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:14px}
.booking-side>p{color:var(--muted);font-size:1.05rem;margin-bottom:26px}
.booking-steps{list-style:none;display:grid;gap:18px;margin-bottom:30px}
.booking-steps li{display:flex;gap:14px;align-items:flex-start}
.bs-num{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--teal-bright));color:#fff;font-family:var(--font-display);font-weight:700;font-size:.95rem}
.booking-steps h4{font-size:1rem;margin-bottom:3px;color:var(--ink)}
.booking-steps p{color:var(--muted);font-size:.9rem}
.booking-page-grid .booking-card{position:sticky;top:100px}

@media (max-width:980px){
  .story-grid,.contact-grid,.booking-page-grid{grid-template-columns:1fr;gap:38px}
  .values-grid,.dept-grid{grid-template-columns:repeat(2,1fr)}
  .mv-grid{grid-template-columns:1fr}
  .booking-page-grid .booking-card{position:static}
}
@media (max-width:600px){
  .content-section{padding:56px 0}
  .page-hero{padding:44px 0 40px}
  .values-grid,.dept-grid{grid-template-columns:1fr}
  .clinic-row{padding:20px 16px}
}

/* ---------- Responsive nav (mobile dropdown) ---------- */
@media (max-width:1120px){
  .nav-toggle{display:flex}
  .main-nav-inner{
    display:flex!important;position:absolute;inset-inline:0;top:100%;z-index:49;
    flex-direction:column;gap:0;background:#fff;border-bottom:1px solid var(--line);
    box-shadow:var(--shadow-md);
    max-height:0;overflow:hidden;opacity:0;
    transition:max-height .35s var(--ease),opacity .25s var(--ease);
  }
  .main-nav-inner.open{max-height:520px;opacity:1}
  .main-nav-inner a{padding:14px 22px;border-bottom:1px solid var(--line)}
  .main-nav-inner a::after{display:none}
  .btn-header{padding:10px 18px;font-size:.92rem}
}

/* =================================================================
   Home page (hero2) — dazzling entry point for the full site
   ================================================================= */
.hero2{position:relative;overflow:hidden;padding:96px 0 110px}
.hero2-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(60% 70% at 92% 0%, rgba(70,199,206,.26), transparent 60%),
    radial-gradient(55% 60% at 2% 100%, rgba(30,138,146,.18), transparent 60%),
    radial-gradient(rgba(30,138,146,.09) 1.3px, transparent 1.5px);
  background-size:auto,auto,24px 24px;
}
.hero2::before,.hero2::after{content:"";position:absolute;z-index:0;border-radius:50%;filter:blur(64px);pointer-events:none}
.hero2::before{width:420px;height:420px;inset-block-start:-120px;inset-inline-start:-100px;background:rgba(70,199,206,.22);animation:float1 15s ease-in-out infinite}
.hero2::after{width:320px;height:320px;inset-block-end:-100px;inset-inline-end:4%;background:rgba(43,179,187,.18);animation:float2 17s ease-in-out infinite}
.hero2-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero2-copy h1{font-size:clamp(2.2rem,4.8vw,3.6rem);letter-spacing:-.01em;margin-top:16px}
.hero2-copy h1 .accent{
  background:linear-gradient(100deg,var(--teal),var(--aqua));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  position:relative;
}
.hero2-copy .lead{margin:20px 0 30px;font-size:1.15rem;color:var(--muted);max-width:44ch}
.hero2-cta{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:34px}
.hero2-stats{display:flex;gap:40px;flex-wrap:wrap}
.hero2-stats .stat strong{display:block;font-family:var(--font-display);font-size:2.1rem;line-height:1;background:linear-gradient(120deg,var(--teal),var(--aqua));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero2-stats .stat span{font-size:.86rem;color:var(--muted)}
.hero2-media{position:relative}
.hero2-media .media-frame{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/5;max-height:560px}
.hero2-media .media-frame img{width:100%;height:100%;object-fit:cover}
.hero2-media .media-frame::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(15,74,82,.55),transparent 45%)}
.hero2-float{
  position:absolute;z-index:3;display:inline-flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--line);padding:12px 18px;border-radius:var(--r-md);box-shadow:var(--shadow-lg);
  font-family:var(--font-display);
}
.hf-top{top:-18px;inset-inline-start:-18px;animation:bob 5s ease-in-out infinite}
.hf-bottom{bottom:-18px;inset-inline-end:-18px;animation:bob 5s ease-in-out infinite .8s}
.hf-num{font-weight:700;font-size:1.35rem;color:var(--teal);line-height:1}
.hf-txt{font-size:.78rem;color:var(--ink);line-height:1.3;max-width:12ch}

/* ---------- Home: highlight cards ---------- */
.home-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.home-card{
  position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:30px 24px;box-shadow:var(--shadow-sm);overflow:hidden;text-align:center;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;
}
.home-card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--teal),var(--aqua));transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.home-card:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 26px 50px -20px rgba(15,74,82,.35);border-color:transparent}
.home-card:hover::before{transform:scaleX(1)}
.home-card .value-icon{margin-inline:auto}

/* ---------- Tilt/glow hover polish for existing inner-page cards ---------- */
.value-card,.dept-card,.clinic-row,.contact-card{transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.value-card:hover,.dept-card:hover{box-shadow:0 26px 50px -22px rgba(15,74,82,.32)}

/* =================================================================
   Gallery
   ================================================================= */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.gallery-grid .g-tall{grid-row:span 2}
.gallery-item{position:relative;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);cursor:zoom-in}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.gallery-item::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(15,74,82,.55),transparent 55%);opacity:0;transition:opacity .3s}
.gallery-item span{position:absolute;z-index:1;inset-inline-start:16px;inset-block-end:14px;color:#fff;font-family:var(--font-display);font-weight:600;font-size:.92rem;opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
.gallery-item:hover img{transform:scale(1.08)}
.gallery-item:hover::after,.gallery-item:hover span{opacity:1;transform:translateY(0)}

#lightbox{
  position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  background:rgba(10,25,27,.92);backdrop-filter:blur(6px);cursor:zoom-out;padding:30px;
}
#lightbox.open{display:flex}
#lightbox img{max-width:min(92vw,1000px);max-height:86vh;border-radius:var(--r-md);box-shadow:var(--shadow-lg);object-fit:contain}

/* =================================================================
   Testimonials slider
   ================================================================= */
.testi-wrap{position:relative}
.testi-track{
  display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 4px 20px;
  scrollbar-width:none;
}
.testi-track::-webkit-scrollbar{display:none}
.testimonial-card{
  flex:0 0 min(360px,86vw);scroll-snap-align:start;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:30px 28px 26px;box-shadow:var(--shadow-sm);position:relative;
}
.testimonial-card::before{content:"\201D";position:absolute;top:6px;inset-inline-start:22px;font-family:Georgia,serif;font-size:4.2rem;color:var(--teal-bright);opacity:.22;line-height:1}
.testi-controls{display:flex;justify-content:center;gap:14px;margin-top:8px}
.testi-btn{
  width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:#fff;
  display:grid;place-items:center;color:var(--teal);cursor:pointer;transition:background .2s,color .2s,transform .2s;
}
.testi-btn:hover{background:var(--teal);color:#fff;transform:translateY(-2px)}
.testi-btn svg{width:20px;height:20px}

/* =================================================================
   FAQ accordion
   ================================================================= */
.faq-list{display:grid;gap:14px;max-width:820px;margin-inline:auto}
.faq-item{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow .3s}
.faq-item.open{box-shadow:var(--shadow-md);border-color:var(--teal-bright)}
.faq-q{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px 24px;cursor:pointer;font-family:var(--font-display);font-weight:600;color:var(--ink);
}
.faq-q .fq-ic{flex:none;width:28px;height:28px;border-radius:50%;background:var(--mint);color:var(--teal);display:grid;place-items:center;font-size:1.1rem;transition:transform .3s var(--ease),background .3s,color .3s}
.faq-item.open .fq-ic{background:var(--teal);color:#fff;transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.faq-item.open .faq-a{max-height:280px}
.faq-a p{padding:0 24px 22px;color:var(--muted);font-size:.96rem}

/* ---------- Footer rating chip ---------- */
.footer-rating{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:.88rem;color:#cfe9ea}
.footer-rating .stars{color:#F2B441;letter-spacing:1px}
.footer-rating b{color:#fff;font-family:var(--font-display)}

@media (max-width:980px){
  .hero2-grid{grid-template-columns:1fr;gap:44px}
  .home-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:600px){
  .hero2{padding:52px 0 64px}
  .hero2-cta{flex-direction:column}
  .home-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid .g-tall{grid-row:span 1}
  .testimonial-card{padding:24px 22px 20px}
}

/* =================================================================
   Doctors — poster cards + filters (2026-07-25)
   ================================================================= */
.doc-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:38px}
.doc-filter{
  font-family:var(--font-display);font-weight:600;font-size:.92rem;color:var(--ink);
  background:var(--white);border:1.5px solid var(--line);border-radius:var(--r-pill);
  padding:9px 20px;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s;
}
.doc-filter:hover{border-color:var(--teal);color:var(--teal);transform:translateY(-2px)}
.doc-filter.active{background:linear-gradient(135deg,var(--teal),var(--teal-bright));color:#fff;border-color:transparent;box-shadow:var(--glow)}

.doctors-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.doc-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.doc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.doc-card.hide{display:none}
.doc-poster{position:relative;margin:0;aspect-ratio:760/912;overflow:hidden;cursor:zoom-in;background:#e8f2f4}
.doc-poster img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.doc-card:hover .doc-poster img{transform:scale(1.04)}
.doc-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.doc-body h3{font-size:1.15rem}
.doc-spec{
  align-self:flex-start;font-family:var(--font-display);font-weight:600;font-size:.8rem;
  color:var(--teal);background:var(--mint);padding:4px 12px;border-radius:var(--r-pill);
}
.doc-hours{list-style:none;display:grid;gap:6px;margin:8px 0 14px}
.doc-hours li{display:flex;align-items:flex-start;gap:8px;font-size:.9rem;color:var(--text);line-height:1.5}
.doc-hours .dh-ic{flex:none;font-size:.85rem;line-height:1.6}
.doc-hours .doc-off{color:var(--muted);font-size:.84rem}
.doc-cta{margin-top:auto;align-self:stretch;text-align:center}

/* Home strip (horizontal snap) */
.doc-strip-wrap{position:relative}
.doc-strip{
  display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:8px 4px 22px;scrollbar-width:none;
}
.doc-strip::-webkit-scrollbar{display:none}
.doc-card-sm{flex:0 0 min(250px,74vw);scroll-snap-align:start}
.doc-card-sm .doc-body{padding:14px 16px 18px;gap:6px}
.doc-card-sm h3{font-size:1.02rem}
.doc-card-sm .doc-spec{font-size:.74rem}
.doctors-home .testi-controls{margin-top:4px;flex-wrap:wrap}

/* =================================================================
   Working hours cards
   ================================================================= */
.hours-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;max-width:900px;margin-inline:auto}
.hours-card{
  display:flex;gap:18px;align-items:flex-start;
  background:linear-gradient(155deg,var(--teal),var(--ink));color:#eafafb;
  border-radius:var(--r-lg);padding:30px 28px;box-shadow:var(--shadow-lg);
}
.hours-card .hc-ic{flex:none;width:54px;height:54px;display:grid;place-items:center;font-size:1.6rem;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:16px}
.hours-card h3{color:#fff;font-size:1.15rem;margin-bottom:6px}
.hc-time{font-family:var(--font-display);font-weight:700;font-size:1.3rem;color:#fff;margin-bottom:8px}
.hc-note{font-size:.88rem;color:#c7e7e9;line-height:1.6}

/* =================================================================
   Partners section
   ================================================================= */
.partners-grid{display:grid;grid-template-columns:1fr .9fr;gap:52px;align-items:center}
.partners-copy h2{font-size:clamp(1.6rem,3.2vw,2.3rem);margin:12px 0 14px}
.partners-copy p{color:var(--muted);font-size:1.02rem;margin-bottom:14px}
.partners-note{font-family:var(--font-display);font-weight:600;font-size:.88rem!important;color:var(--teal)!important}
.partners-copy .btn{margin-top:8px}
.partners-media{margin:0;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);border:6px solid #fff}
.partners-media img{width:100%;display:block}

@media (max-width:980px){
  .doctors-grid{grid-template-columns:repeat(2,1fr)}
  .partners-grid{grid-template-columns:1fr;gap:34px}
  .hours-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  .doctors-grid{grid-template-columns:1fr}
  .doc-filters{gap:8px;margin-bottom:28px}
  .doc-filter{padding:8px 16px;font-size:.86rem}
  .hours-card{padding:24px 20px}
}

/* =================================================================
   Hero art panel — نبض أراك طابا (يستبدل صورة الستوك) 2026-07-25
   ================================================================= */
.hero-art{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg,#0F4A52 0%,#15555E 45%,#1E8A92 100%);
  background-size:160% 160%;
  animation:haBreath 12s ease-in-out infinite;
  display:flex;flex-direction:column;
}
.hero-art.media-frame::before{display:none} /* لا تعتيم فوق اللوحة */
@keyframes haBreath{0%,100%{background-position:0% 0%}50%{background-position:100% 100%}}

/* نقش الزائد الطبي ينجرف ببطء */
.ha-pattern{
  position:absolute;inset:-40px;opacity:.5;pointer-events:none;
  background:
    radial-gradient(45% 45% at 82% 12%, rgba(70,199,206,.30), transparent 65%),
    radial-gradient(40% 40% at 10% 88%, rgba(43,179,187,.22), transparent 65%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cpath d='M20 14h4v6h6v4h-6v6h-4v-6h-6v-4h6z' fill='rgba(255,255,255,.05)'/%3E%3C/svg%3E");
  animation:haDrift 26s linear infinite;
}
@keyframes haDrift{to{transform:translate(-44px,-44px)}}

/* خط النبض */
.ha-ecg{position:absolute;inset-inline:0;top:16%;width:100%;height:120px;pointer-events:none}
.ha-ecg path{stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;fill:none}
.ha-ecg-base{stroke:rgba(255,255,255,.14)}
.ha-ecg-trace{
  stroke:#46C7CE;filter:drop-shadow(0 0 6px rgba(70,199,206,.9));
  stroke-dasharray:130 1200;stroke-dashoffset:1330;
  animation:haTrace 4.6s linear infinite;
}
@keyframes haTrace{to{stroke-dashoffset:0}}

/* القلب: شعار + حلقات نبض */
.ha-core{position:absolute;top:44%;inset-inline-start:50%;transform:translate(50%,-50%);display:grid;place-items:center}
html[dir="rtl"] .ha-core{transform:translate(50%,-50%)}
.ha-mark{
  position:relative;z-index:2;width:112px;height:112px;display:grid;place-items:center;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.25);border-radius:32px;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 24px 60px -20px rgba(0,0,0,.55);
  animation:haHeart 2.3s var(--ease) infinite;
}
.ha-mark svg{width:66px;height:66px}
@keyframes haHeart{0%,100%{transform:scale(1)}12%{transform:scale(1.07)}24%{transform:scale(1)}36%{transform:scale(1.05)}48%{transform:scale(1)}}
.ha-ring{
  position:absolute;width:112px;height:112px;border-radius:36px;
  border:1.6px solid rgba(70,199,206,.75);opacity:0;
  animation:haRing 2.3s ease-out infinite;
}
.ha-ring:nth-child(2){animation-delay:.55s}
.ha-ring:nth-child(3){animation-delay:1.1s}
@keyframes haRing{0%{transform:scale(1);opacity:.85}100%{transform:scale(2.05);opacity:0}}

/* رقائق التخصصات */
.ha-chip{
  position:absolute;z-index:3;white-space:nowrap;
  font-family:var(--font-display);font-weight:600;font-size:.82rem;color:#fff;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  padding:8px 14px;border-radius:var(--r-pill);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:0 10px 26px -12px rgba(0,0,0,.5);
  animation:haBob 5.4s ease-in-out infinite;
}
.hc1{top:9%;inset-inline-start:8%}
.hc2{top:24%;inset-inline-end:6%;animation-delay:.7s}
.hc3{top:60%;inset-inline-start:6%;animation-delay:1.3s}
.hc4{top:71%;inset-inline-end:9%;animation-delay:1.9s}
.hc5{top:41%;inset-inline-start:4%;animation-delay:2.5s}
.hc6{top:52%;inset-inline-end:4%;animation-delay:3.1s}
@keyframes haBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* شريط الإحصاءات الحقيقية */
.ha-stats{
  position:absolute;inset-inline:14px;bottom:14px;z-index:3;
  display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.2);
  border-radius:var(--r-md);padding:11px 8px;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:#dff5f6;font-size:.76rem;font-weight:500;text-align:center;
}
.ha-stats span{white-space:nowrap}
.ha-stats b{font-family:var(--font-display);font-weight:700;font-size:1.02rem;color:#fff}
.ha-stats i{width:1px;height:22px;background:rgba(255,255,255,.25)}

@media (max-width:600px){
  .ha-mark{width:92px;height:92px;border-radius:26px}
  .ha-mark svg{width:54px;height:54px}
  .ha-ring{width:92px;height:92px;border-radius:30px}
  .ha-chip{font-size:.74rem;padding:6px 11px}
  .ha-stats{gap:9px;padding:10px 10px;font-size:.76rem}
}

/* =================================================================
   Hero art v2 — مدار العيادات + وهج + شرارات + لمعة (2026-07-25)
   ================================================================= */
/* الشارة السفلية كانت تغطي شريط الإحصاءات — ترفع فوقه */
.hero2 .hf-bottom{bottom:80px;inset-inline-end:-14px}

/* صدى خط النبض */
.ha-ecg-echo{
  stroke:rgba(255,255,255,.30);stroke-width:2.6;
  stroke-dasharray:90 1240;stroke-dashoffset:1330;
  animation:haTrace 4.6s linear infinite;animation-delay:-2.3s;
}

/* وهج مخروطي يلفّ خلف القلب */
.ha-glow{
  position:absolute;top:44%;inset-inline-start:50%;width:420px;height:420px;
  margin:-210px;border-radius:50%;pointer-events:none;opacity:.8;
  background:conic-gradient(from 0deg,transparent 0 68%,rgba(70,199,206,.30) 84%,transparent 100%);
  filter:blur(16px);
  animation:haSpin 13s linear infinite;
}
@keyframes haSpin{to{transform:rotate(360deg)}}

/* مسار المدار المنقّط */
.ha-track{
  position:absolute;top:44%;inset-inline-start:50%;width:344px;height:344px;
  margin:-172px;border-radius:50%;pointer-events:none;
  border:1.5px dashed rgba(255,255,255,.22);
  animation:haSpin 70s linear infinite;
}

/* مدار الرقائق: حركة دائرية حقيقية مع بقاء النص معتدلًا */
.ha-orbit{position:absolute;inset:0;pointer-events:none}
@supports (offset-path:circle(10px)){
  .ha-orbit .ha-chip{
    inset:auto;top:auto;
    offset-path:circle(172px at 50% 44%);
    offset-rotate:0deg;
    animation:haOrbit 42s linear infinite;
  }
  .ha-orbit .hc1{animation-delay:0s}
  .ha-orbit .hc2{animation-delay:-7s}
  .ha-orbit .hc3{animation-delay:-14s}
  .ha-orbit .hc4{animation-delay:-21s}
  .ha-orbit .hc5{animation-delay:-28s}
  .ha-orbit .hc6{animation-delay:-35s}
  /* توقف لطيف عند مرور المؤشر */
  .hero-art:hover .ha-orbit .ha-chip,
  .hero-art:hover .ha-track,
  .hero-art:hover .ha-glow{animation-play-state:paused}
}
@keyframes haOrbit{from{offset-distance:0%}to{offset-distance:100%}}

/* شرارات متلألئة */
.ha-spark{
  position:absolute;width:6px;height:6px;border-radius:50%;pointer-events:none;
  background:#9FE8EC;box-shadow:0 0 10px 2px rgba(70,199,206,.8);
  opacity:0;animation:haTwinkle 3.8s ease-in-out infinite;
}
.sp1{top:14%;inset-inline-start:22%}
.sp2{top:30%;inset-inline-end:14%;animation-delay:.9s}
.sp3{top:58%;inset-inline-start:12%;animation-delay:1.7s;width:4px;height:4px}
.sp4{top:70%;inset-inline-end:20%;animation-delay:2.5s}
.sp5{top:22%;inset-inline-start:55%;animation-delay:3.1s;width:4px;height:4px}
@keyframes haTwinkle{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1)}}

/* لمعة زجاجية تمسح اللوحة كل دورة */
.ha-sheen{
  position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit;
}
.ha-sheen::before{
  content:"";position:absolute;top:-30%;bottom:-30%;width:46%;
  inset-inline-start:-60%;transform:rotate(14deg);
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.13) 45%,rgba(255,255,255,.22) 50%,rgba(255,255,255,.13) 55%,transparent);
  animation:haSheen 7.5s ease-in-out infinite;
}
@keyframes haSheen{
  0%,55%{inset-inline-start:-60%}
  85%,100%{inset-inline-start:130%}
}

/* الرقائق فوق الوهج والمسار */
.ha-chip{z-index:4}
.ha-core{z-index:3}
.ha-stats{z-index:5}

@media (max-width:600px){
  .ha-glow{width:300px;height:300px;margin:-150px}
  .ha-track{width:256px;height:256px;margin:-128px}
  @supports (offset-path:circle(10px)){
    .ha-orbit .ha-chip{offset-path:circle(128px at 50% 44%)}
  }
  .hero2 .hf-bottom{bottom:74px}
}
/* الشارات العائمة فوق رقائق المدار دائمًا */
.hero2 .hero2-float{z-index:6}