/* Times New Roman font stack used throughout */
/*@import url('https://fonts.googleapis.com/css2?family=Urbanist:wght@400;600;700;900&family=Inter: wght@400;600;700;900&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Urbanist:wght@400;600;700;900&family=Inter:wght@400;600;700;900&display=swap');    

:root  {
    
    --sky: #0ea5e9;
    --sky-dark: #0284c7;
    --sky-deep: #0c4a6e;
    --sky-light: #e0f2fe;
    --sky-glow: rgba(14, 165, 233, 0.25);
  --orange: #f97316;
    --orange-dark: #ea580c;
    --orange-glow: rgba(249, 115, 22, 0.25);
  --bg: #f8fafc;
    --bg2: #f0f9ff;
    --bg3: #e0f2fe;
    
  --card: #ffffff;
    --text: #0f172a;
    --text2: #334155;
    --text3: #64748b;
    --border: #e2e8f0;
    
  --navbar-h: 80px;
    --radius: 18px;
    --radius-sm: 10px;
    
  --shadow: 0 4px 24px rgba(14, 165, 233, .10);
    --shadow-lg: 0 12px 48px rgba(14, 165, 233, .18);
    --shadow-xl: 0 24px 80px rgba(14, 165, 233, .22);
    
  --transition: .38s cubic-bezier(.4, 0, .2, 1);
    
  --font-display:  'Urbanist',  sans-serif;
    
  --font-body:  'Inter',  sans-serif;
    
  --font-accent:  'Urbanist',  sans-serif;
    
}
[data-theme="dark"]  {
    
  --sky: #38bdf8;
    --sky-dark: #0ea5e9;
    --sky-light: #0c2340;
    --sky-glow: rgba(56, 189, 248, .18);
    
  --bg: #050b14;
    --bg2: #0a1220;
    --bg3: #0f1e30;
    --card: #0f1929;
    
  --text: #f1f5f9;
    --text2: #94a3b8;
    --text3: #475569;
    --border: #1e293b;
    
  --shadow: 0 4px 24px rgba(0, 0, 0, .5);
    --shadow-lg: 0 12px 48px rgba(0, 0, 0, .6);
    --shadow-xl: 0 24px 80px rgba(0, 0, 0, .7);
    
}

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-size: 18px;
}

body {
    font-family: var(--font-body);
    background: var(--bg);
    color: black;
    overflow-x: hidden;
    transition: background var(--transition), color var(--transition);
}

 #prj_prev
    {
        Display: none;
    }
    #prj_next
    {
        display: none;
    }

img {
    max-width: 100%;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}

button {
    cursor: pointer;
    border: none;
    font-family: inherit;
    background: none;
}


.container {
    margin: 0 auto;
    padding: 0 180px;
    max-width: 100%;
    box-sizing: border-box;
}

/* Responsive container padding (Desktop 992px+, Tablet 577-991px, Mobile <576px) */
@media (max-width: 1400px) {
    .container {
        padding: 0 80px;
    }
}
@media (max-width: 991px) {
    .container {
        padding: 0 32px;
    }
}
@media (max-width: 575px) {
    .container {
        padding: 0 16px;
    }
    #prj_prev
    {
        display: flex;
        color: #fff !important;
    }
    #prj_next
    {
        display: flex;
        color: #fff !important;
    }
}

* {
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden;
    max-width: 100%;
}

img, video, iframe, svg {
    max-width: 100%;
    height: auto;
}

table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.section-pad {
    padding: 60px 0;
}

.section-pad-sm {
    padding: 4px 0;
}

.text-center {
    text-align: center;
}


.section-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    /* color: var(--orange); */
    background: rgba(249, 115, 22, 1);
    padding: 6px 18px;
    border-radius: 100px;
    border: 1px solid rgba(249, 115, 22,1);
    margin-bottom: 14px;
}

.section-title {
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 3.5vw, 2.9rem);
    font-weight: 700;
    line-height: 1.18;
    color: var(--text);
    margin-bottom: 12px;
}

.section-title em {
    font-style: normal;
    color: var(--sky);
}

.section-desc {
    color: var(--text2);
    max-width: 580px;
    margin: 0 auto 40px;
    font-size: 1rem;
}

.title-line {
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, var(--sky), var(--orange));
    border-radius: 2px;
    margin: 18px 0 36px;
}

.title-line.center {
    margin-left: auto;
    margin-right: auto;
}


/* BUTTONS */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 14px 32px;
    border-radius: 100px;
    font-family: var(--font-body);
    font-size: .93rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: all var(--transition);
    position: relative;
    overflow: hidden;
}

.btn-primary {
    background: linear-gradient(135deg, var(--sky), var(--sky-dark));
    color: #fff;
    box-shadow: 0 6px 28px var(--sky-glow);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px var(--sky-glow);
}

.btn-accent {
    background: linear-gradient(135deg, var(--orange), var(--orange-dark));
    color: #fff;
    box-shadow: 0 6px 28px var(--orange-glow);
}

.btn-accent:hover {
    transform: translateY(-3px);
}

.btn-gold {
    background: linear-gradient(135deg, var(--orange), var(--orange-dark));
    color: #fff;
    box-shadow: 0 6px 28px var(--orange-glow);
}

.btn-gold:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px var(--orange-glow);
}

.btn-outline {
    background: transparent;
    color: var(--sky);
    border: 2px solid var(--sky);
}

.btn-outline:hover {
    background: var(--sky);
    color: #fff;
    transform: translateY(-3px);
}

.btn-glass {
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(12px);
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, .3);
}

.btn-glass:hover {
    background: rgba(255, 255, 255, .22);
    transform: translateY(-3px);
}

.btn-sm {
    padding: 10px 22px;
    font-size: 1rem;
}

.btn-lg {
    padding: 18px 44px;
    font-size: 1.05rem;
}


/* NAVBAR */
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--navbar-h);
    /*background: #fff;*/
    /*backdrop-filter: blur(24px) saturate(180%);*/
    /*border-bottom: 1px solid rgba(14, 165, 233, .1);*/
    /*transition: all var(--transition);*/
}

[data-theme="dark"] .navbar {
    background: rgba(5, 11, 20, .95);
    border-bottom-color: rgba(56, 189, 248, .08);
}

.navbar.scrolled {
    height: 80px;
    box-shadow: 0 4px 32px rgba(14, 165, 233, .12);
    background: #fff;
    backdrop-filter: blur(24px) saturate(180%);
    /*border-bottom: 1px solid rgba(14, 165, 233, .1);*/
}

.scrolled .nav-menu
{
    gap:3px;
}

.scrolled .nav-menu .nav-link
{
    background: none;
    color:black;
}

.navbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    max-width: 80vw;
    margin: 0 auto;
    padding: 0 28px;
}

.logo {
    display: flex;
    align-items: center;
    gap: 13px;
}

.logo-icon {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    background: linear-gradient(135deg, var(--sky), var(--sky-dark) 60%, var(--orange) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 900;
    color: #fff;
    letter-spacing: -1px;
    box-shadow: 0 4px 20px var(--sky-glow);
}

.logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.logo-main {
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text);
}

.logo-sub {
    font-size: .63rem;
    color: var(--orange);
    text-transform: uppercase;
    letter-spacing: .15em;
    font-weight: 700;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 10px;
}

.nav-link {
    padding: 8px 13px;
    border-radius: 9px;
    font-size: 0.8rem;
    font-family:var(--font-display);
    font-weight: 550;
    /* color: #fff; */
    transition: all var(--transition);
    white-space: nowrap;
    background: var(--bg2);
}

.nav-link:hover, .nav-link.active {
    color: #fff;
    background: #F36F34;
}

[data-theme="dark"] .nav-link:hover, [data-theme="dark"] .nav-link.active {
    background: rgba(14, 165, 233, .1);
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.theme-toggle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background:#f24f36;
    /* border: #cb6526; */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition);
    font-size: 1.1rem;
}

.theme-toggle:hover {
    /* background: #f24f36; */
    border-color: var(--sky);
    transform: rotate(20deg) scale(1.1);
}
.theme-icon:hover{
    color: #fff;
}

.hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    width: 44px;
    height: 44px;
    justify-content: center;
    align-items: center;
    background: var(--bg2);
    border: 1.5px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
}

.hamburger span {
    width: 22px;
    height: 2px;
    background: var(--text);
    border-radius: 2px;
    transition: all var(--transition);
}

.hamburger.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.hamburger.open span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.hamburger.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.mobile-menu {
    display: none;
    position: fixed;
    top: var(--navbar-h);
    left: 0;
    right: 0;
    background: var(--bg3);
    border-bottom: 1px solid var(--border);
    padding: 20px 28px;
    flex-direction: column;
    gap: 4px;
    z-index: 999;
    box-shadow: var(--shadow-xl);
    animation: slideDown .32s ease;
}

.mobile-menu.open {
    display: flex;
}

.mobile-menu .nav-link {
    padding: 13px 18px;
    display: block;
    border-radius: 10px;
    font-size: .95rem;
}

@keyframes slideDown {
    from {
    opacity: 0;
    transform: translateY(-10px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/* PAGE BANNER */
.page-banner {
    height: 420px;
    margin-top:80px !important;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    /* margin-top: var(--navbar-h); */
}

.page-banner-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: brightness(.38);
    transform: scale(1.05);
    animation: bannerZoom 14s ease-in-out infinite alternate;
}

@keyframes bannerZoom {
    from {
    transform: scale(1.05);
}
to {
    transform: scale(1.12);
}
}
.page-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(14, 165, 233, .45) 0%, rgba(0, 0, 0, .35) 50%, rgba(249, 115, 22, .2) 100%);
}

.page-banner-content {
    position: relative;
    z-index: 2;
    color: #fff;
}

.page-banner-content h1 {
    font-family: var(--font-display);
    color: #fff;
    margin-bottom: 14px;
    font-size: clamp(2rem, 5vw, 3.5rem);
    text-shadow: 0 4px 24px rgba(0, 0, 0, .4);
}

.breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: .9rem;
    opacity: .88;
}

.breadcrumb a {
    color: #fbbf24;
    transition: color var(--transition);
}

.breadcrumb span {
    color: rgba(255, 255, 255, .5);
}


/* ══════════════════════════════════════
   SHIV JI DIVINE ANIMATION SYSTEM
   ══════════════════════════════════════ */
.divine-canvas {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}


