/* =========================================================
   REBALANCE — Constructivist Editorial Design System
   ========================================================= */

:root{
  --navy: #007fc1;          /* was #0E2551 — now your primary blue */
  --luxury-blue: #0069a3;   /* darker shade of #007fc1, used for gradients/panels */
  --slate: #697393;         /* unchanged, still works as a neutral */
  --accent-coral: #ff0046;  /* your highlight color */
  --hover-coral: #d90040;   /* slightly darker for hover states */
  --bg: #FFFFFF;            /* white page background */
  --bg-light: #F7F7FA;      /* very light neutral for alternating sections */
  --card: #FFFFFF;
  --border: #E8EBF2;
  --text: #180042;          /* your text color */
  --text-secondary: #5A4A78; /* lighter tint of text color for secondary copy */
  --text-muted: #8A7DA0;     /* even lighter tint for muted/meta text */
  --shadow: rgba(24,0,66,.08); /* shadow tinted from your text color instead of navy */

  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --container: 1280px;
  --edge: clamp(20px, 5vw, 72px);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; cursor:pointer; background:none; border:none; color:inherit; }
input,textarea,select{ font-family:inherit; font-size:1rem; }
h1,h2,h3,h4{ font-family:var(--font-display); color:var(--navy); margin:0; letter-spacing:-0.01em; }
p{ margin:0; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Layout helpers ---------- */
section{ padding:80px var(--edge); position:relative; }
.section-head{ max-width:720px; margin-bottom:64px; }
.section-head--split{ max-width:none; display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap; }
.section-head h2{ font-size:clamp(2rem, 3.4vw, 3rem); line-height:1.12; margin-top:14px; }
.section-head h2.on-dark{ color:#fff; }
.section-note{ max-width:320px; color:var(--text-secondary); font-size:.95rem; padding-bottom:6px; }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--accent-coral);
  background: white;
  margin:0;
  font-size: 15px;
}
.eyebrow-light{ color:var(--accent-coral); background: white; }
.eyebrow-dash{ width:28px; height:2px; background:var(--accent-coral); display:inline-block; }

/* ---------- Buttons ---------- */
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-display); font-weight:600; font-size:.95rem;
  padding:15px 28px; border:2px solid transparent; white-space:nowrap;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), background-color .25s, color .25s, border-color .25s;
}
.btn-lg{ padding:18px 34px; font-size:1rem; }
.btn-sm{ padding:10px 18px; font-size:.82rem; }
.btn-coral{ background:var(--accent-coral); color:#fff; }
.btn-coral:hover{ background:var(--hover-coral); }
.btn-outline{ border-color:rgba(255,255,255,.5); color:#fff; }
.btn-outline:hover{ border-color:#fff; background:rgba(255,255,255,.08); }
.btn-ghost{ border-color:var(--border); color:var(--navy); }
.btn-ghost:hover{ border-color:var(--navy); }
.btn-text{ padding:0; gap:12px; color:var(--navy); font-size:1rem; }
.play-dot{ width:34px; height:34px; border-radius:50%; border:2px solid var(--navy); display:inline-flex; align-items:center; justify-content:center; font-size:.7rem; flex:none; }
.play-dot::after{ content:''; width:0; height:0; border-left:9px solid var(--navy); border-top:6px solid transparent; border-bottom:6px solid transparent; margin-left:3px; }
.full-w{ width:100%; }

.ripple{ }
.ripple .ripple-circle{
  position:absolute; border-radius:50%; background:rgba(255,255,255,.5);
  transform:scale(0); animation:rippleAnim .6s ease-out forwards; pointer-events:none;
}
@keyframes rippleAnim{ to{ transform:scale(2.6); opacity:0; } }

.magnetic{ will-change:transform; }

/* ---------- Header / Nav ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:900;
  background:rgba(250,249,249,.96);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--border);
  padding:16px 0;
  transition:padding .35s, box-shadow .35s;
}
.site-header.is-scrolled{
  padding:12px 0;
  box-shadow:0 4px 20px var(--shadow);
}

.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; max-width:1400px; margin:0 auto; padding:0 24px; gap:24px;
}

/* Logo */
.logo{ display:flex; align-items:center; justify-content:flex-start; margin-right:auto; flex-shrink:0; }
.logo-mark img{ width:150px; height:auto; display:block; }
.logo-mark svg{ display:none; }

/* Nav links — always dark, since header is always solid now */
.main-nav ul{ display:flex; gap:55px; }
.main-nav a{ font-size:.86rem; font-weight:500; color:var(--text); position:relative; padding:6px 0; }
.main-nav a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--accent-coral);
  transition:width .3s;
}
.main-nav a:hover::after, .main-nav a.is-active::after{ width:100%; }
.main-nav a.is-active{ color:var(--accent-coral) !important; }

/* Header actions */
.header-actions{ display:flex; align-items:center; gap:12px; }
.header-actions .btn-ghost{ color:var(--navy); border-color:var(--border); }

/* Toggle */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:26px; height:26px; flex:none; z-index:950;
}
.nav-toggle span{ height:2px; width:100%; background:var(--navy); transition:transform .3s, opacity .3s; }

/* Optional: animate toggle into an X when menu is open */
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---------- Mobile ---------- */
@media (max-width:860px){
  .header-inner{ padding:0 var(--edge); gap:14px; }

  .nav-toggle{ display:flex; }

  .main-nav{
    position:fixed; top:0; right:0; height:100vh; width:min(320px,80vw);
    background:var(--navy); transform:translateX(100%); transition:transform .35s;
    padding:110px 32px; z-index:900;
  }
  .main-nav.is-open{ transform:translateX(0); }
  .main-nav ul{ flex-direction:column; gap:22px; }
  .main-nav a{ color:#fff !important; font-size:1.05rem; }
  .main-nav a::after{ background:var(--accent-coral); }

  .header-actions{ gap:8px; }
  .header-actions .btn-ghost{ display:none; }
  .header-actions .btn-coral{ padding:9px 14px; font-size:.78rem; }
}

@media (max-width:400px){
  .header-actions .btn-coral{ padding:8px 12px; font-size:.72rem; }
}
.main-nav-close{
  display:none;
  position:absolute; top:24px; right:24px;
  width:38px; height:38px; border-radius:50%;
  color:#fff; font-size:1.6rem; line-height:1;
  align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.25);
  transition:background-color .25s, border-color .25s;
}
.main-nav-close:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.5); }

