/* =========================================================
   Sleek theme — palette drawn from the headshot
   (slate-navy shadows, sage sweater, sunlit sand, bark brown)
   The landing header is intentionally left untouched.
   ========================================================= */

:root {
  --ink:        #111925;   /* deepest shadow */
  --navy:       #16202e;   /* archway shadow */
  --navy-2:     #1c2839;   /* lifted surface */
  --navy-3:     #263449;   /* borders / hover */
  --sage:       #a8d5a0;   /* sweater green */
  --sage-dim:   #7fae79;
  --sand:       #e8c89a;   /* sunlit tree */
  --bark:       #8a6446;   /* backpack strap */
  --cream:      #f1ebe0;   /* primary text */
  --muted:      #aeb6c2;   /* secondary text */
  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans:  "Inter", "Source Sans Pro", -apple-system, BlinkMacSystemFont, sans-serif;
  --ease:  cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; }
body { background: var(--ink); }
::selection { background: var(--sage); color: var(--ink); }

/* ---------- Navbar (sticks after the header) ---------- */
.navbar {
  box-shadow: none;
  transition: background .4s var(--ease), backdrop-filter .4s var(--ease);
}
.navbar.affix {
  background: rgba(17, 25, 37, .78) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%);
          backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid rgba(168, 213, 160, .12);
}
.navbar .nav-link {
  font-family: var(--sans);
  font-weight: 500;
  font-size: .82rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(241, 235, 224, .75) !important;
  transition: color .25s;
}
.navbar .nav-link:hover { color: var(--cream) !important; }
.navbar .nav-link.active { color: var(--sage) !important; }

/* ---------- Sections below the header ---------- */
.container-fluid,
.section,
.footer {
  font-family: var(--sans);
  color: var(--cream);
}
.container-fluid { background: var(--navy); }
.container-fluid:nth-of-type(even) { background: var(--navy-2); }
.section { background: var(--ink); padding: 110px 0; }

.about-section {
  border-bottom: 1px solid rgba(255, 255, 255, .05);
  padding: 40px 0;
}
.about-section .about-card { border-right: none; }

hr { border-top-color: rgba(255, 255, 255, .08); }

/* Headings */
.container-fluid h1,
.section h1 {
  font-family: var(--serif);
  font-weight: 300 !important;
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  letter-spacing: -.02em;
  color: var(--cream);
  margin-bottom: 18px;
}
.container-fluid h1 .text-danger,
.section h1 .text-danger {
  color: var(--sage) !important;
}
.line {
  width: 56px;
  height: 2px;
  background: linear-gradient(90deg, var(--sage), var(--sand));
  border-radius: 2px;
}

/* Body copy */
.container-fluid h5,
.container-fluid h6,
.section h5,
.section h6 {
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.75;
  color: var(--muted);
}
.container-fluid h5,
.section h5 { font-size: 1.12rem; }
.container-fluid b,
.section b { color: var(--cream); font-weight: 600; }

/* Links */
.container-fluid a,
.section a,
.footer a {
  color: var(--sand);
  text-decoration: none;
  background-image: linear-gradient(var(--sand), var(--sand));
  background-size: 0% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .35s var(--ease), color .25s;
}
.container-fluid a:hover,
.section a:hover,
.footer a:hover {
  color: var(--sage);
  background-image: linear-gradient(var(--sage), var(--sage));
  background-size: 100% 1px;
}

/* ---------- About ---------- */
.about-grid {
  display: flex;
  align-items: center;
  gap: 60px;
  padding: 60px 0;
}
.about-grid .about-text { flex: 1 1 62%; }
.about-grid .about-photo { flex: 0 1 32%; }
.about-photo img {
  width: 100%;
  border-radius: 18px;
  box-shadow:
    0 30px 60px -20px rgba(0, 0, 0, .6),
    0 0 0 1px rgba(232, 200, 154, .15);
  transition: transform .6s var(--ease);
}
.about-photo img:hover { transform: translateY(-6px) scale(1.01); }
@media (max-width: 767.98px) {
  .about-grid { flex-direction: column-reverse; gap: 30px; padding: 30px 0; }
  .about-grid .about-photo { max-width: 70%; }
}

/* ---------- Media / Outreach cards ---------- */
.portfolio .portfolio-container .portfolio-item {
  border-radius: 14px;
  margin: 12px 4px;
  box-shadow: 0 20px 40px -24px rgba(0, 0, 0, .8);
}
.portfolio .portfolio-container .portfolio-item img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  transition: transform .8s var(--ease);
}
.portfolio .portfolio-container .portfolio-item:hover img { transform: scale(1.06); }
.portfolio .portfolio-container .portfolio-item .content-holder {
  background: linear-gradient(160deg, rgba(22, 32, 46, .94), rgba(17, 25, 37, .97));
  border: 1px solid rgba(168, 213, 160, .18);
  border-radius: 14px;
  padding: 0 28px;
}
.portfolio .portfolio-container .portfolio-item .content-holder .title {
  font-family: var(--serif);
  font-weight: 400;
  color: var(--sage);
}
.portfolio .portfolio-container .portfolio-item .content-holder .subtitle,
.portfolio .portfolio-container .portfolio-item .content-holder h6 {
  color: var(--cream);
  font-weight: 300;
  line-height: 1.6;
}

/* ---------- Research ---------- */
.section ol { padding-left: 1.2rem; }
.section ol li::marker {
  color: var(--sage);
  font-family: var(--serif);
}
.blog-card {
  background: var(--navy-2);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 18px;
  margin: 0 15px 34px;
  transition: transform .5s var(--ease), border-color .5s, box-shadow .5s;
}
.blog-card:hover {
  transform: translateY(-4px);
  border-color: rgba(168, 213, 160, .3);
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .9);
}
.blog-card .img-holder { overflow: hidden; }
.blog-card .img-holder img { transition: transform .9s var(--ease); }
.blog-card:hover .img-holder img { transform: scale(1.05); }
.blog-card .content-holder { padding: 38px 40px; }
.blog-card .content-holder .title {
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.3;
  opacity: 1;
  color: var(--cream);
  margin-bottom: 14px;
}
.blog-card .content-holder .title b { font-weight: 400; }
.blog-card .content-holder .title + br,
.blog-card .content-holder .title + br + br { display: none; }

/* ---------- Footer ---------- */
.footer {
  background: var(--ink);
  border-top: 1px solid rgba(255, 255, 255, .06);
}
.footer .text-danger { color: var(--sage) !important; }
.footer p { color: var(--muted) !important; letter-spacing: .04em; }

/* ---------- Scroll reveal ---------- */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(6px);
  transition:
    opacity 1s var(--ease),
    transform 1s var(--ease),
    filter 1s var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}
.line.reveal { transform: scaleX(0); transform-origin: left; filter: none; }
.line.reveal.is-visible { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; filter: none; transition: none; }
}
