.elementor-117 .elementor-element.elementor-element-86bf3bd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-17189a5 *//* ==========================================================================
   Dr. Shrinath Viswanath — Book a Consultation
   File: book-consultation.css
   Prefix: bc-
   Tokens live in index.css :root — this file is component-only.
   ========================================================================== */

/* ==========================================================================
   WRAPPER
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&family=Lato:wght@300;400;500;700&display=swap');

/* ==========================================================================
   DESIGN SYSTEM TOKENS  (Global Baseline — Desktop 1280px+)
   Single source of truth for colors, type, spacing, radius and shadow.
   All page-level components consume these tokens via var() rather than
   re-declaring their own copies.
   ========================================================================== */

/* Desktop (≥1280px) uses the :root baseline — no overrides needed */

/* ==========================================================================
   GLOBAL BASE DEFAULTS
   Applied document-wide.
   ========================================================================== */

*, *::before, *::after {
  box-sizing: border-box;
}

body {
  font-family:  var(--f-body);
  color:        var(--text);
  font-size:    var(--fs-body);
  font-weight:  var(--fw-medium);
  line-height:  var(--lh-body);
  background:   var(--off-white);
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  padding: 0;
}

/* ── Heading hierarchy — font, size, weight, line-height ── */
h1, .h1 { font-family: var(--f-title); font-size: var(--fs-h1); font-weight: var(--fw-bold);     line-height: var(--lh-headings); margin: 0; }
h2, .h2 { font-family: var(--f-title); font-size: var(--fs-h2); font-weight: var(--fw-semibold); line-height: var(--lh-headings); margin: 0; }
h3, .h3 { font-family: var(--f-sub);   font-size: var(--fs-h3); font-weight: var(--fw-semibold); line-height: var(--lh-headings); margin: 0; }
h4, .h4 { font-family: var(--f-body);  font-size: var(--fs-h4); font-weight: var(--fw-semibold); line-height: var(--lh-headings); margin: 0; }

