/* Visual refinements: existing portfolio palette and existing image assets. */

/* A static photo grid keeps captions inside the reading rail. */
.about-v2 .about-me__img-wrapper{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px!important;align-items:start;width:100%!important;max-width:100%!important;min-width:0;overflow:visible!important;margin:28px 0 0!important;padding:0!important;transform:none!important;animation:none!important;scroll-snap-type:none!important}
.about-v2 .about-me__img-wrapper::before,.about-v2 .about-me__img-wrapper::after{display:none!important}
.about-v2 .about-me__img-wrapper .about-photo{display:block!important;grid-template-rows:none!important;width:100%!important;min-width:0;max-width:none!important;margin:0!important;overflow:visible!important;flex:none;transform:none!important;animation:none!important}
.about-v2 .about-photo-stage{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;border-radius:16px;background:#f1f6f8}
.about-v2 .about-me__img-wrapper .about-photo img{display:block!important;width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:50% 30%!important;border-radius:0!important}
.about-v2 .about-me__img-wrapper .about-photo figcaption{display:block!important;width:100%;max-width:100%;min-height:2.8em;margin:0!important;padding:10px 2px 0!important;font-size:13px!important;line-height:1.5!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere}
.about-v2 .about-me__img-wrapper:has(>.about-photo:only-child){grid-template-columns:minmax(0,420px)}
.about-v2 #visual-craft .about-photo img{object-position:50% 22%!important}
.about-carousel-pause{display:none!important}

/* The full original SteelSeries cover stays inside the thumbnail. */
.projects-page a[href="/steelseries/"] .project-image-wrap-2{aspect-ratio:16/9!important;background:#f3f8fa}
.projects-page a[href="/steelseries/"] .project-image-wrap-2>img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;transform:none!important;clip-path:none!important}
.projects-page a[href="/steelseries/"] .case-lock-badge{top:auto!important;right:auto!important;left:14px!important;bottom:14px!important;padding:8px 12px;background:#fffffff0;color:#173e50}

/* The prototype recordings already include the device bezel. Use it once. */
.phone-preview-collage{display:block!important;position:relative;isolation:isolate;width:100%;height:100%;padding:0;overflow:hidden;background:#edf7fb;border-radius:inherit}
.phone-preview-device{display:block;position:absolute;top:50%;left:50%;height:83%;width:auto;aspect-ratio:480/986;max-width:none;overflow:hidden;border:0;border-radius:12% / 5.8%;background:transparent;box-shadow:0 12px 22px #173e5024;transform:translate(-50%,-50%);z-index:2}
.phone-preview-device:first-child{left:26%;height:75%;transform:translate(-50%,-48%) rotate(-6deg);z-index:1}
.phone-preview-device:last-child{left:74%;height:75%;transform:translate(-50%,-48%) rotate(6deg);z-index:1}
body .phone-preview-collage .phone-preview-device img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important;transform:none!important;border-radius:0!important;background:transparent}
.giving-v2 .giving-overview .phone-preview-collage{aspect-ratio:16/9;height:auto;min-height:280px;border:1px solid #dcebf2;border-radius:20px}

/* Keep all three systems projects on one desktop row, in the existing order. */
.projects-page .earlier-project-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:28px!important;align-items:stretch}
.projects-page .earlier-project-grid>div{float:none!important;width:auto!important;max-width:100%;margin:0!important;padding:0!important}
.projects-page .earlier-project-grid .heading-h5-2{font-size:clamp(20px,1.8vw,24px)!important;line-height:1.3!important}
.projects-page .earlier-project-grid .paragraph-34{font-size:14px!important;line-height:1.65!important}

/* Enlarge existing board details; the original board remains one click away. */
.giving-v2 .board-detail-grid{display:grid;gap:22px;align-items:start;width:100%;margin-top:14px}
.giving-v2 .board-detail-grid.audit-details{grid-template-columns:repeat(3,minmax(0,1fr))}
.giving-v2 .board-detail-grid.system-details{grid-template-columns:repeat(2,minmax(0,1fr))}
.giving-v2 .board-detail{min-width:0;overflow:hidden;border:1px solid #d7e6ed;border-radius:16px;background:#fff;padding:12px}
.giving-v2 .board-detail svg{display:block;width:100%;height:auto;max-height:none;overflow:hidden;border-radius:8px}
.giving-v2 .board-detail-grid+figcaption{margin-top:14px;font-size:14px;line-height:1.6}
.board-full-link{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;color:#173e50;font:500 13px/1.5 Poppins,Arial,sans-serif;text-decoration:underline;text-decoration-color:#00aeef;text-underline-offset:4px}
.giving-v2 .giving-intro>div>p:not(.giving-eyebrow),.giving-v2 .giving-intro>p:not(.giving-eyebrow){font-size:17px!important;line-height:1.75!important;max-width:65ch;font-weight:400!important}
.giving-v2 .giving-hero-lead{font-size:19px!important;line-height:1.7!important}

@media(max-width:1000px){
 .about-v2 .about-me__img-wrapper{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:899px){.projects-page .earlier-project-grid{grid-template-columns:1fr!important}}
@media(max-width:767px){
 .about-v2 .about-me__img-wrapper{gap:20px 14px!important}
 .about-v2 .about-me__img-wrapper .about-photo figcaption{font-size:12px!important;padding-top:9px!important}
 .phone-preview-device{box-shadow:0 6px 12px #173e5020}
 .giving-v2 .giving-overview .phone-preview-collage{min-height:220px}
 .giving-v2 .board-detail-grid.audit-details{grid-template-columns:1fr;max-width:370px;margin-inline:auto}
 .giving-v2 .board-detail-grid.system-details{grid-template-columns:1fr;max-width:420px;margin-inline:auto}
 .giving-v2 .board-detail{padding:14px}
 .giving-v2 .giving-hero-lead{font-size:17px!important}
 .giving-v2 .giving-intro>div>p:not(.giving-eyebrow),.giving-v2 .giving-intro>p:not(.giving-eyebrow){font-size:16px!important}
}
@media(max-width:480px){.about-v2 .about-me__img-wrapper{grid-template-columns:1fr}.about-v2 .about-me__img-wrapper:has(>.about-photo:only-child){grid-template-columns:1fr}}

/* Quality pass: natural portrait framing, evidence access and keyboard clarity. */
.about-v2 #visual-craft .about-photo img{object-fit:contain!important;object-position:center!important;background:#f1f6f8}
.about-v2 .about-photo img[src*="2944d9c18a62"]{object-position:50% 8%!important}
.skip-link{color:#fff!important;background:#173e50!important}
.projects-page :focus-visible,.about-v2 :focus-visible,.awards-page :focus-visible,.older-case-page :focus-visible,.giving-v2 :focus-visible,.site-header :focus-visible,.site-footer :focus-visible,.ask-ninna :focus-visible{outline:3px solid #14526a!important;outline-offset:4px}
.site-footer-email span,.site-footer-links a span{color:#173e50}
.giving-v2 .board-detail .audit-detail-link{display:block;cursor:zoom-in}
.giving-v2 .audit-details .board-detail img{display:block;width:100%;height:auto;object-fit:contain;border-radius:8px}
.older-case-page .legacy-case-figure>.evidence-image-link{display:flex!important;align-items:center;justify-content:center;width:100%;height:auto;max-height:none;margin:0;cursor:zoom-in}
.older-case-page .legacy-case-figure>.evidence-image-link img{display:block;width:auto;max-width:100%;height:auto;max-height:650px;object-fit:contain;border-radius:9px}
.older-case-page .visual-rail .legacy-case-figure>.evidence-image-link{height:290px}
.older-case-page .visual-rail .legacy-case-figure>.evidence-image-link img{height:100%;max-height:100%;width:100%}
.older-case-page .older-case>p>a.projects-resume-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:12px 20px;border:1px solid #163b4b;border-radius:8px;background:#163b4b;color:#fff;font-size:14px;font-weight:500;text-decoration:none;transition:background .2s ease,transform .2s ease}
.older-case-page .older-case>p>a.projects-resume-link:hover{background:#075f82;transform:translateY(-1px)}
@media(max-width:767px){
 .site-header-inner>.site-logo{order:0}
 .site-header-inner>.site-menu-toggle{order:1;margin-left:auto}
 .site-header-inner>.site-navigation{order:3;flex-basis:100%}
 .older-case-page .visual-rail .legacy-case-figure>.evidence-image-link{height:250px}
}
@media(prefers-reduced-motion:reduce){.older-case-page .older-case>p>a.projects-resume-link{transition:none;transform:none}}


/* Two representative views give the cover a clear visual hierarchy. */
.phone-preview-collage.is-pair .phone-preview-device:first-child{left:36%;height:83%;transform:translate(-50%,-50%) rotate(-5deg)}
.phone-preview-collage.is-pair .phone-preview-device:last-child{left:64%;height:83%;transform:translate(-50%,-50%) rotate(5deg)}
@media(max-width:767px){.phone-preview-collage.is-pair .phone-preview-device:first-child{left:30%}.phone-preview-collage.is-pair .phone-preview-device:last-child{left:70%}}
