 :root {
     --saffron: #FF6B00;
     --deep-orange: #D94F00;
     --gold: #FFB300;
     --light-gold: #FFD966;
     --cream: #FFF8EE;
     --dark-brown: #3A1A00;
     --mid-brown: #6B3300;
     --text-dark: #2A0E00;
     --white: #FFFFFF
 }

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box
 }

 html {
     scroll-behavior: smooth
 }

 body {
     font-family: 'Cormorant Garamond', serif;
     background: var(--cream);
     color: var(--text-dark);
     overflow-x: hidden
 }

 .om-replacement {
     display: inline-block;
     font-family: 'Cinzel Decorative', serif;
     font-weight: 700;
     line-height: 1;
     text-transform: uppercase;
 }

 body::before {
    content: 'V';
     position: fixed;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-size: 60vw;
     color: rgba(255, 107, 0, 0.04);
     pointer-events: none;
     z-index: 0;
     font-family: 'Cinzel Decorative', serif;
     font-weight: 700;
     line-height: 1
 }

 ::-webkit-scrollbar {
     width: 6px
 }

 ::-webkit-scrollbar-track {
     background: var(--dark-brown)
 }

 ::-webkit-scrollbar-thumb {
     background: var(--saffron);
     border-radius: 3px
 }

 /* ANN BAR */
 .ann-bar {
     background: linear-gradient(90deg, var(--deep-orange), var(--saffron), var(--gold), var(--saffron), var(--deep-orange));
     background-size: 300% 100%;
     animation: slide-bg 6s linear infinite;
     color: var(--dark-brown);
     font-size: .85rem;
     font-weight: 700;
     letter-spacing: .5px;
     padding: 8px 0;
     text-align: center;
     font-family: 'Cinzel Decorative', serif;
     white-space: nowrap;
     overflow: hidden
 }

 @keyframes slide-bg {
     0% {
         background-position: 0 0
     }

     100% {
         background-position: 300% 0
     }
 }

 /* NAVBAR */
 .navbar-custom {
     background: linear-gradient(135deg, #0d0400 0%, var(--deep-orange) 50%, #0d0400 100%);
     border-bottom: 3px solid var(--gold);
     padding: 8px 0;
     position: sticky;
     top: 0;
     z-index: 1000;
     box-shadow: 0 4px 20px rgba(0, 0, 0, .5)
 }

 /* LOGO */
 .navbar-logo {
     display: flex;
     align-items: center;
     gap: 8px;
     text-decoration: none !important
 }

 .logo-icon {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     flex-shrink: 0;
     background: radial-gradient(circle at 35% 35%, #8B4500, #3A1A00);
     border: 2px solid var(--gold);
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 0 14px rgba(255, 179, 0, .4), inset 0 0 8px rgba(0, 0, 0, .4);
     position: relative;
     transition: box-shadow .3s;
 }
.footer-icon {
width: 80px;
    height:80px;
    border-radius: 50%;
    flex-shrink: 0;
    background: radial-gradient(circle at 35% 35%, #8B4500, #3A1A00);
    border: 2px solid var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 14px rgba(255, 179, 0, .4), inset 0 0 8px rgba(0, 0, 0, .4);
    position: relative;
    transition: box-shadow .3s;
    
}
    
 .navbar-logo:hover .logo-icon {
     box-shadow: 0 0 24px rgba(255, 179, 0, .7), inset 0 0 8px rgba(0, 0, 0, .4)
 }

 .logo-icon::after {
     content: '';
     position: absolute;
     inset: 4px;
     border-radius: 50%;
     border: 1px solid rgba(255, 179, 0, .25)
 }

 .logo-om {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: 1.6rem;
     color: var(--gold);
     line-height: 1;
     text-shadow: 0 0 10px rgba(255, 179, 0, .8)
 }

 .logo-text {
     display: flex;
     flex-direction: column;
     line-height: 1.2
 }

 .logo-text-top {
     font-family: 'Cinzel Decorative', serif;
     font-size: .72rem;
     color: var(--gold);
     letter-spacing: 1.5px;
     text-shadow: 0 0 8px rgba(255, 179, 0, .4)
 }

 .logo-text-mid {
     font-family: 'Cinzel Decorative', serif;
     font-size: .65rem;
     color: rgba(255, 210, 120, .75);
     letter-spacing: .8px
 }

 .logo-text-bottom {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: .78rem;
     color: var(--light-gold);
     letter-spacing: .5px;
     opacity: .8
 }

 .logo-divider {
     width: 1px;
     height: 32px;
     background: linear-gradient(to bottom, transparent, rgba(255, 179, 0, .4), transparent);
     margin: 0 2px
 }

 .navbar-brand-text {
     font-family: 'Cinzel Decorative', serif;
     color: var(--gold) !important;
     font-size: .95rem;
     letter-spacing: 1px;
     text-shadow: 0 0 10px rgba(255, 180, 0, .5)
 }

 .nav-link-custom {
     color: var(--light-gold) !important;
     font-family: 'Cormorant Garamond', serif;
     font-size: .98rem;
     font-weight: 600;
     letter-spacing: .4px;
     transition: color .3s
 }

 .nav-link-custom:hover {
     color: var(--white) !important
 }

 .navbar-toggler {
     border-color: var(--gold)
 }

 .navbar-toggler-icon {
     filter: invert(80%) sepia(100%) saturate(400%) hue-rotate(0deg)
 }

 /* HERO */
 .hero {
     position: relative !important;
     min-height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
     overflow: hidden;
     background: linear-gradient(180deg, #0d0400 0%, #2a0e00 40%, #4a1f00 100%)
 }

 .hero-bg-slider {
     position: absolute !important;
     inset: 0;
     z-index: 1
 }

 .hero-bg-slider .carousel-inner,
 .hero-bg-slider .carousel-item {
     height: 100%
 }

 .hero-bg-image {
     width: 100%;
     height: 100%;
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     filter: brightness(.62) saturate(1.02);
     transform: scale(1.04)
 }

 .hero-bg-1 {
     background-image: url('../images/hero/hero-bg-1.png')
 }

 .hero-bg-2 {
     background-image: url('../images/hero/hero-bg-2.png')
 }

 .hero-bg-3 {
     background-image: url('../images/hero/hero-bg-3.png')
 }

 .hero-bg-overlay {
     position: absolute !important;
     inset: 0;
     background: radial-gradient(ellipse 70% 50% at 50% 40%, rgba(255, 107, 0, .12) 0%, transparent 70%), radial-gradient(ellipse 40% 60% at 20% 80%, rgba(255, 179, 0, .05) 0%, transparent 60%);
     z-index: 3
 }

 .hero-ring {
     position: absolute;
     z-index: 2;
     border-radius: 50%;
     border: 1px solid rgba(255, 179, 0, .12);
     animation: slowSpin 30s linear infinite
 }

 .hero-ring.ring-1 {
     width: 800px;
     height: 800px;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%)
 }

 .hero-ring.ring-2 {
     width: 600px;
     height: 600px;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     border-color: rgba(255, 107, 0, .18);
     animation-direction: reverse;
     animation-duration: 20s
 }

 .hero-ring.ring-3 {
     width: 420px;
     height: 420px;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     border-color: rgba(255, 179, 0, .22);
     animation-duration: 14s
 }

 @keyframes slowSpin {
     to {
         transform: translate(-50%, -50%) rotate(360deg)
     }
 }

 .hero-content {
     position: relative;
     z-index: 10;
     text-align: center;
     padding: 40px 20px;
     animation: fadeDown 1.2s ease both
 }

 .hero-bg-slider .carousel-indicators {
     position: absolute !important;
     left: 50% !important;
     right: auto !important;
     bottom: 18px !important;
     transform: translateX(-50%) !important;
     margin: 0 !important;
     display: flex !important;
     justify-content: center !important;
     align-items: center !important;
     gap: 10px !important;
     z-index: 1 !important;
 }

 .carousel-indicators button {
     width: 10px !important;
     height: 10px !important;
     border-radius: 50% !important;
     border: 1px solid rgba(255, 255, 255, .8) !important;
     background: rgba(255, 255, 255, .25) !important;
     padding: 0;
     cursor: pointer !important;
     transition: transform .25s ease, background .25s ease !important;
 }

 .carousel-indicators button.active {
     background: var(--gold) !important;
     border-color: var(--gold) !important;
     transform: scale(1.15) !important
 }

 .hero-emblem-wrap {
     margin-bottom: 10px;
     display: flex;
     justify-content: center;
     perspective: 900px
 }

 .hero-emblem-3d {
     width: clamp(120px, 16vw, 190px);
     display: block;
     margin: 0 auto;
     object-fit: contain;
     filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .3)) drop-shadow(0 0 34px rgba(255, 179, 0, .48));
     transform-style: preserve-3d;
     backface-visibility: visible;
     will-change: transform;
     animation: emblemSpin3d 8.5s linear infinite
 }

 @keyframes emblemSpin3d {
     0% {
         transform: rotateY(0deg) rotateX(10deg) translateY(0)
     }

     50% {
         transform: rotateY(180deg) rotateX(10deg) translateY(-4px)
     }

     100% {
         transform: rotateY(360deg) rotateX(10deg) translateY(0)
     }
 }

 @keyframes fadeDown {
     from {
         opacity: 0;
         transform: translateY(-30px)
     }

     to {
         opacity: 1;
         transform: translateY(0)
     }
 }

 .hero-om {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: clamp(3rem, 8vw, 6rem);
     color: var(--gold);
     text-shadow: 0 0 40px rgba(255, 179, 0, .8), 0 0 80px rgba(255, 107, 0, .4);
     display: block;
     margin-bottom: 8px;
     animation: glow 3s ease-in-out infinite alternate
 }

 @keyframes glow {
     from {
         text-shadow: 0 0 20px rgba(255, 179, 0, .6), 0 0 40px rgba(255, 107, 0, .3)
     }

     to {
         text-shadow: 0 0 60px rgba(255, 179, 0, 1), 0 0 100px rgba(255, 107, 0, .7)
     }
 }

 .hero-subtitle-hi {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: clamp(.9rem, 2.5vw, 1.5rem);
     color: var(--light-gold);
     letter-spacing: 3px;
     margin-bottom: 16px
 }

 .hero-portrait {
     width: clamp(150px, 22vw, 230px);
     height: clamp(150px, 22vw, 230px);
     border-radius: 50%;
     object-fit: cover;
     object-position: top center;
     border: 5px solid var(--gold);
     box-shadow: 0 0 0 10px rgba(255, 107, 0, .2), 0 0 60px rgba(255, 107, 0, .5);
     margin: 16px auto 22px;
     display: block;
     animation: portraitGlow 4s ease-in-out infinite alternate
 }

 .hero-portrait-slider {
     width: clamp(150px, 22vw, 230px);
     margin: 16px auto 22px;
     border-radius: 50%;
     overflow: hidden;
     animation: portraitGlow 4s ease-in-out infinite alternate
 }

 .hero-portrait-slider .carousel-item {
     width: 100%
 }

 .hero-portrait-slider .hero-portrait {
     width: 100%;
     height: auto;
     margin: 0;
     animation: none
 }

 @keyframes portraitGlow {
     from {
         box-shadow: 0 0 0 8px rgba(255, 107, 0, .15), 0 0 40px rgba(255, 107, 0, .4)
     }

     to {
         box-shadow: 0 0 0 16px rgba(255, 179, 0, .28), 0 0 80px rgba(255, 179, 0, .65)
     }
 }

 .hero-title {
     font-family: 'Cinzel Decorative', serif;
     font-size: clamp(1.3rem, 4vw, 2.8rem);
     color: var(--white);
     text-shadow: 2px 2px 12px rgba(0, 0, 0, .6);
     line-height: 1.3;
     margin-bottom: 8px
 }

 .hero-title span {
     color: var(--gold);
     display: block;
     font-size: 1.05em
 }

 .designation-badge {
     display: inline-block;
     background: linear-gradient(135deg, rgba(255, 107, 0, .2), rgba(255, 179, 0, .12));
     border: 1px solid rgba(255, 179, 0, .45);
     border-radius: 4px;
     color: var(--light-gold);
     font-size: clamp(.78rem, 1.8vw, .98rem);
     letter-spacing: .5px;
     padding: 9px 24px;
     margin: 12px 0 18px;
     font-style: italic
 }

 .hero-tagline {
     font-size: clamp(.9rem, 2.2vw, 1.3rem);
     color: rgba(255, 220, 150, .8);
     font-style: italic;
     margin-bottom: 26px;
     letter-spacing: 1px
 }

 .btn-saffron {
     background: linear-gradient(135deg, var(--saffron), var(--deep-orange));
     color: var(--white);
     border: none;
     font-family: 'Cinzel Decorative', serif;
     font-size: .8rem;
     letter-spacing: 1px;
     padding: 11px 26px;
     border-radius: 2px;
     text-decoration: none;
     display: inline-block;
     transition: all .3s;
     box-shadow: 0 4px 20px rgba(255, 107, 0, .4)
 }

 .btn-saffron:hover {
     background: linear-gradient(135deg, var(--gold), var(--saffron));
     color: var(--dark-brown);
     transform: translateY(-2px);
     box-shadow: 0 8px 30px rgba(255, 179, 0, .5)
 }

 .btn-outline-gold {
     background: transparent;
     color: var(--gold);
     border: 2px solid var(--gold);
     font-family: 'Cinzel Decorative', serif;
     font-size: .8rem;
     letter-spacing: 1px;
     padding: 9px 24px;
     border-radius: 2px;
     text-decoration: none;
     display: inline-block;
     transition: all .3s
 }

 .btn-outline-gold:hover {
     background: var(--gold);
     color: var(--dark-brown)
 }

 .btn-call {
     background: linear-gradient(135deg, var(--mid-brown), var(--dark-brown));
     color: var(--light-gold);
     border: none;
     font-family: 'Cinzel Decorative', serif;
     font-size: .8rem;
     letter-spacing: 1px;
     padding: 11px 26px;
     border-radius: 2px;
     text-decoration: none;
     display: inline-block;
     transition: all .3s
 }

 .btn-call:hover {
     background: var(--saffron);
     color: var(--white);
     transform: translateY(-2px)
 }

 /* SECTION HEADING */
 .section-heading {
     text-align: center;
     margin-bottom: 50px
 }

 .section-heading .hindi-label {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: 1.05rem;
     color: var(--saffron);
     display: block;
     margin-bottom: 6px;
     letter-spacing: 2px
 }

 .section-heading h2 {
     font-family: 'Cinzel Decorative', serif;
     font-size: clamp(1.4rem, 4vw, 2.5rem);
     color: var(--dark-brown);
     position: relative;
     display: inline-block
 }

 .section-heading h2::after {
     content: '';
     display: block;
     width: 80%;
     height: 3px;
     background: linear-gradient(90deg, transparent, var(--saffron), var(--gold), var(--saffron), transparent);
     margin: 12px auto 0;
     border-radius: 2px
 }

 .section-heading.light h2 {
     color: var(--light-gold)
 }

 .section-heading.light .hindi-label {
     color: var(--gold)
 }

 .section-heading p {
     color: var(--mid-brown);
     font-size: 1.1rem;
     max-width: 620px;
     margin: 14px auto 0;
     font-style: italic
 }

 .section-heading.light p {
     color: rgba(255, 220, 150, .8)
 }

 /* DESIGNATION STRIP */
 .designation-strip {
     background: linear-gradient(135deg, var(--dark-brown), #5c2800);
     border-top: 3px solid var(--gold);
     border-bottom: 3px solid var(--gold);
     padding: 32px 0;
     text-align: center;
     position: relative;
     z-index: 1
 }

 .designation-strip h3 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--gold);
     font-size: clamp(1rem, 2.5vw, 1.7rem);
     margin-bottom: 8px
 }

 .designation-strip p {
     color: var(--light-gold);
     font-size: 1.05rem;
     font-style: italic;
     margin: 0 0 16px
 }

 .badge-strip {
     display: inline-flex;
     flex-wrap: wrap;
     gap: 10px;
     justify-content: center
 }

 .badge-item {
     background: rgba(255, 107, 0, .15);
     border: 1px solid rgba(255, 179, 0, .3);
     border-radius: 3px;
     color: var(--light-gold);
     padding: 7px 18px;
     font-size: .86rem;
     letter-spacing: .5px
 }

 /* ABOUT */
 .about-section {
     padding: 90px 0;
     background: var(--cream);
     position: relative;
     z-index: 1
 }

 .about-section::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 4px;
     background: linear-gradient(90deg, var(--deep-orange), var(--gold), var(--saffron), var(--gold), var(--deep-orange))
 }

 .about-img-wrapper {
     position: relative;
     display: inline-block
 }

 .about-img-wrapper img {
     width: 100%;
     max-width: 380px;
     border-radius: 4px;
     box-shadow: 12px 12px 0 var(--saffron), 22px 22px 0 rgba(255, 107, 0, .15)
 }

 /*.about-img-wrapper::before {*/
 /*    content: 'ॐ';*/
 /*    position: absolute;*/
 /*    bottom: -20px;*/
 /*    right: -20px;*/
 /*    font-size: 5rem;*/
 /*    color: rgba(255, 107, 0, .12);*/
 /*    font-family: 'Cinzel Decorative', serif;*/
 /*    font-weight: 700;*/
 /*    z-index: -1*/
 /*}*/

 .about-text h3 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--dark-brown);
     font-size: clamp(1.1rem, 3vw, 1.7rem);
     margin-bottom: 14px
 }

 .quote-hindi {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: 1.1rem;
     color: var(--saffron);
     background: linear-gradient(135deg, rgba(255, 107, 0, .08), rgba(255, 179, 0, .08));
     border-left: 4px solid var(--gold);
     padding: 12px 20px;
     border-radius: 0 4px 4px 0;
     margin-bottom: 18px
 }

 .about-text p {
     font-size: 1.08rem;
     line-height: 1.9;
     color: var(--mid-brown);
     margin-bottom: 14px
 }

 .stat-box {
     background: linear-gradient(135deg, var(--deep-orange), var(--saffron));
     color: var(--white);
     border-radius: 4px;
     padding: 18px 12px;
     text-align: center
 }

 .stat-box .num {
     font-family: 'Cinzel Decorative', serif;
     font-size: 1.7rem;
     color: var(--light-gold);
     display: block
 }

 .stat-box .lbl {
     font-size: .78rem;
     opacity: .9;
     letter-spacing: 1px
 }

 /* SHRINE */
 .shrine-section {
     padding: 90px 0;
     background: linear-gradient(180deg, #1a0800 0%, #2a0e00 100%);
     position: relative;
     overflow: hidden
 }

 .shrine-section::before {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse 80% 60% at 50% 50%, rgba(255, 107, 0, .1) 0%, transparent 70%)
 }

 .shrine-card {
     background: rgba(255, 255, 255, .05);
     border: 1px solid rgba(255, 179, 0, .2);
     border-radius: 4px;
     padding: 26px 22px;
     height: 100%;
     transition: background .3s, border-color .3s
 }

 .shrine-card:hover {
     background: rgba(255, 107, 0, .1);
     border-color: var(--gold)
 }

 .shrine-card .shrine-icon {
     font-size: 1.9rem;
     color: var(--saffron);
     margin-bottom: 12px
 }

 .shrine-card h5 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--light-gold);
     font-size: .88rem;
     margin-bottom: 10px
 }

 .shrine-card p {
     color: rgba(255, 220, 150, .75);
     font-size: .98rem;
     line-height: 1.8;
     margin: 0
 }

 .info-box {
     border: 1px solid rgba(255, 179, 0, .25);
     border-radius: 6px;
     padding: 28px;
     background: rgba(255, 255, 255, .04);
     height: 100%
 }

 .info-box h4 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--gold);
     font-size: 1rem;
     margin-bottom: 14px
 }

 .info-box p {
     color: rgba(255, 220, 150, .85);
     font-size: 1rem;
     line-height: 1.9;
     margin-bottom: 12px
 }

 /* DHAM */
 .dham-section {
     padding: 90px 0;
     background: var(--cream);
     position: relative;
     z-index: 1
 }

 .dham-img-card {
     position: relative;
     overflow: hidden;
     border-radius: 4px;
     border: 2px solid rgba(255, 107, 0, .2);
     transition: transform .3s, box-shadow .3s
 }

 .dham-img-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 20px 40px rgba(255, 107, 0, .25)
 }

 .dham-img-card img {
     width: 100%;
     height: 350px;
     object-fit: cover;
     display: block;
     transition: transform .4s
 }

 .dham-img-card:hover img {
     transform: scale(1.06)
 }

 .dham-img-caption {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     background: linear-gradient(transparent, rgba(42, 14, 0, .88));
     color: var(--light-gold);
     font-style: italic;
     font-size: .93rem;
     padding: 20px 14px 10px;
     text-align: center
 }

 /* GALLERY */
 .gallery-section {
     padding: 90px 0;
     background: linear-gradient(180deg, #2a0e00, #3a1a00);
     position: relative;
     z-index: 1
 }

 .gallery-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
     gap: 14px
 }

 .gallery-item {
     position: relative;
     overflow: hidden;
     border-radius: 4px;
     cursor: pointer
 }

 .gallery-item.tall {
     grid-row: span 2
 }

 .gallery-item img {
     width: 100%;
     height: 240px;
     object-fit: cover;
     display: block;
     transition: transform .4s
 }

 .gallery-item.tall img {
     height: 100%;
     min-height: 494px
 }

 .gallery-item:hover img {
     transform: scale(1.08)
 }

 .gallery-item .overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(transparent 40%, rgba(255, 107, 0, .7));
     opacity: 0;
     transition: opacity .3s;
     display: flex;
     align-items: flex-end;
     justify-content: center;
     padding-bottom: 16px
 }

 .gallery-item:hover .overlay {
     opacity: 1
 }

 .gallery-item .overlay span {
     color: var(--white);
     font-style: italic;
     font-size: .92rem;
     text-align: center;
     padding: 0 10px
 }

 /* TEACHINGS */
 .teachings-section {
     padding: 90px 0;
     background: linear-gradient(135deg, #fff8ee 0%, #ffe8cc 100%);
     position: relative;
     z-index: 1
 }

 .teaching-card {
     background: var(--white);
     border-radius: 4px;
     border-top: 4px solid var(--saffron);
     padding: 28px 22px;
     height: 100%;
     box-shadow: 0 4px 20px rgba(255, 107, 0, .1);
     transition: transform .3s, box-shadow .3s
 }

 .teaching-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 12px 30px rgba(255, 107, 0, .2)
 }

 .teaching-card .icon {
     font-size: 1.9rem;
     color: var(--saffron);
     margin-bottom: 12px
 }

 .teaching-card h4 {
     font-family: 'Cinzel Decorative', serif;
     font-size: .92rem;
     color: var(--dark-brown);
     margin-bottom: 10px
 }

 .teaching-card p {
     font-size: 1.03rem;
     color: var(--mid-brown);
     line-height: 1.8
 }

 /* FLORAL */
 .floral-section {
     padding: 80px 0;
     background: var(--cream);
     position: relative;
     z-index: 1
 }

 .floral-img {
     width: 100%;
     height: 220px;
     object-fit: cover;
     border-radius: 4px;
     border: 2px solid rgba(255, 107, 0, .18);
     transition: transform .3s, box-shadow .3s
 }

 .floral-img:hover {
     transform: scale(1.03);
     box-shadow: 0 10px 28px rgba(255, 107, 0, .3)
 }

 .floral-video {
     cursor: pointer
 }

 .floral-video-card {
     position: relative;
     border-radius: 4px;
     overflow: hidden;
 }

 .floral-video-play {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     background: transparent;
     transition: background .25s;
     pointer-events: none;
 }

 .floral-video-play i {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: rgba(0, 0, 0, .48);
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border: 1px solid rgba(255, 255, 255, .35);
     color: var(--white);
     font-size: 1rem;
 }

 .floral-video-card:hover .floral-video-play {
     background: rgba(0, 0, 0, .12);
 }

 .floral-video-card.is-playing .floral-video-play {
     opacity: 0;
 }

 .floral-youtube {
     padding: 0;
     overflow: hidden;
     position: relative;
     background: #000;
     cursor: pointer;
 }

 .floral-youtube-poster {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
 }

 .floral-youtube-play {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1rem;
     color: var(--white);
     background: transparent;
     transition: background .25s;
     border: 0;
     cursor: pointer;
 }

 .floral-youtube-play i {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: rgba(0, 0, 0, .48);
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border: 1px solid rgba(255, 255, 255, .35);
 }

 .floral-youtube:hover .floral-youtube-play {
     background: rgba(0, 0, 0, .12);
 }

 .floral-youtube-expand {
     position: absolute;
     right: 10px;
     bottom: 10px;
     width: 30px;
     height: 30px;
     border: 1px solid rgba(255, 255, 255, .35);
     border-radius: 50%;
     color: rgba(255, 255, 255, .92);
     background: rgba(0, 0, 0, .56);
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     z-index: 2;
     opacity: 0;
     transform: translateY(4px);
     transition: opacity .2s, transform .2s;
 }

 .floral-youtube:hover .floral-youtube-expand,
 .floral-youtube:focus-within .floral-youtube-expand {
     opacity: 1;
     transform: translateY(0);
 }

 .floral-youtube-expand:hover {
     color: var(--white);
     border-color: rgba(255, 255, 255, .85);
 }

 .floral-youtube-inline {
     width: 100%;
     height: 100%;
     border: 0;
     display: none;
     background: #000;
 }

 .floral-youtube.is-playing .floral-youtube-inline {
     display: block;
 }

 .floral-youtube.is-playing .floral-youtube-poster,
 .floral-youtube.is-playing .floral-youtube-play {
     display: none;
 }

 /* VIDEO LIGHTBOX */
 .video-lightbox {
     position: fixed;
     inset: 0;
     background: rgba(8, 4, 0, .88);
     display: none;
     align-items: center;
     justify-content: center;
     padding: 22px;
     z-index: 3000
 }

 .video-lightbox.open {
     display: flex
 }

 .video-lightbox-frame {
     width: min(800px, 100%);
     max-height: 88vh;
     border: 2px solid rgba(255, 179, 0, .35);
     border-radius: 10px;
     background: #000;
     overflow: hidden;
     box-shadow: 0 18px 44px rgba(0, 0, 0, .6)
 }

 .video-lightbox-frame video {
     width: 100%;
     max-height: 88vh;
     display: block;
     background: #000
 }

 .video-lightbox-frame iframe {
     width: 100%;
     height: min(80vh, 720px);
     display: none;
     border: 0;
     background: #000;
 }

 .video-lightbox-close {
     position: absolute;
     top: 10px;
     right: 14px;
     width: 44px;
     height: 44px;
     border: 1px solid rgba(255, 179, 0, .5);
     border-radius: 50%;
     background: rgba(58, 26, 0, .95);
     color: var(--gold);
     font-size: 1.9rem;
     line-height: 1;
     cursor: pointer
 }

 .video-lightbox-close:hover {
     color: var(--white);
     border-color: var(--gold)
 }

 /* EVENTS */
 .events-section {
     padding: 90px 0;
     background: linear-gradient(180deg, #3A1A00, #5c2800);
     position: relative;
     z-index: 1
 }

 .event-teaser {
     max-width: 430px;
     margin: 0 auto 30px;
     border: 1px solid rgba(255, 179, 0, .22);
     border-radius: 4px;
     background: rgba(255, 255, 255, .06);
     overflow: hidden;
     box-shadow: 0 8px 22px rgba(0, 0, 0, .16)
 }

 .event-teaser img {
     width: 100%;
     height: auto;
     display: block
 }

 .event-teaser-caption {
     text-align: center;
     font-family: 'Cinzel Decorative', serif;
     letter-spacing: 1px;
     font-size: .78rem;
     color: var(--light-gold);
     padding: 10px 12px;
     background: rgba(255, 255, 255, .06)
 }

 .event-card {
     background: rgba(255, 255, 255, .06);
     border: 1px solid rgba(255, 179, 0, .22);
     border-radius: 4px;
     padding: 22px;
     display: flex;
     gap: 18px;
     align-items: flex-start;
     transition: background .3s, border-color .3s
 }

 .event-card:hover {
     background: rgba(255, 107, 0, .12);
     border-color: var(--gold)
 }

 .event-date {
     background: linear-gradient(135deg, var(--saffron), var(--deep-orange));
     color: var(--white);
     border-radius: 4px;
     padding: 10px 12px;
     text-align: center;
     min-width: 56px;
     flex-shrink: 0
 }

 .event-date .day {
     font-family: 'Cinzel Decorative', serif;
     font-size: 1.4rem;
     display: block;
     line-height: 1
 }

 .event-date .month {
     font-size: .7rem;
     letter-spacing: 1px;
     opacity: .9
 }

 .event-info h5 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--light-gold);
     font-size: .88rem;
     margin-bottom: 6px
 }

 .event-info p {
     color: rgba(255, 220, 150, .75);
     font-size: .94rem;
     font-style: italic;
     margin: 0
 }

 /* CTA */
 .cta-strip {
     background: linear-gradient(135deg, var(--deep-orange) 0%, var(--saffron) 50%, var(--gold) 100%);
     padding: 60px 0;
     text-align: center;
     position: relative;
     overflow: hidden
 }

 .cta-strip::before {
     content: 'ॐ';
     position: absolute;
     font-size: 28vw;
     color: rgba(255, 255, 255, .06);
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-family: 'Cinzel Decorative', serif;
     font-weight: 700;
     pointer-events: none
 }

 .cta-strip h2 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--dark-brown);
     font-size: clamp(1.3rem, 3vw, 2.2rem);
     margin-bottom: 8px
 }

 .cta-strip p {
     color: rgba(42, 14, 0, .75);
     font-size: 1.08rem;
     font-style: italic;
     margin-bottom: 22px
 }

 .btn-dark-brown {
     background: var(--dark-brown);
     color: var(--light-gold);
     border: none;
     font-family: 'Cinzel Decorative', serif;
     font-size: .8rem;
     letter-spacing: 1px;
     padding: 12px 28px;
     border-radius: 2px;
     text-decoration: none;
     display: inline-block;
     transition: all .3s
 }

 .btn-dark-brown:hover {
     background: var(--white);
     color: var(--dark-brown);
     transform: translateY(-2px)
 }

 /* CONTACT */
 .contact-section {
     padding: 80px 0;
     background: var(--cream);
     position: relative;
     z-index: 1
 }

 .contact-card {
     background: var(--white);
     border-radius: 6px;
     padding: 34px 28px;
     box-shadow: 0 8px 32px rgba(255, 107, 0, .12);
     border-top: 4px solid var(--saffron);
     height: 100%
 }

 .contact-card h4 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--dark-brown);
     font-size: .95rem;
     margin-bottom: 20px
 }

 .contact-item {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     margin-bottom: 15px
 }

 .contact-item .ci-icon {
     color: var(--saffron);
     font-size: 1.05rem;
     margin-top: 2px;
     flex-shrink: 0
 }

 .contact-item span {
     font-size: 1.03rem;
     color: var(--mid-brown);
     line-height: 1.6
 }

 .contact-item a {
     color: var(--saffron);
     text-decoration: none;
     font-weight: 700
 }

 .contact-item a:hover {
     color: var(--deep-orange)
 }

 /* FOOTER */
 .footer-section {
     background: var(--dark-brown);
     padding: 70px 0 28px;
     color: rgba(255, 220, 150, .8)
 }

 .footer-section h5 {
     font-family: 'Cinzel Decorative', serif;
     color: var(--gold);
     margin-bottom: 16px;
     font-size: .88rem
 }

 .footer-section p,
 .footer-section a {
     font-size: .9rem;
     line-height: 1.8;
     color: rgba(255, 220, 150, .7);
     text-decoration: none
 }

 .footer-section a:hover {
     color: var(--gold)
 }

 .footer-logo-om {
     font-family: 'Tiro Devanagari Hindi', serif;
     font-size: 2.8rem;
     color: var(--saffron);
     line-height: 1
 }

 .social-icon {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 38px;
     height: 38px;
     border-radius: 50%;
     border: 1px solid rgba(255, 179, 0, .3);
     color: var(--gold);
     font-size: 1rem;
     transition: all .3s;
     margin-right: 8px
 }

 .social-icon:hover {
     background: var(--saffron);
     border-color: var(--saffron);
     color: var(--white)
 }

 .footer-bottom {
     border-top: 1px solid rgba(255, 179, 0, .15);
     padding-top: 18px;
     margin-top: 36px;
     text-align: center;
     font-size: .8rem;
     color: rgba(255, 220, 150, .4)
 }

 /* PETALS */
 .petal {
     position: fixed;
     border-radius: 50% 50% 0 50%;
     opacity: .4;
     pointer-events: none;
     z-index: 9999;
     animation: fallPetal linear infinite
 }

 @keyframes fallPetal {
     0% {
         transform: translateY(-20px) rotate(0deg);
         opacity: .5
     }

     100% {
         transform: translateY(100vh) rotate(720deg);
         opacity: 0
     }
 }

 /* REVEAL */
 .reveal {
     opacity: 0;
     transform: translateY(22px);
     transition: opacity .6s ease, transform .6s ease
 }

 .revealed {
     opacity: 1;
     transform: translateY(0)
 }

 @media(max-width:768px) {

     html,
     body {
         overflow-x: hidden
     }

     .navbar-logo {
         max-width: calc(100% - 60px)
     }

     .logo-text {
         min-width: 0
     }

     .logo-text-top,
     .logo-text-mid,
     .logo-text-bottom {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis
     }

     .about-img-wrapper img {
         max-width: 100%
     }

     .gallery-item.tall {
         grid-row: span 1
     }

     .gallery-item.tall img {
         min-height: 240px
     }

     .event-teaser {
         max-width: 100%;
         margin-bottom: 22px
     }

     .hero-bg-image {
         transform: scale(1.08)
     }

     .hero-slider-dots {
         bottom: 12px;
         gap: 8px
     }

     .hero-slider-dots button {
         width: 9px;
         height: 9px
     }

     .floral-section {
         padding: 64px 0
     }

     .floral-section .row {
         --bs-gutter-x: .75rem;
         --bs-gutter-y: .75rem
     }

     .floral-img {
         height: auto;
         aspect-ratio: 4 / 3
     }

     .floral-video-play i,
     .floral-youtube-play i {
         width: 56px;
         height: 56px;
         font-size: 1.15rem
     }
 }

 @media(max-width:576px) {
     .floral-section .row>[class*='col-'] {
         width: 100%
     }

     .floral-img {
         aspect-ratio: 16 / 10
     }
 }