.head { position: relative; padding: clamp(56px, 8vw, 110px) var(--pad) clamp(44px, 6vw, 72px); text-align: center; }
.eyebrow { display: block; margin-bottom: 16px; font-size: var(--fs-2xs); letter-spacing: .08em; color: var(--steel); }
h1 { margin: 0 0 18px; font-weight: 700; font-size: var(--fs-title); line-height: 1.22; letter-spacing: -.065em; }
.head p { margin: 0 auto; max-width: 42em; color: var(--dim); line-height: 1.85; font-weight: 300; word-break: keep-all; }
.head.sw h1 { animation: headIn .5s cubic-bezier(.2, .7, .1, 1); }
.pane.sw { animation: headIn .7s .1s cubic-bezier(.2, .7, .1, 1) both; }
@keyframes headIn { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) { .head.sw h1, .pane.sw { animation: none; } }
.tabs { position: sticky; top: 72px; z-index: 5; display: flex; justify-content: center; gap: clamp(28px, 4vw, 56px); margin-top: 0; padding: 0 var(--pad);
  background: rgba(5,7,13,.92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid var(--hair); }
.tabs button { white-space: nowrap; position: relative; padding: 20px 0 18px; border: 0; background: none; color: var(--dim); font: inherit; font-size: var(--fs-md); font-weight: 700; letter-spacing: -.045em; cursor: pointer; transition: color .25s; }
.tabs button::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent-grad); transform: scaleX(0); transform-origin: left; transition: transform .35s; }
.tabs button:hover { color: var(--ivory); }
.tabs button[aria-selected="true"] { color: var(--ivory); }
.tabs button[aria-selected="true"]::after { transform: scaleX(1); }
.pane { padding: clamp(56px, 7vw, 96px) var(--pad) clamp(90px, 11vw, 140px); }
.pane[hidden] { display: none; }
.pane h2 { margin: 0 0 10px; text-align: center; font-size: var(--fs-h3); font-weight: var(--fw-h2); letter-spacing: -.06em; }
.pane .desc { margin: 0 0 clamp(40px, 5vw, 64px); text-align: center; color: var(--dim); font-weight: 300; line-height: 1.8; }
.profile { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: clamp(28px, 4.4vw, 72px); max-width: var(--max-w); margin: 0 auto; }
.profile .photo { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid var(--hair); border-radius: 6px;
  background: radial-gradient(rgba(143,166,196,.16) 1px, transparent 1.2px) 0 0 / 14px 14px, linear-gradient(160deg, #101a2c 0%, var(--ink-2) 70%); }
.profile .photo .no { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; text-align: center; font-size: var(--fs-2xs); color: rgba(163,169,186,.75); }
.profile .photo .no svg { width: 36px; height: 36px; fill: none; stroke: rgba(var(--accent-rgb), .55); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.profile .photo .no b { font-size: var(--fs-xs); color: #cfd3dd; font-weight: 700; }
.profile .photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pane .pf-info h2 { margin: 0; padding-bottom: 24px; text-align: left; font-size: var(--fs-h3); font-weight: 800; letter-spacing: -.05em; border-bottom: 1px solid rgba(243,239,230,.35); }
.pf-table { margin: 0; }
.pf-table div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; padding: 17px 4px; border-bottom: 1px solid var(--hair); font-size: var(--fs-base); line-height: 1.6; }
.pf-table dt { font-weight: 800; color: var(--ivory); }
.pf-table dd { margin: 0; color: #c3c7d4; word-break: keep-all; }
.vision { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: end; gap: 24px clamp(32px, 5vw, 80px); max-width: var(--max-w); margin: 0 auto clamp(64px, 8vw, 110px); padding-bottom: clamp(48px, 6vw, 80px); border-bottom: 1px solid var(--hair); }
.vision .eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
.v-line { margin: 0; font-size: var(--fs-title); font-weight: 700; line-height: 1.32; letter-spacing: -.065em; word-break: keep-all; }
.v-line em { font-style: normal; color: var(--accent); background: var(--accent-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.v-sub { margin: 0; padding-bottom: .5em; font-size: var(--fs-md); line-height: 1.8; font-weight: 300; color: var(--dim); word-break: keep-all; }
.orbit { position: relative; max-width: 1280px; aspect-ratio: 1280 / 660; margin: 0 auto clamp(56px, 7vw, 96px); }
.o-ring, .o-glow, .o-core, .o-node { position: absolute; left: 50%; top: 51.5%; transform: translate(-50%, -50%); border-radius: 50%; }
.o-ring { width: 40.6%; overflow: visible; fill: none; stroke: rgba(var(--accent-rgb), .45); stroke-width: .25; stroke-dasharray: .8 1.2; animation: orbitSpin 90s linear infinite; }
@keyframes orbitSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.o-glow { aspect-ratio: 1; background: radial-gradient(circle, rgba(143,166,196,.10) 0%, rgba(143,166,196,.04) 60%, rgba(143,166,196,0) 72%); }
.o-glow.g1 { width: 34.4%; }
.o-glow.g2 { width: 25.8%; background: rgba(143,166,196,.06); }
.o-core { width: 17.2%; aspect-ratio: 1; display: grid; place-items: center; background: radial-gradient(circle at 50% 35%, #1a2336 0%, var(--ink-2) 75%); border: 1px solid rgba(var(--accent-rgb), .6); box-shadow: 0 0 60px rgba(var(--accent-rgb), .08); }
.o-core img { display: block; width: auto; height: 52%; max-height: 120px; }
.o-core .lg-lt { display: none; }
.o-node { width: 13.3%; aspect-ratio: 1; display: grid; place-content: center; justify-items: center; gap: 6px; padding: 8px; text-align: center; font-family: "Nunito", var(--sans); font-weight: 800; font-size: var(--fs-lead); letter-spacing: -.01em; line-height: 1.25;
  background: var(--ink); border: 1px solid rgba(var(--accent-rgb), .55); transition: background .3s, color .3s, border-color .3s; }
.o-node small { font-family: var(--sans); font-size: var(--fs-2xs); font-weight: 800; color: var(--accent); letter-spacing: .04em; transition: color .3s; }
.o-node:hover { background: var(--accent); color: var(--ink); border-color: var(--accent); }
.o-node:hover small { color: var(--ink); }
.o-node.n1 { top: 12.1%; }
.o-node.n2 { left: 29.7%; }
.o-node.n3 { left: 70.3%; }
.o-desc { position: absolute; margin: 0; transform: translateY(-50%); font-size: var(--fs-sm); line-height: 1.7; color: var(--dim); word-break: keep-all; white-space: nowrap; }
.o-desc::before { content: ""; position: absolute; top: 50%; width: 40px; height: 1px; background: rgba(var(--accent-rgb), .5); }
.o-desc::after { content: ""; position: absolute; top: 50%; width: 5px; height: 5px; margin-top: -2px; border-radius: 50%; background: var(--accent); }
.o-desc.d1 { top: 12.1%; right: 56.7%; padding-right: 56px; text-align: right; }
.o-desc.d2 { top: 51.5%; right: 77%; padding-right: 56px; text-align: right; }
.o-desc.d1::before, .o-desc.d2::before { right: 0; }
.o-desc.d1::after, .o-desc.d2::after { right: 40px; }
.o-desc.d3 { top: 51.5%; left: 77%; padding-left: 56px; }
.o-desc.d3::before { left: 0; }
.o-desc.d3::after { left: 40px; }
@media (max-width: 1100px) { .orbit { display: none; } }
@media (prefers-reduced-motion: reduce) { .o-ring { animation: none; } }
.biz-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 4vw, 64px); max-width: var(--max-w); margin: 0 auto; }
.biz { position: relative; display: flex; flex-direction: column; padding-top: 28px; border-top: 1px solid var(--hair); }
.biz::before { content: ""; position: absolute; left: 0; top: -1px; width: 56px; height: 1px; background: var(--accent-grad); }
.biz .no { align-self: flex-start; font-size: var(--fs-h2); font-weight: 800; line-height: 1; letter-spacing: -.04em; color: var(--accent); background: var(--accent-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.biz h3 { margin: 18px 0 10px; font-family: "Nunito", var(--sans); font-size: var(--fs-h4); font-weight: 800; letter-spacing: -.02em; }
.biz .sum { min-height: 3.3em; margin: 0 0 24px; font-size: var(--fs-base); line-height: 1.65; color: #dcdad3; word-break: keep-all; }
.biz ul { margin: 0; padding: 20px 0 0; list-style: none; display: grid; gap: 11px; border-top: 1px dashed rgba(243,239,230,.1); }
.biz li { position: relative; padding-left: 16px; font-size: var(--fs-sm); line-height: 1.6; color: var(--dim); word-break: keep-all; }
.biz li::before { content: ""; position: absolute; left: 0; top: .78em; width: 6px; height: 1px; background: var(--steel); }
.biz .go { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; margin-top: auto; padding-top: 28px; font-size: var(--fs-xs); font-weight: 700; color: var(--accent); }
.biz .go svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s; }
.biz .go:hover svg { transform: translateX(4px); }
.timeline { position: relative; max-width: 860px; margin: 0 auto; padding: 0; list-style: none; }
.timeline::before { content: ""; position: absolute; left: 118px; top: 10px; bottom: 10px; width: 1px; background: linear-gradient(180deg, var(--accent), rgba(var(--accent-rgb), .1)); }
.yr { position: relative; display: grid; grid-template-columns: 118px 1fr; padding-bottom: clamp(34px, 4vw, 48px); }
.yr > b { font-size: var(--fs-h3); font-weight: 800; letter-spacing: -.035em; color: var(--ivory); line-height: 1; padding-top: 2px; }
.yr:first-child > b { color: var(--accent); }
.yr > b::after { content: ""; position: absolute; left: 114px; top: 8px; width: 9px; height: 9px; border-radius: 50%; background: var(--ink); border: 1.5px solid var(--accent); }
.yr:first-child > b::after { background: var(--accent); box-shadow: 0 0 0 5px rgba(var(--accent-rgb), .18); }
.yr ul { margin: 0; padding: 0 0 0 44px; list-style: none; display: grid; gap: 14px; }
.yr li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; font-size: var(--fs-lead); line-height: 1.6; color: #dcdad3; word-break: keep-all; }
.yr li .k { padding: 3px 8px; font-size: var(--fs-3xs); font-weight: 700; color: var(--steel); border: 1px solid var(--hair); border-radius: 2px; }
.yr li a.k { color: var(--accent); border-color: rgba(var(--accent-rgb), .45); transition: background .25s, color .25s; }
.yr li a.k:hover { background: var(--accent); color: var(--ink); }
.group { display: grid; grid-template-columns: minmax(150px, 220px) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); max-width: var(--max-w); margin: 0 auto; padding: clamp(28px, 3.4vw, 44px) 0; border-top: 1px solid var(--hair); }
.group:last-child { border-bottom: 1px solid var(--hair); }
.gh h3 { margin: 0; font-size: var(--fs-h4); font-weight: 800; letter-spacing: -.03em; }
.gh small { display: block; margin-top: 6px; font-size: var(--fs-4xs); font-weight: 700; letter-spacing: .16em; color: var(--steel); }
.gh .cnt { display: block; margin-top: 16px; font-size: var(--fs-2xs); font-weight: 700; color: var(--accent); }
.cwrap { position: relative; min-width: 0; }
.nav-arr button { position: absolute; z-index: 2; top: calc(50% - 40px); display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: var(--ivory); background: var(--ink-2); border: 1px solid var(--hair); border-radius: 50%; cursor: pointer;
  opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s, color .25s, border-color .25s; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.nav-arr .pv { left: -6px; } .nav-arr .nx { right: -6px; }
.group.more-l .cwrap:hover .pv, .group.more-r .cwrap:hover .nx, .nav-arr button:focus-visible { opacity: 1; visibility: visible; }
.nav-arr button:hover { color: var(--accent); border-color: rgba(var(--accent-rgb), .6); }
@media (hover: none) { .nav-arr { display: none; } }
.nav-arr svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.certs { display: flex; gap: clamp(20px, 2.4vw, 32px); min-width: 0; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding: 0 8px; scrollbar-width: none; padding: 14px 8px 10px; cursor: grab; }
.certs::-webkit-scrollbar { display: none; }
.certs.dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.certs.dragging .cert { pointer-events: none; }
.group { --fade: #000 0%, rgba(0,0,0,.55) 55%, transparent 100%; --fade-w: 80px; }
.group.more-r .certs { -webkit-mask: linear-gradient(90deg, var(--fade)) right / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) left / calc(100% - var(--fade-w)) 100% no-repeat; mask: linear-gradient(90deg, var(--fade)) right / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) left / calc(100% - var(--fade-w)) 100% no-repeat; }
.group.more-l .certs { -webkit-mask: linear-gradient(270deg, var(--fade)) left / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) right / calc(100% - var(--fade-w)) 100% no-repeat; mask: linear-gradient(270deg, var(--fade)) left / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) right / calc(100% - var(--fade-w)) 100% no-repeat; }
.group.more-l.more-r .certs { -webkit-mask: linear-gradient(270deg, var(--fade)) left / var(--fade-w) 100% no-repeat, linear-gradient(90deg, var(--fade)) right / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) center / calc(100% - var(--fade-w) * 2) 100% no-repeat; mask: linear-gradient(270deg, var(--fade)) left / var(--fade-w) 100% no-repeat, linear-gradient(90deg, var(--fade)) right / var(--fade-w) 100% no-repeat, linear-gradient(#000, #000) center / calc(100% - var(--fade-w) * 2) 100% no-repeat; }
.certs .cert { flex: 0 0 220px; scroll-snap-align: start; }
.certs img { -webkit-user-drag: none; user-select: none; }
.cert { display: flex; flex-direction: column; }
.cert .doc { position: relative; aspect-ratio: 3 / 4; display: grid; place-items: center; overflow: hidden; background: #fff; border-radius: 3px;
  box-shadow: 0 14px 28px var(--paper-sh, rgba(0,0,0,.55)), 0 2px 4px var(--paper-sh2, rgba(0,0,0,.4)); transition: transform .45s cubic-bezier(.2, .7, .1, 1), box-shadow .45s; }
.cert:hover .doc, .cert:focus-visible .doc { transform: translateY(-6px); box-shadow: 0 22px 36px var(--paper-sh, rgba(0,0,0,.55)), 0 3px 6px var(--paper-sh2, rgba(0,0,0,.4)); }
.cert .doc svg { width: 40px; height: 40px; fill: none; stroke: rgba(var(--accent-rgb), .65); stroke-width: 1.1; }
.cert .doc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.cert.zoom { cursor: inherit; }
.cert.zoom .doc::after { content: ""; position: absolute; right: 8px; bottom: 8px; width: 28px; height: 28px; border-radius: 50%; opacity: 0; transform: scale(.85); transition: opacity .25s, transform .25s;
  background: rgba(5,7,13,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f3efe6' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m20 20-4.3-4.3M11 8.5v5M8.5 11h5'/%3E%3C/svg%3E") center / 15px no-repeat; }
.cert.zoom:hover .doc::after, .cert.zoom:focus-visible .doc::after { opacity: 1; transform: none; }
.cert.zoom:focus-visible { outline: none; }
.cert.zoom:focus-visible .doc { outline: 1px solid var(--accent); outline-offset: 4px; }
.cert .tx { padding: 18px 4px 0; text-align: center; }
.cert .cat { display: inline-block; margin-bottom: 8px; font-size: var(--fs-3xs); font-weight: 700; color: var(--accent); }
.cert b { display: block; font-size: var(--fs-sm); font-weight: 700; line-height: 1.5; word-break: keep-all; }
.cert .sub { display: block; margin-top: 5px; font-size: var(--fs-xs); color: var(--dim); line-height: 1.5; }
.loc { max-width: var(--max-w); margin: 0 auto; }
.loc figure { position: relative; margin: 0; overflow: hidden; border: 1px solid var(--hair); border-radius: 6px;
  background: radial-gradient(rgba(143,166,196,.16) 1px, transparent 1.2px) 0 0 / 14px 14px, linear-gradient(160deg, #101a2c 0%, var(--ink-2) 70%); }
.loc figure .no { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; text-align: center; font-size: var(--fs-2xs); color: rgba(163,169,186,.75); }
.loc figure .no svg { width: 36px; height: 36px; fill: none; stroke: rgba(var(--accent-rgb), .55); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.loc figure .no b { font-size: var(--fs-xs); color: #cfd3dd; font-weight: 700; }
.loc figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.office { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: clamp(28px, 4.4vw, 72px); }
.office .photo { aspect-ratio: 16 / 10; }
.office .photo iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.office + .office { margin-top: clamp(48px, 6vw, 80px); padding-top: clamp(48px, 6vw, 80px); border-top: 1px solid var(--hair); }
.info .hd { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding-bottom: 24px; border-bottom: 1px solid rgba(243,239,230,.35); }
.info h3 { margin: 0 6px 0 0; font-size: var(--fs-h3); font-weight: 800; letter-spacing: -.05em; }
.hd-logo { display: flex; align-items: center; gap: 11px; line-height: 1; }
.hd-logo .lr > span { display: flex; align-items: center; gap: 11px; }
.info .hd-logo { margin-right: 10px; }
.hd-logo .mk { display: block; height: 38px; width: auto; }
.hd-logo .wm { height: calc(22px * var(--fs)); }
.pill { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 1px 15px 0; line-height: 1; font-size: var(--fs-xs); font-weight: 700; color: var(--accent); background: rgba(var(--accent-rgb), .08); border: 1px solid rgba(var(--accent-rgb), .4); border-radius: 999px; transition: background .25s, color .25s; }
.pill:hover { background: var(--accent); color: var(--ink); }
.pill .ext { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rows { display: grid; margin: 0; }
.rows > div { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 14px; padding: 17px 4px; border-bottom: 1px solid var(--hair); font-size: var(--fs-base); line-height: 1.6; }
.rows dt { display: flex; align-items: center; gap: 10px; align-self: start; font-weight: 800; color: var(--ivory); letter-spacing: -.02em; }
.rows dt svg { flex: none; width: 18px; height: 18px; fill: var(--accent); }
.rows dt { padding-top: 3px; }
.rows dd { margin: 0; color: #c3c7d4; word-break: keep-all; }
.rows dd a:hover { color: var(--accent); }
.rows .sep { margin: 0 10px; color: rgba(163,169,186,.45); }
.rows .ef { font-size: var(--fs-xs); color: var(--dim); }
.rows dd small { margin-left: 10px; font-size: var(--fs-xs); color: var(--dim); white-space: nowrap; }
.rows .nw { white-space: nowrap; }
.rows .copy { display: block; width: fit-content; margin: 8px 0 0; padding: 3px 10px; font: inherit; font-size: var(--fs-2xs); color: var(--dim); background: transparent; border: 1px solid var(--hair); border-radius: 999px; cursor: pointer; transition: color .25s, border-color .25s; }
.rows .copy:hover { color: var(--accent); border-color: var(--accent); }
.rv { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.1,1); }
.rv.in { opacity: 1; transform: none; }
@media (max-width: 900px) {
  .vision { grid-template-columns: 1fr; }
  .profile { grid-template-columns: 1fr; max-width: 640px; }
  .biz-grid { grid-template-columns: 1fr; max-width: 640px; }
  .biz .sum { min-height: 0; }
  .office { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .group { grid-template-columns: 1fr; gap: 18px; }
  .certs .cert { flex-basis: 180px; }
  .tabs { justify-content: flex-start; gap: 24px; overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs button { flex: none; }
  .pf-table div { grid-template-columns: 84px minmax(0, 1fr); }
  .rows .sep { display: none; }
  .rows .nw, .rows dd small { display: block; margin-left: 0; }
  .timeline::before { left: 5px; }
  .yr { grid-template-columns: 1fr; padding-left: 28px; }
  .yr > b { margin-bottom: 14px; }
  .yr > b::after { left: 1px; }
  .yr ul { padding-left: 0; }
  .certs { gap: 10px; }
  .certs .cert { width: calc(50% - 5px); }
  .cert b { font-size: var(--fs-sm); }
}
@media (prefers-reduced-motion: reduce) {
  .rv { opacity: 1; transform: none; transition: none; }
}
