/* ==========================================================================
   LOZY — network footer
   assets/css/footer-network.css

   A page-independent footer: an India network map with real locations,
   hover cards, a live statistics strip, and the full site navigation.
   Everything is namespaced `.lzfn-*` so it cannot collide with the legacy
   `.lz-foot` block in assets/sass/footer/footer.css (which stays as the
   fallback for the landing layout).

   Design rules it obeys (DESIGN.md, repo root):
     - light only: paper #fff / surface #F6F6F7 / hairlines. No dark surface.
     - one red (#D71920) used as an event: markers, focus ring, primary
       button, hover accents. Never as a background for text.
     - art is drawn, never photographed; the map is inline SVG.
     - motion is transform/opacity only, and resolves to the finished state
       under prefers-reduced-motion.
   ========================================================================== */

.lzfn {
    /* --- tokens (footer-local copies of the site tokens) --- */
    --lzfn-red: #D71920;
    --lzfn-red-deep: #C0161B;
    --lzfn-ink: #17171A;
    --lzfn-muted: #5A5A5F;
    --lzfn-paper: #FFFFFF;
    --lzfn-surface: #F6F6F7;
    --lzfn-line: #E6E6E8;
    --lzfn-line-strong: #D5D5DA;
    --lzfn-wa: #25D366;
    --lzfn-display: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    --lzfn-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
    --lzfn-container: 1240px;
    --lzfn-gutter: 24px;
    --lzfn-ease: cubic-bezier(.22, .61, .36, 1);

    position: relative;
    background: var(--lzfn-paper);
    color: var(--lzfn-ink);
    font-family: var(--lzfn-display);
    font-size: 16px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;   /* clip, not hidden — keeps sticky children working */
}

.lzfn *,
.lzfn *::before,
.lzfn *::after { box-sizing: border-box; }

.lzfn img { max-width: 100%; display: block; }

.lzfn a { color: inherit; text-decoration: none; }

.lzfn :focus-visible {
    outline: 2px solid var(--lzfn-red);
    outline-offset: 3px;
    border-radius: 4px;
}

.lzfn-wrap {
    max-width: var(--lzfn-container);
    margin: 0 auto;
    padding: 0 var(--lzfn-gutter);
}

/* --------------------------------------------------------------------------
   Shared type
   -------------------------------------------------------------------------- */

.lzfn-label {
    margin: 0 0 14px;
    font-family: var(--lzfn-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-label--red { color: var(--lzfn-red); }

.lzfn-h2 {
    margin: 0;
    font-size: clamp(30px, 4.4vw, 60px);
    font-weight: 800;
    line-height: .98;
    letter-spacing: -.025em;
    color: var(--lzfn-ink);
}

.lzfn-lead {
    margin: 18px 0 0;
    max-width: 46ch;
    font-size: clamp(15px, 1.15vw, 17px);
    line-height: 1.6;
    color: var(--lzfn-muted);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.lzfn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 13px 26px;
    border: 1.5px solid transparent;
    border-radius: 999px;
    font-family: inherit;
    font-size: 15.5px;
    font-weight: 650;
    letter-spacing: -.01em;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    background: none;
    transition: transform .22s var(--lzfn-ease), background-color .22s, border-color .22s, color .22s, box-shadow .22s;
}

.lzfn-btn svg { flex: 0 0 auto; }

.lzfn-btn--primary {
    background: var(--lzfn-red);
    color: #fff;
    box-shadow: 0 2px 4px rgba(23, 23, 26, .06);
}

.lzfn-btn--primary:hover {
    background: var(--lzfn-red-deep);
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(215, 25, 32, .22);
}

.lzfn-btn--ghost {
    background: var(--lzfn-paper);
    border-color: var(--lzfn-line-strong);
    color: var(--lzfn-ink);
}

.lzfn-btn--ghost:hover {
    border-color: var(--lzfn-ink);
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(23, 23, 26, .08);
}

.lzfn-btn--wa {
    background: var(--lzfn-wa);
    color: var(--lzfn-ink);
}

.lzfn-btn--wa:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(37, 211, 102, .28);
}

.lzfn-btn__arrow {
    transition: transform .22s var(--lzfn-ease);
}

.lzfn-btn:hover .lzfn-btn__arrow { transform: translateX(3px); }

/* ==========================================================================
   1. CTA
   ========================================================================== */

.lzfn-cta {
    background: var(--lzfn-paper);
    padding: clamp(64px, 8vw, 116px) 0 clamp(44px, 5vw, 64px);
}

.lzfn-cta__h {
    margin: 0;
    max-width: 18ch;
    font-size: clamp(34px, 6vw, 76px);
    font-weight: 800;
    line-height: .96;
    letter-spacing: -.03em;
}

.lzfn-cta__lead {
    margin: 22px 0 0;
    max-width: 52ch;
    font-size: clamp(15.5px, 1.2vw, 18px);
    line-height: 1.6;
    color: var(--lzfn-muted);
}

.lzfn-cta__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 34px;
}

