/* About-only styles. Shared navigation, footer and homepage remain untouched. */
.smc-about { --ab-navy:#072950; --ab-gold:#b88100; color:var(--ab-navy); overflow:clip; background:#fff; font-family:inherit }
.smc-about *, .smc-about *::before, .smc-about *::after { box-sizing:border-box }
.smc-about [hidden] { display:none!important }
.smc-about .smca-wrap { display:block; width:min(1320px,100%); padding-inline:28px; margin-inline:auto; min-width:0 }
.smc-about .about-space { padding-block:72px }
.smc-about h1,.smc-about h2,.smc-about h3,.smc-about p,.smc-about figure { margin:0 }
.smc-about h2 { font-size:clamp(27px,3.2vw,40px); font-weight:800; line-height:1.2; letter-spacing:-.025em; color:var(--ab-navy) }
.smc-about h2 em { color:var(--ab-gold); font-style:normal }
.smc-about h3 { font-size:20px; line-height:1.35; font-weight:800; color:var(--ab-navy) }
.smc-about p { color:#4b6078; font-size:15px; line-height:1.8 }
.smc-about .about-eyebrow { display:flex; align-items:center; gap:12px; color:#956700; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; margin-bottom:12px }
.smc-about .about-eyebrow::after { content:''; width:46px; height:2px; background:#dfb443 }
.smc-about .smca-heading { text-align:center; max-width:780px; margin:0 auto 36px }
.smc-about .smca-heading .about-eyebrow { justify-content:center }
.smc-about .smca-heading p:last-child { margin-top:14px }
.smc-about a { text-decoration:none }
.smc-about button { font:inherit; cursor:pointer }
.smc-about :is(a,button):focus-visible { outline:3px solid #126fea; outline-offset:5px }
.smc-about .about-hero { display:grid; grid-template-columns:33% minmax(0,1fr); background:linear-gradient(130deg,#063d75,#061d38); position:relative; isolation:isolate }
.smc-about .about-hero-copy { position:relative; padding:clamp(28px,5vw,85px) clamp(22px,4vw,70px); display:flex; flex-direction:column; justify-content:center; overflow:hidden }
.smc-about .about-hero-copy::before { content:''; position:absolute; inset:0; z-index:-1; opacity:.18; background-image:radial-gradient(#6ca3d5 1px,transparent 1px); background-size:11px 11px; mask-image:linear-gradient(#000,transparent 60%,#000) }
.smc-about .about-hero-copy::after { content:''; position:absolute; width:150px; height:140%; right:-128px; top:-20%; border:18px solid #ffd632; border-right:0; border-radius:50%; transform:rotate(14deg); pointer-events:none }
.smc-about .about-hero h1 { font-size:clamp(30px,4.7vw,66px); font-weight:800; line-height:1.08; color:#fff; letter-spacing:-.035em; overflow-wrap:normal }
.smc-about .about-hero h1 span { display:block; color:#ffdc4f; margin-top:7px }
.smc-about .about-hero-rule { margin-top:24px; height:3px; width:72px; background:linear-gradient(90deg,#fff 50%,#ffda31 50%) }
.smc-about .about-hero-photo { display:grid; place-items:center; background:#edf2f3; min-width:0 }
.smc-about .about-hero-photo img { display:block; width:100%; height:auto; max-height:620px; object-fit:contain }
.smc-about .about-hero-banner { display:block }
.smc-about .about-hero-banner .about-hero-photo img { max-height:none; height:auto; width:100% }
.smc-about .about-visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0 }
.smc-about .about-intro { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center }
.smc-about .about-intro h2 { margin-bottom:20px }
.smc-about .about-intro p + p { margin-top:13px }
.smc-about .about-intro-photo { position:relative; padding:12px; border:1px solid #f1dc9a; border-radius:30px; background:linear-gradient(135deg,#fffae5,#fff 50%,#eaf5ff); box-shadow:0 20px 45px #1234550c }
.smc-about .about-intro-photo img { display:block; width:100%; height:auto; border-radius:21px }
.smc-about .about-highlights { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:25px; text-align:center }
.smc-about .about-highlights span { display:grid; place-items:center; width:54px; height:54px; border-radius:50%; margin:0 auto 10px; background:#e8f4ff; color:#0a589e; font-size:23px }
.smc-about .about-highlights > div:nth-child(even) span { background:#fff6d9; color:#a97800 }
.smc-about .about-highlights strong { display:block; font-size:12px; line-height:1.5 }
.smc-about .about-principles { background:#f7fbff }
.smc-about .about-principle-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px }
.smc-about .about-principle { padding:30px; border-radius:23px; border:1px solid #e1eef7; background:linear-gradient(140deg,#fff,#eaf6ff); transition:transform .25s,box-shadow .25s }
.smc-about .about-principle:nth-child(2) { background:linear-gradient(140deg,#fff,#fff7dc); border-color:#f1e7c3 }
.smc-about .about-principle:nth-child(3) { background:linear-gradient(140deg,#fff,#e4f9f1); border-color:#d7eee5 }
.smc-about .about-feature-icon { width:58px; height:58px; display:grid; place-items:center; border-radius:18px; background:#e2f1ff; color:#0873c9; font-size:27px; margin-bottom:18px }
.smc-about .about-principle:nth-child(2) .about-feature-icon { color:#a67800; background:#fff0b8 }
.smc-about .about-principle:nth-child(3) .about-feature-icon { color:#087e62; background:#d5f4e9 }
.smc-about .about-principle p { margin-top:12px }
.smc-about .about-principle ul { list-style:none; padding:0; margin:14px 0 0; display:grid; gap:8px; font-size:14px; color:#405a70 }
.smc-about .about-principle li i { color:#078565; margin-right:7px }
.smc-about .about-team { background:radial-gradient(ellipse at center,#e9f6ff,transparent 68%),linear-gradient(165deg,#fff,#f2faff); position:relative }
.smc-about .about-team-stage { display:grid; grid-template-columns:minmax(0,820px) minmax(220px,300px); align-items:center; justify-content:center; gap:35px }
.smc-about .about-orbit { position:relative; width:100%; aspect-ratio:1; max-width:820px; margin:auto }
.smc-about .about-orbit-logo { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:32%; aspect-ratio:1; border-radius:50%; display:grid; place-items:center; background:#fff9da; box-shadow:0 0 0 14px #f5ca2220,0 15px 35px #12345512 }
.smc-about .about-orbit-logo img { display:block; width:85%; height:85%; object-fit:contain }
.smc-about .about-rotor { position:absolute; inset:0; animation:about-clockwise 42s linear infinite; animation-play-state:paused }
.smc-about .about-orbit-path { width:100%; height:100%; overflow:visible; fill:none; stroke:#deb443; stroke-width:1.2 }
.smc-about .about-orbit-path circle { stroke-dasharray:3 6; opacity:.6 }
.smc-about .about-orbit-path > path { marker-end:url(#about-arrow); stroke-dasharray:13 4 }
.smc-about .about-orbit-node { position:absolute; left:var(--x); top:var(--y); width:clamp(48px,7vw,92px); aspect-ratio:1; transform:translate(-50%,-50%) }
.smc-about .about-person { width:100%; height:100%; padding:4px; display:grid; place-items:center; border:2px solid #d4a322; border-radius:50%; background:#fff; box-shadow:0 5px 20px #0c30541a; animation:about-counterclockwise 42s linear infinite; animation-play-state:paused; color:#092950 }
.smc-about .about-person img { width:100%; height:100%; min-height:0; border-radius:50%; object-fit:cover; object-position:center 25%; display:block }
.smc-about .about-person.is-selected { box-shadow:0 0 0 5px #ffda5655,0 8px 25px #b3860030; border-color:#926700 }
.smc-about .about-initials { font-size:24px; font-weight:800 }
.smc-about .about-team.is-running .about-rotor,.smc-about .about-team.is-running .about-person { animation-play-state:running }
.smc-about .about-detail-slot { min-height:290px; display:grid; place-items:center; min-width:0 }
.smc-about .about-team-hint { text-align:center; font-weight:700; color:#29496c }
.smc-about .about-team-hint i { display:block; margin-bottom:15px; color:#b98900; font-size:28px }
.smc-about .about-team-hint span { font-size:13px; font-weight:400 }
.smc-about .about-person-detail { width:100%; position:relative; border:1px solid #e9c862; border-radius:24px; background:#fff; padding:30px 22px 24px; text-align:center; box-shadow:0 15px 45px #102f5610; animation:about-profile-enter .2s ease }
.smc-about .about-detail-close { position:absolute; top:8px; right:8px; border:0; border-radius:50%; background:#edf5fc; color:#0a2f58; width:36px; height:36px; font-size:25px }
.smc-about .about-detail-portrait { display:grid; place-items:center; width:130px; height:130px; margin:0 auto 18px; padding:4px; border:2px solid #d6ac27; border-radius:50%; background:#edf5ff; color:#103557; font-size:40px }
.smc-about .about-detail-portrait img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 25%; border-radius:50% }
.smc-about .about-person-detail h3 { overflow-wrap:anywhere }
.smc-about .about-person-detail p { margin-top:8px; font-size:14px; color:#936700; overflow-wrap:anywhere }
.smc-about .about-team-controls { display:flex; gap:14px; justify-content:center; align-items:center; margin:24px 0 }
.smc-about .about-orbit-toggle { border:1px solid #c4d6e8; padding:10px 16px; border-radius:999px; background:white; color:#163b63; min-height:44px; font-size:13px; font-weight:700 }
.smc-about .about-team-controls p { font-size:13px }
.smc-about .about-team-list { display:flex; gap:10px; overflow-x:auto; padding:8px 6px 14px; scroll-snap-type:x proximity }
.smc-about .about-team-chip { flex:0 0 180px; text-align:left; padding:13px 16px; border:1px solid #d8e6f3; border-radius:14px; background:#fff; color:#173a61; scroll-snap-align:start; white-space:normal }
.smc-about .about-team-chip strong,.smc-about .about-team-chip span { display:block; overflow-wrap:anywhere; font-size:13px }
.smc-about .about-team-chip span { font-size:12px; color:#586d82; margin-top:4px }
.smc-about .about-team-chip[aria-pressed="true"] { border-color:#b58713; background:#fffae8 }
.smc-about .about-team-empty { text-align:center; padding:45px }
.smc-about .about-team-empty img { width:120px; margin-bottom:20px }
.smc-about .about-services { background:linear-gradient(180deg,#f5fbff,#e8f5ff) }
.smc-about .about-services-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px }
.smc-about .about-service { position:relative; display:flex; flex-direction:column; align-items:flex-start; padding:25px 22px; border:1px solid #e2edf7; border-radius:19px; background:#fff; box-shadow:0 8px 20px #15395b06; transition:transform .25s,box-shadow .25s }
.smc-about .about-service h3 { font-size:16px }
.smc-about .about-service p { font-size:13px; margin-top:9px }
.smc-about .about-service-arrow { margin-top:auto; padding-top:13px; font-size:22px; color:#ae7b00 }
.smc-about .about-cta { background:linear-gradient(105deg,#043369,#07539e 70%,#063469); padding:32px 0; color:#fff; border-top:3px solid #ffda31 }
.smc-about .about-cta-inner { display:flex; justify-content:space-between; align-items:center; gap:25px }
.smc-about .about-cta h2 { font-size:clamp(23px,2.5vw,32px); color:#fff }
.smc-about .about-cta h2 span { color:#ffda31 }
.smc-about .about-cta p { color:#e6f0ff; margin-top:9px; font-size:14px }
.smc-about .about-cta a { display:inline-flex; align-items:center; justify-content:center; gap:20px; flex-shrink:0; background:#ffda31; color:#072950; padding:16px 30px; border-radius:999px; font-weight:800; min-height:50px }
@keyframes about-clockwise { to { transform:rotate(360deg) } }
@keyframes about-counterclockwise { to { transform:rotate(-360deg) } }
@keyframes about-profile-enter { from { opacity:0; transform:translateY(7px) } to { opacity:1; transform:translateY(0) } }
.smc-about .about-entered { animation:about-profile-enter .5s ease both }
@media (hover:hover) { .smc-about .about-service:hover,.smc-about .about-principle:hover { transform:translateY(-5px); box-shadow:0 15px 30px #14375a12 } }
@media (max-width:1000px) {
 .smc-about .about-intro { gap:28px }
 .smc-about .about-team-stage { grid-template-columns:minmax(0,1fr) 240px; gap:20px }
 .smc-about .about-services-grid { grid-template-columns:repeat(3,minmax(0,1fr)) }
 .smc-about .about-principle { padding:24px }
}
@media (max-width:760px) {
 .smc-about .about-space { padding-block:44px }
 .smc-about .smca-wrap { padding-inline:20px }
 .smc-about .about-hero { grid-template-columns:minmax(0,1fr) }
 .smc-about .about-hero-copy { padding:32px 24px }
 .smc-about .about-hero h1 { font-size:38px }
 .smc-about .about-hero h1 span br { display:none }
 .smc-about .about-hero-photo img { max-height:none }
 .smc-about .about-intro { grid-template-columns:minmax(0,1fr) }
 .smc-about .about-intro-photo { max-width:540px; margin:auto }
 .smc-about .about-principle-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
 .smc-about .about-principle:last-child { grid-column:1/-1 }
 .smc-about .about-team-stage { grid-template-columns:minmax(0,1fr); gap:16px }
 .smc-about .about-orbit { max-width:600px }
 .smc-about .about-detail-slot { min-height:150px; width:min(100%,420px); margin:auto }
 .smc-about .about-person-detail { display:flex; align-items:center; gap:18px; text-align:left; padding:24px 20px }
 .smc-about .about-detail-portrait { width:100px; height:100px; flex:0 0 100px; margin:0 }
 .smc-about .about-person-detail > div:last-child { min-width:0; padding-top:12px }
 .smc-about .about-services-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
 .smc-about .about-cta-inner { flex-direction:column; align-items:flex-start }
 .smc-about .about-person { min-width:44px; min-height:44px }
}
@media (max-width:600px) {
 .smc-about .about-orbit-node { left:var(--mx); top:var(--my); width:clamp(46px,13vw,66px) }
 .smc-about .about-orbit-extra { display:none }
 .smc-about .about-orbit-path { transform:scale(.933); transform-origin:center }
 .smc-about .about-principle-grid { grid-template-columns:minmax(0,1fr) }
 .smc-about .about-principle:last-child { grid-column:auto }
 .smc-about .about-team-controls { flex-direction:column; gap:8px }
 .smc-about .about-service { padding:20px 16px }
 .smc-about .about-service h3 { font-size:14px }
 .smc-about .about-service .about-feature-icon { width:46px; height:46px; font-size:22px }
}
@media (max-width:360px) {
 .smc-about .smca-wrap { padding-inline:14px }
 .smc-about .about-hero h1 { font-size:32px }
 .smc-about .about-highlights { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px }
 .smc-about .about-services-grid { grid-template-columns:minmax(0,1fr) }
 .smc-about .about-detail-portrait { width:76px; height:76px; flex-basis:76px }
 .smc-about .about-person-detail { gap:12px; padding:24px 14px 18px }
 .smc-about .about-person-detail h3 { font-size:17px }
}
@media (prefers-reduced-motion:reduce) {
 .smc-about .about-rotor,.smc-about .about-person { animation:none!important }
 .smc-about .about-person-detail { animation:none }
 .smc-about .about-entered { animation:none }
 .smc-about .about-service,.smc-about .about-principle { transition:none }
}

/* Fit the hero and compact orbit to the available laptop viewport. */
.smc-about .about-hero-banner .about-hero-photo { background:#06284e }
.smc-about .about-hero-banner picture { display:block; width:100% }
.smc-about .about-hero-banner .about-hero-photo img { width:100%; height:auto; max-height:calc(100svh - 155px); object-fit:contain }
@media (min-width:761px) {
 .smc-about .about-team.about-space { padding-block:28px }
 .smc-about .about-team .smca-heading { margin-bottom:16px }
 .smc-about .about-team .smca-heading h2 { font-size:clamp(26px,2.6vw,36px) }
 .smc-about .about-team .smca-heading p:last-child { margin-top:8px; line-height:1.5 }
 .smc-about .about-team-stage { grid-template-columns:minmax(0,520px) minmax(220px,280px); gap:28px }
 .smc-about .about-orbit { max-width:min(520px,calc(100svh - 285px)); min-width:280px }
 .smc-about .about-orbit-node { width:clamp(44px,4.7vw,64px) }
 .smc-about .about-team-controls { margin:12px 0 8px }
 .smc-about .about-team-list { padding-block:6px 8px }
 .smc-about .about-team-chip { padding:9px 14px }
}
@media (max-width:760px) {
 .smc-about .about-hero-banner .about-hero-photo img { max-height:calc(100svh - 135px) }
 .smc-about .about-orbit { max-width:420px }
}
/* Team directory at the left, orbit in the middle/right, larger profile preview. */
.smc-about .about-team-directory { min-width:0; align-self:center }
.smc-about .about-team-directory h3 { font-size:16px; margin-bottom:12px }
.smc-about .about-team-directory .about-team-list { display:block; height:320px; overflow:hidden; padding:0; border-block:1px solid #dce7f1; mask-image:linear-gradient(transparent,#000 5%,#000 95%,transparent) }
.smc-about .about-name-track { animation:about-names-up var(--names-duration,14s) linear infinite }
.smc-about .about-name-group { display:grid; gap:10px; padding-bottom:10px }
.smc-about .about-team-directory .about-team-chip { width:100%; min-height:65px; flex:none; padding:12px 14px }
.smc-about .about-team-list:hover .about-name-track,.smc-about .about-team-list:focus-within .about-name-track { animation-play-state:paused }
.smc-about .about-team-directory .about-team-list:focus-within { overflow-y:auto; mask-image:none }
.smc-about .about-team-directory .about-team-list:focus-within .about-name-track { animation:none }
.smc-about .about-team-directory .about-team-list:focus-within .about-name-group[aria-hidden] { display:none }
.smc-about .about-detail-portrait { width:190px; height:190px }
@keyframes about-names-up { to { transform:translateY(-50%) } }
@media (min-width:1101px) {
 .smc-about .about-team-stage { grid-template-columns:220px minmax(280px,520px) minmax(230px,280px); gap:24px }
 .smc-about .about-orbit-node { width:clamp(58px,5.4vw,76px) }
 .smc-about .about-team-directory .about-team-list { height:min(370px,calc(100svh - 300px)) }
}
@media (min-width:761px) and (max-width:1100px) {
 .smc-about .about-team-stage { grid-template-columns:190px minmax(0,1fr); gap:20px }
 .smc-about .about-detail-slot { grid-column:2; min-height:0; width:100%; max-width:420px; margin:auto }
 .smc-about .about-person-detail { display:flex; align-items:center; gap:18px; text-align:left }
 .smc-about .about-detail-portrait { width:150px; height:150px; flex:0 0 150px; margin:0 }
 .smc-about .about-orbit-node { width:64px }
}
@media (max-width:760px) {
 .smc-about .about-team-directory { grid-row:2; width:100% }
 .smc-about .about-orbit { grid-row:1 }
 .smc-about .about-team-directory .about-team-list { height:215px }
 .smc-about .about-detail-slot { grid-row:3 }
 .smc-about .about-detail-portrait { width:130px; height:130px; flex-basis:130px }
 .smc-about .about-orbit-node { width:clamp(50px,14vw,72px) }
}
@media (max-width:360px) {
 .smc-about .about-detail-portrait { width:96px; height:96px; flex-basis:96px }
}
@media (min-width:761px) {
 .smc-about .about-hero-banner .about-hero-photo img { max-height:none; width:100%; height:auto; object-fit:initial }
}
@media (prefers-reduced-motion:reduce) {
 .smc-about .about-name-track { animation:none }
 .smc-about .about-team-directory .about-team-list { overflow-y:auto; mask-image:none }
 .smc-about .about-name-group[aria-hidden] { display:none }
}
/* Entire banner stays visible below the measured header, without stretching faces. */
.smc-about .about-hero-banner { width:100%; max-width:none }
.smc-about .about-hero-banner .about-hero-photo { width:100%; background:#06284e }
.smc-about .about-hero-banner picture { width:100%; display:block }
.smc-about .about-hero-banner .about-hero-photo img {
 display:block;
 width:100%;
 height:auto;
 max-height:var(--about-hero-room,calc(100svh - 155px));
 object-fit:contain;
 object-position:center;
}
/* Desktop banner fills the approved height edge to edge. */
@media (min-width:761px) {
 .smc-about .about-hero-banner .about-hero-photo img {
  width:100%;
  height:min(50vw,var(--about-hero-room,calc(100svh - 155px)));
  max-height:none;
  object-fit:cover;
  object-position:center;
 }
}
/* Mobile selected profile appears above the orbit, then the full member list. */
@media (max-width:760px) {
 .smc-about .about-team-stage .about-detail-slot { grid-row:1; min-height:0 }
 .smc-about .about-team-stage .about-orbit { grid-row:2 }
 .smc-about .about-team-stage .about-team-directory { grid-row:3 }
}
.smc-about .about-services-actions { text-align:center; margin-top:30px }
.smc-about .about-services-more { position:relative; isolation:isolate; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:52px; padding:15px 28px; border:1px solid #e3b825; border-radius:999px; background:#ffda31; color:#072950; font-weight:800; box-shadow:0 8px 22px #d5ad1e25; transition:transform .25s,box-shadow .25s }
.smc-about .about-services-more::before { content:''; position:absolute; inset:-40% auto -40% -55%; width:35%; background:linear-gradient(90deg,transparent,#ffffff80,transparent); transform:skewX(-20deg); animation:about-more-shine 3.5s ease-in-out infinite; pointer-events:none }
.smc-about .about-services-more:hover { transform:translateY(-3px); box-shadow:0 12px 26px #d5ad1e40 }
@keyframes about-more-shine { 0%,55% { left:-55% } 100% { left:130% } }
@media (min-width:901px) { .smc-about .about-services-grid { grid-template-columns:repeat(4,minmax(0,1fr)) } }
@media (min-width:361px) and (max-width:900px) { .smc-about .about-services-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (prefers-reduced-motion:reduce) { .smc-about .about-services-more::before { animation:none; display:none } .smc-about .about-services-more { transition:none } }

/* Selected employee photo: a fixed circular viewport for every source aspect ratio. */
.smc-about .about-detail-portrait {
 position:relative;
 display:block;
 box-sizing:border-box;
 width:210px;
 height:210px;
 aspect-ratio:1;
 flex:0 0 210px;
 padding:0;
 overflow:hidden;
 border:4px solid #fff;
 border-radius:50%;
 outline:2px solid #d6ac27;
 background:#edf5ff;
 box-shadow:0 8px 28px #1035571a;
 margin:0 auto 20px;
}
.smc-about .about-detail-portrait img {
 position:absolute;
 inset:0;
 display:block;
 width:100%;
 height:100%;
 min-width:0;
 max-width:none;
 max-height:none;
 object-fit:cover;
 object-position:center 25%;
 border-radius:50%;
}
.smc-about .about-detail-portrait [data-detail-initial] {
 position:absolute;
 inset:0;
 display:grid;
 place-items:center;
 font-size:56px;
 font-weight:700;
}
.smc-about .about-detail-portrait [hidden] { display:none!important; }
@media(min-width:761px) and (max-width:1100px) {
 .smc-about .about-detail-portrait { width:170px; height:170px; flex-basis:170px; margin:0; }
}
@media(max-width:760px) {
 .smc-about .about-person-detail { display:block; text-align:center; }
 .smc-about .about-detail-portrait { width:180px; height:180px; flex-basis:180px; margin:0 auto 18px; }
}
@media(max-width:360px) {
 .smc-about .about-detail-portrait { width:160px; height:160px; flex-basis:160px; }
}
