/* ============================================================================
   GYNECOMASTIAINDIA.IN — AESTHETIC REDESIGN (CSS OVERRIDE ONLY)
   ----------------------------------------------------------------------------
   Load AFTER the existing theme stylesheet:
     <link rel="stylesheet" href="/css/style62ea.css?ver=1.2">
     <link rel="stylesheet" href="/css/redesign.css?ver=1.0">   <-- this file
   (Or paste this entire file at the very END of style62ea.css)

   Design language matched to: eleganceintimatewellness.com
   Brand olive #636e48 · cream backgrounds · Cormorant Garamond + Inter
   No HTML changes required. No JS required (scroll animations are pure CSS).
   ============================================================================ */

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

/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */
:root {
	--olive:        #636e48;
	--olive-dark:   #4a5337;
	--olive-deep:   #353c25;
	--olive-light:  #8a9168;
	--olive-tint:   #e9ecd9;
	--cream:        #f7f3ea;
	--cream-2:      #fbf8f1;
	--blush:        #f3e8e4;
	--ink:          #232619;
	--ink-2:        #4a4d3e;
	--muted:        #7a7d6b;
	--line:         #e6e2d1;
	--white:        #ffffff;
	--radius:       14px;
	--radius-lg:    24px;
	--shadow-sm:    0 4px 14px rgba(35, 38, 25, .06);
	--shadow-md:    0 18px 40px -18px rgba(35, 38, 25, .18);
	--shadow-lg:    0 30px 70px -28px rgba(35, 38, 25, .35);
	--serif:        'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--sans:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
	--ease:         cubic-bezier(.22, .61, .36, 1);
}

/* ============================================================
   2. GLOBAL BASE
   ============================================================ */
html { scroll-behavior: smooth; }

body.site-body {
	font-family: var(--sans) !important;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ink-2) !important;
	background: var(--cream-2) !important;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	letter-spacing: 0;
}

::selection { background: var(--olive); color: #fff; }

/* Elegant thin scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--olive-light); border-radius: 10px; border: 2px solid var(--cream); }
::-webkit-scrollbar-thumb:hover { background: var(--olive); }

h1, h2, h3, h4, h5,
.heading, .heading-lg, .heading-lg-lead, .heading-section,
.banner-text h2, .cta-sameline h3 {
	font-family: var(--serif) !important;
	font-weight: 600 !important;
	color: var(--ink);
	line-height: 1.18 !important;
	letter-spacing: -.01em !important;
	text-transform: none !important;
}

p { color: var(--ink-2); }

.lead {
	font-size: 18px !important;
	line-height: 1.75 !important;
	color: var(--ink-2) !important;
	font-weight: 400 !important;
}

a { transition: color .25s var(--ease), background .25s var(--ease); }
a:hover, a:focus { color: var(--olive-dark); text-decoration: none; }

a:focus-visible, button:focus-visible, .btn:focus-visible {
	outline: 2px solid var(--olive);
	outline-offset: 3px;
}

/* ============================================================
   3. BUTTONS — elegant pills with shine sweep
   ============================================================ */
.btn,
.banner-text .btn,
.navbar-nav li.quote-btn .btn,
.quote-btn .btn,
.call-action .cta-sameline .btn,
.fbox-content .btn {
	position: relative;
	overflow: hidden;
	display: inline-block;
	background: var(--olive) !important;
	color: #fff !important;
	font-family: var(--sans) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	padding: 14px 30px !important;
	border: 1px solid var(--olive) !important;
	border-radius: 999px !important;
	box-shadow: var(--shadow-sm);
	transition: transform .25s var(--ease), background .25s var(--ease),
	            box-shadow .25s var(--ease), color .25s var(--ease),
	            border-color .25s var(--ease) !important;
}

/* shine sweep */
.btn::after {
	content: "";
	position: absolute;
	top: 0; left: -80%;
	width: 50%; height: 100%;
	background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .35), transparent);
	transform: skewX(-20deg);
	transition: left .6s var(--ease);
	pointer-events: none;
}
.btn:hover::after { left: 130%; }

