:root {
            --claret:     #4a0b20;
            --claret-mid: #751530;
            --claret-dk:  #2d060e;
            --claret-lt:  #8b1a38;
            --sky:        #6CABDD;
            --sky-dk:     #4a8fc2;
        }

        *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }
        body { font-family: 'Inter', sans-serif; background: #fff; overflow-x: hidden; color: #1a1a1a; }
        h1, h2, h3, h4, h5 { font-family: 'Inter', sans-serif; letter-spacing: -0.02em; }
        
        /* ── Scrollbar ─────────────────────────────────────────── */
        ::-webkit-scrollbar { width: 5px; }
        ::-webkit-scrollbar-track { background: #f4f4f4; }
        ::-webkit-scrollbar-thumb { background: var(--claret); border-radius: 3px; }

        /* ── Wide container ────────────────────────────────────── */
        .wide {
            max-width: 1600px;
            margin-left: auto;
            margin-right: auto;
            padding-left: clamp(1.5rem, 5vw, 5rem);
            padding-right: clamp(1.5rem, 5vw, 5rem);
        }

        /* ── Nav ───────────────────────────────────────────────── */
        .nav-link {
            position: relative;
            font-size: 0.875rem;
            font-weight: 500;
            color: var(--claret);
            text-decoration: none;
            padding: 0.25rem 0;
            letter-spacing: 0.02em;
        }
        .nav-link::after {
            content: '';
            position: absolute;
            bottom: -2px; left: 0;
            width: 0; height: 2px;
            background: var(--sky);
            transition: width 0.3s ease;
        }
        .nav-link:hover { color: var(--sky); }
        .nav-link:hover::after { width: 100%; }

        /* ── Buttons ────────────────────────────────────────────── */
        .btn {
            font-family: 'Inter', sans-serif;
            font-weight: 700;
            font-size: 0.875rem;
            letter-spacing: 0.04em;
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.875rem 2rem;
            border-radius: 0.5rem;
            cursor: pointer;
            position: relative;
            overflow: hidden;
            transition: color 0.3s;
            text-decoration: none;
        }
        .btn::before {
            content: '';
            position: absolute;
            inset: 0;
            transform: scaleX(0);
            transform-origin: left;
            transition: transform 0.35s ease;
            z-index: 0;
        }
        .btn span { position: relative; z-index: 1; }
        .btn svg  { position: relative; z-index: 1; flex-shrink: 0; }

        .btn-sky  { background: var(--sky); color: #fff; border: 2px solid var(--sky); transition: background 0.25s ease, border-color 0.25s ease; }
        .btn-sky::before  { display: none; }
        .btn-sky:hover    { background: var(--sky-dk); border-color: var(--sky-dk); color: #fff; }

        .btn-ghost { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.45); }
        .btn-ghost::before { background: rgba(255,255,255,0.12); }
        .btn-ghost:hover::before { transform: scaleX(1); }

        .btn-red   { background: #dc2626; color: #fff; font-size: 0.8rem; padding: 0.6rem 1.2rem; border: none; }
        .btn-red:hover { background: #b91c1c; }
        .btn-red::before { display: none; }

        .btn-claret { background: var(--claret); color: #fff; border: 2px solid var(--claret); transition: background 0.25s ease, border-color 0.25s ease; }
        .btn-claret::before { display: none; }
        .btn-claret:hover { background: var(--sky); border-color: var(--sky); color: #fff; }

        .btn-outline-sky { background: transparent; color: var(--sky); border: 2px solid var(--sky); transition: background 0.25s ease, color 0.25s ease; }
        .btn-outline-sky::before { display: none; }
        .btn-outline-sky:hover { background: var(--sky); color: #fff; }

        /* ── Hero ───────────────────────────────────────────────── */
        .hero {
            min-height: 100vh;
            display: flex;
            align-items: center;
            position: relative;
            overflow: hidden;
            background: #0d0108;
        }
        .hero::before {
            content: '';
            position: absolute; inset: 0;
            z-index: 3;
            background-image: repeating-linear-gradient(
                90deg,
                rgba(255,255,255,0.025) 0px, rgba(255,255,255,0.025) 1px,
                transparent 1px, transparent 220px
            );
            pointer-events: none;
        }
        .hero-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 0.625rem;
            background: rgba(108,171,221,0.1);
            border: 1px solid rgba(108,171,221,0.3);
            border-radius: 100px;
            padding: 0.375rem 1rem;
            margin-bottom: 2rem;
        }
        .hero-dot {
            width: 7px; height: 7px;
            border-radius: 50%;
            background: var(--sky);
            box-shadow: 0 0 8px rgba(108,171,221,0.9);
        }
        .hero-h1 {
            font-size: clamp(3.5rem, 8.5vw, 8.5rem);
            font-weight: 600;
            line-height: 0.95;
            letter-spacing: -0.03em;
            color: #fff;
        }
        .hero-h1 .accent { color: var(--sky); }
        .hero-stats {
            display: flex;
            gap: 3rem;
            padding-top: 3rem;
            margin-top: 3rem;
            border-top: 1px solid rgba(255,255,255,0.1);
        }
        .hero-stat-num {
            font-family: 'Inter', sans-serif;
            font-size: 2.25rem;
            font-weight: 600;
            color: #fff;
            line-height: 1;
        }
        .hero-stat-lbl {
            font-size: 0.7rem;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            color: #fff;
            margin-top: 0.25rem;
        }
        .hero-divider { width: 1px; background: rgba(255,255,255,0.1); }

        /* ── Marquee ────────────────────────────────────────────── */
        .marquee-outer { overflow: hidden; }
        .marquee-track {
            display: flex;
            animation: ticker 30s linear infinite;
            white-space: nowrap;
        }
        .marquee-outer:hover .marquee-track { animation-play-state: paused; }
        @keyframes ticker {
            from { transform: translateX(0); }
            to   { transform: translateX(-50%); }
        }

        /* ── Section labels ─────────────────────────────────────── */
        .section-label {
            font-size: 0.7rem;
            font-weight: 600;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--sky);
            display: flex;
            align-items: center;
            gap: 0.75rem;
            margin-bottom: 1.25rem;
        }
        .section-label::before { display: none; }

        /* ── Service cards ──────────────────────────────────────── */
        .svc-card {
            border: 1px solid #e8e8e8;
            border-radius: 1.5rem;
            padding: 2.75rem 2.5rem;
            position: relative;
            overflow: hidden;
            background: #fff;
            transition: border-color 0.4s, box-shadow 0.4s, transform 0.4s;
        }
        .svc-card::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, var(--claret) 0%, var(--claret-mid) 100%);
            opacity: 0;
            transition: opacity 0.4s;
            z-index: 0;
        }
        .svc-card:hover { transform: translateY(-6px); box-shadow: 0 24px 60px rgba(74,11,32,0.2); border-color: var(--claret); }
        .svc-card:hover::after { opacity: 1; }
        .svc-card > * { position: relative; z-index: 1; }
        .svc-num { font-family: 'Inter', sans-serif; font-size: 5rem; font-weight: 600; line-height: 1; color: #f0f0f0; transition: color 0.4s; }
        .svc-card:hover .svc-num { color: #fff; }
        .svc-icon { width: 52px; height: 52px; border-radius: 12px; background: var(--claret); display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem; transition: background 0.4s; }
        .svc-card:hover .svc-icon { background: var(--sky); }
        .svc-title { font-size: 1.375rem; font-weight: 600; color: var(--claret); margin-bottom: 0.75rem; transition: color 0.4s; }
        .svc-card:hover .svc-title { color: #fff; }
        .svc-desc  { font-size: 0.9rem; line-height: 1.7; color: #6b7280; transition: color 0.4s; }
        .svc-card:hover .svc-desc { color: #fff; }
        .svc-link  { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sky); margin-top: 1.5rem; display: inline-flex; align-items: center; gap: 0.375rem; transition: color 0.4s, gap 0.2s; }
        .svc-card:hover .svc-link { color: var(--sky); gap: 0.6rem; }

        /* ── Sector image cards ─────────────────────────────────── */
        .sector-img-card {
            position: relative;
            border-radius: 1.25rem;
            overflow: hidden;
            min-height: 270px;
            cursor: pointer;
            text-decoration: none;
            display: block;
        }
        .sector-img-card-bg {
            position: absolute; inset: 0;
            background-size: cover;
            background-position: center;
            transition: transform 0.9s cubic-bezier(0.25,0.46,0.45,0.94);
        }
        .sector-img-card:hover .sector-img-card-bg { transform: scale(1.07); }
        .sector-img-card-overlay {
            position: absolute; inset: 0;
            background: linear-gradient(to top,
                rgba(18,3,9,0.96) 0%,
                rgba(74,11,32,0.52) 45%,
                rgba(0,0,0,0.1) 100%);
            transition: background 0.5s ease;
        }
        .sector-img-card:hover .sector-img-card-overlay {
            background: linear-gradient(to top,
                rgba(18,3,9,0.99) 0%,
                rgba(74,11,32,0.78) 58%,
                rgba(0,0,0,0.22) 100%);
        }
        .sector-img-card-body {
            position: absolute; inset: 0;
            display: flex; flex-direction: column;
            justify-content: space-between;
            padding: 1.4rem;
            z-index: 2;
        }
        .sector-img-num {
            font-family: 'Courier New', monospace;
            font-size: 0.68rem; font-weight: 700;
            color: rgba(108,171,221,0.6);
            letter-spacing: 0.1em;
            align-self: flex-end;
        }
        .sector-img-title {
            font-size: 1.15rem; font-weight: 600;
            color: #fff; letter-spacing: -0.01em;
            transition: transform 0.35s ease;
        }
        .sector-img-card:hover .sector-img-title { transform: translateY(-5px); }
        .sector-img-desc {
            font-size: 0.775rem; line-height: 1.6;
            color: #fff;
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.45s ease, opacity 0.35s 0.05s ease, margin 0.35s ease;
            margin-top: 0;
        }
        .sector-img-card:hover .sector-img-desc { max-height: 80px; opacity: 1; margin-top: 0.5rem; }
        .sector-img-line {
            position: absolute; bottom: 0; left: 0; right: 0;
            height: 2px;
            background: linear-gradient(to right, var(--sky), rgba(108,171,221,0.4));
            transform: scaleX(0); transform-origin: left;
            transition: transform 0.5s cubic-bezier(0.77,0,0.175,1);
            z-index: 3;
        }
        .sector-img-card:hover .sector-img-line { transform: scaleX(1); }

        /* ── Stats ──────────────────────────────────────────────── */
        .big-stat {
            font-family: 'Inter', sans-serif;
            font-size: clamp(2.5rem, 4.2vw, 4rem);
            font-weight: 800;
            color: var(--claret);
            line-height: 1;
            white-space: nowrap;
        }

        /* ── Seg display ────────────────────────────────────────── */
        .seg { font-family: 'Courier New', monospace; background: #0d0108; color: var(--sky); text-shadow: 0 0 10px rgba(108,171,221,0.8); letter-spacing: 0.05em; }

        /* ── Floor nav ──────────────────────────────────────────── */
        .floor-nav-wrap { position: fixed; right: 1.5rem; top: 50%; transform: translateY(-50%); z-index: 50; display: flex; flex-direction: column; align-items: center; gap: 8px; }
        .floor-nav-item {
            width: 42px; height: 42px;
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            font-family: 'Courier New', monospace; font-size: 0.78rem; font-weight: 700;
            cursor: pointer; text-decoration: none; position: relative;
            color: rgba(108,171,221,0.55);
            background: #0d0108;
            border: 1px solid rgba(255,255,255,0.07);
            box-shadow:
                0 5px 12px rgba(0,0,0,0.7),
                0 2px 4px rgba(0,0,0,0.5),
                inset 0 1px 0 rgba(255,255,255,0.08),
                inset 0 -2px 0 rgba(0,0,0,0.55);
            opacity: 0.45;
            transition: opacity 0.2s, box-shadow 0.25s, transform 0.15s, background 0.25s, color 0.25s;
        }
        .floor-nav-item:hover {
            opacity: 0.85;
            transform: translateY(1px);
            box-shadow:
                0 3px 7px rgba(0,0,0,0.6),
                0 1px 2px rgba(0,0,0,0.5),
                inset 0 1px 0 rgba(255,255,255,0.05),
                inset 0 -1px 0 rgba(0,0,0,0.4),
                0 0 10px rgba(108,171,221,0.25);
        }
        .floor-nav-item.active {
            opacity: 1;
            color: var(--sky);
            background: #0e1e2c;
            border-color: rgba(108,171,221,0.3);
            text-shadow: 0 0 8px rgba(108,171,221,1);
            box-shadow:
                0 0 0 2px rgba(108,171,221,0.35),
                0 0 18px rgba(108,171,221,0.65),
                0 0 40px rgba(108,171,221,0.2),
                0 5px 12px rgba(0,0,0,0.6),
                inset 0 1px 0 rgba(255,255,255,0.12),
                inset 0 -2px 0 rgba(0,0,0,0.4);
        }
        .floor-nav-arrow {
            width: 32px; height: 32px; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            background: #0a0106;
            border: 1px solid rgba(255,255,255,0.05);
            color: rgba(108,171,221,0.35);
            box-shadow: 0 3px 8px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.05), inset 0 -1px 0 rgba(0,0,0,0.4);
            opacity: 0.35; cursor: pointer;
            transition: opacity 0.2s, transform 0.15s, box-shadow 0.2s;
            font-size: 0.6rem;
        }
        .floor-nav-arrow:hover {
            opacity: 0.7;
            transform: translateY(1px);
            box-shadow: 0 2px 5px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.04), 0 0 8px rgba(108,171,221,0.2);
        }
        .floor-nav-item::after { content: attr(data-label); position: absolute; right: calc(100% + 12px); top: 50%; transform: translateY(-50%); background: var(--claret); color: #fff; font-family: 'Inter', sans-serif; font-size: 0.6rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; padding: 3px 9px; border-radius: 4px; pointer-events: none; opacity: 0; transition: opacity 0.15s; }
        .floor-nav-item:hover::after { opacity: 1; }

        /* ── Scroll reveal ──────────────────────────────────────── */
        .reveal { opacity: 0; transition: opacity 0.75s ease, transform 0.75s ease; }
        .reveal-up    { transform: translateY(32px); }
        .reveal-left  { transform: translateX(-32px); }
        .reveal-right { transform: translateX(32px); }
        .reveal.visible { opacity: 1; transform: translate(0); }

        /* ── Misc ───────────────────────────────────────────────── */
        .tag { display: inline-block; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; background: rgba(108,171,221,0.12); color: var(--sky); border: 1px solid rgba(108,171,221,0.25); border-radius: 100px; padding: 0.25rem 0.75rem; }
        input, textarea, select { outline: none; }
        input:focus, textarea:focus, select:focus { border-color: var(--sky) !important; }
        .form-field { width: 100%; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.15); border-radius: 0.625rem; padding: 0.875rem 1rem; color: #fff; font-size: 0.875rem; font-family: 'Inter', sans-serif; transition: border-color 0.2s; }
        .form-field::placeholder { color: #fff; }
        select.form-field option { background: var(--claret); color: #fff; }

        /* ── Testimonials scroller ──────────────────────────────── */
        @keyframes testimonialsScroll {
            0%   { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }
        .testimonials-track {
            display: flex;
            gap: 1.5rem;
            width: max-content;
            animation: testimonialsScroll 55s linear infinite;
            padding: 1.5rem 0;
        }
        .testimonials-track:hover { animation-play-state: paused; }
        .t-card {
            width: 340px;
            flex-shrink: 0;
            background: #fff;
            border: 1px solid #ebebeb;
            border-radius: 1.25rem;
            padding: 1.75rem;
            box-shadow: 0 2px 20px rgba(0,0,0,0.05);
        }
        .t-stars { color: var(--sky); font-size: 0.8rem; letter-spacing: 2px; margin-bottom: 1rem; }
        .t-quote { font-size: 0.9rem; line-height: 1.75; color: #fff; margin-bottom: 1.25rem; }
        .t-author { font-size: 0.78rem; font-weight: 700; color: #fff; }
        .t-role { font-size: 0.75rem; color: #fff; margin-top: 2px; }

        /* ── Image Service Cards ────────────────────────────────── */
        .img-card {
            position: relative;
            border-radius: 1.25rem;
            overflow: hidden;
            min-height: 520px;
            cursor: pointer;
        }
        .img-card-bg {
            position: absolute; inset: 0;
            background-size: cover;
            background-position: center;
            transition: transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        }
        .img-card:hover .img-card-bg { transform: scale(1.07); }
        .img-card-overlay {
            position: absolute; inset: 0;
            background: linear-gradient(to top, rgba(10,2,5,0.97) 0%, rgba(45,6,14,0.5) 45%, rgba(0,0,0,0.06) 100%);
            transition: background 0.55s ease;
        }
        .img-card:hover .img-card-overlay {
            background: linear-gradient(to top, rgba(10,2,5,0.99) 0%, rgba(74,11,32,0.72) 55%, rgba(0,0,0,0.18) 100%);
        }
        .img-card-body {
            position: absolute; inset: 0;
            display: flex; flex-direction: column; justify-content: space-between;
            padding: 2rem; z-index: 2;
        }
        .img-card-tag {
            display: inline-flex; align-items: center; gap: 6px;
            background: rgba(108,171,221,0.12); border: 1px solid rgba(108,171,221,0.28);
            border-radius: 100px; padding: 0.25rem 0.8rem;
            font-size: 0.65rem; font-weight: 700; letter-spacing: 0.14em;
            text-transform: uppercase; color: var(--sky); align-self: flex-start;
        }
        .img-card-title {
            font-size: clamp(1rem, 1.4vw, 1.375rem);
            font-weight: 600; color: #fff;
            letter-spacing: -0.02em; line-height: 1.2;
            transition: transform 0.45s ease;
        }
        .img-card:hover .img-card-title { transform: translateY(-0.6rem); }
        .img-card-desc {
            font-size: 0.875rem; line-height: 1.75;
            color: #fff;
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.5s ease, opacity 0.4s 0.06s ease, margin 0.4s ease;
            margin-top: 0;
        }
        .img-card:hover .img-card-desc { max-height: 160px; opacity: 1; margin-top: 0.875rem; }
        .img-card-bullets {
            display: flex; flex-direction: column; gap: 0.3rem;
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.55s 0.05s ease, opacity 0.4s 0.12s ease, margin 0.4s 0.05s ease;
            margin-top: 0;
        }
        .img-card:hover .img-card-bullets { max-height: 160px; opacity: 1; margin-top: 0.625rem; }
        .img-card-bullet {
            font-size: 0.7rem; color: #fff;
            display: flex; align-items: flex-start; gap: 0.5rem; line-height: 1.5;
        }
        .img-card-bullet::before {
            content: ''; width: 4px; height: 4px; border-radius: 50%;
            background: var(--sky); flex-shrink: 0; margin-top: 4px;
        }
        .img-card-cta {
            display: inline-flex; align-items: center; gap: 0.5rem;
            color: var(--sky); font-size: 0.72rem; font-weight: 700;
            letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none;
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.4s 0.12s ease, opacity 0.35s 0.18s, margin 0.4s 0.06s;
            position: static;
        }
        /* Full-card clickable overlay */
        .img-card-cta::before {
            content: ''; position: absolute; inset: 0; z-index: 4;
        }
        .img-card:hover .img-card-cta { max-height: 40px; opacity: 1; margin-top: 1.375rem; }
        .img-card-cta:hover { gap: 0.875rem; }
        .img-card-line {
            position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
            background: linear-gradient(to right, var(--sky), var(--sky-dk));
            transform: scaleX(0); transform-origin: left;
            transition: transform 0.55s cubic-bezier(0.77,0,0.175,1); z-index: 3;
        }
        .img-card:hover .img-card-line { transform: scaleX(1); }

        /* ── Service Feature Sections ────────────────────────────── */
        .svc-section {
            display: grid;
            grid-template-columns: 1fr 1fr;
            min-height: 100vh;
            overflow: hidden;
        }
        @media (max-width: 900px) {
            .svc-section { grid-template-columns: 1fr; min-height: auto; }
            .svc-image-panel { min-height: 60vw; }
        }
        .svc-image-panel {
            position: relative;
            overflow: hidden;
        }
        .svc-img-bg {
            position: absolute;
            inset: -6% 0;
            background-size: cover;
            background-position: center;
            will-change: transform;
        }
        .svc-glass-stat {
            position: absolute;
            background: rgba(255,255,255,0.09);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            border: 1px solid rgba(255,255,255,0.16);
            border-radius: 1rem;
            padding: 1.125rem 1.5rem;
            z-index: 3;
        }
        .svc-glass-stat-dark {
            position: absolute;
            background: rgba(10,2,5,0.7);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            border: 1px solid rgba(255,255,255,0.09);
            border-radius: 1rem;
            padding: 1.125rem 1.5rem;
            z-index: 3;
        }
        .svc-stat-num {
            font-size: 1.75rem; font-weight: 800; color: #fff;
            line-height: 1; letter-spacing: -0.02em;
        }
        .svc-stat-lbl {
            font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.14em;
            color: #fff; margin-top: 0.4rem;
        }
        .svc-content-panel {
            display: flex; flex-direction: column; justify-content: center;
        }
        .svc-dark-bg { background: #06020a; }
        .svc-light-bg { background: #ffffff; }
        .svc-inner {
            padding: clamp(3.5rem, 7vw, 7rem) clamp(2.5rem, 5vw, 5rem);
        }
        .svc-eyebrow {
            display: flex; align-items: center; gap: 0.875rem;
            font-size: 0.67rem; text-transform: uppercase; letter-spacing: 0.2em;
            font-weight: 700; margin-bottom: 1.75rem;
        }
        .svc-eyebrow-line {
            height: 1px; width: 32px; background: currentColor; opacity: 0.4; flex-shrink: 0;
        }
        .svc-dark-bg .svc-eyebrow { color: var(--sky); }
        .svc-light-bg .svc-eyebrow { color: var(--claret-mid, var(--claret)); }
        .svc-feature-heading {
            font-size: clamp(2rem, 3.4vw, 3.5rem); font-weight: 600;
            line-height: 1.06; letter-spacing: -0.025em; margin-bottom: 0.625rem;
        }
        .svc-dark-bg .svc-feature-heading { color: #fff; }
        .svc-light-bg .svc-feature-heading { color: var(--claret); }
        .svc-subtitle {
            font-size: 0.9rem; font-weight: 600; letter-spacing: 0.005em;
            margin-bottom: 1.25rem;
        }
        .svc-dark-bg .svc-subtitle { color: var(--sky); }
        .svc-light-bg .svc-subtitle { color: var(--sky-dk); }
        .svc-body {
            font-size: 0.9375rem; line-height: 1.8; margin-bottom: 2.5rem; max-width: 440px;
        }
        .svc-dark-bg .svc-body { color: #fff; }
        .svc-light-bg .svc-body { color: #6b7280; }
        .svc-list {
            display: flex; flex-direction: column;
            border-top: 1px solid; margin-bottom: 2.75rem;
        }
        .svc-dark-bg .svc-list { border-color: rgba(255,255,255,0.08); }
        .svc-light-bg .svc-list { border-color: rgba(0,0,0,0.08); }
        .svc-list-item {
            display: block;
            padding: 1.25rem 0 1.25rem 1.25rem;
            border-bottom: 1px solid;
            border-left: 2px solid;
            opacity: 0; transform: translateY(14px);
            transition: opacity 0.55s ease, transform 0.55s ease;
        }
        .svc-dark-bg .svc-list-item { border-bottom-color: rgba(255,255,255,0.08); border-left-color: var(--sky); }
        .svc-light-bg .svc-list-item { border-bottom-color: rgba(0,0,0,0.08); border-left-color: var(--claret); }
        .svc-list-item.svc-in { opacity: 1; transform: none; }
        .svc-list-icon { display: none; }
        .svc-list-title {
            font-size: 0.875rem; font-weight: 700; margin-bottom: 0.15rem;
        }
        .svc-dark-bg .svc-list-title { color: #fff; }
        .svc-light-bg .svc-list-title { color: var(--claret); }
        .svc-list-desc {
            font-size: 0.78rem; line-height: 1.55;
        }
        .svc-dark-bg .svc-list-desc { color: #fff; }
        .svc-light-bg .svc-list-desc { color: #9ca3af; }

        /* ── Specialist scrollytelling ───────────────────────────── */
        .spec-sticky {
            position: sticky; top: 0;
            height: 100vh;
            display: grid;
            grid-template-columns: 5fr 7fr;
            overflow: hidden;
        }
        @media (max-width: 900px) {
            .spec-sticky { grid-template-columns: 1fr; }
            .spec-right-panel { display: none; }
        }
        .spec-left-panel {
            background: #06020a;
            display: flex; flex-direction: column; justify-content: center;
            padding: clamp(2.5rem, 5vw, 5rem);
            padding-left: calc(max(0px, (100vw - 1600px) / 2) + clamp(1.5rem, 5vw, 5rem));
            position: relative; z-index: 2;
        }
        /* gradient edge blending into image */
        .spec-left-panel::after {
            content: '';
            position: absolute; top: 0; right: -1px; bottom: 0;
            width: 80px;
            background: linear-gradient(to right, #06020a, transparent);
            pointer-events: none; z-index: 3;
        }
        .spec-right-panel {
            position: relative; overflow: hidden;
        }
        .spec-panel-img {
            position: absolute; inset: 0;
            background-size: cover; background-position: center;
            opacity: 0;
            transition: opacity 0.9s cubic-bezier(0.4,0,0.2,1), transform 1.4s ease;
            transform: scale(1.05);
        }
        .spec-panel-img.active {
            opacity: 1; transform: scale(1);
        }
        .spec-panel-img-overlay {
            position: absolute; inset: 0;
            background: linear-gradient(to right, rgba(6,2,10,0.5) 0%, rgba(6,2,10,0.05) 50%);
        }
        /* vertical progress line */
        .spec-progress-track {
            position: absolute; left: 0; top: 0; bottom: 0;
            width: 2px; background: rgba(255,255,255,0.06);
        }
        .spec-progress-fill {
            width: 100%; background: var(--sky);
            height: 0%;
            transition: height 0.15s linear;
            box-shadow: 0 0 6px rgba(108,171,221,0.5);
        }
        /* service rows */
        .spec-item {
            padding: 1.6rem 0 1.6rem 1.5rem;
            border-top: 1px solid rgba(255,255,255,0.07);
            cursor: pointer;
            position: relative;
        }
        .spec-item:last-child { border-bottom: 1px solid rgba(255,255,255,0.07); }
        .spec-item-num {
            font-family: 'Courier New', monospace;
            font-size: 0.62rem; font-weight: 700;
            letter-spacing: 0.14em;
            color: rgba(108,171,221,0.35);
            margin-bottom: 0.5rem;
            transition: color 0.4s;
        }
        .spec-item.active .spec-item-num { color: var(--sky); }
        .spec-item-title {
            font-size: clamp(1.3rem, 2vw, 1.9rem);
            font-weight: 600; letter-spacing: -0.02em; line-height: 1.1;
            color: rgba(255,255,255,0.4);
            transition: color 0.45s ease, transform 0.45s ease;
        }
        .spec-item.active .spec-item-title {
            color: #fff; transform: translateX(4px);
        }
        .spec-item-desc {
            font-size: 0.875rem; line-height: 1.75;
            color: rgba(255,255,255,0.55);
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.55s ease, opacity 0.4s 0.1s ease, margin 0.4s ease;
        }
        .spec-item.active .spec-item-desc {
            max-height: 120px; opacity: 1; margin-top: 0.875rem;
        }
        .spec-item-cta {
            display: inline-flex; align-items: center; gap: 0.5rem;
            color: var(--sky); font-size: 0.68rem; font-weight: 700;
            letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none;
            max-height: 0; overflow: hidden; opacity: 0;
            transition: max-height 0.4s 0.18s ease, opacity 0.35s 0.22s ease, margin 0.4s 0.1s ease;
        }
        .spec-item.active .spec-item-cta {
            max-height: 40px; opacity: 1; margin-top: 1rem;
        }
        .spec-item-cta:hover { gap: 0.875rem; }

        /* ══════════════════════════════════════════════════════════
           OPTION 2 - VERTICAL SIDEBAR NAVIGATION
        ══════════════════════════════════════════════════════════ */
        :root { --sidebar-w: 280px; }

        /* ── Layout ───────────────────────────────────────────── */
        /* padding-left on body is immune to overflow-x:hidden quirks */
        @media (min-width: 1024px) {
            body { padding-left: var(--sidebar-w); }
            .spec-left-panel {
                padding-left: clamp(1.5rem, 5vw, 5rem) !important;
            }
        }

        /* Sidebar: always fixed, slides in on mobile */
        .sidebar {
            position: fixed; left: 0; top: 0; bottom: 0;
            width: var(--sidebar-w);
            background: #fff;
            border-right: 1px solid #e8e8e8;
            box-shadow: 2px 0 20px rgba(0,0,0,0.05);
            display: flex; flex-direction: column;
            z-index: 1000;
            overflow-y: auto;
        }
        @media (max-width: 1023px) {
            .sidebar {
                transform: translateX(-100%);
                transition: transform 0.4s cubic-bezier(0.77,0,0.175,1);
            }
            .sidebar.open { transform: translateX(0); }
            #main-content { padding-top: 64px; }
        }

        /* Logo area */
        .sidebar-logo {
            padding: 1.5rem 1.5rem 1.25rem;
            border-bottom: 1px solid #f0f0f0;
            flex-shrink: 0;
        }
        .sidebar-logo-img {
            width: 140px; height: auto; display: block;
            object-fit: contain;
        }

        /* Nav links */
        .sidebar-nav {
            flex: 1; display: flex; flex-direction: column;
            padding: 0.75rem 0; overflow-y: auto;
        }
        .sidebar-link {
            display: flex; align-items: center; gap: 0.625rem;
            padding: 0.5rem 1.5rem;
            font-size: 0.82rem; font-weight: 500;
            color: #6b7280;
            text-decoration: none; position: relative;
            transition: color 0.18s ease, background 0.18s ease;
            border-left: 2px solid transparent;
        }
        .sidebar-link:hover {
            color: var(--claret);
            background: rgba(74,11,32,0.03);
            border-left-color: var(--sky);
        }
        .sidebar-link.active {
            color: var(--claret);
            font-weight: 700;
            background: rgba(74,11,32,0.04);
            border-left-color: var(--sky);
        }
        .sidebar-link-dot {
            width: 5px; height: 5px; border-radius: 50%;
            background: var(--sky); flex-shrink: 0;
            opacity: 0; transition: opacity 0.18s;
        }
        .sidebar-link:hover .sidebar-link-dot,
        .sidebar-link.active .sidebar-link-dot { opacity: 1; }
        .sidebar-divider {
            height: 1px; background: #f0f0f0;
            margin: 0.5rem 1.5rem;
        }

        /* Bottom panel */
        .sidebar-bottom {
            flex-shrink: 0;
            padding: 1rem 1.5rem 1.5rem;
            border-top: 1px solid #f0f0f0;
        }
        .sidebar-contact-label {
            font-size: 0.55rem; font-weight: 700; letter-spacing: 0.16em;
            text-transform: uppercase; color: #b0b0b0;
            margin-bottom: 0.35rem;
        }
        .sidebar-phone {
            display: block;
            font-size: 0.9rem; font-weight: 600;
            color: var(--claret); text-decoration: none;
            margin-bottom: 0.25rem; transition: color 0.2s;
        }
        .sidebar-phone:hover { color: var(--sky); }
        .sidebar-phone-emergency {
            display: block;
            font-size: 0.9rem; font-weight: 700;
            color: #dc2626; text-decoration: none;
            margin-bottom: 1rem; transition: color 0.2s;
        }
        .sidebar-phone-emergency:hover { color: #b91c1c; }
        .sidebar-cta {
            display: block; text-align: center;
            background: var(--claret);
            color: #fff; font-size: 0.75rem; font-weight: 700;
            letter-spacing: 0.06em;
            padding: 0.7rem 1rem; border-radius: 0.5rem;
            text-decoration: none;
            transition: background 0.25s ease;
        }
        .sidebar-cta:hover { background: var(--claret-lt); }

        /* Overlay (mobile) */
        .sidebar-overlay {
            display: none; position: fixed; inset: 0;
            background: rgba(0,0,0,0.4); z-index: 999;
            opacity: 0; transition: opacity 0.3s;
        }
        .sidebar-overlay.active { opacity: 1; }
        @media (max-width: 1023px) {
            .sidebar-overlay { display: block; pointer-events: none; }
            .sidebar-overlay.active { pointer-events: all; }
        }

        /* Mobile top bar */
        .mobile-topbar {
            display: none; position: fixed; top: 0; left: 0; right: 0;
            height: 64px; background: #fff;
            border-bottom: 1px solid #e8e8e8;
            box-shadow: 0 2px 16px rgba(0,0,0,0.06);
            align-items: center; justify-content: space-between;
            padding: 0 1.25rem; z-index: 998;
        }
        @media (max-width: 1023px) { .mobile-topbar { display: flex; } }
        .mobile-hamburger {
            width: 40px; height: 40px; border: none; background: none;
            cursor: pointer; display: flex; align-items: center; justify-content: center;
            color: var(--claret); border-radius: 8px;
            transition: background 0.2s;
        }
        .mobile-hamburger:hover { background: rgba(74,11,32,0.06); }

        /* Accordion parent links */
        .sidebar-parent {
            display: flex; align-items: center;
            justify-content: space-between;
            padding: 0.5rem 1.5rem;
            font-size: 0.82rem; font-weight: 600;
            color: #374151; cursor: pointer;
            border-left: 2px solid transparent;
            transition: color 0.18s, background 0.18s, border-color 0.18s;
            user-select: none;
        }
        .sidebar-parent:hover { color: var(--claret); background: rgba(74,11,32,0.03); border-left-color: var(--sky); }
        .sidebar-parent.open { color: var(--claret); border-left-color: var(--sky); }
        .sidebar-parent-label {
            flex: 1; color: inherit; text-decoration: none;
            font-size: inherit; font-weight: inherit;
        }
        .sidebar-parent-label:hover { color: var(--claret); }
        .sidebar-parent-arrow {
            width: 16px; height: 16px; flex-shrink: 0;
            transition: transform 0.25s ease;
            color: #9ca3af;
        }
        .sidebar-parent.open .sidebar-parent-arrow { transform: rotate(180deg); }

        /* Sub-links */
        .sidebar-sub {
            max-height: 0; overflow: hidden;
            transition: max-height 0.35s ease;
            background: #fafafa;
        }
        .sidebar-sub.open { max-height: 400px; }
        .sidebar-sub-link {
            display: block;
            padding: 0.35rem 1.5rem 0.35rem 2.25rem;
            font-size: 0.76rem; font-weight: 500;
            color: #6b7280; text-decoration: none;
            transition: color 0.15s;
        }
        .sidebar-sub-link:hover { color: var(--claret); }

        /* Emergency link */
        .sidebar-link-emergency {
            display: flex; align-items: center; gap: 0.5rem;
            padding: 0.6rem 2rem;
            font-size: 0.875rem; font-weight: 700;
            color: #dc2626; text-decoration: none;
            border-left: 2px solid transparent;
            transition: color 0.18s, background 0.18s, border-color 0.18s;
        }
        .sidebar-link-emergency:hover { background: rgba(220,38,38,0.04); border-left-color: #dc2626; }

        /* Scrollbar on sidebar */
        .sidebar-nav::-webkit-scrollbar { width: 3px; }
        .sidebar-nav::-webkit-scrollbar-thumb { background: #e0e0e0; border-radius: 2px; }

        /* ── Active sidebar sub-link ─────────────────────────────── */
        .sidebar-sub-link.active {
            color: var(--claret) !important;
            font-weight: 700;
        }

        /* ── FAQ Accordion ──────────────────────────────────────── */
        .faq-item { border-bottom: 1px solid #e8e8e8; }
        .faq-item:first-child { border-top: 1px solid #e8e8e8; }
        .faq-item-dark { border-bottom: 1px solid rgba(255,255,255,0.08); }
        .faq-item-dark:first-child { border-top: 1px solid rgba(255,255,255,0.08); }
        .faq-trigger {
            width: 100%; display: flex; align-items: center;
            justify-content: space-between; padding: 1.25rem 0;
            background: none; border: none; cursor: pointer; text-align: left; gap: 1rem;
        }
        .faq-question { font-size: 0.9375rem; font-weight: 600; color: var(--claret); line-height: 1.4; }
        .faq-question-dark { color: #fff; }
        .faq-icon {
            width: 32px; height: 32px; border-radius: 50%;
            background: rgba(74,11,32,0.06); border: 1px solid rgba(74,11,32,0.12);
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; transition: transform 0.3s ease, background 0.25s, border-color 0.25s;
        }
        .faq-icon-dark { background: rgba(108,171,221,0.1); border-color: rgba(108,171,221,0.2); }
        .faq-trigger[aria-expanded="true"] .faq-icon {
            transform: rotate(45deg); background: var(--claret); border-color: var(--claret);
        }
        .faq-trigger[aria-expanded="true"] .faq-icon svg { stroke: #fff !important; }
        .faq-trigger[aria-expanded="true"] .faq-icon-dark {
            background: var(--sky); border-color: var(--sky);
        }
        .faq-body { overflow: hidden; max-height: 0; transition: max-height 0.4s ease; }
        .faq-body.open { max-height: 600px; }
        .faq-answer { font-size: 0.9rem; line-height: 1.85; color: #6b7280; padding-bottom: 1.5rem; }
        .faq-answer-dark { color: #fff; }

        /* ── Stats strip (below hero) ────────────────────────────── */
        .stats-strip {
            background: #0d0108;
            border-bottom: 1px solid rgba(255,255,255,0.06);
            padding: 0;
        }
        .stats-strip-inner {
            display: flex; align-items: stretch;
        }
        .stats-strip-item {
            flex: 1; text-align: center;
            padding: 2rem 1.5rem;
            border-right: 1px solid rgba(255,255,255,0.06);
            position: relative;
        }
        .stats-strip-item:last-child { border-right: none; }
        .stats-strip-num {
            font-size: clamp(1.75rem,3vw,2.75rem);
            font-weight: 800; color: #fff;
            line-height: 1; letter-spacing: -0.03em;
            display: block;
        }
        .stats-strip-num .accent { color: var(--sky); }
        .stats-strip-lbl {
            font-size: 0.6rem; font-weight: 700;
            letter-spacing: 0.18em; text-transform: uppercase;
            color: #fff; margin-top: 0.5rem;
            display: block;
        }

        /* ── Stats strip - hidden ────────────────────────────────── */
        .stats-strip { display: none; }

        /* ── Landing page hero - fixed height, consistent ───────── */
        .page-hero {
            position: relative; overflow: hidden;
            height: 30rem;
            padding-top: 10rem;
            padding-bottom: 0;
            background: #0d0108;
        }
        .page-hero-bg {
            position: absolute; inset: 0;
            background-size: cover; background-position: center;
        }
        .page-hero-overlay {
            position: absolute; inset: 0;
            background: linear-gradient(to top,rgba(6,2,10,0.97) 0%,rgba(20,5,15,0.8) 45%,rgba(0,0,0,0.3) 100%);
        }
        /* Desktop: show header images with no dark fade/overlay (mobile keeps it for text legibility) */
        @media (min-width: 1024px) {
            .page-hero-overlay, .hero-fade-overlay { display: none; }
        }
        .page-hero-rule {
            position: absolute; bottom: 0; left: 0; right: 0; height: 1px;
            background: linear-gradient(to right,var(--sky),rgba(108,171,221,0.2),transparent);
        }
        .page-hero-h1 {
            font-size: clamp(2.5rem, 4.5vw, 4.375rem);
            font-weight: 700; color: #fff;
            line-height: 1.05; letter-spacing: -0.035em;
            margin: 0 0 0.75rem;
        }
        .page-hero-sub {
            font-size: clamp(1rem,1.5vw,1.125rem);
            font-weight: 400; color: #fff;
            line-height: 1.65; max-width: 520px; margin: 0;
        }

        /* ── Accent number card ──────────────────────────────────── */
        .stat-float {
            position: absolute; bottom: -1.5rem; left: -1.5rem;
            background: #fff; border: 1px solid #e8e8e8;
            border-radius: 1rem; padding: 1.25rem 1.75rem;
            box-shadow: 0 20px 50px rgba(0,0,0,0.12);
            z-index: 3;
        }
        .stat-float-num {
            font-size: 2.25rem; font-weight: 800;
            color: var(--claret); line-height: 1; letter-spacing: -0.02em;
        }
        .stat-float-lbl {
            font-size: 0.62rem; font-weight: 700;
            letter-spacing: 0.14em; text-transform: uppercase;
            color: #9ca3af; margin-top: 0.3rem;
        }
        .stat-float-dark {
            background: #0d0108; border-color: rgba(255,255,255,0.1);
            box-shadow: 0 20px 50px rgba(0,0,0,0.4);
        }
        .stat-float-dark .stat-float-num { color: var(--sky); }
        .stat-float-dark .stat-float-lbl { color: #fff; }

        /* ── Standard CTA block ──────────────────────────────────── */
        .cta-block {
            background: var(--claret); padding: 5rem 0;
        }
        .cta-contact-row {
            display: flex; align-items: center; gap: 1.25rem;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.09);
            border-radius: 1.25rem; padding: 1.5rem;
            transition: border-color 0.25s, background 0.25s;
        }
        .cta-contact-row:hover {
            border-color: rgba(108,171,221,0.2);
            background: rgba(255,255,255,0.06);
        }
        .cta-contact-icon {
            width: 48px; height: 48px;
            background: rgba(108,171,221,0.15); border-radius: 10px;
            display: flex; align-items: center; justify-content: center; flex-shrink: 0;
        }
        .cta-contact-label {
            font-size: 0.62rem; font-weight: 700;
            letter-spacing: 0.15em; text-transform: uppercase;
            color: #fff; margin-bottom: 0.2rem;
        }

        /* ── Premium image block ─────────────────────────────────── */
        .img-block {
            border-radius: 1.5rem; overflow: hidden;
            position: relative;
            box-shadow: 0 30px 70px rgba(74,11,32,0.15);
        }
        .img-block img {
            width: 100%; height: 100%;
            object-fit: cover; display: block;
        }

        /* ── Trust badges row ────────────────────────────────────── */
        .trust-badge {
            padding: 1.25rem 1.5rem 1.25rem 1.75rem;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            border-left: 2px solid var(--sky);
            border-radius: 0 1rem 1rem 0;
            transition: border-color 0.25s, background 0.25s;
        }
        .trust-badge:hover { border-color: rgba(108,171,221,0.25); border-left-color: var(--sky); background: rgba(255,255,255,0.07); }
        .trust-badge-icon { display: none; }
        .trust-badge-title { font-size: 0.875rem; font-weight: 700; color: #fff; letter-spacing: -0.01em; }
        .trust-badge-sub { font-size: 0.72rem; color: #fff; margin-top: 0.25rem; line-height: 1.5; }

        /* ── Feature list row ────────────────────────────────────── */
        .feature-row {
            display: block;
            padding: 1.5rem 0 1.5rem 1.25rem;
            border-bottom: 1px solid rgba(255,255,255,0.07);
            border-left: 2px solid var(--sky);
        }
        .feature-row:last-child { border-bottom: none; }
        .feature-row-light { border-bottom-color: #e8e8e8; border-left-color: var(--claret); }
        .feature-row-icon { display: none; }

        /* ── Numbered step ───────────────────────────────────────── */
        .step-num {
            font-family: 'Courier New', monospace;
            font-size: 3rem; font-weight: 700;
            line-height: 1; color: var(--sky);
            opacity: 0.25; flex-shrink: 0; width: 3rem;
        }

        /* ── Icon-free card title spacing ───────────────────────── */
        /* Titles inside cards now sit flush without an icon box above */
        .lift-type-card > div:first-child { margin-bottom: 0.75rem; }
        .dark-card > div[style*="font-weight"] { margin-bottom: 0.75rem; }

        /* ── Dark info card - shared style for all content box variants ── */
        .dark-card,
        .pkg-card, .accred-card, .check-card, .consult-card, .diag-card,
        .pillar-card, .promise-card, .trust-card, .why-card, .loler-row,
        .safety-card, .service-card, .product-card, .region-card,
        .contact-card, .support-row, .timeline-item, .trust-row,
        .mod-card, .lift-type-card, .light-card, .county-card, .detail-card,
        .national-card, .t-card, .why-item, .why-row, .focus-row,
        .energy-row, .puwer-row, .reason-row, .reg-row, .standard-row {
            margin-bottom: 0.625rem;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 1.25rem; padding: 1.75rem;
            transition: border-color 0.3s, background 0.3s;
        }
        .dark-card:hover,
        .pkg-card:hover, .accred-card:hover, .check-card:hover,
        .consult-card:hover, .diag-card:hover, .pillar-card:hover,
        .promise-card:hover, .trust-card:hover, .why-card:hover,
        .safety-card:hover, .service-card:hover, .product-card:hover,
        .region-card:hover, .contact-card:hover, .trust-row:hover,
        .mod-card:hover, .lift-type-card:hover, .county-card:hover,
        .detail-card:hover, .national-card:hover, .t-card:hover,
        .why-item:hover, .why-row:hover, .focus-row:hover,
        .energy-row:hover, .puwer-row:hover, .reason-row:hover,
        .reg-row:hover, .standard-row:hover {
            border-color: rgba(108,171,221,0.22);
            background: rgba(255,255,255,0.06);
        }
        /* lift-type-card inline pages - ensure top rule shows */

        /* ── Light info card ─────────────────────────────────────── */
        .light-card {
            background: #fff; border: 1px solid #e8e8e8;
            border-radius: 1.25rem; padding: 2rem;
            transition: box-shadow 0.3s, border-color 0.3s;
            position: relative; overflow: hidden;
        }
        /* ── Internal page hero - consistent height & type ──────── */
        /* overflow:hidden is already inline on every hero section,  */
        /* so a fixed height clips everything to the exact same box. */
        #main-content > section:first-child {
            height: 30rem !important;
            padding-top: 10rem !important;
            padding-bottom: 0 !important;
        }
        #main-content > section:first-child h1 {
            font-size: clamp(2.5rem, 4.5vw, 4.375rem) !important;
            font-weight: 700 !important;
            line-height: 1.05 !important;
            letter-spacing: -0.03em !important;
            margin-bottom: 0.75rem !important;
        }
        .light-card:hover { box-shadow: 0 12px 40px rgba(74,11,32,0.1); border-color: rgba(74,11,32,0.15); }
        .light-card:hover::before { opacity: 1; }