:root{--gold:#D4A437;--gold-bright:#E8B946;--gold-deep:#B8902F;--bg-dark:#0B0D0C;--bg-darker:#070807;--bg-card:#111412;--text-on-dark:#E8E3D9;--text-on-dark-muted:#C8C0B2;--text-on-dark-dim:#8B8478;--text-on-light:#1A1A1A;--text-on-light-muted:#4A4A4A;--border-gold:rgba(226, 170, 31, 0.18);--border-gold-strong:rgba(226, 170, 31, 0.36);--text:#E8E3D9;--text-muted:#C8C0B2;--text-dim:#8B8478;--gold-color:#D4A437;--bg-dark-2:#1C1C1C;--bg-light:#F8F6F1;--bg-light-hover:#F0EDE5;--text-on-dark-2:#B8B8B8;--text-on-light-2:#6B6B6B;--border-dark:#2A2A2A;--border-light:#E5E1D8;--gold-text:#E6B847;--gold-line:rgba(212, 164, 55, 0.3);--gold-hover:#B8902F;--btn-gold-hi:#E8C77A;--btn-gold-top:#D4B25C;--btn-gold-mid:#BA9743;--btn-gold-bot:#8C7030;--btn-gold-rim:#4A360F;--btn-gold-rim-2:#1A1206;--btn-text-ink:#1E1812;--btn-skew:polygon(12px 0, 100% 0, calc(100% - 12px) 100%, 0 100%);--btn-skew-sm:polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);--btn-grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ─────────────────────────────────────────────────────────────── */
/* БАЗОВІ СТИЛІ                                                    */
/* ─────────────────────────────────────────────────────────────── */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--text-on-dark);
  background: var(--bg-dark);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ─────────────────────────────────────────────────────────────── */
/* ТИПОГРАФІЧНА ШКАЛА — СТРОГО 12/14/16/18/20/24/32/40/56/72      */
/* ─────────────────────────────────────────────────────────────── */

/* DISPLAY — Hero H1 головної */
.display {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

/* H2 — Заголовки всіх секцій */
.h2 {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

/* H3 — Підзаголовки в секціях */
.h3 {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
}

/* CARD TITLE LARGE — Заголовки великих карток (кейси, послуги) */
.card-title-lg {
  font-family: 'Oswald', sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: var(--text-on-dark);
}

/* CARD TITLE SMALL — Заголовки малих карток (переваги, категорії) */
.card-title-sm {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

/* EYEBROW — Надписи над заголовками секцій */
.eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gold);
}

/* BODY-LG — Підзаголовки секцій, ліди */
.body-lg {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.01em;
  color: var(--text-on-dark-muted);
}

/* BODY — Основний текст */
.body {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.01em;
  color: var(--text-on-dark-muted);
}

/* BODY-SM — Вторинний текст, лейбли форм */
.body-sm {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: var(--text-on-dark-muted);
}

/* CAPTION — Метки, дати, локації */
.caption {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: var(--text-on-dark-dim);
}

/* NUMBERS LARGE — Цифри довіри (8+/480+/70+) */
.number-lg {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 56px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0em;
  color: var(--gold-bright);
}

/* PHONE NUMBER */
.phone {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
}

/* NAVIGATION */
.nav-link {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

/* ─────────────────────────────────────────────────────────────── */
/* MOBILE ADJUSTMENTS                                              */
/* ─────────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
  body {
    font-size: 16px; /* Мінімум 16px на мобайлі */
  }

  .phone {
    font-size: 16px;
  }
}

/* ===== base.css ===== */
    /* ═══════════════════════════════════════════════════════════════ */
    /* PLATIS UKRAINE — ЄДИНА ТИПОГРАФІЧНА СИСТЕМА                    */
    /* Шрифти: Oswald (заголовки) + Inter (body/UI)                   */
    /* Веса: ТІЛЬКИ 400 / 600 / 700                                   */
    /* Розміри: ТІЛЬКИ 12/14/16/18/20/24/32/40/56/72                  */
    /* ═══════════════════════════════════════════════════════════════ */

    body {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: 1.6;
      letter-spacing: 0.01em;
      color: var(--text);
      background: var(--bg-dark);
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      /* overflow-x: clip (not hidden) — `hidden` makes the element a scroll
         container, which breaks `position: sticky` on the header. `clip`
         still prevents horizontal overflow but keeps sticky working. */
      overflow-x: clip;
    }

    html {
      overflow-x: clip;
      /* Anchor jumps account for the sticky header height
         (76px desktop / 64px mobile + a touch of breathing room). */
      scroll-padding-top: 88px;
    }
    @media (max-width: 768px) {
      html { scroll-padding-top: 72px; }
    }

    /* CF7 wraps its hidden inputs in <fieldset class="hidden-fields-container">,
       whose default browser border renders as a stray line above the first
       field. Neutralise it so native CF7 forms (contacts, CTA) sit flush. */
    .wpcf7-form fieldset {
      margin: 0;
      padding: 0;
      border: 0;
      min-inline-size: 0;
    }

    /* ─────────────────────────────────────────────────────────────── */
    /* ТИПОГРАФІЧНА ШКАЛА                                              */
    /* ─────────────────────────────────────────────────────────────── */

    /* EYEBROW — надписи над H2 секцій */
    /* EYEBROW — premium industrial section label.
       Horizontal padding is generous (24px) so the skewed clip-path
       (7px inset top-left + bottom-right) never touches the text. */
    .eyebrow {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-family: 'Inter', sans-serif;
      font-size: 10.5px;
      font-weight: 600;
      line-height: 1;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--btn-gold-hi);
      width: fit-content;
      min-height: 28px;
      padding: 6px 24px;
      white-space: nowrap;
      background: linear-gradient(180deg,
        rgba(212, 164, 55, 0.55) 0%,
        rgba(180, 138, 56, 0.42) 50%,
        rgba(110, 83, 24, 0.55) 100%);
      clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
      isolation: isolate;
    }
    .eyebrow::before {
      content: '';
      position: absolute;
      inset: 1px;
      background: linear-gradient(180deg,
        rgba(14, 16, 13, 0.92) 0%,
        rgba(10, 12, 10, 0.88) 100%);
      clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
      z-index: -1;
    }

    /* H1 Display — Hero заголовок */
    h1, .h1 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(40px, 5vw, 72px);
      font-weight: 700;
      line-height: 1.05;
      letter-spacing: 0.02em;
      text-transform: uppercase;
      color: var(--text);
    }

    /* H2 — Заголовки всіх секцій */
    h2, .h2 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(32px, 4vw, 56px);
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: 0.02em;
      text-transform: uppercase;
      color: var(--text);
    }

    /* H3 — Підзаголовки */
    h3, .h3 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(24px, 3vw, 32px);
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: 0.02em;
      color: var(--text);
    }

    /* Card title large — великі картки (кейси, послуги) */
    .card-title-lg {
      font-family: 'Oswald', sans-serif;
      font-size: 24px;
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: 0.01em;
      color: var(--text);
    }

    /* Card title small — малі картки (переваги, категорії) */
    .card-title-sm {
      font-family: 'Oswald', sans-serif;
      font-size: 18px;
      font-weight: 600;
      line-height: 1.3;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--text);
    }

    /* Body-lg — підзаголовки секцій */
    .body-lg {
      font-family: 'Inter', sans-serif;
      font-size: 18px;
      font-weight: 400;
      line-height: 1.6;
      letter-spacing: 0.01em;
      color: var(--text-muted);
    }

    /* Body — основний текст (16px мінімум на мобайлі!) */
    .body, p {
      font-family: 'Inter', sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: 1.6;
      letter-spacing: 0.01em;
      color: var(--text-muted);
    }

    /* Body-sm — вторинний текст */
    .body-sm {
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.5;
      letter-spacing: 0.01em;
      color: var(--text-muted);
    }

    /* Caption — метки, дати */
    .caption {
      font-family: 'Inter', sans-serif;
      font-size: 12px;
      font-weight: 600;
      line-height: 1.4;
      letter-spacing: 0.04em;
      color: var(--text-dim);
    }

    /* Numbers large — цифри довіри */
    .number-lg {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(40px, 5vw, 56px);
      font-weight: 700;
      line-height: 1;
      letter-spacing: 0em;
      color: var(--gold-bright);
    }


    /* ─────────────────────────────────────────────────────────────── */
    /* MOBILE: тільки 16px+ body text                                  */
    /* ─────────────────────────────────────────────────────────────── */

    @media (max-width: 768px) {
      body {
        font-size: 16px; /* Мінімум 16px на мобайлі */
      }
    }

