/* ============================================
   Jain Eye Hospital & Laser Centre
   Main Stylesheet
   ============================================ */

:root {
    --primary-green: #043018;
    --secondary-green: #124F2E;
    --cta-orange: #FD5B02;
    --support-orange: #F6630C;
    --warm-amber: #EFA646;
    --soft-sage: #EAF3EC;
    --warm-white: #FAFAF9;
    --pure-white: #FFFFFF;
    --charcoal: #17201B;
    --muted-text: #5F6963;
    --light-border: #D4DDD6;
    --font-heading: 'Manrope', 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 2px rgba(4,48,24,0.05);
    --shadow-md: 0 4px 12px rgba(4,48,24,0.08);
    --shadow-lg: 0 8px 30px rgba(4,48,24,0.12);
    --shadow-xl: 0 20px 50px rgba(4,48,24,0.15);
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    --header-height: 80px;
    --header-height-scrolled: 64px;
    --utility-height: 40px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: var(--font-body); font-size: 1rem; line-height: 1.7; color: var(--charcoal); background: var(--warm-white); overflow-x: hidden; }
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--secondary-green); text-decoration: none; transition: color var(--transition-fast); }
a:hover, a:focus { color: var(--cta-orange); }
a:focus-visible { outline: 2px solid var(--cta-orange); outline-offset: 2px; border-radius: 2px; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }

h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2; color: var(--primary-green); letter-spacing: -0.02em; }
h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
h2 { font-size: clamp(2rem, 4vw, 3rem); }
h3 { font-size: clamp(1.5rem, 3vw, 2rem); }
h4 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }
p { margin-bottom: 1rem; color: var(--muted-text); }

.text-lead { font-size: 1.125rem; line-height: 1.7; color: var(--charcoal); }
.text-small { font-size: 0.875rem; line-height: 1.5; }

.local-location-note { margin: 1.5rem 0 2rem; padding: 1rem 1.25rem; border-left: 4px solid var(--warm-amber); border-radius: var(--radius-sm); background: var(--soft-sage); color: var(--charcoal); }
.local-location-note strong { color: var(--primary-green); }

.container { width: 100%; max-width: 100%; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .container { padding: 0 2rem; } }
@media (min-width: 1280px) { .container { padding: 0 3rem; } }

.skip-link { position: absolute; top: -100%; left: 50%; transform: translateX(-50%); background: var(--primary-green); color: var(--pure-white); padding: 0.75rem 1.5rem; border-radius: 0 0 var(--radius-md) var(--radius-md); z-index: 9999; font-weight: 600; transition: top var(--transition-base); }
.skip-link:focus { top: 0; }

.cookie-notice { position: fixed; bottom: 0; left: 0; right: 0; background: var(--primary-green); color: var(--pure-white); z-index: 9998; padding: 1rem 0; box-shadow: 0 -4px 20px rgba(0,0,0,0.15); }
.cookie-container { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cookie-notice p { color: rgba(255,255,255,0.9); margin: 0; font-size: 0.875rem; }
.cookie-notice a { color: var(--warm-amber); text-decoration: underline; }
.btn-cookie-accept { background: var(--cta-orange); color: var(--pure-white); padding: 0.5rem 1.25rem; border-radius: var(--radius-sm); font-weight: 600; font-size: 0.875rem; white-space: nowrap; transition: background var(--transition-fast); }
.btn-cookie-accept:hover { background: var(--support-orange); }

.utility-bar { background: var(--primary-green); color: rgba(255,255,255,0.85); font-size: 0.8125rem; padding: 0.5rem 0; position: relative; z-index: 1001; }
.utility-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem; }
.utility-left, .utility-right { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.utility-link { color: rgba(255,255,255,0.85); display: inline-flex; align-items: center; gap: 0.375rem; transition: color var(--transition-fast); }
.utility-link:hover, .utility-link:focus { color: var(--pure-white); }
.utility-link svg { flex-shrink: 0; opacity: 0.7; }
.hospital-phone-list { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0.35rem; }
.hospital-phone-list a { white-space: nowrap; }
.phone-separator { opacity: 0.65; }
.utility-link .hospital-phone-list a { color: inherit; }
.utility-separator { opacity: 0.4; }
.utility-hours { color: rgba(255,255,255,0.6); }

.main-header { background: var(--pure-white); box-shadow: var(--shadow-sm); position: sticky; top: 0; z-index: 1000; height: var(--header-height); transition: height var(--transition-base), box-shadow var(--transition-base); }
.main-header.scrolled { height: var(--header-height-scrolled); box-shadow: var(--shadow-md); }
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 100%; gap: 1.5rem; }

.logo { display: flex; align-items: center; flex-shrink: 0; }
.brand-logo { width: 220px; height: auto; display: block; }
.logo-mark { width: 54px; height: 42px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.logo-mark img { width: 106px; max-width: none; height: auto; }
.logo-text { display: flex; flex-direction: column; line-height: 1.1; }
.logo-primary { font-family: var(--font-heading); font-weight: 800; font-size: 1.125rem; color: var(--primary-green); letter-spacing: -0.01em; }
.logo-secondary { font-family: var(--font-heading); font-weight: 600; font-size: 0.75rem; color: var(--secondary-green); }
.logo-tagline { font-size: 0.625rem; color: var(--muted-text); margin-top: 0.125rem; font-weight: 500; }

.main-nav { display: none; }
@media (min-width: 1024px) { .main-nav { display: block; } }
.nav-list { display: flex; align-items: center; gap: 0.25rem; }
.nav-link { display: block; padding: 0.5rem 0.75rem; color: var(--charcoal); font-weight: 500; font-size: 0.9375rem; border-radius: var(--radius-sm); transition: all var(--transition-fast); position: relative; }
.nav-link::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 2px; background: var(--cta-orange); transition: width var(--transition-base); border-radius: 2px; }
.nav-link:hover, .nav-link:focus { color: var(--primary-green); background: var(--soft-sage); }
.nav-link:hover::after, .nav-link:focus::after { width: 60%; }
.nav-item.active .nav-link { color: var(--primary-green); font-weight: 600; }
.nav-item.active .nav-link::after { width: 60%; }

.has-mega { position: relative; }
.mega-menu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px); background: var(--pure-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-xl); padding: 1.5rem; min-width: 800px; opacity: 0; visibility: hidden; pointer-events: none; transition: all var(--transition-base); margin-top: 0.5rem; border: 1px solid var(--light-border); }
.has-mega:hover .mega-menu, .has-mega:focus-within .mega-menu { opacity: 1; visibility: visible; pointer-events: all; transform: translateX(-50%) translateY(0); }
.mega-services { min-width: min(1000px, calc(100vw - 2rem)); }
.mega-about { min-width: min(600px, calc(100vw - 2rem)); }
.mega-about .mega-inner { grid-template-columns: 1fr 1.25fr; gap: 2.25rem; }
.mega-inner { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 1.5rem; }
.mega-col h4 { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted-text); margin-bottom: 1rem; font-weight: 600; }
.mega-col ul { display: flex; flex-direction: column; gap: 0.5rem; }
.mega-col ul a { display: block; padding: 0.375rem 0; color: var(--charcoal); font-size: 0.9375rem; transition: all var(--transition-fast); border-radius: var(--radius-sm); }
.mega-col ul a:hover, .mega-col ul a:focus { color: var(--cta-orange); padding-left: 0.5rem; }
.mega-leadership ul { gap: 0.4rem; }
.mega-leadership .doctor-link { display: flex; align-items: center; gap: 0.65rem; min-height: 2.75rem; padding: 0.3rem 0.5rem 0.3rem 0.3rem; color: var(--charcoal); font-size: 0.875rem; line-height: 1.2; }
.mega-leadership .doctor-link:hover, .mega-leadership .doctor-link:focus { padding-left: 0.55rem; color: var(--primary-green); background: var(--soft-sage); }
.doctor-avatar { width: 2.2rem; height: 2.2rem; flex: 0 0 2.2rem; border-radius: 50%; object-fit: cover; object-position: center top; border: 2px solid var(--soft-sage); background: #eef5ef; transition: border-color var(--transition-fast), transform var(--transition-fast); }
.doctor-link:hover .doctor-avatar, .doctor-link:focus .doctor-avatar { border-color: var(--cta-orange); transform: scale(1.06); }
.doctor-link-arrow { margin-left: auto; color: var(--cta-orange); font-size: 1rem; font-weight: 700; opacity: 0; transform: translateX(-3px); transition: all var(--transition-fast); }
.doctor-link:hover .doctor-link-arrow, .doctor-link:focus .doctor-link-arrow { opacity: 1; transform: translateX(0); }
.mega-categories ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.35rem 0.65rem; }
.mega-categories .service-link a { display: flex; align-items: center; justify-content: space-between; gap: 0.35rem; min-height: 2.25rem; padding: 0.45rem 0.55rem; color: var(--charcoal); font-size: 0.84rem; line-height: 1.2; border: 1px solid transparent; }
.mega-categories .service-link a:hover, .mega-categories .service-link a:focus { padding-left: 0.75rem; color: var(--primary-green); background: var(--soft-sage); border-color: rgba(4, 93, 53, 0.12); }
.mega-categories .service-link.active a { color: var(--pure-white); background: var(--primary-green); border-color: var(--primary-green); box-shadow: 0 4px 10px rgba(4, 48, 24, 0.16); }
.service-link-arrow { flex: 0 0 auto; color: var(--cta-orange); font-size: 1rem; font-weight: 700; opacity: 0; transform: translateX(-3px); transition: all var(--transition-fast); }
.service-link a:hover .service-link-arrow, .service-link a:focus .service-link-arrow, .service-link.active .service-link-arrow { opacity: 1; transform: translateX(0); }
.service-link.active .service-link-arrow { color: var(--pure-white); }
.mega-conditions ul a { font-size: 0.84rem; line-height: 1.25; }
.preview-image { position: relative; border-radius: var(--radius-md); overflow: hidden; aspect-ratio: 4/3; }
.preview-image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.preview-image:hover img { transform: scale(1.02); }
.preview-overlay { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.15rem; background: linear-gradient(transparent, rgba(4,48,24,0.94) 32%); color: var(--pure-white); }
.preview-overlay h5 { color: var(--pure-white); font-size: 1.125rem; margin-bottom: 0.25rem; }
.preview-overlay p { color: rgba(255,255,255,0.85); font-size: 0.8rem; line-height: 1.35; margin-bottom: 0.75rem; }
.btn-preview { display: inline-block; background: var(--cta-orange); color: var(--pure-white); padding: 0.5rem 1rem; border-radius: var(--radius-sm); font-size: 0.875rem; font-weight: 600; transition: background var(--transition-fast); }
.btn-preview:hover { background: var(--support-orange); color: var(--pure-white); }