.lzfn-cta__note {
    margin: 18px 0 0;
    font-family: var(--lzfn-mono);
    font-size: 11.5px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

/* ==========================================================================
   2. NETWORK — map + rails
   ========================================================================== */

.lzfn-net {
    background: var(--lzfn-surface);
    border-top: 1px solid var(--lzfn-line);
    padding: clamp(56px, 7vw, 100px) 0 clamp(56px, 7vw, 96px);
}

.lzfn-net__grid {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: clamp(32px, 5vw, 72px);
    align-items: start;
}

.lzfn-net__intro > .lzfn-h2 { max-width: 14ch; }

/* --- statistics strip --- */

.lzfn-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 38px 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--lzfn-line-strong);
}

.lzfn-stats li {
    padding: 20px 18px 4px 0;
    border-bottom: 1px solid var(--lzfn-line);
}

.lzfn-stats li:nth-child(odd) { border-right: 1px solid var(--lzfn-line); }

.lzfn-stats li:nth-child(even) { padding-left: 18px; }

.lzfn-num {
    display: block;
    font-size: clamp(28px, 3.2vw, 44px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.03em;
    font-variant-numeric: tabular-nums;
    color: var(--lzfn-ink);
}

.lzfn-stats span {
    display: block;
    margin-top: 8px;
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

/* --- rails (cities / solutions that drive the map) --- */

.lzfn-rail { margin-top: 36px; }

.lzfn-rail__h {
    margin: 0 0 12px;
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-rail__h + .lzfn-cities { margin-top: 0; }

.lzfn-cities {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 22px;
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--lzfn-line);
}

.lzfn-city {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 46px;
    padding: 10px 2px;
    border: 0;
    border-bottom: 1px solid var(--lzfn-line);
    background: none;
    font-family: inherit;
    font-size: 15px;
    font-weight: 550;
    color: var(--lzfn-ink);
    text-align: left;
    cursor: pointer;
    transition: color .2s, transform .2s var(--lzfn-ease);
}

.lzfn-city__meta {
    font-family: var(--lzfn-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
    white-space: nowrap;
}

.lzfn-city:hover,
.lzfn-city:focus-visible,
.lzfn-city.is-active { color: var(--lzfn-red); transform: translateX(3px); }

.lzfn-city:hover .lzfn-city__meta,
.lzfn-city.is-active .lzfn-city__meta { color: var(--lzfn-red-deep); }

.lzfn-services {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lzfn-service {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 7px 2px;
    font-size: 14.5px;
    color: var(--lzfn-ink);
    transition: color .2s, transform .2s var(--lzfn-ease);
}

.lzfn-service::before {
    content: "";
    width: 5px;
    height: 5px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--lzfn-line-strong);
    transition: background-color .2s, transform .2s var(--lzfn-ease);
}

.lzfn-service:hover,
.lzfn-service:focus-visible,
.lzfn-service.is-active { color: var(--lzfn-red); transform: translateX(3px); }

.lzfn-service:hover::before,
.lzfn-service.is-active::before { background: var(--lzfn-red); transform: scale(1.35); }

.lzfn-net__hint {
    margin: 26px 0 0;
    max-width: 46ch;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--lzfn-muted);
}

/* --- the map --- */

.lzfn-net__map { position: relative; }

.lzfn-map {
    position: relative;
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    aspect-ratio: 620 / 700;
}

.lzfn-map__svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
}

.lzfn-map__inner {
    transform: translate3d(var(--mx, 0px), var(--my, 0px), 0);
    transition: transform .5s var(--lzfn-ease);
    will-change: transform;
}

/* land */

.lzfn-land {
    fill: var(--lzfn-paper);
    stroke: rgba(23, 23, 26, .58);
    stroke-width: 1.05;
    stroke-linejoin: round;
}

.lzfn-map__grid line { stroke: var(--lzfn-line); stroke-width: .6; }

/* lanes — trunk movements between hubs */

.lzfn-lane {
    fill: none;
    stroke: #C9C9CE;
    stroke-width: 1.1;
    stroke-linecap: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    transition: stroke .35s, stroke-width .35s, opacity .35s;
}

.lzfn-map.is-in .lzfn-lane {
    animation: lzfn-draw .9s var(--lzfn-ease) forwards;
    animation-delay: calc(var(--i, 0) * 45ms + 220ms);
}

@keyframes lzfn-draw { to { stroke-dashoffset: 0; } }

.lzfn-lane.is-hot { stroke: var(--lzfn-red); stroke-width: 1.5; opacity: 1; }

.lzfn-map__lanes.is-dim .lzfn-lane:not(.is-hot) { opacity: .32; }

/* secondary network dots */

.lzfn-dot {
    fill: #C4C4CA;
    transition: fill .3s, transform .3s var(--lzfn-ease);
}

/* primary markers */

.lzfn-pin { cursor: pointer; }

.lzfn-pin__hit { fill: transparent; }

.lzfn-pin__halo {
    fill: none;
    stroke: var(--lzfn-red);
    stroke-width: 1;
    opacity: 0;
    transform: scale(.5);
    transform-origin: center;
    transform-box: fill-box;
    transition: opacity .3s, transform .3s var(--lzfn-ease);
}

.lzfn-pin__dot {
    fill: var(--lzfn-red);
    stroke: var(--lzfn-paper);
    stroke-width: 2.2;
    transform-box: fill-box;
    transform-origin: center;
    transition: transform .3s var(--lzfn-ease), fill .3s;
}

.lzfn-pin__label {
    font-family: var(--lzfn-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    fill: var(--lzfn-muted);
    transition: fill .3s;
    pointer-events: none;
}

.lzfn-pin__label-shadow {
    font-family: var(--lzfn-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    fill: var(--lzfn-paper);
    stroke: var(--lzfn-paper);
    stroke-width: 4;
    paint-order: stroke;
    pointer-events: none;
}

.lzfn-pin.is-hot .lzfn-pin__dot { transform: scale(1.5); }
.lzfn-pin.is-hot .lzfn-pin__halo { opacity: .55; transform: scale(1); animation: lzfn-pulse 2.4s ease-out infinite; }
.lzfn-pin.is-hot .lzfn-pin__label { fill: var(--lzfn-red-deep); }
.lzfn-pin.is-hot .lzfn-pin__label-shadow { font-weight: 700; }

@keyframes lzfn-pulse {
    0%   { opacity: .5; transform: scale(.85); }
    70%  { opacity: 0;  transform: scale(2.1); }
    100% { opacity: 0;  transform: scale(2.1); }
}

/* entrance */

.lzfn-land { opacity: 0; transform: scale(.96); transform-origin: center; transform-box: fill-box; }
.lzfn-map.is-in .lzfn-land { animation: lzfn-land-in 1s var(--lzfn-ease) forwards; }

@keyframes lzfn-land-in {
    to { opacity: 1; transform: scale(1); }
}

.lzfn-pin__dot,
.lzfn-dot,
.lzfn-pin__label,
.lzfn-pin__label-shadow { opacity: 0; }

.lzfn-map.is-in .lzfn-pin__dot { animation: lzfn-fade-in .5s var(--lzfn-ease) forwards; animation-delay: calc(var(--i, 0) * 70ms + 380ms); }
.lzfn-map.is-in .lzfn-dot { animation: lzfn-fade-in .6s var(--lzfn-ease) forwards; animation-delay: calc(var(--i, 0) * 12ms + 420ms); }
.lzfn-map.is-in .lzfn-pin__label,
.lzfn-map.is-in .lzfn-pin__label-shadow { animation: lzfn-fade-in .6s var(--lzfn-ease) forwards; animation-delay: calc(var(--i, 0) * 70ms + 640ms); }

@keyframes lzfn-fade-in { to { opacity: 1; } }

/* no-JS: everything visible */

.lzfn:not(.lzfn--js) .lzfn-land,
.lzfn:not(.lzfn--js) .lzfn-pin__dot,
.lzfn:not(.lzfn--js) .lzfn-dot,
.lzfn:not(.lzfn--js) .lzfn-pin__label,
.lzfn:not(.lzfn--js) .lzfn-pin__label-shadow,
.lzfn:not(.lzfn--js) .lzfn-lane { opacity: 1; transform: none; stroke-dashoffset: 0; animation: none; }

/* --- cards --- */

.lzfn-card {
    position: absolute;
    top: calc(var(--cy, 50) * 1%);
    left: calc(var(--cx, 50) * 1%);
    z-index: 4;
    width: 288px;
    padding: 20px 22px 18px;
    background: var(--lzfn-paper);
    border: 1px solid var(--lzfn-line-strong);
    border-radius: 20px;
    box-shadow: 0 18px 44px rgba(23, 23, 26, .10);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .24s var(--lzfn-ease), transform .24s var(--lzfn-ease), visibility .24s;
}

.lzfn-card--right { transform: translate(18px, -50%) scale(.98); }
.lzfn-card--left  { transform: translate(calc(-100% - 18px), -50%) scale(.98); }
.lzfn-card--top   { transform: translate(-50%, calc(-100% - 18px)) scale(.98); }

.lzfn-card.is-on {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.lzfn-card--right.is-on { transform: translate(18px, -50%) scale(1); }
.lzfn-card--left.is-on  { transform: translate(calc(-100% - 18px), -50%) scale(1); }
.lzfn-card--top.is-on   { transform: translate(-50%, calc(-100% - 18px)) scale(1); }

.lzfn-card__eyebrow {
    margin: 0 0 6px;
    font-family: var(--lzfn-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lzfn-red);
}

.lzfn-card__h {
    margin: 0;
    font-size: 21px;
    font-weight: 750;
    letter-spacing: -.02em;
    line-height: 1.15;
}

.lzfn-card__meta,
.lzfn-card__note {
    margin: 10px 0 0;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--lzfn-muted);
}

.lzfn-card__list a { color: inherit; text-decoration: none; }
.lzfn-card__list a:hover { color: var(--lzfn-red); }

/* an inline, link-styled button (opens the enquiry modal) */
.lzfn-linkbtn {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--lzfn-red);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.lzfn-linkbtn:hover { color: var(--lzfn-red-deep); }

.lzfn-card__list {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.lzfn-card__list li {
    padding: 6px 12px;
    border: 1px solid var(--lzfn-line);
    border-radius: 999px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--lzfn-ink);
    background: var(--lzfn-surface);
}

.lzfn-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 16px;
    font-size: 14px;
    font-weight: 650;
    color: var(--lzfn-red);
}

.lzfn-card__cta svg { transition: transform .22s var(--lzfn-ease); }
.lzfn-card__cta:hover svg { transform: translateX(3px); }

/* --- map footer bits: legend + text equivalent --- */

.lzfn-map__legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 22px;
    margin: 22px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--lzfn-line);
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-map__legend span { display: inline-flex; align-items: center; gap: 8px; }

.lzfn-key {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: var(--lzfn-red);
}

.lzfn-key--grey { background: #C4C4CA; }

.lzfn-key--line {
    width: 16px;
    height: 0;
    border-radius: 0;
    border-top: 1.5px solid #C9C9CE;
}

.lzfn-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* ==========================================================================
   3. E-COMMERCE feature band
   ========================================================================== */

.lzfn-ecom {
    background: var(--lzfn-paper);
    padding: clamp(56px, 7vw, 96px) 0;
    border-top: 1px solid var(--lzfn-line);
}

.lzfn-ecom__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: clamp(28px, 4.5vw, 64px);
    align-items: start;
}

.lzfn-ecom__h { margin-top: 8px; }

.lzfn-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px 5px 8px;
    border: 1px solid var(--lzfn-line-strong);
    border-radius: 999px;
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lzfn-ink);
}

