.sec--idhero { padding-block: clamp(28px, 3.6cqi, 48px); }

.idhero { display: flex; flex-direction: column; gap: clamp(16px, 2.4vh, 32px); min-height: calc(100svh - 73px - 2 * clamp(28px, 3.6cqi, 48px)); }
.idhero__eyebrow { font: 500 12px var(--font-mono); letter-spacing: .04em; color: var(--k-mute); }
.idhero__title { margin: 0; max-width: 1100px; font: 600 clamp(40px, min(6.4cqi, 11vh), 104px)/0.92 var(--font-sans); letter-spacing: -0.055em; text-wrap: balance; }
.idhero__art { position: relative; width: 100%; flex: 1 1 0; min-height: 110px; max-height: 340px; }
.idhero__art svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.idhero__foot { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px clamp(24px, 4cqi, 64px); align-items: start; border-top: 1px solid var(--k-fg); padding-top: clamp(14px, 2vh, 24px); }
.idhero__sub { margin: 0; font: 400 clamp(16px, min(1.3cqi, 2.4vh), 19px)/1.5 var(--font-sans); letter-spacing: -0.01em; color: var(--k-body); text-wrap: pretty; }
.idhero__meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.idhero__meta-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px solid var(--k-line); }
.idhero__meta-item > span { font: 500 11px var(--font-mono); color: var(--k-mute); }
.idhero__meta-item > b { font: 600 17px/1.3 var(--font-sans); }

