*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; overflow-x: hidden; }
        :root {
            --navy:#0d1f3c;--dark-bg:#06111f;--red:#c8251d;--red-dark:#a81e17;--gold:#e8920a;--orange:#f97316;--green:#10b981;--blue:#1e88e5;--light:#f4f6f9;--border:#e8ecf2;--muted:#8a96a8;--body-text:#3a4558;--heading:#0d1f3c;--white:#ffffff;--shadow:0 4px 8px rgba(0,0,0,0.09);--shadow-lg:0 12px 30px rgba(0,0,0,0.14);
        }

        /* ── FULL-BLEED HARDENING ─────────────────────────────────────
           Hostinger's published wrapper sometimes constrains the page
           into a boxed layout. These rules ensure every top-level
           container is 100% width with NO max-width, no inline-block
           sizing, and no BFC trap (overflow-x:clip — NOT hidden — so
           we don't create a scroll container that fights the parent).
           Inner content is centered via per-section .container blocks,
           never on body/main itself. ───────────────────────────────── */
        html, body { width:100%; max-width:100%; }
        body { font-family:'Poppins',-apple-system,BlinkMacSystemFont,sans-serif; color:var(--body-text); font-size:16px; line-height:1.7; overflow-x:clip; }
        main { display:block; width:100%; max-width:100%; overflow-x:clip; }
        section, .section, .section-sm, .cta-band, .seo-block,
        .trust-bar, .social-strip, .top-banner, .hero { width:100%; max-width:100%; }

        .container  { max-width:1200px; margin:0 auto; padding:0 20px; }
        .section    { padding:80px 20px; width:100%; }
        .section-sm { padding:56px 20px; width:100%; }
        h1 { font-size:clamp(1.9rem,5vw,3.2rem); font-weight:800; line-height:1.12; color:var(--white); }
        h2 { font-size:clamp(1.5rem,3.8vw,2.4rem); font-weight:700; line-height:1.2; color:var(--heading); margin-bottom:14px; }
        h3 { font-size:clamp(1.05rem,2.4vw,1.3rem); font-weight:700; line-height:1.3; color:var(--heading); margin-bottom:10px; }
        h4 { font-size:.98rem; font-weight:700; color:var(--heading); margin-bottom:7px; }
        p  { margin-bottom:15px; line-height:1.8; }
        a  { text-decoration:none; color:inherit; }
        ul { list-style:none; padding:0; }

        .btn { display:inline-block; padding:14px 28px; font-family:'Poppins',sans-serif; font-size:1rem; font-weight:700; border-radius:6px; border:none; cursor:pointer; transition:all .25s ease; text-align:center; white-space:nowrap; }
        .btn-red       { background:var(--red); color:var(--white); box-shadow:0 4px 14px rgba(200,37,29,0.3); }
        .btn-red:hover { background:var(--red-dark); transform:translateY(-2px); color:var(--white); }
        .btn-ghost       { background:transparent; color:var(--white); border:2px solid rgba(255,255,255,0.4); }
        .btn-ghost:hover { background:var(--white); color:var(--navy); }
        .btn-outline-red       { background:transparent; color:var(--red); border:2px solid var(--red); }
        .btn-outline-red:hover { background:var(--red); color:var(--white); }
        .btn-gold       { background:var(--gold); color:var(--white); box-shadow:0 4px 14px rgba(232,146,10,0.35); }
        .btn-gold:hover { background:#c97a08; transform:translateY(-2px); color:var(--white); }

        /* HERO */
        .hero { position:relative; background:var(--dark-bg); overflow:hidden; padding:72px 20px 80px; }
        .hero::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(-45deg,transparent,transparent 42px,rgba(255,255,255,0.011) 42px,rgba(255,255,255,0.011) 43px); }
        .hero-bar { position:absolute; top:0; left:0; width:6px; height:100%; background:linear-gradient(180deg,var(--red),var(--gold)); }
        .hero-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:40px; position:relative; z-index:1; align-items:center; }
        .hero-badges { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
        .hero-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(200,37,29,0.15); border:1px solid rgba(200,37,29,0.35); border-radius:4px; padding:5px 12px; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#fca5a5; }
        .hero-badge.gold-badge { background:rgba(232,146,10,0.15); border-color:rgba(232,146,10,0.35); color:#fcd34d; }
        .hero h1 span { color:var(--gold); }
        .hero-sub { font-size:1.05rem; color:rgba(255,255,255,0.62); line-height:1.8; margin:16px 0 24px; max-width:620px; }
        .hero-btns { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:28px; }
        .hero-trust { display:flex; gap:18px; flex-wrap:wrap; }
        .trust-item { font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,0.45); }

        /* HERO FEATURED ROTATOR */
        .hero-feature {
            position:relative; border-radius:14px; overflow:hidden;
            background:#0a1828; border:1px solid rgba(255,255,255,0.08);
            aspect-ratio: 4/5;
            box-shadow:0 20px 50px rgba(0,0,0,0.45);
        }
        .hero-feature-stage { position:absolute; inset:0; }
        .hero-feature-slide {
            position:absolute; inset:0;
            display:flex; align-items:center; justify-content:center;
            background:#0a1828;
            opacity:0; transition:opacity .9s ease;
        }
        .hero-feature-slide.is-active { opacity:1; }
        .hero-feature-slide img {
            width:100%; height:100%; object-fit:contain; display:block;
        }
        .hero-feature-frame {
            position:absolute; inset:0;
            background:linear-gradient(180deg, transparent 55%, rgba(6,17,31,0.92) 100%);
            pointer-events:none;
        }
        .hero-feature-meta {
            position:absolute; left:18px; right:18px; bottom:18px;
            display:flex; align-items:center; justify-content:space-between; gap:12px;
            z-index:2;
        }
        .hero-feature-label {
            font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em;
            color:rgba(255,255,255,0.85);
            background:rgba(0,0,0,0.35); border:1px solid rgba(255,255,255,0.15);
            border-radius:4px; padding:6px 11px; backdrop-filter:blur(4px);
        }
        .hero-feature-dots { display:flex; gap:6px; }
        .hero-feature-dot {
            width:22px; height:3px; border-radius:2px;
            background:rgba(255,255,255,0.22); border:none; cursor:pointer;
            padding:0; transition:background .25s;
        }
        .hero-feature-dot.is-active { background:var(--gold); }
        .hero-feature-corner {
            position:absolute; top:14px; left:14px;
            display:inline-flex; align-items:center; gap:7px;
            font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em;
            color:var(--gold);
            background:rgba(6,17,31,0.55); border:1px solid rgba(232,146,10,0.35);
            border-radius:4px; padding:5px 11px; backdrop-filter:blur(6px);
            z-index:2;
        }
        .hero-feature-corner::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--gold); }

        /* TRUST BAR */
        .trust-bar { background:var(--navy); border-bottom:1px solid rgba(255,255,255,0.06); padding:14px 20px; }
        .trust-bar-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:28px; flex-wrap:wrap; }
        .tb-item { display:flex; align-items:center; gap:7px; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,0.55); }
        .tb-item .tb-icon { font-size:1rem; }

        /* SECTION LABELS */
        .section-label { display:flex; align-items:center; justify-content:center; gap:8px; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.15em; color:var(--orange); margin-bottom:10px; }
        .section-label::before,.section-label::after { content:''; display:inline-block; width:22px; height:2px; background:var(--orange); border-radius:1px; }
        .section-label.red { color:var(--red); }
        .section-label.red::before,.section-label.red::after { background:var(--red); }
        .section-label.gold { color:var(--gold); }
        .section-label.gold::before,.section-label.gold::after { background:var(--gold); }
        .section-label.left { justify-content:flex-start; }
        .section-label.left::before,.section-label.left::after { display:none; }
        .section-head  { text-align:center; margin-bottom:48px; }
        .section-intro { font-size:1rem; color:var(--body-text); max-width:720px; margin:0 auto; line-height:1.82; }

        .bg-white { background:var(--white); }
        .bg-light { background:var(--light); }
        .bg-dark  { background:var(--dark-bg); }

        /* GALLERY FILTER TABS — same vocab as .services-tabs */
        .gallery-filters {
            display:flex; gap:0; margin-bottom:32px;
            border:1px solid var(--border); border-radius:8px; overflow:hidden;
            background:var(--white); flex-wrap:wrap;
        }
        .gfilter {
            flex:1 1 50%; padding:13px 10px; text-align:center; font-size:.82rem; font-weight:700;
            cursor:pointer; border:none; background:none; font-family:'Poppins',sans-serif;
            color:var(--muted); transition:all .2s;
            border-right:1px solid var(--border); border-bottom:1px solid var(--border);
        }
        .gfilter:last-child { border-right:none; }
        .gfilter.active { background:var(--dark-bg); color:var(--white); }
        .gfilter:hover:not(.active) { background:var(--light); color:var(--heading); }
        .gfilter .gf-count {
            display:inline-block; margin-left:6px; font-size:.7rem; opacity:.6; font-weight:600;
        }

        /* MASONRY GALLERY — CSS columns preserves natural aspect ratio (no cropping) */
        .gallery-grid {
            column-count:1; column-gap:18px;
        }
        .gallery-grid .gtile {
            break-inside:avoid; -webkit-column-break-inside:avoid; page-break-inside:avoid;
            margin-bottom:18px;
        }
        .gtile {
            display:block; position:relative; overflow:hidden;
            border-radius:10px;
            background:#0a1828;
            border:1px solid var(--border);
            box-shadow:var(--shadow);
            transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
        }
        .gtile img {
            width:100%; height:auto; display:block;
            object-fit:contain;
            transition:transform .5s ease;
        }
        .gtile-overlay {
            position:absolute; inset:0;
            background:linear-gradient(180deg, transparent 45%, rgba(6,17,31,0.78) 100%);
            opacity:0; transition:opacity .35s ease;
            pointer-events:none;
        }
        .gtile-label {
            position:absolute; bottom:14px; left:14px; right:14px;
            font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
            color:rgba(255,255,255,0.95);
            opacity:0; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease;
            pointer-events:none;
        }
        .gtile:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:rgba(200,37,29,0.25); }
        .gtile:hover img { transform:scale(1.04); }
        .gtile:hover .gtile-overlay { opacity:1; }
        .gtile:hover .gtile-label { opacity:1; transform:translateY(0); }
        .gtile.is-hidden { display:none; }

        /* ════════════════════════════════════════════════════════════
           BEFORE & AFTER — Premium card structure
           Eyebrow → title → body → divider → location footer.
           No center divider between images (it overlapped image
           junctions awkwardly). Cards use the same hover-lift +
           top-accent pattern as .service-card on the homepage.
        ════════════════════════════════════════════════════════════ */
        .ba-grid { display:grid; grid-template-columns:1fr; gap:28px; }
        .ba-card {
            background:var(--white); border-radius:14px; border:1px solid var(--border);
            box-shadow:var(--shadow); overflow:hidden; transition:all .35s ease;
            position:relative; display:flex; flex-direction:column;
        }
        .ba-card::after {
            content:''; position:absolute; top:0; left:0; right:0; height:3px;
            background:linear-gradient(90deg, var(--gold), #f59e0b);
            opacity:0; transition:opacity .35s ease;
        }
        .ba-card:hover {
            transform:translateY(-5px);
            box-shadow:0 18px 40px rgba(0,0,0,0.12);
            border-color:rgba(232,146,10,0.35);
        }
        .ba-card:hover::after { opacity:1; }

        .ba-pair {
            display:grid; grid-template-columns:1fr 1fr;
            gap:2px;
            background:var(--border);
        }
        .ba-pane {
            position:relative; aspect-ratio:1/1; background:#0a1828; overflow:hidden;
        }
        .ba-pane img {
            width:100%; height:100%; object-fit:contain; display:block;
            transition:transform .6s ease;
        }
        .ba-pane:hover img { transform:scale(1.04); }
        .ba-tag {
            position:absolute; top:14px; left:14px; z-index:2;
            font-size:.64rem; font-weight:800; text-transform:uppercase; letter-spacing:.14em;
            padding:6px 12px; border-radius:4px;
            color:#fff;
            box-shadow:0 4px 12px rgba(0,0,0,0.25);
        }
        .ba-tag.before { background:var(--red); }
        .ba-tag.after  { background:var(--green); }

        .ba-meta {
            padding:30px 32px 28px;
            display:flex; flex-direction:column; gap:10px;
            border-top:1px solid var(--border);
            background:var(--white);
        }
        .ba-eyebrow {
            font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em;
            color:var(--gold);
            display:inline-flex; align-items:center; gap:8px;
            margin-bottom:2px;
        }
        .ba-eyebrow::before {
            content:''; width:18px; height:2px; background:var(--gold); border-radius:1px; display:inline-block;
        }
        .ba-meta h3 {
            font-size:1.15rem; line-height:1.3; margin-bottom:0;
            color:var(--heading); font-weight:700;
        }
        .ba-meta p  {
            font-size:.92rem; color:var(--body-text); margin-bottom:0; line-height:1.78;
        }
        .ba-footer {
            display:flex; align-items:center; justify-content:space-between; gap:16px;
            margin-top:6px; padding-top:18px;
            border-top:1px solid var(--border);
            flex-wrap:wrap;
        }
        .ba-loc {
            display:inline-flex; align-items:center; gap:6px;
            font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
            color:var(--red);
        }
        .ba-tip {
            font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
            color:var(--muted);
            display:inline-flex; align-items:center; gap:6px;
        }
        .ba-tip span { color:var(--gold); }

        /* SHOWCASE STRIP — premium horizontal feature */
        .showcase {
            background:var(--white); border-radius:14px; overflow:hidden;
            border:1px solid var(--border);
            display:grid; grid-template-columns:1fr; gap:0;
            box-shadow:var(--shadow);
            margin-top:32px;
            transition:all .35s ease;
            position:relative;
        }
        .showcase::after {
            content:''; position:absolute; top:0; left:0; right:0; height:3px;
            background:linear-gradient(90deg, var(--gold), #f59e0b);
            opacity:0; transition:opacity .35s ease;
        }
        .showcase:hover { box-shadow:0 18px 40px rgba(0,0,0,0.12); border-color:rgba(232,146,10,0.35); }
        .showcase:hover::after { opacity:1; }
        .showcase-img {
            position:relative; aspect-ratio:4/3; background:#0a1828; overflow:hidden;
        }
        .showcase-img img { width:100%; height:100%; object-fit:contain; transition:transform .6s ease; }
        .showcase-img:hover img { transform:scale(1.04); }
        .showcase-text {
            padding:32px 32px 30px; background:var(--white);
            display:flex; flex-direction:column; gap:10px;
            justify-content:center;
        }
        .showcase-text h3 { font-size:1.2rem; margin-bottom:0; line-height:1.3; }
        .showcase-text p  { font-size:.94rem; color:var(--body-text); line-height:1.78; margin-bottom:0; }
        .showcase-text .ba-footer { margin-top:8px; }

        /* EMPTY STATE */
        .gallery-empty {
            text-align:center; padding:40px 20px; color:var(--muted);
            font-size:.92rem; display:none;
        }
        .gallery-empty.is-shown { display:block; }

        /* CTA BAND (same as homepage) */
        .cta-band { background:var(--dark-bg); padding:68px 20px; position:relative; overflow:hidden; }
        .cta-band::before { content:''; position:absolute; top:0; left:0; width:7px; height:100%; background:linear-gradient(180deg,var(--red),var(--gold)); }
        .cta-row { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; position:relative; z-index:1; }
        .cta-text h2 { color:var(--white); margin-bottom:7px; }
        .cta-text h2 span { color:var(--gold); }
        .cta-text p  { color:rgba(255,255,255,0.5); font-size:.94rem; margin-bottom:0; }
        .cta-phone { display:flex; align-items:center; gap:11px; background:var(--red); color:var(--white); padding:15px 26px; border-radius:6px; transition:background .2s; }
        .cta-phone:hover { background:var(--red-dark); color:var(--white); }
        .cta-phone-lbl { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; opacity:.75; display:block; line-height:1; margin-bottom:2px; color:var(--white); }
        .cta-phone-num { font-size:1.6rem; font-weight:800; line-height:1; color:var(--white); }
        .cta-hrs { font-size:.76rem; color:rgba(255,255,255,0.35); font-weight:600; text-transform:uppercase; letter-spacing:.04em; }

        /* SEO BLOCK */
        .seo-block { background:var(--light); padding:56px 20px; }
        .seo-inner { max-width:1200px; margin:0 auto; }
        .seo-inner h2 { font-size:1.3rem; color:var(--heading); margin-bottom:14px; }
        .seo-inner p  { font-size:.9rem; color:var(--body-text); line-height:1.85; margin-bottom:14px; }
        .seo-inner a  { color:var(--red); font-weight:600; }
        .seo-inner a:hover { text-decoration:underline; }

        /* SOCIAL STRIP */
        .social-strip { background:var(--navy); border-top:1px solid rgba(255,255,255,0.07); padding:32px 20px; }
        .social-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; }
        .social-lbl { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,0.3); margin-right:6px; }
        .social-btn { display:flex; align-items:center; gap:8px; padding:10px 18px; border-radius:6px; font-size:.82rem; font-weight:700; transition:all .2s; border:1px solid transparent; }
        .social-btn.fb  { background:rgba(24,119,242,0.15); border-color:rgba(24,119,242,0.3); color:#7eb2ff; }
        .social-btn.ig  { background:rgba(225,48,108,0.15); border-color:rgba(225,48,108,0.3); color:#f9a8c5; }
        .social-btn.yt  { background:rgba(255,0,0,0.15); border-color:rgba(255,0,0,0.3); color:#fca5a5; }
        .social-btn.pt  { background:rgba(230,0,35,0.15); border-color:rgba(230,0,35,0.3); color:#fca5a5; }
        .social-btn:hover { transform:translateY(-2px); filter:brightness(1.2); }

        /* TOP BANNER (same animation as homepage) */
        @keyframes bannerPulse {
            0%   { background-color:rgba(180,28,22,0.92); }
            50%  { background-color:rgba(20,80,160,0.92); }
            100% { background-color:rgba(180,28,22,0.92); }
        }
        .top-banner { width:100%; animation:bannerPulse 8s ease-in-out infinite; background-color:rgba(180,28,22,0.92); padding:11px 20px; text-align:center; position:relative; z-index:100; }
        .top-banner-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
        .top-banner-icon { font-size:.95rem; flex-shrink:0; }
        .top-banner-text { font-size:.82rem; font-weight:600; color:rgba(255,255,255,0.93); letter-spacing:.02em; line-height:1.5; }
        .top-banner-text strong { color:#fff; font-weight:700; }
        .top-banner-cta { font-size:.76rem; font-weight:700; color:#fff; background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.35); border-radius:4px; padding:4px 12px; white-space:nowrap; transition:background .2s; flex-shrink:0; }
        .top-banner-cta:hover { background:rgba(255,255,255,0.28); color:#fff; }

        /* ━━━ RESPONSIVE ━━━ */
        .hero       { padding:36px 14px 44px; }
        .section    { padding:44px 14px; }
        .section-sm { padding:36px 14px; }
        .cta-band   { padding:44px 14px; }
        .seo-block  { padding:36px 14px; }
        .hero-btns  { flex-direction:column; }
        .btn        { width:100%; text-align:center; padding:14px 18px; }
        .cta-row    { flex-direction:column; align-items:flex-start; }
        .cta-phone  { width:100%; justify-content:center; }
        .cta-hrs    { text-align:center; width:100%; margin-top:8px; }
        .ba-grid    { gap:20px; }
        .container  { padding:0 14px; }

        @media(max-width:480px){
            .top-banner-text { font-size:.76rem; }
            .top-banner { padding:10px 14px; }
            .ba-pair { grid-template-columns:1fr; }
            .gfilter { flex:1 1 50%; font-size:.74rem; padding:11px 8px; }
        }

        @media(min-width:640px){
            .hero       { padding:60px 24px 68px; }
            .section    { padding:64px 24px; }
            .section-sm { padding:52px 24px; }
            .cta-band   { padding:64px 24px; }
            .seo-block  { padding:52px 24px; }
            .container  { padding:0 20px; }
            .btn        { width:auto; }
            .hero-btns  { flex-direction:row; }
            .hero-inner { grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; }
            .gallery-grid { column-count:2; column-gap:18px; }
            .gallery-grid .gtile { margin-bottom:18px; }
            .gfilter { flex:1 1 auto; }
            .cta-row   { flex-direction:row; align-items:center; justify-content:space-between; }
            .cta-phone { width:auto; justify-content:flex-start; }
            .cta-hrs   { text-align:right; width:auto; }
            .ba-meta { padding:34px 36px 30px; gap:12px; }
            .ba-meta h3 { font-size:1.2rem; }
            .ba-grid   { grid-template-columns:1fr; }
            .showcase  { grid-template-columns:1.3fr 1fr; }
            .showcase-img { aspect-ratio:auto; height:100%; min-height:340px; }
            .showcase-text { padding:36px 38px; }
        }

        @media(min-width:1024px){
            .hero       { padding:88px 20px 80px; }
            .section    { padding:80px 20px; }
            .cta-band   { padding:74px 20px; }
            .hero-inner { grid-template-columns:1.2fr 1fr; gap:60px; align-items:center; }
            .gallery-grid { column-count:3; column-gap:22px; }
            .gallery-grid .gtile { margin-bottom:22px; }
            .ba-grid    { grid-template-columns:1fr 1fr; gap:32px; }
            .ba-meta    { padding:36px 38px 32px; }
            .showcase   { grid-template-columns:1.25fr 1fr; }
            .showcase-text { padding:44px 44px; }
        }

        @media(min-width:1280px){
            .gallery-grid { column-count:3; }
        }

        @media(min-width:1440px){
            .hero-inner,.container,.cta-row,.seo-inner { max-width:1360px; }
        }