.btn:hover, .btn:focus {
	background: var(--olive-dark) !important;
	border-color: var(--olive-dark) !important;
	color: #fff !important;
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* Outline / alternate button */
.btn.btn-alt {
	background: transparent !important;
	color: var(--olive) !important;
	border: 1px solid var(--olive) !important;
	box-shadow: none;
}
.btn.btn-alt:hover {
	background: var(--olive) !important;
	color: #fff !important;
	box-shadow: var(--shadow-md);
}

/* ============================================================
   4. TOPBAR
   ============================================================ */
.site-header .topbar {
	background: var(--olive-deep) !important;
	border: 0 !important;
	padding: 7px 0;
	font-size: 13px;
}
.topbar .social li a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px; height: 30px;
	border-radius: 50%;
	color: rgba(255, 255, 255, .75) !important;
	background: transparent;
	transition: all .3s var(--ease);
}
.topbar .social li a:hover {
	color: var(--olive-deep) !important;
	background: var(--olive-tint);
	transform: translateY(-2px);
}
.topbar .top-contact li,
.topbar .top-contact li a,
.topbar .top-contact li span {
	color: rgba(255, 255, 255, .85) !important;
	font-weight: 400;
}
.topbar .top-contact li a:hover { color: #fff !important; }
.topbar .top-contact .fa,
.topbar .top-contact em {
	color: var(--olive-tint) !important;
}

/* ============================================================
   5. PRIMARY NAVBAR — airy, cream, refined
   ============================================================ */
.site-header .navbar.navbar-primary {
	background: rgba(251, 248, 241, .92) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border: 0 !important;
	border-bottom: 1px solid var(--line) !important;
	box-shadow: none;
	transition: box-shadow .3s var(--ease), background .3s var(--ease);
}
.header-s1.has-fixed .navbar {
	background: rgba(251, 248, 241, .96) !important;
	box-shadow: var(--shadow-md) !important;
}

.navbar-brand { padding-top: 12px; padding-bottom: 12px; }
.navbar-brand .logo { transition: transform .3s var(--ease); }
.navbar-brand:hover .logo { transform: scale(1.03); }

/* Keep primary navbar (and its dropdowns) above the secondary olive strip.
   NOTE: no position override here — the theme switches the navbar to
   position:fixed when scrolling (sticky header) and must stay free to do so. */
.site-header .navbar.navbar-primary { z-index: 300; }
.secondary-navbg { z-index: 100; }
/* When the sticky header is active, square off the strip so it reads as a bar */
.header-s1-2.has-fixed .secondary-navbg .container { border-radius: 0; }

/* Main nav links with animated underline (top navbar only, NOT the olive strip) */
.site-header .navbar-nav:not(.navbar-nav-2) > li > a:not(.btn) {
	position: relative;
	font-family: var(--sans) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	color: var(--ink) !important;
	background: transparent !important;
	transition: color .25s var(--ease);
}
.site-header .navbar-nav:not(.navbar-nav-2) > li > a:not(.btn)::before {
	content: "";
	position: absolute;
	left: 50%; bottom: 8px;
	width: 0; height: 2px;
	background: var(--olive);
	border-radius: 2px;
	transform: translateX(-50%);
	transition: width .3s var(--ease);
}
.site-header .navbar-nav:not(.navbar-nav-2) > li:hover > a:not(.btn),
.site-header .navbar-nav:not(.navbar-nav-2) > li.active > a:not(.btn) {
	color: var(--olive) !important;
}
.site-header .navbar-nav:not(.navbar-nav-2) > li:hover > a:not(.btn)::before,
.site-header .navbar-nav:not(.navbar-nav-2) > li.active > a:not(.btn)::before {
	width: calc(100% - 30px);
}

/* Dropdown menus — soft cards that glide in */
.navbar-nav li .dropdown-menu {
	background: var(--white) !important;
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	box-shadow: var(--shadow-lg) !important;
	padding: 10px 0 !important;
	margin-top: 0;
	overflow: hidden;
}
@media (min-width: 992px) {
	.navbar-nav li .dropdown-menu {
		display: block !important;
		visibility: hidden;
		opacity: 0;
		transform: translateY(14px);
		transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
		pointer-events: none;
	}
	.navbar-nav li.dropdown:hover > .dropdown-menu,
	.navbar-nav li.dropdown.open > .dropdown-menu {
		visibility: visible;
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}
}
.navbar-nav li .dropdown-menu li a {
	font-family: var(--sans) !important;
	font-size: 13.5px !important;
	font-weight: 500 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--ink-2) !important;
	background: transparent !important;
	padding: 9px 22px !important;
	border: 0 !important;
	position: relative;
	transition: all .25s var(--ease);
}
.navbar-nav li .dropdown-menu li a:hover,
.navbar-nav li .dropdown-menu li a:focus {
	color: var(--olive-dark) !important;
	background: var(--olive-tint) !important;
	padding-left: 30px !important;
}

/* Mobile toggle bars */
.navbar-toggle .icon-bar { background: var(--olive) !important; }

/* ============================================================
   6. SECONDARY NAV (olive strip) — deep gradient ribbon
   ============================================================ */
.secondary-navbg { background: transparent !important; }
.secondary-navbg .container {
	/* overrides the inline background-color on this element */
	background: linear-gradient(120deg, var(--olive-deep), var(--olive) 55%, var(--olive-dark)) !important;
	background-size: 200% 200% !important;
	animation: gradientDrift 14s ease infinite;
	border-radius: 0 0 var(--radius-lg) var(--radius-lg);
	box-shadow: var(--shadow-md);
}
.site-header .secondary-navbg .navbar-nav-2 > li > a,
.secondary-navbg .navbar-nav-2 > li > a {
	font-family: var(--sans) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	letter-spacing: .05em !important;
	text-transform: uppercase !important;
	color: #ffffff !important;
	background: transparent !important;
	position: relative;
	transition: color .25s var(--ease), background .25s var(--ease);
}
.site-header .secondary-navbg .navbar-nav-2 > li > a i,
.site-header .secondary-navbg .navbar-nav-2 > li > a .fa {
	color: rgba(255, 255, 255, .85) !important;
}
.site-header .secondary-navbg .navbar-nav-2 > li > a::before { display: none !important; }
.site-header .secondary-navbg .navbar-nav-2 > li > a:hover,
.site-header .secondary-navbg .navbar-nav-2 > li.active > a,
.secondary-navbg .navbar-nav-2 > li.active > a {
	color: #ffffff !important;
	background: rgba(255, 255, 255, .14) !important;
}

/* ============================================================
   7. HERO SLIDER — cinematic, slow Ken Burns zoom
   ============================================================ */
.banner-slider .item { overflow: hidden; }
.banner-slider .item .fill {
	position: relative;
	transform: scale(1);
}
.banner-slider .item.active .fill {
	animation: kenBurns 9s var(--ease) forwards;
}
/* soft cinematic wash over slide images */
.banner-slider .item .fill::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg,
		rgba(35, 38, 25, .55) 0%,
		rgba(35, 38, 25, .28) 45%,
		rgba(35, 38, 25, 0) 75%);
	pointer-events: none;
	z-index: 1;
}
.banner-slider .banner-content { position: relative; z-index: 2; }

.banner-text h2 {
	font-size: clamp(34px, 5vw, 62px) !important;
	color: #fff !important;
	text-shadow: 0 2px 30px rgba(35, 38, 25, .45);
	margin-bottom: 18px;
}
.banner-text p {
	font-size: clamp(15px, 1.4vw, 18px) !important;
	line-height: 1.75 !important;
	color: rgba(255, 255, 255, .92) !important;
	max-width: 560px;
	text-shadow: 0 1px 18px rgba(35, 38, 25, .4);
}
.banner-text .animated { animation-duration: 1.1s; }