/* ===== components/button.css ===== */
    /* ─────────────────────────────────────────────────────────────── */
    /* КНОПКИ — Industrial skewed button system                        */
    /* ─────────────────────────────────────────────────────────────── */

    .btn {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      height: 56px;
      min-width: 200px;
      padding: 0 38px;
      border: 0;
      border-radius: 0;
      background: transparent;
      cursor: pointer;
      text-decoration: none;
      color: var(--btn-text-ink);
      clip-path: var(--btn-skew);
      isolation: isolate;
      transition: transform 0.22s cubic-bezier(.2,.7,.2,1), filter 0.22s ease;
      -webkit-tap-highlight-color: transparent;
    }

    /* Inner fill — sits 1.5px inside the parent's clip → leaves a thin rim */
    .btn::before,
    .btn::after {
      content: '';
      position: absolute;
      inset: 1.5px;
      clip-path: var(--btn-skew);
      pointer-events: none;
      transition: inherit;
    }

    .btn > * { position: relative; z-index: 2; }

    .btn:focus-visible {
      outline: 2px dashed var(--btn-gold-hi);
      outline-offset: 4px;
    }

    /* ── Primary: satin brass plate ────────────────────────────────── */
    .btn-primary {
      color: #0E0E0E !important;
      text-shadow: 0 1px 0 rgba(255,255,255,0.18);
      /* The .btn background here IS the rim — two-tone bronze, brighter at top */
      background:
        linear-gradient(180deg,
          #5a4314 0%,
          var(--btn-gold-rim) 35%,
          var(--btn-gold-rim-2) 100%);
      filter:
        drop-shadow(0 1px 0 rgba(0,0,0,0.45))
        drop-shadow(0 6px 14px rgba(0,0,0,0.32));
    }

    .btn-primary::before {
      /* satin metal fill — restrained highlight, controlled depth */
      background:
        /* clean champagne top edge highlight */
        linear-gradient(180deg,
          rgba(255,238,196,0.34) 0%,
          rgba(255,238,196,0.00) 12%,
          rgba(0,0,0,0.00) 65%,
          rgba(0,0,0,0.10) 88%,
          rgba(0,0,0,0.20) 100%),
        /* the actual satin brass gradient */
        linear-gradient(178deg,
          var(--btn-gold-hi)  0%,
          var(--btn-gold-top) 30%,
          var(--btn-gold-mid) 68%,
          var(--btn-gold-bot) 100%);
      z-index: -2;
    }

    /* Brushed-anodized grain — barely-there satin grain */
    .btn-primary::after {
      background-image: var(--btn-grain);
      background-size: 200px 200px;
      mix-blend-mode: overlay;
      opacity: 0.18;
      z-index: -1;
    }

    /* ── Shimmer keyframe — diagonal light sweep across brushed brass ── */
    @keyframes btn-shimmer {
      0%   { background-position: 0% 0, 0 0, 0 0; }
      100% { background-position: 100% 0, 0 0, 0 0; }
    }

    .btn-primary:hover {
      transform: translateY(-1px);
      filter:
        drop-shadow(0 2px 0 rgba(0,0,0,0.45))
        drop-shadow(0 12px 22px rgba(0,0,0,0.42))
        drop-shadow(0 0 20px rgba(185,148,55,0.16));
    }

    .btn-primary:hover::before {
      /* Enhanced brass — brighter champagne top edge, warmer mid */
      background:
        linear-gradient(180deg,
          rgba(255,248,210,0.50) 0%,
          rgba(255,244,210,0.00) 14%,
          rgba(0,0,0,0.00) 65%,
          rgba(0,0,0,0.07) 88%,
          rgba(0,0,0,0.16) 100%),
        linear-gradient(178deg,
          #F5D88C 0%,
          #E2C26A 28%,
          #C8A550 66%,
          #9A7C3C 100%);
    }

    /* Diagonal shimmer — runs once on hover entry */
    .btn-primary:hover::after {
      background:
        linear-gradient(
          108deg,
          transparent 0%,
          transparent 34%,
          rgba(255,244,198,0.22) 45%,
          rgba(255,252,220,0.34) 50%,
          rgba(255,244,198,0.22) 55%,
          transparent 66%,
          transparent 100%
        );
      background-size: 300% 100%;
      background-position: 0% 0;
      mix-blend-mode: screen;
      opacity: 1;
      transition: none;
      animation: btn-shimmer 0.78s cubic-bezier(.22,.6,.3,1) forwards;
    }
    @media (prefers-reduced-motion: reduce) {
      .btn-primary:hover::after {
        animation: none;
        background: none;
        opacity: 0.18;
      }
    }

    .btn-primary:active {
      transform: translateY(1px);
      filter:
        drop-shadow(0 0px 0 rgba(0,0,0,0.45))
        drop-shadow(0 2px 5px rgba(0,0,0,0.3));
    }

    /* Pressed: darker brass, gradient flipped — tactile metal-plate feel */
    .btn-primary:active::before {
      background:
        linear-gradient(180deg,
          rgba(0,0,0,0.20) 0%,
          rgba(0,0,0,0.06) 38%,
          rgba(255,224,148,0.06) 100%),
        linear-gradient(178deg,
          var(--btn-gold-bot) 0%,
          var(--btn-gold-mid) 48%,
          var(--btn-gold-top) 100%);
    }

    /* ── Secondary: gunmetal dark with bronze/gold rim ────────────── */
    .btn-secondary,
    .btn-secondary:link,
    .btn-secondary:visited {
      background: linear-gradient(180deg,
        rgba(180, 138, 56, 0.55) 0%,
        rgba(90, 68, 22, 0.55)   50%,
        rgba(36, 26, 8, 0.85)    100%);
      color: var(--btn-gold-hi);
      filter: drop-shadow(0 5px 12px rgba(0,0,0,0.4));
    }

    .btn-secondary::before {
      background:
        linear-gradient(180deg,
          rgba(255,255,255,0.05) 0%,
          rgba(255,255,255,0.00) 6%,
          rgba(0,0,0,0.00) 75%,
          rgba(0,0,0,0.30) 100%),
        linear-gradient(178deg,
          #22231F 0%,
          #1A1B17 50%,
          #0E0F0C 100%);
      z-index: -2;
    }

    /* Grain removed from secondary — mix-blend-mode causes Safari compositing
       issue where text renders behind the blend group */
    .btn-secondary::after {
      display: none;
    }

    .btn-secondary:hover {
      color: #F2EEE3;
      transform: translateY(-1px);
      filter: drop-shadow(0 7px 16px rgba(0,0,0,0.46));
      background: linear-gradient(180deg,
        rgba(220, 172, 78, 0.85) 0%,
        rgba(120, 90, 30, 0.78)  50%,
        rgba(48, 35, 10, 0.95)   100%);
    }

    .btn-secondary:hover::before {
      background:
        linear-gradient(180deg,
          rgba(220, 172, 78, 0.10) 0%,
          rgba(220, 172, 78, 0.02) 40%,
          rgba(0,0,0,0.25) 100%),
        linear-gradient(178deg,
          #272722 0%,
          #1D1E1A 50%,
          #10110D 100%);
    }

    .btn-secondary:active {
      transform: translateY(1px);
      filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
    }

    /* ── Secondary (on dark hero) — dark graphite, muted gold rim, off-white text ── */
    .btn-secondary-dark,
    .btn-secondary-dark:link,
    .btn-secondary-dark:visited {
      background: linear-gradient(180deg,
        rgba(212, 164, 55, 0.65) 0%,
        rgba(160, 120, 35, 0.58) 45%,
        rgba(100,  75, 18, 0.72) 100%);
      color: #F1EDE4;
      filter: drop-shadow(0 5px 14px rgba(0,0,0,0.50));
    }

    .btn-secondary-dark::before {
      background:
        linear-gradient(180deg,
          rgba(255,255,255,0.07) 0%,
          rgba(255,255,255,0.00) 10%,
          rgba(0,0,0,0.00) 68%,
          rgba(0,0,0,0.18) 100%),
        linear-gradient(178deg,
          #323428 0%,
          #272920 50%,
          #1A1C16 100%);
      z-index: -2;
    }

    /* Grain removed — mix-blend-mode: soft-light causes Safari compositing
       issue where text renders behind the blend group; text appears invisible */
    .btn-secondary-dark::after {
      display: none;
    }

    .btn-secondary-dark:hover,
    .btn-secondary-dark:hover:link,
    .btn-secondary-dark:hover:visited {
      color: #FFFFFF;
      transform: translateY(-1px);
      background: linear-gradient(180deg,
        rgba(220, 175, 68, 0.82) 0%,
        rgba(175, 132, 42, 0.72) 45%,
        rgba(115,  86, 20, 0.88) 100%);
      filter:
        drop-shadow(0 7px 18px rgba(0,0,0,0.52))
        drop-shadow(0 0 20px rgba(212,164,55,0.12));
    }

    .btn-secondary-dark:hover::before {
      background:
        linear-gradient(180deg,
          rgba(255,255,255,0.09) 0%,
          rgba(255,255,255,0.00) 10%,
          rgba(0,0,0,0.00) 68%,
          rgba(0,0,0,0.14) 100%),
        linear-gradient(178deg,
          #3A3C2E 0%,
          #2E3026 50%,
          #20221A 100%);
    }

    .btn-secondary-dark:active {
      transform: translateY(1px);
      filter: drop-shadow(0 2px 4px rgba(0,0,0,0.30));
    }

    /* ── Small variant: header / footer / inline CTAs ──────────────── */
    .btn-sm {
      height: 46px;
      min-width: 0;
      padding: 0 30px;
      font-size: 11.5px;
      letter-spacing: 0.10em;
      clip-path: var(--btn-skew-sm);
    }
    .btn-sm::before,
    .btn-sm::after {
      clip-path: var(--btn-skew-sm);
      inset: 1px;
    }

    /* ── Outline: ghost-gold → fills on hover (header/secondary CTAs) ── */
    .btn-outline {
      /* The .btn bg here IS the visible thin gold rim */
      background: linear-gradient(180deg,
        var(--btn-gold-top) 0%,
        var(--btn-gold-mid) 55%,
        var(--btn-gold-bot) 100%);
      color: var(--btn-gold-hi);
      filter: drop-shadow(0 3px 8px rgba(0,0,0,0.32));
    }

    .btn-outline::before {
      /* Dark graphite inner — subtle vertical depth */
      background:
        linear-gradient(180deg,
          rgba(255,255,255,0.04) 0%,
          rgba(255,255,255,0.00) 8%,
          rgba(0,0,0,0.00) 70%,
          rgba(0,0,0,0.30) 100%),
        linear-gradient(178deg, #1B1C18 0%, #0E0F0C 100%);
      z-index: -2;
    }

    .btn-outline::after {
      background-image: var(--btn-grain);
      background-size: 140px 140px;
      mix-blend-mode: overlay;
      opacity: 0.30;
      z-index: -1;
    }

    .btn-outline:hover {
      color: var(--btn-text-ink);
      transform: translateY(-1px);
      filter:
        drop-shadow(0 1px 0 rgba(0,0,0,0.45))
        drop-shadow(0 7px 16px rgba(0,0,0,0.36));
      background: linear-gradient(180deg,
        #5a4314 0%,
        var(--btn-gold-rim) 35%,
        var(--btn-gold-rim-2) 100%);
    }

    .btn-outline:hover::before {
      /* Morphs into the satin brass fill */
      background:
        linear-gradient(180deg,
          rgba(255,238,196,0.34) 0%,
          rgba(255,238,196,0.00) 12%,
          rgba(0,0,0,0.00) 65%,
          rgba(0,0,0,0.10) 88%,
          rgba(0,0,0,0.20) 100%),
        linear-gradient(178deg,
          var(--btn-gold-hi)  0%,
          var(--btn-gold-top) 30%,
          var(--btn-gold-mid) 68%,
          var(--btn-gold-bot) 100%);
    }

    .btn-outline:hover::after {
      opacity: 0.18;
    }

    .btn-outline:active {
      transform: translateY(1px);
      filter: drop-shadow(0 1px 3px rgba(0,0,0,0.3));
    }

    /* ── Inline text link with arrow ───────────────────────────────── */
    .btn-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--gold);
      text-decoration: none;
      background: none;
      border: 0;
      padding: 4px 0;
      cursor: pointer;
      transition: color 0.22s ease;
    }

    .btn-link::after {
      content: '→';
      transition: transform 0.22s ease;
    }

    .btn-link:hover {
      color: var(--gold-bright);
    }

    .btn-link:hover::after {
      transform: translateX(4px);
    }


/* ===== components/modal.css ===== */
/* ================================================================ */
/* REQUEST MODAL — exact design from Claude Design source            */
/* Dark card, satin brass button, bottom-sheet mobile               */
/* ================================================================ */

    /* ─────────────────────────────────────────────────────────── */
    /* RESET + PLATIS TOKENS                                        */
    /* ─────────────────────────────────────────────────────────── */
    /* Scroll-lock when modal open */
    body.rm-open {
      overflow: hidden;
      /* iOS Safari needs this to actually prevent scroll */
      position: fixed;
      width: 100%;
    }

    /* ─────────────────────────────────────────────────────────── */
    /* DEMO PAGE                                                    */
    /* ─────────────────────────────────────────────────────────── */

    /* ─────────────────────────────────────────────────────────── */
    /* BUTTON SYSTEM — matches main site exactly                    */
    /* ─────────────────────────────────────────────────────────── */
    .btn {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      height: 56px;
      min-width: 200px;
      padding: 0 38px;
      border: 0;
      border-radius: 0;
      background: transparent;
      cursor: pointer;
      text-decoration: none;
      color: var(--btn-text-ink);
      clip-path: var(--btn-skew);
      isolation: isolate;
      transition: transform 0.22s cubic-bezier(.2,.7,.2,1), filter 0.22s ease;
      -webkit-tap-highlight-color: transparent;
    }
    .btn::before, .btn::after {
      content: '';
      position: absolute;
      inset: 1.5px;
      clip-path: var(--btn-skew);
      pointer-events: none;
      transition: inherit;
    }
    .btn > * { position: relative; z-index: 1; }
    .btn:focus-visible { outline: 2px dashed var(--btn-gold-hi); outline-offset: 4px; }

    .btn-primary {
      background: linear-gradient(180deg, #5a4314 0%, var(--btn-gold-rim) 35%, var(--btn-gold-rim-2) 100%);
      filter: drop-shadow(0 1px 0 rgba(0,0,0,.45)) drop-shadow(0 6px 14px rgba(0,0,0,.32));
    }
    .btn-primary::before {
      background:
        linear-gradient(180deg, rgba(255,238,196,.34) 0%, rgba(255,238,196,0) 12%, rgba(0,0,0,0) 65%, rgba(0,0,0,.10) 88%, rgba(0,0,0,.20) 100%),
        linear-gradient(178deg, var(--btn-gold-hi) 0%, var(--btn-gold-top) 30%, var(--btn-gold-mid) 68%, var(--btn-gold-bot) 100%);
      z-index: -2;
    }
    .btn-primary::after { background-image: var(--btn-grain); background-size: 200px; mix-blend-mode: overlay; opacity: .18; z-index: -1; }
    .btn-primary:hover  { transform: translateY(-1px); filter: drop-shadow(0 2px 0 rgba(0,0,0,.45)) drop-shadow(0 10px 20px rgba(0,0,0,.4)); }
    .btn-primary:active { transform: translateY(1px);  filter: drop-shadow(0 0   0 rgba(0,0,0,.45)) drop-shadow(0 3px 6px rgba(0,0,0,.3));   }

    .btn-secondary {
      background: linear-gradient(180deg, rgba(180,138,56,.55) 0%, rgba(90,68,22,.55) 50%, rgba(36,26,8,.85) 100%);
      color: #DDD7C8;
      filter: drop-shadow(0 5px 12px rgba(0,0,0,.4));
    }
    .btn-secondary::before {
      background:
        linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 6%, rgba(0,0,0,0) 75%, rgba(0,0,0,.30) 100%),
        linear-gradient(178deg, #22231F 0%, #1A1B17 50%, #0E0F0C 100%);
      z-index: -2;
    }
    .btn-secondary::after { background-image: var(--btn-grain); background-size: 140px; mix-blend-mode: overlay; opacity: .35; z-index: -1; }
    .btn-secondary:hover  { color: #F2EEE3; transform: translateY(-1px); filter: drop-shadow(0 7px 16px rgba(0,0,0,.46)); }
    .btn-secondary:active { transform: translateY(1px); }

    /* ═════════════════════════════════════════════════════════════ */
    /* REQUEST MODAL                                                  */
    /* ═════════════════════════════════════════════════════════════ */

    /* ── Overlay ── */
    .rm {
      position: fixed;
      inset: 0;
      z-index: 9000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      visibility: hidden;
      pointer-events: none;
    }

    /* ── Backdrop ── */
    .rm__bg {
      position: absolute;
      inset: 0;
      background: rgba(3, 4, 3, 0.86);
      backdrop-filter: blur(12px) saturate(0.75);
      -webkit-backdrop-filter: blur(12px) saturate(0.75);
      opacity: 0;
      transition: opacity 0.34s ease;
    }

    /* ── Card ── */
    .rm__card {
      position: relative;
      z-index: 1;
      width: 100%;
      max-width: 628px;
      max-height: min(92svh, 880px);
      overflow-y: auto;
      overscroll-behavior: contain;

      background: linear-gradient(
        158deg,
        #1C201C 0%,
        #161A16 30%,
        #111412 60%,
        #0E1110 100%
      );
      border: 1px solid rgba(212,164,55, 0.13);
      border-radius: 26px;
      box-shadow:
        inset 0 1px 0 rgba(232,199,122, 0.11),
        inset 0 -1px 0 rgba(0,0,0, 0.4),
        0 2px 8px  rgba(0,0,0, 0.5),
        0 16px 48px rgba(0,0,0, 0.6),
        0 56px 100px rgba(0,0,0, 0.5);

      /* Entry state */
      opacity: 0;
      transform: translateY(16px) scale(0.963);
      transition:
        opacity  0.35s cubic-bezier(.18,.72,.22,1),
        transform 0.35s cubic-bezier(.18,.72,.22,1);
    }

    .rm__card::-webkit-scrollbar { width: 3px; }
    .rm__card::-webkit-scrollbar-thumb { background: rgba(212,164,55,.15); border-radius: 2px; }

    /* ── Open ── */
    .rm.is-open {
      visibility: visible;
      pointer-events: auto;
    }
    .rm.is-open .rm__bg    { opacity: 1; }
    .rm.is-open .rm__card  { opacity: 1; transform: none; }

    /* ── Closing ── */
    .rm.is-closing .rm__bg {
      opacity: 0;
      transition: opacity 0.26s ease;
    }
    .rm.is-closing .rm__card {
      opacity: 0;
      transform: translateY(10px) scale(0.981);
      transition: opacity 0.22s ease, transform 0.22s cubic-bezier(.5,0,.8,.8);
    }

    /* ─────────────────────────────────────────────────────────── */
    /* DRAG HANDLE (mobile only, shown via media query)             */
    /* ─────────────────────────────────────────────────────────── */
    .rm__handle {
      display: none;
      width: 36px;
      height: 4px;
      border-radius: 2px;
      background: rgba(255,255,255,.1);
      margin: 14px auto 0;
    }

    /* ─────────────────────────────────────────────────────────── */
    /* INNER PADDING SHELL                                          */
    /* ─────────────────────────────────────────────────────────── */
    .rm__inner { padding: 36px 40px 40px; }

    /* ── Header row ── */
    .rm__header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 28px;
    }

    /* ── Eyebrow badge ── */
    .rm__eyebrow {
      position: relative;
      display: inline-flex;
      align-items: center;
      font-family: 'Inter', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.19em;
      text-transform: uppercase;
      color: var(--btn-gold-hi);
      height: 24px;
      padding: 0 18px;
      white-space: nowrap;
      background: linear-gradient(180deg,
        rgba(212,164,55,.52) 0%,
        rgba(180,138,56,.38) 50%,
        rgba(100,75,20,.52) 100%);
      clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
      isolation: isolate;
      margin-bottom: 13px;
    }
    .rm__eyebrow::before {
      content: '';
      position: absolute;
      inset: 1px;
      background: linear-gradient(180deg, rgba(14,17,13,.94) 0%, rgba(10,13,10,.91) 100%);
      clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
      z-index: -1;
    }

    /* ── Title ── */
    .rm__title {
      font-family: 'Oswald', sans-serif;
      font-size: 30px;
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: 0.02em;
      text-transform: uppercase;
      color: var(--text);
      margin-bottom: 10px;
    }

    /* ── Subtitle ── */
    .rm__sub {
      font-size: 13.5px;
      line-height: 1.62;
      color: rgba(139,132,120,.78);
      max-width: 400px;
    }

    /* ── Benefits list (premium value props) ── */
    .rm__benefits {
      list-style: none;
      margin: 14px 0 0;
      padding: 0;
      display: grid;
      gap: 7px;
    }
    .rm__benefits li {
      position: relative;
      padding-left: 24px;
      font-size: 13px;
      line-height: 1.4;
      color: rgba(232,227,217,.82);
    }
    .rm__benefits li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 2px;
      width: 15px;
      height: 15px;
      background: rgba(212,164,55,.14);
      border-radius: 50%;
    }
    .rm__benefits li::after {
      content: '';
      position: absolute;
      left: 4px;
      top: 6px;
      width: 6px;
      height: 3.5px;
      border-left: 1.6px solid var(--gold, #D4A437);
      border-bottom: 1.6px solid var(--gold, #D4A437);
      transform: rotate(-45deg);
    }

    /* ── Context note (pre-fill from equipment card) ── */
    .rm__ctx {
      display: none;
      align-items: center;
      gap: 8px;
      margin-top: 13px;
      padding: 7px 13px;
      background: rgba(212,164,55,.055);
      border: 1px solid rgba(212,164,55,.14);
      border-radius: 8px;
      font-size: 11.5px;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: rgba(212,164,55,.75);
    }
    .rm__ctx.is-on { display: flex; }
    .rm__ctx-dot { width: 5px; height: 5px; border-radius: 50%; background: rgba(212,164,55,.65); flex-shrink: 0; }

    /* ── Close button ── */
    .rm__close {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      margin-top: 3px;
      border: 1px solid rgba(255,255,255,.07);
      border-radius: 50%;
      background: rgba(255,255,255,.03);
      color: rgba(139,132,120,.55);
      cursor: pointer;
      transition: background .18s, color .18s, transform .24s cubic-bezier(.2,.7,.2,1);
      -webkit-tap-highlight-color: transparent;
    }
    .rm__close svg { width: 15px; height: 15px; }
    .rm__close:hover { background: rgba(255,255,255,.07); color: var(--text-muted); transform: rotate(90deg); }
    .rm__close:active { transform: rotate(90deg) scale(.9); }
    .rm__close:focus-visible { outline: 2px dashed var(--btn-gold-hi); outline-offset: 3px; border-radius: 50%; }

    /* ─────────────────────────────────────────────────────────── */
    /* FORM FIELDS                                                  */
    /* ─────────────────────────────────────────────────────────── */
    .rm__form { display: flex; flex-direction: column; gap: 14px; }

    .rm__row { display: flex; gap: 12px; }
    .rm__row .rm__field { flex: 1 1 0; }

    .rm__field { display: flex; flex-direction: column; gap: 6px; }
    /* [hidden] б'є display:flex вище — повертаємо приховування для JS-перемикання. */
    .rm__field[hidden] { display: none; }

    .rm__label {
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      color: rgba(139,132,120,.65);
    }
    .rm__label em { color: var(--gold); font-style: normal; margin-left: 2px; }

    .rm__input,
    .rm__textarea {
      font-family: 'Inter', sans-serif;
      font-size: 15px;
      font-weight: 400;
      line-height: 1.5;
      color: var(--text);
      background: rgba(7,9,8,.72);
      border: 1px solid rgba(232,227,217,.07);
      border-radius: 11px;
      padding: 13px 15px;
      width: 100%;
      outline: none;
      -webkit-appearance: none;
      appearance: none;
      box-shadow: inset 0 1.5px 4px rgba(0,0,0,.45);
      transition: border-color .2s ease, box-shadow .2s ease;
    }
    .rm__input::placeholder,
    .rm__textarea::placeholder { color: rgba(139,132,120,.38); }
    .rm__input:hover,
    .rm__textarea:hover { border-color: rgba(232,227,217,.11); }
    .rm__input:focus,
    .rm__textarea:focus {
      border-color: rgba(212,164,55,.42);
      box-shadow:
        inset 0 1.5px 4px rgba(0,0,0,.40),
        0 0 0 3.5px rgba(212,164,55,.07),
        0 0 0 1px   rgba(212,164,55,.18);
    }
    .rm__input--phone {
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0.025em;
    }
    .rm__textarea {
      resize: vertical;
      min-height: 108px;
      line-height: 1.58;
    }

    /* ─────────────────────────────────────────────────────────── */
    /* SEGMENT CONTROL — request type                               */
    /* ─────────────────────────────────────────────────────────── */
    .rm__seg {
      display: flex;
      gap: 5px;
      padding: 5px;
      background: rgba(6,8,7,.65);
      border: 1px solid rgba(232,227,217,.06);
      border-radius: 14px;
    }
    .rm__seg-btn {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 38px;
      padding: 0 6px;
      font-family: 'Inter', sans-serif;
      font-size: 11.5px;
      font-weight: 600;
      letter-spacing: 0.03em;
      text-align: center;
      color: rgba(139,132,120,.55);
      background: transparent;
      border: 1px solid transparent;
      border-radius: 10px;
      cursor: pointer;
      transition: color .2s, background .2s, border-color .2s;
      -webkit-tap-highlight-color: transparent;
    }
    .rm__seg-btn:hover { color: var(--text-muted); background: rgba(255,255,255,.04); }
    .rm__seg-btn.is-active {
      color: var(--btn-gold-hi);
      background: rgba(212,164,55,.09);
      border-color: rgba(212,164,55,.20);
    }
    .rm__seg-btn:focus-visible { outline: 2px dashed var(--btn-gold-hi); outline-offset: 2px; }

    /* ─────────────────────────────────────────────────────────── */
    /* CONSENT CHECKBOX                                             */
    /* ─────────────────────────────────────────────────────────── */
    .rm__consent {
      display: flex;
      align-items: flex-start;
      gap: 11px;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }
    .rm__check-input {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
      pointer-events: none;
    }
    .rm__check-box {
      flex-shrink: 0;
      position: relative;
      width: 19px;
      height: 19px;
      margin-top: 2px;
      border: 1.5px solid rgba(139,132,120,.30);
      border-radius: 5px;
      background: rgba(7,9,8,.72);
      transition: border-color .18s, background .18s;
    }
    .rm__check-box::after {
      content: '';
      position: absolute;
      inset: 2px;
      background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10' fill='none'><path d='M1.5 5L5 8.5L11.5 1.5' stroke='%23E8C77A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
      opacity: 0;
      transform: scale(.5);
      transition: opacity .16s, transform .18s cubic-bezier(.2,.7,.2,1);
    }
    .rm__check-input:checked ~ .rm__check-box {
      border-color: rgba(212,164,55,.48);
      background: rgba(212,164,55,.10);
    }
    .rm__check-input:checked ~ .rm__check-box::after {
      opacity: 1;
      transform: scale(1);
    }
    .rm__consent:hover .rm__check-box { border-color: rgba(212,164,55,.28); }
    .rm__check-input:focus-visible ~ .rm__check-box {
      outline: 2px dashed var(--btn-gold-hi);
      outline-offset: 2px;
    }
    .rm__consent-text {
      font-size: 12.5px;
      line-height: 1.5;
      color: rgba(139,132,120,.65);
    }
    .rm__consent-text a { color: rgba(180,138,56,.8); text-decoration: none; }
    .rm__consent-text a:hover { color: var(--gold-bright); }

    /* ─────────────────────────────────────────────────────────── */
    /* SUBMIT BUTTON — full satin brass, matches main site          */
    /* ─────────────────────────────────────────────────────────── */
    .rm__submit {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      height: 54px;
      width: 100%;
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      cursor: pointer;
      color: var(--btn-text-ink);
      clip-path: var(--btn-skew);
      isolation: isolate;
      transition: transform .22s cubic-bezier(.2,.7,.2,1), filter .22s ease;
      -webkit-tap-highlight-color: transparent;

      background: linear-gradient(180deg, #5a4314 0%, var(--btn-gold-rim) 35%, var(--btn-gold-rim-2) 100%);
      filter: drop-shadow(0 1px 0 rgba(0,0,0,.45)) drop-shadow(0 8px 18px rgba(0,0,0,.35));
    }
    .rm__submit::before, .rm__submit::after {
      content: '';
      position: absolute;
      inset: 1.5px;
      clip-path: var(--btn-skew);
      pointer-events: none;
      transition: inherit;
    }
    .rm__submit > * { position: relative; z-index: 1; }
    .rm__submit::before {
      background:
        linear-gradient(180deg,
          rgba(255,238,196,.34) 0%, rgba(255,238,196,0) 12%,
          rgba(0,0,0,0) 65%, rgba(0,0,0,.10) 88%, rgba(0,0,0,.20) 100%),
        linear-gradient(178deg,
          var(--btn-gold-hi) 0%, var(--btn-gold-top) 30%,
          var(--btn-gold-mid) 68%, var(--btn-gold-bot) 100%);
      z-index: -2;
    }
    .rm__submit::after {
      background-image: var(--btn-grain);
      background-size: 200px;
      mix-blend-mode: overlay;
      opacity: .18;
      z-index: -1;
    }
    .rm__submit:hover {
      transform: translateY(-1px);
      filter: drop-shadow(0 2px 0 rgba(0,0,0,.45)) drop-shadow(0 12px 22px rgba(0,0,0,.40)) drop-shadow(0 0 18px rgba(185,148,55,.16));
    }
    .rm__submit:hover::before {
      background:
        linear-gradient(180deg,
          rgba(255,248,210,.50) 0%, rgba(255,244,210,0) 14%,
          rgba(0,0,0,0) 65%, rgba(0,0,0,.07) 88%, rgba(0,0,0,.16) 100%),
        linear-gradient(178deg, #F5D88C 0%, #E2C26A 28%, #C8A550 66%, #9A7C3C 100%);
    }
    /* Diagonal shimmer — matches site btn-primary */
    .rm__submit:hover::after {
      background: linear-gradient(
        108deg,
        transparent 0%, transparent 34%,
        rgba(255,244,198,.22) 45%, rgba(255,252,220,.34) 50%, rgba(255,244,198,.22) 55%,
        transparent 66%, transparent 100%
      );
      background-size: 300% 100%;
      background-position: 0% 0;
      mix-blend-mode: screen;
      opacity: 1;
      transition: none;
      animation: btn-shimmer .78s cubic-bezier(.22,.6,.3,1) forwards;
    }
    @keyframes btn-shimmer {
      0%   { background-position: 0% 0, 0 0, 0 0; }
      100% { background-position: 100% 0, 0 0, 0 0; }
    }
    @media (prefers-reduced-motion: reduce) {
      .rm__submit:hover::after { animation: none; background: none; opacity: .18; }
    }
    .rm__submit:active {
      transform: translateY(1px);
      filter: drop-shadow(0 0 0 rgba(0,0,0,.45)) drop-shadow(0 2px 5px rgba(0,0,0,.3));
    }
    /* Pressed: darker brass top — tactile metal-plate feel */
    .rm__submit:active::before {
      background:
        linear-gradient(180deg, rgba(0,0,0,.20) 0%, rgba(0,0,0,.06) 38%, rgba(255,224,148,.06) 100%),
        linear-gradient(178deg, var(--btn-gold-bot) 0%, var(--btn-gold-mid) 48%, var(--btn-gold-top) 100%);
    }
    .rm__submit:disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }
    .rm__submit:focus-visible { outline: 2px dashed var(--btn-gold-hi); outline-offset: 5px; }

    /* Loading spinner */
    .rm__spin {
      display: none;
      width: 18px; height: 18px;
      border: 2px solid rgba(30,24,18,.3);
      border-top-color: var(--btn-text-ink);
      border-radius: 50%;
      animation: rm-spin .7s linear infinite;
    }
    .rm__submit.is-loading .rm__submit-txt { display: none; }
    .rm__submit.is-loading .rm__spin      { display: block; }
    @keyframes rm-spin { to { transform: rotate(360deg); } }

    /* Narrow variant for success close button */
    .rm__submit--narrow {
      width: auto;
      min-width: 200px;
      padding: 0 44px;
    }

    /* ─────────────────────────────────────────────────────────── */
    /* FORM FOOTER                                                  */
    /* ─────────────────────────────────────────────────────────── */
    .rm__foot {
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin-top: 18px;
    }

    .rm__phone-line {
      text-align: center;
      font-size: 13px;
      color: rgba(139,132,120,.45);
    }
    .rm__phone-line a {
      color: rgba(139,132,120,.75);
      font-weight: 600;
      text-decoration: none;
      transition: color .16s;
    }
    .rm__phone-line a:hover { color: var(--gold-bright); }

    /* Trust pills */
    .rm__pills {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      justify-content: center;
    }
    .rm__pill {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 4px 11px;
      background: rgba(212,164,55,.04);
      border: 1px solid rgba(212,164,55,.09);
      border-radius: 100px;
      font-size: 10.5px;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: rgba(139,132,120,.42);
    }
    .rm__pill::before {
      content: '';
      width: 4px; height: 4px;
      border-radius: 50%;
      background: rgba(212,164,55,.45);
      flex-shrink: 0;
    }

    /* ─────────────────────────────────────────────────────────── */
    /* SUCCESS STATE                                                */
    /* ─────────────────────────────────────────────────────────── */
    .rm__success {
      display: none;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 14px;
      padding: 52px 40px 52px;
    }
    .rm__success.is-on { display: flex; }

    @keyframes rm-success-in {
      from { opacity: 0; transform: scale(.7); }
      to   { opacity: 1; transform: scale(1); }
    }
    .rm__success.is-on .rm__success-icon {
      animation: rm-success-in .45s cubic-bezier(.2,.8,.25,1.1) both;
    }

    .rm__success-icon {
      width: 66px; height: 66px;
      border-radius: 50%;
      background: rgba(212,164,55,.06);
      border: 1px solid rgba(212,164,55,.22);
      display: flex; align-items: center; justify-content: center;
      color: var(--gold-bright);
      margin-bottom: 4px;
    }
    .rm__success-icon svg { width: 26px; height: 26px; }

    .rm__success-title {
      font-family: 'Oswald', sans-serif;
      font-size: 26px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--text);
    }
    .rm__success-body {
      font-size: 14.5px;
      line-height: 1.6;
      color: rgba(139,132,120,.75);
      max-width: 300px;
    }
    .rm__success-phone {
      font-size: 12px;
      line-height: 1.65;
      color: rgba(139,132,120,.42);
      margin-top: 4px;
    }
    .rm__success-phone a {
      color: rgba(180,138,56,.8);
      font-weight: 600;
      text-decoration: none;
    }
    .rm__success-phone a:hover { color: var(--gold-bright); }

    /* ─────────────────────────────────────────────────────────── */
    /* MOBILE — bottom sheet                                        */
    /* ─────────────────────────────────────────────────────────── */
    @media (max-width: 680px) {
      .rm {
        padding: 0;
        align-items: flex-end;
      }
      .rm__card {
        max-width: 100%;
        max-height: 91svh;
        border-radius: 22px 22px 0 0;
        /* Entry: slide from bottom with spring feel */
        transform: translateY(100%);
        transition:
          opacity  .36s cubic-bezier(.18,.72,.22,1),
          transform .44s cubic-bezier(.12,.9,.28,1);
      }
      .rm.is-open .rm__card {
        transform: translateY(0);
        opacity: 1;
      }
      .rm.is-closing .rm__card {
        transform: translateY(100%);
        opacity: 1;
        transition: transform .32s cubic-bezier(.5,0,.8,.3);
      }
      .rm__handle { display: block; }
      .rm__inner  { padding: 20px 22px calc(32px + env(safe-area-inset-bottom)); }
      .rm__header { margin-bottom: 20px; }
      .rm__title  { font-size: 24px; }
      .rm__sub    { font-size: 13px; }
      .rm__row    { flex-direction: column; gap: 14px; }
      .rm__seg {
        flex-direction: column;
        gap: 6px;
        height: auto;
        padding: 6px;
        border-radius: 16px;
      }
      .rm__seg-btn {
        min-height: 52px;
        height: auto;
        width: 100%;
        justify-content: flex-start;
        padding: 0 18px;
        border-radius: 12px;
        font-size: 13px;
        letter-spacing: 0.02em;
      }
      /* Mobile active: full-row emphasis, no thin-pill ambiguity */
      .rm__seg-btn.is-active {
        background: rgba(212,164,55,.10);
        border-color: rgba(212,164,55,.55);
        box-shadow: inset 0 0 0 1px rgba(212,164,55,.28), 0 0 8px rgba(212,164,55,.06);
      }
      .rm__success { padding: 44px 28px calc(44px + env(safe-area-inset-bottom)); }
    }

    /* Prevent bg scroll on iOS */
    @media (max-width: 680px) {
      body.rm-open {
        position: fixed;
        width: 100%;
        overflow: hidden;
      }
    }
  
/* ================================================================ */
/* MOBILE STICKY BAR                                                 */
/* ================================================================ */
/* Two premium actions: Подзвонити (dark) + Заявка (satin gold). No Viber. */
.m-sticky {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 800; /* above content, below the modal (modal z-index is higher) */
  gap: 1px;
  padding-bottom: env(safe-area-inset-bottom);
  background: rgba(5, 7, 6, 0.92);
  border-top: 1px solid rgba(212, 164, 55, 0.22);
  box-shadow: 0 -12px 30px rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.28s ease;
}

/* Hide while the drawer or a modal is open, or when JS flags it. */
.m-sticky.is-hidden,
body.has-mobile-menu-open .m-sticky,
body.rm-open .m-sticky {
  transform: translateY(110%);
  opacity: 0;
  pointer-events: none;
}

.m-sticky__btn {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 66px;
  padding: 10px 8px;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background 0.18s ease, color 0.18s ease, filter 0.15s ease;
}
.m-sticky__btn svg { width: 21px; height: 21px; display: block; flex-shrink: 0; }
.m-sticky__btn span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m-sticky__btn:active { filter: brightness(0.92); }
.m-sticky__btn:focus-visible {
  outline: 2px dashed var(--btn-gold-hi, #E8C77A);
  outline-offset: -4px;
}

/* Подзвонити — dark graphite, muted gold icon, off-white text */
.m-sticky__btn--call {
  background: linear-gradient(180deg, rgba(28,30,25,0.96) 0%, rgba(16,17,14,0.98) 100%);
  color: #E8E1CF;
}
.m-sticky__btn--call svg { color: var(--btn-gold-top, #D4B25C); }
.m-sticky__btn--call:active { background: rgba(34,36,29,0.98); }

/* Заявка — satin champagne brass, dark text (slightly emphasised) */
.m-sticky__btn--order {
  background: linear-gradient(180deg,
    var(--btn-gold-hi, #E8C77A) 0%,
    var(--btn-gold-top, #D4B25C) 34%,
    var(--btn-gold-mid, #BA9743) 72%,
    var(--btn-gold-bot, #8C7030) 100%);
  color: var(--btn-text-ink, #1E1812);
  text-shadow: 0 1px 0 rgba(255,255,255,0.18);
}
.m-sticky__btn--order svg { color: var(--btn-text-ink, #1E1812); }

@media (max-width: 768px) {
  .m-sticky { display: flex; }
  /* Keep page content / footer clear of the fixed bar. */
  body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
}

/* ── Калькулятор вартості оренди (всередині модалки заявки) ───────── */
.rm__calc {
  margin: 4px 0 2px;
  padding: 16px;
  border: 1px solid rgba(212, 164, 55, 0.22);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(212, 164, 55, 0.06), rgba(212, 164, 55, 0) 60%),
    rgba(255, 255, 255, 0.015);
}

.rm__calc-result {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed rgba(212, 164, 55, 0.25);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rm__calc-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: rgba(232, 227, 217, 0.72);
}

.rm__calc-line span:last-child {
  font-weight: 600;
  color: var(--text-on-dark, #E8E3D9);
  white-space: nowrap;
}

.rm__calc-line--total {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid rgba(212, 164, 55, 0.18);
  font-family: 'Oswald', sans-serif;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-on-dark, #E8E3D9);
}

.rm__calc-line--total span:last-child {
  font-size: 20px;
  color: var(--gold-text, #E6B847);
}

.rm__calc-note {
  margin: 12px 0 0;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(232, 227, 217, 0.45);
}

/* ===== components/seo-collapse.css ===== */
/* ── SEO text collapse ─────────────────────────────────────────────── */

.seo-collapse {
  position: relative;
  max-height: 300px;
  overflow: hidden;
  transition: max-height 0.45s ease;
}

.seo-collapse.is-expanded {
  max-height: 9999px;
}

/* Short content — no collapse needed */
.seo-collapse.is-short {
  max-height: none;
  overflow: visible;
}
.seo-collapse.is-short::after { display: none; }

/* Toggle button */
.seo-collapse__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px 0;
  font: 600 14px/1 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gold);
  transition: color 0.2s;
}

.seo-collapse__btn:hover { color: var(--gold-hover); }

.seo-collapse__btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.seo-collapse__btn.is-expanded svg {
  transform: rotate(180deg);
}

.seo-collapse__btn.is-short { display: none; }

/* Safety: if ever inside a multi-column context */
.seo-collapse,
.seo-collapse__btn { column-span: all; }

/* ===== blocks/header.css ===== */
    /* ─────────────────────────────────────────────────────────────── */
    /* HEADER                                                          */
    /* ─────────────────────────────────────────────────────────────── */

    .header {
      /* Slightly translucent over the hero — switches to fully solid on scroll */
      background: rgba(8, 9, 8, 0.62);
      border-bottom: 1px solid rgba(212, 164, 55, 0.10);
      position: sticky;
      top: 0;
      z-index: 1000;
      backdrop-filter: blur(8px) saturate(120%);
      -webkit-backdrop-filter: blur(8px) saturate(120%);
      transition: background 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, backdrop-filter 0.28s ease, transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .header--scrolled {
      background: rgba(7, 8, 7, 0.92);
      border-bottom-color: rgba(212, 164, 55, 0.18);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
      box-shadow: 0 8px 22px -14px rgba(0, 0, 0, 0.7);
    }
    /* Mobile auto-hide */
    @media (max-width: 768px) {
      .header { will-change: transform; }
      .header--hidden {
        transform: translateY(-100%);
        pointer-events: none;
      }
    }

    .header__inner {
      max-width: 1400px;
      margin: 0 auto;
      padding: 0 60px;
      height: 76px;
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 48px;
    }

    .header__logo {
      display: block;
    }
    
    .header__logo img {
      height: 42px;
      width: auto;
      display: block;
    }

    .header__nav {
      display: flex;
      align-items: center;
      gap: 28px;
      /* min-width:0 lets the 1fr grid track shrink below content width so the
         overflow JS can measure available space (scrollWidth vs clientWidth)
         and so the nav never pushes the actions group off-screen. */
      min-width: 0;
    }

    /* Items keep their natural width (no shrinking) — the "…" overflow JS
       decides what to hide, not flexbox. */
    .header__nav > * {
      flex-shrink: 0;
    }

    /* Single top-level link (Проєкти / Про компанію / Контакти) */
    .nav-item__link--solo,
    .header__nav > a {
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      white-space: nowrap;
      color: var(--text);
      text-decoration: none;
      transition: color 0.2s;
    }

    .nav-item__link--solo:hover,
    .header__nav > a:hover {
      color: var(--gold);
    }

    /* Nav item with mega-menu / dropdown */
    .nav-item {
      position: relative;
      display: inline-flex;
      align-items: center;
    }

    /* Hover bridge — keeps menu open while cursor crosses gap */
    .nav-item::after {
      content: '';
      position: absolute;
      top: 100%;
      left: -8px;
      right: -8px;
      height: 22px;
      pointer-events: none;
    }
    .nav-item:hover::after,
    .nav-item.is-open::after,
    .nav-item:focus-within::after {
      pointer-events: auto;
    }

    .nav-item__link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      white-space: nowrap;
      color: var(--text);
      text-decoration: none;
      transition: color 0.2s;
      cursor: pointer;
    }

    .nav-item__link:hover,
    .nav-item:hover .nav-item__link,
    .nav-item.is-open .nav-item__link,
    .nav-item:focus-within .nav-item__link {
      color: var(--gold);
    }

    .nav-item__caret {
      transition: transform 0.22s ease, color 0.2s ease;
      color: var(--text-dim);
    }

    .nav-item:hover .nav-item__caret,
    .nav-item.is-open .nav-item__caret,
    .nav-item:focus-within .nav-item__caret {
      transform: rotate(180deg);
      color: var(--gold);
    }

    /* ─── Mega-menu (Оренда) ─────────────────────────────────────── */
    .mega {
      position: absolute;
      top: 100%;
      left: 0;
      transform: translateY(8px);
      width: min(760px, calc(100vw - 40px));
      margin-top: 14px;
      background: rgba(8, 9, 8, 1);
      border: 1px solid rgba(212, 164, 55, 0.20);
      border-top: 2px solid var(--gold);
      padding: 28px 32px 18px;
      opacity: 0;
      pointer-events: none;
      visibility: hidden;
      transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
      box-shadow: 0 22px 48px rgba(0, 0, 0, 0.55);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
      z-index: 1100;
    }

    .nav-item--mega:hover .mega,
    .nav-item--mega.is-open .mega,
    .nav-item--mega:focus-within .mega {
      opacity: 1;
      pointer-events: auto;
      visibility: visible;
      transform: translateY(0);
    }

    .mega__inner {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px 28px;
      margin-bottom: 14px;
    }

    .mega__col {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .mega__link {
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 400;
      letter-spacing: 0.01em;
      text-transform: none;
      color: var(--text-on-dark);
      text-decoration: none;
      padding: 3px 0;
      transition: color 0.18s ease, transform 0.18s ease;
      white-space: nowrap;
    }

    .mega__link:hover {
      color: var(--gold-bright);
      transform: translateX(3px);
    }

    .mega__divider {
      height: 1px;
      background: linear-gradient(to right,
        transparent,
        rgba(212, 164, 55, 0.45) 50%,
        transparent);
      margin: 6px 0 12px;
    }

    .mega__cta {
      display: block;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      text-decoration: none;
      padding: 8px 0 4px;
      transition: color 0.2s ease, letter-spacing 0.2s ease;
    }

    .mega__cta:hover {
      color: var(--gold-bright);
      letter-spacing: 0.18em;
    }

    /* ─── Dropdown (Послуги) ─────────────────────────────────────── */
    .dropdown {
      position: absolute;
      top: 100%;
      left: 0;
      transform: translateY(8px);
      min-width: 270px;
      margin-top: 14px;
      background: rgba(8, 9, 8, 1);
      border: 1px solid rgba(212, 164, 55, 0.20);
      border-top: 2px solid var(--gold);
      padding: 12px 0 8px;
      opacity: 0;
      pointer-events: none;
      visibility: hidden;
      transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
      box-shadow: 0 22px 48px rgba(0, 0, 0, 0.55);
      backdrop-filter: blur(14px) saturate(130%);
      -webkit-backdrop-filter: blur(14px) saturate(130%);
      z-index: 1100;
    }

    .nav-item--dropdown:hover .dropdown,
    .nav-item--dropdown.is-open .dropdown,
    .nav-item--dropdown:focus-within .dropdown {
      opacity: 1;
      pointer-events: auto;
      visibility: visible;
      transform: translateY(0);
    }

    .dropdown__link {
      display: block;
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 400;
      letter-spacing: 0.01em;
      color: var(--text-on-dark);
      text-decoration: none;
      padding: 9px 22px;
      transition: color 0.18s ease, background 0.18s ease, padding-left 0.18s ease;
    }

    .dropdown__link:hover {
      color: var(--gold-bright);
      background: rgba(212, 164, 55, 0.05);
      padding-left: 26px;
    }

    .dropdown__divider {
      height: 1px;
      background: linear-gradient(to right,
        transparent,
        rgba(212, 164, 55, 0.35) 50%,
        transparent);
      margin: 8px 14px;
    }

    .dropdown__cta {
      display: block;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      text-decoration: none;
      padding: 8px 22px;
      transition: color 0.2s ease, letter-spacing 0.2s ease;
    }

    .dropdown__cta:hover {
      color: var(--gold-bright);
      letter-spacing: 0.18em;
    }

    /* When a collapsible nav link ends up INSIDE the overflow dropdown,
       style it as a dropdown link (no special classes needed on the item). */
    .dropdown > .nav-item__link--solo,
    .dropdown > a {
      display: block;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 400;
      letter-spacing: 0.01em;
      text-transform: none;
      color: rgba(232, 227, 217, 0.82);
      text-decoration: none;
      padding: 9px 22px;
      transition: color 0.18s ease, background 0.18s ease, padding-left 0.18s ease;
    }

    .dropdown > .nav-item__link--solo:hover,
    .dropdown > a:hover {
      color: var(--gold-bright);
      background: rgba(212, 164, 55, 0.05);
      padding-left: 26px;
    }

    /* ─── Kebab / overflow item ─────────────────────────────────── */
    .nav-item--overflow {
      display: none;
    }
    .nav-item--overflow.is-visible {
      display: inline-flex;
    }

    .nav-item__link--kebab {
      background: transparent;
      border: 0;
      padding: 10px 8px;
      cursor: pointer;
      color: var(--text);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: color 0.2s ease;
      -webkit-tap-highlight-color: transparent;
    }

    .nav-item__link--kebab:hover,
    .nav-item--overflow:hover .nav-item__link--kebab,
    .nav-item--overflow.is-open .nav-item__link--kebab {
      color: var(--gold);
    }

    /* Overflow dropdown anchors to the right (kebab is on the right side of nav) */
    .nav-item--overflow .dropdown {
      left: auto;
      right: 0;
      min-width: 220px;
    }

    .header__actions {
      display: flex;
      align-items: center;
      gap: 24px;
    }

    .header__lang {
      display: flex;
      align-items: center;
      gap: 8px;
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      font-weight: 600;
    }

    .header__lang-link {
      color: var(--text-dim);
      text-decoration: none;
      transition: color 0.2s;
    }

    .header__lang-link.active {
      color: var(--gold);
    }

    .header__lang-divider {
      width: 1px;
      height: 14px;
      background: var(--text-dim);
      opacity: 0.3;
    }

    .header__phone {
      font-family: 'Inter', sans-serif;
      font-size: 16px;
      font-weight: 700;
      letter-spacing: 0.02em;
      color: var(--text-muted);
      text-decoration: none;
      white-space: nowrap;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      transition: color 0.2s ease;
    }
    .header__phone:hover {
      color: var(--gold-bright);
    }
    /* Phone icon — visible on desktop, scales down on mobile */
    .header__phone-icon {
      flex-shrink: 0;
      color: var(--btn-gold-top);
      transition: color 0.2s ease;
    }
    .header__phone:hover .header__phone-icon {
      color: var(--gold-bright);
    }
    /* Legacy alias — still used in mobile-only icon path */
    .header__phone-icon-svg {
      display: none;
      color: var(--btn-gold-hi);
    }

    .header__burger {
      display: none;
    }

    /* ─────────────────────────────────────────────────────────────── */
    /* RESPONSIVE HEADER                                               */
    /* ─────────────────────────────────────────────────────────────── */

    @media (max-width: 891px) and (min-width: 769px) {
      .header__actions > .btn {
        display: none;
      }
    }
    /* Cramped range 769–1253px: tighten spacing to give the nav more room.
       The actual hiding of overflow items is handled by header-overflow.js,
       which measures available width and moves trailing items into the "…"
       kebab dropdown (priority order: Оренда · Послуги · Б/У техніка ·
       Контакти stay; Проєкти · Про нас overflow first). */
    @media (max-width: 1253px) and (min-width: 769px) {
      .header__inner {
        padding: 0 36px;
        gap: 20px;
      }
      .header__nav {
        gap: 20px;
      }
      .header__actions {
        gap: 18px;
      }

      .header__lang {
        flex-direction: column;
        gap: 0;
        line-height: 1.05;
      }
      .header__lang-link {
        font-size: 11px;
        letter-spacing: 0.08em;
        padding: 1px 0;
      }
      .header__lang-divider {
        display: none;
      }
    }

    @media (max-width: 1024px) {
      .header__inner {
        padding: 0 28px;
        gap: 16px;
      }

      .header__nav {
        gap: 18px;
      }
    }

    @media (max-width: 768px) {
      .header__inner {
        display: flex;
        align-items: center;
        padding: 0 16px;
        height: 68px;
      }

      .header__nav { display: none; }

      /* Push action group to the right */
      .header__actions {
        margin-left: auto;
        gap: 8px;
      }

      /* Language switcher — compact segmented pill */
      .header__lang {
        display: flex;
        align-items: center;
        gap: 2px;
        padding: 3px;
        background: rgba(10,12,10,.65);
        border: 1px solid rgba(255,255,255,.07);
        border-radius: 10px;
        font-size: 0; /* reset inherited */
      }
      .header__lang-link {
        font-family: 'Inter', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .08em;
        padding: 5px 8px;
        border-radius: 7px;
        color: rgba(139,132,120,.65);
        transition: color .16s, background .16s;
        line-height: 1;
        border: 1px solid transparent;
      }
      .header__lang-link.active {
        color: var(--btn-gold-hi);
        background: rgba(212,164,55,.12);
        border-color: rgba(212,164,55,.24);
      }
      .header__lang-divider { display: none; }

      /* Phone — icon button */
      .header__phone {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: rgba(14,16,14,.72);
        border: 1px solid rgba(212,164,55,.20);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        margin: 0;
        gap: 0;
        color: var(--btn-gold-top);
        transition: border-color .18s, background .18s, color .18s, transform .12s;
      }
      .header__phone:hover {
        border-color: rgba(212,164,55,.42);
        background: rgba(212,164,55,.07);
        color: var(--gold-bright);
      }
      .header__phone:active  { transform: scale(.92); }
      .header__phone-text    { display: none; }
      .header__phone-icon    { width: 18px; height: 18px; color: inherit; }
      .header__phone-icon-svg { display: none; }

      /* Burger — same icon-button family */
      .header__burger {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: rgba(14,16,14,.72);
        border: 1px solid rgba(255,255,255,.09);
        cursor: pointer;
        color: var(--text-muted);
        padding: 0;
        margin: 0 0 0 8px;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
        transition: border-color .18s, background .18s, transform .12s;
      }
      .header__burger:hover {
        border-color: rgba(255,255,255,.16);
        background: rgba(255,255,255,.04);
      }
      .header__burger:active  { transform: scale(.92); }

      /* Burger → X morphing animation */
      .header__burger svg line {
        transition: transform .28s cubic-bezier(.2,.7,.2,1), opacity .2s ease;
        transform-box: fill-box;
        transform-origin: center;
      }
      .has-mobile-menu-open .header__burger line:nth-child(1) { transform: translateY(6px) rotate(45deg); }
      .has-mobile-menu-open .header__burger line:nth-child(2) { opacity: 0; }
      .has-mobile-menu-open .header__burger line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

      /* Hide desktop CTA */
      .header__actions > .btn { display: none; }

      .btn { height: 52px; }
    }


/* ===== blocks/mobile-menu.css ===== */
  /* ─── Mobile drawer ───────────────────────────────────────────── */
  .mobile-menu {
    position: fixed;
    inset: 0;
    z-index: 1100;
    pointer-events: none;
    visibility: hidden;
  }
  .mobile-menu.is-open {
    pointer-events: auto;
    visibility: visible;
  }

  .mobile-menu__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(4, 5, 4, 0.72);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity 0.28s ease;
  }
  .mobile-menu.is-open .mobile-menu__backdrop { opacity: 1; }

  .mobile-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(86vw, 360px);
    background:
      radial-gradient(ellipse 90% 50% at 50% -10%,
        hsla(41, 55%, 50%, 0.10) 0%,
        hsla(41, 55%, 50%, 0.00) 55%),
      linear-gradient(180deg, #0E0D0B 0%, #07070a 100%);
    border-left: 1px solid hsla(41, 38%, 50%, 0.18);
    box-shadow:
      inset 0 1px 0 hsla(41, 70%, 70%, 0.06),
      -20px 0 60px -20px rgba(0, 0, 0, 0.8);
    display: flex;
    flex-direction: column;
    padding: 18px 22px 28px;
    transform: translateX(100%);
    transition: transform 0.34s cubic-bezier(.2,.7,.2,1);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .mobile-menu.is-open .mobile-menu__panel {
    transform: translateX(0);
  }

  .mobile-menu__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 26px;
  }
  .mobile-menu__logo img {
    height: 44px;
    width: auto;
    display: block;
  }
  .mobile-menu__close {
    width: 48px;
    height: 48px;
    background: transparent;
    border: 1px solid hsla(41, 38%, 50%, 0.22);
    color: var(--btn-gold-hi);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.22s, background 0.22s, color 0.22s;
    border-radius: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .mobile-menu__close:hover,
  .mobile-menu__close:active {
    border-color: hsla(41, 60%, 55%, 0.55);
    background: hsla(41, 50%, 50%, 0.06);
  }

  .mobile-menu__nav {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: auto;
    padding-bottom: 24px;
  }

  .mobile-menu__item {
    border-bottom: 1px solid hsla(41, 38%, 50%, 0.12);
  }

  .mobile-menu__toggle {
    width: 100%;
    background: transparent;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 4px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    text-align: left;
  }

  .mobile-menu__toggle span {
    flex: 1;
  }

  .mobile-menu__caret {
    color: hsla(41, 60%, 55%, 0.55);
    transition: transform 0.25s ease, color 0.2s ease;
    flex-shrink: 0;
    margin-left: 8px;
  }

  .mobile-menu__toggle[aria-expanded="true"] .mobile-menu__caret {
    transform: rotate(180deg);
    color: var(--btn-gold-hi);
  }

  .mobile-menu__toggle[aria-expanded="true"] {
    color: var(--btn-gold-hi);
  }

  .mobile-menu__sub {
    padding: 4px 0 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .mobile-menu__sub[hidden] {
    display: none;
  }

  .mobile-menu__sub-link {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: rgba(200, 192, 178, 0.75);
    text-decoration: none;
    padding: 9px 8px;
    border-bottom: 1px solid hsla(41, 38%, 50%, 0.06);
    transition: color 0.18s ease, padding-left 0.18s ease;
    display: block;
  }

  .mobile-menu__sub-link:last-child {
    border-bottom: 0;
  }

  .mobile-menu__sub-link:hover,
  .mobile-menu__sub-link:active {
    color: var(--btn-gold-hi);
    padding-left: 14px;
  }

  .mobile-menu__sub-link--cta {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--gold);
    margin-top: 4px;
  }
  .mobile-menu__link {
    font-family: 'Oswald', 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text);
    text-decoration: none;
    padding: 14px 4px;
    border-bottom: 1px solid hsla(41, 38%, 50%, 0.12);
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: color 0.2s ease, padding-left 0.2s ease;
  }
  .mobile-menu__link::after {
    content: '→';
    color: hsla(41, 60%, 55%, 0.55);
    font-size: 16px;
    transition: transform 0.2s ease, color 0.2s ease;
  }
  .mobile-menu__link:hover,
  .mobile-menu__link:active {
    color: var(--btn-gold-hi);
    padding-left: 8px;
  }
  .mobile-menu__link:hover::after {
    color: var(--btn-gold-hi);
    transform: translateX(4px);
  }

  .mobile-menu__foot {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 22px;
    border-top: 1px solid hsla(41, 38%, 50%, 0.16);
  }
  .mobile-menu__phone {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    text-decoration: none;
    letter-spacing: 0.01em;
  }
  .mobile-menu__phone svg {
    color: var(--btn-gold-hi);
    flex-shrink: 0;
  }
  .mobile-menu__lang {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
  }
  .mobile-menu__lang-link {
    color: var(--text-dim);
    text-decoration: none;
    padding: 2px 4px;
  }
  .mobile-menu__lang-link.is-active {
    color: var(--btn-gold-hi);
  }
  .mobile-menu__lang span {
    color: var(--text-dim);
    opacity: 0.5;
  }
  /* Hide drawer entirely on desktop (just in case) */
  @media (min-width: 901px) {
    .mobile-menu { display: none; }
  }

  .mobile-menu__cta {
    margin-top: 4px;
    width: 100%;
    min-width: 0;
  }
  body.has-mobile-menu-open {
    overflow: hidden;
  }

  .mobile-menu__toggle::after {
    display: none; /* SVG caret already present — suppress the CSS → arrow */
  }
  @media (min-width: 901px) {
    .mobile-menu { display: none; }
  }

/* ===== blocks/hero.css ===== */
  .hero {
    position: relative;
    height: 760px;
    min-height: 560px;
    max-height: 820px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #0a0907;
  }

  /* Desktop hero background — loaded only on ≥769px */
  @media (min-width: 769px) {
    .hero {
      /* JPG fallback for browsers without image-set()/WebP support */
      background:
        linear-gradient(108deg,
          rgba(9, 8, 7, 0.99) 0%,
          rgba(9, 8, 7, 0.96) 20%,
          rgba(9, 8, 7, 0.84) 37%,
          rgba(9, 8, 7, 0.50) 52%,
          rgba(9, 8, 7, 0.18) 66%,
          rgba(9, 8, 7, 0.04) 78%,
          transparent 88%
        ),
        url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/hero-bg-construction-equipment-kyiv.jpg) right center / cover no-repeat;
      background:
        linear-gradient(108deg,
          rgba(9, 8, 7, 0.99) 0%,
          rgba(9, 8, 7, 0.96) 20%,
          rgba(9, 8, 7, 0.84) 37%,
          rgba(9, 8, 7, 0.50) 52%,
          rgba(9, 8, 7, 0.18) 66%,
          rgba(9, 8, 7, 0.04) 78%,
          transparent 88%
        ),
        image-set(
          url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/hero-bg-construction-equipment-kyiv.webp) type('image/webp'),
          url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/hero-bg-construction-equipment-kyiv.jpg) type('image/jpeg')
        ) right center / cover no-repeat;
    }
  }

  /* Mobile machinery picture — hidden on desktop (placeholder gif served via <source>) */
  .hero__mobile-machine {
    display: none;
  }

  .hero::before {
    display: none;
  }
  
  .hero__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 60px;
    min-height: auto;
    display: block;
  }
  
  .hero__content {
    /* 736px — десктопна композиція (раніше задавалась інлайном у розмітці).
       На планшеті/мобілі звужується медіа-запитами нижче. */
    max-width: 736px;
    padding: 0;
    text-align: left;
  }
  
  .hero .eyebrow {
    margin-bottom: 24px;
    text-align: left;
    display: inline-block;
  }
  
  .hero h1 {
    font-family: 'Oswald', sans-serif;
    font-size: clamp(38px, 4.6vw, 66px);
    font-weight: 700;
    line-height: 1.02;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    color: rgb(232, 227, 217);
    margin: 0 0 20px;
    text-wrap: balance;
    text-shadow: none;
    text-align: left;
  }

  .hero .body-lg {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.65;
    color: rgba(232, 227, 217, 0.95);
    margin: 0 0 28px;
    max-width: 450px;
    text-wrap: pretty;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8), 0 1px 4px rgba(0, 0, 0, 0.9);
    text-align: left;
  }
  
  .hero__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
    flex-wrap: wrap;
  }

  /* ── Secondary CTA — force off-white text above any WP/WC cascade ── */
  /* Two-class specificity (0,2,0) wins over .btn (0,1,0) and any a {} */
  .hero__actions .btn-secondary-dark {
    color: #F1EDE4;
  }
  .hero__actions .btn-secondary-dark:hover {
    color: #FFFFFF;
  }
  
  .hero__stats {
    display: flex;
    align-items: stretch;
    gap: 32px;
    margin-top: 52px;
  }
  
  .hero__stat {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }

  /* Підписи під цифрами довіри — світліші за дефолтний dim, щоб краще читались */
  .hero__stat .caption {
    color: var(--text-on-dark-2);
  }
  
  @media (max-width: 1024px) {
    .hero__inner {
      padding: 0 40px;
    }
    .hero__content {
      max-width: 520px;
    }
  }

  @media (max-width: 860px) {
    .hero {
      background-position: 72% center;
    }
    .hero__inner {
      padding: 0 28px;
    }
    .hero__content {
      max-width: 100%;
    }
  }
  
  @media (max-width: 768px) {
    .hero {
      height: auto;
      min-height: 100svh;
      max-height: none;
      align-items: flex-start;
      overflow: hidden;
      background: linear-gradient(180deg,
        #0a0907 0%,
        #08070a 50%,
        #050403 100%);
    }

    /* Subtle gravel texture overlay */
    .hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/gravel-texture-overlay-768.webp) center / cover no-repeat;
      opacity: 0.10;
      mix-blend-mode: soft-light;
      pointer-events: none;
      z-index: 0;
    }

    /* Ground strip at bottom — grounds the machine */
    .hero::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 34%;
      background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/ground-strip-fade-alpha-768.webp) center bottom / cover no-repeat;
      opacity: 0.6;
      pointer-events: none;
      z-index: 1;
    }

    /* Transparent excavator layer — pulled up so bucket + arm sit
       inside the first screen, anchored lower-right of the hero. */
    .hero__mobile-machine {
      display: block;
      position: absolute;
      bottom: clamp(40px, 9vw, 72px);
      right: -16vw;
      width: 124vw;
      max-width: none;
      pointer-events: none;
      z-index: 2;
      filter:
        drop-shadow(0 18px 24px rgba(0, 0, 0, 0.65))
        drop-shadow(0 6px 10px rgba(0, 0, 0, 0.5));
    }
    .hero__mobile-machine img {
      display: block;
      width: 100%;
      height: auto;
    }

    /* Soft dark gradient behind text — lifts contrast over the machine */
    .hero__inner::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg,
        rgba(8, 7, 6, 0.55) 0%,
        rgba(8, 7, 6, 0.30) 38%,
        rgba(8, 7, 6, 0.00) 60%);
      pointer-events: none;
      z-index: -1;
    }

    .hero__inner {
      position: relative;
      z-index: 3;
      padding: 68px 22px 0;
    }

    .hero__content {
      max-width: 100%;
      padding-bottom: clamp(210px, 64vw, 300px);
    }

    .hero .eyebrow {
      font-size: 9.5px;
      letter-spacing: 0.14em;
      margin-bottom: 12px;
      padding: 5px 18px;
      min-height: 24px;
    }

    .hero h1 {
      font-size: clamp(28px, 8.2vw, 40px);
      margin-bottom: 10px;
      line-height: 0.96;
      letter-spacing: 0;
      word-break: break-word;
      overflow-wrap: break-word;
      hyphens: auto;
    }

    .hero .body-lg {
      font-size: 16px;
      line-height: 1.5;
      color: rgba(220, 213, 200, 0.82);
      margin: 0 0 16px;
      text-shadow: 0 2px 12px rgba(0, 0, 0, 0.7);
      max-width: 360px;
    }

    .hero__actions {
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      margin-bottom: 0;
    }

    /* Tighter mobile buttons — fit the compact hero composition */
    .hero__actions .btn {
      height: 46px;
      font-size: 12px;
      letter-spacing: 0.12em;
    }

    .hero__actions .btn-primary,
    .hero__actions .btn-secondary-dark {
      width: 100%;
      text-align: center;
      padding: 0 28px;
    }

    .hero__actions .btn-secondary {
      display: none;
    }

    .hero__stats {
      display: none;
    }
  }

/* ===== blocks/equipment.css ===== */
  .equipment {
    position: relative;
    background: var(--bg-dark);
    padding: clamp(72px, 7vw, 108px) 60px;
    border-top: 1px solid rgba(212, 164, 55, 0.07);
    overflow: hidden;
  }

  .equipment::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 180px;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/ground-strip-fade-alpha-1920x560.webp) center bottom / auto 180px repeat-x;
    opacity: 0.15;
    pointer-events: none;
    z-index: 0;
  }
  
  .equipment__inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
  }
  
  .equipment__header {
    text-align: center;
    margin-bottom: clamp(40px, 5vw, 60px);
  }
  
  .equipment__header .eyebrow {
    margin-bottom: 18px;
  }
  
  .equipment h2 {
    margin: 0 0 14px;
  }
  
  .equipment__header .body-lg {
    max-width: 640px;
    margin: 0 auto;
  }
  
  .equipment__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 40px;
  }

  /* Hide cards after 8 by default */
  .equipment__grid > .equipment__card:nth-child(n+9) { display: none; }
  .equipment__grid.is-expanded > .equipment__card { display: block; }
  
  .equipment__grid.is-expanded > .equipment__card:nth-child(n+9) {
    animation: equipFadeIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }

  @keyframes equipFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  .equipment__card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--bg-card);
    border: 1px solid rgba(212, 164, 55, 0.12);
    transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    overflow: hidden;
  }

  .equipment__card:hover {
    border-color: rgba(212, 164, 55, 0.45);
    box-shadow: 0 0 0 1px rgba(212, 164, 55, 0.25), 0 8px 24px rgba(0, 0, 0, 0.6);
    transform: translateY(-3px);
  }

  /* Image wrapper — задає пропорції 4:3 */
  .equipment__img-wrap {
    position: relative;
    aspect-ratio: 4 / 3;
    width: 100%;
    overflow: hidden;
    flex-shrink: 0;
  }

  /* Легкий вінет знизу — не закриває техніку */
  .equipment__img-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
      rgba(0,0,0,0) 55%,
      rgba(8,9,8,0.28) 100%);
    pointer-events: none;
    z-index: 1;
  }

  .equipment__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: brightness(0.90) saturate(0.90);
  }

  .equipment__card:hover .equipment__img {
    transform: scale(1.05);
    filter: brightness(1.00) saturate(1.00);
  }

  /* Gold accent line знизу картки */
  .equipment__card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--gold) 50%, transparent);
    opacity: 0;
    z-index: 2;
    transition: opacity 0.35s ease;
  }

  .equipment__card:hover::after {
    opacity: 0.7;
  }

  /* Назва — окрема плашка під фото */
  .equipment__card h3 {
    position: static;
    margin: 0;
    padding: 13px 16px;
    text-align: center;
    background: #111412;
    border-top: 1px solid rgba(212, 164, 55, 0.10);
    font-size: 13px;
    line-height: 1.3;
    transition: color 0.3s ease, background 0.3s ease;
  }

  .equipment__card:hover h3 {
    color: var(--gold-bright);
    background: #141814;
  }
  
  .equipment__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
  }
  
  @media (max-width: 1024px) {
    .equipment__grid {
      grid-template-columns: repeat(2, 1fr);
    }
    .equipment__grid > .equipment__card:nth-child(n+7) { display: none; }
    .equipment__grid.is-expanded > .equipment__card { display: block; }
  }
  
  @media (max-width: 640px) {
    .equipment {
      padding: clamp(60px, 8vw, 80px) 22px;
    }
    
    .equipment__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      margin-bottom: 32px;
    }

    .equipment__grid > .equipment__card:nth-child(n+5) { display: none; }
    .equipment__grid.is-expanded > .equipment__card { display: block; }

    .equipment__card h3 {
      font-size: 13.5px;
      padding: 14px 16px;
    }

    .equipment__cta {
      flex-direction: column-reverse;
      gap: 10px;
    }

    .equipment__cta .btn {
      width: 100%;
      max-width: 320px;
    }
  }

