html:has(body.about-page) {
  scroll-snap-type: none;
  background: #06100c;
}

body.about-page {
  min-width: 320px;
  color: rgba(244, 247, 244, 0.92);
  background: #06100c;
  overscroll-behavior-y: auto;
}

.about-page::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  content: "";
  background:
    linear-gradient(180deg, rgba(3, 12, 9, 0.56), rgba(3, 12, 9, 0.94)),
    url("./homepage/section-light.png") center / cover;
  pointer-events: none;
}

.about-skip-link {
  position: fixed;
  z-index: 50;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  color: #07100d;
  background: #fff;
  transform: translateY(-150%);
}

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

.about-main,
.about-footer {
  position: relative;
  z-index: 1;
  width: min(100% - 96px, 1160px);
  margin: 0 auto;
}

.about-main { padding: 178px 0 110px; }

.about-hero,
.about-section {
  padding: clamp(42px, 7vw, 92px) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.about-hero {
  padding-top: 0;
  border-top: 0;
}

.about-kicker,
.about-section-kicker {
  margin: 0 0 18px;
  color: rgba(221, 233, 224, 0.62);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.about-hero h1,
.about-section h2 {
  margin: 0;
  color: #f4f7f4;
  font-weight: 560;
  letter-spacing: -0.06em;
}

.about-hero h1 { max-width: none; min-height: 1.96em; font-size: clamp(3.2rem, 7vw, 6.8rem); line-height: 0.98; white-space: nowrap; }
.about-section h2 { max-width: 16ch; font-size: clamp(2rem, 4.2vw, 4rem); line-height: 1.08; }
.about-section--one h2 { max-width: none; white-space: nowrap; }

.about-lead {
  max-width: 18ch;
  margin: 28px 0 0;
  color: rgba(244, 247, 244, 0.86);
  font-size: clamp(1.2rem, 2vw, 1.7rem);
  line-height: 1.5;
}

.about-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(42px, 7vw, 90px);
  max-width: 900px;
  margin: clamp(52px, 7vw, 84px) 0 0;
}

.about-facts div,
.about-direction-grid article { padding: 24px 0; border-top: 1px solid rgba(255, 255, 255, 0.2); }
.about-facts dt { margin-bottom: 8px; color: rgba(221, 233, 224, 0.58); font-size: 12px; letter-spacing: 0.08em; }
.about-facts dd { margin: 0; font-size: clamp(1rem, 1.6vw, 1.18rem); line-height: 1.65; }
.about-facts a,
.about-contact a { text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.3); text-underline-offset: 4px; }

.about-prose { max-width: 710px; margin-top: 30px; }
.about-prose p { margin: 0; color: rgba(237, 242, 238, 0.78); font-size: clamp(1rem, 1.45vw, 1.2rem); line-height: 1.95; }
.about-prose p + p { margin-top: 20px; }
.about-prose strong { color: #f4f7f4; font-weight: 600; }
.about-note { max-width: 710px; margin: 24px 0 0; color: rgba(221, 233, 224, 0.58); font-size: 14px; line-height: 1.75; }

.about-direction-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 64px); margin-top: 40px; }
.about-direction-grid article > span { color: rgba(221, 233, 224, 0.62); font-size: 11px; font-weight: 700; letter-spacing: 0.16em; }
.about-direction-grid h3 { margin: 26px 0 12px; color: #f4f7f4; font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.45; }
.about-direction-grid p { margin: 0; color: rgba(237, 242, 238, 0.68); font-size: 14px; line-height: 1.8; }

.about-quote { color: #f4f7f4 !important; font-size: clamp(1.4rem, 2.4vw, 2rem) !important; font-weight: 560; line-height: 1.55 !important; letter-spacing: -0.04em; }
.about-one-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(32px, 5vw, 74px); max-width: 860px; margin-top: clamp(36px, 5vw, 60px); }
.about-one-details article { padding: 24px 0; border-top: 1px solid rgba(255, 255, 255, 0.2); }
.about-one-details h3 { margin: 0 0 11px; color: #f4f7f4; font-size: clamp(1rem, 1.5vw, 1.2rem); font-weight: 560; letter-spacing: -0.025em; line-height: 1.45; }
.about-one-details p { margin: 0; color: rgba(237, 242, 238, 0.68); font-size: 14px; line-height: 1.8; }
.about-contact { display: grid; gap: 10px; margin-top: 30px; font-size: clamp(1rem, 1.45vw, 1.2rem); line-height: 1.7; }
.about-contact p { margin: 0 0 10px; color: #f4f7f4; font-weight: 600; }
.about-updated { margin: 34px 0 0; color: rgba(221, 233, 224, 0.5); font-size: 12px; letter-spacing: 0.06em; }

.about-footer {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: clamp(30px, 6vw, 88px);
  align-items: center;
  padding: 32px 0 38px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.about-footer-qrs { display: flex; gap: 8px; align-items: flex-start; }
.about-footer-qrs figure { display: grid; gap: 3px; margin: 0; justify-items: center; }
.about-footer-qrs span { display: grid; width: 68px; height: 68px; padding: 7px; place-items: center; border-radius: 8px; background: rgba(5, 12, 10, 0.88); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16); }
.about-footer-qrs img { display: block; width: 100%; height: 100%; object-fit: contain; }
.about-footer-qrs figcaption { color: rgba(255, 255, 255, 0.52); font-size: 7px; letter-spacing: 0.06em; }
.about-footer-legal { display: grid; gap: 3px; justify-items: center; }
.about-footer-legal a { display: inline-flex; gap: 4px; align-items: center; color: rgba(255, 255, 255, 0.42); font-size: 9px; letter-spacing: 0.03em; }
.about-footer-legal a:hover { color: rgba(255, 255, 255, 0.8); }
.about-footer-legal img { width: 11px; height: 11px; opacity: 0.72; }
.about-footer > p { justify-self: end; margin: 0; color: rgba(255, 255, 255, 0.58); font-size: 10px; line-height: 1.7; text-align: right; }
.about-footer > p span { color: rgba(255, 255, 255, 0.42); font-size: 9px; letter-spacing: 0.08em; }

@media (max-width: 760px) {
  .about-main,
  .about-footer { width: min(100% - 40px, 560px); }
  .about-main { padding: 132px 0 56px; }
  .about-hero,
  .about-section { padding: 52px 0; }
  .about-hero h1 { max-width: 10ch; min-height: 0; white-space: normal; }
  .about-facts,
  .about-direction-grid,
  .about-one-details { grid-template-columns: 1fr; gap: 0; }
  .about-facts { margin-top: 44px; }
  .about-direction-grid { margin-top: 28px; }
  .about-direction-grid article { padding: 22px 0; }
  .about-one-details { margin-top: 32px; }
  .about-one-details article { padding: 22px 0; }
  .about-section--one h2 { white-space: normal; }
  .about-footer { grid-template-columns: 1fr; justify-items: center; gap: 22px; padding: 28px 0 36px; }
  .about-footer-qrs,
  .about-footer > p { justify-self: center; }
  .about-footer > p { text-align: center; }
  .about-footer-legal { width: 100%; padding: 20px 0; border-top: 1px solid rgba(255, 255, 255, 0.16); border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
}