.header-actions { display: flex; align-items: center; gap: 1rem; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.75rem 1.5rem; border-radius: var(--radius-md); font-weight: 600; font-size: 0.9375rem; transition: all var(--transition-fast); cursor: pointer; border: 2px solid transparent; white-space: nowrap; }
.btn-primary { background: var(--cta-orange); color: var(--pure-white); border-color: var(--cta-orange); }
.btn-primary:hover, .btn-primary:focus { background: var(--support-orange); border-color: var(--support-orange); color: var(--pure-white); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(253,91,2,0.3); }
.btn-secondary { background: var(--primary-green); color: var(--pure-white); border-color: var(--primary-green); }
.btn-secondary:hover, .btn-secondary:focus { background: var(--secondary-green); border-color: var(--secondary-green); color: var(--pure-white); }
.btn-outline { background: transparent; color: var(--primary-green); border-color: var(--primary-green); }
.btn-outline:hover, .btn-outline:focus { background: var(--primary-green); color: var(--pure-white); }
.btn-white { background: var(--pure-white); color: var(--primary-green); border-color: var(--pure-white); }
.btn-white:hover, .btn-white:focus { background: var(--soft-sage); border-color: var(--soft-sage); color: var(--primary-green); }
.btn-sm { padding: 0.5rem 1rem; font-size: 0.875rem; }
.btn-block { width: 100%; }
.btn svg { flex-shrink: 0; }

.mobile-toggle { display: flex; flex-direction: column; gap: 5px; padding: 0.5rem; z-index: 1002; }
.mobile-toggle span { display: block; width: 24px; height: 2px; background: var(--primary-green); transition: all var(--transition-base); border-radius: 2px; }
.mobile-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.mobile-toggle.active span:nth-child(2) { opacity: 0; }
.mobile-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
@media (min-width: 1024px) { .mobile-toggle { display: none; } }

.mobile-menu { position: fixed; top: var(--header-height); left: 0; right: 0; bottom: 0; background: var(--pure-white); z-index: 999; transform: translateX(100%); transition: transform var(--transition-base); overflow-y: auto; padding: 2rem 1.5rem; }
.mobile-menu.active { transform: translateX(0); }
.mobile-nav-list { display: flex; flex-direction: column; gap: 0.25rem; }
.mobile-nav-list > li > a, .accordion-trigger { display: block; padding: 0.875rem 0; color: var(--charcoal); font-weight: 600; font-size: 1.125rem; border-bottom: 1px solid var(--soft-sage); width: 100%; text-align: left; }
.has-accordion { border-bottom: 1px solid var(--soft-sage); }
.accordion-trigger { display: flex; justify-content: space-between; align-items: center; background: none; border: none; border-bottom: none; padding-bottom: 0; }
.accordion-trigger::after { content: '+'; font-size: 1.5rem; color: var(--cta-orange); transition: transform var(--transition-base); }
.accordion-trigger.active::after { content: '−'; }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height var(--transition-base); padding-left: 1rem; }
.accordion-content.active { max-height: 500px; }
.accordion-content li a { display: block; padding: 0.625rem 0; color: var(--muted-text); font-size: 1rem; }
.accordion-content li a:hover { color: var(--cta-orange); }
.mobile-cta { margin-top: 2rem; display: flex; flex-direction: column; gap: 0.75rem; }
@media (min-width: 1024px) { .mobile-menu { display: none; } }

.floating-actions { position: fixed; bottom: 2rem; right: 2rem; display: flex; flex-direction: column; gap: 0.75rem; z-index: 998; }
.float-btn { width: 52px; height: 52px; border-radius: var(--radius-full); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-lg); transition: all var(--transition-base); color: var(--pure-white); }
.float-btn:hover { transform: translateY(-3px); box-shadow: var(--shadow-xl); }
.float-whatsapp { background: #25D366; }
.float-top { background: var(--primary-green); opacity: 0; visibility: hidden; transform: translateY(20px); }
.float-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }

.mobile-bottom-bar { position: fixed; bottom: 0; left: 0; right: 0; background: var(--pure-white); border-top: 1px solid var(--light-border); display: flex; justify-content: space-around; padding: 0.5rem 0; z-index: 997; box-shadow: 0 -2px 10px rgba(0,0,0,0.05); }
.mob-bar-btn { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; color: var(--muted-text); font-size: 0.75rem; font-weight: 500; padding: 0.25rem 1rem; transition: color var(--transition-fast); }
.mob-bar-btn:hover, .mob-bar-btn:focus { color: var(--primary-green); }
.mob-whatsapp { color: #25D366; }
.mob-book { color: var(--cta-orange); font-weight: 600; }
@media (min-width: 768px) { .mobile-bottom-bar { display: none; } body { padding-bottom: 0; } }
@media (max-width: 767px) { body { padding-bottom: 60px; } .floating-actions { bottom: 5rem; right: 1rem; } .float-btn { width: 44px; height: 44px; } }

/* HERO */
.hero { position: relative; min-height: 92vh; display: flex; align-items: center; overflow: hidden; background: var(--primary-green); }
.hero-video-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.4; }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(4,48,24,0.95) 0%, rgba(4,48,24,0.7) 50%, rgba(4,48,24,0.3) 100%); }
.hero-content { position: relative; z-index: 2; width: 100%; padding: 4rem 0; }
.hero-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .hero-grid { grid-template-columns: 1.1fr 0.9fr; } }
.hero-text { color: var(--pure-white); }
.hero-eyebrow { display: inline-block; background: rgba(253,91,2,0.2); color: var(--warm-amber); padding: 0.375rem 1rem; border-radius: var(--radius-full); font-size: 0.875rem; font-weight: 600; margin-bottom: 1.5rem; letter-spacing: 0.02em; }
.hero-title { color: var(--pure-white); margin-bottom: 1.5rem; line-height: 1.1; }
.hero-title span { color: var(--warm-amber); }
.hero-desc { color: rgba(255,255,255,0.85); font-size: 1.125rem; max-width: 540px; margin-bottom: 2rem; }
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; }
.hero-contact-strip { display: flex; gap: 1.5rem; flex-wrap: wrap; font-size: 0.875rem; color: rgba(255,255,255,0.7); }
.hero-contact-strip a { color: rgba(255,255,255,0.85); display: inline-flex; align-items: center; gap: 0.375rem; }
.hero-contact-strip a:hover { color: var(--warm-amber); }
.hero-phone-group { display: inline-flex; align-items: center; gap: 0.375rem; flex-wrap: wrap; }
.hero-phone-group .hospital-phone-list a { color: rgba(255,255,255,0.85); }
.hospital-phone-cta .hospital-phone-list a { color: inherit; }