.lzfn-chip::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--lzfn-red);
}

.lzfn-ecom__links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
    margin: 6px 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--lzfn-line-strong);
}

.lzfn-ecom__links a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    padding: 12px 2px;
    border-bottom: 1px solid var(--lzfn-line);
    font-size: 15px;
    font-weight: 550;
    transition: color .2s, transform .2s var(--lzfn-ease);
}

.lzfn-ecom__links a:hover { color: var(--lzfn-red); transform: translateX(3px); }

.lzfn-ecom__links svg { flex: 0 0 auto; color: var(--lzfn-muted); transition: transform .2s var(--lzfn-ease), color .2s; }

.lzfn-ecom__links a:hover svg { color: var(--lzfn-red); transform: translateX(3px); }

.lzfn-ecom__cta { margin-top: 26px; }

/* ==========================================================================
   4. Navigation
   ========================================================================== */

.lzfn-nav {
    background: var(--lzfn-paper);
    border-top: 1px solid var(--lzfn-line);
    padding: clamp(48px, 6vw, 80px) 0 clamp(40px, 5vw, 64px);
}

.lzfn-nav__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(24px, 3vw, 48px);
}

.lzfn-col__h {
    margin: 0 0 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--lzfn-line-strong);
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-col ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.lzfn-col li + li { margin-top: 2px; }

