.about-page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  color: #fff;
  background: radial-gradient(circle at 17% 18%, #2a70ff8c 0, transparent 34%), radial-gradient(circle at 84% 70%, #003cbbad 0, transparent 34%), linear-gradient(145deg, #0e60fa, #0750ec 56%, #0340cc);
}

.about-chrome { width: calc(100% - 9.1%); margin-inline: auto; }
.about-header { z-index: 1; flex: none; height: 76px; border-bottom: 1px solid #ffffff24; background: linear-gradient(90deg, #1464f8b8, #0e56ed9c); backdrop-filter: blur(14px); }
.about-header-inner { display: flex; height: 100%; align-items: center; justify-content: space-between; gap: 24px; }
.about-header .brand { --logo-scale: .82; }
.about-back { font-size: 23px; line-height: 1; font-weight: 600; white-space: nowrap; transition: transform .2s, opacity .2s; }
.about-back span { display: inline-block; margin-left: 10px; font-size: 1.3em; font-weight: 400; vertical-align: -.05em; }
.about-back:hover, .about-footer a:hover, .about-consultation:hover { text-decoration-thickness: 2px; text-underline-offset: 5px; text-decoration-line: underline; }
.about-back:hover { transform: translateX(3px); opacity: .86; }

.about-main { position: relative; display: flex; flex: 1; min-height: 0; align-items: center; isolation: isolate; }
.about-main::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; background: linear-gradient(135deg, #ffffff0d, transparent 43%), radial-gradient(ellipse at 54% 42%, #437cfa2d 0, transparent 47%); }
.about-content-shell { position: relative; z-index: 1; width: calc(100% - 12%); margin-inline: auto; }
.about-content { max-width: 1165px; transform: translateY(52px); }
.about-content h1 { margin: 0 0 29px; font-size: 20px; line-height: 1.3; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; }
.about-content p { margin: 0; font-size: clamp(18px, 2.93vh, 30px); line-height: 1.49; font-weight: 400; letter-spacing: -.015em; color: #f6f9ff; text-shadow: 0 3px 18px #002a992b; }
.about-pillar-link { display: inline; padding: 0; border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; line-height: inherit; text-align: inherit; text-decoration: underline; text-decoration-color: #ffeb36; text-decoration-thickness: 2px; text-underline-offset: 5px; transition: color .2s ease, text-decoration-thickness .2s ease; }
.about-pillar-link:hover { color: #ffeb36; text-decoration-thickness: 3px; }
.about-consultation { display: inline-block; margin-top: 53px; font-size: clamp(20px, 2.85vh, 29px); line-height: 1.35; font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; transition: transform .2s, text-shadow .2s; }
.about-consultation:hover { transform: translateY(-2px); text-shadow: 0 5px 15px #001f8555; }
.about-arc { position: absolute; z-index: 0; right: -382px; top: 29%; width: 636px; height: 636px; border: 125px solid #5593ff65; border-radius: 50%; clip-path: inset(0 0 50% 0); filter: drop-shadow(0 15px 18px #002a962c); }
.about-square { position: absolute; z-index: 1; top: 29%; right: 166px; width: 50px; height: 51px; background: linear-gradient(145deg, #fff56d, #ffeb36 65%, #ffde23); box-shadow: inset 0 2px 1px #ffffff89, 0 15px 25px #00268747; }

.about-footer { z-index: 1; flex: none; min-height: 96px; border-top: 1px solid #ffffff16; background: linear-gradient(90deg, #0648df38, #033aba24); }
.about-footer-inner { display: flex; min-height: 96px; align-items: center; justify-content: space-between; gap: 24px; }
.about-footer .brand { --logo-scale: .65; }
.about-footer a:not(.brand) { font-size: 18px; }

.privacy-page { height: auto; min-height: 100dvh; overflow-y: auto; }
.privacy-main { flex: 1; padding-block: clamp(65px, 9vh, 110px); }
.privacy-main h1 { margin: 0 0 28px; font-size: clamp(3rem, 6vw, 5.25rem); line-height: 1; letter-spacing: -.06em; }
.privacy-main p { max-width: 1000px; margin: 0 0 26px; font-size: clamp(1.1rem, 2vw, 1.5rem); line-height: 1.55; }
.privacy-main p a { text-decoration: underline; text-underline-offset: 4px; transition: opacity .2s; }
.privacy-main p a:hover { opacity: .75; }
.privacy-main .about-consultation { margin-top: 15px; }

@media (min-width: 901px) {
  .about-page { height: 100vh; height: 100dvh; overflow: hidden; }
  .privacy-page { height: auto; min-height: 100dvh; overflow-y: auto; }
}

@media (max-width: 900px) {
  .about-chrome { width: calc(100% - 48px); }
  .about-content-shell { width: calc(100% - 72px); }
  .about-content { padding-block: 60px; transform: none; }
  .about-arc { right: -470px; opacity: .5; }
  .about-square { right: 30px; opacity: .85; }
}

@media (max-width: 600px) {
  .about-header { height: 72px; }
  .about-header .brand { --logo-scale: .65; }
  .about-back { font-size: 14px; }
  .about-back span { margin-left: 4px; }
  .about-content-shell { width: calc(100% - 40px); }
  .about-content { padding-block: 68px 50px; }
  .about-content h1 { margin-bottom: 24px; font-size: 14px; }
  .about-content p { font-size: clamp(18px, 4.75vw, 22px); line-height: 1.55; }
  .about-consultation { margin-top: 38px; font-size: 21px; }
  .about-arc, .about-square { display: none; }
  .about-footer, .about-footer-inner { min-height: 72px; }
  .about-footer .brand { --logo-scale: .48; }
  .about-footer a:not(.brand) { font-size: 14px; }
}