*,
 *::before,
 *::after {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 :root {
     --cream: #f5f0e8;
     --warm-white: #faf8f4;
     --charcoal: #ffffff;
     --gold: #c9a96e;
     --gold-light: #e8d5b0;
     --muted: #7a7167;
     --border: rgba(201, 169, 110, 0.25);
 }

 html {
     scroll-behavior: smooth;
 }

 body {
     background: var(--charcoal);
     color: var(--cream);
     font-family: 'Jost', sans-serif;
     font-weight: 300;
     overflow-x: hidden;
     cursor: none;
 }

 /* Custom Cursor */
 .cursor {
     width: 8px;
     height: 8px;
     background: var(--gold);
     border-radius: 50%;
     position: fixed;
     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 9999;
     transition: transform 0.1s;
 }

 .cursor-ring {
     width: 36px;
     height: 36px;
     border: 1px solid rgba(201, 169, 110, 0.5);
     border-radius: 50%;
     position: fixed;
     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 9998;
     transition: transform 0.15s, width 0.3s, height 0.3s, border-color 0.3s;
 }

 body:has(a:hover) .cursor-ring,
 body:has(button:hover) .cursor-ring {
     width: 60px;
     height: 60px;
     border-color: var(--gold);
 }

 /* NAV */
 nav {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 100;
     padding: 0 60px;
     height: 72px;
     /* fixed height — logo kitna bhi ho nav nahi hilegi */
     display: flex;
     justify-content: space-between;
     align-items: center;
     transition: background 0.5s, height 0.4s;
 }

 /* dropdown css */
 /* DESKTOP DROPDOWN */
 .dropdown {
     position: relative;
 }

 .dropdown-menu {
     position: absolute;
     top: 100%;
     left: 0;
     background: black;
     padding: 15px 0;
     list-style: none;
     min-width: 180px;
     opacity: 0;
     visibility: hidden;
     transform: translateY(10px);
     transition: 0.3s;
     border: 1px solid var(--border);
 }

 .dropdown-menu li {
     padding: 8px 20px;
 }

 .dropdown-menu a {
     font-size: 0.7rem;
     letter-spacing: 0.2em;
 }

 /* SHOW ON HOVER */
 .dropdown:hover .dropdown-menu {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
 }

 /* MOBILE DROPDOWN */
 .mobile-dropdown {
     text-align: center;
 }

 .mobile-submenu {
     max-height: 0;
     overflow: hidden;
     display: flex;
     flex-direction: column;
     gap: 12px;
     transition: max-height 0.4s ease;
 }

 .mobile-dropdown.open .mobile-submenu {
     max-height: 200px;
     margin-top: 10px;
 }

 nav.scrolled {
     background: rgba(26, 24, 20, 0.95);
     backdrop-filter: blur(12px);
     height: 64px;
     /* scroll pe thoda compact */
     border-bottom: 1px solid var(--border);
     margin-top: 0;
     /* margin-top: 3px hata — yahi gap ka kaaran tha */
 }

 .nav-logo {
     text-decoration: none;
     display: flex;
     align-items: center;
     height: 100%;
     /* nav ki poori height le */
 }

 .nav-logo-img {
     height: 170px;
     /* <-- sirf yahan se logo size adjust kar */
     width: auto;
     /* width auto — image stretch nahi hogi */
     max-width: 180px;
     object-fit: contain;
     display: block;
     transition: opacity 0.3s, height 0.4s;
 }

 .nav-logo-img:hover {
     opacity: 0.85;
 }

 /* Mobile */
 nav.scrolled .nav-logo-img {
     height: 170px;
     /* scroll pe logo bhi adjust */
 }

 /* Tablet */
 @media (max-width: 1024px) {
     nav {
         padding: 0 24px;
         height: 66px;
     }

     nav.scrolled {
         height: 58px;
     }

     .nav-logo-img {
         height: 50px;
     }

     nav.scrolled .nav-logo-img {
         height: 44px;
     }
 }

 /* Mobile */
 @media (max-width: 640px) {
     nav {
         padding: 0 20px;
         height: 60px;
     }

     nav.scrolled {
         height: 54px;
     }

     .nav-logo-img {
         height: 116px;
         width: 90px;
     }

     nav.scrolled .nav-logo-img {
         height: 116px;
     }
 }

 @media (max-width: 380px) {
     .nav-logo-img {
         height: 83px;
     }

     nav.scrolled .nav-logo-img {
         height: 83px;
     }
 }

 .nav-links {
     display: flex;
     gap: 40px;
     list-style: none;
 }

 .nav-links a {
     font-size: 0.72rem;
     letter-spacing: 0.28em;
     text-transform: uppercase;
     color: var(--cream);
     text-decoration: none;
     font-weight: 300;
     position: relative;
     padding-bottom: 4px;
     transition: color 0.3s;
 }

 .nav-links a::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 0;
     height: 1px;
     background: var(--gold);
     transition: width 0.4s;
 }

 .nav-links a:hover {
     color: var(--gold);
 }

 .nav-links a:hover::after {
     width: 100%;
 }

 .nav-cta {
     font-size: 0.68rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--charcoal);
     background: var(--gold);
     padding: 10px 26px;
     text-decoration: none;
     font-weight: 400;
     transition: background 0.3s, transform 0.2s;
 }

 .nav-cta:hover {
     background: var(--gold-light);
     transform: translateY(-1px);
 }



 /* HAMBURGER */
 .hamburger {
     display: none;
     flex-direction: column;
     gap: 5px;
     cursor: pointer;
     z-index: 200;
 }

 .hamburger span {
     display: block;
     width: 28px;
     height: 1px;
     background: var(--cream);
     transition: all 0.4s;
 }

 .hamburger.open span:nth-child(1) {
     transform: translateY(6px) rotate(45deg);
 }

 .hamburger.open span:nth-child(2) {
     opacity: 0;
 }

 .hamburger.open span:nth-child(3) {
     transform: translateY(-6px) rotate(-45deg);
 }

 /* MOBILE MENU */
 .mobile-menu {
     display: none;
     position: fixed;
     inset: 0;
     z-index: 150;
     background: black;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     gap: 36px;
     opacity: 0;
     transition: opacity 0.4s;
 }

 .mobile-menu.open {
     display: flex;
     opacity: 1;
 }

 .mobile-menu a {
     font-family: 'Cormorant Garamond', serif;
     font-size: 2.4rem;
     color: var(--cream);
     text-decoration: none;
     letter-spacing: 0.1em;
     transition: color 0.3s;
 }

 .mobile-menu a:hover {
     color: var(--gold);
 }

 /* HERO */
 .hero {
     position: relative;
     height: 100vh;
     overflow: hidden;
     display: flex;
     align-items: flex-end;
     padding-bottom: 80px;
 }

 .hero-slides {
     position: absolute;
     inset: 0;
 }

 .hero-slide {
     position: absolute;
     inset: 0;
     background-size: cover;
     background-position: center;
     opacity: 0;
     transition: opacity 1.5s ease;
 }

 .hero-slide.active {
     opacity: 1;
 }

 .hero-slide::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to top, rgba(26, 24, 20, 0.85) 0%, rgba(26, 24, 20, 0.15) 60%, transparent 100%);
 }

 /* Using free Unsplash images as placeholders */
 .slide-1 {
     background-image: url('images/2.jpg');
 }

 .slide-2 {
     background-image: url('images/DSC07406\ \(1\).jpg');
 }

 .slide-3 {
     background-image: url('images/647A8352\ \(1\).jpg');
 }

 /* .slide-4 {
            background-image: url('https://images.unsplash.com/photo-1583939003579-730e3918a45a?w=1600&q=80');
        } */

 .hero-content {
     position: relative;
     z-index: 2;
     padding: 0 60px;
     max-width: 900px;
     opacity: 0;
     transform: translateY(40px);
     animation: heroReveal 1.2s 0.5s forwards;
 }

 @keyframes heroReveal {
     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 .hero-eyebrow {
     font-size: 0.65rem;
     letter-spacing: 0.45em;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 20px;
     font-weight: 300;
 }

 .hero-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(3.5rem, 7vw, 7rem);
     font-weight: 300;
     line-height: 1.0;
     color: var(--warm-white);
     margin-bottom: 24px;
 }

 .hero-title em {
     font-style: italic;
     color: var(--gold);
 }

 .hero-desc {
     font-size: 0.85rem;
     line-height: 1.9;
     color: rgba(245, 240, 232, 0.65);
     max-width: 480px;
     margin-bottom: 44px;
 }

 .hero-actions {
     display: flex;
     gap: 20px;
     align-items: center;
     flex-wrap: wrap;
 }

 .btn-primary {
     font-size: 0.68rem;
     letter-spacing: 0.32em;
     text-transform: uppercase;
     color: var(--charcoal);
     background: var(--gold);
     padding: 14px 40px;
     text-decoration: none;
     font-weight: 400;
     transition: background 0.3s, transform 0.2s;
     display: inline-block;
 }

 .btn-primary:hover {
     background: var(--gold-light);
     transform: translateY(-2px);
 }

 .btn-outline {
     font-size: 0.68rem;
     letter-spacing: 0.32em;
     text-transform: uppercase;
     color: var(--cream);
     border: 1px solid rgba(245, 240, 232, 0.4);
     padding: 14px 40px;
     text-decoration: none;
     font-weight: 300;
     transition: border-color 0.3s, color 0.3s;
     display: inline-block;
 }

 .btn-outline:hover {
     border-color: var(--gold);
     color: var(--gold);
 }

 /* Slide Indicators */
 .slide-dots {
     position: absolute;
     bottom: 80px;
     right: 60px;
     z-index: 10;
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .dot {
     width: 3px;
     height: 20px;
     background: rgba(245, 240, 232, 0.3);
     cursor: pointer;
     transition: background 0.3s, height 0.3s;
 }

 .dot.active {
     background: var(--gold);
     height: 36px;
 }

 /* ABOUT STRIP */
 .about-editorial {
     display: grid;
     grid-template-columns: 1fr 1.15fr 1fr;
     gap: 0;
     background: var(--cream);
     overflow: hidden;
     min-height: 520px;
 }

 .about-img-col {
     position: relative;
     overflow: hidden;
 }

 .about-img-col img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: top center;
     display: block;
     filter: grayscale(100%);
     transition: transform 0.8s ease;
 }

 .about-editorial:hover .about-img-col img {
     transform: scale(1.04);
 }

 .about-center-col {
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     padding: 48px 36px;
     text-align: center;
     background: var(--cream);
     position: relative;
     z-index: 1;
 }

 .about-big-heading {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2rem, 4.5vw, 3.8rem);
     font-weight: 400;
     line-height: 1.05;
     color: black;
     text-transform: uppercase;
     letter-spacing: 0.04em;
     margin-bottom: 28px;
 }

 .about-big-heading em {
     font-style: italic;
     font-weight: 300;
     text-transform: none;
     letter-spacing: 0.02em;
     display: block;
     font-size: 0.82em;
 }

 .about-body-text {
     font-family: 'Jost', sans-serif;
     font-size: 0.82rem;
     line-height: 1.9;
     color: black;
     font-weight: 300;
     max-width: 320px;
     margin-bottom: 20px;
 }

 .about-body-text+.about-body-text {
     margin-top: 0;
     margin-bottom: 0;
 }

 .about-divider {
     width: 40px;
     height: 1px;
     background: var(--gold);
     margin: 20px auto;
 }

 /* STATS */
 .stats-bar {
     padding: 60px 60px;
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     border-bottom: 1px solid var(--border);
     background: rgba(201, 169, 110, 0.04);
 }

 .stat-item {
     padding: 0 40px;
     text-align: center;
     border-right: 1px solid var(--border);
 }

 .stat-item:last-child {
     border-right: none;
 }

 .stat-num {
     font-family: 'Cormorant Garamond', serif;
     font-size: 3.8rem;
     font-weight: 300;
     color: var(--gold);
     line-height: 1;
     display: block;
     margin-bottom: 8px;
 }

 .stat-label {
     font-size: 0.65rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: black;
 }

 /* PORTFOLIO GRID */
 /* ── PORTFOLIO SECTION ── */
 .portfolio-section {
     padding: 30px 48px 80px;
     background: white;
     overflow: hidden;
 }

 .pf-header {
     display: flex;
     justify-content: space-between;
     align-items: flex-end;
     margin-bottom: 10px;
     flex-wrap: wrap;
     gap: 12px;
 }

 .pf-eyebrow {
     font-size: 0.6rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: black;
     font-weight: 300;
     margin-bottom: 10px;
 }

 .pf-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.2rem, 4.5vw, 3.8rem);
     font-weight: 300;
     line-height: 1.0;
     color: black;
     margin-left: 20px;
     text-align: center;
 }

 .pf-title em {
     font-style: italic;
     color: var(--gold);
 }

 .pf-view-all {
     font-size: 0.65rem;
     letter-spacing: 0.35em;
     text-transform: uppercase;
     color: black;
     text-decoration: none;
     font-weight: 300;
     border-bottom: 1px solid rgb(0, 0, 0);
     padding-bottom: 3px;
     white-space: nowrap;
     transition: border-color 0.3s;
     align-self: flex-end;
 }

 .pf-view-all:hover {
     border-color: var(--gold);
 }

 .pf-divider {
     width: 48px;
     height: 1px;
     background: var(--gold);
     margin-bottom: 44px;
 }

 .pf-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 6px;
 }

 .pf-card {
     position: relative;
     overflow: hidden;
     aspect-ratio: 3 / 4;
     cursor: pointer;
     background: #111;
 }

 .pf-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: transform 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.5s;
     filter: brightness(0.92);
 }

 .pf-card:hover img {
     transform: scale(1.07);
     filter: brightness(0.65);
 }

 .pf-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(to top, rgba(26, 24, 20, 0.88) 0%, transparent 55%);
     opacity: 0;
     transition: opacity 0.45s;
     display: flex;
     flex-direction: column;
     justify-content: flex-end;
     padding: 20px 18px;
 }

 .pf-card:hover .pf-overlay {
     opacity: 1;
 }

 .pf-name {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.05rem;
     font-weight: 400;
     color: #faf8f4;
     line-height: 1.2;
     transform: translateY(8px);
     transition: transform 0.38s 0.06s;
 }

 .pf-card:hover .pf-name {
     transform: translateY(0);
 }

 .pf-location {
     font-size: 0.58rem;
     letter-spacing: 0.28em;
     text-transform: uppercase;
     color: var(--gold);
     margin-top: 4px;
     transform: translateY(8px);
     transition: transform 0.38s 0.1s;
 }

 .pf-card:hover .pf-location {
     transform: translateY(0);
 }

 .pf-cta-row {
     display: flex;
     justify-content: center;
     margin-top: 48px;
 }

 .pf-cta-btn {
     font-size: 0.68rem;
     letter-spacing: 0.38em;
     text-transform: uppercase;
     color: var(--charcoal);
     background: var(--gold);
     padding: 14px 44px;
     text-decoration: none;
     font-weight: 400;
     transition: background 0.3s, transform 0.2s;
 }

 .pf-cta-btn:hover {
     background: var(--gold-light);
     transform: translateY(-2px);
 }

 /* Responsive */
 @media (max-width: 900px) {
     .portfolio-section {
         padding: 56px 24px 64px;
     }

     .pf-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 5px;
     }
 }

 @media (max-width: 600px) {
     .portfolio-section {
         padding: 44px 16px 52px;
     }

     .pf-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 4px;
     }

     .pf-title {
         font-size: clamp(1.8rem, 7vw, 2.4rem);
     }

     .pf-name {
         font-size: 0.9rem;
     }

     .pf-overlay {
         padding: 14px 12px;
     }

     .pf-cta-btn {
         padding: 13px 32px;
     }

     .pf-divider {
         margin-bottom: 32px;
     }
 }

 /* portfolio center heading */
 /* ONLY DESKTOP TITLE CENTER */
 @media (min-width: 901px) {
     .pf-header {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .pf-title {
         margin-left: 0;
         text-align: center;
     }

     .pf-view-all {
         align-self: center;
         margin-top: 10px;
     }
 }

 /* FILMS SECTION */
 /* ═══ FILMS CTA SECTION ═══ */
 .films-cta {
     position: relative;
     width: 100%;
     min-height: 92vh;
     display: flex;
     align-items: center;
     justify-content: center;
     overflow: hidden;
 }

 .films-cta-video {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     z-index: 0;
     pointer-events: none;
 }

 .films-cta-overlay {
     position: absolute;
     inset: 0;
     z-index: 1;
     background: linear-gradient(to top,
             rgba(10, 8, 6, 0.92) 0%,
             rgba(10, 8, 6, 0.55) 45%,
             rgba(10, 8, 6, 0.30) 100%);
 }

 .films-cta-line-left,
 .films-cta-line-right {
     position: absolute;
     top: 0;
     bottom: 0;
     width: 1px;
     background: linear-gradient(to bottom, transparent, rgba(201, 169, 110, 0.35), transparent);
     z-index: 2;
 }

 .films-cta-line-left {
     left: 48px;
 }

 .films-cta-line-right {
     right: 48px;
 }

 .films-cta-inner {
     position: relative;
     z-index: 3;
     text-align: center;
     padding: 80px 48px;
     max-width: 780px;
     width: 100%;
 }

 .films-cta-eyebrow {
     font-size: 0.6rem;
     letter-spacing: 0.55em;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 300;
     margin-bottom: 22px;
 }

 .films-cta-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.6rem, 6vw, 5.2rem);
     font-weight: 300;
     line-height: 1.02;
     color: var(--cream);
     letter-spacing: 0.01em;
     margin-bottom: 10px;
 }

 .films-cta-title em {
     font-style: italic;
     color: var(--gold);
     display: block;
 }

 .films-cta-rule {
     width: 48px;
     height: 1px;
     background: var(--gold);
     margin: 28px auto;
     opacity: 0.8;
 }

 .films-cta-desc {
     font-size: 0.88rem;
     line-height: 1.9;
     color: rgba(245, 240, 232, 0.62);
     font-weight: 300;
     max-width: 480px;
     margin: 0 auto 44px;
     letter-spacing: 0.02em;
 }

 .films-cta-btns {
     display: flex;
     gap: 14px;
     justify-content: center;
     flex-wrap: wrap;
 }

 .films-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     font-family: 'Jost', sans-serif;
     font-size: 0.68rem;
     letter-spacing: 0.34em;
     text-transform: uppercase;
     font-weight: 400;
     padding: 15px 34px;
     text-decoration: none;
     cursor: pointer;
     border: none;
     transition: background 0.3s, transform 0.22s, box-shadow 0.3s;
     white-space: nowrap;
 }

 .films-btn:hover {
     transform: translateY(-2px);
 }

 .films-btn-wa {
     background: var(--gold);
     color: #fff;
 }

 .films-btn-wa:hover {
     background: #1ebe5a;
     box-shadow: 0 8px 28px rgba(37, 211, 102, 0.28);
 }

 .films-btn-call {
     background: transparent;
     color: var(--cream);
     border: 1px solid rgba(245, 240, 232, 0.4);
 }

 .films-btn-call:hover {
     border-color: var(--gold);
     color: var(--gold);
 }

 .btn-icon {
     width: 18px;
     height: 18px;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .films-cta-badge {
     position: absolute;
     bottom: 36px;
     left: 50%;
     transform: translateX(-50%);
     z-index: 3;
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 0.58rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: rgba(245, 240, 232, 0.35);
     white-space: nowrap;
 }

 .films-cta-badge::before,
 .films-cta-badge::after {
     content: '';
     display: block;
     width: 32px;
     height: 1px;
     background: rgba(201, 169, 110, 0.3);
 }

 /* Responsive */
 @media (max-width: 768px) {
     .films-cta-line-left {
         left: 20px;
     }

     .films-cta-line-right {
         right: 20px;
     }

     .films-cta-inner {
         padding: 60px 28px;
     }

     .films-cta-badge {
         display: none;
     }
 }

 @media (max-width: 480px) {
     .films-cta {
         min-height: 100svh;
     }

     .films-cta-inner {
         padding: 52px 20px;
     }

     .films-cta-btns {
         flex-direction: column;
         align-items: center;
         gap: 12px;
     }

     .films-btn {
         width: 100%;
         max-width: 300px;
         justify-content: center;
     }

     .films-cta-line-left,
     .films-cta-line-right {
         display: none;
     }
 }

 /* AWARDS */
 .awards-section {
     padding: 80px 60px;
     border-top: 1px solid var(--border);
     text-align: center;
 }

 .awards-eyebrow {
     font-size: 0.62rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 50px;
 }

 .awards-logos {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 60px;
     flex-wrap: wrap;
     opacity: 0.55;
 }

 .award-badge {
     font-family: 'Cormorant Garamond', serif;
     font-size: 0.85rem;
     letter-spacing: 0.15em;
     text-transform: uppercase;
     color: var(--gold-light);
     border: 1px solid var(--border);
     padding: 12px 24px;
 }

 /* TESTIMONIALS */
 .testimonials-section {
     padding: 30px 60px;
     border-top: 1px solid var(--border);
 }

 /* .testimonials-section h2 {
     text-align: center;
 } */

 .testimonials-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 3px;
     margin-top: 60px;
 }

 .testimonial-card {
     padding: 48px 36px;
     background: rgba(201, 169, 110, 0.03);
     border: 1px solid var(--border);
     transition: background 0.4s;
 }

 .testimonial-card:hover {
     background: rgba(201, 169, 110, 0.07);
 }

 .testimonial-quote {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.15rem;
     line-height: 1.7;
     color: black;
     margin-bottom: 32px;
     font-weight: 300;
     font-style: italic;
 }

 .testimonial-quote::before {
     content: '\201C';
     font-size: 2rem;
     color: var(--gold);
     line-height: 0;
     vertical-align: -0.5em;
     margin-right: 4px;
 }

 .testimonial-author {
     /* font-size: 0.65rem; */
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: black;
 }

 .testimonial-location {
     font-size: 0.62rem;
     color: black;
     margin-top: 4px;
     letter-spacing: 0.1em;
 }

 .testimonials-slider {
     overflow: hidden;
     margin-top: 60px;
 }

 .testimonials-track {
     display: flex;
     gap: 3px;
     transition: transform 0.6s ease-in-out;
 }

 /* Desktop: 3 cards visible */
 .testimonial-card {
     min-width: calc(100% / 3);
 }

 /* CONTACT */
 .contact-section {
     padding: 10px 60px;
     border-top: 1px solid var(--border);
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 100px;
     align-items: start;
 }

 /* subtext */
 .contact-subtext {
     color: var(--muted);
     font-size: 0.75rem;
 }

 /* extra text */
 .contact-extra-text {
     margin-top: 25px;
     font-size: 14px;
     color: black;
     line-height: 1.7;
     max-width: 400px;
 }

 /* button */
 .contact-btn {
     display: inline-block;
     margin-top: 20px;
     padding: 14px 32px;
     background: var(--gold);
     color: var(--charcoal);
     text-decoration: none;
     font-size: 0.65rem;
     letter-spacing: 0.35em;
     text-transform: uppercase;
     transition: all 0.3s ease;
 }

 .contact-btn:hover {
     background: black;
     transform: translateY(-2px);
 }

 .contact-info {
     padding-top: 10px;
 }

 .contact-info-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.5rem, 4vw, 4rem);
     font-weight: 300;
     line-height: 1.1;
     margin-bottom: 30px;
     color: black;
 }

 .contact-info-title em {
     font-style: italic;
     color: var(--gold);
 }

 .contact-info-desc {
     font-size: 0.85rem;
     line-height: 1.9;
     color: rgba(245, 240, 232, 0.6);
     margin-bottom: 50px;
 }

 .contact-details {
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 .contact-detail-item {
     display: flex;
     gap: 20px;
     align-items: flex-start;
     padding-bottom: 20px;
     border-bottom: 1px solid var(--border);
 }

 .contact-detail-item:last-child {
     border-bottom: none;
 }

 .contact-detail-label {
     font-size: 15px;
     letter-spacing: 0.4em;
     text-transform: uppercase;
     color: black;
     min-width: 70px;
     margin-top: 2px;
 }

 .contact-detail-val {
     font-size: 15px;
     color: black;
     line-height: 1.6;
 }

 .contact-detail-val a {
     color: black;
     text-decoration: none;
     transition: color 0.3s;
 }

 .contact-detail-val a:hover {
     color: var(--gold);
 }

 /* RIGHT IMAGE */
 .contact-image {
     width: 100%;
     height: 100%;
     position: relative;
 }

 .contact-image img {
     width: 100%;
     height: 93%;
     object-fit: cover;
     border-radius: 8px;
 }

 @media (max-width: 768px) {
     .contact-section {
         grid-template-columns: 1fr;
     }

     .contact-image {
         order: -1;
         /* image upar dikhane ke liye */
         height: 300px;
     }
 }


 /* FOOTER */
 footer {
     padding: 30px 20px;
     border-top: 1px solid var(--border);
     display: grid;
     grid-template-columns: 1fr auto 1fr;
     align-items: center;
     gap: 40px;
 }

 .footer-logo {
     /* font-family: 'Cormorant Garamond', serif; */
     font-size: 1.1rem;
     letter-spacing: 0.25em;
     text-transform: uppercase;
     color: black;
 }

 .footer-logo span {
     display: block;
     /* font-size: 0.55rem; */
     font-size: 11px;
     /* letter-spacing: 0.5em; */
     letter-spacing: 3px;
     color: black;
     /* font-family: 'Jost', sans-serif; */
 }

 .footer-links {
     display: flex;
     gap: 32px;
     justify-content: center;
 }

 .footer-links a {
     /* font-size: 0.62rem; */
     font-size: 12px;
     letter-spacing: 0.25em;
     text-transform: uppercase;
     color: black;
     text-decoration: none;
     transition: color 0.3s;
 }

 .footer-links a:hover {
     color: var(--gold);
 }

 .footer-right {
     text-align: right;
 }

 .social-links {
     display: flex;
     gap: 18px;
     justify-content: flex-end;
 }

 .social-links a {
     width: 36px;
     height: 36px;
     border: 1px solid var(--border);
     display: flex;
     align-items: center;
     justify-content: center;
     color: black;
     text-decoration: none;
     font-size: 0.65rem;
     letter-spacing: 0.1em;
     transition: border-color 0.3s, color 0.3s;
 }

 .social-links a:hover {
     border-color: var(--gold);
     color: var(--gold);
 }

 .social-links a i {
     font-size: 14px;
 }

 .social-links a:hover i.fa-instagram {
     color: #e1306c;
 }

 .social-links a:hover i.fa-youtube {
     color: #ff0000;
 }

 .social-links a:hover i.fa-facebook-f {
     color: #1877f2;
 }

 .footer-copy {
     margin-top: 12px;
     font-size: 0.6rem;
     color: black;
     letter-spacing: 0.1em;
 }

 /* SCROLL PROGRESS */
 .progress-bar {
     position: fixed;
     top: 0;
     left: 0;
     height: 2px;
     background: var(--gold);
     z-index: 999;
     transform-origin: left;
     transform: scaleX(0);
     transition: transform 0.1s linear;
 }

 /* PAGE LOADER */
 .loader {
     position: fixed;
     inset: 0;
     background: var(--charcoal);
     z-index: 1000;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 24px;
     transition: opacity 0.8s, visibility 0.8s;
 }

 .loader.hidden {
     opacity: 0;
     visibility: hidden;
 }

 .loader-logo {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.8rem;
     letter-spacing: 0.35em;
     text-transform: uppercase;
     color: var(--gold);
 }

 .loader-bar {
     width: 200px;
     height: 1px;
     background: var(--border);
     position: relative;
     overflow: hidden;
 }

 .loader-bar::after {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: var(--gold);
     animation: loadAnim 1.4s ease forwards;
 }

 @keyframes loadAnim {
     to {
         left: 0;
     }
 }

 /* FADE IN */
 .fade-in {
     opacity: 0;
     transform: translateY(30px);
     transition: opacity 0.9s, transform 0.9s;
 }

 .fade-in.visible {
     opacity: 1;
     transform: translateY(0);
 }

 /* RESPONSIVE */
 /* RESPONSIVE */

 /* Tablet */
 @media (max-width: 1024px) {
     nav {
         padding: 20px 24px;
     }

     nav.scrolled {
         padding: 14px 24px;
     }

     .nav-links {
         display: none;
     }

     .nav-cta {
         display: none;
     }

     .hamburger {
         display: flex;
     }

     .nav-logo {
         font-size: 1.1rem;
         letter-spacing: 0.1em;
         max-width: 70vw;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }

     .nav-logo span {
         letter-spacing: 0.25em;
         font-size: 0.55rem;
     }

     .hero-content {
         padding: 0 24px;
         max-width: 100%;
     }

     .slide-dots {
         right: 16px;
         bottom: 60px;
     }

     .about-editorial {
         grid-template-columns: 1fr 1.2fr 1fr;
         min-height: 420px;
     }

     .about-center-col {
         padding: 36px 24px;
     }

     .about-big-heading {
         font-size: clamp(1.6rem, 4vw, 2.8rem);
     }

     .about-strip {
         grid-template-columns: 1fr;
         gap: 16px;
         padding: 56px 24px;
     }

     .stats-bar {
         grid-template-columns: repeat(2, 1fr);
         gap: 0;
         padding: 40px 24px;
     }

     .stat-item {
         padding: 20px 16px;
     }

     .stat-item:nth-child(2) {
         border-right: none;
     }

     .stat-item:nth-child(3) {
         border-top: 1px solid var(--border);
     }

     .stat-item:nth-child(4) {
         border-right: none;
         border-top: 1px solid var(--border);
     }

     .stat-num {
         font-size: 3rem;
     }

     .portfolio-section {
         padding: 60px 24px;
     }

     .portfolio-grid {
         grid-template-columns: 1fr 1fr;
     }

     .portfolio-item:nth-child(1),
     .portfolio-item:nth-child(4) {
         grid-row: auto;
         aspect-ratio: 3/4;
     }

     .films-section {
         padding: 60px 24px;
     }

     .film-info-title {
         font-size: 1.3rem;
         white-space: nowrap;
     }

     .film-info-sub {
         font-size: 0.55rem;
         letter-spacing: 0.25em;
     }

     .awards-section {
         padding: 60px 24px;
     }

     .awards-logos {
         gap: 16px;
     }

     .testimonials-section {
         padding: 60px 24px;
     }

     .testimonials-grid {
         grid-template-columns: 1fr;
         gap: 12px;
     }

     .testimonial-card {
         min-width: 100%;
     }

     .contact-section {
         grid-template-columns: 1fr;
         gap: 50px;
         padding: 60px 24px;
     }

     footer {
         grid-template-columns: 1fr;
         text-align: center;
         padding: 48px 24px;
         gap: 28px;
     }

     .footer-links {
         flex-wrap: wrap;
         justify-content: center;
         gap: 20px;
     }

     .social-links {
         justify-content: center;
     }

     .footer-right {
         text-align: center;
     }
 }

 /* Mobile */
 @media (max-width: 640px) {
     nav {
         padding: 18px 20px;
     }

     nav.scrolled {
         padding: 14px 20px;
     }

     .nav-logo {
         font-size: 0.95rem;
         letter-spacing: 0.08em;
     }

     .nav-logo span {
         display: none;
     }

     .hero {
         padding-bottom: 60px;
     }

     .hero-content {
         padding: 0 20px;
         width: 100%;
     }

     .hero-eyebrow {
         font-size: 0.58rem;
         letter-spacing: 0.3em;
     }

     .hero-title {
         font-size: clamp(2.2rem, 8vw, 3rem);
     }

     .hero-desc {
         font-size: 0.8rem;
         max-width: 100%;
     }

     .hero-actions {
         flex-direction: column;
         align-items: flex-start;
         gap: 12px;
     }

     .btn-primary,
     .btn-outline {
         padding: 13px 28px;
         font-size: 0.63rem;
     }

     .slide-dots {
         right: 12px;
         bottom: 50px;
     }

     .about-editorial {
         grid-template-columns: 1fr;
         min-height: auto;
     }

     .about-img-col {
         height: 400px;
     }

     /* .about-img-col:last-child {
         display: none;
     } */

     .about-center-col {
         padding: 12px 20px;

     }

     .about-big-heading {
         font-size: clamp(1.6rem, 7vw, 2.4rem);
         margin-bottom: -2px;
     }

     .about-body-text {
         max-width: 100%;
         font-size: 0.8rem;
         margin-bottom: 3px;
     }

     .about-strip {
         padding: 48px 20px;
     }

     .about-strip-text {
         font-size: 1.2rem;
     }

     .stats-bar {
         grid-template-columns: 1fr 1fr;
         padding: 32px 20px;
     }

     .stat-item {
         padding: 16px 12px;
     }

     .stat-num {
         font-size: 2.4rem;
     }

     .stat-label {
         font-size: 0.55rem;
         letter-spacing: 0.15em;
     }

     .portfolio-section {
         padding: 48px 20px;
     }

     .portfolio-grid {
         grid-template-columns: 1fr;
     }

     .portfolio-item:nth-child(1),
     .portfolio-item:nth-child(4) {
         grid-row: auto;
         aspect-ratio: 3/4;
     }

     .section-title {
         font-size: clamp(2rem, 7vw, 2.8rem);
     }

     .films-section {
         padding: 48px 20px;
     }

     .film-thumb {
         aspect-ratio: 16/9;
     }

     .film-play-btn {
         width: 60px;
         height: 60px;
     }

     .film-info {
         bottom: 16px;
         width: 90%;
         left: 50%;
         transform: translateX(-50%);
     }

     .film-info-title {
         font-size: 1.1rem;
         white-space: normal;
     }

     .film-info-sub {
         font-size: 0.5rem;
         letter-spacing: 0.2em;
     }

     .awards-section {
         padding: 48px 20px;
     }

     .awards-logos {
         gap: 10px;
     }

     .award-badge {
         padding: 10px 14px;
         font-size: 0.72rem;
         letter-spacing: 0.1em;
     }

     .testimonials-section {
         padding: 48px 20px;
     }

     .testimonial-card {
         padding: 32px 24px;
     }

     .contact-section {
         padding: 48px 20px;
         gap: 40px;
     }

     .contact-info-title {
         font-size: clamp(2rem, 7vw, 2.6rem);
     }

     .form-row {
         grid-template-columns: 1fr;
     }

     .form-submit {
         width: 100%;
         text-align: center;
         padding: 16px 20px;
     }

     footer {
         padding: 40px 20px;
         gap: 24px;
     }

     .footer-links {
         gap: 16px;
     }

     .footer-logo {
         font-size: 0.9rem;
     }
 }

 /* film css */
 /* ═══ FILMS GALLERY SECTION ═══ */
 .fl-section {
     padding: 40px 52px 100px;
     background: #ffffff;
     overflow: hidden;
     position: relative;
 }

 .fl-section::before {
     content: '';
     display: block;
     position: absolute;
     top: 0;
     left: 52px;
     right: 52px;
     height: 1px;
     background: rgba(201, 169, 110, 0.22);
 }

 .fl-header {
     display: flex;
     justify-content: space-between;
     align-items: flex-end;
     margin-bottom: 56px;
     flex-wrap: wrap;
     gap: 16px;
 }

 .fl-eyebrow {
     font-size: 0.58rem;
     letter-spacing: 0.55em;
     text-transform: uppercase;
     color: black;
     font-weight: 300;
     margin-bottom: 14px;
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .fl-eyebrow::before {
     content: '';
     display: block;
     width: 28px;
     height: 1px;
     background: black;
     opacity: 0.6;
 }

 .fl-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.4rem, 5vw, 4.4rem);
     font-weight: 300;
     line-height: 0.95;
     color: black;
     letter-spacing: -0.01em;
     text-align: center;
 }

 .fl-title span {
     color: var(--gold);
 }

 .fl-title-row2 {
     display: flex;
     align-items: baseline;
     gap: 16px;
     margin-top: 2px;
 }

 .fl-title-italic {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.8rem, 5.8vw, 5rem);
     font-style: italic;
     font-weight: 300;
     color: var(--gold);
     letter-spacing: -0.01em;
     line-height: 0.95;
 }

 .fl-title-plain {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2.4rem, 5vw, 4.4rem);
     font-weight: 300;
     color: var(--cream);
     letter-spacing: -0.01em;
     line-height: 0.95;
 }

 .fl-header-right {
     display: flex;
     flex-direction: column;
     align-items: flex-end;
     gap: 10px;
 }

 .fl-count {
     font-family: 'Cormorant Garamond', serif;
     font-size: 3.2rem;
     font-weight: 300;
     color: black;
     line-height: 1;
     letter-spacing: -0.02em;
     user-select: none;
 }

 .fl-view-all {
     font-size: 0.6rem;
     letter-spacing: 0.38em;
     text-transform: uppercase;
     color: black;
     text-decoration: none;
     font-weight: 300;
     border-bottom: 1px solid rgb(0, 0, 0);
     padding-bottom: 3px;
     white-space: nowrap;
     transition: border-color 0.3s, opacity 0.3s;
 }

 .fl-view-all:hover {
     border-color: var(--gold);
     opacity: 0.8;
 }

 .fl-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 6px;
 }

 .fl-card {
     position: relative;
     overflow: hidden;
     cursor: pointer;
     aspect-ratio: 16/9;
     background: #0a0806;
 }

 .fl-thumb {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.5s;
     filter: brightness(0.7) saturate(0.85);
 }

 .fl-card:hover .fl-thumb {
     transform: scale(1.04);
     filter: brightness(0.45) saturate(0.7);
 }

 .fl-card-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(10, 8, 6, 0) 30%, rgba(10, 8, 6, 0.72) 100%);
     transition: background 0.5s;
 }

 .fl-card:hover .fl-card-overlay {
     background: rgba(10, 8, 6, 0.55);
 }

 .fl-corner {
     position: absolute;
     top: 20px;
     left: 20px;
     width: 28px;
     height: 28px;
     border-top: 1px solid var(--gold);
     border-left: 1px solid var(--gold);
     opacity: 0;
     transition: opacity 0.4s 0.1s;
 }

 .fl-corner-br {
     position: absolute;
     bottom: 20px;
     right: 20px;
     width: 28px;
     height: 28px;
     border-bottom: 1px solid var(--gold);
     border-right: 1px solid var(--gold);
     opacity: 0;
     transition: opacity 0.4s 0.1s;
 }

 .fl-card:hover .fl-corner,
 .fl-card:hover .fl-corner-br {
     opacity: 1;
 }

 .fl-card-meta {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     padding: 24px 26px 22px;
     background: linear-gradient(to top, rgba(10, 8, 6, 0.95) 0%, transparent 100%);
     transform: translateY(6px);
     opacity: 0.9;
     transition: transform 0.4s, opacity 0.4s;
 }

 .fl-card:hover .fl-card-meta {
     transform: translateY(0);
     opacity: 1;
 }

 .fl-card-num {
     font-size: 0.55rem;
     letter-spacing: 0.45em;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 300;
     margin-bottom: 6px;
 }

 .fl-card-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(1.1rem, 2.2vw, 1.55rem);
     font-weight: 400;
     color: #faf8f4;
     line-height: 1.15;
 }

 .fl-card-sub {
     font-size: 0.6rem;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: rgba(201, 169, 110, 0.7);
     margin-top: 5px;
     font-weight: 300;
 }

 .fl-play {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -60%) scale(0.85);
     width: 66px;
     height: 66px;
     border: 1.5px solid rgba(201, 169, 110, 0.6);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.3s, background 0.3s;
     opacity: 0;
 }

 .fl-play-inner {
     width: 0;
     height: 0;
     border-style: solid;
     border-width: 9px 0 9px 17px;
     border-color: transparent transparent transparent var(--gold);
     margin-left: 4px;
     transition: border-color 0.3s;
 }

 .fl-card:hover .fl-play {
     opacity: 1;
     transform: translate(-50%, -50%) scale(1);
 }

 .fl-card:hover .fl-play:hover {
     background: var(--gold);
     border-color: var(--gold);
     transform: translate(-50%, -50%) scale(1.08);
 }

 .fl-card:hover .fl-play:hover .fl-play-inner {
     border-left-color: #0e0c0a;
 }

 .fl-duration {
     position: absolute;
     top: 18px;
     right: 18px;
     font-size: 0.6rem;
     letter-spacing: 0.15em;
     color: rgba(245, 240, 232, 0.75);
     font-weight: 300;
     background: rgba(10, 8, 6, 0.6);
     padding: 4px 10px;
     border: 1px solid rgba(201, 169, 110, 0.2);
     opacity: 0;
     transition: opacity 0.3s;
 }

 .fl-card:hover .fl-duration {
     opacity: 1;
 }

 /* Modal */
 .fl-modal-wrap {
     display: none;
     position: fixed;
     inset: 0;
     z-index: 9000;
     background: rgba(10, 8, 6, 0.96);
     align-items: center;
     justify-content: center;
     padding: 20px;
 }

 .fl-modal-wrap.open {
     display: flex;
 }

 .fl-modal {
     position: relative;
     width: 100%;
     max-width: 1000px;
     background: #0a0806;
     border: 1px solid rgba(201, 169, 110, 0.22);
 }

 .fl-modal-close {
     position: absolute;
     top: -44px;
     right: 0;
     background: none;
     border: none;
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 8px;
     color: rgba(245, 240, 232, 0.55);
     font-family: 'Jost', sans-serif;
     font-size: 0.62rem;
     letter-spacing: 0.35em;
     text-transform: uppercase;
     font-weight: 300;
     transition: color 0.3s;
     padding: 0;
 }

 .fl-modal-close:hover {
     color: var(--gold);
 }

 .fl-close-icon {
     width: 18px;
     height: 18px;
     position: relative;
     flex-shrink: 0;
 }

 .fl-close-icon::before,
 .fl-close-icon::after {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     width: 18px;
     height: 1px;
     background: currentColor;
 }

 .fl-close-icon::before {
     transform: translate(-50%, -50%) rotate(45deg);
 }

 .fl-close-icon::after {
     transform: translate(-50%, -50%) rotate(-45deg);
 }

 .fl-modal-video {
     position: relative;
     width: 100%;
     padding-bottom: 56.25%;
     overflow: hidden;
 }

 .fl-modal-video video,
 .fl-modal-video iframe {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     border: none;
     display: block;
 }

 .fl-modal-footer {
     padding: 18px 26px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     border-top: 1px solid rgba(201, 169, 110, 0.22);
     flex-wrap: wrap;
     gap: 10px;
 }

 .fl-modal-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.3rem;
     font-weight: 400;
     color: #faf8f4;
 }

 .fl-modal-sub {
     font-size: 0.6rem;
     letter-spacing: 0.28em;
     text-transform: uppercase;
     color: var(--gold);
     margin-top: 3px;
     font-weight: 300;
 }

 .fl-modal-nav {
     display: flex;
     gap: 6px;
 }

 .fl-nav-btn {
     width: 36px;
     height: 36px;
     border: 1px solid rgba(201, 169, 110, 0.22);
     background: none;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: border-color 0.3s, background 0.3s;
 }

 .fl-nav-btn:hover {
     border-color: var(--gold);
     background: rgba(201, 169, 110, 0.1);
 }

 .fl-nav-arrow {
     width: 0;
     height: 0;
     border-style: solid;
 }

 .fl-nav-btn.prev .fl-nav-arrow {
     border-width: 5px 8px 5px 0;
     border-color: transparent var(--gold) transparent transparent;
 }

 .fl-nav-btn.next .fl-nav-arrow {
     border-width: 5px 0 5px 8px;
     border-color: transparent transparent transparent var(--gold);
 }

 /* Responsive */
 @media (max-width: 900px) {
     .fl-section {
         padding: 64px 32px 72px;
     }

     .fl-section::before {
         left: 32px;
         right: 32px;
     }
 }

 @media (max-width: 640px) {
     .fl-section {
         padding: 48px 16px 56px;
     }

     .fl-section::before {
         left: 16px;
         right: 16px;
     }

     .fl-grid {
         grid-template-columns: 1fr;
         gap: 5px;
     }

     .fl-card {
         aspect-ratio: 4/3;
     }

     .fl-header {
         margin-bottom: 36px;
     }

     .fl-modal-wrap {
         padding: 12px;
     }

     .fl-modal-close {
         top: -38px;
     }

     .fl-modal-footer {
         padding: 14px 16px;
     }
 }

 @media (max-width: 420px) {
     .fl-card {
         aspect-ratio: 3/2;
     }

     .fl-card-meta {
         padding: 18px 16px 16px;
     }
 }

 /* title cetnter css */
 /* ONLY DESKTOP CENTER ALIGN */
 @media (min-width: 901px) {
     .fl-header {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .fl-header-right {
         align-items: center;
     }
 }

 /* Very small screens */
 /* @media (max-width: 380px) {
     .nav-logo {
         font-size: 0.85rem;
         max-width: 65vw;
     }

     .hero-title {
         font-size: 2rem;
     }

     .stat-num {
         font-size: 2rem;
     }

     .award-badge {
         font-size: 0.65rem;
         padding: 8px 10px;
     }
 } */

 html,
 body {
     overflow-x: hidden !important;
     max-width: 100% !important;
 }

 /* Har element ko limit karo */
 * {
     max-width: 100%;
 }

 /* Images & media safe */
 img,
 video {
     max-width: 100%;
     height: auto;
     display: block;
 }

 /* Kisi bhi element ka overflow cut */
 /* section,
 div {
     overflow-x: hidden;
 } */


 /* form css popup */
 /* ═══ CONTACT POPUP ═══ */
 .ctp-backdrop {
     display: none;
     position: fixed;
     inset: 0;
     z-index: 8000;
     background: rgba(10, 8, 6, 0.88);
     align-items: center;
     justify-content: center;
     padding: 20px;
     animation: ctpFadeIn 0.35s ease forwards;
 }

 .ctp-backdrop.open {
     display: flex;
 }

 @keyframes ctpFadeIn {
     from {
         opacity: 0;
     }

     to {
         opacity: 1;
     }
 }

 .ctp-modal {
     position: relative;
     width: 100%;
     max-width: 760px;
     background: black;
     border: 1px solid rgba(201, 169, 110, 0.22);
     display: grid;
     grid-template-columns: 1fr 1.4fr;
     overflow: hidden;
     max-height: 90vh;
     overflow-y: auto;
     animation: ctpSlideUp 0.42s cubic-bezier(0.34, 1.2, 0.64, 1) forwards;
 }

 @keyframes ctpSlideUp {
     from {
         opacity: 0;
         transform: translateY(28px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 /* Left Panel */
 .ctp-left {
     background: var(--charcoal2, #0e0c0a);
     padding: 48px 36px;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     position: relative;
     overflow: hidden;
 }

 .ctp-left-img {
     position: absolute;
     inset: 0;
     background-image: url('your-image.jpg');
     background-size: cover;
     background-position: center;
     filter: brightness(0.25) saturate(0.6);
 }

 .ctp-left-content {
     position: relative;
     z-index: 1;
 }

 .ctp-left-eyebrow {
     font-size: 0.55rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 300;
     margin-bottom: 20px;
 }

 .ctp-left-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(1.8rem, 3vw, 2.6rem);
     font-weight: 300;
     line-height: 1.05;
     color: var(--warm-white);
 }

 .ctp-left-title em {
     font-style: italic;
     color: var(--gold);
     display: block;
 }

 .ctp-left-rule {
     width: 36px;
     height: 1px;
     background: var(--gold);
     opacity: 0.7;
     margin: 22px 0;
 }

 .ctp-left-desc {
     font-size: 0.78rem;
     line-height: 1.85;
     color: rgba(245, 240, 232, 0.55);
     margin-bottom: 36px;
 }

 .ctp-left-info {
     display: flex;
     flex-direction: column;
     gap: 14px;
     position: relative;
     z-index: 1;
 }

 .ctp-info-item {
     display: flex;
     align-items: flex-start;
     gap: 12px;
 }

 .ctp-info-dot {
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--gold);
     margin-top: 5px;
     flex-shrink: 0;
 }

 .ctp-info-label {
     font-size: 0.58rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--gold);
 }

 .ctp-info-val {
     font-size: 0.78rem;
     color: rgba(245, 240, 232, 0.7);
     margin-top: 2px;
     line-height: 1.5;
 }

 .ctp-info-val a {
     color: rgba(245, 240, 232, 0.7);
     text-decoration: none;
 }

 /* Right Panel */
 .ctp-right {
     padding: 44px 40px;
     position: relative;
 }

 .ctp-close {
     position: absolute;
     top: 20px;
     right: 22px;
     background: none;
     border: none;
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 7px;
     color: rgba(245, 240, 232, 0.4);
     font-family: 'Jost', sans-serif;
     font-size: 0.58rem;
     letter-spacing: 0.32em;
     text-transform: uppercase;
     transition: color 0.3s;
     padding: 0;
 }

 .ctp-close:hover {
     color: var(--gold);
 }

 .ctp-close-x {
     width: 16px;
     height: 16px;
     position: relative;
     flex-shrink: 0;
 }

 .ctp-close-x::before,
 .ctp-close-x::after {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     width: 16px;
     height: 1px;
     background: currentColor;
 }

 .ctp-close-x::before {
     transform: translate(-50%, -50%) rotate(45deg);
 }

 .ctp-close-x::after {
     transform: translate(-50%, -50%) rotate(-45deg);
 }

 .ctp-form-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.5rem;
     font-weight: 400;
     color: var(--cream);
     margin-bottom: 6px;
     margin-top: 8px;
 }

 .ctp-form-sub {
     font-size: 0.68rem;
     color: var(--muted);
     letter-spacing: 0.08em;
     margin-bottom: 28px;
 }

 /* Form fields */
 .ctp-form {
     display: flex;
     flex-direction: column;
     gap: 0;
 }

 .ctp-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 14px;
     margin-bottom: 14px;
 }

 .ctp-group {
     display: flex;
     flex-direction: column;
     margin-bottom: 14px;
 }

 .ctp-label {
     font-size: 0.56rem;
     letter-spacing: 0.38em;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 300;
     margin-bottom: 8px;
 }

 .ctp-input,
 .ctp-select,
 .ctp-textarea {
     width: 100%;
     background: rgba(201, 169, 110, 0.04);
     border: none;
     border-bottom: 1px solid rgba(201, 169, 110, 0.22);
     color: var(--cream);
     font-family: 'Jost', sans-serif;
     font-size: 0.82rem;
     font-weight: 300;
     padding: 11px 0;
     outline: none;
     transition: border-color 0.3s, background 0.3s;
     appearance: none;
     -webkit-appearance: none;
     border-radius: 0;
 }

 .ctp-input::placeholder,
 .ctp-textarea::placeholder {
     color: rgba(245, 240, 232, 0.22);
 }

 .ctp-input:focus,
 .ctp-select:focus,
 .ctp-textarea:focus {
     border-color: var(--gold);
     background: rgba(201, 169, 110, 0.06);
 }

 .ctp-select {
     color: rgba(245, 240, 232, 0.45);
     cursor: pointer;
 }

 .ctp-select option {
     background: black;
     color: var(--cream);
 }

 .ctp-select.selected {
     color: var(--cream);
     background: rgba(10, 8, 6, 0.88);
 }

 .ctp-textarea {
     resize: none;
     height: 80px;
 }

 .ctp-submit-row {
     margin-top: 22px;
     display: flex;
     align-items: center;
     gap: 18px;
     flex-wrap: wrap;
 }

 .ctp-submit {
     background: var(--gold);
     color: var(--charcoal);
     border: none;
     font-family: 'Jost', sans-serif;
     font-size: 0.65rem;
     letter-spacing: 0.38em;
     text-transform: uppercase;
     padding: 14px 36px;
     cursor: pointer;
     font-weight: 400;
     transition: background 0.3s, transform 0.2s;
 }

 .ctp-submit:hover {
     background: var(--gold-light);
     transform: translateY(-2px);
 }

 .ctp-submit:disabled {
     opacity: 0.5;
     cursor: not-allowed;
     transform: none;
 }

 .ctp-privacy {
     font-size: 0.6rem;
     color: var(--muted);
     line-height: 1.6;
 }

 .ctp-msg {
     font-size: 10px;
     padding: 10px 14px;
     margin-top: 12px;
     display: none;
 }

 .ctp-msg.error {
     border-left: 2px solid #c05050;
     color: #e8a8a8;
     background: rgba(200, 80, 80, 0.1);
     display: block;
 }

 /* Success */
 .ctp-success {
     display: none;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     text-align: center;
     padding: 40px 24px;
     min-height: 300px;
 }

 .ctp-success.show {
     display: flex;
 }

 .ctp-success-icon {
     width: 52px;
     height: 52px;
     border: 1px solid var(--gold);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 22px;
 }

 .ctp-check {
     width: 14px;
     height: 8px;
     border-left: 2px solid var(--gold);
     border-bottom: 2px solid var(--gold);
     transform: rotate(-45deg) translate(2px, -3px);
 }

 .ctp-success-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.8rem;
     font-weight: 300;
     color: var(--cream);
     margin-bottom: 10px;
 }

 .ctp-success-title em {
     font-style: italic;
     color: var(--gold);
 }

 .ctp-success-text {
     font-size: 0.78rem;
     color: var(--muted);
     line-height: 1.8;
     max-width: 280px;
 }

 /* Responsive */
 @media (max-width: 700px) {
     .ctp-modal {
         grid-template-columns: 1fr;
     }

     .ctp-left {
         display: none;
     }

     .ctp-right {
         padding: 48px 24px 36px;
     }

     .ctp-row {
         grid-template-columns: 1fr;
         gap: 0;
     }
 }

 @media (max-width: 420px) {
     .ctp-backdrop {
         padding: 0;
     }

     .ctp-modal {
         max-height: 100vh;
         border: none;
     }

     .ctp-right {
         padding: 52px 20px 32px;
     }

     .ctp-submit {
         width: 100%;
         text-align: center;
     }
 }