/* Nortiva's seven principles: editorial typography and original ImageGen artwork. */
.identity, .identity * { box-sizing: border-box; }
.identity {
  --identity-ink: #101622;
  --identity-muted: #56647a;
  --identity-line: #c7d1e1;
  --identity-surface: #f7f9fc;
  --identity-detail: #e1e9f9;
  --identity-accent: #3156df;
  padding-block: 72px 78px;
  border-color: #d2dbe8;
  background: #edf1f7;
  color: var(--identity-ink);
}
.identity .section-meta { margin-bottom: 37px; }
.identity-heading { display: grid; grid-template-columns: 1.5fr 1fr; align-items: end; gap: 54px; margin-bottom: 35px; }
.identity-heading h2 { font-size: clamp(37px, 3.9vw, 58px); font-weight: 600; line-height: 1.1; letter-spacing: -.045em; }
.identity-heading > p { max-width: 390px; margin: 0 0 3px; color: var(--identity-muted); font-size: 17px; line-height: 1.65; }
.identity-icon { display: block; width: 72px; height: 72px; flex-shrink: 0; object-fit: contain; }
.identity-tabs { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-block: 1px solid var(--identity-line); }
.identity-tab { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; min-width: 0; min-height: 148px; padding: 16px 8px 22px; border: 0; border-right: 1px solid var(--identity-line); background: transparent; color: var(--identity-ink); font-family: var(--nortiva-font-sans); cursor: pointer; }
.identity-tab:last-child { border-right: 0; }
.identity-tab::after { content: ""; position: absolute; left: 15px; right: 15px; bottom: -1px; height: 3px; background: var(--identity-accent); transform: scaleX(0); transform-origin: left; transition: transform 170ms ease; }
.identity-tab__letter { display: block; color: var(--identity-ink); font-size: clamp(67px, 6.7vw, 100px); font-weight: 650; letter-spacing: -.055em; line-height: .93; opacity: .76; transition: color 170ms ease, opacity 170ms ease; }
.identity-tab__name { display: flex; align-items: center; justify-content: center; gap: 7px; color: var(--identity-muted); font-size: 10px; font-weight: 500; line-height: 1.5; white-space: nowrap; }
.identity-tab[aria-selected="true"]::after { transform: scaleX(1); }
.identity-tab[aria-selected="true"] .identity-tab__letter { color: var(--identity-accent); opacity: 1; }
.identity-tab[aria-selected="true"] .identity-tab__name { color: var(--identity-accent); }
.identity-tab:hover .identity-tab__letter { opacity: 1; }
.identity-detail { display: grid; grid-template-columns: minmax(0, 1fr) 230px; align-items: center; gap: 42px; min-height: 264px; padding: 25px 38px; border-bottom: 1px solid var(--identity-line); background: var(--identity-detail); }
.identity-detail__kicker { margin: 0 0 15px; color: var(--identity-accent); font: 11px/1.5 var(--nortiva-font-mono); letter-spacing: .055em; }
.identity-detail__title { margin: 0; font-size: 30px; font-weight: 600; letter-spacing: -.035em; line-height: 1.15; }
.identity-detail__description { max-width: 660px; margin: 18px 0 0; color: var(--identity-muted); font-size: 16px; line-height: 1.7; }
.identity-detail__visual { position: relative; display: grid; place-items: center; min-height: 214px; background: radial-gradient(ellipse, #3156df14, transparent 68%); }
.identity-detail__visual .identity-icon { position: relative; width: 220px; height: 220px; }
.identity-values { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 22px 25px; margin: 32px 0 0; }
.identity-values__item { grid-column: span 3; min-width: 0; min-height: 110px; padding-top: 19px; border-top: 1px solid var(--identity-line); }
.identity-values__item:nth-child(n+5) { grid-column: span 4; }
.identity-values__item[data-active="true"] { border-top-color: var(--identity-accent); }
.identity-values dt { display: flex; align-items: center; gap: 15px; margin: 0; color: var(--identity-ink); }
.identity-values dt .identity-icon { color: var(--identity-accent); }
.identity-values dt strong { font-size: 14px; font-weight: 550; line-height: 1.5; }
.identity-values dd { max-width: 330px; margin: 12px 0 0; color: var(--identity-muted); font-size: 14px; line-height: 1.65; }
.identity :is(button, [tabindex]):focus-visible { outline: 2px solid var(--identity-accent); outline-offset: 5px; }
.identity .identity-detail:focus-visible { outline-offset: -5px; }

html[data-theme="dark"] .identity {
  --identity-ink: #edf3ff;
  --identity-muted: #adbed7;
  --identity-line: #344760;
  --identity-surface: #14243b;
  --identity-detail: #182b47;
  --identity-accent: #8ca9ff;
  border-color: #2b3b54;
  background: #111c2f;
}
html[data-theme="dark"] .identity .identity-detail:focus-visible { outline-offset: -5px; }

@media (max-width: 1100px) {
  .identity-heading { gap: 35px; }
  .identity-tab__name { font-size: 8px; gap: 5px; }
  .identity-detail { grid-template-columns: minmax(0, 1fr) 180px; gap: 25px; padding-inline: 30px; }
  .identity-detail__visual .identity-icon { width: 180px; height: 180px; }
  .identity-values { gap: 20px; }
  .identity-values dt { flex-direction: column; align-items: start; gap: 10px; }
}
@media (max-width: 800px) {
  .identity-heading { grid-template-columns: 1fr; gap: 23px; }
  .identity-heading > p { max-width: 560px; }
  .identity-tab { min-height: 125px; gap: 15px; }
  .identity-tab__letter { font-size: clamp(47px, 8vw, 64px); }
  .identity-detail { grid-template-columns: minmax(0, 1fr) 130px; gap: 20px; }
  .identity-detail__visual .identity-icon { width: 130px; height: 130px; }
  .identity-values__item, .identity-values__item:nth-child(n+5) { grid-column: span 4; }
  .identity-values__item:last-child { grid-column: span 12; min-height: 0; }
  .identity-values__item:last-child dd { max-width: none; }
}
@media (max-width: 640px) {
  .identity { padding-block: 61px 65px; }
  .identity .section-meta { margin-bottom: 31px; }
  .identity-heading { gap: 23px; margin-bottom: 29px; }
  .identity-heading h2 { font-size: 38px; }
  .identity-heading > p { font-size: 16px; }
  .identity-tab { min-height: 82px; padding: 15px 4px; gap: 0; }
  .identity-tab__letter { font-size: clamp(29px, 9.4vw, 52px); }
  .identity-tab__name { display: none; }
  .identity-tab::after { left: 5px; right: 5px; }
  .identity-detail { grid-template-columns: minmax(0, 1fr) 80px; gap: 9px 12px; min-height: 0; padding: 26px 24px; }
  .identity-detail__copy { display: contents; }
  .identity-detail__kicker { grid-column: 1; grid-row: 1; margin: 0; font-size: 10px; }
  .identity-detail__title { grid-column: 1; grid-row: 2; font-size: 27px; }
  .identity-detail__description { grid-column: 1/-1; grid-row: 3; margin-top: 10px; font-size: 15px; }
  .identity-detail__visual { grid-column: 2; grid-row: 1/span 2; min-height: 72px; }
  .identity-detail__visual .identity-icon { width: 80px; height: 80px; }
  .identity-values { gap: 21px 18px; margin-top: 27px; }
  .identity-values__item, .identity-values__item:nth-child(n+5) { grid-column: span 6; min-height: 0; padding-top: 17px; }
  .identity-values__item:last-child { grid-column: span 12; }
  .identity-values dt { flex-direction: column; gap: 10px; align-items: start; }
  .identity-values dt .identity-icon { width: 64px; height: 64px; }
  .identity-values dt strong { font-size: 13px; }
  .identity-values dd { margin-top: 11px; font-size: 13px; line-height: 1.7; }
}
@media (max-width: 400px) {
  .identity-detail__title { grid-column: 1/-1; }
  .identity-detail__visual { grid-row: 1; }
}
@media (max-width: 350px) {
  .identity-detail { grid-template-columns: minmax(0,1fr) 56px; }
  .identity-detail__title { grid-column: 1/-1; }
  .identity-detail__visual { grid-row: 1; min-height: 56px; }
  .identity-detail__visual .identity-icon { width: 56px; height: 56px; }
}
@media (prefers-reduced-motion: reduce) { .identity-tab::after, .identity-tab__letter { transition: none; } }
