/* =========================================================
   CHICKOO ANGANWADI — 3D Design System
   Bootstrap 5 companion stylesheet
   ========================================================= */

:root{
  --c-blue:      #29B6F6;
  --c-blue-dark: #0288D1;
  --c-green:     #66BB6A;
  --c-green-dark:#388E3C;
  --c-yellow:    #FFCA28;
  --c-yellow-dark:#F9A825;
  --c-coral:     #FF6F61;
  --c-coral-dark:#E64A3B;
  --c-purple:    #8B7CF6;
  --c-navy:      #14235A;
  --c-navy-soft: #33406b;
  --c-ink:       #1B1E3D;
  --c-cream:     #FFFDF7;
  --c-cloud:     #F3F8FF;

  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;

  --shadow-3d: 0 2px 0 rgba(0,0,0,.04), 0 10px 20px -6px rgba(20,35,90,.18), 0 24px 48px -20px rgba(20,35,90,.25);
  --shadow-3d-hover: 0 4px 0 rgba(0,0,0,.05), 0 18px 30px -8px rgba(20,35,90,.25), 0 36px 60px -20px rgba(20,35,90,.32);
  --shadow-soft: 0 8px 24px -8px rgba(20,35,90,.15);

  --font-head: 'Baloo 2', 'Mukta', sans-serif;
  --font-body: 'Mukta', 'Baloo 2', sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html{ overflow-x:hidden; }
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }
body{
  font-family:var(--font-body);
  overflow-x:clip;
  color:var(--c-ink);
  background:linear-gradient(180deg,#EAF7FF 0%, #F6FBFF 8%, #ffffff 20%);
  position:relative;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head); font-weight:700; color:var(--c-navy);}
p{line-height:1.75;}
a{text-decoration:none;}
::selection{background:var(--c-yellow); color:var(--c-navy);}

/* =========================================================
   Decorative floating 3D background scene
   ========================================================= */
