/* ===================== RESET & BASE ===================== */
                        *,
                        *::before,
                        *::after {
                          box-sizing: border-box;
                          margin: 0;
                          padding: 0;
                        }

                        :root {
                          --navy: #0b1a2e;
                          --navy2: #0f2445;
                          --blue: #1259c4;
                          --sky: #2e87f5;
                          --ice: #e8f2ff;
                          --white: #ffffff;
                          --off: #f4f7fc;
                          --text: #1a2540;
                          --muted: #667397;
                          --accent: #ff6b2b;
                          --gold: #f5c842;
                          --grad: linear-gradient(135deg, #0f2445 0%, #1259c4 100%);
                          --grad2: linear-gradient(135deg, #1259c4 0%, #2e87f5 100%);
                          --shadow: 0 20px 60px rgba(18, 89, 196, 0.18);
                          --r: 16px;
                        }

                        html {
                          scroll-behavior: smooth;
                        }
                        body {
                          font-family: "DM Sans", sans-serif;
                          color: var(--text);
                          background: var(--white);
                          overflow-x: hidden;
                          line-height: 1.65;
                        }

                        h1,
                        h2,
                        h3,
                        h4,
                        h5 {
                          font-family: "Syne", sans-serif;
                          line-height: 1.2;
                        }
                        a {
                          text-decoration: none;
                          color: inherit;
                        }
                        img {
                          max-width: 100%;
                          display: block;
                        }

                        /* ===================== UTILITY ===================== */
                        .container {
                          max-width: 1180px;
                          margin: 0 auto;
                          padding: 0 24px;
                        }
                        .section {
                          padding: 96px 0;
                        }
                        .section--sm {
                          padding: 64px 0;
                        }
                        .tag {
                          display: inline-flex;
                          align-items: center;
                          gap: 8px;
                          background: rgba(18, 89, 196, 0.1);
                          color: var(--blue);
                          font-family: "Syne", sans-serif;
                          font-size: 12px;
                          font-weight: 700;
                          letter-spacing: 0.12em;
                          text-transform: uppercase;
                          padding: 6px 16px;
                          border-radius: 50px;
                          border: 1px solid rgba(18, 89, 196, 0.2);
                        }
                        .tag--light {
                          background: rgba(255, 255, 255, 0.15);
                          color: #fff;
                          border-color: rgba(255, 255, 255, 0.25);
                        }
                        .sec-head {
                          margin-bottom: 56px;
                        }
                        .sec-head h2 {
                          font-size: clamp(30px, 4vw, 46px);
                          font-weight: 800;
                          margin-top: 14px;
                        }
                        .sec-head p {
                          color: var(--muted);
                          font-size: 17px;
                          margin-top: 14px;
                          max-width: 540px;
                        }
                        .sec-head--center {
                          text-align: center;
                        }
                        .sec-head--center p {
                          margin-left: auto;
                          margin-right: auto;
                        }

                        /* ===================== BUTTONS ===================== */
                        .btn {
                          display: inline-flex;
                          align-items: center;
                          gap: 10px;
                          font-family: "Syne", sans-serif;
                          font-weight: 700;
                          font-size: 14px;
                          letter-spacing: 0.04em;
                          padding: 15px 30px;
                          border-radius: 50px;
                          cursor: pointer;
                          border: none;
                          transition: all 0.3s;
                        }
                        .btn-primary {
                          background: var(--accent);
                          color: #fff;
                          box-shadow: 0 8px 30px rgba(255, 107, 43, 0.35);
                        }
                        .btn-primary:hover {
                          transform: translateY(-3px);
                          box-shadow: 0 14px 40px rgba(255, 107, 43, 0.45);
                          background: #ff5715;
                        }
                        .btn-outline {
                          background: transparent;
                          color: #fff;
                          border: 2px solid rgba(255, 255, 255, 0.5);
                        }
                        .btn-outline:hover {
                          background: rgba(255, 255, 255, 0.12);
                          border-color: #fff;
                        }
                        .btn-blue {
                          background: var(--grad2);
                          color: #fff;
                          box-shadow: var(--shadow);
                        }
                        .btn-blue:hover {
                          transform: translateY(-3px);
                          box-shadow: 0 20px 50px rgba(18, 89, 196, 0.35);
                        }
                        .btn .arrow {
                          transition: transform 0.3s;
                        }
                        .btn:hover .arrow {
                          transform: translateX(5px);
                        }

                        /* ===================== HEADER ===================== */
                        .header {
                          position: fixed;
                          top: 0;
                          left: 0;
                          right: 0;
                          z-index: 1000;
                          transition: all 0.4s;
                        }
                        .header.scrolled {
                          background: rgba(11, 26, 46, 0.97);
                          backdrop-filter: blur(20px);
                          box-shadow: 0 4px 30px rgba(0, 0, 0, 0.25);
                        }
                        .header__inner {
                          display: flex;
                          align-items: center;
                          justify-content: space-between;
                          padding: 20px 0;
                          gap: 32px;
                        }
                        .logo {
                          display: flex;
                          align-items: center;
                          gap: 12px;
                          flex-shrink: 0;
                        }
                        .logo__icon {
                          width: 44px;
                          height: 44px;
                          border-radius: 12px;
                          background: var(--grad2);
                          display: flex;
                          align-items: center;
                          justify-content: center;
                        }
                        .logo__icon svg {
                          width: 24px;
                          height: 24px;
                          fill: #fff;
                        }
                        .logo__text {
                          font-family: "Syne", sans-serif;
                          font-weight: 800;
                          font-size: 20px;
                          color: #fff;
                        }
                        .logo__text span {
                          color: var(--sky);
                        }

                        .nav {
                          display: flex;
                          align-items: center;
                          gap: 4px;
                        }
                        .nav a {
                          color: rgba(255, 255, 255, 0.8);
                          font-weight: 500;
                          font-size: 14px;
                          padding: 9px 16px;
                          border-radius: 8px;
                          transition: all 0.25s;
                        }
                        .nav a:hover {
                          color: #fff;
                          background: rgba(255, 255, 255, 0.1);
                        }
                        .nav .dropdown {
                          position: relative;
                        }
                        .nav .dropdown-menu {
                          position: absolute;
                          top: calc(100% + 12px);
                          left: 0;
                          background: var(--white);
                          border-radius: 14px;
                          box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);
                          min-width: 220px;
                          padding: 10px;
                          display: none;
                          flex-direction: column;
                          border: 1px solid rgba(18, 89, 196, 0.1);
                        }
                        .nav .dropdown:hover .dropdown-menu {
                          display: flex;
                        }
                        .nav .dropdown-menu a {
                          color: var(--text);
                          padding: 11px 16px;
                          border-radius: 8px;
                          font-size: 14px;
                          transition: all 0.2s;
                        }
                        .nav .dropdown-menu a:hover {
                          background: var(--ice);
                          color: var(--blue);
                        }

                        .header__cta {
                          display: flex;
                          align-items: center;
                          gap: 12px;
                          flex-shrink: 0;
                        }
                        .phone-link {
                          display: flex;
                          align-items: center;
                          gap: 8px;
                          color: #fff;
                          font-family: "Syne", sans-serif;
                          font-weight: 700;
                          font-size: 15px;
                          padding: 10px 20px;
                          border-radius: 50px;
                          background: rgba(255, 255, 255, 0.1);
                          border: 1px solid rgba(255, 255, 255, 0.2);
                          transition: all 0.3s;
                        }
                        .phone-link:hover {
                          background: rgba(255, 255, 255, 0.2);
                        }
                        .phone-link svg {
                          width: 16px;
                          height: 16px;
                        }

                        .burger {
                          display: none;
                          flex-direction: column;
                          gap: 5px;
                          cursor: pointer;
                          padding: 8px;
                          border-radius: 8px;
                          background: rgba(255, 248, 248, 0.05);
                          border: none;
                        }
                        .burger span {
                          width: 52px;
                          height: 44px;
                          background: #ffffff;
                          border-radius: 2px;
                          transition: all 0.3s;
                           display: block;
                        }

                        /* ===================== HERO ===================== */
                        .hero {
                          min-height: 100vh;
                          background: var(--navy);
                          position: relative;
                          overflow: hidden;
                          display: flex;
                          align-items: center;
                          padding-top: 100px;
                        }

                        /* Animated background grid */
                        .hero::before {
                          content: "";
                          position: absolute;
                          inset: 0;
                          background-image:
                            linear-gradient(rgba(18, 89, 196, 0.08) 1px, transparent 1px),
                            linear-gradient(90deg, rgba(18, 89, 196, 0.08) 1px, transparent 1px);
                          background-size: 60px 60px;
                          animation: gridMove 20s linear infinite;
                        }
                        @keyframes gridMove {
                          to {
                            transform: translateY(60px);
                          }
                        }

                        .hero__blob {
                          position: absolute;
                          border-radius: 50%;
                          filter: blur(80px);
                          animation: blobPulse 8s ease-in-out infinite;
                        }
                        .hero__blob--1 {
                          width: 500px;
                          height: 500px;
                          background: rgba(18, 89, 196, 0.25);
                          top: -100px;
                          right: -100px;
                        }
                        .hero__blob--2 {
                          width: 350px;
                          height: 350px;
                          background: rgba(255, 107, 43, 0.15);
                          bottom: -50px;
                          left: 15%;
                          animation-delay: -4s;
                        }
                        @keyframes blobPulse {
                          0%,
                          100% {
                            transform: scale(1);
                          }
                          50% {
                            transform: scale(1.15);
                          }
                        }

                        .hero__content {
                          position: relative;
                          z-index: 2;
                        }
                        .hero__grid {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 80px;
                          align-items: center;
                        }

                        .hero__badge {
                          display: inline-flex;
                          align-items: center;
                          gap: 8px;
                          background: rgba(255, 107, 43, 0.15);
                          color: var(--accent);
                          border: 1px solid rgba(255, 107, 43, 0.3);
                          font-size: 12px;
                          font-weight: 700;
                          letter-spacing: 0.1em;
                          text-transform: uppercase;
                          padding: 7px 16px;
                          border-radius: 50px;
                          margin-bottom: 24px;
                        }
                        .hero__badge .dot {
                          width: 6px;
                          height: 6px;
                          background: var(--accent);
                          border-radius: 50%;
                          animation: pulse 2s infinite;
                        }
                        @keyframes pulse {
                          0%,
                          100% {
                            opacity: 1;
                          }
                          50% {
                            opacity: 0.3;
                          }
                        }

                        .hero h1 {
                          font-size: clamp(38px, 5.5vw, 72px);
                          font-weight: 800;
                          color: #fff;
                          line-height: 1.05;
                          margin-bottom: 24px;
                        }
                        .hero h1 .highlight {
                          background: var(--grad2);
                          -webkit-background-clip: text;
                          -webkit-text-fill-color: transparent;
                          background-clip: text;
                        }
                        .hero__sub {
                          color: rgba(255, 255, 255, 0.65);
                          font-size: 18px;
                          margin-bottom: 40px;
                          max-width: 480px;
                        }

                        .hero__actions {
                          display: flex;
                          gap: 16px;
                          flex-wrap: wrap;
                          margin-bottom: 56px;
                        }

                        .hero__stats {
                          display: flex;
                          gap: 40px;
                        }
                        .hero__stat {
                        }
                        .hero__stat strong {
                          display: block;
                          font-family: "Syne", sans-serif;
                          font-size: 32px;
                          font-weight: 800;
                          color: #fff;
                        }
                        .hero__stat span {
                          font-size: 13px;
                          color: rgba(255, 255, 255, 0.5);
                          text-transform: uppercase;
                          letter-spacing: 0.08em;
                        }

                        /* Hero visual */
                        .hero__visual {
                          position: relative;
                        }
                        .hero__card-main {
                          background: rgba(255, 255, 255, 0.06);
                          backdrop-filter: blur(20px);
                          border: 1px solid rgba(255, 255, 255, 0.12);
                          border-radius: 24px;
                          padding: 32px;
                          position: relative;
                        }
                        .temp-display {
                          text-align: center;
                          padding: 24px 0;
                        }
                        .temp-display .temp {
                          font-family: "Syne", sans-serif;
                          font-size: 96px;
                          font-weight: 800;
                          color: #fff;
                          line-height: 1;
                        }
                        .temp-display .temp sup {
                          font-size: 36px;
                          vertical-align: super;
                        }
                        .temp-display .label {
                          color: rgba(255, 255, 255, 0.5);
                          font-size: 14px;
                          letter-spacing: 0.1em;
                          text-transform: uppercase;
                          margin-top: 8px;
                        }

                        .temp-controls {
                          display: flex;
                          gap: 12px;
                          margin-top: 24px;
                        }
                        .temp-btn {
                          flex: 1;
                          padding: 14px;
                          border-radius: 12px;
                          text-align: center;
                          font-family: "Syne", sans-serif;
                          font-weight: 700;
                          font-size: 13px;
                          cursor: pointer;
                          border: none;
                          transition: all 0.3s;
                          text-transform: uppercase;
                          letter-spacing: 0.08em;
                        }
                        .temp-btn--heat {
                          background: rgba(255, 107, 43, 0.2);
                          color: var(--accent);
                          border: 1px solid rgba(255, 107, 43, 0.3);
                        }
                        .temp-btn--cool {
                          background: rgba(46, 135, 245, 0.2);
                          color: var(--sky);
                          border: 1px solid rgba(46, 135, 245, 0.3);
                        }
                        .temp-btn:hover {
                          transform: scale(1.03);
                        }

                        .mini-cards {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 12px;
                          margin-top: 12px;
                        }
                        .mini-card {
                          background: rgba(255, 255, 255, 0.07);
                          border: 1px solid rgba(255, 255, 255, 0.1);
                          border-radius: 14px;
                          padding: 16px;
                        }
                        .mini-card .mc-icon {
                          font-size: 24px;
                          margin-bottom: 8px;
                        }
                        .mini-card .mc-val {
                          font-family: "Syne", sans-serif;
                          font-weight: 700;
                          color: #fff;
                          font-size: 18px;
                        }
                        .mini-card .mc-lbl {
                          font-size: 11px;
                          color: rgba(255, 255, 255, 0.45);
                          text-transform: uppercase;
                          letter-spacing: 0.08em;
                          margin-top: 2px;
                        }

                        .floating-badge {
                          position: absolute;
                          background: var(--white);
                          border-radius: 14px;
                          padding: 12px 20px;
                          box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
                          display: flex;
                          align-items: center;
                          gap: 12px;
                          font-family: "Syne", sans-serif;
                        }
                        .fb-top {
                          top: -20px;
                          right: -30px;
                        }
                        .fb-bot {
                          bottom: -20px;
                          left: -30px;
                        }
                        .fb-icon {
                          width: 36px;
                          height: 36px;
                          border-radius: 10px;
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-size: 18px;
                        }
                        .fb-icon--green {
                          background: #e8f7ee;
                        }
                        .fb-icon--blue {
                          background: var(--ice);
                        }
                        .fb-val {
                          font-size: 15px;
                          font-weight: 800;
                          color: var(--text);
                        }
                        .fb-lbl {
                          font-size: 11px;
                          color: var(--muted);
                          font-family: "DM Sans", sans-serif;
                          font-weight: 400;
                        }

                        /* ===================== TRUST BAR ===================== */
                        .trust-bar {
                          background: var(--off);
                          border-top: 1px solid rgba(18, 89, 196, 0.08);
                          border-bottom: 1px solid rgba(18, 89, 196, 0.08);
                          padding: 28px 0;
                        }
                        .trust-bar__inner {
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          gap: 48px;
                          flex-wrap: wrap;
                        }
                        .trust-item {
                          display: flex;
                          align-items: center;
                          gap: 10px;
                          color: var(--muted);
                          font-size: 14px;
                          font-weight: 500;
                        }
                        .trust-item .icon {
                          font-size: 22px;
                        }
                        .trust-item strong {
                          color: var(--text);
                          font-family: "Syne", sans-serif;
                        }

                        /* ===================== SERVICES ===================== */
                        .services-grid {
                          display: grid;
                          grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
                          gap: 24px;
                        }
                        .service-card {
                          background: var(--white);
                          border-radius: var(--r);
                          border: 1px solid rgba(18, 89, 196, 0.1);
                          padding: 32px 28px;
                          transition: all 0.35s;
                          position: relative;
                          overflow: hidden;
                        }
                        .service-card::after {
                          content: "";
                          position: absolute;
                          bottom: 0;
                          left: 0;
                          right: 0;
                          height: 3px;
                          background: var(--grad2);
                          transform: scaleX(0);
                          transition: transform 0.35s;
                          transform-origin: left;
                        }
                        .service-card:hover {
                          transform: translateY(-6px);
                          box-shadow: var(--shadow);
                          border-color: rgba(18, 89, 196, 0.25);
                        }
                        .service-card:hover::after {
                          transform: scaleX(1);
                        }
                        .service-card__icon {
                          width: 60px;
                          height: 60px;
                          border-radius: 16px;
                          background: var(--ice);
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-size: 28px;
                          margin-bottom: 20px;
                          transition: all 0.35s;
                        }
                        .service-card:hover .service-card__icon {
                          background: var(--blue);
                          transform: scale(1.08);
                        }
                        .service-card__icon span {
                          transition: filter 0.35s;
                        }
                        .service-card:hover .service-card__icon span {
                          filter: brightness(0) invert(1);
                        }
                        .service-card h4 {
                          font-size: 18px;
                          font-weight: 700;
                          margin-bottom: 10px;
                        }
                        .service-card p {
                          color: var(--muted);
                          font-size: 14px;
                          line-height: 1.7;
                        }
                        .service-card__link {
                          display: inline-flex;
                          align-items: center;
                          gap: 6px;
                          color: var(--blue);
                          font-weight: 600;
                          font-size: 13px;
                          margin-top: 18px;
                          transition: gap 0.25s;
                        }
                        .service-card:hover .service-card__link {
                          gap: 10px;
                        }

                        /* ===================== WHY US ===================== */
                        .why {
                          background: var(--navy);
                          position: relative;
                          overflow: hidden;
                        }
                        .why::before {
                          content: "";
                          position: absolute;
                          inset: 0;
                          background: radial-gradient(
                            ellipse at 70% 50%,
                            rgba(18, 89, 196, 0.3) 0%,
                            transparent 65%
                          );
                        }
                        .why__grid {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 72px;
                          align-items: center;
                          position: relative;
                          z-index: 2;
                        }
                        .why .sec-head h2 {
                          color: #fff;
                        }
                        .why .sec-head p {
                          color: rgba(255, 255, 255, 0.6);
                        }
                        .why__features {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 20px;
                          margin-top: 40px;
                        }
                        .why__feat {
                          background: rgba(255, 255, 255, 0.06);
                          border: 1px solid rgba(255, 255, 255, 0.1);
                          border-radius: 16px;
                          padding: 24px 20px;
                          transition: all 0.3s;
                        }
                        .why__feat:hover {
                          background: rgba(255, 255, 255, 0.1);
                          transform: translateY(-4px);
                        }
                        .why__feat .ico {
                          font-size: 30px;
                          margin-bottom: 12px;
                        }
                        .why__feat h5 {
                          color: #fff;
                          font-size: 15px;
                          font-weight: 700;
                          margin-bottom: 7px;
                        }
                        .why__feat p {
                          color: rgba(255, 255, 255, 0.55);
                          font-size: 13px;
                          line-height: 1.6;
                        }

                        .why__visual {
                          position: relative;
                        }
                        .why__img-box {
                          border-radius: 24px;
                          overflow: hidden;
                          background: rgba(255, 255, 255, 0.06);
                          border: 1px solid rgba(255, 255, 255, 0.1);
                          padding: 32px;
                        }
                        .certif-grid {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 16px;
                        }
                        .certif-card {
                          background: rgba(255, 255, 255, 0.08);
                          border: 1px solid rgba(255, 255, 255, 0.12);
                          border-radius: 16px;
                          padding: 24px 20px;
                          text-align: center;
                        }
                        .certif-card .big {
                          font-family: "Syne", sans-serif;
                          font-size: 38px;
                          font-weight: 800;
                          color: var(--sky);
                        }
                        .certif-card .lbl {
                          color: rgba(255, 255, 255, 0.55);
                          font-size: 12px;
                          text-transform: uppercase;
                          letter-spacing: 0.08em;
                          margin-top: 4px;
                        }

                        .why__awards {
                          display: flex;
                          gap: 12px;
                          margin-top: 16px;
                          flex-wrap: wrap;
                        }
                        .award-pill {
                          background: rgba(255, 107, 43, 0.15);
                          color: var(--accent);
                          border: 1px solid rgba(255, 107, 43, 0.3);
                          font-size: 12px;
                          font-weight: 700;
                          padding: 7px 16px;
                          border-radius: 50px;
                          font-family: "Syne", sans-serif;
                          letter-spacing: 0.06em;
                        }

                        /* ===================== HOW IT WORKS ===================== */
                        .how {
                          background: var(--off);
                        }
                        .steps {
                          display: grid;
                          grid-template-columns: repeat(4, 1fr);
                          gap: 32px;
                          position: relative;
                        }
                        .steps::before {
                          content: "";
                          position: absolute;
                          top: 36px;
                          left: 10%;
                          right: 10%;
                          height: 2px;
                          background: linear-gradient(90deg, var(--blue) 0%, var(--sky) 100%);
                          z-index: 0;
                        }
                        .step {
                          text-align: center;
                          position: relative;
                          z-index: 1;
                        }
                        .step__num {
                          width: 72px;
                          height: 72px;
                          border-radius: 50%;
                          background: var(--white);
                          border: 3px solid var(--blue);
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-family: "Syne", sans-serif;
                          font-size: 24px;
                          font-weight: 800;
                          color: var(--blue);
                          margin: 0 auto 20px;
                          box-shadow: 0 0 0 8px var(--off);
                          transition: all 0.3s;
                        }
                        .step:hover .step__num {
                          background: var(--blue);
                          color: #fff;
                          transform: scale(1.1);
                        }
                        .step h4 {
                          font-size: 17px;
                          font-weight: 700;
                          margin-bottom: 10px;
                        }
                        .step p {
                          color: var(--muted);
                          font-size: 14px;
                        }

                        /* ===================== PRODUCTS ===================== */
                        .products-grid {
                          display: grid;
                          grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
                          gap: 24px;
                        }
                        .product-card {
                          border-radius: var(--r);
                          border: 1px solid rgba(18, 89, 196, 0.1);
                          overflow: hidden;
                          background: var(--white);
                          transition: all 0.35s;
                          cursor: pointer;
                        }
                        .product-card:hover {
                          transform: translateY(-6px);
                          box-shadow: var(--shadow);
                        }
                        .product-card__img {
                          background: var(--ice);
                          height: 180px;
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-size: 64px;
                          position: relative;
                          overflow: hidden;
                        }
                        .product-card__img::after {
                          content: "";
                          position: absolute;
                          inset: 0;
                          background: var(--grad2);
                          opacity: 0;
                          transition: opacity 0.35s;
                        }
                        .product-card:hover .product-card__img::after {
                          opacity: 0.08;
                        }
                        .product-card__body {
                          padding: 20px;
                        }
                        .product-card__body h4 {
                          font-size: 16px;
                          font-weight: 700;
                          margin-bottom: 6px;
                        }
                        .product-card__body p {
                          color: var(--muted);
                          font-size: 13px;
                        }
                        .product-card__tag {
                          display: inline-block;
                          margin-top: 12px;
                          background: var(--ice);
                          color: var(--blue);
                          font-size: 11px;
                          font-weight: 700;
                          padding: 4px 12px;
                          border-radius: 50px;
                          text-transform: uppercase;
                          letter-spacing: 0.07em;
                        }

                        /* ===================== COVERAGE ===================== */
                        .coverage {
                          background: var(--navy);
                          position: relative;
                          overflow: hidden;
                        }
                        .coverage::before {
                          content: "";
                          position: absolute;
                          inset: 0;
                          background: radial-gradient(
                            ellipse at 30% 50%,
                            rgba(46, 135, 245, 0.2) 0%,
                            transparent 60%
                          );
                        }
                        .coverage__grid {
                          display: grid;
                          grid-template-columns: 1fr 1.4fr;
                          gap: 64px;
                          align-items: start;
                          position: relative;
                          z-index: 2;
                        }
                        .coverage .sec-head h2 {
                          color: #fff;
                        }
                        .coverage .sec-head p {
                          color: rgba(255, 255, 255, 0.6);
                        }
                        .cities-grid {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          gap: 6px;
                          margin-top: 8px;
                        }
                        .city-item {
                          display: flex;
                          align-items: center;
                          gap: 8px;
                          background: rgba(255, 255, 255, 0.06);
                          border: 1px solid rgba(255, 255, 255, 0.1);
                          border-radius: 10px;
                          padding: 10px 14px;
                          color: rgba(255, 255, 255, 0.8);
                          font-size: 13px;
                          font-weight: 500;
                          transition: all 0.25s;
                          cursor: default;
                        }
                        .city-item:hover {
                          background: rgba(18, 89, 196, 0.3);
                          border-color: var(--sky);
                          color: #fff;
                        }
                        .city-item .ci {
                          font-size: 14px;
                        }
                        .map-box {
                          border-radius: 20px;
                          overflow: hidden;
                          box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
                          border: 1px solid rgba(255, 255, 255, 0.1);
                          height: 480px;
                        }
                        .map-box iframe {
                          width: 100%;
                          height: 100%;
                          border: none;
                          display: block;
                        }

                        /* ===================== CTA BAND ===================== */
                        .cta-band {
                          background: var(--grad);
                          position: relative;
                          overflow: hidden;
                          padding: 80px 0;
                        }
                        .cta-band::before {
                          content: "";
                          position: absolute;
                          top: -50%;
                          right: -10%;
                          width: 500px;
                          height: 500px;
                          border-radius: 50%;
                          border: 80px solid rgba(255, 255, 255, 0.06);
                        }
                        .cta-band::after {
                          content: "";
                          position: absolute;
                          bottom: -50%;
                          left: -5%;
                          width: 350px;
                          height: 350px;
                          border-radius: 50%;
                          border: 60px solid rgba(255, 255, 255, 0.05);
                        }
                        .cta-band__inner {
                          position: relative;
                          z-index: 2;
                          text-align: center;
                        }
                        .cta-band h2 {
                          font-size: clamp(28px, 4vw, 48px);
                          font-weight: 800;
                          color: #fff;
                          margin-bottom: 16px;
                        }
                        .cta-band p {
                          color: rgba(255, 255, 255, 0.75);
                          font-size: 18px;
                          margin-bottom: 40px;
                        }
                        .cta-band__btns {
                          display: flex;
                          justify-content: center;
                          gap: 16px;
                          flex-wrap: wrap;
                        }

                        /* ===================== TESTIMONIALS ===================== */
                        .testimonials {
                          background: var(--off);
                        }
                        .reviews-grid {
                          display: grid;
                          grid-template-columns: repeat(3, 1fr);
                          gap: 24px;
                        }
                        .review-card {
                          background: var(--white);
                          border-radius: var(--r);
                          border: 1px solid rgba(18, 89, 196, 0.1);
                          padding: 28px;
                          transition: all 0.35s;
                        }
                        .review-card:hover {
                          transform: translateY(-4px);
                          box-shadow: var(--shadow);
                        }
                        .stars {
                          color: var(--gold);
                          font-size: 16px;
                          letter-spacing: 2px;
                          margin-bottom: 14px;
                        }
                        .review-card p {
                          color: var(--muted);
                          font-size: 15px;
                          line-height: 1.7;
                          margin-bottom: 20px;
                          font-style: italic;
                        }
                        .reviewer {
                          display: flex;
                          align-items: center;
                          gap: 12px;
                        }
                        .reviewer__av {
                          width: 42px;
                          height: 42px;
                          border-radius: 50%;
                          background: var(--grad2);
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          font-family: "Syne", sans-serif;
                          font-weight: 800;
                          color: #fff;
                          font-size: 16px;
                        }
                        .reviewer__name {
                          font-weight: 700;
                          font-size: 14px;
                        }
                        .reviewer__loc {
                          color: var(--muted);
                          font-size: 12px;
                        }

                        /* ===================== PARTNERS ===================== */
                        .partners {
                          padding: 48px 0;
                          border-top: 1px solid rgba(18, 89, 196, 0.08);
                        }
                        .partners__inner {
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          gap: 60px;
                          flex-wrap: wrap;
                        }
                        .partner-logo {
                          color: var(--muted);
                          font-family: "Syne", sans-serif;
                          font-weight: 800;
                          font-size: 22px;
                          opacity: 0.5;
                          transition: opacity 0.3s;
                        }
                        .partner-logo:hover {
                          opacity: 1;
                          color: var(--blue);
                        }

                        /* ===================== FOOTER ===================== */
                        .footer {
                          background: var(--navy2);
                          padding: 72px 0 0;
                        }
                        .footer__grid {
                          display: grid;
                          grid-template-columns: 1.5fr 1fr 1fr 1.5fr;
                          gap: 48px;
                          padding-bottom: 56px;
                        }
                        .footer h5 {
                          font-size: 14px;
                          font-weight: 700;
                          color: #fff;
                          letter-spacing: 0.08em;
                          text-transform: uppercase;
                          margin-bottom: 20px;
                        }
                        .footer p {
                          color: rgba(255, 255, 255, 0.5);
                          font-size: 14px;
                          line-height: 1.8;
                        }
                        .footer__links {
                          list-style: none;
                          display: flex;
                          flex-direction: column;
                          gap: 10px;
                        }
                        .footer__links a {
                          color: rgba(255, 255, 255, 0.5);
                          font-size: 14px;
                          transition: color 0.25s;
                        }
                        .footer__links a:hover {
                          color: var(--sky);
                        }
                        .footer__contact {
                          display: flex;
                          flex-direction: column;
                          gap: 12px;
                        }
                        .fc-item {
                          display: flex;
                          align-items: flex-start;
                          gap: 10px;
                          color: rgba(255, 255, 255, 0.5);
                          font-size: 14px;
                        }
                        .fc-item .ic {
                          color: var(--sky);
                          font-size: 16px;
                          flex-shrink: 0;
                          margin-top: 1px;
                        }
                        .footer__socials {
                          display: flex;
                          gap: 10px;
                          margin-top: 20px;
                        }
                        .soc-btn {
                          width: 38px;
                          height: 38px;
                          border-radius: 10px;
                          background: rgba(255, 255, 255, 0.08);
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          color: rgba(255, 255, 255, 0.6);
                          font-size: 16px;
                          transition: all 0.3s;
                          border: 1px solid rgba(255, 255, 255, 0.1);
                        }
                        .soc-btn:hover {
                          background: var(--blue);
                          color: #fff;
                          transform: translateY(-3px);
                        }
                        .footer__newsletter {
                          display: flex;
                          gap: 10px;
                          margin-top: 12px;
                        }
                        .footer__newsletter input {
                          flex: 1;
                          background: rgba(255, 255, 255, 0.08);
                          border: 1px solid rgba(255, 255, 255, 0.15);
                          border-radius: 50px;
                          padding: 12px 20px;
                          color: #fff;
                          font-size: 14px;
                          outline: none;
                          transition: border-color 0.3s;
                        }
                        .footer__newsletter input::placeholder {
                          color: rgba(255, 255, 255, 0.35);
                        }
                        .footer__newsletter input:focus {
                          border-color: var(--sky);
                        }
                        .footer__newsletter button {
                          background: var(--accent);
                          color: #fff;
                          border: none;
                          border-radius: 50px;
                          padding: 12px 20px;
                          font-weight: 700;
                          font-size: 13px;
                          cursor: pointer;
                          font-family: "Syne", sans-serif;
                          transition: all 0.3s;
                        }
                        .footer__newsletter button:hover {
                          background: #ff5715;
                        }
                        .footer__bottom {
                          border-top: 1px solid rgba(255, 255, 255, 0.08);
                          padding: 20px 0;
                          display: flex;
                          align-items: center;
                          justify-content: space-between;
                          flex-wrap: wrap;
                          gap: 12px;
                        }
                        .footer__bottom p {
                          color: rgba(255, 255, 255, 0.35);
                          font-size: 13px;
                        }
                        .footer__bottom a {
                          color: var(--sky);
                        }

                        /* ===================== STICKY BAR ===================== */
                        .sticky-bar {
                          position: fixed;
                          bottom: 0;
                          left: 0;
                          right: 0;
                          z-index: 999;
                          background: rgba(11, 26, 46, 0.95);
                          backdrop-filter: blur(20px);
                          border-top: 1px solid rgba(255, 255, 255, 0.1);
                          padding: 12px 24px;
                          display: none;
                          align-items: center;
                          justify-content: center;
                          gap: 12px;
                        }
                        .sticky-bar.visible {
                          display: flex;
                        }
                        .sticky-bar .sb-btn {
                          display: flex;
                          align-items: center;
                          gap: 8px;
                          padding: 10px 20px;
                          border-radius: 50px;
                          font-weight: 700;
                          font-size: 13px;
                          font-family: "Syne", sans-serif;
                          border: none;
                          cursor: pointer;
                          transition: all 0.3s;
                          text-decoration: none;
                        }
                        .sb-quote {
                          background: var(--accent);
                          color: #fff;
                        }
                        .sb-quote:hover {
                          background: #ff5715;
                        }
                        .sb-call {
                          background: rgba(255, 255, 255, 0.1);
                          color: #fff;
                          border: 1px solid rgba(255, 255, 255, 0.2);
                        }
                        .sb-call:hover {
                          background: rgba(255, 255, 255, 0.2);
                        }
                        .sb-chat {
                          background: rgba(18, 89, 196, 0.3);
                          color: var(--sky);
                          border: 1px solid rgba(46, 135, 245, 0.3);
                        }
                        .sb-chat:hover {
                          background: var(--blue);
                          color: #fff;
                        }

                        /* ===================== MOBILE MENU ===================== */
                        .mobile-overlay {
                          position: fixed;
                          inset: 0;
                          background: rgba(0, 0, 0, 0.6);
                          z-index: 1100;
                          opacity: 0;
                          pointer-events: none;
                          transition: opacity 0.3s;
                        }
                        .mobile-overlay.open {
                          opacity: 1;
                          pointer-events: all;
                        }
                        .mobile-drawer {
                          position: fixed;
                          top: 0;
                          right: 0;
                          bottom: 0;
                          width: min(340px, 90vw);
                          background: var(--navy2);
                          z-index: 1200;
                          padding: 24px;
                          transform: translateX(100%);
                          transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
                          overflow-y: auto;
                        }
                        .mobile-drawer.open {
                          transform: translateX(0);
                        }
                        .mobile-drawer__head {
                          display: flex;
                          align-items: center;
                          justify-content: space-between;
                          margin-bottom: 32px;
                        }
                        .close-btn {
                          width: 40px;
                          height: 40px;
                          border-radius: 10px;
                          background: rgba(255, 255, 255, 0.1);
                          border: none;
                          cursor: pointer;
                          color: #fff;
                          font-size: 20px;
                          display: flex;
                          align-items: center;
                          justify-content: center;
                        }
                        .mob-nav {
                          list-style: none;
                          display: flex;
                          flex-direction: column;
                          gap: 4px;
                        }
                        .mob-nav a {
                          display: block;
                          color: rgba(255, 255, 255, 0.8);
                          font-size: 16px;
                          font-weight: 500;
                          padding: 13px 16px;
                          border-radius: 10px;
                          transition: all 0.25s;
                        }
                        .mob-nav a:hover {
                          background: rgba(255, 255, 255, 0.1);
                          color: #fff;
                        }
                        .mob-cta {
                          margin-top: 32px;
                          display: flex;
                          flex-direction: column;
                          gap: 10px;
                        }

                        /* ===================== SCROLL TO TOP ===================== */
                        .scroll-top {
                          position: fixed;
                          bottom: 80px;
                          right: 24px;
                          z-index: 900;
                          width: 44px;
                          height: 44px;
                          border-radius: 50%;
                          background: var(--blue);
                          color: #fff;
                          border: none;
                          cursor: pointer;
                          font-size: 20px;
                          display: flex;
                          align-items: center;
                          justify-content: center;
                          box-shadow: 0 8px 24px rgba(18, 89, 196, 0.4);
                          opacity: 0;
                          pointer-events: none;
                          transition: all 0.3s;
                          transform: translateY(12px);
                        }
                        .scroll-top.visible {
                          opacity: 1;
                          pointer-events: all;
                          transform: translateY(0);
                        }
                        .scroll-top:hover {
                          background: var(--sky);
                          transform: translateY(-3px);
                        }

                        /* ===================== ANIMATIONS ===================== */
                        .reveal {
                          opacity: 0;
                          transform: translateY(30px);
                          transition: all 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
                        }
                        .reveal.visible {
                          opacity: 1;
                          transform: translateY(0);
                        }
                        .reveal-left {
                          opacity: 0;
                          transform: translateX(-40px);
                          transition: all 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
                        }
                        .reveal-left.visible {
                          opacity: 1;
                          transform: translateX(0);
                        }
                        .reveal-right {
                          opacity: 0;
                          transform: translateX(40px);
                          transition: all 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
                        }
                        .reveal-right.visible {
                          opacity: 1;
                          transform: translateX(0);
                        }
                        .d1 {
                          transition-delay: 0.1s;
                        }
                        .d2 {
                          transition-delay: 0.2s;
                        }
                        .d3 {
                          transition-delay: 0.3s;
                        }
                        .d4 {
                          transition-delay: 0.4s;
                        }
                        .d5 {
                          transition-delay: 0.5s;
                        }
                        .d6 {
                          transition-delay: 0.6s;
                        }
                        .d7 {
                          transition-delay: 0.7s;
                        }
                        .d8 {
                          transition-delay: 0.8s;
                        }

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

        @media (max-width: 1024px) {
        .hero__grid,
        .why__grid,
        .coverage__grid {
          grid-template-columns: 1fr;
          gap: 48px;
        }

        .hero__visual {
          display: none;
        }

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

        .steps::before {
          display: none;
        }

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

      /* ================= MOBILE ================= */
      @media (max-width: 768px) {

        body {
          overflow-x: hidden;
        }

        .nav,
        .header__cta {
          display: none;
        }

        .burger {
          display: flex !important;
        }

        .hero h1 {
          font-size: 42px;
        }

        .hero {
          text-align: center;
          padding-top: 120px;
        }

        .hero__actions {
          flex-direction: column;
          align-items: center;
        }

        .services-grid,
        .reviews-grid,
        .why__features,
        .footer__grid {
          grid-template-columns: 1fr;
        }

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

      /* ================= SMALL MOBILE ================= */
      @media (max-width: 480px) {
        .hero h1 {
          font-size: 34px;
        }

        .btn {
          padding: 14px 20px;
        }
      }

                          .reviews-grid {
                            grid-template-columns: 1fr;
                          }
                          .hero__stats {
                            gap: 24px;
                          }
                          .steps {
                            grid-template-columns: 1fr;
                          }
                          .footer__grid {
                            grid-template-columns: 1fr;
                          }
                          .why__features {
                            grid-template-columns: 1fr;
                          }
                          .certif-grid {
                            grid-template-columns: 1fr 1fr;
                          }
                          .footer__bottom {
                            flex-direction: column;
                            text-align: center;
                          }
                        }

                        /* ===================== EXTRA RESPONSIVE FIXES ===================== */

                        /* Large Tablets */
                        @media (max-width: 992px) {
                          .container {
                            padding: 0 20px;
                          }

                          .hero {
                            padding-top: 140px;
                            min-height: auto;
                            padding-bottom: 80px;
                          }

                          .hero__grid,
                          .why__grid,
                          .coverage__grid {
                            grid-template-columns: 1fr;
                            text-align: center;
                          }

                          .hero__sub {
                            margin-left: auto;
                            margin-right: auto;
                          }

                          .hero__actions {
                            justify-content: center;
                          }

                          .hero__stats {
                            justify-content: center;
                            flex-wrap: wrap;
                          }

                          .hero__visual {
                            margin-top: 20px;
                          }

                          .steps {
                            grid-template-columns: repeat(2, 1fr);
                          }

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

                          .footer__grid {
                            grid-template-columns: 1fr 1fr;
                            gap: 40px;
                          }

                          .map-box {
                            height: 350px;
                          }
                        }

                        /* Mobile Devices */
                        @media (max-width: 768px) {
                          body {
                            overflow-x: hidden;
                          }

                          .section {
                            padding: 70px 0;
                          }

                          .section--sm {
                            padding: 50px 0;
                          }

                          .header__inner {
                            padding: 16px 0;
                          }

                          .nav,
                          .header__cta {
                            display: none;
                          }

                          .burger {
                            display: flex !important;
                          }

                          .hero {
                            text-align: center;
                            padding-top: 120px;
                          }

                          .hero h1 {
                            font-size: 42px;
                            line-height: 1.15;
                          }

                          .hero__sub {
                            font-size: 16px;
                          }

                          .hero__actions {
                            flex-direction: column;
                            align-items: center;
                          }

                          .hero__actions .btn {
                            width: 100%;
                            justify-content: center;
                          }

                          .hero__stats {
                            flex-direction: column;
                            gap: 18px;
                          }

                          .services-grid,
                          .products-grid,
                          .reviews-grid,
                          .why__features,
                          .cities-grid,
                          .certif-grid,
                          .footer__grid {
                            grid-template-columns: 1fr;
                          }

                          .steps {
                            grid-template-columns: 1fr;
                            gap: 28px;
                          }

                          .steps::before {
                            display: none;
                          }

                          .coverage__grid {
                            gap: 40px;
                          }

                          .map-box {
                            height: 300px;
                          }

                          .cta-band {
                            padding: 60px 0;
                            text-align: center;
                          }

                          .cta-band__btns {
                            flex-direction: column;
                            align-items: center;
                          }

                          .cta-band__btns .btn {
                            width: 100%;
                            justify-content: center;
                          }

                          .footer {
                            text-align: center;
                          }

                          .footer__socials {
                            justify-content: center;
                          }

                          .footer__newsletter {
                            flex-direction: column;
                          }

                          .footer__newsletter button {
                            width: 100%;
                          }

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

                          .sticky-bar {
                            flex-wrap: wrap;
                            padding: 10px;
                          }

                          .sticky-bar .sb-btn {
                            flex: 1 1 100%;
                            justify-content: center;
                          }
                        }

                        /* Small Mobile */
                        @media (max-width: 480px) {
                          .container {
                            padding: 0 16px;
                          }

                          .hero h1 {
                            font-size: 34px;
                          }

                          .sec-head h2 {
                            font-size: 28px;
                          }

                          .hero__badge,
                          .tag {
                            font-size: 10px;
                          }

                          .btn {
                            padding: 14px 20px;
                            font-size: 13px;
                          }

                          .service-card,
                          .review-card,
                          .product-card__body {
                            padding: 22px;
                          }

                          .temp-display .temp {
                            font-size: 70px;
                          }

                          .temp-display .temp sup {
                            font-size: 26px;
                          }

                          .scroll-top {
                            width: 40px;
                            height: 40px;
                            right: 16px;
                          }
                        }
                        .logo {
                    display: flex;
                    align-items: center;
                  }

                  .logo-img {
                    height: 80px;
                    width: auto;
                    object-fit: contain;
                  }

                  /* Dropdown Arrow */
                  .dropdown-toggle {
                    display: flex;
                    align-items: center;
                    gap: 5px;
                  }

                  .arrow {
                    font-size: 11px;
                    transition: 0.3s;
                  }

                  .dropdown:hover .arrow {
                    transform: rotate(180deg);
                  }