.hero-visual { position: relative; display: flex; justify-content: center; align-items: center; }
.iris-portal { position: relative; width: 100%; max-width: 480px; aspect-ratio: 1; }
.iris-mask { position: relative; width: 100%; height: 100%; border-radius: 60% 40% 55% 45% / 45% 55% 45% 55%; overflow: hidden; background: radial-gradient(circle at 50% 42%, rgba(234,243,236,0.98) 0%, rgba(234,243,236,0.75) 45%, rgba(18,79,46,0.9) 100%); box-shadow: 0 20px 60px rgba(0,0,0,0.3), inset 0 0 40px rgba(4,48,24,0.2); border: 3px solid rgba(253,91,2,0.3); animation: irisBreathe 6s ease-in-out infinite; }
@keyframes irisBreathe { 0%, 100% { border-radius: 60% 40% 55% 45% / 45% 55% 45% 55%; transform: scale(1); } 50% { border-radius: 55% 45% 60% 40% / 50% 50% 50% 50%; transform: scale(1.02); } }
.iris-mask img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; padding: 1.25rem 1rem 0; }
.iris-mask .hero-doctor-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .65s ease, visibility .65s ease; }
.iris-mask .hero-doctor-slide.is-active { opacity: 1; visibility: visible; }
.iris-mask .hero-doctor-slide { filter: drop-shadow(0 18px 18px rgba(4,48,24,0.28)); }
.iris-labels { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.iris-label { position: absolute; background: rgba(255,255,255,0.95); color: var(--primary-green); padding: 0.5rem 1rem; border-radius: var(--radius-full); font-size: 0.8125rem; font-weight: 600; box-shadow: var(--shadow-md); opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s ease; animation: floatLabel 4s ease-in-out infinite; }
.iris-label.is-active { opacity: 1; visibility: visible; }
.iris-label:nth-child(1) { top: 10%; left: -10%; animation-delay: 0s; }
.iris-label:nth-child(2) { top: 40%; right: -15%; animation-delay: 1.5s; }
.iris-label:nth-child(3) { bottom: 15%; left: 5%; animation-delay: 3s; }
@keyframes floatLabel { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.iris-controls { position: absolute; bottom: -2rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.5rem; align-items: center; }
.iris-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.4); cursor: pointer; transition: all var(--transition-fast); }
.iris-dot.active { background: var(--cta-orange); transform: scale(1.3); }
.iris-arrow { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.15); color: var(--pure-white); display: flex; align-items: center; justify-content: center; transition: all var(--transition-fast); backdrop-filter: blur(4px); }
.iris-arrow:hover { background: var(--cta-orange); }

/* SECTIONS */
.section { padding: 5rem 0; position: relative; }
@media (min-width: 768px) { .section { padding: 6rem 0; } }
@media (min-width: 1024px) { .section { padding: 7rem 0; } }
.section-header { text-align: center; max-width: 700px; margin: 0 auto 3rem; }
.section-eyebrow { display: inline-block; color: var(--cta-orange); font-weight: 700; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 0.75rem; }
.section-title { margin-bottom: 1rem; }
.section-desc { font-size: 1.125rem; color: var(--muted-text); }

/* GATEWAYS */
.gateways { background: var(--soft-sage); padding: 2.5rem 0; }
.gateways-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 640px) { .gateways-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .gateways-grid { grid-template-columns: repeat(5, 1fr); } }
.gateway-card { background: var(--pure-white); border-radius: var(--radius-lg); padding: 1.5rem 1rem; text-align: center; box-shadow: var(--shadow-sm); transition: all var(--transition-base); border: 1px solid transparent; }
.gateway-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--light-border); }
.gateway-icon { width: 48px; height: 48px; margin: 0 auto 0.75rem; color: var(--cta-orange); }
.gateway-card h3 { font-size: 1rem; margin-bottom: 0.25rem; }
.gateway-card p { font-size: 0.8125rem; margin: 0; color: var(--muted-text); }
.urgent-note { margin-top: 1.5rem; padding: 1rem; background: rgba(253,91,2,0.08); border-left: 3px solid var(--cta-orange); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; font-size: 0.875rem; color: var(--charcoal); }
.urgent-note strong { color: var(--cta-orange); }

/* WELCOME */
.welcome-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .welcome-grid { grid-template-columns: 1fr 1fr; } }
.welcome-images { position: relative; }
.welcome-main-img { border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); }
.welcome-main-img img { width: 100%; height: auto; }
.welcome-detail-img { position: absolute; bottom: -2rem; right: -1rem; width: 200px; height: 200px; border-radius: 50%; overflow: hidden; border: 4px solid var(--pure-white); box-shadow: var(--shadow-lg); }
.welcome-detail-img img { width: 100%; height: 100%; object-fit: cover; }
.welcome-content h2 { margin-bottom: 1.25rem; }
.welcome-content .text-lead { margin-bottom: 1.5rem; }
.proof-points { display: flex; flex-direction: column; gap: 1rem; margin: 1.5rem 0; }
.proof-point { display: flex; align-items: flex-start; gap: 0.875rem; }
.proof-point svg { flex-shrink: 0; color: var(--cta-orange); margin-top: 0.125rem; }
.proof-point h4 { font-size: 1rem; margin-bottom: 0.25rem; }
.proof-point p { font-size: 0.875rem; margin: 0; }

/* SERVICES */
.services-section { background: linear-gradient(180deg, var(--warm-white) 0%, var(--soft-sage) 100%); }
.services-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .services-grid { grid-template-columns: repeat(3, 1fr); } }
.service-card { background: var(--pure-white); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); transition: all var(--transition-base); display: flex; flex-direction: column; }
.service-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: transparent; }
.service-card-image { position: relative; height: 200px; overflow: hidden; }
.service-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.service-card:hover .service-card-image img { transform: scale(1.05); }
.service-card-icon { position: absolute; bottom: -24px; left: 1.5rem; width: 48px; height: 48px; background: var(--cta-orange); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; color: var(--pure-white); box-shadow: var(--shadow-md); }
.service-card-body { padding: 2.5rem 1.5rem 1.5rem; flex: 1; display: flex; flex-direction: column; }
.service-card-body h3 { font-size: 1.25rem; margin-bottom: 0.75rem; }
.service-card-body p { font-size: 0.9375rem; margin-bottom: 1rem; flex: 1; }
.service-card-meta { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--soft-sage); }
.service-doctor { font-size: 0.8125rem; color: var(--muted-text); }
.service-link { color: var(--cta-orange); font-weight: 600; font-size: 0.875rem; display: inline-flex; align-items: center; gap: 0.25rem; }
.service-link:hover { color: var(--support-orange); }
.service-link svg { transition: transform var(--transition-fast); }
.service-link:hover svg { transform: translateX(3px); }

/* WHY CHOOSE */
.why-section { background: var(--primary-green); color: var(--pure-white); overflow: hidden; }
.why-section .section-title, .why-section .section-eyebrow { color: var(--pure-white); }
.why-section .section-desc { color: rgba(255,255,255,0.8); }
.why-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; margin-top: 3rem; }
@media (min-width: 768px) { .why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .why-grid { grid-template-columns: repeat(3, 1fr); } }
.why-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-xl); padding: 2rem; transition: all var(--transition-base); }
.why-card:hover { background: rgba(255,255,255,0.1); transform: translateY(-4px); }
.why-card-icon { width: 56px; height: 56px; background: rgba(253,91,2,0.2); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; color: var(--warm-amber); margin-bottom: 1.25rem; }
.why-card h3 { color: var(--pure-white); font-size: 1.25rem; margin-bottom: 0.75rem; }
.why-card p { color: rgba(255,255,255,0.75); font-size: 0.9375rem; margin: 0; }