.banner-text .btn + .btn {
	background: rgba(255, 255, 255, .12) !important;
	border-color: rgba(255, 255, 255, .65) !important;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.banner-text .btn + .btn:hover {
	background: #fff !important;
	color: var(--olive-dark) !important;
	border-color: #fff !important;
}

/* Round glass slider arrows */
.banner-slider .carousel-control {
	width: 54px !important;
	height: 54px !important;
	top: 50% !important;
	transform: translateY(-50%);
	margin: 0 22px;
	background: rgba(255, 255, 255, .14) !important;
	border: 1px solid rgba(255, 255, 255, .35) !important;
	border-radius: 50% !important;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: all .35s var(--ease) !important;
	text-shadow: none !important;
}
.banner-slider:hover > .carousel-control { opacity: 1; }
.banner-slider .carousel-control:hover {
	background: var(--olive) !important;
	border-color: var(--olive) !important;
}
.banner-slider .carousel-control .glyphicon {
	font-size: 16px;
	top: 50%; left: 50%;
	margin: 0 !important;
	transform: translate(-50%, -50%);
	position: absolute;
	width: auto; height: auto;
}

/* ============================================================
   8. FEATURE CARDS (Adult / Body Builder / Skin Excess / Teenager)
   ============================================================ */
.section-services { background: var(--cream-2); }
.feature-row.boxed-filled { margin-top: -40px; position: relative; z-index: 5; }

.feature.boxed {
	border-radius: var(--radius-lg) !important;
	overflow: hidden !important;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--line);
	background: var(--white);
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.feature.boxed:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-lg);
}
.feature.boxed .fbox-photo img {
	transition: transform 1s var(--ease);
}
.feature.boxed:hover .fbox-photo img {
	transform: scale(1.08);
}
/* Overlay panel on the cards */
.feature-s4 .feature .fbox-over,
.feature-s4 .col-md-3 .feature .fbox-over {
	background: linear-gradient(180deg,
		rgba(53, 60, 37, 0) 0%,
		rgba(53, 60, 37, .55) 45%,
		rgba(53, 60, 37, .92) 100%) !important;
	transition: background .4s var(--ease);
}
.feature-s4 .feature .fbox-over .title {
	font-family: var(--serif) !important;
	font-size: 26px !important;
	font-weight: 600 !important;
	color: #fff !important;
	letter-spacing: 0 !important;
}
.feature-s4 .feature .fbox-over p {
	color: rgba(255, 255, 255, .88) !important;
	font-size: 13.5px !important;
	line-height: 1.6 !important;
}
.feature .fbox-content .btn {
	padding: 10px 24px !important;
	font-size: 12px !important;
	background: transparent !important;
	border-color: rgba(255, 255, 255, .7) !important;
}
.feature .fbox-content .btn:hover {
	background: #fff !important;
	color: var(--olive-dark) !important;
}

/* ============================================================
   9. CONTENT SECTIONS — cream rhythm + serif headings
   ============================================================ */
.section { position: relative; }
.bg-light { background: var(--cream) !important; }
.section-about,
.section-content { background: var(--cream-2); }

/* Big section headings with a small olive keyline */
.heading-lg,
.section .wide-md h1 {
	position: relative;
	font-size: clamp(28px, 3.4vw, 44px) !important;
	color: var(--ink) !important;
	margin-bottom: 26px !important;
	padding-bottom: 22px;
}
.heading-lg::after,
.section .wide-md h1::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 64px; height: 2px;
	background: linear-gradient(90deg, var(--olive), var(--olive-light));
	border-radius: 2px;
}
/* centered variants get a centered keyline */
.center .heading-lg::after,
.wide-md.center h1::after,
.wide-md.center .heading-lg::after {
	left: 50%;
	transform: translateX(-50%);
}

.section .wide-md h1 {
	font-size: clamp(30px, 3.8vw, 48px) !important;
}

/* Award badge — gentle float */
.section-about img[alt="Best Plastic surgeons in Surat"] {
	animation: floatY 5s ease-in-out infinite;
	filter: drop-shadow(0 18px 30px rgba(35, 38, 25, .18));
}

/* Doctor / content imagery — soft frame */
.section-content .row-vm img,
.section-content .col-md-5 img {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.section-content .row-vm img:hover {
	transform: scale(1.02) rotate(-.5deg);
	box-shadow: var(--shadow-lg);
}

/* ============================================================
   10. PHOTO GALLERY STRIPS
   ============================================================ */
.gallery .photo {
	border-radius: var(--radius) !important;
	overflow: hidden !important;
	box-shadow: var(--shadow-sm);
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.gallery .photo img {
	transition: transform .9s var(--ease), filter .9s var(--ease);
}
.gallery li:hover .photo {
	transform: translateY(-6px);
	box-shadow: var(--shadow-md);
}
.gallery li:hover .photo img {
	transform: scale(1.07);
}

/* Services / products grid with captions */
.gallery-products .photo { border-radius: var(--radius) var(--radius) 0 0 !important; }
.gallery-products .photos-list > li {
	background: var(--white);
	border-radius: var(--radius);
	overflow: hidden;
	border: 1px solid var(--line);
	box-shadow: var(--shadow-sm);
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.gallery-products .photos-list > li:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-lg);
}
.gallery .photo-caption {
	background: var(--white) !important;
	padding: 18px 16px !important;
}
.gallery .photo-caption h4 {
	font-family: var(--serif) !important;
	font-size: 21px !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
	margin: 0;
	transition: color .25s var(--ease);
}
.gallery .photo-caption a:hover h4 { color: var(--olive) !important; }

.gallery .photo-link { background: rgba(53, 60, 37, .45) !important; }
.gallery .photo-link .btn {
	padding: 10px 26px !important;
	font-size: 12px !important;
}

/* ============================================================
   11. FAQ — elegant cards with olive accent
   ============================================================ */
#faq .faq-item {
	background: var(--white);
	border: 1px solid var(--line);
	border-left: 3px solid var(--olive);
	border-radius: var(--radius);
	padding: 26px 30px 16px;
	margin-bottom: 18px !important;
	box-shadow: var(--shadow-sm);
	transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
#faq .faq-item:hover {
	transform: translateX(6px);
	box-shadow: var(--shadow-md);
	border-left-color: var(--olive-dark);
}
#faq .faq-item h3 {
	font-size: 23px !important;
	color: var(--olive-dark) !important;
	margin-bottom: 10px;
}
#faq .faq-item p { margin-bottom: 10px; }

/* FAQ page accordion (faq.php) */
.accordion .panel {
	background: var(--white) !important;
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	overflow: hidden;
	box-shadow: var(--shadow-sm) !important;
}
.accordion .panel + .panel { margin-top: 14px !important; }
.accordion .panel-title a {
	font-family: var(--serif) !important;
	font-size: 20px !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
	background: var(--white) !important;
	transition: color .25s var(--ease), background .25s var(--ease);
}
.accordion .panel-title a:hover,
.accordion .panel-title a:not(.collapsed) {
	color: var(--olive) !important;
	background: var(--olive-tint) !important;
}
.accordion .plus-minus { border-color: var(--olive) !important; }