/* Central Om — breathes */
.divine-om {
    
  position: absolute;
    font-family: var(--font-accent);
    
  font-size: clamp(180px, 28vw, 360px);
    font-weight: 900;
    
  color: transparent;
    -webkit-text-stroke: 1.5px rgba(14, 165, 233, .1);
    
  top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
  animation: divineOmBreathe 12s ease-in-out infinite;
    
  user-select: none;
    
  filter: drop-shadow(0 0 60px rgba(14, 165, 233, .07));
    
}
@keyframes divineOmBreathe {
    
  0%, 100% {
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    opacity: .7;
}

  33% {
    transform: translate(-50%, -50%) scale(1.05) rotate(3deg);
    opacity: 1;
}

  66% {
    transform: translate(-50%, -50%) scale(.97) rotate(-2deg);
    opacity: .55;
}

}

/* Trishul — left floats */
.divine-trishul-l {
    
  position: absolute;
    left: -15px;
    top: 12%;
    
  font-size: clamp(100px, 13vw, 200px);
    
  color: transparent;
    -webkit-text-stroke: 1.5px rgba(249, 115, 22, .1);
    
  animation: trishulL 11s ease-in-out infinite;
    
  user-select: none;
    filter: drop-shadow(0 0 30px rgba(249, 115, 22, .05));
    
}
@keyframes trishulL {
    0%, 100% {
    transform: translateY(0) rotate(-4deg);
    opacity: .8;
}
50% {
    transform: translateY(-22px) rotate(4deg);
    opacity: 1;
}
}

/* Trishul — right */
.divine-trishul-r {
    
  position: absolute;
    right: -15px;
    bottom: 8%;
    
  font-size: clamp(80px, 10vw, 160px);
    
  color: transparent;
    -webkit-text-stroke: 1px rgba(249, 115, 22, .08);
    
  animation: trishulL 11s ease-in-out 4s infinite reverse;
    
  user-select: none;
    
}

/* Damru — spins gently top-right */
.divine-damru {
    
  position: absolute;
    top: 4%;
    right: 4%;
    
  font-size: clamp(60px, 8vw, 130px);
    
  color: transparent;
    -webkit-text-stroke: 1px rgba(245, 158, 11, .1);
    
  animation: damruSpin 20s ease-in-out infinite;
    
  user-select: none;
    
}
@keyframes damruSpin {
    0%, 100% {
    transform: rotate(0) scale(1);
}
25% {
    transform: rotate(18deg) scale(1.06);
}
50% {
    transform: rotate(0) scale(1);
}
75% {
    transform: rotate(-18deg) scale(.96);
}
}

/* Lotus — bottom left */
.divine-lotus {
    
  position: absolute;
    bottom: -10px;
    left: 3%;
    
  font-size: clamp(80px, 11vw, 180px);
    
  color: transparent;
    -webkit-text-stroke: 1px rgba(14, 165, 233, .09);
    
  animation: lotusBloom 14s ease-in-out infinite;
    
  user-select: none;
    
}
@keyframes lotusBloom {
    0%, 100% {
    transform: translateY(0) scale(1);
    opacity: .6;
}
50% {
    transform: translateY(-18px) scale(1.07);
    opacity: 1;
}
}

/* Third Eye glow */
.divine-eye {
    
  position: absolute;
    top: 6%;
    left: 50%;
    transform: translateX(-50%);
    
  width: clamp(80px, 12vw, 150px);
    height: clamp(28px, 4vw, 54px);
    
  border-radius: 50%;
    
  background: radial-gradient(ellipse, rgba(249, 115, 22, .18) 0%, transparent 70%);
    
  animation: thirdEye 4s ease-in-out infinite;
    
}
.divine-eye ::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 28%;
    height: 65%;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(249, 115, 22, .35) 0%, transparent 70%);
    animation: pupil 4s ease-in-out infinite;
}

@keyframes thirdEye {
    0%, 100% {
    box-shadow: 0 0 18px rgba(249, 115, 22, .2), 0 0 50px rgba(249, 115, 22, .07);
    opacity: .5;
}
50% {
    box-shadow: 0 0 40px rgba(249, 115, 22, .5), 0 0 120px rgba(249, 115, 22, .15);
    opacity: 1;
}
}
@keyframes pupil {
    0%, 100% {
    transform: translate(-50%, -50%) scale(1);
}
50% {
    transform: translate(-50%, -50%) scale(1.35);
}
}

/* Concentric mandalas / infinity rings */
.divine-ring {
    
  position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
  border-radius: 50%;
    border: 1px solid rgba(14, 165, 233, .05);
    
  animation: ringPulse 18s ease-in-out infinite;
    
}
.divine-ring :nth-child(1) {
    width: clamp(300px, 48vw, 680px);
    height: clamp(300px, 48vw, 680px);
}

.divine-ring:nth-child(2) {
    width: clamp(200px, 32vw, 460px);
    height: clamp(200px, 32vw, 460px);
    border-color: rgba(249, 115, 22, .06);
    animation-delay: -9s;
}

.divine-ring:nth-child(3) {
    width: clamp(120px, 18vw, 260px);
    height: clamp(120px, 18vw, 260px);
    border-color: rgba(245, 158, 11, .06);
    animation-delay: -4s;
}

@keyframes ringPulse {
    0%, 100% {
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
    opacity: .5;
}
50% {
    transform: translate(-50%, -50%) scale(1.06) rotate(8deg);
    opacity: 1;
}
}

/* Sacred particle dots */
.divine-particles {
    
  position: absolute;
    inset: 0;
    
  background-image: 
    radial-gradient(circle, rgba(14, 165, 233, .14) 1px, transparent 1px), 
    radial-gradient(circle, rgba(249, 115, 22, .09) 1px, transparent 1px), 
    radial-gradient(circle, rgba(245, 158, 11, .07) 1px, transparent 1px);
    
  background-size: 65px 65px, 100px 100px, 140px 140px;
    
  background-position: 0 0, 32px 32px, 55px 80px;
    
  animation: particleDrift 35s linear infinite;
    
}
@keyframes particleDrift {
    from {
    background-position: 0 0, 32px 32px, 55px 80px;
}
to {
    background-position: 65px 65px, 132px 132px, 195px 220px;
}
}

/* Mantra ribbon */
.divine-mantra {
    
  position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    
  white-space: nowrap;
    font-family: var(--font-accent);
    
  font-size: clamp(10px, 1.1vw, 14px);
    letter-spacing: .38em;
    
  color: rgba(14, 165, 233, .2);
    animation: mantraFade 9s ease-in-out infinite;
    
  user-select: none;
    
}
@keyframes mantraFade {
    0%, 100% {
    opacity: .3;
    transform: translateX(-50%) translateY(0);
}
50% {
    opacity: .8;
    transform: translateX(-50%) translateY(-6px);
}
}

/* ══════════════════════════════════════
   HERO
   ══════════════════════════════════════ */
.hero {
    position: relative;
    height: 100vh;
    min-height: 700px;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-top:6px;
    /* margin-top: var(--navbar-h); */
}

.hero-slides {
    position: absolute;
    inset: 0;
}

.hero-slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1.4s ease;
}

.hero-slide.active {
    opacity: 1;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    /* background: linear-gradient(120deg, rgba(5, 11, 20, .78) 0%, rgba(14, 165, 233, .15) 60%, rgba(249, 115, 22, .12) 100%); */
    background: linear-gradient(120deg, rgb(5 11 20 / 95%) 0%, rgba(14, 165, 233, .10) 60%, rgba(249, 115, 22, .08) 100%);
}

.hero-divine {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 740px;
    animation: heroIn 1.2s ease forwards;
}

@keyframes heroIn {
    from {
    opacity: 0;
    transform: translateY(50px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}
.hero-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(249, 115, 22, .18);
    border: 1px solid rgba(249, 115, 22, .45);
    color: #fca35c;
    padding: 7px 20px;
    border-radius: 100px;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 26px;
    backdrop-filter: blur(10px);
    animation: heroIn 1s ease .2s both;
}

.hero h1 {
    font-family: var(--font-display);
    color: #fff;
    margin-bottom: 22px;
    text-shadow: 0 4px 32px rgba(0, 0, 0, .4);
    font-size: clamp(2.2rem, 5vw, 3rem);
    animation: heroIn 1s ease .4s both;
}

.hero h1 span {
    color: var(--sky);
}

.hero h1 strong {
    color: #fbbf24;
    font-weight: 900;
}

.hero p {
    color: rgba(255, 255, 255, .84);
    font-size: 1.1rem;
    margin-bottom: 38px;
    max-width: 560px;
    line-height: 1.8;
    animation: heroIn 1s ease .6s both;
}

.hero-btns {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    animation: heroIn 1s ease .8s both;
}

.hero-dots {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.hero-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .35);
    cursor: pointer;
    transition: all var(--transition);
    border: 2px solid transparent;
}

.hero-dot.active {
    background: var(--orange);
    border-color: #fff;
    transform: scale(1.3);
    width: 28px;
    border-radius: 5px;
}

.hero-scroll {
    position: absolute;
    bottom: 36px;
    right: 48px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .55);
    font-size: .7rem;
    letter-spacing: .15em;
}

.scroll-line {
    width: 2px;
    height: 54px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, .6), transparent);
    animation: scrollPulse 2.2s infinite;
}

@keyframes scrollPulse {
    0%, 100% {
    opacity: 1;
}
50% {
    opacity: .25;
}
}

/* ABOUT */
.about-section {
    position: relative;
    overflow: hidden;
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 72px;
    align-items: center;
}

.about-images {
    position: relative;
    padding: 28px 28px 52px;
}

.about-img-main {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: var(--radius);
    box-shadow: var(--shadow-xl);
}

.about-img-accent {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 180px;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: var(--radius-sm);
    border: 5px solid var(--card);
    box-shadow: var(--shadow-lg);
}

.about-badge {
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(135deg, var(--sky), var(--sky-dark));
    color: #fff;
    padding: 18px 22px;
    border-radius: var(--radius-sm);
    text-align: center;
    box-shadow: var(--shadow-lg);
    z-index: 2;
}

.about-badge .num {
    font-family: var(--font-display);
    font-size: 2.4rem;
    font-weight: 900;
    display: block;
    line-height: 1;
}

.about-badge .lbl {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    opacity: .9;
    margin-top: 4px;
}

.about-content {
    padding-left: 12px;
    position: relative;
    background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.7)), url('../images/shiv.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    border-radius: 16px;
    padding: 32px 28px;
}

.about-feats {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 28px 0 36px;
}

.about-feat {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px 20px;
    border-radius: var(--radius-sm);
    background: var(--bg2);
    border: 1.5px solid var(--border);
    transition: all var(--transition);
}