.idbefore { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: clamp(32px, 5cqi, 72px); align-items: start; }
.idbefore__figure { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.idbefore__frame { background: var(--white); border-radius: 14px; overflow: hidden; border: 1px solid var(--k-line); }
.idbefore__frame img { display: block; width: 100%; }
.idbefore__cap { font: 500 11px var(--font-mono); color: var(--k-mute); }
.idbefore__body { display: flex; flex-direction: column; gap: 24px; }
.idbefore__text { margin: 0; font: 400 clamp(17px, 1.5cqi, 20px)/1.6 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idbefore__facts { display: flex; flex-direction: column; border-top: 1px solid var(--k-fg); }
.idbefore__fact { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--k-line); }
.idbefore__fact > span:first-child { padding-top: 3px; font: 500 11px var(--font-mono); color: var(--k-mute); }
.idbefore__fact > span:last-child { font: 500 16px/1.45 var(--font-sans); }
.idbefore__quote { margin: 8px 0 0; padding-left: 20px; border-left: 2px solid var(--green); font: 600 clamp(22px, 2.2cqi, 30px)/1.2 var(--font-sans); letter-spacing: -0.025em; text-wrap: balance; }

.idmasters { display: flex; flex-direction: column; gap: 20px; }
.idmasters__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 12px; }
.idmasters__col { display: flex; flex-direction: column; overflow: hidden; border-radius: 16px; background: var(--k-card); }
.idmasters__art { position: relative; aspect-ratio: 16/10; border-bottom: 1px solid var(--k-line); background: var(--white); }
.idmasters__art svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.idmasters__body { display: flex; flex-direction: column; gap: 16px; flex: 1; padding: clamp(24px, 3cqi, 36px); }
.idmasters__role { font: 500 11px var(--font-mono); letter-spacing: .04em; color: var(--k-mute); }
.idmasters__who { font: 600 clamp(30px, 3cqi, 42px)/1 var(--font-sans); letter-spacing: -0.04em; }
.idmasters__text { margin: 0; font: 400 16px/1.55 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idmasters__lead-box { display: flex; flex-direction: column; gap: 6px; }
.idmasters__lead-k { font: 400 15px/1.5 var(--font-sans); color: var(--k-mute); }
.idmasters__lead { margin: 0; font: 600 clamp(20px, 1.8cqi, 24px)/1.3 var(--font-sans); letter-spacing: -0.02em; text-wrap: pretty; }
.idmasters__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--k-line); }
.idmasters__list > li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--k-line); font: 400 15px/1.5 var(--font-sans); }
.idmasters__n { padding-top: 3px; font: 500 11px var(--font-mono); color: var(--k-mute); }
.idmasters__item { display: flex; flex-direction: column; gap: 2px; }
.idmasters__item > b { font-weight: 600; color: var(--k-fg); }
.idmasters__item > span { color: var(--k-body); }
.idmasters__ours { margin: auto 0 0; padding-top: 8px; font: 400 15px/1.5 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idmasters__ours > b { color: var(--k-fg); }
.idmasters__close { margin: 0; font: 400 15px/1.5 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idmasters__note { display: flex; flex-direction: column; gap: 4px; padding-top: 8px; }
.idmasters__note > b { font: 600 14px var(--font-sans); }
.idmasters__note > span { font: 400 13px/1.55 var(--font-sans); color: var(--k-mute); text-wrap: pretty; }

.idpath { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.idpath__step { display: flex; flex-direction: column; overflow: hidden; border-radius: 16px; background: var(--k-card); }
.idpath__art { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 16/9; }
.idpath__n { position: absolute; top: 14px; left: 16px; font: 500 11px var(--font-mono); }
.idpath__logo { display: flex; }
.idpath__logo svg { display: block; flex: none; width: 4.62em; height: .73em; overflow: visible; }
.idpath__word { display: flex; align-items: flex-start; }
.idpath__word > span { font-family: var(--font-sans); font-weight: 600; font-style: normal; line-height: 1; letter-spacing: -0.05em; }
.idpath__word > span.is-italic { font-style: italic; }
.idpath__word svg { flex: none; width: .24em; height: .24em; margin-top: .04em; margin-left: .05em; }
.idpath__body { display: flex; flex-direction: column; gap: 10px; padding: 22px 22px 24px; }
.idpath__k { font: 500 11px var(--font-mono); letter-spacing: .04em; color: var(--k-mute); }
.idpath__t { font: 600 22px/1.15 var(--font-sans); letter-spacing: -0.02em; }
.idpath__d { margin: 0; font: 400 15px/1.55 var(--font-sans); color: var(--k-body); text-wrap: pretty; }

.idmark { display: flex; flex-direction: column; gap: clamp(32px, 5cqi, 64px); }
.idmark__logo { width: min(100%, 900px); }
.idmark__logo img { display: block; width: 100%; }
.idmark__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 24px clamp(32px, 5cqi, 80px); align-items: start; }
.idmark__lead { margin: 0; font: 500 clamp(22px, 2.2cqi, 30px)/1.3 var(--font-sans); letter-spacing: -0.02em; text-wrap: pretty; }
.idmark__body { display: flex; flex-direction: column; gap: 18px; }
.idmark__text { margin: 0; font: 400 17px/1.6 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idmark__forms { display: flex; flex-wrap: wrap; gap: 8px; }
.idmark__form { display: inline-flex; align-items: baseline; padding: 10px 16px; border: 1px solid var(--k-line); border-radius: 999px; font: 600 18px var(--font-sans); letter-spacing: -0.02em; }
.idmark__apos { color: var(--yellow); }
.idmark__suffix { font-weight: 400; }

.idfamily { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--k-line); border-radius: 16px; background: var(--k-line); }
.idfamily__item { display: flex; flex-direction: column; justify-content: space-between; gap: 28px; min-height: 150px; padding: 22px; background: var(--k-card); color: var(--ink); text-align: left; text-decoration: none; }
.idfamily__item:hover { background: var(--white); color: var(--ink); }
.idfamily__mod { font: 500 11px var(--font-mono); color: var(--text-2); }
.idfamily__lockup { display: inline-flex; flex-direction: column; font-size: 26px; }
.idfamily__name { display: flex; align-items: flex-start; }
.idfamily__name > span { font: 400 1em/0.98 var(--font-sans); letter-spacing: -0.045em; }
.idfamily__name svg { flex: none; width: .24em; height: .24em; margin-top: .15em; margin-left: .05em; }

.idgallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.idgallery__item { display: flex; flex-direction: column; margin: 0; overflow: hidden; border-radius: 16px; background: var(--k-card); }
.idgallery__art { position: relative; aspect-ratio: 4/3; }
.idgallery__cap { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 16px 20px 18px; border-top: 1px solid var(--k-line); }
.idgallery__cap > b { font: 600 16px var(--font-sans); }
.idgallery__cap > span { font: 500 11px var(--font-mono); color: var(--k-mute); }

.idglyphs { display: flex; flex-direction: column; gap: 20px; }
.idglyphs__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 12px; }
.idglyphs__item { display: flex; flex-direction: column; gap: 14px; padding: 22px; border: 1px solid var(--k-line); border-radius: 14px; background: var(--k-card); }
.idglyphs__item > svg { display: block; width: 100%; max-width: 180px; height: auto; }
.idglyphs__head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding-top: 12px; border-top: 1px solid var(--k-line); }
.idglyphs__head > b { font: 600 19px var(--font-sans); letter-spacing: -0.02em; }
.idglyphs__head > span { font: 500 11px var(--font-mono); color: var(--k-mute); }
.idglyphs__d { margin: 0; font: 400 15px/1.5 var(--font-sans); color: var(--k-body); text-wrap: pretty; }
.idglyphs__e { margin-top: auto; font: 400 13px/1.45 var(--font-sans); color: var(--k-mute); text-wrap: pretty; }
.idglyphs__rule { margin: 0; max-width: 760px; font: 500 17px/1.5 var(--font-sans); text-wrap: pretty; }