/* DOCTORS */
.doctors-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .doctors-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .doctors-grid { grid-template-columns: repeat(3, 1fr); } }
.doctor-card { background: var(--pure-white); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--light-border); transition: all var(--transition-base); position: relative; }
.doctor-card:hover { transform: translateY(-6px) rotate(0.5deg); box-shadow: var(--shadow-xl); }
.doctor-card-image { position: relative; height: 320px; overflow: hidden; background: linear-gradient(135deg, var(--soft-sage) 0%, var(--light-border) 100%); }
.doctor-card-image img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform var(--transition-slow); }
.doctor-card:hover .doctor-card-image img { transform: scale(1.03); }
.doctor-card-badge { position: absolute; top: 1rem; right: 1rem; background: var(--cta-orange); color: var(--pure-white); padding: 0.375rem 0.875rem; border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.doctor-card-body { padding: 1.5rem; }
.doctor-card-body h3 { font-size: 1.25rem; margin-bottom: 0.25rem; }
.doctor-designation { color: var(--cta-orange); font-weight: 600; font-size: 0.875rem; margin-bottom: 0.75rem; display: block; }
.doctor-qualifications { font-size: 0.875rem; color: var(--muted-text); margin-bottom: 1rem; }
.doctor-specialties { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.25rem; }
.doctor-specialty-tag { background: var(--soft-sage); color: var(--secondary-green); padding: 0.25rem 0.75rem; border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 600; }
.doctor-card-actions { display: flex; gap: 0.75rem; }
.doctor-card-actions .btn { flex: 1; padding: 0.625rem 1rem; font-size: 0.875rem; }

/* TECHNOLOGY */
.tech-section { background: var(--warm-white); }
.tech-scroll-container { display: flex; gap: 1.5rem; overflow-x: auto; padding-bottom: 1rem; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--cta-orange) var(--soft-sage); }
.tech-scroll-container::-webkit-scrollbar { height: 6px; }
.tech-scroll-container::-webkit-scrollbar-track { background: var(--soft-sage); border-radius: var(--radius-full); }
.tech-scroll-container::-webkit-scrollbar-thumb { background: var(--cta-orange); border-radius: var(--radius-full); }
.tech-card { flex: 0 0 320px; scroll-snap-align: start; background: var(--pure-white); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--light-border); }
.tech-card-image { height: 200px; overflow: hidden; }
.tech-card-image img { width: 100%; height: 100%; object-fit: cover; }
.tech-card-body { padding: 1.5rem; }
.tech-card-body h3 { font-size: 1.125rem; margin-bottom: 0.5rem; }
.tech-card-body p { font-size: 0.875rem; margin-bottom: 0.75rem; }
.tech-verification { font-size: 0.75rem; color: var(--muted-text); font-style: italic; padding: 0.5rem; background: var(--soft-sage); border-radius: var(--radius-sm); }

/* SAFETY */
.safety-section { background: linear-gradient(135deg, var(--soft-sage) 0%, var(--warm-white) 100%); }
.safety-pathway { display: flex; flex-direction: column; gap: 1.5rem; max-width: 800px; margin: 0 auto; }
@media (min-width: 768px) { .safety-pathway { flex-direction: row; flex-wrap: wrap; justify-content: center; } }
.safety-item { display: flex; align-items: center; gap: 1rem; background: var(--pure-white); padding: 1.25rem 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); transition: all var(--transition-base); flex: 1; min-width: 280px; }
.safety-item:hover { transform: translateX(8px); box-shadow: var(--shadow-md); border-color: var(--cta-orange); }
.safety-icon { width: 48px; height: 48px; background: var(--soft-sage); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--secondary-green); flex-shrink: 0; }
.safety-item h4 { font-size: 1rem; margin-bottom: 0.25rem; }
.safety-item p { font-size: 0.875rem; margin: 0; }

/* JOURNEY */
.journey-section { background: var(--warm-white); }
.journey-path { position: relative; max-width: 900px; margin: 0 auto; }
.journey-path::before { content: ''; position: absolute; left: 24px; top: 0; bottom: 0; width: 3px; background: linear-gradient(180deg, var(--cta-orange) 0%, var(--secondary-green) 100%); border-radius: var(--radius-full); }
@media (min-width: 768px) { .journey-path::before { left: 50%; transform: translateX(-50%); } }
.journey-step { position: relative; padding-left: 4rem; margin-bottom: 2rem; }
@media (min-width: 768px) { .journey-step { padding-left: 0; display: grid; grid-template-columns: 1fr 60px 1fr; gap: 2rem; align-items: center; } .journey-step:nth-child(even) .journey-step-content { grid-column: 3; text-align: left; } .journey-step:nth-child(even) .journey-step-number { grid-column: 2; } .journey-step:nth-child(odd) .journey-step-content { grid-column: 1; text-align: right; } .journey-step:nth-child(odd) .journey-step-number { grid-column: 2; } }
.journey-step-number { position: absolute; left: 0; top: 0; width: 48px; height: 48px; background: var(--cta-orange); color: var(--pure-white); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.125rem; box-shadow: 0 0 0 6px var(--warm-white); z-index: 2; }
@media (min-width: 768px) { .journey-step-number { position: relative; left: auto; top: auto; margin: 0 auto; } }
.journey-step-content { background: var(--pure-white); padding: 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); cursor: pointer; transition: all var(--transition-base); }
.journey-step-content:hover { box-shadow: var(--shadow-md); border-color: var(--cta-orange); }
.journey-step-content h4 { font-size: 1.125rem; margin-bottom: 0.5rem; color: var(--primary-green); }
.journey-step-content p { font-size: 0.9375rem; margin: 0; }
.journey-step-detail { max-height: 0; overflow: hidden; transition: max-height var(--transition-slow); }
.journey-step-detail.active { max-height: 200px; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--soft-sage); }
.journey-step-detail p { font-size: 0.875rem; color: var(--muted-text); }

/* INSURANCE */
.insurance-section { background: linear-gradient(180deg, var(--soft-sage) 0%, var(--warm-white) 100%); }
.insurance-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .insurance-grid { grid-template-columns: 1fr 1fr; } }
.insurance-card { background: var(--pure-white); padding: 2.5rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-md); border: 1px solid var(--light-border); height: 100%; }
.insurance-card h3 { font-size: 1.5rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.75rem; }
.insurance-card h3 svg { color: var(--cta-orange); }
.insurance-card ul { display: flex; flex-direction: column; gap: 0.75rem; margin: 1.5rem 0; }
.insurance-card ul li { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.9375rem; color: var(--charcoal); }
.insurance-card ul li svg { flex-shrink: 0; color: var(--secondary-green); margin-top: 0.25rem; }
.insurance-disclaimer { background: var(--soft-sage); padding: 1rem; border-radius: var(--radius-md); font-size: 0.875rem; color: var(--muted-text); margin-top: 1.5rem; border-left: 3px solid var(--warm-amber); }

/* COMMUNITY */
.community-section { background: var(--warm-white); }
.tabs-nav { display: flex; gap: 0.5rem; justify-content: center; margin-bottom: 2.5rem; flex-wrap: wrap; }
.tab-btn { padding: 0.625rem 1.5rem; border-radius: var(--radius-full); font-weight: 600; font-size: 0.9375rem; color: var(--muted-text); background: var(--soft-sage); transition: all var(--transition-fast); border: 2px solid transparent; }
.tab-btn:hover, .tab-btn:focus { color: var(--primary-green); background: var(--light-border); }
.tab-btn.active { background: var(--primary-green); color: var(--pure-white); }
.tab-content { display: none; }
.tab-content.active { display: block; animation: fadeIn 0.5s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* EDUCATION */
.education-section { background: linear-gradient(135deg, var(--primary-green) 0%, var(--secondary-green) 100%); color: var(--pure-white); }
.education-section .section-title { color: var(--pure-white); }
.education-section .section-desc { color: rgba(255,255,255,0.8); }
.edu-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .edu-grid { grid-template-columns: 1.5fr 1fr; } }
.edu-articles { display: grid; gap: 1.5rem; }
.edu-article { display: flex; gap: 1.25rem; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-lg); padding: 1.25rem; transition: all var(--transition-base); }
.edu-article:hover { background: rgba(255,255,255,0.1); transform: translateX(4px); }
.edu-article-img { width: 100px; height: 100px; border-radius: var(--radius-md); overflow: hidden; flex-shrink: 0; }
.edu-article-img img { width: 100%; height: 100%; object-fit: cover; }
.edu-article-content h4 { color: var(--pure-white); font-size: 1.0625rem; margin-bottom: 0.375rem; }
.edu-article-content p { color: rgba(255,255,255,0.75); font-size: 0.875rem; margin: 0; }
.edu-article-meta { display: flex; gap: 1rem; margin-top: 0.5rem; font-size: 0.75rem; color: var(--warm-amber); }
.booking-panel { background: var(--pure-white); border-radius: var(--radius-xl); padding: 2rem; color: var(--charcoal); }
.booking-panel h3 { color: var(--primary-green); font-size: 1.5rem; margin-bottom: 0.5rem; }
.booking-panel > p { color: var(--muted-text); margin-bottom: 1.5rem; }