.about-feat:hover {
    border-color: var(--sky);
    transform: translateX(6px);
    background: var(--sky-light);
    box-shadow: var(--shadow);
}

[data-theme="dark"] .about-feat:hover {
    background: rgba(14, 165, 233, .08);
}

.about-feat-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--sky), var(--sky-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #fff;
}

.about-feat h4 {
    font-family: var(--font-body);
    font-size: .95rem;
    font-weight: 700;
    margin-bottom: 3px;
}

.about-feat p {
    font-size: .84rem;
    margin: 0;
}


/* STATS */
.stats-section {
    background: linear-gradient(135deg, #0c3b6e, #0c4a6e 50%, #0e3460 100%);
    position: relative;
    overflow: hidden;
}

.stats-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml, %3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Ccircle cx='40' cy='40' r='30'/%3E%3Ccircle cx='40' cy='40' r='20'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    position: relative;
    z-index: 1;
}

.stat-card {
    text-align: center;
    padding: 52px 24px;
    border-right: 1px solid rgba(255, 255, 255, .07);
    transition: all var(--transition);
}

.stat-card:last-child {
    border-right: none;
}

.stat-card:hover {
    background: rgba(255, 255, 255, .04);
}

.stat-icon {
    font-size: 2.2rem;
    margin-bottom: 16px;
    opacity: .5;
}

.stat-num {
    font-family: var(--font-display);
    font-size: clamp(2.4rem, 4vw, 3.8rem);
    font-weight: 900;
    color: #fff;
    line-height: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
}

.stat-num .suffix {
    font-size: 2rem;
    color: var(--orange);
    margin-top: 6px;
}

.stat-label {
    color: rgba(255, 255, 255, .65);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    margin-top: 10px;
}


/* PROJECTS */
.projects-filter {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-bottom: 44px;
    flex-wrap: wrap;
}

.filter-btn {
    padding: 9px 22px;
    border-radius: 100px;
    font-size: .85rem;
    font-weight: 500;
    cursor: pointer;
    border: 2px solid var(--border);
    background: var(--card);
    color: var(--text2);
    transition: all var(--transition);
}

.filter-btn.active, .filter-btn:hover {
    border-color: var(--sky);
    background: var(--sky);
    color: #fff;
}

.projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.project-card {
    background: var(--card);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: all var(--transition);
    border: 1.5px solid var(--border);
}

.project-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-xl);
    border-color: rgba(14, 165, 233, .3);
}

.project-img-wrap {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
}

.project-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s ease;
}

.project-card:hover .project-img-wrap img {
    transform: scale(1.1);
}

.project-tag {
    position: absolute;
    top: 14px;
    left: 14px;
    background: linear-gradient(135deg, var(--orange), var(--orange-dark));
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 5px 13px;
    border-radius: 100px;
    box-shadow: 0 2px 12px rgba(249, 115, 22, .4);
}

.project-status {
    position: absolute;
    top: 14px;
    right: 14px;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 5px 13px;
    border-radius: 100px;
}

.status-ongoing {
    background: rgba(34, 197, 94, .9);
    color: #fff;
}

.status-upcoming {
    background: rgba(249, 115, 22, .9);
    color: #fff;
}

.status-ready {
    background: rgba(14, 165, 233, .9);
    color: #fff;
}

.project-body {
    padding: 26px;
}

.project-body h3 {
    font-family: var(--font-display);
    font-size: 1.1rem;
    margin-bottom: 6px;
}

.project-location {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--text3);
    font-size: .82rem;
    margin-bottom: 10px;
}

.project-body p {
    font-size: .87rem;
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


.project-location p {
    margin-bottom: 0px !important;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical;
}

.vtm-media-box { width: 100%; aspect-ratio: 16/9; display: block; }

.project-meta {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
    padding: 14px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.project-meta-item {
    display: flex;
    flex-direction: column;
}

.project-meta-item .val {
    font-size: .9rem;
    font-weight: 700;
    color: var(--sky);
}

.project-meta-item .key {
    font-size: .7rem;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: .06em;
}


/* TESTIMONIALS */
.testimonials-section {
    background: var(--bg2);
    /* position: relative; */
    overflow: hidden;
}

.testimonial-slider {
    /* position: relative; */
    overflow: hidden;
}

.testimonial-track {
    display: flex;
    transition: transform .7s cubic-bezier(.4, 0, .2, 1);
}

.testimonial-card {
    min-width: 100%;
    padding: 16px;
}

.testimonial-inner {
    /* max-width: 780px; */
    margin: 0 auto;
    background: var(--card);
    border-radius: var(--radius);
    padding: 52px 60px;
    box-shadow: var(--shadow-xl);
    border: 1.5px solid var(--border);
    /* position: relative; */
}

.testimonial-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--sky), var(--orange));
    border-radius: var(--radius) var(--radius) 0 0;
}

.quote-mark {
    font-family: var(--font-accent);
    font-size: 7rem;
    line-height: .8;
    color: var(--sky);
    opacity: .12;
    position: absolute;
    top: 36px;
    right: 48px;
}

.testimonial-text {
    font-family: var(--font-accent);
    font-size: 1.2rem;
    color: var(--text);
    margin-bottom: 32px;
    font-style: italic;
    line-height: 1.85;
    position: relative;
    z-index: 1;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 18px;
}

.testimonial-avatar {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--sky);
    box-shadow: 0 4px 16px var(--sky-glow);
}

.testimonial-author-info .name {
    font-weight: 700;
    font-size: 1rem;
}

.testimonial-author-info .role {
    font-size: .82rem;
    color: var(--text3);
}

.stars {
    color: #f59e0b;
    font-size: .9rem;
    margin-top: 3px;
    letter-spacing: 2px;
}

.slider-nav {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 36px;
    align-items: center;
}

.slider-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--card);
    border: 2px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.1rem;
    color: var(--text2);
    transition: all var(--transition);
}

.slider-btn:hover {
    background: var(--sky);
    border-color: var(--sky);
    color: #fff;
    transform: scale(1.1);
}

.testi-dots {
    display: flex;
    gap: 8px;
}

.testi-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--border);
    cursor: pointer;
    transition: all var(--transition);
}

.testi-dot.active {
    background: var(--sky);
    width: 24px;
    border-radius: 4px;
}


/* ══════════════════════════════════════
   GALLERY — ULTRA PREMIUM
   ══════════════════════════════════════ */
.gallery-section {
    background: var(--bg);
    position: relative;
    overflow: hidden;
}


.gallery-masonry {
    
  display: grid;
    
  grid-template-columns: repeat(4, 1fr);
    
  grid-auto-rows: 220px;
    
  gap: 14px;
    
}
.gallery-item {
    border-radius: var(--radius-sm);
    overflow: hidden;
    cursor: pointer;
    position: relative;
    background: var(--bg2);
    transition: all var(--transition);
}

.gallery-item:hover {
    transform: scale(1.02);
    box-shadow: var(--shadow-xl);
    z-index: 2;
}

.gallery-item.tall {
    grid-row: span 2;
}

.gallery-item.wide {
    grid-column: span 2;
}

.gallery-item.large {
    grid-column: span 2;
    grid-row: span 2;
}

.gallery-item img, .gallery-item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .65s ease;
    display: block;
}

.gallery-item:hover img, .gallery-item:hover video {
    transform: scale(1.08);
}

.gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(14, 165, 233, .75), rgba(249, 115, 22, .55));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    opacity: 0;
    transition: opacity var(--transition);
}

.gallery-item:hover .gallery-overlay {
    opacity: 1;
}

.gallery-overlay-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    backdrop-filter: blur(8px);
    border: 2px solid rgba(255, 255, 255, .35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #fff;
    transform: scale(.8);
    transition: transform var(--transition);
}

.gallery-item:hover .gallery-overlay-icon {
    transform: scale(1);
}

.gallery-overlay-label {
    font-size: .75rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .9);
    letter-spacing: .1em;
    text-transform: uppercase;
}

.video-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: rgba(0, 0, 0, .65);
    backdrop-filter: blur(8px);
    color: #fff;
    padding: 4px 12px;
    border-radius: 100px;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .08em;
    display: flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgba(255, 255, 255, .2);
    z-index: 2;
}

.video-play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(249, 115, 22, .85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.3rem;
    border: 3px solid rgba(255, 255, 255, .3);
    transition: all var(--transition);
    z-index: 1;
}

.gallery-item:hover .video-play-icon {
    transform: translate(-50%, -50%) scale(1.15);
}

.gallery-cat-label {
    position: absolute;
    bottom: 12px;
    left: 12px;
    background: rgba(0, 0, 0, .55);
    backdrop-filter: blur(8px);
    color: rgba(255, 255, 255, .9);
    padding: 4px 10px;
    border-radius: 100px;
    font-size: .68rem;
    font-weight: 600;
    z-index: 2;
    opacity: 0;
    transition: opacity var(--transition);
}

.gallery-item:hover .gallery-cat-label {
    opacity: 1;
}


/* Admin panel */
.admin-toggle {
    position: fixed;
    bottom: 108px;
    right: 26px;
    z-index: 900;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--orange), var(--orange-dark));
    color: #fff;
    font-size: 1.3rem;
    box-shadow: 0 6px 24px rgba(249, 115, 22, .45);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition);
}

.admin-toggle:hover {
    transform: scale(1.12) rotate(18deg);
}

.admin-panel {
    position: fixed;
    right: 26px;
    bottom: 180px;
    z-index: 899;
    background: var(--card);
    border: 1.5px solid var(--border);
    border-radius: var(--radius);
    padding: 28px;
    width: 320px;
    box-shadow: var(--shadow-xl);
    display: none;
    flex-direction: column;
    gap: 14px;
}

.admin-panel.open {
    display: flex;
}

.admin-panel h4 {
    font-family: var(--font-display);
    font-size: 1rem;
    margin-bottom: 4px;
}

.admin-panel p {
    font-size: .82rem;
    color: var(--text3);
}

.admin-panel input[type="file"], .admin-panel input[type="text"] {
    width: 100%;
    padding: 11px 14px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--border);
    background: var(--bg2);
    color: var(--text);
    font-family: var(--font-body);
    font-size: .88rem;
    transition: border-color var(--transition);
}

.admin-panel input:focus {
    outline: none;
    border-color: var(--sky);
}


/* SERVICES */
.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.service-card {
    background: var(--card);
    border-radius: var(--radius);
    padding: 40px 32px;
    border: 1.5px solid var(--border);
    transition: all var(--transition);
    position: relative;
    overflow: hidden;
}

