/* sections */
.section {
      --section-space: clamp(96px, 8vw, 120px);
      padding: var(--section-space) var(--pad);
    }
    .section-head {
      display: flex;
      justify-content: space-between;
      gap: 24px;
      align-items: baseline;
      font-family: var(--mono);
      color: var(--soft);
      text-transform: uppercase;
      letter-spacing: .1em;
      font-size: 12px;
      margin-bottom: 64px;
    }
    .section-head strong { color: var(--ink); font-weight: 700; }
    .section-head a { color: var(--soft); }
    .rail-section-label {
      margin: 0;
      color: var(--ink);
      font-family: var(--mono);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .1em;
      line-height: 1.2;
      text-transform: uppercase;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 1.3fr .7fr;
      gap: clamp(36px, 8vw, 140px);
      align-items: start;
    }
    .about-grid h2 {
      margin: 0;
      font-size: clamp(38px, 5.2vw, 88px);
      line-height: .98;
      letter-spacing: -.06em;
      font-weight: 430;
      text-wrap: balance;
    }
    .about-delivery {
      max-width: 20ch;
      margin: 34px 0 0;
      color: rgba(255,255,255,.68);
      font-size: clamp(38px, 4.2vw, 76px);
      line-height: .98;
      letter-spacing: -.06em;
      font-weight: 430;
      text-wrap: balance;
    }
    .about-kicker {
      margin: 0 0 20px;
      color: var(--soft);
      font-family: var(--mono);
      font-size: 12px;
      letter-spacing: .11em;
      line-height: 1.2;
      text-transform: uppercase;
    }
    .about-panel {
      color: var(--soft);
      line-height: 1.38;
      font-size: clamp(16px, 1.25vw, 22px);
      letter-spacing: -.025em;
    }
    .about-panel p { margin: 0 0 22px; }
    .service-list { margin-top: 42px; border-top: 1px solid var(--line); }
    .service-list div {
      display: flex;
      justify-content: space-between;
      gap: 18px;
      border-bottom: 1px solid var(--line);
      padding: 17px 0;
      font-family: var(--mono);
      font-size: 12px;
      letter-spacing: .09em;
      text-transform: uppercase;
    }

    .companies {
      position: relative;
      padding-top: var(--section-space);
    }
    .company-intro { margin-bottom: 58px; }
    .company-grid {
      display: grid;
      grid-template-columns: 1fr;
      width: min(1120px, 100%);
      margin-inline: auto;
      border-top: 1px solid rgba(255,255,255,.16);
      border-bottom: 1px solid rgba(255,255,255,.16);
    }
    .company-card {
      position: relative;
      min-height: 92px;
      overflow: hidden;
      display: grid;
      grid-template-columns: 70px minmax(210px, .9fr) minmax(300px, 1fr) minmax(130px, .5fr);
      gap: clamp(18px, 2.4vw, 42px);
      align-items: center;
      padding: 22px 0;
      border-top: 1px solid rgba(255,255,255,.08);
      background: linear-gradient(180deg, transparent, rgba(255,255,255,.018));
      transition: background .2s ease, color .2s ease, padding .2s ease;
    }
    .company-card:first-child { border-top: 0; }
    .company-card::before {
      content: attr(data-category);
      position: relative;
      z-index: 1;
      color: rgba(255,255,255,.44);
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: .12em;
      line-height: 1.2;
      justify-self: end;
      text-align: right;
      text-transform: uppercase;
    }
    .company-card::after {
      content: "";
      position: absolute;
      top: 50%;
      right: clamp(112px, 16vw, 220px);
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: rgba(255,255,255,.68);
      box-shadow: 0 0 0 1px rgba(255,255,255,.18), 80px 0 0 rgba(255,255,255,.16);
      transform: translateY(-50%);
      transition: background .2s ease, transform .2s ease;
    }
    .company-card:hover {
      background: linear-gradient(90deg, rgba(241,255,46,.08), rgba(255,255,255,.025) 46%, transparent);
      padding-left: 14px;
    }
    .company-card:hover::after {
      background: var(--accent);
      transform: translateY(-50%) scale(1.18);
    }
    .company-card span,
    .company-card strong,
    .company-card p {
      position: relative;
      z-index: 2;
    }
    .company-card span {
      font-family: var(--mono);
      font-size: 11px;
      letter-spacing: .12em;
      color: var(--accent);
    }
    .company-card strong {
      display: block;
      font-size: clamp(22px, 2.4vw, 36px);
      line-height: .92;
      letter-spacing: -.065em;
      font-weight: 430;
    }
    .company-card p {
      margin: 0;
      color: #9a9a93;
      font-size: clamp(14px, 1.15vw, 17px);
      line-height: 1.25;
      letter-spacing: -.02em;
    }

    .dispatch-grid {
      display: grid;
      grid-template-columns: 1.35fr .85fr .85fr;
      gap: 14px;
    }
    .dispatch {
      min-height: 360px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      gap: 18px;
      background: #121212;
      border-radius: var(--radius);
      border: 1px solid rgba(255,255,255,.055);
      padding: 22px;
      overflow: hidden;
      position: relative;
      transition: transform .2s ease, background .2s ease;
    }
    .dispatch:hover { transform: translateY(-4px); background: #181818; }
    .dispatch::before {
      content: "";
      position: absolute;
      inset: 0 0 auto;
      height: 58%;
      background: var(--thumb);
      opacity: .88;
      filter: brightness(.75);
    }
    .dispatch h3 {
      position: relative;
      margin: 0;
      font-weight: 430;
      letter-spacing: -.035em;
      line-height: 1.08;
      font-size: clamp(20px, 2vw, 34px);
      max-width: 720px;
    }
    .dispatch p {
      position: relative;
      margin: 0;
      color: #969696;
      max-width: 640px;
      line-height: 1.35;
    }
    .tagrow { position: relative; display: flex; gap: 12px; align-items: center; font-family: var(--mono); color: var(--soft); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
    .tag { background: #242424; color: #fff; padding: 8px 10px; border-radius: 2px; }

    .contact {
      min-height: 72vh;
      display: grid;
      align-items: end;
    }
    .contact h2 {
      margin: 0 0 42px;
      font-size: clamp(44px, 5.6vw, 92px);
      letter-spacing: -.065em;
      line-height: .94;
      font-weight: 420;
    }
    .contact-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
    .contact-card {
      background: #111;
      border: 1px solid rgba(255,255,255,.08);
      border-radius: var(--radius);
      min-height: 190px;
      padding: 22px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      color: var(--soft);
    }
    .contact-card h3 { margin: 0; color: #fff; font-size: 24px; font-weight: 450; letter-spacing: -.03em; }
    .contact-card a { font-family: var(--mono); letter-spacing: .08em; text-transform: uppercase; font-size: 12px; color: var(--accent); }

    .footer {
      padding: 28px var(--pad) 36px;
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      gap: 24px;
      color: #626262;
      font-family: var(--mono);
      font-size: 12px;
      letter-spacing: .06em;
    }
    .footer nav { justify-self: end; display: flex; gap: 34px; }

    @media (max-width: 760px) {
      .company-card {
        grid-template-columns: 46px 1fr;
        gap: 12px 18px;
        padding: 20px 0;
      }
      .company-card:hover { padding-left: 0; }
      .company-card::before {
        grid-column: 2;
        justify-self: start;
        text-align: left;
      }
      .company-card::after { display: none; }
      .company-card p {
        grid-column: 2;
        max-width: 28rem;
      }
    }