/* ============================================================
   12. CALL-TO-ACTION BAND — living olive gradient
   ============================================================ */
.call-action.has-bg,
.call-action .cta-block {
	background: linear-gradient(115deg, var(--olive-deep) 0%, var(--olive) 45%, var(--olive-dark) 100%) !important;
	background-size: 220% 220% !important;
	animation: gradientDrift 16s ease infinite;
	position: relative;
	overflow: hidden;
}
/* decorative glow orbs */
.call-action .cta-block::before,
.call-action .cta-block::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
}
.call-action .cta-block::before {
	width: 380px; height: 380px;
	right: -120px; top: -180px;
	background: radial-gradient(circle, rgba(233, 236, 217, .16), transparent 70%);
	animation: floatY 9s ease-in-out infinite;
}
.call-action .cta-block::after {
	width: 260px; height: 260px;
	left: -90px; bottom: -140px;
	background: radial-gradient(circle, rgba(233, 236, 217, .10), transparent 70%);
	animation: floatY 11s ease-in-out infinite reverse;
}
/* Stack the CTA content cleanly centred (theme's inline layout overlaps on desktop) */
.call-action .cta-sameline {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 4px;
	float: none !important;
	width: 100%;
}
.call-action .cta-sameline h3 {
	color: #fff !important;
	font-size: clamp(24px, 2.8vw, 36px) !important;
	margin: 0 0 6px !important;
	max-width: 900px;
}
.call-action .cta-sameline .btn {
	position: static !important;
	float: none !important;
	margin: 16px 0 0 !important;
}
.call-action .cta-sameline p {
	color: rgba(255, 255, 255, .85) !important;
	font-size: 16px;
	letter-spacing: .04em;
}
.call-action .cta-sameline .btn {
	background: var(--cream) !important;
	color: var(--olive-dark) !important;
	border-color: var(--cream) !important;
}
.call-action .cta-sameline .btn:hover {
	background: #fff !important;
	transform: translateY(-2px) scale(1.02);
}

/* ============================================================
   13. FOOTER — deep olive, refined widgets
   ============================================================ */
.footer-widget.style-v2 {
	background: var(--olive-deep) !important;
	position: relative;
}
/* thin cream keyline on top of footer */
.footer-widget.style-v2::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(233, 236, 217, .35), transparent);
}
.footer-widget .wgs-title {
	font-family: var(--serif) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	color: var(--cream) !important;
	letter-spacing: .01em !important;
	text-transform: none !important;
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 18px;
}
.footer-widget .wgs-title::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 34px; height: 2px;
	background: var(--olive-light);
	border-radius: 2px;
}
.footer-widget .wgs-content,
.footer-widget .wgs-content p,
.footer-widget .wgs-content span {
	color: rgba(255, 255, 255, .72) !important;
	font-size: 14px;
}
.footer-widget .wgs-content .menu li a {
	color: rgba(255, 255, 255, .72) !important;
	font-size: 14px;
	position: relative;
	padding-left: 0;
	transition: color .25s var(--ease), padding-left .25s var(--ease);
}
.footer-widget .wgs-content .menu li a::before {
	content: "\2192"; /* → */
	position: absolute;
	left: -4px;
	opacity: 0;
	color: var(--olive-light);
	transition: opacity .25s var(--ease), left .25s var(--ease);
}
.footer-widget .wgs-content .menu li a:hover {
	color: var(--cream) !important;
	padding-left: 20px;
}
.footer-widget .wgs-content .menu li a:hover::before {
	opacity: 1;
	left: 0;
}
.footer-widget .wgs-content a { color: rgba(255, 255, 255, .8) !important; }
.footer-widget .wgs-content a:hover { color: var(--cream) !important; }

.footer-widget .social li a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px; height: 36px;
	border-radius: 50%;
	border: 1px solid rgba(233, 236, 217, .3);
	color: rgba(255, 255, 255, .78) !important;
	background: transparent !important;
	transition: all .3s var(--ease);
}
.footer-widget .social li a:hover {
	background: var(--olive-tint) !important;
	border-color: var(--olive-tint);
	color: var(--olive-deep) !important;
	transform: translateY(-3px);
}

.copyright.style-v2 {
	background: #2b3120 !important;
	border-top: 1px solid rgba(233, 236, 217, .08);
}
.copyright.style-v2 p {
	color: rgba(255, 255, 255, .5) !important;
	font-size: 13px;
}
.copyright.style-v2 a { color: var(--olive-light) !important; }
.copyright.style-v2 a:hover { color: var(--cream) !important; }

/* ============================================================
   14. FLOATING CONTACT BUTTONS — softer, with pulse ring
   ============================================================ */