.service-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--sky), var(--orange));
    transform: scaleX(0);
    transition: transform var(--transition);
    transform-origin: left;
}

.service-card:hover::after {
    transform: scaleX(1);
}

.service-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: rgba(14, 165, 233, .3);
}

.service-icon {
    width: 66px;
    height: 66px;
    border-radius: 18px;
    margin-bottom: 22px;
    background: var(--sky-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    transition: all var(--transition);
}

[data-theme="dark"] .service-icon {
    background: rgba(14, 165, 233, .1);
}

.service-card:hover .service-icon {
    background: linear-gradient(135deg, var(--sky), var(--orange));
    transform: scale(1.08) rotate(-4deg);
}

.service-card h3 {
    font-family: var(--font-display);
    font-size: 1.05rem;
    margin-bottom: 12px;
}

.service-card>p {
    font-size: .88rem;
    margin-bottom: 18px;
}

.service-card ul {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.service-card ul li {
    font-size: .84rem;
    color: var(--text2);
    display: flex;
    align-items: center;
    gap: 8px;
}

.service-card ul li::before {
    content: '✓';
    color: var(--sky);
    font-weight: 700;
}


/* FAQ */
.faq-section {
    background: var(--bg2);
    position: relative;
    overflow: hidden;
}

.faq-list {
    /* max-width: 820px; */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.faq-item {
    background: var(--card);
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--border);
    overflow: hidden;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.faq-item.open {
    border-color: rgba(14, 165, 233, .35);
    box-shadow: var(--shadow);
}

.faq-q {
    padding: 22px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-weight: 600;
    font-size: .97rem;
    transition: color var(--transition);
    gap: 16px;
}

.faq-q:hover {
    color: var(--sky);
}

.faq-icon {
    color: var(--sky);
    font-size: 1.4rem;
    transition: transform var(--transition);
    flex-shrink: 0;
    line-height: 1;
}

.faq-item.open .faq-icon {
    transform: rotate(45deg);
}

.faq-a {
    padding: 0 28px;
    max-height: 0;
    overflow: hidden;
    transition: all .42s ease;
}

.faq-item.open .faq-a {
    padding: 0 28px 22px;
    max-height: 250px;
}

.faq-a p {
    font-size: .9rem;
}


/* BLOG */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.blog-card {
    background: var(--card);
    border-radius: var(--radius);
    overflow: hidden;
    border: 1.5px solid var(--border);
    transition: all var(--transition);
}

.blog-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: rgba(14, 165, 233, .25);
}

.blog-img-wrap {
    overflow: hidden;
    aspect-ratio: 16/9;
}

.blog-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
    display: block;
}

.blog-card:hover .blog-img {
    transform: scale(1.06);
}

.blog-body {
    padding: 26px;
}

.blog-meta {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 13px;
    flex-wrap: wrap;
}

.blog-date {
    font-size: .78rem;
    color: var(--text3);
}

.blog-author {
    font-size: .78rem;
    color: var(--sky);
    font-weight: 600;
}

.blog-cat {
    font-size: .7rem;
    background: var(--sky-light);
    color: var(--sky-dark);
    padding: 3px 11px;
    border-radius: 100px;
    font-weight: 700;
    text-transform: uppercase;
}

[data-theme="dark"] .blog-cat {
    background: rgba(14, 165, 233, .12);
    color: var(--sky);
}

.blog-body h3 {
    font-family: var(--font-display);
    font-size: 1.05rem;
    margin-bottom: 11px;
    transition: color var(--transition);
    line-height: 1.4;
}

.blog-card:hover h3 {
    color: var(--sky);
}

.blog-body p {
    font-size: .87rem;
    margin-bottom: 18px;
}

.blog-link {
    font-size: .88rem;
    font-weight: 600;
    color: var(--sky);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap var(--transition);
}

.blog-link:hover {
    gap: 10px;
}


/* CONTACT */
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 52px;
    align-items: start;
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-card {
    background: var(--card);
    border-radius: var(--radius-sm);
    padding: 28px;
    border: 1.5px solid var(--border);
    display: flex;
    align-items: flex-start;
    gap: 18px;
    transition: all var(--transition);
}

.contact-card:hover {
    border-color: rgba(14, 165, 233, .35);
    box-shadow: var(--shadow);
    transform: translateX(4px);
}

.contact-card-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--sky), var(--sky-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: #fff;
}

.contact-card h4 {
    font-family: var(--font-body);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--text3);
    margin-bottom: 6px;
}

.contact-card p {
    font-size: .95rem;
    color: var(--text);
    margin: 0;
    line-height: 1.6;
}

.contact-form-wrap {
    background: var(--card);
    border-radius: var(--radius);
    padding: 15px;
    border: 1.5px solid var(--border);
    box-shadow: var(--shadow-lg);
}

.contact-form-wrap h3 {
    font-family: var(--font-display);
    margin-bottom: 30px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-bottom: 20px;
}

.form-group label {
    font-size: .84rem;
    font-weight: 600;
    color: var(--text2);
}

.form-group input, .form-group textarea, .form-group select {
    padding: 14px 18px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--border);
    background: var(--bg);
    color: var(--text);
    font-family: var(--font-body);
    font-size: .92rem;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.form-group input:focus, .form-group textarea:focus, .form-group select:focus {
    outline: none;
    border-color: var(--sky);
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .1);
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.form-group textarea {
    min-height: 130px;
    resize: vertical;
}


/* MAP */
.map-wrap {
    border-radius: var(--radius);
    overflow: hidden;
    border: 1.5px solid var(--border);
    box-shadow: var(--shadow-lg);
    margin-top: 28px;
}

.map-wrap iframe {
    width: 100%;
    height: 380px;
    border: none;
    display: block;
}


/* EVENTS */
.events-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.event-card {
    background: var(--card);
    border-radius: var(--radius);
    overflow: hidden;
    border: 1.5px solid var(--border);
    transition: all var(--transition);
}

.event-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: rgba(14, 165, 233, .3);
}

.event-img-wrap {
    overflow: hidden;
    aspect-ratio: 16/9;
    position: relative;
}

.event-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
    display: block;
}

.event-card:hover .event-img {
    transform: scale(1.07);
}

.event-date-pill {
    position: absolute;
    top: 16px;
    left: 16px;
    background: linear-gradient(135deg, var(--orange), var(--orange-dark));
    color: #fff;
    border-radius: 12px;
    padding: 10px 14px;
    text-align: center;
    box-shadow: 0 4px 16px rgba(249, 115, 22, .4);
}

.event-date-pill .day {
    display: block;
    font-family: var(--font-display);
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
}

.event-date-pill .month {
    display: block;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.event-body {
    padding: 26px;
}

.event-body h3 {
    font-family: var(--font-display);
    font-size: 1.05rem;
    margin-bottom: 10px;
}

.event-meta {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.event-meta-item {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: .83rem;
    color: var(--text3);
}


/* WHATSAPP */
.whatsapp-btn {
    position: fixed;
    left: 24px;
    bottom: 28px;
    z-index: 900;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: #25d366;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    box-shadow: 0 6px 28px rgba(37, 211, 102, .5);
    transition: all var(--transition);
    cursor: pointer;
    text-decoration: none;
    animation: waPulse 2.5s infinite;
}

.whatsapp-btn:hover {
    transform: scale(1.15);
}

@keyframes waPulse {
    0%, 100% {
    box-shadow: 0 6px 28px rgba(37, 211, 102, .5);
}
50% {
    box-shadow: 0 6px 28px rgba(37, 211, 102, .5), 0 0 0 12px rgba(37, 211, 102, .08);
}
}

/* FOOTER */
footer {
    background: #ffffff;
    color: #334155;
    border-top: 2px solid var(--sky);
}

.footer-top {
    padding: 88px 0 56px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.3fr;
    gap: 52px;
}

.footer-about .logo-main {
    color: #0f172a;
}

.footer-about p {
    font-size: .88rem;
    margin: 18px 0 26px;
    color: #334155;
    line-height: 1.8;
}

.footer-socials {
    display: flex;
    gap: 10px;
}

.social-btn {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: #0d1929;
    color: #475569;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    transition: all var(--transition);
    cursor: pointer;
    border: 1px solid #1e293b;
}

.social-btn:hover {
    background: var(--sky);
    color: #fff;
    border-color: var(--sky);
    transform: translateY(-3px);
}

.footer-col h4 {
    color: #0f172a;
    font-size: .9rem;
    font-family: var(--font-body);
    font-weight: 700;
    margin-bottom: 22px;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.footer-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer-links a {
    font-size: .86rem;
    color: #334155;
    transition: all var(--transition);
    display: flex;
    align-items: center;
    gap: 7px;
}

.footer-links a::before {
    content: '›';
    color: var(--orange);
    font-size: 1.1rem;
}

.footer-links a:hover {
    color: var(--sky);
    transform: translateX(4px);
}

.footer-contact-item {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.footer-contact-icon {
    color: var(--sky);
    font-size: 1rem;
    margin-top: 3px;
    flex-shrink: 0;
}

.footer-contact-item p {
    font-size: .86rem;
    color: #334155;
    margin: 0;
    line-height: 1.7;
}

.footer-bottom {
    border-top: 1px solid #e2e8f0;
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .82rem;
    color: #334155;
}

.footer-bottom-links {
    display: flex;
    gap: 22px;
}

.footer-bottom-links a:hover {
    color: var(--sky);
}


/* LIGHTBOX */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(2, 6, 14, .97);
    backdrop-filter: blur(20px);
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
}

.lightbox.open {
    display: flex;
    animation: lbIn .35s ease;
}

@keyframes lbIn {
    from {
    opacity: 0;
}
to {
    opacity: 1;
}
}
.lightbox-close {
    position: absolute;
    top: 24px;
    right: 24px;
    cursor: pointer;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.3rem;
    transition: all var(--transition);
}

.lightbox-close:hover {
    background: var(--orange);
    border-color: var(--orange);
}

.lightbox-img {
    max-width: 90vw;
    max-height: 82vh;
    border-radius: var(--radius-sm);
    object-fit: contain;
}

.lightbox video {
    max-width: 90vw;
    max-height: 80vh;
    border-radius: var(--radius-sm);
}

.lightbox-vid {
    max-width: 90vw;
    max-height: 80vh;
    border-radius: var(--radius-sm);
}


/* TIMELINE */
.timeline {
    position: relative;
    max-width: 820px;
    margin: 0 auto;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, var(--sky), var(--orange));
    transform: translateX(-50%);
}

.timeline-item {
    display: flex;
    justify-content: flex-end;
    padding-right: calc(50% + 36px);
    margin-bottom: 44px;
    position: relative;
}

.timeline-item:nth-child(even) {
    justify-content: flex-start;
    padding-right: 0;
    padding-left: calc(50% + 36px);
}

.timeline-dot {
    position: absolute;
    left: 50%;
    top: 22px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--sky), var(--orange));
    border: 3px solid var(--bg);
    transform: translateX(-50%);
    z-index: 1;
    box-shadow: 0 0 0 5px rgba(14, 165, 233, .15);
}