/* ===== blocks/projects.css ===== */
  .projects {
    position: relative;
    background: #0e0f0e;
    border-top: 1px solid rgba(226, 170, 31, 0.07);
    overflow: hidden;
    padding: clamp(72px, 7vw, 108px) 60px;
  }
  
  .projects__inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
  }
  
  .projects__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: clamp(40px, 5vw, 60px);
  }

  .projects__header-left {
    max-width: 600px;
  }
  
  .projects__header .eyebrow {
    margin-bottom: 18px;
  }
  
  .projects h2 {
    margin: 0 0 14px;
  }
  
  .projects__header .body-lg {
    color: rgba(200, 192, 178, 0.66);
  }

  .projects__btn-all {
    flex-shrink: 0;
    white-space: nowrap;
  }
  
  .projects__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  
  .projects__card {
    display: flex;
    flex-direction: column;
    background: #121412;
    border: 1px solid rgba(226, 170, 31, 0.08);
    overflow: hidden;
    transition: border-color 0.3s ease, transform 0.3s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
  }
  
  .projects__card:hover {
    border-color: rgba(226, 170, 31, 0.28);
    transform: translateY(-3px);
  }
  
  .projects__image {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
  }
  
  .projects__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: brightness(0.88) saturate(0.90);
  }
  
  .projects__card:hover .projects__image img {
    transform: scale(1.05);
  }

  .projects__image::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: linear-gradient(to top, rgba(18, 20, 18, 0.65) 0%, transparent 100%);
    pointer-events: none;
    z-index: 1;
  }
  
  .projects__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 20px 22px;
  }

  .projects__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
  }

  .projects__category {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(226, 170, 31, 0.70);
  }

  .projects__date {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    color: rgba(200, 192, 178, 0.50);
  }

  .projects__body h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.01em;
    color: rgb(232, 227, 217);
    margin: 0 0 10px;
  }

  .projects__body p {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    line-height: 1.60;
    color: rgba(200, 192, 178, 0.62);
    margin: 0;
  }
  
  @media (max-width: 1024px) {
    .projects__header {
      flex-direction: column;
      align-items: flex-start;
    }

    .projects__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  @media (max-width: 640px) {
    .projects {
      padding: clamp(60px, 8vw, 80px) 22px;
    }

    .projects__grid {
      grid-template-columns: 1fr;
      gap: 16px;
    }
  }

/* ── Dynamic projects block (replaces static .projects section) ────── */
.projects-block {
  position: relative;
  background: #0e0f0e;
  border-top: 1px solid rgba(226, 170, 31, 0.07);
  padding: clamp(72px, 7vw, 108px) 0;
}

.projects-block__inner {
  position: relative;
  z-index: 1;
  max-width: 1320px;
  margin: 0 auto;
  padding-left: 80px;
  padding-right: 80px;
}

.projects-block__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 48px;
}

