:root {
     --gold: #C9A84C;
     /* --gold-light: #F0C060;
     --gold-bright: #FFD700;
     --gold-dark: #8B6914; */
     --black: #0A0A0A;
     --dark: #111111;
     --dark2: #1A1A1A;
     --dark3: #222222;
     --cream: #F5EDD6;
     --white: #FFFFFF;
     --text-muted: #999;
     --border-gold: rgba(201, 168, 76, 0.3);


     /* Primary Gold Shades */
     --gold-primary: #D4AF37;
     /* luxury gold */
     --gold-bright: #FFD700;
     /* highlight gold */
     --gold-soft: #E6C76A;
     /* soft glow gold */
     --gold-light: #F5D97A;
     /* hover gold */
     --gold-dark: #8C6A1C;
     /* dark metallic gold */

     /* Background Colors */
     --black-main: #050505;
     /* main background */
     --black-soft: #0D0D0D;
     /* section background */
     --black-card: #141414;
     /* card background */
     --black-border: #1F1F1F;
     /* subtle borders */

     /* Text Colors */
     --text-white: #FFFFFF;
     --text-cream: #F8F4E3;
     /* premium cream text */
     --text-muted: #A8A8A8;

     /* Effects */
     --gold-glow: rgba(255, 215, 0, 0.35);
     --gold-border: rgba(212, 175, 55, 0.4);

     /* Gold Palette (exact from brief) */
     --gold: #C9A84C;
     --gold-primary: #D4AF37;
     --gold-bright: #FFD700;
     --gold-soft: #E6C76A;
     --gold-light: #F5D97A;
     --gold-dark: #8C6A1C;
     --cream: #F5EDD6;

     /* Backgrounds */
     --black-main: #050505;
     --black-soft: #0D0D0D;
     --black-card: #141414;
     --black-border: #1F1F1F;

     /* Text */
     --text-white: #FFFFFF;
     --text-cream: #F8F4E3;
     --text-muted: #A8A8A8;

     /* Effects */
     --gold-glow: rgba(255, 215, 0, 0.35);
     --gold-border: rgba(212, 175, 55, 0.35);
     --gold-dim: rgba(201, 168, 76, 0.10);
     --gold-dim2: rgba(201, 168, 76, 0.05);

     /* Typography */
     --font-display: 'Playfair Display', Georgia, serif;
     --font-body: 'DM Sans', system-ui, sans-serif;

     /* Shape */
     --radius-card: 20px;
     --radius-pill: 999px;

     /* Shadows */
     --shadow-card: 0 12px 48px rgba(0, 0, 0, 0.65);
     --shadow-glow: 0 8px 56px rgba(212, 175, 55, 0.22);
     --shadow-soft: 0 4px 24px rgba(0, 0, 0, 0.45);

     /* Easing */
     --ease: cubic-bezier(0.4, 0, 0.2, 1);
 }

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

 /* html,body{
    overflow-x: hidden !important;
 } */

 html {
     scroll-behavior: smooth;
 }

 body {
     font-family: 'Barlow', sans-serif;
     background: var(--black);
     color: var(--white);
     overflow-x: hidden;
     cursor: none;
 }

 /* ===== CUSTOM CURSOR ===== */
 .cursor {
     width: 12px;
     height: 12px;
     background: var(--gold-bright);
     border-radius: 50%;
     position: fixed;
     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 99999;
     transform: translate(-50%, -50%);
     transition: transform 0.1s ease;
     mix-blend-mode: difference;
 }

 .cursor-follower {
     width: 36px;
     height: 36px;
     border: 1.5px solid var(--gold);
     border-radius: 50%;
     position: fixed;
     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 99998;
     transform: translate(-50%, -50%);
     transition: all 0.15s ease;
     opacity: 0.7;
 }

 /* ===== SCROLLBAR ===== */
 ::-webkit-scrollbar {
     width: 5px;
 }

 ::-webkit-scrollbar-track {
     background: var(--black);
 }

 ::-webkit-scrollbar-thumb {
     background: var(--gold);
     border-radius: 10px;
 }

 /* ===== NOISE OVERLAY ===== */
 /* body::before {
     content: '';
     position: fixed;
     inset: 0;
     background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
     pointer-events: none;
     z-index: 9997;
     opacity: 0.4;
 } */

 /* ===== TOP BAR ===== */
 .topbar {
     background: linear-gradient(90deg, var(--dark2), #1c1500, var(--dark2));
     border-bottom: 1px solid var(--border-gold);
     padding: 8px 0;
     font-size: 12px;
     color: #aaa;
     letter-spacing: 0.5px;
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     width: 100%;
     z-index: 1060;
 }

 .topbar a {
     color: var(--gold);
     text-decoration: none;
     transition: color 0.3s;
 }

 .topbar a:hover {
     color: var(--gold-bright);
 }

 .topbar .divider {
     color: var(--gold-dark);
     margin: 0 12px;
 }


 /* ===== NAVBAR ===== */
 .navbar {
     background: rgba(10, 10, 10, 0.95);
     backdrop-filter: blur(20px);
     -webkit-backdrop-filter: blur(20px);
     border-bottom: 1px solid var(--border-gold);
     padding: 14px 0;
     transition: all 0.4s ease;
     position: sticky;
     top: 0;
     z-index: 1000;
 }

 .navbar.scrolled {
     /* top: 0;
     z-index: 1000;
    position: sticky; */
     /* padding: 10px 0; */
     background: rgba(5, 5, 5, 0.98);
     box-shadow: 0 4px 40px rgba(201, 168, 76, 0.15);
 }

 .navbar-brand {
     display: flex;
     align-items: center;
     gap: 12px;
     text-decoration: none;
 }

 .logo {
     max-width: 300px;
 }

 /* .brand-icon {
            width: 44px;
            height: 44px;
            background: linear-gradient(135deg, var(--gold), var(--gold-dark));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 18px;
            color: var(--black);
            font-weight: 900;
            box-shadow: 0 0 20px rgba(201, 168, 76, 0.4);
        }

        .brand-text {
            line-height: 1.1;
        }

        .brand-name {
            font-family: 'Playfair Display', serif;
            font-size: 18px;
            color: var(--white);
            font-weight: 700;
        }

        .brand-sub {
            font-size: 10px;
            color: var(--gold);
            letter-spacing: 2px;
            text-transform: uppercase;
        } */

 .navbar-nav .nav-link {
     color: #ccc !important;
     font-size: 13px;
     font-weight: 500;
     letter-spacing: 1px;
     text-transform: uppercase;
     padding: 8px 16px !important;
     transition: all 0.3s;
     position: relative;
 }

 .navbar-nav .nav-link::after {
     content: '';
     position: absolute;
     bottom: 2px;
     left: 50%;
     right: 50%;
     height: 1px;
     background: var(--gold);
     transition: all 0.3s ease;
 }

 .navbar-nav .nav-link:hover {
     color: var(--gold) !important;
 }

 .navbar-nav .nav-link:hover::after {
     left: 16px;
     right: 16px;
 }

 .navbar-nav .nav-link.active {
     color: var(--gold) !important;
 }

 .btn-gold {
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     color: var(--black) !important;
     font-weight: 700;
     border: none;
     padding: 10px 24px;
     text-transform: uppercase;
     letter-spacing: 1.5px;
     font-size: 12px;
     border-radius: 2px;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
     text-decoration: none;
 }

 .btn-gold::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, var(--gold-bright), var(--gold));
     opacity: 0;
     transition: opacity 0.3s;
 }

 .btn-gold:hover::before {
     opacity: 1;
 }

 .btn-gold:hover {
     transform: translateY(-2px);
     box-shadow: 0 8px 25px rgba(201, 168, 76, 0.4);
 }

 .btn-gold span {
     position: relative;
     z-index: 1;
 }

 .btn-outline-gold {
     background: transparent;
     color: var(--gold) !important;
     border: 1px solid var(--gold);
     padding: 10px 24px;
     text-transform: uppercase;
     letter-spacing: 1.5px;
     font-size: 12px;
     border-radius: 2px;
     transition: all 0.3s;
     font-weight: 600;
 }

 .btn-outline-gold:hover {
     background: var(--gold);
     color: var(--black) !important;
     box-shadow: 0 8px 25px rgba(201, 168, 76, 0.3);
 }

 /* ===== HERO SECTION ===== */
 #hero {
     min-height: 100vh;
     /* background: radial-gradient(ellipse at 30% 50%, rgba(201,168,76,0.12) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 80%, rgba(139,105,20,0.08) 0%, transparent 50%),
              linear-gradient(135deg, #080500 0%, var(--black) 40%, #050501 100%); */
     background-image: url(./assets/img/earth-bg.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     position: relative;
     overflow: hidden;
     display: flex;
     align-items: center;
 }

 #hero::before {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(to right,
             rgba(0, 0, 0, 0.85),
             rgba(0, 0, 0, 0.45),
             rgba(0, 0, 0, 0.1));
     z-index: 1;
 }


 #hero::before {
     pointer-events: none;
 }


 /* .hero-particles {
     position: absolute;
     inset: 0;
     pointer-events: none;
     z-index: 0;
 }

 .hero-glow {
     position: absolute;
     right: -100px;
     top: 50%;
     transform: translateY(-50%);
     width: 700px;
     height: 700px;
     background: radial-gradient(circle, rgba(201, 168, 76, 0.15) 0%, transparent 70%);
     border-radius: 50%;
     pointer-events: none;
     z-index: 2;
 }

 #heroCanvas {
     position: absolute;
     right: 0;
     top: 0;
     width: 55%;
     height: 100%;
     pointer-events: none;
     z-index: 1;
     opacity: 0.9;
 } */


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

 .hero-content {
     position: relative;
     z-index: 2;
     padding: 30px 0 60px;
 }

 .hero-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: rgba(201, 168, 76, 0.1);
     border: 1px solid var(--border-gold);
     padding: 6px 16px;
     border-radius: 2px;
     font-size: 11px;
     letter-spacing: 2.5px;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 15px;
 }

 .hero-badge i {
     font-size: 9px;
     animation: pulse-dot 1.5s infinite;
 }

 @keyframes pulse-dot {

     0%,
     100% {
         opacity: 1;
         transform: scale(1)
     }

     50% {
         opacity: 0.5;
         transform: scale(1.3)
     }
 }

 .hero-title {
     /* font-family: 'Barlow Condensed', sans-serif; */
     font-family: Verdana, Geneva, Tahoma, sans-serif;
     /* font-family: Arial, Helvetica, sans-serif; */
     /* font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; */
     font-size: clamp(40px, 6vw, 60px);
     font-weight: 800;
     line-height: 1.0;
     text-transform: uppercase;
     letter-spacing: -1px;
     margin-bottom: 10px;
 }


 .hero-title {
     font-size: 56px;
     font-weight: 700;
     line-height: 1.2;
 }

 .typing-text {
     background: linear-gradient(90deg, #d4af37, #f7e7a1, #d4af37);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;

 }

 .hero-static {
     color: #fff;
 }

 .global-title {
     color: #d4af37;
 }

 .typed-cursor {
     color: #d4af37;
     font-weight: 300;
 }


 /* #typewriter::after {
    content: "|";
    animation: blink 1s infinite;
    margin-left: 5px;
}

@keyframes blink {
    0%,50%,100% { opacity: 1; }
    25%,75% { opacity: 0; }
} */

 /* .hero-title .line1 {
     display: block;
     color: var(--white);
 }

 .hero-title .line2 {
     display: block;
     color: var(--gold);
 }

 .hero-title .line3 {
     display: block;
     color: var(--white);
     font-size: 60%;
     font-weight: 600;
     letter-spacing: 2px;
     margin-top: 4px;
 } */

 .hero-desc {
     font-size: 16px;
     color: #bbb;
     line-height: 1.7;
     max-width: 520px;
     /* margin-bottom: 36px; */
     font-weight: 300;
     letter-spacing: 0.3px;
 }

 .hero-stats {
     display: flex;
     gap: 40px;
     margin-bottom: 25px;
 }

 /* .stat-item {} */

 .stat-num {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 42px;
     font-weight: 800;
     color: var(--gold);
     line-height: 1;
 }

 .stat-label {
     font-size: 11px;
     color: #888;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     margin-top: 4px;
 }

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



 /* ================================
   HERO RESPONSIVE
================================ */

 /* Large Desktop (1400px+) */
 @media (min-width:1400px) {

     /* .hero-title{
        font-size:64px;
    } */

     .hero-desc {
         font-size: 17px;
     }

     /* .consult-card {
         max-width: 420px;
         margin-left: auto;
     } */

 }


 /* Desktop & Laptop */
 @media (max-width:1200px) {

     /* .hero-title{
        font-size:52px;
    } */

     .hero-stats {
         gap: 30px;
     }

 }


 /* Tablet Landscape */
 @media (max-width:992px) {

     #hero {
         min-height: auto;
         /* padding:120px 0 80px; */
     }

     .hero-content {
         text-align: center;
         padding-bottom: 30px;
     }

     .hero-desc {
         margin-left: auto;
         margin-right: auto;
     }

     .hero-stats {
         justify-content: center;
     }

     .hero-actions {
         justify-content: center;
     }

     /* .consult-card {
         max-width: 500px;
         margin: auto;
     } */

 }


 /* Tablet Portrait */
 @media (max-width:768px) {

     /* .hero-title{
        font-size:42px;
        line-height:1.1;
    } */

     .hero-content {
         padding: 60px 0px 0 0;
     }

     .hero-desc {
         font-size: 15px;
     }

     .hero-stats {
         gap: 25px;
     }

     .stat-num {
         font-size: 34px;
     }

     /* .consult-card {
         padding: 30px 25px;
     } */

 }


 /* Mobile Large */
 @media (max-width:576px) {

     /* #hero{
        padding:0px 0 70px;
    } */

     /* .hero-title {
         font-size: clamp(38px, 6vw, 60px);
         line-height: 1.2;
     }

     .hero-content {
         padding: 50px 0 0px;
     } */

     /* .hero-badge {
         font-size: 10px;
         letter-spacing: 1.5px;
     } */


     .hero-stats {
         flex-direction: column;
         gap: 15px;
         align-items: center;
     }

     .stat-num {
         font-size: 30px;
     }

     .hero-actions {
         flex-direction: row;
         width: 100%;
     }

     .hero-actions .btn {
         width: 100%;
         text-align: center;
     }

     /* .consult-card {
         padding: 25px 20px;
     } */

     /* .phone-box {
         flex-direction: column;
         text-align: center;
         gap: 10px;
     } */

 }


 /* Small Mobile */
 @media (max-width:440px) {

     .hero-title {
         font-size: clamp(38px, 6vw, 60px);
         /* font-size:34px; */
         line-height: 1.2;
     }

     .hero-content {
         padding: 50px 0 0px 0;
     }


     .hero-desc {
         font-size: 15px;
         line-height: 1.6;
     }

     /* .hero-title {
         font-size: clamp(35px, 6vw, 52px);
     } */

     /* .hero-title{
        font-size:50px;
    } */
     /* 
    .hero-desc{
        font-size:13px;
    } */

     .stat-num {
         font-size: 26px;
     }

     /* .consult-card {
         padding: 20px 18px;
     } */

 }



 @media (max-width:768px) {

     #hero {
         background-position: center right;
     }

 }


 /* ===============================
   CONSULT CARD
================================*/

 .consult-card {
     background: linear-gradient(145deg, #1a1405, #0f0c03);
     border: 1px solid rgba(201, 168, 76, 0.6);
     border-radius: 6px;
     padding: 32px;
     position: relative;
     box-shadow: 0 25px 70px rgba(0, 0, 0, 0.7);
     width: 100%;
     max-width: 420px;
     margin-left: auto;
 }

 /* gold top border */

 .consult-card::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 3px;
     background: linear-gradient(90deg, #c9a84c, #ffd700, #c9a84c);
     pointer-events: none;
 }


 /* ===============================
   TEXT
================================*/

 .consult-card h4 {
     color: #FFD700;
     font-size: 22px;
     margin-bottom: 8px;
 }

 .consult-card p {
     font-size: 13px;
     color: #aaa;
     margin-bottom: 20px;
 }


 /* ===============================
   INPUTS
================================*/

 .form-control-dark {
     width: 100%;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(201, 168, 76, 0.25);
     border-radius: 3px;
     padding: 12px 14px;
     font-size: 13px;
     color: #fff;
     transition: all .3s ease;
 }

 .form-control-dark::placeholder {
     color: #777;
 }

 .form-control-dark:focus {
     border-color: #FFD700;
     background: rgba(255, 215, 0, 0.05);
     outline: none;
     box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.15);
 }


 /* ===============================
   BUTTON
================================*/

 .btn-gold {
     background: linear-gradient(90deg, #FFD700, #c9a84c);
     border: none;
     padding: 12px;
     font-size: 13px;
     font-weight: 600;
     color: #000;
     border-radius: 3px;
     transition: .3s;
 }

 .btn-gold:hover {
     background: linear-gradient(90deg, #c9a84c, #FFD700);
 }


 /* ===============================
   PHONE BOX
================================*/

 .phone-box {
     background: linear-gradient(90deg, #f5d77a, #e4b84d);
     margin-top: 20px;
     padding: 14px;
     display: flex;
     align-items: center;
     gap: 15px;
     border-radius: 4px;
 }

 .phone-icon {
     font-size: 18px;
     color: #000;
 }

 .phone-number {
     font-size: 20px;
     font-weight: 700;
     color: #000;
 }

 .phone-number small {
     display: block;
     font-size: 11px;
 }


 /* ===============================
   FOOTER
================================*/

 .consult-footer {
     margin-top: 20px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 15px;
 }

 .consult-text {
     font-size: 12px;
     color: #ccc;
 }

 .consult-text strong {
     color: #FFD700;
 }

 .qr img {
     width: 60px;
 }


 /* ===============================
   CONTACT CHIPS
================================*/

 .contact-chips {
     display: flex;
     flex-direction: column;
     gap: 10px;
     margin-top: 20px;
 }

 .contact-chip {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 12px;
     color: #aaa;
 }

 .contact-chip i {
     color: #FFD700;
 }

 .contact-chip a {
     color: #FFD700;
     text-decoration: none;
 }

 .contact-chip a:hover {
     color: #fff;
 }


 /* ===============================
   RESPONSIVE
================================*/


 /* Large Desktop */
 @media (min-width:1400px) {

     .consult-card {
         max-width: 450px;
     }

 }


 /* Laptop */
 @media (max-width:1200px) {

     .consult-card {
         max-width: 400px;
     }

 }


 /* Tablet */
 @media (max-width:992px) {

     .consult-card {
         margin: auto;
         max-width: 500px;
     }

 }


 /* Mobile */

 @media (max-width:768px) {

     .consult-card {
         padding: 26px;
     }

     /* .phone-box {
         flex-direction: column;
         text-align: center;
     } */

     /* .consult-footer {
         flex-direction: column;
         text-align: center;
     } */

 }


 /* Small Mobile */

 @media (max-width:480px) {

     .consult-card {
         padding: 22px;
     }

     .consult-card h4 {
         font-size: 20px;
     }

     .phone-number {
         font-size: 18px;
     }

     .qr img {
         width: 50px;
     }

 }


 /* Extra Small Mobile */

 @media (max-width:360px) {

     .consult-card {
         padding: 20px;
     }

     .phone-number {
         font-size: 16px;
     }

 }


 /* ===== CONSULTATION FORM CARD ===== */
 /* .consult-card {
            background: linear-gradient(145deg, rgba(26, 20, 5, 0.95), rgba(15, 12, 3, 0.98));
            border: 1px solid var(--border-gold);
            border-radius: 4px;
            padding: 32px;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6), 0 0 40px rgba(201, 168, 76, 0.08);
            position: relative;
            overflow: hidden;
        }

        .consult-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, var(--gold-dark), var(--gold-bright), var(--gold-dark));
        }

        .consult-card h4 {
            font-family: 'Playfair Display', serif;
            font-size: 20px;
            color: var(--gold-light);
            margin-bottom: 6px;
        }

        .consult-card p {
            font-size: 12px;
            color: #888;
            margin-bottom: 20px;
            line-height: 1.5;
        } */


 /* CONSULT CARD */

 /* CONSULT CARD */

 /* .consult-card {
     background: linear-gradient(145deg, #1a1405, #0f0c03);
     border: 1px solid rgba(201, 168, 76, 0.6);
     border-radius: 6px;
     padding: 32px;
     position: relative;
     box-shadow: 0 25px 70px rgba(0, 0, 0, 0.7);
 }


 .consult-card::before {
     pointer-events: none;
 }

 .consult-card::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 3px;
     background: linear-gradient(90deg, #c9a84c, #ffd700, #c9a84c);
     pointer-events: none;
 }


 .consult-card h4 {
     color: #FFD700;
     font-size: 22px;
     margin-bottom: 8px;
 }

 .consult-card p {
     font-size: 13px;
     color: #aaa;
     margin-bottom: 20px;
 }



 .form-control-dark {
     width: 100%;
     background: rgba(255, 255, 255, 0.05);
     border: 1px solid rgba(201, 168, 76, 0.3);
     background-color: white;
     border-radius: 3px;
     padding: 12px 14px;
     font-size: 13px;
     color: #fff;
 }

 .form-control-dark::placeholder {
     color: #777;
 }

 .form-control-dark:focus {
     border-color: #FFD700;
     background: rgba(255, 215, 0, 0.05);
     outline: none;
 }

 .form-control-dark {
     width: 100%;
     background: rgba(255, 255, 255, 0.05);
     border: 1px solid rgba(201, 168, 76, 0.3);
     border-radius: 3px;
     padding: 12px 14px;
     font-size: 13px;
     color: #fff;
     transition: all .3s ease;
 }

 .form-control-dark::placeholder {
     color: #888;
 }

 .form-control-dark:focus {
     border-color: #FFD700;
     background: rgba(255, 215, 0, 0.05);
     outline: none;
     box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.15);
 }


 .btn-gold {
     background: linear-gradient(90deg, #FFD700, #c9a84c);
     border: none;
     padding: 12px;
     font-size: 13px;
     font-weight: 600;
     color: #000;
     border-radius: 3px;
     transition: .3s;
 }

 .btn-gold:hover {
     background: linear-gradient(90deg, #c9a84c, #FFD700);
 }



 .contact-info {
     text-align: center;
     margin-top: 12px;
     font-size: 12px;
     color: #aaa;
 }

 

 .phone-box {
     background: linear-gradient(90deg, #f5d77a, #e4b84d);
     margin-top: 20px;
     padding: 14px;
     display: flex;
     align-items: center;
     gap: 15px;
     border-radius: 4px;
 }

 .phone-number {
     font-size: 20px;
     font-weight: 700;
     color: #000;
 }

 .phone-number small {
     display: block;
     font-size: 11px;
 }



 .consult-footer {
     margin-top: 20px;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .consult-text {
     font-size: 12px;
     color: #ccc;
 }

 .consult-text strong {
     color: #FFD700;
 }

 .qr img {
     width: 60px;
 }

 

 @media (max-width: 992px) {

     .consult-card {
         padding: 26px;
     }

 }


 @media (max-width: 768px) {

     .consult-footer {
         flex-direction: column;
         gap: 12px;
         text-align: center;
     }

     .phone-box {
         flex-direction: column;
         text-align: center;
     }

 }


 @media (max-width: 480px) {

     .consult-card {
         padding: 22px;
     }

     .consult-card h4 {
         font-size: 20px;
     }

     .phone-number {
         font-size: 18px;
     }

 }







 .form-control-dark {
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(201, 168, 76, 0.25);
     color: var(--white);
     border-radius: 2px;
     padding: 11px 16px;
     font-size: 13px;
     transition: all 0.3s;
     font-family: 'Barlow', sans-serif;
 }

 .form-control-dark:focus {
     background: rgba(201, 168, 76, 0.06);
     border-color: var(--gold);
     box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.1);
     color: var(--white);
     outline: none;
 }

 .form-control-dark::placeholder {
     color: #555;
 }

 .contact-chips {
     display: flex;
     flex-direction: column;
     gap: 10px;
     margin-top: 20px;
 }

 .contact-chip {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 12px;
     color: #aaa;
 }

 .contact-chip i {
     color: var(--gold);
     width: 16px;
 }

 .contact-chip a {
     color: var(--gold);
     text-decoration: none;
 }

 .contact-chip a:hover {
     color: var(--gold-bright);
 } */

 /* ===== SCROLL INDICATOR ===== */
 .scroll-hint {
     position: absolute;
     bottom: 30px;
     left: 50%;
     transform: translateX(-50%);
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 8px;
     z-index: 2;
 }

 .scroll-hint span {
     font-size: 10px;
     color: var(--gold);
     letter-spacing: 3px;
     text-transform: uppercase;
 }

 .scroll-line {
     width: 1px;
     height: 50px;
     background: linear-gradient(to bottom, var(--gold), transparent);
     animation: scrollDown 1.5s ease infinite;
 }

 @keyframes scrollDown {
     0% {
         height: 0;
         opacity: 1
     }

     100% {
         height: 50px;
         opacity: 0
     }
 }

 /* ===== SECTION STYLES ===== */
 .section-pad {
     padding: 20px 0;
 }


 /* .section-pad-sm {
     padding: 70px 0;
 } */



 .section-header {
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
     text-align: center;
 }

 .section-eyebrow {
     font-size: 15px;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--gold);
     font-weight: 600;
     margin-bottom: 8px;
     display: flex;
     /* justify-content: center;
     align-items: center; */
     justify-content: flex-start;
     gap: 12px;
 }

 .section-eyebrow::before {
     content: '';
     width: 30px;
     height: 1px;
     margin-top: 8px;
     background: var(--gold);
 }

 .section-title {
     /* font-family: 'Barlow Condensed', sans-serif; */
     font-family: Verdana, Geneva, Tahoma, sans-serif;
     font-size: clamp(25px, 3.5vw, 56px);
     /* font-size: clamp(32px, 4.5vw, 56px); */
     /* font-weight: 800; */
     font-weight: bold;
     /* text-transform: uppercase; */
     line-height: 1.05;
     letter-spacing: -0.5px;
 }


 .global-title {
     color: var(--gold-primary);
 }

 .section-title span {
     /* color: var(--gold); */
     color: var(--gold-primary);
 }

 .section-desc {
     font-size: 15px;
     color: #888;
     max-width: 600px;
     /* margin-top: 16px; */
     line-height: 1.7;
     text-align: center;
 }




 @media (max-width:576px) {
     /* .section-pad{
    padding: 30px 0;
   } */

     /* .section-eyebrow{
        font-size: 13px !important;
    } */

     /* .section-title {
        line-height: 1.10 !important;
      font-size: clamp(30px, 4vw, 56px) !important;
    } */

 }



 @media(max-width: 440px) {


     .section-eyebrow {
         font-size: 13px !important;
     }

     .section-title {
         line-height: 1.10 !important;
         font-size: clamp(30px, 4vw, 56px) !important;
     }

 }


 /* ===== SERVICES ===== */
 /* #services {
     background: var(--black);
 }

 .service-card {
     background: linear-gradient(145deg, rgba(25, 20, 8, 0.8), rgba(12, 10, 3, 0.9));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 36px 28px;
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     height: 100%;
 }

 .service-card::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: linear-gradient(90deg, transparent, var(--gold), transparent);
     transform: scaleX(0);
     transition: transform 0.4s ease;
 }

 .service-card:hover {
     border-color: rgba(201, 168, 76, 0.45);
     transform: translateY(-6px);
 }

 .service-card:hover::before {
     transform: scaleX(1);
 }

 .service-card:hover {
     box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 30px rgba(201, 168, 76, 0.08);
 }

 .service-icon {
     width: 64px;
     height: 64px;
     background: linear-gradient(135deg, rgba(201, 168, 76, 0.15), rgba(201, 168, 76, 0.05));
     border: 1px solid rgba(201, 168, 76, 0.3);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 24px;
     color: var(--gold);
     margin-bottom: 20px;
     transition: all 0.3s;
 }

 .service-card:hover .service-icon {
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     color: var(--black);
     box-shadow: 0 8px 25px rgba(201, 168, 76, 0.3);
 }

 .service-card h4 {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 20px;
     font-weight: 700;
     color: var(--white);
     text-transform: uppercase;
     letter-spacing: 0.5px;
     margin-bottom: 12px;
 }

 .service-card p {
     font-size: 13.5px;
     color: #888;
     line-height: 1.7;
 }

 .service-tags {
     display: flex;
     flex-wrap: wrap;
     gap: 6px;
     margin-top: 20px;
 }

 .service-tag {
     font-size: 10px;
     padding: 3px 10px;
     border-radius: 2px;
     background: rgba(201, 168, 76, 0.1);
     border: 1px solid rgba(201, 168, 76, 0.2);
     color: var(--gold);
     letter-spacing: 1px;
     text-transform: uppercase;
 } */


 /* ===== SERVICES ===== */
 #services {
     background: #050505;
 }

 /* Service Card */
 .service-card {
     /* background: linear-gradient(145deg, #141414, #0b0b0b);
    border: 1px solid rgba(212, 175, 55, 0.25); */
     background: linear-gradient(145deg, rgba(25, 20, 8, 0.8), rgba(12, 10, 3, 0.9));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 6px;
     /* padding: 36px 28px; */
     padding: 25px 25px;
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     height: 100%;
 }

 /* Gold top highlight line */
 .service-card::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 3px;
     background: linear-gradient(90deg,
             transparent,
             #FFD700,
             #D4AF37,
             #FFD700,
             transparent);
     transform: scaleX(0);
     transition: transform 0.4s ease;
 }

 /* Subtle gold glow background */
 .service-card::after {
     content: "";
     position: absolute;
     inset: 0;
     background: radial-gradient(circle at top, rgba(255, 215, 0, 0.12), transparent 70%);
     opacity: 0;
     transition: opacity .4s ease;
 }

 /* Hover Effect */
 .service-card:hover {
     border-color: rgba(255, 215, 0, 0.55);
     transform: translateY(-8px);
     box-shadow:
         0 25px 60px rgba(0, 0, 0, 0.7),
         0 0 35px rgba(255, 215, 0, 0.15);
 }

 .service-card:hover::before {
     transform: scaleX(1);
 }

 .service-card:hover::after {
     opacity: 1;
 }

 /* Icon */
 .service-icon {
     width: 64px;
     height: 64px;
     background: linear-gradient(135deg, rgba(255, 215, 0, 0.15), rgba(212, 175, 55, 0.05));
     border: 1px solid rgba(255, 215, 0, 0.35);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 24px;
     color: #FFD700;
     margin-bottom: 20px;
     transition: all 0.35s;
 }

 .service-card:hover .service-icon {
     background: linear-gradient(135deg, #FFD700, #D4AF37);
     color: #000;
     box-shadow: 0 10px 25px rgba(255, 215, 0, 0.35);
 }

 /* Title */
 .service-card h4 {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 20px;
     font-weight: 700;
     color: #F8F4E3;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     margin-bottom: 12px;
 }

 /* Text */
 .service-card p {
     font-size: 13.5px;
     color: #A0A0A0;
     line-height: 1.7;
 }

 /* Tags */
 .service-tags {
     display: flex;
     flex-wrap: wrap;
     gap: 6px;
     margin-top: 20px;
 }

 .service-tag {
     font-size: 10px;
     padding: 4px 10px;
     border-radius: 3px;
     background: rgba(255, 215, 0, 0.08);
     border: 1px solid rgba(255, 215, 0, 0.25);
     color: #FFD700;
     letter-spacing: 1px;
     text-transform: uppercase;
 }

 /* ===== ISO STRIP ===== */
 .iso-strip {
     background: linear-gradient(90deg, #080600, #1a1200, #080600);
     border-top: 1px solid var(--border-gold);
     border-bottom: 1px solid var(--border-gold);
     padding: 20px 0;
     overflow: hidden;
 }

 .iso-ticker {
     display: flex;
     gap: 60px;
     align-items: center;
     animation: ticker 20s linear infinite;
     width: max-content;
 }

 .iso-item {
     display: flex;
     align-items: center;
     gap: 10px;
     white-space: nowrap;
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 18px;
     font-weight: 700;
     color: var(--gold-light);
     letter-spacing: 2px;
 }

 .iso-item i {
     color: var(--gold);
     font-size: 14px;
 }

 @keyframes ticker {
     0% {
         transform: translateX(0)
     }

     100% {
         transform: translateX(-50%)
     }
 }


 @media (max-width: 576px) {
     .service-card {
         padding: 20px 20px;
     }
 }

 /* ===== ABOUT ===== */
 /* #about {
     background: var(--black);
 }

 .about-img-wrap {
     position: relative;
     display: inline-block;
 }

 .about-img-frame {
     width: 100%;
     max-width: 420px;
     aspect-ratio: 3/4;
     background: linear-gradient(135deg, rgba(201, 168, 76, 0.08), rgba(201, 168, 76, 0.02));
     border: 1px solid var(--border-gold);
     border-radius: 4px;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 120px;
     color: rgba(201, 168, 76, 0.12);
     position: relative;
 }

 .about-img-frame::before {
     content: '';
     position: absolute;
     inset: 10px;
     border: 1px solid rgba(201, 168, 76, 0.2);
     border-radius: 2px;
     pointer-events: none;
 }

 .about-frame-deco {
     position: absolute;
     bottom: -20px;
     right: -20px;
     width: 120px;
     height: 120px;
     border-right: 3px solid var(--gold);
     border-bottom: 3px solid var(--gold);
     pointer-events: none;
 }

 .about-frame-deco2 {
     position: absolute;
     top: -20px;
     left: -20px;
     width: 80px;
     height: 80px;
     border-left: 2px solid rgba(201, 168, 76, 0.4);
     border-top: 2px solid rgba(201, 168, 76, 0.4);
     pointer-events: none;
 }

 .exp-badge {
     position: absolute;
     bottom: 30px;
     right: -30px;
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     color: var(--black);
     padding: 16px 20px;
     border-radius: 4px;
     box-shadow: 0 10px 30px rgba(201, 168, 76, 0.4);
     text-align: center;
 }

 .exp-badge .num {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 36px;
     font-weight: 800;
     line-height: 1;
 }

 .exp-badge .label {
     font-size: 11px;
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-top: 2px;
 }

 .about-name {
     font-family: 'Playfair Display', serif;
     font-size: clamp(28px, 3.5vw, 42px);
     font-weight: 700;
     color: var(--white);
     margin-bottom: 8px;
 }

 .about-name span {
     color: var(--gold);
 }

 .about-role {
     font-size: 13px;
     color: var(--gold);
     letter-spacing: 3px;
     text-transform: uppercase;
     margin-bottom: 20px;
 }

 .about-lead {
     font-size: 16px;
     color: #bbb;
     line-height: 1.8;
     margin-bottom: 24px;
     font-weight: 300;
 }

 .edu-list {
     margin-bottom: 28px;
 }

 .edu-item {
     display: flex;
     gap: 14px;
     margin-bottom: 16px;
     align-items: flex-start;
 }

 .edu-icon {
     width: 40px;
     height: 40px;
     flex-shrink: 0;
     background: rgba(201, 168, 76, 0.1);
     border: 1px solid var(--border-gold);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--gold);
     font-size: 14px;
 }

 .edu-info h6 {
     font-size: 13px;
     font-weight: 600;
     color: var(--white);
     margin-bottom: 2px;
 }

 .edu-info p {
     font-size: 12px;
     color: #777;
     margin: 0;
 }

 .about-industries {
     display: flex;
     gap: 16px;
     flex-wrap: wrap;
     margin-top: 8px;
 }

 .ind-badge {
     background: rgba(201, 168, 76, 0.08);
     border: 1px solid var(--border-gold);
     padding: 8px 16px;
     border-radius: 2px;
     font-size: 12px;
     color: var(--gold);
     letter-spacing: 1px;
     text-transform: uppercase;
     display: flex;
     align-items: center;
     gap: 8px;
 } */



 /* ── ABOUT ── */
 .about-image-frame {
     position: relative;
     display: inline-block;
     width: 100%;
 }

 .about-img-box {
     background: linear-gradient(135deg, #111008, #1a1506);
     border: 1px solid rgba(201, 162, 39, 0.25);
     border-radius: 4px;
     padding: 48px;
     text-align: center;
     position: relative;
     overflow: hidden;
 }

 .about-img-box::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: linear-gradient(90deg, transparent, var(--gold), transparent);
 }

 .about-img-avatar {
     width: 140px;
     height: 140px;
     border-radius: 50%;
     border: 3px solid var(--gold);
     background: linear-gradient(135deg, var(--gold-dark), var(--gold));
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 10px;
     font-family: var(--font-display);
     font-size: 3rem;
     color: #000;
     font-weight: 900;
     box-shadow: 0 0 40px rgba(201, 162, 39, 0.3);
 }

 .about-name {
     font-family: var(--font-display);
     font-size: 1.5rem;
     color: var(--gold-light);
     font-weight: 700;
 }

 .about-designation {
     font-family: var(--font-ui);
     font-size: .8rem;
     letter-spacing: .15em;
     color: var(--text-muted);
     text-transform: uppercase;
 }

 .corner-decor {
     position: absolute;
     width: 30px;
     height: 30px;
     border-color: var(--gold);
     border-style: solid;
     opacity: .5;
 }

 .corner-decor.tl {
     top: 10px;
     left: 10px;
     border-width: 2px 0 0 2px;
 }

 .corner-decor.tr {
     top: 10px;
     right: 10px;
     border-width: 2px 2px 0 0;
 }

 .corner-decor.bl {
     bottom: 10px;
     left: 10px;
     border-width: 0 0 2px 2px;
 }

 .corner-decor.br {
     bottom: 10px;
     right: 10px;
     border-width: 0 2px 2px 0;
 }

 .about-badge {
     background: linear-gradient(135deg, var(--gold-dark), var(--gold));
     color: #000;
     font-family: var(--font-display);
     font-weight: 700;
     font-size: 1rem;
     padding: 14px 20px;
     border-radius: 4px;
     text-align: center;
     box-shadow: 0 0 30px rgba(201, 162, 39, 0.4);
     position: absolute;
     bottom: -18px;
     right: 18px;
 }

 .about-badge span {
     font-size: 1.8rem;
     display: block;
     line-height: 1;
 }


 @media (max-width:576px) {

     /* .about-badge span{
        display: none;
    } */

     .about-img-box {
         padding: 40px;
     }
 }

 /* ===== EXPERTISE ===== */
 /* #expertise {
     background: var(--dark);
 }

 .expertise-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
     gap: 2px;
 }

 .expertise-item {
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(201, 168, 76, 0.1);
     padding: 24px 20px;
     transition: all 0.3s;
     display: flex;
     align-items: flex-start;
     gap: 14px;
 }

 .expertise-item:hover {
     background: rgba(201, 168, 76, 0.06);
     border-color: rgba(201, 168, 76, 0.3);
 }

 .expertise-item i {
     color: var(--gold);
     font-size: 18px;
     margin-top: 2px;
     flex-shrink: 0;
 }

 .expertise-item h6 {
     font-size: 14px;
     font-weight: 600;
     color: var(--white);
     margin-bottom: 4px;
 }

 .expertise-item p {
     font-size: 12px;
     color: #777;
     margin: 0;
     line-height: 1.5;
 } */




 .expertise-tag {
     display: inline-block;
     background: rgba(201, 162, 39, 0.08);
     border: 1px solid rgba(201, 162, 39, 0.25);
     color: var(--gold-light);
     font-family: var(--font-ui);
     font-size: .78rem;
     letter-spacing: .08em;
     padding: 5px 12px;
     border-radius: 2px;
     margin: 4px;
     transition: all .3s;
 }

 .expertise-tag:hover {
     background: rgba(201, 162, 39, 0.18);
     border-color: var(--gold);
 }

 /* ── EXPERTISE GRID ── */
 /* .expertise-card {
     background: linear-gradient(145deg, #0e0c03, #141006);
     border: 1px solid rgba(201, 162, 39, 0.15);
     box-shadow:
         0 0 0 1px rgba(212, 175, 55, 0.2),
         0 15px 50px rgba(0, 0, 0, 0.7),
         0 0 40px rgba(212, 175, 55, 0.15);
     border-radius: 4px;
     padding: 28px 24px;
     height: 100%;
     transition: all .35s;
     position: relative;
 } */


 .expertise-card {
     background: linear-gradient(145deg, #141006, #0e0c03);
     /* background: linear-gradient(145deg, #614d1a, #ac9014);  */
     border: 1px solid rgba(201, 162, 39, 0.25);

     box-shadow:
         0 0 0 1px rgba(212, 175, 55, 0.2),
         0 20px 60px rgba(0, 0, 0, 0.8),
         0 0 35px rgba(212, 175, 55, 0.15);

     border-radius: 6px;
     padding: 28px 24px;
     height: 100%;
     transition: all .35s ease;
     position: relative;
     overflow: hidden;
 }

 .expertise-card::before {

     content: "";
     position: absolute;
     inset: 0;

     background: radial-gradient(circle at top right,
             rgba(201, 168, 76, 0.18),
             transparent 60%);

     opacity: .6;
     pointer-events: none;
 }


 .expertise-card:hover {

     border-color: var(--gold);

     transform: translateY(-6px);

     box-shadow:
         0 25px 70px rgba(0, 0, 0, 0.9),
         0 0 45px rgba(212, 175, 55, 0.25);
 }


 .expertise-card::after {

     content: "";
     position: absolute;
     top: 0;
     left: -100%;

     width: 60%;
     height: 100%;

     background: linear-gradient(120deg,
             transparent,
             rgba(255, 215, 0, 0.35),
             transparent);

     transition: .7s;
 }

 .expertise-card:hover::after {
     left: 120%;
 }


 .expertise-icon {
     font-size: 1.8rem;
     color: var(--gold);
     margin-bottom: 14px;

     text-shadow:
         0 0 10px rgba(255, 215, 0, 0.4),
         0 0 20px rgba(255, 215, 0, 0.2);
 }

 /* .expertise-card:hover {
     border-color: rgba(201, 162, 39, 0.4);
     box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3), 0 0 25px rgba(201, 162, 39, 0.08);
     transform: translateY(-4px);
 } */



 .expertise-num {
     font-family: var(--font-display);
     font-size: 3rem;
     font-weight: 900;
     color: rgba(201, 162, 39, 0.08);
     position: absolute;
     top: 10px;
     right: 16px;
     line-height: 1;
 }

 .expertise-icon {
     font-size: 1.8rem;
     color: var(--gold);
     margin-bottom: 14px;
 }

 .expertise-title {
     font-family: var(--font-ui);
     font-size: 1.05rem;
     font-weight: 700;
     color: var(--white);
     margin-bottom: 8px;
 }

 .expertise-desc {
     font-size: .84rem;
     color: var(--text-muted);
     line-height: 1.65;
 }



 @media (max-width:576px) {

     .expertise-card {
         padding: 20px 20px;
     }

 }

 /* ── INDUSTRIES ── */
 /* .industry-pill {
     display: flex;
     align-items: center;
     gap: 14px;
     background: linear-gradient(145deg, #0e0c03, #141006);
     border: 1px solid rgba(201, 162, 39, 0.15);
     border-radius: 4px;
     padding: 18px 22px;
     transition: all .3s;
     cursor: default;
 }

 .industry-pill:hover {
     border-color: rgba(201, 162, 39, 0.4);
     transform: translateX(6px);
     box-shadow: 0 0 25px rgba(201, 162, 39, 0.08);
 }

 .industry-icon {
     font-size: 1.5rem;
     color: var(--gold);
     flex-shrink: 0;
 }

 .industry-name {
     font-family: var(--font-ui);
     font-weight: 600;
     font-size: .95rem;
     color: var(--white);
 }

 .industry-desc {
     font-size: .8rem;
     color: var(--text-muted);
 } */




 /* ── WHY CHOOSE ── */
 /* .section-badge{
    display: inline-block;
    background: linear-gradient(135deg, #C9A84C, #E5C76B);
    background-color: var(--gold-bright);
    color: #111;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 30px;
    margin-bottom: 14px;
    box-shadow: 0 4px 14px rgba(201,168,76,0.35);
} */

 .section-badge {
     display: inline-block;
     background: var(--gold-bright);
     color: #111;
     font-size: 0.75rem;
     font-weight: 600;
     letter-spacing: 1.2px;
     text-transform: uppercase;
     padding: 6px 16px;
     border-radius: 30px;
     margin-bottom: 16px;
     border: 1px solid rgba(255, 255, 255, 0.2);
     box-shadow:
         0 4px 14px rgba(201, 168, 76, 0.35),
         inset 0 1px 0 rgba(255, 255, 255, 0.25);
     transition: all 0.3s ease;
 }

 .why-item {
     display: flex;
     gap: 18px;
     margin-bottom: 20px;
 }

 .why-icon-box {
     width: 48px;
     height: 48px;
     flex-shrink: 0;
     background: rgba(201, 162, 39, 0.08);
     border: 1px solid rgba(201, 162, 39, 0.25);
     border-radius: 4px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.2rem;
     color: var(--gold);
 }

 .why-text h5 {
     font-family: var(--font-ui);
     font-weight: 700;
     font-size: .98rem;
     color: var(--white);
     margin-bottom: 4px;
 }

 .why-text p {
     font-size: .83rem;
     color: var(--text-muted);
     line-height: 1.6;
     margin: 0;
 }



 /* ===== WHY CHOOSE ===== */
 /* #why {
     background: var(--black);
     position: relative;
     overflow: hidden;
 }

 #why::before {
     content: '';
     position: absolute;
     left: -200px;
     top: 50%;
     transform: translateY(-50%);
     width: 600px;
     height: 600px;
     background: radial-gradient(circle, rgba(201, 168, 76, 0.07) 0%, transparent 70%);
     border-radius: 50%;
     pointer-events: none;
 }

 .why-card {
     background: linear-gradient(145deg, rgba(20, 16, 5, 0.9), rgba(10, 8, 2, 0.95));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 32px 24px;
     height: 100%;
     transition: all 0.4s;
     position: relative;
     overflow: hidden;
 }

 .why-card::after {
     content: attr(data-num);
     position: absolute;
     right: 16px;
     top: 16px;
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 56px;
     font-weight: 900;
     color: rgba(201, 168, 76, 0.06);
     line-height: 1;
     transition: all 0.3s;
 }

 .why-card:hover {
     border-color: rgba(201, 168, 76, 0.4);
     transform: translateY(-4px);
 }

 .why-card:hover::after {
     color: rgba(201, 168, 76, 0.1);
 }

 .why-icon {
     font-size: 28px;
     color: var(--gold);
     margin-bottom: 16px;
 }

 .why-card h5 {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 18px;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--white);
     margin-bottom: 10px;
 }

 .why-card p {
     font-size: 13px;
     color: #888;
     line-height: 1.7;
 } */


 /* ===== INDUSTRIES SECTION ===== */
 .industries-section {
     background: var(--dark);
 }


 /* ===== INDUSTRY CARD ===== */
 .industry-card {
     position: relative;
     background: linear-gradient(145deg, #141006, #0b0903);
     border: 1px solid rgba(201, 162, 39, 0.15);
     border-radius: 8px;
     padding: 30px 26px;
     height: 100%;
     transition: all .35s ease;
     overflow: hidden;
 }


 /* GOLD TOP ACCENT */
 .industry-card::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;

     background: linear-gradient(90deg,
             transparent,
             var(--gold),
             transparent);
 }


 .industry-card::after {
     content: "";
     position: absolute;
     inset: 0;
     background: radial-gradient(circle at top,
             rgba(255, 255, 255, 0.04),
             transparent 70%);
     opacity: 0;
     transition: .4s;
 }


 /* .industry-card:hover .industry-icon{
    background: rgba(201,162,39,0.2);
    transform: scale(1.08);
    box-shadow:0 0 14px rgba(201,162,39,.35);
} */


 /* ===== ICON ===== */
 .industry-icon {
     width: 56px;
     height: 56px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 8px;
     font-size: 1.4rem;
     color: var(--gold);
     background: rgba(201, 162, 39, 0.08);
     border: 1px solid rgba(201, 162, 39, 0.25);
     margin-bottom: 18px;
     transition: all .35s ease;
 }


 /* ===== TITLE ===== */
 .industry-card h5 {
     font-size: 1.05rem;
     margin-bottom: 10px;
     font-weight: 600;
     color: var(--white);
 }


 /* ===== DESCRIPTION ===== */
 .industry-card p {
     font-size: .85rem;
     line-height: 1.7;
     color: var(--text-muted);
 }


 /* .industry-card:hover{
    transform: translateY(-8px);
    border-color: rgba(201,162,39,0.45);
    box-shadow:
        0 20px 50px rgba(0,0,0,.6),
        0 0 30px rgba(201,162,39,.15);
}

.industry-card:hover::after{
    opacity:1;
} */


 /* ===== INDUSTRY CARD ===== */
 .industry-card {
     position: relative;
     background: linear-gradient(145deg, #141006, #0b0903);
     border: 1px solid rgba(201, 162, 39, 0.15);
     border-radius: 8px;
     padding: 30px 26px;
     height: 100%;
     transition: all .35s ease;
     overflow: hidden;
 }

 /* GOLD TOP ACCENT */
 .industry-card::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;

     background: linear-gradient(90deg,
             transparent,
             var(--gold),
             transparent);
 }

 /* GOLD HIGHLIGHT GLOW */
 .industry-card::after {
     content: "";
     position: absolute;
     inset: 0;
     /* background: radial-gradient(
        circle at top,
        rgba(201,162,39,0.35),   
        rgba(201,162,39,0.15),
        transparent 70%
    ); */
     /* background: radial-gradient(
        circle at top,
        rgba(180, 139, 5, 0.95),
        rgba(114, 89, 6, 0.75),
        rgba(201,162,39,0.45),
        transparent 80%
    ); */

     background: radial-gradient(circle at top,
             rgba(201, 162, 39, 0.65) 50%,
             /* rich gold */
             rgba(201, 162, 39, 0.35) 50%,
             /* soft fade */
             transparent 75%);
     opacity: 0;
     transition: .4s ease;
 }

 /* CARD HOVER EFFECT */
 .industry-card:hover {
     transform: translateY(-6px);
     border-color: rgba(201, 162, 39, 0.4);
     box-shadow:
         0 10px 30px rgba(0, 0, 0, 0.6),
         0 0 25px rgba(201, 162, 39, 0.25);
 }

 /* SHOW GOLD GLOW */
 .industry-card:hover::after {
     opacity: 1;
 }

 /* ICON HOVER */
 .industry-card:hover .industry-icon {
     background: rgba(201, 162, 39, 0.2);
     transform: scale(1.08);
     box-shadow: 0 0 14px rgba(201, 162, 39, .35);
 }



 /* ===== PROCESS ===== */
 #process {
     background: var(--dark);
 }

 .process-steps {
     position: relative;
 }

 .process-steps::before {
     content: '';
     position: absolute;
     top: 40px;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gold), transparent);
     z-index: 0;
 }

 .process-step {
     position: relative;
     z-index: 1;
     text-align: center;
     padding: 0 10px;
 }

 .step-circle {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     background: var(--dark2);
     border: 2px solid var(--gold);
     display: flex;
     align-items: center;
     justify-content: center;
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 30px;
     font-weight: 800;
     /* color: var(--gold); */
     color: var(--black);
     margin: 0 auto 20px;
     transition: all 0.3s;
     box-shadow: 0 0 20px rgba(201, 168, 76, 0.2);
     background-color: var(--gold-primary);
 }

 .process-step:hover .step-circle {
     /* background: var(--gold);
     color: var(--black); */
     transform: scale(1.2);
 }

 .process-step h5 {
     font-size: 15px;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     margin-bottom: 8px;
 }

 .process-step p {
     font-size: 12.5px;
     color: #777;
     line-height: 1.6;
 }

 /* ===== INDUSTRIES ===== */
 #industries {
     background: var(--black);
 }

 .industry-card {
     background: rgba(20, 15, 5, 0.8);
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 28px 20px;
     text-align: center;
     transition: all 0.4s;
     cursor: pointer;
     height: 100%;
 }

 .industry-card:hover {
     background: rgba(201, 168, 76, 0.08);
     border-color: rgba(201, 168, 76, 0.4);
     transform: translateY(-4px);
 }

 .industry-icon {
     font-size: 36px;
     color: var(--gold);
     margin-bottom: 16px;
 }

 .industry-card h5 {
     font-size: 16px;
     font-weight: 700;
     color: var(--white);
     margin-bottom: 8px;
 }

 .industry-card p {
     font-size: 12.5px;
     color: #888;
 }

 /* ===== BLOG ===== */
 #blog {
     background: var(--dark);
 }

 .blog-card {
     background: linear-gradient(145deg, rgba(20, 16, 5, 0.95), rgba(12, 10, 3, 0.98));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     overflow: hidden;
     transition: all 0.4s;
     height: 100%;
 }

 .blog-card:hover {
     border-color: rgba(201, 168, 76, 0.4);
     transform: translateY(-6px);
 }

 .blog-card:hover {
     box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6);
 }

 .blog-img {
     height: 180px;
     background: linear-gradient(135deg, rgba(201, 168, 76, 0.15), rgba(80, 60, 10, 0.3));
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 48px;
     color: rgba(201, 168, 76, 0.25);
     position: relative;
     overflow: hidden;
 }

 .blog-img::before {
     content: '';
     position: absolute;
     inset: 0;
     background: repeating-linear-gradient(45deg, transparent, transparent 20px, rgba(201, 168, 76, 0.03) 20px, rgba(201, 168, 76, 0.03) 21px);
 }

 .blog-category {
     position: absolute;
     top: 12px;
     left: 12px;
     background: var(--gold);
     color: var(--black);
     font-size: 9px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     padding: 4px 10px;
     border-radius: 2px;
 }

 .blog-body {
     padding: 24px 22px;
 }

 .blog-meta {
     display: flex;
     gap: 16px;
     font-size: 11px;
     color: #666;
     margin-bottom: 12px;
 }

 .blog-meta span {
     display: flex;
     align-items: center;
     gap: 5px;
 }

 .blog-meta i {
     color: var(--gold);
 }

 .blog-card h5 {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 18px;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--white);
     margin-bottom: 10px;
     line-height: 1.2;
     transition: color 0.3s;
 }

 .blog-card:hover h5 {
     color: var(--gold-light);
 }

 .blog-card p {
     font-size: 13px;
     color: #888;
     line-height: 1.6;
 }

 .blog-read-more {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     margin-top: 16px;
     font-size: 11px;
     color: var(--gold);
     letter-spacing: 2px;
     text-transform: uppercase;
     font-weight: 600;
     text-decoration: none;
     transition: gap 0.3s;
 }

 .blog-read-more:hover {
     gap: 12px;
     color: var(--gold-bright);
 }

 /* ===== TESTIMONIALS ===== */
 /* #testimonials {
     background: var(--black);
 }

 .testi-card {
     background: linear-gradient(145deg, rgba(25, 20, 8, 0.8), rgba(15, 12, 4, 0.95));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 32px;
     position: relative;
 }

 .testi-quote {
     font-size: 60px;
     color: rgba(201, 168, 76, 0.15);
     line-height: 0.7;
     font-family: Georgia, serif;
     margin-bottom: 16px;
 }

 .testi-text {
     font-size: 14px;
     color: #aaa;
     line-height: 1.8;
     margin-bottom: 20px;
     font-style: italic;
 }

 .testi-author {
     display: flex;
     align-items: center;
     gap: 14px;
 }

 .testi-avatar {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 700;
     color: var(--black);
     font-size: 18px;
 }

 .testi-name {
     font-weight: 700;
     color: var(--white);
     font-size: 14px;
 }

 .testi-role {
     font-size: 11px;
     color: var(--gold);
     letter-spacing: 1px;
 }

 .testi-stars {
     color: var(--gold);
     font-size: 12px;
     margin-bottom: 12px;
 } */



 /* ══════════════════════════════════════════════════════════════
           SECTION
        ══════════════════════════════════════════════════════════════ */
 .qm-section {
     position: relative;
     padding: 80px 0 20px;
     background: var(--black-main);
     overflow: hidden;
     isolation: isolate;
 }

 /* Three.js canvas */
 #qm-canvas {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     pointer-events: none;
     z-index: 0;
     opacity: 0.5;
 }

 /* Blueprint grid */
 .qm-grid {
     position: absolute;
     inset: 0;
     background-image:
         linear-gradient(rgba(212, 175, 55, 0.022) 1px, transparent 1px),
         linear-gradient(90deg, rgba(212, 175, 55, 0.022) 1px, transparent 1px);
     background-size: 64px 64px;
     pointer-events: none;
     z-index: 1;
 }

 /* Radial vignette */
 .qm-vignette {
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse 80% 60% at 50% 50%, transparent 30%, rgba(5, 5, 5, 0.75) 100%);
     pointer-events: none;
     z-index: 2;
 }

 /* Corner ornaments */
 .qm-corner {
     position: absolute;
     width: 100px;
     height: 100px;
     pointer-events: none;
     z-index: 3;
     opacity: 0.22;
 }

 .qm-corner-tl {
     top: 18px;
     left: 18px;
 }

 .qm-corner-tr {
     top: 18px;
     right: 18px;
     transform: scaleX(-1);
 }

 .qm-corner-br {
     bottom: 18px;
     right: 18px;
     transform: scale(-1, -1);
 }

 .qm-corner-bl {
     bottom: 18px;
     left: 18px;
     transform: scaleY(-1);
 }

 /* Container */
 .qm-container {
     max-width: 1280px;
     margin: 0 auto;
     padding: 0 24px;
     position: relative;
     z-index: 5;
 }

 /* ══════════════════════════════════════════════════════════════
           HEADER
        ══════════════════════════════════════════════════════════════ */
 .qm-header {
     text-align: center;
     margin-bottom: 20px;
     /* margin-bottom: 64px; */
 }

 .qm-eyebrow {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: var(--gold-dim);
     color: var(--gold-soft);
     font-family: var(--font-body);
     font-size: 10.5px;
     font-weight: 600;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     padding: 8px 20px;
     border-radius: var(--radius-pill);
     border: 1px solid var(--gold-border);
     margin-bottom: 12px;
 }

 .qm-eyebrow i {
     font-size: 13px;
     color: var(--gold-primary);
 }

 .qm-title {
     font-family: var(--font-display);
     font-size: clamp(30px, 5vw, 58px);
     font-weight: 700;
     color: var(--text-cream);
     line-height: 1.12;
     margin-bottom: 20px;
     letter-spacing: -0.01em;
 }

 .qm-title .gt {
     background: linear-gradient(120deg, var(--gold-primary) 0%, var(--gold-bright) 45%, var(--gold-soft) 100%);
     background-size: 220% auto;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     animation: qm-gold-flow 5s ease-in-out infinite;
 }

 @keyframes qm-gold-flow {

     0%,
     100% {
         background-position: 0% center;
     }

     50% {
         background-position: 100% center;
     }
 }

 .qm-subtitle {
     font-size: 16px;
     color: var(--text-muted);
     max-width: 600px;
     margin: 0 auto;
     line-height: 1.75;
 }

 .qm-divider {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 14px;
     margin: 26px auto 0;
     max-width: 280px;
 }

 .qm-dl {
     flex: 1;
     height: 1px;
     background: linear-gradient(to right, transparent, var(--gold-border));
 }

 .qm-dl:last-child {
     background: linear-gradient(to left, transparent, var(--gold-border));
 }

 .qm-dd {
     width: 8px;
     height: 8px;
     background: var(--gold-primary);
     transform: rotate(45deg);
     box-shadow: 0 0 10px var(--gold-glow);
 }

 /* ══════════════════════════════════════════════════════════════
           REVIEW SUMMARY BAR
        ══════════════════════════════════════════════════════════════ */
 .qm-bar {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     align-items: center;
     gap: 28px;
     background: var(--black-card);
     border: 1px solid var(--gold-border);
     border-radius: var(--radius-card);
     padding: 28px 40px;
     max-width: 960px;
     margin: 0 auto 72px;
     box-shadow: var(--shadow-card), 0 0 50px rgba(212, 175, 55, 0.06);
     position: relative;
     overflow: hidden;
 }

 /* Sheen sweep */
 .qm-bar::before {
     content: '';
     position: absolute;
     top: 0;
     left: -120%;
     width: 60%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.045), transparent);
     animation: qm-sheen 5s ease-in-out infinite;
 }

 @keyframes qm-sheen {
     0% {
         left: -120%;
     }

     100% {
         left: 220%;
     }
 }

 /* Top gold line */
 .qm-bar::after {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1.5px;
     background: linear-gradient(90deg, transparent, var(--gold-primary), transparent);
 }

 .qm-rating-block {
     display: flex;
     flex-direction: column;
     align-items: center;
     min-width: 80px;
 }

 .qm-rating-num {
     font-family: var(--font-display);
     font-size: 52px;
     font-weight: 700;
     line-height: 1;
     letter-spacing: -0.03em;
     background: linear-gradient(150deg, var(--gold-light), var(--gold-primary), var(--gold-dark));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .qm-rating-lbl {
     font-size: 11px;
     color: var(--text-muted);
     font-weight: 500;
     margin-top: 4px;
     letter-spacing: 0.06em;
 }

 .qm-bar-div {
     width: 1px;
     height: 60px;
     background: linear-gradient(to bottom, transparent, var(--gold-border), transparent);
 }

 .qm-stars-block {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 8px;
 }

 .qm-stars-row {
     display: flex;
     gap: 5px;
 }

 .qm-star {
     font-size: 22px;
     color: #222;
     transition: color 0.4s var(--ease), filter 0.3s;
 }

 .qm-star.filled {
     color: var(--gold-primary);
 }

 .qm-star.anim {
     animation: qm-star-pulse 2.4s ease-in-out infinite;
 }

 @keyframes qm-star-pulse {

     0%,
     100% {
         filter: brightness(1) drop-shadow(0 0 2px rgba(212, 175, 55, 0.4));
     }

     50% {
         filter: brightness(1.45) drop-shadow(0 0 10px rgba(255, 215, 0, 0.75));
         transform: scale(1.14);
     }
 }

 .qm-stars-lbl {
     font-size: 12.5px;
     color: var(--text-muted);
     font-weight: 500;
 }

 .qm-stats {
     display: flex;
     gap: 28px;
     flex-wrap: wrap;
     justify-content: center;
 }

 .qm-stat {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 2px;
 }

 .qm-stat-num {
     font-family: var(--font-display);
     font-size: 26px;
     font-weight: 700;
     color: var(--gold-soft);
     line-height: 1;
 }

 .qm-stat-lbl {
     font-size: 10px;
     color: var(--text-muted);
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 0.1em;
     text-align: center;
 }

 .qm-badges {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
     justify-content: center;
 }

 .qm-badge {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background: var(--gold-dim2);
     border: 1px solid var(--gold-border);
     color: var(--text-muted);
     font-size: 11.5px;
     font-weight: 500;
     padding: 7px 14px;
     border-radius: var(--radius-pill);
     transition: all 0.25s var(--ease);
     cursor: default;
 }

 .qm-badge i {
     color: var(--gold-primary);
     font-size: 12px;
 }

 .qm-badge:hover {
     background: var(--gold-dim);
     border-color: var(--gold-soft);
     color: var(--gold-soft);
 }

 /* ══════════════════════════════════════════════════════════════
           SLIDER
        ══════════════════════════════════════════════════════════════ */
 .qm-slider-wrap {
     position: relative;
     padding: 20px 0 40px;
     overflow: hidden;
 }

 .qm-slider {
     position: relative;
     display: flex;
     align-items: center;
     min-height: 400px;
 }

 .qm-track {
     width: 100%;
     position: relative;
     min-height: 400px;
 }

 /* ══════════════════════════════════════════════════════════════
           CARD
        ══════════════════════════════════════════════════════════════ */
 .qm-card {
     position: absolute;
     width: 400px;
     background: var(--black-card);
     border-radius: var(--radius-card);
     padding: 36px 30px 28px;
     border: 1px solid var(--black-border);
     box-shadow: var(--shadow-card);
     transform: translateX(-50%) scale(0.85);
     opacity: 0.38;
     transition:
         transform 0.68s cubic-bezier(0.4, 0, 0.2, 1),
         opacity 0.68s cubic-bezier(0.4, 0, 0.2, 1),
         box-shadow 0.4s var(--ease);
     cursor: pointer;
     will-change: transform, opacity;
     overflow: hidden;
 }

 /* Decorative quote watermark */
 .qm-card::after {
     content: '"';
     position: absolute;
     bottom: -10px;
     right: 16px;
     font-family: var(--font-display);
     font-size: 120px;
     line-height: 1;
     color: rgba(212, 175, 55, 0.04);
     pointer-events: none;
     font-style: italic;
     user-select: none;
 }

 .qm-card:hover:not(.qm-active) {
     opacity: 0.62;
     transform: translateX(-50%) scale(0.88) translateY(-5px);
 }

 /* ── Active/Center Card ── */
 .qm-active {
     transform: translateX(-50%) scale(1.04) !important;
     opacity: 1 !important;
     box-shadow: var(--shadow-glow), 0 24px 64px rgba(0, 0, 0, 0.75) !important;
     border-color: rgba(212, 175, 55, 0.2) !important;
     z-index: 10;
     background: linear-gradient(155deg, #0e0d06 0%, var(--black-card) 100%) !important;
 }

 /* Animated rotating gold border (gradient sweep) */
 .qm-active::before {
     content: '';
     position: absolute;
     inset: 0;
     border-radius: var(--radius-card);
     padding: 1.5px;
     background: linear-gradient(135deg,
             var(--gold-dark),
             var(--gold-primary),
             var(--gold-bright),
             var(--gold-soft),
             var(--gold-primary),
             var(--gold-dark));
     background-size: 400% 400%;
     -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
     animation: qm-border-flow 3s ease-in-out infinite;
     pointer-events: none;
 }

 @keyframes qm-border-flow {

     0%,
     100% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }
 }

 /* Card inner */
 .qm-card-hd {
     display: flex;
     align-items: center;
     gap: 14px;
     margin-bottom: 20px;
 }

 .qm-avatar {
     width: 54px;
     height: 54px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-family: var(--font-display);
     font-size: 19px;
     font-weight: 700;
     color: var(--black-main);
     flex-shrink: 0;
     box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), 0 0 0 2px rgba(212, 175, 55, 0.2);
     transition: box-shadow 0.4s;
 }

 .qm-active .qm-avatar {
     box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), 0 0 0 2px var(--gold-primary), 0 0 16px var(--gold-glow);
 }

 .qm-meta {
     flex: 1;
     min-width: 0;
 }

 .qm-name {
     font-family: var(--font-display);
     font-size: 15.5px;
     font-weight: 600;
     color: var(--text-cream);
     line-height: 1.3;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 .qm-role {
     display: inline-block;
     font-size: 10.5px;
     font-weight: 600;
     letter-spacing: 0.04em;
     color: var(--gold-primary);
     background: var(--gold-dim);
     padding: 3px 10px;
     border-radius: var(--radius-pill);
     margin-top: 5px;
     border: 1px solid rgba(212, 175, 55, 0.18);
 }

 .qm-iso {
     width: 32px;
     height: 32px;
     border-radius: 50%;
     background: var(--gold-dim);
     border: 1px solid var(--gold-border);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 8.5px;
     font-weight: 800;
     color: var(--gold-primary);
     letter-spacing: 0.02em;
     flex-shrink: 0;
     margin-left: auto;
 }

 .qm-card-stars {
     display: flex;
     gap: 3px;
     margin-bottom: 14px;
 }

 .qm-card-stars i {
     font-size: 14px;
     color: var(--gold-primary);
 }

 .qm-active .qm-card-stars i {
     animation: qm-star-pulse 2.2s ease-in-out infinite;
 }

 .qm-active .qm-card-stars i:nth-child(2) {
     animation-delay: 0.14s;
 }

 .qm-active .qm-card-stars i:nth-child(3) {
     animation-delay: 0.28s;
 }

 .qm-active .qm-card-stars i:nth-child(4) {
     animation-delay: 0.42s;
 }

 .qm-active .qm-card-stars i:nth-child(5) {
     animation-delay: 0.56s;
 }

 .qm-text {
     font-size: 13.5px;
     line-height: 1.78;
     color: #676767;
     margin-bottom: 22px;
     font-weight: 400;
 }

 .qm-active .qm-text {
     color: #aaa;
 }

 .qm-card-ft {
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .qm-since {
     display: flex;
     align-items: center;
     gap: 6px;
     font-size: 11px;
     color: #555;
     font-weight: 500;
 }

 .qm-since::before {
     content: '';
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: var(--gold-primary);
     box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.18);
     animation: qm-dot-pulse 2.6s ease-in-out infinite;
     flex-shrink: 0;
 }

 @keyframes qm-dot-pulse {

     0%,
     100% {
         box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.18);
     }

     50% {
         box-shadow: 0 0 0 6px rgba(212, 175, 55, 0.06);
     }
 }

 .qm-verified {
     display: inline-flex;
     align-items: center;
     gap: 4px;
     font-size: 10.5px;
     color: var(--gold-soft);
     font-weight: 600;
 }

 .qm-verified i {
     font-size: 12px;
 }

 /* ══════════════════════════════════════════════════════════════
           NAV ARROWS
        ══════════════════════════════════════════════════════════════ */
 .qm-arrow {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     width: 48px;
     height: 48px;
     border-radius: 50%;
     background: var(--black-card);
     border: 1.5px solid var(--gold-border);
     color: var(--gold-primary);
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     z-index: 20;
     box-shadow: var(--shadow-soft);
     transition: all 0.28s var(--ease);
     font-size: 18px;
 }

 .qm-arrow:hover {
     background: var(--gold-dim);
     color: var(--gold-bright);
     box-shadow: 0 0 24px var(--gold-glow);
     transform: translateY(-50%) scale(1.12);
     border-color: var(--gold-soft);
 }

 .qm-prev {
     left: 16px;
 }

 .qm-next {
     right: 16px;
 }

 /* ══════════════════════════════════════════════════════════════
           DOTS
        ══════════════════════════════════════════════════════════════ */
 .qm-dots {
     display: flex;
     justify-content: center;
     gap: 8px;
     /* margin-top: 36px; */
     margin-top: 0px;
 }

 .qm-dot {
     width: 8px;
     height: 8px;
     border-radius: 4px;
     background: #252525;
     cursor: pointer;
     transition: all 0.35s var(--ease);
     border: none;
     padding: 0;
 }

 .qm-dot.active {
     width: 30px;
     background: var(--gold-primary);
     box-shadow: 0 2px 10px rgba(212, 175, 55, 0.4);
 }

 /* ══════════════════════════════════════════════════════════════
           TRUST TICKER STRIP
        ══════════════════════════════════════════════════════════════ */
 .qm-trust {
     margin-top: 72px;
     text-align: center;
 }

 .qm-trust-lbl {
     font-size: 10.5px;
     font-weight: 600;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     color: #3a3a3a;
     margin-bottom: 22px;
 }

 .qm-ticker-wrap {
     overflow: hidden;
     position: relative;
 }

 .qm-ticker-wrap::before,
 .qm-ticker-wrap::after {
     content: '';
     position: absolute;
     top: 0;
     bottom: 0;
     width: 100px;
     z-index: 2;
 }

 .qm-ticker-wrap::before {
     left: 0;
     background: linear-gradient(to right, var(--black-main), transparent);
 }

 .qm-ticker-wrap::after {
     right: 0;
     background: linear-gradient(to left, var(--black-main), transparent);
 }

 .qm-ticker {
     display: flex;
     gap: 16px;
     width: max-content;
     animation: qm-tick 30s linear infinite;
 }

 .qm-ticker:hover {
     animation-play-state: paused;
 }

 @keyframes qm-tick {
     0% {
         transform: translateX(0);
     }

     100% {
         transform: translateX(-50%);
     }
 }

 .qm-chip {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: var(--black-card);
     border: 1px solid var(--black-border);
     border-radius: var(--radius-pill);
     padding: 10px 20px;
     white-space: nowrap;
     transition: border-color 0.3s;
 }

 .qm-chip:hover {
     border-color: var(--gold-border);
 }

 .qm-chip i {
     font-size: 15px;
     color: var(--gold-primary);
 }

 .qm-chip span {
     font-size: 12.5px;
     font-weight: 500;
     color: var(--text-muted);
 }

 /* ══════════════════════════════════════════════════════════════
           CTA
        ══════════════════════════════════════════════════════════════ */
 .qm-cta {
     text-align: center;
     margin-top: 84px;
 }

 .qm-cta-inner {
     display: inline-block;
     background: var(--black-card);
     border: 1px solid var(--gold-border);
     border-radius: 28px;
     padding: 52px 60px;
     max-width: 660px;
     width: 100%;
     position: relative;
     overflow: hidden;
     box-shadow: var(--shadow-card), 0 0 70px rgba(212, 175, 55, 0.05);
 }

 .qm-cta-inner::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1.5px;
     background: linear-gradient(90deg, transparent, var(--gold-primary), transparent);
 }

 .qm-cta-heading {
     font-family: var(--font-display);
     font-size: clamp(22px, 3vw, 32px);
     font-weight: 700;
     color: var(--text-cream);
     margin-bottom: 12px;
 }

 .qm-cta-sub {
     font-size: 15px;
     color: var(--text-muted);
     margin-bottom: 36px;
     line-height: 1.68;
 }

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

 .qm-btn-gold {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: linear-gradient(135deg, var(--gold-dark) 0%, var(--gold-primary) 50%, var(--gold-soft) 100%);
     background-size: 220% auto;
     color: var(--black-main);
     border: none;
     padding: 15px 34px;
     border-radius: var(--radius-pill);
     font-family: var(--font-body);
     font-size: 14.5px;
     font-weight: 700;
     cursor: pointer;
     position: relative;
     overflow: hidden;
     transition: all 0.38s var(--ease);
     box-shadow: 0 4px 22px rgba(212, 175, 55, 0.32);
     text-decoration: none;
     letter-spacing: 0.02em;
 }

 .qm-btn-gold:hover {
     background-position: right center;
     transform: translateY(-2px) scale(1.04);
     box-shadow: 0 10px 36px rgba(212, 175, 55, 0.48);
     color: var(--black-main);
 }

 .qm-btn-outline {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: transparent;
     color: var(--gold-primary);
     border: 1.5px solid var(--gold-border);
     padding: 14px 34px;
     border-radius: var(--radius-pill);
     font-family: var(--font-body);
     font-size: 14.5px;
     font-weight: 600;
     cursor: pointer;
     transition: all 0.3s var(--ease);
     text-decoration: none;
 }

 .qm-btn-outline:hover {
     background: var(--gold-dim);
     border-color: var(--gold-soft);
     color: var(--gold-soft);
     transform: translateY(-2px);
 }

 .qm-micro {
     margin-top: 22px;
     font-size: 11.5px;
     color: #444;
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 22px;
     flex-wrap: wrap;
 }

 .qm-micro span {
     display: flex;
     align-items: center;
     gap: 5px;
     color: #555;
 }

 .qm-micro i {
     color: var(--gold-primary);
     font-size: 11px;
 }

 /* ══════════════════════════════════════════════════════════════
           ANTI-GRAVITY ORBS
        ══════════════════════════════════════════════════════════════ */
 .qm-orb {
     position: absolute;
     border-radius: 50%;
     pointer-events: none;
     will-change: transform;
     z-index: 2;
     left: 0;
     top: 0;
 }

 /* ══════════════════════════════════════════════════════════════
           RESPONSIVE
        ══════════════════════════════════════════════════════════════ */
 @media (max-width: 991px) {
     .qm-card {
         width: 360px;
     }

     .qm-section {
         position: relative;
         padding: 60px 0 0px;
     }
 }

 @media (max-width: 767px) {
     .qm-section {
         padding: 60px 0 0px;
     }

     .qm-bar {
         padding: 22px 20px;
         gap: 18px;
     }

     .qm-bar-div {
         display: none;
     }

     .qm-stats {
         gap: 20px;
     }

     .qm-card {
         width: calc(100vw - 64px);
         max-width: 370px;
         padding: 26px 20px 22px;
     }

     .qm-arrow {
         width: 40px;
         height: 40px;
         font-size: 16px;
     }

     .qm-prev {
         left: 4px;
     }

     .qm-next {
         right: 4px;
     }

     .qm-cta-inner {
         padding: 36px 22px;
     }

     .qm-corner {
         display: none;
     }

     .qm-trust {
         display: none;
     }

     .qm-rating-num {
         font-size: 42px;
     }


 }

 @media (max-width: 480px) {
     .qm-title {
         font-size: 28px;
     }
 }

 /* AOS override */
 [data-aos] {
     backface-visibility: hidden;
 }

 /* ── FAQ ── */
 .faq-item {
     border: 1px solid rgba(201, 162, 39, 0.15);
     border-radius: 4px;
     margin-bottom: 10px;
     overflow: hidden;
     transition: border .3s;
 }

 .faq-item.active {
     border-color: rgba(201, 162, 39, 0.4);
 }

 .faq-question {
     background: linear-gradient(145deg, #0e0c03, #141006);
     padding: 20px 24px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     cursor: none;
     font-family: var(--font-ui);
     font-weight: 600;
     font-size: .95rem;
     color: var(--text-primary);
     transition: color .3s;
     user-select: none;
 }

 .faq-item.active .faq-question {
     color: var(--gold-light);
 }

 .faq-icon {
     font-size: 1rem;
     color: var(--gold);
     transition: transform .3s;
 }

 .faq-item.active .faq-icon {
     transform: rotate(45deg);
 }

 .faq-answer {
     max-height: 0;
     overflow: hidden;
     background: rgba(201, 162, 39, 0.03);
     border-top: 0 solid transparent;
     transition: max-height .4s ease, padding .3s, border .3s;
 }

 .faq-item.active .faq-answer {
     max-height: 300px;
     border-top: 1px solid rgba(201, 162, 39, 0.1);
     padding: 20px 24px;
 }

 .faq-answer p {
     font-size: .86rem;
     color: var(--text-muted);
     line-height: 1.7;
     margin: 0;
 }

 /* ===== CONTACT ===== */
 #contact {
     background: var(--black);
 }

 .contact-info-card {
     background: linear-gradient(145deg, rgba(25, 20, 8, 0.9), rgba(12, 10, 3, 0.95));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 40px 32px;
     height: 100%;
 }

 .contact-info-item {
     display: flex;
     gap: 16px;
     margin-bottom: 28px;
     align-items: flex-start;
 }

 .ci-icon {
     width: 48px;
     height: 48px;
     flex-shrink: 0;
     background: rgba(201, 168, 76, 0.1);
     border: 1px solid var(--border-gold);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--gold);
     font-size: 18px;
 }

 .ci-label {
     font-size: 11px;
     color: #666;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     margin-bottom: 4px;
 }

 .ci-value {
     font-size: 14px;
     color: var(--white);
     font-weight: 500;
 }

 .ci-value a {
     color: var(--gold);
     text-decoration: none;
 }

 .contact-form-card {
     background: linear-gradient(145deg, rgba(25, 20, 8, 0.9), rgba(12, 10, 3, 0.95));
     border: 1px solid rgba(201, 168, 76, 0.15);
     border-radius: 4px;
     padding: 40px 32px;
 }

 /* ===== CTA SECTION ===== */
 #cta {
     background: linear-gradient(135deg, #0e0b00, #1a1300, #0e0b00);
     border-top: 1px solid var(--border-gold);
     border-bottom: 1px solid var(--border-gold);
     position: relative;
     overflow: hidden;
 }

 #cta::before {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse at center, rgba(201, 168, 76, 0.12) 0%, transparent 70%);
     pointer-events: none;
 }

 .cta-title {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: clamp(30px, 4vw, 52px);
     font-weight: 800;
     text-transform: uppercase;
     line-height: 1.05;
 }





 @media(max-width:576px) {
     .contact-info-card {
         padding: 20px 20px;
     }


     .contact-form-card {
         padding: 20px 20px;

     }


 }

 /* ===== FOOTER ===== */
 /* footer {
     background: var(--dark2);
     border-top: 1px solid var(--border-gold);
 }

 .footer-top {
     padding: 70px 0 50px;
 }

 .footer-brand {
     margin-bottom: 20px;
 }

 .footer-brand .brand-name {
     font-family: 'Playfair Display', serif;
     font-size: 22px;
     color: var(--white);
 }

 .footer-desc {
     font-size: 13px;
     color: #666;
     line-height: 1.7;
     max-width: 280px;
 }

 .footer-social {
     display: flex;
     gap: 10px;
     margin-top: 20px;
 }

 .social-btn {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     border: 1px solid rgba(201, 168, 76, 0.3);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--gold);
     font-size: 14px;
     text-decoration: none;
     transition: all 0.3s;
 }

 .social-btn:hover {
     background: var(--gold);
     color: var(--black);
     border-color: var(--gold);
 }

 .footer-heading {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 14px;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 3px;
     color: var(--gold);
     margin-bottom: 20px;
     padding-bottom: 10px;
     border-bottom: 1px solid rgba(201, 168, 76, 0.2);
 }

 .footer-links {
     list-style: none;
     padding: 0;
 }

 .footer-links li {
     margin-bottom: 10px;
 }

 .footer-links a {
     font-size: 13px;
     color: #888;
     text-decoration: none;
     transition: all 0.3s;
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .footer-links a::before {
     content: '→';
     color: var(--gold);
     font-size: 10px;
     opacity: 0;
     transition: opacity 0.3s, transform 0.3s;
     transform: translateX(-6px);
 }

 .footer-links a:hover {
     color: var(--gold);
     padding-left: 4px;
 }

 .footer-links a:hover::before {
     opacity: 1;
     transform: translateX(0);
 }

 .footer-certifications {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
     margin-top: 8px;
 }

 .cert-badge {
     background: rgba(201, 168, 76, 0.08);
     border: 1px solid var(--border-gold);
     padding: 6px 12px;
     border-radius: 2px;
     font-size: 11px;
     color: var(--gold);
     letter-spacing: 1.5px;
     font-weight: 700;
 }

 .footer-bottom {
     border-top: 1px solid rgba(201, 168, 76, 0.1);
     padding: 20px 0;
     font-size: 12px;
     color: #555;
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;
     gap: 10px;
 }

 .footer-bottom a {
     color: var(--gold);
     text-decoration: none;
 } */

 /* ===== FLOATING ELEMENTS ===== */
 .floating-contact {
     position: fixed;
     right: 20px;
     bottom: 30px;
     z-index: 500;
     display: flex;
     flex-direction: column;
     gap: 10px;
 }

 .float-btn {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     text-decoration: none;
     font-size: 20px;
     transition: all 0.3s;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }

 .float-wa {
     background: #25D366;
     color: white;
 }

 .float-call {
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     color: var(--black);
 }

 .float-btn:hover {
     transform: scale(1.15);
 }

 /* ===== PROGRESS BAR ===== */
 #progress-bar {
     position: fixed;
     top: 0;
     left: 0;
     height: 3px;
     background: linear-gradient(90deg, var(--gold), var(--gold-bright));
     z-index: 9999;
     transition: width 0.1s;
 }

 /* ===== GLOW LINES ===== */
 .glow-line {
     width: 100%;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gold), transparent);
     opacity: 0.3;
 }

 /* ===== INFOBOX ===== */
 .infobox {
     background: linear-gradient(135deg, rgba(201, 168, 76, 0.12), rgba(201, 168, 76, 0.04));
     border: 1px solid rgba(201, 168, 76, 0.3);
     border-radius: 4px;
     padding: 28px 24px;
     display: flex;
     gap: 16px;
     align-items: flex-start;
 }

 .infobox-icon {
     font-size: 24px;
     color: var(--gold);
     flex-shrink: 0;
     margin-top: 2px;
 }

 .infobox h6 {
     font-weight: 700;
     color: var(--gold-light);
     margin-bottom: 4px;
 }

 .infobox p {
     font-size: 13px;
     color: #aaa;
     margin: 0;
     line-height: 1.6;
 }

 /* ===== COUNTER ANIMATION ===== */
 .counter {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 48px;
     font-weight: 800;
     color: var(--gold);
 }

 /* ===== RESPONSIVE ===== */
 /* @media (max-width: 1200px) {
     #heroCanvas {
         width: 50%;
     }
 } */

 @media (max-width: 992px) {
     #heroCanvas {
         display: none;
     }

     /* .hero-content {
         padding: 80px 0 60px;
     }

     .hero-stats {
         gap: 24px;
     } */

     .exp-badge {
         right: -10px;
     }

     .process-steps::before {
         display: none;
     }
 }

 @media (max-width: 768px) {
     .topbar .top-right {
         display: none;
     }

     /* .hero-title {
         font-size: clamp(32px, 8vw, 52px);
     } */

     /* .hero-stats {
         gap: 20px;
     } */

     .stat-num {
         font-size: 32px;
     }

     .floating-contact {
         right: 12px;
     }

     /* .consult-card {
         margin-top: 40px;
     } */

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

 @media (max-width: 576px) {
     /* .hero-actions {
         flex-direction: column;
     }

     .hero-actions .btn-gold,
     .hero-actions .btn-outline-gold {
         width: 100%;
         text-align: center;
     } */

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

     /* .hero-stats {
         flex-wrap: wrap;
         gap: 16px;
     } */
 }

 /* ===== NAVBAR TOGGLE ===== */
 .navbar-toggler {
     border: 1px solid var(--border-gold);
     padding: 6px 10px;
 }

 .navbar-toggler-icon {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(201,168,76,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
 }

 /* ===== LOADING SCREEN ===== */
 /* #loader {
     position: fixed;
     inset: 0;
     background: var(--black);
     z-index: 99999;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
     gap: 20px;
 }

 .loader-logo {
     font-family: 'Barlow Condensed', sans-serif;
     font-size: 48px;
     font-weight: 900;
     color: var(--gold);
     letter-spacing: 4px;
     text-transform: uppercase;
 }

 .loader-bar {
     width: 200px;
     height: 2px;
     background: rgba(201, 168, 76, 0.2);
     border-radius: 1px;
     overflow: hidden;
 }

 .loader-bar-fill {
     height: 100%;
     width: 0;
     background: linear-gradient(90deg, var(--gold), var(--gold-bright));
     animation: loadFill 1.8s ease forwards;
 }

 @keyframes loadFill {
     0% {
         width: 0
     }

     100% {
         width: 100%
     }
 }

 .loader-text {
     font-size: 11px;
     color: var(--gold);
     letter-spacing: 4px;
     text-transform: uppercase;
 } */



 /* * ─── THREE.JS CANVAS ─── * */
 #bg-canvas {
     /* position: absolute; */
     /* position: fixed; */
     /* position: relative;
     inset: 0;
     z-index: 1;
     pointer-events: none; */
     /* display: block; */
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: -1;
     pointer-events: none;
     /* display: block; */
     display: none;
 }

 /* 
 #loader-bg {
     position: fixed;
     inset: 0;
     z-index: 5;
     background: rgba(5, 5, 5, 0.78);
     pointer-events: none;
 } */


 /* ─── RADIAL VIGNETTE ─── */
 .vignette {
     position: fixed;
     inset: 0;
     z-index: 2;
     background: radial-gradient(ellipse at center,
             transparent 30%,
             rgba(5, 5, 5, 0.55) 65%,
             rgba(5, 5, 5, 0.92) 100%);
     pointer-events: none;
 }

 /* ─── SCAN LINES ─── */
 .scanlines {
     position: fixed;
     inset: 0;
     z-index: 3;
     background: repeating-linear-gradient(0deg,
             transparent,
             transparent 2px,
             rgba(0, 0, 0, 0.08) 2px,
             rgba(0, 0, 0, 0.08) 4px);
     pointer-events: none;
     opacity: 0.4;
 }

 /* ─── LOADER WRAPPER ─── */
 #loader {
     position: fixed;
     inset: 0;
     z-index: 100;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: clamp(16px, 3vw, 32px);

     background: #050505;
     z-index: 9999;
 }

 /* ─── CORNER ORNAMENTS ─── */
 .corner {
     position: absolute;
     width: clamp(40px, 7vw, 80px);
     height: clamp(40px, 7vw, 80px);
     opacity: 0;
 }

 .corner svg {
     width: 100%;
     height: 100%;
 }

 .corner--tl {
     top: clamp(16px, 3vw, 32px);
     left: clamp(16px, 3vw, 32px);
 }

 .corner--tr {
     top: clamp(16px, 3vw, 32px);
     right: clamp(16px, 3vw, 32px);
     transform: scaleX(-1);
 }

 .corner--bl {
     bottom: clamp(16px, 3vw, 32px);
     left: clamp(16px, 3vw, 32px);
     transform: scaleY(-1);
 }

 .corner--br {
     bottom: clamp(16px, 3vw, 32px);
     right: clamp(16px, 3vw, 32px);
     transform: scale(-1);
 }

 /* ─── GOLDEN ORBIT RING ─── */
 .orbit-wrapper {
     position: relative;
     width: clamp(120px, 22vw, 220px);
     height: clamp(120px, 22vw, 220px);
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .orbit-ring {
     position: absolute;
     inset: 0;
     border-radius: 50%;
     border: 1.5px solid var(--gold-border);
 }

 .orbit-ring--outer {
     animation: spinCW 8s linear infinite;
     border-top-color: var(--gold-primary);
     border-right-color: var(--gold-bright);
     box-shadow: 0 0 18px var(--gold-glow), inset 0 0 18px rgba(212, 175, 55, 0.08);
 }

 .orbit-ring--mid {
     inset: 12px;
     animation: spinCCW 5s linear infinite;
     border-bottom-color: var(--gold-soft);
     border-left-color: var(--gold-primary);
 }

 .orbit-ring--inner {
     inset: 24px;
     animation: spinCW 3s linear infinite;
     border-color: transparent;
     border-top-color: var(--gold-bright);
 }

 /* orbit dots */
 .orbit-dot {
     position: absolute;
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--gold-bright);
     box-shadow: 0 0 12px var(--gold-bright), 0 0 24px var(--gold-glow);
     top: -4px;
     left: 50%;
     transform: translateX(-50%);
 }

 .orbit-ring--outer .orbit-dot {
     background: var(--gold-bright);
 }

 .orbit-ring--mid .orbit-dot {
     top: auto;
     bottom: -4px;
     background: var(--gold-soft);
     width: 6px;
     height: 6px;
 }

 @keyframes spinCW {
     to {
         transform: rotate(360deg);
     }
 }

 @keyframes spinCCW {
     to {
         transform: rotate(-360deg);
     }
 }

 /* ─── LOGO MARK CENTER ─── */
 .logo-center {
     position: relative;
     z-index: 5;
     display: flex;
     align-items: center;
     justify-content: center;
     width: clamp(60px, 11vw, 110px);
     height: clamp(60px, 11vw, 110px);
 }

 .logo-center svg {
     width: 100%;
     height: 100%;
     filter: drop-shadow(0 0 14px rgba(212, 175, 55, 0.7));
 }

 /* pulse ring behind D */
 .pulse-ring {
     position: absolute;
     inset: -6px;
     border-radius: 50%;
     border: 1px solid var(--gold-primary);
     animation: pulseRing 2s ease-in-out infinite;
 }

 @keyframes pulseRing {

     0%,
     100% {
         opacity: 0.6;
         transform: scale(1);
     }

     50% {
         opacity: 0.1;
         transform: scale(1.18);
     }
 }

 /* ─── BRAND TEXT ─── */
 .brand-block {
     text-align: center;
     opacity: 0;
     transform: translateY(20px);
 }

 .brand-name {
     font-family: 'Cinzel', serif;
     font-size: clamp(1.6rem, 5vw, 3.2rem);
     font-weight: 700;
     letter-spacing: clamp(0.25em, 1.5vw, 0.55em);
     background: linear-gradient(135deg, var(--gold-dark) 0%, var(--gold-primary) 30%, var(--gold-bright) 55%, var(--gold-soft) 75%, var(--gold-primary) 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     text-shadow: none;
     line-height: 1;
     text-transform: uppercase;
 }

 .brand-sub {
     font-family: 'Montserrat', sans-serif;
     font-size: clamp(0.5rem, 1.4vw, 0.75rem);
     font-weight: 300;
     letter-spacing: clamp(0.3em, 2vw, 0.65em);
     color: var(--text-muted);
     text-transform: uppercase;
     margin-top: 6px;
 }

 /* ─── DIVIDER ─── */
 .divider {
     display: flex;
     align-items: center;
     gap: 12px;
     opacity: 0;
     width: clamp(200px, 50vw, 480px);
 }

 .divider-line {
     flex: 1;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gold-border), transparent);
 }

 .divider-diamond {
     width: 6px;
     height: 6px;
     background: var(--gold-primary);
     transform: rotate(45deg);
     box-shadow: 0 0 8px var(--gold-glow);
     flex-shrink: 0;
 }

 /* ─── TAGLINE ─── */
 .tagline {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(0.7rem, 1.8vw, 1rem);
     font-weight: 400;
     font-style: italic;
     color: var(--text-cream);
     letter-spacing: 0.1em;
     opacity: 0;
     text-align: center;
     padding: 0 16px;
 }

 /* ─── PROGRESS AREA ─── */
 .progress-area {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 10px;
     opacity: 0;
     width: clamp(200px, 50vw, 420px);
 }

 .progress-track {
     width: 100%;
     height: 2px;
     background: rgba(212, 175, 55, 0.12);
     border-radius: 2px;
     overflow: hidden;
     position: relative;
 }

 .progress-track::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.15), transparent);
     animation: shimmer 1.8s ease-in-out infinite;
 }

 @keyframes shimmer {
     0% {
         transform: translateX(-100%);
     }

     100% {
         transform: translateX(100%);
     }
 }

 .progress-fill {
     height: 100%;
     width: 0%;
     background: linear-gradient(90deg, var(--gold-dark), var(--gold-primary), var(--gold-bright));
     border-radius: 2px;
     position: relative;
     transition: width 0.1s linear;
     box-shadow: 0 0 10px var(--gold-glow);
 }

 .progress-fill::after {
     content: '';
     position: absolute;
     right: 0;
     top: 50%;
     transform: translateY(-50%);
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--gold-bright);
     box-shadow: 0 0 12px var(--gold-bright), 0 0 24px rgba(255, 215, 0, 0.6);
 }

 .progress-meta {
     display: flex;
     justify-content: space-between;
     width: 100%;
 }

 .progress-pct {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.65rem, 1.4vw, 0.8rem);
     color: var(--gold-primary);
     letter-spacing: 0.1em;
 }

 .progress-label {
     font-family: 'Montserrat', sans-serif;
     font-size: clamp(0.55rem, 1.1vw, 0.65rem);
     font-weight: 300;
     color: var(--text-muted);
     letter-spacing: 0.2em;
     text-transform: uppercase;
 }

 /* ─── STATUS TEXT ─── */
 .status-text {
     font-family: 'Montserrat', sans-serif;
     font-size: clamp(0.5rem, 1vw, 0.6rem);
     font-weight: 200;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-muted);
     opacity: 0;
     min-height: 1em;
     text-align: center;
 }

 /* ─── FLOATING PARTICLES (CSS) ─── */
 .particle-field {
     position: fixed;
     inset: 0;
     z-index: 4;
     pointer-events: none;
     overflow: hidden;
 }

 .p {
     position: absolute;
     border-radius: 50%;
     background: var(--gold-primary);
     opacity: 0;
     animation: floatUp var(--dur) var(--delay) ease-in infinite;
 }

 @keyframes floatUp {
     0% {
         transform: translateY(0) scale(1);
         opacity: 0;
     }

     10% {
         opacity: var(--op);
     }

     90% {
         opacity: var(--op);
     }

     100% {
         transform: translateY(-100vh) scale(0.2);
         opacity: 0;
     }
 }

 /* ─── ANTI GRAVITY ORB ─── */
 .anti-grav-orb {
     position: fixed;
     width: clamp(300px, 55vw, 700px);
     height: clamp(300px, 55vw, 700px);
     border-radius: 50%;
     background: radial-gradient(circle at 40% 40%,
             rgba(212, 175, 55, 0.07) 0%,
             rgba(201, 168, 76, 0.04) 40%,
             transparent 70%);
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     z-index: 2;
     animation: orbDrift 7s ease-in-out infinite alternate;
     pointer-events: none;
 }

 @keyframes orbDrift {
     0% {
         transform: translate(-50%, -50%) scale(1) rotate(0deg);
     }

     100% {
         transform: translate(-50%, -50%) scale(1.12) rotate(8deg);
     }
 }

 /* ─── EXIT OVERLAY ─── */
 #exit-overlay {
     position: fixed;
     inset: 0;
     z-index: 200;
     background: var(--black-main);
     transform: scaleY(0);
     transform-origin: bottom;
     pointer-events: none;
 }

 /* ═══════════════════════════════════════════════════
   LOADER RESPONSIVE — all breakpoints
═══════════════════════════════════════════════════ */

 /* ── Base: ensure loader covers entire viewport ── */
 #loader {
     /* Override: make sure bg is fully opaque so main site is hidden */
     background: #050505;
     /* z-index higher than exit-overlay base so it stacks correctly */
     z-index: 9999;
 }

 #exit-overlay {
     z-index: 10000;
 }

 /* ── Large desktops (1400px+) ── */
 @media (min-width: 1400px) {
     .orbit-wrapper {
         width: 220px;
         height: 220px;
     }

     .brand-name {
         font-size: 3.4rem;
     }

     .divider {
         width: 500px;
     }

     .progress-area {
         width: 440px;
     }
 }

 /* ── Tablets landscape / small laptops (768px – 1199px) ── */
 @media (max-width: 1199px) and (min-width: 768px) {
     .orbit-wrapper {
         width: 170px;
         height: 170px;
     }

     .orbit-ring--mid {
         inset: 14px;
     }

     .orbit-ring--inner {
         inset: 26px;
     }

     .brand-name {
         font-size: clamp(1.8rem, 4vw, 2.6rem);
     }
 }

 /* ── Tablets portrait (576px – 767px) ── */
 @media (max-width: 767px) and (min-width: 576px) {
     .orbit-wrapper {
         width: 150px;
         height: 150px;
     }

     .orbit-ring--mid {
         inset: 12px;
     }

     .orbit-ring--inner {
         inset: 22px;
     }

     .logo-center {
         width: 72px;
         height: 72px;
     }

     .brand-name {
         font-size: clamp(1.6rem, 5vw, 2.2rem);
         letter-spacing: 0.3em;
     }

     .tagline {
         font-size: 0.8rem;
     }

     .divider {
         width: 80vw;
     }

     .progress-area {
         width: 80vw;
     }
 }

 /* ── Mobile (max 575px) ── */
 @media (max-width: 575px) {
     #loader {
         gap: 14px;
         padding: 0 20px;
     }

     .orbit-wrapper {
         width: 130px;
         height: 130px;
     }

     .orbit-ring--mid {
         inset: 10px;
     }

     .orbit-ring--inner {
         inset: 20px;
     }

     .logo-center {
         width: 60px;
         height: 60px;
     }

     .brand-name {
         font-size: clamp(1.4rem, 9vw, 1.9rem);
         letter-spacing: 0.25em;
     }

     .brand-sub {
         font-size: clamp(0.45rem, 2.5vw, 0.65rem);
         letter-spacing: 0.3em;
     }

     .tagline {
         font-size: clamp(0.62rem, 3.2vw, 0.85rem);
         padding: 0 12px;
     }

     .divider {
         width: 88vw;
     }

     .progress-area {
         width: 88vw;
     }

     .progress-pct {
         font-size: 0.7rem;
     }

     .progress-label {
         font-size: 0.5rem;
     }

     .status-text {
         font-size: 0.5rem;
         letter-spacing: 0.2em;
     }

     /* Smaller corners on mobile */
     .corner {
         width: 36px;
         height: 36px;
     }

     .corner--tl {
         top: 14px;
         left: 14px;
     }

     .corner--tr {
         top: 14px;
         right: 14px;
     }

     .corner--bl {
         bottom: 14px;
         left: 14px;
     }

     .corner--br {
         bottom: 14px;
         right: 14px;
     }
 }

 /* ── Very small phones (max 360px) ── */
 @media (max-width: 360px) {
     .orbit-wrapper {
         width: 110px;
         height: 110px;
     }

     .orbit-ring--mid {
         inset: 9px;
     }

     .orbit-ring--inner {
         inset: 18px;
     }

     .logo-center {
         width: 52px;
         height: 52px;
     }

     .brand-name {
         font-size: 1.3rem;
         letter-spacing: 0.2em;
     }

     .brand-sub {
         font-size: 0.42rem;
     }

     .tagline {
         font-size: 0.6rem;
     }

     #loader {
         gap: 10px;
     }
 }

 /* ── Landscape mobile (height < 500px) ── */
 @media (max-height: 500px) and (orientation: landscape) {
     #loader {
         gap: 8px;
         flex-direction: row;
         flex-wrap: wrap;
         justify-content: center;
         align-content: center;
     }

     .orbit-wrapper {
         width: 100px;
         height: 100px;
         flex-shrink: 0;
     }

     .orbit-ring--mid {
         inset: 8px;
     }

     .orbit-ring--inner {
         inset: 16px;
     }

     .logo-center {
         width: 50px;
         height: 50px;
     }

     .brand-block {
         flex-shrink: 0;
         text-align: left;
     }

     .brand-name {
         font-size: 1.3rem;
         letter-spacing: 0.2em;
     }

     .brand-sub {
         font-size: 0.4rem;
     }

     .divider {
         width: 90vw;
     }

     .progress-area {
         width: 90vw;
     }

     .tagline {
         font-size: 0.6rem;
     }

     .status-text {
         font-size: 0.45rem;
     }
 }



 /* ══════════════════════════════════════════
       CSS CUSTOM PROPERTIES
    ══════════════════════════════════════════ */
 :root {
     --gc-primary: #c9a84c;
     --gc-bright: #f0c84a;
     --gc-soft: #e8d08a;
     --gc-dark: #8a6820;
     --gc-glow: rgba(201, 168, 76, .45);
     --gc-border: rgba(201, 168, 76, .22);
     --gc-border-mid: rgba(201, 168, 76, .38);
     --bg-deep: #040302;
     --bg-card: #080604;
     --bg-muted: #0d0b07;
     --bdr-dark: rgba(255, 255, 255, .05);
     --txt-white: #f5f0e8;
     --txt-muted: rgba(200, 190, 165, .58);
     --txt-sub: rgba(200, 190, 165, .75);
     --ff-display: 'Cinzel', serif;
     --ff-serif: 'Cormorant Garamond', serif;
     --ff-sans: 'Outfit', sans-serif;
     --ease-expo: cubic-bezier(.19, 1, .22, 1);
     --ease-back: cubic-bezier(.34, 1.56, .64, 1);
 }

 /* ══════════════════════════════════════════
       RESET & BASE
    ══════════════════════════════════════════ */
 /* *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      font-family: var(--ff-sans);
      background: var(--bg-deep);
      color: var(--txt-white);
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    } */



 /* Custom scrollbar */
 ::-webkit-scrollbar {
     width: 4px;
 }

 ::-webkit-scrollbar-track {
     background: var(--bg-deep);
 }

 ::-webkit-scrollbar-thumb {
     background: var(--gc-dark);
     border-radius: 4px;
 }

 /* ══════════════════════════════════════════
       CANVAS BACKGROUND (Three.js)
    ══════════════════════════════════════════ */
 #sc-canvas {
     position: fixed;
     inset: 0;
     z-index: 0;
     pointer-events: none;
     opacity: .55;
 }

 /* ══════════════════════════════════════════
       APEX HERO
    ══════════════════════════════════════════ */
 .apex-hero {
     min-height: 100vh;
     /* padding-top: 88px; */
     position: relative;
     overflow: hidden;
     display: flex;
     align-items: center;
     background:
         radial-gradient(ellipse 70% 60% at 68% 52%, rgba(201, 168, 76, .11) 0%, transparent 58%),
         linear-gradient(160deg, #050402 0%, #0a0700 55%, #040302 100%);
     z-index: 1;
 }

 /* Layered mesh grid */
 .apex-hero::before {
     content: '';
     position: absolute;
     inset: 0;
     pointer-events: none;
     background-image:
         linear-gradient(rgba(201, 168, 76, .028) 1px, transparent 1px),
         linear-gradient(90deg, rgba(201, 168, 76, .028) 1px, transparent 1px);
     background-size: 55px 55px;
     mask-image: radial-gradient(ellipse 90% 80% at 50% 50%, black 30%, transparent 100%);
 }

 /* Diagonal accent line */
 .apex-hero::after {
     content: '';
     position: absolute;
     top: 0;
     right: 0;
     width: 1px;
     height: 100%;
     background: linear-gradient(to bottom, transparent, var(--gc-border), transparent);
 }

 /* Atmospheric orbs */
 .sc-orb {
     position: absolute;
     border-radius: 50%;
     pointer-events: none;
     will-change: transform;
 }

 .sc-orb--a {
     width: 560px;
     height: 560px;
     background: radial-gradient(circle, rgba(201, 168, 76, .16), transparent 68%);
     top: -120px;
     right: 60px;
     filter: blur(70px);
     animation: sc-drift-a 18s ease-in-out infinite;
 }

 .sc-orb--b {
     width: 300px;
     height: 300px;
     background: radial-gradient(circle, rgba(201, 168, 76, .11), transparent 70%);
     bottom: 40px;
     left: -60px;
     filter: blur(60px);
     animation: sc-drift-b 22s ease-in-out infinite;
 }

 .sc-orb--c {
     width: 200px;
     height: 200px;
     background: radial-gradient(circle, rgba(255, 210, 80, .13), transparent 70%);
     top: 38%;
     right: 44%;
     filter: blur(50px);
     animation: sc-drift-c 14s ease-in-out infinite;
 }

 @keyframes sc-drift-a {

     0%,
     100% {
         transform: translate(0, 0) scale(1);
     }

     50% {
         transform: translate(-30px, 25px) scale(1.05);
     }
 }

 @keyframes sc-drift-b {

     0%,
     100% {
         transform: translate(0, 0);
     }

     50% {
         transform: translate(20px, -18px);
     }
 }

 @keyframes sc-drift-c {

     0%,
     100% {
         transform: translate(0, 0);
     }

     50% {
         transform: translate(-14px, 10px);
     }
 }

 /* ─── Badge ─── */
 .sc-badge {
     display: inline-flex;
     align-items: center;
     gap: 9px;
     background: rgba(201, 168, 76, .07);
     border: 1px solid var(--gc-border);
     border-radius: 50px;
     padding: .32rem 1rem .32rem .7rem;
     font-size: .64rem;
     letter-spacing: .22em;
     text-transform: uppercase;
     color: var(--gc-soft);
     margin-bottom: 1rem;
     backdrop-filter: blur(8px);
     transition: background .3s, border-color .3s;
 }

 .sc-badge:hover {
     background: rgba(201, 168, 76, .12);
     border-color: var(--gc-border-mid);
 }

 .sc-badge__pulse {
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: var(--gc-bright);
     flex-shrink: 0;
     animation: sc-pulse 2.2s ease-in-out infinite;
 }

 @keyframes sc-pulse {

     0%,
     100% {
         opacity: 1;
         transform: scale(1);
         box-shadow: 0 0 0 0 rgba(201, 168, 76, .5);
     }

     50% {
         opacity: .5;
         transform: scale(1.35);
         box-shadow: 0 0 0 5px rgba(201, 168, 76, 0);
     }
 }

 /* ─── Pre-title ─── */
 .sc-pre {
     font-size: .82rem;
     font-family: var(--ff-sans);
     font-weight: 400;
     color: var(--txt-muted);
     letter-spacing: .16em;
     text-transform: uppercase;
     margin-bottom: .5rem;
 }

 /* ─── Main Title ─── */
 .sc-headline {
     font-family: var(--ff-display);
     /* font-family: Verdana, Geneva, Tahoma, sans-serif; */
     /* font-family: Arial, Helvetica, sans-serif; */
     /* font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; */
     font-size: clamp(20px, 4vw, 60px);
     /* font-size: clamp(1.85rem, 4.2vw, 3.2rem); */
     font-weight: bold;
     line-height: 1.12;
     color: var(--txt-white);
     margin-bottom: .9rem;
 }

 .sc-headline__gold {
     display: block;
     background: linear-gradient(92deg, var(--gc-primary) 0%, var(--gc-bright) 46%, var(--gc-soft) 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     animation: sc-glow 3.2s ease-in-out infinite;
     position: relative;
 }

 .sc-headline__gold::after {
     content: attr(data-text);
     position: absolute;
     inset: 0;
     background: linear-gradient(92deg, var(--gc-primary), var(--gc-bright));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     filter: blur(22px);
     opacity: .35;
     z-index: -1;
 }

 @keyframes sc-glow {

     0%,
     100% {
         filter: brightness(1);
     }

     50% {
         filter: brightness(1.28);
     }
 }

 /* ─── Subtitle ─── */
 .sc-subline {
     font-family: var(--ff-serif);
     font-style: italic;
     font-size: clamp(.94rem, 1.9vw, 1.14rem);
     color: var(--txt-sub);
     /* margin-bottom: 2.2rem; */
     max-width: 520px;
 }

 /* ─── CTA Buttons ─── */
 .sc-btn-primary {
     display: inline-flex;
     align-items: center;
     gap: 9px;
     background: linear-gradient(135deg, var(--gc-primary) 0%, var(--gc-dark) 100%);
     color: #050302;
     font-family: var(--ff-display);
     font-size: .67rem;
     font-weight: 700;
     letter-spacing: .2em;
     text-transform: uppercase;
     padding: .88rem 1.9rem;
     border: none;
     border-radius: 2px;
     text-decoration: none;
     cursor: pointer;
     position: relative;
     overflow: hidden;
     transition: transform .35s var(--ease-expo), box-shadow .35s;
 }

 .sc-btn-primary::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, var(--gc-bright), var(--gc-soft));
     transform: translateX(-101%);
     transition: transform .45s var(--ease-expo);
 }

 .sc-btn-primary>* {
     position: relative;
     z-index: 1;
 }

 .sc-btn-primary:hover::before {
     transform: translateX(0);
 }

 .sc-btn-primary:hover {
     color: #040302;
     transform: translateY(-3px);
     box-shadow: 0 10px 32px var(--gc-glow), 0 0 0 1px rgba(201, 168, 76, .3);
 }

 .sc-btn-ghost {
     display: inline-flex;
     align-items: center;
     gap: 9px;
     background: transparent;
     color: var(--gc-primary);
     font-family: var(--ff-display);
     font-size: .67rem;
     font-weight: 600;
     letter-spacing: .2em;
     text-transform: uppercase;
     padding: .88rem 1.9rem;
     border: 1px solid var(--gc-border-mid);
     border-radius: 2px;
     text-decoration: none;
     cursor: pointer;
     transition: background .3s, color .3s, border-color .3s, transform .35s var(--ease-expo);
     position: relative;
     overflow: hidden;
 }

 .sc-btn-ghost::after {
     content: '';
     position: absolute;
     inset: 0;
     background: rgba(201, 168, 76, .06);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform .38s var(--ease-expo);
 }

 .sc-btn-ghost:hover {
     color: var(--gc-bright);
     border-color: var(--gc-primary);
     transform: translateY(-3px);
 }

 .sc-btn-ghost:hover::after {
     transform: scaleX(1);
 }

 /* ─── Achievement Metrics ─── */
 .sc-metrics {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 0;
     /* margin-top: 2.8rem; */
     background: rgba(255, 255, 255, .018);
     border: 1px solid var(--gc-border);
     border-radius: 4px;
     overflow: hidden;
     backdrop-filter: blur(6px);
     position: relative;
 }

 .sc-metrics::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gc-primary), transparent);
 }

 .sc-metric-cell {
     flex: 1 1 90px;
     text-align: center;
     padding: 1.3rem .8rem;
     position: relative;
     transition: background .3s;
 }

 .sc-metric-cell:not(:last-child)::after {
     content: '';
     position: absolute;
     top: 20%;
     right: 0;
     width: 1px;
     height: 60%;
     background: var(--gc-border);
 }

 .sc-metric-cell:hover {
     background: rgba(201, 168, 76, .04);
 }

 .sc-metric-val {
     font-family: var(--ff-display);
     font-size: 1.6rem;
     font-weight: 700;
     display: block;
     background: linear-gradient(135deg, var(--gc-primary), var(--gc-bright));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     line-height: 1;
     margin-bottom: .3rem;
 }

 .sc-metric-label {
     font-size: .58rem;
     color: var(--txt-muted);
     letter-spacing: .16em;
     text-transform: uppercase;
     font-family: var(--ff-sans);
     font-weight: 400;
 }

 /* ─── Consultation Card ─── */
 .sc-consult {
     background: rgba(12, 9, 4, .78);
     border: 1px solid var(--gc-border);
     border-radius: 6px;
     padding: 1.5rem 1.5rem;
     backdrop-filter: blur(18px);
     position: relative;
     overflow: hidden;
     box-shadow: 0 24px 64px rgba(0, 0, 0, .55), 0 0 0 1px rgba(201, 168, 76, .06) inset;
 }

 .sc-consult::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: linear-gradient(90deg, transparent, var(--gc-primary), var(--gc-bright), var(--gc-primary), transparent);
 }

 .sc-consult::after {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse at 50% 0%, rgba(201, 168, 76, .07), transparent 65%);
     pointer-events: none;
 }

 .sc-consult__title {
     font-family: var(--ff-display);
     /* font-size: 1.15rem; */
     font-size: 2.1rem;
     font-weight: 700;
     color: var(--txt-white);
     margin-bottom: .4rem;
     position: relative;
     z-index: 1;
 }

 .sc-consult__sub {
     font-size: .77rem;
     color: var(--txt-muted);
     line-height: 1.7;
     margin-bottom: 1.4rem;
     position: relative;
     z-index: 1;
 }

 .sc-field {
     width: 100%;
     background: rgba(255, 255, 255, .03);
     border: 1px solid rgba(201, 168, 76, .15);
     border-radius: 3px;
     padding: .75rem 1rem;
     color: var(--txt-white);
     font-family: var(--ff-sans);
     font-size: .78rem;
     letter-spacing: .04em;
     margin-bottom: .8rem;
     outline: none;
     transition: border-color .3s, background .3s, box-shadow .3s;
     position: relative;
     z-index: 1;
     appearance: none;
 }

 .sc-field::placeholder {
     color: rgba(200, 190, 165, .35);
     font-size: .72rem;
     letter-spacing: .1em;
 }

 .sc-field:focus {
     border-color: var(--gc-primary);
     background: rgba(201, 168, 76, .04);
     box-shadow: 0 0 0 3px rgba(201, 168, 76, .08);
 }

 select.sc-field option {
     background: #0a0700;
     color: var(--txt-white);
 }

 .sc-submit {
     width: 100%;
     background: linear-gradient(135deg, var(--gc-primary) 0%, var(--gc-dark) 100%);
     color: #050302;
     font-family: var(--ff-display);
     font-size: .68rem;
     font-weight: 700;
     letter-spacing: .2em;
     text-transform: uppercase;
     padding: .95rem;
     border: none;
     border-radius: 3px;
     cursor: pointer;
     position: relative;
     overflow: hidden;
     transition: transform .3s var(--ease-expo), box-shadow .3s;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 9px;
     z-index: 1;
     margin-top: .4rem;
 }

 .sc-submit::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, var(--gc-bright), var(--gc-soft));
     transform: translateX(-101%);
     transition: transform .42s var(--ease-expo);
 }

 .sc-submit>* {
     position: relative;
     z-index: 1;
 }

 .sc-submit:hover::before {
     transform: translateX(0);
 }

 .sc-submit:hover {
     transform: translateY(-2px);
     box-shadow: 0 8px 28px var(--gc-glow);
 }

 .sc-consult__contacts {
     display: flex;
     flex-wrap: wrap;
     gap: .5rem 1.2rem;
     margin-top: 1.2rem;
     padding-top: 1rem;
     border-top: 1px solid var(--gc-border);
     position: relative;
     z-index: 1;
 }

 .sc-consult__contacts span {
     font-size: .7rem;
     color: var(--txt-muted);
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .sc-consult__contacts span i {
     color: var(--gc-primary);
     font-size: .65rem;
 }

 /* ──────────────────────────────────────────
       SERVICES RIBBON
    ────────────────────────────────────────── */
 .sc-ribbon {
     background: #060401;
     border-top: 1px solid var(--gc-border);
     border-bottom: 1px solid var(--gc-border);
     /* padding: 3rem 0; */
     padding: 2rem 0;
     position: relative;
     z-index: 2;
 }

 .sc-ribbon::before {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse 60% 100% at 50% 50%, rgba(201, 168, 76, .04), transparent 70%);
     pointer-events: none;
 }

 /* Left heading column */
 .sc-ribbon__head {
     font-family: var(--ff-display);
     font-size: 1.3rem;
     font-weight: 600;
     color: var(--txt-white);
     /* margin-bottom: 1.3rem; */
     position: relative;
     /* padding-bottom: .5rem; */
 }

 .sc-ribbon__head::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 180px;
     height: 2px;
     background: linear-gradient(90deg, var(--gc-primary), transparent);
 }

 .sc-checklist {
     list-style: none;
 }

 .sc-checklist li {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: .78rem;
     color: var(--txt-muted);
     padding: .35rem 0;
     transition: color .3s, transform .3s;
     cursor: default;
 }

 .sc-checklist li:hover {
     color: var(--gc-soft);
     transform: translateX(4px);
 }

 .sc-checklist li i {
     color: var(--gc-primary);
     font-size: .7rem;
     flex-shrink: 0;
     transition: transform .3s;
 }

 .sc-checklist li:hover i {
     transform: scale(1.3);
 }

 /* Service mini cards */
 .sc-mini {
     background: var(--bg-card);
     border: 1px solid rgba(255, 255, 255, .04);
     border-radius: 4px;
     padding: 1.2rem .9rem;
     text-align: center;
     height: 100%;
     position: relative;
     overflow: hidden;
     transition: border-color .4s, transform .45s var(--ease-expo), box-shadow .4s;
 }

 .sc-mini::before {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse at 50% 0%, rgba(201, 168, 76, .06), transparent 65%);
     opacity: 0;
     transition: opacity .4s;
 }

 .sc-mini::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: linear-gradient(90deg, transparent, var(--gc-primary), transparent);
     transform: scaleX(0);
     transition: transform .45s var(--ease-expo);
 }

 .sc-mini:hover {
     border-color: var(--gc-border-mid);
     transform: translateY(-7px);
     box-shadow: 0 20px 48px rgba(0, 0, 0, .5), 0 0 22px rgba(201, 168, 76, .07);
 }

 .sc-mini:hover::before {
     opacity: 1;
 }

 .sc-mini:hover::after {
     transform: scaleX(1);
 }

 .sc-mini__icon {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     background: rgba(201, 168, 76, .07);
     border: 1px solid var(--gc-border);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.1rem;
     color: var(--gc-primary);
     margin: 0 auto .8rem;
     position: relative;
     z-index: 1;
     transition: background .3s, box-shadow .3s, transform .3s;
     animation: sc-float 6s ease-in-out infinite;
 }

 .sc-mini:nth-child(1) .sc-mini__icon {
     animation-delay: 0s;
 }

 .sc-mini:nth-child(2) .sc-mini__icon {
     animation-delay: -1.8s;
 }

 .sc-mini:nth-child(3) .sc-mini__icon {
     animation-delay: -3.6s;
 }

 .sc-mini:nth-child(4) .sc-mini__icon {
     animation-delay: -0.9s;
 }

 .sc-mini:nth-child(5) .sc-mini__icon {
     animation-delay: -2.7s;
 }

 .sc-mini:nth-child(6) .sc-mini__icon {
     animation-delay: -4.5s;
 }

 @keyframes sc-float {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-8px);
     }
 }

 .sc-mini:hover .sc-mini__icon {
     background: rgba(201, 168, 76, .16);
     box-shadow: 0 0 24px rgba(201, 168, 76, .25);
     transform: scale(1.08);
 }

 .sc-mini__name {
     font-family: var(--ff-display);
     font-size: .68rem;
     font-weight: 600;
     color: var(--gc-soft);
     margin-bottom: .22rem;
     position: relative;
     z-index: 1;
 }

 .sc-mini__desc {
     font-size: .6rem;
     color: var(--txt-muted);
     line-height: 1.55;
     position: relative;
     z-index: 1;
 }

 /* ══════════════════════════════════════════
       MAGNETIC CURSOR EFFECT
    ══════════════════════════════════════════ */
 .sc-cursor {
     position: fixed;
     width: 18px;
     height: 18px;
     border-radius: 50%;
     border: 1.5px solid rgba(201, 168, 76, .7);
     pointer-events: none;
     z-index: 9999;
     transform: translate(-50%, -50%);
     transition: width .3s, height .3s, opacity .3s;
     mix-blend-mode: difference;
 }

 .sc-cursor-dot {
     position: fixed;
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--gc-primary);
     pointer-events: none;
     z-index: 9999;
     transform: translate(-50%, -50%);
     transition: transform .08s;
 }

 /* ══════════════════════════════════════════
       TOAST NOTIFICATION
    ══════════════════════════════════════════ */
 .sc-toast {
     position: fixed;
     bottom: 2rem;
     right: 2rem;
     background: rgba(10, 7, 3, .92);
     border: 1px solid var(--gc-border-mid);
     border-radius: 4px;
     padding: 1rem 1.4rem;
     font-size: .78rem;
     color: var(--txt-white);
     display: flex;
     align-items: center;
     gap: 10px;
     z-index: 999;
     transform: translateY(120%);
     transition: transform .55s var(--ease-expo), opacity .3s;
     opacity: 0;
     backdrop-filter: blur(16px);
     max-width: 320px;
     box-shadow: 0 12px 40px rgba(0, 0, 0, .5);
 }

 .sc-toast.sc-toast--show {
     transform: translateY(0);
     opacity: 1;
 }

 .sc-toast i {
     color: var(--gc-bright);
     font-size: 1.1rem;
     flex-shrink: 0;
 }

 /* ══════════════════════════════════════════
       PARTICLE FLOATING WORDS (CSS only)
    ══════════════════════════════════════════ */
 .sc-floatword {
     position: absolute;
     font-family: var(--ff-display);
     font-size: .5rem;
     letter-spacing: .25em;
     text-transform: uppercase;
     color: rgba(201, 168, 76, .08);
     pointer-events: none;
     white-space: nowrap;
     animation: sc-word-float linear infinite;
 }

 @keyframes sc-word-float {
     0% {
         transform: translateY(0) rotate(var(--rot, 0deg));
         opacity: 0;
     }

     10% {
         opacity: 1;
     }

     90% {
         opacity: 1;
     }

     100% {
         transform: translateY(-180px) rotate(var(--rot, 0deg));
         opacity: 0;
     }
 }

 /* ══════════════════════════════════════════
       ANTI-GRAVITY PARTICLES
    ══════════════════════════════════════════ */
 .sc-ag-particle {
     position: absolute;
     border-radius: 50%;
     pointer-events: none;
     background: radial-gradient(circle, var(--gc-bright), transparent 70%);
     animation: sc-antigrav ease-in-out infinite;
 }

 @keyframes sc-antigrav {
     0% {
         transform: translateY(20px) scale(1);
         opacity: 0;
     }

     20% {
         opacity: .7;
     }

     80% {
         opacity: .5;
     }

     100% {
         transform: translateY(-200px) scale(0.3);
         opacity: 0;
     }
 }

 /* ══════════════════════════════════════════
       SECTION DIVIDER
    ══════════════════════════════════════════ */
 .sc-divider {
     width: 48px;
     height: 2px;
     background: linear-gradient(90deg, var(--gc-primary), transparent);
     margin: 1.2rem 0;
 }

 /* ══════════════════════════════════════════
       RESPONSIVE
    ══════════════════════════════════════════ */
 @media (max-width: 991.98px) {
     /* .apex-hero {
         padding-top: 72px;
     } */

     /* .sc-consult {
         margin-top: 2rem;
     } */

     .sc-headline {
         font-size: clamp(2.5rem, 6vw, 2rem);
     }

     .sc-metrics {
         gap: 0;
     }

     .sc-metric-cell {
         flex: 1 1 80px;
         padding: 1rem .5rem;
     }

     .sc-metric-val {
         font-size: 1.35rem;
     }

     .apex-hero {
         /* padding-top: 0px; */
         min-height: 90vh;
     }

     .sc-ribbon {
         padding: 1rem 0;
     }
 }

 @media (max-width: 575.98px) {
     .apex-hero {
         padding-top: 50px;
     }

     .sc-metrics {
         flex-wrap: wrap;
     }

     .sc-metric-cell {
         flex: 0 0 50%;
     }

     .sc-metric-cell:nth-child(2)::after,
     .sc-metric-cell:nth-child(4)::after {
         display: none;
     }

     .sc-metric-cell:nth-child(1),
     .sc-metric-cell:nth-child(2) {
         border-bottom: 1px solid var(--gc-border);
     }

     .sc-consult {
         padding: 1.6rem 1.2rem;
         /* max-width: 500px; */
     }

     .sc-headline {
         font-size: clamp(2rem, 6vw, 2rem);
     }

     .sc-cursor,
     .sc-cursor-dot {
         display: none;
     }


 }


 @media (max-width:440px) {
     .sc-consult__title {
         font-size: 1.6rem;
     }
 }

 @media (min-width: 992px) {
     .apex-hero .container {
         position: relative;
         z-index: 2;
     }
 }

 /* ===========================
   FOOTER
=========================== */
 #footer {
     background: var(--black-main);
     border-top: 1px solid var(--border);
     padding: 50px 0 0;
 }

 .footer-para {
     font-size: 15px;
     color: var(--text-muted);
     line-height: 1.8;
     margin-top: 14px;
     max-width: 280px;
 }

 .footer-heading {
     font-size: 16px;
     font-weight: 700;
     letter-spacing: 2.5px;
     text-transform: uppercase;
     color: var(--gold);
     /* margin-bottom: 20px; */
     padding-bottom: 10px;
     border-bottom: 1px solid var(--border);
 }

 .footer-links {
     list-style: none;
     padding: 0;
 }

 .footer-social {
     display: flex;
     gap: 10px;
     margin-top: 20px;
 }

 .social-btn {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     border: 1px solid rgba(201, 168, 76, 0.3);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--gold);
     font-size: 14px;
     text-decoration: none;
     transition: all 0.3s;
 }

 .social-btn:hover {
     background: var(--gold);
     color: var(--black);
     border-color: var(--gold);
 }

 /* .footer-links li {
     margin-bottom: 10px;
 } */


 .footer-links a {
     font-size: 15px;
     color: var(--text-muted);
     display: inline-flex;
     align-items: center;
     gap: 6px;
     transition: all 0.3s;
     text-decoration: none;
     padding-bottom: 5px;
 }

 .footer-links a:hover {
     color: var(--gold);
     padding-left: 4px;
 }

 .footer-links a i {
     font-size: 10px;
     color: var(--gold);
 }

 .footer-bottom {
     background: var(--black);
     margin-top: 20px;
     padding: 20px 0;
     border-top: 1px solid var(--border);
 }

 .footer-bottom p {
     font-size: 12px;
     color: var(--text-muted);
     margin: 0;
 }

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


 .footer-bottom {
     border-top: 1px solid rgba(201, 168, 76, 0.1);
     padding: 20px 0;
     font-size: 12px;
     color: #555;
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;
     gap: 10px;
 }

 .footer-bottom p {
     color: var(--gold);
     font-size: 13px;
     text-decoration: none;
 }


 @media (max-width: 768px) {
     .footer-para {
         max-width: 100%;
     }


 }


 @media (max-width: 576px) {
     /* #footer{
        padding: 50px 0px;
    } */


 }

 .disabled-link {
     cursor: not-allowed;
     pointer-events: none;
 }

 /* ===========================
   PARTICLE CANVAS OVERLAY
=========================== */
 /* #particles-canvas {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  z-index: 1;
  pointer-events: none;
} */

 /* ===========================
   PROGRESS BAR
=========================== */
 /* #progress-bar {
  position: fixed; top: 0; left: 0;
  height: 3px; background: linear-gradient(90deg, var(--gold-dark), var(--gold), var(--gold-light));
  z-index: 9999; width: 0%;
  transition: width 0.1s linear;
} */

 /* ===========================
   BACK TO TOP
=========================== */
 #back-top {
     position: fixed;
     bottom: 28px;
     left: 28px;
     /* right: 28px; */
     width: 44px;
     height: 44px;
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--black);
     font-size: 16px;
     cursor: pointer;
     z-index: 999;
     opacity: 0;
     /* pointer-events: none; */
     transition: all 0.3s;
     box-shadow: 0 6px 24px rgba(212, 175, 55, 0.4);
 }

 #back-top.visible {
     opacity: 1;
     pointer-events: all;
 }

 #back-top:hover {
     transform: translateY(-4px);
     box-shadow: 0 12px 32px rgba(212, 175, 55, 0.5);
 }


 #back-top i {
     font-size: 20px;
 }