.timeline-content {
    background: var(--card);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 22px 26px;
    max-width: 340px;
    transition: all var(--transition);
}

.timeline-content:hover {
    border-color: rgba(14, 165, 233, .35);
    box-shadow: var(--shadow);
}

.timeline-year {
    font-size: .75rem;
    font-weight: 700;
    color: var(--orange);
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-bottom: 6px;
}

.timeline-content h4 {
    font-family: var(--font-body);
    font-size: .96rem;
    font-weight: 700;
    margin-bottom: 7px;
}

.timeline-content p {
    font-size: .84rem;
}


/* AMENITIES */
.amenity-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
    gap: 12px;
}

.amenity-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    background: var(--bg2);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 18px 12px;
    text-align: center;
    font-size: .83rem;
    color: var(--text2);
    transition: all var(--transition);
}

.amenity-item:hover {
    border-color: var(--sky);
    color: var(--sky);
    background: var(--sky-light);
    transform: translateY(-3px);
}

[data-theme="dark"] .amenity-item:hover {
    background: rgba(14, 165, 233, .08);
}

.amenity-item span {
    font-size: 1.9rem;
}


/* FLOOR TABS */
.floor-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 26px;
    flex-wrap: wrap;
}

.floor-tab {
    padding: 9px 22px;
    border-radius: 100px;
    font-size: .85rem;
    font-weight: 500;
    cursor: pointer;
    border: 2px solid var(--border);
    background: var(--card);
    color: var(--text2);
    transition: all var(--transition);
}

.floor-tab.active {
    border-color: var(--sky);
    background: var(--sky);
    color: #fff;
}


/* REVEAL ANIMATIONS */
.reveal {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity .75s ease, transform .75s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-36px);
    transition: opacity .75s ease, transform .75s ease;
}

.reveal-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.reveal-right {
    opacity: 0;
    transform: translateX(36px);
    transition: opacity .75s ease, transform .75s ease;
}

.reveal-right.visible {
    opacity: 1;
    transform: translateX(0);
}

.d1 {
    transition-delay: .08s;
}
.d2 {
    transition-delay: .18s;
}
.d3 {
    transition-delay: .28s;
}
.d4 {
    transition-delay: .38s;
}
.d5 {
    transition-delay: .48s;
}


/* CTA BAND */
.cta-band {
    background: linear-gradient(135deg, var(--sky-deep), #0c3b6e 50%, #091428 100%);
    padding: 88px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}


/* OM OVERLAY */
.om-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 380px;
    font-weight: 900;
    opacity: .015;
    color: var(--sky);
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
}

.spiritual-bg {
    position: absolute;
    pointer-events: none;
    opacity: .04;
    user-select: none;
}

.damroo-pattern {
    font-size: 120px;
    animation: floatSlow 8s ease-in-out infinite;
}

.trishul-pattern {
    font-size: 90px;
    animation: floatSlow 10s ease-in-out infinite reverse;
}

@keyframes floatSlow {
    0%, 100% {
    transform: translateY(0) rotate(0deg);
}
50% {
    transform: translateY(-18px) rotate(5deg);
}
}

/* RESPONSIVE */
@media(max-width:1200px) {
    .projects-grid {
    grid-template-columns: repeat(2, 1fr);
}
.services-grid {
    grid-template-columns: repeat(2, 1fr);
}
.stats-grid {
    grid-template-columns: repeat(3, 1fr);
}
.gallery-masonry {
    grid-template-columns: repeat(3, 1fr);
}
}
@media(max-width:991px) {
    .nav-menu, .nav-actions .btn:not(.theme-toggle) {
    display: none;
}
.hamburger {
    display: flex;
}
.hero h1 {
    font-size: 2.4rem;
}
}
@media(max-width:1024px) {
    .about-grid {
    grid-template-columns: 1fr;
    gap: 52px;
}
.about-images {
    max-width: 520px;
    margin: 0 auto;
}
.about-content {
    /* padding-left: 0; */
}
.footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
}
.contact-grid {
    grid-template-columns: 1fr;
}
.events-grid {
    grid-template-columns: 1fr 1fr;
}
.blog-grid {
    grid-template-columns: 1fr 1fr;
}
}
@media(max-width:768px) {
    :root {
    --navbar-h: 72px;
}
.nav-menu, .nav-actions .btn:not(.theme-toggle) {
    display: none;
}
.hamburger {
    display: flex;
}
.hero h1 {
    font-size: 2rem;
}
.projects-grid {
    grid-template-columns: 1fr;
}
.services-grid {
    grid-template-columns: 1fr;
}
.stats-grid {
    grid-template-columns: repeat(2, 1fr);
}
.stat-card {
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}
.gallery-masonry {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 180px;
}
.gallery-item.large {
    grid-column: span 1;
    grid-row: span 1;
}
.gallery-item.wide {
    grid-column: span 1;
}
.footer-grid {
    grid-template-columns: 1fr;
}
.footer-bottom {
    flex-direction: column;
    gap: 14px;
    text-align: center;
}
.form-grid {
    grid-template-columns: 1fr;
}
.timeline::before {
    left: 20px;
}
.timeline-item, .timeline-item:nth-child(even) {
    padding-left: 56px;
    padding-right: 0;
    justify-content: flex-start;
}
.timeline-dot {
    left: 20px;
}
.hero-scroll {
    display: none;
}
.blog-grid {
    grid-template-columns: 1fr;
}
.events-grid {
    grid-template-columns: 1fr;
}
.testimonial-inner {
    padding: 36px 28px;
}
.contact-form-wrap {
    padding: 28px;
}
.divine-om {
    font-size: 140px!important;
}
.divine-trishul-l, .divine-trishul-r {
    font-size: 80px!important;
}
}
@media(max-width:480px) {
    .gallery-masonry {
    grid-template-columns: 1fr;
    grid-auto-rows: 200px;
}
.gallery-item.tall {
    grid-row: span 1;
}
.stats-grid {
    grid-template-columns: 1fr 1fr;
}
.section-pad {
    padding: 60px 0;
}
.hero-btns {
    flex-direction: column;
}
}


/* ===== TIMES NEW ROMAN GLOBAL OVERRIDE ===== */
/* *,  *::before,  *::after  {
    
  font-family:  'Times New Roman',  Times,  serif !important;
    
}
h1, h2, h3, h4, h5, h6, p, a, span, div, li, td, th, button, input, textarea, select, label  {
    
  font-family:  'Times New Roman',  Times,  serif !important;
    
}
 */


/* DIRECTOR SPOTLIGHT RESPONSIVE */
@media(max-width: 900px) {
    
  .director-grid {
    grid-template-columns: 1fr !important;
}

}
@media(max-width:768px) {
    
  .flip-card {
    height: 320px;
}

}

/* ===== STATS SHATKONA BG ===== */
.stats-shatkona-bg  {
    
  position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    
  pointer-events: none;
    z-index: 0;
    
}


/* ══════════════════════════════════════════════════════
   BRAND COLOR STRICT OVERRIDES — Blue / White / Orange
   ══════════════════════════════════════════════════════ */

/* Remove any green,  purple,  pink,  yellow colors site-wide */
:root  {
  
  --green:  var(--sky);
    
  --purple:  var(--sky);
    
  --pink:  var(--orange);
    
  --yellow:  var(--orange);
    
}

/* Footer white full override */
footer,  footer *  {
     color-scheme:  light;
 }

footer  {
     background:  #ffffff !important;
     color:  #334155 !important;
 }

.footer-top  {
     background:  #0973ba !important;
 }

[data-theme="dark"] footer  {
     background:  #0f172a !important;
 }

[data-theme="dark"] footer, 
[data-theme="dark"] footer *  {
     color-scheme:  dark;
 }

[data-theme="dark"] footer .footer-col h4  {
     color:  #f1f5f9 !important;
 }

[data-theme="dark"] footer .footer-links a  {
     color:  #94a3b8 !important;
 }

[data-theme="dark"] footer .footer-contact-item p  {
     color:  #94a3b8 !important;
 }

[data-theme="dark"] footer .footer-about p  {
     color:  #94a3b8 !important;
 }

[data-theme="dark"] footer .footer-about .logo-main  {
     color:  #f1f5f9 !important;
 }

[data-theme="dark"] .footer-bottom  {
     border-top-color:  #1e293b !important;
     color:  #64748b !important;
 }

[data-theme="dark"] footer  {
     border-top-color:  var(--sky) !important;
 }


/* Social buttons footer */
.social-btn  {
    
  width: 38px;
    height: 38px;
    border-radius: 50%;
    
  background: var(--sky);
    color: #fff;
    
  display: flex;
    align-items: center;
    justify-content: center;
    
  font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    
  transition: all 0.2s;
    border: none;
    
}
.social-btn:hover  {
     background: var(--orange);
    transform: translateY(-3px);
 }

[data-theme="dark"] .social-btn  {
     background: rgba(14, 165, 233, 0.15);
    color: var(--sky);
    border: 1px solid rgba(14, 165, 233, 0.3);
 }


/* ── STANDARDIZED SPACING ── */
.section-pad  {
     padding:  60px 0;
 }

.section-pad-sm  {
     padding:  4px 0;
 }

h2  {
     line-height:  1.22;
 }

p + p  {
     margin-top:  12px;
 }

.card,  .project-card,  .blog-card,  .service-card,  .event-card  {
    
  border-radius:  var(--radius);
    
}

/* ── TRISHUL WITH STICK (SVG inline via CSS) ── */
.divine-trishul-l, 
.divine-trishul-r  {
    
  font-size:  clamp(80px,  10vw,  150px);
    
  color:  rgba(249, 115, 22, 0.12) !important;
    
  -webkit-text-stroke:  0 !important;
    
  text-shadow:  none !important;
    
  filter:  none !important;
    
}

/* ── DAMRU ANIMATION for stats section ── */
.stats-damru-anim  {
    
  position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
    
}
.stats-damru-float  {
    
  position: absolute;
    font-size: clamp(60px, 9vw, 120px);
    
  opacity: 0.06;
    user-select: none;
    pointer-events: none;
    
  animation: damruStatFloat 8s ease-in-out infinite;
    
  color: #f97316;
    
}
.stats-damru-float:nth-child(1) {
    top: 10%;
    left: 5%;
    animation-delay: 0s;
}

