﻿:root {
        --bg: #f8f9fa;
        --surface: #ffffff;
        --surface-2: #f1f3f5;
        --line: #d9dee3;
        --line-strong: #b9c1c8;
        --text: #1c2024;
        --muted: #5f6872;
        --muted-2: #87919b;
        --orange: #ff6b00;
        --orange-dark: #c94f00;
        --orange-soft: #fff1e6;
        --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
        --sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
        --radius: 6px;
        --ease: cubic-bezier(0.22, 1, 0.36, 1);
      }

      * {
        box-sizing: border-box;
      }

      html {
        color-scheme: light;
        scroll-behavior: smooth;
      }

      body {
        margin: 0;
        min-width: 320px;
        overflow-x: hidden;
        background:
          linear-gradient(90deg, rgba(28, 32, 36, 0.032) 1px, transparent 1px) 0
            0 / 96px 96px,
          linear-gradient(180deg, rgba(28, 32, 36, 0.028) 1px, transparent 1px)
            0 0 / 96px 96px,
          var(--bg);
        color: var(--text);
        font-family: var(--sans);
      }

      body::before {
        position: fixed;
        inset: 0;
        z-index: -1;
        content: "";
        background:
          linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.92) 0%,
            rgba(248, 249, 250, 0.82) 48%,
            #eef1f4 100%
          ),
          radial-gradient(
            circle at 12% 8%,
            rgba(255, 107, 0, 0.055),
            transparent 28%
          );
        pointer-events: none;
      }

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

      button,
      input,
      select,
      textarea {
        font: inherit;
      }

      button,
      a {
        -webkit-tap-highlight-color: transparent;
      }

      .skip-link {
        position: fixed;
        left: 16px;
        top: 16px;
        z-index: 30;
        transform: translateY(-140%);
        border: 1px solid var(--text);
        background: var(--surface);
        padding: 10px 14px;
        font-weight: 700;
      }

      .skip-link:focus {
        transform: translateY(0);
      }

      .page {
        max-width: 100vw;
        min-height: 100vh;
        overflow-x: hidden;
      }

      .topline {
        position: sticky;
        top: 0;
        z-index: 20;
        border-bottom: 1px solid var(--line);
        background: rgba(248, 249, 250, 0.94);
        backdrop-filter: blur(16px);
      }

      .utility {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 18px;
        width: min(1480px, calc(100% - 40px));
        margin: 0 auto;
        border-bottom: 1px solid var(--line);
        padding: 9px 0;
        color: var(--muted);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
      }

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

      .utility span::before {
        width: 6px;
        height: 6px;
        content: "";
        border: 1px solid var(--orange);
        background: rgba(255, 107, 0, 0.07);
      }

      .nav {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: clamp(18px, 3vw, 42px);
        width: min(1480px, calc(100% - 40px));
        margin: 0 auto;
        min-height: 82px;
      }

      .brand {
        display: inline-flex;
        align-items: center;
        width: clamp(142px, 14vw, 196px);
      }

      .brand img {
        display: block;
        width: 100%;
        height: auto;
      }

      .nav-links {
        display: flex;
        justify-content: center;
        gap: clamp(16px, 2vw, 30px);
        color: #30363d;
        counter-reset: nav;
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .nav-links a {
        position: relative;
        padding: 12px 0;
      }

      .nav-links a::before {
        color: var(--orange);
        content: "0" counter(nav);
        counter-increment: nav;
        margin-right: 7px;
        font-size: 10px;
      }

      .nav-links a::after {
        position: absolute;
        left: 0;
        bottom: 5px;
        width: 100%;
        height: 1px;
        content: "";
        transform: scaleX(0);
        transform-origin: left;
        background: var(--orange);
        transition: transform 180ms var(--ease);
      }

      .nav-links a:hover::after,
      .nav-links a:focus-visible::after {
        transform: scaleX(1);
      }

      .emergency {
        display: grid;
        min-width: 240px;
        border-left: 1px solid var(--line);
        padding-left: clamp(16px, 2vw, 28px);
        justify-items: end;
        gap: 3px;
        white-space: nowrap;
      }

      .emergency span {
        color: var(--muted);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .emergency-phone {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--orange);
        transition: color 180ms var(--ease);
      }

      .emergency-phone:hover,
      .emergency-phone:focus-visible {
        color: var(--orange-dark);
      }

      .emergency-phone svg,
      .emergency-phone svg path {
        flex: 0 0 auto;
        stroke: currentColor;
        stroke-width: 1.8;
        fill: none;
        stroke-linecap: round;
        stroke-linejoin: round;
      }

      .emergency-phone strong {
        color: inherit;
        font-family: var(--mono);
        font-size: clamp(16px, 1.3vw, 22px);
        font-weight: 700;
      }

      .nav-phone {
        display: none;
      }

      .mobile-toggle {
        display: none;
        width: 44px;
        height: 44px;
        border: 1px solid var(--line-strong);
        border-radius: var(--radius);
        background: var(--surface);
        color: var(--text);
        cursor: pointer;
      }

      .floating-toggle {
        display: none;
      }

      .mobile-panel {
        display: none;
      }

      main {
        display: grid;
        gap: clamp(58px, 8vw, 112px);
      }

      .hero,
      .section,
      .footer-inner {
        width: min(1480px, calc(100% - 40px));
        margin: 0 auto;
      }

      .hero {
        padding: clamp(28px, 4vw, 54px) 0 0;
      }

      .hero-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.02fr) minmax(430px, 0.98fr);
        gap: clamp(32px, 5vw, 78px);
        align-items: start;
      }

      .hero-after {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
        align-items: start;
        margin-top: clamp(20px, 3vw, 32px);
      }

      .hero-after-left {
        display: none;
      }

      .hero-after .service-strip {
        width: 100%;
        margin-top: 0;
      }

      .copy .audit-promo {
        grid-template-columns: minmax(230px, 0.72fr) minmax(260px, 1fr);
        gap: clamp(14px, 1.4vw, 22px);
        width: min(700px, 100%);
        margin-top: 18px;
        padding: 14px 16px;
      }

      .copy .audit-promo h2 {
        max-width: 21ch;
        font-size: clamp(18px, 1.12vw, 20px);
      }

      .copy .audit-promo-detail {
        gap: 8px;
        padding-top: 6px;
      }

      .copy .audit-promo p {
        max-width: 31ch;
        font-size: 13px;
        line-height: 1.38;
      }

      .copy .audit-promo-action {
        min-height: 42px;
        padding-inline: 14px;
      }

      .copy,
      .section-head {
        position: relative;
        padding-left: clamp(18px, 2vw, 34px);
      }

      .copy::before,
      .section-head::before {
        position: absolute;
        left: 0;
        top: 2px;
        width: 1px;
        height: calc(100% - 8px);
        content: "";
        background: var(--line-strong);
      }

      .section-tag {
        display: inline-grid;
        grid-template-columns: auto auto;
        align-items: center;
        gap: 10px;
        margin-bottom: 20px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .section-tag::before {
        display: grid;
        place-items: center;
        width: 34px;
        height: 24px;
        content: attr(data-index);
        border: 1px solid var(--orange);
        color: var(--orange);
      }

      h1,
      h2,
      h3,
      p {
        margin-top: 0;
      }

      h1 {
        max-width: 820px;
        margin-bottom: 0;
        color: var(--text);
        font-size: clamp(38px, 4.45vw, 70px);
        font-weight: 700;
        line-height: 1;
        letter-spacing: 0;
        text-transform: uppercase;
      }

      h2 {
        max-width: 840px;
        margin-bottom: 0;
        font-size: clamp(34px, 4vw, 58px);
        line-height: 1;
        letter-spacing: 0;
        text-transform: uppercase;
      }

      h3 {
        margin-bottom: 12px;
        font-size: 18px;
        line-height: 1.2;
      }

      .subtitle,
      .section-lede {
        max-width: 720px;
        margin: 24px 0 0;
        color: var(--muted);
        font-size: clamp(17px, 1.22vw, 20px);
        line-height: 1.55;
      }

      .actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 32px;
      }

      .hero-inline-cta {
        float: right;
        min-width: 232px;
        margin: 10px 0 16px clamp(28px, 3vw, 44px);
        line-height: 1;
      }

      .subtitle::after {
        display: block;
        clear: both;
        content: "";
      }

      .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 54px;
        border-radius: var(--radius);
        padding: 0 20px;
        font-size: 15px;
        font-weight: 700;
        white-space: nowrap;
        transition:
          transform 180ms var(--ease),
          background 180ms var(--ease),
          border-color 180ms var(--ease);
      }

      .btn-primary {
        border: 1px solid var(--orange);
        background: var(--orange);
        color: #ffffff;
      }

      .btn-primary:hover,
      .btn-primary:focus-visible {
        transform: translateY(-1px);
        background: var(--orange-dark);
        border-color: var(--orange-dark);
      }

      .btn-secondary {
        border: 1px solid var(--line-strong);
        background: rgba(255, 255, 255, 0.84);
        color: var(--text);
      }

      .btn-secondary::before {
        color: var(--orange);
        content: "↳";
        margin-right: 10px;
      }

      .btn-secondary:hover,
      .btn-secondary:focus-visible {
        transform: translateY(-1px);
        border-color: var(--orange-dark);
        background: rgba(255, 107, 0, 0.07);
      }

      .audit-promo {
        position: relative;
        display: grid;
        grid-template-columns: minmax(220px, 0.86fr) minmax(280px, 1fr);
        align-items: start;
        gap: clamp(18px, 2.8vw, 34px);
        width: min(760px, 100%);
        margin-top: 22px;
        border: 1px solid var(--line-strong);
        border-left: 3px solid var(--orange);
        border-radius: var(--radius);
        background:
          linear-gradient(90deg, rgba(255, 107, 0, 0.075), transparent 36%),
          rgba(255, 255, 255, 0.9);
        padding: clamp(16px, 1.8vw, 20px);
        box-shadow: 0 14px 28px rgba(25, 31, 38, 0.055);
      }

      .audit-promo::before {
        position: absolute;
        right: 12px;
        top: 10px;
        color: var(--muted-2);
        content: "CHECK/00";
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 700;
      }

      .audit-promo-kicker,
      .service-card-badge {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .audit-promo-kicker {
        margin-bottom: 10px;
      }

      .audit-promo h2 {
        max-width: 17ch;
        margin-bottom: 0;
        font-size: clamp(20px, 1.65vw, 26px);
        line-height: 1.08;
        text-transform: uppercase;
      }

      .audit-promo-detail {
        display: grid;
        align-content: start;
        justify-items: start;
        gap: 14px;
        min-width: 0;
        padding-top: 28px;
      }

      .audit-promo p {
        max-width: 42ch;
        margin: 0;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.48;
      }

      .audit-promo-action {
        min-height: 46px;
        padding-inline: 18px;
      }


      .service-strip {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: min(690px, 100%);
        margin-top: 36px;
        border: 1px solid var(--line-strong);
        background: rgba(255, 255, 255, 0.68);
      }

      .service-strip div,
      .panel,
      .process-step,
      .faq-item {
        position: relative;
        border-right: 1px solid var(--line);
        background: rgba(255, 255, 255, 0.82);
      }

      .service-strip div {
        min-height: 96px;
        padding: 18px 18px 18px 20px;
      }

      .service-strip div:last-child {
        border-right: 0;
      }

      .service-strip div::before,
      .panel::before,
      .process-step::before,
      .faq-item::before {
        position: absolute;
        right: 12px;
        top: 10px;
        color: var(--muted-2);
        content: attr(data-code);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 700;
      }

      .service-strip b,
      .panel-kicker,
      .step-index {
        display: block;
        margin-bottom: 9px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .service-strip span,
      .panel p,
      .process-step p,
      .faq-item p {
        color: var(--muted);
        font-size: 15px;
        line-height: 1.5;
      }

      .visual {
        position: relative;
        min-height: 590px;
      }

      .visual::before,
      .visual::after {
        position: absolute;
        z-index: 2;
        width: 78px;
        height: 78px;
        content: "";
        pointer-events: none;
      }

      .visual::before {
        left: -14px;
        top: -14px;
        border-left: 2px solid var(--orange);
        border-top: 2px solid var(--orange);
      }

      .visual::after {
        right: -14px;
        bottom: -14px;
        border-right: 2px solid var(--orange);
        border-bottom: 2px solid var(--orange);
      }

      .photo-frame {
        position: relative;
        min-height: clamp(430px, 43vw, 610px);
        margin: 0;
        overflow: hidden;
        border: 1px solid var(--line-strong);
        border-radius: var(--radius);
        background: var(--surface-2);
      }

      .photo-frame img {
        display: block;
        width: 100%;
        height: 100%;
        min-height: clamp(430px, 43vw, 610px);
        object-fit: cover;
        object-position: 50% center;
        filter: saturate(0.78) contrast(0.96) brightness(1.12);
      }

      .photo-frame::before {
        position: absolute;
        inset: 0;
        z-index: 1;
        content: "";
        background:
          linear-gradient(
            90deg,
            rgba(248, 249, 250, 0.46),
            rgba(248, 249, 250, 0.14) 36%,
            transparent 68%
          ),
          linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 58%);
        pointer-events: none;
      }

      .photo-frame::after {
        position: absolute;
        inset: 0;
        z-index: 2;
        content: "";
        background:
          linear-gradient(90deg, rgba(248, 249, 250, 0.34), transparent 38%),
          linear-gradient(180deg, transparent 54%, rgba(28, 32, 36, 0.16));
        pointer-events: none;
      }

      .photo-label {
        position: absolute;
        z-index: 3;
        top: 16px;
        left: 16px;
        border: 1px solid rgba(255, 255, 255, 0.62);
        background: rgba(255, 255, 255, 0.86);
        padding: 8px 10px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        backdrop-filter: blur(14px);
      }

      .photo-label strong {
        color: var(--orange);
      }

      .status-card {
        position: absolute;
        z-index: 4;
        left: -20px;
        bottom: 34px;
        width: min(336px, calc(100% - 36px));
        border: 1px solid var(--line-strong);
        border-radius: var(--radius);
        background: rgba(255, 255, 255, 0.94);
        backdrop-filter: blur(18px);
      }

      .status-card header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--line);
        padding: 14px 15px;
      }

      .status-card header span {
        color: var(--muted);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .live-dot {
        width: 9px;
        height: 9px;
        border: 1px solid var(--orange);
        background: var(--orange);
        box-shadow: 0 0 0 5px rgba(255, 107, 0, 0.12);
      }

      .status-card .rows {
        display: grid;
        gap: 12px;
        padding: 15px;
      }

      .row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        color: var(--muted);
        font-size: 13px;
      }

      .row strong {
        color: var(--text);
        font-family: var(--mono);
        font-size: 13px;
      }

      .progress {
        height: 5px;
        overflow: hidden;
        background: var(--surface-2);
      }

      .progress span {
        display: block;
        width: 86%;
        height: 100%;
        background: var(--orange);
      }

      .spec-rail {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1px;
        margin-top: 12px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .spec-rail span {
        display: grid;
        gap: 5px;
        background: rgba(255, 255, 255, 0.78);
        padding: 11px 12px;
        color: var(--muted);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .spec-rail b {
        color: var(--text);
        font-size: 12px;
      }

      .trust {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1px;
        margin-top: clamp(24px, 3vw, 38px);
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .metric {
        display: grid;
        grid-template-columns: 40px 1fr;
        align-items: center;
        gap: 15px;
        min-height: 108px;
        padding: clamp(16px, 1.8vw, 23px);
        background: rgba(255, 255, 255, 0.84);
      }

      .metric-icon {
        display: grid;
        place-items: center;
        width: 40px;
        height: 40px;
        border: 1px solid rgba(255, 107, 0, 0.48);
        border-radius: var(--radius);
        background: rgba(255, 107, 0, 0.07);
        color: var(--orange-dark);
      }

      .metric-icon svg {
        width: 21px;
        height: 21px;
        stroke: currentColor;
        stroke-width: 1.8;
        fill: none;
        stroke-linecap: round;
        stroke-linejoin: round;
      }

      .metric strong {
        display: block;
        color: var(--orange);
        font-family: var(--mono);
        font-size: clamp(22px, 2vw, 32px);
        font-weight: 700;
        line-height: 1;
      }

      .metric span {
        display: block;
        margin-top: 7px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .section {
        scroll-margin-top: 128px;
      }

      .section-grid {
        display: grid;
        grid-template-columns: minmax(280px, 0.65fr) minmax(0, 1fr);
        gap: clamp(28px, 5vw, 74px);
        align-items: start;
      }

      .section-grid + .values-grid {
        margin-top: clamp(20px, 3vw, 34px);
      }

      .section > .section-head + * {
        margin-top: clamp(20px, 3vw, 34px);
      }

      .panel-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        border: 1px solid var(--line-strong);
        background: var(--line);
        gap: 1px;
      }

      .services-intro {
        display: grid;
        grid-template-columns: minmax(280px, 0.65fr) minmax(0, 1fr);
        gap: clamp(28px, 5vw, 74px);
        align-items: start;
        margin-bottom: clamp(20px, 3vw, 34px);
      }

      .services-lede {
        max-width: none;
        margin-top: 0;
        padding-top: clamp(44px, 5vw, 58px);
      }

      .services-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .service-card {
        position: relative;
        display: flex;
        background: rgba(255, 255, 255, 0.84);
      }

      .service-card::before {
        position: absolute;
        right: 12px;
        top: 10px;
        z-index: 1;
        color: var(--muted-2);
        content: attr(data-code);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 400;
        pointer-events: none;
      }

      .service-card-link {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        width: 100%;
        height: 100%;
        min-height: 152px;
        border: 0;
        background: transparent;
        padding: 22px 24px 24px;
        text-align: left;
        text-decoration: none;
        color: inherit;
        cursor: pointer;
        transition:
          background 180ms var(--ease),
          box-shadow 180ms var(--ease);
      }

      .service-card-icon {
        position: absolute;
        right: 18px;
        bottom: 16px;
        z-index: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 92px;
        height: 92px;
        margin: 0;
        border: 0;
        background: transparent;
        color: rgba(255, 107, 0, 0.12);
        pointer-events: none;
        transition:
          color 180ms var(--ease),
          transform 180ms var(--ease);
      }

      .service-card-icon svg {
        display: block;
        flex-shrink: 0;
        width: 100%;
        height: 100%;
        stroke-width: 1.25;
      }

      .service-card-link:hover .service-card-icon,
      .service-card-link:focus-visible .service-card-icon {
        color: rgba(255, 107, 0, 0.18);
        transform: translate(-2px, -2px) scale(1.03);
      }

      .service-card-media {
        display: block;
        width: calc(100% + 48px);
        margin: -24px -24px 18px;
        overflow: hidden;
        border-bottom: 1px solid var(--line);
        background: #eef1f4;
      }

      .service-card-media img {
        display: block;
        width: 100%;
        aspect-ratio: 16 / 10;
        object-fit: cover;
      }

      .service-card-link:hover .service-card-media img,
      .service-card-link:focus-visible .service-card-media img {
        transform: scale(1.03);
        transition: transform 240ms var(--ease);
      }

      .service-card-link:hover,
      .service-card-link:focus-visible {
        background: rgba(255, 107, 0, 0.035);
        outline: none;
        box-shadow: inset 0 0 0 1px rgba(255, 107, 0, 0.28);
      }

      .service-card-badge {
        position: relative;
        z-index: 1;
        margin: 0 0 12px;
        border: 1px solid rgba(255, 107, 0, 0.48);
        background: rgba(255, 107, 0, 0.08);
        padding: 6px 8px;
      }

      .service-card-link .panel-kicker {
        position: relative;
        z-index: 1;
        display: block;
        margin-bottom: 9px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .service-card-link h3 {
        position: relative;
        z-index: 1;
        margin-bottom: 0;
        padding-right: 82px;
        font-size: clamp(18px, 1.45vw, 22px);
        font-weight: 500;
        line-height: 1.28;
      }

      .service-card-summary,
      .service-card-more {
        display: none;
      }

      .service-card-detail {
        display: none;
      }

      .service-modal {
        position: fixed;
        inset: 0;
        width: min(560px, calc(100vw - 40px));
        max-height: calc(100vh - 40px);
        margin: auto;
        border: 1px solid var(--line-strong);
        border-top: 3px solid var(--orange);
        padding: clamp(24px, 3vw, 36px);
        background: rgba(255, 255, 255, 0.98);
        color: var(--text);
        overflow: auto;
      }

      .service-modal::backdrop {
        background: rgba(18, 18, 18, 0.52);
      }

      .service-modal-close {
        position: absolute;
        right: 14px;
        top: 12px;
        display: grid;
        place-items: center;
        width: 36px;
        height: 36px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: var(--surface);
        color: var(--muted);
        font-size: 22px;
        line-height: 1;
        cursor: pointer;
        transition:
          border-color 180ms var(--ease),
          color 180ms var(--ease);
      }

      .service-modal-close:hover,
      .service-modal-close:focus-visible {
        border-color: var(--orange);
        color: var(--orange-dark);
        outline: none;
      }

      .service-modal-code {
        display: block;
        margin-bottom: 8px;
        color: var(--muted-2);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 400;
      }

      .service-modal .panel-kicker {
        display: block;
        margin-bottom: 9px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 13px;
        font-weight: 400;
        text-transform: uppercase;
      }

      .service-modal h3 {
        margin-bottom: 18px;
        padding-right: 36px;
        font-size: 18px;
        line-height: 1.2;
      }

      .service-modal-body p {
        margin: 0 0 18px;
        color: var(--muted);
        font-size: 15px;
        line-height: 1.6;
      }

      .service-modal-body ul {
        display: grid;
        gap: 10px;
        margin: 0;
        padding: 0;
        list-style: none;
      }

      .service-modal-body li {
        position: relative;
        padding-left: 18px;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.4;
      }

      .service-modal-body li::before {
        position: absolute;
        left: 0;
        top: 0.55em;
        width: 7px;
        height: 1px;
        content: "";
        background: var(--orange);
      }

      .service-modal-footer {
        margin-top: 24px;
        padding-top: 20px;
        border-top: 1px solid var(--line);
      }

      .narrative-grid,
      .values-grid,
      .benefit-grid,
      .guarantee-grid {
        display: grid;
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

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

      .values-grid,
      .benefit-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }

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

      .text-panel,
      .value-card,
      .benefit-card,
      .guarantee-card {
        position: relative;
        background: rgba(255, 255, 255, 0.84);
        padding: clamp(26px, 2.6vw, 36px) clamp(20px, 2vw, 30px)
          clamp(20px, 2vw, 30px);
      }

      .text-panel::before,
      .value-card::before,
      .benefit-card::before,
      .guarantee-card::before {
        position: absolute;
        right: 12px;
        top: 14px;
        color: var(--muted-2);
        content: attr(data-code);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 700;
      }

      .text-panel p,
      .value-card p,
      .benefit-card p,
      .guarantee-card p {
        color: var(--muted);
        font-size: 15px;
        line-height: 1.6;
      }

      .text-panel p + p {
        margin-top: 14px;
      }

      .source-list {
        display: grid;
        gap: 11px;
        margin: 18px 0 0;
        padding: 0;
        list-style: none;
      }

      .source-list li {
        position: relative;
        padding-left: 22px;
        color: var(--muted);
        font-size: 15px;
        line-height: 1.45;
      }

      .source-list li::before {
        position: absolute;
        left: 0;
        top: 0.52em;
        width: 7px;
        height: 7px;
        content: "";
        border: 1px solid var(--orange);
        background: rgba(255, 107, 0, 0.07);
      }

      .benefit-card h3,
      .guarantee-card h3,
      .value-card h3,
      .text-panel h3 {
        padding-right: 50px;
      }
      .capability-list {
        display: grid;
        grid-column: 2;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px;
        margin-top: 1px;
        border: 1px solid var(--line-strong);
        border-top: 0;
        background: var(--line);
      }

      .capability-list span {
        display: flex;
        align-items: center;
        min-height: 58px;
        background: rgba(255, 255, 255, 0.86);
        padding: 14px 18px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .capability-list span::before {
        width: 7px;
        height: 7px;
        margin-right: 12px;
        content: "";
        border: 1px solid var(--orange);
        background: rgba(255, 107, 0, 0.07);
      }

      .panel,
      .process-step,
      .faq-item {
        min-height: 220px;
        border-right: 0;
        padding: 22px 24px 24px;
      }

      .panel ul,
      .compliance-list {
        display: grid;
        gap: 10px;
        margin: 18px 0 0;
        padding: 0;
        list-style: none;
      }

      .panel li,
      .compliance-list li {
        position: relative;
        padding-left: 18px;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.4;
      }

      .panel li::before,
      .compliance-list li::before {
        position: absolute;
        left: 0;
        top: 0.55em;
        width: 7px;
        height: 1px;
        content: "";
        background: var(--orange);
      }

      .object-map {
        display: grid;
        grid-template-columns: minmax(240px, 0.82fr) minmax(0, 1fr);
        grid-template-rows: 384px;
        gap: 1px;
        width: 100%;
        min-width: 0;
        height: 384px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .object-list,
      .object-detail {
        min-width: 0;
        background: var(--surface);
      }

      .object-list {
        display: grid;
        grid-template-rows: repeat(6, 1fr);
        min-height: 0;
      }

      .object-list button {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-width: 0;
        min-height: 0;
        height: 100%;
        border: 0;
        border-bottom: 1px solid var(--line);
        background: transparent;
        padding: 0 20px;
        color: var(--text);
        cursor: pointer;
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-align: left;
        text-transform: uppercase;
      }

      .object-list button:last-child {
        border-bottom: 0;
      }

      .object-list button[aria-selected="true"] {
        background: rgba(255, 107, 0, 0.07);
        color: var(--orange-dark);
      }

      .object-detail {
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 0;
        height: 100%;
        padding: clamp(24px, 3vw, 40px);
        overflow: hidden;
      }

      .object-detail .panel-kicker {
        flex-shrink: 0;
        color: var(--orange-dark);
      }

      .object-detail h3 {
        flex-shrink: 0;
        min-height: 4.5em;
        font-size: clamp(28px, 3vw, 44px);
        line-height: 1;
        text-transform: uppercase;
      }

      .object-detail p {
        flex: 1;
        margin: 0;
        color: var(--muted);
        font-size: 17px;
        line-height: 1.55;
      }

      .process-grid {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .process-step {
        min-height: 250px;
      }

      .process-step::after {
        position: absolute;
        right: -8px;
        top: 50%;
        z-index: 2;
        width: 15px;
        height: 15px;
        content: "";
        border-right: 2px solid var(--orange);
        border-top: 2px solid var(--orange);
        opacity: 0.72;
        pointer-events: none;
        transform: translateY(-50%) rotate(45deg);
      }

      .process-step:last-child::after {
        display: none;
      }

      .step-index {
        color: var(--orange-dark);
      }

      .compliance {
        display: grid;
        grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.55fr);
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .compliance-card,
      .proof-card {
        background: rgba(255, 255, 255, 0.86);
        padding: clamp(24px, 3vw, 40px);
      }

      .compliance-card h3,
      .proof-card h3 {
        max-width: 720px;
        font-size: clamp(30px, 3vw, 48px);
        line-height: 1;
        text-transform: uppercase;
      }

      .certificate-stack {
        display: grid;
        gap: 1px;
        background: var(--line);
      }

      .certificate-stack span {
        display: grid;
        gap: 6px;
        min-height: 92px;
        background: var(--surface);
        padding: 18px;
        color: var(--muted);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .certificate-stack b {
        color: var(--orange-dark);
        font-size: 28px;
      }

      .proof-grid {
        display: grid;
        grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr);
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .project-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: clamp(12px, 1.2vw, 16px);
        width: 100%;
      }

      .project-card {
        position: relative;
        display: grid;
        align-content: start;
        grid-template-rows: auto auto;
        width: 100%;
        min-width: 0;
        margin: 0;
        overflow: hidden;
        border: 1px solid var(--line-strong);
        background: rgba(255, 255, 255, 0.84);
      }

      .project-card img {
        display: block;
        width: 100%;
        aspect-ratio: 5 / 4;
        object-fit: cover;
        filter: saturate(0.92) contrast(1.02);
      }

      .project-card figcaption {
        display: flex;
        align-self: start;
        flex-direction: column;
        justify-content: flex-start;
        gap: 9px;
        min-height: 0;
        padding: 16px;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.36;
      }

      .project-card strong {
        color: var(--text);
        font-family: var(--mono);
        font-size: 12px;
        line-height: 1.22;
        text-transform: uppercase;
      }

      .project-card em {
        color: var(--orange-dark);
        font-style: normal;
        font-weight: 700;
      }

      .project-card-more {
        align-self: flex-start;
        min-height: 38px;
        margin-top: 3px;
        border: 1px solid var(--line-strong);
        border-radius: var(--radius);
        background: var(--surface);
        padding: 0 12px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        cursor: pointer;
        transition:
          border-color 180ms var(--ease),
          background 180ms var(--ease),
          transform 180ms var(--ease);
      }

      .project-card-more:hover,
      .project-card-more:focus-visible {
        transform: translateY(-1px);
        border-color: var(--orange-dark);
        background: rgba(255, 107, 0, 0.07);
        outline: none;
      }

      .project-card-simple {
        min-height: 0;
        grid-template-rows: auto 1fr;
      }

      .project-card-simple figcaption {
        display: flex;
        min-height: 72px;
        flex-direction: column;
        justify-content: flex-start;
        padding: 14px 16px 16px;
      }

      .project-card-simple strong {
        display: block;
        max-width: none;
        margin-bottom: 4px;
        font-size: 12px;
      }

      .project-modal .service-modal-code {
        display: none;
      }

      .project-card-detail {
        display: none;
      }

      .project-modal {
        width: min(640px, calc(100vw - 40px));
      }

      .project-modal-body h4 {
        margin: 18px 0 8px;
        color: var(--text);
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
      }

      .gallery-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .gallery-grid .gallery-item:nth-child(n + 7) {
        display: none;
      }

      .gallery-item {
        position: relative;
        display: block;
        margin: 0;
        min-height: 160px;
        overflow: hidden;
        background: var(--surface-2);
      }

      .gallery-actions {
        display: flex;
        justify-content: center;
        margin-top: 20px;
      }

      .gallery-modal {
        position: relative;
        width: min(960px, calc(100vw - 40px));
        max-height: calc(100vh - 40px);
        margin: auto;
        border: 1px solid var(--line-strong);
        border-top: 3px solid var(--orange);
        padding: clamp(24px, 3vw, 36px);
        background: rgba(255, 255, 255, 0.98);
        color: var(--text);
        overflow: hidden;
      }

      .gallery-modal::backdrop {
        background: rgba(18, 18, 18, 0.52);
      }

      .gallery-modal-header {
        margin-bottom: 18px;
        padding-right: 48px;
      }

      .gallery-modal-header .panel-kicker {
        display: block;
        margin-bottom: 6px;
        color: var(--muted-2);
        font-family: var(--mono);
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .gallery-modal-header h3 {
        margin: 0;
        font-size: clamp(22px, 2.4vw, 30px);
        line-height: 1.1;
      }

      .gallery-modal-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1px;
        max-height: calc(100vh - 180px);
        overflow-y: auto;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .gallery-modal-grid .gallery-item {
        min-height: 120px;
        cursor: zoom-in;
      }

      button.gallery-item {
        border: 0;
        padding: 0;
        cursor: zoom-in;
        font: inherit;
        text-align: inherit;
        color: inherit;
        width: 100%;
      }

      button.gallery-item:focus-visible {
        outline: 2px solid var(--orange);
        outline-offset: -2px;
      }

      .gallery-zoom {
        position: relative;
        width: min(1100px, calc(100vw - 32px));
        max-height: calc(100vh - 32px);
        margin: auto;
        padding: 0;
        border: none;
        background: transparent;
        overflow: visible;
      }

      .gallery-zoom::backdrop {
        background: rgba(8, 8, 8, 0.9);
      }

      .gallery-zoom .service-modal-close {
        border-color: rgba(255, 255, 255, 0.28);
        background: rgba(18, 18, 18, 0.72);
        color: #ffffff;
      }

      .gallery-zoom .service-modal-close:hover,
      .gallery-zoom .service-modal-close:focus-visible {
        border-color: var(--orange-dark);
        color: #ffffff;
      }

      .gallery-zoom img {
        display: block;
        width: 100%;
        max-height: calc(100vh - 64px);
        object-fit: contain;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: rgba(18, 18, 18, 0.4);
      }

      .gallery-item img {
        display: block;
        width: 100%;
        height: 100%;
        aspect-ratio: 5 / 4;
        object-fit: cover;
        filter: saturate(0.9) contrast(1.03);
        transition:
          transform 420ms var(--ease),
          filter 420ms var(--ease);
      }

      .gallery-item::before {
        position: absolute;
        z-index: 2;
        pointer-events: none;
        inset: 0;
        content: "";
        background:
          linear-gradient(180deg, rgba(28, 32, 36, 0), rgba(28, 32, 36, 0.24)),
          linear-gradient(90deg, rgba(255, 255, 255, 0.16), transparent 34%);
        opacity: 0;
        transition: opacity 240ms var(--ease);
      }

      .gallery-item:hover img,
      .gallery-item:focus-within img {
        transform: scale(1.035);
        filter: saturate(0.98) contrast(1.06);
      }

      .gallery-item:hover::before,
      .gallery-item:focus-within::before {
        opacity: 1;
      }

      .proof-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px;
        background: var(--line);
      }

      .proof-stat {
        min-height: 150px;
        background: var(--surface);
        padding: 22px;
      }

      .proof-stat strong {
        display: block;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: clamp(28px, 3vw, 48px);
        line-height: 1;
      }

      .proof-stat span {
        display: block;
        margin-top: 12px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .faq-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .faq-item {
        min-height: 188px;
      }

      .contact-grid {
        display: grid;
        grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1fr);
        gap: 1px;
        border: 1px solid var(--line-strong);
        background: var(--line);
      }

      .contact-panel,
      .form-panel {
        background: rgba(255, 255, 255, 0.88);
        padding: clamp(24px, 3vw, 42px);
      }

      .contact-panel h2 {
        font-size: clamp(34px, 4vw, 58px);
      }

      .contact-methods {
        display: grid;
        gap: 1px;
        margin-top: 34px;
        border: 1px solid var(--line);
        background: var(--line);
      }

      .contact-methods a,
      .contact-methods span,
      .contact-methods .contact-social {
        display: grid;
        gap: 6px;
        background: var(--surface);
        padding: 18px;
        color: var(--text);
        font-family: var(--mono);
        font-size: 13px;
        font-weight: 700;
      }

      .contact-methods small {
        color: var(--muted);
        font-size: 10px;
        text-transform: uppercase;
      }

      .contact-social-links {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
      }

      .contact-methods .contact-social-link {
        display: inline-grid;
        place-items: center;
        padding: 0;
        background: none;
        font-weight: 400;
      }

      .contact-method-icon {
        width: 28px;
        height: 28px;
        fill: currentColor;
      }

      .contact-method--whatsapp .contact-method-icon {
        color: #25d366;
      }

      .contact-method--telegram .contact-method-icon {
        color: #229ed9;
      }

      .contact-social-link:hover .contact-method-icon,
      .contact-social-link:focus-visible .contact-method-icon {
        opacity: 0.8;
      }

      form {
        display: grid;
        gap: 16px;
      }

      .form-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
      }

      label {
        display: grid;
        gap: 8px;
        color: var(--muted);
        font-family: var(--mono);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
      }

      input,
      select,
      textarea {
        width: 100%;
        border: 1px solid var(--line-strong);
        border-radius: var(--radius);
        background: var(--surface);
        color: var(--text);
        padding: 13px 14px;
        font-family: var(--sans);
        font-size: 16px;
      }

      textarea {
        min-height: 136px;
        resize: vertical;
      }

      .form-footer {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 14px;
      }

      .form-status {
        min-height: 22px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .footer {
        margin-top: clamp(28px, 5vw, 72px);
        border-top: 2px solid var(--orange);
        background:
          linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0
            0 / 64px 64px,
          linear-gradient(180deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px)
            0 0 / 64px 64px,
          linear-gradient(180deg, #23282d 0%, #1c2024 100%);
      }

      .footer-inner {
        display: grid;
        grid-template-columns: minmax(220px, 0.8fr) repeat(3, minmax(0, 1fr));
        gap: 1px;
        border-left: 1px solid rgba(255, 255, 255, 0.08);
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        background: rgba(255, 255, 255, 0.08);
      }

      .footer-cell {
        min-height: 190px;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        padding: 22px 24px 24px;
        background: #1c2024;
      }

      .footer-cell:last-child {
        border-right: 0;
      }

      .footer-brand {
        display: inline-block;
        margin-bottom: 20px;
        padding: 12px 14px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: var(--radius);
        background: #f8f9fa;
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset;
      }

      .footer-logo {
        display: block;
        width: 172px;
        margin-bottom: 0;
      }

      .footer-cell h3 {
        margin: 0 0 16px;
        font-family: var(--mono);
        font-size: 13px;
        text-transform: uppercase;
      }

      .footer-heading {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #f1f3f5;
      }

      .footer-heading svg {
        flex-shrink: 0;
        width: 16px;
        height: 16px;
        stroke: var(--orange);
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
      }

      .footer-cell a,
      .footer-cell p {
        margin: 0 0 10px;
        color: #b9c1c8;
        font-size: 14px;
        line-height: 1.45;
      }

      .footer-cell > p {
        display: block;
      }

      .footer-link {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        transition: color 180ms var(--ease);
      }

      .footer-link svg {
        flex-shrink: 0;
        width: 15px;
        height: 15px;
        margin-top: 2px;
        stroke: #87919b;
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        transition: stroke 180ms var(--ease);
      }

      .footer-link svg.footer-icon-filled {
        stroke: none;
        fill: #87919b;
        transition: fill 180ms var(--ease);
      }

      .footer-link:hover,
      .footer-link:focus-visible {
        color: #fff;
      }

      .footer-link:hover svg,
      .footer-link:focus-visible svg {
        stroke: var(--orange);
      }

      .footer-link:hover svg.footer-icon-filled,
      .footer-link:focus-visible svg.footer-icon-filled {
        stroke: none;
        fill: var(--orange);
      }

      .footer-note {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        color: #87919b;
      }

      .footer-note svg {
        flex-shrink: 0;
        width: 15px;
        height: 15px;
        margin-top: 2px;
        stroke: var(--orange);
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        opacity: 0.85;
      }

      .reveal {
        opacity: 1;
        transform: translateY(0);
      }

      html.js-anim .reveal {
        opacity: 0;
        transform: translateY(18px);
        transition:
          opacity 420ms var(--ease),
          transform 420ms var(--ease);
      }

      html.js-anim .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
      }

      @media (max-width: 1480px) {
        .hero,
        .section,
        .footer-inner,
        .nav,
        .utility {
          width: min(100% - 48px, 1280px);
        }

        .hero-grid {
          grid-template-columns: minmax(0, 0.92fr) minmax(380px, 0.78fr);
          gap: clamp(28px, 3.4vw, 46px);
        }

        h1 {
          max-width: 680px;
          font-size: clamp(36px, 3.72vw, 54px);
          line-height: 1.03;
        }

        .subtitle {
          max-width: 620px;
          font-size: 17px;
        }

        .photo-frame,
        .photo-frame img {
          min-height: 450px;
        }

        .service-strip {
          margin-top: 28px;
        }

        .status-card {
          left: -8px;
          bottom: 24px;
          width: min(314px, calc(100% - 28px));
        }

        .spec-rail {
          margin-top: 10px;
        }

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

        .metric {
          min-height: 96px;
        }
      }

      @media (max-width: 1320px) and (min-width: 1181px) {
        .nav-links {
          gap: 14px;
          font-size: 11px;
        }

        .emergency {
          min-width: 214px;
          padding-left: 16px;
        }

        h1 {
          font-size: clamp(34px, 3.45vw, 48px);
        }

        .hero-grid {
          grid-template-columns: minmax(0, 0.9fr) minmax(360px, 0.72fr);
        }

        .copy .audit-promo {
          grid-template-columns: minmax(210px, 0.72fr) minmax(240px, 1fr);
        }

        .copy .audit-promo-detail {
          padding-top: 4px;
        }

        .actions {
          gap: 10px;
        }

        .hero-inline-cta {
          min-width: 212px;
          margin-left: 26px;
        }

        .btn {
          min-height: 50px;
          padding-inline: 16px;
          font-size: 14px;
        }

        .service-strip div {
          padding: 16px;
        }
      }

      :focus-visible {
        outline: 3px solid rgba(255, 107, 0, 0.34);
        outline-offset: 3px;
      }

      @media (max-width: 1180px) {
        .utility {
          display: none;
        }

        .nav {
          grid-template-columns: auto 1fr auto auto;
        }

        .nav-links {
          display: none;
        }

        .mobile-toggle {
          display: inline-grid;
          place-items: center;
          justify-self: end;
        }

        .emergency {
          min-width: 0;
          justify-self: end;
        }

        .hero-grid,
        .hero-after,
        .section-grid,
        .services-intro,
        .contact-grid,
        .proof-grid,
        .narrative-grid,
        .guarantee-grid,
        .compliance {
          grid-template-columns: 1fr;
        }

        .services-lede {
          padding-top: 0;
        }
h1 {
          max-width: 900px;
          font-size: clamp(38px, 7vw, 68px);
        }

        .visual {
          min-height: 0;
        }

        .photo-frame,
        .photo-frame img {
          min-height: 500px;
        }

        .status-card {
          left: 24px;
        }


        .mobile-panel {
          display: none;
          width: min(1480px, calc(100% - 40px));
          margin: 0 auto 16px;
          border: 1px solid var(--line-strong);
          background: var(--surface);
        }

        .mobile-panel.is-open {
          display: grid;
        }

        .mobile-panel a {
          padding: 15px 18px;
          border-bottom: 1px solid var(--line);
          font-family: var(--mono);
          font-size: 12px;
          font-weight: 700;
          text-transform: uppercase;
        }

        .mobile-panel a:last-child {
          border-bottom: 0;
        }

        .panel-grid,
        .services-grid,
        .values-grid,
        .benefit-grid,
        .project-grid,
        .process-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

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

        .gallery-modal-grid {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .capability-list {
          grid-column: auto;
        }

        .process-step::after {
          display: none;
        }

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

      @media (max-width: 760px) {
        body {
          background:
            linear-gradient(90deg, rgba(28, 32, 36, 0.035) 1px, transparent 1px)
              0 0 / 64px 64px,
            linear-gradient(180deg, rgba(28, 32, 36, 0.03) 1px, transparent 1px)
              0 0 / 64px 64px,
            var(--bg);
        }

        main {
          gap: 64px;
        }

        .nav,
        .hero,
        .section,
        .mobile-panel,
        .footer-inner {
          width: min(100% - 40px, 1480px);
        }

        .nav {
          display: flex;
          align-items: center;
          justify-content: flex-start;
          min-height: 74px;
          gap: 16px;
        }

        .brand {
          width: 118px;
        }

        .emergency {
          display: none;
        }

        .nav-phone {
          display: inline-grid;
          flex: 0 0 40px;
          margin-left: auto;
          place-items: center;
          width: 40px;
          height: 40px;
          border: 1px solid var(--orange);
          border-radius: var(--radius);
          background: var(--orange);
          color: #ffffff;
        }

        .nav-phone svg,
        .nav-phone svg path {
          stroke: currentColor;
          stroke-width: 1.8;
          fill: none;
          stroke-linecap: round;
          stroke-linejoin: round;
        }

        .mobile-toggle {
          display: inline-grid;
          flex: 0 0 40px;
          margin-left: 4px;
          place-items: center;
          width: 40px;
          height: 40px;
          border-color: var(--orange-dark);
          background: var(--orange);
          color: #ffffff;
        }

        .floating-toggle {
          display: none;
        }

        .hero {
          padding-top: 28px;
        }

        .copy,
        .section-head {
          min-width: 0;
          padding-left: 14px;
        }

        h1 {
          width: 100%;
          max-width: min(100%, 15ch);
          font-size: clamp(28px, 7.9vw, 32px);
          line-height: 1.04;
          overflow-wrap: anywhere;
        }

        .subtitle,
        .section-lede {
          width: 100%;
          max-width: calc(100vw - 68px);
          overflow-wrap: break-word;
        }

        h2 {
          font-size: clamp(30px, 9vw, 46px);
        }

        .subtitle,
        .section-lede {
          font-size: 16px;
        }

        .audit-promo {
          grid-template-columns: 1fr;
        }

        .audit-promo h2 {
          max-width: 100%;
        }

        .audit-promo-detail {
          padding-top: 0;
        }

        .audit-promo-action {
          width: 100%;
        }

        .actions,
        .form-footer {
          display: grid;
          width: 100%;
          max-width: calc(100vw - 68px);
        }

        .hero-inline-cta {
          float: none;
          display: flex;
          width: 100%;
          min-width: 0;
          margin: 18px 0 0;
        }

        .btn {
          width: 100%;
          min-height: 44px;
          padding: 0 15px;
          text-align: center;
          white-space: normal;
        }

        .service-strip,
        .spec-rail,
        .trust,
        .panel-grid,
        .services-grid,
        .capability-list,
        .narrative-grid,
        .values-grid,
        .benefit-grid,
        .guarantee-grid,
        .project-grid,
        .gallery-grid,
        .process-grid,
        .faq-grid,
        .form-grid,
        .object-map,
        .proof-stats,
        .footer-inner {
          grid-template-columns: 1fr;
        }

        .object-map {
          grid-template-rows: auto auto;
          height: auto;
        }

        .object-list {
          grid-template-rows: none;
        }

        .object-list button {
          min-height: 64px;
          height: auto;
        }

        .object-detail {
          min-height: 320px;
          height: auto;
        }

        .service-strip div {
          border-right: 0;
          border-bottom: 1px solid var(--line);
        }

        .service-strip div:last-child {
          border-bottom: 0;
        }

        .photo-frame,
        .photo-frame img {
          min-height: 390px;
        }

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

        .gallery-item {
          min-height: 140px;
        }

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

        .visual::before,
        .visual::after {
          width: 44px;
          height: 44px;
        }

        .status-card {
          position: relative;
          left: auto;
          bottom: auto;
          width: 100%;
          margin-top: 12px;
        }


        .panel,
        .process-step,
        .faq-item,
        .contact-panel,
        .form-panel,
        .compliance-card,
        .proof-card,
        .footer-cell {
          min-height: 0;
          padding: 20px;
        }

        .footer-cell {
          border-right: 0;
          border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        }

        .contact-fabs {
          right: 16px;
          bottom: 16px;
        }
      }

      .contact-fabs {
        position: fixed;
        right: 24px;
        bottom: 24px;
        z-index: 25;
        display: grid;
        gap: 10px;
      }

      .contact-fab {
        display: inline-grid;
        place-items: center;
        width: 44px;
        height: 44px;
        border: 1px solid transparent;
        border-radius: var(--radius);
        box-shadow: 0 10px 24px rgba(28, 32, 36, 0.14);
        color: #ffffff;
        transition:
          transform 0.2s var(--ease),
          box-shadow 0.2s var(--ease),
          background 0.2s var(--ease);
      }

      .contact-fab svg {
        fill: currentColor;
      }

      .contact-fab--whatsapp {
        background: #25d366;
      }

      .contact-fab--whatsapp:hover,
      .contact-fab--whatsapp:focus-visible {
        transform: translateY(-1px);
        background: #1fb85a;
        box-shadow: 0 14px 28px rgba(37, 211, 102, 0.28);
      }

      .contact-fab--telegram {
        background: #229ed9;
      }

      .contact-fab--telegram:hover,
      .contact-fab--telegram:focus-visible {
        transform: translateY(-1px);
        background: #1b8bbf;
        box-shadow: 0 14px 28px rgba(34, 158, 217, 0.28);
      }

      @media (prefers-reduced-motion: reduce) {
        *,
        *::before,
        *::after {
          scroll-behavior: auto !important;
          transition-duration: 0.01ms !important;
          animation-duration: 0.01ms !important;
          animation-iteration-count: 1 !important;
        }

        .reveal {
          opacity: 1;
          transform: none;
        }

        .contact-fab:hover,
        .contact-fab:focus-visible {
          transform: none;
        }
      }

      .service-page-main {
        padding-top: 0;
      }

      .shell {
        width: min(1180px, calc(100% - 40px));
        margin: 0 auto;
        padding: clamp(18px, 2.8vw, 32px) 0 clamp(48px, 6vw, 80px);
      }

      .breadcrumb {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0 0 clamp(18px, 2.8vw, 32px);
        padding: 0;
        list-style: none;
        color: var(--muted);
        font-size: 14px;
      }

      .breadcrumb a {
        color: var(--muted);
        text-decoration: none;
      }

      .breadcrumb a:hover,
      .breadcrumb a:focus-visible {
        color: var(--orange-dark);
      }

      .breadcrumb li + li::before {
        margin-right: 8px;
        content: "/";
        color: var(--muted-2);
      }

      .service-hero {
        margin-bottom: clamp(32px, 5vw, 56px);
        padding: 0 0 clamp(32px, 5vw, 56px);
        border-bottom: 1px solid var(--line);
      }

      .service-hero--with-media {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
        gap: clamp(28px, 4vw, 52px);
        align-items: start;
      }

      .service-hero-copy {
        min-width: 0;
      }

      .service-hero-media {
        margin: 4px 0 0;
        width: min(100%, 420px);
        justify-self: end;
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 6px;
        background: #eef1f4;
        box-shadow: 0 14px 28px rgba(25, 31, 38, 0.06);
      }

      .service-hero-media img {
        display: block;
        width: 100%;
        height: clamp(170px, 13vw, 210px);
        object-fit: cover;
      }

      .service-hero .panel-kicker {
        display: block;
        margin-bottom: 12px;
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
      }

      .service-hero h1 {
        max-width: 18ch;
        margin-bottom: 20px;
        font-size: clamp(34px, 5vw, 52px);
        line-height: 1.05;
      }

      .service-hero-lede {
        max-width: 68ch;
        margin-bottom: 28px;
        color: var(--muted);
        font-size: clamp(17px, 2vw, 19px);
        line-height: 1.6;
      }

      .service-hero-actions {
        display: grid;
        align-items: start;
        gap: 14px;
        max-width: 620px;
      }

      .service-hero-actions .btn {
        justify-self: start;
      }

      .service-audit-note {
        position: relative;
        max-width: 54ch;
        margin: 0;
        border-left: 3px solid var(--orange);
        background: rgba(255, 107, 0, 0.07);
        padding: 12px 14px 12px 16px;
        color: var(--muted);
        font-size: 15px;
        font-weight: 600;
        line-height: 1.5;
      }

      .service-content {
        display: grid;
        gap: clamp(28px, 4vw, 40px);
        max-width: 820px;
      }

      .service-content p {
        margin: 0;
        color: var(--text);
        font-size: 17px;
        line-height: 1.65;
      }

      .service-section h2 {
        margin-bottom: 18px;
        font-size: clamp(24px, 3vw, 30px);
      }

      .service-checklist {
        display: grid;
        gap: 10px;
        margin: 0;
        padding: 0;
        list-style: none;
      }

      .service-checklist li {
        position: relative;
        padding-left: 28px;
        font-size: 16px;
        line-height: 1.5;
      }

      .service-checklist li::before {
        position: absolute;
        left: 0;
        color: var(--orange-dark);
        content: "✔";
        font-weight: 700;
      }

      .service-benefits {
        margin: 0;
        padding-left: 20px;
      }

      .service-benefits li {
        margin-bottom: 8px;
        line-height: 1.55;
      }

      .service-cta-band {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        margin: clamp(40px, 6vw, 72px) 0;
        padding: clamp(24px, 4vw, 32px);
        border: 1px solid var(--line-strong);
        background: var(--surface);
      }

      .service-cta-band p {
        max-width: 42ch;
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        line-height: 1.4;
      }

      .service-cta-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
      }

      .service-related {
        margin-top: clamp(32px, 5vw, 48px);
        padding-top: 32px;
        border-top: 1px solid var(--line);
      }

      .service-related h2 {
        margin-bottom: 18px;
        font-size: 22px;
      }

      .service-related-list {
        display: grid;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
      }

      .service-related-list a {
        color: var(--text);
        text-decoration: none;
      }

      .service-related-list a:hover,
      .service-related-list a:focus-visible {
        color: var(--orange-dark);
        text-decoration: underline;
      }

      @media (max-width: 900px) {
        .services-grid {
          grid-template-columns: 1fr;
        }

        .service-hero--with-media {
          grid-template-columns: 1fr;
        }

        .service-hero-media {
          width: min(100%, 420px);
          justify-self: start;
        }

        .service-hero-media img {
          height: 180px;
        }
      }

      .lang-switch {
        display: inline-flex;
        align-items: center;
        gap: 2px;
        margin-left: 12px;
        padding: 3px;
        border: 1px solid var(--line);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.04);
        font-family: var(--font-mono);
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        flex-shrink: 0;
      }

      .lang-switch a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 30px;
        padding: 5px 8px;
        border-radius: 999px;
        color: var(--muted);
        text-decoration: none;
        transition: color 0.2s ease, background 0.2s ease;
      }

      .lang-switch a:hover,
      .lang-switch a:focus-visible {
        color: var(--ink);
        background: rgba(255, 255, 255, 0.08);
      }

      .lang-switch a[aria-current="page"] {
        color: var(--ink);
        background: rgba(255, 122, 26, 0.18);
      }

      .mobile-panel .lang-switch {
        margin: 12px 0 4px;
        align-self: flex-start;
      }

      .nav-end {
        display: flex;
        align-items: center;
        gap: clamp(10px, 1.6vw, 16px);
        justify-self: end;
      }

      @media (max-width: 1180px) {
        .nav .lang-switch {
          display: none;
        }
      }






      /* Home hero promo (client 2026-09-30): fire alarm maintenance price,
         links to the price page. The figure is tagged data-price-inline so
         the admin panel's apply-prices keeps it equal to the price list. */
      .hero-promo {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px 16px;
        max-width: 100%;
        margin: 0 0 22px;
        padding: 10px 16px 10px 14px;
        border: 1px solid var(--orange);
        border-left-width: 4px;
        border-radius: var(--radius);
        background: var(--orange-soft);
        box-shadow: 0 8px 24px rgba(255, 107, 0, 0.12);
        color: var(--text);
        font-size: 16px;
        line-height: 1.35;
        text-decoration: none;
        transition:
          background 0.2s var(--ease),
          border-color 0.2s var(--ease);
      }

      .hero-promo strong {
        color: var(--orange-dark);
        font-weight: 700;
        white-space: nowrap;
      }

      .hero-promo-link {
        color: var(--orange-dark);
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        white-space: nowrap;
      }

      .hero-promo-link::after {
        content: " \2192";
      }

      .hero-promo:hover,
      .hero-promo:focus-visible {
        border-color: var(--orange-dark);
        background: #ffe6d3;
      }

      .hero-promo:hover .hero-promo-link {
        text-decoration: underline;
      }

      @media (max-width: 760px) {
        .hero-promo {
          display: flex;
          margin-bottom: 18px;
          padding: 10px 12px;
          font-size: 15px;
        }
      }