.projects-block__header-left {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.projects-block__header-left h2 {
  color: var(--text-on-dark);
  margin: 0;
}

.projects-block__header-left .body-lg {
  color: var(--text-on-dark-2);
  max-width: 600px;
}

.projects-block__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

@media (max-width: 1024px) {
  .projects-block__inner { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 860px) {
  .projects-block__header { flex-direction: column; align-items: flex-start; }
  .projects-block__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .projects-block { padding: clamp(60px, 8vw, 80px) 0; }
  .projects-block__inner { padding-left: 24px; padding-right: 24px; }
  .projects-block__grid { grid-template-columns: 1fr; gap: 12px; }
}

/* ===== blocks/trust-logos.css ===== */
  .clients {
    background: var(--bg-darker);
    padding: clamp(60px, 7vw, 80px) 60px;
    border-bottom: 1px solid rgba(212, 164, 55, 0.08);
  }
  
  .clients__inner {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
  }
  
  .clients .eyebrow {
    margin-bottom: 18px;
  }
  
  .clients h2 {
    margin: 0 0 clamp(40px, 5vw, 56px);
  }
  
  .clients__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1px;
    background: rgba(212, 164, 55, 0.12);
    border: 1px solid rgba(212, 164, 55, 0.12);
  }
  
  .clients__logo {
    aspect-ratio: 3/2;
    background: var(--bg-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    position: relative;
  }
  
  .clients__logo:hover {
    background: rgba(212, 164, 55, 0.04);
  }
  
  .clients__logo img {
    max-width: var(--logo-w, 70%);
    max-height: var(--logo-h, 48%);
    width: auto;
    height: auto;
    object-fit: contain;
    /* Invert + desaturate so white bg → matches dark tile, colored marks → soft light gray */
    filter: invert(1) grayscale(1) brightness(1.05) contrast(0.78);
    opacity: 0.62;
    transition: filter 0.35s ease, opacity 0.35s ease, transform 0.35s ease;
    will-change: filter, opacity;
  }
  
  .clients__logo:hover img {
    filter: none;
    opacity: 1;
    transform: scale(1.04);
  }
  
  @media (max-width: 1024px) {
    .clients__grid {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  
  @media (max-width: 640px) {
    .clients {
      padding: clamp(48px, 7vw, 60px) 22px;
    }
    
    .clients__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

/* ===== blocks/about.css ===== */
  .about {
    position: relative;
    background: #0c0d0c;
    padding: clamp(72px, 7vw, 108px) 60px;
    overflow: hidden;
    border-top: 1px solid rgba(226, 170, 31, 0.08);
  }
  
  /* Subtle texture overlay */
  .about::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/gravel-texture-overlay-1920.webp) center / cover no-repeat;
    opacity: 0.09;
    mix-blend-mode: soft-light;
    pointer-events: none;
    z-index: 0;
  }

  /* Bottom ground strip with parallax effect */
  .about::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42%;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/ground-strip-fade-alpha-1920x560.webp) center bottom / cover no-repeat;
    opacity: 0.72;
    pointer-events: none;
    z-index: 0;
  }
  
  .about__inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 58% 42%;
    gap: 48px;
    align-items: center;
  }
  
  .about__left {
    display: flex;
    flex-direction: column;
    gap: clamp(24px, 3vw, 36px);
    min-width: 0;
  }
  
  .about__intro {
    max-width: 580px;
  }
  
  .about__intro h2 {
    margin: 0 0 16px;
  }
  
  .about__intro .body p {
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 1.65;
  }
  
  .about__intro .body p:last-child {
    margin-bottom: 0;
  }
  
  .about__machinery {
    position: relative;
    margin-left: -60px;
  }
  
  .about__machinery img {
    width: 118%;
    max-width: none;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 28px 60px rgba(0, 0, 0, 0.72))
            drop-shadow(0 10px 20px rgba(0, 0, 0, 0.54));
  }
  
  /* Contact shadow under bulldozer */
  .about__machinery::before {
    content: '';
    position: absolute;
    bottom: -16px;
    left: 10%;
    width: 68%;
    height: 36px;
    background: radial-gradient(ellipse 100% 50% at 50% 50%,
      rgba(0, 0, 0, 0.68) 0%,
      rgba(0, 0, 0, 0.36) 42%,
      transparent 100%);
    filter: blur(12px);
    z-index: 0;
  }
  
  .about__content {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding-bottom: 40px;
  }
  
  .about__content .eyebrow {
    align-self: flex-start;
  }
  
  .about__trust {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 6px;
  }
  
  .about__trust-card {
    padding: 16px 18px;
    border-left: 2px solid rgba(212, 164, 55, 0.48);
    background: rgba(17, 20, 18, 0.5);
    border: 1px solid rgba(212, 164, 55, 0.14);
    border-left: 2px solid rgba(212, 164, 55, 0.48);
    transition: all 0.28s ease;
  }
  
  .about__trust-card h3 {
    margin-bottom: 5px;
    color: var(--gold);
    font-size: 15px;
  }
  
  .about__trust-card p {
    font-size: 13px;
    line-height: 1.55;
  }
  
  .about__trust-card:hover {
    border-left-color: var(--gold);
    background: rgba(17, 20, 18, 0.7);
  }
  
  @media (max-width: 1024px) {
    .about__inner {
      grid-template-columns: 1fr;
      gap: 48px;
    }
    
    .about__left {
      order: 1;
    }
    
    .about__machinery {
      margin-left: 0;
    }
    
    .about__machinery img {
      width: 100%;
    }
    
    .about__content {
      order: 2;
    }
  }

  @media (max-width: 768px) {
    .about {
      padding: clamp(60px, 8vw, 80px) 22px;
    }
  }

  @media (max-width: 640px) {
    .about::before { opacity: 0.05; }
    .about::after { height: 28%; opacity: 0.50; }
    .about {
      padding: clamp(40px, 8vw, 52px) 22px 0;
    }
    .about__inner {
      gap: 32px;
    }
  }

/* ═══════════════════════════════════════════════════════════════════
   ABOUT PAGE — page-pro-nas.php
   ═══════════════════════════════════════════════════════════════════ */

/* ── Hero (dark) ────────────────────────────────────────────────────── */
.about-hero {
  background: var(--bg-dark);
  padding: 64px 0 56px;
}

.about-hero .eyebrow { display: block; margin-bottom: 16px; }

.about-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.about-hero__subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 640px;
}

/* ── Stats (dark) ───────────────────────────────────────────────────── */
.about-stats {
  background: var(--bg-dark-2);
  padding: 72px 0;
  border-top: 1px solid var(--border-dark);
  border-bottom: 1px solid var(--border-dark);
}

.about-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--gold-line);
  border: 1px solid var(--gold-line);
}

.about-stat {
  background: var(--bg-dark-2);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
}

.about-stat__number {
  font-family: 'Oswald', sans-serif;
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
  color: var(--gold-text);
  letter-spacing: 0.02em;
}

.about-stat__label {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-on-dark-2);
}

@media (max-width: 900px) {
  .about-stats__grid { grid-template-columns: repeat(2, 1fr); }
  .about-stat { padding: 32px 24px; }
  .about-stat__number { font-size: 40px; }
}

@media (max-width: 480px) {
  .about-stats__grid { grid-template-columns: repeat(2, 1fr); }
  .about-stat { padding: 24px 16px; }
  .about-stat__number { font-size: 32px; }
}

/* ── Clients logos (dark) ───────────────────────────────────────────── */
.about-clients {
  background: var(--bg-dark-2);
  padding: 80px 0;
  border-top: 1px solid var(--border-dark);
}

.about-clients__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(24px, 3vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 48px;
  text-align: center;
}

.about-clients__grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 40px 64px;
}

.about-client-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.65;
  transition: opacity 0.25s ease;
}

.about-client-logo:hover { opacity: 1; }

.about-client-logo img {
  max-height: 56px;
  max-width: 160px;
  width: auto;
  height: auto;
  display: block;
  filter: brightness(0) invert(1);
}

/* ── CTA (dark) ─────────────────────────────────────────────────────── */
.about-cta {
  background: var(--bg-dark);
  padding: 96px 0;
  text-align: center;
  border-top: 1px solid var(--border-dark);
}

.about-cta__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 3vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.about-cta__sub {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  color: var(--text-on-dark-2);
  max-width: 520px;
  margin: 0 auto 40px;
}

@media (max-width: 768px) {
  .about-hero { padding: 48px 0 40px; }
  .about-hero__title { font-size: 40px; }
  .about-hero__subtitle { font-size: 16px; }
  .about-stats { padding: 48px 0; }
  .about-clients { padding: 56px 0; }
  .about-clients__grid { gap: 28px 40px; }
  .about-cta { padding: 64px 0; }
  .about-cta__title { font-size: 32px; }
  .about-cta__sub { font-size: 16px; }
}

/* ===== blocks/advantages.css ===== */
  .advantages {
    position: relative;
    background: #0c0d0c;
    border-top: 1px solid rgba(212, 164, 55, 0.07);
    padding: clamp(72px, 7vw, 108px) 60px clamp(64px, 7vw, 96px);
    overflow: hidden;
  }
  
  .advantages::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/advantages-bg-construction-ukraine.jpg) center / cover;
    background: image-set(
      url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/advantages-bg-construction-ukraine.webp) type('image/webp'),
      url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/advantages-bg-construction-ukraine.jpg) type('image/jpeg')
    ) center / cover;
    opacity: 0.06;
    z-index: 0;
  }
  
  .advantages__inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
  }
  
  .advantages__header {
    text-align: center;
    margin-bottom: clamp(40px, 5vw, 60px);
  }
  
  .advantages__header .eyebrow {
    margin-bottom: 18px;
  }
  
  .advantages h2 {
    margin: 0 0 14px;
  }
  
  .advantages__header .body-lg {
    max-width: 560px;
    margin: 0 auto;
  }
  
  .advantages__grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-bottom: 48px;
  }
  
  .advantages__card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px 26px;
    background: linear-gradient(180deg, #131614 0%, #0f1110 100%);
    border: 1px solid rgba(212, 164, 55, 0.10);
    position: relative;
    transition: all 0.32s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: hidden;
  }
  
  /* Subtle inner texture - gravel feel */
  .advantages__card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/texture-dirt-bg.webp) center / cover no-repeat;
    opacity: 0.04;
    mix-blend-mode: overlay;
    pointer-events: none;
  }
  
  .advantages__card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 24px;
    width: 40px;
    height: 2px;
    background: linear-gradient(to right, var(--gold), rgba(212, 164, 55, 0));
    transition: width 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 2;
  }
  
  .advantages__card:hover {
    border-color: rgba(212, 164, 55, 0.32);
    transform: translateY(-3px);
    box-shadow: 0 22px 48px -22px rgba(0, 0, 0, 0.8);
  }
  
  .advantages__card:hover::before {
    width: 72px;
  }
  
  /* Emblem block - holds number + pictogram */
  .advantages__emblem {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(212, 164, 55, 0.12);
    position: relative;
    z-index: 1;
  }
  
  .advantages__num {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.02em;
    color: rgba(212, 164, 55, 0.55);
  }
  
  .advantages__pictogram {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    filter: drop-shadow(0 2px 6px rgba(212, 164, 55, 0.18));
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  
  .advantages__card:hover .advantages__pictogram {
    transform: scale(1.06);
  }
  
  .advantages__pictogram svg {
    width: 100%;
    height: 100%;
  }
  
  .advantages__card h3 {
    margin: 0 0 10px;
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.015em;
    color: rgb(232, 227, 217);
    line-height: 1.18;
    position: relative;
    z-index: 1;
  }
  
  .advantages__card p {
    margin: 0;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: rgba(200, 192, 178, 0.65);
    text-wrap: pretty;
    position: relative;
    z-index: 1;
  }
  
  .advantages__cta {
    text-align: center;
  }
  
  @media (max-width: 1200px) {
    .advantages__grid {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  
  @media (max-width: 860px) {
    .advantages__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  @media (max-width: 640px) {
    .advantages {
      padding: clamp(48px, 8vw, 64px) 22px;
    }
    
    .advantages__grid {
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-bottom: 28px;
    }
    
    .advantages__card {
      padding: 22px 18px 18px;
    }
    
    .advantages__emblem {
      margin-bottom: 16px;
      padding-bottom: 14px;
    }
    
    .advantages__num {
      font-size: 18px;
    }
    
    .advantages__pictogram {
      width: 44px;
      height: 44px;
    }
    
    .advantages__card h3 {
      font-size: 15px;
    }
    
    .advantages__card p {
      font-size: 16px;
    }
  }

/* ===== blocks/services.css ===== */
  /* ═══════════════════════════════════════════════════════════════ */
  /* SERVICES SECTION — PREMIUM INDUSTRIAL PHOTO CARDS               */
  /* ═══════════════════════════════════════════════════════════════ */
  .services {
    position: relative;
    background: #0a0b0a;
    padding: clamp(64px, 7vw, 96px) 60px;
    border-top: 1px solid rgba(226, 170, 31, 0.08);
    overflow: hidden;
  }

  .services::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/texture-dirt-bg.webp) left top / 480px repeat;
    opacity: 0.04;
    mix-blend-mode: overlay;
    pointer-events: none;
    z-index: 0;
  }
  
  .services__inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
  }
  
  .services__header {
    text-align: center;
    margin-bottom: clamp(40px, 5vw, 56px);
  }
  
  .services__header .eyebrow {
    margin-bottom: 18px;
  }
  
  .services h2 {
    margin: 0 0 14px;
  }
  
  .services__intro {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.65;
    color: rgba(200, 192, 178, 0.64);
    max-width: 640px;
    margin: 0 auto;
    text-wrap: pretty;
  }
  
  /* Grid: 4 columns */
  .services__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: clamp(40px, 5vw, 56px);
  }

  /* Service card with photo */
  .services__card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #0f100f;
    border: 1px solid rgba(226, 170, 31, 0.10);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: all 0.32s ease;
  }

  .services__card:hover {
    border-color: rgba(226, 170, 31, 0.32);
    transform: translateY(-2px);
  }

  .services__image {
    position: relative;
    width: 100%;
    height: 180px;
    overflow: hidden;
  }

  .services__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
  }

  .services__card:hover .services__image img {
    transform: scale(1.06);
  }

  .services__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
      rgba(9, 8, 7, 0.20) 0%,
      rgba(9, 8, 7, 0.65) 60%,
      rgba(9, 8, 7, 0.88) 100%);
    pointer-events: none;
  }

  .services__body {
    padding: 20px 18px 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
  }

  .services__title {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: rgb(232, 227, 217);
    margin: 0 0 10px;
    line-height: 1.15;
  }

  .services__text {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.58;
    color: rgba(200, 192, 178, 0.58);
    margin: 0 0 16px;
    flex: 1;
    text-wrap: pretty;
  }

  .services__link {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--gold-color);
    transition: color 0.22s ease;
  }

  .services__card:hover .services__link {
    color: var(--gold-bright);
  }

  /* CTA buttons */
  .services__cta {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
  }

  /* Responsive */
  @media (max-width: 1200px) {
    .services__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
    }
  }

  @media (max-width: 640px) {
    .services {
      padding: clamp(56px, 8vw, 72px) 22px;
    }

    .services__grid {
      grid-template-columns: 1fr;
      gap: 14px;
    }

    .services__image {
      height: 160px;
    }

    .services__cta {
      flex-direction: column;
      gap: 10px;
    }

    .services__cta .btn {
      width: 100%;
    }
  }

/* ===== blocks/customer-types.css ===== */
  /* ─── Compact trust strip: who we work with ────────────────────── */
  .client-types {
    background: var(--bg-darker);
    border-top: 1px solid rgba(212, 164, 55, 0.07);
    border-bottom: 1px solid rgba(212, 164, 55, 0.07);
    padding: clamp(56px, 6vw, 80px) 60px;
  }

  .client-types__inner {
    max-width: 1200px;
    margin: 0 auto;
  }

  /* ── Header ──────────────────────────────────────────────────── */
  .client-types__header {
    text-align: center;
    margin-bottom: clamp(28px, 3vw, 40px);
  }

  .client-types__header .eyebrow { margin-bottom: 14px; }

  .client-types__h2 {
    font-family: 'Oswald', sans-serif;
    font-size: clamp(22px, 2.6vw, 32px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--text);
    margin: 0 0 12px;
    text-wrap: balance;
  }

  .client-types__lead {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    line-height: 1.62;
    color: rgba(200, 192, 178, 0.72);
    max-width: 660px;
    margin: 0 auto;
    text-wrap: pretty;
  }

  /* ── Cards ───────────────────────────────────────────────────── */
  .client-types__cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }

  .client-types__card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 28px 28px 24px;
    background: linear-gradient(168deg, #131614 0%, #0f1110 100%);
    border: 1px solid rgba(212, 164, 55, 0.12);
    border-left: 2px solid rgba(212, 164, 55, 0.40);
    overflow: hidden;
    transition: border-color 0.26s ease,
                border-left-color 0.26s ease,
                transform 0.26s cubic-bezier(.2,.7,.2,1),
                box-shadow 0.26s ease;
  }

  /* Top-edge gold hairline */
  .client-types__card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: linear-gradient(90deg,
      rgba(212,164,55,0) 0%,
      rgba(212,164,55,.28) 40%,
      rgba(212,164,55,.28) 60%,
      rgba(212,164,55,0) 100%);
    pointer-events: none;
  }

  .client-types__card:hover {
    border-color: rgba(212, 164, 55, 0.26);
    border-left-color: rgba(212, 164, 55, 0.80);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.38);
  }

  /* ── Card header: icon + title inline ──────────────────────── */
  .client-types__card-head {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .client-types__icon {
    color: var(--btn-gold-top);
    flex-shrink: 0;
    opacity: 0.85;
  }

  .client-types__card-title {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text);
    line-height: 1.15;
    margin: 0;
  }

  /* ── Body text ──────────────────────────────────────────────── */
  .client-types__card-text {
    font-family: 'Inter', sans-serif;
    font-size: 13.5px;
    line-height: 1.58;
    color: rgba(200, 192, 178, 0.62);
    margin: 0;
    text-wrap: pretty;
  }

  /* ── Bullet list — flex so dot is flush-left, always aligned ─ */
  .client-types__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex: 1;
  }

  .client-types__list li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-family: 'Inter', sans-serif;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--text-muted);
  }

  .client-types__list li::before {
    content: '';
    display: block;
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(212, 164, 55, 0.65);
    margin-top: 7px;
  }

  /* ── CTA text link ──────────────────────────────────────────── */
  .client-types__cta {
    align-self: flex-start;
    background: none;
    border: 0;
    padding: 0;
    margin-top: 4px;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gold);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: color 0.18s ease;
    -webkit-tap-highlight-color: transparent;
  }

  .client-types__cta:hover { color: var(--gold-bright); }
  .client-types__cta span { display: inline-block; transition: transform 0.2s ease; }
  .client-types__cta:hover span { transform: translateX(3px); }

  /* ── Mobile ─────────────────────────────────────────────────── */
  @media (max-width: 768px) {
    .client-types {
      padding: clamp(44px, 7vw, 60px) 22px;
    }
    .client-types__cards {
      grid-template-columns: 1fr;
      gap: 12px;
    }
    .client-types__card {
      padding: 22px 20px 20px;
      gap: 10px;
    }
    .client-types__card-title { font-size: 16px; }
    .client-types__card-text,
    .client-types__list li  { font-size: 14px; }
  }