.stats-damru-float:nth-child(2) {
    top: 60%;
    left: 85%;
    animation-delay: -3s;
    font-size: 80px;
}

.stats-damru-float:nth-child(3) {
    top: 40%;
    left: 45%;
    animation-delay: -5s;
    font-size: 70px;
    opacity: 0.04;
}

@keyframes damruStatFloat  {
    
  0%, 100% {
    transform: rotate(0deg) scale(1);
}

  25% {
    transform: rotate(15deg) scale(1.05);
}

  50% {
    transform: rotate(0deg) scale(1);
}

  75% {
    transform: rotate(-15deg) scale(0.97);
}

}

/* ── ICONIFY ICON SIZE STANDARD ── */
iconify-icon,  .icon  {
     font-size:  1.4rem;
     display: inline-flex;
     align-items: center;
 }


/* ── CP FORM WHITE ── */
.cpf-wrap  {
    
  background:  #ffffff !important;
    
  border:  1.5px solid #e2e8f0 !important;
    
  box-shadow:  0 8px 32px rgba(14, 165, 233, 0.1) !important;
    
}
.cpf label  {
     color:  #334155 !important;
 }

.cpf input,  .cpf select,  .cpf textarea  {
    
  background:  #f8fafc !important;
    
  border-color:  #e2e8f0 !important;
    
  color:  #0f172a !important;
    
}
.cpf input::placeholder  {
     color:  #94a3b8 !important;
 }

.cpf-wrap h3  {
     color:  #0f172a !important;
 }

.cpf-wrap > div > p  {
     color:  #64748b !important;
 }


/* ── AWARD CARDS BRAND COLORS ONLY ── */
.award-card  {
     border-top:  3px solid var(--sky) !important;
 }

.award-card::before  {
     background:  var(--sky) !important;
 }

.award-year  {
     background:  rgba(14, 165, 233, 0.1) !important;
     color:  var(--sky) !important;
 }

.award-icon  {
     font-size:  2rem !important;
 }

.award-rank-badge  {
     background: rgba(249, 115, 22, 0.1) !important;
     color: var(--orange) !important;
     border-color: rgba(249, 115, 22, 0.25) !important;
 }

.award-total-bar  {
     background:  linear-gradient(135deg, var(--sky), var(--sky-dark)) !important;
 }

.av  {
     color:  #ffffff !important;
 }


/* Referral blue/white strict */
.ref-card  {
     border:  1.5px solid var(--sky) !important;
 }

.ref-step-num  {
     background:  linear-gradient(135deg, var(--sky), var(--sky-dark)) !important;
 }

.ref-submit  {
     background:  linear-gradient(135deg, var(--sky), var(--sky-dark)) !important;
     box-shadow:  0 4px 16px rgba(14, 165, 233, 0.3) !important;
 }