.floating-contact .float-btn {
	width: 56px !important;
	height: 56px !important;
	box-shadow: var(--shadow-md) !important;
	position: relative;
}
.floating-contact .float-btn i { font-size: 24px !important; }
.floating-contact .float-btn::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid currentColor;
	opacity: 0;
	animation: pulseRing 2.6s var(--ease) infinite;
}
.floating-contact .whatsapp-btn::before { color: #25D366; }
.floating-contact .call-btn::before { color: var(--olive); animation-delay: 1.3s; }
.floating-contact .call-btn { background: var(--olive) !important; }
.floating-contact .call-btn:hover { background: var(--olive-dark) !important; }
.floating-contact .float-btn:hover { transform: scale(1.1) !important; }

/* ============================================================
   15. INNER PAGES — static banners, breadcrumbs, forms, tables
   ============================================================ */
.banner-static {
	position: relative;
	/* graceful olive gradient shows when a page has no banner image */
	background: linear-gradient(115deg, var(--olive-deep), var(--olive) 60%, var(--olive-dark));
}
/* single soft wash over the banner image (only one layer — keeps image visible) */
.banner-static .imagebg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(53, 60, 37, .66), rgba(53, 60, 37, .32) 60%, rgba(53, 60, 37, .12));
	pointer-events: none;
}
.banner-static .banner-text { position: relative; z-index: 2; }
.banner-text .page-title {
	font-family: var(--serif) !important;
	font-weight: 600 !important;
	color: #fff !important;
	letter-spacing: -.01em !important;
	text-transform: none !important;
	animation: fadeUp .9s var(--ease) both;
}
.banner-text .page-breadcrumb,
.banner-text .page-breadcrumb a {
	color: rgba(255, 255, 255, .8) !important;
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
	animation: fadeUp .9s var(--ease) .15s both;
}
.banner-text .page-breadcrumb a:hover { color: #fff !important; }

/* Forms */
.form-control {
	font-family: var(--sans) !important;
	background: var(--white) !important;
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	padding: 12px 18px !important;
	height: auto !important;
	color: var(--ink) !important;
	box-shadow: none !important;
	transition: border-color .25s var(--ease), box-shadow .25s var(--ease) !important;
}
.form-control:focus {
	border-color: var(--olive) !important;
	box-shadow: 0 0 0 4px rgba(99, 110, 72, .14) !important;
}
.form-control::placeholder { color: var(--muted); }

/* Content tables (cost pages, comparison pages) */
.section table {
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--line) !important;
}
.section table th {
	background: var(--olive) !important;
	color: #fff !important;
	font-family: var(--sans);
	font-weight: 600;
	border-color: var(--olive-dark) !important;
}
.section table td {
	background: var(--white);
	border-color: var(--line) !important;
}
.section table tr:nth-child(even) td { background: var(--cream-2); }

/* Blockquotes */
blockquote {
	border-left: 3px solid var(--olive) !important;
	background: var(--olive-tint);
	border-radius: 0 var(--radius) var(--radius) 0;
	padding: 18px 24px;
	font-family: var(--serif);
	font-size: 19px;
	font-style: italic;
	color: var(--ink);
}

/* Pagination */
.pagination > li > a, .pagination > li > span {
	border: 1px solid var(--line) !important;
	color: var(--ink-2) !important;
	border-radius: 50% !important;
	margin: 0 4px;
	transition: all .25s var(--ease);
}
.pagination > li > a:hover,
.pagination > .active > a, .pagination > .active > span {
	background: var(--olive) !important;
	border-color: var(--olive) !important;
	color: #fff !important;
}

/* ============================================================
   16. SCROLL-REVEAL ANIMATIONS (pure CSS, no JS)
   Modern browsers animate elements as they enter the viewport;
   older browsers simply show everything — nothing breaks.
   ============================================================ */
@supports (animation-timeline: view()) {
	.feature.boxed,
	.gallery-photos .photos-list li,
	.gallery-products .photos-list li,
	#faq .faq-item,
	.section-about .heading-lg,
	.section-about .lead,
	.section-content .row-vm > div,
	.section-products .wide-md,
	.cta-sameline,
	.footer-widget .footer-col {
		animation: revealUp 1s var(--ease) both;
		animation-timeline: view();
		animation-range: entry 0% entry 42%;
	}

	/* Stagger grid children slightly with alternating drift */
	.gallery-photos .photos-list li:nth-child(even),
	.gallery-products .photos-list li:nth-child(even),
	.feature-row .col-sm-6:nth-child(even) .feature.boxed {
		animation-name: revealUpSoft;
	}
}

/* ============================================================
   17. KEYFRAMES
   ============================================================ */
