/* =====================================================
   BARIATRIC NEPAL — Surgery Pages v1.0.2
===================================================== */
.bnsurg-wrap {
  --navy:#1B2D6B; --green:#4CAF50; --red:#E53E3E;
  --white:#fff; --light:#F4F8FC; --text:#4a5568; --border:#e2eaf4;
  --fh:'Montserrat',sans-serif; --fb:'Open Sans',sans-serif;
  font-family:var(--fb); color:var(--navy); background:var(--white);
  width:100vw!important; max-width:100vw!important;
  position:relative!important; left:50%!important; right:50%!important;
  margin-left:-50vw!important; margin-right:-50vw!important;
  margin-top:0!important; margin-bottom:0!important;
  padding:0!important; box-sizing:border-box; display:block;
  overflow-x:hidden;
}
.bnsurg-container { max-width:1200px; margin:0 auto; padding:0 32px; box-sizing:border-box; }
.bnsurg-section { padding:56px 0; }
.bnsurg-bg-light { background:var(--light); }
.bnsurg-section-title {
  font-family:var(--fh); font-weight:800; font-size:clamp(20px,2.5vw,28px);
  color:var(--navy); text-align:center; margin:0 0 8px;
}
.bnsurg-section-title::after { content:''; display:block; width:40px; height:3px; background:var(--green); margin:8px auto 0; border-radius:2px; }
.bnsurg-section-sub { text-align:center; color:var(--text); font-size:14px; margin:0 0 36px; }