.ref-code-box  {
     border-color:  var(--sky) !important;
     color:  var(--sky) !important;
     background:  rgba(14, 165, 233, 0.05) !important;
 }



 /* CERTIFICATES CSS */

 .sv-trust-grid { }
    @media(max-width:700px){ .sv-trust-grid{grid-template-columns:1fr 1fr !important;} }
    @media(max-width:420px){ .sv-trust-grid{grid-template-columns:1fr !important;} }
    .sv-trust-card {
      display:flex;align-items:center;gap:14px;padding:18px 20px;
      /* background:var(--tc-bg,var(--tbg)); */
      border:1.5px solid color-mix(in srgb,var(--tc) 25%,transparent);
      border-radius:12px;transition:transform 0.3s,box-shadow 0.3s;
      position:relative;overflow:hidden;
    }
    .sv-trust-card:hover { transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.1); }
    .sv-trust-card::before {
      content:'';position:absolute;inset:0;
      background:var(--tbg);opacity:0;transition:opacity 0.3s;
    }
    .sv-trust-card:hover::before { opacity:1; }
    .sv-trust-icon { font-size:1.8rem;flex-shrink:0;position:relative;z-index:1; }
    .sv-trust-title { font-size:0.88rem;font-weight:700;position:relative;z-index:1; }
    .sv-trust-sub { font-size:0.72rem;color:var(--text2);margin-top:2px;position:relative;z-index:1; }
    .sv-trust-check {
      margin-left:auto;width:26px;height:26px;border-radius:50%;
      background:var(--orange);color:#fff;display:flex;align-items:center;
      justify-content:center;font-size:0.75rem;font-weight:800;
      flex-shrink:0;position:relative;z-index:1;
    }
    .sv-trust-bar {
      display:flex;gap:0;background:var(--card);
      border:1px solid var(--border);border-radius:10px;
      margin-top:16px;overflow:hidden;flex-wrap:wrap;
    }
    .sv-trust-bar span {
      flex:1;min-width:180px;padding:13px 16px;font-size:0.78rem;font-weight:600;
      color:var(--text2);border-right:1px solid var(--border);text-align:center;
    }
    .sv-trust-bar span:last-child { border-right:none; }

    /* AWARDS PAGE CSS */

    .award-grid-3 {
      display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
    }
    @media(max-width:768px){ .award-grid-3{grid-template-columns:1fr;} }
    .award-card-3 {
      background:var(--card);border-radius:14px;padding:28px 22px;
      border:1px solid var(--border);border-top:3px solid var(--sky);
      text-align:center;transition:transform 0.3s,box-shadow 0.3s;
    }
    .award-card-3:hover { transform:translateY(-5px);box-shadow:0 12px 32px rgba(14,165,233,0.12); }
    .award-card-3-top { display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:14px; }
    .award-year-3 {
      background:rgba(14,165,233,0.1);color:var(--sky);
      padding:4px 14px;border-radius:100px;font-size:0.72rem;font-weight:800;
      letter-spacing:0.12em;border:1px solid rgba(14,165,233,0.2);
    }
    .award-title-3 { font-size:0.95rem;font-weight:800;color:var(--text);line-height:1.4;margin-bottom:8px; }
    .award-org-3 { font-size:0.78rem;color:var(--text2);margin-bottom:12px; }
    .award-badge-3 {
      display:inline-flex;align-items:center;gap:5px;
      background:rgba(249,115,22,0.08);color:var(--orange);
      border:1px solid rgba(249,115,22,0.2);border-radius:100px;
      padding:4px 12px;font-size:0.72rem;font-weight:800;
    }
    .award-intro { text-align:center;margin-bottom:40px; }
    .award-grid {
      display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
    }
    @media(max-width:900px){ .award-grid{grid-template-columns:repeat(2,1fr);} }
    @media(max-width:480px){ .award-grid{grid-template-columns:1fr 1fr;} }
    .award-card {
      background:var(--card);border-radius:16px;padding:24px 18px;
      border:1px solid var(--border);text-align:center;
      position:relative;overflow:hidden;
      transition:transform 0.3s,box-shadow 0.3s;cursor:default;
    }
    .award-card::before {
      content:'';position:absolute;top:0;left:0;right:0;height:3px;
      background:var(--ac);
    }
    .award-card::after {
      content:'';position:absolute;inset:0;
      background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--ac) 8%,transparent),transparent 70%);
      pointer-events:none;
    }
    .award-card:hover { transform:translateY(-6px);box-shadow:0 16px 40px rgba(0,0,0,0.12); }
    .award-year {
      font-size:0.68rem;font-weight:800;color:var(--ac);text-transform:uppercase;
      letter-spacing:0.15em;margin-bottom:12px;
      background:color-mix(in srgb,var(--ac) 12%,transparent);
      padding:3px 10px;border-radius:100px;display:inline-block;
    }
    .award-icon { font-size:2.2rem;margin-bottom:12px;display:block; }
    .award-title { font-size:0.88rem;font-weight:800;color:var(--text);line-height:1.4;margin-bottom:8px; }
    .award-org { font-size:0.72rem;color:var(--text2);line-height:1.4; }
    .award-rank-badge {
      display:inline-block;margin-top:10px;
      background:rgba(245,158,11,0.12);color:#f59e0b;
      border:1px solid rgba(245,158,11,0.3);border-radius:100px;
      padding:3px 10px;font-size:0.65rem;font-weight:800;
    }
    .award-total-bar {
      display:flex;background:linear-gradient(135deg,#0c1b2e,#0f2040);
      border-radius:14px;margin-top:24px;overflow:hidden;
    }
    .award-total-item {
      flex:1;padding:20px;text-align:center;border-right:1px solid rgba(255,255,255,0.08);
    }
    .award-total-item:last-child { border-right:none; }
    .av { display:block;font-size:1.6rem;font-weight:900;color:#f97316; }
    .al { font-size:0.7rem;color:rgba(255,255,255,0.55);text-transform:uppercase;letter-spacing:0.08em;margin-top:4px;display:block; }


    /* GAllery Page */

     .gallery-hero-strip{background:linear-gradient(135deg,var(--sky-deep) 0%,#091428 60%,#0f1e30 100%);padding:60px 0 0;text-align:center;position:relative;overflow:hidden;}
    .gallery-hero-strip h2{font-family:var(--font-display);font-size:clamp(1.6rem,3.5vw,2.6rem);color:#fff;margin-bottom:10px;}
    .gallery-hero-strip p{color:rgba(255,255,255,.72);font-size:1.05rem;margin-bottom:36px;}
    .gallery-tabs{display:flex;gap:8px;justify-content:center;padding:22px 28px;background:var(--card);border-bottom:1px solid var(--border);flex-wrap:wrap;position:sticky;top:var(--navbar-h);z-index:50;backdrop-filter:blur(20px);}
    .gallery-tab{padding:9px 24px;border-radius:100px;font-size:.84rem;font-weight:600;cursor:pointer;border:2px solid var(--border);background:var(--card);color:var(--text2);transition:all var(--transition);display:flex;align-items:center;gap:6px;}
    .gallery-tab.active{background:var(--sky);border-color:var(--sky);color:#fff;}
    .gallery-tab:hover:not(.active){border-color:var(--sky);color:var(--sky);}
    .section-divider{display:flex;align-items:center;gap:16px;margin:52px 0 28px;}
    .section-divider h3{font-family:var(--font-display);font-size:1.6rem;font-weight:700;white-space:nowrap;}
    .section-divider::before,.section-divider::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,transparent,var(--sky),var(--orange),transparent);opacity:.35;}
    .video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:52px;}
    .video-card{border-radius:var(--radius);overflow:hidden;background:var(--card);border:1.5px solid var(--border);box-shadow:var(--shadow);transition:all var(--transition);}
    .video-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);border-color:rgba(14,165,233,.3);}
    .video-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;cursor:pointer;}
    .video-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;display:block;}
    .video-card:hover .video-thumb img{transform:scale(1.05);}
    .video-thumb-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.38);transition:background var(--transition);}
    .video-card:hover .video-thumb-play{background:rgba(0,0,0,.55);}
    .play-circle{width:68px;height:68px;border-radius:50%;background:rgba(249,115,22,.9);backdrop-filter:blur(10px);border:3px solid rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#fff;transition:all var(--transition);}
    .video-card:hover .play-circle{transform:scale(1.12);background:var(--orange);}
    .video-card-body{padding:20px;}
    .video-card-body h4{font-family:var(--font-display);font-size:1rem;margin-bottom:6px;}
    .video-card-body p{font-size:.84rem;color:var(--text2);}
    .vid-duration{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.75);color:#fff;font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:5px;}
    .admin-url-form{display:flex;flex-direction:column;gap:12px;}
    .admin-url-form input,.admin-url-form select{width:100%;padding:11px 14px;border-radius:var(--radius-sm);border:1.5px solid var(--border);background:var(--bg2);color:var(--text);font-family:var(--font-body);font-size:.88rem;}
    .admin-url-form input:focus,.admin-url-form select:focus{outline:none;border-color:var(--sky);}
    @media(max-width:768px){.video-grid{grid-template-columns:1fr;}}
    @media(max-width:1024px){.video-grid{grid-template-columns:1fr 1fr;}}

    /* FAQ SECTION */

    
/* FAQ */
/* .faq-section{background:var(--bg2);position:relative;overflow:hidden;}
.faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.faq-item{background:var(--card);border-radius:var(--radius-sm);border:1.5px solid var(--border);overflow:hidden;transition:border-color var(--transition),box-shadow var(--transition);}
.faq-item.open{border-color:rgba(14,165,233,.35);box-shadow:var(--shadow);}
.faq-q{padding:22px 28px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:600;font-size:.97rem;transition:color var(--transition);gap:16px;}
.faq-q:hover{color:var(--sky);}
.faq-icon{color:var(--sky);font-size:1.4rem;transition:transform var(--transition);flex-shrink:0;line-height:1;}
.faq-item.open .faq-icon{transform:rotate(45deg);}
.faq-a{padding:0 28px;max-height:0;overflow:hidden;transition:all .42s ease;}
.faq-item.open .faq-a{padding:0 28px 22px;max-height:250px;}
.faq-a p{font-size:.9rem;} */



 .joinus-imgs{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin:36px 0;}
    .joinus-img{flex:1;min-width:200px;max-width:320px;height:200px;border-radius:16px;overflow:hidden;position:relative;box-shadow:0 8px 28px rgba(0,0,0,0.15);}
    .joinus-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s;}
    .joinus-img:hover img{transform:scale(1.07);}
    .joinus-img .lbl{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(12,27,46,0.9),transparent);color:#fff;padding:18px 14px 12px;font-size:0.8rem;font-weight:700;}
    @media(max-width:768px){.cpb-grid{grid-template-columns:1fr 1fr;}}
    @media(max-width:480px){.cpb-grid{grid-template-columns:1fr;}}

    .cpb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:40px 0;}
    @media(max-width:768px){.cpb-grid{grid-template-columns:1fr 1fr;}}
    @media(max-width:480px){.cpb-grid{grid-template-columns:1fr;}}
    .cpb{background:var(--card);border-radius:14px;padding:28px 18px;text-align:center;border:1px solid var(--border);transition:transform 0.3s,box-shadow 0.3s;}
    .cpb:hover{transform:translateY(-5px);box-shadow:0 12px 32px rgba(0,0,0,0.1);}
    .cpb-icon{font-size:2.4rem;margin-bottom:12px;}
    .cpb h4{font-size:0.93rem;font-weight:800;color:var(--text);margin-bottom:8px;}
    .cpb p{font-size:0.81rem;color:var(--text2);line-height:1.6;}
    .cpf-wrap{background:#ffffff;border-radius:20px;padding:48px;position:relative;overflow:hidden;border:1.5px solid #e2e8f0;box-shadow:0 8px 32px rgba(14,165,233,0.1);}
    @media(max-width:768px){.cpf-wrap{padding:30px 20px;}}
    .cpf-wrap::before{content:'🔱';position:absolute;top:-10px;right:10px;font-size:180px;opacity:0.04;line-height:1;pointer-events:none;}
    .cpf-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px;}
    @media(max-width:600px){.cpf-grid{grid-template-columns:1fr;}}
    .cpf-grid .full{grid-column:1/-1;}
    .cpf label{display:block;font-size:0.72rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:6px;}
    .cpf input,.cpf select,.cpf textarea{width:100%;padding:12px 14px;border-radius:10px;background:#f8fafc;border:1.5px solid #e2e8f0;color:#0f172a;font-family:'Times New Roman',Times,serif;font-size:0.9rem;transition:border-color 0.2s;box-sizing:border-box;}
    .cpf input::placeholder{color:#94a3b8;}
    .cpf input:focus,.cpf select:focus,.cpf textarea:focus{outline:none;border-color:#0ea5e9;background:rgba(14,165,233,0.08);}
    .cpf select option{background:#ffffff;color:#0f172a;}
    .cpf-submit{width:100%;padding:15px;border-radius:12px;margin-top:8px;background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;font-size:0.97rem;font-weight:800;cursor:pointer;border:none;font-family:'Times New Roman',Times,serif;box-shadow:0 4px 20px rgba(14,165,233,0.4);transition:all 0.25s;}
    .cpf-submit:hover{transform:translateY(-2px);}

    
    .ref-layout {
      --rp-blue:#0973BA; --rp-blue-dark:#075a8f; --rp-orange:#F36F34; --rp-orange-dark:#d8551d;
      --rp-font:'Neuropolitical','Poppins',var(--font-body,sans-serif);
      font-family:var(--rp-font);
      display:grid;grid-template-columns:1.05fr 1fr;
      border-radius:28px;overflow:hidden;position:relative;
      box-shadow:0 30px 80px rgba(9,115,186,0.16), 0 4px 20px rgba(0,0,0,0.06);
    }
    @media(max-width:900px){ .ref-layout{grid-template-columns:1fr;border-radius:22px;} }

    /* ---------- LEFT: white panel with floating decor ---------- */
    .ref-left {
      position:relative;overflow:hidden;background:#ffffff;
      padding:64px 56px;isolation:isolate;
    }
    @media(max-width:600px){ .ref-left{padding:44px 26px 40px;} }

    .ref-decor { position:absolute;inset:0;z-index:0;pointer-events:none; }

    .ref-blob {
      position:absolute;border-radius:50%;filter:blur(46px);opacity:0.35;
      animation:refBlobDrift 14s ease-in-out infinite;
    }
    .ref-blob-1{ width:220px;height:220px;top:-60px;right:-50px;background:radial-gradient(circle,var(--rp-blue),transparent 70%);animation-duration:16s; }
    .ref-blob-2{ width:180px;height:180px;bottom:20px;right:40px;background:radial-gradient(circle,var(--rp-orange),transparent 70%);animation-duration:13s;animation-delay:-4s; }
    .ref-blob-3{ width:150px;height:150px;bottom:-50px;left:-40px;background:radial-gradient(circle,var(--rp-blue),transparent 70%);animation-duration:18s;animation-delay:-8s; }
    @keyframes refBlobDrift {
      0%,100% { transform:translate(0,0) scale(1); }
      50% { transform:translate(18px,-22px) scale(1.12); }
    }

    .ref-float {
      position:absolute;display:flex;align-items:center;justify-content:center;
      width:52px;height:52px;border-radius:16px;font-size:1.35rem;font-weight:700;
      background:rgba(255,255,255,0.7);
      border:1px solid rgba(9,115,186,0.14);
      box-shadow:0 12px 30px rgba(9,115,186,0.12), inset 0 1px 0 rgba(255,255,255,0.6);
      backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
      color:var(--rp-blue);
      animation:refFloatY 6s ease-in-out infinite;
    }
    .ref-float iconify-icon { font-size:1.5rem; }
    .ref-float-rupee { color:var(--rp-orange); }
    .ref-float-1{ top:8%; right:14%; animation-duration:7s; }
    .ref-float-2{ top:38%; right:2%; color:var(--rp-orange); animation-duration:5.5s; animation-delay:-1.2s; }
    .ref-float-3{ top:62%; right:20%; animation-duration:6.5s; animation-delay:-2.4s; }
    .ref-float-4{ top:80%; right:-6px; animation-duration:7.5s; animation-delay:-3.6s; }
    .ref-float-5{ top:14%; right:32%; animation-duration:6s; animation-delay:-.8s; color:var(--rp-orange); }
    @media(max-width:900px){ .ref-float{ width:42px;height:42px;font-size:1.1rem; } .ref-float iconify-icon{font-size:1.2rem;} }
    @keyframes refFloatY {
      0%,100% { transform:translateY(0) rotate(0deg); }
      50% { transform:translateY(-14px) rotate(4deg); }
    }
    @media (prefers-reduced-motion: reduce) {
      .ref-blob, .ref-float { animation:none; }
    }




/* referal section CSS*/

    .ref-left-inner { position:relative;z-index:1; }

    .ref-heading { color:#0f1b2b;margin-bottom:16px;font-size:clamp(1.6rem,3vw,2.4rem);font-family:var(--rp-font);font-weight:700; }
    .ref-accent, .ref-accent-light { color:var(--rp-orange); }
    .ref-sub { color:#4b5a6b;line-height:1.75;margin-bottom:28px;font-size:0.95rem;font-family:var(--rp-font); }

    .ref-steps { display:flex;flex-direction:column;gap:20px;margin-bottom:24px; }
    .ref-step { display:flex;align-items:flex-start;gap:16px; }
    .ref-step strong { color:#0f1b2b; }
    .ref-step-num {
      width:36px;height:36px;border-radius:50%;flex-shrink:0;
      background:linear-gradient(135deg,var(--rp-blue),var(--rp-orange));
      color:#fff;font-weight:900;font-size:0.9rem;
      display:flex;align-items:center;justify-content:center;
      box-shadow:0 6px 16px rgba(9,115,186,0.3);
    }
    .ref-step-sub { font-size:0.82rem;color:#64748b; }
    .ref-perks { display:flex;flex-direction:column;gap:8px; }
    .ref-perks span { display:flex;align-items:center;gap:8px;font-size:0.85rem;font-weight:600;color:var(--rp-blue); }
    .ref-perks iconify-icon { color:var(--rp-orange);font-size:1.1rem; }

    /* ---------- RIGHT: dark glassmorphism card ---------- */
    .ref-right {
      position:relative;
      padding:20px;display:flex;align-items:center;justify-content:center;
    }
    .ref-right::before {
      content:"";position:absolute;inset:0;pointer-events:none;
      background:
        radial-gradient(420px circle at 10% 0%, rgba(9,115,186,0.28), transparent 60%),
        radial-gradient(380px circle at 100% 100%, rgba(243,111,52,0.2), transparent 60%);
    }
    .ref-card {
      position:relative;z-index:1;width:100%;max-width:440px;
      background:linear-gradient(160deg,#06111d 0%,#0a1f33 50%,#071726 100%);
      border:1px solid rgba(255,255,255,0.12);
      border-radius:22px;overflow:hidden;
      backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
      box-shadow:0 20px 50px rgba(0,0,0,0.35);
    }
    .ref-card-header {
      position:relative;padding:34px 28px 26px;text-align:center;color:#fff;
      border-bottom:1px solid rgba(255,255,255,0.1);
    }
    .ref-card-icon {
      width:56px;height:56px;margin:0 auto 12px;border-radius:16px;
      display:flex;align-items:center;justify-content:center;font-size:1.8rem;
      background:linear-gradient(135deg,var(--rp-blue),var(--rp-orange));
      box-shadow:0 10px 26px rgba(9,115,186,0.4);
    }
    .ref-card-header h3 { font-size:1.3rem;margin:8px 0 4px;font-family:var(--rp-font);color:#fff; }
    .ref-card-header p { font-size:0.85rem;color:rgba(255,255,255,0.6); }
    .ref-form { padding:26px 28px 30px;display:flex;flex-direction:column;gap:15px; }
    .ref-field { display:flex;flex-direction:column;gap:6px; }
    .ref-field label { font-size:0.72rem;font-weight:700;color:rgba(255,255,255,0.55);text-transform:uppercase;letter-spacing:0.08em;font-family:var(--rp-font); }
    .ref-field input,.ref-field select {
      padding:12px 15px;border-radius:11px;border:1.5px solid rgba(255,255,255,0.14);
      background:rgba(255,255,255,0.05);color:#fff;font-family:var(--rp-font);
      font-size:0.9rem;transition:border-color .25s ease,box-shadow .25s ease,background .25s ease;
    }
    .ref-field input::placeholder { color:rgba(255,255,255,0.35); }
    .ref-field select option { color:#0f1b2b; }
    .ref-field input:focus,.ref-field select:focus {
      outline:none;border-color:var(--rp-orange);background:rgba(255,255,255,0.08);
      box-shadow:0 0 0 4px rgba(243,111,52,0.18), 0 0 18px rgba(9,115,186,0.35);
    }
    .ref-submit {
      display:flex;align-items:center;justify-content:center;gap:10px;
      padding:15px;border-radius:13px;border:none;cursor:pointer;margin-top:4px;
      background:linear-gradient(135deg,var(--rp-blue),var(--rp-orange));
      background-size:160% 160%;
      color:#fff;font-size:0.95rem;font-weight:700;font-family:var(--rp-font);
      box-shadow:0 10px 28px rgba(9,115,186,0.4);
      transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,background-position .5s ease;
    }
    .ref-submit iconify-icon { font-size:1.1rem;transition:transform .3s ease; }
    .ref-submit:hover { transform:translateY(-3px);box-shadow:0 16px 36px rgba(243,111,52,0.4);background-position:100% 0; }
    .ref-submit:hover iconify-icon { transform:translateX(4px); }

    .ref-success-icon { font-size:2.6rem;margin-bottom:14px;color:var(--rp-orange); }
    .ref-success-title { color:#fff;margin-bottom:8px;font-family:var(--rp-font); }
    .ref-success-sub { color:rgba(255,255,255,0.65);font-size:0.88rem;font-family:var(--rp-font); }
    .ref-code-box {
      display:inline-block;
      background:linear-gradient(135deg,rgba(9,115,186,0.18),rgba(243,111,52,0.12));
      border:2px dashed var(--rp-orange);border-radius:14px;padding:16px 26px;
      font-size:1.5rem;font-weight:900;color:#fff;letter-spacing:0.1em;font-family:var(--rp-font);
      cursor:pointer;transition:transform .25s ease,box-shadow .25s ease;
    }
    .ref-code-box:hover { transform:scale(1.04);box-shadow:0 10px 26px rgba(243,111,52,0.25); }

    .show-more-content{
    overflow:hidden;
}

.show-more-link{
    color:#F34F36;
    cursor:pointer;
    font-weight:600;
    display:inline-block;
    margin-top:5px;
}
#book-dream-home .container{
    display: flex;
}

#book-dream-home .container > div:first-child{
    flex: 0 0 60%;
}

#book-dream-home .container > div:last-child{
    flex: 0 0 40%;
}

/* =========================================
   YOUTUBE VIDEO GALLERY
========================================= */

.yt-gallery {
    width: 100%;
    display: grid;

    /* Desktop / Laptop - 3 columns */
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 28px;

    margin-top: 30px;
}


/* =========================================
   VIDEO CARD
========================================= */

.yt-gallery-card {
    width: 100%;
    background: #fff;

    border: 1px solid #e8edf3;
    border-radius: 18px;

    overflow: hidden;

    box-shadow:
        0 8px 25px rgba(15, 23, 42, 0.07);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}


/* Hover */

.yt-gallery-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 18px 40px rgba(15, 23, 42, 0.13);

    border-color: #dbe4ef;
}


/* =========================================
   VIDEO WRAPPER
========================================= */

.yt-video-wrapper {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: #111827;
}


/* lite-youtube */

.yt-video-wrapper lite-youtube {
    display: block;

    width: 100%;
    height: 100%;

    position: absolute;
    inset: 0;

    background-position: center !important;
    background-size: cover !important;

    border-radius: 0;
}


/* =========================================
   PLAY BUTTON
========================================= */

.yt-video-wrapper .lty-playbtn {
    width: 64px;
    height: 46px;

    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    background: rgba(255, 0, 0, 0.95);

    border-radius: 14px;

    display: flex;
    align-items: center;
    justify-content: center;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.25);
}


/* Play icon */

.yt-video-wrapper .lty-playbtn::before {
    content: "";

    width: 0;
    height: 0;

    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 14px solid #fff;

    margin-left: 4px;
}


/* Play hover */

.yt-gallery-card:hover .lty-playbtn {
    transform: translate(-50%, -50%) scale(1.08);

    background: #ff0000;

    box-shadow:
        0 10px 30px rgba(255, 0, 0, 0.30);
}


/* =========================================
   VIDEO INFORMATION
========================================= */

.yt-video-info {
    padding: 17px 18px 18px;
}


.yt-video-info h4 {
    margin: 0;

    font-size: 17px;
    line-height: 1.4;

    font-weight: 600;

    color: #172033;
}


.yt-video-info p {
    margin: 6px 0 0;

    font-size: 14px;
    line-height: 1.5;

    color: #7b8494;
}


/* =========================================
   LARGE DESKTOP
========================================= */

@media (min-width: 1400px) {

    .yt-gallery {
        gap: 32px;
    }

    .yt-video-info {
        padding: 19px 20px;
    }

    .yt-video-info h4 {
        font-size: 18px;
    }

}


/* =========================================
   LAPTOP
========================================= */

@media (max-width: 1199px) {

    .yt-gallery {
        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 22px;
    }

    .yt-video-info h4 {
        font-size: 16px;
    }

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

    .yt-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 22px;
    }

    .yt-gallery-card {
        border-radius: 16px;
    }

    .yt-video-wrapper .lty-playbtn {
        width: 58px;
        height: 42px;

        border-radius: 12px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

    .yt-gallery {
        grid-template-columns: 1fr;

        gap: 20px;

        margin-top: 20px;
    }

    .yt-gallery-card {
        border-radius: 15px;
    }

    .yt-video-info {
        padding: 15px 16px;
    }

    .yt-video-info h4 {
        font-size: 16px;
    }

    .yt-video-info p {
        font-size: 13px;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .yt-gallery {
        gap: 16px;
    }

    .yt-video-wrapper .lty-playbtn {
        width: 52px;
        height: 38px;

        border-radius: 10px;
    }

    .yt-video-wrapper .lty-playbtn::before {
        border-top-width: 8px;
        border-bottom-width: 8px;
        border-left-width: 12px;
    }

    .yt-video-info {
        padding: 14px;
    }

}


/* Sitemap CSS */
.sitemap-section {
    margin-bottom: 3rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--orange);
  }
  
  .section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
  }

  .section-count {
    background-color: var(--orange);
    color: #fff;
    padding: 0.25rem 0.75rem;
    border-radius: 1rem;
    font-size: 1rem !important;
    font-weight: 600;
}

.links-list {
    list-style: disc;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}
.section-header h2{
    color: var(--orange) !important;
}
.links-list a {
    /* color: var(--orange); */
    font-weight: 600;
    text-decoration: none;
    font-size: 1rem;
    transition: all 0.9s ease;
    display: block;
}


/* Cookies CSS */

  .policy-wrap {
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 64px 24px 96px;
  }
 
  .policy-title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text-dark);
    margin: 0 0 6px;
  }
 
  .policy-meta {
    font-size: 0.95rem;
    color: var(--text-muted);
    margin: 0 0 40px;
  }
 
  .policy-meta strong {
    color: var(--text-dark);
  }
 
  .policy-wrap h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-dark);
    margin: 40px 0 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--line);
  }
 
  .policy-wrap h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-dark);
    margin: 24px 0 8px;
  }
 
  .policy-wrap p {
    margin: 0 0 14px;
  }
 
  .policy-wrap ul, .policy-wrap ol {
    margin: 0 0 14px;
    padding-left: 24px;
  }
 
  .policy-wrap li {
    margin-bottom: 6px;
  }
 
  .policy-address {
    margin: 0;
    font-style: normal;
  }
 
  .policy-address p {
    margin: 0 0 4px;
  }
 
  .policy-disclaimer {
    margin-top: 48px;
    padding: 16px 20px;
    background: #f8fafc;
    border-left: 4px solid var(--accent);
    color: var(--text-muted);
    font-size: 0.9rem;
    font-style: italic;
  }
 
  .policy-wrap a {
    color: var(--accent);
  }