.lzfn-col a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    font-size: 14.5px;
    color: var(--lzfn-ink);
    transition: color .2s, transform .2s var(--lzfn-ease);
}

.lzfn-col a:hover { color: var(--lzfn-red); transform: translateX(3px); }

.lzfn-col a.lzfn-more {
    margin-top: 10px;
    font-weight: 650;
    color: var(--lzfn-red);
    font-size: 14px;
}

/* mobile: the same list, disclosed by a button (one DOM, no duplicate links) */

.lzfn-col.lzfn-acc__item { border-bottom: 0; }

.lzfn-acc__btn { display: none; }

.lzfn-acc__btn {
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 56px;
    padding: 14px 2px;
    border: 0;
    background: none;
    font-family: var(--lzfn-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lzfn-ink);
    text-align: left;
    cursor: pointer;
}

.lzfn-acc__icon {
    position: relative;
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.lzfn-acc__icon::before,
.lzfn-acc__icon::after {
    content: "";
    position: absolute;
    inset: 50% 0 auto 0;
    height: 1.5px;
    background: var(--lzfn-ink);
    transition: transform .25s var(--lzfn-ease), background-color .25s;
}

.lzfn-acc__icon::after { transform: rotate(90deg); }

.lzfn-acc__btn[aria-expanded="true"] .lzfn-acc__icon::after { transform: rotate(0deg); }
.lzfn-acc__btn[aria-expanded="true"] .lzfn-acc__icon::before,
.lzfn-acc__btn[aria-expanded="true"] .lzfn-acc__icon::after { background: var(--lzfn-red); }

.lzfn-acc__panel { display: block; }

.lzfn-acc__panel > div { overflow: hidden; }

.lzfn-acc__item.is-open .lzfn-acc__panel { grid-template-rows: 1fr; }

.lzfn-acc__panel ul {
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}

/* ==========================================================================
   5. Brand + contact
   ========================================================================== */

.lzfn-brand {
    background: var(--lzfn-surface);
    border-top: 1px solid var(--lzfn-line);
    padding: clamp(52px, 6vw, 88px) 0 0;
}

.lzfn-brand__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: clamp(32px, 5vw, 72px);
    align-items: start;
}

