.about-r03 {
  --about-bg: #050505;
  --about-white: #f5f5f5;
  --about-gray: #a6a6a6;
  --about-lime: #c9ff00;
  --about-pad: clamp(22px, 5.2vw, 88px);
  background: var(--about-bg);
  color: var(--about-white);
  font-family: Inter, "Arial", Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow: clip;
}

.about-r03 button { font: inherit; }
.about-r03 ::selection { background: var(--about-lime); color: var(--about-bg); }

.about-r03__hero {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: calc(100svh - var(--head-height));
  padding: 0 var(--about-pad) 22px;
}

.about-r03__topline {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  border-bottom: 1px solid #272727;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 10px;
  color: #b7b7b7;
  font-weight: 600;
}

.about-r03__pip {
  display: inline-block;
  background: var(--about-lime);
  width: 6px;
  height: 6px;
  margin-right: 9px;
  vertical-align: 1px;
}

.about-r03__topline-right { color: #777; }

.about-r03__visual {
  width: 100%;
  height: clamp(295px, 49vh, 525px);
  margin: clamp(4px, 1vh, 12px) auto 0;
  position: relative;
  overflow: hidden;
  flex: none;
  isolation: isolate;
  cursor: crosshair;
}

.about-r03__visual canvas { width: 100%; height: 100%; display: block; }
.about-r03__fallback-word {
  display: none;
  position: absolute;
  inset: 0;
  place-items: center;
  font-size: clamp(120px, 30vw, 450px);
  font-weight: 950;
  letter-spacing: -.07em;
  line-height: .9;
}
.about-r03.is-no-canvas .about-r03__visual canvas { display: none; }
.about-r03.is-no-canvas .about-r03__fallback-word { display: grid; }

.about-r03__identity { margin: 0 auto; text-align: center; width: 100%; max-width: 1200px; }
.about-r03__identity h1 {
  margin: 0;
  text-transform: uppercase;
  font-size: clamp(46px, 6.2vw, 100px);
  letter-spacing: -.047em;
  line-height: .99;
  font-weight: 900;
  text-wrap: balance;
}
.about-r03__identity p { margin: 10px 0 0; color: #d1d1d1; font-size: clamp(13px, 1.12vw, 17px); line-height: 1.4; }

.about-r03__explore { width: min(1150px, 100%); margin: clamp(24px, 3.8vh, 38px) auto 0; }
.about-r03__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; }
.about-r03__tab {
  padding: 12px 0;
  border: 0;
  background: none;
  color: var(--about-white);
  font-size: clamp(15px, 1.36vw, 20px);
  font-weight: 660;
  letter-spacing: .055em;
  cursor: pointer;
  transition: color .22s ease, transform .22s ease;
}
.about-r03__tab:nth-child(1) { text-align: left; transform-origin: left; }
.about-r03__tab:nth-child(2) { text-align: center; transform-origin: center; }
.about-r03__tab:nth-child(3) { text-align: right; transform-origin: right; }
.about-r03__tab:hover,
.about-r03__tab[aria-selected="true"] { color: var(--about-lime); transform: scale(1.02); }
.about-r03__tab:focus-visible { outline: 2px solid var(--about-lime); outline-offset: 4px; border-radius: 0; }

.about-r03__caption-window {
  position: relative;
  min-height: clamp(160px, 20vh, 208px);
  padding: clamp(14px, 2.1vh, 24px) 0 0;
  overflow: visible;
}
.about-r03__caption-copy {
  font-size: clamp(18px, 1.45vw, 23px);
  max-width: 1070px;
  line-height: 1.42;
  letter-spacing: -.014em;
  font-weight: 425;
  margin: 0;
  color: #f1f1f1;
  text-wrap: pretty;
}

.about-r03__footerhint {
  width: min(1150px, 100%);
  margin: auto auto 0;
  padding-top: 10px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 9px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #7d7d7d;
}

.about-r03.is-intro-wait .about-r03__topline,
.about-r03.is-intro-wait .about-r03__identity,
.about-r03.is-intro-wait .about-r03__explore,
.about-r03.is-intro-wait .about-r03__footerhint { opacity: 0; transform: translateY(5px); }
.about-r03__topline,
.about-r03__identity,
.about-r03__explore,
.about-r03__footerhint { transition: opacity .48s ease, transform .52s ease; }

.about-r03__quote-track { position: relative; height: 142svh; border-top: 1px solid #222; }
.about-r03__quote-pin {
  position: sticky;
  top: 0;
  min-height: 100svh;
  padding: clamp(42px, 7vh, 95px) var(--about-pad);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.about-r03__quote-content { width: min(1260px, 85vw); margin: auto; }
.about-r03__quote-statement {
  margin: 0;
  text-align: left;
  font-size: clamp(34px, 4.2vw, 72px);
  font-weight: 850;
  line-height: 1.13;
  letter-spacing: -.037em;
  text-wrap: pretty;
  background-image: linear-gradient(to bottom, var(--about-white) 0%, var(--about-white) var(--reveal, 0%), var(--about-gray) var(--reveal, 0%), var(--about-gray) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
.about-r03__color-sweep {
  white-space: nowrap;
  background-image: linear-gradient(to right, var(--about-lime) 0%, var(--about-lime) var(--color-stop, 0%), transparent var(--color-stop, 0%), transparent 100%), linear-gradient(to bottom, var(--about-white) 0%, var(--about-white) var(--reveal, 0%), var(--about-gray) var(--reveal, 0%), var(--about-gray) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
}

@media (max-height: 825px) and (min-width: 850px) {
  .about-r03__visual { height: clamp(255px, 43vh, 395px); }
  .about-r03__identity h1 { font-size: clamp(42px, 5.8vw, 78px); }
  .about-r03__explore { margin-top: 20px; }
  .about-r03__caption-window { min-height: 125px; }
  .about-r03__caption-copy { font-size: clamp(17px, 1.35vw, 20px); }
}

@media (max-width: 900px) {
  .about-r03__visual { height: clamp(260px, 41vh, 450px); }
  .about-r03__identity h1 { font-size: clamp(44px, 7.5vw, 78px); }
  .about-r03__caption-window { min-height: 175px; }
  .about-r03__quote-content { width: min(86vw, 1260px); }
  .about-r03__quote-statement { font-size: clamp(35px, 5.4vw, 68px); }
}

@media (max-width: 540px) {
  .about-r03 { --about-pad: 22px; }
  .about-r03__hero { min-height: calc(100svh - var(--head-height)); padding-bottom: 28px; }
  .about-r03__topline { min-height: 54px; font-size: 8px; }
  .about-r03__topline-right { font-size: 8px; }
  .about-r03__visual { height: clamp(215px, 31svh, 290px); margin-top: 8px; }
  .about-r03__identity h1 { font-size: clamp(40px, 10.1vw, 58px); letter-spacing: -.035em; }
  .about-r03__identity p { font-size: 12.5px; max-width: 320px; margin: 10px auto 0; }
  .about-r03__explore { margin-top: clamp(25px, 4vh, 38px); }
  .about-r03__tab { font-size: clamp(12px, 3.5vw, 15px); padding: 12px 0; }
  .about-r03__caption-window { min-height: 245px; padding-top: 20px; }
  .about-r03__caption-copy { font-size: clamp(16px, 4.3vw, 19px); line-height: 1.47; }
  .about-r03__footerhint { font-size: 8px; padding-top: 18px; margin-top: 15px; }
  .about-r03__quote-track { height: 128svh; }
  .about-r03__quote-pin { padding: 45px var(--about-pad); }
  .about-r03__quote-content { width: 100%; }
  .about-r03__quote-statement { font-size: clamp(32px, 8.5vw, 48px); line-height: 1.14; }
}

@media (max-width: 360px) {
  .about-r03__visual { height: 216px; }
  .about-r03__identity h1 { font-size: 37px; }
  .about-r03__caption-window { min-height: 285px; }
  .about-r03__caption-copy { font-size: 16px; }
  .about-r03__quote-statement { font-size: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .about-r03 *, .about-r03 *::before, .about-r03 *::after { animation: none !important; transition: none !important; }
  .about-r03.is-intro-wait .about-r03__topline,
  .about-r03.is-intro-wait .about-r03__identity,
  .about-r03.is-intro-wait .about-r03__explore,
  .about-r03.is-intro-wait .about-r03__footerhint { opacity: 1 !important; transform: none !important; }
  .about-r03__quote-track { height: auto; min-height: 82svh; }
  .about-r03__quote-pin { position: relative; min-height: 82svh; }
  .about-r03__quote-statement { --reveal: 100% !important; }
  .about-r03__color-sweep { --color-stop: 100% !important; }
}