.bg-scene{position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden;}
.bg-scene .orb{
  position:absolute; border-radius:50%; filter:blur(2px);
  opacity:.35; animation:floatY 9s ease-in-out infinite;
  box-shadow: inset -10px -10px 30px rgba(0,0,0,.08), inset 10px 10px 20px rgba(255,255,255,.5);
}
.orb-blue{width:220px; height:220px; top:6%; left:-60px; background:radial-gradient(circle at 30% 30%, #B3E5FC, var(--c-blue)); animation-delay:0s;}
.orb-green{width:160px; height:160px; top:55%; right:-40px; background:radial-gradient(circle at 30% 30%, #C8E6C9, var(--c-green)); animation-delay:2s;}
.orb-yellow{width:120px; height:120px; top:80%; left:8%; background:radial-gradient(circle at 30% 30%, #FFF9C4, var(--c-yellow)); animation-delay:4s;}
.bg-scene .cloud{position:absolute; color:#fff; opacity:.6; font-size:3rem; animation:driftX 30s linear infinite;}
.cloud-1{top:12%; left:20%; font-size:2.2rem;}
.cloud-2{top:30%; right:15%; font-size:3rem; animation-duration:40s;}

@keyframes floatY{
  0%,100%{transform:translateY(0) translateX(0) rotate(0deg);}
  50%{transform:translateY(-30px) translateX(15px) rotate(8deg);}
}
@keyframes driftX{
  0%{transform:translateX(-10px);}
  50%{transform:translateX(30px);}
  100%{transform:translateX(-10px);}
}

.container, .navbar, section{position:relative; z-index:1;}

/* =========================================================
   Top utility bar + Navbar
   ========================================================= */
.top-bar{
  background:linear-gradient(90deg, var(--c-navy), var(--c-navy-soft));
  color:#dbe6ff; font-size:.85rem;
}
.top-bar-contact a{color:#fff; margin-right:1.25rem; opacity:1;}
.top-bar-contact a:hover{color:#fff; opacity:1;}
.lang-switch {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  background: rgba(255, 255, 255, 0.12);
  padding: 3px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
}
.lang-btn {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.85);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 0.82rem;
  padding: 3px 12px;
  cursor: pointer;
  border-radius: 20px;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.lang-btn:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}
.lang-btn.active {
  color: var(--c-navy) !important;
  background: linear-gradient(135deg, var(--c-yellow), #ffd54f) !important;
  box-shadow: 0 2px 6px rgba(249, 168, 37, 0.45), inset 0 -1.5px 0 rgba(0,0,0,0.15) !important;
  text-shadow: 0 0.5px 1px rgba(255, 255, 255, 0.4);
}
.lang-sep {
  display: none !important; /* Hide separator line in pill design */
}

/* Translatable elements dynamic transitions */
[data-t-key] {
  transition: opacity 0.15s ease-in-out;
}

.main-navbar{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 6px 24px -10px rgba(20,35,90,.18);
  padding:.6rem 0;
  z-index:1000;
}
.navbar-brand{display:flex; align-items:center; gap:.6rem;}
.brand-orb{
  width:48px; height:48px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  background:radial-gradient(circle at 30% 25%, #fff5, transparent 60%), linear-gradient(145deg, var(--c-yellow), var(--c-coral));
  box-shadow: var(--shadow-3d);
  animation:bob 4s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg);} 50%{transform:translateY(-6px) rotate(4deg);}}
.brand-text{display:flex; flex-direction:column; line-height:1.1;}
.brand-name{font-family:var(--font-head); font-weight:800; font-size:1.35rem; color:var(--c-navy); letter-spacing:.5px;}
.brand-tag{font-size:.7rem; color:var(--c-coral-dark); font-weight:600;}

.main-navbar .nav-link{
  font-weight:600; color:var(--c-navy); padding:.55rem 1rem !important;
  border-radius:999px; transition:.2s;
}
.main-navbar .nav-link:hover{background:#EAF7FF; color:var(--c-blue-dark);}
.main-navbar .nav-link.active{background:linear-gradient(135deg, var(--c-blue), var(--c-green)); color:#fff;}

.btn-cta{
  background:linear-gradient(135deg, var(--c-coral), var(--c-coral-dark));
  color:#fff !important; font-weight:700; border:none; border-radius:999px;
  padding:.6rem 1.4rem; box-shadow:0 4px 0 var(--c-coral-dark), var(--shadow-soft);
  transition:transform .15s, box-shadow .15s; display:inline-flex; align-items:center; gap:.4rem;
}
.btn-cta:hover{transform:translateY(-3px); box-shadow:0 7px 0 var(--c-coral-dark), var(--shadow-3d-hover); color:#fff;}
.btn-cta:active{transform:translateY(0); box-shadow:0 2px 0 var(--c-coral-dark);}
.btn-cta.active{outline:3px solid #fff;}

.btn-cta-outline{
  background:#fff; color:var(--c-navy) !important; font-weight:700; border-radius:999px;
  padding:.6rem 1.4rem; border:2px solid var(--c-navy);
  box-shadow:0 4px 0 var(--c-navy); transition:transform .15s, box-shadow .15s;
  display:inline-flex; align-items:center; gap:.4rem;
}
.btn-cta-outline:hover{transform:translateY(-3px); color:var(--c-navy); box-shadow:0 7px 0 var(--c-navy);}
.btn-cta-outline:active{transform:translateY(0); box-shadow:0 2px 0 var(--c-navy);}

/* =========================================================
   Hero
   ========================================================= */
.hero{
  padding:4rem 0 4.5rem; position:relative; overflow:hidden;
  background:radial-gradient(1200px 500px at 80% -10%, #DFF4FF 0%, transparent 60%),
             radial-gradient(900px 500px at -10% 90%, #E6F9E9 0%, transparent 60%);
}
.hero-badge{
  display:inline-flex; align-items:center; gap:.5rem; background:#fff;
  border-radius:999px; padding:.5rem 1rem; font-weight:700; color:var(--c-coral-dark);
  box-shadow:var(--shadow-soft); font-size:.9rem;
}
.hero h1{font-size:clamp(2rem, 4vw, 3.2rem); line-height:1.2; margin:1rem 0;}
.hero h1 .accent{color:var(--c-coral);}
.hero-lead{font-size:1.15rem; color:var(--c-navy-soft); max-width:560px;}

.hero-3d-stage{
  position:relative; height:420px; perspective:1200px;
}
.hero-3d-card{
  position:absolute; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-3d); transform-style:preserve-3d;
  transition:transform .4s ease;
}
.hero-3d-card img{width:100%; height:100%; object-fit:cover; display:block;}
.hero-3d-card.card-main{
  width:78%; right:0; top:10%; z-index:3; transform:rotateY(-8deg) rotateX(4deg);
  animation:floatCard 6s ease-in-out infinite;
}
.hero-3d-card.card-mini-1{
  width:46%; left:0; bottom:0; z-index:4; border:6px solid #fff;
  transform:rotateY(6deg) rotateX(-3deg) translateZ(40px);
  animation:floatCard 7s ease-in-out infinite 1s;
}
.hero-float-shape{
  position:absolute; border-radius:50%; box-shadow:var(--shadow-soft);
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  background:#fff; animation:floatY 5s ease-in-out infinite;
}
@keyframes floatCard{0%,100%{transform-origin:center; margin-top:0;} 50%{margin-top:-14px;}}

/* =========================================================
   Section headings
   ========================================================= */
.section{padding:3.75rem 0;}
.section-alt{background:linear-gradient(180deg, #F6FBFF, #ffffff);}
.section-tag{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:800; letter-spacing:.5px;
  color:var(--c-blue-dark); background:#E3F6FF; padding:.35rem 1rem; border-radius:999px; font-size:.8rem;
  text-transform:uppercase;
}
.section-title{font-size:clamp(1.6rem, 3vw, 2.3rem); margin:.75rem 0 1rem;}
.section-title .underline{
  display:block; width:90px; height:6px; border-radius:6px; margin-top:.5rem;
  background:linear-gradient(90deg, var(--c-coral), var(--c-yellow));
}
.section-lead{color:var(--c-navy-soft); max-width:720px;}

/* =========================================================
   3D Tilt Cards (generic)
   ========================================================= */
.tilt-card{
  --rx:0deg; --ry:0deg;
  background:#fff; border-radius:var(--radius-md); padding:2rem 1.6rem;
  box-shadow:var(--shadow-3d); height:100%;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
  transition:transform .15s ease, box-shadow .25s ease;
  border:1px solid rgba(20,35,90,.05);
}
.tilt-card:hover{box-shadow:var(--shadow-3d-hover);}
.tilt-icon{
  width:64px; height:64px; border-radius:20px; display:flex; align-items:center; justify-content:center;
  font-size:1.8rem; color:#fff; margin-bottom:1.1rem;
  box-shadow: inset 0 -6px 10px rgba(0,0,0,.12), 0 8px 16px -6px rgba(20,35,90,.35);
}
.icon-blue{background:linear-gradient(145deg, #4FC3F7, var(--c-blue-dark));}
.icon-green{background:linear-gradient(145deg, #81C784, var(--c-green-dark));}
.icon-yellow{background:linear-gradient(145deg, #FFD54F, var(--c-yellow-dark));}
.icon-coral{background:linear-gradient(145deg, #FF8A80, var(--c-coral-dark));}
.icon-purple{background:linear-gradient(145deg, #B39DFF, var(--c-purple));}

.tilt-card h5{margin-bottom:.6rem;}
.tilt-card p{color:var(--c-navy-soft); font-size:.96rem; margin-bottom:0;}

/* =========================================================
   Flip cards (Four Pillars)
   ========================================================= */
.flip-card{height:280px; perspective:1400px;}
.flip-card-inner{position:relative; width:100%; height:100%; transition:transform .7s; transform-style:preserve-3d;}
.flip-card:hover .flip-card-inner{transform:rotateY(180deg);}
.flip-face{
  position:absolute; inset:0; backface-visibility:hidden; border-radius:var(--radius-md);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:1.6rem; box-shadow:var(--shadow-3d);
}
.flip-front{background:#fff;}
.flip-back{
  transform:rotateY(180deg); color:#fff;
  background:linear-gradient(155deg, var(--c-blue), var(--c-purple));
}
.flip-face .big-icon{font-size:2.6rem; margin-bottom:.75rem;}

/* =========================================================
   Skills badges
   ========================================================= */
.skill-pill{
  display:inline-flex; align-items:center; gap:.5rem; background:#fff; border-radius:999px;
  padding:.7rem 1.3rem; font-weight:700; color:var(--c-navy); box-shadow:var(--shadow-soft);
  margin:.35rem; transition:.2s;
}
.skill-pill i{color:var(--c-coral);}
.skill-pill:hover{transform:translateY(-4px) scale(1.03); box-shadow:var(--shadow-3d-hover);}

/* =========================================================
   Stats
   ========================================================= */
.stat-card{
  background:linear-gradient(155deg,#fff, #F6FBFF); border-radius:var(--radius-md); padding:2.2rem 1.5rem;
  text-align:center; box-shadow:var(--shadow-3d); height:100%;
}
.stat-number{font-family:var(--font-head); font-weight:800; font-size:2.6rem; color:var(--c-coral); line-height:1;}
.stat-label{color:var(--c-navy-soft); font-weight:600; margin-top:.5rem;}

/* =========================================================
   Timeline (Transformation)
   ========================================================= */
.tl-3d{position:relative; padding-left:2rem;}
.tl-3d::before{content:''; position:absolute; left:14px; top:0; bottom:0; width:4px; border-radius:4px; background:linear-gradient(180deg, var(--c-blue), var(--c-green), var(--c-yellow), var(--c-coral));}
.tl-step{position:relative; padding:0 0 2.5rem 2rem;}
.tl-step::before{
  content:''; position:absolute; left:-2rem; top:2px; width:26px; height:26px; border-radius:50%;
  background:#fff; border:5px solid var(--c-blue-dark); box-shadow:var(--shadow-soft);
}
.tl-step:nth-child(2)::before{border-color:var(--c-green-dark);}
.tl-step:nth-child(3)::before{border-color:var(--c-yellow-dark);}
.tl-step:nth-child(4)::before{border-color:var(--c-coral-dark);}
.tl-card{background:#fff; border-radius:var(--radius-md); padding:1.4rem 1.6rem; box-shadow:var(--shadow-soft);}

/* =========================================================
   CTA strip
   ========================================================= */
.cta-strip{padding:.5rem 0 3rem;}
.cta-box-3d{
  background:linear-gradient(155deg, var(--c-blue), var(--c-purple) 60%, var(--c-coral));
  border-radius:var(--radius-lg); padding:4px; box-shadow:var(--shadow-3d-hover);
}
.cta-box-inner{
  background:rgba(255,255,255,.08); border-radius:calc(var(--radius-lg) - 4px);
  padding:3.5rem 2rem; text-align:center; backdrop-filter:blur(6px);
}
.cta-box-inner h3{color:#fff; font-size:clamp(1.4rem, 2.6vw, 2rem); max-width:760px; margin:0 auto;}
.cta-box-inner p{color:#eaf3ff; max-width:640px; margin:1rem auto 0;}

/* =========================================================
   Footer (Highly Premium Design Upgrade)
   ========================================================= */
.site-footer {
  background: linear-gradient(180deg, #111e4f 0%, #0a1130 100%);
  color: #a9bade;
  position: relative;
  margin-top: 4rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.footer-wave {
  position: absolute;
  top: -59px;
  left: 0;
  width: 100%;
  line-height: 0;
}
.footer-wave svg {
  width: 100%;
  height: 60px;
  fill: #111e4f;
}
.footer-tag {
  color: #8c9ec4;
  font-size: 0.95rem;
  line-height: 1.6;
}
.footer-heading {
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 1.15rem;
  margin-bottom: 1.5rem;
  position: relative;
  padding-bottom: 0.5rem;
}
.footer-heading::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 35px;
  height: 3px;
  background: linear-gradient(90deg, var(--c-yellow), var(--c-coral));
  border-radius: 2px;
}
.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-links li {
  margin-bottom: 0.7rem;
}
.footer-links a {
  color: #a9bade;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
  font-weight: 500;
}
.footer-links a:hover {
  color: var(--c-yellow);
  transform: translateX(6px);
}
.footer-text {
  color: #a9bade;
  margin-bottom: 0.8rem;
  line-height: 1.6;
  font-weight: 500;
}
.footer-text a {
  color: #a9bade;
  transition: color 0.2s;
}
.footer-text a:hover {
  color: var(--c-yellow);
}
.footer-text i {
  color: var(--c-yellow);
  margin-right: 0.4rem;
}

/* Social Orbs */
.social-orbs {
  display: flex;
  gap: 0.75rem;
}
.social-orbs a {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #fff;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font-size: 1.15rem;
}
.social-orbs a:hover {
  background: linear-gradient(135deg, var(--c-coral), var(--c-yellow));
  color: #fff;
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(255, 111, 97, 0.4);
  border-color: transparent;
}

/* Lang Switch in Footer */
.lang-switch-footer {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0.25rem;
  border-radius: 30px;
  display: inline-flex;
}
.lang-switch-footer .lang-btn {
  color: #8c9ec4;
  padding: 0.35rem 0.85rem;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 700;
  transition: all 0.2s ease;
}
.lang-switch-footer .lang-btn:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
}
.lang-switch-footer .lang-btn.active {
  background: linear-gradient(135deg, var(--c-blue), var(--c-green));
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(41, 182, 246, 0.3);
}
.lang-switch-footer .lang-sep {
  display: none; /* Hide pipes since it's a pill selector now */
}

/* Footer Bottom */
.footer-hr {
  border-color: rgba(255, 255, 255, 0.06);
  margin: 2.5rem 0 1.5rem;
}
.footer-bottom {
  color: #7b8dae;
  font-size: 0.9rem;
  font-weight: 500;
}

.back-to-top{
  position:fixed; bottom:24px; right:24px; width:48px; height:48px; border-radius:50%;
  background:linear-gradient(145deg, var(--c-coral), var(--c-coral-dark)); color:#fff; display:flex;
  align-items:center; justify-content:center; box-shadow:var(--shadow-3d); z-index:900;
  opacity:0; visibility:hidden; transform:translateY(20px); transition:.3s;
}
.back-to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{color:#fff; transform:translateY(-4px);}

/* =========================================================
   Page hero (inner pages) - Highly Professional & Modern Design
   ========================================================= */
.page-hero {
  padding: 3.1rem 0 2.5rem;
  text-align: center;
  position: relative;
  background-color: #f8fafc;
  background-image: radial-gradient(#e2e8f0 1.2px, transparent 1.2px);
  background-size: 20px 20px;
  border-bottom: 1px solid #e2e8f0;
  overflow: hidden;
}

/* Subtle top shadow separating from navbar */
.page-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 0%, transparent 100%);
  pointer-events: none;
}

/* Sky-blue radial center highlight for visual depth */
.page-hero::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 300px;
  background: radial-gradient(circle, rgba(14, 165, 233, 0.08) 0%, transparent 70%);
  filter: blur(40px);
  pointer-events: none;
  z-index: 1;
}

.page-hero .container {
  position: relative;
  z-index: 2;
}

/* Page Title inside Hero */
.page-hero .section-title {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: clamp(1.7rem, 3.2vw, 2.15rem);
  color: #0f172a; /* Slate 900 */
  margin: 0.55rem 0 0.55rem;
  line-height: 1.3;
}

/* Sky Blue Accent Line */
.page-hero .section-title .underline {
  display: block;
  width: 45px;
  height: 3px;
  background: #0ea5e9; /* Sky Blue */
  margin: 0.45rem auto 0;
  border-radius: 5px;
}

/* Section Tag Pill */
.page-hero .section-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: #e0f2fe; /* Light sky blue */
  border: 1px solid #bae6fd;
  color: #0369a1;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.5px;
  padding: 0.35rem 0.85rem;
  border-radius: 30px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}
.page-hero .section-tag i {
  font-size: 0.85rem;
}

/* Clean Slate Breadcrumbs Pill Container */
.page-hero .crumb {
  display: inline-flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  padding: 0.4rem 1.2rem;
  border-radius: 50px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b; /* Slate 500 */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
  margin-top: 0.2rem;
}
.page-hero .crumb a {
  color: #0ea5e9;
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease;
  display: inline-block;
}
.page-hero .crumb a:hover {
  color: #0369a1;
  transform: scale(1.05);
}

/* =========================================================
   Chickoo speech bubble
   ========================================================= */
.chickoo-bubble{
  background:#fff; border-radius:var(--radius-md); padding:1.5rem 1.8rem; box-shadow:var(--shadow-3d);
  position:relative; font-weight:600; color:var(--c-navy);
}
.chickoo-bubble::after{
  content:''; position:absolute; bottom:-16px; left:48px; width:28px; height:28px; background:#fff;
  clip-path:polygon(0 0, 100% 0, 0 100%); box-shadow:var(--shadow-3d);
}

/* =========================================================
   Awards
   ========================================================= */
.award-badge{
  background:linear-gradient(155deg, #fff, #FFF7E0); border-radius:var(--radius-md); padding:1.8rem 1.2rem;
  text-align:center; box-shadow:var(--shadow-3d); height:100%; position:relative; overflow:hidden;
}
.award-badge .medal{
  width:70px; height:70px; margin:0 auto 1rem; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:2rem; color:#fff; background:linear-gradient(145deg, var(--c-yellow), var(--c-coral));
  box-shadow: inset 0 -6px 10px rgba(0,0,0,.15), 0 10px 18px -6px rgba(230,74,59,.5);
}
.award-badge h6{font-weight:700; margin-bottom:.25rem;}
.award-badge .year{color:var(--c-coral-dark); font-weight:800;}

/* =========================================================
   Gallery
   ========================================================= */
.gallery-filters{display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; margin-bottom:2.5rem;}
.gallery-filters .g-btn{
  border:none; background:#fff; color:var(--c-navy); font-weight:700; padding:.55rem 1.3rem;
  border-radius:999px; box-shadow:var(--shadow-soft); transition:.2s;
}
.gallery-filters .g-btn.active, .gallery-filters .g-btn:hover{
  background:linear-gradient(135deg, var(--c-blue), var(--c-green)); color:#fff;
}
.gallery-item{border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-3d); position:relative; margin-bottom:1.5rem; cursor:pointer;}
.gallery-item img{width:100%; height:260px; object-fit:cover; display:block; transition:transform .4s;}
.gallery-item:hover img{transform:scale(1.08) rotate(1deg);}
.gallery-caption{
  position:absolute; inset:auto 0 0 0; padding:1rem; color:#fff; font-weight:700;
  background:linear-gradient(0deg, rgba(20,35,90,.85), transparent);
}

/* Lightbox Navigation Buttons */
.lightbox-nav-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(20, 35, 90, 0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1050;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.lightbox-nav-btn:hover {
  background: rgba(255, 255, 255, 0.95);
  color: var(--c-navy);
  transform: translateY(-50%) scale(1.08);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
  border-color: #fff;
}
.lightbox-nav-btn:active {
  transform: translateY(-50%) scale(0.95);
}
.lightbox-nav-btn.prev-btn {
  left: 20px;
}
.lightbox-nav-btn.next-btn {
  right: 20px;
}

@media (max-width: 575.98px) {
  .lightbox-nav-btn {
    width: 40px;
    height: 40px;
    font-size: 1.1rem;
  }
  .lightbox-nav-btn.prev-btn {
    left: 10px;
  }
  .lightbox-nav-btn.next-btn {
    right: 10px;
  }
}

/* =========================================================
   Video page
   ========================================================= */
.video-hero-frame{
  border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-3d-hover); position:relative;
  background:#000;
}
.video-hero-frame video, .video-hero-frame iframe{width:100%; display:block; aspect-ratio:16/9; border:0;}
.video-play-overlay{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; cursor:pointer;
  background:linear-gradient(0deg, rgba(0,0,0,.35), rgba(0,0,0,.1));
}
.play-btn-3d{
  width:88px; height:88px; border-radius:50%; background:linear-gradient(145deg, var(--c-coral), var(--c-coral-dark));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:2rem;
  box-shadow:0 6px 0 var(--c-coral-dark), var(--shadow-3d-hover); transition:.2s;
}
.play-btn-3d:hover{transform:scale(1.08);}
.video-card{background:#fff; border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-3d); height:100%; transition:.2s;}
.video-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-3d-hover);}
.video-thumb{position:relative;}
.video-thumb img{width:100%; height:190px; object-fit:cover; display:block;}
.video-thumb .mini-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(20,35,90,.25);
}
.video-thumb .mini-play i{
  width:52px; height:52px; border-radius:50%; background:#fff; color:var(--c-coral); display:flex;
  align-items:center; justify-content:center; font-size:1.4rem; box-shadow:var(--shadow-soft);
}
.video-card .body{padding:1.2rem 1.3rem;}

/* =========================================================
   Contact page
   ========================================================= */
.contact-card{background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-3d); padding:2.2rem;}
.contact-info-item{display:flex; gap:1rem; margin-bottom:1.6rem;}
.contact-info-item .icon-wrap{
  width:52px; height:52px; min-width:52px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.3rem; box-shadow: inset 0 -4px 8px rgba(0,0,0,.12), 0 6px 14px -4px rgba(20,35,90,.35);
}
.form-control, .form-select{
  border-radius:12px; border:2px solid #E7EEFB; padding:.7rem 1rem; font-weight:500;
}
.form-control:focus, .form-select:focus{
  border-color:var(--c-blue); box-shadow:0 0 0 .2rem rgba(41,182,246,.18);
}
.map-frame{border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-3d); border:0; width:100%; height:280px;}

/* =========================================================
   Utilities
   ========================================================= */
.text-coral{color:var(--c-coral);}
.text-blue{color:var(--c-blue-dark);}
.text-green{color:var(--c-green-dark);}
.z-2{position:relative; z-index:2;}

@media (max-width: 991.98px){
  .hero-3d-stage{height:320px; margin-top:2.5rem;}
  .main-navbar .nav-link.active{background:none; color:var(--c-blue-dark);}
}
@media (max-width: 575.98px){
  .hero{padding:3rem 0 4rem;}
  .cta-box-inner{padding:2.2rem 1.2rem;}
}

/* =========================================================
   GALLERY 2.0 — Folder-driven photo gallery
   ========================================================= */
.gallery-hero{overflow:hidden;}
.gallery-hero .g-float{
  position:absolute; font-size:2rem; opacity:.5; pointer-events:none;
  animation:floatY 6s ease-in-out infinite; z-index:1;
}
.g-f1{top:18%; left:6%;} .g-f2{top:60%; left:12%; animation-delay:1.2s;}
.g-f3{top:22%; right:8%; animation-delay:2s;} .g-f4{top:64%; right:14%; animation-delay:.6s;}

/* --- Category chips (one per image folder) --- */
.gallery-filters{display:flex; flex-wrap:wrap; gap:.7rem; justify-content:center; margin-bottom:1.2rem;}
.g-chip{
  --chip-grad:linear-gradient(135deg, var(--c-blue), var(--c-green));
  border:2px solid #E7EEFB; background:#fff; color:var(--c-navy);
  font-weight:800; font-family:var(--font-head); font-size:.95rem;
  padding:.55rem 1.1rem .55rem .9rem; border-radius:999px;
  display:inline-flex; align-items:center; gap:.5rem;
  box-shadow:0 3px 0 #E7EEFB, var(--shadow-soft);
  transition:transform .18s, box-shadow .18s, background .18s, color .18s, border-color .18s;
  cursor:pointer;
}
.g-chip i{font-size:1.02rem; opacity:.85;}
.g-chip .chip-count{
  font-style:normal; font-family:var(--font-body); font-size:.72rem; font-weight:800;
  background:#EEF3FE; color:var(--c-navy-soft); border-radius:999px; padding:.12rem .55rem;
  transition:background .18s, color .18s;
}
.g-chip:hover{transform:translateY(-3px);}
.g-chip.active{
  background:var(--chip-grad); color:#fff; border-color:transparent;
  box-shadow:0 4px 0 rgba(20,35,90,.25), var(--shadow-3d);
}
.g-chip.active .chip-count{background:rgba(255,255,255,.25); color:#fff;}
.chip-all   {--chip-grad:linear-gradient(135deg, #14235A, #33406b);}
.chip-blue  {--chip-grad:linear-gradient(135deg, #29B6F6, #0288D1);}
.chip-green {--chip-grad:linear-gradient(135deg, #66BB6A, #388E3C);}
.chip-yellow{--chip-grad:linear-gradient(135deg, #FFCA28, #F9A825);}
.chip-coral {--chip-grad:linear-gradient(135deg, #FF6F61, #E64A3B);}
.chip-purple{--chip-grad:linear-gradient(135deg, #B39DFF, #8B7CF6);}
.chip-teal  {--chip-grad:linear-gradient(135deg, #26C6DA, #00838F);}
.chip-navy  {--chip-grad:linear-gradient(135deg, #5C6BC0, #14235A);}

.gallery-result{
  font-weight:800; color:var(--c-navy-soft); margin-bottom:2rem; font-size:.95rem;
}
.gallery-result i{color:var(--c-coral); margin-right:.25rem;}
.gallery-result #galleryShownCount{color:var(--c-coral); font-family:var(--font-head); font-size:1.1rem;}

/* --- Photo cards --- */
.photo-card{
  margin:0; border-radius:var(--radius-md); background:#fff; overflow:hidden;
  box-shadow:var(--shadow-3d); cursor:pointer; height:100%;
  display:flex; flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.photo-card:hover{transform:translateY(-6px) rotate(-.4deg); box-shadow:var(--shadow-3d-hover);}
.photo-frame{position:relative; overflow:hidden; aspect-ratio:4/3; background:#F3F8FF;}
.photo-frame img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.photo-card:hover .photo-frame img{transform:scale(1.09);}
/* Newspaper clippings & tall press scans: show full image, no crop */
.photo-card.cat-media .photo-frame img{object-fit:contain; background:#fff;}

.photo-shine{
  position:absolute; top:0; left:-80%; width:50%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.45), transparent);
  transform:skewX(-20deg); pointer-events:none; transition:left .55s ease;
}
.photo-card:hover .photo-shine{left:130%;}
.photo-zoom{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(20,35,90,.28); opacity:0; transition:opacity .25s;
}
.photo-zoom i{
  width:54px; height:54px; border-radius:50%; background:#fff; color:var(--c-navy);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem;
  box-shadow:var(--shadow-soft); transform:scale(.7); transition:transform .25s;
}
.photo-card:hover .photo-zoom{opacity:1;}
.photo-card:hover .photo-zoom i{transform:scale(1);}

.photo-meta{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  padding:.65rem .85rem; background:#fff;
}
.photo-chip{
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.78rem; font-weight:800; color:var(--c-navy);
  background:#F1F6FF; border-radius:999px; padding:.22rem .7rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.photo-chip i{font-size:.8rem;}
.cat-smart        .photo-chip{background:#E9F7EA; color:#2E7D32;} .cat-smart        .photo-chip i{color:#388E3C;}
.cat-activities   .photo-chip{background:#E3F6FF; color:#0277BD;} .cat-activities   .photo-chip i{color:#0288D1;}
.cat-learning     .photo-chip{background:#F0ECFF; color:#5E48C8;} .cat-learning     .photo-chip i{color:#8B7CF6;}
.cat-outdoor      .photo-chip{background:#E0F7FA; color:#00707C;} .cat-outdoor      .photo-chip i{color:#00838F;}
.cat-before-after .photo-chip{background:#FFEDEA; color:#C43A2B;} .cat-before-after .photo-chip i{color:#E64A3B;}
.cat-launch       .photo-chip{background:#FFF6DC; color:#B07C00;} .cat-launch       .photo-chip i{color:#F9A825;}
.cat-awards       .photo-chip{background:#FFF6DC; color:#B07C00;} .cat-awards       .photo-chip i{color:#F9A825;}
.cat-events       .photo-chip{background:#E9F7EA; color:#2E7D32;} .cat-events       .photo-chip i{color:#388E3C;}
.cat-about        .photo-chip{background:#FFEDEA; color:#C43A2B;} .cat-about        .photo-chip i{color:#E64A3B;}
.cat-media        .photo-chip{background:#E8EAF6; color:#2C3A8C;} .cat-media        .photo-chip i{color:#3F51B5;}
.photo-num{font-family:var(--font-head); font-weight:800; font-size:.8rem; color:#9AA6C9;}

/* Titled photo cards (curated gallery photos) */
.photo-meta.has-title{flex-direction:column; align-items:stretch; gap:.35rem;}
.photo-title{
  font-family:var(--font-head); font-weight:800; font-size:.92rem; color:var(--c-navy);
  line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.photo-meta-row{display:flex; align-items:center; justify-content:space-between; gap:.5rem; width:100%;}

/* Pop-in animation when a filter is applied */
@keyframes galleryPop{
  0%{opacity:0; transform:translateY(18px) scale(.94);}
  100%{opacity:1; transform:translateY(0) scale(1);}
}
.photo-card.pop-in{animation:galleryPop .45s cubic-bezier(.2,.7,.3,1) both;}

/* --- Lightbox polish --- */
.lightbox-shell{border:0; border-radius:var(--radius-md); overflow:hidden; background:#0d1533;}
#lightboxImg{max-height:78vh; object-fit:contain; background:#0d1533;}
.lightbox-counter{
  position:absolute; top:14px; left:16px; z-index:1055;
  background:rgba(20,35,90,.55); backdrop-filter:blur(6px);
  color:#fff; font-weight:800; font-size:.82rem; font-family:var(--font-head);
  border:1px solid rgba(255,255,255,.25); border-radius:999px; padding:.28rem .85rem;
}
.lightbox-caption{
  padding:.9rem 1rem; font-weight:800; text-align:center; background:#fff; color:var(--c-navy);
}

/* =========================================================
   HOME — Gallery category cards (the 6 folders)
   ========================================================= */
.cat-card{
  display:block; position:relative; border-radius:var(--radius-md); overflow:hidden;
  box-shadow:var(--shadow-3d); height:230px; background:#fff;
  transition:transform .25s ease, box-shadow .25s ease;
}
.cat-card:hover{transform:translateY(-8px); box-shadow:var(--shadow-3d-hover);}
.cat-card img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.7,.3,1);}
.cat-card:hover img{transform:scale(1.08);}
.cat-card .cat-overlay{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end;
  padding:1.1rem 1.2rem;
  background:linear-gradient(0deg, rgba(13,21,51,.88) 0%, rgba(13,21,51,.25) 55%, rgba(13,21,51,0) 100%);
}
.cat-card .cat-icon{
  position:absolute; top:14px; left:14px; width:46px; height:46px; border-radius:14px;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.25rem;
  box-shadow:inset 0 -5px 8px rgba(0,0,0,.15), 0 8px 14px -6px rgba(0,0,0,.45);
}
.cat-card .cat-count{
  position:absolute; top:14px; right:14px; background:rgba(255,255,255,.92); color:var(--c-navy);
  font-family:var(--font-head); font-weight:800; font-size:.8rem; border-radius:999px; padding:.25rem .7rem;
  box-shadow:var(--shadow-soft);
}
.cat-card h5{color:#fff; margin:0; font-size:1.15rem; display:flex; align-items:center; gap:.4rem;}
.cat-card h5 .bi-arrow-right-short{transition:transform .2s;}
.cat-card:hover h5 .bi-arrow-right-short{transform:translateX(6px);}
.cat-card small{color:#cfdaf5; font-weight:600;}

/* =========================================================
   Site-wide polish
   ========================================================= */
/* Rainbow accent above navbar */
.top-bar{border-bottom:0;}
.main-navbar::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--c-coral), var(--c-yellow), var(--c-green), var(--c-blue), var(--c-purple));
  background-size:300% 100%; animation:rainbowSlide 8s linear infinite;
}
@keyframes rainbowSlide{0%{background-position:0 0;} 100%{background-position:300% 0;}}

/* Custom scrollbar */
::-webkit-scrollbar{width:11px;}
::-webkit-scrollbar-track{background:#EEF3FE;}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, var(--c-blue), var(--c-purple));
  border-radius:8px; border:2px solid #EEF3FE;
}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg, var(--c-coral), var(--c-purple));}

/* Media/press strip on inner pages */

@media (max-width:575.98px){
  .cat-card{height:190px;}
  .g-chip{font-size:.85rem; padding:.45rem .9rem .45rem .75rem;}
  .photo-frame{aspect-ratio:1/1;}
}


/* =========================================================
   Hero — single artwork image
   ========================================================= */
/* ---- Hero visual: static, integrated into the layout ---- */
.hero-visual{ position:relative; }
.hv-frame{
  position:relative; z-index:1; margin:0;
  border-radius:22px; overflow:hidden;
  box-shadow:0 22px 48px -18px rgba(20,34,87,.28), 0 8px 20px rgba(20,34,87,.10);
}
.hv-frame img{ display:block; width:100%; height:auto; }
/* grounded contact shadow so it sits in the scene */
.hero-visual::after{
  content:''; position:absolute; z-index:-1; left:14%; right:4%; bottom:-30px; height:38px;
  background:radial-gradient(55% 100% at 50% 0, rgba(20,34,87,.24), transparent 72%);
  filter:blur(8px);
}
@media (max-width:991.98px){
  .hero-visual{ margin-top:2.4rem; }
  .hv-frame{ border-radius:18px; }
}

/* =========================================================
   FOOTER 2.0 — Premium, colourful, professional
   (appended last: overrides the earlier footer block)
   ========================================================= */
.site-footer{
  background:
    radial-gradient(700px 340px at 8% 0%, rgba(41,182,246,.16), transparent 60%),
    radial-gradient(640px 320px at 92% 12%, rgba(139,124,246,.18), transparent 60%),
    radial-gradient(560px 300px at 50% 105%, rgba(255,111,97,.12), transparent 60%),
    linear-gradient(175deg, #142257 0%, #0e1a44 46%, #091130 100%);
  color:#aebdde;
  overflow:hidden;
  padding-top:0;
  border-top:none;
}
.footer-wave svg{ fill:#142257; }
.footer-rainbow{
  display:block; height:5px; width:100%;
  background:linear-gradient(90deg, var(--c-coral), var(--c-yellow), var(--c-green), var(--c-blue), var(--c-purple), var(--c-coral));
  background-size:300% 100%;
  animation:rainbowSlide 9s linear infinite;
}
@keyframes rainbowSlide{ 0%{background-position:0% 0;} 100%{background-position:300% 0;} }
.f-glow{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.35; pointer-events:none; }
.f-glow-1{ width:340px; height:340px; left:-120px; top:-60px; background:radial-gradient(circle, #2c7bd4, transparent 70%); }
.f-glow-2{ width:300px; height:300px; right:-100px; bottom:-80px; background:radial-gradient(circle, #7d5fe8, transparent 70%); }
.f-star{ position:absolute; color:rgba(255,202,40,.5); font-size:1rem; animation:fstarTwinkle 3.6s ease-in-out infinite; pointer-events:none; }
@keyframes fstarTwinkle{ 0%,100%{opacity:.25; transform:scale(.85);} 50%{opacity:.9; transform:scale(1.15);} }

.footer-main{ position:relative; z-index:1; padding-block:3.4rem 2.6rem; }

/* Brand */
.footer-brand{ display:inline-flex; background:#fff; border-radius:16px; padding:.55rem .95rem;
  box-shadow:0 10px 26px rgba(0,0,0,.35), 0 0 0 4px rgba(255,255,255,.06); transition:transform .3s ease; }
.footer-brand:hover{ transform:translateY(-3px) scale(1.02); }
.footer-brand img{ height:56px; width:auto; display:block; }
.footer-tag{ color:#fff; font-weight:600; font-size:.95rem; }
.footer-desc{ color:#fff; font-size:.92rem; line-height:1.75; max-width:420px; }

/* Social — brand colours on hover */
.social-orbs{ display:flex; gap:.7rem; }
.social-orbs a{
  width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.08); color:#dfe8ff; font-size:1.15rem;
  border:1px solid rgba(255,255,255,.12);
  transition:transform .25s ease, background .25s ease, box-shadow .25s ease, color .25s ease;
}
.social-orbs a:hover{ transform:translateY(-4px) scale(1.07); color:#fff; }
.social-orbs .so-fb:hover{ background:#1877F2; box-shadow:0 10px 22px rgba(24,119,242,.45); }
.social-orbs .so-ig:hover{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF,#515BD4); box-shadow:0 10px 22px rgba(221,42,123,.45); }
.social-orbs .so-yt:hover{ background:#FF0000; box-shadow:0 10px 22px rgba(255,0,0,.42); }
.social-orbs .so-in:hover{ background:#0A66C2; box-shadow:0 10px 22px rgba(10,102,194,.45); }
.social-orbs .so-wa:hover{ background:#25D366; box-shadow:0 10px 22px rgba(37,211,102,.45); }

/* Headings & links */
.footer-heading{ font-size:1.05rem; letter-spacing:.3px; margin-bottom:1.1rem; }
.footer-heading::after{ width:44px; height:3px;
  background:linear-gradient(90deg, var(--c-yellow), var(--c-coral) 55%, var(--c-purple)); }
.footer-links{ list-style:none; margin:0; padding:0; }
.footer-links li{ margin-bottom:.55rem; }
.footer-links a{
  color:#fff; text-decoration:none; font-size:.93rem; display:inline-flex; align-items:center; gap:.3rem;
  transition:color .22s ease, transform .22s ease;
}
.footer-links a i{ font-size:.7rem; color:var(--c-yellow); opacity:.75; transition:transform .22s ease; }
.footer-links a:hover{ color:#fff; transform:translateX(4px); }
.footer-links a:hover i{ transform:translateX(2px); color:var(--c-coral); }

/* Offices */
.footer-office{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-left:4px solid var(--c-yellow);
  border-radius:12px;
  padding:.85rem 1rem;
  margin-bottom:1rem;
  transition:background .25s ease, transform .25s ease, border-left-color .25s ease;
}
.footer-office:hover{ background:rgba(255,255,255,.09); transform:translateX(4px); }
.footer-office:nth-child(3){ border-left-color:var(--c-green); }
.fo-label{ color:#fff; font-weight:700; font-size:.92rem; margin-bottom:.3rem; }
.fo-label i{ color:var(--c-yellow); margin-right:.25rem; }
.footer-office:nth-child(3) .fo-label i{ color:var(--c-green); }
.fo-addr{ color:#fff; font-size:.88rem; line-height:1.65; margin:0; }

/* Contact items */
.f-contact-item{
  display:flex; align-items:center; gap:.7rem; text-decoration:none;
  color:#fff; font-size:.92rem; margin-bottom:.95rem;
  transition:color .22s ease, transform .22s ease;
}
.f-contact-item:hover{ color:#fff; transform:translateX(4px); }
.fci-icon{
  flex:0 0 auto; width:38px; height:38px; border-radius:11px;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:1rem; box-shadow:0 6px 14px rgba(0,0,0,.35);
}
.fci-blue{ background:linear-gradient(135deg, var(--c-blue), #1565C0); }
.fci-coral{ background:linear-gradient(135deg, var(--c-coral), #E53935); }
.fci-green{ background:linear-gradient(135deg, #25D366, #128C7E); }

/* Bottom bar */
.footer-bottom-bar{
  position:relative; z-index:1;
  border-top:1px solid rgba(255,255,255,.09);
  background:rgba(0,0,0,.22);
  padding:1rem 0;
  font-size:.88rem; color:#fff;
}
.fb-right{ color:#cfe0ff; font-weight:600; }
.fb-right i{ color:var(--c-yellow); margin-right:.3rem; }

@media (max-width: 575.98px){
  .footer-main{ padding-block:2.6rem 2rem; }
  .footer-bottom-bar .container{ padding-inline:1.25rem; }
  .footer-bottom-bar .container{ justify-content:center !important; text-align:center; }
}

/* ===== Compact page hero (inner pages) ===== */
@media (max-width: 767.98px){
  .page-hero{ padding:2.3rem 0 1.9rem; }
  .page-hero .section-title{ font-size:1.5rem; }
}
/* pull first section a bit closer to the hero for a tighter rhythm */
.page-hero + section{ padding-top:3rem !important; }
@media (max-width: 767.98px){
  .page-hero + section{ padding-top:2.2rem !important; }
}

/* =========================================================
   RESPONSIVE 2.0 — mobile / tablet / desktop polish
   ========================================================= */
/* media safety net: nothing ever wider than its box */
img, video, iframe{ max-width:100%; }
img{ height:auto; }

/* clip slide-in animations & edge decor at the section level */
section, .site-footer, .page-hero, .hero{ overflow-x:clip; }

/* anchor jumps land below the sticky header */
section[id], [id^="sec-"]{ scroll-margin-top:96px; }

/* --- Touch devices: hover effects that need a pointer --- */
@media (hover:none){
  .tilt-card, .tilt-card:hover{ transform:none !important; }
  .g-chip:hover, .cat-card:hover, .photo-card:hover{ transform:none; }
}
/* tap-to-flip support (JS toggles .flipped) */
.flip-card.flipped .flip-card-inner{ transform:rotateY(180deg); }

/* --- Tablet and below --- */
@media (max-width: 991.98px){
  .hero{ padding:3.4rem 0 5rem; }
  .hero .row.g-5{ --bs-gutter-y:2.2rem; }
}

/* --- Phones --- */
@media (max-width: 767.98px){
  .hero{ padding:2.4rem 0 3.2rem; }
  .section{ padding:2.75rem 0; }
  .section-title{ font-size:clamp(1.4rem, 5.8vw, 1.85rem); }
  .section-lead{ font-size:.95rem; }
  .cta-strip{ padding:.5rem 0 2.4rem; }
  .cta-box-inner{ padding:2.4rem 1.25rem; }
  .cta-box-inner .btn-lg{ padding:.7rem 1.15rem; font-size:.95rem; width:100%; max-width:340px; }
  .back-to-top{ width:44px; height:44px; }

  /* gallery filter chips become a swipeable strip */
  .gallery-filters{
    display:flex; flex-wrap:nowrap; justify-content:flex-start;
    overflow-x:auto; gap:.5rem;
    padding:.3rem .35rem .85rem; margin-inline:-.35rem;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  .gallery-filters::-webkit-scrollbar{ display:none; }
  .gallery-filters .g-chip{ flex:0 0 auto; scroll-snap-align:center; }
}

/* --- Small phones --- */
@media (max-width: 575.98px){
  .top-bar .container{ justify-content:center !important; row-gap:.1rem; }
  .top-bar-contact{ display:flex; gap:.9rem; }
  .top-bar-contact a{ margin-right:0; font-size:.84rem; }
  .hero .d-flex.gap-3 .btn{ flex:1 1 auto; text-align:center; }
}

/* AOS removed — attributes are inert; insurance against any cached lib */
[data-aos]{ opacity:1 !important; transform:none !important; transition:none !important; }

/* ================= HERO TYPO FIX (Devanagari breathing room) ================= */
/* Devanagari needs taller line-height; clear vertical rhythm so badge / h1 /
   lead / buttons / stats read as separate blocks, not one paragraph. */
.hero-badge{ margin-bottom:.35rem; }
.hero h1{
  line-height:1.38;
  margin:1.15rem 0 1.25rem;
  letter-spacing:.2px;
}
.hero-lead{
  font-size:1.13rem;
  line-height:2;
  color:#4A5878;
  max-width:540px;
  margin-bottom:.5rem;
}
.hero .btn-lg{ padding:.8rem 1.6rem; }
/* general Devanagari comfort on section text too */
.section-title{ line-height:1.4; }
.section-lead{ line-height:1.95; }
p{ line-height:1.9; }

/* ============================================================
   PREMIUM UI 3.0 — candy-playful visual upgrade (CSS only)
   Content/markup untouched. No scroll/entrance animations.
   ============================================================ */

/* ---- richer page atmosphere ---- */
body{
  background:
    radial-gradient(900px 420px at 12% -4%,  #DFF3FF 0%, transparent 55%),
    radial-gradient(800px 420px at 96% 8%,   #FFF3E4 0%, transparent 55%),
    radial-gradient(760px 480px at -6% 46%,  #E8FBEF 0%, transparent 55%),
    radial-gradient(820px 460px at 104% 72%, #F3EEFF 0%, transparent 55%),
    linear-gradient(180deg, #F2FAFF 0%, #FDFEFF 30%, #ffffff 100%);
}

/* ---- glassy sticky navbar ---- */
.main-navbar{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  box-shadow:0 6px 24px rgba(20,35,90,.08);
}
.main-navbar .nav-link{ border-radius:999px; transition:background .2s, color .2s, transform .15s; }
.main-navbar .nav-link:hover{ transform:translateY(-1px); }

/* ---- hero: sunny candy band ---- */
.hero{
  background:
    radial-gradient(1100px 520px at 82% -12%, #CBEBFF 0%, transparent 58%),
    radial-gradient(760px 420px at -8% 100%,  #DDF6E3 0%, transparent 60%),
    radial-gradient(560px 320px at 42% 118%,  #FFF0D9 0%, transparent 62%),
    linear-gradient(180deg, #EAF7FF 0%, #F7FCFF 70%, #ffffff 100%);
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:6px;
  background:linear-gradient(90deg,#FF6F61,#FFCA28,#66BB6A,#29B6F6,#8B7CF6);
  opacity:.55; border-radius:6px 6px 0 0;
}
.hero-badge{
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(90deg,#FF6F61,#FFCA28,#29B6F6) border-box;
  border:2px solid transparent;
  box-shadow:0 8px 22px rgba(255,111,97,.18);
}
.hero h1 .accent{
  background:linear-gradient(92deg,#FF6F61 10%,#FF9243 60%,#F9A825 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}
.hv-frame{ box-shadow:0 24px 60px rgba(20,35,90,.22), 0 6px 18px rgba(20,35,90,.10); }

/* ---- buttons: candy depth + glow ---- */
.btn-cta{
  background:linear-gradient(135deg,#FF7A6C 0%,#FF6F61 45%,#F4513F 100%);
  box-shadow:0 5px 0 var(--c-coral-dark), 0 14px 30px rgba(255,111,97,.35);
}
.btn-cta:hover{ box-shadow:0 7px 0 var(--c-coral-dark), 0 18px 40px rgba(255,111,97,.45); }
.btn-cta-outline{ background:rgba(255,255,255,.85); backdrop-filter:blur(6px); }

/* ---- section identity ---- */
.section-tag{
  background:linear-gradient(#F3F9FF,#F3F9FF) padding-box,
             linear-gradient(90deg,#29B6F6,#66BB6A) border-box;
  border:2px solid transparent; color:var(--c-blue-dark);
  box-shadow:0 6px 16px rgba(41,182,246,.14);
}
.section-title .underline, .underline{
  display:block; width:88px; height:6px; border-radius:99px; margin-top:.7rem;
  background:linear-gradient(90deg,#FF6F61,#FFCA28,#29B6F6);
}
.section-alt{
  background:
    radial-gradient(700px 340px at 100% 0%, #EAF6FF 0%, transparent 60%),
    radial-gradient(620px 320px at 0% 100%, #F0FBF2 0%, transparent 60%),
    linear-gradient(180deg,#F5FAFF,#FBFDFF);
}
/* soft confetti dots on alt bands */
.section-alt{ position:relative; }
.section-alt::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(41,182,246,.10) 1.6px, transparent 1.6px);
  background-size:26px 26px;
  mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
}
.section-alt > .container{ position:relative; }

/* ---- cards: rainbow-edge signature ---- */
.tilt-card, .stat-card, .tl-card, .video-card, .contact-card, .cat-card, .flip-front{
  background:linear-gradient(#ffffff,#ffffff) padding-box,
             linear-gradient(135deg,#FFD9D4 0%,#FFEFC2 30%,#D5F2DC 62%,#D3ECFF 100%) border-box;
  border:2px solid transparent;
}
.tilt-card, .stat-card, .tl-card, .video-card, .cat-card{
  transition:transform .22s ease, box-shadow .22s ease;
}
.tilt-card:hover, .stat-card:hover, .video-card:hover, .cat-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 44px rgba(20,35,90,.16);
}
.tilt-icon{ box-shadow:0 10px 22px rgba(20,35,90,.18), inset 0 -3px 0 rgba(0,0,0,.12); }

/* ---- stats: gradient numerals ---- */
.stat-number{
  background:linear-gradient(120deg,#FF6F61 0%,#F9A825 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}

/* ---- inner page hero: candy sky + dots ---- */
.page-hero{
  background:
    radial-gradient(820px 300px at 85% -30%, #CDEBFF 0%, transparent 60%),
    radial-gradient(620px 280px at 8% 120%,  #E2F8E8 0%, transparent 60%),
    linear-gradient(180deg,#EAF6FF, #F8FCFF);
}
.page-hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:5px;
  background:linear-gradient(90deg,#FF6F61,#FFCA28,#66BB6A,#29B6F6,#8B7CF6); opacity:.5;
}
.page-hero{ position:relative; }

/* ---- CTA strip: aurora box ---- */
.cta-box-inner{
  background:
    radial-gradient(560px 260px at 88% -20%, rgba(139,124,246,.55) 0%, transparent 60%),
    radial-gradient(520px 280px at 0% 120%,  rgba(41,182,246,.5) 0%, transparent 55%),
    linear-gradient(135deg,#1A2B6D 0%, #142257 60%, #0F1B47 100%);
  box-shadow:0 30px 70px rgba(20,34,87,.35);
}

/* ---- gallery chips glow ---- */
.g-chip{ box-shadow:0 6px 16px rgba(20,35,90,.10); }
.g-chip:hover{ transform:translateY(-2px); }

/* ---- chickoo bubble: candy border ---- */
.chickoo-bubble{
  background:linear-gradient(#FFFDF4,#FFFDF4) padding-box,
             linear-gradient(90deg,#FFCA28,#FF8A65) border-box;
  border:2px solid transparent;
  box-shadow:0 12px 26px rgba(249,168,37,.16);
}

/* ---- focus visibility (quality floor) ---- */
a:focus-visible, button:focus-visible{ outline:3px solid #29B6F6; outline-offset:2px; border-radius:8px; }

@media (max-width:576px){
  .section-alt::before{ background-size:20px 20px; }
}

/* ============================================================
   PREMIUM UI 4.0 — final polish pass (CSS only, static)
   ============================================================ */

/* ---- candy scrollbar ---- */
::-webkit-scrollbar{ width:12px; }
::-webkit-scrollbar-track{ background:#EFF6FF; }
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#FF8A80,#FFCA28,#66BB6A,#29B6F6);
  border-radius:99px; border:3px solid #EFF6FF;
}

/* ---- top bar: subtle aurora ---- */
.top-bar{
  background:
    radial-gradient(420px 90px at 90% 0%, rgba(139,124,246,.35) 0%, transparent 70%),
    radial-gradient(360px 90px at 12% 100%, rgba(41,182,246,.30) 0%, transparent 70%),
    linear-gradient(90deg, #14235A, #1B2E6E);
}

/* ---- nav CTA shine sweep on hover ---- */
.btn-cta{ position:relative; overflow:hidden; }
.btn-cta::after{
  content:""; position:absolute; top:0; bottom:0; left:-70%; width:45%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.42), transparent);
  transform:skewX(-18deg); transition:left .5s ease; pointer-events:none;
}
.btn-cta:hover::after{ left:125%; }

/* ---- headline: keep block flow (tag pill above title) ---- */
.section-title{ position:relative; display:block; }

/* ---- timeline: gradient rail + glowing dots ---- */
.tl-3d{ position:relative; }
.tl-step::after{
  content:""; position:absolute; left:calc(-2rem + 11px); top:30px; bottom:-4px; width:4px;
  background:linear-gradient(180deg,#29B6F6,#66BB6A,#FFCA28,#FF6F61);
  border-radius:99px; opacity:.5;
}
.tl-step:last-child::after{ display:none; }
.tl-step::before{
  box-shadow:0 0 0 6px rgba(41,182,246,.12), var(--shadow-soft);
}
.tl-step:nth-child(2)::before{ box-shadow:0 0 0 6px rgba(102,187,106,.14), var(--shadow-soft); }
.tl-step:nth-child(3)::before{ box-shadow:0 0 0 6px rgba(255,202,40,.18), var(--shadow-soft); }
.tl-step:nth-child(4)::before{ box-shadow:0 0 0 6px rgba(255,111,97,.15), var(--shadow-soft); }
.tl-card{ transition:transform .2s ease, box-shadow .2s ease; }
.tl-card:hover{ transform:translateX(6px); box-shadow:0 16px 34px rgba(20,35,90,.14); }

/* ---- icon micro-interaction: playful wiggle-tilt on card hover ---- */
.tilt-card .tilt-icon{ transition:transform .25s ease; }
.tilt-card:hover .tilt-icon{ transform:rotate(-6deg) scale(1.08); }

/* ---- gallery photo cards: richer hover ---- */
.photo-card{ transition:transform .22s ease, box-shadow .22s ease; }
.photo-card:hover{ transform:translateY(-6px); box-shadow:0 22px 44px rgba(20,35,90,.18); }
.photo-frame img{ transition:transform .35s ease; }
.photo-card:hover .photo-frame img{ transform:scale(1.06); }

/* ---- video cards: play button pops on hover ---- */
.video-thumb .video-play-overlay i, .video-play-overlay{ transition:transform .25s ease; }
.video-card:hover .video-play-overlay{ transform:scale(1.12); }

/* ---- forms: soft candy inputs ---- */
.form-control, .form-select{
  border:2px solid #E3EDFB; border-radius:14px; padding:.7rem 1rem;
  background:#FBFDFF; transition:border-color .2s, box-shadow .2s, background .2s;
}
.form-control:focus, .form-select:focus{
  border-color:#29B6F6; background:#fff;
  box-shadow:0 0 0 4px rgba(41,182,246,.16);
}
.form-label{ font-weight:700; color:var(--c-navy); }

/* ---- breadcrumb pill ---- */
.page-hero .breadcrumb, .crumb-pill{ box-shadow:0 8px 20px rgba(20,35,90,.10); }

/* ---- skill pills: gradient border + bounce hover ---- */
.skill-pill{
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(120deg,#FFD9D4,#D3ECFF) border-box;
  border:2px solid transparent;
}
.skill-pill:hover{ transform:translateY(-5px) scale(1.04) rotate(-1deg); }

/* ---- award badges glow ---- */
.award-badge{ box-shadow:0 12px 28px rgba(249,168,37,.22); transition:transform .2s ease; }
.award-badge:hover{ transform:translateY(-4px) rotate(1deg); }

/* ---- back-to-top: rainbow ring ---- */
.back-to-top{
  background:linear-gradient(#FF6F61,#F4513F) padding-box,
             linear-gradient(135deg,#FF6F61,#FFCA28,#29B6F6) border-box;
  border:3px solid transparent;
  box-shadow:0 12px 28px rgba(255,111,97,.35);
}

/* ---- lightbox: candy chrome ---- */
.lightbox-shell{ box-shadow:0 40px 90px rgba(0,0,0,.5); }

/* ---- gallery chips: active pop ---- */
.g-chip.active, .g-chip[aria-pressed="true"]{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(20,35,90,.20);
}

/* ---- map frame: gradient edge ---- */
.map-frame{
  border-radius:18px;
  outline:2px solid transparent;
  box-shadow:0 0 0 2px #fff, 0 0 0 4px rgba(41,182,246,.35), 0 18px 40px rgba(20,35,90,.14);
}

/* ---- flip-back: aurora ---- */
.flip-back{
  background:
    radial-gradient(300px 200px at 90% -10%, rgba(139,124,246,.5) 0%, transparent 60%),
    linear-gradient(135deg,#1A2B6D,#142257) !important;
}

/* ---- reduced motion: kill all micro-interactions ---- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ transition:none !important; animation:none !important; }
}

/* ============================================================
   PAGE-HERO 5.0 — premium inner-page header band
   ============================================================ */
.page-hero{
  padding:3.6rem 0 3rem;
  background:
    radial-gradient(760px 300px at 88% -35%, #C4E7FF 0%, transparent 58%),
    radial-gradient(560px 260px at 4% 125%,  #DCF7E4 0%, transparent 60%),
    radial-gradient(420px 220px at 55% 130%, #FFF0D6 0%, transparent 62%),
    linear-gradient(180deg,#E7F5FF 0%, #F5FBFF 66%, #FDFEFF 100%);
}
/* soft confetti dots across the band */
.page-hero::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:
    radial-gradient(rgba(255,111,97,.14) 2px, transparent 2px),
    radial-gradient(rgba(41,182,246,.13) 2px, transparent 2px);
  background-size:46px 46px, 46px 46px;
  background-position:0 0, 23px 23px;
  mask-image:linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
}
.page-hero .container{ position:relative; }

/* gradient title */
.page-hero .section-title{
  font-size:clamp(1.9rem, 3.4vw, 2.7rem);
  background:linear-gradient(100deg,#14235A 20%, #1D4ED8 55%, #0E7BB8 90%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  margin-bottom:.4rem;
}
.page-hero .section-title .underline{
  width:110px; height:6px; margin:0.8rem auto 0;
  background:linear-gradient(90deg,#FF6F61,#FFCA28,#66BB6A,#29B6F6);
}
/* frosted tag pill */
.page-hero .section-tag{
  background:linear-gradient(rgba(255,255,255,.92),rgba(255,255,255,.92)) padding-box,
             linear-gradient(90deg,#FF6F61,#FFCA28,#29B6F6) border-box;
  border:2px solid transparent; color:var(--c-navy);
  box-shadow:0 10px 24px rgba(20,35,90,.10);
  letter-spacing:.4px;
}
.page-hero .section-lead{
  font-size:1.06rem; color:#41507C; max-width:640px;
  background:rgba(255,255,255,.55); backdrop-filter:blur(4px);
  border-radius:999px; padding:.55rem 1.3rem; display:table;
  margin:0 auto 1rem;
  box-shadow:0 8px 20px rgba(20,35,90,.06);
}
/* breadcrumb: candy pill with home icon feel */
.page-hero .crumb{
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(90deg,#D3ECFF,#FFE3C2) border-box;
  border:2px solid transparent;
  display:inline-flex; align-items:center; gap:.35rem;
  border-radius:999px; padding:.5rem 1.25rem;
  box-shadow:0 10px 24px rgba(20,35,90,.10);
  font-weight:700;
}
.page-hero .crumb a{ color:var(--c-blue-dark); }
.page-hero .crumb a:hover{ color:var(--c-coral); }

/* rainbow baseline stays but slightly bolder */
.page-hero::after{ height:6px; opacity:.6; }

@media (max-width:576px){
  .page-hero{ padding:2.5rem 0 2.1rem; }
  .page-hero .section-lead{ border-radius:18px; padding:.55rem 1rem; }
  .page-hero::before{ background-size:34px 34px, 34px 34px; background-position:0 0, 17px 17px; }
}

/* ============================================================
   PROFESSIONAL 6.0 — enterprise-grade refinement
   Tones the candy look into a clean, premium brand system:
   one accent family, quiet borders, disciplined shadows.
   ============================================================ */

:root{
  --pro-border:#E6EDF8;
  --pro-shadow-sm:0 2px 10px rgba(20,35,90,.06);
  --pro-shadow-md:0 10px 28px rgba(20,35,90,.10);
  --pro-shadow-lg:0 22px 48px rgba(20,35,90,.14);
}

/* ---- calm the rainbow: thin, quiet accents ---- */
.hero::after, .page-hero::after{ height:4px; opacity:.35; }
.section-title .underline, .underline{
  width:64px; height:4px;
  background:linear-gradient(90deg,var(--c-coral),var(--c-yellow-dark));
}
.page-hero .section-title .underline{ width:84px; height:4px; }

/* ---- cards: quiet borders, gradient only on hover ---- */
.tilt-card, .stat-card, .tl-card, .video-card, .contact-card, .cat-card, .flip-front{
  background:#fff; border:1px solid var(--pro-border);
  box-shadow:var(--pro-shadow-sm);
}
.tilt-card:hover, .stat-card:hover, .video-card:hover, .cat-card:hover{
  border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(135deg,#FFD9D4,#FFEFC2,#D3ECFF) border-box;
  border:1px solid transparent;
  transform:translateY(-4px);
  box-shadow:var(--pro-shadow-lg);
}
.tl-card:hover{ transform:translateX(4px); box-shadow:var(--pro-shadow-md); }

/* ---- skill pills / chips: quiet default ---- */
.skill-pill{
  background:#fff; border:1px solid var(--pro-border); box-shadow:var(--pro-shadow-sm);
}
.skill-pill:hover{ transform:translateY(-3px); box-shadow:var(--pro-shadow-md); }
.chickoo-bubble{
  background:#FFFCF2; border:1px solid #F3E4BB;
  box-shadow:var(--pro-shadow-sm);
}

/* ---- section tags: minimal professional pill ---- */
.section-tag, .page-hero .section-tag{
  background:#F1F7FF; border:1px solid #D8E8FA; color:var(--c-blue-dark);
  box-shadow:none; font-weight:700; letter-spacing:.5px;
}

/* ---- hero badge: clean white, single accent border ---- */
.hero-badge{
  background:#fff; border:1px solid #FFD9D4;
  box-shadow:var(--pro-shadow-sm);
}

/* ---- typography discipline ---- */
h1,h2,h3{ letter-spacing:.1px; }
.section-title{ font-weight:800; }
.page-hero .section-title{
  background:none; -webkit-text-fill-color:var(--c-navy); color:var(--c-navy);
}
.hero h1 .accent{
  background:linear-gradient(95deg,var(--c-coral) 20%, #F98A2B 90%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

/* ---- shadows unified ---- */
.hv-frame{ box-shadow:var(--pro-shadow-lg); }
.btn-cta{ box-shadow:0 4px 0 var(--c-coral-dark), 0 12px 26px rgba(255,111,97,.28); }
.btn-cta:hover{ box-shadow:0 6px 0 var(--c-coral-dark), 0 16px 34px rgba(255,111,97,.34); }
.g-chip{ box-shadow:var(--pro-shadow-sm); border:1px solid var(--pro-border); }
.photo-card{ border:1px solid var(--pro-border); }
.photo-card:hover{ box-shadow:var(--pro-shadow-lg); }
.map-frame{ box-shadow:0 0 0 1px var(--pro-border), var(--pro-shadow-md); outline:none; }
.award-badge{ box-shadow:var(--pro-shadow-md); }
.back-to-top{ box-shadow:0 10px 24px rgba(255,111,97,.30); }

/* ---- page atmosphere: calmer, airier ---- */
body{
  background:
    radial-gradient(820px 380px at 10% -4%,  #E7F4FF 0%, transparent 55%),
    radial-gradient(760px 380px at 98% 10%,  #FDF4E8 0%, transparent 55%),
    radial-gradient(700px 420px at -4% 52%,  #EFFBF3 0%, transparent 55%),
    linear-gradient(180deg, #F5FAFF 0%, #FDFEFF 28%, #ffffff 100%);
}
.section-alt::before{ opacity:.3; }
.page-hero::before{ opacity:.35; }

/* ---- scrollbar: professional navy ---- */
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#33406B,#14235A);
  border:3px solid #EFF6FF;
}

/* ---- top bar: solid clean navy ---- */
.top-bar{ background:linear-gradient(90deg,#14235A,#1B2E6E); }

/* ---- lead pill in page hero: plain professional text ---- */
.page-hero .section-lead{
  background:none; box-shadow:none; backdrop-filter:none;
  padding:0; border-radius:0; display:block; margin:0 auto .9rem;
}
.page-hero .crumb{
  background:#fff; border:1px solid var(--pro-border); box-shadow:var(--pro-shadow-sm);
}

/* ---- cta box: deep navy, one aurora accent only ---- */
.cta-box-inner{
  background:
    radial-gradient(620px 300px at 92% -30%, rgba(41,182,246,.35) 0%, transparent 60%),
    linear-gradient(135deg,#1A2B6D 0%, #142257 65%, #0F1B47 100%);
  box-shadow:0 24px 56px rgba(20,34,87,.30);
}

/* ============================================================
   PAGE-HERO 7.0 — executive header band
   Eyebrow → headline → quiet breadcrumb. No pills, no noise.
   ============================================================ */
.page-hero{
  padding:3.2rem 0 2.7rem;
  background:linear-gradient(180deg,#F3F9FF 0%, #FAFCFF 70%, #FFFFFF 100%);
  border-bottom:1px solid #E9F0FA;
}
.page-hero::before{ display:none; }           /* no confetti here */
.page-hero::after{ height:3px; opacity:.45; } /* hairline brand accent */

/* tag → typographic eyebrow with side rules */
.page-hero .section-tag{
  background:none; border:0; box-shadow:none; padding:0;
  display:inline-flex; align-items:center; gap:.7rem;
  font-size:.8rem; font-weight:800; letter-spacing:2.5px;
  text-transform:uppercase; color:var(--c-blue-dark);
}
.page-hero .section-tag::before,
.page-hero .section-tag::after{
  content:""; width:34px; height:2px; border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--c-blue));
}
.page-hero .section-tag::after{
  background:linear-gradient(90deg,var(--c-blue),transparent);
}
.page-hero .section-tag i{ display:none; }

/* headline: larger, confident */
.page-hero .section-title{
  font-size:clamp(2rem, 3.6vw, 2.9rem);
  font-weight:800; letter-spacing:.2px;
  margin:.9rem 0 .35rem;
}
.page-hero .section-title .underline{
  width:56px; height:4px; margin:.85rem auto 0;
  background:linear-gradient(90deg,var(--c-coral),var(--c-yellow-dark));
}

/* lead: refined muted line */
.page-hero .section-lead{
  color:#5A6994; font-size:1.05rem; margin:.9rem auto .9rem;
}

/* breadcrumb: quiet typographic trail */
.page-hero .crumb{
  background:none; border:0; box-shadow:none; padding:0;
  font-size:.86rem; font-weight:600; color:#8B97BC;
  display:inline-flex; gap:.4rem;
}
.page-hero .crumb a{ color:var(--c-blue-dark); font-weight:700; }
.page-hero .crumb a:hover{ color:var(--c-coral); }

@media (max-width:576px){
  .page-hero{ padding:2.3rem 0 2rem; }
  .page-hero .section-tag{ letter-spacing:1.8px; }
  .page-hero .section-tag::before, .page-hero .section-tag::after{ width:22px; }
}

/* ============================================================
   PAGE-HERO 8.0 — signature navy band (client-facing premium)
   Deep brand-navy header with aurora glows, white display type,
   gold eyebrow. Reads as designed, not default.
   ============================================================ */
.page-hero{
  padding:3.9rem 0 3.4rem;
  background:
    radial-gradient(720px 340px at 88% -30%, rgba(41,182,246,.38) 0%, transparent 60%),
    radial-gradient(560px 300px at 6% 118%,  rgba(139,124,246,.32) 0%, transparent 60%),
    radial-gradient(460px 240px at 50% -40%, rgba(255,202,40,.16) 0%, transparent 65%),
    linear-gradient(140deg,#182B6E 0%, #142257 55%, #101C49 100%);
  border-bottom:0;
}
/* subtle dot texture over navy */
.page-hero::before{
  display:block; content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.07) 1.5px, transparent 1.5px);
  background-size:28px 28px;
  mask-image:linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent);
}
/* rainbow hairline base — slightly stronger against navy */
.page-hero::after{ height:4px; opacity:.85; }

/* eyebrow: gold on navy */
.page-hero .section-tag{
  color:#FFCA28; letter-spacing:3px; font-size:.78rem;
}
.page-hero .section-tag::before{ background:linear-gradient(90deg,transparent,#FFCA28); }
.page-hero .section-tag::after{  background:linear-gradient(90deg,#FFCA28,transparent); }

/* title: white display */
.page-hero .section-title{
  color:#fff; -webkit-text-fill-color:#fff;
  font-size:clamp(2rem, 3.7vw, 3rem);
  text-shadow:0 4px 24px rgba(0,0,0,.25);
}
.page-hero .section-title .underline{
  background:linear-gradient(90deg,#FF6F61,#FFCA28);
  width:64px; height:4px;
}

/* lead: soft light */
.page-hero .section-lead{ color:#C6D3F2; }

/* breadcrumb: frosted glass chip on navy */
.page-hero .crumb{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-radius:999px; padding:.45rem 1.15rem;
  color:#AFC0E8; box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.page-hero .crumb a{ color:#FFD866; }
.page-hero .crumb a:hover{ color:#fff; }

@media (max-width:576px){
  .page-hero{ padding:2.7rem 0 2.4rem; }
}

/* ============================================================
   ENDORSEMENTS — leaders' testimonial cards (About)
   ============================================================ */
.endorse-card{
  background:#fff; border:1px solid var(--pro-border); border-radius:18px;
  padding:1.5rem 1.5rem 1.4rem; margin:0;
  box-shadow:var(--pro-shadow-sm);
  display:flex; flex-direction:column; gap:1rem;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.endorse-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--pro-shadow-lg);
  border-color:#DCE7F8;
}
.endorse-head{ display:flex; align-items:center; gap:1rem; }
.endorse-head img{
  width:72px; height:72px; border-radius:50%; object-fit:cover; object-position:top;
  border:3px solid #fff; box-shadow:0 0 0 2px #FFD9A8, 0 8px 18px rgba(20,35,90,.14);
  flex-shrink:0;
}
.endorse-name{
  font-family:var(--font-head); font-weight:800; font-size:1.02rem;
  color:var(--c-navy); margin:0 0 .15rem; line-height:1.45;
}
.endorse-role{
  font-size:.82rem; font-weight:700; color:var(--c-coral-dark);
  letter-spacing:.2px;
}
.endorse-quote{
  position:relative; margin:0; padding:1.05rem 1.1rem 1rem 1.15rem;
  background:#F8FAFF; border-left:3px solid var(--c-yellow-dark);
  border-radius:0 12px 12px 0;
  font-size:.92rem; line-height:1.95; color:#41507C;
}
.endorse-quote .bi-quote{
  position:absolute; top:.35rem; right:.6rem; font-size:1.6rem;
  color:#DCE7F8; line-height:1;
}
@media (max-width:576px){
  .endorse-card{ padding:1.2rem 1.1rem; }
  .endorse-head img{ width:62px; height:62px; }
}

/* ============================================================
   ENDORSEMENTS v3 — professional profile + testimonial layout
   ============================================================ */
.endorse-card{
  display:grid;
  grid-template-columns:205px minmax(0,1fr);
  gap:0;
  align-items:stretch;
  min-height:340px;
  padding:0;
  overflow:hidden;
  border:1px solid #DCE7F6;
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 36px rgba(20,35,90,.09);
}
.endorse-card:hover{
  transform:translateY(-6px);
  border-color:#C8D9EF;
  box-shadow:0 22px 48px rgba(20,35,90,.15);
}
.endorse-profile{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:1.55rem 1.15rem 1.4rem;
  background:
    radial-gradient(circle at 50% 15%, rgba(41,182,246,.14), transparent 42%),
    linear-gradient(165deg,#F4F9FF 0%,#FFF9EA 100%);
  border-right:1px solid #E4ECF7;
}
.endorse-profile::after{
  content:"";
  position:absolute;
  top:0; left:22%; right:22%;
  height:4px;
  border-radius:0 0 5px 5px;
  background:linear-gradient(90deg,var(--c-blue),var(--c-yellow),var(--c-coral));
}
.endorse-photo-wrap{ position:relative; display:inline-flex; }
.endorse-photo{
  width:132px;
  height:164px;
  object-fit:cover;
  object-position:top center;
  border-radius:18px;
  border:4px solid #fff;
  box-shadow:0 0 0 1px #D7E3F3, 0 14px 28px rgba(20,35,90,.17);
  transition:transform .3s ease, box-shadow .3s ease;
}
.endorse-card:hover .endorse-photo{
  transform:translateY(-3px);
  box-shadow:0 0 0 1px #C8D9EF, 0 18px 34px rgba(20,35,90,.22);
}
.endorse-verified{
  position:absolute;
  right:-8px;
  bottom:-8px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:3px solid #fff;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#29B6F6,#1565C0);
  box-shadow:0 6px 14px rgba(21,101,192,.3);
}
.endorse-identity{ width:100%; margin-top:1.15rem; }
.endorse-name{
  margin:0;
  color:var(--c-navy);
  font-family:var(--font-head);
  font-size:1rem;
  font-weight:800;
  line-height:1.35;
}
.endorse-role{
  margin-top:.45rem;
  color:var(--c-coral-dark);
  font-size:.78rem;
  font-weight:700;
  line-height:1.45;
}
.endorse-testimonial{
  position:relative;
  display:flex;
  align-items:center;
  padding:2rem 1.7rem 1.7rem;
  background:
    radial-gradient(circle at 100% 0%,rgba(255,202,40,.09),transparent 34%),
    #fff;
}
.endorse-quote-mark{
  position:absolute;
  top:1rem;
  left:1.45rem;
  color:#D7E7FA;
  font-size:2.8rem;
  line-height:1;
}
.endorse-quote{
  position:relative;
  z-index:1;
  margin:0;
  padding:2rem 0 0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#41507C;
  font-size:.9rem;
  line-height:1.9;
}
@media (max-width:1199.98px) and (min-width:992px){
  .endorse-card{ grid-template-columns:180px minmax(0,1fr); }
  .endorse-photo{ width:116px; height:148px; }
  .endorse-testimonial{ padding:1.75rem 1.35rem 1.4rem; }
}
@media (max-width:767.98px){
  .endorse-card{ grid-template-columns:1fr; min-height:0; }
  .endorse-profile{ border-right:0; border-bottom:1px solid #E4ECF7; }
  .endorse-photo{ width:112px; height:140px; }
  .endorse-identity{ max-width:320px; }
  .endorse-testimonial{ padding:1.4rem 1.25rem 1.3rem; }
  .endorse-quote-mark{ top:.7rem; left:1rem; font-size:2.35rem; }
  .endorse-quote{ padding-top:1.6rem; line-height:1.75; }
}

/* ============================================================
   PREMIUM 9.0 — Video experience + typography refinement
   (appended last; overrides via cascade. Site rule: no scroll
   animations — only hover/transition polish.)
   ============================================================ */

/* --- Section titles: balanced wrapping (no awkward single-word lines) --- */
.section-title, .page-hero h1{ text-wrap: balance; }
.section-lead{ max-width: 68ch; }

/* --- Video cards: fluid 16:9 media, crisp hover, tidy equal text --- */
.video-thumb{ overflow:hidden; background:#0B1B4A; }
.video-thumb img{
  height:auto; aspect-ratio:16/9; object-fit:cover;
  transition: transform .35s ease;
}
.video-card{ display:flex; flex-direction:column; }
.video-card:hover .video-thumb img{ transform: scale(1.05); }
.video-card .body{ display:flex; flex-direction:column; gap:.15rem; flex:1; }
.video-card h6{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  line-height:1.55; min-height:calc(2 * 1.55em);
}
.video-card .body p{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  color:#5A6B8C;
}

/* --- Episode badge on card thumbnails --- */
.ep-badge{
  position:absolute; top:.7rem; left:.7rem; z-index:2;
  padding:.28rem .7rem; border-radius:999px;
  background:linear-gradient(135deg, var(--c-coral), #FFB300);
  color:#fff; font-weight:800; font-size:.74rem; letter-spacing:.4px;
  box-shadow:0 3px 10px rgba(20,34,87,.28), inset 0 1px 0 rgba(255,255,255,.35);
  border:1.5px solid rgba(255,255,255,.65);
}

/* --- Mini play: keep original transparent overlay; polish the icon circle --- */
.video-thumb .mini-play{
  background:linear-gradient(0deg, rgba(20,35,90,.32), rgba(20,35,90,.08));
  transition:background .25s ease;
}
.video-card:hover .mini-play{
  background:linear-gradient(0deg, rgba(20,35,90,.42), rgba(20,35,90,.12));
}
.video-thumb .mini-play i{
  box-shadow:0 6px 18px rgba(20,34,87,.35);
  transition:transform .25s ease, box-shadow .25s ease;
}
.video-card:hover .mini-play i{
  transform:scale(1.12);
  box-shadow:0 10px 26px rgba(20,34,87,.45);
}

/* --- Featured video frame: quiet gradient ring, lifts on hover --- */
.video-hero-frame{
  border:1px solid var(--pro-border, #E6EDF8);
  transition:box-shadow .3s ease, transform .3s ease;
}
.video-hero-frame:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 60px rgba(20,34,87,.22), 0 0 0 3px rgba(66,133,244,.18);
}
.video-hero-frame .video-play-overlay{ transition:background .3s ease; }
.video-hero-frame:hover .video-play-overlay{
  background:linear-gradient(0deg, rgba(0,0,0,.45), rgba(0,0,0,.12));
}

/* --- Touch devices: no zoom/lift (consistent with site hover:none rule) --- */
@media (hover:none){
  .video-card:hover .video-thumb img{ transform:none; }
  .video-hero-frame:hover{ transform:none; }
}
@media (prefers-reduced-motion: reduce){
  .video-thumb img, .video-hero-frame, .mini-play i{ transition:none !important; }
}

/* ============================================================
   FEATURED FULL-BLEED — featured video spans full page width,
   no side gaps (overrides PREMIUM 9.0 frame styling for this
   variant via cascade)
   ============================================================ */
.featured-full{ overflow-x:clip; }
.video-hero-full{
  width:100%;
  border-radius:0;
  border:0;
  box-shadow:none;
}
.video-hero-full:hover{
  transform:none;
  box-shadow:none;
}
.video-hero-full iframe{
  width:100%; display:block; aspect-ratio:16/9; border:0;
}
/* keep the play button pop as the only hover cue */
.video-hero-full:hover .play-btn-3d{ transform:scale(1.08); }
/* very wide screens: cap height so the video never towers past the fold */
@media (min-width: 1600px){
  .video-hero-full iframe{ aspect-ratio:auto; height:min(56.25vw, 78vh); }
}

/* ============================================================
   HOME 10.0 — video showcase, WhatsApp float, navbar scrolled
   ============================================================ */
/* homepage video cards are links — keep card typography */
.home-video-link{ text-decoration:none; color:inherit; }
.home-video-link .body h6{ color:var(--c-blue-dark, #142257); transition:color .2s ease; }
.home-video-link:hover .body h6{ color:var(--c-blue, #1E88E5); }

/* floating WhatsApp chat button (bottom-left; back-to-top stays right) */
.wa-float{
  position:fixed; left:22px; bottom:22px; z-index:1029;
  width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #25D366, #1EBE5D);
  color:#fff; font-size:1.65rem;
  box-shadow:0 8px 22px rgba(30,190,93,.45), inset 0 1px 0 rgba(255,255,255,.35);
  border:2px solid rgba(255,255,255,.55);
  transition:transform .22s ease, box-shadow .22s ease;
}
.wa-float:hover{
  color:#fff; transform:translateY(-4px) scale(1.06);
  box-shadow:0 12px 30px rgba(30,190,93,.55);
}
@media (max-width: 576px){
  .wa-float{ left:16px; bottom:16px; width:50px; height:50px; font-size:1.5rem; }
}

/* navbar: quiet at top, defined shadow once scrolled */
.main-navbar{ transition:box-shadow .25s ease; }
.main-navbar.is-scrolled{ box-shadow:0 8px 26px rgba(20,34,87,.12); }

@media (prefers-reduced-motion: reduce){
  .wa-float, .main-navbar{ transition:none !important; }
}

/* ============================================================
   RESPONSIVE 3.0 — touch targets, safe areas, tablet tuning
   ============================================================ */

/* --- Comfortable tap targets on touch widths (WCAG 2.5.8) --- */
@media (max-width: 991.98px){
  .lang-btn{
    padding:.5rem .9rem;
    min-height:38px;
    display:inline-flex; align-items:center;
  }
  .top-bar a{
    display:inline-flex; align-items:center;
    padding-block:.5rem;
    min-height:38px;
  }
  .main-navbar .nav-link{ margin-block:2px; }
  /* inline links inside content get breathing room for thumbs */
  .section a.text-navy, .contact-list a{ display:inline-block; padding-block:.25rem; }
}

/* --- iOS/Android safe areas: floating buttons never sit under the home bar --- */
.wa-float{ bottom:calc(22px + env(safe-area-inset-bottom, 0px)); }
.back-to-top{ bottom:calc(24px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 576px){
  .wa-float{ bottom:calc(16px + env(safe-area-inset-bottom, 0px)); }
}

/* --- Long Devanagari words never overflow their boxes --- */
h1,h2,h3,h4,h5,h6,p,.section-title,.section-lead{ overflow-wrap:break-word; }

/* --- Homepage video cards: trim reserved space (title-only body) --- */
.home-video-link .body{ padding:1rem 1.2rem; }

/* --- Tablet (768–991): hero stats breathe evenly --- */
@media (min-width: 768px) and (max-width: 991.98px){
  .hero .stat-item, .hero-stats > div{ margin-right:1.5rem; }
  .section{ padding-block:3.25rem; }
}

/* --- Very large screens (1920+): keep content comfortably readable --- */
@media (min-width: 1920px){
  .container{ max-width:1380px; }
}

/* =========================================================
   GALLERY CARDS 2.0 — photo-free category tiles
   (site photos live ONLY on gallery.php; homepage cards are
   gradient tiles: ghost icon + icon chip + label + count)
   ========================================================= */
.cat-card-flat{ height:200px; }
.cat-card-flat .cat-ghost{
  position:absolute; right:-16px; bottom:-26px;
  font-size:9.5rem; line-height:1; color:rgba(255,255,255,.16);
  transform:rotate(-12deg); transition:transform .35s ease;
  pointer-events:none;
}
.cat-card-flat:hover .cat-ghost{ transform:rotate(-4deg) scale(1.06); }
.cat-card-flat .cat-icon{
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:inset 0 -5px 8px rgba(0,0,0,.08), 0 8px 14px -6px rgba(0,0,0,.28);
}
.cat-card-flat .cat-overlay{
  background:linear-gradient(0deg, rgba(13,21,51,.5) 0%, rgba(13,21,51,.1) 58%, rgba(13,21,51,0) 100%);
}
@media (max-width:575.98px){ .cat-card-flat{ height:170px; } }

/* =========================================================
   SECTION TITLE COLOR LOCK
   (content-section headings always render solid navy — immune
   to stale caches / gradient-text / opacity leftovers.
   Page-hero titles untouched: they live outside .section)
   ========================================================= */
.section .section-title{
  color:var(--c-navy) !important;
  -webkit-text-fill-color:var(--c-navy) !important;
  background-image:none !important;
  opacity:1 !important;
}
.section .section-title span:not(.underline){
  color:var(--c-navy) !important;
  -webkit-text-fill-color:var(--c-navy) !important;
}

/* =========================================================
   RESPONSIVE 4.0 — comfortable mobile tap targets (≤991px)
   (footer quick-links were 22px tall, crumb 26px, contact
   info links 32px — all below the 38px comfortable minimum)
   ========================================================= */
@media (max-width: 991.98px){
  .footer-links a{
    display:inline-flex; align-items:center;
    min-height:38px; padding-block:.1rem;
  }
  .footer-links li{ margin-bottom:.15rem; }
  .crumb a,
  .contact-info-item a{
    display:inline-flex; align-items:center; min-height:38px;
  }
}

/* =========================================================
   PRO SURFACES 5.0 — clean professional background system
   Replaces the candy corner-blob radials with a disciplined
   white / soft-mist rhythm. Brand colour lives in accents
   (rainbow baselines, buttons, category tiles) — not in the
   page canvas. Navy page-hero band untouched.
   ========================================================= */

/* Page canvas: one quiet top mist, then pure white */
body{
  background:linear-gradient(180deg, #F5F8FD 0%, #FAFCFE 240px, #ffffff 520px);
}

/* Homepage hero: single whisper of brand blue, no candy blobs */
.hero{
  background:
    radial-gradient(1100px 540px at 88% -18%, rgba(41,182,246,.09) 0%, transparent 55%),
    linear-gradient(180deg, #F2F7FD 0%, #FAFCFF 65%, #ffffff 100%);
}

/* Alternate bands: flat professional mist with hairline edges */
.section-alt{
  background:#F6F9FD;
  border-top:1px solid #ECF1F9;
  border-bottom:1px solid #ECF1F9;
}
.section-alt::before{ opacity:.12; }

/* Kill the floating orbs/clouds ambience layer (candy leftover;
   also constantly animating = against the static-site rule) */
.bg-scene{ display:none; }

/* =========================================================
   ATTRACTIVE FEEL 6.0 — warmth & energy on the clean base
   (PRO SURFACES stays the foundation: white canvas, no blobs.
   Feel comes from a joyful hero sky, living section bands,
   bolder brand accents — all static, all composed.)
   ========================================================= */

/* Hero: joyful premium sky — sun-warm left, brand-blue right */
.hero{
  background:
    radial-gradient(920px 480px at 90% -14%, rgba(79,195,247,.20) 0%, transparent 58%),
    radial-gradient(700px 400px at -8% 86%,  rgba(255,213,79,.18) 0%, transparent 60%),
    linear-gradient(180deg, #EAF5FE 0%, #F6FAFF 62%, #ffffff 100%);
}
.hero::after{ opacity:.55; }

/* Alternate bands: soft living two-tone instead of flat grey */
.section-alt{
  background:linear-gradient(160deg, #F2F8FE 0%, #F6FBF4 100%);
}
.section-alt::before{ opacity:.2; }

/* Homepage video showcase: its own premium blue-sky moment */
section.section:has(.home-video-link){
  background:
    radial-gradient(820px 420px at 50% -12%, rgba(41,182,246,.12) 0%, transparent 60%),
    linear-gradient(180deg, #F3F9FF 0%, #ffffff 100%);
}

/* Underline bars: bolder tricolor energy */
.section-title .underline, .underline{
  width:76px; height:5px; border-radius:99px;
  background:linear-gradient(90deg, var(--c-coral) 0%, var(--c-yellow-dark) 55%, #29B6F6 100%);
}
.page-hero .section-title .underline{ width:92px; height:5px; }

/* Section tag pills: soft gradient-border personality */
.section-tag{
  background:linear-gradient(#ffffff,#ffffff) padding-box,
             linear-gradient(120deg, #BFE3FF 0%, #FFE3BC 100%) border-box;
  border:1px solid transparent;
  box-shadow:0 2px 8px rgba(20,35,90,.05);
}

/* =========================================================
   SPACING 7.0 — uniform 50px vertical rhythm sitewide
   Every section's top/bottom padding = 50px, at ALL widths
   (this block is last in source, so it wins over the earlier
   desktop/tablet/mobile padding rules). Trailing margins that
   inflate gaps beyond 50px are zeroed.
   ========================================================= */
.section{padding: 50px 0;}
.hero{padding: 50px 0;}
.page-hero{padding: 40px 0 25px;}
.page-hero .about-hero-title{ margin-top:.3rem; }
.page-hero + section{padding-top: 50px !important;}
/* Footer starts immediately after the final section. */
.site-footer{ padding-top:0; margin-top:0; }

/* last element inside a section must not add extra bottom gap */
.section > .container > :last-child,
.section > .container > .row:last-child,
.hero .container > :last-child{ margin-bottom:0 !important; }

/* Video page: featured full-width video sits flush without white bands. */
.page-hero + .featured-full{
  padding-top:0 !important;
  padding-bottom:0 !important;
}