.main-nav-cta{ margin-top:40px; }

@media (max-width:860px){
  .main-nav-close{ display:flex; }
}
/* ---------- Custom cursor ---------- */
.cursor-dot,.cursor-ring{ position:fixed; top:0; left:0; pointer-events:none; z-index:2000; border-radius:50%; transform:translate(-50%,-50%); }
.cursor-dot{ width:6px; height:6px; background:var(--accent-coral); }
.cursor-ring{ width:34px; height:34px; border:1.5px solid var(--accent-coral); transition:width .2s, height .2s, opacity .2s, transform .08s linear; opacity:.7; }
@media (hover:none), (pointer:coarse){ .cursor-dot,.cursor-ring{ display:none; } }
/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative; min-height:100vh; padding:150px var(--edge) 60px;
  background:var(--bg);
  color:var(--text); overflow:hidden;
  display:flex; align-items:center;
}
.hero::before{
  content:''; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(90deg, rgba(24,0,66,.03) 0 1px, transparent 1px 120px),
    repeating-linear-gradient(0deg, rgba(24,0,66,.03) 0 1px, transparent 1px 120px);
  pointer-events:none;
}
.hero-grid{
  max-width:var(--container); margin:0 auto; width:100%;
  display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center;
  position:relative; z-index:2;
}
.hero-copy{ order:1; padding-right:20px; }
.hero-title{
  font-size:clamp(2.6rem, 5.4vw, 4.4rem); line-height:1.04; color:var(--navy); margin:22px 0 26px;
  font-weight:700;
}
.hero-title em{ font-style:normal; color:var(--navy); }
.hl-coral{ color:var(--accent-coral); }
.hero-sub{
  font-size:1.08rem; color:var(--text-secondary); max-width:520px; margin-bottom:38px;
}
.hero-ctas{ display:flex; flex-wrap:wrap; gap:18px; align-items:center; margin-bottom:56px; }
.hero-ctas .btn-text{ color:var(--navy); }
.hero-ctas .play-dot{ border-color:var(--navy); }
.hero-ctas .play-dot::after{ border-left-color:var(--navy); }
.hero-ctas .btn-outline{ border-color:var(--navy); color:var(--navy); }
.hero-ctas .btn-outline:hover{ border-color:var(--accent-coral); background:rgba(255,0,70,.06); color:var(--accent-coral); }

.hero-counters{ display:flex; gap:44px; flex-wrap:wrap; }
.counter-block{ border-left:2px solid var(--border); padding-left:16px; }
.counter{ font-family:var(--font-display); font-size:2.1rem; font-weight:700; color:var(--navy); }
.counter-suffix{ font-family:var(--font-display); font-size:2.1rem; font-weight:700; color:var(--accent-coral); }
.counter-block p{ font-size:.78rem; color:var(--text-muted); margin-top:4px; max-width:140px; }

/* ---------- Visual side: decorative glass card, no image ---------- */
.hero-visual{ order:2; position:relative; min-height:480px; display:flex; align-items:center; }
.hero-shape{ position:absolute; z-index:1; }
.hero-shape.sq{ width:150px; height:150px; background:var(--accent-coral); top:-30px; right:40px; transform:rotate(8deg); opacity:.9; }
.hero-shape.circ{ width:220px; height:220px; border-radius:50%; border:3px solid var(--border); bottom:-40px; left:-30px; }

.hero-glass-card{
  position:relative; z-index:2; width:100%; margin-left:auto; max-width:440px;
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(24,0,66,.08);
  border-radius:24px;
  padding:40px 36px;
  box-shadow:
    0 30px 70px rgba(24,0,66,.14),
    0 4px 14px rgba(24,0,66,.06),
    inset 0 1px 0 rgba(255,255,255,.6);
}
.hgc-eyebrow{
  font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent-coral); margin-bottom:24px;
}
.hgc-list{ display:grid; gap:22px; margin-bottom:28px; }
.hgc-list li{ display:flex; gap:16px; align-items:flex-start; }
.hgc-num{
  font-family:var(--font-mono); font-size:.8rem; font-weight:600; color:var(--navy);
  background:rgba(0,127,193,.08); width:30px; height:30px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; flex:none;
}
.hgc-list li span:last-child{ font-size:.95rem; color:var(--text); line-height:1.5; padding-top:4px; }
.hgc-footer{
  display:flex; align-items:center; gap:10px; font-size:.86rem; color:var(--text-secondary);
  padding-top:22px; border-top:1px solid rgba(24,0,66,.08);
}
.hgc-footer-dot{ width:6px; height:6px; border-radius:50%; background:var(--accent-coral); flex:none; }

.scroll-cue span{ background:var(--border); }
.scroll-cue span::after{ background:var(--accent-coral); }

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-copy{ order:1; padding-right:0; }
  .hero-visual{ order:2; min-height:auto; margin-top:40px; }
}

@media (max-width:560px){
  .hero-glass-card{ display:block; padding:32px 26px; }
}
/* =========================================================
   ABOUT
   ========================================================= */
.about{ background:var(--bg); }
.about-grid{ max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:.85fr 1.15fr; gap: clamp(2rem, 5vw, 4.5rem); align-items:start; }
.about-media {
  position: sticky;
  top: 120px;
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
}
.about-media img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.about-media-tag{
  margin-top:-1px; background:var(--navy); color:#fff; font-family:var(--font-mono);
  font-size:.72rem; letter-spacing:.06em; padding:12px 18px; display:inline-block;
}
.about-copy .lead{ font-size:1.25rem; color:var(--navy); line-height:1.5; margin-bottom:22px; font-weight:500; }
.about-copy p{ color:var(--text-secondary); margin-bottom:0; }
.about-points{ margin-top:44px; display:grid; gap:0; }
.about-point{ display:flex; gap:22px; padding:24px 0; border-top:1px solid var(--border); }
.about-point:last-child{ border-bottom:1px solid var(--border); }
.ap-num{ font-family:var(--font-mono); color:var(--accent-coral); font-weight:600; font-size:.95rem; flex:none; padding-top:2px; }
.about-point h3{ font-size:1.05rem; margin-bottom:6px; }
.about-point p{ color:var(--text-secondary); font-size:.94rem; }