/* ===== blocks/reviews.css ===== */
  .reviews {
    position: relative;
    /* Texture background ported from the About block ("Професійна оренда") */
    background: #0c0d0c;
    padding: clamp(80px, 9vw, 120px) 60px;
    overflow: hidden;
  }

  /* Subtle texture overlay (same treatment as .about) */
  .reviews::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/gravel-texture-overlay-1920.webp) center / cover no-repeat;
    opacity: 0.09;
    mix-blend-mode: soft-light;
    pointer-events: none;
    z-index: 0;
  }

  /* Bottom ground strip (same treatment as .about) */
  .reviews::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42%;
    background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/ground-strip-fade-alpha-1920x560.webp) center bottom / cover no-repeat;
    opacity: 0.72;
    pointer-events: none;
    z-index: 0;
  }
  
  .reviews__inner {
    position: relative;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
  }
  
  .reviews__header {
    text-align: center;
    margin-bottom: clamp(56px, 6vw, 80px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }
  
  .reviews__header .eyebrow {
    margin-bottom: 24px;
  }
  
  .reviews h2 {
    margin: 0 0 24px;
    line-height: 1.1;
  }
  
  .reviews__subtitle {
    max-width: 580px;
    color: rgba(220, 213, 200, 0.72);
    font-size: 15px;
    line-height: 1.7;
    margin: 0 0 32px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
  }
  
  .reviews__divider {
    display: block;
    width: 84px;
    height: 1px;
    background: linear-gradient(90deg,
      rgba(212, 164, 55, 0) 0%,
      rgba(232, 200, 120, 0.6) 50%,
      rgba(212, 164, 55, 0) 100%);
  }
  
  .reviews__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
  }

  /* ─── Premium dark metallic card ───────────────────────────────── */
  .reviews__card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 32px 30px 30px;
    background:
      radial-gradient(ellipse 70% 50% at 30% 0%,
        rgba(212, 164, 55, 0.07) 0%,
        rgba(212, 164, 55, 0.00) 60%),
      linear-gradient(168deg,
        rgba(28, 22, 12, 0.95) 0%,
        rgba(16, 13, 8, 0.92) 50%,
        rgba(10, 9, 6, 0.92) 100%);
    border: 1px solid rgba(212, 164, 55, 0.18);
    box-shadow:
      inset 0 1px 0 rgba(212, 164, 55, 0.10),
      inset 0 -1px 0 rgba(0, 0, 0, 0.4),
      0 12px 28px rgba(0, 0, 0, 0.32);
    overflow: hidden;
    isolation: isolate;
    transition:
      transform 0.4s cubic-bezier(.2,.7,.2,1),
      border-color 0.35s ease,
      box-shadow 0.4s ease;
  }

  /* Top-edge gold hairline highlight */
  .reviews__card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: linear-gradient(90deg,
      rgba(212, 164, 55, 0)   0%,
      rgba(232, 200, 120, 0.55) 30%,
      rgba(232, 200, 120, 0.55) 70%,
      rgba(212, 164, 55, 0)   100%);
    pointer-events: none;
  }

  /* Soft warm bloom in bottom-right (asymmetric depth) */
  .reviews__card::after {
    content: '';
    position: absolute;
    right: -30%;
    bottom: -35%;
    width: 80%;
    aspect-ratio: 1;
    background: radial-gradient(circle,
      rgba(212, 164, 55, 0.10) 0%,
      rgba(212, 164, 55, 0.00) 65%);
    pointer-events: none;
    z-index: 0;
    transition: opacity 0.4s ease;
  }

  /* Diagonal light sweep — appears on hover */
  .reviews__sheen {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 1;
  }
  .reviews__sheen::before {
    content: '';
    position: absolute;
    top: 0;
    left: -60%;
    width: 50%;
    height: 100%;
    background: linear-gradient(115deg,
      rgba(255, 230, 170, 0)   0%,
      rgba(255, 230, 170, 0)   42%,
      rgba(255, 230, 170, 0.14) 50%,
      rgba(255, 230, 170, 0)   58%,
      rgba(255, 230, 170, 0)   100%);
    transform: translateX(0);
    transition: transform 0.85s cubic-bezier(.2,.7,.2,1);
  }

  /* Decorative quote mark — subtle, in the corner */
  .reviews__quote-mark {
    position: absolute;
    top: 12px;
    right: 18px;
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 110px;
    line-height: 1;
    color: rgba(212, 164, 55, 0.10);
    pointer-events: none;
    z-index: 0;
    transition: color 0.4s ease;
  }

  .reviews__card-header {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 16px;
  }

  /* Circular avatar with gold rim — initials */
  .reviews__avatar {
    position: relative;
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background:
      linear-gradient(180deg,
        rgba(212, 164, 55, 0.55) 0%,
        rgba(110, 83, 24, 0.55) 100%);
    padding: 1.5px;
    box-shadow:
      0 0 0 1px rgba(0, 0, 0, 0.5) inset,
      0 4px 10px rgba(0, 0, 0, 0.4);
    transition: filter 0.35s ease;
  }
  .reviews__avatar span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background:
      radial-gradient(circle at 30% 25%,
        rgba(212, 164, 55, 0.18) 0%,
        rgba(0, 0, 0, 0) 65%),
      linear-gradient(160deg, #1A1610 0%, #0C0A06 100%);
    color: var(--btn-gold-hi);
    font-family: 'Oswald', sans-serif;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.05em;
  }

  .reviews__meta {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
  }

  .reviews__stars {
    font-size: 13px;
    color: var(--gold);
    letter-spacing: 3px;
    line-height: 1;
    margin-bottom: 2px;
    text-shadow: 0 0 6px rgba(212, 164, 55, 0.2);
    transition: color 0.35s ease, text-shadow 0.35s ease;
  }

  .reviews__name {
    font-family: 'Oswald', sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--gold-bright);
    margin: 0;
    line-height: 1.15;
  }

  .reviews__company {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    color: var(--text-dim);
    margin: 0;
    line-height: 1.3;
    letter-spacing: 0.02em;
  }

  .reviews__text {
    position: relative;
    z-index: 2;
    flex: 1;
    font-size: 15px;
    line-height: 1.72;
    color: rgba(220, 213, 200, 0.86);
    margin: 0;
  }

  /* ─── Hover ────────────────────────────────────────────────────── */
  .reviews__card:hover {
    transform: translateY(-4px);
    border-color: rgba(212, 164, 55, 0.42);
    box-shadow:
      inset 0 1px 0 rgba(232, 200, 120, 0.18),
      inset 0 -1px 0 rgba(0, 0, 0, 0.4),
      0 22px 44px rgba(0, 0, 0, 0.45),
      0 0 0 1px rgba(212, 164, 55, 0.06);
  }
  .reviews__card:hover::after {
    opacity: 1.4;
  }
  .reviews__card:hover .reviews__sheen::before {
    transform: translateX(420%);
  }
  .reviews__card:hover .reviews__quote-mark {
    color: rgba(212, 164, 55, 0.18);
  }
  .reviews__card:hover .reviews__stars {
    color: var(--gold-bright);
    text-shadow: 0 0 8px rgba(232, 185, 70, 0.35);
  }
  .reviews__card:hover .reviews__avatar {
    filter: brightness(1.1);
  }

  @media (max-width: 1024px) {
    .reviews__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  @media (max-width: 640px) {
    .reviews {
      padding: clamp(60px, 8vw, 80px) 22px;
    }
    
    .reviews__grid {
      grid-template-columns: 1fr;
      gap: 20px;
    }
  }

/* ===== blocks/order.css ===== */
/* ═══════════════════════════════════════════════════════════════ */
/* ORDER — "Як замовити техніку" section                          */
/* ═══════════════════════════════════════════════════════════════ */
.order {
  --pv-gold: var(--gold-color, hsl(41, 65%, 56%));
  --pv-gold-bright: var(--gold-bright, hsl(45, 80%, 68%));
  --pv-text: #ede4cc;
  --pv-text-muted: #9c9286;
  --pv-input-bg: hsla(40, 10%, 5%, 0.65);
  --pv-input-border: hsla(41, 30%, 40%, 0.28);
  --pv-input-border-focus: hsla(41, 60%, 55%, 0.75);

  position: relative;
  isolation: isolate;
  /* Texture background ported from the About block ("Професійна оренда") */
  background: #0c0d0c;
  padding: clamp(48px, 6vw, 88px) clamp(20px, 4vw, 60px);
  overflow: hidden;
  color: var(--pv-text);
}

/* Subtle texture overlay (same treatment as .about) */
.order::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/gravel-texture-overlay-1920.webp) center / cover no-repeat;
  opacity: 0.09;
  mix-blend-mode: soft-light;
  pointer-events: none;
  z-index: 0;
}

/* Bottom ground strip (same treatment as .about) */
.order::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 42%;
  background: url(https://staging.platis.com.ua/wp-content/themes/platis-theme/assets/images/ground-strip-fade-alpha-1920x560.webp) center bottom / cover no-repeat;
  opacity: 0.72;
  pointer-events: none;
  z-index: 0;
}

.order__inner {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
}

/* ── Header ──────────────────────────────────────────────────── */
.order__header {
  text-align: center;
  margin-bottom: clamp(32px, 5vw, 56px);
}

.order__header .eyebrow {
  margin-bottom: clamp(14px, 2vw, 20px);
}

.order h2 {
  font-family: 'Oswald', 'Inter', sans-serif;
  font-size: clamp(32px, 5.5vw, 56px);
  font-weight: 600;
  text-transform: uppercase;
  color: var(--pv-gold-bright);
  letter-spacing: 0.02em;
  line-height: 0.95;
  margin: 0;
}

/* ── 2-column layout ─────────────────────────────────────────── */
.order__content {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: clamp(24px, 3.5vw, 48px);
  align-items: start;
}

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

/* ── Shared panel material ───────────────────────────────────── */
.order__step,
.order__form {
  background:
    radial-gradient(ellipse 90% 100% at 50% -10%,
      hsla(41, 55%, 50%, 0.08) 0%,
      hsla(41, 55%, 50%, 0.00) 55%),
    linear-gradient(168deg,
      hsla(40, 14%, 11%, 0.78) 0%,
      hsla(40, 10%, 7%, 0.82) 100%);
  border: 1px solid hsla(41, 38%, 50%, 0.18);
  box-shadow:
    inset 0 1px 0 hsla(41, 70%, 70%, 0.06),
    inset 0 -20px 30px -20px rgba(0, 0, 0, 0.55),
    0 8px 22px -12px rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* ── Step cards (left column) ────────────────────────────────── */
.order__steps {
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.8vw, 20px);
}

.order__step {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: clamp(16px, 2.2vw, 24px);
  align-items: center;
  padding: clamp(18px, 2.4vw, 26px) clamp(20px, 2.8vw, 32px);
  border-left: 2px solid hsla(41, 60%, 52%, 0.55);
  transition: border-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
  position: relative;
  overflow: hidden;
}

.order__step::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 100% 100%,
    rgba(0, 0, 0, 0.35) 0%,
    rgba(0, 0, 0, 0) 60%);
  pointer-events: none;
  z-index: 0;
}

.order__step > * { position: relative; z-index: 1; }

.order__step:hover {
  border-left-color: hsla(41, 70%, 58%, 0.85);
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 hsla(41, 70%, 70%, 0.10),
    inset 0 -20px 30px -20px rgba(0, 0, 0, 0.55),
    0 14px 32px -14px rgba(0, 0, 0, 0.65),
    0 0 0 1px hsla(41, 55%, 50%, 0.12);
}

.order__step .number-lg {
  font-family: 'Oswald', 'Inter', sans-serif;
  font-size: clamp(40px, 5vw, 56px);
  font-weight: 500;
  letter-spacing: -0.04em;
  color: var(--pv-gold);
  line-height: 0.85;
  opacity: 0.92;
  flex-shrink: 0;
}

.order__step h3 {
  font-family: 'Inter', sans-serif;
  font-size: clamp(15px, 1.5vw, 18px);
  font-weight: 600;
  color: var(--pv-text);
  margin: 0 0 4px;
  line-height: 1.2;
}

.order__step .body-sm {
  font-family: 'Inter', sans-serif;
  font-size: clamp(12px, 1.2vw, 14px);
  color: var(--pv-text-muted);
  line-height: 1.45;
  margin: 0;
}

/* ── Step icon plate ─────────────────────────────────────────── */
.order__step-icon {
  position: relative;
  width: clamp(58px, 6vw, 72px);
  height: clamp(58px, 6vw, 72px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 14px;
  background: linear-gradient(180deg,
    hsla(41, 38%, 38%, 0.65) 0%,
    hsla(41, 22%, 18%, 0.7) 55%,
    hsla(40, 12%, 8%, 0.85) 100%);
  box-shadow:
    inset 0 1px 0 hsla(41, 70%, 70%, 0.16),
    inset 0 -8px 14px -6px rgba(0, 0, 0, 0.55),
    0 4px 10px rgba(0, 0, 0, 0.35);
  transition: transform 0.4s cubic-bezier(.2,.7,.2,1), box-shadow 0.4s ease;
  isolation: isolate;
}

.order__step-icon::before {
  content: '';
  position: absolute;
  inset: 1.5px;
  border-radius: 12.5px;
  background:
    linear-gradient(180deg,
      hsla(41, 50%, 35%, 0.14) 0%,
      hsla(41, 30%, 18%, 0.00) 38%),
    linear-gradient(168deg, #181410 0%, #0B0905 100%);
  z-index: 0;
}

.order__step-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 14px;
  background: linear-gradient(180deg,
    rgba(255, 232, 180, 0.18) 0%,
    rgba(255, 232, 180, 0) 12%);
  pointer-events: none;
  z-index: 2;
}

.order__step-icon svg {
  position: relative;
  width: 54%;
  height: 54%;
  overflow: visible;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.55));
  z-index: 1;
  transition: transform 0.4s cubic-bezier(.2,.7,.2,1);
}

.order__step:hover .order__step-icon {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 hsla(41, 70%, 70%, 0.22),
    inset 0 -8px 14px -6px rgba(0, 0, 0, 0.55),
    0 8px 18px rgba(0, 0, 0, 0.5),
    0 0 0 1px hsla(41, 55%, 50%, 0.18);
}

.order__step:hover .order__step-icon svg {
  transform: translateY(-1px);
}

@media (max-width: 480px) {
  .order__step { grid-template-columns: auto 1fr; }
  .order__step-icon { display: none; }
}

/* ── Form panel (right column) ───────────────────────────────── */
.order__form {
  padding: clamp(24px, 3vw, 40px);
  position: relative;
  overflow: hidden;
  border-left: 2px solid hsla(41, 60%, 52%, 0.55);
}

.order__form::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 100% 100%,
    rgba(0, 0, 0, 0.30) 0%,
    rgba(0, 0, 0, 0) 60%);
  pointer-events: none;
  z-index: 0;
}

.order__form > * { position: relative; z-index: 1; }

.order__form h3 {
  font-family: 'Oswald', 'Inter', sans-serif;
  font-size: clamp(20px, 2.6vw, 28px);
  font-weight: 600;
  color: var(--pv-text);
  margin: 0 0 clamp(16px, 2.4vw, 24px);
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* ═══════════════════════════════════════════════════════════════ */
/* CF7 MARKUP OVERRIDES — scoped to .order__form only             */
/* ═══════════════════════════════════════════════════════════════ */

/* Reset CF7 wrapper */
.order__form .wpcf7 {
  position: relative;
  z-index: 1;
}

/* platis-form: flex column, consistent gap */
.order__form .platis-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Each field wrapper: block, full width */
.order__form .platis-form__field {
  display: block;
}

/* CF7 wraps each field in .wpcf7-form-control-wrap — make it block */
.order__form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* ── Input & Textarea: dark premium styling ─────────────────── */
.order__form input.wpcf7-text,
.order__form input.wpcf7-tel,
.order__form input.wpcf7-email,
.order__form input.wpcf7-number,
.order__form textarea.wpcf7-textarea {
  width: 100%;
  display: block;
  box-sizing: border-box;
  background: var(--pv-input-bg);
  border: 1px solid var(--pv-input-border);
  border-radius: 6px;
  color: var(--pv-text);
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  padding: 0 18px;
  height: 52px;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
  transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}

.order__form textarea.wpcf7-textarea {
  height: auto;
  min-height: 130px;
  padding: 14px 18px;
  resize: vertical;
  line-height: 1.6;
}

/* Placeholders */
.order__form input.wpcf7-text::placeholder,
.order__form input.wpcf7-tel::placeholder,
.order__form input.wpcf7-email::placeholder,
.order__form input.wpcf7-number::placeholder,
.order__form textarea.wpcf7-textarea::placeholder {
  color: hsla(40, 14%, 55%, 0.55);
  font-weight: 400;
}

/* Hover */
.order__form input.wpcf7-text:hover,
.order__form input.wpcf7-tel:hover,
.order__form input.wpcf7-email:hover,
.order__form textarea.wpcf7-textarea:hover {
  border-color: hsla(41, 40%, 45%, 0.45);
}

/* Focus */
.order__form input.wpcf7-text:focus,
.order__form input.wpcf7-tel:focus,
.order__form input.wpcf7-email:focus,
.order__form textarea.wpcf7-textarea:focus {
  border-color: var(--pv-input-border-focus);
  background: hsla(40, 12%, 7%, 0.80);
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.4),
    0 0 0 3px hsla(41, 60%, 50%, 0.12);
}

/* ── Consent checkbox ───────────────────────────────────────── */
.order__form .platis-form__consent {
  margin-top: 4px;
}

/* CF7 wraps acceptance in .wpcf7-acceptance */
.order__form .wpcf7-acceptance {
  display: block;
}

/* The inner list item */
.order__form .wpcf7-acceptance .wpcf7-list-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

/* CF7 generates <label> inside acceptance */
.order__form .wpcf7-acceptance .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  line-height: 1;
}

/* Checkbox input */
.order__form .wpcf7-acceptance input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin: 1px 0 0 0;
  border: 1px solid hsla(41, 40%, 45%, 0.5);
  border-radius: 3px;
  background: var(--pv-input-bg);
  cursor: pointer;
  position: relative;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.order__form .wpcf7-acceptance input[type="checkbox"]:checked {
  background: var(--gold, #D4A437);
  border-color: var(--gold, #D4A437);
}

.order__form .wpcf7-acceptance input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: 2px solid #0E0E0E;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}

.order__form .wpcf7-acceptance input[type="checkbox"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px hsla(41, 60%, 50%, 0.18);
}

/* Checkbox label text */
.order__form .wpcf7-acceptance .wpcf7-list-item-label {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: var(--pv-text-muted);
  line-height: 1.5;
  cursor: pointer;
}

/* ── Submit button ──────────────────────────────────────────── */
.order__form .platis-form__submit {
  margin-top: 8px;
  position: relative;
}

/*
 * CF7 submit is <input type="submit"> — pseudo-elements don't work on it.
 * We override all .btn/.btn-primary styles with a direct gold gradient
 * that renders correctly on replaced elements.
 */
.order__form input.wpcf7-submit,
.order__form input.wpcf7-submit.btn,
.order__form input.wpcf7-submit.btn-primary {
  /* Layout */
  width: 100%;
  display: block;
  box-sizing: border-box;
  height: 56px;
  padding: 0 32px;
  border: none;
  border-radius: 6px;
  /* Override clip-path from .btn */
  clip-path: none !important;
  /* Typography */
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: #0E0E0E !important;
  /* Gold gradient — satin brass, works directly on <input> */
  background: linear-gradient(
    180deg,
    #E8C97A 0%,
    #D4A437 35%,
    #C09030 68%,
    #9A7430 100%
  );
  /* Shadow */
  box-shadow:
    inset 0 1px 0 rgba(255, 238, 196, 0.45),
    0 4px 14px rgba(0, 0, 0, 0.38),
    0 1px 0 rgba(0, 0, 0, 0.45);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: filter 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  /* Reset any filter from .btn-primary */
  filter: none;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.12);
}

.order__form input.wpcf7-submit:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 248, 210, 0.55),
    0 8px 22px rgba(0, 0, 0, 0.44),
    0 0 20px rgba(212, 164, 55, 0.18),
    0 1px 0 rgba(0, 0, 0, 0.4);
}

.order__form input.wpcf7-submit:active {
  transform: translateY(1px);
  filter: brightness(0.95);
  box-shadow:
    inset 0 1px 0 rgba(0, 0, 0, 0.15),
    0 2px 4px rgba(0, 0, 0, 0.3);
}

/* CF7 spinner — appears inside the submit wrapper */
.order__form .wpcf7-spinner {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
}

/* ── CF7 validation & response messages ─────────────────────── */

/* Inline validation error under field */
.order__form .wpcf7-not-valid-tip {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #e07070;
  margin-top: 5px;
  line-height: 1.4;
}

/* Invalid field highlight */
.order__form input.wpcf7-not-valid,
.order__form textarea.wpcf7-not-valid {
  border-color: rgba(220, 80, 80, 0.6) !important;
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.4),
    0 0 0 3px rgba(220, 80, 80, 0.10) !important;
}

/* Success / error response output */
/* Hidden until CF7 actually has a message — otherwise the empty bordered box
   renders as a stray white frame under the submit button. CF7 adds a state
   class to the <form> (sent / invalid / failed / spam / unaccepted) when a
   message appears; we reveal it only then. */
.order__form .wpcf7-response-output {
  display: none;
  margin: 12px 0 0 0;
  padding: 10px 14px;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.5;
  border-width: 1px;
  border-style: solid;
}

.order__form form.sent .wpcf7-response-output,
.order__form form.failed .wpcf7-response-output,
.order__form form.invalid .wpcf7-response-output,
.order__form form.spam .wpcf7-response-output,
.order__form form.unaccepted .wpcf7-response-output,
.order__form form.payment-required .wpcf7-response-output {
  display: block;
}

.order__form .wpcf7-mail-sent-ok {
  background: rgba(212, 164, 55, 0.08);
  border-color: rgba(212, 164, 55, 0.35);
  color: #d4a437;
}

.order__form .wpcf7-mail-sent-ng,
.order__form .wpcf7-validation-errors,
.order__form .wpcf7-spam-blocked {
  background: rgba(220, 80, 80, 0.07);
  border-color: rgba(220, 80, 80, 0.35);
  color: #e07070;
}

/* CF7 spinner — align with button */
.order__form .wpcf7-spinner {
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
  background-color: var(--gold, #D4A437);
}

/* Reset CF7's default <p> tags if form was saved without platis-form wrapper */
.order__form .wpcf7-form > p {
  margin: 0 0 14px 0;
}

.order__form .wpcf7-form > p:last-child {
  margin-bottom: 0;
}

/* ── Mobile ─────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .order {
    padding: clamp(48px, 8vw, 64px) 20px;
  }

  .order__form {
    padding: 24px 20px;
  }

  .order__form input.wpcf7-text,
  .order__form input.wpcf7-tel,
  .order__form input.wpcf7-email {
    height: 52px;
    font-size: 16px; /* prevent iOS zoom */
  }

  .order__form textarea.wpcf7-textarea {
    min-height: 120px;
    font-size: 16px;
  }
}

@media (max-width: 430px) {
  .order__form h3 {
    font-size: 20px;
  }
}

/* ===== blocks/footer.css ===== */
/* ------------------------------------------------------------------ */
/* FOOTER — Sprint 3: ACF-driven dynamic footer                        */
/* ------------------------------------------------------------------ */