.lzfn-logo {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    text-decoration: none;
}

.lzfn-logo__mark {
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    border-radius: 13px;
    background: var(--lzfn-red);
    display: grid;
    place-items: center;
}

.lzfn-logo__mark svg { width: 26px; height: 26px; }

.lzfn-logo__word {
    display: flex;
    flex-direction: column;
    font-size: 23px;
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.05;
    color: var(--lzfn-ink);
}

.lzfn-logo__word small {
    margin-top: 3px;
    font-family: var(--lzfn-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-heritage {
    margin: 22px 0 0;
    padding: 14px 0 0 18px;
    border-left: 2px solid var(--lzfn-red);
    font-size: 14px;
    line-height: 1.55;
    color: var(--lzfn-ink);
    max-width: 40ch;
}

.lzfn-statement {
    margin: 18px 0 0;
    max-width: 46ch;
    font-size: 15px;
    line-height: 1.65;
    color: var(--lzfn-muted);
}

.lzfn-social {
    display: flex;
    gap: 8px;
    margin-top: 26px;
}

.lzfn-social a {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--lzfn-line-strong);
    border-radius: 50%;
    background: var(--lzfn-paper);
    color: var(--lzfn-ink);
    transition: transform .22s var(--lzfn-ease), border-color .22s, color .22s;
}

.lzfn-social a:hover {
    transform: translateY(-3px);
    border-color: var(--lzfn-red);
    color: var(--lzfn-red);
}

/* contact */

.lzfn-contact {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--lzfn-line-strong);
}