/* =========================================================
   VISION & MISSION
   ========================================================= */
.vision{ background:var(--navy); padding:100px var(--edge); }
.vision-inner{ max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:2px; background:rgba(255,255,255,.15); }
.vision-card{
  background:var(--luxury-blue); padding:56px 48px; position:relative; overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.vision-card:hover{ transform:translateY(-6px); }
.vision-card-coral{ background:var(--accent-coral); }
.vision-card-coral .eyebrow, .vision-card-coral .eyebrow-dash{  background:rgba(255,255,255,.85); }
.vm-mark{ position:absolute; top:-30px; right:-30px; width:120px; height:120px; border:2px solid rgba(255,255,255,.15); border-radius:50%; }
.vision-card h3{ color:#fff; font-size:clamp(1.2rem,2vw,1.5rem); font-weight:500; line-height:1.5; margin-top:20px; font-family:var(--font-body); position:relative; }

/* =========================================================
   WHY US
   ========================================================= */
.why-us{ background:var(--bg-light); }
.why-grid{
  max-width:var(--container); margin:0 auto; display:grid;
  grid-template-columns:repeat(4, 1fr); grid-auto-rows:minmax(200px,auto); gap:2px;
  background:var(--border);
}
.why-item{
  background:var(--card); padding:32px; grid-column:span 1;
  transition:background-color .3s, transform .3s;
}
.why-item--wide{ grid-column:span 2; }
.why-item:hover{ background:var(--navy); transform:translateY(-4px); }
.why-item:hover h3, .why-item:hover p{ color:#fff; }
.why-item:hover .why-icon{ color:var(--accent-coral); }
.why-icon{ width:38px; height:38px; color:var(--navy); margin-bottom:20px; transition:color .3s; }
.why-item h3{ font-size:1.08rem; margin-bottom:10px; transition:color .3s; }
.why-item p{ color:var(--text-secondary); font-size:.92rem; transition:color .3s; }

/* =========================================================
   TREATMENTS
   ========================================================= */
.treatments{ background:var(--bg); }
.treat-tabs{
  max-width:var(--container); margin:0 auto 0; display:flex; flex-wrap:wrap; border-bottom:2px solid var(--navy);
}
.treat-tab{
  font-family:var(--font-mono); font-size:.82rem; font-weight:600; letter-spacing:.03em;
  padding:16px 26px; color:var(--text-secondary); border-bottom:3px solid transparent; margin-bottom:-2px;
  transition:color .25s, border-color .25s;
}
.treat-tab.is-active{ color:var(--navy); border-color:var(--accent-coral); }
.treat-tab:hover{ color:var(--navy); }
.treat-accordion{ display:grid; gap:0; margin-top:0; }
.proc-item{ border-top:1px solid var(--border); }
.proc-item:last-child{ border-bottom:1px solid var(--border); }

.proc-head{
  width:100%; display:flex; justify-content:space-between; align-items:center;
  text-align:left; padding:20px 4px; font-family:var(--font-display); font-weight:600;
  font-size:1rem; color:var(--navy); transition:color .25s;
}
.proc-item.is-active .proc-head{ color:var(--accent-coral); }

.proc-icon{ position:relative; width:18px; height:18px; flex:none; margin-left:20px; }
.proc-icon::before,.proc-icon::after{ content:''; position:absolute; background:var(--accent-coral); transition:transform .3s; }
.proc-icon::before{ width:18px; height:2px; top:8px; left:0; }
.proc-icon::after{ width:2px; height:18px; top:0; left:8px; }
.proc-item.is-active .proc-icon::after{ transform:rotate(90deg); opacity:0; }

.proc-body{ max-height:0; overflow:hidden; transition:max-height .4s ease, padding .4s ease; }
.proc-item.is-active .proc-body{ max-height:320px; padding-bottom:22px; }

.proc-block{ margin-top:14px; }
.proc-block:first-child{ margin-top:0; }
.proc-label{
  font-family:var(--font-mono); font-size:.7rem; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent-coral); margin-bottom:6px;
}
.proc-block p:not(.proc-label){ color:var(--text-secondary); font-family: var(--font-mono); font-size:.9rem; line-height:1.6; max-width:480px; }

.treat-panels{ max-width:var(--container); margin:0 auto; }
.treat-panel{ display:none; grid-template-columns:.9fr 1.1fr; gap:60px; padding-top:56px; align-items:start; }
.treat-panel.is-active{ display:grid; animation:fadeUp .5s ease; }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px);} to{ opacity:1; transform:translateY(0);} }
.treat-panel-media img{  aspect-ratio:5/4; object-fit:cover; }
.treat-list{ display:grid; grid-template-columns:1fr 1fr; gap:0; }
.treat-list li{
  padding:18px 0 18px 24px; border-top:1px solid var(--border); font-weight:500; color:var(--text);
  position:relative;
}
.treat-list li::before{ content:''; position:absolute; left:0; top:26px; width:8px; height:8px; background:var(--accent-coral); }

/* =========================================================
   PROCESS
   ========================================================= */