.footer {
  background: var(--bg-dark, #0E0E0E);
  color: rgba(232, 227, 217, 0.72);
  font-family: 'Inter', sans-serif;
}

/* ── Top-bar ── */
.footer-topbar {
  background: rgba(255, 255, 255, 0.012);
  border-bottom: 1px solid rgba(212, 164, 55, 0.08);
}

.footer-topbar__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 28px 60px;
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 20px;
}

.footer-topbar__item {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: rgba(232, 227, 217, 0.72);
  min-width: 0;
  transition: color 0.22s ease;
}

.footer-topbar__item--link:hover { color: var(--text-on-dark, #E8E3D9); }
.footer-topbar__item--link:hover .footer-topbar__icon {
  border-color: var(--gold, #D4A437);
  background: rgba(212, 164, 55, 0.07);
}

.footer-topbar__icon {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(212, 164, 55, 0.22);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--gold, #D4A437);
  transition: border-color 0.22s, background 0.22s;
}

.footer-topbar__icon svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-topbar__content {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.footer-topbar__label {
  font-family: 'Inter', sans-serif;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(200, 192, 178, 0.48);
  margin-bottom: 3px;
}

.footer-topbar__value {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: rgba(232, 227, 217, 0.92);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}

/* Phone item gets larger value text */
.footer-topbar__item:first-child .footer-topbar__value {
  font-size: 17px;
  font-weight: 700;
}

.footer-topbar__divider {
  width: 1px;
  height: 40px;
  background: rgba(212, 164, 55, 0.10);
  flex-shrink: 0;
}

/* ── Main 4-column area ── */
/* ── Золотий блок «Послуги» ─────────────────────────────────── */
.footer-services {
  background: linear-gradient(180deg, var(--gold, #D4A437) 0%, var(--gold-hover, #B8902F) 100%);
}
.footer-services__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 22px 60px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 28px;
}
.footer-services__label {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #0E0E0E;
  padding-right: 24px;
  border-right: 1px solid rgba(14, 14, 14, 0.25);
}
.footer-services__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
}
.footer-services__link {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #0E0E0E;
  text-decoration: none;
  transition: opacity 0.18s ease;
}
.footer-services__link:hover {
  opacity: 0.62;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width: 768px) {
  .footer-services__inner { padding: 18px 24px; }
  .footer-services__label {
    border-right: none;
    padding-right: 0;
    width: 100%;
  }
}

.footer-main {
  background: var(--bg-dark, #0E0E0E);
}

.footer-main__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 96px 60px;
  display: grid;
  grid-template-columns: 280px 1fr 1fr 1fr;
  gap: 0 48px;
  align-items: start;
}

/* ── Column shared ── */
.footer-col__title {
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold, #D4A437);
  margin: 0 0 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(212, 164, 55, 0.18);
}

/* ── Column 1: Brand ── */
.footer-col--brand .footer-col__logo {
  display: inline-block;
  margin-bottom: 20px;
}

.footer-col--brand .footer-col__logo img {
  height: 52px;
  width: auto;
  display: block;
}

.footer-col__about {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(232, 227, 217, 0.6);
  margin: 0 0 16px;
}

.footer-col__address {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(232, 227, 217, 0.5);
  font-style: normal;
  margin-bottom: 12px;
}

.footer-col__phone {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--text-on-dark, #E8E3D9);
  text-decoration: none;
  margin-bottom: 20px;
  transition: color 0.2s ease;
  letter-spacing: 0.02em;
}

.footer-col__phone:hover { color: var(--gold, #D4A437); }

.footer-col__cta {
  margin-bottom: 28px;
  display: block;
  text-align: center;
}

/* ── Social icons ── */
.footer-col__social {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.footer-social__link {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(212, 164, 55, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold, #D4A437);
  text-decoration: none;
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
  flex-shrink: 0;
}

.footer-social__link svg {
  width: 18px;
  height: 18px;
  display: block;
  pointer-events: none;
}

.footer-social__link:hover {
  background: var(--gold, #D4A437);
  border-color: var(--gold, #D4A437);
  color: #0E0E0E;
}

/* ── Nav lists (cols 2, 3, 4) ── */
.footer-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-nav__list li { margin: 0; padding: 0; }

.footer-nav__link,
.footer-col--nav a,
.footer-col--nav li a {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: rgba(232, 227, 217, 0.58);
  text-decoration: none;
  transition: color 0.18s ease, padding-left 0.18s ease;
  display: block;
  line-height: 1.4;
}

.footer-nav__link:hover,
.footer-col--nav a:hover,
.footer-col--nav li a:hover {
  color: var(--gold, #D4A437);
  padding-left: 4px;
}

/* ── Bottom strip ── */
.footer-bottom {
  background: var(--bg-dark, #0E0E0E);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.footer-bottom__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 20px 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.footer-bottom__copyright {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(232, 227, 217, 0.35);
}

.footer-bottom__links {
  display: flex;
  gap: 24px;
}

.footer-bottom__link {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: rgba(232, 227, 217, 0.35);
  text-decoration: none;
  transition: color 0.18s ease;
}

.footer-bottom__link:hover { color: rgba(232, 227, 217, 0.7); }

/* "Made by OROS AGENCY" credit (white logo on dark footer) */
.footer-bottom__credit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(232, 227, 217, 0.35);
  text-decoration: none;
  transition: color 0.18s ease;
}

.footer-bottom__credit-logo {
  display: block;
  height: 16px;
  width: auto;
  opacity: 0.55;
  transition: opacity 0.18s ease;
}

.footer-bottom__credit:hover { color: rgba(232, 227, 217, 0.75); }
.footer-bottom__credit:hover .footer-bottom__credit-logo { opacity: 1; }

/* ── Tablet (≤1024px): 2 columns ── */
@media (max-width: 1024px) {
  .footer-main__inner {
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    padding: 64px 40px;
  }

  .footer-col--brand {
    grid-column: 1 / -1;
  }

  .footer-topbar__inner {
    padding: 16px 40px;
    grid-template-columns: 1fr auto 1fr;
  }

  .footer-topbar__item:nth-child(6),
  .footer-topbar__item:nth-child(7),
  .footer-topbar__divider:nth-child(4),
  .footer-topbar__divider:nth-child(6) {
    display: none;
  }
}

/* ── Mobile (≤768px) ── */
@media (max-width: 768px) {
  .footer-topbar__inner {
    padding: 16px 20px;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .footer-topbar__divider { display: none; }

  .footer-main__inner {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 48px 20px calc(48px + 56px);
  }

  .footer-bottom__inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 16px 20px;
    gap: 12px;
  }

  .footer-bottom__links {
    flex-direction: column;
    gap: 8px;
  }
}

/* ===== blocks/mobile-sticky.css ===== */
  /* ─── Mobile sticky contact bar ─────────────────────────────────── */
  .m-cta {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    gap: 10px;
    background:
      linear-gradient(180deg,
        rgba(8, 7, 6, 0.94) 0%,
        rgba(6, 5, 4, 0.98) 100%);
    border-top: 1px solid hsla(41, 50%, 50%, 0.22);
    box-shadow:
      0 -1px 0 hsla(41, 70%, 70%, 0.06) inset,
      0 -10px 24px rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transform: translateY(0);
    transition: transform 0.28s cubic-bezier(.2,.7,.2,1), opacity 0.22s ease;
  }
  /* Slide off-screen when drawer is open OR when user is inside the form */
  body.has-mobile-menu-open .m-cta,
  .m-cta.is-hidden {
    transform: translateY(110%);
    opacity: 0;
    pointer-events: none;
  }

  .m-cta__btn {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 50px;
    padding: 0 12px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    position: relative;
    isolation: isolate;
    clip-path: var(--btn-skew-sm);
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: transform 0.18s cubic-bezier(.2,.7,.2,1), filter 0.18s ease;
  }
  .m-cta__btn svg {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
  }
  .m-cta__btn span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .m-cta__btn:active {
    transform: translateY(1px);
  }

  /* Primary — satin champagne brass (matches global .btn-primary) */
  .m-cta__btn--primary {
    color: var(--btn-text-ink);
    background: linear-gradient(180deg,
      #5a4314 0%,
      var(--btn-gold-rim) 35%,
      var(--btn-gold-rim-2) 100%);
    filter: drop-shadow(0 4px 10px rgba(0,0,0,0.4));
  }
  .m-cta__btn--primary::before,
  .m-cta__btn--primary::after {
    content: '';
    position: absolute;
    inset: 1.5px;
    clip-path: var(--btn-skew-sm);
    pointer-events: none;
  }
  .m-cta__btn--primary::before {
    background:
      linear-gradient(180deg,
        rgba(255,238,196,0.30) 0%,
        rgba(255,238,196,0.00) 14%,
        rgba(0,0,0,0.00) 65%,
        rgba(0,0,0,0.20) 100%),
      linear-gradient(178deg,
        var(--btn-gold-hi)  0%,
        var(--btn-gold-top) 30%,
        var(--btn-gold-mid) 68%,
        var(--btn-gold-bot) 100%);
    z-index: -2;
  }
  .m-cta__btn--primary::after {
    background-image: var(--btn-grain);
    background-size: 160px 160px;
    mix-blend-mode: overlay;
    opacity: 0.18;
    z-index: -1;
  }

  /* Secondary — dark graphite plate, muted gold rim */
  .m-cta__btn--secondary {
    color: #E8E1CF;
    background: transparent;
    border: 1px solid hsla(41, 38%, 50%, 0.32);
    box-shadow:
      inset 0 1px 0 hsla(41, 70%, 70%, 0.08),
      inset 0 -10px 16px -10px rgba(0, 0, 0, 0.5);
  }
  .m-cta__btn--secondary::before {
    content: '';
    position: absolute;
    inset: 0;
    clip-path: var(--btn-skew-sm);
    background:
      linear-gradient(180deg,
        hsla(40, 14%, 12%, 0.55) 0%,
        hsla(40, 10%, 6%, 0.75) 100%);
    z-index: -1;
    pointer-events: none;
  }
  .m-cta__btn--secondary:hover,
  .m-cta__btn--secondary:active {
    border-color: hsla(41, 60%, 55%, 0.55);
    color: var(--btn-gold-hi);
  }

  .m-cta__btn:focus-visible {
    outline: 2px dashed var(--btn-gold-hi);
    outline-offset: 3px;
  }

  /* Only visible on mobile / phone widths */
  @media (max-width: 768px) {
    .m-cta { display: flex; }
    /* Make room so the footer / page bottom is never trapped behind the bar */
    body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  }

/* ===== blocks/wc-category.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* WC — Category, Archive, and shared WC page styles                  */
/* ─────────────────────────────────────────────────────────────────── */

/* Container utility (shared across WC pages) */
.container {
  width: 100%;
  max-width: 1320px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 80px;
  padding-right: 80px;
}

.container--narrow {
  max-width: 880px;
}

@media (max-width: 1024px) {
  .container { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 768px) {
  .container { padding-left: 24px; padding-right: 24px; }
}

/* ── Category / Shop hero (dark) ──────────────────────────────────── */
.category-hero {
  background: var(--bg-dark);
  padding: 64px 0 56px;
  position: relative;
  overflow: hidden;
}

.category-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--cat-bg, none) center / cover no-repeat;
  opacity: 0.12;
  pointer-events: none;
}

.category-hero .container { position: relative; z-index: 1; }

/* Breadcrumbs */
.breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--text-on-dark-2);
  margin-bottom: 24px;
}

.breadcrumbs a {
  color: var(--text-on-dark-2);
  text-decoration: none;
  transition: color 0.2s ease;
}

.breadcrumbs a:hover { color: var(--gold); }

.bc__sep { color: var(--border-dark); margin: 0 2px; }

.category-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.category-hero__intro {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 640px;
  margin: 0;
}

/* ── Products grid section (dark background) ───────────────────────── */
.category-products {
  background: var(--bg-dark);
  padding: 64px 0 96px;
}

.category-products__heading {
  color: var(--text-on-dark);
  margin-bottom: 40px;
}

.category-products__empty {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: var(--text-on-dark-2);
  text-align: center;
  padding: 64px 0;
}

/* WC loop container override */
.products-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

@media (max-width: 1024px) {
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}

@media (max-width: 480px) {
  .products-grid { grid-template-columns: 1fr; gap: 14px; }
}

/* ── Mobile: компактний hero категорії, товари ближче до верху ─────── */
@media (max-width: 768px) {
  .category-hero { padding: 28px 0 24px; }
  .category-hero .breadcrumbs { margin-bottom: 14px; }
  .category-hero__title {
    font-size: clamp(26px, 7vw, 34px);
    line-height: 1.08;
    margin-bottom: 10px;
  }
  .category-hero__intro { font-size: 16px; }
  .category-products { padding: 28px 0 56px; }
}

/* ── Product card ──────────────────────────────────────────────────── */
.product-card {
  background: var(--bg-dark-2);
  border: 1px solid var(--border-dark);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: border-color 0.25s ease, transform 0.25s ease,
              box-shadow 0.25s ease;
}

.product-card:hover {
  border-color: rgba(212, 164, 55, 0.40);
  transform: translateY(-3px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45),
              0 0 0 1px rgba(212, 164, 55, 0.18);
}

/* Gold accent line at bottom on hover */
.product-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, transparent, var(--gold) 50%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
.product-card:hover::after { opacity: 0.6; }

.product-card__img-link { display: block; }

.product-card__img-wrap {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  flex-shrink: 0;
}

.product-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
  filter: brightness(0.92) saturate(0.88);
}

.product-card:hover .product-card__img {
  transform: scale(1.05);
  filter: brightness(1) saturate(1);
}

.product-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 18px 20px 20px;
  gap: 12px;
}

.product-card__title {
  font-family: 'Oswald', sans-serif;
  font-size: 19px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.18;
  color: var(--text-on-dark);
  margin: 0;
  /* Clamp to 2 lines AND reserve their height (2 × font-size × line-height)
     so titles of 1 and 2 lines align the specs/price rows across the row. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(19px * 1.18 * 2);
}

.product-card__title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}

.product-card__title a:hover { color: var(--gold); }

/* Attributes list */
.product-card__attrs {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Each row: label left, value right. Both may wrap so long labels
   (e.g. "Максимальна глибина копання") and wide values (e.g. dimensions
   "10,48 х 3,19 х 3,68 м") never overflow the card — the value drops to a
   new line, right-aligned, when there isn't room beside the label. */
.product-card__attrs li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 1px 10px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.35;
  padding: 7px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}
.product-card__attrs li:first-child { border-top: 1px solid rgba(255, 255, 255, 0.055); }

.product-card__attr-label {
  color: var(--text-on-dark-2);
  flex: 1 1 auto;
  min-width: 0;
}

.product-card__attr-value {
  color: var(--text-on-dark);
  font-weight: 600;
  text-align: right;
  /* Wrap gracefully — dimensions break at the "х" spaces, never clip. */
  overflow-wrap: anywhere;
  max-width: 100%;
}

/* ── Price row: "Ціна 2 500 ₴ / год" ──────────────────────────────── */
.product-card__price {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.05);
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  line-height: 1;
}

.product-card__price-label {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-on-dark-2);
}

.product-card__price-value {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--gold-text);
  line-height: 1;
}

.product-card__price-value .amount,
.product-card__price .amount { font-size: inherit; }

.product-card__price-unit {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-on-dark-2);
  letter-spacing: 0.02em;
}

.product-card__price-onrequest {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark-2);
  letter-spacing: 0.04em;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.05);
}

/* ── "ПРОДАНО" badge — positioned over image top-left ─────────────── */
.product-card__sold-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  background: #C0392B;
  color: #FFFFFF;
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.45);
  pointer-events: none;
}

/* Sold card — slightly dimmed image, no hover lift */
.product-card--sold {
  pointer-events: auto;
}
.product-card--sold .product-card__img {
  filter: brightness(0.65) saturate(0.4);
}
.product-card--sold:hover {
  transform: none;
  box-shadow: none;
  border-color: var(--border-dark);
}
.product-card--sold:hover .product-card__img {
  transform: none;
  filter: brightness(0.65) saturate(0.4);
}
.product-card--sold::after { display: none; }

/* Sold CTA button — grayed out, disabled look */
.product-card__cta--sold {
  background: linear-gradient(180deg, #444 0%, #2a2a2a 100%) !important;
  color: #888 !important;
  cursor: not-allowed;
  opacity: 0.7;
}
.product-card__cta--sold::before {
  background: linear-gradient(178deg, #333 0%, #1e1e1e 100%) !important;
}

/* Sale product price — no "від" prefix, show full price */
.product-card__price--sale {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-on-dark);
}
.product-card__price--sale .amount { font-size: inherit; }
.product-card__price--sale .product-card__price-unit {
  font-size: 12px;
  color: var(--text-on-dark-2);
  font-family: 'Inter', sans-serif;
  font-weight: 400;
}

/* CTA button — follows price, stays at bottom via flex parent */
.product-card__cta {
  width: 100%;
  /* Override skew system: card CTA is a clean rectangle */
  clip-path: none;
  border-radius: 6px;
  height: 54px;
  min-width: 0;
  margin-top: 14px;
  font-size: 13px;
  letter-spacing: 0.09em;
  /* No margin-top: auto — price-block already acts as the spacer */
}

/* Fix: pseudo-elements must also use no clip-path to match the rectangular button */
.product-card__cta::before,
.product-card__cta::after {
  clip-path: none;
  border-radius: 4px;
}

/* ── "All categories" back band (dark) ─────────────────────────────── */
.category-allcats {
  background: var(--bg-dark, #0E0E0E);
  padding: 8px 0 56px;
  text-align: center;
}

.category-allcats__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.category-allcats__btn svg { flex-shrink: 0; }

@media (max-width: 600px) {
  .category-allcats { padding: 4px 0 40px; }
  .category-allcats__btn { width: 100%; justify-content: center; }
}

/* ── SEO panel — light "concrete" document inserted on the dark site ──
   Wider + lower (2-column body) so the long SEO text is easy to scan and
   doesn't form a tall wall. Outer section stays dark; the panel is a warm
   light-concrete card with a soft shadow for a smooth dark→light transition.
   Used across category, service, project, product and poslugy templates. */
.seo-section--content,
.seo-section--light { /* --light: backward compat alias, use --content */
  background: #050706;
  padding: 96px 0;
  position: relative;
}

/* Widen the container only inside the SEO panel context (scoped — does not
   affect .container--narrow elsewhere). */
.seo-section--content .container,
.seo-section--light .container {
  width: min(1360px, calc(100% - 80px));
  max-width: none;
  margin: 0 auto;
}

.seo-section__content {
  position: relative;
  font-family: 'Inter', sans-serif;
  font-size: 16.5px;
  line-height: 1.65;
  color: #2d2a24;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0) 18%),
    #d8d4c8;
  border: 1px solid rgba(90, 78, 48, 0.35);
  border-radius: 12px;
  padding: 64px 72px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, 0.38),
    inset 0 0 0 1px rgba(255, 255, 255, 0.45);
}

.seo-section__content h2,
.seo-section__content h3 {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
}

.seo-section__content h2 {
  font-size: 32px;
  font-weight: 700;
  color: #111;
  margin: 40px 0 22px;
  letter-spacing: 0.01em;
  line-height: 1.12;
}

.seo-section__content h2:first-child { margin-top: 0; }

.seo-section__content h3 {
  font-size: 22px;
  font-weight: 600;
  color: #1a1813;
  margin: 32px 0 14px;
  letter-spacing: 0.02em;
}

.seo-section__content p { margin: 0 0 16px; color: #2d2a24; }
.seo-section__content p:last-child { margin-bottom: 0; }

.seo-section__content ul,
.seo-section__content ol {
  padding-left: 0;
  margin: 0 0 16px;
  list-style: none;
}

.seo-section__content ul li,
.seo-section__content ol li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 9px;
  line-height: 1.55;
  color: #2d2a24;
  break-inside: avoid;
}

.seo-section__content ul li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 10px;
  width: 7px;
  height: 7px;
  background: #b99336; /* muted gold accent */
  border-radius: 1px;
}

.seo-section__content a {
  color: #8a6d1f;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.seo-section__content a:hover { color: #b99336; }

/* Tablet */
@media (max-width: 1024px) {
  .seo-section--content .container,
  .seo-section--light .container { width: calc(100% - 48px); }
  .seo-section__content { padding: 48px 44px; column-gap: 48px; }
}

/* Mobile — single column, never shrink text below 16px */
@media (max-width: 900px) {
  .seo-section--content,
  .seo-section--light { padding: 56px 0; }
  .seo-section--content .container,
  .seo-section--light .container { width: calc(100% - 32px); }
  .seo-section__content {
    columns: 1;
    font-size: 16px;
    line-height: 1.6;
    padding: 32px 28px;
  }
  .seo-section__content h2 { font-size: 26px; margin-top: 32px; }
  .seo-section__content h3 { font-size: 20px; }
}

/* ── Dark CTA section ───────────────────────────────────────────────── */
.category-cta {
  background: var(--bg-dark);
  padding: 96px 0;
  text-align: center;
  border-top: 1px solid var(--border-dark);
}

.category-cta__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 3vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.category-cta__sub {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  color: var(--text-on-dark-2);
  margin: 0 0 40px;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 768px) {
  .category-cta { padding: 64px 0; }
  .category-cta__title { font-size: 32px; }
  .category-cta__sub { font-size: 16px; }
}

/* ── Shop page: category mini-grid ─────────────────────────────────── */
.shop-categories {
  background: var(--bg-dark-2);
  padding: 64px 0;
  border-bottom: 1px solid var(--border-dark);
}

.shop-categories__title {
  color: var(--text-on-dark);
  margin-bottom: 40px;
}

.categories-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.category-card {
  display: block;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border-dark);
  text-decoration: none;
  transition: border-color 0.25s ease, transform 0.25s ease;
  background: var(--bg-dark);
}

.category-card:hover {
  border-color: var(--gold-line);
  transform: translateY(-2px);
}

.category-card__img-wrap {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}

.category-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.category-card:hover .category-card__img { transform: scale(1.05); }

.category-card__title {
  padding: 12px 16px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark);
  letter-spacing: 0.02em;
  text-align: center;
}

@media (max-width: 1024px) {
  .categories-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
  .categories-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .shop-categories { padding: 48px 0; }
}

/* ── WC pagination ──────────────────────────────────────────────────── */
.woocommerce-pagination {
  margin-top: 48px;
  display: flex;
  justify-content: center;
}

.woocommerce-pagination ul {
  display: flex;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark-2);
  border: 1px solid var(--border-dark);
  text-decoration: none;
  transition: border-color 0.2s, color 0.2s;
}

.woocommerce-pagination ul li a:hover { border-color: var(--gold); color: var(--gold); }
.woocommerce-pagination ul li span.current {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(212, 164, 55, 0.08);
}

/* ===== blocks/wc-single-product.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* WC — Single product page — card-based dark UI                       */
/* ─────────────────────────────────────────────────────────────────── */

.single-product-page {
  background: var(--bg-dark);
}

/* ── Hero (dark, breadcrumbs + title) ──────────────────────────────── */
.single-product-hero {
  background: var(--bg-dark);
  padding: 48px 0 40px;
  border-bottom: 1px solid var(--border-dark);
}

.single-product-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: var(--text-on-dark);
  margin: 24px 0 0;
}

/* ── Main card: gallery + summary ─────────────────────────────────── */
.single-product__main-card {
  background: var(--bg-dark);
  padding: 64px 0;
}

.product-card {
  background: var(--bg-dark-2);
  border: 1px solid var(--border-dark);
  border-radius: 16px;
  padding: 48px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

.product-card__grid {
  display: grid;
  grid-template-columns: 55fr 45fr;
  gap: 56px;
  align-items: start;
}

/* ── Gallery ───────────────────────────────────────────────────────── */
.product-card__gallery .woocommerce-product-gallery {
  float: none;
  width: 100%;
}

.product-card__gallery .woocommerce-product-gallery__wrapper {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 12px;
}

.product-card__gallery .woocommerce-product-gallery__wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Hide WC magnifier icon and zoom overlay — not styled for this design */
.woocommerce-product-gallery__trigger,
.woocommerce-product-gallery .zoomImg,
.woocommerce-product-gallery__trigger + .flex-viewport::before { display: none !important; }

/* ── Product summary ───────────────────────────────────────────────── */
.product-card__summary {
  display: flex;
  flex-direction: column;
  gap: 16px;
  color: var(--text-on-dark);
}

.product-card__summary .product_title { display: none; } /* title in hero */

.product-card__summary .woocommerce-product-details__short-description {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  padding-bottom: 4px;
}

/* WC price block */
.product-card__summary .price {
  font-family: 'Oswald', sans-serif;
  font-size: 32px;
  font-weight: 700;
  color: var(--gold);
  line-height: 1;
}

.product-card__summary .price ins { text-decoration: none; }

.product-card__summary .price del {
  font-size: 20px;
  color: var(--text-on-dark-2);
  margin-right: 12px;
}

/* ── "ПРОДАНО" badge on single product page ─────────────────────── */
.single-product__sold-badge {
  display: inline-block;
  background: #C0392B;
  color: #FFFFFF;
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 8px 20px;
  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(192,57,43,0.4);
  margin-bottom: 12px;
}

.single-product__price-note--sold {
  color: var(--text-on-dark-2);
  font-style: italic;
}

/* When product is sold — dim the gallery */
.product-card--sold .product-card__gallery img {
  filter: brightness(0.6) saturate(0.3);
}

/* Price context note — added by woocommerce.php hook */
.single-product__price-note {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--text-on-dark-2);
  line-height: 1.5;
  margin: -4px 0 4px;
  border-left: 2px solid rgba(212, 164, 55, 0.35);
  padding-left: 12px;
}

