:root {
      --primary:    #060d1a;
      --secondary:  #0d1f3c;
      --accent:     #00d4a8;
      --accent2:    #ff5f3b;
      --accent3:    #7c3aed;
      --accent4:    #f59e0b;
      --surface:    #ffffff;
      --surface2:   #f7f9fc;
      --text:       #0d1521;
      --muted:      #64748b;
      --border:     rgba(0,0,0,0.07);
      --topbar-h:   42px;
      --header-h:   74px;
      --font-head:  'Playfair Display', serif;
      --font-body:  'Manrope', sans-serif;
      --radius:     16px;
      --shadow:     0 4px 32px rgba(6,13,26,0.08);
      --shadow-lg:  0 20px 60px rgba(6,13,26,0.14);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
    body {
      font-family: var(--font-body);
      font-size: 0.95rem; /* Reduced from default for better readability */
      color: var(--text);
      background: var(--surface);
      padding-top: calc(var(--topbar-h) + var(--header-h));
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    }
    h1,h2,h3,h4,h5,h6 { font-family: var(--font-head); color: var(--primary); }
    a { color: var(--accent); text-decoration: none; transition: .25s; }
    img { max-width: 100%; height: auto; display: block; }

    /* CURSOR */
    .cursor-dot, .cursor-ring { display: none; }
    @media (pointer: fine) and (hover: hover) {
      .cursor-dot { display:block;width:8px;height:8px;border-radius:50%;background:var(--accent);position:fixed;top:0;left:0;z-index:99999;pointer-events:none;mix-blend-mode:difference;will-change:transform; }
      .cursor-ring { display:block;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--accent);position:fixed;top:0;left:0;z-index:99998;pointer-events:none;mix-blend-mode:difference;opacity:0.5;will-change:transform; }
    }

    /* TOPBAR */
    .topbar { position:fixed;top:0;left:0;right:0;height:var(--topbar-h);background:var(--primary);z-index:1060;display:flex;align-items:center; }
    .topbar-inner { width:100%;max-width:1440px;margin:0 auto;padding:0 clamp(16px,4vw,32px);display:flex;align-items:center;justify-content:space-between;gap:16px; }
    .topbar-badge { display:inline-flex;align-items:center;gap:7px;background:rgba(0,212,168,0.12);border:1px solid rgba(0,212,168,0.25);border-radius:20px;padding:3px 12px 3px 8px;font-size:11px;font-weight:700;color:var(--accent);letter-spacing:.08em;text-transform:uppercase;font-family:var(--font-body);white-space:nowrap; }
    .topbar-badge .dot { width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s ease-in-out infinite;flex-shrink:0; }
    @keyframes pulse { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(0,212,168,.4)} 50%{opacity:.7;box-shadow:0 0 0 4px rgba(0,212,168,0)} }
    .topbar-right { display:flex;align-items:center;gap:16px;flex-shrink:0; }
    .topbar-contact { display:flex;align-items:center;gap:16px; }
    .topbar-contact a { display:flex;align-items:center;gap:7px;font-size:12px;color:rgba(255,255,255,.65);font-weight:500;font-family:var(--font-body); }
    .topbar-contact a:hover { color:var(--accent); }
    .topbar-divider { width:1px;height:16px;background:rgba(255,255,255,.12); }
    .topbar-socials { display:flex;gap:4px; }
    .topbar-socials a { width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5);font-size:11px; }
    .topbar-socials a:hover { background:var(--accent);border-color:var(--accent);color:#fff; }

    /* HEADER */
    #header { position:fixed;top:var(--topbar-h);left:0;right:0;height:var(--header-h);background:rgba(255,255,255,0.96);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--border);z-index:1050;transition:box-shadow .3s,background .3s; }
    #header.scrolled { background:rgba(255,255,255,.99);box-shadow:0 1px 0 rgba(0,0,0,.05),0 8px 32px rgba(6,13,26,.07); }
    .header-inner { max-width:1440px;margin:0 auto;padding:0 clamp(16px,4vw,32px);height:100%;display:flex;align-items:center;justify-content:space-between;gap:32px; }

    /* LOGO */
    .logo-wrap { display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0; }
    .logo-icon { width:46px;height:46px;border-radius:14px;background:var(--primary);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0; }
    .logo-icon::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(0,212,168,.3) 100%); }
    .logo-icon img { width:26px;height:26px;object-fit:contain;filter:brightness(0) invert(1);position:relative;z-index:1; }
    .logo-icon-fallback { font-size:20px;color:var(--accent);position:relative;z-index:1; }
    .logo-name { font-family:var(--font-head);font-size:20px;font-weight:900;color:var(--primary);letter-spacing:-.03em;line-height:1; }
    .logo-name span { color:var(--accent); }
    .logo-sub { font-size:9.5px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-top:3px;font-family:var(--font-body);font-weight:500; }
    .logo-text-wrap { display:flex;flex-direction:column; }

    /* NAV */
    .navmenu ul { list-style:none;display:flex;align-items:center;gap:2px; }
    .navmenu ul li a { padding:9px 15px;font-family:var(--font-body);font-size:14px;font-weight:600;color:var(--text);border-radius:10px;display:block;transition:all .2s;position:relative;letter-spacing:-.01em;white-space:nowrap; }
    .navmenu ul li a::after { content:'';position:absolute;bottom:5px;left:50%;transform:translateX(-50%) scaleX(0);width:14px;height:2px;border-radius:2px;background:var(--accent);transition:transform .3s cubic-bezier(.34,1.56,.64,1); }
    .navmenu ul li a:hover { color:var(--accent);background:rgba(0,212,168,.06); }
    .navmenu ul li a:hover::after, .navmenu ul li a.active::after { transform:translateX(-50%) scaleX(1); }
    .navmenu ul li a.active { color:var(--accent); }

    /* HEADER ACTIONS */
    .header-actions { display:flex;align-items:center;gap:10px;flex-shrink:0; }
    .btn-nav-outline { padding:9px 18px;border-radius:10px;border:1.5px solid var(--border);font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--text);background:transparent;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:42px; }
    .btn-nav-outline:hover { border-color:var(--accent);color:var(--accent);background:rgba(0,212,168,.04); }
    .btn-nav-primary { padding:10px 20px;border-radius:10px;border:none;font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--primary);background:var(--accent);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:42px;box-shadow:0 4px 16px rgba(0,212,168,.3); }
    .btn-nav-primary:hover { transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,212,168,.4);color:var(--primary); }
    .mobile-nav-toggle { display:none;width:44px;height:44px;border-radius:11px;background:var(--surface2);border:1px solid var(--border);align-items:center;justify-content:center;font-size:20px;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-shrink:0; }
    .mobile-nav-toggle:hover { background:var(--accent);color:var(--primary);border-color:var(--accent); }

    /* MOBILE DRAWER */
    .nav-drawer { position:fixed;top:calc(var(--topbar-h) + var(--header-h));left:0;right:0;background:var(--surface);z-index:1039;box-shadow:0 24px 60px rgba(6,13,26,.18);border-bottom:2px solid var(--accent);transform:translateY(-110%);transition:transform .35s cubic-bezier(.16,1,.3,1);overflow-y:auto;max-height:calc(100dvh - var(--topbar-h) - var(--header-h));padding:8px 0 calc(12px + env(safe-area-inset-bottom)); }
    .nav-drawer.open { transform:translateY(0); }
    .nav-drawer ul { list-style:none;padding:8px 12px;margin:0;display:flex;flex-direction:column;gap:2px; }
    .nav-drawer ul li a { display:flex;align-items:center;gap:10px;padding:14px 18px;border-radius:12px;font-family:var(--font-body);font-size:16px;font-weight:600;color:var(--text);-webkit-tap-highlight-color:transparent; }
    .nav-drawer ul li a:hover, .nav-drawer ul li a.active { color:var(--accent);background:rgba(0,212,168,.06); }
    .nav-drawer-cta { padding:12px 20px;border-top:1px solid var(--border);margin-top:4px;display:flex;gap:10px; }
    .nav-drawer-cta a { flex:1;padding:13px 16px;border-radius:12px;text-align:center;font-family:var(--font-body);font-size:14px;font-weight:700;-webkit-tap-highlight-color:transparent; }
    .nav-drawer-cta .cta-call { border:1.5px solid var(--border);color:var(--text);display:flex;align-items:center;justify-content:center;gap:8px; }
    .nav-drawer-cta .cta-primary { background:var(--accent);color:var(--primary);display:flex;align-items:center;justify-content:center;gap:8px; }

    /* HERO */
    .hero { min-height:100dvh;background:var(--primary);position:relative;overflow:hidden;display:flex;align-items:center; }
    .hero-bg-mesh { position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 65% 50%,rgba(0,212,168,.14) 0%,transparent 65%),radial-gradient(ellipse 50% 60% at 10% 90%,rgba(124,58,237,.12) 0%,transparent 55%),radial-gradient(ellipse 40% 40% at 90% 10%,rgba(255,95,59,.08) 0%,transparent 50%); }
    .hero-grid { position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:64px 64px; }
    .hero-orbs { position:absolute;inset:0;overflow:hidden;pointer-events:none; }
    .orb { position:absolute;border-radius:50%;filter:blur(80px);opacity:.3; }
    .orb-1 { width:500px;height:500px;background:rgba(0,212,168,.35);right:-100px;top:-100px;animation:float1 12s ease-in-out infinite; }
    .orb-2 { width:350px;height:350px;background:rgba(124,58,237,.3);left:-80px;bottom:-80px;animation:float2 15s ease-in-out infinite; }
    .orb-3 { width:200px;height:200px;background:rgba(255,95,59,.25);left:40%;top:20%;animation:float3 10s ease-in-out infinite; }
    @keyframes float1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-30px,30px)} }
    @keyframes float2 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(20px,-20px)} }
    @keyframes float3 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-15px,25px)} }
    .hero .carousel { width:100%;min-height:100dvh; }
    .hero-carousel-item { min-height:100dvh;display:flex;align-items:center;position:relative;z-index:2; }
    .hero-carousel-item .bg-img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.08; }
    .hero-content { position:relative;z-index:3;
     }
    .hero-eyebrow { display:inline-flex;align-items:center;gap:10px;background:rgba(0,212,168,.1);border:1px solid rgba(0,212,168,.2);border-radius:40px;padding:7px 18px 7px 10px;font-size:11.5px;font-weight:700;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;font-family:var(--font-body);margin-bottom:28px; }
    .hero-eyebrow .eyebrow-dot { width:22px;height:22px;border-radius:50%;background:rgba(0,212,168,.2);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
    .hero-eyebrow .eyebrow-dot i { font-size:10px;color:var(--accent); }
    .hero h1 { font-family:var(--font-head);font-weight:900;font-size:clamp(20px,3.5vw,82px);color:#fff;line-height:1.08;letter-spacing:-.04em;margin-bottom:24px; }
    .hero h1 em { font-style:italic;color:var(--accent); }
    .hero h1 .outline-text { -webkit-text-stroke:2px rgba(255,255,255,.3);color:transparent; }
    .hero p.lead { font-size:clamp(15px,1.8vw,18px);line-height:1.75;color:rgba(255,255,255,.65);max-width:540px;margin-bottom:40px;font-weight:400; }
    .hero-btns { display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:56px; }
    .btn-hero-fill { display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:var(--primary);padding:15px 32px;border-radius:100px;font-family:var(--font-body);font-size:15px;font-weight:800;box-shadow:0 8px 28px rgba(0,212,168,.35);-webkit-tap-highlight-color:transparent; }
    .btn-hero-fill:hover { color:var(--primary);transform:translateY(-2px);box-shadow:0 14px 38px rgba(0,212,168,.45); }
    .btn-hero-ghost { display:inline-flex;align-items:center;gap:10px;border:1.5px solid rgba(255,255,255,.2);color:rgba(255,255,255,.8);padding:15px 32px;border-radius:100px;font-family:var(--font-body);font-size:15px;font-weight:700;backdrop-filter:blur(8px);-webkit-tap-highlight-color:transparent; }
    .btn-hero-ghost:hover { border-color:var(--accent);color:var(--accent);background:rgba(0,212,168,.06); }
    .btn-hero-ghost .play-ring { width:28px;height:28px;border-radius:50%;border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
    .hero-stats { display:flex;gap:0;padding-top:44px;border-top:1px solid rgba(255,255,255,.08); }
    .hero-stat { padding:0 clamp(20px,4vw,40px) 0 0;flex-shrink:0; }
    .hero-stat + .hero-stat { padding-left:clamp(20px,4vw,40px);border-left:1px solid rgba(255,255,255,.1); }
    .hero-stat-num { font-family:var(--font-head);font-size:clamp(28px,4vw,44px);font-weight:900;color:#fff;line-height:1;letter-spacing:-.04em; }
    .hero-stat-num span { color:var(--accent); }
    .hero-stat-label { font-size:12px;color:rgba(255,255,255,.45);margin-top:5px;font-weight:500; }
    .carousel-indicators [data-bs-target] { width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);border:none; }
    .carousel-indicators .active { background:var(--accent);width:32px;border-radius:4px; }

     /* Hero right card stack */
    .hero-right { position: relative; z-index: 3; }
    .hero-card-stack { position: relative; padding: 40px 20px; }
    .hcard {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.1);
      backdrop-filter: blur(20px); border-radius: 20px;
      padding: 24px 28px;
    }
    .hcard-main { position: relative; z-index: 2; }
    .hcard-float1 {
      position: absolute; top: 0; right: -20px; z-index: 3;
      width: 180px; animation: cardFloat1 6s ease-in-out infinite;
    }
    .hcard-float2 {
      position: absolute; bottom: 20px; left: -30px; z-index: 3;
      width: 160px; animation: cardFloat2 8s ease-in-out infinite;
    }
    @keyframes cardFloat1 { 0%,100%{transform:translateY(0) rotate(2deg)} 50%{transform:translateY(-12px) rotate(-1deg)} }
    @keyframes cardFloat2 { 0%,100%{transform:translateY(0) rotate(-3deg)} 50%{transform:translateY(10px) rotate(1deg)} }
    .hcard-icon {
      width: 48px; height: 48px; border-radius: 14px;
      background: rgba(0,212,168,.15); display: flex; align-items: center; justify-content: center;
      font-size: 22px; color: var(--accent); margin-bottom: 14px;
    }
    .hcard-title { font-family: var(--font-head); font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 6px; }
    .hcard-sub { font-size: 12px; color: rgba(255,255,255,.55); font-family: var(--font-body); }
    .hcard-stat { font-family: var(--font-head); font-size: 32px; font-weight: 900; color: #fff; }
    .hcard-stat span { color: var(--accent); }
    .mini-badge {
      display: inline-flex; align-items: center; gap: 5px;
      background: rgba(0,212,168,.15); border-radius: 30px;
      padding: 4px 10px; font-size: 11px; color: var(--accent);
      font-weight: 700; font-family: var(--font-body);
    }
    .mini-badge i { font-size: 9px; }
    .hcard-avatar-row { display: flex; align-items: center; margin-top: 12px; }
    .hcard-avatar {
      width: 32px; height: 32px; border-radius: 50%;
      border: 2px solid rgba(255,255,255,.2); overflow: hidden;
      background: var(--accent); display: flex; align-items: center; justify-content: center;
      font-size: 12px; font-weight: 700; color: var(--primary);
      margin-left: -8px; font-family: var(--font-body); flex-shrink: 0;
    }
    .hcard-avatar:first-child { margin-left: 0; }
    .hcard-avatar-count { margin-left: 10px; font-size: 12px; color: rgba(255,255,255,.55); font-family: var(--font-body); }

    .carousel-indicators [data-bs-target] {
      width: 7px; height: 7px; border-radius: 50%;
      background: rgba(255,255,255,.3); border: none;
    }
    .carousel-indicators .active { background: var(--accent); width: 32px; border-radius: 4px; }

      /* =========================================================
       LARGE SCREEN (≥1400px)
    ========================================================= */
    @media (min-width: 1400px) {
      .hero h1 { font-size: clamp(64px, 5.5vw, 86px); }
      .hero p.lead { font-size: 19px; }
      .hero-right { display: block; }
      .hero-card-stack { display: block; }
    }
      /* Tablet hero cleanup handled in responsive section below */


    /* SECTION BASE */
    section { padding:clamp(30px,8vw,20px) 0;scroll-margin-top:calc(var(--topbar-h) + var(--header-h) + 20px); }
    .container { width:100%;max-width:1320px;padding-left:clamp(16px,4vw,32px);padding-right:clamp(16px,4vw,32px);margin-left:auto;margin-right:auto; }
    .section-eyebrow { display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:800;color:var(--accent);letter-spacing:.15em;text-transform:uppercase;font-family:var(--font-body);margin-bottom:14px; }
    .section-eyebrow::before { content:'';width:24px;height:2px;background:var(--accent);border-radius:2px; }
    .section-title { font-size:clamp(18px,2.2vw,48px);font-weight:900;letter-spacing:-.04em;color:var(--primary);line-height:1.1;margin-bottom:16px; }
    .section-title em { font-style:italic;color:var(--accent); }
    .section-desc { font-size:clamp(10px,1vw,16px);color:var(--muted);line-height:1.75;font-weight:400; }

    /* ABOUT */
    .about-section { background:var(--surface2);position:relative;overflow:hidden; }
    .about-img-wrap { position:relative;margin-bottom:32px; }
    .about-img-outer { border-radius:22px;overflow:hidden;box-shadow:0 32px 80px rgba(6,13,26,.15);position:relative; }
    .about-img-outer::before { content:'';position:absolute;inset:0;background:linear-gradient(to bottom right,transparent 60%,rgba(0,212,168,.15) 100%);z-index:1; }
    .about-img-outer img { width:100%;display:block; }
    .about-badge { position:absolute;bottom:-20px;right:-12px;background:var(--primary);border-radius:18px;padding:18px 24px;box-shadow:0 20px 50px rgba(6,13,26,.25);display:flex;align-items:center;gap:16px;z-index:2; }
    .about-badge-icon { width:52px;height:52px;border-radius:14px;background:rgba(0,212,168,.15);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--accent);flex-shrink:0; }
    .about-badge-num { font-family:var(--font-head);font-size:30px;font-weight:900;color:#fff;line-height:1; }
    .about-badge-label { font-size:11px;color:rgba(255,255,255,.5);margin-top:2px;font-family:var(--font-body); }
    .about-dot-grid { position:absolute;top:-30px;left:-30px;z-index:-1;width:200px;height:200px;background-image:radial-gradient(rgba(0,212,168,.25) 1.5px,transparent 1.5px);background-size:20px 20px;border-radius:12px; }
    .feature-list { list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:32px; }
    .feature-list li { display:flex;align-items:center;gap:14px;font-size:15px;color:var(--text);font-weight:600;padding:14px 18px;border-radius:14px;background:var(--surface);border:1px solid var(--border);transition:all .3s; }
    .feature-list li:hover { border-color:rgba(0,212,168,.25);box-shadow:0 4px 20px rgba(0,212,168,.08); }
    .feature-list li .feat-icon { width:36px;height:36px;border-radius:10px;background:rgba(0,212,168,.1);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0; }

    /* STATS */
    .stats-section { background:var(--primary);padding:clamp(56px,8vw,80px) 0;position:relative;overflow:hidden; }
    .stats-section::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 100% at 50% 50%,rgba(0,212,168,.08) 0%,transparent 70%); }
    .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:0; }
    .stat-item { text-align:center;padding:clamp(20px,3vw,36px) clamp(12px,2vw,20px);position:relative; }
    .stat-item + .stat-item::before { content:'';position:absolute;left:0;top:30%;bottom:30%;width:1px;background:rgba(255,255,255,.08); }
    .stat-icon-wrap { width:60px;height:60px;border-radius:16px;background:rgba(0,212,168,.1);border:1px solid rgba(0,212,168,.15);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--accent);margin:0 auto 16px; }
    .stat-number { font-family:var(--font-head);font-size:clamp(38px,5vw,56px);font-weight:900;color:#fff;line-height:1;display:block;letter-spacing:-.05em; }
    .stat-label { font-size:12px;color:rgba(255,255,255,.5);margin-top:8px;font-weight:600;font-family:var(--font-body);letter-spacing:.05em;text-transform:uppercase; }

    /* BRANDS */
    .services-section { background:var(--surface); }
    .brand-card { background:var(--surface);border:1px solid var(--border);border-radius:22px;overflow:hidden;transition:all .4s cubic-bezier(.16,1,.3,1);height:100%; }
    .brand-card:hover { transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:rgba(0,212,168,.25); }
    .brand-card-header { padding:28px 28px 20px;display:flex;align-items:center;gap:16px; }
    .brand-icon { width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0; }
    .brand-card h4 { font-size:19px;font-weight:700;margin:0 0 4px;letter-spacing:-.02em; }
    .brand-card .brand-industry { font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-family:var(--font-body); }
    .brand-card-body { padding:0 28px 28px; }
    .brand-card-body p { font-size:14px;color:var(--muted);line-height:1.75;margin-bottom:18px; }
    .brand-services { display:flex;flex-wrap:wrap;gap:7px;margin-bottom:22px; }
    .brand-service-tag { padding:4px 12px;border-radius:20px;font-size:11.5px;font-weight:700;background:rgba(0,212,168,.08);color:var(--accent);font-family:var(--font-body); }
    .brand-link { display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--accent);font-family:var(--font-body); }
    .brand-link:hover { gap:12px; }

    /* WHY */
    .why-section { background:var(--surface2); }
    .why-card { background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:clamp(24px,4vw,36px) clamp(20px,3vw,30px);height:100%;transition:all .35s cubic-bezier(.16,1,.3,1); }
    .why-card:hover { transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:rgba(0,212,168,.25); }
    .why-icon { width:58px;height:58px;border-radius:16px;background:rgba(0,212,168,.08);border:1px solid rgba(0,212,168,.15);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--accent);margin-bottom:20px; }
    .why-card h4 { font-size:18px;font-weight:700;margin-bottom:10px;letter-spacing:-.02em; }
    .why-card p { font-size:14px;color:var(--muted);line-height:1.75;margin:0; }

    /* CTA */
    .cta-section { background:var(--accent);padding:clamp(64px,8vw,90px) 0;position:relative;overflow:hidden; }
    .cta-bg-circle { position:absolute;border-radius:50%;opacity:.12;pointer-events:none; }
    .cta-bg-circle-1 { width:400px;height:400px;background:var(--primary);top:-150px;right:-100px; }
    .cta-bg-circle-2 { width:300px;height:300px;background:var(--primary);bottom:-120px;left:-80px; }
    .cta-section h2 { font-size:clamp(26px,4vw,52px);font-weight:900;color:var(--primary);margin-bottom:16px;letter-spacing:-.04em; }
    .cta-section p { font-size:clamp(14px,1.6vw,17px);color:rgba(6,13,26,.65);margin-bottom:36px;max-width:560px;margin-left:auto;margin-right:auto; }
    .btn-cta-dark { display:inline-flex;align-items:center;gap:10px;background:var(--primary);color:#fff;padding:16px 36px;border-radius:100px;font-family:var(--font-body);font-size:15px;font-weight:800;box-shadow:0 8px 28px rgba(6,13,26,.25); }
    .btn-cta-dark:hover { transform:translateY(-2px);box-shadow:0 16px 40px rgba(6,13,26,.35);color:#fff; }
    .btn-cta-outline { display:inline-flex;align-items:center;gap:10px;border:2px solid rgba(6,13,26,.2);color:var(--primary);padding:16px 36px;border-radius:100px;font-family:var(--font-body);font-size:15px;font-weight:700; }
    .btn-cta-outline:hover { border-color:var(--primary);background:rgba(6,13,26,.05);color:var(--primary); }

    /* VISION/MISSION */
    .vm-section { background:var(--primary);position:relative;overflow:hidden; }
    .vm-section::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(0,212,168,.07) 0%,transparent 70%); }
    .vm-card { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:clamp(28px,5vw,48px) clamp(24px,4vw,40px);height:100%;transition:all .3s; }
    .vm-card:hover { background:rgba(255,255,255,.07);border-color:rgba(0,212,168,.2); }
    .vm-card-eyebrow { font-size:10.5px;font-weight:800;color:var(--accent);letter-spacing:.2em;text-transform:uppercase;font-family:var(--font-body);margin-bottom:14px;display:flex;align-items:center;gap:8px; }
    .vm-card-eyebrow::before { content:'';width:20px;height:2px;background:var(--accent);border-radius:2px; }
    .vm-card h3 { font-size:clamp(22px,3vw,28px);font-weight:900;color:#fff;margin-bottom:16px;letter-spacing:-.03em; }
    .vm-card p { font-size:15px;color:rgba(255,255,255,.6);line-height:1.8;margin-bottom:24px; }
    .vm-list { list-style:none;display:flex;flex-direction:column;gap:12px; }
    .vm-list li { display:flex;align-items:center;gap:12px;font-size:14px;color:rgba(255,255,255,.7);font-family:var(--font-body);font-weight:500; }
    .vm-list li::before { content:'';width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0; }

    /* AWARDS */
    .awards-section { background:var(--surface2);position:relative;overflow:hidden; }

    /* TEAM */
    .team-section { background:var(--surface); }
    .team-card { border-radius:22px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow);position:relative;border:1px solid var(--border); }
    .team-card-img-wrap { position:relative;overflow:hidden; }
    .team-card img { width:100%;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .5s ease; }
    .team-card:hover img { transform:scale(1.04); }
    .team-overlay { position:absolute;inset:0;background:linear-gradient(to top,rgba(6,13,26,.92) 0%,rgba(6,13,26,.35) 55%,transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:24px;transition:opacity .3s; }
    .team-overlay h4 { font-size:19px;font-weight:700;color:#fff;margin-bottom:4px; }
    .team-overlay .role { font-size:12px;color:var(--accent);display:block;margin-bottom:16px;font-weight:700;font-family:var(--font-body);text-transform:uppercase;letter-spacing:.06em; }
    .team-socials { display:flex;gap:8px; }
    .team-socials a { width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px; }
    .team-socials a:hover { background:var(--accent);border-color:var(--accent);color:var(--primary); }

    /* FAQ */
    .faq-section { background:var(--surface2); }
    .accordion-button { font-family:var(--font-body);font-weight:700;font-size:15px;color:var(--primary);background:transparent;box-shadow:none;padding:20px 24px;border-radius:14px !important; }
    .accordion-button:not(.collapsed) { color:var(--accent);background:rgba(0,212,168,.04);box-shadow:none; }
    .accordion-button:not(.collapsed)::after { filter:invert(60%) sepia(80%) saturate(500%) hue-rotate(130deg); }
    .accordion-item { border:1px solid var(--border) !important;border-radius:14px !important;margin-bottom:10px;overflow:hidden; }
    .accordion-body { font-size:14.5px;color:var(--muted);line-height:1.8;padding:0 24px 22px; }
    .faq-left h2 { font-size:clamp(26px,3.5vw,44px);font-weight:900;letter-spacing:-.04em; }

    /* CONTACT */
    .contact-section { background:var(--primary);position:relative;overflow:hidden; }
    .contact-section::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 30% 50%,rgba(0,212,168,.1) 0%,transparent 65%); }
    .contact-info-card { background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:22px 24px;display:flex;align-items:flex-start;gap:16px;backdrop-filter:blur(10px);transition:all .3s; }
    .contact-info-card:hover { background:rgba(255,255,255,.08);border-color:rgba(0,212,168,.2); }
    .contact-icon { width:48px;height:48px;border-radius:13px;background:rgba(0,212,168,.12);border:1px solid rgba(0,212,168,.15);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0; }
    .contact-info-card h4 { font-size:14.5px;font-weight:700;color:#fff;margin-bottom:5px; }
    .contact-info-card p { font-size:13px;color:rgba(255,255,255,.5);margin:0;line-height:1.65;font-family:var(--font-body); }
    .contact-info-card a { color:rgba(255,255,255,.5); }
    .contact-info-card a:hover { color:var(--accent); }
    .contact-form-wrap { background:var(--surface);border-radius:24px;padding:clamp(24px,5vw,52px);box-shadow:0 32px 80px rgba(6,13,26,.2); }
    .contact-form-wrap h3 { font-size:clamp(22px,3vw,28px);font-weight:900;letter-spacing:-.03em;margin-bottom:8px; }
    .contact-form-wrap p { font-size:14px;color:var(--muted);margin-bottom:28px; }
    .form-control-tern { border:1.5px solid var(--border);border-radius:12px;padding:13px 16px;font-size:15px;font-family:var(--font-body);color:var(--text);background:var(--surface2);width:100%;outline:none;font-weight:500;transition:border-color .25s,box-shadow .25s;-webkit-appearance:none;appearance:none;min-height:48px; }
    .form-control-tern:focus { border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px rgba(0,212,168,.1); }
    .form-control-tern::placeholder { color:#b0b8c5; }
    select.form-control-tern { cursor:pointer; }
    .btn-submit { background:var(--accent);color:var(--primary);border:none;padding:15px 36px;border-radius:100px;font-family:var(--font-body);font-size:15px;font-weight:800;cursor:pointer;transition:all .3s;box-shadow:0 6px 24px rgba(0,212,168,.35);display:inline-flex;align-items:center;gap:10px;min-height:52px; }
    .btn-submit:hover { transform:translateY(-2px);box-shadow:0 12px 36px rgba(0,212,168,.45); }

    /* FOOTER */
    #footer { background:#040a15;color:rgba(255,255,255,.6);padding:clamp(56px,8vw,90px) 0 0; }
    .footer-logo-name { font-family:var(--font-head);font-size:22px;font-weight:900;color:#fff;letter-spacing:-.03em; }
    .footer-logo-name span { color:var(--accent); }
    #footer p { font-size:14px;line-height:1.85; }
    #footer h5 { font-family:var(--font-head);font-size:16px;font-weight:700;color:#fff;margin-bottom:22px; }
    #footer ul { list-style:none;padding:0;margin:0; }
    #footer ul li { margin-bottom:10px; }
    #footer ul li a { font-size:14px;color:rgba(255,255,255,.5);font-family:var(--font-body);display:inline-flex;align-items:center;gap:8px;min-height:36px; }
    #footer ul li a:hover { color:var(--accent);transform:translateX(4px); }
    #footer ul li a::before { content:'';width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.2);flex-shrink:0; }
    #footer ul li a:hover::before { background:var(--accent); }
    .footer-socials { display:flex;gap:10px;margin-top:24px;flex-wrap:wrap; }
    .footer-socials a { width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5);font-size:15px; }
    .footer-socials a:hover { background:var(--accent);border-color:var(--accent);color:var(--primary);transform:translateY(-2px); }
    .footer-contact-item { display:flex;align-items:flex-start;gap:12px;margin-bottom:16px; }
    .footer-contact-item i { color:var(--accent);font-size:14px;margin-top:3px;flex-shrink:0; }
    .footer-contact-item a, .footer-contact-item span { font-size:13.5px;color:rgba(255,255,255,.5);font-family:var(--font-body); }
    .footer-contact-item a:hover { color:var(--accent); }
    .footer-bottom { margin-top:clamp(48px,6vw,72px);padding:clamp(20px,3vw,28px) 0;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px; }
    .footer-bottom p { margin:0;font-size:13px;color:rgba(255,255,255,.3);font-family:var(--font-body); }

    /* SCROLL TOP */
    #scroll-top { position:fixed;bottom:calc(28px + env(safe-area-inset-bottom));right:24px;z-index:9999;width:48px;height:48px;border-radius:14px;background:var(--accent);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 6px 24px rgba(0,212,168,.4);opacity:0;visibility:hidden;transition:all .35s; }
    #scroll-top.active { opacity:1;visibility:visible; }
    #scroll-top:hover { transform:translateY(-3px);box-shadow:0 12px 36px rgba(0,212,168,.5); }

    /* PRELOADER */
    #preloader { position:fixed;inset:0;z-index:99999;background:var(--primary);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;transition:opacity .6s,visibility .6s; }
    #preloader.hidden { opacity:0;visibility:hidden;pointer-events:none; }
    .preloader-logo { font-family:var(--font-head);font-size:32px;font-weight:900;color:#fff;letter-spacing:-.04em; }
    .preloader-logo span { color:var(--accent); }
    .preloader-bar-wrap { width:160px;height:2px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden; }
    .preloader-bar { height:100%;background:var(--accent);border-radius:2px;animation:barFill 1.4s ease-out forwards; }
    @keyframes barFill { from{width:0} to{width:100%} }

    /* REVEAL */
    .reveal { opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1); }
    .reveal.revealed { opacity:1;transform:none; }
    .reveal-left { opacity:0;transform:translateX(-28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1); }
    .reveal-left.revealed { opacity:1;transform:none; }
    .reveal-right { opacity:0;transform:translateX(28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1); }
    .reveal-right.revealed { opacity:1;transform:none; }
    .reveal-delay-1 { transition-delay:.1s; }
    .reveal-delay-2 { transition-delay:.2s; }
    .reveal-delay-3 { transition-delay:.3s; }
    .reveal-delay-4 { transition-delay:.4s; }

    /* =========================================================
       RESPONSIVE — ALL DEVICES
    ========================================================= */

    /* --- XL Desktop (≥1400px) already handled above --- */

    /* --- Laptop / Small Desktop (≤1199px) --- */
    @media (max-width:1199px) {
      .hero h1 { font-size:clamp(32px,5vw,60px); }
      .hero p.lead { font-size:16px; }
      .brand-card-header { padding:22px 22px 16px; }
      .brand-card-body { padding:0 22px 22px; }
      .contact-form-wrap { padding:clamp(24px,4vw,40px); }
    }

    /* --- Tablet landscape (≤1024px) --- */
    @media (max-width:1024px) {
      .hero-right { display:none !important; }
      .hero-card-stack { display:none; }
      .hcard-float1, .hcard-float2 { display:none; }
      /* .hero-content { padding:clamp(48px,6vh,80px) 0; } */
      .why-card { padding:24px 20px; }
      .vm-card { padding:28px 24px; }
    }

    /* --- Tablet portrait / small tablet (≤991px) --- */
    @media (max-width:991px) {
      :root { --topbar-h:40px; --header-h:66px; }
      .navmenu { display:none; }
      .header-actions .btn-nav-outline { display:none; }
      .header-actions .btn-nav-primary { display:none; }
      .mobile-nav-toggle { display:flex; }
      .stats-grid { grid-template-columns:repeat(2,1fr); }
      .stat-item + .stat-item::before { display:none; }
      .stat-item:nth-child(odd)::after { content:'';position:absolute;right:0;top:25%;bottom:25%;width:1px;background:rgba(255,255,255,.08); }
      section { padding:clamp(48px,7vw,80px) 0; }
      .faq-left { margin-bottom:12px; }
      .faq-left h2 { font-size:clamp(24px,4vw,36px); }
      .contact-info-card { padding:18px 20px; }
      .footer-bottom { flex-direction:column;text-align:center;gap:6px; }
    }

    /* --- Large mobile / phablet (≤767px) --- */
    @media (max-width:767px) {
      .hero-btns { flex-direction:column; }
      .btn-hero-fill, .btn-hero-ghost { width:100%;justify-content:center;padding:14px 24px; }
      .about-badge { position:relative;bottom:0;right:0;margin-top:16px;border-radius:14px; }
      .about-img-outer { border-radius:16px; }
      .about-dot-grid { display:none; }
      .hero-eyebrow { font-size:10px;padding:6px 14px 6px 8px;margin-bottom:20px; }
      .hero h1 { font-size:clamp(28px,7vw,42px);margin-bottom:16px; }
      .hero p.lead { font-size:15px;margin-bottom:28px; }
      .hero-stats { gap:16px; }
      .hero-stat { padding:0; }
      .hero-stat + .hero-stat { padding-left:0;border-left:none;padding-top:12px;border-top:1px solid rgba(255,255,255,.08); }
      .hero-stat-num { font-size:clamp(24px,6vw,32px); }
      .brand-card { border-radius:16px; }
      .brand-card-header { padding:20px 20px 14px;gap:12px; }
      .brand-icon { width:48px;height:48px;border-radius:12px; }
      .brand-card-body { padding:0 20px 20px; }
      .why-card { border-radius:16px;padding:22px 18px; }
      .why-icon { width:48px;height:48px;border-radius:12px;font-size:20px;margin-bottom:16px; }
      .vm-card { border-radius:18px;padding:24px 20px; }
      .team-card { border-radius:16px; }
      .team-overlay { padding:18px; }
      .team-overlay h4 { font-size:16px; }
      .accordion-button { padding:16px 18px;font-size:14px; }
      .accordion-body { padding:0 18px 18px;font-size:13.5px; }
      .cta-section h2 { font-size:clamp(22px,5vw,36px); }
      .cta-section p { font-size:14px;margin-bottom:24px; }
      .btn-cta-dark, .btn-cta-outline { padding:14px 28px;font-size:14px; }
      .contact-form-wrap { padding:24px 20px;border-radius:18px; }
      .contact-form-wrap h3 { font-size:20px; }
      .form-control-tern { padding:12px 14px;font-size:14px;border-radius:10px;min-height:44px; }
      .btn-submit { padding:14px 28px;font-size:14px;min-height:48px; }
      .feature-list li { padding:12px 14px;font-size:14px;border-radius:12px; }
      .section-title { font-size:clamp(24px,5vw,38px);margin-bottom:12px; }
      .section-desc { font-size:15px; }
      #footer { padding:clamp(40px,6vw,64px) 0 0; }
      .footer-bottom { margin-top:clamp(32px,5vw,48px);padding:18px 0; }
    }

    /* --- Mobile (≤575px) --- */
    @media (max-width:575px) {
      :root { --topbar-h:0px; --header-h:60px; }
      body { padding-top:var(--header-h); }
      .topbar { display:none; }
      #header { top:0; }
      .header-inner { padding:0 50px;
              padding-left: 14px; }
      .logo-icon { width:38px;height:38px;border-radius:10px; }
      .logo-icon img { width:22px;height:22px; }
      .logo-name { font-size:17px; }
      .logo-sub { display:none; }
      .nav-drawer { top:var(--header-h); }
      .hero { min-height:calc(100dvh - var(--header-h)); }
      .hero .carousel { min-height:calc(100dvh - var(--header-h)); }
      .hero-carousel-item { min-height:calc(100dvh - var(--header-h)); }
      /* .hero-content { padding:clamp(32px,5vh,60px) 0; } */
      .hero-stats { flex-direction:column;gap:12px;padding-top:28px; }
      .stats-grid { grid-template-columns:repeat(2,1fr); }
      .stat-icon-wrap { width:48px;height:48px;border-radius:12px;font-size:20px;margin-bottom:12px; }
      .stat-number { font-size:clamp(30px,8vw,42px); }
      .stat-label { font-size:11px; }
      .about-badge { padding:14px 18px;border-radius:12px; }
      .about-badge-icon { width:42px;height:42px;border-radius:12px;font-size:20px; }
      .about-badge-num { font-size:24px; }
      .container { padding-left:16px;padding-right:16px; }
      section { padding:clamp(40px,8vw,64px) 0; }
      .section-eyebrow { font-size:10px;letter-spacing:.12em;margin-bottom:10px; }
      .section-title { font-size:clamp(22px,6vw,32px); }
      .section-desc { font-size:14px; }
      .brand-card h4 { font-size:17px; }
      .brand-card-body p { font-size:13px; }
      .brand-service-tag { font-size:10.5px;padding:3px 10px; }
      .why-card h4 { font-size:16px; }
      .why-card p { font-size:13px; }
      .vm-card h3 { font-size:clamp(20px,4vw,24px); }
      .vm-card p { font-size:14px; }
      .team-card img { aspect-ratio:1/1; }
      .team-overlay .role { font-size:10.5px;margin-bottom:10px; }
      .team-socials a { width:32px;height:32px;border-radius:8px;font-size:12px; }
      .faq-left h2 { font-size:clamp(22px,5vw,30px); }
      .contact-icon { width:40px;height:40px;border-radius:10px;font-size:16px; }
      .contact-info-card h4 { font-size:13px; }
      .contact-info-card p { font-size:12px; }
      .contact-form-wrap { padding:20px 16px;border-radius:16px; }
      #footer h5 { font-size:15px;margin-bottom:16px; }
      #footer p { font-size:13px; }
      #footer ul li a { font-size:13px;min-height:32px; }
      .footer-socials a { width:38px;height:38px;border-radius:10px; }
      .footer-contact-item a, .footer-contact-item span { font-size:12.5px; }
      #scroll-top { width:42px;height:42px;border-radius:12px;right:16px;bottom:calc(20px + env(safe-area-inset-bottom));font-size:20px; }
      .preloader-logo { font-size:26px; }
      .preloader-gif { max-width:120px; }
    }

    /* --- Small mobile (≤480px) --- */
    @media (max-width:480px) {
      .hero h1 { font-size:clamp(24px,7.5vw,36px); }
      .hero p.lead { font-size:14px;line-height:1.7; }
      .btn-hero-fill, .btn-hero-ghost { padding:13px 20px;font-size:14px; }
      .hero-btns { gap:10px;margin-bottom:32px; }
      .hero-stat-num { font-size:26px; }
      .hero-stat-label { font-size:11px; }
      .cta-section { padding:clamp(40px,8vw,60px) 0; }
      .btn-cta-dark, .btn-cta-outline { padding:13px 22px;font-size:13px;width:100%;justify-content:center; }
      .stats-section { padding:clamp(40px,6vw,56px) 0; }
      .stat-item { padding:clamp(14px,3vw,24px) clamp(8px,2vw,14px); }
    }

    /* --- iPhone SE / very small (≤375px) --- */
    @media (max-width:375px) {
      :root { --header-h:56px; }
      .logo-icon { width:34px;height:34px;border-radius:9px; }
      .logo-icon img { width:20px;height:20px; }
      .logo-name { font-size:15px; }
      .mobile-nav-toggle { width:40px;height:40px;border-radius:10px;font-size:18px; }
      .hero h1 { font-size:clamp(22px,7vw,30px); }
      .hero p.lead { font-size:13px; }
      .hero-eyebrow { font-size:9px;padding:5px 10px 5px 7px; }
      /* .hero-content { padding:24px 0; } */
      .section-title { font-size:clamp(20px,6vw,26px); }
      .container { padding-left:12px;padding-right:12px; }
      section { padding:clamp(32px,6vw,48px) 0; }
      .brand-card-header { padding:16px 16px 12px; }
      .brand-card-body { padding:0 16px 16px; }
      .why-card { padding:18px 14px; }
      .contact-form-wrap { padding:18px 14px;border-radius:14px; }
      .form-control-tern { padding:11px 12px;font-size:13px; }
      .btn-submit { padding:12px 20px;font-size:13px; }
      .accordion-button { padding:14px 14px;font-size:13px; }
      .accordion-body { padding:0 14px 14px;font-size:12.5px; }
      .feature-list li { padding:10px 12px;font-size:13px; }
      .feat-icon { width:30px;height:30px;border-radius:8px;font-size:14px; }
    }

    /* --- iPhone mini (≤320px) --- */
    @media (max-width:320px) {
      :root { --header-h:52px; }
      .logo-name { font-size:14px; }
      .hero h1 { font-size:22px; }
      .hero p.lead { font-size:12.5px; }
      .section-title { font-size:20px; }
      .btn-hero-fill, .btn-hero-ghost { padding:12px 16px;font-size:13px; }
      .stat-number { font-size:28px; }
    }

    /* --- Landscape mobile fix --- */
    @media (max-height:500px) and (orientation:landscape) {
      .hero { min-height:auto; }
      .hero .carousel { min-height:auto; }
      .hero-carousel-item { min-height:auto;padding:60px 0; }
      /* .hero-content { padding:24px 0; } */
      .hero-stats { flex-direction:row;gap:24px; }
      .hero-stat + .hero-stat { border-top:none;padding-top:0;border-left:1px solid rgba(255,255,255,.1);padding-left:24px; }
    }

    /* --- iOS Safari safe area (notch/home indicator) --- */
    @supports (padding: env(safe-area-inset-bottom)) {
      .nav-drawer { padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
      #footer { padding-bottom:env(safe-area-inset-bottom); }
      .footer-bottom { padding-bottom:calc(20px + env(safe-area-inset-bottom)); }
      #scroll-top { bottom:calc(28px + env(safe-area-inset-bottom)); }
    }

    /* --- Touch devices: disable hover transforms --- */
    @media (hover:none) {
      .brand-card:hover, .why-card:hover { transform:none;box-shadow:var(--shadow); }
      .team-card:hover img { transform:none; }
      .vm-card:hover { transform:none; }
      .contact-info-card:hover { transform:none; }
      .feature-list li:hover { transform:none; }
    }

    /* --- High DPI / Retina smoothing --- */
    @media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi) {
      body { -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; }
      .hero-grid { background-size:48px 48px; }
    }

    /* --- Print styles --- */
    @media print {
      .topbar, #header, .nav-drawer, #scroll-top, .cursor-dot, .cursor-ring, #preloader, .hero-orbs, .hero-bg-mesh, .hero-grid { display:none !important; }
      body { padding-top:0; }
      section { page-break-inside:avoid; }
    }


    /* AWARDS STATS ROW */
.awards-stats-row {
  display: flex;
  align-items: center;
  gap: 32px;
  margin-top: 32px;
  padding: 28px 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow);
}
.awards-stat-item { text-align: center; flex: 1; }
.awards-stat-num {
  font-family: var(--font-head);
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 900;
  color: var(--primary);
  line-height: 1;
  letter-spacing: -.04em;
}
.awards-stat-num span { color: var(--accent); }
.awards-stat-label {
  font-size: 11px; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  letter-spacing: .1em; margin-top: 6px;
}
.awards-stat-divider {
  width: 1px; height: 48px;
  background: var(--border); flex-shrink: 0;
}

/* AWARDS SECTION enhanced */
.awards-section { background: var(--surface2); position: relative; overflow: hidden; }
.awards-section::before {
  content: ''; position: absolute;
  right: -200px; top: 50%; transform: translateY(-50%);
  width: 600px; height: 600px; border-radius: 50%;
  background: radial-gradient(ellipse, rgba(0,212,168,.05) 0%, transparent 70%);
}

/* HERO CARD STACK (for awards slide) */
.hcard {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(20px);
  border-radius: 20px;
  padding: 24px 28px;
}
.hcard-main { position: relative; z-index: 2; }
.hcard-float1 {
  position: absolute; top: 0; right: -20px; z-index: 3;
  width: 180px;
  animation: cardFloat1 6s ease-in-out infinite;
}
.hcard-float2 {
  position: absolute; bottom: 20px; left: -30px; z-index: 3;
  width: 160px;
  animation: cardFloat2 8s ease-in-out infinite;
}
@keyframes cardFloat1 { 0%,100%{transform:translateY(0) rotate(2deg)} 50%{transform:translateY(-12px) rotate(-1deg)} }
@keyframes cardFloat2 { 0%,100%{transform:translateY(0) rotate(-3deg)} 50%{transform:translateY(10px) rotate(1deg)} }
.hcard-icon {
  width: 48px; height: 48px; border-radius: 14px;
  background: rgba(0,212,168,.15);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: var(--accent); margin-bottom: 14px;
}
.hcard-title { font-family: var(--font-head); font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 6px; }
.hcard-sub { font-size: 12px; color: rgba(255,255,255,.55); font-family: var(--font-body); }
.hcard-stat { font-family: var(--font-head); font-size: 32px; font-weight: 900; color: #fff; }
.hcard-stat span { color: var(--accent); }
.mini-badge {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(0,212,168,.15); border-radius: 30px;
  padding: 4px 10px; font-size: 11px; color: var(--accent);
  font-weight: 700; font-family: var(--font-body);
}
.hcard-avatar-row { display: flex; align-items: center; margin-top: 12px; }
.hcard-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.2); overflow: hidden;
  background: var(--accent); display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; color: var(--primary);
  margin-left: -8px; font-family: var(--font-body); flex-shrink: 0;
}
.hcard-avatar:first-child { margin-left: 0; }
.hcard-avatar-count { margin-left: 10px; font-size: 12px; color: rgba(255,255,255,.55); font-family: var(--font-body); }
.hero-card-stack { position: relative; padding: 40px 20px; }