@keyframes kenBurns {
	from { transform: scale(1); }
	to   { transform: scale(1.09); }
}
@keyframes gradientDrift {
	0%, 100% { background-position: 0% 50%; }
	50%      { background-position: 100% 50%; }
}
@keyframes floatY {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-12px); }
}
@keyframes fadeUp {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes revealUp {
	from { opacity: 0; transform: translateY(42px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes revealUpSoft {
	from { opacity: 0; transform: translateY(60px) scale(.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes pulseRing {
	0%   { transform: scale(1); opacity: .6; }
	70%  { transform: scale(1.45); opacity: 0; }
	100% { transform: scale(1.45); opacity: 0; }
}

/* ============================================================
   18. RESPONSIVE POLISH
   ============================================================ */
@media only screen and (max-width: 991px) {
	.secondary-navbg .container { border-radius: 0; }
	.feature-row.boxed-filled { margin-top: 0; }
	.navbar-nav li .dropdown-menu {
		box-shadow: none !important;
		border: 0 !important;
		background: var(--cream) !important;
	}
}
@media only screen and (max-width: 767px) {
	.banner-text h2 { font-size: clamp(26px, 7vw, 34px) !important; }
	.heading-lg, .section .wide-md h1 { font-size: clamp(24px, 6.4vw, 32px) !important; }
	.banner-slider .carousel-control { display: none; }
	#faq .faq-item { padding: 20px 20px 12px; }
	.call-action .cta-sameline h3 { font-size: 24px !important; }
}

/* ############################################################
   PART 2 — INNER PAGES (all templates checked page by page)
   about-us · dr-ashutosh · team · memberships · faq · blog ·
   reviews · videos · photo · contact · location · form · emi ·
   why-choose-us · out-station · type/surgery/info listings &
   detail pages
   ############################################################ */

/* ============================================================
   20. BREADCRUMB BAR (all inner pages, below header)
   ============================================================ */
nav[aria-label="breadcrumb"] {
	background: var(--cream);
	border-bottom: 1px solid var(--line);
}
.breadcrumb {
	max-width: 1170px;
	margin: 0 auto !important;
	padding: 14px 15px !important;
	background: transparent !important;
	border-radius: 0 !important;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	list-style: none;
}
.breadcrumb-item { display: inline-block; color: var(--muted); }
.breadcrumb-item a { color: var(--olive) !important; font-weight: 600; }
.breadcrumb-item a:hover { color: var(--olive-dark) !important; }
.breadcrumb-item + .breadcrumb-item::before {
	content: "\2022"; /* • */
	color: var(--olive-light);
	padding: 0 10px;
}
.breadcrumb-item.active { color: var(--muted) !important; }

/* ============================================================
   21. INNER PAGE HEADINGS
   ============================================================ */
.section-contents h1,
.section-contact h1,
.section-freequote h1 {
	position: relative;
	font-size: clamp(28px, 3.4vw, 42px) !important;
	color: var(--ink) !important;
	margin-bottom: 26px;
	padding-bottom: 20px;
	animation: fadeUp .8s var(--ease) both;
}
.section-contents h1::after,
.section-contact h1::after,
.section-freequote h1::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 58px; height: 2px;
	background: linear-gradient(90deg, var(--olive), var(--olive-light));
	border-radius: 2px;
}
/* centered variants (team sections etc.) */
.section-contents h1.center-sm::after { left: 50%; transform: translateX(-50%); }
.section-contents h1:empty { display: none; }

.section-contents h2, .section-contents h3:not(.faq-heading):not(.wgs-heading):not(.video-title) {
	color: var(--ink);
}
.section-contents h2 { font-size: clamp(24px, 2.6vw, 32px) !important; }

/* Content lists on info pages get elegant markers */
.section-contents .col-md-9 ul:not(.list):not(.photos-list):not(.pagination) li,
.section-contents .col-md-8 ul:not(.list):not(.photos-list) li {
	margin-bottom: 6px;
}

/* ============================================================
   22. LISTING CARDS (types / surgery / info / patient-guide)
   ============================================================ */
.feature.boxed .fbox-content {
	padding: 22px 24px 26px;
	background: var(--white);
}
.feature.boxed .fbox-content h3 {
	font-size: 22px !important;
	margin-bottom: 10px;
	line-height: 1.25 !important;
}
.feature.boxed .fbox-content h3 a { color: var(--ink) !important; }
.feature.boxed .fbox-content h3 a:hover { color: var(--olive) !important; }
.feature.boxed .fbox-content p { font-size: 14.5px; color: var(--ink-2); }

/* "Learn More" arrow links */
.btn-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--olive) !important;
	font-weight: 600 !important;
	font-size: 13.5px !important;
	letter-spacing: .04em;
	text-transform: uppercase;
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	transition: color .25s var(--ease), gap .25s var(--ease);
}
.btn-link::after {
	content: "\2192"; /* → */
	transition: transform .25s var(--ease);
}
.btn-link:hover { color: var(--olive-dark) !important; }
.btn-link:hover::after { transform: translateX(5px); }

/* ============================================================
   23. TEAM CARDS (team.php, dr-ashutosh.php)
   ============================================================ */
.team-member {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	margin-bottom: 30px;
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.team-member:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-lg);
}
.team-photo { overflow: hidden; }
.team-photo img {
	width: 100%;
	transition: transform .9s var(--ease);
}
.team-member:hover .team-photo img { transform: scale(1.06); }
.team-info {
	padding: 18px 14px 20px;
	text-align: center;
	background: var(--white);
}
.team-info .name {
	font-family: var(--serif) !important;
	font-size: 21px !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
	margin: 0 0 4px;
}
.team-info .sub-title {
	font-size: 12px !important;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--olive) !important;
	margin: 0;
}

/* ============================================================
   24. SIDEBAR WIDGETS (detail pages, team page)
   ============================================================ */
.sidebar-right .wgs-box,
.col-md-3 .wgs-box,
.col-md-4 .wgs-box {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 26px 26px 22px;
	margin-bottom: 28px;
	box-shadow: var(--shadow-sm);
}
.wgs-box .wgs-heading {
	font-family: var(--serif) !important;
	font-size: 24px !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 16px;
}
.wgs-box .wgs-heading::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 40px; height: 2px;
	background: var(--olive);
	border-radius: 2px;
}
/* Book Appointment sidebar form — olive-tint spotlight */
.wgs-box.wgs-quoteform {
	background: linear-gradient(160deg, var(--olive-tint), var(--cream-2));
	border-color: rgba(99, 110, 72, .25);
}
/* Sidebar link groups */
.wgs-box .list-grouped .list-heading > span {
	display: block;
	font-family: var(--serif) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	color: var(--ink);
	position: relative;
	padding-bottom: 12px;
	margin-bottom: 12px;
	border-bottom: 1px solid var(--line);
}
.wgs-box .list-grouped li li {
	border-bottom: 1px solid var(--cream);
}
.wgs-box .list-grouped li li:last-child { border-bottom: 0; }
.wgs-box .list-grouped li li a {
	display: block;
	padding: 9px 0 9px 0;
	font-size: 14px;
	color: var(--ink-2) !important;
	position: relative;
	transition: color .25s var(--ease), padding-left .25s var(--ease);
}
.wgs-box .list-grouped li li a::before {
	content: "\2192";
	position: absolute;
	left: -6px;
	opacity: 0;
	color: var(--olive);
	transition: opacity .25s var(--ease), left .25s var(--ease);
}
.wgs-box .list-grouped li li a:hover {
	color: var(--olive) !important;
	padding-left: 22px;
}
.wgs-box .list-grouped li li a:hover::before { opacity: 1; left: 0; }

/* ============================================================
   25. VIDEO CARDS (video.php — beats the page's own inline CSS)
   ============================================================ */
.video-card {
	background: var(--white) !important;
	border: 1px solid var(--line) !important;
	border-radius: var(--radius) !important;
	box-shadow: var(--shadow-sm) !important;
	overflow: hidden !important;
	transition: transform .4s var(--ease), box-shadow .4s var(--ease) !important;
}
.video-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-lg) !important;
}
.video-title {
	font-family: var(--serif) !important;
	font-size: 21px !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
}
.video-desc { color: var(--ink-2) !important; font-size: 13.5px !important; }
.video-body .btn { padding: 10px 22px !important; font-size: 12px !important; }

/* ============================================================
   26. BLOG CARDS (blog.php)
   ============================================================ */
.post-loop {
	margin-bottom: 34px;
}
.post-loop .post-thumbs {
	border-radius: var(--radius) var(--radius) 0 0;
	overflow: hidden;
	box-shadow: none;
}
.post-loop .post-thumbs img {
	width: 100%;
	transition: transform .9s var(--ease);
}
.post-loop:hover .post-thumbs img { transform: scale(1.06); }
.post-loop .post-entry {
	background: var(--white);
	border: 1px solid var(--line);
	border-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	padding: 20px 24px 24px;
	box-shadow: var(--shadow-sm);
	transition: box-shadow .4s var(--ease);
}
.post-loop:hover .post-entry { box-shadow: var(--shadow-md); }
.post-loop .post-meta .pub-date {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--olive) !important;
	font-weight: 600;
}
.post-loop .post-meta .pub-date .fa { color: var(--olive-light); }
.post-loop h2 {
	font-size: 22px !important;
	line-height: 1.3 !important;
	margin: 10px 0 12px;
}
.post-loop h2 a { color: var(--ink) !important; }
.post-loop h2 a:hover { color: var(--olive) !important; }
.post-loop .txt-entry p { font-size: 14.5px; color: var(--ink-2); }