.process{ background:var(--navy); overflow:hidden; }
.process::before{
  content:''; position:absolute; top:0; right:0; width:340px; height:340px;
  background:var(--luxury-blue); opacity:.5; transform:rotate(15deg) translate(30%,-30%);
}
.process-timeline{
  max-width:var(--container); margin:0 auto; position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(6,1fr); gap:20px;
}
.process-timeline::before{
  content:''; grid-column:1/-1; grid-row:1; height:2px; background:rgba(255,255,255,.2);
  margin-top:11px;
}
.process-step{ position:relative; padding-top:36px; }
.ps-num{
  position:absolute; top:0; left:0; font-family:var(--font-mono); font-weight:600; font-size:.85rem;
  color:var(--navy); background:rgba(255,255,255,.4); width:24px; height:24px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; transition:background-color .3s, color .3s;
}
.process-step.is-active .ps-num, .process-step:hover .ps-num{ background:var(--accent-coral); color:#fff; }
.process-step h3{ color:#fff; font-size:1rem; margin-bottom:10px; }
.process-step p{ color:rgba(255,255,255,.6); font-size:.86rem; }

/* =========================================================
   DOCTORS
   ========================================================= */
.doctors{ background:var(--bg-light); }
.doctors-grid{ max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.doctor-card{ background:var(--card); border:1px solid var(--border); }
.doctor-card--offset{ margin-top:44px; }

.doctor-photo-wrap{ position:relative; }
.doctor-photo{ overflow:hidden; aspect-ratio:5/6; }
.doctor-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.2,.8,.2,1), filter .5s; }
.doctor-card:hover .doctor-photo img{ transform:scale(1.06); filter:grayscale(0); }

.doctor-info{ padding:26px 24px; }
.doctor-info h3{ font-size:1.12rem; margin-bottom:4px; }
.doctor-role{ font-family:var(--font-mono); font-size:.74rem; color:var(--accent-coral); margin-bottom:10px; }

.doctor-expertise{ color:var(--text-secondary); font-size:.88rem; line-height:1.6; margin-bottom:20px; }
.de-label{ display:block; font-family:var(--font-mono); font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--navy); margin-bottom:4px; }

.doctor-card--no-photo .doctor-info{ padding-top:32px; }

.doctor-profile-trigger{
  position:absolute; left:16px; bottom:16px; z-index:2;
  font-family:var(--font-mono); font-size:.7rem; font-weight:600; letter-spacing:.04em;
  color:#fff; background:rgba(24,0,66,.55); backdrop-filter:blur(6px);
  padding:9px 16px; border-radius:30px; border:1px solid rgba(255,255,255,.3);
  transition:background-color .25s, transform .25s;
  cursor:pointer;
}
.doctor-profile-trigger:hover{ background:var(--accent-coral); transform:translateY(-2px); }

/* ---------- Bio panel as a centered MODAL (no grid overlap, ever) ---------- */
.doctor-bio-overlay{
  position:fixed; inset:0; z-index:1000;
  background:rgba(24,0,66,.55);
  backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  opacity:0; visibility:hidden;
  transition:opacity .35s ease, visibility 0s linear .35s;
}
.doctor-bio-overlay.is-open{
  opacity:1; visibility:visible;
  transition:opacity .35s ease, visibility 0s linear 0s;
}

.doctor-bio-panel{
  position:relative;
  width:440px; max-width:100%;
  max-height:min(600px, 80vh);
  background:var(--navy);
  box-shadow:0 20px 60px rgba(24,0,66,.35);
  padding:36px 28px 28px;
  display:flex; flex-direction:column;
  transform:translateY(24px) scale(.97);
  opacity:0;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), opacity .35s ease;
}
.doctor-bio-overlay.is-open .doctor-bio-panel{
  transform:translateY(0) scale(1);
  opacity:1;
}

.doctor-bio-close{
  position:absolute; top:16px; right:16px; z-index:4;
  width:32px; height:32px; border-radius:50%;
  color:#fff; font-size:1.3rem; line-height:1;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.3);
  background:transparent;
  transition:background-color .25s, border-color .25s;
  cursor:pointer;
}
.doctor-bio-close:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.5); }

.doctor-bio-scroll{ overflow-y:auto; padding-right:6px; }
.doctor-bio-scroll::-webkit-scrollbar{ width:4px; }
.doctor-bio-scroll::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); border-radius:4px; }