.lzfn-contact li {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 14px;
    padding: 15px 0;
    border-bottom: 1px solid var(--lzfn-line);
    align-items: baseline;
}

.lzfn-contact dt,
.lzfn-contact__k {
    font-family: var(--lzfn-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
}

.lzfn-contact a {
    font-size: 15.5px;
    font-weight: 550;
    color: var(--lzfn-ink);
    transition: color .2s;
}

.lzfn-contact a:hover { color: var(--lzfn-red); }

.lzfn-contact p { margin: 0; font-size: 14.5px; line-height: 1.55; }

.lzfn-brand__btns {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 26px;
}

/* trust row */

.lzfn-trust {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: clamp(44px, 5vw, 68px) 0 0;
    padding: 26px 0;
    border-top: 1px solid var(--lzfn-line-strong);
    border-bottom: 1px solid var(--lzfn-line);
    list-style: none;
}

.lzfn-trust li {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-right: 24px;
}

.lzfn-trust li + li {
    padding-left: 24px;
    border-left: 1px solid var(--lzfn-line);
}

.lzfn-trust svg { color: var(--lzfn-red); }

.lzfn-trust b {
    font-size: 14.5px;
    font-weight: 650;
    letter-spacing: -.01em;
}

.lzfn-trust span {
    font-size: 13px;
    line-height: 1.5;
    color: var(--lzfn-muted);
}

/* ==========================================================================
   6. Legal + micro footer
   ========================================================================== */

.lzfn-legal {
    background: var(--lzfn-surface);
    padding: 0 0 clamp(28px, 3vw, 40px);
}

.lzfn-legal__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 28px;
    padding-top: 26px;
}

.lzfn-legal__links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lzfn-legal__links a {
    font-size: 12.5px;
    color: var(--lzfn-muted);
    transition: color .2s;
}

.lzfn-legal__links a:hover { color: var(--lzfn-red); }