.awards-img-wrap {
  position: relative;
  margin-bottom: 32px;
}


 /* Error labels */
  .cf-error { display:block;font-size:12px;color:#ff5f3b;margin-top:5px;min-height:16px; }

  /* Input error state */
  .form-control-tern.is-error { border-color:#ff5f3b !important;box-shadow:0 0 0 4px rgba(255,95,59,.12) !important; }

  /* Spinner */
  @keyframes cfSpin { to { transform:rotate(360deg); } }
  .cf-spin { display:inline-block;animation:cfSpin .7s linear infinite; }

  /* Toast */
  .cf-toast {
    position: fixed;
    bottom: 32px;
    right: 24px;
    z-index: 99999;
    min-width: 300px;
    max-width: 380px;
    pointer-events: none;
    opacity: 0;
    transform: translateY(16px) scale(.97);
    transition: opacity .35s cubic-bezier(.16,1,.3,1), transform .35s cubic-bezier(.16,1,.3,1);
  }
  .cf-toast.show {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
  }
  .cf-toast-inner {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(6,13,26,.18), 0 0 0 1px rgba(0,0,0,.06);
    padding: 18px 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
  }
  .cf-toast-icon {
    width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
    background: rgba(0,212,168,.1);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; color: var(--accent);
  }
  .cf-toast-icon.error { background: rgba(255,95,59,.1); color: #ff5f3b; }
  .cf-toast-body { flex: 1; }
  .cf-toast-title { font-family: var(--font-head); font-size: 15px; font-weight: 700; color: var(--primary); margin-bottom: 3px; }
  .cf-toast-msg { font-size: 13px; color: var(--muted); line-height: 1.5; }
  .cf-toast-close {
    background: none; border: none; cursor: pointer; padding: 2px;
    color: var(--muted); font-size: 13px; flex-shrink: 0;
    line-height: 1; margin-top: 1px;
  }
  .cf-toast-close:hover { color: var(--primary); }

  /* Progress bar auto-dismiss */
  .cf-toast-progress {
    position: absolute; bottom: 0; left: 0;
    height: 3px; border-radius: 0 0 16px 16px;
    background: var(--accent);
    width: 100%;
    animation: cfProgress 4.5s linear forwards;
  }
  .cf-toast-progress.error { background: #ff5f3b; }
  @keyframes cfProgress { from { width:100% } to { width:0% } }

  @media (max-width: 575px) {
    .cf-toast { left: 16px; right: 16px; min-width: unset; max-width: unset; bottom: 20px; }
  }

  /* =========================================================
     AUTH PAGES (Login/Register)
  ========================================================= */
  .auth-layout { padding-top: 0 !important; }

  .auth-page {

    min-height: 100dvh;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    position: relative;
    overflow: hidden;
  }
  .auth-card {
    width: 100%;
    max-width: 440px;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    padding: clamp(32px, 5vw, 48px);
    position: relative;
    z-index: 10;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3);
  }
  .auth-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 32px;
  }
  .auth-header {
    text-align: center;
    margin-bottom: 32px;
  }
  .auth-header h1 {
    font-size: clamp(24px, 4vw, 32px);
    font-family: var(--font-head);
    font-weight: 900;
    color: #fff;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
  }
  .auth-header p {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
  }
  .auth-form .form-group {
    margin-bottom: 20px;
  }
  .auth-form label {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 10px;
    font-family: var(--font-body);
    letter-spacing: 0.01em;
  }
  .auth-form .form-control-tern {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
    color: #fff;
  }
  .auth-form .form-control-tern:focus {
    background: rgba(255, 255, 255, 0.07);
    border-color: var(--accent);
    box-shadow: 0 0 0 4px rgba(0, 212, 168, 0.15);
  }
  .auth-footer {
    margin-top: 24px;
    text-align: center;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
  }
  .auth-footer a {
    color: var(--accent);
    font-weight: 600;
  }
  .auth-footer a:hover {
    text-decoration: underline;
  }
  .auth-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    margin: 24px 0;
    position: relative;
  }
  .auth-divider span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--primary);
    padding: 0 12px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }
.navbar-brand{
    display:flex;
    align-items:center;
    padding:0;
}

.navbar-brand img{
    width:180px;      /* adjust as needed */
    height:auto;
    object-fit:contain;
    display:block;
}