/* Original colors, typography, imagery and layout are intentionally retained. */
:root{--card-gap:24px;--section-gap:48px}

/* Equal gaps between sibling cards and between the larger subject groups. */
main:not(.page) > .stats{gap:var(--card-gap);margin-bottom:var(--section-gap)}
main:not(.page) > section{margin-bottom:var(--section-gap)}
main:not(.page) > section:last-child{margin-bottom:0}
.projects,.experience-grid,.learning-stack,.timeline,.contact-panel{gap:var(--card-gap)}
.section-head{margin-bottom:var(--card-gap)}
.page.page{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--card-gap)}
.page.page > *{margin-block:0!important;min-width:0}
.page .content-grid,.page .strategy-grid,.page .principle-grid,.page .value-table,.page .metric-grid,
body[data-project] .page .action-list{gap:var(--card-gap)}
.page .content-grid > .panel,.page .strategy-grid > .panel{margin-block:0}
.page .value-table,.page .principle-grid,.page .strategic-summary{margin-top:var(--card-gap)}
.page .action-list li{margin-top:0}

/* Gentle decoration; readable content is visible even without JavaScript. */
body > .hero::before{animation:original-grid-drift 24s ease-in-out infinite alternate}
.page .hero::before{animation:detailHeroSweep 18s ease-in-out infinite}
.page .hero::after{animation:none}
.page .hero-copy{animation:none}
.project-visual img{transition:transform 420ms ease}
.project-cta::after{transition:translate 220ms ease}
@keyframes original-grid-drift{from{background-position:0 0,0 0}to{background-position:12px 6px,12px 6px}}
@media(hover:hover) and (pointer:fine){
 .project:hover .project-visual img{transform:scale(1.025)}
 .project:hover .project-cta::after{translate:3px 0}
}
@media(max-width:720px){:root{--card-gap:16px;--section-gap:36px}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .project:hover,.stat:hover,.panel:hover,.metric:hover,.principle-card:hover,.value-item:hover,
 .project:hover .project-visual img,.capability-list li:hover,.metric:hover .metric-icon,
 .capability-list li:hover .metric-icon,.principle-card:hover .metric-icon{transform:none}
}
@media print{*,*::before,*::after{animation:none!important;transition:none!important}}

/* Background-only enhancement for the original homepage introduction. */
body > #intro.hero {
  isolation: isolate;
  background:
    radial-gradient(ellipse at 78% 22%, rgba(46, 38, 90, .13), transparent 52%),
    radial-gradient(ellipse at 25% 78%, rgba(20, 44, 76, .11), transparent 48%),
    #020308;
}
body > #intro.hero::before { display: none; animation: none; }
#intro > .galaxy-stars {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}
#intro > .hero-inner { z-index: 1; }
@media print { #intro > .galaxy-stars { display: none; } }