/* Custom pagination (blog, photo gallery) */
.pagination > a, .pagination > span,
.pagination li a, .pagination li span,
.pagination .page_current, .pagination .page_disabled {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px !important;
	margin: 0 3px;
	background: var(--white) !important;
	border: 1px solid var(--line) !important;
	border-radius: 999px !important;
	color: var(--ink-2) !important;
	font-weight: 600;
	font-size: 13.5px;
	transition: all .25s var(--ease);
}
.pagination > a:hover, .pagination li a:hover {
	background: var(--olive-tint) !important;
	border-color: var(--olive-light) !important;
	color: var(--olive-dark) !important;
	transform: translateY(-2px);
}
.pagination > .ellipsis { border: 0 !important; background: transparent !important; min-width: 20px; }

/* Static page banners — centre the title vertically (covers BOTH markup
   variants: with and without the has-bg-image class). The theme centres
   .banner-text with a translate() that pushes our larger serif title out of
   the fixed 200px banner — neutralise that and use flex centring instead. */
.banner-static { height: auto !important; }
.banner-static .content.row {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 250px;
	padding: 50px 15px;
}
.banner-static .banner-text {
	position: static !important;
	top: auto !important;
	left: auto !important;
	transform: none !important;
	margin: 0 !important;
	width: 100%;
	text-align: center;
}
/* hide broken image icon when a page has no banner image set in the CMS */
.banner-static .imagebg img[src=""] { display: none; }
.banner-static .banner-text .page-title {
	font-size: clamp(32px, 4vw, 52px) !important;
	position: relative;
	display: inline-block;
	padding-bottom: 20px;
	margin: 0;
}
.banner-static .banner-text .page-title::after {
	content: "";
	position: absolute;
	left: 50%; bottom: 0;
	transform: translateX(-50%);
	width: 56px; height: 2px;
	background: var(--olive-tint);
	border-radius: 2px;
	opacity: .8;
}
@media only screen and (max-width: 767px) {
	.banner-static .content.row { min-height: 180px; padding: 36px 15px; }
}
.pagination .page_current,
.pagination .page_current a {
	background: var(--olive) !important;
	border-color: var(--olive) !important;
	color: #fff !important;
}
.pagination .page_current a { margin: 0; border: 0 !important; }
.pagination .page_disabled { opacity: .5; }

/* ============================================================
   27. REVIEWS / TESTIMONIALS (reviews.php)
   ============================================================ */
.quotes.quotes-flat {
	position: relative;
	background: var(--white) !important;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 30px 28px 22px !important;
	margin-bottom: 30px;
	box-shadow: var(--shadow-sm);
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
	overflow: hidden;
}
.quotes.quotes-flat:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-md);
}
/* big serif quotation mark */
.quotes.quotes-flat::before {
	content: "\201C";
	position: absolute;
	top: -18px; right: 14px;
	font-family: var(--serif);
	font-size: 130px;
	line-height: 1;
	color: var(--olive-tint);
	pointer-events: none;
}
.quotes .quotes-text { position: relative; z-index: 1; }
.quotes .quotes-text p {
	font-size: 15px;
	line-height: 1.75;
	color: var(--ink-2);
}
/* hide the old theme's giant blue watermark quote */
.quotes .quotes-text::before { display: none !important; content: none !important; }
/* reviewer name */
.quotes .profile h5 {
	position: relative;
	color: var(--olive-dark) !important;
	font-size: 17px !important;
	margin: 14px 0 0;
	padding-left: 34px;
}
.quotes .profile h5::before {
	content: "";
	position: absolute;
	left: 0; top: 50%;
	width: 24px; height: 2px;
	background: var(--olive-light);
	border-radius: 2px;
}
.quotes .profile h5:empty, .quotes .profile h6:empty { display: none; }

/* ============================================================
   28. FAQ PAGE (faq.php — .faqs cards, matches homepage FAQ)
   ============================================================ */
.faqs-row .faqs {
	background: var(--white);
	border: 1px solid var(--line);
	border-left: 3px solid var(--olive);
	border-radius: var(--radius);
	padding: 24px 28px 14px;
	margin-bottom: 18px;
	box-shadow: var(--shadow-sm);
	transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.faqs-row .faqs:hover {
	transform: translateX(6px);
	box-shadow: var(--shadow-md);
	border-left-color: var(--olive-dark);
}
.faqs .faq-heading {
	font-size: 22px !important;
	color: var(--olive-dark) !important;
	margin: 0 0 10px;
}

/* ============================================================
   29. CONTACT / FORM / LOCATION PAGES
   ============================================================ */
/* Contact form panel */
.drop-message,
.freequote-content .quote-group {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 30px;
	box-shadow: var(--shadow-sm);
}
.form-quote .form-field { margin-bottom: 6px; }
.form-quote textarea.form-control { min-height: 130px; }
.form-quote button.btn, .form-quote input[type="submit"] {
	background: var(--olive) !important;
	color: #fff !important;
	border: 1px solid var(--olive) !important;
	border-radius: 999px !important;
	padding: 13px 34px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	transition: all .25s var(--ease) !important;
}
.form-quote button.btn:hover, .form-quote input[type="submit"]:hover {
	background: var(--olive-dark) !important;
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}
.form-results { color: var(--olive-dark); }

/* Keep floated form fields (and the submit button) inside the form card */
.form-quote { display: flow-root; }

/* Contact page layout — form card left, "Our Headquarter" sidebar right.
   The live DOM puts .contact-details (and the stray submit button) outside
   the form column, so the container becomes a 2-column grid and the whole
   .contact-content block becomes one card that includes the submit button. */
@media (min-width: 992px) {
	.section-contact > .container {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		column-gap: 40px;
		align-items: start;
	}
	/* bootstrap's .container clearfix pseudo-elements would become grid items
	   and steal the first cell — remove them and place both columns explicitly */
	.section-contact > .container::before,
	.section-contact > .container::after { content: none !important; }
	.section-contact > .container > .content.row {
		grid-column: 1;
		grid-row: 1;
	}
	.section-contact > .container > .contact-details {
		grid-column: 2;
		grid-row: 1;
		width: 100% !important;
		margin-left: 0 !important;
		position: sticky;
		top: 150px;
	}
}
.section-contact .contact-content {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 34px;
	box-shadow: var(--shadow-sm);
	margin-left: 0 !important;
	margin-right: 0 !important;
}
/* the inner column no longer needs its own card look or column width */
.section-contact .drop-message {
	float: none;
	width: 100% !important;
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
	box-shadow: none;
}
.section-contact .contact-content > .btn { margin-top: 12px; }
/* Sidebar card for the clinic details */
.contact-details {
	background: linear-gradient(160deg, var(--olive-tint), var(--cream-2));
	border: 1px solid rgba(99, 110, 72, .25);
	border-radius: var(--radius-lg);
	padding: 30px 30px 14px;
	box-shadow: var(--shadow-sm);
}
.contact-details .contact-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
@media (max-width: 991px) {
	.contact-details { margin-top: 30px; }
}

/* Contact details list */
.contact-list h3 {
	font-size: 26px !important;
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 16px;
}
.contact-list h3::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 40px; height: 2px;
	background: var(--olive);
	border-radius: 2px;
}
.contact-list li {
	padding: 10px 0;
	border-bottom: 1px solid var(--cream);
	font-size: 14.5px;
}
.contact-list li:last-child { border-bottom: 0; }
.contact-list .color-primary { color: var(--olive) !important; letter-spacing: .08em; font-size: 12px; }

