:root {
      --brand-red: #ED2124;
      --brand-black: #141414;
      --hero-black: #050505;
      --white: #FFFFFF;
      --zip-lavender: #D9C8FF;
      --container: 1480px;
      --font-family: "Onest", sans-serif;
      --font-display: "Onest", sans-serif;
      --h1-desktop: 68px;
      --h2-desktop: 44px;
      --h3-desktop: 32px;
      --h4-desktop: 26px;
      --h5-desktop: 20px;
      --h6-desktop: 18px;
      --h1-mobile: 42px;
      --h2-mobile: 26px;
      --h3-mobile: 22px;
      --h4-mobile: 20px;
      --h5-mobile: 18px;
      --h6-mobile: 17px;
      --body-m: 16px;
      --body-s: 14px;
      --body-xs: 12px;
      --caption: 10px;
      --header-top: 76px;
      --header-nav: 48px;
      --header-height: calc(var(--header-top) + var(--header-nav));
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-nav) + 12px); }
    body {
      margin: 0;
      min-width: 320px;
      color: var(--brand-black);
      background: var(--hero-black);
      font-family: var(--font-family);
      -webkit-font-smoothing: antialiased;
    }
    img { display: block; max-width: 100%; }
    a { color: inherit; }
    button, a { -webkit-tap-highlight-color: transparent; }
    :focus-visible { outline: 3px solid var(--brand-red); outline-offset: 4px; }

    .site-header { position: relative; z-index: 20; background: var(--white); }
    .header-main {
      height: var(--header-top);
      min-height: var(--header-top);
      border-bottom: 1px solid #e5e5e5;
    }
    .header-main__inner {
      width: min(calc(100% - 56px), var(--container));
      height: var(--header-top);
      min-height: var(--header-top);
      margin: 0 auto;
      display: grid;
      grid-template-columns: 230px minmax(320px, 1.2fr) minmax(290px, 1.1fr) minmax(260px, 1fr) auto;
      align-items: center;
      gap: clamp(14px, 1.2vw, 20px);
    }
    .brand { display: inline-flex; align-items: center; min-height: 52px; text-decoration: none; }
    .brand img { width: 190px; height: auto; }
    .info-block {
      height: 60px;
      min-height: 60px;
      padding-left: clamp(16px, 2vw, 30px);
      border-left: 1px solid #d8d8d8;
      display: flex;
      align-items: flex-start;
      justify-content: center;
      flex-direction: column;
      font-size: 11px;
      font-weight: 400;
      line-height: 1.45;
    }
    .intro strong { display: block; font-family: var(--font-family); font-size: 13px; font-weight: 700; line-height: 1.3; margin-bottom: 2px; }
    .intro span { font-size: 13px; line-height: 1.4; white-space: nowrap; }
    .address, .phones { position: relative; padding-left: 56px; }
    .address::before, .phones::before {
      content: "";
      position: absolute;
      left: 13px;
      top: 50%;
      width: 32px;
      height: 32px;
      border: 1px solid rgba(237,33,36,.42);
      border-radius: 50%;
      background-color: rgba(237,33,36,.07);
      background-position: center;
      background-repeat: no-repeat;
      background-size: 17px 17px;
      box-shadow: 0 4px 12px rgba(237,33,36,.10);
      transform: translateY(-50%);
    }
    .address::before {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ED2124' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
    }
    .phones::before {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.5 15.5 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.7 21 3 13.3 3 3.7c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.2 2.2Z' fill='%23ED2124'/%3E%3C/svg%3E");
    }
    .phones a { display: block; font-family: var(--font-family); font-weight: 700; font-size: 13px; line-height: 1.3; text-decoration: none; white-space: nowrap; }
    .phones a:hover { color: var(--brand-red); }
    .hours { position: static; margin-top: 2px; font-size: 12px; line-height: 1.25; white-space: nowrap; }
    .button {
      min-height: 50px;
      padding: 0 26px;
      border: 1px solid var(--brand-red);
      border-radius: 5px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      color: var(--white);
      background: var(--brand-red);
      font-family: var(--font-family);
      font-size: 10px;
      font-weight: 700;
      line-height: 1;
      text-decoration: none;
      text-align: center;
      cursor: pointer;
      transition: transform .2s ease, background-color .2s ease, border-color .2s ease;
    }
    .button::after { content: "→"; transition: transform .2s ease; }
    .button:hover { background: #cc1518; border-color: #cc1518; transform: translateY(-2px); }
    .button:hover::after { transform: translateX(4px); }
    .header-cta { min-width: 190px; min-height: 46px; font-size: 11px; }
    .header-cta::after { display: none; }

    .nav-bar {
      height: var(--header-nav);
      min-height: var(--header-nav);
      border-bottom: 1px solid #e7e7e7;
      background: var(--white);
    }
    .nav-bar.is-fixed {
      position: fixed;
      z-index: 80;
      top: 0;
      right: 0;
      left: 0;
      box-shadow: 0 8px 24px rgba(0, 0, 0, .10);
      animation: nav-fixed-in .22s ease-out both;
    }
    .site-header.has-fixed-nav { padding-bottom: var(--header-nav); }
    @keyframes nav-fixed-in {
      from { opacity: 0; transform: translateY(-8px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .nav-list {
      width: min(calc(100% - 80px), 1400px);
      height: var(--header-nav);
      min-height: var(--header-nav);
      margin: 0 auto;
      padding: 0;
      list-style: none;
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      align-items: stretch;
    }
    .nav-list a {
      height: 100%; min-height: var(--header-nav);
      display: flex; align-items: center; justify-content: center;
      position: relative;
      padding-inline: 6px;
      font-family: var(--font-family); font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap;
    }
    .nav-list a::after {
      content: ""; position: absolute; left: 50%; right: 50%; bottom: -1px;
      height: 3px; background: var(--brand-red); transition: left .2s ease, right .2s ease;
    }
    .nav-list a:hover::after { left: 28%; right: 28%; }

    .mobile-actions { display: none; align-items: center; gap: 6px; }
    .icon-button {
      width: 46px; height: 46px; border: 0; border-radius: 4px;
      display: grid; place-items: center; color: var(--brand-black); background: transparent;
    }
    .icon-button svg { width: 25px; height: 25px; }
    .mobile-phone { color: var(--brand-red); }

    .hero {
      position: relative;
      min-height: calc(100vh - var(--header-height));
      min-height: calc(100dvh - var(--header-height));
      height: calc(100vh - var(--header-height));
      height: calc(100dvh - var(--header-height));
      max-height: none;
      overflow: hidden;
      color: var(--white);
      background: var(--hero-black);
      isolation: isolate;
      animation: hero-in .6s ease-out both;
    }
    .hero__inner {
      position: relative; z-index: 3;
      width: min(calc(100% - 146px), 1426px);
      height: 100%; margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(520px, 40%) 1fr;
    }
    .hero__content {
      align-self: start;
      padding-top: clamp(42px, 15vh, 150px);
      position: relative; z-index: 4;
    }
    .hero h1 {
      margin: 0;
      font-family: var(--font-display);
      font-size: clamp(56px, 4.4vw, var(--h1-desktop));
      font-weight: 700;
      line-height: 1.15;
      letter-spacing: -1.5px;
    }
    .hero h1 span { display: block; white-space: nowrap; }
    .hero h1 .accent { color: var(--brand-red); }
    .hero__lead {
      margin: 18px 0 85px 0;
      max-width: 520px;
      color: #f0f0f0;
      font-size: var(--body-s);
      font-weight: 400;
      line-height: 1.5;
    }
    .hero__lead .order { display: block; margin-top: 2px; }
    .hero__lead strong { color: var(--brand-red); font-weight: 500; }
    .hero__actions { display: flex; gap: 18px; margin-top: 40px; }
    .hero__actions .button { min-width: 238px; font-size: 13px; white-space: nowrap; }
    .hero__actions .button--outline { min-width: 240px; }
    .hero__actions .button:first-child { position: relative; overflow: hidden; }
    .hero__actions .button:first-child::before {
      content: "";
      position: absolute;
      top: 0;
      left: -100%;
      width: 48px;
      height: 100%;
      background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.72), rgba(255,255,255,.08));
      box-shadow: 0 0 14px rgba(255,255,255,.28);
      opacity: .92;
      transform: skewX(-20deg);
      transition: opacity .3s ease-in-out;
      pointer-events: none;
      animation: button-glint 6s ease-in-out 2s infinite;
    }
    .hero__actions .button:first-child:hover::before { opacity: 0; }
    .button--outline { background: transparent; }
    .button--outline:hover { background: var(--brand-red); border-color: var(--brand-red); }
    .facts {
      margin: 40px 0 0; padding: 0;
      display: flex; align-items: stretch;
      list-style: none;
      width: min(820px, 70vw);
    }
    .fact { flex: 1 1 0; min-width: 0; padding-right: 24px; }
    @media (min-width: 781px) {
      .fact:first-child { flex-grow: 1.22; }
      .fact:nth-child(2) { flex-grow: 1.15; }
    }
    .fact + .fact { min-width: 0; padding-left: 24px; border-left: 1px solid rgba(255,255,255,.65); }
    .fact:last-child { min-width: 0; }
    .fact strong, .fact span { display: block; }
    .fact strong { color: var(--brand-red); font-family: var(--font-family); font-size: 16px; font-weight: 700; line-height: 1.4; }
    .fact span { margin-top: 8px; color: #f0f0f0; font-size: 14px; font-weight: 400; line-height: 1.5; }

    .product-scene {
      position: absolute;
      z-index: 1;
      inset: 0;
      overflow: hidden;
      pointer-events: none;
    }
    .product-scene::after {
      content: ""; position: absolute; inset: 0;
      background: linear-gradient(90deg, rgba(5,5,5,.16) 0, rgba(5,5,5,.08) 14%, transparent 32%);
    }
    .product-scene img {
      position: absolute;
      inset: 0;
      width: 100%;
      max-width: none;
      height: 100%;
      object-fit: contain;
      object-position: right center;
      user-select: none;
    }
    .product-scene video {
      display: block;
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      opacity: 0;
      transition: opacity .6s ease;
      pointer-events: none;
    }
    .product-scene video.is-ready { opacity: 1; }
    .hero__shade {
      position: absolute; z-index: 2; inset: 0 auto 0 0; width: 52%; pointer-events: none;
      background: linear-gradient(90deg, rgba(3,3,3,.76) 0%, rgba(3,3,3,.62) 58%, rgba(3,3,3,.26) 82%, transparent 100%);
    }

    @keyframes hero-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
    @keyframes button-glint {
      0% { left: -100%; }
      100% { left: 200%; }
    }

    @media (max-width: 1320px) {
      :root { --header-top: 76px; --header-nav: 48px; }
      .header-main__inner { width: min(calc(100% - 40px), 1240px); grid-template-columns: 225px 1fr 1.05fr 1fr auto; gap: 12px; }
      .brand img { width: 185px; }
      .info-block { padding-left: 16px; font-size: 12px; }
      .intro strong { font-size: 12px; }
      .intro span, .hours { font-size: 12px; }
      .intro span { white-space: normal; }
      .address, .phones { padding-left: 52px; }
      .address::before, .phones::before { left: 9px; }
      .phones a { font-size: 12px; }
      .header-cta { min-width: 170px; padding-inline: 18px; }
      .hero__inner { width: calc(100% - 64px); grid-template-columns: 465px 1fr; }
      .hero h1 { font-size: clamp(50px, 4.6vw, var(--h1-desktop)); }
      .hero__actions { gap: 16px; }
      .hero__actions .button { min-width: 210px; padding-inline: 18px; }
      .facts { margin-top: 30px; }
    }

    @media (max-width: 1080px) {
      :root { --header-top: 72px; --header-nav: 46px; }
      .header-main__inner { height: var(--header-top); min-height: var(--header-top); grid-template-columns: 210px 1fr 1fr auto; }
      .brand img { width: 175px; }
      .intro { display: none; }
      .address { border-left: 0; padding-left: 36px; }
      .address::before { left: 4px; }
      .header-cta { min-width: 154px; font-size: 10px; }
      .nav-list { width: calc(100% - 28px); }
      .nav-list a { font-size: 10px; }
      .hero__inner { width: calc(100% - 48px); grid-template-columns: 410px 1fr; }
      .hero__content { padding-top: 44px; }
      .hero h1 { font-size: 52px; }
      .hero__lead { font-size: 13px; }
      .hero__actions { flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 26px; }
      .hero__actions .button { width: 255px; min-height: 52px; }
      .facts { margin-top: 34px; }
      .fact { min-width: 105px; padding-right: 20px; }
      .fact + .fact { min-width: 150px; padding-left: 22px; }
      .fact strong { font-size: 16px; }
      .fact span { font-size: 14px; }
      .hero__shade { width: 62%; }
    }

    @media (max-width: 780px) {
      :root { --header-top: 68px; --header-nav: 0px; }
      .header-main { min-height: var(--header-top); }
      .header-main__inner { width: calc(100% - 32px); min-height: var(--header-top); display: flex; justify-content: space-between; }
      .brand { min-height: 48px; }
      .brand img { width: 175px; }
      .info-block, .header-cta, .nav-bar { display: none; }
      .nav-bar.is-open { display: block; position: absolute; top: var(--header-top); left: 0; right: 0; background: var(--white); box-shadow: 0 14px 30px rgba(0,0,0,.18); }
      .nav-bar.is-open .nav-list { width: 100%; min-height: 0; display: flex; flex-direction: column; padding: 8px 16px 14px; }
      .nav-bar.is-open .nav-list a { min-height: 48px; justify-content: flex-start; padding-inline: 12px; }
      .mobile-actions { display: flex; }
      .hero { height: auto; min-height: calc(100svh - var(--header-top)); max-height: none; overflow: hidden; display: flex; flex-direction: column; }
      .hero__inner { display: contents; }
      .hero__content { width: calc(100% - 40px); margin: 0 auto; padding-top: 46px; display: contents; }
      .hero h1 { order: 1; width: calc(100% - 40px); margin: 38px auto 0; font-size: clamp(34px, 9.5vw, var(--h1-mobile)); letter-spacing: -1px; line-height: 1.2; position: relative; z-index: 4; }
      .hero__lead { order: 2; width: calc(100% - 40px); margin: 20px auto 0; font-size: var(--body-s); position: relative; z-index: 4; }
      .hero__actions { order: 3; width: calc(100% - 40px); margin: 28px auto 0; flex-direction: column; gap: 12px; position: relative; z-index: 4; }
      .hero__actions .button { width: 100%; min-height: 50px; }
      .product-scene { order: 4; position: relative; inset: auto; width: 100%; height: 475px; margin-top: 26px; overflow: hidden; }
      .product-scene::after { background: linear-gradient(180deg, var(--hero-black) 0, transparent 13%, transparent 84%, var(--hero-black) 100%); }
      .product-scene img { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 72% center; }
      .product-scene video { inset: 0; width: 100%; height: 100%; }
      .hero__shade { display: none; }
      .facts { order: 5; width: calc(100% - 40px); margin: 0 auto 34px; position: relative; z-index: 5; }
      .facts { flex-direction: column; }
      .fact { flex: none; min-width: 0; padding: 18px 0; }
      .fact + .fact { min-width: 0; padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.45); }
      .fact:last-child { min-width: 0; }
      .fact strong { font-size: 16px; }
      .fact span { font-size: 14px; }
    }

    @media (max-width: 430px) {
      .header-main__inner { width: calc(100% - 24px); }
      .brand img { width: 168px; }
      .icon-button { width: 44px; height: 44px; }
      .hero h1, .hero__lead, .hero__actions, .facts { width: calc(100% - 32px); }
      .hero h1 { margin-top: 34px; font-size: clamp(34px, 9.5vw, var(--h1-mobile)); }
      .hero__lead { margin-top: 18px; font-size: var(--body-xs); }
      .hero__actions { margin-top: 24px; }
      .product-scene { height: 410px; margin-top: 20px; }
      .facts { margin-bottom: 28px; }
      .fact { padding-right: 9px; }
      .fact + .fact { padding-left: 11px; }
      .fact strong { font-size: 15px; }
      .fact span { font-size: 14px; }
    }

    @media (max-width: 370px) {
      .brand img { width: 150px; }
      .mobile-actions { gap: 0; }
      .hero h1 { font-size: 34px; }
      .hero__lead { font-size: var(--body-xs); }
      .product-scene { height: 385px; }
      .fact strong { font-size: 15px; }
      .fact span { font-size: 13px; }
    }

    html {
      overflow-y: scroll;
      scrollbar-gutter: stable;
    }
    body.modal-open { overscroll-behavior: none; }
    .lead-modal {
      position: fixed;
      z-index: 100;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 16px;
      visibility: hidden;
      pointer-events: none;
      transition: visibility 0s linear .45s;
    }
    .lead-modal.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }
    .lead-modal__backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0,0,0,.74);
      backdrop-filter: blur(7px);
      -webkit-backdrop-filter: blur(7px);
      opacity: 0;
      transition: opacity .38s ease;
    }
    .lead-modal.is-open .lead-modal__backdrop { opacity: 1; }
    .lead-modal__dialog {
      position: relative;
      width: min(920px, calc(100vw - 32px));
      max-height: calc(100dvh - 32px);
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 24px;
      display: grid;
      grid-template-columns: .88fr 1.12fr;
      overflow: hidden;
      color: var(--white);
      background: #0b0b0b;
      box-shadow: 0 35px 90px rgba(0,0,0,.6), 0 0 35px rgba(237,33,36,.12);
      opacity: 0;
      transform: translateY(34px) scale(.965);
      transition: opacity .35s ease, transform .48s cubic-bezier(.22,1,.36,1);
    }
    .lead-modal.is-open .lead-modal__dialog { opacity: 1; transform: none; }
    .lead-modal__close {
      position: absolute;
      z-index: 4;
      top: 16px;
      right: 16px;
      width: 42px;
      height: 42px;
      padding: 0;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--white);
      background: rgba(10,10,10,.68);
      backdrop-filter: blur(8px);
      cursor: pointer;
      transition: transform .25s ease, background-color .2s ease;
    }
    .lead-modal__close:hover { transform: rotate(90deg); background: var(--brand-red); }
    .lead-modal__close svg { width: 19px; height: 19px; }
    .lead-modal__media {
      position: relative;
      min-height: 520px;
      overflow: hidden;
      background-color: var(--lead-media-bg, #f1eeeb);
    }
    .lead-modal__media::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: radial-gradient(110% 100% at 24% 16%, rgba(255,255,255,.3), rgba(255,255,255,0) 54%);
      pointer-events: none;
    }
    .lead-modal__media::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.03) 52%, rgba(0,0,0,.88) 100%);
      pointer-events: none;
    }
    .lead-modal__media img {
      position: absolute;
      z-index: 1;
      inset: 18px 16px 88px;
      display: block;
      width: calc(100% - 32px);
      height: calc(100% - 106px);
      object-fit: contain;
      object-position: center;
      filter: drop-shadow(0 12px 24px rgba(0,0,0,.09));
    }
    .lead-modal__media-copy { position: absolute; z-index: 2; left: 28px; right: 28px; bottom: 28px; }
    .lead-modal:not(.is-product-request) .lead-modal__media {
      background: linear-gradient(180deg, #f8f7f5 0%, #efede9 100%);
    }
    .lead-modal:not(.is-product-request) .lead-modal__media::before {
      content: '';
      position: absolute;
      z-index: 1;
      inset: 0;
      background: radial-gradient(100% 90% at 50% 25%, rgba(255,255,255,.92), rgba(255,255,255,0) 72%);
      pointer-events: none;
    }
    .lead-modal:not(.is-product-request) .lead-modal__media img {
      inset: 28px 26px;
      width: calc(100% - 52px);
      height: calc(100% - 56px);
      object-fit: contain;
      object-position: center;
      opacity: 1;
      filter: drop-shadow(0 18px 34px rgba(0,0,0,.10));
    }
    .lead-modal.is-product-request .lead-modal__media img { opacity: 1; }

    .lead-modal__media-copy span { display: block; margin-bottom: 8px; color: var(--brand-red); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
    .lead-modal__media-copy strong { display: block; max-width: 300px; font-family: var(--font-display); font-size: 21px; line-height: 1.3; }
    .lead-modal__content { align-self: center; padding: 58px 54px 52px; }
    .lead-modal__content > * { opacity: 0; transform: translateY(12px); transition: opacity .35s ease, transform .42s cubic-bezier(.22,1,.36,1); }
    .lead-modal.is-open .lead-modal__content > * { opacity: 1; transform: none; }
    .lead-modal.is-open .lead-modal__eyebrow { transition-delay: .12s; }
    .lead-modal.is-open .lead-modal__title { transition-delay: .17s; }
    .lead-modal.is-open .lead-modal__text { transition-delay: .22s; }
    .lead-modal.is-open .lead-form { transition-delay: .27s; }
    .lead-modal__eyebrow { margin: 0 0 10px; color: var(--brand-red); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
    .lead-modal__title { margin: 0; font-family: var(--font-display); font-size: clamp(28px, 3vw, 42px); line-height: 1.12; letter-spacing: -1px; }
    .lead-modal__text { margin: 16px 0 28px; max-width: 430px; color: #cfcfcf; font-size: 14px; line-height: 1.55; }
    .lead-form { display: grid; gap: 15px; }
    .lead-field { display: grid; gap: 7px; color: #d7d7d7; font-size: 12px; font-weight: 600; }
    .lead-field input {
      width: 100%;
      height: 54px;
      padding: 0 17px;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 10px;
      color: var(--white);
      background: rgba(255,255,255,.055);
      font: 500 15px/1 var(--font-family);
      outline: 0;
      transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
    }
    .lead-field input::placeholder { color: #777; }
    .lead-field input:focus { border-color: var(--brand-red); background: rgba(255,255,255,.075); box-shadow: 0 0 0 4px rgba(237,33,36,.12); }
    .lead-form__submit {
      min-height: 56px;
      margin-top: 4px;
      border: 1px solid var(--brand-red);
      border-radius: 10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      color: var(--white);
      background: var(--brand-red);
      font-family: var(--font-family);
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    .lead-form__submit:hover { transform: translateY(-2px); background: #d6191c; box-shadow: 0 12px 28px rgba(237,33,36,.22); }
    .lead-form__submit:disabled { cursor: wait; transform: none; opacity: .8; }
    .lead-form__submit svg { width: 18px; height: 18px; transition: transform .2s ease; }
    .lead-form__submit:hover svg { transform: translateX(3px); }
    .lead-form__submit.is-success { background: #1d9d55; border-color: #1d9d55; }
    .lead-form__note { margin: 0; color: #858585; font-size: 10px; line-height: 1.45; text-align: center; }

    @media (max-width: 700px) {
      .lead-modal { padding: 12px; }
      .lead-modal__dialog { width: min(100%, 470px); max-height: calc(100dvh - 24px); grid-template-columns: 1fr; overflow-y: auto; border-radius: 20px; }
      .lead-modal__media { min-height: 170px; max-height: 170px; }
      .lead-modal__media img { inset: 10px 12px 54px; width: calc(100% - 24px); height: calc(100% - 64px); object-fit: contain; object-position: center; }
      .lead-modal__media-copy { left: 20px; right: 72px; bottom: 17px; }
      .lead-modal__media-copy span { margin-bottom: 4px; font-size: 10px; }
      .lead-modal__media-copy strong { font-size: 16px; }
      .lead-modal__content { padding: 26px 22px 24px; }
      .lead-modal__title { font-size: 27px; }
      .lead-modal__text { margin: 12px 0 20px; font-size: 13px; }
      .lead-field input { height: 50px; }
      .lead-form__submit { min-height: 52px; }
      .lead-modal__close { top: 12px; right: 12px; width: 38px; height: 38px; }
    }

    .exit-modal {
      position: fixed;
      z-index: 1300;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 18px;
      visibility: hidden;
      pointer-events: none;
      transition: visibility 0s linear .42s;
    }
    .exit-modal.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }
    .exit-modal__backdrop {
      position: absolute; inset: 0; background: rgba(3,3,4,.78); backdrop-filter: blur(9px);
      opacity: 0; transition: opacity .34s ease;
    }
    .exit-modal.is-open .exit-modal__backdrop { opacity: 1; }
    .exit-modal__dialog {
      position: relative; z-index: 1;
      display: grid; grid-template-columns: minmax(330px,.95fr) minmax(410px,1.05fr);
      width: min(930px, calc(100vw - 36px)); max-height: calc(100dvh - 36px); overflow: hidden;
      border: 1px solid rgba(255,255,255,.15); border-radius: 26px;
      color: #fff; background: #101113; box-shadow: 0 34px 100px rgba(0,0,0,.62);
      opacity: 0; transform: translateY(26px) scale(.97);
      transition: opacity .3s ease, transform .46s cubic-bezier(.22,1,.36,1);
    }
    .exit-modal.is-open .exit-modal__dialog { opacity: 1; transform: none; }
    .exit-modal__visual {
      position: relative; min-height: 510px; display: grid; place-items: center; padding: 34px;
      background: rgb(245,243,243); overflow: hidden;
    }
    .exit-modal__visual::after {
      content: ""; position: absolute; inset: auto 0 0; height: 42%;
      background: linear-gradient(180deg, transparent, rgba(16,17,19,.2)); pointer-events: none;
    }
    .exit-modal__visual img { width: 108%; max-width: none; object-fit: contain; filter: drop-shadow(0 18px 28px rgba(0,0,0,.12)); }
    .exit-modal__badge {
      position: absolute; z-index: 2; left: 24px; top: 24px; padding: 9px 12px; border-radius: 999px;
      color: #fff; background: var(--brand-red); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
    }
    .exit-modal__content { align-self: center; padding: 54px 50px 48px; }
    .exit-modal__eyebrow { margin: 0 0 10px; color: var(--brand-red); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
    .exit-modal__title { margin: 0; font-family: var(--font-display); font-size: clamp(32px,3.3vw,48px); line-height: 1.06; letter-spacing: -1.3px; }
    .exit-modal__text { margin: 17px 0 20px; color: #c7c7c9; font-size: 14px; line-height: 1.6; }
    .exit-modal__benefits { display: grid; gap: 10px; margin: 0 0 26px; padding: 0; list-style: none; }
    .exit-modal__benefits li { display: flex; gap: 9px; color: #ececee; font-size: 13px; line-height: 1.4; }
    .exit-modal__benefits .material-symbols-rounded { color: var(--brand-red); font-size: 19px; }
    .exit-modal__cta { width: 100%; min-height: 54px; border: 0; border-radius: 9px; background: var(--brand-red); color: #fff; font: 700 13px/1 var(--font-family); cursor: pointer; transition: transform .2s ease, background-color .2s ease; }
    .exit-modal__cta:hover { transform: translateY(-2px); background: #d6191c; }
    .exit-modal__skip { display: block; margin: 15px auto 0; padding: 4px; border: 0; background: transparent; color: #858589; font: 500 11px/1.3 var(--font-family); cursor: pointer; }
    .exit-modal__skip:hover { color: #fff; }
    .exit-modal__close {
      position: absolute; z-index: 4; top: 16px; right: 16px; width: 42px; height: 42px; display: grid; place-items: center;
      border: 1px solid rgba(255,255,255,.22); border-radius: 50%; background: rgba(16,17,19,.8); color: #fff; cursor: pointer;
      transition: transform .2s ease, background-color .2s ease;
    }
    .exit-modal__close:hover { transform: rotate(90deg); background: var(--brand-red); }
    @media (max-width: 760px) {
      .exit-modal { padding: 12px; }
      .exit-modal__dialog { grid-template-columns: 1fr; width: min(100%, 500px); max-height: calc(100dvh - 24px); overflow-y: auto; border-radius: 20px; }
      .exit-modal__visual { min-height: 180px; max-height: 180px; padding: 8px 70px; }
      .exit-modal__visual img { width: 100%; max-height: 180px; }
      .exit-modal__badge { left: 14px; top: 14px; font-size: 9px; }
      .exit-modal__content { padding: 25px 22px 22px; }
      .exit-modal__title { font-size: 29px; }
      .exit-modal__text { margin: 12px 0 15px; font-size: 13px; }
      .exit-modal__benefits { margin-bottom: 20px; }
    }

    .header-address-trigger {
      width: 100%;
      font: inherit;
      text-align: left;
      cursor: pointer;
      appearance: none;
      transition: none;
    }
    .header-address-trigger:hover {
      border-color: #e2e2df;
      background: #fff;
      box-shadow: 0 7px 22px rgba(20,20,20,.045);
      transform: none;
    }
    .header-address-trigger:focus-visible {
      outline: 2px solid rgba(237,33,36,.62);
      outline-offset: 3px;
    }
    .header-address-trigger .header-contact__content {
      transition: color .2s ease;
    }
    .header-address-trigger:hover .header-contact__content {
      color: var(--brand-red);
    }
    .header-address-trigger:hover .header-contact__icon {
      color: var(--brand-red);
    }
    .header-address-trigger:focus-visible .header-contact__icon {
      color: var(--brand-red);
    }
    .header-address-trigger:focus-visible:not(:hover) .header-contact__content {
      color: inherit;
    }
    .header-address-trigger:focus:not(:focus-visible) {
      outline: 0;
    }

    .map-modal {
      position: fixed;
      z-index: 110;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 20px;
      visibility: hidden;
      pointer-events: none;
      transition: visibility 0s linear .3s;
    }
    .map-modal.is-open {
      visibility: visible;
      pointer-events: auto;
      transition-delay: 0s;
    }
    .map-modal__backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, .72);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
      opacity: 0;
      transition: opacity .26s ease;
    }
    .map-modal.is-open .map-modal__backdrop { opacity: 1; }
    .map-modal__dialog {
      position: relative;
      width: min(950px, calc(100vw - 40px));
      max-height: calc(100dvh - 40px);
      padding: clamp(24px, 4vh, 42px) 34px clamp(20px, 3.2vh, 34px);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 24px;
      color: #f6f6f6;
      background: #111214;
      box-shadow: 0 34px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.035), 0 0 34px rgba(237,33,36,.07);
      opacity: 0;
      transform: translateY(15px) scale(.98);
      transition: opacity .25s ease, transform .28s cubic-bezier(.22,1,.36,1);
    }
    .map-modal.is-open .map-modal__dialog { opacity: 1; transform: none; }
    .map-modal__close {
      position: absolute;
      top: 18px;
      right: 18px;
      width: 44px;
      height: 44px;
      padding: 0;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #fff;
      background: rgba(10,10,11,.72);
      cursor: pointer;
      transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, color .2s ease;
    }
    .map-modal__close:hover,
    .map-modal__close:focus-visible {
      border-color: var(--brand-red);
      color: #ff3438;
      box-shadow: 0 0 20px rgba(237,33,36,.18);
      transform: rotate(90deg);
      outline: 0;
    }
    .map-modal__close .material-symbols-rounded { font-size: 24px; }
    .map-modal__header { padding: 0 70px 0 18px; }
    .map-modal__heading {
      margin: 0 0 clamp(12px, 2vh, 20px);
      display: flex;
      align-items: center;
      gap: 14px;
      font-family: var(--font-display);
      font-size: clamp(28px, 2.5vw, 36px);
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -.025em;
    }
    .map-modal__heading-icon {
      color: var(--brand-red);
      font-size: 34px;
      font-variation-settings: 'FILL' 0, 'wght' 450, 'GRAD' 0, 'opsz' 32;
    }
    .map-modal__address {
      margin: 0;
      font-size: clamp(18px, 1.6vw, 23px);
      font-weight: 700;
      line-height: 1.35;
    }
    .map-modal__description {
      margin: clamp(8px, 1.3vh, 12px) 0 0;
      color: #b8b8ba;
      font-size: 14px;
      line-height: 1.55;
    }
    .map-modal__actions {
      margin: clamp(16px, 2.6vh, 26px) 18px 0;
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }
    .map-modal__action {
      min-height: 50px;
      padding: 0 20px;
      border: 1px solid var(--brand-red);
      border-radius: 9px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      color: #fff;
      background: var(--brand-red);
      font-size: 13px;
      font-weight: 700;
      transition: transform .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
    }
    .map-modal__action:hover,
    .map-modal__action:focus-visible {
      border-color: #ff3d40;
      background: #f12a2d;
      box-shadow: 0 10px 26px rgba(237,33,36,.22);
      transform: translateY(-2px);
      outline: 0;
    }
    .map-modal__action--secondary {
      border-color: rgba(255,255,255,.34);
      background: rgba(255,255,255,.025);
    }
    .map-modal__action--secondary:hover,
    .map-modal__action--secondary:focus-visible {
      border-color: rgba(255,255,255,.62);
      background: rgba(255,255,255,.07);
      box-shadow: none;
    }
    .map-modal__action .material-symbols-rounded {
      font-size: 20px;
      font-variation-settings: 'FILL' 0, 'wght' 420, 'GRAD' 0, 'opsz' 24;
    }
    .map-modal__note {
      margin: clamp(8px, 1.4vh, 14px) 18px 0;
      color: #858589;
      font-size: 12px;
    }
    .map-modal__map {
      height: clamp(230px, 41vh, 405px);
      margin-top: clamp(18px, 4vh, 42px);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 18px;
      background: #e9e9e7;
    }
    .map-modal__map iframe {
      display: block;
      width: 100%;
      height: 100%;
      border: 0;
    }

    @media (max-width: 700px) {
      .map-modal { padding: 10px; }
      .map-modal__dialog {
        width: min(100%, 520px);
        max-height: calc(100dvh - 20px);
        padding: clamp(20px, 3.4vh, 28px) 16px 16px;
        border-radius: 20px;
      }
      .map-modal__close { top: 12px; right: 12px; width: 40px; height: 40px; }
      .map-modal__header { padding: 0 44px 0 2px; }
      .map-modal__heading { margin-bottom: clamp(12px, 2vh, 18px); gap: 10px; font-size: 26px; }
      .map-modal__heading-icon { font-size: 29px; }
      .map-modal__address { font-size: 17px; }
      .map-modal__description { font-size: 13px; }
      .map-modal__actions { margin: clamp(14px, 2.6vh, 22px) 2px 0; display: grid; }
      .map-modal__action { width: 100%; min-height: 50px; }
      .map-modal__note { margin: clamp(8px, 1.5vh, 12px) 2px 0; }
      .map-modal__map { height: clamp(210px, 34vh, 320px); margin-top: clamp(14px, 2.8vh, 26px); border-radius: 14px; }
    }

    .contact-dock {
      position: fixed;
      z-index: 60;
      top: 50%;
      right: clamp(12px, 1.2vw, 22px);
      width: 126px;
      padding: 18px 10px 14px;
      border: 1px solid rgba(237,33,36,.5);
      border-radius: 18px;
      background: rgba(8,8,8,.88);
      box-shadow: 0 18px 45px rgba(0,0,0,.32), 0 0 24px rgba(237,33,36,.10);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      transform: translate(0, -50%);
      opacity: 1;
      transition: transform .55s cubic-bezier(.22,1,.36,1), opacity .35s ease;
    }
    .contact-dock.is-collapsed { transform: translate(calc(100% - 18px), -50%); }
    .contact-dock.is-hidden { transform: translate(calc(100% + 48px), -50%); opacity: 0; pointer-events: none; }
    .contact-dock__actions { display: grid; gap: 8px; }
    .contact-dock__action {
      min-height: 98px;
      padding: 12px 7px 10px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 14px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      color: var(--white);
      background: linear-gradient(145deg, #f22a2d, #c8171a);
      box-shadow: 0 8px 18px rgba(237,33,36,.2);
      font-family: var(--font-family);
      font-size: 11px;
      font-weight: 700;
      line-height: 1.25;
      text-align: center;
      text-decoration: none;
      transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    .contact-dock__action:hover {
      transform: translateX(-4px);
      background: linear-gradient(145deg, #ff3437, #df181c);
      box-shadow: 0 10px 24px rgba(237,33,36,.3);
    }
    .contact-dock__action svg { width: 30px; height: 30px; flex: 0 0 auto; }
    .contact-dock__control {
      width: 38px;
      height: 38px;
      padding: 0;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--white);
      background: var(--brand-red);
      box-shadow: 0 7px 18px rgba(237,33,36,.28);
      cursor: pointer;
      transition: transform .25s ease, background-color .2s ease;
    }
    .contact-dock__control:hover { background: #cb171a; }
    .contact-dock__control svg { width: 18px; height: 18px; }
    .contact-dock__close { position: absolute; top: -17px; right: 8px; }
    .contact-dock__toggle { position: absolute; left: -19px; bottom: 17px; }
    .contact-dock__toggle svg { transition: transform .35s cubic-bezier(.22,1,.36,1); }
    .contact-dock.is-collapsed .contact-dock__toggle svg { transform: rotate(180deg); }

    @media (max-width: 780px) {
      .contact-dock { right: 8px; width: 66px; padding: 16px 7px 10px; border-radius: 18px; }
      .contact-dock.is-collapsed { transform: translate(calc(100% - 14px), -50%); }
      .contact-dock.is-hidden { transform: translate(calc(100% + 32px), -50%); }
      .contact-dock__actions { gap: 7px; }
      .contact-dock__action { min-height: 54px; padding: 8px; border-radius: 12px; }
      .contact-dock__action span { display: none; }
      .contact-dock__action svg { width: 25px; height: 25px; }
      .contact-dock__control { width: 34px; height: 34px; }
      .contact-dock__close { top: -15px; right: 4px; }
      .contact-dock__toggle { left: -17px; bottom: 11px; }
    }

    .benefits-section {
      position: relative;
      min-height: 100vh;
      padding: clamp(58px, 4.5vw, 72px) clamp(22px, 4.2vw, 68px) clamp(42px, 3.3vw, 52px);
      overflow: hidden;
      color: var(--brand-black);
      background: #f6f6f4;
      scroll-margin-top: 18px;
    }
    .benefits-section::before {
      display: none;
    }
    .benefits-section::after {
      display: none;
    }
    .benefits-section__inner {
      position: relative;
      z-index: 1;
      width: min(100%, var(--container));
      margin: 0 auto;
    }
    .benefits-section__header {
      width: 100%;
      margin: 0 0 clamp(34px, 3vw, 46px);
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(340px, .55fr);
      grid-template-rows: auto auto;
      align-items: end;
      column-gap: clamp(46px, 6vw, 96px);
      text-align: left;
    }
    .benefits-section__eyebrow {
      grid-column: 1;
      margin: 0 0 13px;
      display: inline-flex;
      align-items: center;
      justify-self: start;
      gap: 14px;
      color: var(--brand-red);
      font-size: clamp(13px, 1.05vw, 16px);
      font-weight: 600;
      letter-spacing: .045em;
      text-transform: uppercase;
    }
    .benefits-section__eyebrow::before {
      content: "";
      width: 42px;
      height: 1px;
      background: linear-gradient(90deg, var(--brand-red), rgba(237,33,36,.2));
      box-shadow: 0 0 10px rgba(237,33,36,.32);
    }
    .benefits-section__title {
      grid-column: 1;
      margin: 0;
      max-width: 970px;
      color: #151515;
      font-family: var(--font-display);
      font-size: clamp(30px, 2.7vw, 42px);
      font-weight: 700;
      line-height: 1.06;
      letter-spacing: -.045em;
      text-wrap: balance;
      text-transform: uppercase;
    }
    .benefits-section__title span { color: var(--brand-red); }
    .benefits-section__intro {
      grid-column: 2;
      grid-row: 1 / span 2;
      margin: 0 0 3px;
      max-width: 490px;
      padding-left: 22px;
      border-left: 1px solid rgba(20,20,20,.2);
      color: #555552;
      font-size: 14px;
      line-height: 1.5;
    }
    .benefits-section__intro span { display: block; }
    .benefits-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: clamp(12px, 1.2vw, 18px);
      counter-reset: benefit-card;
    }
    .benefit-card {
      position: relative;
      min-width: 0;
      min-height: 520px;
      padding: 20px 22px 24px;
      border: 1px solid #d9d9d5;
      border-radius: 7px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      overflow: hidden;
      background: #ffffff;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 10px 24px rgba(20,20,20,.06);
      text-align: left;
      counter-increment: benefit-card;
      transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
    }
    .benefit-card::before {
      content: "";
      position: absolute;
      z-index: 2;
      top: 0;
      left: 24px;
      width: 58px;
      height: 2px;
      border-radius: 0 0 999px 999px;
      background: linear-gradient(90deg, var(--brand-red), rgba(237,33,36,.08));
      box-shadow: 0 0 14px rgba(237,33,36,.32);
      pointer-events: none;
    }
    .benefit-card::after {
      content: "0" counter(benefit-card);
      position: absolute;
      z-index: 1;
      top: 19px;
      right: 21px;
      color: rgba(20,20,20,.17);
      font-family: var(--font-display);
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .08em;
    }
    .benefit-card:hover {
      transform: translateY(-3px);
      border-color: rgba(237,33,36,.34);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 16px 32px rgba(20,20,20,.09);
    }
    .benefit-card__icon {
      position: relative;
      z-index: 1;
      width: 44px;
      height: 44px;
      margin-bottom: 14px;
      border: 0;
      border-radius: 0;
      display: grid;
      place-items: center;
      color: var(--brand-red);
      background: transparent;
      box-shadow: none;
    }
    .benefit-card__icon svg { width: 40px; height: 40px; }
    .benefit-card__visual {
      position: relative;
      width: 100%;
      aspect-ratio: 1.42;
      margin-bottom: 24px;
      border: 1px solid rgba(20,20,20,.16);
      border-radius: 5px;
      overflow: hidden;
      flex: 0 0 auto;
      background: #070707;
      box-shadow: inset 0 0 40px rgba(0,0,0,.62), 0 8px 18px rgba(0,0,0,.16);
    }
    .benefit-card__visual::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 4px;
      pointer-events: none;
      background: linear-gradient(180deg, transparent 54%, rgba(0,0,0,.38));
      box-shadow: inset 0 0 30px rgba(0,0,0,.32);
    }
    .benefit-card__photo {
      width: 100%;
      height: 100%;
      max-width: none;
      object-fit: cover;
      filter: contrast(1.05) saturate(.92);
    }
    .benefit-card__visual--sizes .benefit-card__photo {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      transform: none;
      filter: none;
    }
    .benefit-card__visual--sizes {
      background: #f7f7f7;
      box-shadow: 0 8px 18px rgba(20,20,20,.10);
    }
    .benefit-card__visual--sizes::after {
      background: transparent;
      box-shadow: inset 0 0 0 1px rgba(20,20,20,.04);
    }
    .benefit-card__visual--single .benefit-card__photo {
      width: 100%;
      height: 100%;
      object-position: 68% 49%;
      transform: none;
    }
    .benefit-card__visual--compare {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2px;
      padding: 38px 12px 12px;
      background: radial-gradient(circle at 50% 40%, #241010 0%, #090909 54%, #020202 100%);
    }
    .benefit-card__compare-item {
      position: relative;
      border-radius: 4px;
      overflow: hidden;
      background: #0b0b0b;
    }
    .benefit-card__compare-item img {
      position: absolute;
      width: 285%;
      height: 125%;
      max-width: none;
      object-fit: cover;
      object-position: 77% 50%;
      transform: translate(-57%, -10%);
    }
    .benefit-card__compare-item:last-child img {
      object-position: 62% 50%;
      transform: translate(-50%, -10%);
    }
    .benefit-card__compare-mark {
      position: absolute;
      z-index: 2;
      top: 13px;
      width: 34px;
      height: 34px;
      border: 2px solid var(--brand-red);
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--brand-red);
      background: rgba(4,4,4,.84);
    }
    .benefit-card__compare-mark--bad { left: 42px; }
    .benefit-card__compare-mark--good { right: 42px; }
    .benefit-card__compare-mark svg { width: 22px; height: 22px; }
    .benefit-card__compare-arrow {
      position: absolute;
      z-index: 3;
      left: 50%;
      top: 57%;
      width: 34px;
      color: var(--brand-red);
      transform: translate(-50%, -50%);
      filter: drop-shadow(0 0 8px rgba(237,33,36,.5));
    }
    .benefit-card__visual--support {
      display: grid;
      place-items: center;
      background:
        linear-gradient(90deg, transparent 49.4%, rgba(237,33,36,.9) 50%, transparent 50.6%),
        radial-gradient(circle at 50% 56%, rgba(237,33,36,.28), transparent 40%),
        linear-gradient(135deg, #111 0%, #050505 100%);
    }
    .benefit-card__visual--support > svg {
      position: relative;
      z-index: 2;
      width: 64%;
      height: 64%;
      filter: drop-shadow(0 10px 15px rgba(0,0,0,.55));
    }
    .benefit-card__title {
      min-height: 58px;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      color: #181818;
      font-size: clamp(17px, 1.24vw, 20px);
      font-weight: 700;
      line-height: 1.28;
      text-wrap: pretty;
      text-transform: uppercase;
    }
    .benefit-card__divider {
      width: 32px;
      height: 2px;
      margin: 15px 0 14px;
      border-radius: 999px;
      background: var(--brand-red);
      box-shadow: 0 0 10px rgba(237,33,36,.28);
    }
    .benefit-card__text {
      margin: 0;
      color: #555552;
      font-size: 15px;
      line-height: 1.55;
      text-wrap: pretty;
    }
    .benefits-principles {
      min-height: 82px;
      margin-top: 28px;
      padding: 18px clamp(20px, 3vw, 42px);
      border: 1px solid rgba(20,20,20,.1);
      border-radius: 7px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 24px;
      color: #242424;
      background: #ffffff;
      box-shadow: inset 3px 0 0 var(--brand-red), 0 8px 20px rgba(20,20,20,.05);
      font-size: clamp(17px, 1.55vw, 24px);
      line-height: 1.4;
      text-align: left;
    }
    .benefits-principles svg {
      width: 38px;
      height: 38px;
      flex: 0 0 auto;
      color: var(--brand-red);
    }
    .benefits-principles__text { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 8px 16px; }
    .benefits-principles__dot { color: var(--brand-red); font-weight: 700; }
    .benefits-principles strong { color: var(--brand-red); font-weight: 500; }

    @media (max-width: 1120px) {
      .benefits-section__header { display: block; }
      .benefits-section__title { max-width: 900px; }
      .benefits-section__intro { max-width: 720px; margin-top: 22px; }
      .benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
      .benefit-card { min-height: 520px; }
      .benefit-card__visual { width: 100%; }
      .benefit-card__title { min-height: auto; }
    }

    @media (max-width: 640px) {
      .benefits-section { padding: 54px 16px 44px; }
      .benefits-section__header { margin-bottom: 28px; }
      .benefits-section__eyebrow { gap: 10px; font-size: 11px; }
      .benefits-section__eyebrow::before { width: 28px; }
      .benefits-section__title { font-size: clamp(27px, 7.8vw, 32px); line-height: 1.08; }
      .benefits-section__intro { margin-top: 16px; padding-left: 14px; font-size: 13px; }
      .benefits-section__intro span { display: inline; }
      .benefits-grid { grid-template-columns: 1fr; }
      .benefit-card { min-height: 0; padding: 20px 18px 24px; }
      .benefit-card__visual { width: 100%; }
      .benefit-card__title { font-size: 18px; }
      .benefit-card__text { font-size: 15px; }
      .benefits-principles { margin-top: 20px; padding: 20px 18px; flex-direction: column; gap: 10px; }
      .benefits-principles__text { gap: 4px 10px; }
    }

    /* Clean image-led benefit cards */
    .benefits-section {
      padding-top: clamp(64px, 5vw, 84px);
      padding-bottom: clamp(54px, 4.5vw, 72px);
      background: #f7f7f5;
    }
    .benefits-section__header { margin-bottom: clamp(36px, 3.2vw, 52px); }
    .benefits-grid { gap: clamp(16px, 1.45vw, 22px); grid-auto-rows: 1fr; }
    .benefit-card {
      min-height: 532px;
      height: 100%;
      padding: 0;
      border: 1px solid #e2e2de;
      border-radius: 14px;
      background: #ffffff;
      box-shadow: 0 12px 30px rgba(20,20,20,.055);
    }
    .benefit-card::before,
    .benefit-card::after,
    .benefit-card__icon { display: none; }
    .benefit-card:hover {
      transform: translateY(-4px);
      border-color: #d6d6d1;
      box-shadow: 0 18px 38px rgba(20,20,20,.09);
    }
    .benefit-card__visual,
    .benefit-card__visual--sizes,
    .benefit-card__visual--compare,
    .benefit-card__visual--single,
    .benefit-card__visual--support {
      width: 100%;
      aspect-ratio: 4 / 3;
      margin: 0;
      padding: 0;
      border: 0;
      border-radius: 13px 13px 0 0;
      display: block;
      overflow: hidden;
      background: #ffffff;
      box-shadow: none;
    }
    .benefit-card__visual::after { display: none; }
    .benefit-card__photo,
    .benefit-card__visual--sizes .benefit-card__photo,
    .benefit-card__visual--single .benefit-card__photo {
      width: 100%;
      height: 100%;
      max-width: none;
      object-fit: cover;
      object-position: center;
      transform: none;
      filter: none;
    }
    .benefit-card__title {
      width: calc(100% - 48px);
      min-height: 76px;
      margin: 24px 24px 0;
      align-items: flex-start;
      font-size: clamp(16px, 1.12vw, 18px);
      line-height: 1.3;
    }
    .benefit-card__divider { margin: 14px 24px; }
    .benefit-card__text {
      width: 100%;
      margin: 0;
      padding: 0 24px 28px;
      color: #5a5a57;
      font-size: 14px;
      line-height: 1.55;
    }
    .benefits-principles {
      margin-top: 24px;
      border-color: #e2e2de;
      border-radius: 12px;
      box-shadow: inset 3px 0 0 var(--brand-red), 0 10px 24px rgba(20,20,20,.045);
    }
    @media (max-width: 1120px) {
      .benefit-card { min-height: 510px; }
      .benefit-card__title { min-height: auto; }
    }
    @media (max-width: 640px) {
      .benefits-section { padding: 56px 16px 46px; }
      .benefit-card { min-height: 0; }
      .benefit-card__title { width: calc(100% - 40px); margin: 22px 20px 0; font-size: 18px; }
      .benefit-card__divider { margin: 14px 20px; }
      .benefit-card__text { padding: 0 20px 26px; font-size: 15px; }
    }

    /* v380 — core branded UI interactions stay animated.
       Do not globally zero transitions/scrolling from the OS reduced-motion flag: it made
       forms, the contact dock, section navigation and process steps appear broken. */
    @media (prefers-reduced-motion: reduce) {
      .hero__actions .button:first-child::before { animation: none !important; opacity: 0; }
    }

    @media (max-width: 740px) {
      html { scroll-padding-top: 12px; }
      .site-header.has-fixed-nav { padding-bottom: 0; }
      .nav-bar.is-fixed { position: static; box-shadow: none; animation: none; }
      .nav-bar.is-fixed.is-open { position: absolute; }
    }

    /* Premium light header + floating graphite navigation */
    :root {
      --header-top: 104px;
      --header-nav: 62px;
      --header-height: calc(var(--header-top) + (var(--header-nav) / 2));
    }
    .material-symbols-rounded {
      font-family: "Material Symbols Rounded";
      font-weight: 300;
      font-style: normal;
      font-size: 22px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      white-space: nowrap;
      word-wrap: normal;
      direction: ltr;
      -webkit-font-feature-settings: "liga";
      -webkit-font-smoothing: antialiased;
      font-feature-settings: "liga";
    }
    .site-header {
      position: relative;
      z-index: 70;
      padding-bottom: calc(var(--header-nav) / 2);
      background: #fafaf9;
      overflow: visible;
    }
    .header-main {
      height: var(--header-top);
      min-height: var(--header-top);
      border-bottom: 0;
      background: #fafaf9;
      box-shadow: inset 0 -1px 0 rgba(20,20,20,.06);
    }
    .header-main__inner {
      width: min(calc(100% - 96px), 1504px);
      height: var(--header-top);
      min-height: var(--header-top);
      grid-template-columns: 244px minmax(280px, 1.3fr) 270px 250px 230px;
      gap: clamp(14px, 1.35vw, 24px);
    }
    .brand {
      min-height: 58px;
      padding-right: 26px;
      border-right: 1px solid #dededc;
    }
    .brand img { width: 194px; }
    .info-block {
      height: auto;
      min-height: 62px;
      padding: 0;
      border: 0;
      justify-content: center;
      color: #202020;
      font-size: 13px;
      line-height: 1.35;
    }
    .intro strong {
      margin-bottom: 5px;
      font-size: 13px;
      line-height: 1.25;
    }
    .intro span {
      color: #62625f;
      font-size: 12px;
      line-height: 1.35;
      white-space: nowrap;
    }
    .address,
    .phones {
      position: relative;
      min-height: 62px;
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr);
      align-items: center;
      gap: 12px;
      padding: 9px 16px;
      border: 1px solid #e2e2df;
      border-radius: 16px;
      background: #fff;
      box-shadow: 0 7px 22px rgba(20,20,20,.045);
    }
    .address::before,
    .phones::before { display: none; }
    .header-contact__icon {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      color: var(--brand-red);
    }
    .header-contact__content { min-width: 0; }
    .address .header-contact__content {
      font-size: 12.5px;
      font-weight: 700;
      line-height: 1.45;
    }
    .phones a {
      font-size: 13px;
      line-height: 1.35;
    }
    .header-cta {
      min-width: 230px;
      min-height: 60px;
      justify-content: space-between;
      padding: 0 14px 0 22px;
      border: 0;
      border-radius: 14px;
      box-shadow: 0 10px 24px rgba(237,33,36,.20);
      font-size: 12px;
      letter-spacing: .01em;
    }
    .header-cta::after { display: none; }
    .header-cta__arrow {
      width: 32px;
      height: 32px;
      flex: 0 0 32px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: var(--brand-red);
      background: #fff;
    }
    .header-cta__arrow.material-symbols-rounded { font-size: 20px; font-weight: 500; }
    .nav-bar {
      position: absolute;
      z-index: 75;
      top: calc(var(--header-top) - 2px);
      right: auto;
      left: 50%;
      width: min(calc(100% - 96px), 1504px);
      height: var(--header-nav);
      min-height: var(--header-nav);
      border: 1px solid #303032;
      border-radius: 14px;
      color: #f4f4f3;
      background: #111113;
      box-shadow: 0 16px 34px rgba(0,0,0,.28);
      transform: translateX(-50%);
      overflow: hidden;
    }
    .nav-list {
      width: 100%;
      max-width: none;
      height: 100%;
      min-height: var(--header-nav);
      padding: 0 20px;
      gap: 4px;
    }
    .nav-list a {
      min-height: var(--header-nav);
      padding-inline: 10px;
      color: #ededec;
      font-size: 11px;
      letter-spacing: .015em;
      transition: color .2s ease, background-color .2s ease;
    }
    .nav-list a::after {
      bottom: 0;
      height: 3px;
      box-shadow: 0 0 14px rgba(237,33,36,.9);
    }
    .nav-list a:hover,
    .nav-list a.is-active { color: #ff3a3d; }
    .nav-list a:hover { background: rgba(255,255,255,.025); }
    .nav-list a:hover::after,
    .nav-list a.is-active::after { left: 32%; right: 32%; }
    .nav-bar.is-fixed {
      position: fixed;
      top: 10px;
      right: auto;
      left: 50%;
      width: min(calc(100% - 96px), 1504px);
      border-radius: 14px;
      transform: translateX(-50%);
      animation: nav-capsule-in .22s ease-out both;
    }
    .site-header.has-fixed-nav { padding-bottom: calc(var(--header-nav) / 2); }
    @keyframes nav-capsule-in {
      from { opacity: 0; }
      to { opacity: 1; }
    }
    .mobile-phone .material-symbols-rounded,
    .menu-toggle .material-symbols-rounded { font-size: 25px; }

    @media (max-width: 1320px) {
      :root {
        --header-top: 96px;
        --header-nav: 60px;
        --header-height: calc(var(--header-top) + (var(--header-nav) / 2));
      }
      .header-main__inner {
        width: min(calc(100% - 48px), 1240px);
        grid-template-columns: 178px minmax(210px, 1.2fr) 210px 190px 170px;
        gap: 8px;
      }
      .brand { padding-right: 14px; }
      .brand img { width: 166px; }
      .intro span { white-space: normal; }
      .address, .phones { padding-inline: 10px; gap: 6px; }
      .address .header-contact__content { font-size: 11.5px; }
      .phones a { font-size: 11.5px; }
      .header-cta { min-width: 170px; min-height: 56px; padding-left: 14px; font-size: 10.5px; }
      .nav-bar,
      .nav-bar.is-fixed { width: min(calc(100% - 48px), 1240px); }
      .nav-list { padding-inline: 12px; }
      .nav-list a { font-size: 10px; padding-inline: 6px; }
    }

    @media (max-width: 1080px) {
      :root {
        --header-top: 88px;
        --header-nav: 58px;
        --header-height: calc(var(--header-top) + (var(--header-nav) / 2));
      }
      .header-main__inner {
        width: calc(100% - 36px);
        grid-template-columns: 190px minmax(230px, 1fr) minmax(210px, .95fr) 172px;
        gap: 12px;
      }
      .intro { display: none; }
      .brand img { width: 170px; }
      .address { display: grid; padding-left: 12px; }
      .header-cta { min-width: 172px; min-height: 56px; font-size: 10px; }
      .nav-bar,
      .nav-bar.is-fixed { width: calc(100% - 36px); }
      .nav-list { width: 100%; }
      .nav-list a { font-size: 9px; }
    }

    @media (max-width: 900px) and (min-width: 781px) {
      .header-main__inner { grid-template-columns: 180px minmax(220px, 1fr) 170px; }
      .address { display: none; }
      .nav-list { padding-inline: 8px; }
      .nav-list a { padding-inline: 3px; font-size: 8.5px; }
    }

    @media (max-width: 780px) {
      :root { --header-top: 72px; --header-nav: 0px; --header-height: var(--header-top); }
      html { scroll-padding-top: 12px; }
      .site-header,
      .site-header.has-fixed-nav { padding-bottom: 0; }
      .header-main { background: #fafaf9; box-shadow: 0 7px 24px rgba(0,0,0,.08); }
      .header-main__inner { width: calc(100% - 28px); }
      .brand { min-height: 50px; padding-right: 0; border-right: 0; }
      .brand img { width: 170px; }
      .info-block,
      .header-cta { display: none; }
      .mobile-actions { display: flex; gap: 4px; }
      .icon-button { width: 46px; height: 46px; border-radius: 12px; }
      .mobile-phone { color: var(--brand-red); }
      .menu-toggle {
        border: 1px solid rgba(237,33,36,.65);
        color: #151515;
        background: #fff;
        box-shadow: 0 5px 14px rgba(237,33,36,.09);
      }
      .nav-bar,
      .nav-bar.is-fixed {
        display: none;
        position: absolute;
        top: calc(var(--header-top) - 1px);
        right: 14px;
        left: 14px;
        width: auto;
        height: auto;
        min-height: 0;
        border-radius: 0 0 14px 14px;
        transform: none;
        animation: none;
      }
      .nav-bar.is-open,
      .nav-bar.is-fixed.is-open {
        display: grid !important;
        position: absolute;
        top: calc(var(--header-top) - 1px);
        right: 14px;
        left: 14px;
        width: auto;
        padding: 8px;
        color: #f5f5f4;
        background: #111113;
        box-shadow: 0 18px 34px rgba(0,0,0,.30);
      }
      .nav-bar.is-open .nav-list {
        width: 100%;
        min-height: 0;
        padding: 0;
        gap: 2px;
      }
      .nav-bar.is-open .nav-list a {
        min-height: 46px;
        justify-content: flex-start;
        padding-inline: 14px;
        border-radius: 9px;
        color: #ededec;
        font-size: 11px;
      }
      .nav-bar.is-open .nav-list a.is-active { color: #ff3a3d; background: rgba(237,33,36,.08); }
      .nav-bar.is-open .nav-list a::after { display: none; }
    }

    @media (max-width: 430px) {
      .header-main__inner { width: calc(100% - 22px); }
      .brand img { width: 162px; }
      .mobile-phone { display: none; }
    }

    /* Block 02 — light asymmetric benefits bento */
    .benefits-section {
      position: relative;
      overflow: hidden;
      padding: clamp(64px, 6vw, 96px) 24px clamp(52px, 5vw, 78px);
      color: #171719;
      background:
        radial-gradient(circle at 88% 4%, rgba(237, 33, 36, .035), transparent 27%),
        linear-gradient(180deg, #fafaf9 0%, #f5f5f3 100%);
    }
    .benefits-section::before,
    .benefits-section::after { display: none; }
    .benefits-section__inner {
      width: min(100%, 1504px);
      margin-inline: auto;
    }
    .benefits-section__header {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
      align-items: end;
      gap: clamp(36px, 6vw, 100px);
      margin-bottom: clamp(34px, 3.4vw, 52px);
    }
    .benefits-section__eyebrow {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: 0 0 14px;
      color: var(--brand-red);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: .035em;
    }
    .benefits-section__eyebrow::before {
      width: 30px;
      height: 2px;
      flex: 0 0 30px;
      background: var(--brand-red);
      content: "";
    }
    .benefits-section__title {
      max-width: none;
      margin: 0;
      color: #171719;
      font-size: clamp(32px, 3.05vw, 48px);
      font-weight: 750;
      line-height: 1;
      letter-spacing: -.045em;
      text-wrap: balance;
    }
    .benefits-section__title span { color: var(--brand-red); }
    .benefits-section__intro {
      max-width: 430px;
      margin: 0;
      padding: 0 0 2px 30px;
      border-left: 1px solid #d4d4d2;
      color: #5c5c60;
      font-size: clamp(14px, 1.05vw, 16px);
      font-weight: 450;
      line-height: 1.55;
    }
    .benefits-section__intro span { display: block; }

    .benefits-grid {
      display: grid;
      grid-template-columns: 1.06fr 1fr 1fr;
      grid-template-rows: clamp(330px, 27vw, 408px) clamp(190px, 16.5vw, 250px);
      gap: clamp(16px, 1.35vw, 22px);
      grid-auto-rows: auto;
      counter-reset: none;
    }
    .benefit-card {
      display: grid;
      position: relative;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      padding: clamp(22px, 2vw, 30px);
      border: 1px solid #d8d8d6;
      border-radius: clamp(18px, 1.6vw, 24px);
      color: #18181a;
      background: rgba(255, 255, 255, .86);
      box-shadow: 0 10px 30px rgba(18, 18, 20, .025);
      transform: none;
      isolation: isolate;
    }
    .benefit-card::before,
    .benefit-card::after,
    .benefit-card__icon { display: none; }
    .benefit-card:hover {
      border-color: #c9c9c7;
      box-shadow: 0 14px 34px rgba(18, 18, 20, .045);
      transform: translateY(-2px);
    }
    .benefit-card__number {
      grid-area: number;
      align-self: start;
      color: var(--brand-red);
      font-size: 15px;
      font-weight: 750;
      line-height: 1;
      letter-spacing: -.02em;
      z-index: 2;
    }
    .benefit-card__title {
      grid-area: title;
      width: auto;
      min-height: 0;
      margin: 0;
      color: #1d1d1f;
      font-size: clamp(18px, 1.48vw, 22px);
      font-weight: 750;
      line-height: 1.08;
      letter-spacing: -.025em;
      text-align: left;
      text-wrap: balance;
      z-index: 2;
    }
    .benefit-card__divider { display: none; }
    .benefit-card__text {
      grid-area: text;
      max-width: 36ch;
      margin: 0;
      padding: 0;
      color: #5e5e62;
      font-size: clamp(13px, 1vw, 15px);
      font-weight: 430;
      line-height: 1.48;
      text-align: left;
      z-index: 2;
    }
    .benefit-card__visual,
    .benefit-card__visual--sizes,
    .benefit-card__visual--compare,
    .benefit-card__visual--single,
    .benefit-card__visual--support {
      grid-area: visual;
      position: relative;
      inset: auto;
      width: 100%;
      height: 100%;
      min-width: 0;
      min-height: 0;
      margin: 0;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
    }
    .benefit-card__visual::after { display: none; }
    .benefit-card__photo,
    .benefit-card__visual--sizes .benefit-card__photo,
    .benefit-card__visual--single .benefit-card__photo {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center bottom;
      filter: none;
      transform: none;
    }

    .benefit-card--primary {
      grid-column: 1;
      grid-row: 1 / span 2;
      grid-template-areas:
        "number"
        "title"
        "text"
        "visual";
      grid-template-rows: auto auto auto minmax(0, 1fr);
      row-gap: 14px;
    }
    .benefit-card--primary .benefit-card__visual { margin-top: 4px; }
    .benefit-card--primary .benefit-card__photo {
      object-fit: contain;
      object-position: center bottom;
    }
    .benefit-card--compare,
    .benefit-card--custom {
      grid-template-areas:
        "number"
        "title"
        "text"
        "visual";
      grid-template-rows: auto auto auto minmax(0, 1fr);
      row-gap: 12px;
    }
    .benefit-card--compare { grid-column: 2; grid-row: 1; }
    .benefit-card--custom { grid-column: 3; grid-row: 1; }
    .benefit-card--compare .benefit-card__visual,
    .benefit-card--custom .benefit-card__visual { margin-top: 2px; }
    .benefit-card--compare .benefit-card__photo,
    .benefit-card--custom .benefit-card__photo { object-position: center bottom; }

    .benefit-card--support {
      grid-column: 2 / span 2;
      grid-row: 2;
      grid-template-columns: minmax(255px, .82fr) minmax(0, 1.38fr);
      grid-template-rows: auto auto minmax(0, 1fr);
      grid-template-areas:
        "number visual"
        "title visual"
        "text visual";
      column-gap: clamp(24px, 3vw, 52px);
      row-gap: 12px;
    }
    .benefit-card--support .benefit-card__visual {
      margin: calc(clamp(22px, 2vw, 30px) * -1);
      margin-left: 0;
      width: calc(100% + clamp(22px, 2vw, 30px));
      height: calc(100% + (clamp(22px, 2vw, 30px) * 2));
    }
    .benefit-card--support .benefit-card__photo {
      object-fit: contain;
      object-position: center center;
    }

    .benefits-principles {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(20px, 2.4vw, 38px);
      min-height: 68px;
      margin-top: clamp(16px, 1.35vw, 22px);
      padding: 12px 24px;
      border: 1px solid #d8d8d6;
      border-radius: clamp(16px, 1.3vw, 20px);
      color: #242426;
      background: rgba(255, 255, 255, .78);
      box-shadow: none;
    }
    .benefits-principles > svg {
      width: 34px;
      height: 34px;
      flex: 0 0 34px;
      color: var(--brand-red);
    }
    .benefits-principles__text {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: clamp(16px, 2vw, 32px);
      font-size: clamp(15px, 1.35vw, 20px);
      line-height: 1.35;
    }
    .benefits-principles__dot { color: var(--brand-red); font-weight: 800; }
    .benefits-principles strong { color: var(--brand-red); font-weight: 700; }

    @media (max-width: 1080px) {
      .benefits-section { padding-inline: 18px; }
      .benefits-section__header {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 22px;
      }
      .benefits-section__intro { max-width: 680px; }
      .benefits-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(2, minmax(430px, auto));
      }
      .benefit-card--primary,
      .benefit-card--compare,
      .benefit-card--custom,
      .benefit-card--support {
        grid-column: auto;
        grid-row: auto;
        min-height: 430px;
      }
      .benefit-card--support {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto minmax(220px, 1fr);
        grid-template-areas: "number" "title" "text" "visual";
      }
      .benefit-card--support .benefit-card__visual {
        width: calc(100% + (clamp(22px, 2vw, 30px) * 2));
        height: calc(100% + clamp(22px, 2vw, 30px));
        margin: 6px calc(clamp(22px, 2vw, 30px) * -1) calc(clamp(22px, 2vw, 30px) * -1);
      }
    }

    @media (max-width: 680px) {
      .benefits-section { padding: 52px 14px 42px; }
      .benefits-section__header { margin-bottom: 28px; }
      .benefits-section__eyebrow { font-size: 10px; }
      .benefits-section__title { font-size: clamp(28px, 9.5vw, 38px); }
      .benefits-section__intro { padding-left: 16px; font-size: 14px; }
      .benefits-grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        gap: 14px;
      }
      .benefit-card,
      .benefit-card--primary,
      .benefit-card--compare,
      .benefit-card--custom,
      .benefit-card--support {
        min-height: 0;
        padding: 22px 18px;
        border-radius: 18px;
      }
      .benefit-card--primary { min-height: 590px; }
      .benefit-card--compare,
      .benefit-card--custom { min-height: 430px; }
      .benefit-card--support { min-height: 470px; }
      .benefit-card__title { width: auto; margin: 0; font-size: 19px; }
      .benefit-card__text { padding: 0; font-size: 14px; }
      .benefit-card--support .benefit-card__visual {
        width: calc(100% + 36px);
        height: calc(100% + 22px);
        margin: 6px -18px -22px;
      }
      .benefits-principles {
        align-items: flex-start;
        justify-content: flex-start;
        gap: 14px;
        margin-top: 14px;
        padding: 18px;
      }
      .benefits-principles__text {
        justify-content: flex-start;
        gap: 8px 13px;
        font-size: 15px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .benefit-card { transition: none; }
      .benefit-card:hover { transform: none; }
    }

    /* Block 02 — editorial product infographic */
    .benefits-section {
      min-height: 0;
      padding: clamp(44px, 3.2vw, 62px) clamp(24px, 4.4vw, 64px) clamp(38px, 3vw, 54px);
      background: #f7f6f4;
    }
    .benefits-section__inner { width: min(100%, 1504px); }
    .benefits-section__header {
      grid-template-areas:
        "eyebrow intro"
        "title intro";
      grid-template-columns: minmax(0, 1.12fr) minmax(360px, .72fr);
      grid-template-rows: auto auto;
      align-items: start;
      column-gap: clamp(52px, 7vw, 112px);
      row-gap: 14px;
      margin-bottom: clamp(24px, 2vw, 34px);
    }
    .benefits-section__eyebrow {
      grid-area: eyebrow;
      margin: 0;
      font-size: 12px;
      letter-spacing: .045em;
    }
    .benefits-section__eyebrow::before {
      width: 10px;
      height: 10px;
      flex-basis: 10px;
      border: 2px solid var(--brand-red);
      border-radius: 50%;
      background: transparent;
    }
    .benefits-section__title {
      grid-area: title;
      max-width: 780px;
      font-size: clamp(38px, 3.55vw, 56px);
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: -.045em;
      text-transform: none;
    }
    .benefits-section__intro {
      grid-area: intro;
      align-self: end;
      position: relative;
      max-width: 460px;
      margin: 0;
      padding: 22px 0 22px 34px;
      border-left: 1px solid rgba(237, 33, 36, .68);
      color: #3d3d40;
      font-size: clamp(15px, 1.18vw, 18px);
      line-height: 1.55;
    }
    .benefits-section__intro::before,
    .benefits-section__intro::after {
      position: absolute;
      left: -3px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--brand-red);
      content: "";
    }
    .benefits-section__intro::before { top: 0; }
    .benefits-section__intro::after { bottom: 0; }

    .benefits-stage {
      display: grid;
      position: relative;
      grid-template-columns: minmax(220px, .76fr) minmax(450px, 1.72fr) minmax(220px, .76fr);
      grid-template-rows: repeat(2, minmax(220px, 1fr));
      grid-template-areas:
        "card01 product card02"
        "card03 product card04";
      gap: clamp(22px, 2vw, 34px) clamp(28px, 4vw, 68px);
      height: clamp(500px, 32vw, 590px);
      min-height: 0;
      isolation: isolate;
    }
    .benefits-stage::before {
      position: absolute;
      top: 50%;
      left: 50%;
      width: min(48vw, 690px);
      aspect-ratio: 1;
      border: 1px solid rgba(83, 83, 86, .08);
      border-radius: 50%;
      transform: translate(-50%, -50%);
      content: "";
      z-index: -1;
    }
    .benefits-stage__target {
      position: absolute;
      width: 76px;
      height: 76px;
      border: 1px solid rgba(78, 78, 82, .10);
      border-radius: 50%;
      pointer-events: none;
      z-index: -1;
    }
    .benefits-stage__target::before,
    .benefits-stage__target::after {
      position: absolute;
      top: 50%;
      left: 50%;
      background: rgba(78, 78, 82, .10);
      content: "";
      transform: translate(-50%, -50%);
    }
    .benefits-stage__target::before { width: 100px; height: 1px; }
    .benefits-stage__target::after { width: 1px; height: 100px; }
    .benefits-stage__target--top { top: -18px; left: 34%; }
    .benefits-stage__target--left { bottom: 88px; left: 12%; }
    .benefits-stage__target--right { right: 11%; bottom: 126px; width: 54px; height: 54px; }
    .benefits-stage__product {
      display: flex;
      grid-area: product;
      align-items: center;
      justify-content: center;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      padding: clamp(4px, 1vw, 16px) 0;
    }
    .benefits-stage__product img {
      display: block;
      width: 116%;
      max-width: none;
      height: 100%;
      object-fit: contain;
      object-position: center;
      filter: drop-shadow(0 22px 28px rgba(20, 20, 22, .06));
    }

    .benefits-stage .benefit-card {
      display: grid;
      align-self: center;
      height: auto;
      min-height: 196px;
      padding: clamp(22px, 1.8vw, 28px);
      grid-template-areas: "number" "title" "text";
      grid-template-rows: auto auto 1fr;
      row-gap: 12px;
      overflow: visible;
      border: 1px solid rgba(109, 109, 112, .25);
      border-radius: 0;
      background: rgba(255, 255, 255, .34);
      box-shadow: none;
    }
    .benefits-stage .benefit-card:hover {
      border-color: rgba(237, 33, 36, .42);
      box-shadow: 0 14px 30px rgba(25, 25, 27, .035);
      transform: translateY(-2px);
    }
    .benefits-stage .benefit-card__number {
      font-size: clamp(26px, 2.2vw, 34px);
      font-weight: 750;
      line-height: 1;
    }
    .benefits-stage .benefit-card__title {
      font-size: clamp(16px, 1.18vw, 18px);
      font-weight: 700;
      line-height: 1.14;
      letter-spacing: -.02em;
    }
    .benefits-stage .benefit-card__text {
      max-width: 31ch;
      color: #555559;
      font-size: clamp(13px, .98vw, 15px);
      line-height: 1.55;
    }
    .benefits-stage .benefit-card__visual { display: none; }
    .benefits-stage .benefit-card::after {
      display: block;
      position: absolute;
      top: 50%;
      width: clamp(48px, 5vw, 82px);
      height: 1px;
      background: rgba(237, 33, 36, .78);
      content: "";
    }
    .benefits-stage .benefit-card::before {
      display: block;
      position: absolute;
      top: calc(50% - 5px);
      width: 10px;
      height: 10px;
      border: 1px solid var(--brand-red);
      border-radius: 50%;
      background: #f7f6f4;
      content: "";
      z-index: 2;
    }
    .benefits-stage .benefit-card--primary { grid-area: card01; }
    .benefits-stage .benefit-card--compare { grid-area: card02; }
    .benefits-stage .benefit-card--custom { grid-area: card03; }
    .benefits-stage .benefit-card--support { grid-area: card04; }
    .benefits-stage .benefit-card--primary::after,
    .benefits-stage .benefit-card--custom::after { right: auto; left: 100%; }
    .benefits-stage .benefit-card--primary::before,
    .benefits-stage .benefit-card--custom::before { right: auto; left: calc(100% + clamp(43px, 5vw, 77px)); }
    .benefits-stage .benefit-card--compare::after,
    .benefits-stage .benefit-card--support::after { right: 100%; left: auto; }
    .benefits-stage .benefit-card--compare::before,
    .benefits-stage .benefit-card--support::before { right: calc(100% + clamp(43px, 5vw, 77px)); left: auto; }

    .benefits-stage .benefit-card::before,
    .benefits-stage .benefit-card::after { display: none; }
    .benefit-card__connector {
      --connector-size: clamp(48px, 5vw, 82px);
      position: absolute;
      display: block;
      width: var(--connector-size);
      pointer-events: none;
      color: rgba(237, 33, 36, .82);
      z-index: 3;
    }
    .benefit-card__connector::before,
    .benefit-card__connector::after,
    .benefit-card__connector-node {
      position: absolute;
      display: block;
      border-radius: 50%;
      content: "";
    }
    .benefit-card__connector::before {
      width: 10px;
      height: 10px;
      border: 1px solid currentColor;
      background: #f7f6f4;
    }
    .benefit-card__connector::after {
      width: 4px;
      height: 4px;
      background: currentColor;
    }
    .benefit-card__connector-node {
      width: 7px;
      height: 7px;
      border: 1px solid currentColor;
      background: #f7f6f4;
    }
    .benefit-card--primary .benefit-card__connector {
      top: 50%;
      left: 100%;
      height: 1px;
      border-top: 1px solid currentColor;
    }
    .benefit-card--primary .benefit-card__connector::before { top: -5px; right: 36%; }
    .benefit-card--primary .benefit-card__connector::after { top: -2px; right: -2px; }

    .benefit-card--compare .benefit-card__connector {
      top: 22px;
      right: 100%;
      height: clamp(58px, 6vw, 90px);
      border-top: 1px solid currentColor;
      border-left: 1px solid currentColor;
      border-bottom: 1px solid currentColor;
    }
    .benefit-card--compare .benefit-card__connector::before { bottom: -5px; left: -5px; }
    .benefit-card--compare .benefit-card__connector::after { top: -2px; right: -2px; }
    .benefit-card--compare .benefit-card__connector-node { top: -4px; left: -4px; }

    .benefit-card--custom .benefit-card__connector {
      top: 50%;
      left: 100%;
      height: 15px;
      border-bottom: 1px solid currentColor;
      background: linear-gradient(145deg, transparent 46%, currentColor 48%, currentColor 52%, transparent 54%) 52% 0 / 18px 15px no-repeat;
    }
    .benefit-card--custom .benefit-card__connector::before { right: 27%; bottom: -5px; }
    .benefit-card--custom .benefit-card__connector::after { right: -2px; bottom: -2px; }
    .benefit-card--custom .benefit-card__connector-node { right: 55%; bottom: -4px; }

    .benefit-card--support .benefit-card__connector {
      top: 50%;
      right: 100%;
      height: 1px;
      border-top: 1px solid currentColor;
    }
    .benefit-card--support .benefit-card__connector::before { top: -5px; left: 35%; }
    .benefit-card--support .benefit-card__connector::after { top: -2px; left: -2px; }

    .benefits-stage .benefit-card--support {
      padding: 20px;
      grid-template-columns: 1fr;
      grid-template-rows: auto auto auto 70px;
      grid-template-areas: "number" "title" "text" "visual";
      row-gap: 8px;
    }
    .benefits-stage .benefit-card--support .benefit-card__number { font-size: 25px; }
    .benefits-stage .benefit-card--support .benefit-card__title { font-size: 16px; }
    .benefits-stage .benefit-card--support .benefit-card__text { font-size: 12.5px; line-height: 1.42; }
    .benefits-stage .benefit-card--support .benefit-card__visual {
      display: block;
      width: calc(100% + 40px);
      height: 70px;
      margin: 4px -20px -20px;
      overflow: hidden;
    }
    .benefits-stage .benefit-card--support .benefit-card__photo {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 46%;
    }

    .benefits-principles {
      min-height: 68px;
      margin-top: clamp(20px, 1.8vw, 28px);
      border-color: rgba(109, 109, 112, .22);
      background: rgba(255, 255, 255, .48);
      box-shadow: 0 12px 30px rgba(24, 24, 26, .025);
    }

    @media (max-width: 960px) {
      .benefits-stage {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: minmax(520px, auto) repeat(2, minmax(230px, auto));
        grid-template-areas:
          "product product"
          "card01 card02"
          "card03 card04";
        min-height: 0;
        height: auto;
        column-gap: 20px;
        row-gap: 20px;
      }
      .benefits-stage::before { top: 25%; width: min(74vw, 680px); }
      .benefits-stage__product { min-height: 520px; }
      .benefits-stage__product img { width: min(100%, 780px); }
      .benefits-stage .benefit-card { align-self: stretch; min-height: 230px; }
      .benefits-stage .benefit-card::before,
      .benefits-stage .benefit-card::after,
      .benefit-card__connector,
      .benefits-stage__target { display: none; }
      .benefits-stage .benefit-card--support { min-height: 330px; }
      .benefits-stage .benefit-card--support { overflow: hidden; }
    }

    @media (max-width: 780px) {
      .benefits-section { padding: 56px 14px 44px; }
      .benefits-section__header {
        grid-template-areas: "eyebrow" "title" "intro";
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        gap: 14px;
        margin-bottom: 30px;
      }
      .benefits-section__eyebrow,
      .benefits-section__title,
      .benefits-section__intro {
        grid-column: auto;
        grid-row: auto;
      }
      .benefits-section__eyebrow { margin-bottom: 16px; font-size: 10px; }
      .benefits-section__title { max-width: 12ch; font-size: clamp(32px, 10.4vw, 42px); }
      .benefits-section__intro { max-width: none; padding: 18px 0 18px 20px; font-size: 14px; }
      .benefits-stage {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-template-areas:
          "product"
          "card01"
          "card02"
          "card03"
          "card04";
        gap: 14px;
      }
      .benefits-stage::before { top: 240px; width: 88vw; }
      .benefits-stage__product { min-height: 390px; padding: 0; }
      .benefits-stage__product img { width: 112%; height: 390px; }
      .benefits-stage .benefit-card,
      .benefits-stage .benefit-card--primary,
      .benefits-stage .benefit-card--compare,
      .benefits-stage .benefit-card--custom,
      .benefits-stage .benefit-card--support {
        min-height: 0;
        padding: 22px 18px;
        border-radius: 0;
      }
      .benefits-stage .benefit-card__number { font-size: 25px; }
      .benefits-stage .benefit-card__title { font-size: 18px; }
      .benefits-stage .benefit-card__text { max-width: none; font-size: 14px; }
      .benefits-stage .benefit-card--support { min-height: 320px; }
      .benefits-stage .benefit-card--support .benefit-card__visual {
        width: calc(100% + 36px);
        height: 150px;
        margin: 8px -18px -22px;
      }
      .benefits-principles { margin-top: 16px; }
    }

    /* Block 02 — compact 2×2 benefits grid, matched to the approved reference */
    #block-02-benefits.benefits-section {
      min-height: 0;
      padding: clamp(30px, 2.2vw, 42px) clamp(24px, 5.8vw, 104px) 0;
      overflow: hidden;
      background:
        radial-gradient(circle at 51% 42%, rgba(237, 33, 36, 0.022), transparent 34%),
        #f8f8f7;
      color: #121212;
    }

    #block-02-benefits .benefits-section__inner {
      width: 100%;
      max-width: 1570px;
      margin: 0 auto;
    }

    #block-02-benefits .benefits-section__header {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
      grid-template-areas:
        "eyebrow intro"
        "title intro";
      align-items: end;
      column-gap: clamp(48px, 8vw, 150px);
      row-gap: 10px;
      margin: 0 0 20px;
    }

    #block-02-benefits .benefits-section__eyebrow {
      grid-area: eyebrow;
      display: block;
      margin: 0;
      color: var(--brand-red);
      font-family: var(--font-body);
      font-size: clamp(12px, 0.9vw, 16px);
      font-weight: 500;
      line-height: 1.2;
      letter-spacing: 0;
    }

    #block-02-benefits .benefits-section__eyebrow::before {
      display: none;
    }

    #block-02-benefits .benefits-section__title {
      grid-area: title;
      max-width: none;
      margin: 0;
      color: #101010;
      font-family: var(--font-display);
      font-size: clamp(34px, 2.65vw, 47px);
      font-weight: 700;
      line-height: 1.03;
      letter-spacing: -0.035em;
      text-transform: none;
    }

    #block-02-benefits .benefits-section__title span {
      color: var(--brand-red);
    }

    #block-02-benefits .benefits-section__intro {
      grid-area: intro;
      align-self: center;
      max-width: 520px;
      margin: 0;
      padding: 0;
      border: 0;
      color: #2d2d2d;
      font-family: var(--font-body);
      font-size: clamp(16px, 1.15vw, 20px);
      font-weight: 400;
      line-height: 1.55;
    }

    #block-02-benefits .benefits-section__intro::before,
    #block-02-benefits .benefits-section__intro::after {
      display: none;
    }

    #block-02-benefits .benefits-section__intro span {
      display: block;
    }

    #block-02-benefits .benefits-stage {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(2, 250px);
      grid-template-areas:
        "card01 card02"
        "card03 card04";
      gap: 12px 14px;
      height: auto;
      min-height: 0;
      margin: 0;
      padding: 0;
      background: transparent;
    }

    #block-02-benefits .benefits-stage::before,
    #block-02-benefits .benefits-stage::after,
    #block-02-benefits .benefits-stage__target,
    #block-02-benefits .benefits-stage__product,
    #block-02-benefits .benefit-card__connector,
    #block-02-benefits .benefit-card__divider {
      display: none !important;
    }

    #block-02-benefits .benefits-stage .benefit-card,
    #block-02-benefits .benefits-stage .benefit-card--primary,
    #block-02-benefits .benefits-stage .benefit-card--compare,
    #block-02-benefits .benefits-stage .benefit-card--custom,
    #block-02-benefits .benefits-stage .benefit-card--support {
      position: relative;
      inset: auto;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(230px, 0.88fr) minmax(270px, 1.12fr);
      grid-template-rows: auto auto 1fr;
      grid-template-areas:
        "number visual"
        "title visual"
        "text visual";
      align-items: start;
      align-self: stretch;
      gap: 0 22px;
      width: auto;
      max-width: none;
      min-height: 242px;
      box-sizing: border-box;
      margin: 0;
      padding: clamp(22px, 1.55vw, 28px) calc(52% + 22px) clamp(22px, 1.55vw, 28px) clamp(22px, 1.7vw, 31px);
      overflow: hidden;
      border: 1px solid #dededc;
      border-radius: 15px;
      background: rgba(255, 255, 255, 0.68);
      box-shadow: none;
      transform: none;
    }

    #block-02-benefits .benefits-stage .benefit-card::before,
    #block-02-benefits .benefits-stage .benefit-card::after {
      display: none !important;
    }

    #block-02-benefits .benefits-stage .benefit-card__number {
      grid-area: number;
      position: static;
      display: block;
      margin: 0 0 12px;
      color: var(--brand-red);
      font-family: var(--font-display);
      font-size: clamp(31px, 2vw, 38px);
      font-weight: 800;
      line-height: 0.95;
      letter-spacing: -0.035em;
    }

    #block-02-benefits .benefits-stage .benefit-card__title {
      grid-area: title;
      align-self: start;
      max-width: 330px;
      margin: 0 0 14px;
      color: #111;
      font-family: var(--font-display);
      font-size: clamp(17px, 1.12vw, 21px);
      font-weight: 700;
      line-height: 1.14;
      letter-spacing: -0.015em;
      text-transform: uppercase;
    }

    #block-02-benefits .benefits-stage .benefit-card__text {
      grid-area: text;
      align-self: start;
      max-width: 315px;
      margin: 0;
      color: #4c4c4a;
      font-family: var(--font-body);
      font-size: clamp(14px, 0.9vw, 16px);
      font-weight: 400;
      line-height: 1.55;
    }

    #block-02-benefits .benefits-stage .benefit-card__visual,
    #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
      grid-area: visual;
      position: absolute;
      inset: clamp(18px, 1.25vw, 22px) clamp(18px, 1.25vw, 22px) clamp(18px, 1.25vw, 22px) auto;
      align-self: center;
      display: block;
      width: 52%;
      height: auto;
      min-height: 0;
      aspect-ratio: auto;
      margin: 0;
      overflow: hidden;
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      transform: none;
    }

    #block-02-benefits .benefits-stage .benefit-card__photo,
    #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__photo {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 100%;
      margin: 0;
      object-fit: contain;
      object-position: center;
      filter: none;
      transform: none;
    }

    #block-02-benefits .benefit-card__visual--sizes .benefit-card__photo:not(.benefit-card__photo--sizes-grid),
    #block-02-benefits .benefit-card__visual--support .benefit-card__photo:not(.benefit-card__photo--resolution) {
      display: none !important;
    }

    #block-02-benefits .benefit-card__visual--sizes .benefit-card__photo--sizes-grid {
      inset: -5% -4% -4% -4%;
      width: 108%;
      height: 109%;
      object-position: center bottom;
    }

    #block-02-benefits .benefit-card__visual--compare .benefit-card__photo {
      inset: -2% -3% -3%;
      width: 106%;
      height: 105%;
      object-position: center 58%;
    }

    #block-02-benefits .benefit-card__visual--single .benefit-card__photo {
      inset: -4% -4% -5%;
      width: 108%;
      height: 109%;
      object-fit: cover;
      object-position: center;
    }

    #block-02-benefits .benefit-card__visual--support .benefit-card__photo--resolution {
      inset: -3% -7% -4% -7%;
      width: 114%;
      height: 107%;
      object-fit: cover;
      object-position: 58% center;
    }

    #block-02-benefits .benefits-principles {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: clamp(24px, 3vw, 48px);
      min-height: 62px;
      margin: 14px 0 0;
      padding: 12px 0;
      border: 0;
      border-top: 1px solid #dededc;
      border-bottom: 1px solid #dededc;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      color: #292929;
    }

    #block-02-benefits .benefits-principles > svg {
      flex: 0 0 auto;
      width: 34px;
      height: 34px;
      margin: 0;
      color: var(--brand-red);
    }

    #block-02-benefits .benefits-principles__text {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 8px clamp(18px, 2.2vw, 35px);
      font-family: var(--font-body);
      font-size: clamp(16px, 1.12vw, 20px);
      font-weight: 400;
      line-height: 1.25;
    }

    #block-02-benefits .benefits-principles__dot {
      color: var(--brand-red);
      font-weight: 700;
    }

    #block-02-benefits .benefits-principles strong {
      color: var(--brand-red);
      font-weight: 600;
    }

    @media (max-width: 1260px) {
      #block-02-benefits.benefits-section {
        padding-inline: clamp(24px, 4vw, 52px);
      }

      #block-02-benefits .benefits-section__header {
        column-gap: 48px;
      }

      #block-02-benefits .benefits-stage .benefit-card,
      #block-02-benefits .benefits-stage .benefit-card--primary,
      #block-02-benefits .benefits-stage .benefit-card--compare,
      #block-02-benefits .benefits-stage .benefit-card--custom,
      #block-02-benefits .benefits-stage .benefit-card--support {
        grid-template-columns: minmax(205px, 0.9fr) minmax(230px, 1.1fr);
        gap: 0 14px;
        padding: 22px calc(52% + 22px) 22px 22px;
      }
    }

    @media (max-width: 980px) {
      #block-02-benefits .benefits-section__header {
        grid-template-columns: 1fr;
        grid-template-areas: "eyebrow" "title" "intro";
        gap: 10px;
      }

      #block-02-benefits .benefits-section__title {
        max-width: 760px;
      }

      #block-02-benefits .benefits-section__intro {
        max-width: 540px;
        margin-top: 4px;
      }

      #block-02-benefits .benefits-stage {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-template-areas: "card01" "card02" "card03" "card04";
      }

      #block-02-benefits .benefits-stage .benefit-card,
      #block-02-benefits .benefits-stage .benefit-card--primary,
      #block-02-benefits .benefits-stage .benefit-card--compare,
      #block-02-benefits .benefits-stage .benefit-card--custom,
      #block-02-benefits .benefits-stage .benefit-card--support {
        grid-template-columns: minmax(250px, 0.82fr) minmax(320px, 1.18fr);
        min-height: 250px;
      }
    }

    @media (max-width: 680px) {
      #block-02-benefits.benefits-section {
        padding: 42px 14px 0;
      }

      #block-02-benefits .benefits-section__header {
        margin-bottom: 22px;
      }

      #block-02-benefits .benefits-section__eyebrow {
        font-size: 11px;
      }

      #block-02-benefits .benefits-section__title {
        font-size: clamp(30px, 9.2vw, 40px);
        line-height: 1.06;
      }

      #block-02-benefits .benefits-section__intro {
        font-size: 15px;
        line-height: 1.5;
      }

      #block-02-benefits .benefits-stage .benefit-card,
      #block-02-benefits .benefits-stage .benefit-card--primary,
      #block-02-benefits .benefits-stage .benefit-card--compare,
      #block-02-benefits .benefits-stage .benefit-card--custom,
      #block-02-benefits .benefits-stage .benefit-card--support {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto 215px;
        grid-template-areas: "number" "title" "text" "visual";
        gap: 0;
        display: grid !important;
        min-height: 0;
        padding: 22px 18px 0;
        border-radius: 13px;
      }

      #block-02-benefits .benefits-stage .benefit-card__number {
        margin-bottom: 10px;
        font-size: 30px;
      }

      #block-02-benefits .benefits-stage .benefit-card__title,
      #block-02-benefits .benefits-stage .benefit-card__text {
        max-width: none;
      }

      #block-02-benefits .benefits-stage .benefit-card__title {
        margin-bottom: 10px;
        font-size: 18px;
      }

      #block-02-benefits .benefits-stage .benefit-card__text {
        font-size: 14px;
      }

      #block-02-benefits .benefits-stage .benefit-card__visual,
      #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
        position: relative;
        grid-area: visual !important;
        inset: auto;
        width: 100%;
        height: 215px;
        min-height: 215px;
        margin-top: 4px;
      }

      #block-02-benefits .benefits-principles {
        align-items: flex-start;
        gap: 14px;
        margin-top: 14px;
        padding: 16px 2px;
      }

      #block-02-benefits .benefits-principles > svg {
        width: 28px;
        height: 28px;
      }

      #block-02-benefits .benefits-principles__text {
        gap: 6px 12px;
        font-size: 14px;
      }
    }

    @media (min-width: 681px) {
      #block-02-benefits .benefits-stage .benefit-card,
      #block-02-benefits .benefits-stage .benefit-card--primary,
      #block-02-benefits .benefits-stage .benefit-card--compare,
      #block-02-benefits .benefits-stage .benefit-card--custom,
      #block-02-benefits .benefits-stage .benefit-card--support {
        display: block !important;
        padding: clamp(22px, 1.55vw, 28px) calc(49% + 20px) clamp(22px, 1.55vw, 28px) clamp(22px, 1.7vw, 31px);
      }

      #block-02-benefits .benefits-stage .benefit-card__visual,
      #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
        position: absolute !important;
        grid-area: unset !important;
        inset: clamp(18px, 1.25vw, 22px) clamp(18px, 1.25vw, 22px) auto auto !important;
        width: 49% !important;
        height: calc(100% - clamp(36px, 2.5vw, 44px)) !important;
        min-height: 0 !important;
        margin: 0 !important;
      }
    }

    /* Block 03 — functional ZIP-lock catalog */
    #catalog.catalog-section {
      position: relative;
      padding: clamp(44px, 4.3vw, 72px) clamp(20px, 5.8vw, 104px) 34px;
      overflow: visible;
      background: #f4f4f2;
      color: #111;
    }

    #catalog .catalog-section__inner {
      width: 100%;
      max-width: 1570px;
      margin: 0 auto;
    }

    #catalog .catalog-hero {
      display: grid;
      grid-template-columns: minmax(430px, 1.12fr) minmax(330px, 0.82fr) minmax(250px, 0.48fr);
      align-items: center;
      gap: clamp(28px, 3.5vw, 62px);
      min-height: 230px;
      margin-bottom: 30px;
    }

    #catalog .catalog-hero__copy { align-self: center; }

    #catalog .catalog-hero__eyebrow {
      margin: 0 0 22px;
      color: var(--brand-red);
      font-family: var(--font-body);
      font-size: 14px;
      font-weight: 650;
      line-height: 1;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    #catalog .catalog-hero__title {
      max-width: 730px;
      margin: 0;
      color: #0e0e0f;
      font-family: var(--font-display);
      font-size: clamp(38px, 3.35vw, 58px);
      font-weight: 720;
      line-height: 1.04;
      letter-spacing: -0.045em;
    }

    #catalog .catalog-hero__title span { color: var(--brand-red); }

    #catalog .catalog-hero__lead {
      max-width: 520px;
      margin: 24px 0 0;
      color: #424242;
      font-size: clamp(16px, 1.05vw, 19px);
      line-height: 1.55;
    }

    #catalog .catalog-hero__visual {
      display: flex;
      align-items: stretch;
      padding: 0px;
      justify-content: stretch;
      height: 240px;
      overflow: hidden;
      border: 1px solid #d9d9d6;
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.72);
    }

    #catalog .catalog-hero__visual img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 43%;
      mix-blend-mode: multiply;
    }

    #catalog .catalog-price-card {
      align-self: center;
      min-height: 198px;
      padding: 26px 26px 24px;
      border: 1px solid #d9d9d6;
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.72);
    }

    #catalog .catalog-price-card__question {
      margin: 0 0 14px;
      color: #6b6b69;
      font-size: 15px;
      line-height: 1.45;
    }

    #catalog .catalog-price-card__title {
      margin: 0 0 24px;
      color: #131313;
      font-family: var(--font-display);
      font-size: 21px;
      font-weight: 700;
      line-height: 1.22;
    }

    #catalog .catalog-price-card__button {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      min-height: 56px;
      padding: 0 20px;
      border: none;
      border-radius: 12px;
      background: #111113;
      color: #fff;
      font-size: 14px;
      font-weight: 700;
      text-decoration: none;
      box-shadow: none;
      transition: background-color 180ms ease, transform 180ms ease;
    }

    #catalog .catalog-price-card__button:hover {
      background: #17171a;
      box-shadow: none;
      transform: none;
    }

    #catalog .catalog-price-card__button .material-symbols-rounded { font-size: 21px; }

    #catalog .catalog-workspace {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 24px;
      padding: 24px;
      border: 1px solid #dcdcd9;
      border-radius: 16px;
      background: rgba(255, 255, 255, 0.82);
    }

    #catalog .catalog-categories {
      position: sticky;
      top: 92px;
      align-self: start;
      display: flex;
      flex-direction: column;
      gap: 10px;
      height: max-content;
      padding-right: 24px;
      border-right: 1px solid #dededb;
    }

    #catalog .catalog-category {
      position: relative;
      display: flex;
      align-items: center;
      gap: 14px;
      width: 100%;
      min-height: 64px;
      padding: 0 20px;
      border: 1px solid #e0e0de;
      border-radius: 8px;
      background: #fff;
      color: #222;
      font: inherit;
      font-size: 14px;
      text-align: left;
      cursor: pointer;
      transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
    }

    #catalog .catalog-category:hover { background: #f7f7f6; border-color: #c7c7c4; }

    #catalog .catalog-category.is-active {
      border-color: var(--brand-red);
      background: #111113;
      color: #fff;
      box-shadow: inset 3px 0 0 var(--brand-red), 0 8px 20px rgba(17, 17, 19, 0.08);
    }

    #catalog .catalog-category .material-symbols-rounded {
      flex: 0 0 auto;
      font-size: 25px;
      font-variation-settings: "wght" 350;
    }

    #catalog .catalog-results { min-width: 0; }

    #catalog .catalog-search {
      position: relative;
      display: flex;
      align-items: center;
      margin-bottom: 12px;
    }

    #catalog .catalog-search .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    #catalog .catalog-search .material-symbols-rounded {
      position: absolute;
      left: 18px;
      z-index: 1;
      color: #7b7b78;
      font-size: 19px;
      pointer-events: none;
    }

    #catalog .catalog-search input {
      width: 100%;
      height: 58px;
      padding: 0 20px 0 54px;
      border: 1px solid #d7d7d4;
      border-radius: 8px;
      outline: 0;
      background: #fff;
      color: #171717;
      font: inherit;
      font-size: 16px;
      transition: border-color 160ms ease, box-shadow 160ms ease;
    }

    #catalog .catalog-search input:focus {
      border-color: #aaa;
      box-shadow: 0 0 0 3px rgba(237, 33, 36, 0.07);
    }

    #catalog .catalog-table { width: 100%; }

    #catalog .catalog-table__head,
    #catalog .catalog-product {
      display: grid;
      grid-template-columns: 58px minmax(210px, 1.5fr) minmax(118px, 0.9fr) minmax(140px, 1fr) minmax(140px, 0.96fr);
      align-items: center;
      gap: 12px;
    }

    #catalog .catalog-table__head {
      min-height: 42px;
      padding: 0 10px;
      border-bottom: 1px solid #dcdcd9;
      color: #71716e;
      font-size: 13px;
      line-height: 1.2;
    }

    #catalog .catalog-table__head span:first-child { color: transparent; }

    #catalog .catalog-product {
      min-height: 72px;
      padding: 8px 10px;
      border-bottom: 1px solid #e2e2df;
      cursor: pointer;
      transition: background-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease, max-height 240ms ease, padding 240ms ease, min-height 240ms ease;
    }

    #catalog .catalog-product:hover,
    #catalog .catalog-product:focus-visible {
      background: #fafafa;
      box-shadow: inset 3px 0 0 var(--brand-red);
      outline: 0;
    }

    #catalog .catalog-product[hidden] { display: none !important; }
    #catalog .catalog-product[data-archived] { display: none !important; }

    #catalog .catalog-product__thumb {
      width: 42px;
      height: 54px;
      overflow: hidden;
      border: 1px solid #ecece9;
      border-radius: 6px;
      background: #fff;
    }

    #catalog .catalog-product__thumb img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
    }

    #catalog .catalog-product__size { font-weight: 700; }
    #catalog .catalog-product__purpose {
      display: block;
      max-width: 250px;
      margin-top: 4px;
      color: #72726f;
      font-size: 11px;
      font-weight: 400;
      line-height: 1.3;
    }
    #catalog .catalog-product__stock { color: #36aa16; font-weight: 700; }
    #catalog .catalog-product__pack small { display: block; margin-top: 3px; color: #676764; font-size: 11px; }

    #catalog .catalog-product__label { display: none; }

    #catalog .catalog-product__action {
      display: inline-flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      min-height: 40px;
      padding: 0 14px;
      border: 1px solid #9f9f9c;
      border-radius: 6px;
      background: transparent;
      color: #171717;
      font: inherit;
      font-size: 13px;
      font-weight: 600;
      text-decoration: none;
      transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
    }

    #catalog .catalog-product__action:hover { border-color: #111; background: #111; color: #fff; }
    #catalog .catalog-product__action .material-symbols-rounded { font-size: 18px; }

    .product-modal {
      position: fixed;
      z-index: 1250;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 24px;
      visibility: hidden;
      pointer-events: none;
      transition: visibility 0s linear .34s;
    }

    .product-modal.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }

    .product-modal__backdrop {
      position: absolute;
      inset: 0;
      background: rgba(4, 4, 5, .78);
      backdrop-filter: blur(8px);
      opacity: 0;
      transition: opacity .28s ease;
    }

    .product-modal.is-open .product-modal__backdrop { opacity: 1; }

    .product-modal__dialog {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
      align-items: stretch;
      width: min(1120px, calc(100vw - 48px));
      max-height: calc(100dvh - 48px);
      overflow: hidden;
      border: 1px solid #38383b;
      border-radius: 24px;
      background: #111214;
      color: #fff;
      box-shadow: 0 28px 90px rgba(0, 0, 0, .5);
      opacity: 0;
      transform: translateY(28px) scale(.975);
      transition: opacity .26s ease, transform .38s cubic-bezier(.22, 1, .36, 1);
    }

    .product-modal.is-open .product-modal__dialog { opacity: 1; transform: none; }

    .product-modal__close {
      position: absolute;
      z-index: 3;
      top: 18px;
      right: 18px;
      display: grid;
      width: 44px;
      height: 44px;
      place-items: center;
      border: 1px solid #454548;
      border-radius: 50%;
      background: rgba(17, 18, 20, .88);
      color: #fff;
      cursor: pointer;
      transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease;
    }

    .product-modal__close:hover { border-color: var(--brand-red); background: var(--brand-red); transform: rotate(90deg); }

    .product-modal__media {
      position: relative;
      display: block;
      min-height: 620px;
      height: 100%;
      overflow: hidden;
      border-right: 1px solid rgba(255, 255, 255, .06);
      border-radius: 24px 0 0 24px;
      background-color: var(--product-media-bg, #f4f1ee);
      isolation: isolate;
    }

    .product-modal__media::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        radial-gradient(120% 120% at 16% 14%, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 48%),
        linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0));
      pointer-events: none;
    }

    .product-modal__media img {
      position: absolute;
      inset: 0;
      z-index: 0;
      display: block;
      width: 100%;
      height: 100%;
      max-width: none;
      max-height: none;
      object-fit: contain;
      object-position: center;
      filter: drop-shadow(0 16px 32px rgba(0, 0, 0, .08));
      transform: none;
    }

    .product-modal__content {
      position: relative;
      z-index: 2;
      align-self: center;
      padding: 56px 54px 48px;
      background: #111214;
    }
    .product-modal__eyebrow { margin: 0 0 10px; color: var(--brand-red); font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
    .product-modal__title { margin: 0; font-family: var(--font-display); font-size: clamp(30px, 3vw, 44px); line-height: 1.08; }
    .product-modal__purpose { margin: 14px 0 26px; color: #c9c9ca; font-size: 14px; line-height: 1.55; }

    .product-modal__specs { margin: 0 0 28px; border-top: 1px solid #343437; }
    .product-modal__spec {
      display: grid;
      grid-template-columns: minmax(150px, .8fr) 1.2fr;
      gap: 18px;
      padding: 13px 0;
      border-bottom: 1px solid #343437;
      font-size: 14px;
      line-height: 1.35;
    }
    .product-modal__spec dt { color: #929294; }
    .product-modal__spec dd { margin: 0; font-weight: 600; }
    .product-modal__order { width: 100%; min-height: 52px; border: 0; border-radius: 7px; background: var(--brand-red); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
    .product-modal__order:hover { background: #ff3033; }

    @media (max-width: 760px) {
      .product-modal { padding: 12px; }
      .product-modal__dialog { grid-template-columns: 1fr; width: min(100%, 520px); max-height: calc(100dvh - 24px); overflow-y: auto; border-radius: 19px; }
      .product-modal__media { min-height: 280px; border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .06); border-radius: 19px 19px 0 0; }
      .product-modal__media img { inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: contain; object-position: center; }
      .product-modal__content { padding: 20px 20px 18px; }
      .product-modal__eyebrow { margin-bottom: 6px; font-size: 10px; }
      .product-modal__title { font-size: 28px; }
      .product-modal__purpose { margin: 8px 0 14px; font-size: 12px; }
      .product-modal__specs { margin-bottom: 18px; }
      .product-modal__spec { grid-template-columns: 122px 1fr; gap: 10px; padding: 7px 0; font-size: 12px; }
      .product-modal__order { min-height: 48px; }
      .product-modal__close { top: 12px; right: 12px; width: 40px; height: 40px; }
    }

    #catalog .catalog-empty {
      margin: 0;
      padding: 34px 16px;
      color: #666;
      text-align: center;
    }

    #catalog .catalog-more {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 50px;
      margin: 2px auto 0;
      padding: 0 14px;
      border: 0;
      background: transparent;
      color: #232323;
      font: inherit;
      font-size: 14px;
      cursor: pointer;
    }

    #catalog .catalog-more .material-symbols-rounded {
      color: var(--brand-red);
      font-size: 20px;
      transition: transform 180ms ease;
    }

    #catalog .catalog-more[aria-expanded="true"] .material-symbols-rounded { transform: rotate(180deg); }

    #catalog .catalog-trust {
      display: flex;
      align-items: center;
      gap: 38px;
      min-height: 72px;
      margin-top: 28px;
      padding: 14px 0;
      border-top: 1px solid #d8d8d5;
      border-bottom: 1px solid #d8d8d5;
    }

    #catalog .catalog-trust > .material-symbols-rounded { color: var(--brand-red); font-size: 36px; }

    #catalog .catalog-trust__text {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px clamp(18px, 2.5vw, 40px);
      color: #292929;
      font-size: clamp(15px, 1.05vw, 19px);
    }

    #catalog .catalog-trust__dot,
    #catalog .catalog-trust strong { color: var(--brand-red); }

    @media (max-width: 1180px) {
      #catalog .catalog-hero {
        grid-template-columns: minmax(410px, 1.1fr) minmax(300px, 0.8fr);
        grid-template-areas: "copy visual" "copy cta";
      }
      #catalog .catalog-hero__copy { grid-area: copy; }
      #catalog .catalog-hero__visual { grid-area: visual; height: 190px; }
      #catalog .catalog-price-card { grid-area: cta; min-height: 0; padding: 20px; }
      #catalog .catalog-price-card__question { margin-bottom: 7px; }
      #catalog .catalog-price-card__title { margin-bottom: 16px; }
      #catalog .catalog-workspace { grid-template-columns: 1fr; }
      #catalog .catalog-categories {
        position: static;
        flex-direction: row;
        gap: 8px;
        padding: 0 0 15px;
        overflow-x: auto;
        border-right: 0;
        border-bottom: 1px solid #dededb;
        scrollbar-width: thin;
      }
      #catalog .catalog-category { flex: 0 0 auto; width: auto; min-height: 52px; padding: 0 16px; white-space: nowrap; }
    }

    @media (max-width: 860px) {
      #catalog.catalog-section { padding-inline: 18px; }
      #catalog .catalog-hero {
        grid-template-columns: 1fr;
        grid-template-areas: "copy" "visual" "cta";
        gap: 20px;
      }
      #catalog .catalog-hero__visual { height: 180px; }
      #catalog .catalog-hero__visual img { width: min(100%, 520px); }
      #catalog .catalog-price-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 14px 20px; }
      #catalog .catalog-price-card__question { margin: 0; }
      #catalog .catalog-price-card__title { margin: 0; }
      #catalog .catalog-price-card__button { grid-column: 2; grid-row: 1 / span 2; min-width: 220px; }
      #catalog .catalog-table { overflow-x: auto; }
      #catalog .catalog-table__head,
      #catalog .catalog-product { min-width: 850px; }
    }

    @media (max-width: 680px) {
      #catalog.catalog-section { padding: 42px 14px 26px; }
      #catalog .catalog-hero { margin-bottom: 22px; }
      #catalog .catalog-hero__eyebrow { margin-bottom: 16px; font-size: 11px; }
      #catalog .catalog-hero__title { font-size: clamp(34px, 10vw, 43px); }
      #catalog .catalog-hero__lead { margin-top: 18px; font-size: 15px; }
      #catalog .catalog-hero__visual { height: 150px; }
      #catalog .catalog-price-card { display: block; padding: 20px; }
      #catalog .catalog-price-card__question { margin-bottom: 8px; }
      #catalog .catalog-price-card__title { margin-bottom: 16px; font-size: 19px; }
      #catalog .catalog-price-card__button { width: 100%; min-width: 0; }
      #catalog .catalog-workspace { gap: 16px; padding: 14px; border-radius: 12px; }
      #catalog .catalog-categories { margin-inline: -14px; padding-inline: 14px; }
      #catalog .catalog-category { min-height: 48px; font-size: 14px; }
      #catalog .catalog-category .material-symbols-rounded { font-size: 21px; }
      #catalog .catalog-search input { height: 54px; font-size: 14px; }
      #catalog .catalog-table { overflow: visible; }
      #catalog .catalog-table__head { display: none; }
      #catalog .catalog-product {
        display: grid;
        grid-template-columns: 62px 1fr 1fr;
        gap: 14px 12px;
        min-width: 0;
        min-height: 0;
        margin-bottom: 10px;
        padding: 16px;
        border: 1px solid #dededb;
        border-radius: 10px;
        background: #fff;
      }
      #catalog .catalog-product__thumb { grid-row: 1 / span 2; width: 56px; height: 72px; }
      #catalog .catalog-product__size,
      #catalog .catalog-product__unit,
      #catalog .catalog-product__pack { min-width: 0; font-size: 14px; }
      #catalog .catalog-product__label { display: block; margin-bottom: 3px; color: #777; font-size: 10px; font-weight: 500; text-transform: uppercase; }
      #catalog .catalog-product__action { grid-column: 1 / -1; min-height: 44px; }
      #catalog .catalog-more { min-height: 46px; }
      #catalog .catalog-trust { align-items: flex-start; gap: 16px; margin-top: 20px; }
      #catalog .catalog-trust > .material-symbols-rounded { font-size: 30px; }
      #catalog .catalog-trust__text { gap: 6px 11px; font-size: 14px; }
    }


    /* Block 04 — planned bulk order */
    #bulk-order.bulk-order {
      padding: 86px 24px 94px;
      background:
        radial-gradient(circle at 18% 14%, rgba(237, 33, 36, .08), transparent 30%),
        linear-gradient(180deg, #111214 0%, #0c0d0f 100%);
      color: #fff;
    }
    #bulk-order .bulk-order__inner {
      width: min(1220px, 100%);
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1.02fr) minmax(430px, .98fr);
      gap: 74px;
      align-items: center;
    }
    #bulk-order .bulk-order__eyebrow {
      margin: 0 0 11px;
      color: var(--brand-red);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .13em;
      text-transform: uppercase;
    }
    #bulk-order .bulk-order__title {
      margin: 0;
      max-width: 720px;
      font-family: var(--font-display);
      font-size: var(--h2-desktop);
      line-height: 1.08;
      letter-spacing: -1.2px;
    }
    #bulk-order .bulk-order__title span { color: var(--brand-red); }
    #bulk-order .bulk-order__lead {
      max-width: 650px;
      margin: 28px 0 0;
      color: #b9b9bc;
      font-size: 16px;
      line-height: 1.65;
    }
    #bulk-order .bulk-order__promise {
      display: flex;
      align-items: baseline;
      gap: 16px;
      margin: 42px 0 10px;
    }
    #bulk-order .bulk-order__promise strong {
      font-family: var(--font-display);
      font-size: var(--h2-desktop);
      line-height: 1;
      letter-spacing: -1.2px;
    }
    #bulk-order .bulk-order__promise span {
      max-width: 220px;
      color: #8f9094;
      font-size: 13px;
      line-height: 1.45;
    }
    #bulk-order .bulk-order__timeline {
      position: relative;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
      margin-top: 38px;
    }
    #bulk-order .bulk-order__timeline::before {
      content: '';
      position: absolute;
      top: 13px;
      left: 12px;
      right: 12px;
      height: 1px;
      background: linear-gradient(90deg, rgba(255,255,255,.12), rgba(237,33,36,.8), rgba(255,255,255,.12));
    }
    #bulk-order .bulk-order-step { position: relative; padding-top: 34px; }
    #bulk-order .bulk-order-step::before {
      content: '';
      position: absolute;
      z-index: 1;
      top: 8px;
      left: 0;
      width: 11px;
      height: 11px;
      border: 3px solid #111214;
      border-radius: 50%;
      background: var(--brand-red);
      box-shadow: 0 0 0 1px rgba(237,33,36,.65);
    }
    #bulk-order .bulk-order-step strong {
      display: block;
      margin-bottom: 7px;
      font-size: 15px;
      line-height: 1.25;
    }
    #bulk-order .bulk-order-step span {
      display: block;
      color: #8f9094;
      font-size: 12px;
      line-height: 1.5;
    }
    #bulk-order .bulk-order-card {
      position: relative;
      overflow: hidden;
      padding: 34px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 22px;
      background: #f7f7f5;
      color: #111214;
      box-shadow: 0 30px 80px rgba(0,0,0,.28);
    }
    #bulk-order .bulk-order-card::before {
      content: '';
      position: absolute;
      top: -90px;
      right: -70px;
      width: 220px;
      height: 220px;
      border-radius: 50%;
      background: rgba(237,33,36,.07);
      pointer-events: none;
    }
    #bulk-order .bulk-order-card__top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 26px;
    }
    #bulk-order .bulk-order-card__title {
      margin: 0;
      font-family: var(--font-display);
      font-size: var(--h3-desktop);
      line-height: 1.1;
    }
    #bulk-order .bulk-order-card__badge {
      flex: 0 0 auto;
      padding: 8px 11px;
      border-radius: 999px;
      background: #111214;
      color: #fff;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    #bulk-order .bulk-order-card__note {
      margin: -8px 0 24px;
      color: #66676a;
      font-size: 13px;
      line-height: 1.55;
    }
    #bulk-order .bulk-order-form { display: grid; gap: 12px; }
    #bulk-order .bulk-order-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    #bulk-order .bulk-order-form input,
    #bulk-order .bulk-order-form textarea {
      width: 100%;
      border: 1px solid #d7d7d3;
      border-radius: 10px;
      background: #fff;
      color: #111214;
      font: 500 14px/1.3 var(--font-family);
      outline: none;
      transition: border-color .18s ease, box-shadow .18s ease;
    }
    #bulk-order .bulk-order-form input { height: 54px; padding: 0 15px; }
    #bulk-order .bulk-order-form textarea { min-height: 92px; padding: 15px; resize: vertical; }
    #bulk-order .bulk-order-form input:focus,
    #bulk-order .bulk-order-form textarea:focus { border-color: var(--brand-red); box-shadow: 0 0 0 4px rgba(237,33,36,.09); }
    #bulk-order .bulk-order-form__submit {
      min-height: 56px;
      border: 0;
      border-radius: 10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      background: var(--brand-red);
      color: #fff;
      font: 800 14px/1 var(--font-family);
      cursor: pointer;
      transition: transform .18s ease, background-color .18s ease;
    }
    #bulk-order .bulk-order-form__submit:hover { transform: translateY(-2px); background: #d91b1e; }
    #bulk-order .bulk-order-form__submit .material-symbols-rounded { font-size: 19px; }
    #bulk-order .bulk-order-form__foot {
      display: flex;
      gap: 9px;
      align-items: flex-start;
      color: #7a7b7d;
      font-size: 10px;
      line-height: 1.45;
    }
    #bulk-order .bulk-order-form__foot .material-symbols-rounded { color: #20a650; font-size: 17px; }
    #bulk-order .bulk-order-form__success {
      display: none;
      padding: 14px 16px;
      border-radius: 10px;
      background: #eaf8ef;
      color: #18783b;
      font-size: 13px;
      font-weight: 700;
    }
    #bulk-order .bulk-order-form.is-success .bulk-order-form__success { display: block; }

    @media (max-width: 980px) {
      #bulk-order .bulk-order__inner { grid-template-columns: 1fr; gap: 46px; }
      #bulk-order .bulk-order-card { width: min(100%, 720px); }
    }
    @media (max-width: 640px) {
      #bulk-order.bulk-order { padding: 58px 16px 64px; }
      #bulk-order .bulk-order__title { font-size: var(--h2-mobile); letter-spacing: -.7px; }
      #bulk-order .bulk-order__lead { font-size: 14px; }
      #bulk-order .bulk-order__promise { display: block; }
      #bulk-order .bulk-order__promise strong { font-size: var(--h2-mobile); letter-spacing: -.7px; }
      #bulk-order .bulk-order__promise span { margin-top: 12px; }
      #bulk-order .bulk-order__timeline { grid-template-columns: 1fr; gap: 18px; }
      #bulk-order .bulk-order__timeline::before { top: 7px; bottom: 10px; left: 5px; right: auto; width: 1px; height: auto; }
      #bulk-order .bulk-order-step { padding: 0 0 0 28px; }
      #bulk-order .bulk-order-step::before { top: 3px; left: 0; }
      #bulk-order .bulk-order-card { padding: 22px 18px; border-radius: 18px; }
      #bulk-order .bulk-order-card__top { align-items: flex-start; }
      #bulk-order .bulk-order-card__title { font-size: var(--h3-mobile); }
      #bulk-order .bulk-order-form__grid { grid-template-columns: 1fr; }
    }

    /* UX refinements */
    #bulk-order .bulk-size-menu[hidden], #bulk-order .bulk-calendar[hidden] { display: none !important; }
    .lead-modal.is-product-request .lead-modal__dialog { grid-template-columns: 1fr 1fr; }

    .lead-modal:not(.is-product-request) .lead-modal__media::before { background: radial-gradient(100% 90% at 50% 25%, rgba(255,255,255,.92), rgba(255,255,255,0) 72%); }
    .lead-modal:not(.is-product-request) .lead-modal__media::after { background: linear-gradient(180deg, rgba(255,255,255,0), rgba(232,229,224,.22)); }
    .lead-modal:not(.is-product-request) .lead-modal__media img { opacity: 1; filter: drop-shadow(0 18px 34px rgba(0,0,0,.10)); }
    .lead-modal:not(.is-product-request) .lead-modal__media-copy { display: none; }
    .lead-modal.is-product-request .lead-modal__media { background: #f4f2ef; }
    .lead-modal.is-product-request .lead-modal__media::before { background: radial-gradient(120% 100% at 20% 10%, #fff 0%, rgba(255,255,255,.45) 48%, rgba(255,255,255,0) 80%); }
    .lead-modal.is-product-request .lead-modal__media::after { background: none; }
    .lead-modal.is-product-request .lead-modal__media img { inset: 14px; width: calc(100% - 28px); height: calc(100% - 28px); object-fit: contain; filter: drop-shadow(0 14px 28px rgba(0,0,0,.08)); }
    .lead-modal.is-product-request .lead-modal__media-copy { display: none; }

    #bulk-order .bulk-order__horizon { margin: 40px 0 10px; width: min(100%, 520px); padding: 22px 24px; border: 1px solid rgba(237,33,36,.34); border-radius: 16px; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 22px; background: linear-gradient(100deg, rgba(237,33,36,.09), rgba(237,33,36,.025)); box-shadow: inset 3px 0 0 rgba(237,33,36,.78); }
    #bulk-order .bulk-order__horizon strong { font-family: var(--font-display); font-size: 42px; line-height: .95; letter-spacing: -1.3px; white-space: nowrap; }
    #bulk-order .bulk-order__horizon span { max-width: 235px; color: #b7b7ba; font-size: 13px; line-height: 1.45; }
    #bulk-order .bulk-order-card { overflow: visible; }
    #bulk-order .bulk-order-form { position: relative; }
    #bulk-order .bulk-field-button { width: 100%; min-height: 60px; padding: 10px 14px; border: 1px solid #d7d7d3; border-radius: 10px; display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center; text-align: left; background: #fff; color: #111214; cursor: pointer; font-family: var(--font-family); }
    #bulk-order .bulk-field-button__label { grid-column: 1; color: #77787b; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
    #bulk-order .bulk-field-button > span:nth-child(2) { grid-column: 1; font-size: 14px; font-weight: 650; }
    #bulk-order .bulk-field-button .material-symbols-rounded { grid-column: 2; grid-row: 1 / 3; color: #555; font-size: 20px; }
    #bulk-order .bulk-size-picker, #bulk-order .bulk-date-picker { position: relative; }
    #bulk-order .bulk-size-menu, #bulk-order .bulk-calendar { position: absolute; z-index: 15; top: calc(100% + 8px); left: 0; right: 0; padding: 14px; border: 1px solid #deded9; border-radius: 14px; background: #fff; box-shadow: 0 22px 55px rgba(0,0,0,.18); }
    #bulk-order .bulk-size-menu { max-height: 290px; overflow: auto; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; }
    #bulk-order .bulk-size-option { position: relative; }
    #bulk-order .bulk-size-option input { position: absolute; opacity: 0; pointer-events: none; }
    #bulk-order .bulk-size-option span { display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 8px 9px; border: 1px solid #e1e1dd; border-radius: 8px; font-size: 12px; font-weight: 650; cursor: pointer; }
    #bulk-order .bulk-size-option span::before { content: ''; width: 14px; height: 14px; border: 1px solid #aaa; border-radius: 4px; flex: 0 0 auto; }
    #bulk-order .bulk-size-option input:checked + span { border-color: var(--brand-red); background: rgba(237,33,36,.055); color: #b8171a; }
    #bulk-order .bulk-size-option input:checked + span::before { border-color: var(--brand-red); background: var(--brand-red); box-shadow: inset 0 0 0 3px #fff; }
    #bulk-order .bulk-selected { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; max-height: 154px; overflow: auto; padding: 9px; border: 1px solid #e2e2de; border-radius: 12px; background: #fff; scrollbar-width: thin; }
    #bulk-order .bulk-selected[hidden] { display: none; }
    #bulk-order .bulk-selected-row { min-width: 0; display: grid; grid-template-columns: minmax(74px,1fr) auto auto; gap: 7px; align-items: center; padding: 5px 6px 5px 9px; border: 1px solid #ecece8; border-radius: 9px; background: #fafaf8; }
    #bulk-order .bulk-selected-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
    #bulk-order .bulk-qty { display: grid; grid-template-columns: 28px 48px 28px; align-items: center; overflow: hidden; border: 1px solid #d9d9d5; border-radius: 7px; background:#fff; }
    #bulk-order .bulk-qty button { height: 30px; border: 0; background: #f3f3f1; cursor: pointer; font-size: 16px; }
    #bulk-order .bulk-qty input { height: 30px; padding: 0 3px; border: 0; border-left: 1px solid #e1e1dd; border-right: 1px solid #e1e1dd; border-radius: 0; text-align: center; font-size: 11px; }
    #bulk-order .bulk-remove { border: 0; background: transparent; color: #888; cursor: pointer; }
    #bulk-order .bulk-input-wrap { min-height: 60px; padding: 9px 14px 7px; border: 1px solid #d7d7d3; border-radius: 10px; display: grid; grid-template-rows: auto 1fr; gap: 2px; background:#fff; }
    #bulk-order .bulk-input-wrap > span { color: #77787b; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
    #bulk-order .bulk-input-wrap input { width:100%; height:28px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:14px; }
    #bulk-order .bulk-input-wrap input:focus { border:0; box-shadow:none; }
    #bulk-order .bulk-calendar { right: auto; width: min(460px, calc(100vw - 48px)); padding: 12px; }
    #bulk-order .bulk-calendar__header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding:2px 2px 8px; border-bottom:1px solid #ecece8; }
    #bulk-order .bulk-calendar__header strong { font-size:13px; }
    #bulk-order .bulk-calendar__header span { color:#858585; font-size:10px; }
    #bulk-order .bulk-calendar__months { display: block; }
    #bulk-order .bulk-calendar__month-title { display:none; }
    #bulk-order .bulk-calendar__week { display:none; }
    #bulk-order .bulk-calendar__grid { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
    #bulk-order .bulk-calendar__grid > span { display:none; }
    #bulk-order .bulk-calendar__day { min-height:48px; padding:6px 3px; border:1px solid #e7e7e3; border-radius:9px; background:#fafaf8; color:#222; cursor:pointer; font:700 12px/1 var(--font-family); }
    #bulk-order .bulk-calendar__day:disabled { color: #ccc; cursor: not-allowed; }
    #bulk-order .bulk-calendar__day.is-in-range { border-color:rgba(237,33,36,.25); background: rgba(237,33,36,.07); }
    #bulk-order .bulk-calendar__day.is-selected { border-color:var(--brand-red); background: var(--brand-red); color: #fff; box-shadow:0 6px 14px rgba(237,33,36,.18); }
    #bulk-order .bulk-date-status { margin-top: -2px; color: #78797c; font-size: 11px; line-height: 1.4; }
    #bulk-order .bulk-date-status.is-selected { color: #218a49; font-weight: 700; }
    @media (max-width: 640px) {
      #bulk-order .bulk-order__horizon { display: grid; grid-template-columns: 1fr; gap: 10px; }
      #bulk-order .bulk-order__horizon strong { font-size: 34px; }
      #bulk-order .bulk-size-menu { grid-template-columns: repeat(2, minmax(0,1fr)); }
      #bulk-order .bulk-calendar { width: calc(100vw - 68px); }
      #bulk-order .bulk-calendar__months { grid-template-columns: 1fr; }
      #bulk-order .bulk-selected { grid-template-columns:1fr; max-height:178px; }
      #bulk-order .bulk-selected-row { grid-template-columns:1fr auto auto; }
      #bulk-order .bulk-remove { grid-column:auto; }
    }

  
    /* v12 — bulk planner balance and controls */
    #bulk-order .bulk-order__inner { align-items: stretch; }
    #bulk-order .bulk-order__copy {
      min-height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 18px 0;
    }
    #bulk-order .bulk-order__lead { margin-top: 24px; }
    #bulk-order .bulk-order__horizon {
      position: relative;
      width: min(100%, 600px);
      margin: 38px 0 0;
      padding: 26px 28px 25px 30px;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 26px;
      border-color: rgba(237,33,36,.42);
      border-radius: 18px;
      background:
        radial-gradient(circle at 8% 50%, rgba(237,33,36,.13), transparent 34%),
        linear-gradient(105deg, rgba(237,33,36,.07), rgba(255,255,255,.018));
      box-shadow: inset 4px 0 0 var(--brand-red), 0 18px 46px rgba(0,0,0,.14);
      overflow: hidden;
    }
    #bulk-order .bulk-order__horizon::after {
      content: '14';
      position: absolute;
      right: 18px;
      top: 50%;
      transform: translateY(-53%);
      font-family: var(--font-display);
      font-size: 92px;
      line-height: 1;
      font-weight: 800;
      color: rgba(255,255,255,.025);
      pointer-events: none;
    }
    #bulk-order .bulk-order__horizon strong { position: relative; z-index: 1; font-size: 48px; }
    #bulk-order .bulk-order__horizon span { position: relative; z-index: 1; max-width: 260px; color: #c0c0c3; }
    #bulk-order .bulk-order__timeline { margin-top: 52px; }
    #bulk-order .bulk-order-step { min-height: 132px; }
    #bulk-order .bulk-order-step strong { font-size: 16px; }
    #bulk-order .bulk-order-step span { max-width: 190px; font-size: 12.5px; line-height: 1.55; }

    #bulk-order .bulk-selected-row {
      grid-template-columns: minmax(82px, 1fr) 112px 26px;
      gap: 7px;
    }
    #bulk-order .bulk-qty {
      width: 112px;
      grid-template-columns: 30px 52px 30px;
      flex: 0 0 112px;
    }
    #bulk-order .bulk-qty button {
      width: 30px;
      min-width: 30px;
      padding: 0;
      display: grid;
      place-items: center;
      font-size: 18px;
      line-height: 1;
      color: #111214;
    }
    #bulk-order .bulk-qty input {
      width: 52px;
      min-width: 0;
      padding: 0;
      appearance: textfield;
      -moz-appearance: textfield;
    }
    #bulk-order .bulk-qty input::-webkit-outer-spin-button,
    #bulk-order .bulk-qty input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
    #bulk-order .bulk-input-wrap input::placeholder { color: #a9aaad; opacity: .72; }
    #bulk-order .bulk-input-wrap input[data-bulk-phone] { letter-spacing: .015em; }

    @media (max-width: 980px) {
      #bulk-order .bulk-order__copy { padding: 0; }
      #bulk-order .bulk-order__horizon { width: min(100%, 620px); }
    }
    @media (max-width: 640px) {
      #bulk-order .bulk-order__horizon { padding: 22px 20px 21px 24px; gap: 16px; }
      #bulk-order .bulk-order__horizon strong { font-size: 38px; }
      #bulk-order .bulk-order__timeline { margin-top: 36px; }
      #bulk-order .bulk-order-step { min-height: 0; }
      #bulk-order .bulk-selected { grid-template-columns: 1fr; }
      #bulk-order .bulk-selected-row { grid-template-columns: minmax(82px,1fr) 112px 26px; }
    }

  

    /* v13 — wide planner, calendar flow and reference-led left composition */
    #bulk-order .bulk-order__inner {
      width: min(1380px, 100%);
      grid-template-columns: minmax(430px, .78fr) minmax(620px, 1.22fr);
      gap: 52px;
      align-items: stretch;
    }
    #bulk-order .bulk-order__copy {
      position: relative;
      justify-content: flex-start;
      min-width: 0;
      padding: 16px 0 8px;
      overflow: hidden;
    }
    #bulk-order .bulk-order__eyebrow,
    #bulk-order .bulk-order__title,
    #bulk-order .bulk-order__lead { position: relative; z-index: 3; max-width: 405px; }
    #bulk-order .bulk-order__title { font-size: var(--h2-desktop); }
    #bulk-order .bulk-order__lead { margin-top: 22px; font-size: 15px; line-height: 1.58; }
    #bulk-order .bulk-order__visual {
      position: absolute;
      z-index: 1;
      top: 42px;
      right: -18px;
      width: 285px;
      height: 345px;
      pointer-events: none;
      overflow: hidden;
    }
    #bulk-order .bulk-order__visual::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, #101113 0%, rgba(16,17,19,.1) 28%, rgba(16,17,19,0) 66%), linear-gradient(180deg, rgba(16,17,19,0) 54%, #101113 100%);
    }
    #bulk-order .bulk-order__visual-glow {
      position: absolute;
      width: 220px;
      height: 220px;
      right: 4px;
      top: 54px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(237,33,36,.42), rgba(237,33,36,.13) 42%, transparent 70%);
      filter: blur(18px);
    }
    #bulk-order .bulk-order__visual img {
      position: absolute;
      z-index: 1;
      right: -44px;
      top: 20px;
      width: 330px;
      max-width: none;
      opacity: .55;
      filter: grayscale(1) invert(1) contrast(1.25) brightness(1.2);
      mix-blend-mode: screen;
      transform: rotate(-2deg);
    }
    #bulk-order .bulk-order__benefits {
      position: relative;
      z-index: 3;
      display: grid;
      grid-template-columns: repeat(3, minmax(0,1fr));
      gap: 10px;
      margin-top: 34px;
      max-width: 610px;
    }
    #bulk-order .bulk-order__benefits span {
      display: flex;
      gap: 8px;
      align-items: flex-start;
      color: #d5d5d7;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.4;
    }
    #bulk-order .bulk-order__benefits b {
      display: grid;
      place-items: center;
      flex: 0 0 24px;
      width: 24px;
      height: 24px;
      border: 1px solid rgba(237,33,36,.65);
      border-radius: 50%;
      color: #fff;
      background: rgba(237,33,36,.16);
      font-size: 9px;
    }
    #bulk-order .bulk-order__horizon {
      position: relative;
      z-index: 3;
      width: min(100%, 650px);
      margin-top: 28px;
      padding: 24px 28px;
      grid-template-columns: auto 1fr;
      background: linear-gradient(105deg, rgba(237,33,36,.12), rgba(237,33,36,.025));
    }
    #bulk-order .bulk-order__horizon strong { font-size: 44px; }
    #bulk-order .bulk-order__timeline { position: relative; z-index: 3; margin-top: 36px; }

    #bulk-order .bulk-order-card { min-width: 0; padding: 32px 30px; }
    #bulk-order .bulk-selected {
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 7px;
      max-height: 158px;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-gutter: stable;
      padding: 9px;
    }
    #bulk-order .bulk-selected-row {
      width: 100%;
      min-width: 0;
      grid-template-columns: minmax(82px,1fr) 108px 28px;
      gap: 7px;
      padding: 5px 6px 5px 9px;
      box-sizing: border-box;
      overflow: hidden;
    }
    #bulk-order .bulk-selected-row strong { min-width: 0; }
    #bulk-order .bulk-qty {
      width: 108px;
      min-width: 108px;
      grid-template-columns: 30px 48px 30px;
    }
    #bulk-order .bulk-qty button {
      width: 30px;
      min-width: 30px;
      padding: 0;
      display: grid;
      place-items: center;
      line-height: 1;
    }
    #bulk-order .bulk-qty input { min-width: 0; width: 48px; box-sizing: border-box; }
    #bulk-order .bulk-remove {
      width: 28px;
      min-width: 28px;
      height: 30px;
      padding: 0;
      display: grid;
      place-items: center;
      font-size: 20px;
      line-height: 1;
      box-sizing: border-box;
    }

    #bulk-order .bulk-calendar { width: min(520px, calc(100vw - 48px)); }
    #bulk-order .bulk-calendar__header strong { font-size: 13px; }
    #bulk-order .bulk-calendar__header strong em { color: var(--brand-red); font-style: normal; }
    #bulk-order .bulk-calendar__day.is-range-start { box-shadow: 0 0 0 3px rgba(237,33,36,.12); }

    #bulk-order .bulk-phone-wrap { position: relative; }
    #bulk-order .bulk-phone-ghost {
      position: absolute;
      z-index: 0;
      left: 14px;
      bottom: 9px;
      height: 28px;
      display: flex;
      align-items: center;
      color: #c7c8c9 !important;
      font: 500 14px/1.3 var(--font-family) !important;
      text-transform: none !important;
      letter-spacing: 0 !important;
      pointer-events: none;
      white-space: nowrap;
    }
    #bulk-order .bulk-phone-wrap input {
      position: relative;
      z-index: 1;
      background: transparent;
      color: #111214;
    }

    @media (max-width: 1180px) {
      #bulk-order .bulk-order__inner { grid-template-columns: 1fr; gap: 48px; }
      #bulk-order .bulk-order-card { width: min(100%, 780px); }
      #bulk-order .bulk-order__copy { min-height: auto; }
      #bulk-order .bulk-order__visual { right: 2%; }
    }
    @media (max-width: 700px) {
      #bulk-order .bulk-order__visual { display: none; }
      #bulk-order .bulk-order__eyebrow, #bulk-order .bulk-order__title, #bulk-order .bulk-order__lead { max-width: none; }
      #bulk-order .bulk-order__benefits { grid-template-columns: 1fr; gap: 8px; }
      #bulk-order .bulk-selected { grid-template-columns: 1fr; }
      #bulk-order .bulk-selected-row { grid-template-columns: minmax(90px,1fr) 108px 28px; }
    }


    /* v14 — stable bulk planner layout */
    #bulk-order .bulk-order__inner {
      width: min(1460px, 100%);
      grid-template-columns: minmax(400px, .68fr) minmax(720px, 1.32fr);
      gap: 42px;
    }
    #bulk-order .bulk-order-card { padding: 32px 32px 28px; }
    #bulk-order .bulk-selected {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      max-height: 188px;
      overflow-y: auto;
      overflow-x: hidden;
      padding: 10px;
      scrollbar-gutter: stable;
    }
    #bulk-order .bulk-selected-row {
      display: grid;
      grid-template-columns: minmax(92px, 1fr) 122px 30px;
      align-items: center;
      gap: 8px;
      width: 100%;
      min-width: 0;
      min-height: 42px;
      padding: 5px 7px 5px 11px;
      overflow: visible;
      box-sizing: border-box;
    }
    #bulk-order .bulk-selected-row strong {
      display: block;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: #111214;
      font-size: 12px;
      line-height: 1.2;
    }
    #bulk-order .bulk-qty {
      display: grid;
      grid-template-columns: 32px 58px 32px;
      width: 122px;
      min-width: 122px;
      height: 32px;
      overflow: hidden;
      border: 1px solid #d9d9d5;
      border-radius: 8px;
      background: #fff;
      box-sizing: border-box;
    }
    #bulk-order .bulk-qty button,
    #bulk-order .bulk-qty input {
      position: static;
      width: auto;
      min-width: 0;
      height: 30px;
      margin: 0;
      padding: 0;
      border-radius: 0;
      box-shadow: none;
      box-sizing: border-box;
    }
    #bulk-order .bulk-qty button {
      display: grid;
      place-items: center;
      border: 0;
      background: #f3f3f1;
      color: #111214;
      font: 700 18px/1 var(--font-family);
      cursor: pointer;
    }
    #bulk-order .bulk-qty input {
      border: 0;
      border-left: 1px solid #e1e1dd;
      border-right: 1px solid #e1e1dd;
      background: #fff;
      color: #111214;
      text-align: center;
      font: 600 12px/30px var(--font-family);
      appearance: textfield;
      -moz-appearance: textfield;
    }
    #bulk-order .bulk-remove {
      display: grid;
      place-items: center;
      width: 30px;
      min-width: 30px;
      height: 32px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #8d8e91;
      font-size: 21px;
      line-height: 1;
      cursor: pointer;
      overflow: visible;
    }
    #bulk-order .bulk-remove:hover { color: var(--brand-red); }

    #bulk-order .bulk-phone-wrap { position: relative; overflow: hidden; }
    #bulk-order .bulk-phone-ghost {
      position: absolute;
      z-index: 0;
      left: 14px;
      bottom: 9px;
      height: 28px;
      display: flex;
      align-items: center;
      color: #c5c6c8 !important;
      font: 500 14px/1.3 var(--font-family) !important;
      text-transform: none !important;
      letter-spacing: .015em !important;
      pointer-events: none;
      white-space: pre;
    }
    #bulk-order .bulk-phone-wrap input {
      position: relative;
      z-index: 1;
      width: 100%;
      background: transparent;
      color: #111214;
      caret-color: #111214;
      font: 600 14px/1.3 var(--font-family);
      letter-spacing: .015em;
    }

    #bulk-order .bulk-order__copy { overflow: visible; }
    #bulk-order .bulk-order__eyebrow,
    #bulk-order .bulk-order__title,
    #bulk-order .bulk-order__lead { max-width: 355px; }
    #bulk-order .bulk-order__visual {
      top: 58px;
      right: -6px;
      width: 330px;
      height: 360px;
      overflow: visible;
    }
    #bulk-order .bulk-order__visual::after { display: none; }
    #bulk-order .bulk-order__visual-glow {
      width: 270px;
      height: 270px;
      right: -4px;
      top: 72px;
      background: radial-gradient(circle, rgba(237,33,36,.34), rgba(237,33,36,.10) 46%, transparent 72%);
      filter: blur(22px);
    }
    #bulk-order .bulk-order__visual img {
      right: -8px;
      top: 0;
      width: 330px;
      max-width: none;
      opacity: 1;
      filter: none;
      mix-blend-mode: normal;
      transform: none;
    }
    #bulk-order .bulk-order__benefits { margin-top: 38px; max-width: 560px; }

    @media (max-width: 1280px) {
      #bulk-order .bulk-order__inner { grid-template-columns: minmax(390px,.8fr) minmax(650px,1.2fr); gap: 34px; }
      #bulk-order .bulk-order__visual { width: 285px; height: 320px; }
      #bulk-order .bulk-order__visual img { width: 290px; }
      #bulk-order .bulk-order__eyebrow, #bulk-order .bulk-order__title, #bulk-order .bulk-order__lead { max-width: 330px; }
    }
    @media (max-width: 1100px) {
      #bulk-order .bulk-order__inner { grid-template-columns: 1fr; }
      #bulk-order .bulk-order-card { width: min(100%, 820px); }
      #bulk-order .bulk-order__visual { right: 4%; }
    }
    @media (max-width: 700px) {
      #bulk-order .bulk-selected { grid-template-columns: 1fr; max-height: 220px; }
      #bulk-order .bulk-selected-row { grid-template-columns: minmax(100px,1fr) 122px 30px; }
      #bulk-order .bulk-order__visual { display: none; }
    }



    /* v15 — reference-led left bulk-order composition */
    #bulk-order.bulk-order {
      position: relative;
      overflow: hidden;
      padding: 72px 24px 84px;
      background:
        radial-gradient(circle at 31% 31%, rgba(237,33,36,.11), transparent 24%),
        linear-gradient(180deg, #111214 0%, #0b0c0e 100%);
    }
    #bulk-order.bulk-order::after {
      content: '';
      position: absolute;
      left: 0;
      right: 42%;
      bottom: 0;
      height: 52%;
      opacity: .22;
      pointer-events: none;
      background: repeating-linear-gradient(163deg, transparent 0 14px, rgba(237,33,36,.13) 15px, transparent 16px 29px);
      mask-image: linear-gradient(90deg, transparent 0%, #000 40%, #000 100%);
    }
    #bulk-order .bulk-order__inner {
      position: relative;
      z-index: 1;
      width: min(1420px, 100%);
      grid-template-columns: minmax(560px, .98fr) minmax(650px, 1.02fr);
      gap: 44px;
      align-items: stretch;
    }
    #bulk-order .bulk-order__copy {
      position: relative;
      min-height: 720px;
      padding: 4px 0 0;
      overflow: visible;
    }
    #bulk-order .bulk-order__eyebrow {
      width: fit-content;
      margin-bottom: 18px;
      padding-bottom: 10px;
      border-bottom: 2px solid rgba(237,33,36,.72);
      font-size: 11px;
      letter-spacing: .13em;
    }
    #bulk-order .bulk-order__eyebrow,
    #bulk-order .bulk-order__title,
    #bulk-order .bulk-order__lead { max-width: 355px; }
    #bulk-order .bulk-order__title { position: relative; z-index: 4; font-size: 46px; line-height: 1.04; letter-spacing: -1.6px; }
    #bulk-order .bulk-order__lead { position: relative; z-index: 4; margin-top: 22px; color: #d0d0d2; font-size: 14px; line-height: 1.55; }
    #bulk-order .bulk-order__visual {
      position: absolute;
      z-index: 2;
      top: 18px;
      right: -24px;
      width: 395px;
      height: 390px;
      overflow: visible;
      pointer-events: none;
    }
    #bulk-order .bulk-order__visual-glow {
      position: absolute;
      right: 18px;
      top: 90px;
      width: 320px;
      height: 220px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(237,33,36,.42), rgba(237,33,36,.14) 44%, transparent 72%);
      filter: blur(24px);
      opacity: .9;
    }
    #bulk-order .bulk-order__visual img {
      position: absolute;
      z-index: 2;
      top: 0;
      right: -10px;
      width: 405px;
      max-width: none;
      opacity: 1;
      filter: drop-shadow(0 26px 42px rgba(0,0,0,.5));
      mix-blend-mode: normal;
      transform: none;
    }
    #bulk-order .bulk-order__benefits {
      position: absolute;
      z-index: 4;
      top: 335px;
      left: 0;
      width: 100%;
      max-width: 560px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0,1fr));
      gap: 18px;
      margin: 0;
    }
    #bulk-order .bulk-order__benefits span {
      display: grid;
      grid-template-columns: 40px 1fr;
      gap: 10px;
      align-items: center;
      color: #f4f4f5;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.4;
    }
    #bulk-order .bulk-order__benefits b.material-symbols-rounded {
      display: grid;
      place-items: center;
      width: 38px;
      height: 38px;
      border: 1.5px solid var(--brand-red);
      border-radius: 50%;
      background: rgba(237,33,36,.04);
      color: var(--brand-red);
      font-size: 22px;
    }
    #bulk-order .bulk-order__benefits em { font-style: normal; }
    #bulk-order .bulk-order__horizon {
      position: absolute;
      z-index: 4;
      top: 420px;
      left: 0;
      width: min(100%, 570px);
      min-height: 86px;
      margin: 0;
      padding: 18px 24px;
      display: grid;
      grid-template-columns: 46px auto 1fr;
      gap: 16px;
      align-items: center;
      border: 1px solid rgba(237,33,36,.7);
      border-left: 3px solid var(--brand-red);
      border-radius: 15px;
      background: linear-gradient(100deg, rgba(237,33,36,.07), rgba(255,255,255,.015));
      box-shadow: none;
    }
    #bulk-order .bulk-order__horizon::after { display: none; }
    #bulk-order .bulk-order__horizon > b.material-symbols-rounded {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      color: #fff;
      font-size: 34px;
    }
    #bulk-order .bulk-order__horizon strong {
      font-size: 39px;
      line-height: 1;
      letter-spacing: -1.5px;
      white-space: nowrap;
    }
    #bulk-order .bulk-order__horizon strong span { color: var(--brand-red); }
    #bulk-order .bulk-order__horizon em {
      color: #c7c7ca;
      font-size: 12px;
      font-style: normal;
      line-height: 1.45;
    }
    #bulk-order .bulk-order__timeline {
      position: absolute;
      z-index: 4;
      left: 0;
      right: 0;
      bottom: 0;
      margin: 0;
      gap: 22px;
      max-width: 600px;
    }
    #bulk-order .bulk-order__timeline::before { top: 16px; left: 15px; right: 15px; background: rgba(237,33,36,.6); }
    #bulk-order .bulk-order-step { min-height: 140px; padding-top: 48px; }
    #bulk-order .bulk-order-step::before { display: none; }
    #bulk-order .bulk-order-step i {
      position: absolute;
      z-index: 2;
      top: 0;
      left: 0;
      display: grid;
      place-items: center;
      width: 34px;
      height: 34px;
      border: 1px solid var(--brand-red);
      border-radius: 50%;
      background: var(--brand-red);
      color: #fff !important;
      font: 800 11px/1 var(--font-family);
      font-style: normal;
      box-shadow: 0 0 0 4px #0c0d0f;
    }
    #bulk-order .bulk-order-step > b.material-symbols-rounded {
      position: absolute;
      top: 48px;
      left: 0;
      color: var(--brand-red);
      font-size: 27px;
    }
    #bulk-order .bulk-order-step strong { margin: 0 0 6px 36px; font-size: 15px; line-height: 1.2; }
    #bulk-order .bulk-order-step span { margin-left: 36px; max-width: 145px; color: #96979b; font-size: 11.5px; line-height: 1.5; }

    @media (max-width: 1260px) {
      #bulk-order .bulk-order__inner { grid-template-columns: minmax(500px,.9fr) minmax(590px,1.1fr); gap: 30px; }
      #bulk-order .bulk-order__visual { right: -44px; width: 360px; }
      #bulk-order .bulk-order__visual img { width: 365px; }
      #bulk-order .bulk-order__benefits { max-width: 520px; }
    }
    @media (max-width: 1120px) {
      #bulk-order .bulk-order__inner { grid-template-columns: 1fr; }
      #bulk-order .bulk-order__copy { min-height: 690px; }
      #bulk-order .bulk-order-card { width: min(100%, 820px); }
      #bulk-order .bulk-order__visual { right: 2%; }
    }
    @media (max-width: 720px) {
      #bulk-order.bulk-order { padding: 56px 16px 62px; }
      #bulk-order .bulk-order__copy { min-height: auto; padding-bottom: 0; }
      #bulk-order .bulk-order__eyebrow, #bulk-order .bulk-order__title, #bulk-order .bulk-order__lead { max-width: none; }
      #bulk-order .bulk-order__title { font-size: var(--h2-mobile); }
      #bulk-order .bulk-order__visual { position: relative; top: auto; right: auto; width: min(100%, 430px); height: 330px; margin: 10px auto 0; display: block; }
      #bulk-order .bulk-order__visual img { left: 50%; right: auto; width: 360px; transform: translateX(-50%); }
      #bulk-order .bulk-order__benefits, #bulk-order .bulk-order__horizon, #bulk-order .bulk-order__timeline { position: relative; top: auto; left: auto; right: auto; bottom: auto; width: 100%; max-width: none; }
      #bulk-order .bulk-order__benefits { grid-template-columns: 1fr; margin-top: 0; }
      #bulk-order .bulk-order__horizon { margin-top: 28px; grid-template-columns: 42px 1fr; }
      #bulk-order .bulk-order__horizon em { grid-column: 2; }
      #bulk-order .bulk-order__horizon strong { font-size: 34px; }
      #bulk-order .bulk-order__timeline { grid-template-columns: 1fr; margin-top: 34px; gap: 16px; }
      #bulk-order .bulk-order__timeline::before { top: 17px; bottom: 18px; left: 16px; right: auto; width: 1px; height: auto; }
      #bulk-order .bulk-order-step { min-height: 0; padding: 0 0 20px 58px; }
      #bulk-order .bulk-order-step i { left: 0; }
      #bulk-order .bulk-order-step > b.material-symbols-rounded { top: 4px; left: 42px; font-size: 20px; }
      #bulk-order .bulk-order-step strong, #bulk-order .bulk-order-step span { margin-left: 18px; max-width: none; }
    }


    /* v16 — strict reference alignment for bulk-order left panel */
    #bulk-order .bulk-order__eyebrow {
      margin-bottom: 18px;
      padding-bottom: 0;
      border-bottom: 0;
    }
    #bulk-order .bulk-order__benefits { display: none !important; }
    #bulk-order .bulk-order__copy { min-height: 720px; }
    #bulk-order .bulk-order__visual { top: 78px; right: -20px; width: 410px; height: 390px; }
    #bulk-order .bulk-order__visual img { width: 410px; }

    #bulk-order .bulk-order__horizon {
      top: 390px;
      width: min(100%, 620px);
      min-height: 98px;
      padding: 20px 28px;
      grid-template-columns: 52px auto 1fr;
      gap: 18px;
      border: 1px solid rgba(237,33,36,.62);
      border-left: 3px solid var(--brand-red);
      border-radius: 15px;
      background: linear-gradient(100deg, rgba(237,33,36,.055), rgba(255,255,255,.012));
    }
    #bulk-order .bulk-order__horizon > b.material-symbols-rounded {
      width: 48px; height: 48px; color: #fff; font-size: 38px;
    }
    #bulk-order .bulk-order__horizon strong {
      font-size: 46px; line-height: .95; letter-spacing: -1.7px;
    }
    #bulk-order .bulk-order__horizon em {
      max-width: 220px; color: #c7c7ca; font-size: 12.5px; line-height: 1.45;
    }

    #bulk-order .bulk-order__timeline {
      bottom: 0; max-width: 650px; gap: 28px;
    }
    #bulk-order .bulk-order__timeline::before { top: 17px; left: 17px; right: 17px; }
    #bulk-order .bulk-order-step { min-height: 170px; padding-top: 52px; }
    #bulk-order .bulk-order-step i {
      width: 36px; height: 36px; font-size: 11px;
    }
    #bulk-order .bulk-order-step > b.material-symbols-rounded {
      position: static;
      display: inline-grid;
      place-items: center;
      width: 44px;
      height: 44px;
      margin: 0 10px 0 0;
      color: var(--brand-red);
      font-size: 38px;
      line-height: 1;
      vertical-align: middle;
    }
    #bulk-order .bulk-order-step strong {
      display: inline-block;
      width: calc(100% - 60px);
      margin: 0;
      vertical-align: middle;
      color: #f6f6f7;
      font-size: 16px;
      line-height: 1.25;
    }
    #bulk-order .bulk-order-step span {
      display: block;
      max-width: 185px;
      margin: 6px 0 0;
      color: #97989b;
      font-size: 12.5px;
      line-height: 1.55;
    }

    #bulk-order .bulk-phone-wrap { overflow: hidden; }
    #bulk-order .bulk-phone-ghost { display: none !important; }
    #bulk-order .bulk-phone-field {
      display: flex;
      align-items: center;
      min-width: 0;
      height: 28px;
      color: #111214;
      font: 600 14px/1.3 var(--font-family);
      letter-spacing: .015em;
    }
    #bulk-order .bulk-phone-prefix {
      flex: 0 0 auto;
      color: #111214 !important;
      font: inherit !important;
      text-transform: none !important;
      letter-spacing: inherit !important;
      white-space: pre;
    }
    #bulk-order .bulk-phone-wrap .bulk-phone-field input {
      flex: 1 1 auto;
      min-width: 0;
      width: auto;
      height: 28px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #111214;
      font: inherit;
      letter-spacing: inherit;
      box-shadow: none;
    }
    #bulk-order .bulk-phone-wrap .bulk-phone-field input::placeholder {
      color: #b9babd;
      opacity: .72;
    }

    @media (max-width: 720px) {
      #bulk-order .bulk-order__copy { min-height: auto; }
      #bulk-order .bulk-order__horizon { position: relative; top: auto; margin-top: 28px; grid-template-columns: 48px auto; }
      #bulk-order .bulk-order__horizon em { grid-column: 2; }
      #bulk-order .bulk-order__timeline { position: relative; bottom: auto; margin-top: 36px; }
      #bulk-order .bulk-order-step > b.material-symbols-rounded { width: 38px; height: 38px; font-size: 32px; }
      #bulk-order .bulk-order-step strong { width: calc(100% - 52px); }
      #bulk-order .bulk-order-step span { max-width: none; }
    }


    /* v17 — fixed product selector + reference-accurate 14-day banner */
    #bulk-order .bulk-order__horizon {
      width: min(100%, 650px);
      min-height: 94px;
      margin-top: 30px;
      padding: 18px 28px;
      display: grid;
      grid-template-columns: 52px auto minmax(150px, 1fr);
      align-items: center;
      gap: 20px;
      border: 1px solid rgba(237,33,36,.72);
      border-radius: 17px;
      background: linear-gradient(100deg, rgba(237,33,36,.08), rgba(237,33,36,.018));
      box-shadow: none;
      overflow: hidden;
    }
    #bulk-order .bulk-order__horizon::after { display: none; }
    #bulk-order .bulk-order__horizon > b {
      display: grid; place-items: center; width: 52px; height: 52px;
      color: #fff; font-size: 36px; font-weight: 400;
    }
    #bulk-order .bulk-order__horizon strong {
      display: flex; align-items: baseline; gap: 10px;
      margin: 0; color: #fff; font-family: var(--font-display);
      font-size: 43px; line-height: .95; letter-spacing: -1.2px; white-space: nowrap;
    }
    #bulk-order .bulk-order__horizon strong span {
      color: var(--brand-red); font-size: 1em; font-weight: 800; max-width: none;
    }
    #bulk-order .bulk-order__horizon em {
      justify-self: start; max-width: 205px; color: #d3d3d5;
      font: 500 12px/1.45 var(--font-family); font-style: normal;
    }

    #bulk-order .bulk-product-browser {
      border: 1px solid #deded9; border-radius: 13px; background: #fff; overflow: hidden; outline: none;
    }
    #bulk-order .bulk-product-browser:focus-visible { box-shadow: 0 0 0 4px rgba(237,33,36,.09); border-color: var(--brand-red); }
    #bulk-order .bulk-product-browser__head {
      min-height: 60px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
      border-bottom: 1px solid #ecece8; background: #fff;
    }
    #bulk-order .bulk-product-browser__head > div { display: grid; gap: 3px; }
    #bulk-order .bulk-product-browser__head span { color: #77787b; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
    #bulk-order .bulk-product-browser__head strong { color: #111214; font-size: 14px; font-weight: 700; }
    #bulk-order .bulk-product-browser__head small { max-width: 235px; color: #98999b; font-size: 10px; line-height: 1.35; text-align: right; }
    #bulk-order .bulk-product-grid {
      height: 218px; padding: 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-auto-rows: 58px; gap: 8px; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; align-content: start;
    }
    #bulk-order .bulk-product-item {
      position: relative; min-width: 0; height: 58px; padding: 7px 9px; display: grid; grid-template-columns: minmax(0,1fr) auto;
      align-items: center; gap: 7px; border: 1px solid #e5e5e1; border-radius: 10px; background: #fafaf8;
      color: #111214; cursor: pointer; transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
    }
    #bulk-order .bulk-product-item:hover { border-color: #c9c9c5; background: #fff; }
    #bulk-order .bulk-product-item.is-selected {
      border-color: var(--brand-red); background: rgba(237,33,36,.055); box-shadow: inset 0 0 0 1px rgba(237,33,36,.10);
    }
    #bulk-order .bulk-product-item__size { min-width: 0; font-size: 12px; font-weight: 750; white-space: nowrap; }
    #bulk-order .bulk-product-item__choose { color: #8c8d90; font-size: 10px; font-weight: 650; }
    #bulk-order .bulk-product-item.is-selected .bulk-product-item__choose { display: none; }
    #bulk-order .bulk-product-item .bulk-qty { display: none; width: 102px; min-width: 102px; height: 30px; grid-template-columns: 28px 46px 28px; }
    #bulk-order .bulk-product-item.is-selected .bulk-qty { display: grid; }
    #bulk-order .bulk-product-item .bulk-qty button { width: 28px; min-width: 28px; height: 28px; }
    #bulk-order .bulk-product-item .bulk-qty input { width: 46px; height: 28px; font-size: 11px; }
    #bulk-order .bulk-product-item__remove {
      position: absolute; top: -6px; right: -6px; display: none; width: 20px; height: 20px; padding: 0; place-items: center;
      border: 0; border-radius: 50%; background: var(--brand-red); color: #fff; font-size: 14px; cursor: pointer; box-shadow: 0 4px 10px rgba(237,33,36,.22);
    }
    #bulk-order .bulk-product-item.is-selected .bulk-product-item__remove { display: grid; }

    @media (max-width: 1180px) {
      #bulk-order .bulk-product-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    }
    @media (max-width: 700px) {
      #bulk-order .bulk-order__horizon { grid-template-columns: 44px 1fr; gap: 14px; }
      #bulk-order .bulk-order__horizon > b { width: 44px; height: 44px; font-size: 30px; }
      #bulk-order .bulk-order__horizon strong { font-size: 34px; }
      #bulk-order .bulk-order__horizon em { grid-column: 2; max-width: none; margin-top: -6px; }
      #bulk-order .bulk-product-browser__head small { display: none; }
      #bulk-order .bulk-product-grid { height: 230px; grid-template-columns: repeat(2, minmax(0,1fr)); }
      #bulk-order .bulk-product-item { grid-template-columns: 1fr; gap: 3px; height: 66px; }
      #bulk-order .bulk-product-item .bulk-qty { width: 100%; grid-template-columns: 28px 1fr 28px; }
      #bulk-order .bulk-product-item .bulk-qty input { width: 100%; }
    }


    /* v18 — exact 14-day banner + explicit two-step date range */
    #bulk-order .bulk-order__horizon {
      top: 392px;
      width: min(100%, 650px);
      min-height: 96px;
      padding: 18px 28px;
      display: grid;
      grid-template-columns: 54px 236px minmax(0, 1fr);
      align-items: center;
      column-gap: 20px;
      border: 1px solid rgba(237,33,36,.82);
      border-left-width: 1px;
      border-radius: 16px;
      background: linear-gradient(90deg, rgba(237,33,36,.045), rgba(237,33,36,.015));
      box-shadow: none;
    }
    #bulk-order .bulk-order__horizon > b.material-symbols-rounded {
      width: 54px;
      height: 54px;
      display: grid;
      place-items: center;
      color: #fff;
      font-size: 40px;
      font-weight: 300;
    }
    #bulk-order .bulk-order__horizon strong {
      display: block;
      margin: 0;
      color: #fff;
      font-family: var(--font-display);
      font-size: 44px;
      line-height: .98;
      letter-spacing: -1.45px;
      white-space: nowrap;
    }
    #bulk-order .bulk-order__horizon strong span { color: var(--brand-red); }
    #bulk-order .bulk-order__horizon em {
      display: block;
      max-width: 205px;
      margin: 0;
      color: #d0d0d2;
      font: 500 12.5px/1.45 var(--font-family);
      font-style: normal;
      justify-self: start;
    }

    #bulk-order .bulk-calendar__header {
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: center;
      justify-content: initial;
      gap: 8px 12px;
      margin-bottom: 12px;
      padding: 10px 12px;
      border: 1px solid #ebeae6;
      border-radius: 10px;
      background: #fafaf8;
    }
    #bulk-order .bulk-calendar__step {
      grid-row: 1 / span 2;
      display: grid;
      place-items: center;
      width: 34px;
      height: 34px;
      border-radius: 50%;
      background: #111214;
      color: #fff !important;
      font: 800 11px/1 var(--font-family);
    }
    #bulk-order .bulk-calendar__header.is-end-step {
      border-color: rgba(237,33,36,.25);
      background: rgba(237,33,36,.045);
    }
    #bulk-order .bulk-calendar__header.is-end-step .bulk-calendar__step { background: var(--brand-red); }
    #bulk-order .bulk-calendar__header strong { font-size: 13px; line-height: 1.25; }
    #bulk-order .bulk-calendar__header span:not(.bulk-calendar__step) { color: #858585; font-size: 10px; line-height: 1.35; }
    #bulk-order .bulk-calendar__header strong em { color: var(--brand-red); font-style: normal; }
    #bulk-order .bulk-calendar__day.is-awaiting-end:not(:disabled) { border-color: rgba(237,33,36,.18); }
    #bulk-order .bulk-calendar__day.is-before-start { opacity: .34; cursor: not-allowed; }
    #bulk-order [data-bulk-date-status].is-awaiting-end { color: #c61c20; font-weight: 700; }

    @media (max-width: 700px) {
      #bulk-order .bulk-order__horizon { grid-template-columns: 48px 1fr; row-gap: 8px; padding: 18px 20px; }
      #bulk-order .bulk-order__horizon strong { font-size: 35px; }
      #bulk-order .bulk-order__horizon em { grid-column: 2; max-width: none; }
    }

    /* v20 — unified vertical rhythm between main landing sections */
    :root { --section-entry-space: clamp(42px, 3.2vw, 54px); }

    #block-02-benefits.benefits-section {
      padding-top: var(--section-entry-space);
      padding-bottom: 0;
    }

    #catalog.catalog-section {
      padding-top: var(--section-entry-space);
      padding-bottom: 0;
    }

    #bulk-order.bulk-order {
      padding-top: var(--section-entry-space);
      padding-bottom: clamp(62px, 5vw, 82px);
    }

    @media (max-width: 700px) {
      :root { --section-entry-space: 34px; }
      #block-02-benefits.benefits-section,
      #catalog.catalog-section,
      #bulk-order.bulk-order { padding-top: var(--section-entry-space); }
      #block-02-benefits.benefits-section,
      #catalog.catalog-section { padding-bottom: 0; }
      #bulk-order.bulk-order { padding-bottom: 52px; }
    }


    /* v23 — corrected section rhythm: outer spacing, not stretched internal gaps */
    #bulk-order.bulk-order {
      padding-top: clamp(72px, 5.2vw, 88px);
    }
    #bulk-order .bulk-order__eyebrow {
      margin: 0 0 22px;
      padding-bottom: 0;
      border-bottom: 0;
    }
    #bulk-order .bulk-order__lead {
      margin-top: 28px;
    }
    @media (max-width: 700px) {
      #bulk-order.bulk-order { padding-top: 52px; }
      #bulk-order .bulk-order__eyebrow { margin-bottom: 18px; }
      #bulk-order .bulk-order__lead { margin-top: 22px; }
    }

    /* v24 — symmetric spacing across the Catalog → Bulk Order color boundary */
    :root { --catalog-bulk-boundary-space: clamp(62px, 4.6vw, 78px); }

    #catalog.catalog-section {
      padding-bottom: var(--catalog-bulk-boundary-space);
    }

    #bulk-order.bulk-order {
      padding-top: var(--catalog-bulk-boundary-space);
    }

    @media (max-width: 700px) {
      :root { --catalog-bulk-boundary-space: 42px; }
      #catalog.catalog-section { padding-bottom: var(--catalog-bulk-boundary-space); }
      #bulk-order.bulk-order { padding-top: var(--catalog-bulk-boundary-space); }
    }



    /* v26 — black principles band + equal rhythm around it */
    :root { --benefits-catalog-rhythm: clamp(46px, 3.6vw, 60px); }

    #block-02-benefits.benefits-section {
      padding-bottom: 0;
    }

    #block-02-benefits .benefits-principles {
      width: 100vw;
      min-height: 82px;
      margin: var(--benefits-catalog-rhythm) 0 0 calc(50% - 50vw);
      padding: 20px clamp(24px, 5.8vw, 104px);
      border: 0;
      border-radius: 0;
      background: #0f1011;
      color: #fff;
      box-shadow: none;
    }

    #block-02-benefits .benefits-principles > svg {
      color: var(--brand-red);
    }

    #block-02-benefits .benefits-principles__text {
      color: #fff;
    }

    #block-02-benefits .benefits-principles__text > span:not(.benefits-principles__dot) {
      color: #fff;
    }

    #block-02-benefits .benefits-principles__dot,
    #block-02-benefits .benefits-principles strong {
      color: var(--brand-red);
    }

    #catalog.catalog-section {
      padding-top: var(--benefits-catalog-rhythm);
    }

    @media (max-width: 700px) {
      :root { --benefits-catalog-rhythm: 34px; }

      #block-02-benefits .benefits-principles {
        width: 100vw;
        min-height: 0;
        margin: var(--benefits-catalog-rhythm) 0 0 calc(50% - 50vw);
        padding: 18px 20px;
        align-items: center;
      }

      #catalog.catalog-section {
        padding-top: var(--benefits-catalog-rhythm);
      }
    }


/* v66 — redesigned dark footer with map and single logo */
.site-footer {
  position: relative;
  background: #050505 !important;
  color: #fff;
  padding: 40px 0 0 !important;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 16%, rgba(241,35,39,.09), transparent 28%),
    radial-gradient(circle at 86% 24%, rgba(255,255,255,.035), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  pointer-events: none;
}
.site-footer__inner {
  position: relative;
  z-index: 1;
  width: min(1426px, calc(100% - 48px)) !important;
  max-width: 1426px !important;
  margin: 0 auto;
  padding: 30px 34px 26px !important;
  border-radius: 34px 34px 0 0;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(10,10,12,.96), rgba(4,4,6,.98));
  box-shadow: none !important;
}
.site-footer__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 28px;
}
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px 18px;
}
.footer-nav a {
  color: #f5f5f7;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.02em;
  transition: color .25s ease, opacity .25s ease;
}
.footer-nav a:hover { color: #f12327; }
.footer-nav__dot {
  color: #f12327;
  font-size: 16px;
  line-height: 1;
  opacity: .95;
}
.site-footer__main {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, .95fr) minmax(0, 1.32fr);
  gap: 28px;
  padding: 30px 0 34px;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.site-footer__intro {
  padding-right: 14px;
}
.site-footer__lead {
  margin: 0 0 26px;
  color: #f3f3f5;
  font-size: 18px;
  line-height: 1.62;
}
.footer-feature-list {
  display: grid;
  gap: 16px;
}
.footer-feature {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-feature__icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(241,35,39,.08);
  color: #f12327;
}
.footer-feature__icon .material-symbols-rounded { font-size: 24px; }
.footer-feature__title {
  margin: 0 0 4px;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
}
.footer-feature__text {
  margin: 0;
  color: #a7aab4;
  font-size: 15px;
  line-height: 1.55;
}
.site-footer__contact {
  padding: 0 18px 0 24px;
  border-left: 1px solid rgba(255,255,255,.08);
}
.site-footer__section-title {
  margin: 0 0 22px;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.03em;
}
.footer-contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 18px;
}
.footer-contact-item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-contact-item__icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(241,35,39,.08);
  color: #f12327;
}
.footer-contact-item__icon .material-symbols-rounded { font-size: 24px; }
.footer-contact-item__content,
.footer-contact-item__content a {
  color: #f5f5f7;
  text-decoration: none;
  font-size: 16px;
  line-height: 1.6;
}
.footer-contact-item__content a:hover { color: #f12327; }
.footer-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}
.footer-socials a {
  min-width: 46px;
  height: 46px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .25s ease, border-color .25s ease, color .25s ease, background .25s ease;
}
.footer-socials a:hover {
  transform: translateY(-2px);
  border-color: rgba(241,35,39,.4);
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.site-footer__map-wrap {
  min-width: 0;
}
.footer-map {
  position: relative;
  min-height: 470px;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 64% 52%, rgba(69,120,255,.14), transparent 18%),
    radial-gradient(circle at 83% 78%, rgba(255,255,255,.08), transparent 14%),
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.05), transparent 16%),
    linear-gradient(180deg, rgba(12,17,27,.95), rgba(5,8,13,.98));
}
.footer-map::before,
.footer-map::after {
  content: "";
  position: absolute;
  inset: -8%;
  pointer-events: none;
}
.footer-map::before {
  background:
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(139,169,255,.07) 31px 33px),
    repeating-linear-gradient(180deg, transparent 0 31px, rgba(139,169,255,.06) 31px 33px);
  opacity: .18;
  transform: rotate(8deg) scale(1.08);
}
.footer-map::after {
  background:
    linear-gradient(115deg, transparent 0 44%, rgba(206,225,255,.18) 44.4%, rgba(206,225,255,.02) 46%, transparent 47%),
    linear-gradient(14deg, transparent 0 59%, rgba(206,225,255,.12) 59.2%, rgba(206,225,255,.03) 60.4%, transparent 61.2%),
    radial-gradient(ellipse at 48% 86%, rgba(88,118,176,.35) 0 14%, rgba(88,118,176,0) 24%);
  opacity: .55;
}
.footer-map__label {
  position: absolute;
  color: rgba(255,255,255,.9);
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.footer-map__label--city {
  top: 18%;
  left: 47%;
  transform: translateX(-50%);
  font-size: clamp(38px, 4vw, 58px);
  font-weight: 800;
}
.footer-map__label--old { top: 8%; left: 47%; font-size: 16px; opacity: .82; }
.footer-map__label--park { top: 18%; right: 6%; font-size: 16px; max-width: 160px; text-align: center; opacity: .82; }
.footer-map__label--river { top: 44%; left: 36%; font-size: 14px; transform: rotate(10deg); opacity: .78; }
.footer-map__label--zam { bottom: 28%; left: 44%; font-size: 16px; max-width: 160px; text-align: center; opacity: .82; }
.footer-map__pin {
  position: absolute;
  top: 42%;
  right: 23%;
  width: 54px;
  height: 54px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #f12327;
  box-shadow: 0 16px 36px rgba(241,35,39,.35);
}
.footer-map__pin::before {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 50%;
  background: #fff;
}
.footer-map__card {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 24px;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 16px;
  align-items: start;
  padding: 22px 24px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(9,10,15,.84), rgba(9,10,15,.92));
  box-shadow: 0 22px 50px rgba(0,0,0,.24);
  backdrop-filter: blur(12px);
}
.footer-map__card .material-symbols-rounded {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(241,35,39,.1);
  color: #f12327;
  font-size: 28px;
}
.footer-map__address {
  margin: 0;
  font-size: 18px;
  line-height: 1.45;
  font-weight: 700;
}
.footer-map__hours {
  margin: 10px 0 0;
  color: #bec1c9;
  font-size: 16px;
  line-height: 1.55;
}
.site-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  gap: 18px 28px;
  padding-top: 22px;
}
.site-footer__copyright {
  color: #c1c4cb;
  font-size: 15px;
  line-height: 1.5;
}
.site-footer__payments {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.site-footer__payment-badge {
  min-width: 66px;
  height: 38px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 18px;
}
.site-footer__legal a {
  color: #c1c4cb;
  text-decoration: none;
  font-size: 15px;
}
.site-footer__legal a:hover { color: #fff; }
.site-footer__to-top {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1px solid rgba(241,35,39,.5);
  background: rgba(255,255,255,.03);
  display: grid;
  place-items: center;
  color: #fff;
  text-decoration: none;
  transition: transform .25s ease, border-color .25s ease, color .25s ease, background .25s ease;
}
.site-footer__to-top:hover {
  transform: translateY(-2px);
  border-color: #f12327;
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.site-footer__to-top .material-symbols-rounded { font-size: 26px; }
@media (max-width: 1320px) {
  .site-footer__main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .site-footer__map-wrap { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .site-footer__nav {
    flex-direction: column;
    align-items: flex-start;
  }
  .footer-nav { justify-content: flex-start; }
  .site-footer__contact { padding-left: 0; border-left: 0; }
  .site-footer__bottom {
    grid-template-columns: 1fr;
    justify-items: start;
  }
  .site-footer__legal { justify-content: flex-start; }
}
@media (max-width: 820px) {
  .site-footer__inner {
    width: min(100%, calc(100% - 24px)) !important;
    padding: 24px 20px 22px !important;
    border-radius: 24px 24px 0 0;
  }
  .site-footer__main { grid-template-columns: 1fr; gap: 26px; }
  .site-footer__lead { font-size: 17px; }
  .footer-map { min-height: 400px; }
  .footer-map__label--city { font-size: 42px; }
  .footer-map__card { left: 18px; right: 18px; bottom: 18px; padding: 18px; }
}
@media (max-width: 640px) {
  .site-footer { padding-top: 24px !important; }
  .site-footer__inner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 22px 16px calc(22px + var(--jp-safe-bottom)) !important;
    border-radius: 22px 22px 0 0;
  }
  .site-footer__nav { padding-bottom: 20px; }
  .footer-nav {
    gap: 10px 14px;
  }
  .footer-nav a { font-size: 14px; }
  .site-footer__main { padding: 22px 0 24px; }
  .site-footer__section-title { font-size: 24px; }
  .footer-contact-item,
  .footer-feature { grid-template-columns: 36px 1fr; gap: 12px; }
  .footer-contact-item__icon,
  .footer-feature__icon { width: 36px; height: 36px; border-radius: 12px; }
  .footer-map { min-height: 330px; border-radius: 22px; }
  .footer-map__label--city { top: 15%; font-size: 32px; }
  .footer-map__label--old,
  .footer-map__label--park,
  .footer-map__label--zam { font-size: 13px; }
  .footer-map__pin { width: 44px; height: 44px; right: 18%; }
  .footer-map__pin::before { inset: 11px; }
  .footer-map__card {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 16px;
  }
  .footer-map__card .material-symbols-rounded {
    width: 42px;
    height: 42px;
    font-size: 24px;
  }
  .footer-map__address { font-size: 16px; }
  .footer-map__hours { font-size: 14px; }
  .site-footer__payments,
  .site-footer__legal { gap: 10px 12px; }
  .site-footer__payment-badge { min-width: 58px; height: 34px; font-size: 14px; }
  .site-footer__to-top { width: 50px; height: 50px; }
}

/* v67 — footer aligned with the landing design system */
.site-footer {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0 24px, #050505 24px 100%) !important;
  color: #fff;
  border-top: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 24px 0 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 12%, rgba(241,35,39,.16), transparent 18%),
    radial-gradient(circle at 20% 8%, rgba(255,255,255,.04), transparent 14%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 22%);
}
.site-footer__inner {
  position: relative;
  z-index: 1;
  width: min(1426px, calc(100% - 48px)) !important;
  max-width: 1426px !important;
  margin: 0 auto;
  padding: 28px 34px 26px !important;
  border-radius: 34px 34px 0 0;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(10,10,12,.98), rgba(5,5,7,.99));
  box-shadow: none !important;
  overflow: hidden;
}
.site-footer__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 34px;
  right: 34px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(241,35,39,.55), transparent);
  pointer-events: none;
}
.footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.04em;
  text-decoration: none;
}
.footer-brand__mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 7px solid #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px #080809;
  position: relative;
}
.footer-brand__mark::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f12327;
}
.site-footer__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding-bottom: 24px;
}
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
}
.footer-nav a {
  color: #f4f4f6;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -.01em;
  transition: color .22s ease, opacity .22s ease;
}
.footer-nav a:hover { color: #f12327; }
.footer-nav__dot {
  color: rgba(241,35,39,.95);
  line-height: 1;
  font-size: 14px;
}
.site-footer__main {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, .92fr) minmax(0, 1.18fr);
  gap: 20px;
  padding: 26px 0 30px;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.site-footer__intro,
.site-footer__contact,
.site-footer__map-wrap {
  min-width: 0;
  padding: 26px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.018)),
    rgba(255,255,255,.015);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
.site-footer__intro { padding-right: 26px; }
.site-footer__lead {
  margin: 0 0 24px;
  color: #f3f3f5;
  font-size: 18px;
  line-height: 1.62;
}
.footer-feature-list {
  display: grid;
  gap: 15px;
}
.footer-feature {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-feature__icon,
.footer-contact-item__icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(241,35,39,.1);
  color: #f12327;
}
.footer-feature__icon .material-symbols-rounded,
.footer-contact-item__icon .material-symbols-rounded {
  font-size: 22px;
}
.footer-feature__title {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}
.footer-feature__text {
  margin: 0;
  color: #aeb1b9;
  font-size: 14px;
  line-height: 1.55;
}
.site-footer__contact {
  padding-left: 26px;
  border-left: 1px solid rgba(255,255,255,.06);
}
.site-footer__section-title {
  margin: 0 0 18px;
  font-size: clamp(26px, 2.3vw, 34px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.03em;
}
.footer-contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.footer-contact-item {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-contact-item__content,
.footer-contact-item__content a {
  color: #f4f4f6;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.58;
}
.footer-contact-item__content a:hover { color: #f12327; }
.footer-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.footer-socials a {
  min-width: 42px;
  height: 42px;
  padding: 0 13px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .22s ease, border-color .22s ease, color .22s ease, background .22s ease;
}
.footer-socials a:hover {
  transform: translateY(-2px);
  border-color: rgba(241,35,39,.45);
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.footer-map {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 78% 18%, rgba(241,35,39,.18), transparent 22%),
    radial-gradient(circle at 18% 76%, rgba(255,255,255,.05), transparent 18%),
    linear-gradient(180deg, rgba(13,13,15,.96), rgba(6,6,8,.98));
}
.footer-map::before,
.footer-map::after {
  content: "";
  position: absolute;
  inset: -8%;
  pointer-events: none;
}
.footer-map::before {
  background:
    repeating-linear-gradient(90deg, transparent 0 32px, rgba(255,255,255,.045) 32px 33px),
    repeating-linear-gradient(180deg, transparent 0 32px, rgba(255,255,255,.04) 32px 33px);
  opacity: .22;
  transform: rotate(7deg) scale(1.06);
}
.footer-map::after {
  background:
    linear-gradient(118deg, transparent 0 42%, rgba(241,35,39,.18) 42.4%, rgba(241,35,39,.02) 44.5%, transparent 46%),
    linear-gradient(15deg, transparent 0 62%, rgba(255,255,255,.09) 62.2%, rgba(255,255,255,.02) 63.5%, transparent 64.5%),
    radial-gradient(ellipse at 45% 86%, rgba(241,35,39,.18) 0 14%, rgba(241,35,39,0) 24%);
  opacity: .72;
}
.footer-map__label {
  position: absolute;
  color: rgba(255,255,255,.86);
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.footer-map__label--city {
  top: 16%;
  left: 47%;
  transform: translateX(-50%);
  font-size: clamp(36px, 3.6vw, 54px);
  font-weight: 800;
}
.footer-map__label--old { top: 9%; left: 47%; font-size: 14px; opacity: .76; }
.footer-map__label--park { top: 18%; right: 6%; font-size: 14px; max-width: 150px; text-align: center; opacity: .76; }
.footer-map__label--river { top: 45%; left: 35%; font-size: 13px; transform: rotate(10deg); opacity: .68; }
.footer-map__label--zam { bottom: 28%; left: 43%; font-size: 14px; max-width: 150px; text-align: center; opacity: .76; }
.footer-map__pin {
  position: absolute;
  top: 42%;
  right: 23%;
  width: 52px;
  height: 52px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #f12327;
  box-shadow: 0 16px 34px rgba(241,35,39,.34);
}
.footer-map__pin::before {
  content: "";
  position: absolute;
  inset: 13px;
  border-radius: 50%;
  background: #fff;
}
.footer-map__card {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  align-items: start;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(10,10,15,.86), rgba(10,10,15,.94));
  box-shadow: none;
  backdrop-filter: blur(10px);
}
.footer-map__card .material-symbols-rounded {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(241,35,39,.12);
  color: #f12327;
  font-size: 26px;
}
.footer-map__address {
  margin: 0;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 700;
}
.footer-map__hours {
  margin: 8px 0 0;
  color: #b9bcc4;
  font-size: 14px;
  line-height: 1.55;
}
.site-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  gap: 16px 24px;
  padding-top: 20px;
  color: #c1c4cb;
}
.site-footer__copyright {
  color: #b8bbc2;
  font-size: 14px;
  line-height: 1.5;
}
.site-footer__payments {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.site-footer__payment-badge {
  min-width: 60px;
  height: 36px;
  padding: 0 13px;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
}
.site-footer__legal a {
  color: #c1c4cb;
  text-decoration: none;
  font-size: 14px;
}
.site-footer__legal a:hover { color: #fff; }
.site-footer__to-top {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(241,35,39,.5);
  background: rgba(255,255,255,.03);
  display: grid;
  place-items: center;
  color: #fff;
  text-decoration: none;
  transition: transform .22s ease, border-color .22s ease, color .22s ease, background .22s ease;
}
.site-footer__to-top:hover {
  transform: translateY(-2px);
  border-color: #f12327;
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.site-footer__to-top .material-symbols-rounded { font-size: 24px; }
@media (max-width: 1320px) {
  .site-footer__main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .site-footer__map-wrap { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .site-footer__nav {
    flex-direction: column;
    align-items: flex-start;
  }
  .footer-nav { justify-content: flex-start; }
  .site-footer__main {
    grid-template-columns: 1fr;
  }
  .site-footer__bottom {
    grid-template-columns: 1fr;
    justify-items: start;
  }
  .site-footer__legal { justify-content: flex-start; }
}
@media (max-width: 820px) {
  .site-footer__inner {
    width: min(100%, calc(100% - 24px)) !important;
    padding: 24px 20px 22px !important;
    border-radius: 24px 24px 0 0;
  }
  .site-footer__inner::before { left: 20px; right: 20px; }
  .site-footer__intro,
  .site-footer__contact,
  .site-footer__map-wrap { padding: 20px; border-radius: 22px; }
  .footer-map { min-height: 360px; }
  .footer-map__label--city { font-size: 40px; }
}
@media (max-width: 640px) {
  .site-footer { background: linear-gradient(180deg, rgba(255,255,255,0) 0 14px, #050505 14px 100%) !important; }
  .site-footer::before { inset: 14px 0 0; }
  .site-footer__inner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 16px calc(20px + var(--jp-safe-bottom)) !important;
    border-radius: 22px 22px 0 0;
  }
  .site-footer__inner::before { left: 16px; right: 16px; }
  .site-footer__nav { padding-bottom: 18px; }
  .footer-nav { gap: 8px 12px; }
  .footer-nav a { font-size: 13px; }
  .site-footer__main { padding: 20px 0 22px; gap: 16px; }
  .site-footer__lead { font-size: 16px; }
  .site-footer__section-title { font-size: 24px; }
  .footer-contact-item,
  .footer-feature { grid-template-columns: 36px 1fr; gap: 12px; }
  .footer-contact-item__icon,
  .footer-feature__icon { width: 36px; height: 36px; border-radius: 12px; }
  .footer-map { min-height: 320px; border-radius: 18px; }
  .footer-map__label--city { top: 15%; font-size: 31px; }
  .footer-map__label--old,
  .footer-map__label--park,
  .footer-map__label--zam { font-size: 12px; }
  .footer-map__pin { width: 44px; height: 44px; right: 18%; }
  .footer-map__pin::before { inset: 11px; }
  .footer-map__card {
    left: 14px;
    right: 14px;
    bottom: 14px;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 15px;
  }
  .footer-map__card .material-symbols-rounded {
    width: 42px;
    height: 42px;
    font-size: 22px;
  }
  .footer-map__address { font-size: 15px; }
  .footer-map__hours { font-size: 13px; }
  .site-footer__payments,
  .site-footer__legal { gap: 10px 12px; }
  .site-footer__payment-badge { min-width: 56px; height: 32px; font-size: 13px; }
  .site-footer__to-top { width: 48px; height: 48px; }
}


    /* v128 — product weld proof: three-view composition without repeating copy */
    .detail-card__media--weld {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 2px;
      background: #080808;
    }
    .detail-card__media--weld .weld-view {
      position: relative;
      min-width: 0;
      overflow: hidden;
      background: #0b0b0c;
    }
    .detail-card__media--weld .weld-view img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.18);
      filter: contrast(1.04);
    }
    .detail-card__media--weld .weld-view--right img { transform: scaleX(-1) scale(1.18); }
    .detail-card__media--weld .weld-view--bottom img { transform: rotate(90deg) scale(1.18); }
    .detail-card__media--weld .weld-view span {
      position: absolute;
      left: 8px;
      bottom: 8px;
      z-index: 2;
      padding: 5px 7px;
      border: 1px solid rgba(255,255,255,.16);
      border-radius: 999px;
      color: rgba(255,255,255,.86);
      background: rgba(5,5,6,.72);
      backdrop-filter: blur(8px);
      font-size: 9px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: .02em;
      white-space: nowrap;
    }
    @media (max-width: 640px) {
      .detail-card__media--weld .weld-view span { left: 5px; bottom: 5px; padding: 4px 5px; font-size: 8px; }
    }


/* ---- consolidated source block ---- */

/* v31 — cinematic interactive smoke */
#hero .product-scene { pointer-events:none; }
#hero .product-scene img {
  width:100%; height:100%; object-fit:contain; object-position:70% center;
}
#hero .hero-fog-base { display:none !important; }
#hero .hero-fog-canvas {
  position:absolute;
  z-index:3;
  left:10%; right:-2%; bottom:-2%;
  width:92%; height:62%;
  pointer-events:none;
  opacity:.88;
  mix-blend-mode:screen;
  filter:blur(.35px);
}
@media (max-width:780px){
  #hero .product-scene img{object-fit:cover;object-position:72% center;}
  #hero .hero-fog-canvas{left:0;right:0;width:100%;height:54%;opacity:.78;}
}
@media (prefers-reduced-motion:reduce){#hero .hero-fog-canvas{display:none!important;}}

/* v33 — mouse-scrubbed camera orbit */
#hero .hero-scrub-poster,
#hero .hero-scrub-canvas {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center center;
}
#hero .hero-scrub-poster { z-index:0; opacity:1; transition:opacity .35s ease; }
#hero .hero-scrub-canvas {
  z-index:1; display:block; opacity:0; transition:opacity .28s ease;
  pointer-events:none; background:#050505;
}
#hero.is-scrub-ready .hero-scrub-canvas { opacity:1; }
#hero.is-scrub-ready .hero-scrub-poster { opacity:0; }
@media (max-width:780px), (hover:none), (pointer:coarse){
  #hero .hero-scrub-canvas{display:none !important;}
  #hero .hero-scrub-poster{opacity:1 !important; object-fit:cover; object-position:72% center;}
}


/* ---- consolidated source block ---- */

    /* Block 05 — product details / close-up bento */
    #product-details.product-details {
      position: relative;
      overflow: hidden;
      padding: 50px 24px 56px;
      color: #111214;
      background:
        radial-gradient(circle at 13% 10%, rgba(237,33,36,.055), transparent 27%),
        radial-gradient(circle at 86% 16%, rgba(0,0,0,.028), transparent 25%),
        linear-gradient(180deg, #f8f8f6 0%, #ffffff 42%, #f6f6f4 100%);
    }
    #product-details.product-details::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image: linear-gradient(rgba(0,0,0,.022) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.018) 1px, transparent 1px);
      background-size: 48px 48px;
      opacity: .22;
      mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 82%, transparent 100%);
    }
    #product-details .product-details__inner {
      position: relative;
      z-index: 1;
      width: min(1180px, 100%);
      margin: 0 auto;
    }
    #product-details .product-details__stage {
      display: grid;
      grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
      grid-template-rows: auto 1fr;
      gap: 18px 22px;
      align-items: stretch;
    }
    #product-details .product-details__copy {
      grid-column: 1;
      grid-row: 1;
      align-self: start;
      max-width: 520px;
      padding-top: 2px;
    }
    #product-details .product-details__eyebrow {
      margin: 0 0 11px;
      color: var(--brand-red);
      font-size: 10px;
      font-weight: 800;
      line-height: 1.2;
      letter-spacing: .14em;
      text-transform: uppercase;
    }
    #product-details .product-details__title {
      margin: 0;
      max-width: 540px;
      color: #111214;
      font-family: var(--font-display);
      font-size: clamp(34px, 3.25vw, 48px);
      line-height: 1;
      letter-spacing: -1.5px;
    }
    #product-details .product-details__title span {
      display: block;
      margin-top: 3px;
      color: var(--brand-red);
    }
    #product-details .product-details__lead {
      max-width: 520px;
      margin: 14px 0 0;
      color: #66686d;
      font-size: 14px;
      line-height: 1.5;
    }
    #product-details .product-details__proofs {
      display: flex;
      flex-wrap: wrap;
      gap: 7px 8px;
      margin-top: 18px;
      max-width: 560px;
    }
    #product-details .product-details__proofs span {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-height: 30px;
      padding: 6px 10px;
      border: 1px solid rgba(17,18,20,.10);
      border-radius: 999px;
      background: rgba(255,255,255,.72);
      color: #34363a;
      font-size: 10px;
      font-weight: 700;
      line-height: 1.2;
      box-shadow: 0 5px 16px rgba(17,18,20,.035);
      backdrop-filter: blur(8px);
    }
    #product-details .product-details__proofs i {
      width: 6px;
      height: 6px;
      flex: 0 0 6px;
      border-radius: 50%;
      background: var(--brand-red);
      box-shadow: 0 0 0 3px rgba(237,33,36,.09);
    }
    #product-details .product-details__main {
      grid-column: 1;
      grid-row: 2;
      min-height: 300px;
    }
    #product-details .product-details__side {
      grid-column: 2;
      grid-row: 1 / span 2;
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      grid-template-rows: repeat(2, minmax(0,1fr));
      gap: 12px;
      min-height: 460px;
    }
    #product-details .detail-card {
      position: relative;
      overflow: hidden;
      min-width: 0;
      border: 1px solid rgba(17,18,20,.12);
      border-radius: 18px;
      background: linear-gradient(180deg, #17181b 0%, #0c0d0f 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 12px 30px rgba(20,20,20,.10);
      isolation: isolate;
    }
    #product-details .detail-card::before {
      content: "";
      position: absolute;
      inset: -1px;
      z-index: 2;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(255,255,255,.015) 0%, rgba(0,0,0,0) 42%, rgba(0,0,0,.72) 76%, rgba(0,0,0,.96) 100%);
    }
    #product-details .detail-card::after {
      content: "";
      position: absolute;
      top: -28%;
      left: -10%;
      width: 62%;
      height: 54%;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,255,255,.10), rgba(255,255,255,0) 68%);
      filter: blur(12px);
      opacity: .65;
      pointer-events: none;
      z-index: 2;
    }
    #product-details .detail-card__media {
      position: absolute;
      inset: 0;
      z-index: 1;
    }
    #product-details .detail-card__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .65s cubic-bezier(.16,1,.3,1), filter .65s ease;
    }
    #product-details .detail-card:hover .detail-card__media img {
      transform: scale(1.035);
      filter: brightness(1.04) contrast(1.02);
    }
    #product-details .detail-card__copy {
      position: absolute;
      z-index: 4;
      left: 18px;
      right: 18px;
      bottom: 16px;
    }
    #product-details .detail-card__title {
      margin: 0;
      color: #fff;
      font-size: 19px;
      font-weight: 700;
      line-height: 1.05;
      letter-spacing: -.3px;
    }
    #product-details .detail-card__text {
      margin: 6px 0 0;
      color: #a9abb0;
      font-size: 11px;
      line-height: 1.45;
    }
    #product-details .detail-card__kicker {
      display: inline-block;
      margin-bottom: 8px;
      color: #ff4245;
      font-size: 9px;
      font-weight: 800;
      line-height: 1.2;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    #product-details .detail-card__badge {
      display: inline-flex;
      align-items: center;
      margin-top: 12px;
      min-height: 28px;
      padding: 6px 10px;
      border: 1px solid rgba(255,65,68,.38);
      border-radius: 999px;
      background: rgba(237,33,36,.12);
      color: #fff;
      font-size: 10px;
      font-weight: 700;
      line-height: 1.2;
    }
    #product-details .product-details__main .detail-card__copy {
      left: 20px;
      right: 20px;
      bottom: 18px;
    }
    #product-details .product-details__main .detail-card__title {
      font-size: 22px;
    }
    #product-details .product-details__main .detail-card__text {
      max-width: 360px;
      font-size: 12px;
    }
    #product-details .detail-card--zip .detail-card__media img { object-position: 50% 32%; }
    #product-details .detail-card--seam .detail-card__media img { object-position: 50% 72%; }
    #product-details .detail-card--seam .detail-card__copy { right: auto; width: 46%; max-width: 210px; }
    #product-details .detail-card--seam .detail-card__text { max-width: 200px; }
    #product-details .detail-card--transparent .detail-card__media img { object-position: 50% 34%; }
    #product-details .detail-card--fill .detail-card__media img { object-position: 50% 28%; }
    #product-details .detail-card--packing .detail-card__media img { object-position: 50% 30%; }

    @media (max-width: 1100px) {
      #product-details.product-details { padding: 54px 20px 60px; }
      #product-details .product-details__stage { grid-template-columns: 1fr; grid-template-rows: auto; }
      #product-details .product-details__copy,
      #product-details .product-details__main,
      #product-details .product-details__side { grid-column: 1; grid-row: auto; }
      #product-details .product-details__copy { max-width: 760px; }
      #product-details .product-details__side { min-height: 520px; }
      #product-details .product-details__main { min-height: 350px; }
    }
    @media (max-width: 680px) {
      #product-details.product-details { padding: 42px 14px 48px; }
      #product-details .product-details__stage { gap: 16px; }
      #product-details .product-details__eyebrow { margin-bottom: 10px; font-size: 9px; }
      #product-details .product-details__title { font-size: clamp(30px, 9vw, 40px); line-height: 1.02; letter-spacing: -1.1px; }
      #product-details .product-details__lead { margin-top: 12px; font-size: 13px; }
      #product-details .product-details__proofs { margin-top: 14px; gap: 6px; }
      #product-details .product-details__proofs span { min-height: 28px; padding: 6px 9px; font-size: 9px; }
      #product-details .product-details__main { min-height: 320px; border-radius: 16px; }
      #product-details .product-details__side { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; gap: 12px; }
      #product-details .product-details__side .detail-card { min-height: 250px; border-radius: 16px; }
      #product-details .detail-card__copy,
      #product-details .product-details__main .detail-card__copy { left: 16px; right: 16px; bottom: 15px; }
      #product-details .detail-card__title,
      #product-details .product-details__main .detail-card__title { font-size: 19px; }
      #product-details .detail-card__text,
      #product-details .product-details__main .detail-card__text { font-size: 11px; }
    }



/* ---- consolidated source block ---- */

/* v41 — compact test-batch CTA + order process */
#test-batch.test-batch,
#order-process.order-process {
  background: #f7f7f5;
  color: #111214;
}
#test-batch.test-batch {
  padding: 52px 24px 26px;
}
#test-batch .test-batch__inner,
#order-process .order-process__inner {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}
#test-batch .test-batch__card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 42px;
  align-items: center;
  min-height: 230px;
  padding: 34px 40px;
  background: #fff;
  border: 1px solid #deded9;
  border-radius: 22px;
  box-shadow: 0 14px 42px rgba(18, 18, 18, .035);
}
#test-batch .test-batch__card::after {
  content: '';
  position: absolute;
  width: 240px;
  height: 240px;
  right: -90px;
  top: -120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(241,35,39,.10) 0%, rgba(241,35,39,0) 70%);
  pointer-events: none;
}
#test-batch .test-batch__copy { max-width: 760px; position: relative; z-index: 1; }
#test-batch .test-batch__eyebrow,
#order-process .order-process__eyebrow {
  margin: 0 0 14px;
  color: #f12327;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
#test-batch .test-batch__title,
#order-process .order-process__title {
  margin: 0;
  font-size: clamp(34px, 4vw, 50px);
  line-height: .98;
  letter-spacing: -.045em;
  font-weight: 800;
}
#test-batch .test-batch__title span,
#order-process .order-process__title span { color: #f12327; }
#test-batch .test-batch__lead {
  max-width: 760px;
  margin: 15px 0 0;
  color: #77797e;
  font-size: 15px;
  line-height: 1.6;
}
#test-batch .test-batch__action-wrap {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 11px;
  min-width: 280px;
}
#test-batch .test-batch__hint {
  color: #919397;
  font-size: 11px;
  line-height: 1.3;
}
#test-batch .test-batch__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  min-height: 52px;
  padding: 0 24px;
  color: #fff;
  background: #f12327;
  border: 1px solid #f12327;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}
#test-batch .test-batch__button:hover {
  transform: translateY(-2px);
  background: #db151a;
  box-shadow: 0 12px 25px rgba(241,35,39,.18);
}
#test-batch .test-batch__button .material-symbols-rounded { font-size: 19px; }

#order-process.order-process {
  padding: 48px 24px 74px;
}
#order-process .order-process__inner {
  padding-top: 44px;
  border-top: 1px solid #e1e1dc;
}
#order-process .order-process__header {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(320px, .55fr);
  gap: 60px;
  align-items: end;
  margin-bottom: 42px;
}
#order-process .order-process__eyebrow { grid-column: 1 / -1; margin-bottom: -42px; }
#order-process .order-process__lead {
  margin: 0 0 4px;
  color: #77797e;
  font-size: 14px;
  line-height: 1.6;
  max-width: 470px;
}
#order-process .order-process__timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 26px;
}
#order-process .order-process__timeline::before {
  content: '';
  position: absolute;
  left: 25px;
  right: 25px;
  top: 26px;
  height: 1px;
  background: linear-gradient(90deg, #f12327 0%, #f12327 18%, #d7d7d2 18%, #d7d7d2 100%);
}
#order-process .order-process__step {
  position: relative;
  z-index: 1;
  min-width: 0;
}
#order-process .order-process__marker {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 18px;
  border: 1.5px solid #f12327;
  border-radius: 50%;
  background: #f7f7f5;
  box-shadow: 0 0 0 7px #f7f7f5;
}
#order-process .order-process__marker span {
  color: #111214;
  font-size: 14px;
  line-height: 1;
  font-weight: 800;
}
#order-process .order-process__step h3 {
  margin: 0 0 8px;
  color: #111214;
  font-size: 17px;
  line-height: 1.15;
  font-weight: 800;
}
#order-process .order-process__step p {
  margin: 0;
  max-width: 190px;
  color: #85878c;
  font-size: 12px;
  line-height: 1.55;
}
@media (max-width: 900px) {
  #test-batch .test-batch__card { grid-template-columns: 1fr; gap: 26px; }
  #test-batch .test-batch__action-wrap { min-width: 0; align-items: flex-start; }
  #order-process .order-process__header { grid-template-columns: 1fr; gap: 18px; }
  #order-process .order-process__eyebrow { grid-column: auto; margin-bottom: -2px; }
  #order-process .order-process__timeline { grid-template-columns: repeat(3, 1fr); row-gap: 34px; }
  #order-process .order-process__timeline::before { display: none; }
}
@media (max-width: 620px) {
  #test-batch.test-batch { padding: 34px 14px 18px; }
  #order-process.order-process { padding: 34px 14px 52px; }
  #test-batch .test-batch__inner,
  #order-process .order-process__inner { width: 100%; }
  #test-batch .test-batch__card { min-height: 0; padding: 26px 22px; border-radius: 18px; }
  #test-batch .test-batch__title,
  #order-process .order-process__title { font-size: clamp(31px, 10vw, 39px); }
  #test-batch .test-batch__lead { font-size: 13px; }
  #test-batch .test-batch__button { width: 100%; padding: 0 18px; }
  #order-process .order-process__inner { padding-top: 34px; }
  #order-process .order-process__header { margin-bottom: 30px; }
  #order-process .order-process__timeline { grid-template-columns: 1fr; gap: 0; }
  #order-process .order-process__step {
    display: grid;
    grid-template-columns: 52px 1fr;
    column-gap: 18px;
    padding-bottom: 28px;
  }
  #order-process .order-process__step:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 25px;
    top: 52px;
    bottom: 0;
    width: 1px;
    background: #deded9;
  }
  #order-process .order-process__marker { grid-row: 1 / 3; margin-bottom: 0; }
  #order-process .order-process__step h3 { margin-top: 3px; }
  #order-process .order-process__step p { max-width: 100%; }
}


/* ---- consolidated source block ---- */

/* v42 — final conversion form + footer */
#final-request.final-request {
  background: #f7f7f5;
  padding: 28px 24px 72px;
  color: #fff;
}
#final-request .final-request__inner {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}
#final-request .final-request__card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr);
  gap: 54px;
  align-items: center;
  min-height: 390px;
  padding: 48px 50px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 83% -6%, rgba(255,255,255,.13) 0 16%, transparent 16.3%),
    radial-gradient(circle at 102% 103%, rgba(255,255,255,.09) 0 29%, transparent 29.3%),
    #f12327;
  box-shadow: 0 24px 60px rgba(241,35,39,.16);
}
#final-request .final-request__card::after {
  content: '';
  position: absolute;
  right: 28%;
  top: -25%;
  width: 180px;
  height: 150%;
  transform: rotate(-15deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
  pointer-events: none;
}
#final-request .final-request__copy,
#final-request .final-request__form { position: relative; z-index: 1; }
#final-request .final-request__eyebrow {
  margin: 0 0 15px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
}
#final-request .final-request__title {
  margin: 0;
  max-width: 520px;
  font-size: clamp(42px, 4.5vw, 62px);
  line-height: .94;
  letter-spacing: -.052em;
  font-weight: 800;
}
#final-request .final-request__lead {
  max-width: 500px;
  margin: 20px 0 0;
  color: rgba(255,255,255,.82);
  font-size: 15px;
  line-height: 1.58;
}
#final-request .final-request__quick {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 26px;
}
#final-request .final-request__quick a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 15px;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 9px;
  color: #fff;
  background: rgba(255,255,255,.08);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
}
#final-request .final-request__quick a:hover { background: rgba(255,255,255,.17); transform: translateY(-1px); }
#final-request .final-request__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
#final-request .final-field { min-width: 0; }
#final-request .final-field--wide { grid-column: 1 / -1; }
#final-request .final-field input,
#final-request .final-field textarea {
  width: 100%;
  border: 1px solid rgba(17,18,20,.10);
  outline: none;
  color: #161719;
  background: rgba(255,255,255,.97);
  font: inherit;
  font-size: 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
#final-request .final-field input {
  height: 56px;
  padding: 0 16px;
  border-radius: 10px;
}
#final-request .final-field textarea {
  min-height: 104px;
  resize: vertical;
  padding: 15px 16px;
  border-radius: 10px;
  line-height: 1.45;
}
#final-request .final-field input::placeholder,
#final-request .final-field textarea::placeholder { color: #8a8c90; }
#final-request .final-field input:focus,
#final-request .final-field textarea:focus {
  border-color: #111214;
  box-shadow: 0 0 0 3px rgba(17,18,20,.08);
}
#final-request .final-request__submit {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 57px;
  border: 0;
  border-radius: 10px;
  background: #111214;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease;
}
#final-request .final-request__submit:hover { transform: translateY(-1px); background: #050505; }
#final-request .final-request__submit:disabled { cursor: wait; opacity: .78; transform: none; }
#final-request .final-request__submit.is-success { background: #187f49; }
#final-request .final-request__note {
  grid-column: 1 / -1;
  margin: 0;
  color: rgba(255,255,255,.66);
  font-size: 10px;
  line-height: 1.45;
  text-align: center;
}

.site-footer {
  background: #101011;
  color: #fff;
  border-top: 1px solid #242427;
}
.site-footer__inner {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  padding: 50px 0 28px;
}
.site-footer__top {
  display: grid;
  grid-template-columns: 1.18fr .95fr .8fr .95fr;
  gap: 48px;
  padding-bottom: 40px;
}
.footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #fff;
  font-size: 27px;
  font-weight: 800;
  letter-spacing: -.04em;
  text-decoration: none;
}
.footer-brand__mark {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 7px solid #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px #101011;
  position: relative;
}
.footer-brand__mark::after {
  content: '';
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f12327;
}
.site-footer__tagline {
  max-width: 285px;
  margin: 16px 0 0;
  color: #8f9196;
  font-size: 12px;
  line-height: 1.55;
}
.site-footer__title {
  margin: 3px 0 17px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.site-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.site-footer__list li,
.site-footer__list a,
.site-footer__text {
  color: #b2b4b8;
  font-size: 12px;
  line-height: 1.5;
  text-decoration: none;
}
.site-footer__list a:hover { color: #f12327; }
.site-footer__phones a { display: block; margin-bottom: 5px; color: #fff; font-weight: 700; }
.site-footer__socials { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.site-footer__socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #323235;
  border-radius: 8px;
  color: #d8d8da;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .2s ease, color .2s ease;
}
.site-footer__socials a:hover { border-color: #f12327; color: #f12327; }
.site-footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding-top: 24px;
  border-top: 1px solid #28282b;
  color: #707277;
  font-size: 10px;
  line-height: 1.5;
}
.site-footer__bottom a { color: #909298; text-decoration: none; }
.site-footer__bottom a:hover { color: #fff; }
.site-footer__legal { display: flex; flex-wrap: wrap; gap: 18px; justify-content: flex-end; }

@media (max-width: 980px) {
  #final-request .final-request__card { grid-template-columns: 1fr; gap: 32px; }
  #final-request .final-request__lead { max-width: 650px; }
  .site-footer__top { grid-template-columns: repeat(2, 1fr); gap: 34px 50px; }
}
@media (max-width: 620px) {
  #final-request.final-request { padding: 18px 14px 44px; }
  #final-request .final-request__inner,
  .site-footer__inner { width: 100%; }
  #final-request .final-request__card { padding: 29px 22px; border-radius: 20px; }
  #final-request .final-request__title { font-size: clamp(38px, 12vw, 48px); }
  #final-request .final-request__lead { margin-top: 15px; font-size: 13px; }
  #final-request .final-request__form { grid-template-columns: 1fr; }
  #final-request .final-field--wide,
  #final-request .final-request__submit,
  #final-request .final-request__note { grid-column: auto; }
  .site-footer__inner { padding: 38px 18px 22px; }
  .site-footer__top { grid-template-columns: 1fr; gap: 30px; }
  .site-footer__bottom { flex-direction: column; gap: 14px; }
  .site-footer__legal { justify-content: flex-start; gap: 10px 16px; }
}


/* ---- consolidated source block ---- */

/* v43 — unified desktop content spine for post-catalog sections */
:root {
  --jp-content-max: 1570px;
  --jp-content-gutter: clamp(24px, 5.8vw, 104px);
}

/* Close-up showcase: same spine as Benefits + Catalog */
#product-details.product-details {
  padding-left: var(--jp-content-gutter);
  padding-right: var(--jp-content-gutter);
}
#product-details .product-details__inner {
  width: 100%;
  max-width: var(--jp-content-max);
  margin-left: auto;
  margin-right: auto;
}

/* Test batch + process */
#test-batch.test-batch,
#order-process.order-process {
  padding-left: var(--jp-content-gutter);
  padding-right: var(--jp-content-gutter);
}
#test-batch .test-batch__inner,
#order-process .order-process__inner {
  width: 100%;
  max-width: var(--jp-content-max);
  margin-left: auto;
  margin-right: auto;
}

/* Final conversion block */
#final-request.final-request {
  padding-left: var(--jp-content-gutter);
  padding-right: var(--jp-content-gutter);
}
#final-request .final-request__inner {
  width: 100%;
  max-width: var(--jp-content-max);
  margin-left: auto;
  margin-right: auto;
}

/* Footer follows exactly the same left/right spine */
.site-footer {
  padding-left: var(--jp-content-gutter);
  padding-right: var(--jp-content-gutter);
}
.site-footer__inner {
  width: 100%;
  max-width: var(--jp-content-max);
  margin-left: auto;
  margin-right: auto;
}

/* Let wider sections actually use the added space, rather than keeping narrow inner columns. */
@media (min-width: 1181px) {
  #product-details .product-details__stage {
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    gap: 18px 28px;
  }
  #product-details .product-details__copy,
  #product-details .product-details__title,
  #product-details .product-details__lead {
    max-width: 590px;
  }
  #product-details .product-details__side { min-height: 460px; }

  #test-batch .test-batch__card {
    grid-template-columns: minmax(0, 1fr) minmax(300px, auto);
    padding-left: 46px;
    padding-right: 46px;
  }
  #test-batch .test-batch__copy,
  #test-batch .test-batch__lead { max-width: 900px; }

  #order-process .order-process__timeline { gap: clamp(30px, 3vw, 54px); }
  #order-process .order-process__step p { max-width: 220px; }

  #final-request .final-request__card {
    grid-template-columns: minmax(0, .95fr) minmax(500px, 1.05fr);
    gap: clamp(54px, 5vw, 86px);
    padding-left: 58px;
    padding-right: 58px;
  }
  #final-request .final-request__title { max-width: 600px; }
  #final-request .final-request__lead { max-width: 570px; }

  .site-footer__top {
    grid-template-columns: 1.28fr 1fr .9fr 1fr;
    gap: clamp(48px, 5vw, 82px);
  }
}

/* Keep existing mobile rhythm intact. */
@media (max-width: 620px) {
  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request {
    padding-left: 14px;
    padding-right: 14px;
  }
  .site-footer {
    padding-left: 0;
    padding-right: 0;
  }
}


/* ---- consolidated source block ---- */

/* v44 — single unified desktop spine across all content sections */
@media (min-width: 1181px) {
  :root {
    --jp-unified-spine-width: 1426px;
    --jp-unified-spine-gutter: 146px;
  }

  #block-02-benefits.benefits-section,
  #catalog.catalog-section,
  #bulk-order.bulk-order,
  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request,
  .site-footer {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #block-02-benefits .benefits-section__inner,
  #catalog .catalog-section__inner,
  #bulk-order .bulk-order__inner,
  #product-details .product-details__inner,
  #test-batch .test-batch__inner,
  #order-process .order-process__inner,
  #final-request .final-request__inner,
  .site-footer__inner {
    width: min(calc(100% - var(--jp-unified-spine-gutter)), var(--jp-unified-spine-width)) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* ---- consolidated source block ---- */

/* v46 — sticky hero + next-screen overlap transition */
@media (min-width: 781px) and (prefers-reduced-motion: no-preference) {
  main {
    position: relative;
    isolation: isolate;
  }

  #hero.hero {
    position: sticky;
    top: 0;
    z-index: 1;
    will-change: transform;
  }

  #block-02-benefits.benefits-section {
    position: relative;
    z-index: 4;
    border-radius: 26px 26px 0 0;
    box-shadow: 0 -28px 70px rgba(0,0,0,.24);
    transform: translateZ(0);
  }

  #hero .hero__content {
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translate3d(0, var(--hero-overlap-copy-y, 0px), 0);
    opacity: var(--hero-overlap-copy-opacity, 1);
  }

  #hero .hero__shade {
    opacity: var(--hero-overlap-shade-opacity, 1);
    transition: opacity .08s linear;
  }
}

@media (max-width: 780px), (prefers-reduced-motion: reduce) {
  #hero.hero {
    position: relative;
    top: auto;
  }
  #block-02-benefits.benefits-section {
    border-radius: 0;
    box-shadow: none;
  }
  #hero .hero__content {
    transform: none !important;
    opacity: 1 !important;
    will-change: auto;
  }
}


/* ---- consolidated source block ---- */

/* v47 — bound the sticky overlap to Hero + Benefits only */
@media (min-width: 781px) and (prefers-reduced-motion: no-preference) {
  .hero-overlap-stage {
    position: relative;
    isolation: isolate;
  }

  .hero-overlap-stage > #hero.hero {
    position: sticky;
    top: 0;
    z-index: 1;
  }

  .hero-overlap-stage > #block-02-benefits.benefits-section {
    position: relative;
    z-index: 4;
  }

  /* Sections after Benefits return to the normal document flow and stacking. */
  #catalog.catalog-section,
  #bulk-order.bulk-order,
  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request,
  .site-footer {
    position: relative;
    z-index: 0;
  }
}

@media (max-width: 780px), (prefers-reduced-motion: reduce) {
  .hero-overlap-stage {
    position: static;
    isolation: auto;
  }
}


/* ---- consolidated source block ---- */

/* v48 — navigation mapped to the actual landing sections */
@media (min-width: 781px) {
  .nav-list {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .nav-list a {
    padding-inline: 5px;
  }
}

#hero,
#block-02-benefits,
#catalog,
#bulk-order,
#product-details,
#order-process,
#footer {
  scroll-margin-top: 76px;
}

@media (max-width: 1080px) and (min-width: 781px) {
  .nav-list a {
    font-size: 8.5px;
    letter-spacing: 0;
  }
}


/* ---- consolidated source block ---- */

/* v49 — restrained motion system: reveal, marquee, parallax, tilt, path progress, living CTA */
@keyframes jpFinalMesh {
  0%,100% { background-position: 0% 50%, 100% 50%, 50% 50%; }
  50% { background-position: 100% 46%, 0% 54%, 50% 50%; }
}
@keyframes jpMarquee {
  from { transform: translate3d(0,0,0); }
  to { transform: translate3d(-50%,0,0); }
}

/* Shared scroll reveals — v50 safe progressive enhancement.
   Important content is NEVER hidden by CSS. JS may animate it when it approaches the viewport. */
.jp-reveal,
.jp-clip-reveal,
.jp-reveal.jp-visible,
.jp-clip-reveal.jp-visible {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: none;
  transition: none;
  will-change: auto;
}

/* Benefits remain fully visible even if animation JS is blocked or interrupted. */
#block-02-benefits .benefit-card.jp-reveal,
#block-02-benefits .benefit-card.jp-reveal.jp-visible {
  transform: none;
}

/* Principles strip becomes a slow, premium marquee. The shield stays anchored. */
#block-02-benefits .benefits-principles {
  overflow: hidden;
}
#block-02-benefits .jp-marquee__viewport {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
}
#block-02-benefits .jp-marquee__track {
  display: flex;
  align-items: center;
  column-gap: 16px;
  width: max-content;
  animation: jpMarquee 26s linear infinite;
  will-change: transform;
}
#block-02-benefits .jp-marquee__segment {
  flex: none !important;
  width: max-content !important;
  flex-wrap: nowrap !important;
  padding-right: 0;
  white-space: nowrap;
}
#block-02-benefits .benefits-principles:hover .jp-marquee__track { animation-play-state: paused; }

/* Bulk-order visual: subtle mouse depth. */
#bulk-order .bulk-order__visual {
  transform: translate3d(var(--jp-parallax-x,0px), var(--jp-parallax-y,0px), 0);
  transition: transform .16s ease-out;
  will-change: transform;
}
#bulk-order .bulk-order__visual-glow {
  transform: translate3d(var(--jp-glow-x,0px), var(--jp-glow-y,0px), 0) scale(var(--jp-glow-scale,1));
  transition: transform .2s ease-out, opacity .3s ease;
  will-change: transform;
}
#bulk-order .bulk-order__visual img {
  transform: translate3d(var(--jp-image-x,0px), var(--jp-image-y,0px), 0) !important;
  transition: transform .18s ease-out;
  will-change: transform;
}

/* Close-up cards: very small 3D tilt + moving highlight. */
#product-details .detail-card {
  transform: perspective(900px) rotateX(var(--jp-rx,0deg)) rotateY(var(--jp-ry,0deg)) translateZ(0);
  transform-style: preserve-3d;
  transition: transform .32s cubic-bezier(.16,1,.3,1), box-shadow .32s ease;
  will-change: transform;
}
#product-details .detail-card::after {
  top: var(--jp-shine-y, -22%);
  left: var(--jp-shine-x, -8%);
  transition: top .18s ease-out, left .18s ease-out, opacity .25s ease;
}
#product-details .detail-card.jp-tilting {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 20px 42px rgba(20,20,20,.14);
}

/* Process: neutral guide first; red line is drawn with scroll progress. */
#order-process .order-process__timeline::before {
  background: #d7d7d2 !important;
}
#order-process .order-process__timeline::after {
  content: '';
  position: absolute;
  z-index: 0;
  left: 25px;
  right: 25px;
  top: 26px;
  height: 1.5px;
  background: #f12327;
  transform: scaleX(var(--jp-process-progress,0));
  transform-origin: left center;
  transition: transform .08s linear;
  pointer-events: none;
}
#order-process .order-process__marker {
  transition: background .35s ease, border-color .35s ease, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
}
#order-process .order-process__step.jp-active .order-process__marker {
  background: #f12327;
  transform: scale(1.05);
  box-shadow: 0 0 0 7px #f7f7f5, 0 8px 22px rgba(241,35,39,.18);
}
#order-process .order-process__step.jp-active .order-process__marker span { color: #fff; }
#order-process .order-process__step h3,
#order-process .order-process__step p { transition: color .35s ease, opacity .35s ease; }
#order-process .order-process__step:not(.jp-active) p { opacity: .72; }

/* Final CTA: extremely slow red mesh, so the block feels alive without distracting from inputs. */
#final-request .final-request__card {
  background-image:
    radial-gradient(circle at 84% -8%, rgba(255,255,255,.15) 0 16%, transparent 32%),
    radial-gradient(circle at 102% 104%, rgba(122,0,4,.18) 0 22%, transparent 44%),
    linear-gradient(115deg, #ef2025 0%, #f52d31 46%, #e91a20 100%) !important;
  background-size: 150% 150%, 150% 150%, 100% 100%;
  animation: jpFinalMesh 14s ease-in-out infinite;
}

/* A tiny lift on the most important CTAs; no magnetic gimmick. */
.hero__actions .button,
#test-batch .test-batch__button,
#final-request .final-request__submit,
#bulk-order .bulk-order-form__submit {
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}
.hero__actions .button:hover,
#test-batch .test-batch__button:hover,
#final-request .final-request__submit:hover,
#bulk-order .bulk-order-form__submit:hover {
  transform: translateY(-2px);
}

@media (max-width: 780px) {
  #block-02-benefits .jp-marquee__track { animation-duration: 22s; }
  #product-details .detail-card { transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .jp-reveal,
  .jp-clip-reveal {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
    transition: none !important;
  }
  #final-request .final-request__card { animation: none !important; }
  #bulk-order .bulk-order__visual,
  #bulk-order .bulk-order__visual-glow,
  #bulk-order .bulk-order__visual img,
  #product-details .detail-card { transform: none !important; transition: none !important; }
}


/* ---- consolidated source block ---- */

/* v51 — remove the light strip behind the floating desktop navigation */
.site-header {
  background: transparent !important;
}
.header-main {
  box-shadow: none !important;
}
@media (min-width: 741px) {
  .site-header {
    background: transparent !important;
  }
}


/* ---- consolidated source block ---- */

/* v52 — interactive cursor for catalog order actions */
#catalog .catalog-product__action,
#catalog button.catalog-product__action,
#catalog a.catalog-product__action {
  cursor: pointer !important;
}
#catalog .catalog-product__action * {
  cursor: inherit;
}


/* ---- consolidated source block ---- */

/* v53 — dedicated footer information modals. Separate from lead/product popups. */
body.info-modal-open { overflow: hidden; }
.info-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 26px;
  visibility: hidden;
  pointer-events: none;
  transition: visibility 0s linear .28s;
}
.info-modal.is-open {
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}
.info-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7,7,8,.78);
  backdrop-filter: blur(12px);
  opacity: 0;
  transition: opacity .28s ease;
}
.info-modal.is-open .info-modal__backdrop { opacity: 1; }
.info-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(980px, 100%);
  max-height: min(820px, calc(100dvh - 52px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: #151619;
  background: #fbfbfa;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 26px;
  box-shadow: 0 35px 100px rgba(0,0,0,.38);
  opacity: 0;
  transform: translateY(18px) scale(.985);
  transition: opacity .28s ease, transform .34s cubic-bezier(.16,1,.3,1);
}
.info-modal.is-open .info-modal__dialog { opacity: 1; transform: none; }
.info-modal__header {
  position: relative;
  flex: 0 0 auto;
  padding: 32px 74px 24px 34px;
  border-bottom: 1px solid #e7e7e4;
  background:
    radial-gradient(circle at 91% -10%, rgba(241,35,39,.11) 0 21%, transparent 21.4%),
    linear-gradient(180deg,#fff 0%,#fbfbfa 100%);
}
.info-modal__eyebrow {
  margin: 0 0 9px;
  color: #f12327;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.info-modal__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(30px, 4vw, 46px);
  line-height: .98;
  letter-spacing: -.045em;
}
.info-modal__intro {
  max-width: 720px;
  margin: 12px 0 0;
  color: #74767b;
  font-size: 13px;
  line-height: 1.55;
}
.info-modal__close {
  position: absolute;
  top: 22px;
  right: 24px;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid #dededb;
  border-radius: 50%;
  color: #111214;
  background: #fff;
  cursor: pointer;
  transition: transform .22s ease, color .22s ease, background .22s ease, border-color .22s ease;
}
.info-modal__close:hover { transform: rotate(90deg); color: #fff; background: #f12327; border-color: #f12327; }
.info-modal__close .material-symbols-rounded { font-size: 22px; }
.info-modal__scroll {
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 28px 34px 34px;
}
.info-modal__content {
  max-width: 820px;
}
.info-modal__content section + section {
  margin-top: 30px;
  padding-top: 28px;
  border-top: 1px solid #e6e6e2;
}
.info-modal__content h3,
.info-modal__subheading {
  margin: 0 0 12px;
  color: #111214;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -.025em;
}
.info-modal__content h4,
.info-modal__minor-heading {
  margin: 22px 0 9px;
  color: #111214;
  font-size: 15px;
  line-height: 1.3;
}
.info-modal__content p,
.info-modal__content li {
  color: #55585e;
  font-size: 14px;
  line-height: 1.68;
}
.info-modal__content p { margin: 0 0 13px; }
.info-modal__content ul,
.info-modal__content ol { margin: 10px 0 16px; padding-left: 22px; }
.info-modal__content li + li { margin-top: 7px; }
.info-modal__content strong { color: #191a1d; }
.info-modal__content a { color: #e71d21; font-weight: 700; text-underline-offset: 3px; }
.info-modal__notice {
  margin: 22px 0 0 !important;
  padding: 16px 18px;
  color: #35363a !important;
  background: #f1f1ee;
  border-left: 3px solid #f12327;
  border-radius: 0 12px 12px 0;
}
.info-modal__contact-card {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.info-modal__contact-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 15px;
  color: #fff;
  background: #111214;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.info-modal__contact-card a:first-child { background: #f12327; }
.site-footer__list a[data-info-modal-open],
.site-footer__legal a[data-info-modal-open] { cursor: pointer; }
@media (max-width: 680px) {
  .info-modal { padding: 10px; }
  .info-modal__dialog { max-height: calc(100dvh - 20px); border-radius: 19px; }
  .info-modal__header { padding: 25px 62px 19px 21px; }
  .info-modal__close { top: 15px; right: 15px; width: 38px; height: 38px; }
  .info-modal__title { font-size: 31px; }
  .info-modal__scroll { padding: 22px 21px 28px; }
  .info-modal__content h3,
.info-modal__subheading { font-size: 18px; }
  .info-modal__content p,
  .info-modal__content li { font-size: 13px; line-height: 1.62; }
}


/* ---- consolidated source block ---- */

/* v54 — correct anchor landing: use ONE fixed-nav offset, not scroll-padding + scroll-margin together */
html {
  scroll-padding-top: calc(var(--header-nav) + 12px);
}
#hero,
#block-02-benefits,
#catalog,
#bulk-order,
#product-details,
#order-process,
#footer {
  scroll-margin-top: 0 !important;
}


/* ---- consolidated source block ---- */

/* v115 — restore comfortable anchor landing for bulk order block under fixed header */
#bulk-order {
  scroll-margin-top: calc(var(--header-nav) + 18px) !important;
}


/* ---- consolidated source block ---- */

/* v57 — full responsive polish: ultrawide, laptop, tablet, phone, narrow phone, landscape */
:root {
  --jp-fluid-gutter: clamp(14px, 4vw, 72px);
  --jp-safe-left: max(0px, env(safe-area-inset-left));
  --jp-safe-right: max(0px, env(safe-area-inset-right));
  --jp-safe-bottom: max(0px, env(safe-area-inset-bottom));
}
html { overflow-x: hidden; }
body { overflow-x: clip; }
img, video, canvas { max-width: 100%; }
input, textarea, select, button { min-width: 0; }

/* Large desktop / ultrawide: keep the composition intentionally contained. */
@media (min-width: 1600px) {
  .header-main__inner,
  .nav-bar,
  .nav-bar.is-fixed { max-width: 1504px; }
  .hero__inner { max-width: 1426px; }
  #block-02-benefits .benefits-section__inner,
  #catalog .catalog-section__inner,
  #bulk-order .bulk-order__inner,
  #product-details .product-details__inner,
  #test-batch .test-batch__inner,
  #order-process .order-process__inner,
  #final-request .final-request__inner,
  .site-footer__inner { max-width: 1426px !important; }
}

/* Laptop range: reduce density before anything starts touching. */
@media (min-width: 1025px) and (max-width: 1365px) {
  .hero__inner { width: calc(100% - 56px); grid-template-columns: minmax(390px, 42%) 1fr; }
  .hero h1 { font-size: clamp(46px, 4.7vw, 58px); }
  .hero__actions .button { min-width: 205px; }
  .facts { width: min(760px, 72vw); }
  .fact { padding-right: 18px; }
  .fact + .fact { padding-left: 18px; }
  .fact strong { font-size: 14px; }
  .fact span { font-size: 12.5px; }

  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request { padding-left: 34px; padding-right: 34px; }
  .site-footer { padding-left: 34px; padding-right: 34px; }
}

/* Tablet and compact laptop header: switch to the clean mobile navigation early. */
@media (max-width: 1024px) {
  :root { --header-top: 74px; --header-nav: 0px; --header-height: var(--header-top); }
  html { scroll-padding-top: calc(var(--header-top) + 10px); }
  .site-header,
  .site-header.has-fixed-nav {
    position: sticky;
    top: 0;
    z-index: 150;
    padding-bottom: 0 !important;
    background: #fafaf9 !important;
  }
  .header-main {
    height: var(--header-top);
    min-height: var(--header-top);
    background: #fafaf9;
    box-shadow: 0 7px 24px rgba(0,0,0,.08);
  }
  .header-main__inner {
    width: min(calc(100% - 28px), 900px) !important;
    height: var(--header-top);
    min-height: var(--header-top);
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .brand { min-height: 50px; padding: 0; border: 0; }
  .brand img { width: clamp(150px, 20vw, 176px); }
  .info-block, .header-cta { display: none !important; }
  .mobile-actions { display: flex !important; align-items: center; gap: 6px; }
  .icon-button { width: 46px; height: 46px; border-radius: 12px; cursor: pointer; }
  .mobile-phone { display: grid; color: var(--brand-red); text-decoration: none; }
  .menu-toggle { border: 1px solid rgba(237,33,36,.55); background: #fff; }

  .nav-bar,
  .nav-bar.is-fixed {
    display: none !important;
    position: fixed !important;
    z-index: 160;
    top: calc(var(--header-top) - 1px) !important;
    left: max(14px, var(--jp-safe-left)) !important;
    right: max(14px, var(--jp-safe-right)) !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    border: 1px solid #303034;
    border-radius: 0 0 16px 16px;
    transform: none !important;
    animation: none !important;
  }
  .nav-bar.is-open,
  .nav-bar.is-fixed.is-open {
    display: block !important;
    padding: 8px;
    color: #f5f5f4;
    background: rgba(17,17,19,.98) !important;
    box-shadow: 0 20px 40px rgba(0,0,0,.34);
    backdrop-filter: blur(18px);
  }
  .nav-bar.is-open .nav-list,
  .nav-bar.is-fixed.is-open .nav-list {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 4px;
    padding: 0 !important;
  }
  .nav-bar.is-open .nav-list a,
  .nav-bar.is-fixed.is-open .nav-list a {
    min-height: 48px !important;
    height: auto !important;
    justify-content: flex-start;
    padding: 0 14px;
    border-radius: 10px;
    color: #ededec;
    font-size: 11px !important;
  }
  .nav-bar.is-open .nav-list a::after { display: none !important; }
  .nav-bar.is-open .nav-list a.is-active { color: #ff3a3d; background: rgba(237,33,36,.09); }

  /* Do not keep the hero sticky on tablets: avoids awkward tall-screen overlaps. */
  .hero-overlap-stage { position: static !important; isolation: auto !important; }
  .hero-overlap-stage > #hero.hero,
  #hero.hero { position: relative !important; top: auto !important; }
  #block-02-benefits.benefits-section { border-radius: 0 !important; box-shadow: none !important; }
  #hero .hero__content { transform: none !important; opacity: 1 !important; }

  /* Shared section gutters. */
  #block-02-benefits.benefits-section,
  #catalog.catalog-section,
  #bulk-order.bulk-order,
  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request { padding-left: 24px !important; padding-right: 24px !important; }
  .site-footer { padding-left: 24px !important; padding-right: 24px !important; }

  #block-02-benefits .benefits-section__inner,
  #catalog .catalog-section__inner,
  #bulk-order .bulk-order__inner,
  #product-details .product-details__inner,
  #test-batch .test-batch__inner,
  #order-process .order-process__inner,
  #final-request .final-request__inner,
  .site-footer__inner { width: 100% !important; max-width: 900px !important; }

  /* Benefits: one clean column, generous image area. */
  #block-02-benefits .benefits-section__header { grid-template-columns: 1fr !important; gap: 10px !important; }
  #block-02-benefits .benefits-section__intro { max-width: 620px; }

  /* Catalog: no horizontal table scrolling on tablets. */
  #catalog .catalog-table { overflow: visible !important; }
  #catalog .catalog-table__head { display: none !important; }
  #catalog .catalog-product {
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: 64px minmax(150px,1.3fr) minmax(110px,.8fr) minmax(120px,.9fr) minmax(150px,.9fr) !important;
    gap: 12px !important;
    min-height: 82px;
    margin-bottom: 9px;
    padding: 12px 14px;
    border: 1px solid #dededb;
    border-radius: 11px;
    background: #fff;
  }
  #catalog .catalog-product__thumb { width: 52px; height: 64px; }
  #catalog .catalog-product__label { display: block; margin-bottom: 3px; color: #777; font-size: 9px; font-weight: 600; text-transform: uppercase; }
  #catalog .catalog-product__stock { display: none; }
  #catalog .catalog-product__action { min-height: 44px; }

  /* Bulk order becomes a comfortable single-column presentation. */
  #bulk-order .bulk-order__inner { grid-template-columns: 1fr !important; gap: 38px !important; }
  #bulk-order .bulk-order__copy { min-height: 650px; max-width: 820px; }
  #bulk-order .bulk-order-card { width: 100% !important; max-width: 820px; margin: 0 auto; }
  #bulk-order .bulk-order__visual { right: 3%; }

  /* Close-up details: keep compact bento on tablet. */
  #product-details .product-details__stage { grid-template-columns: 1fr !important; }
  #product-details .product-details__copy,
  #product-details .product-details__main,
  #product-details .product-details__side { grid-column: 1 !important; grid-row: auto !important; }
  #product-details .product-details__main { min-height: 330px; }
  #product-details .product-details__side { min-height: 460px; }

  #test-batch .test-batch__card { grid-template-columns: 1fr auto; gap: 26px; padding: 30px; }
  #order-process .order-process__timeline { gap: 22px; }

  #final-request .final-request__card { grid-template-columns: 1fr !important; gap: 30px; padding: 36px; }
  #final-request .final-request__copy { max-width: 720px; }
  .site-footer__top { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 34px 46px; }
}

/* Portrait tablet / large mobile. */
@media (max-width: 900px) {
  .hero {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    display: flex;
    flex-direction: column;
  }
  .hero__inner { display: contents !important; }
  .hero__content { display: contents !important; width: auto !important; padding: 0 !important; }
  .hero h1 {
    order: 1;
    position: relative;
    z-index: 5;
    width: min(calc(100% - 48px), 760px);
    margin: 42px auto 0;
    font-size: clamp(42px, 7.2vw, 58px);
    line-height: 1.08;
  }
  .hero__actions {
    order: 2;
    position: relative;
    z-index: 5;
    width: min(calc(100% - 48px), 760px);
    margin: 28px auto 0;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
  }
  .hero__actions .button,
  .hero__actions .button--outline { width: 100%; min-width: 0; min-height: 52px; padding-inline: 14px; }
  .product-scene {
    order: 3;
    position: relative !important;
    inset: auto !important;
    width: 100%;
    height: clamp(360px, 52vw, 470px);
    margin-top: 22px;
  }
  #hero .hero-scrub-poster { object-fit: cover !important; object-position: 70% center !important; }
  #hero .hero-fog-canvas { left: 0; right: 0; width: 100%; height: 52%; opacity: .72; }
  .hero__shade { display: none !important; }
  .facts {
    order: 4;
    position: relative;
    z-index: 5;
    width: min(calc(100% - 48px), 760px) !important;
    margin: 0 auto 38px !important;
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 0;
  }
  .fact { min-width: 0 !important; padding: 18px 16px 18px 0 !important; }
  .fact + .fact { padding-left: 16px !important; border-left: 1px solid rgba(255,255,255,.34) !important; border-top: 0 !important; }
  .fact strong { font-size: 14px; }
  .fact span { font-size: 12px; }

  #catalog .catalog-hero { grid-template-columns: 1fr !important; grid-template-areas: "copy" "visual" "cta" !important; gap: 18px; }
  #catalog .catalog-price-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px 20px; }
  #catalog .catalog-price-card__button { grid-column: 2; grid-row: 1 / span 2; min-width: 210px; }
  #catalog .catalog-workspace { grid-template-columns: 1fr; padding: 18px; }
  #catalog .catalog-categories { position: static; flex-direction: row; overflow-x: auto; padding: 0 0 14px; border-right: 0; border-bottom: 1px solid #dededb; }
  #catalog .catalog-category { flex: 0 0 auto; width: auto; min-height: 50px; white-space: nowrap; }

  #bulk-order .bulk-order__copy { min-height: 620px; }
  #bulk-order .bulk-order__title { font-size: clamp(38px, 6vw, 48px); }
  #bulk-order .bulk-order__visual { width: 360px; height: 350px; right: 4%; }
  #bulk-order .bulk-order__visual img { width: 360px; }
  #bulk-order .bulk-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }

  #test-batch .test-batch__card { grid-template-columns: 1fr; gap: 20px; }
  #test-batch .test-batch__action-wrap { min-width: 0; align-items: flex-start; }
  #test-batch .test-batch__button { width: 100%; max-width: 360px; }

  #order-process .order-process__timeline { grid-template-columns: 1fr !important; gap: 0 !important; }
  #order-process .order-process__step {
    display: grid;
    grid-template-columns: 54px 1fr;
    column-gap: 18px;
    padding-bottom: 28px;
  }
  #order-process .order-process__step:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 26px;
    top: 52px;
    bottom: 0;
    width: 1px;
    background: #deded9;
  }
  #order-process .order-process__marker { grid-row: 1 / 3; margin-bottom: 0; }
  #order-process .order-process__step p { max-width: 100%; }
}

/* Phone. */
@media (max-width: 700px) {
  :root { --header-top: 68px; }
  html { scroll-padding-top: calc(var(--header-top) + 8px); }
  .header-main__inner { width: calc(100% - 24px) !important; }
  .brand img { width: 158px; }
  .icon-button { width: 44px; height: 44px; }
  .mobile-phone { display: none !important; }
  .nav-bar,
  .nav-bar.is-fixed { top: calc(var(--header-top) - 1px) !important; left: 10px !important; right: 10px !important; }
  .nav-bar.is-open .nav-list,
  .nav-bar.is-fixed.is-open .nav-list { grid-template-columns: 1fr !important; }
  .nav-bar.is-open .nav-list a { min-height: 44px !important; }

  #block-02-benefits.benefits-section,
  #catalog.catalog-section,
  #bulk-order.bulk-order,
  #product-details.product-details,
  #test-batch.test-batch,
  #order-process.order-process,
  #final-request.final-request { padding-left: 14px !important; padding-right: 14px !important; }
  .site-footer { padding-left: 0 !important; padding-right: 0 !important; }

  .hero h1 { width: calc(100% - 32px); margin-top: 30px; font-size: clamp(36px, 11vw, 48px); }
  .hero__actions { width: calc(100% - 32px); grid-template-columns: 1fr; margin-top: 22px; }
  .product-scene { height: clamp(300px, 93vw, 405px); margin-top: 14px; }
  #hero .hero-scrub-poster { object-position: 69% center !important; }
  .facts { width: calc(100% - 32px) !important; grid-template-columns: 1fr !important; margin-bottom: 26px !important; }
  .fact { padding: 17px 0 !important; }
  .fact + .fact { padding-left: 0 !important; border-left: 0 !important; border-top: 1px solid rgba(255,255,255,.35) !important; }
  .fact strong { font-size: 15px; }
  .fact span { margin-top: 6px; font-size: 13px; }

  #block-02-benefits.benefits-section { padding-top: 44px !important; }
  #block-02-benefits .benefits-section__title { font-size: clamp(30px, 9vw, 39px); }
  #block-02-benefits .benefits-section__intro { font-size: 14px; }
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto 200px !important;
    grid-template-areas: "number" "title" "text" "visual" !important;
    min-height: 0 !important;
    padding: 20px 17px 0 !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 200px !important;
    margin-top: 10px !important;
  }
  #block-02-benefits .benefits-principles { gap: 12px; padding: 13px 0; overflow: hidden; }
  #block-02-benefits .benefits-principles__text { flex-wrap: nowrap; min-width: max-content; font-size: 14px; }

  #catalog.catalog-section { padding-top: 42px !important; padding-bottom: 28px !important; }
  #catalog .catalog-hero__title { font-size: clamp(32px, 9.5vw, 42px); }
  #catalog .catalog-hero__lead { font-size: 14px; }
  #catalog .catalog-hero__visual { height: 145px; }
  #catalog .catalog-price-card { display: block; padding: 18px; }
  #catalog .catalog-price-card__button { width: 100%; min-width: 0; }
  #catalog .catalog-workspace { padding: 12px; border-radius: 12px; }
  #catalog .catalog-categories { margin-inline: -12px; padding-inline: 12px; }
  #catalog .catalog-search input { height: 52px; font-size: 14px; }
  #catalog .catalog-product {
    grid-template-columns: 58px 1fr 1fr !important;
    grid-template-rows: auto auto auto auto !important;
    gap: 10px 12px !important;
    padding: 14px !important;
  }
  #catalog .catalog-product__thumb { grid-column: 1; grid-row: 1 / span 2; width: 54px; height: 68px; }
  #catalog .catalog-product__size { grid-column: 2 / 4; grid-row: 1; }
  #catalog .catalog-product__stock { display: none !important; }
  #catalog .catalog-product__unit { grid-column: 2; grid-row: 2; }
  #catalog .catalog-product__pack { grid-column: 3; grid-row: 2; }
  #catalog .catalog-product__action { grid-column: 1 / 4 !important; grid-row: 3; min-height: 46px; }
  #catalog .catalog-product__purpose { max-width: none; }
  #catalog .catalog-trust { gap: 12px; }
  #catalog .catalog-trust__text { font-size: 13px; }

  #bulk-order.bulk-order { padding-top: 52px !important; padding-bottom: 58px !important; }
  #bulk-order .bulk-order__copy { min-height: auto !important; }
  #bulk-order .bulk-order__eyebrow,
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead { max-width: none !important; }
  #bulk-order .bulk-order__title { font-size: clamp(34px, 9vw, 42px); }
  #bulk-order .bulk-order__lead { margin-top: 18px; font-size: 14px; }
  #bulk-order .bulk-order__visual { position: relative !important; top: auto !important; right: auto !important; width: min(100%, 410px) !important; height: 300px !important; margin: 12px auto 0; }
  #bulk-order .bulk-order__visual img { left: 50% !important; right: auto !important; width: min(340px, 90vw) !important; transform: translateX(-50%) !important; }
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; width: 100% !important; max-width: none !important; }
  #bulk-order .bulk-order__horizon { margin-top: 20px !important; grid-template-columns: 44px 1fr !important; gap: 12px !important; padding: 17px 18px !important; }
  #bulk-order .bulk-order__horizon strong { font-size: 33px !important; }
  #bulk-order .bulk-order__horizon em { grid-column: 2 !important; max-width: none !important; margin-top: -4px; }
  #bulk-order .bulk-order__timeline { grid-template-columns: 1fr !important; margin-top: 30px !important; gap: 14px !important; }
  #bulk-order .bulk-order__timeline::before { top: 17px !important; bottom: 18px; left: 17px !important; right: auto !important; width: 1px !important; height: auto !important; }
  #bulk-order .bulk-order-step { min-height: 0 !important; padding: 0 0 20px 58px !important; }
  #bulk-order .bulk-order-step i { left: 0 !important; }
  #bulk-order .bulk-order-step > b.material-symbols-rounded { position: absolute !important; top: 4px !important; left: 40px !important; width: auto !important; height: auto !important; margin: 0 !important; font-size: 21px !important; }
  #bulk-order .bulk-order-step strong,
  #bulk-order .bulk-order-step span { display: block !important; width: auto !important; max-width: none !important; margin-left: 18px !important; }
  #bulk-order .bulk-order-card { padding: 22px 18px !important; border-radius: 18px; }
  #bulk-order .bulk-order-card__top { margin-bottom: 20px; }
  #bulk-order .bulk-order-card__title { font-size: 27px; }
  #bulk-order .bulk-product-browser__head { min-height: 56px; }
  #bulk-order .bulk-product-grid { height: 220px; grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  #bulk-order .bulk-order-form__grid { grid-template-columns: 1fr !important; }
  #bulk-order .bulk-calendar { left: 0 !important; right: auto !important; width: min(100%, calc(100vw - 56px)) !important; max-height: min(520px, calc(100dvh - 120px)); overflow-y: auto; }

  #product-details.product-details { padding-top: 42px !important; padding-bottom: 44px !important; }
  #product-details .product-details__title { font-size: clamp(30px, 9vw, 40px); }
  #product-details .product-details__main { min-height: 290px; }
  #product-details .product-details__side {
    display: flex !important;
    min-height: 0 !important;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  #product-details .product-details__side::-webkit-scrollbar { display: none; }
  #product-details .product-details__side .detail-card {
    flex: 0 0 min(82vw, 330px);
    min-height: 245px !important;
    scroll-snap-align: start;
  }

  #test-batch.test-batch { padding-top: 34px !important; }
  #test-batch .test-batch__card { min-height: 0; padding: 24px 20px; border-radius: 18px; }
  #test-batch .test-batch__title,
  #order-process .order-process__title { font-size: clamp(31px, 9vw, 40px); }
  #test-batch .test-batch__lead { font-size: 14px; }

  #order-process.order-process { padding-top: 34px !important; padding-bottom: 52px !important; }

  #final-request.final-request { padding-top: 20px !important; padding-bottom: 46px !important; }
  #final-request .final-request__card { padding: 28px 20px !important; border-radius: 20px; }
  #final-request .final-request__title { font-size: clamp(36px, 10.5vw, 48px); }
  #final-request .final-request__lead { margin-top: 15px; font-size: 13px; }
  #final-request .final-request__form { grid-template-columns: 1fr !important; }
  #final-request .final-field--wide,
  #final-request .final-request__submit,
  #final-request .final-request__note { grid-column: auto !important; }

  .site-footer__inner { padding: 38px 18px calc(24px + var(--jp-safe-bottom)) !important; }
  .site-footer__top { grid-template-columns: 1fr !important; gap: 28px; padding-bottom: 30px; }
  .site-footer__bottom { flex-direction: column; gap: 14px; }
  .site-footer__legal { justify-content: flex-start; gap: 10px 15px; }

  /* Bottom contact dock instead of a content-covering vertical rail. */
  .contact-dock {
    top: auto !important;
    right: max(10px, var(--jp-safe-right)) !important;
    bottom: calc(10px + var(--jp-safe-bottom)) !important;
    left: max(10px, var(--jp-safe-left)) !important;
    width: auto !important;
    padding: 7px !important;
    border-radius: 17px !important;
    transform: none !important;
    background: rgba(17,17,19,.94) !important;
    backdrop-filter: blur(16px);
  }
  .contact-dock.is-hidden { transform: translateY(calc(100% + 38px)) !important; opacity: 0; }
  .contact-dock.is-collapsed { transform: none !important; }
  .contact-dock__actions { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 6px !important; }
  .contact-dock__action { min-height: 50px !important; padding: 7px !important; border-radius: 12px !important; }
  .contact-dock__action span { display: none !important; }
  .contact-dock__action svg { width: 23px !important; height: 23px !important; }
  .contact-dock__close { top: -13px !important; right: -3px !important; }
  .contact-dock__toggle { display: none !important; }

  /* All modal types fit inside the visual viewport. */
  .lead-modal, .exit-modal, .map-modal, .product-modal, .info-modal { padding: 9px !important; }
  .lead-modal__dialog,
  .exit-modal__dialog,
  .map-modal__dialog,
  .product-modal__dialog,
  .info-modal__dialog { max-height: calc(100dvh - 18px) !important; }
  .lead-modal__media { min-height: 150px !important; max-height: 150px !important; }
  .lead-modal__content { padding: 22px 18px 20px !important; }
  .lead-modal__title { font-size: 26px !important; }
  .product-modal__media { min-height: 235px !important; }
  .product-modal__content { padding: 18px 17px 16px !important; }
  .product-modal__spec { grid-template-columns: 108px 1fr !important; font-size: 12px; }
  .exit-modal__visual { min-height: 150px !important; max-height: 150px !important; }
  .exit-modal__content { padding: 22px 18px 20px !important; }
  .map-modal__dialog { border-radius: 18px !important; }
  .info-modal__header { padding: 23px 58px 18px 19px !important; }
  .info-modal__title { font-size: 29px !important; }
  .info-modal__scroll { padding: 20px 19px 26px !important; }
}

/* Extra narrow phones. */
@media (max-width: 430px) {
  .brand img { width: 148px; }
  .hero h1 { font-size: clamp(34px, 10.8vw, 42px); }
  .product-scene { height: 315px; }
  #catalog .catalog-product { grid-template-columns: 54px 1fr 1fr !important; padding: 12px !important; }
  #catalog .catalog-product__thumb { width: 50px; height: 64px; }
  #bulk-order .bulk-product-grid { grid-template-columns: 1fr !important; height: 248px; }
  #bulk-order .bulk-product-item { grid-template-columns: minmax(0,1fr) auto !important; height: 58px !important; }
  #bulk-order .bulk-product-item .bulk-qty { width: 104px !important; grid-template-columns: 28px 48px 28px !important; }
  #bulk-order .bulk-product-item .bulk-qty input { width: 48px !important; }
  #bulk-order .bulk-calendar__grid { grid-template-columns: repeat(3,1fr) !important; }
  #bulk-order .bulk-calendar__day { min-height: 50px; }
  #product-details .product-details__side .detail-card { flex-basis: 84vw; }
  #test-batch .test-batch__button { max-width: none; }
  .final-request__quick { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); }
  #final-request .final-request__quick a { width: 100%; }
  .info-modal__contact-card { display: grid !important; grid-template-columns: 1fr; }
  .info-modal__contact-card a { width: 100%; }
}

@media (max-width: 360px) {
  :root { --header-top: 64px; }
  .header-main__inner { width: calc(100% - 18px) !important; }
  .brand img { width: 138px; }
  .icon-button { width: 42px; height: 42px; }
  .hero h1, .hero__actions, .facts { width: calc(100% - 24px) !important; }
  .hero h1 { font-size: 34px; }
  .product-scene { height: 285px; }
  #catalog .catalog-product__unit,
  #catalog .catalog-product__pack { font-size: 12px; }
  #bulk-order .bulk-order-card { padding: 19px 14px !important; }
  #bulk-order .bulk-order-card__title { font-size: 24px; }
  #bulk-order .bulk-order__horizon strong { font-size: 29px !important; }
  #final-request .final-request__title { font-size: 34px; }
}

/* Short landscape screens: preserve usability rather than forcing a tall cinematic hero. */
@media (max-height: 620px) and (min-width: 701px) {
  .hero { min-height: 620px !important; height: 620px !important; }
  .hero__inner { display: grid !important; width: calc(100% - 48px) !important; grid-template-columns: minmax(330px,43%) 1fr !important; }
  .hero__content { display: block !important; padding-top: 32px !important; }
  .hero h1 { width: auto !important; margin: 0 !important; font-size: 42px !important; }
  .hero__actions { width: auto !important; display: flex !important; margin: 22px 0 0 !important; }
  .hero__actions .button { min-width: 0 !important; font-size: 10px; }
  .product-scene { position: absolute !important; inset: 0 !important; height: 100% !important; margin: 0 !important; }
  .facts { width: min(720px,72vw) !important; display: flex !important; margin: 26px 0 0 !important; }
  .fact { padding: 0 14px 0 0 !important; }
  .fact + .fact { padding-left: 14px !important; border-left: 1px solid rgba(255,255,255,.35) !important; border-top: 0 !important; }
  .fact strong { font-size: 12px; }
  .fact span { font-size: 10.5px; }
}

/* Touch devices: avoid desktop-only hover motion and ensure comfortable hit areas. */
@media (hover: none), (pointer: coarse) {
  .button:hover,
  #catalog .catalog-product__action:hover,
  #test-batch .test-batch__button:hover,
  #final-request .final-request__submit:hover,
  .detail-card:hover .detail-card__media img { transform: none !important; }
  button, a, input, textarea, select { touch-action: manipulation; }
}


/* ---- consolidated source block ---- */

/* v60 — dark header from v59, full-width header seam removed */
.site-header,
.site-header.has-fixed-nav,
.header-main {
  background: #000 !important;
}
.site-header { color: #fff; }
.header-main { border-bottom: 0 !important; box-shadow: none !important; }
.brand { border-right-color: rgba(255,255,255,.14) !important; }
.brand img { display: block; }
.info-block,
.intro strong,
.address .header-contact__content,
.phones,
.phones a,
.header-address-trigger,
.header-address-trigger .header-contact__content { color: #f7f7f7 !important; }
.intro span { color: rgba(255,255,255,.62) !important; }

/* Contact chips stay dark, but are lifted one tone above pure black so they read as controls. */
.address,
.phones,
.header-address-trigger,
.header-address-trigger:hover {
  border-color: rgba(255,255,255,.12) !important;
  background: #0b0b0c !important;
  box-shadow: none !important;
}
.header-address-trigger:hover .header-contact__content,
.phones a:hover { color: var(--brand-red) !important; }
.header-contact__icon,
.mobile-phone { color: var(--brand-red) !important; }
.nav-bar,
.nav-bar.is-fixed,
.nav-bar.is-open,
.nav-bar.is-fixed.is-open {
  background: #090909 !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.48) !important;
}
.nav-list a { color: rgba(255,255,255,.88) !important; }
.nav-list a:hover,
.nav-list a.is-active { color: #ff3a3d !important; }
.nav-list a:hover { background: rgba(255,255,255,.035) !important; }

/* Footer should end cleanly without the extra seam above it. */
.site-footer {
  border-top: 0 !important;
  box-shadow: none !important;
}
.site-footer__inner { box-shadow: none !important; }

@media (max-width: 780px) {
  .header-main {
    background: #000 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.34) !important;
  }
  .icon-button { color: #fff !important; }
  .menu-toggle {
    border-color: rgba(237,33,36,.72) !important;
    color: #fff !important;
    background: #000 !important;
    box-shadow: none !important;
  }
  .nav-bar.is-open .nav-list a { color: rgba(255,255,255,.9) !important; }
  .nav-bar.is-open .nav-list a.is-active {
    color: #ff3a3d !important;
    background: rgba(237,33,36,.10) !important;
  }
}


/* ---- consolidated source block ---- */

/* v70 — integrated footer, same visual system as the landing */
.site-footer {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #050505 !important;
  color: #fff;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 4%, rgba(241,35,39,.12), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 22%);
}
.site-footer__inner {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 146px), 1426px) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 54px 0 28px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.site-footer__inner::before { display: none !important; }
.site-footer__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  padding: 0 0 32px !important;
  border: 0 !important;
}
.footer-brand {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #fff;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
  text-decoration: none;
}
.footer-brand__mark {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 7px solid #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px #050505;
  position: relative;
}
.footer-brand__mark::after {
  content: '';
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f12327;
}
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
}
.footer-nav a {
  color: #f0f0f2;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: color .22s ease;
}
.footer-nav a:hover { color: #f12327; }
.footer-nav__dot { color: #f12327; font-size: 13px; }
.site-footer__main {
  display: grid;
  grid-template-columns: minmax(0,.86fr) minmax(0,.9fr) minmax(0,1.34fr) !important;
  gap: 44px !important;
  padding: 38px 0 42px !important;
  border-top: 1px solid rgba(255,255,255,.09) !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
}
.site-footer__intro,
.site-footer__contact,
.site-footer__map-wrap {
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.site-footer__contact {
  padding-left: 36px !important;
  border-left: 1px solid rgba(255,255,255,.10) !important;
}
.site-footer__lead {
  max-width: 340px;
  margin: 0 0 28px !important;
  color: #e5e5e7;
  font-size: 16px !important;
  line-height: 1.6;
}
.footer-feature-list { display: grid; gap: 18px; }
.footer-feature {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 13px;
  align-items: start;
}
.footer-feature__icon,
.footer-contact-item__icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  background: rgba(241,35,39,.09) !important;
  color: #f12327 !important;
}
.footer-feature__icon .material-symbols-rounded,
.footer-contact-item__icon .material-symbols-rounded { font-size: 21px !important; }
.footer-feature__title {
  margin: 0 0 3px;
  color: #fff;
  font-size: 15px !important;
  font-weight: 800;
}
.footer-feature__text {
  margin: 0;
  color: #93959c !important;
  font-size: 13px !important;
  line-height: 1.55;
}
.site-footer__section-title {
  margin: 0 0 22px !important;
  color: #fff;
  font-size: 25px !important;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.03em;
}
.footer-contact-list { display: grid; gap: 17px !important; }
.footer-contact-item {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 13px;
  align-items: start;
}
.footer-contact-item__content,
.footer-contact-item__content a {
  color: #e8e8ea !important;
  font-size: 14px !important;
  line-height: 1.55;
  text-decoration: none;
}
.footer-contact-item__content a:hover { color: #f12327 !important; }
.footer-socials { margin-top: 22px !important; gap: 8px !important; }
.footer-socials a {
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 11px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: transparent !important;
  color: #c9cacf !important;
  font-size: 11px !important;
  font-weight: 700;
}
.footer-socials a:hover {
  transform: none !important;
  border-color: #f12327 !important;
  color: #fff !important;
  background: rgba(241,35,39,.08) !important;
}
.site-footer__map-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}
.site-footer__map-eyebrow {
  margin: 0 0 6px;
  color: #f12327;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.site-footer__map-title {
  margin: 0;
  color: #fff;
  font-size: 24px;
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -.03em;
}
.site-footer__map-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #b3b4b9;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.site-footer__map-link:hover { color: #fff; }
.site-footer__map-link .material-symbols-rounded { font-size: 16px; }
.footer-map--google {
  position: relative;
  min-height: 360px !important;
  overflow: hidden;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: #0a0a0b !important;
}
.footer-map--google::before,
.footer-map--google::after { display: none !important; }
.footer-map--google iframe {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  border: 0;
  filter: grayscale(1) invert(.88) contrast(.92) brightness(.64) saturate(.15);
  opacity: .9;
}
.footer-map--google:hover iframe {
  filter: grayscale(.8) invert(.84) contrast(.96) brightness(.7) saturate(.35);
}
.footer-map__card {
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  bottom: 18px !important;
  display: grid !important;
  grid-template-columns: 42px 1fr !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(6,6,7,.84) !important;
  backdrop-filter: blur(12px);
  box-shadow: none !important;
}
.footer-map__card .material-symbols-rounded {
  width: 42px !important;
  height: 42px !important;
  border-radius: 11px !important;
  background: rgba(241,35,39,.1) !important;
  color: #f12327 !important;
  font-size: 23px !important;
}
.footer-map__address {
  margin: 0 !important;
  color: #fff;
  font-size: 14px !important;
  line-height: 1.4;
  font-weight: 800;
}
.footer-map__hours {
  margin: 5px 0 0 !important;
  color: #aaaeb5 !important;
  font-size: 12px !important;
  line-height: 1.5;
}
.site-footer__bottom {
  display: grid !important;
  grid-template-columns: 1fr auto auto auto !important;
  align-items: center !important;
  gap: 16px 22px !important;
  padding: 20px 0 0 !important;
  border: 0 !important;
  color: #777980 !important;
}
.site-footer__copyright { color: #777980 !important; font-size: 11px !important; }
.site-footer__payments { gap: 7px !important; }
.site-footer__payment-badge {
  min-width: 48px !important;
  height: 30px !important;
  padding: 0 9px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: transparent !important;
  color: #aaaeb4 !important;
  font-size: 11px !important;
}
.site-footer__legal { gap: 9px 15px !important; }
.site-footer__legal a { color: #8e9096 !important; font-size: 11px !important; }
.site-footer__legal a:hover { color: #fff !important; }
.site-footer__to-top {
  width: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(241,35,39,.48) !important;
  background: transparent !important;
  color: #fff !important;
}
.site-footer__to-top .material-symbols-rounded { font-size: 20px !important; }
@media (max-width: 1320px) {
  .site-footer__main {
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  }
  .site-footer__map-wrap { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .site-footer__inner { width: min(calc(100% - 68px), 1426px) !important; }
  .site-footer__nav { flex-direction: column; align-items: flex-start; }
  .footer-nav { justify-content: flex-start; }
  .site-footer__main { grid-template-columns: 1fr !important; gap: 30px !important; }
  .site-footer__contact { padding-left: 0 !important; border-left: 0 !important; }
  .site-footer__bottom { grid-template-columns: 1fr !important; justify-items: start; }
  .site-footer__legal { justify-content: flex-start !important; }
}
@media (max-width: 700px) {
  .site-footer__inner {
    width: 100% !important;
    padding: 38px 18px calc(24px + var(--jp-safe-bottom)) !important;
  }
  .site-footer__nav { padding-bottom: 24px !important; }
  .footer-nav { gap: 9px 12px; }
  .footer-nav a { font-size: 12px; }
  .site-footer__main { padding: 28px 0 30px !important; }
  .site-footer__lead { max-width: none; }
  .site-footer__map-head { align-items: flex-start; flex-direction: column; }
  .footer-map--google { min-height: 340px !important; border-radius: 15px !important; }
  .footer-map__card { left: 12px !important; right: 12px !important; bottom: 12px !important; }
}


/* ---- consolidated source block ---- */

/* v82 — branded browser scrollbar */
html {
  scrollbar-color: #f12327 #0a0a0a;
  scrollbar-width: thin;
}
*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}
*::-webkit-scrollbar-track {
  background: #0a0a0a;
}
*::-webkit-scrollbar-thumb {
  background: #f12327;
  border-radius: 999px;
  border: 3px solid #0a0a0a;
}
*::-webkit-scrollbar-thumb:hover {
  background: #d91f23;
}
*::-webkit-scrollbar-corner {
  background: #0a0a0a;
}


/* ---- consolidated source block ---- */

/* v109 — compact conversion CTA, no repetition of product-detail proofs */
#test-batch.test-batch { padding: 34px 24px 22px; }
#test-batch .test-batch__inner { width: min(1426px, calc(100% - 96px)); }
#test-batch .test-batch__card {
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:24px;
  align-items:stretch;
  min-height:0;
  padding:28px;
  border-radius:22px;
  background:linear-gradient(135deg,#fff 0%,#fff 58%,#fff7f6 100%);
  border:1px solid #e3e0dc;
  box-shadow:0 14px 44px rgba(18,18,18,.045);
  overflow:hidden;
}
#test-batch .test-batch__card::after { content:none; }
#test-batch .test-batch__copy { max-width:760px; padding:8px 8px 8px 10px; align-self:center; }
#test-batch .test-batch__eyebrow { margin-bottom:12px; }
#test-batch .test-batch__title { font-size:clamp(34px,3.25vw,52px); line-height:.99; max-width:720px; }
#test-batch .test-batch__lead { max-width:650px; margin-top:15px; color:#666970; font-size:15px; line-height:1.55; }
#test-batch .test-batch__button { margin-top:22px; min-height:54px; padding:0 25px; border-radius:11px; }
#test-batch .test-batch__sample {
  display:grid;
  grid-template-columns:150px 1fr;
  gap:18px;
  align-items:center;
  padding:16px;
  border-radius:18px;
  background:#101112;
  border:1px solid #202224;
  color:#fff;
}
#test-batch .test-batch__sample-media {
  position:relative;
  min-height:230px;
  border-radius:13px;
  overflow:hidden;
  background:#f6f6f4;
}
#test-batch .test-batch__sample-media img { width:100%; height:100%; object-fit:contain; display:block; padding:10px; }
#test-batch .test-batch__sample-badge {
  position:absolute; left:10px; bottom:10px; padding:7px 9px; border-radius:7px;
  background:rgba(10,10,10,.8); color:#fff; font-size:9px; line-height:1; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; backdrop-filter:blur(6px);
}
#test-batch .test-batch__sample-copy { min-width:0; }
#test-batch .test-batch__sample-kicker { color:#f12327; font-size:10px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
#test-batch .test-batch__sample-title { margin:7px 0 13px; color:#fff; font-size:22px; line-height:1.08; font-weight:800; letter-spacing:-.02em; }
#test-batch .test-batch__outcomes { display:grid; gap:8px; }
#test-batch .test-batch__outcome { display:grid; grid-template-columns:22px 1fr; gap:9px; align-items:start; padding:9px 0; border-top:1px solid #26282a; }
#test-batch .test-batch__outcome:first-child { border-top:0; padding-top:0; }
#test-batch .test-batch__outcome .material-symbols-rounded { color:#f12327; font-size:18px; line-height:1.15; }
#test-batch .test-batch__outcome strong { display:block; color:#fff; font-size:12.5px; line-height:1.25; font-weight:800; }
#test-batch .test-batch__outcome small { display:block; margin-top:3px; color:#9b9da1; font-size:10.5px; line-height:1.35; }
@media (max-width:1050px) {
  #test-batch .test-batch__inner { width:min(1180px,calc(100% - 48px)); }
  #test-batch .test-batch__card { grid-template-columns:1fr; gap:20px; }
  #test-batch .test-batch__copy { max-width:820px; padding:4px; }
  #test-batch .test-batch__sample { grid-template-columns:170px 1fr; }
}
@media (max-width:700px) {
  #test-batch.test-batch { padding:24px 14px 16px; }
  #test-batch .test-batch__inner { width:100%; }
  #test-batch .test-batch__card { padding:20px; border-radius:18px; gap:17px; }
  #test-batch .test-batch__copy { padding:0; }
  #test-batch .test-batch__title { font-size:clamp(31px,9vw,40px); }
  #test-batch .test-batch__lead { font-size:13px; }
  #test-batch .test-batch__button { width:100%; margin-top:18px; }
  #test-batch .test-batch__sample { grid-template-columns:105px 1fr; gap:12px; padding:11px; }
  #test-batch .test-batch__sample-media { min-height:180px; }
  #test-batch .test-batch__sample-title { font-size:18px; margin-bottom:10px; }
  #test-batch .test-batch__outcome { grid-template-columns:18px 1fr; gap:7px; padding:7px 0; }
  #test-batch .test-batch__outcome .material-symbols-rounded { font-size:16px; }
  #test-batch .test-batch__outcome small { font-size:9.5px; }
}


/* ---- consolidated source block ---- */

/* v110 — stronger B2B information hierarchy */
#catalog .catalog-product__availability{display:flex;flex-wrap:wrap;gap:5px 10px;margin-top:5px;font-size:10px;line-height:1.25;font-weight:500}.catalog-product__availability b{color:#238a29}.catalog-product__availability em{color:#858681;font-style:normal}.catalog-product__pack{font-weight:700;color:#111}.catalog-product__pack strong{font-size:15px}.catalog-product__unit{color:#73746f;font-size:13px;font-weight:500}.product-modal__spec--pack dd{font-size:18px;font-weight:800;color:#fff}.product-modal__spec--pack dd small{font-size:11px!important;color:#8f9198}.product-modal__availability{color:#71d476!important;font-weight:700!important}

/* v111 — restored the more prominent desktop contact dock from v109 */
#bulk-order .bulk-order__business-points span{font-size:10px;padding:7px 9px}.catalog-product__availability em{display:none}.catalog-product__pack strong{font-size:13px}


/* ---- consolidated source block ---- */

/* v112 — premium final CTA redesign */
#final-request.final-request {
  background: #f7f6f3;
  padding: 34px 24px 78px;
  color: #fff;
}
#final-request .final-request__inner {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}
#final-request .final-request__card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 470px);
  gap: 40px;
  align-items: stretch;
  padding: 42px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(218, 58, 48, .18), transparent 34%),
    radial-gradient(circle at -8% 105%, rgba(218, 58, 48, .12), transparent 30%),
    linear-gradient(180deg, #111214 0%, #0c0d10 100%);
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 26px 70px rgba(15,17,20,.12);
}
#final-request .final-request__card::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.05), transparent 26%, transparent 72%, rgba(255,255,255,.03));
}
#final-request .final-request__copy,
#final-request .final-request__form-wrap,
#final-request .final-request__form { position: relative; z-index: 1; }
#final-request .final-request__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 610px;
}
#final-request .final-request__eyebrow {
  margin: 0 0 14px;
  color: #f0453c;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
#final-request .final-request__title {
  margin: 0;
  max-width: 580px;
  font-size: clamp(42px, 4.2vw, 62px);
  line-height: .95;
  letter-spacing: -.055em;
  font-weight: 800;
}
#final-request .final-request__lead {
  max-width: 560px;
  margin: 18px 0 0;
  color: #b9bec7;
  font-size: 15px;
  line-height: 1.65;
}
#final-request .final-request__benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
}
#final-request .final-request__benefits li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  color: #f3f4f6;
  font-size: 13px;
  font-weight: 700;
}
#final-request .final-request__benefits li::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #f0453c;
  box-shadow: 0 0 0 6px rgba(240,69,60,.14);
}
#final-request .final-request__contact-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.08);
}
#final-request .final-request__contact-line span {
  color: #89909b;
  font-size: 13px;
  font-weight: 600;
}
#final-request .final-request__contact-line a {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: color .2s ease, opacity .2s ease;
}
#final-request .final-request__contact-line a:hover {
  color: #f0453c;
}
#final-request .final-request__quick {
  display: none;
}
#final-request .final-request__form-wrap {
  padding: 24px;
  border-radius: 24px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(8px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
#final-request .final-request__form-kicker {
  margin: 0 0 18px;
  color: #d8dbe1;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#final-request .final-request__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
#final-request .final-field { min-width: 0; }
#final-request .final-field--wide { grid-column: 1 / -1; }
#final-request .final-field input,
#final-request .final-field textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.09);
  outline: none;
  color: #fff;
  background: #181a1f;
  font: inherit;
  font-size: 14px;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
#final-request .final-field input {
  height: 56px;
  padding: 0 16px;
  border-radius: 12px;
}
#final-request .final-field textarea {
  min-height: 88px;
  resize: vertical;
  padding: 15px 16px;
  border-radius: 12px;
  line-height: 1.45;
}
#final-request .final-field input::placeholder,
#final-request .final-field textarea::placeholder { color: #8d939d; }
#final-request .final-field input:focus,
#final-request .final-field textarea:focus {
  border-color: rgba(240,69,60,.8);
  box-shadow: 0 0 0 3px rgba(240,69,60,.14);
  background: #1a1d22;
}
#final-request .final-request__submit {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 58px;
  margin-top: 4px;
  border: 0;
  border-radius: 12px;
  background: #ef3e36;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
  box-shadow: 0 14px 28px rgba(239,62,54,.22);
}
#final-request .final-request__submit:hover {
  transform: translateY(-1px);
  background: #ff4c43;
}
#final-request .final-request__submit:disabled { cursor: wait; opacity: .78; transform: none; }
#final-request .final-request__submit.is-success { background: #187f49; box-shadow: none; }
#final-request .final-request__note {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  color: #848a95;
  font-size: 11px;
  line-height: 1.45;
  text-align: left;
}
#final-request .final-request__note a {
  color: #d9dde5;
  text-decoration-color: rgba(217,221,229,.5);
}
@media (max-width: 980px) {
  #final-request .final-request__card {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 34px 28px;
  }
  #final-request .final-request__copy,
  #final-request .final-request__lead,
  #final-request .final-request__title { max-width: none; }
}
@media (max-width: 720px) {
  #final-request.final-request {
    padding: 20px 14px 48px;
  }
  #final-request .final-request__inner {
    width: min(1180px, calc(100% - 20px));
  }
  #final-request .final-request__card {
    padding: 26px 20px;
    border-radius: 22px;
  }
  #final-request .final-request__title {
    font-size: clamp(36px, 11vw, 48px);
  }
  #final-request .final-request__lead {
    font-size: 14px;
  }
  #final-request .final-request__form-wrap {
    padding: 18px;
    border-radius: 18px;
  }
  #final-request .final-request__form {
    grid-template-columns: 1fr;
  }
  #final-request .final-field--wide,
  #final-request .final-request__submit,
  #final-request .final-request__note { grid-column: auto; }
  #final-request .final-request__contact-line {
    gap: 10px 14px;
  }
}

/* v114 — rebuilt final CTA for a cleaner, more premium look */
#final-request .final-request__card {
  gap: 0;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
  padding: 0;
  min-height: 0;
  border: 1px solid #e7e8eb;
  border-radius: 28px;
  background: #ffffff;
  box-shadow: 0 22px 54px rgba(16, 17, 19, .08);
}
#final-request .final-request__card::after {
  display: none;
}
#final-request .final-request__copy {
  max-width: none;
  padding: 46px 44px;
  border-radius: 28px 0 0 28px;
  background:
    radial-gradient(circle at 88% 12%, rgba(240,69,60,.18) 0 10%, transparent 10.2%),
    linear-gradient(145deg, #141518 0%, #0d0f12 100%);
}
#final-request .final-request__eyebrow {
  color: #f45d54;
}
#final-request .final-request__title {
  max-width: 580px;
  color: #ffffff;
}
#final-request .final-request__lead {
  max-width: 560px;
  color: #bcc2cc;
}
#final-request .final-request__benefits {
  gap: 12px;
  margin-top: 28px;
}
#final-request .final-request__benefits li {
  min-height: 44px;
  padding: 0 17px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}
#final-request .final-request__contact-line {
  margin-top: 30px;
}
#final-request .final-request__form-wrap {
  height: 100%;
  padding: 42px 40px;
  border-radius: 0 28px 28px 0;
  border: 0;
  border-left: 1px solid #ececef;
  background: linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%);
  box-shadow: none;
  backdrop-filter: none;
}
#final-request .final-request__form-kicker {
  margin-bottom: 16px;
  color: #101114;
  font-size: 12px;
  letter-spacing: .14em;
}
#final-request .final-request__form {
  gap: 14px;
}
#final-request .final-field input,
#final-request .final-field textarea {
  color: #17191d;
  background: #f4f5f7;
  border: 1px solid #dfe2e7;
}
#final-request .final-field input::placeholder,
#final-request .final-field textarea::placeholder {
  color: #777d87;
}
#final-request .final-field input:focus,
#final-request .final-field textarea:focus {
  background: #fff;
  border-color: rgba(240,69,60,.85);
  box-shadow: 0 0 0 3px rgba(240,69,60,.12);
}
#final-request .final-field textarea {
  min-height: 132px;
}
#final-request .final-request__submit {
  min-height: 60px;
  margin-top: 2px;
  border-radius: 14px;
  background: linear-gradient(180deg, #ef3e36 0%, #df3c34 100%);
}
#final-request .final-request__submit:hover {
  background: linear-gradient(180deg, #ff4a42 0%, #e54139 100%);
}
#final-request .final-request__note {
  color: #868d98;
}
#final-request .final-request__note a {
  color: #4e5561;
  text-decoration-color: rgba(78,85,97,.45);
}
@media (max-width: 980px) {
  #final-request .final-request__card {
    grid-template-columns: 1fr;
  }
  #final-request .final-request__copy {
    padding: 34px 30px;
    border-radius: 28px 28px 0 0;
  }
  #final-request .final-request__form-wrap {
    padding: 30px;
    border-left: 0;
    border-top: 1px solid #ececef;
    border-radius: 0 0 28px 28px;
  }
}
@media (max-width: 720px) {
  #final-request .final-request__card {
    border-radius: 22px;
  }
  #final-request .final-request__copy {
    padding: 28px 22px;
    border-radius: 22px 22px 0 0;
  }
  #final-request .final-request__form-wrap {
    padding: 22px 20px;
    border-radius: 0 0 22px 22px;
  }
  #final-request .final-request__benefits {
    gap: 9px;
  }
  #final-request .final-request__benefits li {
    width: 100%;
    justify-content: flex-start;
  }
}



/* ---- consolidated source block ---- */

.exit-modal__dialog { width:min(100%,1080px); grid-template-columns:.92fr 1.08fr; }
.exit-modal__content { padding:44px 46px 40px; }
.exit-modal__title { font-size:clamp(30px,3vw,44px); }
.exit-modal__text { margin:14px 0 20px; }
.exit-lead-form { display:grid; gap:14px; }
.exit-channel-picker { margin:0; padding:0; border:0; min-width:0; }
.exit-channel-picker legend { margin:0 0 9px; color:#cfd0d3; font-size:12px; font-weight:700; }
.exit-channel-picker__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.exit-channel { min-height:50px; display:flex; align-items:center; justify-content:center; gap:9px; padding:0 12px; border:1px solid #3a3b3f; border-radius:12px; background:#17181b; color:#d4d5d8; font:700 12px/1 var(--font-family); cursor:pointer; transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease, box-shadow .18s ease; outline:none; }
.exit-channel__icon { width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center; color:currentColor; }
.exit-channel__icon svg { width:19px; height:19px; display:block; overflow:visible; }
.exit-channel__icon svg * { vector-effect:non-scaling-stroke; }
.exit-channel:hover { transform:translateY(-1px); }
.exit-channel:focus { outline:none; }
.exit-channel:focus-visible { box-shadow:0 0 0 3px rgba(255,255,255,.12); }
.exit-channel--telegram { border-color:rgba(42,171,238,.35); color:#8fd7fb; }
.exit-channel--viber { border-color:rgba(115,96,242,.35); color:#b6adff; }
.exit-channel--email { border-color:rgba(245,158,11,.35); color:#ffd089; }
.exit-channel--telegram:hover, .exit-channel--telegram.is-active { border-color:#2AABEE; background:rgba(42,171,238,.14); color:#ffffff; box-shadow:inset 0 0 0 1px rgba(42,171,238,.38); }
.exit-channel--viber:hover, .exit-channel--viber.is-active { border-color:#7360F2; background:rgba(115,96,242,.14); color:#ffffff; box-shadow:inset 0 0 0 1px rgba(115,96,242,.38); }
.exit-channel--email:hover, .exit-channel--email.is-active { border-color:#F59E0B; background:rgba(245,158,11,.14); color:#ffffff; box-shadow:inset 0 0 0 1px rgba(245,158,11,.38); }
.exit-lead-field { display:grid; gap:8px; }
.exit-lead-field[hidden] { display:none !important; }
.exit-lead-field span { color:#e8e8ea; font-size:12px; font-weight:700; }
.exit-lead-field em { color:#8c8e93; font-style:normal; font-weight:500; }
.exit-lead-field input, .exit-lead-field textarea { width:100%; min-height:50px; border:1px solid #2f3034; border-radius:10px; background:#121316; color:#fff; padding:0 16px; font:500 14px/1.4 var(--font-family); outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
.exit-lead-field textarea { min-height:88px; padding:14px 16px; resize:vertical; }
.exit-email-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.exit-email-fields[hidden] { display:none !important; }
.exit-lead-field input:focus, .exit-lead-field textarea:focus { border-color:#52545b; box-shadow:0 0 0 4px rgba(255,255,255,.05); }
.exit-modal__cta { display:flex; align-items:center; justify-content:center; gap:9px; margin-top:2px; }
.exit-modal__cta .material-symbols-rounded { font-size:18px; }
.exit-modal__cta:disabled { opacity:.72; cursor:wait; transform:none; }
@media (max-width: 900px) {
  .exit-modal__content { padding:24px 20px 21px !important; }
  .exit-channel-picker__grid { grid-template-columns:1fr; }
  .exit-channel { justify-content:flex-start; padding:0 14px; }
  .exit-email-fields { grid-template-columns:1fr; }
}


/* ---- consolidated source block ---- */

/* v121 — richer lead forms with channel picker + direct messenger shortcuts */
.lead-modal__dialog { width:min(1120px,calc(100% - 40px)); grid-template-columns:.92fr 1.08fr; }
.lead-modal__content { padding:42px 46px 34px; }
.lead-modal__text { margin-bottom:18px; }
.lead-form { gap:13px; }
.lead-channel-picker { margin:0; padding:0; border:0; min-width:0; }
.lead-channel-picker legend { margin:0 0 9px; color:#cfd0d3; font-size:12px; font-weight:700; }
.lead-channel-picker__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.lead-channel { min-height:46px; display:flex; align-items:center; justify-content:center; gap:7px; padding:0 8px; border:1px solid #383a3f; border-radius:10px; background:#17181b; color:#cfd0d3; font:700 11px/1 var(--font-family); cursor:pointer; outline:none; transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease; }
.lead-channel:hover { transform:translateY(-1px); }
.lead-channel:focus-visible { box-shadow:0 0 0 3px rgba(255,255,255,.10); }
.lead-channel__icon { width:17px; height:17px; display:inline-flex; align-items:center; justify-content:center; color:currentColor; }
.lead-channel__icon svg { width:17px; height:17px; display:block; fill:currentColor; }
.lead-channel--phone { border-color:rgba(241,35,39,.36); color:#ff817f; }
.lead-channel--telegram { border-color:rgba(42,171,238,.38); color:#8dd6fb; }
.lead-channel--viber { border-color:rgba(115,96,242,.40); color:#b7aeff; }
.lead-channel--email { border-color:rgba(245,158,11,.40); color:#ffd18d; }
.lead-channel--phone.is-active { border-color:#f12327; background:rgba(241,35,39,.13); color:#fff; box-shadow:inset 0 0 0 1px rgba(241,35,39,.35); }
.lead-channel--telegram.is-active { border-color:#2AABEE; background:rgba(42,171,238,.14); color:#fff; box-shadow:inset 0 0 0 1px rgba(42,171,238,.38); }
.lead-channel--viber.is-active { border-color:#7360F2; background:rgba(115,96,242,.14); color:#fff; box-shadow:inset 0 0 0 1px rgba(115,96,242,.38); }
.lead-channel--email.is-active { border-color:#F59E0B; background:rgba(245,158,11,.14); color:#fff; box-shadow:inset 0 0 0 1px rgba(245,158,11,.38); }
.lead-channel-field[hidden] { display:none !important; }
.lead-channel-field { display:grid; gap:7px; }
.lead-channel-field > span { color:#cfd0d3; font-size:11px; font-weight:700; }
.lead-channel-field input { width:100%; min-height:52px; padding:0 15px; border:1px solid #303238; border-radius:10px; background:#17181b; color:#fff; font:500 14px/1.3 var(--font-family); outline:none; transition:border-color .18s ease,box-shadow .18s ease; }
.lead-channel-field input::placeholder { color:#73767d; }
.lead-channel-field input:focus { border-color:#565960; box-shadow:0 0 0 4px rgba(255,255,255,.045); }
.lead-form__submit { margin-top:1px; }
.lead-direct { margin-top:1px; padding-top:14px; border-top:1px solid #282a2f; }
.lead-direct__head { display:flex; align-items:center; gap:8px; margin-bottom:10px; color:#dddfe3; font-size:11px; font-weight:700; }
.lead-direct__status { width:7px; height:7px; border-radius:50%; background:#21c55d; box-shadow:0 0 0 5px rgba(33,197,93,.10); }
.lead-direct__links { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.lead-direct__link { min-height:42px; display:flex; align-items:center; justify-content:center; gap:8px; border-radius:9px; border:1px solid #35373d; color:#fff; font-size:11px; font-weight:800; text-decoration:none; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.lead-direct__link:hover { transform:translateY(-1px); }
.lead-direct__link--telegram { border-color:rgba(42,171,238,.42); background:rgba(42,171,238,.08); }
.lead-direct__link--telegram:hover { border-color:#2AABEE; background:rgba(42,171,238,.15); }
.lead-direct__link--viber { border-color:rgba(115,96,242,.42); background:rgba(115,96,242,.08); }
.lead-direct__link--viber:hover { border-color:#7360F2; background:rgba(115,96,242,.15); }
.lead-direct__link svg { width:17px; height:17px; fill:currentColor; }
@media(max-width:900px){
  .lead-modal__dialog { width:min(100%,560px); grid-template-columns:1fr; }
  .lead-modal__content { padding:25px 22px 22px; }
  .lead-channel-picker__grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:520px){
  .lead-channel-picker__grid { grid-template-columns:1fr 1fr; }
  .lead-channel { justify-content:flex-start; padding:0 12px; }
  .lead-direct__links { grid-template-columns:1fr; }
}


/* ---- consolidated source block ---- */

.lead-email-grid[hidden], .lead-direct[hidden] { display:none !important; }
.lead-email-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
@media(max-width:620px){ .lead-email-grid { grid-template-columns:1fr; } }


/* ---- consolidated source block ---- */

#final-request .final-channel-picker { margin:0; padding:0; border:0; min-width:0; }
#final-request .final-channel-picker legend { margin:0 0 9px; color:#5d626b; font-size:12px; font-weight:700; }
#final-request .final-channel-picker__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
#final-request .final-channel { min-height:46px; display:flex; align-items:center; justify-content:center; gap:7px; padding:0 8px; border:1px solid #d9dce1; border-radius:11px; background:#f6f7f8; color:#444a53; font:700 11px/1 var(--font-family); cursor:pointer; outline:none; transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease; }
#final-request .final-channel:hover { transform:translateY(-1px); }
#final-request .final-channel:focus-visible { box-shadow:0 0 0 3px rgba(17,18,20,.08); }
#final-request .final-channel__icon { width:17px; height:17px; display:inline-flex; align-items:center; justify-content:center; color:currentColor; font-size:18px; }
#final-request .final-channel__icon svg { width:17px; height:17px; display:block; fill:currentColor; }
#final-request .final-channel--phone { border-color:rgba(241,35,39,.28); color:#d8353a; }
#final-request .final-channel--telegram { border-color:rgba(42,171,238,.34); color:#168ec9; }
#final-request .final-channel--viber { border-color:rgba(115,96,242,.34); color:#6854dc; }
#final-request .final-channel--email { border-color:rgba(245,158,11,.38); color:#b66d00; }
#final-request .final-channel--phone.is-active { border-color:#f12327; background:rgba(241,35,39,.08); color:#c81f24; box-shadow:inset 0 0 0 1px rgba(241,35,39,.18); }
#final-request .final-channel--telegram.is-active { border-color:#2AABEE; background:rgba(42,171,238,.09); color:#117dad; box-shadow:inset 0 0 0 1px rgba(42,171,238,.18); }
#final-request .final-channel--viber.is-active { border-color:#7360F2; background:rgba(115,96,242,.09); color:#5843cd; box-shadow:inset 0 0 0 1px rgba(115,96,242,.18); }
#final-request .final-channel--email.is-active { border-color:#F59E0B; background:rgba(245,158,11,.09); color:#a56000; box-shadow:inset 0 0 0 1px rgba(245,158,11,.2); }
#final-request .final-channel-field[hidden],
#final-request .final-email-grid[hidden] { display:none !important; }
#final-request .final-email-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:720px) {
  #final-request .final-channel-picker__grid { grid-template-columns:1fr 1fr; }
  #final-request .final-email-grid { grid-template-columns:1fr; gap:12px; }
}


/* ---- consolidated source block ---- */

/* v124 — unified section heading system. Hero H1 intentionally remains unique/larger. */
:root {
  --jp-section-title-size: clamp(40px, 3.15vw, 48px);
  --jp-section-title-line: 1.02;
  --jp-section-title-tracking: -0.045em;
  --jp-section-title-weight: 800;
  --jp-section-title-max: 760px;
}

#block-02-benefits .benefits-section__title,
#catalog .catalog-hero__title,
#bulk-order .bulk-order__title,
#product-details .product-details__title,
#test-batch .test-batch__title,
#order-process .order-process__title,
#final-request .final-request__title {
  font-size: var(--jp-section-title-size) !important;
  line-height: var(--jp-section-title-line) !important;
  letter-spacing: var(--jp-section-title-tracking) !important;
  font-weight: var(--jp-section-title-weight) !important;
}

#block-02-benefits .benefits-section__title,
#catalog .catalog-hero__title,
#product-details .product-details__title,
#test-batch .test-batch__title,
#order-process .order-process__title,
#final-request .final-request__title {
  max-width: var(--jp-section-title-max) !important;
}

/* Keep the bulk-order heading inside its existing left-column composition. */
#bulk-order .bulk-order__title {
  max-width: 560px !important;
}

@media (max-width: 1100px) {
  :root {
    --jp-section-title-size: clamp(38px, 4.4vw, 44px);
  }
}

@media (max-width: 740px) {
  :root {
    --jp-section-title-size: clamp(32px, 9.2vw, 38px);
    --jp-section-title-line: 1.04;
    --jp-section-title-tracking: -0.038em;
  }
  #block-02-benefits .benefits-section__title,
  #catalog .catalog-hero__title,
  #bulk-order .bulk-order__title,
  #product-details .product-details__title,
  #test-batch .test-batch__title,
  #order-process .order-process__title,
  #final-request .final-request__title {
    max-width: 100% !important;
  }
}

@media (max-width: 390px) {
  :root {
    --jp-section-title-size: 32px;
  }
}


/* ---- consolidated source block ---- */

/* v125 — protect bulk-order title from visual overlap and restore breathing room in final CTA */
#bulk-order .bulk-order__title {
  max-width: 392px !important;
  text-wrap: balance;
}
#bulk-order .bulk-order__title br {
  display: block;
}

#final-request .final-request__copy {
  padding-top: 58px !important;
  padding-bottom: 58px !important;
}
#final-request .final-request__eyebrow {
  margin-bottom: 22px !important;
}
#final-request .final-request__title {
  margin-bottom: 0 !important;
}
#final-request .final-request__lead {
  margin-top: 28px !important;
  line-height: 1.72 !important;
}
#final-request .final-request__benefits {
  margin-top: 34px !important;
}
#final-request .final-request__contact-line {
  margin-top: 36px !important;
  padding-top: 28px !important;
}
@media (max-width: 980px) {
  #bulk-order .bulk-order__title {
    max-width: 390px !important;
  }
  #final-request .final-request__copy {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
}
@media (max-width: 740px) {
  #bulk-order .bulk-order__title {
    max-width: 100% !important;
  }
  #bulk-order .bulk-order__title br {
    display: none;
  }
  #final-request .final-request__copy {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
  #final-request .final-request__eyebrow { margin-bottom: 16px !important; }
  #final-request .final-request__lead { margin-top: 20px !important; }
  #final-request .final-request__benefits { margin-top: 24px !important; }
  #final-request .final-request__contact-line { margin-top: 26px !important; padding-top: 22px !important; }
}


/* ---- consolidated source block ---- */

/* v126 — remove duplicated proof pills; cards themselves carry the selling points */
#product-details .product-details__proofs { display: none !important; }
#product-details .product-details__lead { margin-bottom: 0 !important; }


/* ---- consolidated source block ---- */

#product-details .detail-card--tear .detail-card__media img { object-position: 50% 52%; }
#product-details .detail-card--tear::after { background: linear-gradient(180deg, rgba(9,10,12,.04) 28%, rgba(7,8,10,.92) 100%); }
#product-details .detail-card--fill .detail-card__title { max-width: 320px; text-wrap: balance; }
#product-details .product-details__lead { max-width: 650px; }
@media (max-width: 740px) {
  #product-details .detail-card--fill .detail-card__title { max-width: none; }
}


/* ---- consolidated source block ---- */

/* v129 — keep the contact dock fully open on hero, half-hidden on later screens */
@media (min-width: 781px) {
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden) {
    transform: translate(calc(50% + clamp(12px, 1.2vw, 22px)), -50%);
  }
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):hover,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):focus-within {
    transform: translate(0, -50%);
  }
}


/* ---- consolidated source block ---- */

/* v130 — desktop hero height resilience for shorter / zoomed viewports.
   Large screens keep the original cinematic composition unchanged. */
@media (min-width: 781px) and (max-height: 900px) {
  #hero.hero {
    min-height: calc(100vh - var(--header-height));
    min-height: calc(100dvh - var(--header-height));
    height: calc(100vh - var(--header-height));
    height: calc(100dvh - var(--header-height));
  }
  #hero .hero__content {
    padding-top: clamp(28px, 5vh, 52px);
  }
  #hero h1 {
    font-size: clamp(46px, 4vw, 62px);
    line-height: 1.09;
  }
  #hero .hero__actions {
    margin-top: 26px;
  }
  #hero .hero__actions .button {
    min-height: 48px;
  }
  #hero .facts {
    margin-top: 26px;
  }
  #hero .fact strong {
    font-size: 14px;
    line-height: 1.32;
  }
  #hero .fact span {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.38;
  }
}

@media (min-width: 781px) and (max-height: 760px) {
  #hero .hero__content { padding-top: 24px; }
  #hero h1 { font-size: clamp(42px, 3.65vw, 54px); line-height: 1.06; }
  #hero .hero__actions { margin-top: 20px; gap: 12px; }
  #hero .hero__actions .button { min-height: 44px; padding-block: 10px; }
  #hero .facts { margin-top: 20px; width: min(760px, 72vw); }
  #hero .fact { padding-right: 16px; }
  #hero .fact + .fact { padding-left: 16px; }
  #hero .fact strong { font-size: 12.5px; }
  #hero .fact span { margin-top: 4px; font-size: 10.5px; line-height: 1.3; }
}

/* Override the old fixed 620px fallback: never make Hero taller than the actual
   desktop viewport, otherwise its lower content gets clipped by overflow:hidden. */
@media (min-width: 701px) and (max-height: 620px) {
  #hero.hero {
    min-height: calc(100vh - var(--header-height)) !important;
    min-height: calc(100dvh - var(--header-height)) !important;
    height: calc(100vh - var(--header-height)) !important;
    height: calc(100dvh - var(--header-height)) !important;
  }
  #hero .hero__inner {
    width: calc(100% - 48px) !important;
    grid-template-columns: minmax(320px, 42%) 1fr !important;
  }
  #hero .hero__content { padding-top: 18px !important; }
  #hero h1 { font-size: 38px !important; line-height: 1.03 !important; }
  #hero .hero__actions { margin-top: 16px !important; gap: 10px !important; }
  #hero .hero__actions .button { min-height: 40px !important; padding-block: 8px !important; }
  #hero .facts { margin-top: 16px !important; }
  #hero .fact strong { font-size: 11px !important; }
  #hero .fact span { margin-top: 3px !important; font-size: 9.5px !important; line-height: 1.22 !important; }
}


/* ---- consolidated source block ---- */

/* v67 — footer aligned with the landing design system */
.site-footer {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0 24px, #050505 24px 100%) !important;
  color: #fff;
  border-top: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 24px 0 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 12%, rgba(241,35,39,.16), transparent 18%),
    radial-gradient(circle at 20% 8%, rgba(255,255,255,.04), transparent 14%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 22%);
}
.site-footer__inner {
  position: relative;
  z-index: 1;
  width: min(1426px, calc(100% - 48px)) !important;
  max-width: 1426px !important;
  margin: 0 auto;
  padding: 28px 34px 26px !important;
  border-radius: 34px 34px 0 0;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(10,10,12,.98), rgba(5,5,7,.99));
  box-shadow: none !important;
  overflow: hidden;
}
.site-footer__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 34px;
  right: 34px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(241,35,39,.55), transparent);
  pointer-events: none;
}
.footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.04em;
  text-decoration: none;
}
.footer-brand__mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 7px solid #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px #080809;
  position: relative;
}
.footer-brand__mark::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f12327;
}
.site-footer__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding-bottom: 24px;
}
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
}
.footer-nav a {
  color: #f4f4f6;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -.01em;
  transition: color .22s ease, opacity .22s ease;
}
.footer-nav a:hover { color: #f12327; }
.footer-nav__dot {
  color: rgba(241,35,39,.95);
  line-height: 1;
  font-size: 14px;
}
.site-footer__main {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, .92fr) minmax(0, 1.18fr);
  gap: 20px;
  padding: 26px 0 30px;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.site-footer__intro,
.site-footer__contact,
.site-footer__map-wrap {
  min-width: 0;
  padding: 26px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.018)),
    rgba(255,255,255,.015);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
.site-footer__intro { padding-right: 26px; }
.site-footer__lead {
  margin: 0 0 24px;
  color: #f3f3f5;
  font-size: 18px;
  line-height: 1.62;
}
.footer-feature-list {
  display: grid;
  gap: 15px;
}
.footer-feature {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-feature__icon,
.footer-contact-item__icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(241,35,39,.1);
  color: #f12327;
}
.footer-feature__icon .material-symbols-rounded,
.footer-contact-item__icon .material-symbols-rounded {
  font-size: 22px;
}
.footer-feature__title {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}
.footer-feature__text {
  margin: 0;
  color: #aeb1b9;
  font-size: 14px;
  line-height: 1.55;
}
.site-footer__contact {
  padding-left: 26px;
  border-left: 1px solid rgba(255,255,255,.06);
}
.site-footer__section-title {
  margin: 0 0 18px;
  font-size: clamp(26px, 2.3vw, 34px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.03em;
}
.footer-contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.footer-contact-item {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.footer-contact-item__content,
.footer-contact-item__content a {
  color: #f4f4f6;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.58;
}
.footer-contact-item__content a:hover { color: #f12327; }
.footer-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.footer-socials a {
  min-width: 42px;
  height: 42px;
  padding: 0 13px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .22s ease, border-color .22s ease, color .22s ease, background .22s ease;
}
.footer-socials a:hover {
  transform: translateY(-2px);
  border-color: rgba(241,35,39,.45);
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.footer-map {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 78% 18%, rgba(241,35,39,.18), transparent 22%),
    radial-gradient(circle at 18% 76%, rgba(255,255,255,.05), transparent 18%),
    linear-gradient(180deg, rgba(13,13,15,.96), rgba(6,6,8,.98));
}
.footer-map::before,
.footer-map::after {
  content: "";
  position: absolute;
  inset: -8%;
  pointer-events: none;
}
.footer-map::before {
  background:
    repeating-linear-gradient(90deg, transparent 0 32px, rgba(255,255,255,.045) 32px 33px),
    repeating-linear-gradient(180deg, transparent 0 32px, rgba(255,255,255,.04) 32px 33px);
  opacity: .22;
  transform: rotate(7deg) scale(1.06);
}
.footer-map::after {
  background:
    linear-gradient(118deg, transparent 0 42%, rgba(241,35,39,.18) 42.4%, rgba(241,35,39,.02) 44.5%, transparent 46%),
    linear-gradient(15deg, transparent 0 62%, rgba(255,255,255,.09) 62.2%, rgba(255,255,255,.02) 63.5%, transparent 64.5%),
    radial-gradient(ellipse at 45% 86%, rgba(241,35,39,.18) 0 14%, rgba(241,35,39,0) 24%);
  opacity: .72;
}
.footer-map__label {
  position: absolute;
  color: rgba(255,255,255,.86);
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.footer-map__label--city {
  top: 16%;
  left: 47%;
  transform: translateX(-50%);
  font-size: clamp(36px, 3.6vw, 54px);
  font-weight: 800;
}
.footer-map__label--old { top: 9%; left: 47%; font-size: 14px; opacity: .76; }
.footer-map__label--park { top: 18%; right: 6%; font-size: 14px; max-width: 150px; text-align: center; opacity: .76; }
.footer-map__label--river { top: 45%; left: 35%; font-size: 13px; transform: rotate(10deg); opacity: .68; }
.footer-map__label--zam { bottom: 28%; left: 43%; font-size: 14px; max-width: 150px; text-align: center; opacity: .76; }
.footer-map__pin {
  position: absolute;
  top: 42%;
  right: 23%;
  width: 52px;
  height: 52px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #f12327;
  box-shadow: 0 16px 34px rgba(241,35,39,.34);
}
.footer-map__pin::before {
  content: "";
  position: absolute;
  inset: 13px;
  border-radius: 50%;
  background: #fff;
}
.footer-map__card {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  align-items: start;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(10,10,15,.86), rgba(10,10,15,.94));
  box-shadow: none;
  backdrop-filter: blur(10px);
}
.footer-map__card .material-symbols-rounded {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(241,35,39,.12);
  color: #f12327;
  font-size: 26px;
}
.footer-map__address {
  margin: 0;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 700;
}
.footer-map__hours {
  margin: 8px 0 0;
  color: #b9bcc4;
  font-size: 14px;
  line-height: 1.55;
}
.site-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  gap: 16px 24px;
  padding-top: 20px;
  color: #c1c4cb;
}
.site-footer__copyright {
  color: #b8bbc2;
  font-size: 14px;
  line-height: 1.5;
}
.site-footer__payments {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.site-footer__payment-badge {
  min-width: 60px;
  height: 36px;
  padding: 0 13px;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
}
.site-footer__legal a {
  color: #c1c4cb;
  text-decoration: none;
  font-size: 14px;
}
.site-footer__legal a:hover { color: #fff; }
.site-footer__to-top {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(241,35,39,.5);
  background: rgba(255,255,255,.03);
  display: grid;
  place-items: center;
  color: #fff;
  text-decoration: none;
  transition: transform .22s ease, border-color .22s ease, color .22s ease, background .22s ease;
}
.site-footer__to-top:hover {
  transform: translateY(-2px);
  border-color: #f12327;
  color: #f12327;
  background: rgba(241,35,39,.08);
}
.site-footer__to-top .material-symbols-rounded { font-size: 24px; }
@media (max-width: 1320px) {
  .site-footer__main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .site-footer__map-wrap { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .site-footer__nav {
    flex-direction: column;
    align-items: flex-start;
  }
  .footer-nav { justify-content: flex-start; }
  .site-footer__main {
    grid-template-columns: 1fr;
  }
  .site-footer__bottom {
    grid-template-columns: 1fr;
    justify-items: start;
  }
  .site-footer__legal { justify-content: flex-start; }
}
@media (max-width: 820px) {
  .site-footer__inner {
    width: min(100%, calc(100% - 24px)) !important;
    padding: 24px 20px 22px !important;
    border-radius: 24px 24px 0 0;
  }
  .site-footer__inner::before { left: 20px; right: 20px; }
  .site-footer__intro,
  .site-footer__contact,
  .site-footer__map-wrap { padding: 20px; border-radius: 22px; }
  .footer-map { min-height: 360px; }
  .footer-map__label--city { font-size: 40px; }
}
@media (max-width: 640px) {
  .site-footer { background: linear-gradient(180deg, rgba(255,255,255,0) 0 14px, #050505 14px 100%) !important; }
  .site-footer::before { inset: 14px 0 0; }
  .site-footer__inner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 16px calc(20px + var(--jp-safe-bottom)) !important;
    border-radius: 22px 22px 0 0;
  }
  .site-footer__inner::before { left: 16px; right: 16px; }
  .site-footer__nav { padding-bottom: 18px; }
  .footer-nav { gap: 8px 12px; }
  .footer-nav a { font-size: 13px; }
  .site-footer__main { padding: 20px 0 22px; gap: 16px; }
  .site-footer__lead { font-size: 16px; }
  .site-footer__section-title { font-size: 24px; }
  .footer-contact-item,
  .footer-feature { grid-template-columns: 36px 1fr; gap: 12px; }
  .footer-contact-item__icon,
  .footer-feature__icon { width: 36px; height: 36px; border-radius: 12px; }
  .footer-map { min-height: 320px; border-radius: 18px; }
  .footer-map__label--city { top: 15%; font-size: 31px; }
  .footer-map__label--old,
  .footer-map__label--park,
  .footer-map__label--zam { font-size: 12px; }
  .footer-map__pin { width: 44px; height: 44px; right: 18%; }
  .footer-map__pin::before { inset: 11px; }
  .footer-map__card {
    left: 14px;
    right: 14px;
    bottom: 14px;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 15px;
  }
  .footer-map__card .material-symbols-rounded {
    width: 42px;
    height: 42px;
    font-size: 22px;
  }
  .footer-map__address { font-size: 15px; }
  .footer-map__hours { font-size: 13px; }
  .site-footer__payments,
  .site-footer__legal { gap: 10px 12px; }
  .site-footer__payment-badge { min-width: 56px; height: 32px; font-size: 13px; }
  .site-footer__to-top { width: 48px; height: 48px; }
}



/* ---- consolidated source block ---- */

/* v73 — smooth top navigation without breaking horizontal centering */
@media (min-width: 741px) {
  .nav-bar,
  .nav-bar.is-fixed {
    transform: translate3d(-50%, 0, 0) !important;
    opacity: 1;
    transition:
      transform .66s cubic-bezier(.22,.82,.22,1),
      opacity .52s cubic-bezier(.22,.82,.22,1) !important;
    will-change: transform, opacity;
    backface-visibility: hidden;
  }
  .nav-bar.is-footer-suppressed,
  .nav-bar.is-fixed.is-footer-suppressed {
    transform: translate3d(-50%, calc(-100% - 26px), 0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}
/* v380 — keep floating navigation transition available in all motion preference modes. */


/* ---- consolidated source block ---- */

/* v74 — clean footer navigation without red separator/active artifacts */
.footer-nav__dot { display: none !important; }
.footer-nav { gap: 18px !important; }
.footer-nav a,
.footer-nav a:visited,
.footer-nav a.is-active,
.footer-nav a[aria-current="page"] {
  color: #f4f4f6 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
.footer-nav a::before,
.footer-nav a::after { display: none !important; content: none !important; }
.footer-nav a:hover { color: #ffffff !important; opacity: .82; }


/* ---- consolidated source block ---- */

/* v75 — clean seamless transition into footer */
#final-request.final-request {
  padding-bottom: 44px !important;
}
.site-footer {
  background: #050505 !important;
  overflow: hidden !important;
}
.site-footer::before {
  display: none !important;
  content: none !important;
}
.site-footer__inner {
  padding-top: 28px !important;
}
.site-footer__nav {
  padding-top: 0 !important;
  padding-bottom: 24px !important;
}
@media (max-width: 700px) {
  #final-request.final-request {
    padding-bottom: 30px !important;
  }
  .site-footer__inner {
    padding-top: 24px !important;
  }
}



/* ---- consolidated source block ---- */

/* v77 — simplified footer: larger map, branded socials, no advantages/payment badges */
.site-footer__main {
  grid-template-columns: minmax(300px,.7fr) minmax(0,1.55fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}
.site-footer__contact {
  padding: 24px 28px 24px 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.site-footer__map-wrap {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.footer-map--google {
  min-height: 520px !important;
  height: 100% !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  overflow: hidden !important;
  background: #090909 !important;
}
.footer-map--google iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: 520px !important;
  display: block !important;
  filter: grayscale(1) invert(.92) contrast(.88) brightness(.82) !important;
  transition: filter .3s ease !important;
}
.footer-map--google:hover iframe {
  filter: grayscale(.78) invert(.9) contrast(.9) brightness(.88) !important;
}
.footer-map__card {
  left: 20px !important;
  right: auto !important;
  width: min(520px, calc(100% - 40px)) !important;
  bottom: 20px !important;
}
.footer-socials {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px !important;
  margin-top: 28px !important;
}
.footer-socials .footer-social {
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
  transform: none !important;
}
.footer-socials .footer-social svg {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  fill: currentColor;
}
.footer-social--telegram { background: #229ED9 !important; }
.footer-social--viber { background: #7360F2 !important; }
.footer-social--instagram { background: linear-gradient(135deg,#833AB4 0%,#E1306C 48%,#FCAF45 100%) !important; }
.footer-social--tiktok { background: linear-gradient(135deg,#111 0 58%,#25F4EE 58% 72%,#FE2C55 72% 100%) !important; }
.footer-social--facebook { background: #1877F2 !important; }
.footer-socials .footer-social:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.07);
}
.site-footer__bottom {
  grid-template-columns: minmax(280px,1fr) auto auto !important;
}
.site-footer__copyright {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  align-items: center;
}
.site-footer__credit {
  color: #8f9298;
}
.site-footer__credit > span { color: #f12327; }
.site-footer__credit a {
  color: #c7c9ce !important;
  text-decoration: none;
  font-weight: 700;
}
.site-footer__credit a:hover { color: #fff !important; }
@media (max-width: 1100px) {
  .site-footer__main { grid-template-columns: 1fr !important; }
  .site-footer__contact { padding-right: 0 !important; }
  .footer-socials { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  .site-footer__bottom { grid-template-columns: 1fr !important; }
}
@media (max-width: 700px) {
  .footer-map--google,
  .footer-map--google iframe { min-height: 420px !important; }
  .footer-socials { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 430px) {
  .footer-socials { grid-template-columns: 1fr !important; }
  .footer-map--google,
  .footer-map--google iframe { min-height: 360px !important; }
  .footer-map__card { left: 12px !important; width: calc(100% - 24px) !important; bottom: 12px !important; }
}


/* ---- consolidated source block ---- */

/* v78 — footer typography, brand socials, aligned contacts, map link, unified back-to-top */
.footer-contact-item {
  align-items: center !important;
}
.footer-contact-item__content {
  display: flex !important;
  min-height: 40px;
  flex-direction: column;
  justify-content: center !important;
}
.footer-contact-item__content,
.footer-contact-item__content a {
  font-size: 16px !important;
  line-height: 1.48 !important;
}
.footer-map-link {
  color: #f4f4f6 !important;
  text-decoration: none !important;
  text-underline-offset: 4px;
}
.footer-map-link:hover {
  color: #f12327 !important;
  text-decoration: underline !important;
}
.footer-socials .footer-social {
  min-height: 50px !important;
  height: 50px !important;
  font-size: 14px !important;
  letter-spacing: -.01em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12) !important;
}
.footer-social--telegram {
  background: #229ED9 !important;
}
.footer-social--viber {
  background: #7360F2 !important;
}
.footer-social--instagram {
  background: linear-gradient(135deg,#833AB4 0%,#C13584 30%,#E1306C 52%,#FD1D1D 72%,#FCAF45 100%) !important;
}
.footer-social--tiktok {
  background: #101010 !important;
  box-shadow: inset 4px 0 0 #25F4EE, inset -4px 0 0 #FE2C55, inset 0 0 0 1px rgba(255,255,255,.16) !important;
}
.footer-social--facebook {
  background: #1877F2 !important;
}
.site-footer__bottom {
  gap: 16px 30px !important;
  padding-top: 26px !important;
  align-items: center !important;
}
.site-footer__copyright {
  gap: 8px 20px !important;
  color: #d0d2d7 !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}
.site-footer__credit {
  color: #b5b8bf !important;
  font-size: 15px !important;
}
.site-footer__credit > span {
  color: #f12327 !important;
  font-size: 17px;
}
.site-footer__credit a {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}
.site-footer__legal {
  gap: 10px 20px !important;
}
.site-footer__legal a {
  color: #c9cbd1 !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
}
.site-footer__legal a:hover {
  color: #fff !important;
}
.site-footer__to-top {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  border: 0 !important;
  background: rgba(241,35,39,.10) !important;
  color: #f12327 !important;
  box-shadow: none !important;
}
.site-footer__to-top:hover {
  transform: translateY(-2px) !important;
  background: rgba(241,35,39,.17) !important;
  color: #fff !important;
}
.site-footer__to-top .material-symbols-rounded {
  font-size: 22px !important;
}
@media (max-width: 700px) {
  .site-footer__copyright,
  .site-footer__credit,
  .site-footer__legal a { font-size: 14px !important; }
  .footer-contact-item__content,
  .footer-contact-item__content a { font-size: 15px !important; }
}


/* ---- consolidated source block ---- */

/* v84 — thicker branded scrollbar */
html {
  scrollbar-width: auto;
  scrollbar-color: #f12327 #111214;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 16px;
  height: 16px;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: #111214;
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  background: #f12327;
  border-radius: 10px;
  border: 3px solid #111214;
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
  background: #d91f23;
}


/* ---- consolidated source block ---- */

/* v88 — price-first commercial refinements */
.catalog-shipping-note{display:inline-flex;align-items:center;gap:10px;margin:18px 0 0;padding:10px 14px;border:1px solid rgba(241,35,39,.18);border-radius:12px;background:rgba(241,35,39,.055);color:#4a4b50;font-size:13px;line-height:1.45}.catalog-shipping-note .material-symbols-rounded{color:#f12327;font-size:19px}.catalog-shipping-note strong{color:#111214}.lead-form__note a,.final-request__note a{color:inherit;text-decoration:underline;text-underline-offset:2px}.product-modal__spec dd small{font-size:.78em;color:#8f9198;font-weight:500}@media(max-width:620px){.catalog-shipping-note{font-size:12px;align-items:flex-start}}
/* v105 — make per-piece pricing explicitly approximate */
.product-modal__spec--unit{align-items:start}
.product-modal__spec--unit dd{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.product-modal__rounding-note{display:block;max-width:330px;color:#8f9198;font-size:11px!important;line-height:1.35;font-weight:500!important}
@media(max-width:620px){.product-modal__rounding-note{font-size:10px!important;max-width:220px}}



/* ---- consolidated source block ---- */

/* v25 — restore requested bulk-order internal spacing exactly */
#bulk-order .bulk-order__lead {
  position: relative;
  z-index: 4;
  margin-top: 40px;
  color: #d0d0d2;
  font-size: 14px;
  line-height: 1.55;
}
#bulk-order .bulk-order__eyebrow {
  margin-bottom: 60px;
  padding-bottom: 0;
  border-bottom: 0;
}




/* ---- consolidated source block ---- */

/* v79 — align footer contact column with map top */
.site-footer__contact {
  padding-top: 0 !important;
}
.site-footer__section-title {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}
@media (max-width: 1100px) {
  .site-footer__contact {
    padding-top: 0 !important;
  }
}


/* v132 — SEO/internal-navigation polish */
.footer-seo-nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:13px;line-height:1.4}
.footer-seo-nav__label{color:rgba(255,255,255,.48);font-weight:700}
.footer-seo-nav a{color:rgba(255,255,255,.82);text-decoration:none;border-bottom:1px solid rgba(237,33,36,.45);transition:color .2s ease,border-color .2s ease}
.footer-seo-nav a:hover,.footer-seo-nav a:focus-visible{color:#fff;border-color:#ed2124}
.seo-context-link{margin-top:10px;font-size:13px;line-height:1.45}
.seo-context-link a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(237,33,36,.45)}
.seo-context-link a:hover,.seo-context-link a:focus-visible{border-color:#ed2124}
@media(max-width:720px){.footer-seo-nav{align-items:flex-start;gap:9px 14px}.footer-seo-nav__label{flex-basis:100%}}

/* v133 — UX regression fixes after SEO pass */
.header-cta__arrow svg {
  width: 18px;
  height: 18px;
  display: block;
}
.header-cta__arrow { line-height: 0; }

/* Do not let the short-viewport safety mode affect normal 850–900px desktop screens. */
@media (min-width: 1366px) and (min-height: 821px) {
  #hero.hero {
    min-height: calc(100vh - var(--header-height)) !important;
    min-height: calc(100dvh - var(--header-height)) !important;
    height: calc(100vh - var(--header-height)) !important;
    height: calc(100dvh - var(--header-height)) !important;
  }
  #hero .hero__inner {
    width: min(calc(100% - 146px), 1426px) !important;
    grid-template-columns: minmax(520px, 40%) 1fr !important;
  }
  #hero .hero__content {
    padding-top: clamp(42px, 15vh, 150px) !important;
  }
  #hero h1 {
    font-size: clamp(56px, 4.4vw, var(--h1-desktop)) !important;
    line-height: 1.15 !important;
  }
  #hero .hero__actions { margin-top: 40px !important; }
  #hero .hero__actions .button { min-height: initial; }
  #hero .facts { margin-top: 40px !important; width: min(820px, 70vw) !important; }
  #hero .fact { padding-right: 24px !important; }
  #hero .fact + .fact { padding-left: 24px !important; }
  #hero .fact strong { font-size: 16px !important; line-height: 1.4 !important; }
  #hero .fact span { margin-top: 8px !important; font-size: 14px !important; line-height: 1.5 !important; }
}

/* The bulk-order pack must remain a supporting visual, never cover the title/copy. */
@media (min-width: 981px) {
  #bulk-order .bulk-order__visual {
    top: 82px !important;
    right: 20px !important;
    width: 360px !important;
    height: 360px !important;
  }
  #bulk-order .bulk-order__visual img {
    top: 0 !important;
    right: 0 !important;
    width: 360px !important;
    max-width: none !important;
  }
  #bulk-order .bulk-order__visual-glow {
    right: 10px !important;
    top: 95px !important;
    width: 285px !important;
    height: 205px !important;
  }
}

/* Work hours are informational rather than another action link. */
#final-request .final-request__hours {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #c8ccd2 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}
#final-request .final-request__hours::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f0453c;
  box-shadow: 0 0 0 5px rgba(240,69,60,.12);
}
@media (min-width: 781px) {
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden) {
    transform: translate(50%, -50%) !important;
  }
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):hover,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):focus-within {
    transform: translate(0, -50%) !important;
  }
}

/* v134 — restore Hero rhythm while adapting only the lower content on short desktop viewports */
@media (min-width: 781px) and (max-height: 900px) {
  #hero.hero {
    min-height: calc(100vh - var(--header-height)) !important;
    min-height: calc(100dvh - var(--header-height)) !important;
    height: calc(100vh - var(--header-height)) !important;
    height: calc(100dvh - var(--header-height)) !important;
  }
  #hero .hero__content {
    padding-top: clamp(44px, 7vh, 68px) !important;
  }
  #hero h1 {
    font-size: clamp(52px, 4.3vw, 66px) !important;
    line-height: 1.04 !important;
    letter-spacing: -1.5px !important;
  }
  #hero .hero__actions {
    margin-top: 30px !important;
    gap: 16px !important;
  }
  #hero .hero__actions .button {
    min-height: 50px !important;
    padding-block: 12px !important;
  }
  #hero .facts {
    margin-top: 28px !important;
    width: min(800px, 70vw) !important;
  }
  #hero .fact { padding-right: 20px !important; }
  #hero .fact + .fact { padding-left: 20px !important; }
  #hero .fact strong {
    font-size: 13.5px !important;
    line-height: 1.32 !important;
  }
  #hero .fact span {
    margin-top: 6px !important;
    font-size: 11.5px !important;
    line-height: 1.36 !important;
  }
}

@media (min-width: 781px) and (max-height: 760px) {
  #hero .hero__content { padding-top: 34px !important; }
  #hero h1 {
    font-size: clamp(48px, 4vw, 58px) !important;
    line-height: 1.03 !important;
  }
  #hero .hero__actions { margin-top: 24px !important; gap: 12px !important; }
  #hero .hero__actions .button { min-height: 46px !important; padding-block: 10px !important; }
  #hero .facts { margin-top: 20px !important; width: min(760px, 70vw) !important; }
  #hero .fact { padding-right: 15px !important; }
  #hero .fact + .fact { padding-left: 15px !important; }
  #hero .fact strong { font-size: 12px !important; line-height: 1.26 !important; }
  #hero .fact span { margin-top: 4px !important; font-size: 10px !important; line-height: 1.25 !important; }
}

@media (min-width: 781px) and (max-height: 660px) {
  #hero .hero__content { padding-top: 26px !important; }
  #hero h1 { font-size: clamp(43px, 3.65vw, 52px) !important; }
  #hero .hero__actions { margin-top: 18px !important; }
  #hero .hero__actions .button { min-height: 42px !important; }
  #hero .facts { margin-top: 16px !important; }
  #hero .fact strong { font-size: 11px !important; }
  #hero .fact span {
    font-size: 9px !important;
    line-height: 1.2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
}

/* Restore the supporting, animated bulk-order pack: compact and outside the text column. */
@media (min-width: 981px) {
  #bulk-order .bulk-order__title {
    max-width: 392px !important;
    text-wrap: balance;
  }
  #bulk-order .bulk-order__visual {
    top: 96px !important;
    right: 18px !important;
    width: 300px !important;
    height: 320px !important;
    overflow: visible !important;
  }
  #bulk-order .bulk-order__visual img {
    top: 0 !important;
    right: 0 !important;
    width: 300px !important;
    max-width: none !important;
    opacity: 1 !important;
    filter: drop-shadow(0 22px 36px rgba(0,0,0,.46)) !important;
    mix-blend-mode: normal !important;
  }
  #bulk-order .bulk-order__visual-glow {
    top: 88px !important;
    right: 8px !important;
    width: 235px !important;
    height: 180px !important;
  }
}
@media (min-width: 981px) and (max-width: 1280px) {
  #bulk-order .bulk-order__visual {
    top: 104px !important;
    right: 8px !important;
    width: 270px !important;
    height: 292px !important;
  }
  #bulk-order .bulk-order__visual img { width: 270px !important; }
  #bulk-order .bulk-order__visual-glow { width: 210px !important; height: 165px !important; }
}

/* Optical centering for header contact glyphs. */
.address .header-contact__icon,
.phones .header-contact__icon {
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  text-align: center !important;
  transform: translateY(1px);
}

/* v135 — final bulk-order visual containment: keep the animated pack in its own safe zone. */
@media (min-width: 1281px) {
  #bulk-order .bulk-order__visual {
    top: 92px !important;
    right: 54px !important;
    width: 244px !important;
    height: 238px !important;
    overflow: visible !important;
    pointer-events: none !important;
  }
  #bulk-order .bulk-order__visual img {
    top: 0 !important;
    right: 0 !important;
    width: 244px !important;
    height: auto !important;
    max-width: 244px !important;
    max-height: 238px !important;
    object-fit: contain !important;
    transform-origin: 50% 50% !important;
  }
  #bulk-order .bulk-order__visual-glow {
    top: 70px !important;
    right: 12px !important;
    width: 190px !important;
    height: 142px !important;
  }
}

@media (min-width: 981px) and (max-width: 1280px) {
  #bulk-order .bulk-order__visual {
    top: 98px !important;
    right: 34px !important;
    width: 218px !important;
    height: 214px !important;
    overflow: visible !important;
    pointer-events: none !important;
  }
  #bulk-order .bulk-order__visual img {
    top: 0 !important;
    right: 0 !important;
    width: 218px !important;
    height: auto !important;
    max-width: 218px !important;
    max-height: 214px !important;
    object-fit: contain !important;
    transform-origin: 50% 50% !important;
  }
  #bulk-order .bulk-order__visual-glow {
    top: 64px !important;
    right: 10px !important;
    width: 170px !important;
    height: 126px !important;
  }
}

/* Keep the lower conversion content visually above the decorative pack even during parallax. */
@media (min-width: 981px) {
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline {
    z-index: 6 !important;
  }
}

/* v136 — bulk-order visual final safe zone. */
@media (min-width: 1281px) {
  #bulk-order .bulk-order__visual { top:88px !important; right:62px !important; width:220px !important; height:220px !important; overflow:hidden !important; }
  #bulk-order .bulk-order__visual img { inset:0 !important; width:220px !important; height:220px !important; max-width:220px !important; max-height:220px !important; object-fit:contain !important; object-position:center !important; }
  #bulk-order .bulk-order__visual-glow { top:58px !important; right:10px !important; width:165px !important; height:130px !important; }
}
@media (min-width:1121px) and (max-width:1280px) {
  #bulk-order .bulk-order__visual { top:92px !important; right:36px !important; width:190px !important; height:190px !important; overflow:hidden !important; }
  #bulk-order .bulk-order__visual img { inset:0 !important; width:190px !important; height:190px !important; max-width:190px !important; max-height:190px !important; object-fit:contain !important; object-position:center !important; }
  #bulk-order .bulk-order__visual-glow { top:52px !important; right:8px !important; width:145px !important; height:112px !important; }
}
@media (min-width:981px) and (max-width:1120px) { #bulk-order .bulk-order__visual { display:none !important; } }

/* v138 — correctly integrated bulk-order product render. */
#bulk-order .bulk-order__copy {
  isolation: isolate;
}
#bulk-order .bulk-order__visual {
  position: absolute !important;
  z-index: 2 !important;
  top: 88px !important;
  right: 18px !important;
  width: 300px !important;
  height: 300px !important;
  overflow: visible !important;
  pointer-events: none !important;
  opacity: 1 !important;
}
#bulk-order .bulk-order__visual::after {
  display: none !important;
}
#bulk-order .bulk-order__visual-glow {
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  width: 230px !important;
  height: 185px !important;
  right: 12px !important;
  top: 76px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(237,33,36,.20), rgba(237,33,36,.07) 48%, transparent 72%) !important;
  filter: blur(24px) !important;
  opacity: .78 !important;
}
#bulk-order .bulk-order__visual img {
  position: absolute !important;
  z-index: 1 !important;
  inset: 0 !important;
  width: 300px !important;
  height: 300px !important;
  max-width: 300px !important;
  max-height: 300px !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  transform: translate3d(var(--jp-image-x,0px), var(--jp-image-y,0px), 0) !important;
}

@media (min-width: 1281px) {
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead { max-width: 392px !important; }
}

@media (min-width: 1121px) and (max-width: 1280px) {
  #bulk-order .bulk-order__visual {
    top: 96px !important;
    right: 12px !important;
    width: 245px !important;
    height: 245px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 245px !important;
    height: 245px !important;
    max-width: 245px !important;
    max-height: 245px !important;
  }
  #bulk-order .bulk-order__visual-glow {
    width: 190px !important;
    height: 150px !important;
    top: 62px !important;
  }
}

@media (min-width: 981px) and (max-width: 1120px) {
  #bulk-order .bulk-order__visual {
    display: block !important;
    top: 105px !important;
    right: 4px !important;
    width: 190px !important;
    height: 190px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 190px !important;
    height: 190px !important;
    max-width: 190px !important;
    max-height: 190px !important;
  }
  #bulk-order .bulk-order__visual-glow { display: none !important; }
}

@media (max-width: 980px) {
  #bulk-order .bulk-order__visual {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: min(270px, 72vw) !important;
    height: min(270px, 72vw) !important;
    margin: 12px auto 8px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  #bulk-order .bulk-order__visual-glow { display: none !important; }
}


/* v139 — enlarged bulk-order visual after client review. */
#bulk-order .bulk-order__visual {
  top: 82px !important;
  right: 4px !important;
  width: 410px !important;
  height: 410px !important;
}
#bulk-order .bulk-order__visual img {
  width: 410px !important;
  height: 410px !important;
  max-width: 410px !important;
  max-height: 410px !important;
}
#bulk-order .bulk-order__visual-glow {
  width: 305px !important;
  height: 235px !important;
  right: 34px !important;
  top: 110px !important;
  opacity: .82 !important;
}

@media (min-width: 1281px) and (max-width: 1440px) {
  #bulk-order .bulk-order__visual {
    top: 84px !important;
    right: 0 !important;
    width: 380px !important;
    height: 380px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 380px !important;
    height: 380px !important;
    max-width: 380px !important;
    max-height: 380px !important;
  }
  #bulk-order .bulk-order__visual-glow {
    width: 285px !important;
    height: 220px !important;
    right: 22px !important;
    top: 102px !important;
  }
}

@media (min-width: 1121px) and (max-width: 1280px) {
  #bulk-order .bulk-order__visual {
    top: 92px !important;
    right: 0 !important;
    width: 315px !important;
    height: 315px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 315px !important;
    height: 315px !important;
    max-width: 315px !important;
    max-height: 315px !important;
  }
  #bulk-order .bulk-order__visual-glow {
    width: 238px !important;
    height: 182px !important;
    right: 14px !important;
    top: 84px !important;
  }
}

@media (min-width: 981px) and (max-width: 1120px) {
  #bulk-order .bulk-order__visual {
    top: 105px !important;
    right: -8px !important;
    width: 240px !important;
    height: 240px !important;
  }
  #bulk-order .bulk-order__visual img {
    width: 240px !important;
    height: 240px !important;
    max-width: 240px !important;
    max-height: 240px !important;
  }
}

@media (max-width: 980px) {
  #bulk-order .bulk-order__visual {
    width: min(320px, 82vw) !important;
    height: min(320px, 82vw) !important;
  }
}

/* v140 — restore the original Hero rhythm on normal desktop heights.
   Compact only truly short desktop viewports; do not crush typography. */
@media (min-width: 781px) and (min-height: 761px) {
  #hero.hero {
    min-height: calc(100vh - var(--header-height)) !important;
    min-height: calc(100dvh - var(--header-height)) !important;
    height: calc(100vh - var(--header-height)) !important;
    height: calc(100dvh - var(--header-height)) !important;
  }
  #hero .hero__content {
    padding-top: clamp(72px, 11vh, 120px) !important;
  }
  #hero h1 {
    font-size: clamp(56px, 4.4vw, var(--h1-desktop)) !important;
    line-height: 1.15 !important;
    letter-spacing: -1.5px !important;
  }
  #hero .hero__actions {
    margin-top: 40px !important;
    gap: 18px !important;
  }
  #hero .hero__actions .button {
    min-height: initial !important;
    padding-block: 14px !important;
  }
  #hero .facts {
    margin-top: 40px !important;
    width: min(820px, 70vw) !important;
  }
  #hero .fact { padding-right: 24px !important; }
  #hero .fact + .fact { padding-left: 24px !important; }
  #hero .fact strong {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
  #hero .fact span {
    margin-top: 8px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}

/* 661–760px usable viewport: preserve hierarchy, only tighten spacing. */
@media (min-width: 781px) and (min-height: 661px) and (max-height: 760px) {
  #hero .hero__content {
    padding-top: clamp(38px, 7vh, 54px) !important;
  }
  #hero h1 {
    font-size: clamp(50px, 4.15vw, 60px) !important;
    line-height: 1.08 !important;
  }
  #hero .hero__actions {
    margin-top: 28px !important;
    gap: 14px !important;
  }
  #hero .hero__actions .button {
    min-height: 48px !important;
    padding-block: 11px !important;
  }
  #hero .facts {
    margin-top: 26px !important;
    width: min(800px, 72vw) !important;
  }
  #hero .fact { padding-right: 18px !important; }
  #hero .fact + .fact { padding-left: 18px !important; }
  #hero .fact strong {
    font-size: 14px !important;
    line-height: 1.32 !important;
  }
  #hero .fact span {
    margin-top: 6px !important;
    font-size: 11.5px !important;
    line-height: 1.34 !important;
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}

/* Only genuinely short desktop windows get the compact treatment. */
@media (min-width: 781px) and (max-height: 660px) {
  #hero .hero__content { padding-top: 24px !important; }
  #hero h1 {
    font-size: clamp(44px, 3.8vw, 54px) !important;
    line-height: 1.06 !important;
  }
  #hero .hero__actions { margin-top: 20px !important; gap: 12px !important; }
  #hero .hero__actions .button { min-height: 44px !important; padding-block: 9px !important; }
  #hero .facts { margin-top: 18px !important; width: min(760px, 72vw) !important; }
  #hero .fact { padding-right: 14px !important; }
  #hero .fact + .fact { padding-left: 14px !important; }
  #hero .fact strong { font-size: 12px !important; line-height: 1.25 !important; }
  #hero .fact span {
    margin-top: 4px !important;
    font-size: 9.8px !important;
    line-height: 1.24 !important;
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}


/* v141 — exact bulk-order visual position requested by client. */
#bulk-order .bulk-order__visual {
  top: 0px !important;
  right: -40px !important;
  width: 410px !important;
  height: 410px !important;
}

/* v142 — hide the desktop contact dock a bit more on inner screens */
@media (min-width: 781px) {
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden) {
    transform: translate(68%, -50%) !important;
  }
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):hover,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):focus-within {
    transform: translate(0, -50%) !important;
  }
}

/* v144 — correct integration of the four new transparent benefits illustrations. */
#block-02-benefits .benefits-stage .benefit-card__visual {
  overflow: visible !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 52% 52%, rgba(110, 57, 176, .075), rgba(110, 57, 176, .025) 48%, transparent 74%) !important;
}

#block-02-benefits .benefits-stage .benefit-card__visual .benefit-card__photo {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  transform: none !important;
}

#block-02-benefits .benefit-card--primary .benefit-card__visual {
  width: 50% !important;
  inset: 18px 18px 18px auto !important;
}
#block-02-benefits .benefit-card--primary .benefit-card__photo {
  inset: -4% -5% -5% -5% !important;
  width: 110% !important;
  height: 109% !important;
  object-position: center bottom !important;
}

#block-02-benefits .benefit-card--compare .benefit-card__visual {
  width: 48% !important;
}
#block-02-benefits .benefit-card--compare .benefit-card__photo {
  inset: -5% -7% -6% -7% !important;
  width: 114% !important;
  height: 111% !important;
  object-position: center center !important;
}

#block-02-benefits .benefit-card--custom .benefit-card__visual {
  width: 50% !important;
}
#block-02-benefits .benefit-card--custom .benefit-card__photo {
  inset: -5% -7% -6% -7% !important;
  width: 114% !important;
  height: 111% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

#block-02-benefits .benefit-card--support .benefit-card__visual {
  width: 50% !important;
  inset: 18px 18px 18px auto !important;
  margin: 0 !important;
  height: auto !important;
}
#block-02-benefits .benefit-card--support .benefit-card__photo {
  inset: -5% -7% -6% -7% !important;
  width: 114% !important;
  height: 111% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

@media (max-width: 980px) {
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefit-card--primary .benefit-card__visual,
  #block-02-benefits .benefit-card--compare .benefit-card__visual,
  #block-02-benefits .benefit-card--custom .benefit-card__visual,
  #block-02-benefits .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: clamp(170px, 42vw, 260px) !important;
    margin: 8px 0 0 !important;
  }
}

/* v145 — stronger readable backgrounds for transparent benefits PNGs + flatter archive build */
#block-02-benefits .benefits-stage .benefit-card__visual,
#block-02-benefits .benefit-card--primary .benefit-card__visual,
#block-02-benefits .benefit-card--compare .benefit-card__visual,
#block-02-benefits .benefit-card--custom .benefit-card__visual,
#block-02-benefits .benefit-card--support .benefit-card__visual {
  overflow: hidden !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(158, 126, 230, 0.16) 0%, rgba(158, 126, 230, 0.10) 32%, rgba(255,255,255,0) 68%),
    linear-gradient(180deg, #f6f4fb 0%, #efedf6 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(118, 94, 173, 0.08),
    inset 0 18px 38px rgba(255,255,255,0.72),
    0 16px 34px rgba(28, 18, 52, 0.08) !important;
}

#block-02-benefits .benefits-stage .benefit-card__visual .benefit-card__photo,
#block-02-benefits .benefit-card--primary .benefit-card__photo,
#block-02-benefits .benefit-card--compare .benefit-card__photo,
#block-02-benefits .benefit-card--custom .benefit-card__photo,
#block-02-benefits .benefit-card--support .benefit-card__photo {
  opacity: 1 !important;
  filter: contrast(1.1) saturate(1.02) drop-shadow(0 10px 24px rgba(21, 16, 31, 0.10)) !important;
  mix-blend-mode: normal !important;
}

#block-02-benefits .benefit-card--primary .benefit-card__photo {
  inset: 1% -1% 2% -1% !important;
  width: 102% !important;
  height: 102% !important;
  object-position: center 70% !important;
}

#block-02-benefits .benefit-card--compare .benefit-card__photo {
  inset: 3% 1% 4% 1% !important;
  width: 98% !important;
  height: 98% !important;
  object-position: center center !important;
}

#block-02-benefits .benefit-card--custom .benefit-card__photo {
  inset: 1% 0 1% 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-position: center center !important;
}

#block-02-benefits .benefit-card--support .benefit-card__photo {
  inset: 1% 1% 1% 1% !important;
  width: 98% !important;
  height: 98% !important;
  object-position: center center !important;
}

@media (max-width: 980px) {
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefit-card--primary .benefit-card__visual,
  #block-02-benefits .benefit-card--compare .benefit-card__visual,
  #block-02-benefits .benefit-card--custom .benefit-card__visual,
  #block-02-benefits .benefit-card--support .benefit-card__visual {
    height: clamp(180px, 43vw, 260px) !important;
  }
}


/* v147: fixed benefit card images */
#block-02-benefits .benefits-stage .benefit-card__visual,
#block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
  background: transparent !important;
}
#block-02-benefits .benefits-stage .benefit-card__photo,
#block-02-benefits .benefits-stage .benefit-card--support .benefit-card__photo {
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
#block-02-benefits .benefit-card__visual--sizes .benefit-card__photo--sizes-grid {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#block-02-benefits .benefit-card__visual--compare .benefit-card__photo {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#block-02-benefits .benefit-card__visual--single .benefit-card__photo {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#block-02-benefits .benefit-card__visual--support .benefit-card__photo--resolution {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}


/* v148 — benefits cards: fix text overlap and add subtle hover sway */
#block-02-benefits .benefits-stage .benefit-card,
#block-02-benefits .benefits-stage .benefit-card--primary,
#block-02-benefits .benefits-stage .benefit-card--compare,
#block-02-benefits .benefits-stage .benefit-card--custom,
#block-02-benefits .benefits-stage .benefit-card--support {
  padding: clamp(22px, 1.55vw, 28px) calc(46% + 28px) clamp(22px, 1.55vw, 28px) clamp(22px, 1.7vw, 31px) !important;
}

#block-02-benefits .benefits-stage .benefit-card__title {
  max-width: 320px !important;
}

#block-02-benefits .benefits-stage .benefit-card__text {
  max-width: 340px !important;
}

#block-02-benefits .benefits-stage .benefit-card__visual,
#block-02-benefits .benefit-card--primary .benefit-card__visual,
#block-02-benefits .benefit-card--compare .benefit-card__visual,
#block-02-benefits .benefit-card--custom .benefit-card__visual,
#block-02-benefits .benefit-card--support .benefit-card__visual {
  inset: 24px 24px 24px auto !important;
  width: 41.5% !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(158, 126, 230, 0.16) 0%, rgba(158, 126, 230, 0.10) 32%, rgba(255,255,255,0) 68%),
    linear-gradient(180deg, #f6f4fb 0%, #efedf6 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(118, 94, 173, 0.08),
    inset 0 18px 38px rgba(255,255,255,0.72),
    0 16px 34px rgba(28, 18, 52, 0.08) !important;
  transition: box-shadow .35s ease, transform .35s ease !important;
}

#block-02-benefits .benefit-card--compare .benefit-card__visual {
  width: 43% !important;
}

#block-02-benefits .benefit-card--primary .benefit-card__photo {
  inset: 2% 1% 1% 1% !important;
  width: 98% !important;
  height: 98% !important;
}

#block-02-benefits .benefit-card--compare .benefit-card__photo {
  inset: 3% 2% 3% 2% !important;
  width: 96% !important;
  height: 96% !important;
}

#block-02-benefits .benefit-card--custom .benefit-card__photo {
  inset: 2% 1% 1% 1% !important;
  width: 98% !important;
  height: 98% !important;
}

#block-02-benefits .benefit-card--support .benefit-card__photo {
  inset: 2% 1% 1% 1% !important;
  width: 98% !important;
  height: 98% !important;
}

@media (hover: hover) and (pointer: fine) {
  #block-02-benefits .benefits-stage .benefit-card:hover .benefit-card__visual {
    box-shadow:
      inset 0 0 0 1px rgba(118, 94, 173, 0.10),
      inset 0 18px 38px rgba(255,255,255,0.75),
      0 18px 38px rgba(28, 18, 52, 0.12) !important;
  }

  #block-02-benefits .benefits-stage .benefit-card__photo {
    transform-origin: 50% 55%;
    will-change: transform;
  }

  #block-02-benefits .benefits-stage .benefit-card:hover .benefit-card__photo {
    animation: benefit-card-sway 4.8s ease-in-out infinite;
  }
}

@media (prefers-reduced-motion: reduce) {
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card__photo {
    transition: none !important;
    animation: none !important;
  }
}

@keyframes benefit-card-sway {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  20% { transform: translate3d(-4px, 0, 0) rotate(-1deg); }
  50% { transform: translate3d(4px, 0, 0) rotate(1deg); }
  80% { transform: translate3d(-3px, 0, 0) rotate(-0.8deg); }
}

@media (max-width: 1280px) {
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    padding-right: calc(47% + 24px) !important;
  }

  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefit-card--primary .benefit-card__visual,
  #block-02-benefits .benefit-card--compare .benefit-card__visual,
  #block-02-benefits .benefit-card--custom .benefit-card__visual,
  #block-02-benefits .benefit-card--support .benefit-card__visual {
    width: 40% !important;
  }
}

@media (max-width: 980px) {
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    padding: 22px !important;
  }

  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefit-card--primary .benefit-card__visual,
  #block-02-benefits .benefit-card--compare .benefit-card__visual,
  #block-02-benefits .benefit-card--custom .benefit-card__visual,
  #block-02-benefits .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: clamp(180px, 43vw, 260px) !important;
    margin: 10px 0 0 !important;
  }
}


/* v149 — requested hover motion: slow horizontal floating only, no rotation. */
@media (hover: hover) and (pointer: fine) {
  #block-02-benefits .benefits-stage .benefit-card:hover .benefit-card__photo {
    animation: benefit-card-horizontal-float 6.8s ease-in-out infinite !important;
  }
}

@keyframes benefit-card-horizontal-float {
  0%, 100% { transform: translate3d(0, 0, 0) !important; }
  25% { transform: translate3d(-8px, 0, 0) !important; }
  50% { transform: translate3d(0, 0, 0) !important; }
  75% { transform: translate3d(8px, 0, 0) !important; }
}

@media (prefers-reduced-motion: reduce) {
  #block-02-benefits .benefits-stage .benefit-card:hover .benefit-card__photo {
    animation: none !important;
    transform: none !important;
  }
}


/* v150 — transparent benefit artwork, no panel/glow/border around images. */
#block-02-benefits .benefits-stage .benefit-card__visual,
#block-02-benefits .benefit-card--primary .benefit-card__visual,
#block-02-benefits .benefit-card--compare .benefit-card__visual,
#block-02-benefits .benefit-card--custom .benefit-card__visual,
#block-02-benefits .benefit-card--support .benefit-card__visual {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
#block-02-benefits .benefits-stage .benefit-card__photo,
#block-02-benefits .benefit-card--primary .benefit-card__photo,
#block-02-benefits .benefit-card--compare .benefit-card__photo,
#block-02-benefits .benefit-card--custom .benefit-card__photo,
#block-02-benefits .benefit-card--support .benefit-card__photo {
  filter: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

/* v152 — remove hover shadow/highlight from benefits images, keep only gentle motion. */
@media (hover: hover) and (pointer: fine) {
  #block-02-benefits .benefits-stage .benefit-card:hover .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card:focus-within .benefit-card__visual {
    box-shadow: none !important;
    filter: none !important;
  }
}

/* v153 — dock peeks a bit farther to the right and opens only on hover/focus; hide manual arrow toggle. */
.contact-dock__toggle {
  display: none !important;
}

@media (min-width: 781px) {
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden) {
    transform: translate(78%, -50%) !important;
  }
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):hover,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):focus-within {
    transform: translate(0, -50%) !important;
  }
}

/* v154 — stable hover activation for the partially hidden contact dock. */
.contact-dock-hover-zone {
  display: none;
}

@media (min-width: 781px) {
  .contact-dock-hover-zone {
    position: fixed;
    z-index: 59;
    top: 50%;
    right: 0;
    display: block;
    width: 54px;
    height: 410px;
    transform: translateY(-50%);
    background: transparent;
    pointer-events: auto;
  }

  /* Disable geometry-dependent :hover opening that caused oscillation. */
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden),
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):hover,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden):focus-within {
    transform: translate(78%, -50%) !important;
  }

  /* Open only after JS locks the state from the stable edge zone. */
  .contact-dock.is-auto-peek.is-hover-open:not(.is-collapsed):not(.is-hidden) {
    transform: translate(0, -50%) !important;
  }
}

/* v157: remove outline/border accents from forms and popups */
.lead-modal__dialog,
.exit-modal__dialog,
.map-modal__dialog,
.product-modal__dialog {
  border: 0 !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.50) !important;
}

.lead-modal__close,
.exit-modal__close,
.map-modal__close,
.product-modal__close {
  border: 0 !important;
  box-shadow: none !important;
}

.lead-modal__close:hover,
.exit-modal__close:hover,
.map-modal__close:hover,
.map-modal__close:focus-visible,
.product-modal__close:hover {
  border-color: transparent !important;
  box-shadow: none !important;
}

.lead-form__submit,
.exit-modal__cta,
.map-modal__action,
.product-modal__order {
  border: 0 !important;
  box-shadow: none !important;
}

.lead-form__submit:hover,
.exit-modal__cta:hover,
.map-modal__action:hover,
.map-modal__action:focus-visible,
.product-modal__order:hover {
  border-color: transparent !important;
  box-shadow: none !important;
}

.lead-field input:focus,
.exit-lead-field input:focus,
.exit-lead-field textarea:focus,
#bulk-order .bulk-order-form input:focus,
#bulk-order .bulk-order-form textarea:focus,
#final-request .final-field input:focus,
#final-request .final-field textarea:focus {
  box-shadow: none !important;
}

/* v372 — 1025–1180px adaptation pass requested after v371 review.
   Keep desktop visual language, but remove cramped breakpoint collisions. */
@media (min-width: 1025px) and (max-width: 1180px) {
  /* Hero: restore breathing room between the navigation and H1. */
  #hero .hero__content {
    padding-top: clamp(64px, 9vh, 84px) !important;
  }
  #hero h1 {
    line-height: 1.08 !important;
  }

  /* Catalog: show the complete size illustration instead of cropping it. */
  #catalog .catalog-hero {
    grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr) !important;
    grid-template-areas:
      "copy visual"
      "copy cta" !important;
    gap: 22px 30px !important;
    align-items: center !important;
  }
  #catalog .catalog-hero__visual {
    grid-area: visual !important;
    height: 226px !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f4f4f2 !important;
  }
  #catalog .catalog-hero__visual img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    mix-blend-mode: normal !important;
  }
  #catalog .catalog-price-card {
    grid-area: cta !important;
  }

  /* Large order: the supporting render is decorative and crowds the copy here. */
  #bulk-order .bulk-order__visual {
    display: none !important;
  }
  #bulk-order .bulk-order__inner {
    grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr) !important;
    gap: 24px !important;
  }
  #bulk-order .bulk-order__eyebrow,
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead {
    max-width: 470px !important;
  }

  /* Test sample: preserve the useful explanation but remove the redundant product photo. */
  #test-batch .test-batch__card {
    grid-template-columns: minmax(0, 1.03fr) minmax(350px, .97fr) !important;
    gap: 24px !important;
  }
  #test-batch .test-batch__sample {
    grid-template-columns: 1fr !important;
    padding: 22px 24px !important;
    align-items: center !important;
  }
  #test-batch .test-batch__sample-media {
    display: none !important;
  }
  #test-batch .test-batch__sample-copy {
    width: 100% !important;
  }
  #test-batch .test-batch__sample-title {
    max-width: 360px !important;
    font-size: 24px !important;
  }
  #test-batch .test-batch__outcome {
    grid-template-columns: 24px 1fr !important;
    gap: 11px !important;
    padding: 12px 0 !important;
  }
  #test-batch .test-batch__outcome strong {
    font-size: 13.5px !important;
  }
  #test-batch .test-batch__outcome small {
    font-size: 11px !important;
    line-height: 1.45 !important;
  }

  /* Footer/contact: use the available width instead of a narrow single column. */
  .site-footer__main {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }
  .site-footer__contact {
    width: 100% !important;
    padding: 26px 0 0 !important;
  }
  .footer-contact-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 34px !important;
  }
  .footer-contact-item {
    min-width: 0 !important;
  }
  .footer-socials {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    max-width: 760px !important;
  }
  .site-footer__map-wrap {
    width: 100% !important;
  }
  .footer-map--google,
  .footer-map--google iframe {
    min-height: 440px !important;
  }
}

/* Smooth the exact transition around 1180px so the layout does not jump at 1181. */
@media (min-width: 1181px) and (max-width: 1240px) {
  #catalog .catalog-hero__visual img {
    object-fit: contain !important;
    object-position: center !important;
    mix-blend-mode: normal !important;
  }
  #bulk-order .bulk-order__visual {
    display: none !important;
  }
  #bulk-order .bulk-order__eyebrow,
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead {
    max-width: 470px !important;
  }
}

/* v372.1 — remove the empty gap left by the hidden bulk-order render. */
@media (min-width: 1025px) and (max-width: 1180px) {
  #bulk-order .bulk-order__inner {
    align-items: start !important;
  }
  #bulk-order .bulk-order__copy {
    min-height: 610px !important;
  }
  #bulk-order .bulk-order__horizon {
    top: 282px !important;
    width: min(100%, 470px) !important;
  }
  #bulk-order .bulk-order__timeline {
    bottom: 0 !important;
    max-width: 470px !important;
    gap: 14px !important;
  }
  #bulk-order .bulk-order-step strong {
    font-size: 14px !important;
  }
  #bulk-order .bulk-order-step span {
    max-width: 125px !important;
    font-size: 11px !important;
  }
}

/* v372.2 — keep the cleaned tablet/laptop treatment stable through 1240px. */
@media (min-width: 1181px) and (max-width: 1240px) {
  #test-batch .test-batch__sample {
    grid-template-columns: 1fr !important;
    padding: 22px 24px !important;
  }
  #test-batch .test-batch__sample-media {
    display: none !important;
  }
  #test-batch .test-batch__sample-copy {
    width: 100% !important;
  }
  .site-footer__main {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }
  .site-footer__contact {
    width: 100% !important;
    padding-right: 0 !important;
  }
  .footer-contact-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 34px !important;
  }
  .footer-socials {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-width: 760px !important;
  }
  .footer-map--google,
  .footer-map--google iframe {
    min-height: 440px !important;
  }
}

/* =========================================================
   v373 — responsive architecture cleanup
   Goal: proportional layouts, no decorative media forcing
   awkward stacks, compact contact dock, viewport-safe modals.
   ========================================================= */

/* Compact floating contacts before they start stealing content width. */
@media (max-width: 1240px) {
  .contact-dock {
    top: 50% !important;
    right: max(8px, var(--jp-safe-right)) !important;
    bottom: auto !important;
    left: auto !important;
    width: 58px !important;
    padding: 8px 6px !important;
    border-radius: 18px !important;
    transform: translateY(-50%) !important;
    background: rgba(17,17,19,.94) !important;
    backdrop-filter: blur(14px);
  }
  .contact-dock.is-collapsed { transform: translate(calc(100% - 14px), -50%) !important; }
  .contact-dock.is-hidden { transform: translate(calc(100% + 30px), -50%) !important; opacity: 0 !important; }
  .contact-dock__actions { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  .contact-dock__action {
    width: 46px !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 12px !important;
  }
  .contact-dock__action span { display: none !important; }
  .contact-dock__action svg { width: 23px !important; height: 23px !important; }
  .contact-dock__close {
    top: -13px !important;
    right: -5px !important;
    width: 32px !important;
    height: 32px !important;
  }
  .contact-dock__toggle { display: none !important; }
}

/* Compact laptop / landscape tablet. */
@media (min-width: 1025px) and (max-width: 1240px) {
  /* Header / hero: clear separation and balanced proportions. */
  #hero.hero {
    min-height: 690px !important;
    height: calc(100dvh - var(--header-height)) !important;
    max-height: 820px !important;
  }
  #hero .hero__inner {
    width: calc(100% - 64px) !important;
    grid-template-columns: minmax(390px, 46%) 1fr !important;
  }
  #hero .hero__content { padding-top: clamp(54px, 7vh, 78px) !important; }
  #hero h1 { font-size: clamp(48px, 5vw, 60px) !important; line-height: 1.08 !important; }
  #hero .hero__actions { margin-top: 30px !important; gap: 12px !important; }
  #hero .hero__actions .button { min-width: 0 !important; width: min(100%, 260px) !important; }
  #hero .facts { width: min(720px, 72vw) !important; margin-top: 28px !important; }
  #hero .fact strong { font-size: 14px !important; }
  #hero .fact span { font-size: 12px !important; }
  #hero .product-scene img { object-position: 76% center !important; }

  /* Catalog: keep the illustration contained, never crop it. */
  #catalog .catalog-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(310px, .95fr) !important;
    grid-template-areas: "copy visual" "copy cta" !important;
    gap: 18px 28px !important;
    align-items: center !important;
  }
  #catalog .catalog-hero__visual {
    grid-area: visual !important;
    height: 215px !important;
    padding: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #f5f5f3 !important;
  }
  #catalog .catalog-hero__visual img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
  #catalog .catalog-price-card { grid-area: cta !important; }

  /* Large order: decorative render is removed; information gets the space. */
  #bulk-order .bulk-order__inner {
    grid-template-columns: minmax(0, .9fr) minmax(520px, 1.1fr) !important;
    gap: 30px !important;
    align-items: start !important;
  }
  #bulk-order .bulk-order__copy { min-height: 0 !important; max-width: none !important; }
  #bulk-order .bulk-order__visual { display: none !important; }
  #bulk-order .bulk-order__eyebrow,
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead { max-width: 500px !important; }
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 500px !important;
  }
  #bulk-order .bulk-order__horizon {
    margin-top: 44px !important;
    grid-template-columns: 52px auto 1fr !important;
    gap: 14px !important;
    padding: 20px 22px !important;
  }
  #bulk-order .bulk-order__horizon strong { font-size: clamp(34px, 3.6vw, 46px) !important; white-space: nowrap; }
  #bulk-order .bulk-order__horizon em { max-width: 150px !important; }
  #bulk-order .bulk-order__timeline {
    margin-top: 30px !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 14px !important;
  }
  #bulk-order .bulk-order-step { min-width: 0 !important; }
  #bulk-order .bulk-order-step strong { font-size: 13px !important; }
  #bulk-order .bulk-order-step span { max-width: none !important; font-size: 11px !important; }

  /* Test sample: text is the useful part here; remove redundant product picture. */
  #test-batch .test-batch__card {
    grid-template-columns: minmax(0, .95fr) minmax(390px, 1.05fr) !important;
    gap: 28px !important;
    align-items: center !important;
  }
  #test-batch .test-batch__sample {
    grid-template-columns: 1fr !important;
    padding: 26px 28px !important;
  }
  #test-batch .test-batch__sample-media { display: none !important; }
  #test-batch .test-batch__sample-copy { width: 100% !important; }

  /* Footer: use the width for information instead of a tall single column. */
  .site-footer__main { grid-template-columns: 1fr !important; gap: 24px !important; }
  .site-footer__contact { width: 100% !important; padding-right: 0 !important; }
  .footer-contact-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 34px !important;
  }
  .footer-socials {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    max-width: 900px !important;
  }
  .site-footer__map-wrap { width: 100% !important; }
  .footer-map--google, .footer-map--google iframe { min-height: 360px !important; height: 360px !important; }
}

/* Tablet: media becomes selective instead of being forced into every block. */
@media (min-width: 781px) and (max-width: 1024px) {
  /* Header stays dark and visually related to the page. */
  .site-header, .site-header.has-fixed-nav,
  .header-main { background: #050505 !important; }
  .header-main { box-shadow: 0 8px 24px rgba(0,0,0,.18) !important; }
  .menu-toggle { background: #0b0b0b !important; border-color: rgba(237,33,36,.75) !important; color: #fff !important; }
  .icon-button { color: #fff !important; }
  .mobile-phone { color: var(--brand-red) !important; }

  /* Hero: genuine two-zone composition instead of text -> giant image -> facts. */
  #hero.hero {
    position: relative !important;
    min-height: 700px !important;
    height: 700px !important;
    display: block !important;
    overflow: hidden !important;
  }
  #hero .hero__inner {
    display: block !important;
    width: calc(100% - 52px) !important;
    height: 100% !important;
    margin: 0 auto !important;
  }
  #hero .hero__content {
    display: block !important;
    width: 46% !important;
    padding-top: 54px !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 5 !important;
  }
  #hero h1 {
    width: 100% !important;
    margin: 0 !important;
    font-size: clamp(42px, 5.8vw, 54px) !important;
    line-height: 1.08 !important;
  }
  #hero .hero__actions {
    width: 100% !important;
    margin: 30px 0 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 11px !important;
  }
  #hero .hero__actions .button { width: 100% !important; min-width: 0 !important; min-height: 50px !important; }
  #hero .product-scene {
    position: absolute !important;
    inset: 0 0 0 40% !important;
    width: 60% !important;
    height: 100% !important;
    margin: 0 !important;
    z-index: 1 !important;
  }
  #hero .product-scene::after {
    background: linear-gradient(90deg, #050505 0%, rgba(5,5,5,.8) 12%, rgba(5,5,5,.08) 46%, transparent 72%) !important;
  }
  #hero .hero-scrub-poster { object-fit: cover !important; object-position: 66% center !important; }
  #hero .hero__shade { display: none !important; }
  #hero .facts {
    position: absolute !important;
    z-index: 6 !important;
    left: 26px !important;
    right: 26px !important;
    bottom: 28px !important;
    width: auto !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    background: linear-gradient(90deg, rgba(5,5,5,.92), rgba(5,5,5,.72)) !important;
    border-top: 1px solid rgba(255,255,255,.14);
  }
  #hero .fact { padding: 18px 16px !important; }
  #hero .fact + .fact { border-left: 1px solid rgba(255,255,255,.24) !important; border-top: 0 !important; }
  #hero .fact strong { font-size: 13px !important; }
  #hero .fact span { font-size: 11.5px !important; }

  /* Catalog: illustration is decorative at this width; remove it. */
  #catalog .catalog-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "cta" !important;
    gap: 22px !important;
  }
  #catalog .catalog-hero__visual { display: none !important; }
  #catalog .catalog-price-card {
    grid-area: cta !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 10px 22px !important;
  }
  #catalog .catalog-price-card__button { grid-column: 2 !important; grid-row: 1 / span 2 !important; min-width: 220px !important; }

  /* Bulk order: image hidden, timeline participates in normal flow. */
  #bulk-order .bulk-order__inner { grid-template-columns: 1fr !important; gap: 28px !important; }
  #bulk-order .bulk-order__copy { min-height: 0 !important; max-width: none !important; }
  #bulk-order .bulk-order__visual { display: none !important; }
  #bulk-order .bulk-order__eyebrow,
  #bulk-order .bulk-order__title,
  #bulk-order .bulk-order__lead { max-width: 720px !important; }
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
  }
  #bulk-order .bulk-order__horizon {
    margin-top: 34px !important;
    grid-template-columns: 54px auto 1fr !important;
    gap: 16px !important;
    padding: 20px 24px !important;
  }
  #bulk-order .bulk-order__horizon strong { font-size: clamp(38px, 5.6vw, 50px) !important; white-space: nowrap; }
  #bulk-order .bulk-order__horizon em { max-width: 220px !important; }
  #bulk-order .bulk-order__timeline {
    margin-top: 30px !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 18px !important;
  }
  #bulk-order .bulk-order__timeline::before { left: 20px !important; right: 20px !important; }
  #bulk-order .bulk-order-step { min-width: 0 !important; padding-right: 8px !important; }
  #bulk-order .bulk-order-step strong { font-size: 15px !important; }
  #bulk-order .bulk-order-step span { max-width: none !important; font-size: 12px !important; }
  #bulk-order .bulk-order-card { max-width: none !important; }

  /* Benefits: compact 2x2 cards, not two enormous white slabs. */
  #block-02-benefits .benefits-stage {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    grid-template-rows: auto !important;
    grid-template-areas: "card01 card02" "card03 card04" !important;
    gap: 14px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 165px auto auto !important;
    grid-template-areas: "number" "visual" "title" "text" !important;
    min-height: 0 !important;
    padding: 20px 20px 22px !important;
    gap: 0 !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 165px !important;
    margin: 0 0 16px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__number { margin-bottom: 10px !important; font-size: 30px !important; }
  #block-02-benefits .benefits-stage .benefit-card__title { max-width: none !important; margin-bottom: 9px !important; font-size: 17px !important; }
  #block-02-benefits .benefits-stage .benefit-card__text { max-width: none !important; font-size: 14px !important; }

  /* Product close-up: real grid, no horizontal swipe rail. */
  #product-details .product-details__side {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 14px !important;
    overflow: visible !important;
    min-height: 0 !important;
  }
  #product-details .product-details__side .detail-card {
    width: auto !important;
    min-width: 0 !important;
    min-height: 260px !important;
    flex: none !important;
  }

  /* Test block: text-only sample column. */
  #test-batch .test-batch__card { grid-template-columns: 1fr !important; gap: 20px !important; padding: 28px !important; }
  #test-batch .test-batch__sample { grid-template-columns: 1fr !important; padding: 24px !important; }
  #test-batch .test-batch__sample-media { display: none !important; }
  #test-batch .test-batch__sample-copy { width: 100% !important; }
  #test-batch .test-batch__outcomes { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 0 16px !important; }
  #test-batch .test-batch__outcome { border-top: 0 !important; border-left: 1px solid #2e2e31; padding: 0 0 0 16px !important; }
  #test-batch .test-batch__outcome:first-child { border-left: 0 !important; padding-left: 0 !important; }

  /* Footer: two rows of details + compact social grid. */
  .site-footer__main { grid-template-columns: 1fr !important; gap: 20px !important; }
  .footer-contact-list { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 18px 28px !important; }
  .footer-socials { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 10px !important; }
  .footer-map--google, .footer-map--google iframe { min-height: 330px !important; height: 330px !important; }
}

/* Large mobile / small tablet: prioritize copy, remove nonessential images. */
@media (min-width: 521px) and (max-width: 780px) {
  .site-header, .site-header.has-fixed-nav, .header-main { background: #050505 !important; }
  .menu-toggle { background: #0b0b0b !important; color: #fff !important; border-color: rgba(237,33,36,.72) !important; }

  /* Hero: no awkward standalone picture after CTAs. */
  #hero.hero { min-height: 0 !important; height: auto !important; padding-bottom: 28px !important; }
  #hero .hero__inner { display: block !important; width: 100% !important; }
  #hero .hero__content { display: block !important; width: auto !important; padding: 34px 22px 0 !important; }
  #hero h1 { width: 100% !important; margin: 0 !important; font-size: clamp(42px, 8.2vw, 54px) !important; }
  #hero .hero__actions { width: 100% !important; margin: 26px 0 0 !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  #hero .product-scene { display: none !important; }
  #hero .facts {
    position: static !important;
    width: 100% !important;
    margin: 34px 0 0 !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
  #hero .fact { padding: 16px 14px !important; }
  #hero .fact + .fact { border-left: 1px solid rgba(255,255,255,.26) !important; border-top: 0 !important; }
  #hero .fact strong { font-size: 13px !important; }
  #hero .fact span { font-size: 11.5px !important; }

  /* Benefits: one compact horizontal card per row. */
  #block-02-benefits .benefits-stage { grid-template-columns: 1fr !important; grid-template-rows: auto !important; gap: 12px !important; }
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    display: grid !important;
    grid-template-columns: minmax(0,1.05fr) minmax(210px,.95fr) !important;
    grid-template-rows: auto auto 1fr !important;
    grid-template-areas: "number visual" "title visual" "text visual" !important;
    min-height: 250px !important;
    padding: 20px 22px !important;
    gap: 0 18px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 210px !important;
    margin: 0 !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__title { max-width: none !important; font-size: 17px !important; }
  #block-02-benefits .benefits-stage .benefit-card__text { max-width: none !important; font-size: 14px !important; }

  #catalog .catalog-hero { grid-template-areas: "copy" "cta" !important; }
  #catalog .catalog-hero__visual { display: none !important; }
  #catalog .catalog-price-card { display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important; }
  #catalog .catalog-price-card__button { grid-column: 2 !important; grid-row: 1 / span 2 !important; min-width: 205px !important; }

  #bulk-order .bulk-order__visual { display: none !important; }
  #bulk-order .bulk-order__copy { min-height: 0 !important; }
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline { position: relative !important; inset: auto !important; width: 100% !important; max-width: none !important; }
  #bulk-order .bulk-order__horizon { margin-top: 28px !important; }
  #bulk-order .bulk-order__timeline { margin-top: 28px !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 12px !important; }
  #bulk-order .bulk-order-step { padding-right: 4px !important; }
  #bulk-order .bulk-order-step strong { font-size: 13px !important; }
  #bulk-order .bulk-order-step span { font-size: 11px !important; max-width: none !important; }

  #product-details .product-details__side { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px !important; overflow: visible !important; }
  #product-details .product-details__side .detail-card { min-width: 0 !important; min-height: 245px !important; flex: none !important; }

  #test-batch .test-batch__sample { grid-template-columns: 1fr !important; }
  #test-batch .test-batch__sample-media { display: none !important; }
  #test-batch .test-batch__outcomes { display: grid !important; grid-template-columns: 1fr !important; }

  .footer-contact-list { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 16px 20px !important; }
  .footer-socials { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 9px !important; }
}

/* Phone: simple vertical composition, no decorative media that costs space. */
@media (max-width: 520px) {
  .site-header, .site-header.has-fixed-nav, .header-main { background: #050505 !important; }
  .menu-toggle { background: #0b0b0b !important; color: #fff !important; border-color: rgba(237,33,36,.72) !important; }

  #hero.hero { min-height: 0 !important; height: auto !important; padding-bottom: 24px !important; }
  #hero .hero__inner { display: block !important; width: 100% !important; }
  #hero .hero__content { display: block !important; width: auto !important; padding: 30px 16px 0 !important; }
  #hero h1 { width: 100% !important; margin: 0 !important; font-size: clamp(38px, 11vw, 48px) !important; }
  #hero .hero__actions { width: 100% !important; margin: 24px 0 0 !important; grid-template-columns: 1fr !important; }
  #hero .product-scene { display: none !important; }
  #hero .facts { width: 100% !important; margin: 28px 0 0 !important; grid-template-columns: 1fr !important; }
  #hero .fact { padding: 15px 0 !important; }
  #hero .fact + .fact { border-left: 0 !important; border-top: 1px solid rgba(255,255,255,.24) !important; }

  #block-02-benefits .benefits-stage { grid-template-columns: 1fr !important; gap: 12px !important; }
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 165px auto auto !important;
    grid-template-areas: "number" "visual" "title" "text" !important;
    min-height: 0 !important;
    padding: 18px 16px 20px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 165px !important;
    margin: 0 0 14px !important;
  }

  #catalog .catalog-hero__visual { display: none !important; }
  #catalog .catalog-price-card { display: block !important; }
  #catalog .catalog-price-card__button { width: 100% !important; min-width: 0 !important; }

  #bulk-order .bulk-order__visual { display: none !important; }
  #bulk-order .bulk-order__copy { min-height: 0 !important; }
  #bulk-order .bulk-order__horizon,
  #bulk-order .bulk-order__timeline { position: relative !important; inset: auto !important; width: 100% !important; max-width: none !important; }
  #bulk-order .bulk-order__horizon { margin-top: 24px !important; grid-template-columns: 40px 1fr !important; padding: 16px !important; }
  #bulk-order .bulk-order__horizon strong { font-size: 33px !important; }
  #bulk-order .bulk-order__horizon em { grid-column: 2 !important; max-width: none !important; }
  #bulk-order .bulk-order__timeline { grid-template-columns: 1fr !important; margin-top: 24px !important; gap: 12px !important; }

  #product-details .product-details__side { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; overflow: visible !important; }
  #product-details .product-details__side .detail-card { min-width: 0 !important; min-height: 240px !important; flex: none !important; }

  #test-batch .test-batch__sample { grid-template-columns: 1fr !important; padding: 20px 16px !important; }
  #test-batch .test-batch__sample-media { display: none !important; }

  .footer-contact-list { grid-template-columns: 1fr !important; gap: 14px !important; }
  .footer-socials { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }

  .contact-dock {
    top: auto !important;
    right: 8px !important;
    bottom: calc(10px + var(--jp-safe-bottom)) !important;
    left: auto !important;
    width: 50px !important;
    transform: none !important;
  }
  .contact-dock.is-collapsed { transform: translateX(calc(100% - 12px)) !important; }
  .contact-dock.is-hidden { transform: translateX(calc(100% + 24px)) !important; }
  .contact-dock__action { width: 38px !important; height: 42px !important; min-height: 42px !important; }
}

/* Viewport-safe modals: content first, media only when space allows. */
@media (max-width: 900px) {
  .lead-modal,
  .product-modal,
  .exit-modal,
  .map-modal,
  .info-modal {
    padding: 8px !important;
    overflow-y: auto !important;
    align-items: flex-start !important;
  }
  .lead-modal__dialog,
  .product-modal__dialog,
  .exit-modal__dialog,
  .map-modal__dialog,
  .info-modal__dialog {
    width: min(100%, 590px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    min-height: 0 !important;
    margin: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    grid-template-columns: 1fr !important;
    border-radius: 18px !important;
  }
  .lead-modal__media,
  .product-modal__media,
  .exit-modal__visual { display: none !important; }
  .lead-modal__content,
  .product-modal__content,
  .exit-modal__content { padding: 28px 24px 24px !important; }
  .lead-modal__title,
  .product-modal__title { padding-right: 44px !important; }
  .lead-modal__close,
  .product-modal__close,
  .exit-modal__close,
  .map-modal__close,
  .info-modal__close {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 50 !important;
    width: 38px !important;
    height: 38px !important;
  }
  .lead-modal__text { max-width: none !important; }
  .lead-channel-picker__grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .lead-direct__links { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .product-modal__spec { grid-template-columns: minmax(105px, .8fr) minmax(0,1.2fr) !important; }
}

@media (max-width: 520px) {
  .lead-modal,
  .product-modal,
  .exit-modal,
  .map-modal,
  .info-modal { padding: 6px !important; }
  .lead-modal__dialog,
  .product-modal__dialog,
  .exit-modal__dialog,
  .map-modal__dialog,
  .info-modal__dialog {
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    border-radius: 16px !important;
  }
  .lead-modal__content,
  .product-modal__content,
  .exit-modal__content { padding: 24px 17px 18px !important; }
  .lead-modal__title { font-size: clamp(28px, 8vw, 34px) !important; }
  .lead-modal__text { margin: 11px 0 17px !important; font-size: 13px !important; }
  .lead-channel { min-height: 48px !important; padding: 0 10px !important; font-size: 11px !important; }
  .lead-direct__links { grid-template-columns: 1fr !important; }
  .product-modal__title { font-size: 26px !important; }
  .product-modal__spec { grid-template-columns: 96px 1fr !important; gap: 8px !important; font-size: 11.5px !important; }
}

/* v373.1 — QA fixes found while reproducing the user's 431/655/834/1024/1245 screenshots. */

/* All overlays must sit above the sticky header and floating contact tools. */
.lead-modal,
.map-modal,
.product-modal,
.exit-modal,
.info-modal { z-index: 2200 !important; }

/* 1241–1320 had a two-column footer with only one real content column, leaving a giant hole. */
@media (min-width: 1025px) and (max-width: 1320px) {
  .site-footer__main { grid-template-columns: 1fr !important; gap: 24px !important; }
  .site-footer__contact { width: 100% !important; padding-right: 0 !important; }
  .footer-contact-list {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 18px 34px !important;
  }
  .footer-socials {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 10px !important;
    max-width: 920px !important;
  }
  .site-footer__map-wrap { width: 100% !important; grid-column: 1 !important; }

  #catalog .catalog-hero__visual img {
    object-fit: contain !important;
    object-position: center !important;
  }
  #bulk-order .bulk-order__visual { display: none !important; }
  #test-batch .test-batch__sample-media { display: none !important; }
  #test-batch .test-batch__sample { grid-template-columns: 1fr !important; }
}

/* Tablet hero: facts must be positioned against the hero, not the narrow text column. */
@media (min-width: 781px) and (max-width: 1024px) {
  #hero .hero__content {
    position: static !important;
    width: auto !important;
    padding: 54px 0 0 !important;
  }
  #hero h1,
  #hero .hero__actions { width: 43% !important; }
  #hero .facts {
    left: 26px !important;
    right: 26px !important;
    bottom: 24px !important;
  }
}

/* On phones / small tablets use a tiny bottom contact strip rather than a rail over the copy. */
@media (max-width: 780px) {
  .contact-dock {
    top: auto !important;
    right: max(10px,var(--jp-safe-right)) !important;
    bottom: calc(10px + var(--jp-safe-bottom)) !important;
    left: auto !important;
    width: 166px !important;
    height: 52px !important;
    padding: 5px !important;
    border-radius: 16px !important;
    transform: none !important;
  }
  .contact-dock.is-collapsed { transform: translateX(calc(100% - 34px)) !important; }
  .contact-dock.is-hidden { transform: translateX(calc(100% + 28px)) !important; opacity: 0 !important; }
  .contact-dock__actions {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 5px !important;
  }
  .contact-dock__action {
    width: auto !important;
    min-width: 0 !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
  }
  .contact-dock__action svg { width: 20px !important; height: 20px !important; }
  .contact-dock__close {
    top: -13px !important;
    right: -7px !important;
    width: 30px !important;
    height: 30px !important;
  }
}

/* On very small screens ensure the modal starts at the viewport top and the close control is always visible. */
@media (max-width: 900px) {
  .lead-modal.is-open,
  .product-modal.is-open,
  .exit-modal.is-open,
  .map-modal.is-open,
  .info-modal.is-open { display: flex !important; justify-content: center !important; }
  .lead-modal__dialog,
  .product-modal__dialog,
  .exit-modal__dialog,
  .map-modal__dialog,
  .info-modal__dialog { flex: 0 0 auto !important; }
}

/* v373.2 — final tablet hero layout: use grid flow, never absolute facts inside a transformed content box. */
@media (min-width: 781px) and (max-width: 1024px) {
  #hero .hero__content {
    display: grid !important;
    grid-template-columns: 43% 57% !important;
    grid-template-rows: auto auto 1fr auto !important;
    align-items: start !important;
    width: 100% !important;
    height: 100% !important;
    padding: 54px 0 24px !important;
    margin: 0 !important;
    position: relative !important;
    will-change: auto !important;
  }
  #hero h1 {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
  }
  #hero .hero__actions {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }
  #hero .facts {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    margin: 0 !important;
    align-self: end !important;
  }
}

@media (max-width: 780px) {
  .contact-dock { width: 138px !important; height: 48px !important; padding: 4px !important; }
  .contact-dock__action { height: 38px !important; min-height: 38px !important; }
  .contact-dock__action svg { width: 19px !important; height: 19px !important; }
  .contact-dock__close { width: 27px !important; height: 27px !important; top: -11px !important; }
}

/* v373.3 — anchor clearance and compact dock through the whole compact-laptop range. */
@media (max-width: 1024px) {
  #block-02-benefits,
  #catalog,
  #bulk-order,
  #product-details,
  #test-batch,
  #order-process,
  #final-request,
  #footer { scroll-margin-top: calc(var(--header-top) + 12px) !important; }
}

@media (min-width: 1025px) and (max-width: 1320px) {
  .contact-dock {
    top: 50% !important;
    right: 8px !important;
    width: 58px !important;
    padding: 8px 6px !important;
    border-radius: 18px !important;
    transform: translateY(-50%) !important;
  }
  .contact-dock.is-collapsed { transform: translate(calc(100% - 14px), -50%) !important; }
  .contact-dock__actions { grid-template-columns: 1fr !important; gap: 7px !important; }
  .contact-dock__action {
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
  }
  .contact-dock__action span { display: none !important; }
  .contact-dock__action svg { width: 23px !important; height: 23px !important; }
  .contact-dock__close { width: 32px !important; height: 32px !important; top: -13px !important; right: -5px !important; }
  .contact-dock__toggle { display: none !important; }
}

/* =========================================================
   v374 — mobile quick-contact dock usability
   Restore the wide, easy-to-tap bottom bar and move the close
   control away from Telegram to prevent accidental dismissals.
   ========================================================= */
@media (max-width: 780px) {
  .contact-dock {
    top: auto !important;
    left: 50% !important;
    right: auto !important;
    bottom: calc(10px + var(--jp-safe-bottom)) !important;
    width: min(calc(100vw - 24px), 720px) !important;
    height: 58px !important;
    padding: 5px !important;
    border-radius: 18px !important;
    transform: translateX(-50%) !important;
    background: rgba(17,17,19,.96) !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.34), inset 0 0 0 1px rgba(237,33,36,.46) !important;
  }
  .contact-dock.is-collapsed {
    transform: translate(-50%, calc(100% - 16px)) !important;
  }
  .contact-dock.is-hidden {
    transform: translate(-50%, calc(100% + 34px)) !important;
    opacity: 0 !important;
  }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    height: 100% !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border-radius: 13px !important;
    display: grid !important;
    place-items: center !important;
    touch-action: manipulation;
  }
  .contact-dock__action svg {
    width: 22px !important;
    height: 22px !important;
  }
  .contact-dock__action span { display: none !important; }

  /* The close button is deliberately detached above the LEFT edge.
     It no longer shares the Telegram hit area on the right. */
  .contact-dock__close {
    top: -40px !important;
    left: 0 !important;
    right: auto !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: #111113 !important;
    color: #fff !important;
    border: 1px solid rgba(237,33,36,.78) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.28) !important;
  }
  .contact-dock__close:hover,
  .contact-dock__close:focus-visible {
    background: #ed2124 !important;
  }
  .contact-dock__toggle { display: none !important; }
}

@media (max-width: 430px) {
  .contact-dock {
    width: calc(100vw - 20px) !important;
    bottom: calc(8px + var(--jp-safe-bottom)) !important;
  }
  .contact-dock__actions { gap: 6px !important; }
  .contact-dock__action { height: 46px !important; min-height: 46px !important; }
  .contact-dock__close { top: -38px !important; }
}

/* =========================================================
   v375 — mobile spacing + persistent full-width contact dock
   User-requested polish for real phone use.
   ========================================================= */
@media (max-width: 780px) {
  /* Persistent full-width action bar: no close button on mobile. */
  .contact-dock {
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: calc(68px + var(--jp-safe-bottom)) !important;
    padding: 8px max(10px, var(--jp-safe-right)) calc(8px + var(--jp-safe-bottom)) max(10px, var(--jp-safe-left)) !important;
    border-radius: 18px 18px 0 0 !important;
    transform: none !important;
    opacity: 1 !important;
    background: rgba(16,16,18,.98) !important;
    border: 0 !important;
    border-top: 1px solid rgba(237,33,36,.62) !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.03) !important;
    backdrop-filter: blur(16px) !important;
  }
  .contact-dock.is-collapsed,
  .contact-dock.is-hidden {
    transform: none !important;
    opacity: 1 !important;
  }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    height: 52px !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
    touch-action: manipulation !important;
  }
  .contact-dock__action svg {
    width: 24px !important;
    height: 24px !important;
  }
  .contact-dock__action span { display: none !important; }
  .contact-dock__close,
  .contact-dock__toggle,
  .contact-dock-hover-zone { display: none !important; }

  /* Keep the last footer content reachable above the persistent bar. */
  .site-footer__inner {
    padding-bottom: calc(86px + var(--jp-safe-bottom)) !important;
  }

  /* Product details -> test batch: remove the oversized empty seam. */
  #product-details.product-details { padding-bottom: 20px !important; }
  #test-batch.test-batch { padding-top: 16px !important; }

  /* Order process -> final CTA: tighter, intentional transition. */
  #order-process.order-process { padding-bottom: 20px !important; }
  #final-request.final-request { padding-top: 10px !important; }

  /* Benefit imagery must stay inside its own visual slot; copy starts only after it. */
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__photo,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__photo,
  #block-02-benefits .benefit-card__photo--sizes-grid,
  #block-02-benefits .benefit-card__photo--resolution {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
    margin: 0 !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__title {
    position: relative !important;
    z-index: 2 !important;
    margin-top: 0 !important;
  }
}

@media (max-width: 520px) {
  /* Phone benefit cards: clear image-to-copy separation. */
  #block-02-benefits .benefits-stage .benefit-card,
  #block-02-benefits .benefits-stage .benefit-card--primary,
  #block-02-benefits .benefits-stage .benefit-card--compare,
  #block-02-benefits .benefits-stage .benefit-card--custom,
  #block-02-benefits .benefits-stage .benefit-card--support {
    grid-template-rows: auto 190px auto auto !important;
    grid-template-areas: "number" "visual" "title" "text" !important;
    padding: 18px 16px 22px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__visual,
  #block-02-benefits .benefits-stage .benefit-card--support .benefit-card__visual {
    height: 190px !important;
    margin: 2px 0 18px !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__title {
    margin: 0 0 10px !important;
    line-height: 1.08 !important;
  }
  #block-02-benefits .benefits-stage .benefit-card__text {
    margin: 0 !important;
    line-height: 1.52 !important;
  }

  /* The final CTA should feel full-width, not like a narrow card inside red side rails. */
  #final-request.final-request {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  #final-request .final-request__inner {
    width: 100% !important;
    max-width: none !important;
  }
  #final-request .final-request__card {
    width: 100% !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
  }
  #final-request .final-request__copy {
    padding-left: 22px !important;
    padding-right: 22px !important;
    border-radius: 0 !important;
  }
  #final-request .final-request__form-wrap {
    padding-left: 20px !important;
    padding-right: 20px !important;
    border-radius: 0 !important;
  }
}

/* v375.1 — remove the accidental red side rails around the mobile final CTA. */
@media (max-width: 520px) {
  #final-request.final-request {
    background: #f7f6f3 !important;
  }
}

/* v375.2 — mobile final CTA uses the full width without a red padded frame. */
@media (max-width: 520px) {
  #final-request .final-request__card {
    padding: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }
}

/* v375.3 — explicit breathing room below benefit imagery on narrow phones. */
@media (max-width: 520px) {
  #block-02-benefits .benefits-stage .benefit-card__title {
    margin-top: 8px !important;
  }
}

/* =========================================================
   v376 — phone-landscape / compact-tablet adaptive polish
   - persistent full-width contact dock through 1024px
   - dedicated short-landscape composition
   - compact order-process and final CTA in landscape
   ========================================================= */

/* Treat tablet and landscape-phone widths as touch UI too: the contact bar
   must never become a narrow right rail that covers content. */
@media (max-width: 1024px) {
  .contact-dock {
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: calc(68px + var(--jp-safe-bottom)) !important;
    padding: 8px max(10px,var(--jp-safe-right)) calc(8px + var(--jp-safe-bottom)) max(10px,var(--jp-safe-left)) !important;
    border-radius: 18px 18px 0 0 !important;
    transform: none !important;
    opacity: 1 !important;
    background: rgba(16,16,18,.985) !important;
    border: 0 !important;
    border-top: 1px solid rgba(237,33,36,.62) !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.03) !important;
    backdrop-filter: blur(16px) !important;
    z-index: 1750 !important;
  }
  .contact-dock.is-collapsed,
  .contact-dock.is-hidden {
    transform: none !important;
    opacity: 1 !important;
  }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    height: 52px !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
    touch-action: manipulation !important;
  }
  .contact-dock__action svg { width: 24px !important; height: 24px !important; }
  .contact-dock__action span { display: none !important; }
  .contact-dock__close,
  .contact-dock__toggle,
  .contact-dock-hover-zone { display: none !important; }
  .site-footer__inner { padding-bottom: calc(88px + var(--jp-safe-bottom)) !important; }
}

/* Landscape phones and short tablets need a different composition, not a
   portrait layout squeezed into a short viewport. */
@media (orientation: landscape) and (max-width: 1024px) and (max-height: 600px) {
  :root { --header-top: 64px; }

  .header-main,
  .header-main__inner { min-height: 64px !important; height: 64px !important; }
  .header-main__inner { padding-top: 0 !important; padding-bottom: 0 !important; }
  .brand img { max-height: 36px !important; width: auto !important; }
  .menu-toggle { width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; }

  /* Hero: prioritize offer + actions + three proof points. Product photography
     is decorative here and costs too much vertical space, so hide it. */
  #hero.hero {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 68px !important;
  }
  #hero .hero__inner { display: block !important; width: 100% !important; min-height: 0 !important; }
  #hero .hero__content {
    display: grid !important;
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 18px 28px !important;
    width: 100% !important;
    height: auto !important;
    padding: 24px 24px 20px !important;
    margin: 0 !important;
    position: relative !important;
  }
  #hero h1 {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: clamp(34px,5.2vw,50px) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
  }
  #hero .hero__actions {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
  }
  #hero .hero__actions .button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }
  #hero .product-scene,
  #hero .hero__shade { display: none !important; }
  #hero .facts {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    width: 100% !important;
    margin: 0 !important;
  }
  #hero .fact { padding: 12px 14px !important; }
  #hero .fact:first-child { padding-left: 0 !important; }
  #hero .fact + .fact { border-left: 1px solid rgba(255,255,255,.26) !important; border-top: 0 !important; }
  #hero .fact strong { font-size: 12px !important; line-height: 1.25 !important; }
  #hero .fact span { margin-top: 5px !important; font-size: 10.5px !important; line-height: 1.38 !important; }

  /* The process is wide in landscape: use the width instead of stacking five
     steps vertically. This also removes the large empty tail before the CTA. */
  #order-process.order-process {
    padding-top: 22px !important;
    padding-bottom: 8px !important;
  }
  #order-process .order-process__inner { padding-top: 22px !important; }
  #order-process .order-process__header {
    grid-template-columns: minmax(0,1fr) minmax(240px,.65fr) !important;
    gap: 24px !important;
    margin-bottom: 22px !important;
  }
  #order-process .order-process__eyebrow { grid-column: 1 / -1 !important; margin-bottom: -16px !important; }
  #order-process .order-process__title { font-size: clamp(30px,4.6vw,40px) !important; }
  #order-process .order-process__lead { font-size: 12px !important; }
  #order-process .order-process__timeline {
    display: grid !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    gap: 12px !important;
  }
  #order-process .order-process__timeline::before { display: block !important; left: 21px !important; right: 21px !important; top: 21px !important; }
  #order-process .order-process__step {
    display: block !important;
    padding: 0 4px 8px 0 !important;
    min-width: 0 !important;
  }
  #order-process .order-process__step:not(:last-child)::after { display: none !important; }
  #order-process .order-process__marker {
    width: 42px !important;
    height: 42px !important;
    margin-bottom: 12px !important;
    box-shadow: 0 0 0 5px #f7f7f5 !important;
  }
  #order-process .order-process__marker span { font-size: 12px !important; }
  #order-process .order-process__step h3 { margin: 0 0 5px !important; font-size: 13px !important; line-height: 1.15 !important; }
  #order-process .order-process__step p { max-width: none !important; font-size: 10.5px !important; line-height: 1.4 !important; }

  /* Use horizontal room in the final request instead of a 1000px-tall single
     column. The visual style remains unchanged. */
  #final-request.final-request {
    padding-top: 8px !important;
    padding-bottom: 76px !important;
  }
  #final-request .final-request__card {
    grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr) !important;
    gap: 24px !important;
    min-height: 0 !important;
    padding: 26px 28px !important;
    border-radius: 18px !important;
  }
  #final-request .final-request__title { font-size: clamp(32px,4.5vw,42px) !important; }
  #final-request .final-request__lead { margin-top: 12px !important; font-size: 12px !important; line-height: 1.48 !important; }
  #final-request .final-request__quick { margin-top: 16px !important; gap: 7px !important; }
  #final-request .final-request__quick a { min-height: 34px !important; padding: 0 11px !important; font-size: 10.5px !important; }
  #final-request .final-request__form { gap: 8px !important; }
  #final-request .final-field input { height: 46px !important; font-size: 12px !important; }
  #final-request .final-field textarea { min-height: 76px !important; font-size: 12px !important; }
  #final-request .final-request__submit { min-height: 48px !important; font-size: 12px !important; }

  /* Compact transition from product-details to test and from process to final. */
  #product-details.product-details { padding-bottom: 14px !important; }
  #test-batch.test-batch { padding-top: 12px !important; }
  #order-process + #final-request { margin-top: 0 !important; }

  /* Bottom bar remains full-width but slightly shorter in a short viewport. */
  .contact-dock {
    height: calc(60px + var(--jp-safe-bottom)) !important;
    padding-top: 6px !important;
    padding-bottom: calc(6px + var(--jp-safe-bottom)) !important;
  }
  .contact-dock__actions { height: 48px !important; gap: 8px !important; }
  .contact-dock__action { height: 48px !important; min-height: 48px !important; }
  .contact-dock__action svg { width: 22px !important; height: 22px !important; }
  .site-footer__inner { padding-bottom: calc(80px + var(--jp-safe-bottom)) !important; }
}

/* v376.1 — keep the premium final-request split card in short landscape.
   The animated red mesh belongs to the old version and must not appear as
   side rails around the white/dark split layout. */
@media (orientation: landscape) and (max-width: 1024px) and (max-height: 600px) {
  #final-request .final-request__card {
    padding: 0 !important;
    gap: 0 !important;
    background: #fff !important;
    background-image: none !important;
    animation: none !important;
    border: 1px solid #e7e8eb !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16,17,19,.08) !important;
  }
  #final-request .final-request__copy {
    padding: 26px 26px !important;
    border-radius: 18px 0 0 18px !important;
  }
  #final-request .final-request__form-wrap {
    height: 100% !important;
    padding: 24px !important;
    border-top: 0 !important;
    border-left: 1px solid #ececef !important;
    border-radius: 0 18px 18px 0 !important;
  }
  #order-process .order-process__timeline::after {
    left: 21px !important;
    right: 21px !important;
    top: 21px !important;
  }
}

/* =========================================================
   v377 — real-device landscape fixes + compact principles strip
   - contact dock never becomes a cropped right rail on touch/short viewports
   - final split CTA keeps all four outer corners and tighter vertical rhythm
   - principles shield is anchored left, followed by the text strip
   ========================================================= */

/* Tablet / compact laptop range: if the normal right dock can steal content,
   use the persistent bottom bar instead. */
@media (max-width: 1180px) {
  .contact-dock {
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: calc(68px + var(--jp-safe-bottom)) !important;
    padding: 8px max(10px,var(--jp-safe-right)) calc(8px + var(--jp-safe-bottom)) max(10px,var(--jp-safe-left)) !important;
    border-radius: 18px 18px 0 0 !important;
    transform: none !important;
    opacity: 1 !important;
    background: rgba(16,16,18,.985) !important;
    border: 0 !important;
    border-top: 1px solid rgba(237,33,36,.62) !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.03) !important;
    backdrop-filter: blur(16px) !important;
    z-index: 1750 !important;
  }
  .contact-dock.is-collapsed,
  .contact-dock.is-hidden { transform: none !important; opacity: 1 !important; }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    height: 52px !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
  }
  .contact-dock__action span { display: none !important; }
  .contact-dock__action svg { width: 24px !important; height: 24px !important; }
  .contact-dock__close,
  .contact-dock__toggle,
  .contact-dock-hover-zone { display: none !important; }
}

/* Some Android landscape modes report a much wider CSS viewport than expected.
   Height/orientation therefore also selects the bottom dock, preventing the
   half-visible red rail shown in real-device screenshots. */
@media (orientation: landscape) and (max-height: 720px) and (max-width: 1600px) {
  .contact-dock {
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: calc(60px + var(--jp-safe-bottom)) !important;
    padding: 6px max(10px,var(--jp-safe-right)) calc(6px + var(--jp-safe-bottom)) max(10px,var(--jp-safe-left)) !important;
    border-radius: 16px 16px 0 0 !important;
    transform: none !important;
    opacity: 1 !important;
    background: rgba(16,16,18,.985) !important;
    border: 0 !important;
    border-top: 1px solid rgba(237,33,36,.62) !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.24) !important;
    z-index: 1750 !important;
  }
  .contact-dock.is-collapsed,
  .contact-dock.is-hidden { transform: none !important; opacity: 1 !important; }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    height: 48px !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border-radius: 13px !important;
    display: grid !important;
    place-items: center !important;
  }
  .contact-dock__action span { display: none !important; }
  .contact-dock__action svg { width: 22px !important; height: 22px !important; }
  .contact-dock__close,
  .contact-dock__toggle,
  .contact-dock-hover-zone { display: none !important; }

  /* Guarantee the split CTA is clipped by one shared rounded outer shape.
     This fixes the square top-right and bottom-left corners that appeared on
     intermediate landscape widths. */
  #final-request.final-request {
    padding-top: 8px !important;
    padding-bottom: calc(66px + var(--jp-safe-bottom)) !important;
  }
  #final-request .final-request__inner { overflow: visible !important; }
  #final-request .final-request__card {
    overflow: hidden !important;
    border-radius: 22px !important;
    padding: 0 !important;
    gap: 0 !important;
    background: #fff !important;
    background-image: none !important;
    animation: none !important;
    border: 1px solid #e7e8eb !important;
    box-shadow: 0 18px 44px rgba(16,17,19,.08) !important;
  }
  #final-request .final-request__copy {
    border-radius: 0 !important;
    padding: 24px 26px !important;
  }
  #final-request .final-request__form-wrap {
    border-radius: 0 !important;
    border-top: 0 !important;
    border-left: 1px solid #ececef !important;
    padding: 20px 22px !important;
    min-height: 0 !important;
    height: auto !important;
  }
  #final-request .final-request__form-kicker { margin-top: 0 !important; }
}

/* Principles strip: shield belongs to the strip, not to a separate centered
   position. On compact screens it is pinned left with a 14px gap and the text
   starts immediately after it. The automatic marquee is disabled there so a
   word is never cut at the left edge; users can swipe the text rail instead. */
@media (max-width: 900px) {
  #block-02-benefits .benefits-principles {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    min-height: 58px !important;
    padding: 10px 14px !important;
    overflow: hidden !important;
  }
  #block-02-benefits .benefits-principles > svg {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    color: var(--brand-red) !important;
  }
  #block-02-benefits .jp-marquee__viewport {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
    scrollbar-width: none !important;
    overscroll-behavior-inline: contain;
  }
  #block-02-benefits .jp-marquee__viewport::-webkit-scrollbar { display: none !important; }
  #block-02-benefits .jp-marquee__track {
    animation: none !important;
    transform: none !important;
    column-gap: 0 !important;
  }
  #block-02-benefits .jp-marquee__segment {
    padding-right: 18px !important;
    font-size: 14px !important;
  }
  #block-02-benefits .jp-marquee__segment + .jp-marquee__segment { display: none !important; }
}

@media (max-width: 520px) {
  #block-02-benefits .benefits-principles {
    gap: 12px !important;
    min-height: 54px !important;
    padding: 9px 12px !important;
  }
  #block-02-benefits .benefits-principles > svg {
    flex-basis: 26px !important;
    width: 26px !important;
    height: 26px !important;
  }
}

/* =========================================================
   v378 — compact responsive refinement
   - clearer sticky header separation on dark sections
   - more breathing room in the test-sample block
   - readable full-width hero facts on small tablets
   - tablet hero artwork lifted higher
   - order process uses the available width in two rows
   - persistent full-width contact dock cannot drift off-screen
   ========================================================= */

/* The compact header must read as its own navigation surface even when the
   section below is black. A restrained divider/shadow gives it an edge without
   changing the brand palette. */
@media (max-width: 1180px) {
  html { scroll-padding-top: calc(var(--header-top) + 18px) !important; }
  .site-header,
  .site-header.has-fixed-nav,
  .header-main {
    background: #050505 !important;
  }
  .header-main {
    border-bottom: 1px solid rgba(237,33,36,.22) !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.30), 0 1px 0 rgba(255,255,255,.025) !important;
  }
  .nav-bar.is-open {
    border-top: 1px solid rgba(237,33,36,.20) !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.48) !important;
  }

  /* Make the mobile/tablet contact actions a permanent bottom utility bar.
     Explicitly neutralize every JS state so it cannot become a half-visible
     rail on intermediate widths. */
  .contact-dock,
  .contact-dock.is-auto-peek,
  .contact-dock.is-auto-peek:not(.is-collapsed):not(.is-hidden),
  .contact-dock.is-auto-peek.is-hover-open:not(.is-collapsed):not(.is-hidden),
  .contact-dock.is-collapsed,
  .contact-dock.is-hidden {
    position: fixed !important;
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    inset-inline: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: calc(70px + var(--jp-safe-bottom)) !important;
    padding: 8px max(10px,var(--jp-safe-right)) calc(8px + var(--jp-safe-bottom)) max(10px,var(--jp-safe-left)) !important;
    box-sizing: border-box !important;
    border-radius: 18px 18px 0 0 !important;
    transform: none !important;
    translate: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: rgba(15,15,17,.985) !important;
    border: 0 !important;
    border-top: 1px solid rgba(237,33,36,.58) !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.035) !important;
    z-index: 1750 !important;
  }
  .contact-dock__actions {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 9px !important;
    width: 100% !important;
    height: 54px !important;
  }
  .contact-dock__action {
    width: 100% !important;
    min-width: 0 !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 15px !important;
    touch-action: manipulation !important;
  }
  .contact-dock__action svg { width: 25px !important; height: 25px !important; }
  .contact-dock__action span { display: none !important; }
  .contact-dock__close,
  .contact-dock__toggle,
  .contact-dock-hover-zone { display: none !important; }

  #block-02-benefits,
  #catalog,
  #bulk-order,
  #product-details,
  #test-batch,
  #order-process,
  #final-request,
  #footer { scroll-margin-top: calc(var(--header-top) + 18px) !important; }

  /* Test sample: the picture is already intentionally removed at these widths;
     give the useful checklist more room so it feels designed, not compressed. */
  #test-batch .test-batch__sample {
    padding: 32px 34px !important;
    border-radius: 22px !important;
  }
  #test-batch .test-batch__sample-copy { width: 100% !important; }
  #test-batch .test-batch__sample-kicker {
    display: block !important;
    margin: 0 0 9px !important;
  }
  #test-batch .test-batch__sample-title {
    margin: 0 0 22px !important;
    line-height: 1.08 !important;
  }
  #test-batch .test-batch__outcomes { gap: 0 20px !important; }
  #test-batch .test-batch__outcome {
    min-width: 0 !important;
  }
}

/* Tablet hero: keep the product photography, but lift it so the visual starts
   nearer the heading instead of sitting heavily at the bottom of the scene. */
@media (min-width: 781px) and (max-width: 1024px) {
  #hero .product-scene {
    inset: -6% 0 0 40% !important;
    height: 106% !important;
  }
  #hero .hero-scrub-poster {
    object-position: 66% 40% !important;
  }
  #hero .hero-scrub-canvas,
  #hero .hero-fog-canvas,
  #hero .hero-fog-base { transform: translateY(-1.5%) !important; }

  /* Three compact proof points can remain in one row at tablet width, but use
     the full hero width and avoid unnecessary side padding. */
  #hero .facts {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, rgba(5,5,5,.96), rgba(5,5,5,.78), rgba(5,5,5,.90)) !important;
  }
  #hero .fact:first-child { padding-left: 0 !important; }
  #hero .fact:last-child { padding-right: 0 !important; }

  /* Two-row process: 3 stages on the first row, 2 centered below. */
  #order-process .order-process__timeline {
    display: grid !important;
    grid-template-columns: repeat(6,minmax(0,1fr)) !important;
    gap: 20px 14px !important;
    align-items: stretch !important;
  }
  #order-process .order-process__timeline::before,
  #order-process .order-process__timeline::after { display: none !important; }
  #order-process .order-process__step {
    grid-column: span 2 !important;
    min-width: 0 !important;
    padding: 18px 16px 20px !important;
    border: 1px solid #e2e3e6 !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.72) !important;
  }
  #order-process .order-process__step:nth-child(4) { grid-column: 2 / span 2 !important; }
  #order-process .order-process__step:nth-child(5) { grid-column: 4 / span 2 !important; }
  #order-process .order-process__step:not(:last-child)::after { display: none !important; }
  #order-process .order-process__marker {
    margin: 0 0 14px !important;
  }
  #order-process .order-process__step h3 {
    margin: 0 0 7px !important;
  }
  #order-process .order-process__step p {
    max-width: none !important;
    margin: 0 !important;
  }
}

/* Large phones / narrow tablets: each hero proof point gets its own full-width
   row. This is much easier to scan than three cramped columns. */
@media (min-width: 521px) and (max-width: 780px) {
  #hero .facts {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    margin: 30px 0 0 !important;
    background: transparent !important;
    border-top: 1px solid rgba(255,255,255,.20) !important;
  }
  #hero .fact,
  #hero .fact:first-child,
  #hero .fact:last-child {
    width: 100% !important;
    padding: 16px 0 !important;
  }
  #hero .fact + .fact {
    border-left: 0 !important;
    border-top: 1px solid rgba(255,255,255,.20) !important;
  }
  #hero .fact strong {
    display: block !important;
    width: 100% !important;
    font-size: 15px !important;
    line-height: 1.28 !important;
  }
  #hero .fact strong br { display: none !important; }
  #hero .fact span {
    display: block !important;
    width: 100% !important;
    margin-top: 6px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }

  /* The test checklist becomes a relaxed vertical list at this width. */
  #test-batch .test-batch__sample { padding: 28px 26px !important; }
  #test-batch .test-batch__outcomes {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  #test-batch .test-batch__outcome {
    padding: 17px 0 !important;
    border-left: 0 !important;
    border-top: 1px solid #2e2e31 !important;
  }
  #test-batch .test-batch__outcome:first-child {
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  /* At 521–700 there is not enough width for the 3+2 tablet process. Use a
     balanced 2-column flow; the last stage spans the row. */
  #order-process .order-process__timeline {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 14px !important;
  }
  #order-process .order-process__timeline::before,
  #order-process .order-process__timeline::after { display: none !important; }
  #order-process .order-process__step {
    display: block !important;
    min-width: 0 !important;
    padding: 16px 14px 18px !important;
    border: 1px solid #e2e3e6 !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.72) !important;
  }
  #order-process .order-process__step:nth-child(5) { grid-column: 1 / -1 !important; }
  #order-process .order-process__step:not(:last-child)::after { display: none !important; }
  #order-process .order-process__marker { margin-bottom: 12px !important; }
  #order-process .order-process__step h3 { margin: 0 0 6px !important; }
  #order-process .order-process__step p { max-width: none !important; margin: 0 !important; }
}

@media (max-width: 520px) {
  #test-batch .test-batch__sample { padding: 24px 20px !important; }
  #test-batch .test-batch__sample-title { margin-bottom: 17px !important; }
  #test-batch .test-batch__outcome { padding: 16px 0 !important; }

  /* Keep the phone process linear; cards remove the visual ambiguity of the
     old long timeline and still preserve the natural reading order. */
  #order-process .order-process__timeline::before,
  #order-process .order-process__timeline::after { display: none !important; }
  #order-process .order-process__step {
    padding: 16px !important;
    border: 1px solid #e2e3e6 !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.72) !important;
  }
  #order-process .order-process__step:not(:last-child)::after { display: none !important; }
}

/* Short landscape inherits the same 3+2 process instead of reverting to the
   older five-column squeeze. */
@media (orientation: landscape) and (min-width: 701px) and (max-width: 1024px) and (max-height: 600px) {
  #order-process .order-process__timeline {
    grid-template-columns: repeat(6,minmax(0,1fr)) !important;
    gap: 12px !important;
  }
  #order-process .order-process__step {
    grid-column: span 2 !important;
    padding: 12px !important;
  }
  #order-process .order-process__step:nth-child(4) { grid-column: 2 / span 2 !important; }
  #order-process .order-process__step:nth-child(5) { grid-column: 4 / span 2 !important; }
  #order-process .order-process__marker {
    width: 38px !important;
    height: 38px !important;
    margin-bottom: 8px !important;
  }
  #order-process .order-process__step h3 { font-size: 12px !important; }
  #order-process .order-process__step p { font-size: 10px !important; line-height: 1.35 !important; }
}