/* FORMS */
.form-group { margin-bottom: 1rem; }
.form-label { display: block; font-size: 0.875rem; font-weight: 600; color: var(--charcoal); margin-bottom: 0.375rem; }
.form-input, .form-select, .form-textarea { width: 100%; padding: 0.75rem 1rem; border: 1.5px solid var(--light-border); border-radius: var(--radius-md); font-family: inherit; font-size: 0.9375rem; color: var(--charcoal); background: var(--pure-white); transition: all var(--transition-fast); }
.form-input:focus, .form-select:focus, .form-textarea:focus { outline: none; border-color: var(--cta-orange); box-shadow: 0 0 0 3px rgba(253,91,2,0.1); }
.form-textarea { resize: vertical; min-height: 100px; }
.form-checkbox { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.8125rem; color: var(--muted-text); }
.form-checkbox input { margin-top: 0.25rem; accent-color: var(--cta-orange); }
.form-checkbox a { color: var(--cta-orange); text-decoration: underline; }
.form-error { color: #DC2626; font-size: 0.8125rem; margin-top: 0.25rem; display: none; }
.form-error.visible { display: block; }
.form-success { background: var(--soft-sage); color: var(--secondary-green); padding: 1rem; border-radius: var(--radius-md); margin-bottom: 1rem; font-size: 0.9375rem; }

/* FOOTER */
.main-footer { background: var(--primary-green); color: rgba(255,255,255,0.8); padding: 4rem 0 2rem; position: relative; overflow: hidden; }
.footer-iris-pattern { position: absolute; top: -100px; right: -100px; width: 400px; height: 400px; background: radial-gradient(ellipse at center, rgba(253,91,2,0.08) 0%, transparent 70%); border-radius: 50%; pointer-events: none; }
.footer-top { display: grid; grid-template-columns: 1fr; gap: 3rem; margin-bottom: 3rem; }
@media (min-width: 768px) { .footer-top { grid-template-columns: 1fr 2fr; } }
.footer-brand { max-width: 320px; }
.footer-logo { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.footer-logo-primary { font-family: var(--font-heading); font-weight: 800; font-size: 1.25rem; color: var(--pure-white); display: block; }
.footer-logo-secondary { font-family: var(--font-heading); font-weight: 600; font-size: 0.875rem; color: rgba(255,255,255,0.8); }
.footer-desc { color: rgba(255,255,255,0.7); font-size: 0.9375rem; margin-bottom: 1.5rem; }
.footer-social { display: flex; gap: 0.75rem; }
.footer-social a { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; color: var(--pure-white); transition: all var(--transition-fast); }
.footer-social a:hover { background: var(--cta-orange); transform: translateY(-2px); }
.footer-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
@media (min-width: 1024px) { .footer-links { grid-template-columns: repeat(4, 1fr); } }
.footer-col h4 { color: var(--pure-white); font-size: 1rem; margin-bottom: 1.25rem; font-weight: 700; }
.footer-col ul { display: flex; flex-direction: column; gap: 0.625rem; }
.footer-col ul a { color: rgba(255,255,255,0.7); font-size: 0.9375rem; transition: all var(--transition-fast); display: inline-block; }
.footer-col ul a:hover { color: var(--warm-amber); padding-left: 0.25rem; }
.footer-address { font-style: normal; font-size: 0.9375rem; line-height: 1.7; color: rgba(255,255,255,0.7); }
.footer-address a { color: rgba(255,255,255,0.9); }
.footer-address a:hover { color: var(--warm-amber); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 2rem; text-align: center; }
.footer-legal p { color: rgba(255,255,255,0.6); font-size: 0.875rem; margin-bottom: 0.5rem; }
.footer-disclaimer { font-size: 0.8125rem; max-width: 700px; margin: 0.75rem auto 0; }

/* PAGE HEADER */
.page-header { background: linear-gradient(135deg, var(--primary-green) 0%, var(--secondary-green) 100%); color: var(--pure-white); padding: 4rem 0 3rem; position: relative; overflow: hidden; }
.page-header::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="40" fill="none" stroke="rgba(255,255,255,0.03)" stroke-width="0.5"/></svg>'); background-size: 120px; pointer-events: none; }
.page-header-content { position: relative; z-index: 1; }
.page-header h1 { color: var(--pure-white); margin-bottom: 0.75rem; }
.page-header-desc { color: rgba(255,255,255,0.85); font-size: 1.125rem; max-width: 600px; margin: 0; }
.breadcrumb { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; font-size: 0.875rem; flex-wrap: wrap; }
.breadcrumb a { color: rgba(255,255,255,0.7); }
.breadcrumb a:hover { color: var(--warm-amber); }
.breadcrumb-separator { color: rgba(255,255,255,0.4); }
.breadcrumb-current { color: var(--pure-white); font-weight: 600; }

/* ABOUT */
.about-story { background: var(--warm-white); }
.story-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .story-grid { grid-template-columns: 1fr 1fr; } }
.philosophy-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .philosophy-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .philosophy-grid { grid-template-columns: repeat(4, 1fr); } }
.philosophy-card { background: var(--pure-white); padding: 2rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); text-align: center; transition: all var(--transition-base); }
.philosophy-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.philosophy-icon { width: 64px; height: 64px; background: var(--soft-sage); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--secondary-green); margin: 0 auto 1rem; }
.philosophy-card h3 { font-size: 1.125rem; margin-bottom: 0.5rem; }
.philosophy-card p { font-size: 0.9375rem; margin: 0; }
.mission-vision-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .mission-vision-grid { grid-template-columns: 1fr 1fr; } }
.mv-card { background: var(--pure-white); padding: 2.5rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-md); border: 1px solid var(--light-border); position: relative; overflow: hidden; }
.mv-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--cta-orange); }
.mv-card h3 { font-size: 1.5rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.75rem; }
.mv-card h3 svg { color: var(--cta-orange); }
.mv-card p { font-size: 1rem; line-height: 1.8; }
.timeline { position: relative; max-width: 800px; margin: 0 auto; padding-left: 2rem; }
.timeline::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--light-border); }
.timeline-item { position: relative; padding-bottom: 2.5rem; }
.timeline-dot { position: absolute; left: -2rem; top: 0.25rem; width: 12px; height: 12px; background: var(--cta-orange); border-radius: 50%; transform: translateX(-5px); border: 2px solid var(--pure-white); box-shadow: 0 0 0 2px var(--cta-orange); }
.timeline-content h4 { font-size: 1.125rem; margin-bottom: 0.5rem; }
.timeline-content p { font-size: 0.9375rem; margin: 0; }
.timeline-verify { display: inline-block; background: var(--soft-sage); color: var(--muted-text); padding: 0.25rem 0.75rem; border-radius: var(--radius-sm); font-size: 0.75rem; margin-top: 0.5rem; font-style: italic; }