/* CTA group: primary + secondary side by side */
.single-product__cta-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.single-product__cta-btn {
  flex: 1 1 auto;
  min-width: 160px;
  clip-path: var(--btn-skew);
}

.single-product__cta-btn--secondary {
  /* Secondary keeps skew — matches design system */
}

/* Phone CTA line */
.single-product__phone-cta {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--text-on-dark-2);
  line-height: 1;
  margin-top: -4px;
}

.single-product__phone-link {
  color: var(--text-on-dark);
  font-weight: 700;
  text-decoration: none;
  transition: color 0.2s ease;
  letter-spacing: 0.02em;
}

.single-product__phone-link:hover { color: var(--gold); }

/* ── Universal data-card pattern ─────────────────────────────────── */
.data-card {
  background: var(--bg-dark-2);
  border: 1px solid var(--border-dark);
  border-radius: 16px;
  padding: 48px;
  color: var(--text-on-dark);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

.data-card--center { text-align: center; }

.data-card--center .btn { margin-top: 24px; }
.data-card--center .body-lg { max-width: 480px; margin: 12px auto 0; }

.data-card__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: 32px;
  text-transform: uppercase;
  color: var(--text-on-dark);
  letter-spacing: 0.02em;
  margin: 0 0 32px;
}

/* ── Attributes section ─────────────────────────────────────────── */
.single-product__attrs-section {
  background: var(--bg-dark);
  padding: 32px 0 64px;
}

.single-product__attrs-table {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid var(--border-dark);
  border-radius: 8px;
  overflow: hidden;
}

.single-product__attr-row {
  display: grid;
  /* minmax(0,1fr) — дозволяє колонкам стискатися; інакше довге значення
     з одиницею (напр. «71000 мм») розпирає сітку за межі картки. */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  padding: 14px 24px;
  border-bottom: 1px solid var(--border-dark);
  gap: 16px;
  align-items: center;
}

.single-product__attr-row:last-child { border-bottom: none; }

.single-product__attr-row:nth-child(odd) {
  background: rgba(255, 255, 255, 0.02);
}

.single-product__attr-label {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-on-dark-2);
  min-width: 0;
  overflow-wrap: anywhere;
}

.single-product__attr-value {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark);
  min-width: 0;
  overflow-wrap: anywhere;
}

/* ── CTA block ──────────────────────────────────────────────────── */
.single-product__cta-block {
  background: var(--bg-dark);
  padding: 64px 0 96px;
}

.single-product__cta-block .data-card {
  max-width: 720px;
  margin: 0 auto;
  padding: 64px;
}

/* ── Related products ────────────────────────────────────────────── */
.related.products {
  background: var(--bg-dark);
  padding: 64px 0;
  border-top: 1px solid var(--border-dark);
}

.related.products h2 {
  font-family: 'Oswald', sans-serif;
  font-size: 32px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin-bottom: 40px;
  padding-left: 80px;
  padding-right: 80px;
}

.related.products .products-grid {
  padding-left: 80px;
  padding-right: 80px;
}

/* ── WC notices ─────────────────────────────────────────────────── */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
  background: var(--bg-dark-2);
  border: 1px solid var(--border-dark);
  border-left: 4px solid var(--gold);
  color: var(--text-on-dark);
  border-radius: 6px;
  padding: 16px 24px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  list-style: none;
  margin-bottom: 24px;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .related.products h2,
  .related.products .products-grid {
    padding-left: 48px;
    padding-right: 48px;
  }

  .product-card__grid { gap: 40px; }
}

@media (max-width: 900px) {
  .product-card__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .product-card { padding: 24px; }

  .single-product__attrs-table { grid-template-columns: 1fr; }

  .single-product__cta-group {
    flex-direction: column;
    gap: 10px;
  }

  .single-product__cta-btn {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 768px) {
  .single-product-hero__title {
    font-size: clamp(24px, 6vw, 40px);
  }

  .single-product__main-card { padding: 32px 0; }

  .single-product__attrs-section { padding: 24px 0 48px; }

  /* Вузький екран: менші паддинги картки, щоб значенням вистачало ширини. */
  .data-card { padding: 28px 20px; }
  .data-card__title { font-size: 24px; margin-bottom: 20px; }
  .single-product__attr-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding: 12px 16px;
    gap: 12px;
  }

  .single-product__cta-block { padding: 48px 0 80px; }
  .single-product__cta-block .data-card { padding: 32px 24px; }

  .related.products { padding: 48px 0; }
  .related.products h2,
  .related.products .products-grid {
    padding-left: 24px;
    padding-right: 24px;
  }
  .related.products h2 { font-size: 24px; }
}

@media (max-width: 480px) {
  .single-product__cta-group { gap: 8px; }
  .single-product__cta-btn { height: 52px; }
  .product-card__summary .price { font-size: 28px; }

  /* Найвужчі екрани — ще компактніша картка характеристик. */
  .data-card { padding: 22px 14px; }
  .single-product__attr-row { padding: 11px 14px; gap: 10px; }
  .single-product__cta-block .data-card { padding: 28px 16px; }
}

/* ===== blocks/page-default.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* Default page template (page.php)                                    */
/* ─────────────────────────────────────────────────────────────────── */

.page-default__hero {
  background: var(--bg-dark);
  padding: 32px 0;
  border-bottom: 1px solid var(--border-dark);
}

.page-default__container {
  width: 100%;
  max-width: 1320px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 80px;
  padding-right: 80px;
}

@media (max-width: 1024px) {
  .page-default__container { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 768px) {
  .page-default__container { padding-left: 24px; padding-right: 24px; }
}

.page-default__content {
  background: var(--bg-dark);
  padding: 64px 0 128px;
}

/* ── Content H1 (from post_content — only heading on the page) ─────── */
.page-default__article h1 {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: var(--text-on-dark);
  margin: 0 0 40px;
}

.page-default__article h2 {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(24px, 3vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.15;
  color: var(--text-on-dark);
  margin: 56px 0 24px;
}

.page-default__article h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 24px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-on-dark);
  margin: 40px 0 16px;
}

.page-default__article p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-on-dark-2);
  margin-bottom: 16px;
}

.page-default__article a {
  color: var(--gold-text);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.page-default__article a:hover { color: var(--gold); }

.page-default__article ul,
.page-default__article ol {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  padding-left: 24px;
  margin-bottom: 24px;
}

.page-default__article li { margin-bottom: 8px; }

/* iframes (Google Maps on Contacts page) */
.page-default__article iframe {
  width: 100%;
  max-width: 100%;
  border: 0;
  border-radius: 8px;
  margin: 24px 0;
}

/* Images */
.page-default__article img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}

@media (max-width: 768px) {
  .page-default__content { padding: 48px 0 80px; }
  .page-default__article h1 { font-size: 32px; }
  .page-default__article h2 { font-size: 24px; margin-top: 40px; }
  .page-default__article h3 { font-size: 20px; }
}

/* ===== blocks/services-page.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* Services pages — aggregator + single-service                        */
/* ─────────────────────────────────────────────────────────────────── */

/* ── Aggregator hero ────────────────────────────────────────────────── */
.services-hero {
  background: var(--bg-dark);
  padding: 96px 0 80px;
  text-align: center;
}

.services-hero .eyebrow { margin-bottom: 16px; display: block; }

.services-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: var(--text-on-dark);
  margin: 0 0 24px;
}

.services-hero__subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 680px;
  margin: 0 auto;
}

/* ── Aggregator service cards grid ─────────────────────────────────── */
.services-grid-section {
  background: var(--bg-dark);
  padding: 64px 0 96px;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

@media (max-width: 1024px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .services-grid { grid-template-columns: 1fr; gap: 16px; } }

.service-card {
  display: flex;
  flex-direction: column;
  background: var(--bg-dark-2);
  border: 1px solid var(--border-dark);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  border-color: var(--gold-line);
}

.service-card__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.service-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.service-card:hover .service-card__image img { transform: scale(1.05); }

.service-card__body {
  padding: 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.service-card__title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 12px;
}

.service-card__excerpt {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-on-dark-2);
  margin: 0 0 16px;
  flex: 1;
}

.service-card__link {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--gold);
  margin-top: auto;
  transition: color 0.2s ease;
}

.service-card:hover .service-card__link { color: var(--gold-hover); }

/* ── Services CTA (shared aggregator + single) ──────────────────────── */
.services-cta {
  background: var(--bg-dark);
  padding: 96px 0;
  text-align: center;
  border-top: 1px solid var(--border-dark);
}

.services-cta__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 3vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.services-cta__sub {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  color: var(--text-on-dark-2);
  max-width: 560px;
  margin: 0 auto 40px;
}

@media (max-width: 768px) {
  .services-cta { padding: 64px 0; }
  .services-cta__title { font-size: 32px; }
  .services-cta__sub { font-size: 16px; }
  .services-hero { padding: 64px 0 56px; }
  .services-hero__title { font-size: 40px; }
  .services-hero__subtitle { font-size: 16px; }
}

/* ── Single-service hero ────────────────────────────────────────────── */
.single-service__hero {
  background-color: var(--bg-dark);
  background-size: cover;
  background-position: center top;
  padding: 80px 0 72px;
}

.single-service__hero .eyebrow { margin-bottom: 16px; display: block; }

.single-service__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: var(--text-on-dark);
  margin: 0 0 20px;
}

.single-service__intro {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 720px;
  margin: 0 0 40px;
}

.single-service__hero-cta { display: flex; gap: 16px; flex-wrap: wrap; }

@media (max-width: 768px) {
  .single-service__hero { padding: 56px 0 48px; }
  .single-service__title { font-size: 40px; }
  .single-service__intro { font-size: 16px; }
}

/* ── Section shared title ────────────────────────────────────────────── */
.single-service__section-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 3.5vw, 56px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: var(--text-on-dark);
  margin: 24px 0 48px;
}

/* ── Process steps ───────────────────────────────────────────────────── */
.single-service__process {
  background: var(--bg-dark-2);
  padding: 96px 0;
  border-top: 1px solid var(--border-dark);
}

.single-service__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

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

.step-card {
  background: var(--bg-dark);
  border: 1px solid var(--border-dark);
  border-radius: 12px;
  padding: 32px;
}

.step-card__number {
  font-family: 'Oswald', sans-serif;
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
  color: var(--gold);
  margin-bottom: 16px;
}

.step-card__title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  margin: 0 0 12px;
}

.step-card__text {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  margin: 0;
}

@media (max-width: 768px) {
  .single-service__process { padding: 64px 0; }
  .step-card__number { font-size: 40px; }
}

/* ── Equipment panel ─────────────────────────────────────────────────── */
.single-service__equipment {
  background: var(--bg-dark);
  padding: 80px 0;
  border-top: 1px solid var(--border-dark);
}

/* ── FAQ (dark) ──────────────────────────────────────────────────────── */
.single-service__faq {
  background: var(--bg-dark-2);
  padding: 96px 0;
  border-top: 1px solid var(--border-dark);
}

.faq-list { margin-top: 40px; }

.faq-item {
  border-bottom: 1px solid var(--border-dark);
  padding: 0;
}

.faq-item__question {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  cursor: pointer;
  list-style: none;
  position: relative;
  padding: 24px 48px 24px 0;
  transition: color 0.2s ease;
}

.faq-item__question::-webkit-details-marker { display: none; }
.faq-item__question::marker { display: none; }

.faq-item__question::after {
  content: '';
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 2px solid var(--gold);
  border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%23D4A437' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E") center / 10px 6px no-repeat;
  transition: transform 0.25s ease;
}

.faq-item[open] .faq-item__question::after {
  transform: translateY(-50%) rotate(180deg);
}

.faq-item[open] .faq-item__question { color: var(--gold); }

.faq-item__answer {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-on-dark-2);
  padding: 0 48px 24px 0;
}

.faq-item__answer p { margin-bottom: 12px; }
.faq-item__answer p:last-child { margin-bottom: 0; }

@media (max-width: 768px) {
  .single-service__faq { padding: 64px 0; }
  .faq-item__question { font-size: 16px; padding-right: 40px; }
  .single-service__section-title { font-size: 32px; }
}

/* ===== blocks/project.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* Project CPT — single + archive                                      */
/* CSS extracted from PLATIS Ukraine - Project Detail v2.html         */
/* Token mapping: --bg-card→--bg-dark-2, --text→--text-on-dark, etc. */
/* ─────────────────────────────────────────────────────────────────── */

/* ── Section shell (shared) ────────────────────────────────────────── */
.prj-section {
  position: relative;
  padding: clamp(44px, 4.5vw, 68px) 0;
  background: var(--bg-dark);
}

.prj-section--alt {
  background: #0E100F;
  border-top: 1px solid rgba(232, 227, 217, 0.06);
  border-bottom: 1px solid rgba(232, 227, 217, 0.06);
}

.prj-section__inner {
  max-width: 1320px;
  margin: 0 auto;
  padding-left: 80px;
  padding-right: 80px;
}

.prj-section__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: clamp(24px, 3vw, 38px);
}

.prj-section__head h2 { color: var(--text-on-dark); }

@media (max-width: 1024px) {
  .prj-section__inner { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 768px) {
  .prj-section { padding: clamp(36px, 7vw, 56px) 0; }
  .prj-section__inner { padding-left: 24px; padding-right: 24px; }
}

/* ── Hero (single project) ──────────────────────────────────────────── */
.prj-hero {
  position: relative;
  background: #070807;
  overflow: hidden;
  min-height: clamp(480px, 60vh, 680px);
}

.prj-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 55% 85% at 5% 15%, rgba(212, 164, 55, 0.07) 0%, transparent 60%);
}

.prj-hero__inner {
  position: relative;
  width: 100%;
  min-height: inherit;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
}

/* LEFT text column */
.prj-hero__copy {
  padding: clamp(44px, 5vw, 76px) 48px clamp(52px, 5.5vw, 84px);
  padding-left: max(24px, min(80px, calc((100vw - 1320px) / 2 + 80px)));
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
}

.prj-hero__copy .breadcrumbs { color: var(--text-on-dark-2); margin-bottom: 0; }
.prj-hero__copy .breadcrumbs a { color: var(--text-on-dark-2); }
.prj-hero__copy .breadcrumbs a:hover { color: var(--gold); }

.prj-hero__eyebrow-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.prj-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.015em;
  text-transform: uppercase;
  color: var(--text-on-dark);
  margin: 0;
}

.prj-hero__summary {
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1.65;
  max-width: 520px;
  color: var(--text-on-dark-2);
}

/* Meta grid */
.prj-hero__meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--gold-line);
  border: 1px solid var(--gold-line);
  margin-top: 4px;
}

.prj-hero__meta-cell {
  background: var(--bg-dark-2);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.prj-hero__meta-label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}

.prj-hero__meta-value {
  font-family: 'Oswald', sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--text-on-dark);
  line-height: 1.25;
}

/* RIGHT image column */
.prj-hero__visual {
  position: relative;
  overflow: hidden;
  background: var(--bg-dark-2);
}

.prj-hero__visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.prj-hero__visual::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, #070807 0%, rgba(7, 8, 7, 0.3) 20%, transparent 40%);
}

.prj-hero__visual::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 50%, rgba(7, 8, 7, 0.7) 100%);
}

.prj-hero__badge {
  position: absolute;
  right: 22px;
  bottom: 22px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px;
  background: rgba(7, 8, 7, 0.82);
  border: 1px solid rgba(212, 164, 55, 0.36);
  backdrop-filter: blur(6px);
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-text);
}

.prj-hero__badge-dot {
  width: 6px;
  height: 6px;
  background: var(--gold-text);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--gold-text);
  flex-shrink: 0;
}

@media (max-width: 860px) {
  .prj-hero { min-height: auto; }
  .prj-hero__inner { grid-template-columns: 1fr; }
  .prj-hero__visual { height: 54vw; min-height: 200px; max-height: 340px; order: -1; }
  .prj-hero__visual::before { display: none; }
  .prj-hero__copy { padding: 28px 24px 44px; }
  .prj-hero__meta { grid-template-columns: repeat(2, 1fr); }
}

/* ── Proof + Summary section ────────────────────────────────────────── */
.proof-summary {
  display: grid;
  grid-template-columns: 58fr 42fr;
  gap: clamp(24px, 3vw, 44px);
  align-items: start;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 80px;
}

.proof-summary--no-media { grid-template-columns: 1fr; }

@media (max-width: 1024px) {
  .proof-summary { padding: 0 48px; }
}

@media (max-width: 900px) {
  .proof-summary,
  .proof-summary--no-media { grid-template-columns: 1fr; padding: 0 24px; }
}

/* Photo side */
.ps-media { display: flex; flex-direction: column; gap: 14px; }

.ps-media__head {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}

.ps-media__title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--text-on-dark-2);
}

/* Case A: before + after */
.ps-ba {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.ps-ba__frame {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid rgba(212, 164, 55, 0.36);
  background: var(--bg-dark-2);
}

.ps-ba__frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Image "До" / "Після" tags */
.img-tag {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 6px 14px;
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: rgba(7, 8, 7, 0.85);
  border: 1px solid rgba(212, 164, 55, 0.45);
  color: var(--gold-text);
  backdrop-filter: blur(4px);
  z-index: 1;
}

.img-tag--after {
  color: #1E1812;
  background: linear-gradient(180deg, var(--gold-text), var(--gold-hover));
  border-color: transparent;
}

/* Case B: single photo */
.ps-single {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(212, 164, 55, 0.36);
}

.ps-single img {
  width: 100%;
  display: block;
  max-height: 480px;
  object-fit: cover;
}

/* Case C: 2×2 gallery */
.ps-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.ps-gallery__item {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--gold-line);
  background: var(--bg-dark-2);
  display: block;
}

.ps-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
}

.ps-gallery__item:hover img { transform: scale(1.04); }

/* ── Full-width project gallery (up to 12 + lightbox) ──────────── */
.prj-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.prj-gallery__item {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--gold-line);
  background: var(--bg-dark-2);
  border-radius: 8px;
  display: block;
  cursor: zoom-in;
}

.prj-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
}

.prj-gallery__item:hover img { transform: scale(1.05); }

@media (max-width: 900px) { .prj-gallery { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .prj-gallery { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* ── Lightbox overlay ──────────────────────────────────────────── */
.plx {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(14, 14, 14, 0.94);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.plx.is-open { opacity: 1; visibility: visible; }

.plx__img {
  max-width: 92vw;
  max-height: 86vh;
  object-fit: contain;
  border: 1px solid var(--gold-line);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
}

.plx__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  border: 1px solid var(--gold-line);
  background: rgba(28, 28, 28, 0.8);
  color: var(--gold-text);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.plx__btn:hover { background: rgba(212, 164, 55, 0.18); border-color: var(--gold); }
.plx__btn--prev { left: 24px; }
.plx__btn--next { right: 24px; }

.plx__close {
  position: absolute;
  top: 20px;
  right: 24px;
  width: 48px;
  height: 48px;
  border: 1px solid var(--gold-line);
  background: rgba(28, 28, 28, 0.8);
  color: var(--text-on-dark);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
}

.plx__close:hover { color: var(--gold-text); border-color: var(--gold); }

.plx__counter {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--text-on-dark-2);
  font-size: 14px;
  letter-spacing: 0.04em;
}

@media (max-width: 600px) {
  .plx__btn { width: 44px; height: 44px; font-size: 20px; }
  .plx__btn--prev { left: 8px; }
  .plx__btn--next { right: 8px; }
}

/* Summary side */
.ps-summary { display: flex; flex-direction: column; gap: 16px; }

.ps-summary__head {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.ps-summary__head h2 { color: var(--text-on-dark); }

.ps-cards {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--gold-line);
  border: 1px solid var(--gold-line);
}

.ps-card {
  background: var(--bg-dark-2);
  padding: 18px 20px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ps-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 3px;
  background: var(--gold);
}

.ps-card--result { background: #0E100F; }

.ps-card__label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}

.ps-card__text {
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-on-dark-2);
}

.ps-card__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ps-card__list li {
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-on-dark-2);
  padding-left: 15px;
  position: relative;
}

.ps-card__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 5px;
  height: 5px;
  background: var(--gold-text);
  border-radius: 50%;
}

/* Simple (no structured data) */
.ps-simple {
  border-left: 3px solid var(--gold);
  padding: 20px 24px;
  background: var(--bg-dark-2);
  border-top: 1px solid var(--gold-line);
  border-right: 1px solid var(--gold-line);
  border-bottom: 1px solid var(--gold-line);
}

.ps-simple__label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 12px;
}

.ps-simple__text {
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-on-dark-2);
}

/* ── Equipment list rows ────────────────────────────────────────────── */
.eq-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--gold-line);
  border: 1px solid var(--gold-line);
}

.eq-item {
  display: grid;
  grid-template-columns: 190px 1fr 140px;
  min-height: 130px;
  background: var(--bg-dark-2);
  transition: background 0.22s ease;
}

.eq-item:hover { background: #131614; }

.eq-item__photo {
  position: relative;
  overflow: hidden;
  background: var(--bg-dark-2);
}

.eq-item__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
}

.eq-item:hover .eq-item__photo img { transform: scale(1.04); }

.eq-item__ph {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: repeating-linear-gradient(135deg, rgba(212, 164, 55, 0.05) 0 8px, transparent 8px 18px);
  color: var(--gold);
  opacity: 0.45;
}

.eq-item__body {
  padding: 20px 26px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  border-left: 1px solid var(--gold-line);
}

.eq-item__title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

.eq-item__desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
}

.eq-item__cta-col {
  padding: 20px 22px;
  border-left: 1px solid var(--gold-line);
  display: flex;
  align-items: center;
  justify-content: center;
}

.eq-item__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-text);
  text-decoration: none;
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
  transition: color 0.2s ease;
  padding: 0;
}

.eq-item__link svg { transition: transform 0.25s ease; }
.eq-item__link:hover svg { transform: translateX(4px); }
.eq-item__link:hover { color: var(--gold); }

@media (max-width: 860px) {
  .eq-item {
    grid-template-columns: 150px 1fr;
    grid-template-rows: 1fr auto;
    min-height: 120px;
  }
  .eq-item__cta-col {
    grid-column: 2;
    border-left: none;
    border-top: 1px solid var(--gold-line);
    padding: 12px 26px;
    justify-content: flex-start;
  }
}

@media (max-width: 480px) {
  .eq-item { display: flex; flex-direction: column; min-height: auto; }
  .eq-item__photo { height: 180px; flex-shrink: 0; }
  .eq-item__body { border-left: none; border-top: 1px solid var(--gold-line); }
  .eq-item__cta-col { border-left: none; justify-content: flex-start; padding: 14px 20px; }
}

/* ── Project CTA ────────────────────────────────────────────────────── */
.prj-cta {
  position: relative;
  padding: clamp(56px, 6vw, 92px) 80px;
  overflow: hidden;
  background:
    radial-gradient(ellipse 70% 100% at 100% 0%, rgba(212, 164, 55, 0.10) 0%, transparent 60%),
    radial-gradient(ellipse 60% 90% at 0% 100%, rgba(212, 164, 55, 0.06) 0%, transparent 55%),
    linear-gradient(180deg, #0E100F 0%, #070807 100%);
  border-top: 1px solid var(--gold-line);
  border-bottom: 1px solid var(--gold-line);
}

.prj-cta__inner {
  position: relative;
  max-width: 1160px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(36px, 5vw, 80px);
  align-items: center;
}

.prj-cta__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(24px, 3vw, 40px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.prj-cta__text {
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-on-dark-2);
  max-width: 520px;
}

.prj-cta__actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
}

.prj-cta__actions .btn { width: 100%; }

.prj-cta__phone {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px solid var(--gold-line);
}

.prj-cta__phone-label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}

.prj-cta__phone-number {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text-on-dark);
  text-decoration: none;
  transition: color 0.2s ease;
}

.prj-cta__phone-number:hover { color: var(--gold); }

@media (max-width: 860px) {
  .prj-cta { padding: clamp(44px, 8vw, 68px) 24px; }
  .prj-cta__inner { grid-template-columns: 1fr; gap: 28px; }
}

/* ── Related projects ───────────────────────────────────────────────── */
.related__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 26px;
}

.related__head h2 { color: var(--text-on-dark); }

.related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

/* Project card (used in related + archive) */
.project-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: var(--bg-dark-2);
  border: 1px solid var(--gold-line);
  transition: border-color 0.3s ease, transform 0.3s ease;
}

.project-card:hover {
  border-color: rgba(212, 164, 55, 0.36);
  transform: translateY(-3px);
}

.project-card__thumb {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-bottom: 1px solid var(--gold-line);
  background: var(--bg-dark-2);
}

.project-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85);
  transition: transform 0.4s ease, filter 0.4s ease;
}

.project-card:hover .project-card__img {
  transform: scale(1.04);
  filter: saturate(1);
}

