/* styles-v5.css — stripped background styles; visual decorations removed */
:root{
  --accent-1:#FF8A00;
  --accent-2:#2BD4FF;
  --accent-3:#6A5AFF;
  --muted: rgba(0,0,0,0.85);
}

html,body{height:100%;}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:var(--muted);
  background:transparent; /* defer background to main stylesheet */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Move decorative color blocks to the main content area (light, subtle) */
.masthead{position:relative;overflow:visible;padding:2.75rem 1rem 3.4rem;}
.masthead .masthead-inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;text-align:center;padding:1.7rem 1rem;}
.masthead h1{font-family:Fraunces, serif;margin:0;font-size:3.5rem;color:#fff;letter-spacing:0.02em;text-shadow:0 6px 18px rgba(10,10,20,0.6);}
.masthead h1 em{font-style:normal;color:var(--accent-1);}
.masthead .full-name{margin:0.4rem 0 0.6rem;color:rgba(255,255,255,0.95)}

/* Main container: keep a white content background and add soft, light color blocks behind */
main{
  position:relative;
  z-index:1;
  background:#ffffff;
  color:#0b1630;
  border-radius:14px;
  margin:0.5rem auto 1rem;
  max-width:1200px;
  padding:1rem 2rem 2rem;
  box-shadow:0 8px 20px rgba(2,8,20,0.04);
  overflow:visible;
}

@media (max-width:920px){
  main{margin:0.5rem 1rem 1rem;padding:0.5rem 1rem 1rem;border-radius:10px}
}

/* Give cards and panels slight 3D lift */
.card-grid .info-card{
  display:block;padding:1.25rem;border-radius:12px;background:#fff;border:1px solid rgba(10,20,40,0.06);box-shadow:0 8px 22px rgba(2,8,20,0.04);transition:transform .28s ease, box-shadow .28s ease;text-decoration:none;color:inherit;
}
.card-grid .info-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(2,8,20,0.08)}

/* Timeline date boxes - subtle pop */
.timeline-date-box img{border-radius:8px;box-shadow:0 8px 18px rgba(2,8,20,0.06)}
.timeline-date-box.in-view{transform:translateY(-6px);transition:transform .5s cubic-bezier(.2,.9,.2,1)}

/* Footer, nav contrast adjustments */
.site-nav{position:sticky;top:0;background:transparent;backdrop-filter:blur(4px);z-index:5}
footer{background:transparent;color:rgba(0,0,0,0.75);}

/* Small screens */
@media (max-width:720px){
  .masthead h1{font-size:2.25rem}
}

/* Accessibility adjustments */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#000;color:#fff;padding:.5rem 1rem;border-radius:6px}

/* Utility: gentle gradient overlay for hero images if needed */
.hero-overlay{position:absolute;inset:0;pointer-events:none}