/* ── HERO ── */
.bnsurg-hero {
  position:relative; min-height:400px;
  background:#1a2f6e center/cover no-repeat;
  display:flex; align-items:center;
}
.bnsurg-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(105deg,rgba(10,22,70,.80) 0%,rgba(14,30,80,.60) 45%,rgba(14,30,80,.25) 75%,transparent 100%);
}
.bnsurg-hero-content { position:relative; z-index:1; max-width:600px; padding:70px 0; }
.bnsurg-badge {
  display:inline-block; background:var(--navy); color:#fff;
  font-family:var(--fh); font-size:11px; font-weight:700; letter-spacing:1.5px;
  padding:5px 14px; border-radius:4px; margin-bottom:16px;
}
.bnsurg-hero-content h1 { font-family:var(--fh); font-weight:800; font-size:clamp(28px,4vw,48px); color:#fff; margin:0 0 16px; line-height:1.12; text-shadow:0 2px 14px rgba(0,0,0,.25); }
.bnsurg-hero-suffix { display:block; }
.bnsurg-hero-content p { font-size:15px; color:rgba(255,255,255,.88); line-height:1.65; margin:0 0 28px; }
/* Hero buttons — always one row, never wrap */
.bnsurg-hero-btns { display:flex; gap:12px; flex-wrap:nowrap; align-items:center; }
.bnsurg-btn-red { display:inline-flex; align-items:center; gap:8px; background:var(--red); color:#fff!important; font-family:var(--fh); font-weight:700; font-size:13px; padding:13px 22px; border-radius:6px; text-decoration:none!important; transition:filter .2s,transform .15s; white-space:nowrap; }
.bnsurg-btn-red:hover { filter:brightness(1.1); transform:translateY(-1px); color:#fff!important; }
.bnsurg-btn-outline-white { display:inline-flex; align-items:center; gap:8px; border:2px solid rgba(255,255,255,.7); color:#fff!important; font-family:var(--fh); font-weight:700; font-size:13px; padding:11px 20px; border-radius:6px; text-decoration:none!important; transition:background .2s,transform .15s; white-space:nowrap; }
.bnsurg-btn-outline-white:hover { background:rgba(255,255,255,.15); transform:translateY(-1px); }
/* Button label toggling: full text desktop, short text mobile */
.bnsurg-btn-short { display:none; }
.bnsurg-btn-full  { display:inline; }

/* ── HOW IT WORKS ── */
.bnsurg-steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.bnsurg-how-card { text-align:center; padding:20px 16px; }
.bnsurg-how-illustration { position:relative; display:inline-flex; margin-bottom:16px; }
/* Real image icon */
.bnsurg-how-img {
  width:80px; height:80px; border-radius:50%;
  object-fit:cover; object-position:center;
  border:3px solid #FFF5F2;
  box-shadow:0 2px 12px rgba(27,45,107,.15);
}
.bnsurg-step-num {
  position:absolute; bottom:-6px; right:-6px;
  width:24px; height:24px; background:var(--navy); color:#fff;
  border-radius:50%; font-family:var(--fh); font-weight:800; font-size:12px;
  display:flex; align-items:center; justify-content:center;
}
.bnsurg-how-card h3 { font-family:var(--fh); font-weight:700; font-size:14px; color:var(--navy); margin:0 0 8px; }
.bnsurg-how-card p { font-size:13px; color:var(--text); line-height:1.65; margin:0; }

/* ── WHY CHOOSE ── */
.bnsurg-why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.bnsurg-why-card { background:var(--white); border:1px solid var(--border); border-radius:12px; padding:22px 16px; text-align:center; transition:box-shadow .2s,transform .2s; }
.bnsurg-why-card:hover { box-shadow:0 6px 24px rgba(27,45,107,.11); transform:translateY(-2px); }
.bnsurg-why-icon svg { width:52px; height:52px; margin-bottom:12px; }
.bnsurg-why-card h3 { font-family:var(--fh); font-weight:700; font-size:13px; color:var(--navy); margin:0 0 8px; }
.bnsurg-why-card p { font-size:12px; color:var(--text); line-height:1.6; margin:0; }

/* ── RESULTS ── */
.bnsurg-results-grid { display:grid; grid-template-columns:300px 1fr; gap:36px; align-items:start; }
.bnsurg-before-after { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bnsurg-ba-img {
  border-radius:10px; overflow:hidden; position:relative; min-height:220px;
  background:linear-gradient(160deg,#c8dff0,#b0ccdf);
  display:flex; flex-direction:column; justify-content:flex-end; padding:12px;
}
.bnsurg-ba-label { font-size:11px; font-weight:700; color:rgba(255,255,255,.9); font-family:var(--fh); background:rgba(0,0,0,.35); padding:3px 8px; border-radius:3px; align-self:flex-start; }
.bnsurg-ba-weight { font-family:var(--fh); font-weight:800; font-size:18px; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.4); margin-top:4px; }
.bnsurg-results-right { display:flex; flex-direction:column; gap:20px; }
.bnsurg-chart-area { background:var(--light); border-radius:10px; padding:16px 16px 8px; }
.bnsurg-chart-label { font-family:var(--fh); font-weight:700; font-size:12px; color:var(--navy); margin:0 0 8px; }
.bnsurg-chart-svg { width:100%; display:block; }
.bnsurg-chart-x-label { font-size:10px; color:#aaa; text-align:center; margin-top:2px; }
.bnsurg-stats-pills { display:flex; gap:12px; }
.bnsurg-pill { flex:1; background:var(--light); border-radius:8px; padding:12px 14px; }
.bnsurg-pill span { font-size:11.5px; color:var(--text); display:block; margin-bottom:3px; }
.bnsurg-pill strong { font-family:var(--fh); font-size:18px; display:block; }
.bnsurg-green { color:var(--green); }
/* Testimonial block */
.bnsurg-testi-block { background:var(--light); border-radius:10px; padding:16px 18px; border-left:3px solid var(--navy); }
.bnsurg-testi-person { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.bnsurg-testi-avatar { width:48px; height:48px; border-radius:50%; object-fit:cover; object-position:top; border:2px solid var(--navy); flex-shrink:0; }
.bnsurg-qmark { font-size:40px; line-height:.7; color:var(--navy); opacity:.15; font-family:Georgia,serif; }
.bnsurg-testi-block p { font-size:13px; color:var(--text); font-style:italic; line-height:1.7; margin:4px 0 8px; }
.bnsurg-testi-block span { font-family:var(--fh); font-weight:700; font-size:12px; color:var(--navy); }

/* ── COMPARISON TABLE ── */
.bnsurg-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.bnsurg-table { width:100%; border-collapse:collapse; background:var(--white); border-radius:10px; overflow:hidden; box-shadow:0 2px 12px rgba(27,45,107,.08); }
.bnsurg-table th { background:var(--navy); color:#fff; padding:14px 18px; font-family:var(--fh); font-size:13px; font-weight:700; text-align:left; }
.bnsurg-table td { padding:13px 18px; border-bottom:1px solid var(--border); font-size:13px; }
.bnsurg-table tr:last-child td { border-bottom:none; }
.bnsurg-best-row { background:var(--navy)!important; }
.bnsurg-best-row td { color:#fff; border-bottom:none; }
.bnsurg-best-row td strong { color:#fff; }
.bnsurg-star { font-size:16px; color:#ddd; }
.bnsurg-star.filled { color:#FFB800; }
.bnsurg-best-badge { background:var(--green); color:#fff; font-family:var(--fh); font-weight:700; font-size:11px; padding:3px 10px; border-radius:4px; }
.bnsurg-ref-bad { color:#E53E3E; font-weight:600; }
.bnsurg-ref-neutral { color:var(--text); }

/* ── SURGEON ── */
.bnsurg-surgeon-row { display:grid; grid-template-columns:160px 1fr 200px; gap:32px; align-items:start; background:var(--light); border-radius:14px; padding:32px; }
.bnsurg-surgeon-photo img, .bnsurg-surgeon-placeholder { width:140px; height:175px; border-radius:10px; object-fit:cover; object-position:top; display:block; }
.bnsurg-surgeon-placeholder { background:linear-gradient(160deg,#d4e8f6,#c0d8ec); overflow:hidden; display:flex; align-items:flex-end; justify-content:center; }
.bnsurg-surgeon-info h3 { font-family:var(--fh); font-weight:800; font-size:18px; color:var(--navy); margin:0 0 4px; }
.bnsurg-surgeon-title { font-size:13px; color:var(--green); font-weight:600; margin:0 0 14px; }
.bnsurg-bullets { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.bnsurg-bullets li { display:flex; align-items:flex-start; gap:8px; font-size:12.5px; color:var(--text); line-height:1.5; }
.bnsurg-bullets li svg { flex-shrink:0; margin-top:1px; }
.bnsurg-surgeon-right { display:flex; flex-direction:column; gap:16px; align-items:center; }
.bnsurg-hosp-logo { max-width:140px; max-height:60px; object-fit:contain; }
.bnsurg-hosp-text { display:flex; align-items:center; gap:10px; font-family:var(--fh); font-weight:800; font-size:16px; color:var(--navy); }
.bnsurg-media-logos { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; }
.bnsurg-media-logos img { max-height:26px; max-width:70px; object-fit:contain; filter:grayscale(1) opacity(.6); }
.bnsurg-media-text { font-family:var(--fh); font-weight:800; font-size:11px; color:var(--navy); opacity:.6; border:1.5px solid var(--navy); border-radius:4px; padding:2px 7px; }

/* ── FAQ ── */
.bnsurg-faq { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:0; }
.bnsurg-faq-item { border-bottom:1px solid var(--border); }
.bnsurg-faq-q {
  width:100%; background:none; border:none; padding:16px 4px;
  cursor:pointer; font-family:var(--fh); font-weight:600; font-size:14.5px;
  color:var(--navy); text-align:left; display:flex; justify-content:space-between; align-items:center; gap:12px;
}
.bnsurg-faq-q:hover { color:#142358; }
.bnsurg-faq-arrow { transition:transform .3s; flex-shrink:0; }
.bnsurg-faq-item.open .bnsurg-faq-arrow { transform:rotate(180deg); }
.bnsurg-faq-a { display:none; padding:0 4px 16px; }
.bnsurg-faq-item.open .bnsurg-faq-a { display:block; }
.bnsurg-faq-a p { font-size:13.5px; color:var(--text); line-height:1.75; margin:0; }

/* ── FOOTER CTA ── */
.bnsurg-footer-cta { background:var(--navy); padding:44px 0; text-align:center; }
.bnsurg-footer-cta h2 { font-family:var(--fh); font-weight:800; font-size:26px; color:#fff; margin:0 0 8px; }
.bnsurg-footer-cta p { font-size:15px; color:rgba(255,255,255,.78); margin:0 0 28px; }
.bnsurg-footer-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.bnsurg-btn-wa { display:inline-flex; align-items:center; gap:8px; background:#25D366; color:#fff!important; font-family:var(--fh); font-weight:700; font-size:14px; padding:13px 22px; border-radius:6px; text-decoration:none!important; transition:filter .15s,transform .15s; }
.bnsurg-btn-call { display:inline-flex; align-items:center; gap:8px; background:var(--green); color:#fff!important; font-family:var(--fh); font-weight:700; font-size:14px; padding:13px 22px; border-radius:6px; text-decoration:none!important; transition:filter .15s,transform .15s; }
.bnsurg-btn-wa:hover,.bnsurg-btn-call:hover,.bnsurg-btn-red:hover { filter:brightness(1.1); transform:translateY(-1px); }

/* ══ RESPONSIVE ══ */
@media (max-width:900px) {
  .bnsurg-why-grid { grid-template-columns:repeat(2,1fr); }
  .bnsurg-surgeon-row { grid-template-columns:130px 1fr; }
  .bnsurg-surgeon-right { grid-column:1/-1; flex-direction:row; flex-wrap:wrap; justify-content:flex-start; }
  .bnsurg-results-grid { grid-template-columns:1fr; }
  .bnsurg-before-after { max-width:380px; }
}

/* Testimonial desktop: don't let it stretch beyond container */
@media (min-width:641px) {
  .bnsurg-testi-block { max-width:100%; box-sizing:border-box; overflow:hidden; }
}

@media (max-width:640px) {
  .bnsurg-container { padding:0 16px; }
  /* Sections that ARE the container need horizontal padding too */
  .bnsurg-section.bnsurg-container { padding:36px 16px; }
  .bnsurg-section { padding:36px 0; }

  /* HERO — nothing touches the screen edges */
  .bnsurg-hero { min-height:auto; }
  /* Force horizontal padding directly on hero content so text never bleeds to edge */
  .bnsurg-hero-content { padding:32px 20px 28px; max-width:100%; box-sizing:border-box; }
  .bnsurg-badge { font-size:10px; padding:4px 10px; margin-bottom:10px; }
  .bnsurg-hero-content h1 { font-size:20px; margin-bottom:10px; }
  .bnsurg-hero-content p { font-size:13px; margin-bottom:18px; line-height:1.55; }
  /* Buttons side by side, keep full labels */
  .bnsurg-hero-btns { gap:8px; flex-wrap:nowrap; }
  .bnsurg-btn-short { display:none; }
  .bnsurg-btn-full  { display:inline; }
  .bnsurg-btn-red, .bnsurg-btn-outline-white {
    font-size:12px; padding:10px 14px; gap:6px;
  }

  /* HOW IT WORKS */
  .bnsurg-steps-grid { grid-template-columns:1fr; gap:20px; }

  /* WHY CHOOSE */
  .bnsurg-why-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .bnsurg-why-card { padding:16px 10px; }

  /* RESULTS — chart, pills and testimonial must not touch screen edges */
  .bnsurg-results-grid { grid-template-columns:1fr; gap:20px; }
  .bnsurg-before-after {
    grid-template-columns:1fr 1fr;
    width:100%; box-sizing:border-box;
  }
  .bnsurg-ba-img { min-height:170px; }
  .bnsurg-results-right { width:100%; box-sizing:border-box; }
  .bnsurg-chart-area,
  .bnsurg-stats-pills,
  .bnsurg-testi-block { margin-left:0; margin-right:0; box-sizing:border-box; width:100%; }
  .bnsurg-stats-pills { flex-direction:column; gap:8px; }
  .bnsurg-testi-block { word-break:break-word; overflow:hidden; }

  /* TABLE */
  .bnsurg-table th,.bnsurg-table td { padding:10px 10px; font-size:12px; }

  /* SURGEON */
  .bnsurg-surgeon-row { grid-template-columns:1fr; gap:20px; padding:20px 16px; }
  .bnsurg-surgeon-photo { display:flex; justify-content:center; }
  .bnsurg-surgeon-right { align-items:flex-start; }

  /* FOOTER */
  .bnsurg-footer-btns { flex-direction:column; align-items:center; }
  .bnsurg-btn-wa,.bnsurg-btn-call,.bnsurg-btn-red { width:100%; max-width:280px; justify-content:center; }
}

/* Very small screens: allow buttons to wrap if full text doesn't fit */
@media (max-width:360px) {
  .bnsurg-hero-btns { flex-wrap:wrap; }
  .bnsurg-btn-red, .bnsurg-btn-outline-white {
    font-size:11px; padding:9px 10px; gap:4px; flex:1 1 auto;
  }
}