p  { margin: 0; }
a  { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

/* ==========================================================================
   SITE COMPONENT TYPE ALIASES
   Shared typographic roles mapped to design tokens.
   ========================================================================== */

.main-nav__link {
  font-size:   var(--fs-small);
  font-weight: var(--fw-bold);
  line-height: var(--lh-ui);
}

.btn,
.home-btn-override-fix {
  font-size:      var(--fs-small);
  font-weight:    var(--fw-bold);
  line-height:    var(--lh-ui);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.card-title {
  font-size:   var(--fs-h4);
  font-weight: var(--fw-semibold);
  line-height: 1.3;
}

.label-eyebrow {
  font-size:      var(--fs-xs);
  font-weight:    var(--fw-bold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.breadcrumb__link {
  font-size:   var(--fs-small);
  font-weight: var(--fw-medium);
}

.tldr-summary {
  font-size:   var(--fs-body-large);
  font-weight: var(--fw-medium);
  line-height: 1.5;
}

.detail-body-text {
  font-size:   var(--fs-body);
  font-weight: var(--fw-medium);
}

.pill-badge {
  font-size:   var(--fs-xs);
  font-weight: var(--fw-medium);
  line-height: var(--lh-ui);
}

.footer__brand-name {
  font-size:   var(--fs-h3);
  font-weight: var(--fw-semibold);
}

.footer__title {
  font-size:   var(--fs-small);
  font-weight: var(--fw-bold);
}

.footer__link,
.footer__contact-text {
  font-size:   var(--fs-small);
  font-weight: var(--fw-medium);
}

.bc-wrap {
  position:   relative !important;
  min-height: 100vh !important;
  overflow-x: hidden !important;
  background: var(--off-white) !important;
  font-family: var(--f-body) !important;
  color:       var(--text) !important;
  -webkit-font-smoothing: antialiased !important;
}

.bc-bg-grain {
  position:         absolute !important;
  inset:            0 !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E") !important;
  opacity:          0.04 !important;
  pointer-events:   none !important;
  z-index:          0 !important;
}

.bc-container {
  max-width:      var(--bc-container) !important;
  margin:         0 auto !important;
  padding-inline: clamp(16px, 4vw, 60px) !important;
}

.bc-main { position: relative !important; z-index: 1 !important; }

/* Scroll reveal */
.bc-reveal {
  opacity:   0 !important;
  transform: translateY(22px) !important;
  transition: opacity   0.65s ease calc(var(--rd, 0s)),
              transform 0.65s ease calc(var(--rd, 0s)) !important;
}
.bc-revealed { opacity: 1 !important; transform: translateY(0) !important; }

/* ==========================================================================
   SHARED
   ========================================================================== */

.bc-eyebrow { display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 16px !important; }
.bc-eyebrow-line { display: inline-block !important; width: 32px !important; height: 1.5px !important; background: rgba(255,255,255,0.4) !important; flex-shrink: 0 !important; }
.bc-eyebrow-text { font-size: var(--fs-small) !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; color: rgba(255,255,255,0.65) !important; font-weight: var(--fw-bold) !important; }
.bc-eyebrow-line-dark { background: var(--c4) !important; }
.bc-eyebrow-text-dark { color: var(--c3) !important; }

/* ==========================================================================
   HERO
   ========================================================================== */

.bc-hero {
  background:  linear-gradient(135deg, var(--c2) 0%, #0a3a65 100%) !important;
  position:    relative !important;
  overflow:    hidden !important;
  min-height:  44vh !important;
  display:     flex !important;
  align-items: flex-end !important;
  padding-top: 80px !important;
}

.bc-hero-grid {
  position:         absolute !important;
  inset:            0 !important;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px) !important;
  background-size:  64px 64px !important;
  pointer-events:   none !important;
}

.bc-hero-glow {
  position:   absolute !important;
  right:      -80px !important;
  bottom:     -80px !important;
  width:      480px !important;
  height:     480px !important;
  background: radial-gradient(circle, rgba(144,202,238,0.08) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

.bc-hero-inner {
  position:  relative !important;
  z-index:   2 !important;
  padding:   60px clamp(16px, 4vw, 60px) 56px !important;
  width:     100% !important;
  max-width: var(--bc-container) !important;
  margin:    0 auto !important;
}

.bc-breadcrumb { display: flex !important; align-items: center !important; gap: 8px !important; margin-bottom: 22px !important; }
.bc-bc-link    { font-size: var(--fs-small) !important; color: rgba(255,255,255,0.55) !important; text-decoration: none !important; font-weight: var(--fw-medium) !important; transition: color 0.2s !important; }
.bc-bc-link:hover { color: rgba(255,255,255,0.85) !important; }
.bc-bc-sep     { color: rgba(255,255,255,0.3) !important; font-size: var(--fs-xs) !important; }
.bc-bc-current { font-size: var(--fs-small) !important; color: rgba(255,255,255,0.85) !important; }

.bc-h1 {
  font-family:   var(--f-title) !important;
  font-size:     var(--fs-display) !important;
  font-weight:   var(--fw-bold) !important;
  line-height:   var(--lh-ui) !important;
  color:         #fff !important;
  margin-bottom: 14px !important;
}
.bc-h1 em { font-style: italic !important; font-family: var(--f-sub) !important; color: var(--c5) !important; font-weight: var(--fw-semibold) !important; }
.bc-hero-sub { font-family: var(--f-sub) !important; font-size: var(--fs-h4) !important; font-style: italic !important; color: rgba(255,255,255,0.65) !important; }

/* ==========================================================================
   FORM SECTION
   ========================================================================== */

.bc-form-section { background: var(--white) !important; padding: 64px 0 80px !important; }
.bc-form-grid    { display: grid !important; grid-template-columns: 1fr 380px !important; gap: 56px !important; align-items: start !important; }
.bc-form-h2 {
  font-family:   var(--f-title) !important;
  font-size:     var(--fs-h2) !important;
  font-weight:   var(--fw-bold) !important;
  line-height:   var(--lh-headings) !important;
  color:         var(--c2) !important;
  margin-bottom: 12px !important;
}
.bc-form-h2 em  { font-style: italic !important; color: var(--c3) !important; font-family: var(--f-sub) !important; font-weight: var(--fw-semibold) !important; }
.bc-form-intro  { font-size: var(--fs-small) !important; color: var(--muted) !important; line-height: var(--lh-body) !important; font-weight: var(--fw-medium) !important; margin-bottom: 32px !important; }
.bc-form-header { margin-bottom: 28px !important; }

.bc-form-mock    { display: flex !important; flex-direction: column !important; gap: 16px !important; }
.bc-form-row     { display: flex !important; flex-direction: column !important; gap: 16px !important; }
.bc-form-row-2   { flex-direction: row !important; gap: 16px !important; }
.bc-form-row-2 .bc-field-wrap { flex: 1 !important; min-width: 0 !important; }
.bc-field-wrap   { display: flex !important; flex-direction: column !important; gap: 6px !important; }
.bc-field-label  { font-size: var(--fs-xs) !important; font-weight: var(--fw-bold) !important; color: var(--text) !important; letter-spacing: 0.04em !important; }
.bc-required     { color: var(--c2) !important; }
.bc-optional     { font-weight: var(--fw-medium) !important; color: var(--muted) !important; }

.bc-field {
  width:         100% !important;
  padding:       11px 14px !important;
  border:        1.5px solid rgba(15,76,129,0.18) !important;
  border-radius: 6px !important;
  font-family:   var(--f-body) !important;
  font-size:     var(--fs-small) !important;
  color:         var(--text) !important;
  background:    var(--off-white) !important;
  transition:    border-color 0.2s !important;
  outline:       none !important;
  -webkit-appearance: none !important;
}
.bc-field:focus { border-color: var(--c2) !important; background: var(--white) !important; box-shadow: 0 0 0 3px rgba(15,76,129,0.08) !important; }
.bc-field::placeholder { color: var(--muted) !important; font-weight: var(--fw-medium) !important; }
.bc-select  { cursor: pointer !important; }
.bc-textarea { resize: vertical !important; min-height: 100px !important; }

.bc-radio-group { display: flex !important; flex-direction: column !important; gap: 8px !important; margin-top: 4px !important; }
.bc-radio {
  display:     flex !important;
  align-items: center !important;
  gap:         8px !important;
  cursor:      pointer !important;
  font-size:   var(--fs-small) !important;
  color:       var(--body) !important;
  font-weight: var(--fw-medium) !important;
}
.bc-radio input { accent-color: var(--c2) !important; width: 16px !important; height: 16px !important; flex-shrink: 0 !important; }

.bc-submit {
  display:        inline-flex !important;
  align-items:    center !important;
  justify-content: center !important;
  gap:            10px !important;
  background:     var(--c2) !important;
  color:          #fff !important;
  padding:        14px 28px !important;
  border-radius:  8px !important;
  font-family:    var(--f-body) !important;
  font-size:      var(--fs-small) !important;
  font-weight:    var(--fw-bold) !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  border:         none !important;
  cursor:         pointer !important;
  transition:     all 0.3s !important;
  min-height:     48px !important;
  width:          100% !important;
  margin-top:     4px !important;
}
.bc-submit:hover { background: var(--c3) !important; transform: translateY(-2px) !important; box-shadow: 0 8px 28px rgba(15,76,129,0.25) !important; }
.bc-form-note { font-size: var(--fs-xs) !important; color: var(--muted) !important; font-weight: var(--fw-medium) !important; text-align: center !important; margin-top: 4px !important; }

/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.bc-sidebar { display: flex !important; flex-direction: column !important; gap: 16px !important; }

.bc-sidebar-card {
  background:    var(--off-white) !important;
  border:        1px solid rgba(15,76,129,0.09) !important;
  border-radius: var(--radius-sm) !important;
  padding:       24px !important;
  box-shadow:    var(--bc-shadow) !important;
}
.bc-sidebar-card-title {
  font-size:      var(--fs-xs) !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color:          var(--c3) !important;
  font-weight:    var(--fw-bold) !important;
  margin-bottom:  16px !important;
}

.bc-contact-items { display: flex !important; flex-direction: column !important; gap: 12px !important; }
.bc-contact-item {
  display:        flex !important;
  align-items:    center !important;
  gap:            12px !important;
  text-decoration: none !important;
  padding:        10px 12px !important;
  border-radius:  6px !important;
  border:         1px solid rgba(15,76,129,0.09) !important;
  background:     var(--white) !important;
  transition:     all 0.2s !important;
}
.bc-contact-item:hover { border-color: rgba(15,76,129,0.22) !important; transform: translateX(3px) !important; }
.bc-contact-icon {
  width:          36px !important;
  height:         36px !important;
  background:     var(--pale) !important;
  border-radius:  6px !important;
  display:        flex !important;
  align-items:    center !important;
  justify-content: center !important;
  color:          var(--c2) !important;
  flex-shrink:    0 !important;
}
.bc-wa-item:hover    { border-color: rgba(37,211,102,0.3) !important; }
.bc-wa-icon          { background: rgba(37,211,102,0.1) !important; color: var(--wa) !important; }
.bc-contact-label    { font-size: var(--fs-xs) !important; color: var(--muted) !important; font-weight: var(--fw-medium) !important; margin-bottom: 2px !important; }
.bc-contact-value    { font-size: var(--fs-small) !important; color: var(--c2) !important; font-weight: var(--fw-bold) !important; }

.bc-bring-list {
  list-style:     none !important;
  display:        flex !important;
  flex-direction: column !important;
  gap:            10px !important;
  padding:        0 !important;
  margin:         0 !important;
}
.bc-bring-list li {
  font-size:    var(--fs-small) !important;
  color:        var(--body) !important;
  font-weight:  var(--fw-medium) !important;
  line-height:  1.55 !important;
  padding-left: 16px !important;
  position:     relative !important;
}
.bc-bring-list li::before { content: '—' !important; position: absolute !important; left: 0 !important; color: var(--c4) !important; font-weight: var(--fw-bold) !important; }

.bc-loc-item { display: flex !important; gap: 10px !important; align-items: flex-start !important; margin-bottom: 12px !important; }
.bc-loc-item:last-child { margin-bottom: 0 !important; }
.bc-loc-icon { color: var(--c3) !important; flex-shrink: 0 !important; margin-top: 2px !important; }
.bc-loc-name { font-size: var(--fs-small) !important; font-weight: var(--fw-bold) !important; color: var(--c2) !important; margin-bottom: 2px !important; }
.bc-loc-addr { font-size: var(--fs-xs) !important; color: var(--muted) !important; font-weight: var(--fw-medium) !important; line-height: 1.4 !important; }

.bc-response-promise {
  background:    var(--c2) !important;
  border-radius: var(--radius-sm) !important;
  padding:       20px 24px !important;
  display:       flex !important;
  align-items:   center !important;
  gap:           14px !important;
}
.bc-promise-icon  {
  font-size:  var(--fs-h3) !important;
  flex-shrink: 0 !important;
  margin:     0 !important; /* icon is centered via flex align-items on parent */
}
.bc-promise-title { font-size: var(--fs-small) !important; font-weight: var(--fw-bold) !important; color: #fff !important; margin-bottom: 2px !important; }
.bc-promise-sub   { font-size: var(--fs-xs) !important; color: rgba(255,255,255,0.65) !important; font-weight: var(--fw-medium) !important; }

/* ==========================================================================
   REASSURANCE
   ========================================================================== */

.bc-reassurance { background: var(--off-white) !important; padding: 56px 0 !important; border-top: 1px solid rgba(15,76,129,0.07) !important; }
.bc-reassurance-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 16px !important; }

.bc-reassure-item {
  background:    var(--white) !important;
  border:        1px solid rgba(15,76,129,0.08) !important;
  border-radius: var(--radius-sm) !important;
  padding:       24px !important;
  text-align:    center !important;
  display:       flex !important;
  flex-direction: column !important;
  align-items:   center !important;
  transition:    all 0.3s !important;
}
.bc-reassure-item:hover { border-color: rgba(15,76,129,0.2) !important; transform: translateY(-3px) !important; box-shadow: var(--bc-shadow) !important; }
.bc-reassure-icon  {
  font-size:     var(--fs-h3) !important;
  margin:        0 auto 10px !important; /* centered above title/text */
  display:       block !important;
}
.bc-reassure-title { font-family: var(--f-sub) !important; font-size: var(--fs-small) !important; font-weight: var(--fw-semibold) !important; color: var(--c2) !important; margin-bottom: 6px !important; }
.bc-reassure-text  { font-size: var(--fs-small) !important; color: var(--muted) !important; line-height: var(--lh-body) !important; font-weight: var(--fw-medium) !important; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1024px) {
  .bc-form-grid { grid-template-columns: 1fr 320px !important; gap: 36px !important; }
  .bc-reassurance-grid { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 768px) {
  .bc-hero { padding-top: 64px !important; min-height: 36vh !important; }
  .bc-hero-inner { padding: 40px 20px 48px !important; }
  .bc-h1 { font-size: var(--fs-h1) !important; }
  .bc-form-section { padding: 48px 0 64px !important; }
  .bc-form-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .bc-sidebar { order: -1 !important; }
  .bc-form-row-2 { flex-direction: column !important; }
  .bc-reassurance-grid { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
}

@media (max-width: 600px) {
  .bc-reassurance-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 375px) {
  .bc-h1 { font-size: var(--fs-h1) !important; }
}/* End custom CSS */