/* DOCTORS PAGE */
.doctors-filter { display: flex; gap: 0.5rem; flex-wrap: wrap; justify-content: center; margin-bottom: 2.5rem; }
.filter-btn { padding: 0.5rem 1.25rem; border-radius: var(--radius-full); font-weight: 600; font-size: 0.875rem; color: var(--muted-text); background: var(--soft-sage); transition: all var(--transition-fast); border: 2px solid transparent; }
.filter-btn:hover, .filter-btn:focus { color: var(--primary-green); }
.filter-btn.active { background: var(--primary-green); color: var(--pure-white); }
.doctor-hero { background: linear-gradient(135deg, var(--soft-sage) 0%, var(--warm-white) 100%); padding: 3rem 0; }
.doctor-hero-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 768px) { .doctor-hero-grid { grid-template-columns: 300px 1fr; } }
.doctor-hero-image { border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); aspect-ratio: 3/4; }
.doctor-hero-image img { width: 100%; height: 100%; object-fit: cover; }
.doctor-hero-info h1 { margin-bottom: 0.5rem; }
.doctor-hero-info .designation { color: var(--cta-orange); font-weight: 600; font-size: 1.125rem; margin-bottom: 1rem; display: block; }
.qualification-strip { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.qualification-badge { background: var(--pure-white); border: 1px solid var(--light-border); padding: 0.375rem 0.875rem; border-radius: var(--radius-full); font-size: 0.8125rem; font-weight: 600; color: var(--secondary-green); }
.doctor-section { padding: 3rem 0; border-bottom: 1px solid var(--light-border); }
.doctor-section:last-child { border-bottom: none; }
.doctor-section h2 { margin-bottom: 1.5rem; font-size: 1.5rem; }
.expandable-section { border: 1px solid var(--light-border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 1rem; }
.expandable-header { width: 100%; padding: 1rem 1.5rem; display: flex; justify-content: space-between; align-items: center; background: var(--soft-sage); font-weight: 600; color: var(--primary-green); font-size: 1rem; transition: background var(--transition-fast); }
.expandable-header:hover { background: var(--light-border); }
.expandable-header svg { transition: transform var(--transition-base); }
.expandable-header.active svg { transform: rotate(180deg); }
.expandable-content { max-height: 0; overflow: hidden; transition: max-height var(--transition-slow); background: var(--pure-white); }
.expandable-content.active { max-height: 2000px; }
.expandable-content-inner { padding: 1.5rem; }
.expandable-content-inner ul { display: flex; flex-direction: column; gap: 0.75rem; }
.expandable-content-inner ul li { padding-left: 1.5rem; position: relative; font-size: 0.9375rem; }
.expandable-content-inner ul li::before { content: ''; position: absolute; left: 0; top: 0.6rem; width: 6px; height: 6px; background: var(--cta-orange); border-radius: 50%; }

/* SERVICE PAGES */
.service-hero { background: linear-gradient(135deg, var(--primary-green) 0%, var(--secondary-green) 100%); color: var(--pure-white); padding: 4rem 0 3rem; position: relative; overflow: hidden; }
.service-hero h1 { color: var(--pure-white); margin-bottom: 1rem; }
.service-hero-desc { color: rgba(255,255,255,0.9); font-size: 1.125rem; max-width: 700px; margin-bottom: 1.5rem; }
.service-hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.service-hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 3rem; align-items: center; }
.service-hero-media { border-radius: 28px 8px 28px 8px; overflow: hidden; border: 1px solid rgba(255,255,255,.24); box-shadow: 0 24px 60px rgba(0,0,0,.2); }
.service-hero-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.service-points { display: grid; gap: .75rem; margin: 2rem 0; }
.service-point { display: flex; align-items: center; gap: .75rem; padding: 1rem; background: var(--soft-sage); border-radius: 14px; color: var(--charcoal); }
.service-point-icon { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: var(--cta-orange); color: var(--pure-white); font-weight: 800; flex: 0 0 auto; }
.sidebar-list a span { margin-left: auto; color: var(--cta-orange); }
.service-content { padding: 4rem 0; }
.service-content-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }
@media (min-width: 1024px) { .service-content-grid { grid-template-columns: 2fr 1fr; } }
.service-main h2 { font-size: 1.75rem; margin: 2.5rem 0 1rem; }
.service-main h2:first-child { margin-top: 0; }
.service-main h3 { font-size: 1.375rem; margin: 2rem 0 0.75rem; }
.service-main p { font-size: 1rem; line-height: 1.8; margin-bottom: 1rem; }
.service-main ul, .service-main ol { margin: 1rem 0 1.5rem 1.5rem; }
.service-main ul li, .service-main ol li { margin-bottom: 0.5rem; font-size: 1rem; line-height: 1.7; color: var(--charcoal); }
.service-main ul li { list-style: disc; }
.service-main ol li { list-style: decimal; }
.service-sidebar { position: sticky; top: 100px; }
.sidebar-card { background: var(--pure-white); border-radius: var(--radius-xl); padding: 1.5rem; box-shadow: var(--shadow-md); border: 1px solid var(--light-border); margin-bottom: 1.5rem; }
.sidebar-card h4 { font-size: 1.125rem; margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 2px solid var(--soft-sage); }
.sidebar-list { display: flex; flex-direction: column; gap: 0.5rem; }
.sidebar-list a { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem; border-radius: var(--radius-sm); font-size: 0.9375rem; color: var(--charcoal); transition: all var(--transition-fast); }
.sidebar-list a:hover { background: var(--soft-sage); color: var(--primary-green); padding-left: 1rem; }
.sidebar-list a svg { color: var(--cta-orange); flex-shrink: 0; }
.faq-item { border: 1px solid var(--light-border); border-radius: var(--radius-md); margin-bottom: 0.75rem; overflow: hidden; }
.faq-question { width: 100%; padding: 1rem 1.25rem; display: flex; justify-content: space-between; align-items: center; background: var(--pure-white); font-weight: 600; color: var(--primary-green); font-size: 1rem; text-align: left; transition: background var(--transition-fast); }
.faq-question:hover { background: var(--soft-sage); }
.faq-question svg { flex-shrink: 0; transition: transform var(--transition-base); color: var(--cta-orange); }
.faq-question.active svg { transform: rotate(180deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height var(--transition-slow); background: var(--soft-sage); }
.faq-answer.active { max-height: 500px; }
.faq-answer-inner { padding: 1rem 1.25rem; font-size: 0.9375rem; color: var(--charcoal); line-height: 1.7; }
.callout-box { background: var(--soft-sage); border-left: 4px solid var(--cta-orange); padding: 1.25rem 1.5rem; border-radius: 0 var(--radius-md) var(--radius-md) 0; margin: 1.5rem 0; }
.callout-box h4 { color: var(--primary-green); font-size: 1.125rem; margin-bottom: 0.5rem; }
.callout-box p { margin: 0; font-size: 0.9375rem; }
.disclaimer-box { background: #FEF3C7; border: 1px solid #FDE68A; padding: 1.25rem; border-radius: var(--radius-md); margin: 2rem 0; }
.disclaimer-box p { font-size: 0.875rem; color: #92400E; margin: 0; }

/* APPOINTMENT */
.appointment-section { background: linear-gradient(135deg, var(--soft-sage) 0%, var(--warm-white) 100%); min-height: calc(100vh - var(--header-height)); }
.appointment-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .appointment-grid { grid-template-columns: 1fr 1.2fr; } }
.appointment-info { padding: 2rem 0; }
.appointment-info h2 { margin-bottom: 1rem; }
.appointment-info > p { margin-bottom: 2rem; }
.info-card { background: var(--pure-white); padding: 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); margin-bottom: 1rem; display: flex; align-items: flex-start; gap: 1rem; }
.info-card-icon { width: 48px; height: 48px; background: var(--soft-sage); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; color: var(--secondary-green); flex-shrink: 0; }
.info-card h4 { font-size: 1rem; margin-bottom: 0.25rem; }
.info-card p { font-size: 0.9375rem; margin: 0; }
.appointment-form-container { background: var(--pure-white); padding: 2.5rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); border: 1px solid var(--light-border); }
.appointment-form-container h2 { margin-bottom: 0.5rem; }
.appointment-form-container > p { color: var(--muted-text); margin-bottom: 1.5rem; }

/* CONTACT */
.contact-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }
@media (min-width: 1024px) { .contact-grid { grid-template-columns: 1fr 1.2fr; } }
.contact-details { display: flex; flex-direction: column; gap: 1.5rem; }
.contact-detail-card { background: var(--pure-white); padding: 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); display: flex; align-items: flex-start; gap: 1rem; }
.contact-detail-card svg { color: var(--cta-orange); flex-shrink: 0; margin-top: 0.25rem; }
.contact-detail-card h4 { font-size: 1.125rem; margin-bottom: 0.5rem; }
.contact-detail-card p, .contact-detail-card a { color: var(--muted-text); font-size: 0.9375rem; }
.contact-detail-card a:hover { color: var(--cta-orange); }
.map-container { border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--light-border); height: 400px; background: var(--soft-sage); display: flex; align-items: center; justify-content: center; }
.map-placeholder { text-align: center; color: var(--muted-text); }
.map-placeholder svg { margin: 0 auto 1rem; color: var(--light-border); }

/* GALLERY */
.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 640px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .gallery-grid { grid-template-columns: repeat(4, 1fr); } }
.gallery-item { aspect-ratio: 4/3; border-radius: var(--radius-lg); overflow: hidden; cursor: pointer; position: relative; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.gallery-item:hover img { transform: scale(1.05); }
.gallery-overlay { position: absolute; inset: 0; background: linear-gradient(transparent 50%, rgba(4,48,24,0.8)); display: flex; align-items: flex-end; padding: 1rem; opacity: 0; transition: opacity var(--transition-base); }
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-overlay span { color: var(--pure-white); font-weight: 600; font-size: 0.9375rem; }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 9999; display: none; align-items: center; justify-content: center; padding: 2rem; }
.lightbox.active { display: flex; }
.lightbox img { max-width: 90%; max-height: 90vh; object-fit: contain; border-radius: var(--radius-md); }
.lightbox-close { position: absolute; top: 1.5rem; right: 1.5rem; width: 48px; height: 48px; background: rgba(255,255,255,0.1); border-radius: 50%; color: var(--pure-white); display: flex; align-items: center; justify-content: center; transition: background var(--transition-fast); }
.lightbox-close:hover { background: var(--cta-orange); }

/* VIDEOS */
.videos-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px) { .videos-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .videos-grid { grid-template-columns: repeat(3, 1fr); } }
.video-card { background: var(--pure-white); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-sm); border: 1px solid var(--light-border); transition: all var(--transition-base); }
.video-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }
.video-thumbnail { position: relative; aspect-ratio: 16/9; overflow: hidden; }
.video-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.video-play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; background: rgba(253,91,2,0.9); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--pure-white); transition: all var(--transition-fast); box-shadow: 0 4px 20px rgba(0,0,0,0.3); }
.video-card:hover .video-play-btn { background: var(--cta-orange); transform: translate(-50%, -50%) scale(1.1); }
.video-card-body { padding: 1.25rem; }
.video-card-body h3 { font-size: 1.0625rem; margin-bottom: 0.5rem; }
.video-card-body p { font-size: 0.875rem; margin: 0; }
.video-meta { display: flex; gap: 1rem; margin-top: 0.75rem; font-size: 0.75rem; color: var(--muted-text); }