.project-card__thumb-ph {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: repeating-linear-gradient(135deg, rgba(212, 164, 55, 0.04) 0 8px, transparent 8px 18px);
  color: var(--text-on-dark-2);
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.project-card__thumb-ph svg { opacity: 0.4; color: var(--gold); }

.project-card__body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.project-card__meta {
  display: flex;
  justify-content: space-between;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.project-card__cat { color: var(--gold); }
.project-card__date { color: var(--text-on-dark-2); }

.project-card__title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.25;
  color: var(--text-on-dark);
}

.project-card__text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-on-dark-2);
}

@media (max-width: 860px) {
  .related__grid { grid-template-columns: repeat(2, 1fr); }
  .related__head { flex-direction: column; align-items: flex-start; }
}

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

/* ── Archive page ───────────────────────────────────────────────────── */
.prj-archive-hero {
  background: var(--bg-dark);
  padding: 80px 0 64px;
}

.prj-archive-hero .eyebrow { margin-bottom: 12px; display: block; }

.prj-archive-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: var(--text-on-dark);
  margin: 0 0 16px;
}

.prj-archive-hero__sub {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 640px;
}

.prj-archive-grid-section {
  background: var(--bg-dark);
  padding: 64px 0 96px;
}

.project-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 48px;
}

.prj-archive-empty {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: var(--text-on-dark-2);
  text-align: center;
  padding: 64px 0;
}

/* Pagination */
.prj-pagination {
  display: flex;
  justify-content: center;
}

.prj-pagination .nav-links {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.prj-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark-2);
  border: 1px solid var(--border-dark);
  text-decoration: none;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.prj-pagination .page-numbers:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.prj-pagination .page-numbers.current {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(212, 164, 55, 0.08);
}

.prj-pagination .page-numbers.dots { border: none; }

@media (max-width: 1024px) {
  .project-cards-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .project-cards-grid { grid-template-columns: 1fr; }
  .prj-archive-hero { padding: 56px 0 48px; }
  .prj-archive-hero__title { font-size: 40px; }
  .prj-archive-grid-section { padding: 48px 0 64px; }
}

/* ===== blocks/contacts.css ===== */
/* ─────────────────────────────────────────────────────────────────── */
/* Contacts page — card-based dark UI                                  */
/* ─────────────────────────────────────────────────────────────────── */

.contacts-page {
  background: var(--bg-dark);
}

/* ── Hero (dark) ────────────────────────────────────────────────────── */
.contacts-hero {
  background: var(--bg-dark);
  padding: 64px 0 48px;
}

.contacts-hero .eyebrow { margin-bottom: 20px; }

.contacts-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
  color: var(--text-on-dark);
  margin: 16px 0 16px;
}

.contacts-hero__subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  max-width: 560px;
  margin: 0;
}

/* ── Main section (dark, 2 data-cards) ─────────────────────────────── */
.contacts-main {
  background: var(--bg-dark);
  padding: 64px 0 96px;
}

.contacts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

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

/* ── Contacts list inside data-card--contacts ───────────────────────── */
.contacts-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.contacts-list__item {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--border-dark);
  align-items: center;
}

.contacts-list__item:last-child { border-bottom: none; }

.contacts-item__label {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--text-on-dark-2);
}

.contacts-item__value {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--text-on-dark);
  font-style: normal;
}

.contacts-item__value a {
  color: var(--text-on-dark);
  text-decoration: none;
  transition: color 0.2s ease;
}

.contacts-item__value a:hover { color: var(--gold); }

.contacts-item__value--phone {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--gold) !important;
  letter-spacing: 0.02em;
  transition: color 0.2s ease;
}

.contacts-item__value--phone:hover { color: var(--gold-hover) !important; }

/* ── Socials ────────────────────────────────────────────────────────── */
.contacts-socials {
  margin-top: 32px;
  padding-top: 32px;
  border-top: 1px solid var(--border-dark);
}

.contacts-socials__label {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--text-on-dark-2);
  display: block;
  margin-bottom: 16px;
}

.contacts-socials__icons {
  display: flex;
  align-items: center;
  gap: 12px;
}

.social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--gold-line);
  color: var(--gold);
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.social-icon:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--bg-dark);
}

.social-icon svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

/* ── Form card description ──────────────────────────────────────────── */
.contacts-form__sub {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-on-dark-2);
  margin: -16px 0 24px;
}

/* ── CF7 form — dark theme overrides ───────────────────────────────── */
.data-card--form .wpcf7-form p {
  margin-bottom: 0;
}

.data-card--form .wpcf7-form label {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-dark-2);
  display: block;
  margin-bottom: 6px;
}

.data-card--form .wpcf7-form input[type="text"],
.data-card--form .wpcf7-form input[type="email"],
.data-card--form .wpcf7-form input[type="tel"],
.data-card--form .wpcf7-form textarea {
  width: 100%;
  background: var(--bg-dark);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  color: var(--text-on-dark);
  padding: 14px 16px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  transition: border-color 0.2s ease;
  display: block;
  margin-bottom: 16px;
  box-sizing: border-box;
}

.data-card--form .wpcf7-form input:focus,
.data-card--form .wpcf7-form textarea:focus {
  outline: none;
  border-color: var(--gold);
}

.data-card--form .wpcf7-form input::placeholder,
.data-card--form .wpcf7-form textarea::placeholder {
  color: var(--text-on-dark-2);
  opacity: 1;
}

.data-card--form .wpcf7-form textarea {
  min-height: 120px;
  resize: vertical;
}

.data-card--form .wpcf7-form .wpcf7-acceptance label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-on-dark-2);
  font-size: 14px;
  font-weight: 400;
}

.data-card--form .wpcf7-form input[type="checkbox"]{width:18px;height:18px;flex-shrink:0;accent-color:var(--gold)}.data-card--form .wpcf7-form .wpcf7-submit{background:linear-gradient(178deg,var(--btn-gold-hi) 0%,var(--btn-gold-top) 30%,var(--btn-gold-mid) 68%,var(--btn-gold-bot) 100%)!important;color:var(--btn-text-ink)!important;border:0;border-radius:0;clip-path:var(--btn-skew);height:56px;min-width:200px;padding:0 38px;font-family:'Inter',sans-serif;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;filter:drop-shadow(0 4px 14px rgba(0,0,0,.35));transition:filter 0.22s ease,transform 0.22s ease;margin-top:8px;display:inline-block;width:auto}.data-card--form .wpcf7-form .wpcf7-submit:hover{filter:drop-shadow(0 2px 0 rgba(0,0,0,.45)) drop-shadow(0 12px 22px rgba(0,0,0,.42));transform:translateY(-1px)}.data-card--form .wpcf7-form .wpcf7-submit:active{transform:translateY(1px);filter:drop-shadow(0 2px 5px rgba(0,0,0,.3))}.contacts-form__fallback{padding:32px;background:var(--bg-dark-2);border-radius:8px;border:1px solid var(--border-dark);text-align:center}.contacts-form__fallback p{font-family:'Inter',sans-serif;font-size:16px;color:var(--text-on-dark-2);margin-bottom:16px}.contacts-map{background:var(--bg-dark);padding:32px 0 96px;border-top:1px solid var(--border-dark)}.contacts-map__title{font-family:'Oswald',sans-serif;font-size:clamp(24px, 3vw, 40px);font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--text-on-dark);margin:0 0 12px;text-align:center}.contacts-map__address{font-family:'Inter',sans-serif;font-size:16px;color:var(--text-on-dark-2);margin:0 0 32px;font-style:normal;text-align:center}.contacts-map__iframe{width:100%;aspect-ratio:16 / 6;border-radius:16px;overflow:hidden;border:1px solid var(--border-dark)}.contacts-map__iframe iframe{width:100%;height:100%;display:block;border:0;min-height:400px}@media (max-width:768px){.contacts-hero{padding:48px 0 40px}.contacts-hero__title{font-size:40px}.contacts-hero__subtitle{font-size:16px}.contacts-main{padding:48px 0 64px}.contacts-list__item{grid-template-columns:100px 1fr;gap:12px}.contacts-item__value--phone{font-size:18px}.contacts-map{padding:24px 0 64px}.contacts-map__iframe{aspect-ratio:4 / 3}.data-card--form .wpcf7-form .wpcf7-submit{width:100%;min-width:0;clip-path:var(--btn-skew-sm);height:52px;font-size:12px}}.pricing-hero{background:var(--bg-dark);padding:clamp(48px, 8vw, 96px) 0 clamp(32px, 5vw, 56px)}.pricing-hero__title{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.1;font-size:clamp(32px, 4vw, 56px);color:var(--text-on-dark);margin:12px 0 16px}.pricing-hero__intro{font-size:18px;line-height:1.6;color:var(--text-on-dark-2);max-width:760px}.pricing-table-section{background:var(--bg-dark);padding:0 0 clamp(56px, 8vw, 96px)}.pricing-table__wrap{overflow-x:auto;border:1px solid var(--border-dark);border-radius:12px;background:var(--bg-dark-2)}.pricing-table{width:100%;border-collapse:collapse;min-width:520px}.pricing-table th{text-align:left;font-family:'Inter',sans-serif;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-on-dark-2);padding:18px 24px;border-bottom:1px solid var(--gold-line);background:rgba(0,0,0,.2)}.pricing-table__price-col{text-align:right;white-space:nowrap}.pricing-table__cta-col{width:1%}.pricing-table td{padding:16px 24px;border-bottom:1px solid var(--border-dark);vertical-align:middle}.pricing-table tr:last-child td{border-bottom:none}.pricing-table__name{font-size:16px;color:var(--text-on-dark);font-weight:500}.pricing-table__name a{color:var(--text-on-dark);text-decoration:none;transition:color 0.2s ease;border-bottom:1px solid transparent}.pricing-table__name a:hover{color:var(--gold-text);border-bottom-color:var(--gold-line)}.pricing-table__price{text-align:right;white-space:nowrap;font-family:'Oswald',sans-serif;font-weight:700;font-size:22px;color:var(--gold-text)}.pricing-table__price span{font-size:13px;font-weight:400;color:var(--text-on-dark-2);margin-left:2px}.pricing-table__cta{text-align:right;white-space:nowrap}.pricing-table tbody tr{transition:background 0.15s ease}.pricing-table tbody tr:hover{background:rgba(212,164,55,.05)}.pricing-table__note{margin-top:20px;font-size:13px;line-height:1.6;color:var(--text-on-dark-2)}.pricing-cta{background:var(--bg-dark-2);padding:clamp(56px, 8vw, 96px) 0;text-align:center}.pricing-cta__title{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(28px, 3.5vw, 40px);color:var(--text-on-dark);margin-bottom:12px}.pricing-cta__sub{font-size:18px;color:var(--text-on-dark-2);max-width:620px;margin:0 auto 28px}.pricing-cta__actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}@media (max-width:600px){.pricing-table th,.pricing-table td{padding:14px 16px}.pricing-table__price{font-size:19px}.pricing-cta__actions .btn{width:100%;text-align:center}}.page-404__container{width:100%;max-width:1320px;margin-left:auto;margin-right:auto;padding-left:80px;padding-right:80px}.page-404__hero{background:var(--bg-dark);padding:96px 0 80px;text-align:center;border-bottom:1px solid var(--border-dark)}.page-404__number{display:block;font-family:'Oswald',sans-serif;font-size:clamp(96px, 16vw, 160px);font-weight:700;line-height:1;color:var(--gold);letter-spacing:.04em;margin-bottom:24px;text-shadow:0 0 80px rgba(212,164,55,.2)}.page-404__title{font-family:'Oswald',sans-serif;font-size:clamp(24px, 3vw, 40px);font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--text-on-dark);margin:0 0 16px}.page-404__subtitle{font-family:'Inter',sans-serif;font-size:18px;line-height:1.6;color:var(--text-on-dark-2);margin:0 0 40px}.page-404__actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.page-404__popular{background:var(--bg-dark);padding:80px 0 128px}.page-404__section-title{font-family:'Oswald',sans-serif;font-size:32px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--text-on-dark);text-align:center;margin:0 0 48px}.page-404__cats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.page-404__cat-card{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--border-dark);background:var(--bg-dark-2);text-decoration:none;transition:border-color 0.22s ease,transform 0.22s ease}.page-404__cat-card:hover{border-color:var(--gold-line);transform:translateY(-4px)}.page-404__cat-image{aspect-ratio:16 / 9;overflow:hidden}.page-404__cat-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.4s ease}.page-404__cat-card:hover .page-404__cat-image img{transform:scale(1.04)}.page-404__cat-name{display:block;font-family:'Oswald',sans-serif;font-size:18px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-on-dark);padding:16px 20px;transition:color 0.22s ease}.page-404__cat-card:hover .page-404__cat-name{color:var(--gold-text)}@media (max-width:1024px){.page-404__container{padding-left:48px;padding-right:48px}}@media (max-width:768px){.page-404__container{padding-left:24px;padding-right:24px}.page-404__hero{padding:64px 0 64px}.page-404__cats-grid{grid-template-columns:repeat(2,1fr)}.page-404__popular{padding:64px 0 80px}}@media (max-width:480px){.page-404__cats-grid{grid-template-columns:1fr}.page-404__actions{flex-direction:column;align-items:center}.page-404__actions .btn{width:100%;max-width:320px;justify-content:center}}.search-page__container{width:100%;max-width:1320px;margin-left:auto;margin-right:auto;padding-left:80px;padding-right:80px}.search-page__hero{background:var(--bg-dark);padding:72px 0 64px;border-bottom:1px solid var(--border-dark)}.search-page__hero .eyebrow{margin-bottom:12px}.search-page__title{font-family:'Oswald',sans-serif;font-size:clamp(24px, 3.5vw, 40px);font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.1;color:var(--text-on-dark);margin:0 0 32px}.search-form{display:flex;gap:0;max-width:640px}.search-form__input{flex:1;height:48px;padding:0 20px;background:var(--bg-dark-2);border:1px solid var(--border-dark);border-right:none;border-radius:6px 0 0 6px;font-family:'Inter',sans-serif;font-size:16px;color:var(--text-on-dark);outline:none;transition:border-color 0.2s ease}.search-form__input::placeholder{color:var(--text-on-dark-2)}.search-form__input:focus{border-color:var(--gold-line)}.search-form__submit{border-radius:0 6px 6px 0;display:flex;align-items:center;gap:8px;padding:0 24px;height:48px}.search-page__results{background:var(--bg-dark);padding:64px 0 128px}.search-page__count{font-family:'Inter',sans-serif;font-size:14px;color:var(--text-on-dark-2);margin:0 0 32px;border-bottom:1px solid var(--border-dark);padding-bottom:16px}.search-results{list-style:none;padding:0;margin:0 0 48px}.search-results>li{border-bottom:1px solid var(--border-dark)}.search-results__item{padding:32px 0;transition:none}.search-results__meta{display:flex;align-items:center;gap:12px;margin-bottom:10px}.search-results__type{font-family:'Inter',sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);background:rgba(212,164,55,.1);border:1px solid var(--gold-line);border-radius:4px;padding:2px 8px}.search-results__date{font-family:'Inter',sans-serif;font-size:12px;color:var(--text-on-dark-2)}.search-results__title{font-family:'Oswald',sans-serif;font-size:clamp(18px, 2vw, 24px);font-weight:700;text-transform:uppercase;letter-spacing:.02em;margin:0 0 10px}.search-results__title a{color:var(--text-on-dark);text-decoration:none;transition:color 0.2s ease}.search-results__title a:hover{color:var(--gold-text)}.search-results__excerpt{font-family:'Inter',sans-serif;font-size:16px;line-height:1.6;color:var(--text-on-dark-2);margin:0 0 16px;max-width:720px}.search-results__link{display:inline-flex;align-items:center;gap:6px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--gold-text);text-decoration:none;transition:color 0.2s ease,gap 0.2s ease}.search-results__link:hover{color:var(--gold);gap:10px}.search-page__pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap}.search-page__pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--border-dark);border-radius:6px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--text-on-dark-2);text-decoration:none;background:transparent;transition:border-color 0.2s ease,color 0.2s ease,background 0.2s ease}.search-page__pagination .page-numbers:hover{border-color:var(--gold-line);color:var(--gold-text)}.search-page__pagination .page-numbers.current{background:var(--gold);border-color:var(--gold);color:var(--bg-dark)}.search-page__empty{text-align:center;padding:64px 0}.search-page__empty-text{font-family:'Inter',sans-serif;font-size:18px;line-height:1.6;color:var(--text-on-dark-2);margin-bottom:32px}@media (max-width:1024px){.search-page__container{padding-left:48px;padding-right:48px}}@media (max-width:768px){.search-page__container{padding-left:24px;padding-right:24px}.search-page__hero{padding:48px 0 48px}.search-page__results{padding:48px 0 80px}.search-form{max-width:100%}.search-results__item{padding:24px 0}}@media (max-width:480px){.search-form{flex-direction:column}.search-form__input{border-right:1px solid var(--border-dark);border-bottom:none;border-radius:6px 6px 0 0}.search-form__submit{border-radius:0 0 6px 6px;justify-content:center;width:100%}}.pcb{position:fixed;inset:0;z-index:1200;pointer-events:none}.pcb[hidden]{display:none}.pcb__overlay{position:absolute;inset:0;background:rgba(8,9,8,.28);opacity:0;transition:opacity 0.3s ease;pointer-events:auto}.pcb.is-open .pcb__overlay{opacity:1}.pcb__card{position:absolute;right:24px;bottom:24px;width:360px;max-width:calc(100vw - 32px);background:var(--bg-dark-2);border:1px solid var(--gold-line);border-radius:14px;padding:24px 22px 18px;box-shadow:0 24px 60px rgba(0,0,0,.55);pointer-events:auto;transform:translateY(24px);opacity:0;transition:transform 0.32s cubic-bezier(.22,.61,.36,1),opacity 0.28s ease}.pcb.is-open .pcb__card{transform:translateY(0);opacity:1}.pcb__close{position:absolute;top:12px;right:12px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border-dark);border-radius:50%;color:var(--text-on-dark-2);cursor:pointer;transition:color 0.18s ease,border-color 0.18s ease}.pcb__close:hover{color:var(--text-on-dark);border-color:var(--gold-line)}.pcb__eyebrow{display:inline-block;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-text);margin-bottom:8px}.pcb__title{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;line-height:1.1;color:var(--text-on-dark);margin:0 0 8px}.pcb__sub{font-family:'Inter',sans-serif;font-size:14px;line-height:1.5;color:var(--text-on-dark-2);margin:0 0 14px}.pcb__benefits{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:6px}.pcb__benefits li{position:relative;padding-left:22px;font-family:'Inter',sans-serif;font-size:13px;line-height:1.4;color:var(--text-on-dark)}.pcb__benefits li::before{content:'';position:absolute;left:0;top:1px;width:14px;height:14px;background:rgba(212,164,55,.14);border-radius:50%}.pcb__benefits li::after{content:'';position:absolute;left:3.5px;top:5px;width:6px;height:3px;border-left:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(-45deg)}.pcb__field{margin-bottom:10px}.pcb__label{display:block;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;color:var(--text-on-dark-2);margin-bottom:5px}.pcb__label em{color:var(--gold-text);font-style:normal}.pcb__input,.pcb__textarea{width:100%;font-family:'Inter',sans-serif;font-size:16px;color:var(--text-on-dark);background:var(--bg-dark);border:1px solid var(--border-dark);border-radius:6px;padding:11px 13px;transition:border-color 0.18s ease,box-shadow 0.18s ease}.pcb__textarea{resize:vertical;min-height:44px}.pcb__input::placeholder,.pcb__textarea::placeholder{color:var(--text-on-dark-2);opacity:.6}.pcb__input:focus,.pcb__textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,164,55,.12)}.pcb__input--error{border-color:rgba(200,55,55,.6);box-shadow:0 0 0 3px rgba(200,55,55,.08)}.pcb__submit,.pcb__ok{width:100%;height:48px;margin-top:6px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#0E0E0E;background:var(--gold);border:none;border-radius:6px;cursor:pointer;transition:background 0.18s ease,box-shadow 0.18s ease}.pcb__submit:hover,.pcb__ok:hover{background:var(--gold-hover);box-shadow:0 0 18px rgba(212,164,55,.25)}.pcb__submit.is-loading{opacity:.7;pointer-events:none}.pcb__consent{font-family:'Inter',sans-serif;font-size:11px;line-height:1.4;color:var(--text-on-dark-2);margin:10px 0 0;text-align:center}.pcb__consent a{color:var(--gold-text);text-decoration:underline}.pcb__success{text-align:center;padding:8px 4px 4px}.pcb__success-icon{width:54px;height:54px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;color:var(--gold);background:rgba(212,164,55,.1);border-radius:50%}.pcb__success-title{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;color:var(--text-on-dark);margin-bottom:8px}.pcb__success-body{font-family:'Inter',sans-serif;font-size:14px;line-height:1.5;color:var(--text-on-dark-2);margin:0 0 16px}@media (max-width:600px){.pcb__overlay{background:rgba(8,9,8,.5)}.pcb__card{right:0;left:0;bottom:0;width:100%;max-width:100%;border-radius:16px 16px 0 0;border-left:none;border-right:none;border-bottom:none;padding:22px 20px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%)}.pcb.is-open .pcb__card{transform:translateY(0)}.pcb__title{font-size:22px}}@media (prefers-reduced-motion:reduce){.pcb__card,.pcb__overlay{transition:opacity 0.2s ease}.pcb__card{transform:none}}.gov-cta{padding:80px 0;background:radial-gradient(120% 100% at 0% 0%,rgba(212,164,55,.08),transparent 55%),var(--bg-dark);border-top:1px solid var(--border-dark);border-bottom:1px solid var(--border-dark)}.gov-cta__inner{display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center}.gov-cta__eyebrow{display:inline-block;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-text);margin-bottom:16px}.gov-cta__title{font-family:'Oswald',sans-serif;font-size:clamp(28px, 3.4vw, 40px);font-weight:700;line-height:1.1;text-transform:uppercase;letter-spacing:.01em;color:var(--text-on-dark);margin:0 0 14px}.gov-cta__sub{font-family:'Inter',sans-serif;font-size:18px;line-height:1.55;color:var(--text-on-dark-2);margin:0 0 24px}.gov-cta__types{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}.gov-cta__type{position:relative;display:inline-flex;align-items:center;height:32px;padding:0 20px;font-family:'Inter',sans-serif;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;color:var(--gold-text);background:linear-gradient(180deg,rgba(212,164,55,.52) 0%,rgba(180,138,56,.38) 50%,rgba(100,75,20,.52) 100%);clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);isolation:isolate}.gov-cta__type::before{content:'';position:absolute;inset:1px;background:linear-gradient(180deg,rgba(14,17,13,.94) 0%,rgba(10,13,10,.91) 100%);clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);z-index:-1}.gov-cta__form-wrap{background:var(--bg-dark-2);border:1px solid var(--gold-line);border-radius:14px;padding:28px 26px 22px;box-shadow:0 24px 60px rgba(0,0,0,.45)}.gov-cta__field{margin-bottom:12px}.gov-cta__label{display:block;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;color:var(--text-on-dark-2);margin-bottom:6px}.gov-cta__label em{color:var(--gold-text);font-style:normal}.gov-cta__input{width:100%;font-family:'Inter',sans-serif;font-size:16px;color:var(--text-on-dark);background:var(--bg-dark);border:1px solid var(--border-dark);border-radius:6px;padding:12px 14px;transition:border-color 0.18s ease,box-shadow 0.18s ease}.gov-cta__input::placeholder{color:var(--text-on-dark-2);opacity:.6}.gov-cta__input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,164,55,.12)}.gov-cta__input--error{border-color:rgba(200,55,55,.6);box-shadow:0 0 0 3px rgba(200,55,55,.08)}.gov-cta__submit{width:100%;min-height:50px;margin-top:8px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#0E0E0E;background:var(--gold);border:none;border-radius:6px;cursor:pointer;transition:background 0.18s ease,box-shadow 0.18s ease}.gov-cta__submit:hover{background:var(--gold-hover);box-shadow:0 0 18px rgba(212,164,55,.25)}.gov-cta__submit.is-loading{opacity:.7;pointer-events:none}.gov-cta__consent{font-family:'Inter',sans-serif;font-size:11px;line-height:1.4;color:var(--text-on-dark-2);margin:10px 0 0;text-align:center}.gov-cta__consent a{color:var(--gold-text);text-decoration:underline}.gov-cta__success{text-align:center;padding:12px 4px}.gov-cta__success-icon{width:54px;height:54px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;color:var(--gold);background:rgba(212,164,55,.1);border-radius:50%}.gov-cta__success-title{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;color:var(--text-on-dark);margin-bottom:8px}.gov-cta__success-body{font-family:'Inter',sans-serif;font-size:14px;line-height:1.5;color:var(--text-on-dark-2);margin:0 0 12px}.gov-cta__success-phone{font-family:'Inter',sans-serif;font-size:14px;color:var(--text-on-dark-2)}.gov-cta__success-phone a{color:var(--gold-text);font-weight:600}@media (max-width:860px){.gov-cta{padding:64px 0}.gov-cta__inner{grid-template-columns:1fr;gap:32px}}