.lzfn-copy {
    margin: 0;
    font-size: 12.5px;
    color: var(--lzfn-muted);
}

.lzfn-micro {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--lzfn-line);
    font-family: var(--lzfn-mono);
    font-size: 10.5px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--lzfn-muted);
    text-align: center;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1100px) {
    .lzfn-net__grid,
    .lzfn-ecom__grid,
    .lzfn-brand__grid { grid-template-columns: minmax(0, 1fr); }

    .lzfn-net__map { order: -1; }

    /* the four columns become disclosure rows */
    .lzfn-nav__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }

    .lzfn-col__h { display: none; }

    .lzfn-col.lzfn-acc__item { border-bottom: 1px solid var(--lzfn-line); }

    .lzfn-acc__btn { display: flex; }

    .lzfn-acc__panel {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows .32s var(--lzfn-ease);
    }

    .lzfn-acc__panel a { min-height: 44px; font-size: 15px; }

    .lzfn-acc__panel ul { padding-bottom: 12px; }

    /* touch: rows and map labels grow for thumbs and small screens */
    .lzfn-service { min-height: 44px; font-size: 15px; }

    .lzfn-city { min-height: 52px; }

    .lzfn-pin__label,
    .lzfn-pin__label-shadow { font-size: 17px; }

    .lzfn-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .lzfn-trust li { padding: 16px 0; }

    .lzfn-trust li + li { padding-left: 0; border-left: 0; }

    .lzfn-trust li:nth-child(even) { padding-left: 20px; border-left: 1px solid var(--lzfn-line); }

    .lzfn-trust li:nth-child(n+3) { border-top: 1px solid var(--lzfn-line); }
}

@media (max-width: 900px) {
    /* the floating card becomes a bottom sheet inside the map block */
    .lzfn-card,
    .lzfn-card--right,
    .lzfn-card--left,
    .lzfn-card--top {
        left: 10px;
        right: 10px;
        top: auto;
        bottom: 10px;
        width: auto;
        transform: translateY(8px) scale(.98);
    }

    .lzfn-card.is-on,
    .lzfn-card--right.is-on,
    .lzfn-card--left.is-on,
    .lzfn-card--top.is-on { transform: translateY(0) scale(1); }

    .lzfn-map { max-width: 460px; }
}

@media (max-width: 640px) {
    .lzfn { --lzfn-gutter: 16px; }

    .lzfn-cities,
    .lzfn-services,
    .lzfn-ecom__links { grid-template-columns: minmax(0, 1fr); }

    .lzfn-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .lzfn-contact li { grid-template-columns: minmax(0, 1fr); gap: 4px; }

    .lzfn-cta__row .lzfn-btn { flex: 1 1 100%; }

    .lzfn-map { max-width: 380px; }

    /* keep tap targets comfortable on the map */
    .lzfn-pin__hit { r: 22px; }
}

/* --------------------------------------------------------------------------
   Scroll reveal — only ever applied once JS is up (html gets .lzfn--js from
   the script), so a script failure can never leave content hidden.
   -------------------------------------------------------------------------- */

.lzfn--js .lzfn-reveal {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .7s var(--lzfn-ease), transform .7s var(--lzfn-ease);
}

.lzfn--js .lzfn-reveal.is-in {
    opacity: 1;
    transform: none;
}

/* --------------------------------------------------------------------------
   Reduced motion — everything resolves to its finished state
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .lzfn *,
    .lzfn *::before,
    .lzfn *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    /* nothing may depend on an animation or an observer having run */
    .lzfn--js .lzfn-reveal { opacity: 1 !important; transform: none !important; }

    .lzfn-map__inner { transform: none !important; }

    .lzfn-land,
    .lzfn-pin__dot,
    .lzfn-dot,
    .lzfn-pin__label,
    .lzfn-pin__label-shadow { opacity: 1 !important; transform: none !important; }

    .lzfn-lane { stroke-dashoffset: 0 !important; opacity: 1 !important; }
}