.doctor-bio-panel h4{ color:#fff; font-size:1.1rem; margin-bottom:4px; }
.doctor-bio-role{ font-family:var(--font-mono); font-size:.7rem; color:var(--accent-coral); letter-spacing:.05em; text-transform:uppercase; margin-bottom:16px; }
.doctor-bio-panel p{ color:rgba(255,255,255,.8); font-size:.86rem; line-height:1.65; margin-bottom:14px; }
.doctor-bio-panel p:last-child{ margin-bottom:0; }
.doctor-bio-panel ul{ color:rgba(255,255,255,.8); font-size:.86rem; line-height:1.7; margin:0 0 14px 18px; }
.doctor-bio-panel ul li{ margin-bottom:4px; }

body.doctor-modal-open{ overflow:hidden; }

@media (max-width:860px){
  .doctor-card--no-photo .doctor-info{ padding-top:26px; }
  .doctor-profile-trigger{
    position:static; display:block; width:100%; text-align:center;
    border-radius:0; background:var(--navy); border:none; padding:14px 16px;
  }
  .doctor-profile-trigger:hover{ background:var(--accent-coral); transform:none; }
  .doctor-bio-panel{ width:100%; padding:28px 20px 20px; }
  .doctor-bio-scroll{ max-height:60vh; }
}
/* =========================================================
   ACHIEVEMENTS
   ========================================================= */
.achievements{ background:var(--bg); }
.achv-slider{ max-width:var(--container); margin:0 auto; position:relative; }
.achv-track{
  display:flex; gap:26px; overflow-x:auto; scroll-snap-type:x mandatory;
  scrollbar-width:none; padding-bottom:6px;
}
.achv-track::-webkit-scrollbar{ display:none; }

.achv-card{
  flex:0 0 min(260px, 70vw); scroll-snap-align:start;
  background:var(--card); border:1px solid var(--border);
  border-radius:16px; overflow:hidden; text-align:left;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
}
.achv-card:hover{ transform:translateY(-6px); box-shadow:0 20px 50px var(--shadow); }

.achv-card img{
  width:100%; aspect-ratio:4/5; object-fit:cover; display:block;
  transition:transform .5s ease;
}
.achv-card:hover img{ transform:scale(1.04); }

.achv-cap{
  display:block; padding:14px 16px; font-family:var(--font-display);
  font-weight:600; font-size:.92rem; color:var(--navy);
}
.achv-cap em{ font-style:normal; color:var(--accent-coral); }

.achv-controls{ display:flex; gap:14px; margin-top:24px; }
.achv-controls button{
  width:44px; height:44px; border:1px solid var(--border); border-radius:50%;
  transition:background-color .25s, color .25s;
}
.achv-controls button:hover{ background:var(--navy); color:#fff; }

/* ---------- Lightbox modal ---------- */
.achv-modal{
  position:fixed; inset:0; z-index:1500; background:rgba(24,0,66,.92);
  display:none; align-items:center; justify-content:center; padding:40px;
}
.achv-modal.is-open{ display:flex; }
.achv-modal-inner{ max-width:600px; width:100%; }
.achv-modal-inner img{
  width:100%; max-height:85vh; object-fit:contain; border-radius:12px;
  box-shadow:0 30px 80px rgba(0,0,0,.4);
}
.achv-modal-close{
  position:absolute; top:24px; right:28px; color:#fff; font-size:2.2rem;
  line-height:1; z-index:1501;
}

@media (max-width:560px){
  .achv-card{ flex:0 0 78vw; }
}
/* =========================================================
   VIDEO REVIEWS
   ========================================================= */
.video-reviews{ background:var(--bg); }
.video-slider{ max-width:var(--container); margin:0 auto; position:relative; }
.video-track{ display:flex; gap:26px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:10px; }
.video-track::-webkit-scrollbar{ display:none; }
.video-slide{ flex:0 0 min(420px, 80vw); scroll-snap-align:start; }
.video-thumb{
    position: relative;
    background:linear-gradient(180deg,#f8fafc,#eef2f7);
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 16 / 10; /* Keeps all cards the same size */
}

.video-thumb video{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}
.video-thumb:hover img{ transform:scale(1.05); }
.play-btn{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:40px; height:40px; border-radius:50%; background:var(--accent-coral); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1rem;
  box-shadow:0 8px 24px var(--shadow);
}
.video-cap{ margin-top:14px; font-weight:500; color:var(--navy); font-size:.94rem; }
.video-controls{ display:flex; gap:14px; margin-top:24px; }
.video-controls button{
  width:44px; height:44px; border:1px solid var(--border); border-radius:50%; transition:background-color .25s, color .25s;
}
.video-controls button:hover{ background:var(--navy); color:#fff; }

.video-modal{ position:fixed; inset:0; z-index:1500; background:rgba(14,37,81,.92); display:none; align-items:center; justify-content:center; padding:40px; }
.video-modal.is-open{ display:flex; }
.video-modal-inner{ width:100%; max-width:900px; }
.video-modal-frame{
    background:#000;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:20px;
    overflow:hidden;
}

.video-modal-frame video{
    max-width:100%;
    max-height:85vh;
    width:auto;
    height:auto;
    object-fit:contain;
}
.video-modal-close{ color:#fff; font-size:2rem; float:right; margin-bottom:10px; }

/* =========================================================
   TESTIMONIALS
   ========================================================= */
.testimonials{ background:var(--luxury-blue); }
.testimonials-inner{ max-width:820px; margin:0 auto; text-align:center; }
.testi-track{ position:relative; min-height:170px; margin-top:24px; }
.testi-slide{
  position:absolute; inset:0; margin:0; opacity:0; transform:translateY(14px);
  transition:opacity .5s, transform .5s; pointer-events:none;
}
.testi-slide.is-active{ opacity:1; transform:translateY(0); pointer-events:auto; }
.testi-slide p{ font-family:var(--font-display); font-size:clamp(1.2rem,2.4vw,1.6rem); color:#fff; line-height:1.5; font-weight:500; }
.testi-slide cite{ display:block; margin-top:22px; font-style:normal; font-family:var(--font-mono); font-size:.78rem; letter-spacing:.05em; color:rgba(255,255,255,.7); text-transform:uppercase; }
.testi-dots{ display:flex; justify-content:center; gap:10px; margin-top:28px; }
.testi-dots button{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.3); transition:background-color .25s, transform .25s; }
.testi-dots button.is-active{ background:var(--accent-coral); transform:scale(1.3); }
.testi-rating{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin-top:14px; flex-wrap:wrap;
}
.testi-rating-score{ font-family:var(--font-display); font-size:1.6rem; color:#fff; font-weight:600; }
.testi-rating-stars{ color:var(--accent-coral); font-size:1rem; letter-spacing:1px; }
.testi-rating-count{ font-family:var(--font-mono); font-size:.74rem; letter-spacing:.04em; color:rgba(255,255,255,.65); text-transform:uppercase; }

/* =========================================================
   JOURNAL / BLOG
   ========================================================= */


/* =========================================================
   FAQ
   ========================================================= */
.faq{ background:var(--bg-light); }
.faq-list{ max-width:860px; margin:0 auto; }
.faq-item{ border-bottom:1px solid var(--border); }
.faq-item:first-child{ border-top:1px solid var(--border); }
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:center; text-align:left;
  padding:24px 4px; font-family:var(--font-display); font-weight:600; font-size:1.02rem; color:var(--navy);
}
.faq-icon{ position:relative; width:18px; height:18px; flex:none; margin-left:20px; }
.faq-icon::before,.faq-icon::after{ content:''; position:absolute; background:var(--accent-coral); transition:transform .3s; }
.faq-icon::before{ width:18px; height:2px; top:8px; left:0; }
.faq-icon::after{ width:2px; height:18px; top:0; left:8px; }
.faq-item.is-active .faq-icon::after{ transform:rotate(90deg); opacity:0; }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .4s ease, padding .4s ease; }
.faq-item.is-active .faq-a{ max-height:220px; padding-bottom:24px; }
.faq-a p{ color:var(--text-secondary); max-width:640px; }

/* =========================================================
   CONTACT
   ========================================================= */
.contact--top{ padding-top:100px; }

.contact-grid--flanked{
  display:grid;
  grid-template-columns: 306px minmax(0, 580px);
  gap:4px;
  align-items:stretch;
  max-width: 900px;
  margin: 0 auto;
}

.contact-photo{
  position:relative;              /* added — required so overlay can be absolutely positioned inside */
  overflow:hidden;
  border:1px solid var(--border);
}
.contact-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  min-height:520px;
  transition:filter .5s, transform .5s;
}
.contact-photo:hover img{
  transform:scale(1.04);
}

/* ---- expertise overlay ---- */
.contact-photo-overlay{
  position:absolute;
  inset:auto 0 0 0;
  padding:70px 26px 24px;
  background:linear-gradient(
    to top,
    rgba(24,0,66,.92) 0%,
    rgba(24,0,66,.75) 35%,
    rgba(24,0,66,.25) 70%,
    rgba(24,0,66,0) 100%
  );
  opacity:0;
  transform:translateY(10px);
  animation:cpoFadeIn .8s ease forwards;
  animation-delay:.3s;
  z-index:2;                      /* keeps overlay above the zoomed image on hover */
}

@keyframes cpoFadeIn{
  to{ opacity:1; transform:translateY(0); }
}
.cpo-name{
  color:#fff;
  font-size:1.25rem;
  font-weight:600;
  margin-bottom:2px;
  line-height:1.25;
}

.cpo-role{
  font-family:var(--font-mono);
  font-size:.76rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(255,255,255,.75);
  margin-bottom:16px;
}

.cpo-label{
  display:block;
  font-family:var(--font-mono);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent-coral);
  margin-bottom:12px;
}

.cpo-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.cpo-tag{
  font-size:.78rem;
  font-weight:500;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.35);
  padding:6px 13px;
  border-radius:30px;
  backdrop-filter:blur(4px);
  transition:background-color .25s, border-color .25s, transform .25s;
}

.contact-photo:hover .cpo-tag{
  background:rgba(255,255,255,.18);
}
.cpo-tag:hover{
  background:var(--accent-coral);
  border-color:var(--accent-coral);
  transform:translateY(-2px);
}

@media (prefers-reduced-motion:reduce){
  .contact-photo-overlay{ animation:none; opacity:1; transform:none; }
}

@media (max-width:600px){
  .contact-photo-overlay{ padding:50px 18px 18px; }
  .cpo-tag{ font-size:.72rem; padding:5px 11px; }
}

.contact-quickinfo{
  margin-top:18px; display:flex; align-items:center; gap:10px; justify-content:center;
  font-family:var(--font-mono); font-size:.78rem; color:var(--text-secondary);
}
.contact-quickinfo a{ color:var(--navy); font-weight:600; }
.contact-quickinfo a:hover{ color:var(--accent-coral); }
.ci-dot{ width:4px; height:4px; border-radius:50%; background:var(--accent-coral); display:inline-block; }

.contact-form{
  background:var(--card); border:1px solid var(--border); padding:44px; box-shadow:0 20px 60px var(--shadow);
}
.contact-form h3{ font-size:1.3rem; margin-bottom:26px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-field{ margin-bottom:20px; }
.form-field label{ display:block; font-size:.82rem; font-weight:500; color:var(--navy); margin-bottom:8px; }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding:13px 14px; border:1.5px solid var(--border); background:var(--bg-light);
  transition:border-color .25s; resize:vertical;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{ outline:none; border-color:var(--accent-coral); }
.form-error{ display:none; color:var(--accent-coral); font-size:.78rem; margin-top:6px; }
.form-field.is-invalid input, .form-field.is-invalid select{ border-color:var(--accent-coral); }
.form-field.is-invalid .form-error{ display:block; }
.form-success{ display:none; margin-top:16px; color:var(--luxury-blue); font-size:.88rem; font-weight:500; text-align:center; }
.form-success.is-visible{ display:block; }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{
  position:relative;
  background:
    linear-gradient(135deg, rgba(255,255,255,.65), rgba(255,255,255,.35)),
    var(--bg-light, #eef1f6);
  color:var(--navy);
  padding:80px var(--edge) 0;
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
  border-top:1px solid rgba(255,255,255,.6);
  overflow:hidden;
}

/* subtle glow blobs behind the glass for depth — purely decorative */
.site-footer::before,
.site-footer::after{
  content:"";
  position:absolute; border-radius:50%;
  filter:blur(60px);
  z-index:0;
  pointer-events:none;
}
.site-footer::before{
  width:340px; height:340px; top:-120px; left:-80px;
  background:rgba(255,111,97,.18); /* soft coral glow, adjust to your accent-coral */
}
.site-footer::after{
  width:380px; height:380px; bottom:-160px; right:-100px;
  background:rgba(24,0,66,.10); /* soft navy glow */
}

.footer-grid{
  position:relative; z-index:1;
  max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:50px;
  padding:44px 40px 60px;
  margin-bottom:0;
  background:rgba(255,255,255,.45);
  border:1px solid rgba(255,255,255,.7);
  border-bottom:1px solid rgba(24,0,66,.1);
  border-radius:24px 24px 0 0;
  box-shadow:0 8px 32px rgba(24,0,66,.06), inset 0 1px 0 rgba(255,255,255,.8);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.logo-text--dark{ color:var(--navy); }
.footer-brand p{ margin-top:18px; max-width:280px; font-size:.9rem; color:var(--navy); opacity:.8; }

.footer-col h4{
  color:var(--navy); font-size:.85rem; letter-spacing:.04em; text-transform:uppercase;
  margin-bottom:20px; font-family:var(--font-mono);
}
.footer-col ul li{ margin-bottom:12px; font-size:.9rem; }
.footer-col ul a{ color:var(--navy); opacity:.8; transition:color .2s, opacity .2s; }
.footer-col ul a:hover{ color:var(--accent-coral); opacity:1; }

.footer-bottom{
  position:relative; z-index:1;
  max-width:var(--container); margin:0 auto;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  padding:22px 40px;
  font-size:.82rem; color:var(--navy); opacity:.75;
  background:rgba(255,255,255,.55);
  border-radius:0 0 24px 24px;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.footer-legal{ display:flex; gap:24px; }
.footer-legal a{ color:var(--navy); }
.footer-legal a:hover{ color:var(--accent-coral); }

/* =========================================================
   CTA CONTACT — floating cards
   ========================================================= */
.cta-contact{
  position:relative;
  background:var(--luxury-blue);
  padding:100px var(--edge) 130px;
  overflow:hidden;
}
.cta-contact-inner{ max-width:var(--container); margin:0 auto; text-align:center; }
.cta-contact h2{
  color:#fff; margin-top:14px; font-size:clamp(1.6rem,3.4vw,2.4rem); line-height:1.25;
}

.cta-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:32px;
  margin-top:56px;
}

.cta-card{
  position:relative;
  background:#fff;
  border-radius:20px;
  padding:34px 28px 30px;
  text-align:left;
  box-shadow:0 20px 50px rgba(24,0,66,.18);
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s;
  animation:ctaFloat 6s ease-in-out infinite;
}
.cta-card:hover{
  transform:translateY(-10px);
  box-shadow:0 28px 60px rgba(24,0,66,.24);
}

/* staggered floating animation so cards don't move in unison */
.cta-card--float-1{ animation-delay:0s; }
.cta-card--float-2{ animation-delay:1.2s; }
.cta-card--float-3{ animation-delay:2.4s; }

@keyframes ctaFloat{
  0%, 100%{ transform:translateY(0); }
  50%{ transform:translateY(-12px); }
}

.cta-card-icon{
  width:52px; height:52px; border-radius:14px;
  background:rgba(255,111,97,.12);
  color:var(--accent-coral);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:20px;
}
.cta-card-icon svg{ width:26px; height:26px; }

.cta-card h3{ font-size:1.1rem; color:var(--navy); margin-bottom:8px; }
.cta-card p{ font-size:.88rem; color:var(--text-secondary); line-height:1.6; margin-bottom:22px; }

.cta-card-link{
  display:flex; flex-direction:column; gap:2px;
  padding-top:16px; border-top:1px solid var(--border);
  color:var(--navy); text-decoration:none;
}
.cta-card-link span:first-child{
  font-family:var(--font-mono); font-size:.78rem; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; color:var(--accent-coral);
  display:flex; align-items:center; gap:6px;
}
.cta-card-link span:first-child::after{ content:"→"; transition:transform .25s; }
.cta-card:hover .cta-card-link span:first-child::after{ transform:translateX(4px); }
.cta-card-detail{ font-size:.86rem; color:var(--navy); opacity:.75; }

@media (max-width:860px){
  .cta-cards{ grid-template-columns:1fr; gap:22px; }
  .cta-card{ animation:none; } /* keep it calm/stacked on mobile */
}

@media (prefers-reduced-motion:reduce){
  .cta-card{ animation:none; }
}
.cta-card{
  position:relative;
  background:#fff;
  border-radius:20px;
  padding:0 28px 30px;
  text-align:left;
  box-shadow:0 20px 50px rgba(24,0,66,.18);
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s;
  animation:ctaFloat 6s ease-in-out infinite;
  overflow:hidden;
}
.cta-card:hover{
  transform:translateY(-10px);
  box-shadow:0 28px 60px rgba(24,0,66,.24);
}

.cta-card--float-1{ animation-delay:0s; }
.cta-card--float-2{ animation-delay:1.2s; }
.cta-card--float-3{ animation-delay:2.4s; }

@keyframes ctaFloat{
  0%, 100%{ transform:translateY(0); }
  50%{ transform:translateY(-12px); }
}

.cta-card-media{
  width:calc(100% + 56px);
  margin:0 -28px 22px;
  aspect-ratio:16/10;
  overflow:hidden;
}
.cta-card-media img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(.9);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.cta-card:hover .cta-card-media img{ transform:scale(1.05); }

.cta-card h3{ font-size:1.05rem; color:var(--navy); margin-bottom:8px; line-height:1.35; }
.cta-card p{ font-size:.86rem; color:var(--text-secondary); line-height:1.6; margin-bottom:22px; }

.cta-card-link{
  display:flex; flex-direction:column; gap:2px;
  padding-top:16px; border-top:1px solid var(--border);
  color:var(--navy); text-decoration:none;
}
.cta-card-link span:first-child{
  font-family:var(--font-mono); font-size:.78rem; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; color:var(--accent-coral);
  display:flex; align-items:center; gap:6px;
}
.cta-card-link span:first-child::after{ content:"→"; transition:transform .25s; }
.cta-card:hover .cta-card-link span:first-child::after{ transform:translateX(4px); }
.cta-card-detail{ font-size:.86rem; color:var(--navy); opacity:.75; }

@media (max-width:860px){
  .cta-cards{ grid-template-columns:1fr; gap:22px; }
  .cta-card{ animation:none; }
}
@media (prefers-reduced-motion:reduce){
  .cta-card{ animation:none; }
}

/* =========================================================
   FLOATING WIDGETS
   ========================================================= */
.fab{
  position:fixed; z-index:800; width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; box-shadow:0 10px 30px var(--shadow);
  transition:transform .3s, opacity .3s;
}
.fab-whatsapp{ background:#25D366; color:#fff; right:28px; bottom:28px; }
.fab-whatsapp svg{ width:28px; height:28px; }
.fab-whatsapp:hover{ transform:scale(1.08); }
.fab-instagram{
  right:28px; bottom:96px; color:#fff;
  background:radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.fab-instagram svg{ width:24px; height:24px; }
.fab-instagram:hover{ transform:scale(1.08); }
.fab-top{ background:var(--navy); color:#fff; right:28px; bottom:164px; font-size:1.1rem; opacity:0; pointer-events:none; }
.fab-top.is-visible{ opacity:1; pointer-events:auto; }
.fab-top:hover{ background:var(--accent-coral); }

.chatbot{ position:fixed; right:28px; bottom:232px; z-index:800; }
.chatbot-toggle{
  width:56px; height:56px; border-radius:50%; background:var(--accent-coral); color:#fff; font-size:1.3rem;
  box-shadow:0 10px 30px var(--shadow); transition:transform .3s;
}
.chatbot-toggle:hover{ transform:scale(1.08); }
.chatbot-window{
  position:absolute; right:0; bottom:72px; width:320px; max-height:0; overflow:hidden;
  background:var(--card); box-shadow:0 20px 60px var(--shadow); border:1px solid var(--border);
  transition:max-height .35s ease, opacity .3s; opacity:0;
}
.chatbot-window.is-open{ max-height:480px; opacity:1; }
.chatbot-header{ background:var(--navy); color:#fff; padding:16px 18px; display:flex; justify-content:space-between; align-items:center; font-family:var(--font-display); font-weight:600; font-size:.9rem; }
.chatbot-header button{ color:#fff; font-size:1.2rem; }
.chatbot-body{ padding:16px 18px; height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:10px; }
.chat-msg{ font-size:.86rem; padding:10px 14px; max-width:85%; line-height:1.4; }
.chat-msg--bot{ background:var(--bg-light); align-self:flex-start; }
.chat-msg--user{ background:var(--accent-coral); color:#fff; align-self:flex-end; }
.chatbot-quick{ display:flex; flex-wrap:wrap; gap:8px; padding:0 18px 14px; }
.chatbot-quick button{ font-size:.72rem; border:1px solid var(--border); padding:7px 10px; color:var(--navy); transition:background-color .2s; }
.chatbot-quick button:hover{ background:var(--bg-light); }
.chatbot-input{ display:flex; border-top:1px solid var(--border); }
.chatbot-input input{ flex:1; border:none; padding:14px 18px; font-size:.86rem; }
.chatbot-input input:focus{ outline:none; }
.chatbot-input button{ padding:0 18px; color:var(--accent-coral); font-size:1.1rem; }

/* =========================================================
   REVEAL ANIMATION
   ========================================================= */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1080px){
  .hero-grid{ grid-template-columns:1fr; }
  /* .hero-visual{ height:440px; order:-1; } */
  .about-grid{ grid-template-columns:1fr; }
  .about-media{ position:static; }
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .why-item--wide{ grid-column:span 2; }
  .doctors-grid{ grid-template-columns:repeat(2,1fr); }
  .doctor-card--offset{ margin-top:0; }
  .journal-grid{ grid-template-columns:repeat(2,1fr); }
  .journal-feature{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .contact-grid--flanked{ grid-template-columns:1fr; }
  .contact-grid--flanked .contact-form{ order:1; }
  .contact-photo--left{ order:2; }
  .contact-photo--right{ order:3; }
  .contact-photo img{ min-height:220px; }
  .process-timeline{ grid-template-columns:repeat(3,1fr); row-gap:40px; }
  .process-timeline::before{ display:none; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 860px){
  section{ padding:80px var(--edge); }
  .main-nav{ position:fixed; top:0; right:0; height:100vh; width:min(320px,80vw); background:var(--navy); transform:translateX(100%); transition:transform .35s; padding:110px 32px; z-index:850; }
  .main-nav.is-open{ transform:translateX(0); }
  .main-nav ul{ flex-direction:column; gap:22px; }
  .main-nav a{ color:#fff !important; font-size:1.05rem; }
  .nav-toggle{ display:flex; }
  .header-actions .btn-ghost{ display:none; }
  .why-grid{ grid-template-columns:1fr 1fr; }
  .treat-panel{ grid-template-columns:1fr; }
  .treat-list{ grid-template-columns:1fr; }
  .doctors-grid{ grid-template-columns:1fr; }
  .journal-grid{ grid-template-columns:1fr 1fr; }
  .form-row{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:36px; }
  .vision-inner{ grid-template-columns:1fr; }
  .contact-info-strip{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 560px){
  .why-grid{ grid-template-columns:1fr; }
  .why-item--wide{ grid-column:span 1; }
  .journal-grid{ grid-template-columns:1fr; }
  .process-timeline{ grid-template-columns:1fr 1fr; }
  .hero-counters{ gap:26px; }
  .glass-card{ display:none; }
  .chatbot-window{ width:88vw; right:-8px; }
}
@media (max-width: 1200px) {
  .about-grid {
    gap: 3rem;
  }

  .about-media {
    max-width: 480px;
  }
}
/* Tablet */
@media (max-width: 992px) {
  .about-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .about-media {
    position: static;
    max-width: 500px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .about-media {
    max-width: 100%;
  }
}

/* Small Mobile */
@media (max-width: 480px) {
  .about-grid {
    gap: 2rem;
  }

  .about-media img {
    border-radius: 16px;
  }
}

.map-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 28px;
    border-radius:50px;
    background:#007fc1;   /* was #0E2551 */
    color:#fff;
    text-decoration:none;
    font-weight:600;
    margin-top:20px;
    transition:.3s;
}

.map-btn:hover{
    background:#ff0046;   /* was #E26D5A */
}
.contact-map{
    width:100%;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.08);
}

.map-container{
    width:100%;
    height:450px;
    overflow:hidden;
}

.map-container iframe{
    width:100%;
    height:100%;
    border:0;
    display:block;
}
.footer-social .social-links {
    display: flex;
    gap: 14px;
    margin-top: 20px;
    flex-wrap: wrap;
}

.footer-social .social-links a {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;

    background: transparent;

    color: #fff !important;
    text-decoration: none;

    transition: all .3s ease;
}

.footer-social .social-links a i {
    color: #fff !important;
    font-size: 20px;
    display: block;
    line-height: 1;
    opacity: 1 !important;
    visibility: visible !important;
}

.contact-info-strip{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:24px;
  margin-top:30px;
}
.contact-info-strip h4{ font-size:.86rem; margin-bottom:8px; color:var(--navy); }
.contact-info-strip p{ font-size:.9rem; color:var(--text-secondary); }
.contact-info-strip a{ color:var(--text-secondary); }
.contact-info-strip a:hover{ color:var(--accent-coral); }

@media (max-width: 700px){
  .contact-info-strip{ grid-template-columns: 1fr; }
}