/* ADMIN */
.admin-body { background: #F3F4F6; font-family: var(--font-body); }
.admin-header { background: var(--primary-green); color: var(--pure-white); padding: 1rem 2rem; display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; z-index: 100; }
.admin-header h1 { color: var(--pure-white); font-size: 1.25rem; margin: 0; }
.admin-header a { color: rgba(255,255,255,0.8); font-size: 0.875rem; }
.admin-header a:hover { color: var(--pure-white); }
.admin-layout { display: grid; grid-template-columns: 260px 1fr; min-height: calc(100vh - 60px); }
.admin-sidebar { background: var(--pure-white); border-right: 1px solid #E5E7EB; padding: 1.5rem 0; }
.admin-sidebar ul { display: flex; flex-direction: column; }
.admin-sidebar a { display: flex; align-items: center; gap: 0.75rem; padding: 0.875rem 1.5rem; color: var(--charcoal); font-size: 0.9375rem; font-weight: 500; transition: all var(--transition-fast); border-left: 3px solid transparent; }
.admin-sidebar a:hover, .admin-sidebar a.active { background: var(--soft-sage); color: var(--primary-green); border-left-color: var(--cta-orange); }
.admin-main { padding: 2rem; overflow-y: auto; }
.admin-card { background: var(--pure-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid #E5E7EB; padding: 1.5rem; margin-bottom: 1.5rem; }
.admin-card h2 { font-size: 1.25rem; margin-bottom: 1.25rem; padding-bottom: 0.75rem; border-bottom: 1px solid #E5E7EB; }
.stats-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 768px) { .stats-grid { grid-template-columns: repeat(4, 1fr); } }
.stat-card { background: var(--pure-white); padding: 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); border: 1px solid #E5E7EB; text-align: center; }
.stat-value { font-size: 2rem; font-weight: 800; color: var(--primary-green); font-family: var(--font-heading); }
.stat-label { font-size: 0.875rem; color: var(--muted-text); margin-top: 0.25rem; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.admin-table th { background: var(--soft-sage); padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--primary-green); font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.03em; }
.admin-table td { padding: 1rem; border-bottom: 1px solid #E5E7EB; color: var(--charcoal); }
.admin-table tr:hover td { background: #F9FAFB; }
.status-badge { display: inline-block; padding: 0.25rem 0.75rem; border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; }
.status-new { background: #DBEAFE; color: #1E40AF; }
.status-contacted { background: #FEF3C7; color: #92400E; }
.status-confirmed { background: #D1FAE5; color: #065F46; }
.status-completed { background: #E0E7FF; color: #3730A3; }
.status-cancelled { background: #FEE2E2; color: #991B1B; }
.admin-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--primary-green) 0%, var(--secondary-green) 100%); padding: 1rem; }
.login-box { background: var(--pure-white); padding: 2.5rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-xl); width: 100%; max-width: 420px; }
.login-box h2 { text-align: center; margin-bottom: 0.5rem; }
.login-box > p { text-align: center; color: var(--muted-text); margin-bottom: 1.5rem; }

/* 404 */
.error-page { min-height: 60vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 4rem 1rem; }
.error-code { font-size: clamp(6rem, 15vw, 12rem); font-weight: 800; color: var(--soft-sage); font-family: var(--font-heading); line-height: 1; margin-bottom: 1rem; }
.error-page h1 { margin-bottom: 1rem; }
.error-page p { margin-bottom: 2rem; max-width: 500px; margin-left: auto; margin-right: auto; }

/* RESPONSIVE */
@media (max-width: 1023px) { .mega-menu { display: none; } }
@media (max-width: 767px) {
    h1 { font-size: 2rem; } h2 { font-size: 1.75rem; } h3 { font-size: 1.5rem; }
    .section { padding: 3rem 0; }
    .hero { min-height: auto; padding: 3rem 0; }
    .hero-actions { flex-direction: column; }
    .hero-actions .btn { width: 100%; }
    .iris-portal { max-width: 320px; }
    .footer-links { grid-template-columns: 1fr; }
    .admin-layout { grid-template-columns: 1fr; }
    .admin-sidebar { display: none; }
}
@media print {
    .utility-bar, .main-header, .floating-actions, .mobile-bottom-bar, .main-footer, .cookie-notice { display: none !important; }
    body { padding-bottom: 0; }
    .section { padding: 1rem 0; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    html { scroll-behavior: auto; }
}
:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: 2px solid var(--cta-orange); outline-offset: 2px; }

/* ============================================
   Visual polish layer
   ============================================ */
:root {
    --container-wide: 1380px;
    --ease-smooth: cubic-bezier(.22, 1, .36, 1);
}

.container { max-width: var(--container-wide); }
.utility-bar { background: #032713; letter-spacing: .01em; }
.main-header { border-bottom: 1px solid rgba(4,48,24,.07); }
.header-inner { gap: 1rem; }
.logo { min-width: 220px; }
.brand-logo { width: 220px; }
.logo-text { min-width: 0; }
.logo-primary { font-size: 1.05rem; white-space: nowrap; }
.logo-secondary { font-size: .7rem; }
.logo-tagline { white-space: nowrap; font-size: .58rem; }
.nav-list { gap: 0; }
.nav-link { padding-inline: .6rem; font-size: .88rem; }
.header-actions { gap: .65rem; }
.header-actions .btn { padding-inline: 1.05rem; font-size: .86rem; }

/* Compact desktop dropdowns: keep long service lists useful without pushing
   the menu below the fold. */
.mega-menu {
    min-width: min(900px, calc(100vw - 2rem));
    max-width: calc(100vw - 2rem);
    padding: 1.25rem;
    border-radius: 20px;
    margin-top: .35rem;
}
.mega-about { min-width: 540px; }
.mega-about .mega-inner { grid-template-columns: 1fr 1fr; }
.mega-inner { gap: 1.25rem; }
.mega-services .mega-inner { grid-template-columns: 1.45fr .95fr 1fr; align-items: start; }
.mega-col h4 { margin-bottom: .6rem; font-size: .72rem; }
.mega-col ul { gap: .1rem; }
.mega-col ul a { padding: .26rem .35rem; font-size: .8rem; line-height: 1.3; }
.mega-services .mega-categories ul,
.mega-services .mega-conditions ul { grid-template-columns: repeat(2, minmax(0, 1fr)); display: grid; column-gap: .6rem; }
.mega-services .mega-categories li,
.mega-services .mega-conditions li { min-width: 0; }
.mega-services .mega-categories a,
.mega-services .mega-conditions a { white-space: normal; }
.preview-image { aspect-ratio: 16 / 10; }
.preview-overlay { padding: 1rem; }
.preview-overlay h5 { font-size: .95rem; }
.preview-overlay p { font-size: .75rem; line-height: 1.4; margin-bottom: .5rem; }
.btn-preview { padding: .4rem .75rem; font-size: .75rem; }

.hero { min-height: min(860px, calc(100vh - var(--utility-height))); isolation: isolate; }
.hero::after { content: ''; position: absolute; inset: auto 0 0; height: 26%; background: linear-gradient(transparent, rgba(2,29,15,.35)); pointer-events: none; z-index: 1; }
.hero-video-bg { opacity: .31; filter: saturate(.78) contrast(1.05); transform: scale(1.04); animation: heroDrift 18s ease-in-out infinite alternate; }
@keyframes heroDrift { from { transform: scale(1.04); } to { transform: scale(1.1) translate3d(-1%, -1%, 0); } }
.hero-overlay { background: linear-gradient(90deg, rgba(3,34,18,.98) 0%, rgba(4,48,24,.88) 39%, rgba(4,48,24,.42) 74%, rgba(4,48,24,.18) 100%); }
.hero-content { padding: clamp(4rem, 8vw, 7rem) 0; }
.hero-text { max-width: 690px; }
.hero-eyebrow { background: rgba(239,166,70,.16); border: 1px solid rgba(239,166,70,.22); }
.hero-title { font-size: clamp(3.2rem, 6.2vw, 5.9rem); letter-spacing: -.055em; }
.hero-desc { max-width: 610px; font-size: clamp(1rem, 1.5vw, 1.18rem); line-height: 1.75; }
.hero-actions .btn { min-height: 54px; border-radius: 999px; padding-inline: 1.45rem; }
.hero-contact-strip { gap: .75rem 1.25rem; }
.hero-contact-strip a { font-size: .8rem; }
.hero-visual { min-height: 510px; }
.iris-portal { max-width: 530px; filter: drop-shadow(0 30px 38px rgba(0,0,0,.18)); }
.iris-mask { border-width: 5px; border-color: rgba(239,166,70,.7); box-shadow: 0 30px 80px rgba(0,0,0,.38), inset 0 0 65px rgba(4,48,24,.38); }
.iris-mask::before, .iris-mask::after { content: ''; position: absolute; inset: 7%; border: 1px solid rgba(255,255,255,.36); border-radius: 50%; pointer-events: none; z-index: 2; }
.iris-mask::after { inset: 17%; border-color: rgba(253,91,2,.44); transform: rotate(31deg) scaleX(1.45); }
.iris-label { border: 1px solid rgba(4,48,24,.08); backdrop-filter: blur(10px); }
.iris-controls { bottom: -1rem; padding: .35rem .55rem; border-radius: 999px; background: rgba(2,29,15,.35); backdrop-filter: blur(10px); }

.gateways { position: relative; z-index: 3; margin-top: -1px; box-shadow: 0 18px 40px rgba(4,48,24,.08); }
.gateway-card { padding: 1.25rem .85rem; border-radius: 20px; }
.gateway-icon { transition: transform .45s var(--ease-smooth), background .3s ease; border-radius: 16px; padding: .6rem; background: rgba(253,91,2,.08); }
.gateway-card:hover .gateway-icon { transform: rotate(-6deg) scale(1.08); background: rgba(253,91,2,.16); }

.section { scroll-margin-top: 88px; }
.section-header { margin-bottom: 3.5rem; }
.section-eyebrow { position: relative; padding-left: 2rem; }
.section-eyebrow::before { content: ''; position: absolute; width: 1.25rem; height: 2px; left: 0; top: 50%; background: currentColor; }
.section-title { letter-spacing: -.045em; }
.about-story { background: radial-gradient(circle at 8% 12%, rgba(234,243,236,.7), transparent 26%), var(--warm-white); }
.welcome-main-img, .welcome-detail-img, .service-card-image, .tech-card-image { background: var(--soft-sage); }
.welcome-main-img { transform: rotate(-1deg); transition: transform .65s var(--ease-smooth); }
.welcome-images:hover .welcome-main-img { transform: rotate(0) translateY(-5px); }
.welcome-detail-img { border-radius: 42% 58% 60% 40% / 45% 45% 55% 55%; }
.proof-point { padding: .8rem .9rem; border-radius: 16px; transition: background .3s ease, transform .3s ease; }
.proof-point:hover { background: var(--soft-sage); transform: translateX(5px); }

.services-section { position: relative; }
.services-section::before { content: ''; position: absolute; inset: 0; opacity: .45; background-image: radial-gradient(rgba(4,48,24,.08) 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.services-section .container { position: relative; }
.service-card { border-radius: 26px; }
.service-card-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(4,48,24,.03), rgba(253,91,2,.12)); opacity: 0; transition: opacity .45s ease; pointer-events: none; }
.service-card:hover .service-card-image::after { opacity: 1; }
.service-card-icon { border-radius: 50%; width: 52px; height: 52px; }

.why-section { background: radial-gradient(circle at 84% 16%, rgba(253,91,2,.16), transparent 24%), #043018; }
.why-section .section-header { text-align: left; max-width: 760px; margin-left: 0; }
.why-card { border-radius: 24px; }
.why-card-icon { border-radius: 50%; }

.doctor-card { border-radius: 26px; }
.doctor-card-image { background: linear-gradient(145deg, #dcebe0, #f8f4eb); }
.doctor-card-image::after { content: ''; position: absolute; inset: auto 0 0; height: 38%; background: linear-gradient(transparent, rgba(4,48,24,.16)); pointer-events: none; }
.doctor-card-badge { border-radius: 6px 18px 6px 18px; }

.safety-item, .insurance-card, .contact-detail-card, .info-card, .booking-panel { border-radius: 24px; }
.safety-pathway { position: relative; }
.safety-item:hover { transform: translateY(-4px); }
.safety-icon { border: 1px solid rgba(4,48,24,.08); }
.journey-step-content { border-radius: 20px 8px 20px 8px; }
.journey-step-number { border-radius: 14px; }
.education-section { background: radial-gradient(circle at 86% 10%, rgba(239,166,70,.24), transparent 26%), linear-gradient(135deg, #043018, #124f2e); }
.booking-panel { box-shadow: 0 24px 70px rgba(0,0,0,.18); }

.main-footer { background: #032713; }
.footer-logo img { width: 200px; height: auto; filter: none; background: var(--pure-white); padding: .45rem .65rem; border-radius: 12px; opacity: .98; }

@media (max-width: 1180px) and (min-width: 1024px) {
    .logo { min-width: 188px; }
    .brand-logo { width: 188px; }
    .nav-link { padding-inline: .38rem; font-size: .79rem; }
    .header-actions .btn { padding-inline: .75rem; font-size: .78rem; }
}
@media (max-width: 767px) {
    .utility-bar { padding: .4rem 0; }
    .utility-inner { justify-content: center; }
    .utility-right { display: none; }
    .utility-left { gap: .75rem; font-size: .7rem; }
    .main-header { height: 70px; }
    .logo { min-width: 0; }
    .brand-logo { width: 168px; }
    .header-actions .btn { display: none; }
    .hero { min-height: 760px; }
    .hero-content { padding: 3rem 0 4rem; }
    .hero-title { font-size: clamp(2.8rem, 14vw, 4rem); }
    .hero-visual { min-height: 320px; margin-top: 1.25rem; }
    .iris-portal { max-width: 330px; }
    .iris-label { font-size: .65rem; padding: .4rem .65rem; }
    .iris-label:nth-child(1) { left: -2%; }
    .iris-label:nth-child(2) { right: -5%; }
    .section-header { margin-bottom: 2.25rem; }
    .service-hero-grid { grid-template-columns: 1fr; gap: 2rem; }
    .service-hero-media { order: -1; max-width: 520px; }
}
@media (prefers-reduced-motion: reduce) {
    .hero-video-bg { animation: none; }
}

/* Local SEO landing pages */
.local-seo-hero .section-eyebrow { color: var(--warm-amber); }
.local-seo-content { background: var(--warm-white); }
.local-section-heading { margin-top: 2.75rem; margin-bottom: 1.25rem; font-size: clamp(1.65rem, 3vw, 2.25rem); }
.local-faq { margin-top: 3rem; }
.local-faq h2 { margin-bottom: 1.25rem; }
.local-faq .faq-item:first-of-type .faq-answer { max-height: 500px; }
.local-cta-section { background: var(--soft-sage); padding-top: 3rem; padding-bottom: 3rem; }
.local-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.local-cta-inner h2 { max-width: 720px; margin-bottom: .5rem; }
.local-cta-inner p { margin: 0; }
.local-longform { animation: localReveal .7s ease both; }
.local-longform h2 { margin: 2.75rem 0 .9rem; font-size: clamp(1.65rem, 3vw, 2.25rem); }
.local-longform h2:first-of-type { margin-top: 1.5rem; }
.local-longform p { max-width: 78ch; }
.local-longform strong { color: var(--primary-green); }
.local-visual-band { display: grid; grid-template-columns: 1.25fr .875fr .875fr; gap: 1rem; margin: 2rem 0 2.5rem; }
.local-visual-card { margin: 0; min-width: 0; overflow: hidden; background: var(--pure-white); border: 1px solid var(--light-border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); transition: transform var(--transition-base), box-shadow var(--transition-base); }
.local-visual-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.local-visual-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.local-visual-card-wide img { aspect-ratio: 16 / 9; }
.local-visual-card figcaption { padding: .75rem .9rem; color: var(--muted-text); font-size: .82rem; line-height: 1.4; }
.local-reading-list { margin-top: 2.5rem; padding: 1.25rem; background: var(--soft-sage); border-radius: var(--radius-md); }
.local-reading-list h3 { font-size: 1.25rem; margin-bottom: .75rem; }
.local-reading-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem 1rem; }
.local-reading-links a { display: flex; justify-content: space-between; gap: .75rem; padding: .5rem 0; border-bottom: 1px solid rgba(4,48,24,.12); font-weight: 600; font-size: .9rem; }
.local-reading-links a span { color: var(--cta-orange); }
@keyframes localReveal { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.local-pathways-section { background: var(--soft-sage); }
.local-pathways-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.local-pathway-card { display: flex; flex-direction: column; align-items: flex-start; background: var(--pure-white); border: 1px solid var(--light-border); border-radius: var(--radius-md); padding: 1.35rem; box-shadow: var(--shadow-sm); transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.local-pathway-card:hover, .local-pathway-card:focus { color: inherit; transform: translateY(-3px); border-color: rgba(253,91,2,.45); box-shadow: var(--shadow-md); }
.local-pathway-card > span { color: var(--cta-orange); font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.local-pathway-card h3 { font-size: 1.2rem; margin: .55rem 0 .5rem; }
.local-pathway-card p { font-size: .9rem; line-height: 1.55; margin-bottom: 1rem; }
.local-pathway-card strong { margin-top: auto; color: var(--secondary-green); font-size: .875rem; }
@media (max-width: 767px) {
    .local-cta-inner { align-items: flex-start; flex-direction: column; }
    .local-cta-inner .btn { width: 100%; }
    .local-pathways-grid { grid-template-columns: 1fr; }
    .local-visual-band { grid-template-columns: 1fr 1fr; }
    .local-visual-card-wide { grid-column: 1 / -1; }
    .local-reading-links { grid-template-columns: 1fr; }
}