/* Riku Wave ID: one face, four open questions, no product mechanics disclosed. */
.rwid-page { --oi-margin: var(--gutter); }
.rwid-page main { overflow: clip; }
.rwid-page .oi-section { position: relative; padding: 126px var(--oi-margin); min-height: calc(100svh - var(--header)); background: transparent; }
.rwid-page h1,.rwid-page h2 { color: var(--text); font-weight: 250; }
.rwid-page h2 { font-size: clamp(42px,4.6vw,70px); line-height: 1.43; letter-spacing: -.055em; }
.rwid-page .oi-hero { display: flex; flex-direction: column; min-height: calc(100svh - var(--header)); padding: 32px var(--oi-margin) 0; }
.oi-breadcrumb { display: flex; align-items: center; gap: 17px; color: var(--dawn-dim); font: 10px/1.5 Arial,sans-serif; letter-spacing: .12em; }
.oi-breadcrumb > a { color: var(--sub); }
.oi-state { display: flex; align-items: center; gap: 10px; margin-left: auto; color: var(--sub); font: 11px/1.5 "Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; letter-spacing: .07em; }
.oi-state::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--dawn-warm); }
.oi-hero-grid { display: flex; align-items: center; flex: 1; min-height: 605px; padding: 88px 0 108px; }
.oi-hero-copy { position: relative; width: min(650px,51%); }
.oi-hero-copy > .eyebrow { margin-bottom: 33px; }
.rwid-page .oi-hero h1 { font-size: clamp(72px,7.8vw,120px); font-weight: 230; line-height: 1.08; letter-spacing: -.065em; white-space: nowrap; margin-left: -.035em; }
.oi-hero-statement { margin-top: 37px; font-size: clamp(26px,2.75vw,42px); font-weight: 270; line-height: 1.58; letter-spacing: -.02em; }
.oi-hero-copy > .text-link { gap: 54px; margin-top: 33px; font-size: 13px; }
.oi-hero-bottom { display: flex; justify-content: space-between; align-items: baseline; gap: 25px; border-top: 1px solid var(--line); padding: 23px 0 36px; color: var(--dawn-dim); font-size: 11px; letter-spacing: .025em; }
.oi-hero-bottom > p { font-size: inherit; }
.oi-hero-bottom > a { display: inline-flex; align-items: center; gap: 27px; min-height: 24px; color: var(--sub); font-size: 10px; letter-spacing: .1em; }
.rwid-page .oi-why { display: grid; grid-template-columns: minmax(0,.38fr) minmax(0,1fr); gap: 8%; align-items: center; min-height: 105svh; }
.oi-section-label { align-self: start; display: flex; align-items: baseline; gap: 28px; padding-top: 15px; color: var(--dawn-warm); }
.oi-section-label > .eyebrow,.oi-section-label > span { font: 10px/1.8 Arial,sans-serif; letter-spacing: .15em; }
.oi-section-label > span { color: var(--dawn-dim); }
.oi-why-grid { width: 100%; }
.oi-presence { padding: 0; margin: 0; }
.oi-identity-list > div { position: relative; display: grid; grid-template-columns: 35px minmax(0,1fr) auto; gap: 28px; align-items: baseline; padding: 33px 0 41px; border-top: 1px solid var(--line); }
.oi-identity-list > div > span { color: var(--dawn-warm); font: 10px/1.5 Arial,sans-serif; letter-spacing: .05em; }
.oi-identity-list strong { color: var(--text); font-size: clamp(34px,3.5vw,53px); font-weight: 260; line-height: 1.45; letter-spacing: -.045em; }
.oi-identity-list small { color: var(--sub); font: 9px/1.5 Arial,sans-serif; letter-spacing: .14em; padding-bottom: 4px; }
.rwid-page .oi-invitation { display: flex; align-items: center; min-height: 90svh; }
.oi-invitation > div { max-width: 590px; }
.oi-invitation h2 { margin-top: 34px; }
.oi-invitation .text-link { gap: 66px; margin-top: 39px; color: var(--sub); font-size: 13px; }
@media (max-width: 1100px) {
  .oi-hero-copy { width: 58%; }
  .rwid-page .oi-why { grid-template-columns: .24fr 1fr; gap: 8%; }
  .oi-section-label { flex-direction: column; gap: 13px; }
  .oi-identity-list > div { gap: 19px; }
}
@media (max-width: 760px) {
  .rwid-page { --oi-margin: 6%; }
  .rwid-page .oi-hero { min-height: 106svh; padding-top: 28px; }
  .oi-breadcrumb { gap: 9px; font-size: 9px; letter-spacing: .08em; }
  .oi-state { gap: 8px; font-size: 10px; }
  .oi-hero-grid { align-items: flex-start; min-height: 645px; padding: 67px 0 285px; }
  .oi-hero-copy { width: 100%; }
  .oi-hero-copy > .eyebrow { margin-bottom: 28px; }
  .rwid-page .oi-hero h1 { font-size: clamp(56px,15.4vw,92px); letter-spacing: -.06em; }
  .oi-hero-statement { margin-top: 26px; font-size: 27px; line-height: 1.65; }
  .oi-hero-copy > .text-link { margin-top: 23px; gap: 42px; }
  .oi-hero-bottom { gap: 15px; padding-block: 22px 34px; font-size: 10px; }
  .oi-hero-bottom > a { gap: 18px; font-size: 9px; }
  .rwid-page .oi-section { padding-block: 93px; }
  .rwid-page .oi-why { display: flex; flex-direction: column; align-items: stretch; gap: 48px; min-height: 99svh; }
  .oi-section-label { width: 100%; flex-direction: row; justify-content: space-between; padding: 0; }
  .oi-section-label > .eyebrow,.oi-section-label > span { font-size: 9px; }
  .oi-identity-list > div { grid-template-columns: 22px minmax(0,1fr) auto; gap: 12px; padding-block: 29px 34px; }
  .oi-identity-list strong { font-size: clamp(27px,7.4vw,36px); }
  .oi-identity-list small { font-size: 8px; letter-spacing: .09em; }
  .rwid-page .oi-invitation { align-items: flex-start; min-height: 105svh; padding-bottom: 300px; }
  .rwid-page h2 { font-size: clamp(33px,9.1vw,50px); line-height: 1.48; }
  .oi-invitation .text-link { font-size: 12px; margin-top: 31px; gap: 44px; }
}
@media (max-width: 360px) {
  .oi-identity-list > div { grid-template-columns: 18px minmax(0,1fr); gap: 7px 13px; }
  .oi-identity-list small { grid-column: 2; }
}