/* Location cards (olive gradient — the page sets these olive via #t2) */
.round.pd-x3, #t2.round {
	background: linear-gradient(150deg, var(--olive), var(--olive-dark)) !important;
	border: 1px solid rgba(255, 255, 255, .08);
	border-radius: var(--radius-lg) !important;
	padding: 32px 28px;
	box-shadow: var(--shadow-md);
	height: 100%;
	transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.round.pd-x3:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-lg);
}
.round.pd-x3 img { border-radius: var(--radius); margin: 0 auto 6px; }
.round.pd-x3 h5 {
	font-size: 24px !important;
	color: #fff !important;
	margin: 10px 0 8px;
}
.round.pd-x3 p { color: rgba(255, 255, 255, .88); }
.icon-box.style-s2 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 62px; height: 62px;
	background: var(--olive-tint) !important;
	color: var(--olive) !important;
	border-radius: 50% !important;
	margin-bottom: 12px;
	transition: all .35s var(--ease);
}
.icon-box.style-s2 .fa, .icon-box.style-s2 i { color: var(--olive) !important; font-size: 24px; }
.round.pd-x3:hover .icon-box.style-s2 {
	transform: rotate(-6deg) scale(1.08);
}

/* Google maps iframes — framed softly */
.section iframe[src*="google.com/maps"] {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	border: 1px solid var(--line);
}

/* ============================================================
   30. SCROLL-REVEAL for inner-page components
   ============================================================ */
@supports (animation-timeline: view()) {
	.team-member,
	.post-loop,
	.video-card,
	.quotes.quotes-flat,
	.faqs-row .faqs,
	.round.pd-x3,
	.feature.boxed .fbox-content,
	.sidebar-right .wgs-box {
		animation: revealUp 1s var(--ease) both;
		animation-timeline: view();
		animation-range: entry 0% entry 42%;
	}
	.team-member-row .col-md-4:nth-child(even) .team-member,
	.post-loop:nth-child(even),
	.video-col:nth-child(even) .video-card {
		animation-name: revealUpSoft;
	}
}

/* ============================================================
   31. CTA BAND + FOOTER — premium polish pass
   ============================================================ */
/* CTA band — more air, eyebrow-style subtitle */
.call-action .cta-block { padding: 26px 0; }
.call-action .cta-sameline h3 {
	font-size: clamp(26px, 3vw, 40px) !important;
}
.call-action .cta-sameline p {
	font-size: 13px !important;
	font-weight: 600;
	letter-spacing: .22em !important;
	text-transform: uppercase;
	color: var(--olive-tint) !important;
	margin: 4px 0 2px;
}

/* Footer — deeper gradient canvas */
.footer-widget.style-v2 {
	background: linear-gradient(180deg, #3a4129 0%, var(--olive-deep) 45%, #2b3120 100%) !important;
	padding-top: 70px;
	padding-bottom: 46px;
}
/* Column titles — a touch larger, gradient keyline */
.footer-widget .wgs-title {
	font-size: 24px !important;
	margin-bottom: 22px;
}
.footer-widget .wgs-title::after {
	width: 40px;
	background: linear-gradient(90deg, var(--olive-light), rgba(138, 145, 104, .25));
}
/* Kill the stray indent on link lists and space them evenly */
.footer-widget .wgs-content .menu,
.footer-widget .wgs-content ul.menu {
	list-style: none;
	padding-left: 0 !important;
	margin: 0;
}
.footer-widget .wgs-content .menu li { margin: 0; }
.footer-widget .wgs-content .menu li a {
	display: inline-block;
	padding: 7px 0;
	font-size: 14.5px;
	line-height: 1.5;
}
/* Contact column rhythm */
.footer-widget .wgs-content p { margin-bottom: 12px; line-height: 1.8; }
.footer-widget .wgs-content p strong { color: var(--cream) !important; font-size: 15px; }
.footer-widget .wgs-content p span { letter-spacing: .02em; }
/* Social icons row breathing space */
.footer-widget .social { margin-top: 6px; }
.footer-widget .social li { margin-right: 6px; }

/* Copyright bar — centred, quieter */
.copyright.style-v2 { padding: 18px 0; }
.copyright.style-v2 .site-copy { width: 100%; text-align: center; float: none; }
.copyright.style-v2 p { margin: 0; letter-spacing: .02em; }

/* ============================================================
   19. ACCESSIBILITY — respect reduced-motion preferences
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	html { scroll-behavior: auto; }
}