/*
Theme Name: Salauddin Ahmed
Theme URI: https://salauddinahmed.com
Author: Salauddin Ahmed
Author URI: https://salauddinahmed.com
Description: Academic portfolio theme for Salauddin Ahmed, PhD student in Communication Studies. Black, white, and navy design system set in Tinos, a serif that reads like Times New Roman. Built around a sticky nav that collapses into a compact side rail on scroll, dedicated About/Teaching/Research/Fact-Checking/Media/Blog pages, and a dynamic blog powered by WP_Query.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: salauddin-ahmed
*/

/* =========================================================================
   Salauddin Ahmed — Academic Portfolio
   Design system: black / white / dark navy, single serif family throughout.
   Signature motif: an academic "dossier" masthead — hairline rules, §-numbered
   sections (echoing pinpoint citation style), and a navy verification seal
   reserved for the Fact-Checking section.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root{
  color-scheme: light;

  /* ---- Palette (black / white / navy only, tinted for depth) ---- */
  --navy-950:#081120;
  --navy-900:#0c1c33;
  --navy-800:#122c4c;
  --navy-700:#1c3f68;
  --navy-600:#2c5586;
  --navy-100:#e7ecf3;

  --ink:#0c0c0d;
  --ink-70:rgba(12,12,13,.72);
  --ink-45:rgba(12,12,13,.48);
  --ink-25:rgba(12,12,13,.25);

  --white:#ffffff;
  --paper:#f6f4ee;           /* warm paper tone, reads as "white" */
  --paper-line:#e4dfd2;

  --line:rgba(12,12,13,.13);
  --line-navy:rgba(255,255,255,.16);
  --white-70:rgba(255,255,255,.74);
  --white-45:rgba(255,255,255,.46);

  --focus:#2c5586;

  /* ---- Type ---- */
  --serif:'Tinos','Times New Roman',Times,Georgia,serif;

  --fs-hero: clamp(2.6rem, 6.6vw, 5.4rem);
  --fs-h1: clamp(2.1rem, 4.2vw, 3.2rem);
  --fs-h2: clamp(1.7rem, 3vw, 2.3rem);
  --fs-h3: 1.375rem;
  --fs-lead: 1.2rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.92rem;
  --fs-caption: 0.76rem;

  /* ---- Spacing (8pt) ---- */
  --sp-1: .5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2rem;
  --sp-5: 3rem;
  --sp-6: 4rem;
  --sp-7: 6rem;
  --sp-8: 8rem;

  --container: 1180px;
  --nav-h: 84px;

  --ease: cubic-bezier(.22,.68,0,1);
  --dur-s: .22s;
  --dur-m: .5s;
  --dur-l: .9s;
}

/* ---------------------------- Reset ------------------------------------ */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--serif);
  font-size:var(--fs-body);
  line-height:1.7;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
button{ font-family:inherit; }
svg{ display:block; }

section{ scroll-margin-top: var(--nav-h); }

::selection{ background:var(--navy-800); color:var(--white); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}

/* Focus visibility (accessibility) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:3px;
  border-radius:2px;
}

.container{
  max-width:var(--container);
  margin-inline:auto;
  padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}

/* ---------------------------- Utility ----------------------------------- */
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:1rem; top:-3rem;
  background:var(--navy-950); color:var(--white);
  padding:.75rem 1.25rem; z-index:1000; transition:top var(--dur-s) var(--ease);
  font-size:var(--fs-small); letter-spacing:.02em;
}
.skip-link:focus{ top:1rem; }

.eyebrow{
  display:flex; align-items:center; gap:.65rem;
  font-size:var(--fs-caption);
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--navy-700);
}
.eyebrow .mark{
  font-variant-numeric:tabular-nums;
  color:var(--ink-45);
  letter-spacing:.05em;
}
.eyebrow::before{
  content:"";
  width:28px; height:1px;
  background:var(--navy-700);
  flex-shrink:0;
}
.on-navy .eyebrow{ color:var(--white-70); }
.on-navy .eyebrow::before{ background:var(--white-45); }
.on-navy .eyebrow .mark{ color:var(--white-45); }

.section-head{
  max-width:44rem;
  margin-bottom:var(--sp-6);
}
.section-head h2{
  font-size:var(--fs-h1);
  font-weight:700;
  margin-top:var(--sp-2);
  letter-spacing:-.01em;
}
.section-head p{
  margin-top:var(--sp-2);
  color:var(--ink-70);
  font-size:var(--fs-lead);
  max-width:38rem;
}

.section-pad{ padding-block:var(--sp-8); }
@media (max-width:720px){ .section-pad{ padding-block:var(--sp-6); } }

.bg-paper{ background:var(--paper); }
.bg-navy{ background:var(--navy-950); color:var(--white); }
.bg-navy .ink-70-eq{ color:var(--white-70); }

.rule{
  height:1px; width:100%;
  background:var(--line);
  border:0;
}
.rule-navy{ background:var(--line-navy); }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--serif);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:.85rem 1.6rem;
  border:1px solid transparent;
  cursor:pointer;
  transition:background var(--dur-s) var(--ease), color var(--dur-s) var(--ease), border-color var(--dur-s) var(--ease), transform var(--dur-s) var(--ease);
  white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--navy-950); color:var(--white); border-color:var(--navy-950); }
.btn-primary:hover{ background:var(--navy-800); border-color:var(--navy-800); }
.btn-ghost-light{ background:transparent; color:var(--white); border-color:var(--line-navy); }
.btn-ghost-light:hover{ background:rgba(255,255,255,.08); border-color:var(--white-45); }
.btn-ghost-dark{ background:transparent; color:var(--navy-950); border-color:var(--line); }
.btn-ghost-dark:hover{ background:var(--navy-950); color:var(--white); border-color:var(--navy-950); }
.btn svg{ width:16px; height:16px; }

/* ============================== NAV ===================================== */
.site-nav{
  position:fixed; inset-inline:0; top:0; z-index:900;
  height:var(--nav-h);
  display:flex; align-items:center;
  transition:background var(--dur-m) var(--ease), box-shadow var(--dur-m) var(--ease),
             height var(--dur-m) var(--ease), border-color var(--dur-m) var(--ease),
             transform var(--dur-m) var(--ease), opacity var(--dur-m) var(--ease),
             visibility 0s;
  border-bottom:1px solid transparent;
}
.site-nav .container{
  display:flex; align-items:center; justify-content:space-between;
  width:100%;
}
.site-nav.is-scrolled{
  height:68px;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border-bottom-color:var(--line);
}
.site-nav.is-scrolled .brand-text,
.site-nav.is-scrolled .nav-link{ color:var(--ink); }
.site-nav.is-scrolled .nav-link.is-active{ color:var(--navy-800); }
.site-nav.is-scrolled .brand-text small{ color:var(--ink-45); }

/* Desktop only: once scrolled past the hero, the top bar steps aside for the rail */
@media (min-width:980px){
  body.nav-collapsed .site-nav{
    transform:translateY(-100%);
    opacity:0;
    visibility:hidden;
    transition:transform var(--dur-m) var(--ease), opacity var(--dur-m) var(--ease), visibility 0s var(--dur-m);
  }
}

.brand{ display:flex; align-items:center; gap:.65rem; }
.brand-mark{
  width:38px; height:38px; border-radius:50%; overflow:hidden; flex-shrink:0;
  border:1px solid var(--line-navy); background:var(--white);
}
.site-nav.is-scrolled .brand-mark{ border-color:var(--line); }
.brand-mark img{ width:100%; height:100%; object-fit:cover; }
.brand-text{
  color:var(--white);
  font-weight:700;
  font-size:1.05rem;
  letter-spacing:.03em;
  display:flex; flex-direction:column; line-height:1.15;
  transition:color var(--dur-m) var(--ease);
}
.brand-text small{
  font-weight:400; font-style:italic; font-size:.72rem;
  letter-spacing:.02em; color:var(--white-45); margin-top:2px;
  transition:color var(--dur-m) var(--ease);
}

.nav-links{
  display:flex; align-items:center; gap:var(--sp-4);
}
.nav-item{ position:relative; display:flex; align-items:center; }
.nav-link{
  color:var(--white-70);
  font-size:.85rem;
  letter-spacing:.04em;
  padding:.4rem 0;
  position:relative;
  transition:color var(--dur-s) var(--ease);
}
.nav-link::after{
  content:""; position:absolute; left:0; right:100%; bottom:-3px; height:1px;
  background:currentColor; transition:right var(--dur-m) var(--ease);
}
.nav-link:hover::after,
.nav-link.is-active::after{ right:0; }
.nav-link:hover{ color:var(--white); }
.nav-link.is-active{ color:var(--white); font-weight:700; }
.site-nav.is-scrolled .nav-link:hover{ color:var(--ink); }

.nav-caret{
  background:none; border:0; padding:.4rem; margin-left:-.25rem;
  color:inherit; cursor:pointer; display:inline-flex;
}
.nav-caret svg{ width:11px; height:11px; transition:transform var(--dur-s) var(--ease); }
.nav-item.is-open .nav-caret svg,
.nav-item.has-dropdown:hover .nav-caret svg,
.nav-item.has-dropdown:focus-within .nav-caret svg{ transform:rotate(180deg); }

.nav-dropdown{
  position:absolute; top:100%; left:0; margin-top:var(--sp-2);
  background:var(--navy-950);
  border:1px solid var(--line-navy);
  min-width:11rem;
  padding:.4rem;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity var(--dur-s) var(--ease), transform var(--dur-s) var(--ease), visibility 0s var(--dur-s);
  z-index:20;
}
.site-nav.is-scrolled .nav-dropdown{ background:var(--white); border-color:var(--line); box-shadow:0 12px 28px rgba(8,17,32,.12); }
.nav-item.has-dropdown:hover .nav-dropdown,
.nav-item.has-dropdown:focus-within .nav-dropdown,
.nav-item.is-open .nav-dropdown{
  opacity:1; visibility:visible; transform:translateY(0);
  transition:opacity var(--dur-s) var(--ease), transform var(--dur-s) var(--ease), visibility 0s;
}
.nav-dropdown a{
  display:block; padding:.6rem .75rem; font-size:.83rem; letter-spacing:.02em;
  color:var(--white-70);
}
.site-nav.is-scrolled .nav-dropdown a{ color:var(--ink-70); }
.nav-dropdown a:hover{ background:rgba(255,255,255,.06); color:var(--white); }
.site-nav.is-scrolled .nav-dropdown a:hover{ background:var(--paper); color:var(--ink); }

.nav-cta{ display:flex; align-items:center; gap:var(--sp-3); }
.nav-cta .btn{ padding:.65rem 1.2rem; font-size:.72rem; }

.nav-toggle{
  display:none;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  background:none; border:1px solid var(--line-navy);
  color:var(--white); cursor:pointer;
}
.site-nav.is-scrolled .nav-toggle{ color:var(--ink); border-color:var(--line); }
.nav-toggle span{ display:block; width:20px; height:1px; background:currentColor; position:relative; }
.nav-toggle span::before,.nav-toggle span::after{
  content:""; position:absolute; left:0; width:20px; height:1px; background:currentColor;
  transition:transform var(--dur-s) var(--ease), opacity var(--dur-s) var(--ease);
}
.nav-toggle span::before{ top:-6px; }
.nav-toggle span::after{ top:6px; }
.nav-toggle[aria-expanded="true"] span{ background:transparent; }
.nav-toggle[aria-expanded="true"] span::before{ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after{ transform:translateY(-6px) rotate(-45deg); }

@media (max-width: 980px){
  .nav-links{
    position:fixed; inset:68px 0 0 0;
    background:var(--navy-950);
    flex-direction:column; align-items:flex-start;
    padding:var(--sp-5) var(--sp-4);
    gap:var(--sp-3);
    transform:translateY(-8px);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity var(--dur-m) var(--ease), transform var(--dur-m) var(--ease), visibility var(--dur-m);
    overflow-y:auto;
  }
  .nav-links.is-open{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0);
  }
  .nav-link{ color:var(--white-70); font-size:1.1rem; }
  .nav-item{ width:100%; flex-wrap:wrap; }
  .nav-caret{ margin-left:auto; color:var(--white-70); }
  .nav-dropdown{
    position:static; opacity:1; visibility:visible; transform:none; transition:none;
    background:none; border:0; padding:0 0 0 var(--sp-3); margin-top:.25rem;
    width:100%; max-height:0; overflow:hidden;
  }
  .nav-item.is-open .nav-dropdown{ max-height:12rem; }
  .nav-dropdown a{ font-size:1rem; padding:.5rem 0; color:var(--white-45); }
  .nav-cta{ margin-top:var(--sp-2); }
  .nav-toggle{ display:inline-flex; }
}

/* ---- Compact left-side nav rail (desktop, appears once scrolled) ---- */
.nav-rail{
  position:fixed; left:22px; top:50%; z-index:901;
  transform:translate(-16px, -50%);
  display:none;
  flex-direction:column; align-items:center; gap:var(--sp-3);
  background:var(--navy-950);
  border:1px solid var(--line-navy);
  padding:var(--sp-3) .6rem;
  opacity:0; visibility:hidden;
  transition:opacity var(--dur-m) var(--ease), transform var(--dur-m) var(--ease), visibility 0s var(--dur-m);
}
@media (min-width:980px){
  .nav-rail{ display:flex; }
  body.nav-collapsed .nav-rail{
    opacity:1; visibility:visible; transform:translate(0,-50%);
    transition:opacity var(--dur-m) var(--ease) .1s, transform var(--dur-m) var(--ease) .1s, visibility 0s;
  }
}
.rail-logo{ width:34px; height:34px; border-radius:50%; overflow:hidden; border:1px solid var(--line-navy); flex-shrink:0; }
.rail-logo img{ width:100%; height:100%; object-fit:cover; }
.rail-rule{ width:18px; height:1px; background:var(--line-navy); }
.rail-links{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-3); }
.rail-link{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  color:var(--white-45);
  writing-mode:vertical-rl;
  font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.3rem .1rem;
  transition:color var(--dur-s) var(--ease);
}
.rail-link.is-active{ color:var(--white); }
.rail-link.is-active::before{
  content:""; position:absolute; left:-.6rem; top:0; bottom:0; width:2px; background:var(--white);
}
.rail-link:hover{ color:var(--white); }
.rail-item{ position:relative; }
.rail-dropdown{
  position:absolute; left:100%; top:50%; transform:translate(6px,-50%);
  background:var(--navy-950); border:1px solid var(--line-navy);
  min-width:10.5rem; padding:.4rem;
  opacity:0; visibility:hidden; transition:opacity var(--dur-s) var(--ease), visibility 0s var(--dur-s);
}
.rail-item:hover .rail-dropdown,
.rail-item:focus-within .rail-dropdown,
.rail-item.is-open .rail-dropdown{
  opacity:1; visibility:visible; transition:opacity var(--dur-s) var(--ease), visibility 0s;
}
.rail-dropdown a{
  display:block; padding:.55rem .7rem; font-size:.8rem; color:var(--white-70);
  writing-mode:horizontal-tb; text-align:left; letter-spacing:.02em;
}
.rail-dropdown a:hover{ background:rgba(255,255,255,.07); color:var(--white); }
.rail-cv{
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line-navy); color:var(--white);
  transition:background var(--dur-s) var(--ease);
}
.rail-cv:hover{ background:rgba(255,255,255,.08); }
.rail-cv svg{ width:14px; height:14px; }

/* ============================== HERO ===================================== */
.hero{
  position:relative;
  min-height:100dvh;
  display:flex; align-items:center;
  background:
    radial-gradient(ellipse 60% 60% at 85% 15%, rgba(44,85,134,.35), transparent 60%),
    linear-gradient(160deg, var(--navy-950) 0%, var(--navy-900) 55%, var(--navy-800) 100%);
  color:var(--white);
  overflow:hidden;
  padding-top:var(--nav-h);
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(180deg, rgba(255,255,255,.035) 0px, rgba(255,255,255,.035) 1px, transparent 1px, transparent 42px);
  pointer-events:none;
}
.hero .container{
  position:relative; z-index:2;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:var(--sp-7);
  align-items:center;
  padding-top:var(--sp-6);
  padding-bottom:clamp(4rem, 10vh, 7rem);
}
.hero-copy{ opacity:0; transform:translateY(18px); }
.hero-copy .eyebrow{ margin-bottom:var(--sp-3); }
.hero-title{
  font-size:var(--fs-hero);
  font-weight:700;
  line-height:1.04;
  letter-spacing:-.01em;
}
.hero-role{
  margin-top:var(--sp-3);
  height:1.5em;
  overflow:hidden;
  position:relative;
  font-style:italic;
  font-size:clamp(1.15rem,2.2vw,1.55rem);
  color:var(--white-70);
}
.hero-role ul{ position:relative; }
.hero-role li{
  position:absolute; inset:0;
  opacity:0; transform:translateY(65%);
  transition:transform .45s var(--ease), opacity .3s ease;
}
.hero-role li.is-active{
  opacity:1; transform:translateY(0);
  transition:transform .45s var(--ease) .18s, opacity .35s ease .18s;
}
.hero-role li.is-leaving{
  opacity:0; transform:translateY(-65%);
  transition:transform .3s var(--ease), opacity .2s ease;
}

.hero-lede{
  margin-top:var(--sp-4);
  font-size:var(--fs-lead);
  color:var(--white-70);
  max-width:34rem;
}
.hero-actions{
  margin-top:var(--sp-5);
  display:flex; flex-wrap:wrap; gap:var(--sp-2);
}
.hero-meta{
  margin-top:var(--sp-6);
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--sp-4);
  max-width:34rem;
}
.hero-meta div{ border-left:1px solid var(--line-navy); padding-left:var(--sp-2); }
@media (max-width:560px){
  .hero-meta{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:var(--sp-3); }
}
.hero-meta b{ display:block; font-size:1.4rem; }
.hero-meta span{ font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase; color:var(--white-45); }

.hero-portrait{
  position:relative;
  opacity:0; transform:translateY(18px);
  justify-self:center;
}
.portrait-frame{
  position:relative;
  width:min(340px, 80vw);
  aspect-ratio: 4/5;
  border:1px solid var(--line-navy);
  padding:14px;
}
.portrait-frame::before, .portrait-frame::after{
  content:""; position:absolute; width:26px; height:26px;
  border:1px solid var(--white-45);
}
.portrait-frame::before{ top:-1px; left:-1px; border-right:0; border-bottom:0; }
.portrait-frame::after{ bottom:-1px; right:-1px; border-left:0; border-top:0; }
.portrait-inner{
  width:100%; height:100%; overflow:hidden;
  background:var(--navy-800);
  position:relative;
}
.portrait-inner img{ width:100%; height:100%; object-fit:cover; }
.portrait-cap{
  position:absolute; left:14px; right:14px; bottom:-1px;
  transform:translateY(100%);
  display:flex; justify-content:space-between;
  font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase;
  color:var(--white-45); padding-top:.6rem;
}
.portrait-crest{
  position:absolute; top:-18px; right:-18px;
  width:76px; height:76px; border-radius:50%;
  background:var(--white);
  border:1px solid var(--navy-700);
  box-shadow:0 8px 22px rgba(4,10,20,.35);
  overflow:hidden;
  opacity:0; transform:scale(.7) rotate(-8deg);
  transition:opacity .6s var(--ease) .5s, transform .6s var(--ease) .5s;
}
.hero-portrait.is-in .portrait-crest{ opacity:1; transform:scale(1) rotate(0deg); }
.portrait-crest img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:560px){ .portrait-crest{ width:56px; height:56px; top:-12px; right:-12px; } }

.scroll-cue{
  position:absolute; left:50%; bottom:var(--sp-4); transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  color:var(--white-45); font-size:var(--fs-caption); letter-spacing:.2em; text-transform:uppercase;
  z-index:2;
}
.scroll-cue i{ width:1px; height:34px; background:var(--white-45); position:relative; overflow:hidden; }
.scroll-cue i::after{
  content:""; position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--white);
  animation:scrollcue 2.2s var(--ease) infinite;
}
@keyframes scrollcue{ to{ top:100%; } }

@media (max-width:980px){
  .hero .container{ grid-template-columns:1fr; text-align:left; }
  .hero-portrait{ order:-1; justify-self:flex-start; margin-bottom:var(--sp-3); }
  .portrait-frame{ width:min(220px,60vw); }
}

/* Reveal-on-scroll (generic) */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal-stagger.is-visible > *{ opacity:1; transform:translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1){ transition-delay:.03s; }
.reveal-stagger.is-visible > *:nth-child(2){ transition-delay:.09s; }
.reveal-stagger.is-visible > *:nth-child(3){ transition-delay:.15s; }
.reveal-stagger.is-visible > *:nth-child(4){ transition-delay:.21s; }
.reveal-stagger.is-visible > *:nth-child(5){ transition-delay:.27s; }
.reveal-stagger.is-visible > *:nth-child(6){ transition-delay:.33s; }
.reveal-stagger.is-visible > *:nth-child(7){ transition-delay:.39s; }
.reveal-stagger.is-visible > *:nth-child(8){ transition-delay:.45s; }
.reveal-stagger.is-visible > *:nth-child(9){ transition-delay:.51s; }

/* ============================== ABOUT / TIMELINE ========================= */
.about-grid{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap:var(--sp-7);
}
.about-bio p + p{ margin-top:var(--sp-3); }
.about-bio{ color:var(--ink-70); font-size:var(--fs-body); }
.about-bio .drop{
  font-size:1.15rem; color:var(--ink); font-style:italic;
}
.about-facts{
  margin-top:var(--sp-5);
  display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3);
}
.about-facts dt{ font-size:var(--fs-caption); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-45); }
.about-facts dd{ margin:.25rem 0 0; font-size:var(--fs-small); }

.timeline{ position:relative; padding-left:2.1rem; }
.timeline::before{
  content:""; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:var(--line);
}
.timeline-item{ position:relative; padding-bottom:var(--sp-5); }
.timeline-item:last-child{ padding-bottom:0; }
.timeline-item::before{
  content:""; position:absolute; left:-2.1rem; top:4px;
  width:11px; height:11px; border-radius:50%;
  background:var(--white); border:2px solid var(--navy-800);
}
.timeline-year{
  font-size:var(--fs-caption); letter-spacing:.12em; text-transform:uppercase; color:var(--navy-700); font-weight:700;
}
.timeline-degree{ font-size:var(--fs-h3); font-weight:700; margin-top:.35rem; }
.timeline-inst{ color:var(--ink-70); margin-top:.15rem; font-style:italic; }
.timeline-desc{ color:var(--ink-70); margin-top:.5rem; font-size:var(--fs-small); }

@media (max-width:900px){
  .about-grid{ grid-template-columns:1fr; gap:var(--sp-5); }
}

/* ============================== TEACHING ================================ */
.pullquote{
  border-left:3px solid var(--navy-800);
  padding-left:var(--sp-4);
  font-size:var(--fs-lead);
  font-style:italic;
  color:var(--ink);
  max-width:46rem;
}
.pullquote cite{ display:block; margin-top:var(--sp-2); font-style:normal; font-size:var(--fs-small); color:var(--ink-45); }

.stat-row{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:var(--sp-3);
  margin-block:var(--sp-6);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding-block:var(--sp-4);
}
.stat{ text-align:left; padding-inline:var(--sp-2); border-left:1px solid var(--line); }
.stat:first-child{ border-left:0; padding-left:0; }
.stat b{ display:block; font-size:clamp(1.7rem,3vw,2.4rem); font-weight:700; }
.stat span{ font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-45); }

@media (max-width:760px){
  .stat-row{ grid-template-columns:repeat(2,1fr); row-gap:var(--sp-4); }
  .stat:nth-child(3){ border-left:0; padding-left:0; }
}

.course-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-4);
}
.course-card{
  border:1px solid var(--line);
  padding:var(--sp-4);
  transition:border-color var(--dur-s) var(--ease), transform var(--dur-s) var(--ease);
  position:relative;
}
.course-card:hover{ border-color:var(--navy-700); transform:translateY(-3px); }
.course-code{
  font-size:var(--fs-caption); letter-spacing:.12em; text-transform:uppercase; color:var(--navy-700); font-weight:700;
}
.course-title{ font-size:var(--fs-h3); font-weight:700; margin-top:.4rem; }
.course-inst{ color:var(--ink-45); font-style:italic; font-size:var(--fs-small); margin-top:.2rem; }
.course-desc{ margin-top:var(--sp-2); color:var(--ink-70); font-size:var(--fs-small); }
.course-badges{ margin-top:var(--sp-3); display:flex; gap:.5rem; flex-wrap:wrap; }
.badge{
  font-size:.7rem; letter-spacing:.06em; text-transform:uppercase;
  border:1px solid var(--line); padding:.3rem .6rem; color:var(--ink-70);
}
.badge.strong{ background:var(--navy-950); color:var(--white); border-color:var(--navy-950); }

@media (max-width:760px){ .course-grid{ grid-template-columns:1fr; } }

.credential-strip{
  margin-top:var(--sp-6);
  display:flex; align-items:center; gap:var(--sp-3);
  border:1px solid var(--line); padding:var(--sp-3) var(--sp-4);
}
.credential-strip .seal-mini{ flex-shrink:0; }
.credential-strip h4{ font-size:1rem; font-weight:700; }
.credential-strip p{ color:var(--ink-70); font-size:var(--fs-small); margin-top:.2rem; }

/* ---- Evaluation metrics (real course-evaluation data vs. USM benchmark) ---- */
.eval-metrics{
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-4) var(--sp-6);
  margin-top:var(--sp-1);
}
.eval-metric-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-2);
}
.eval-label{ font-size:var(--fs-small); color:var(--ink-70); }
.eval-score{ font-size:1.3rem; font-weight:700; }
.eval-score small{ font-size:.65em; font-weight:400; color:var(--ink-45); }
.eval-bar{
  position:relative; height:8px; margin-top:.6rem;
  background:var(--line);
}
.eval-bar-fill{ height:100%; background:var(--navy-800); }
.eval-bar-bench{
  position:absolute; top:-3px; width:2px; height:14px; background:var(--ink);
}
.eval-bench-label{ margin-top:.5rem; font-size:var(--fs-caption); color:var(--ink-45); letter-spacing:.04em; }
.eval-bar-key{
  margin-top:var(--sp-3); font-size:var(--fs-caption); color:var(--ink-45);
  letter-spacing:.04em; display:flex; align-items:center; gap:.4rem;
}
.eval-bar-key .key-tick{ color:var(--ink); font-weight:700; }

@media (max-width:640px){
  .eval-metrics{ grid-template-columns:1fr; gap:var(--sp-4); }
}

/* ---- Testimonial slider (value-infinity-inspired) ---- */
.testimonials{ margin-top:var(--sp-7); }
.testimonial-viewport{
  position:relative;
  max-width:52rem;
  margin-inline:auto;
  background:var(--navy-950);
  padding:clamp(1rem,3vw,2.5rem);
}
.testimonial-track{ position:relative; }
.t-card{
  border:1px solid var(--line-navy);
  background:rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  padding:var(--sp-5);
  display:none;
  cursor:grab;
  user-select:none;
}
.t-card.is-active{ display:block; animation:tfade .5s var(--ease); }
@keyframes tfade{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:translateY(0);} }
.t-quote-mark{ width:34px; height:34px; color:var(--white-45); }
.t-text{ margin-top:var(--sp-3); font-size:var(--fs-lead); font-style:italic; color:var(--white); }
.t-person{ margin-top:var(--sp-4); display:flex; align-items:center; gap:var(--sp-2); }
.t-avatar{
  width:52px; height:52px; border-radius:50%;
  border:2px solid var(--line-navy);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; color:var(--white); background:var(--navy-800);
  flex-shrink:0;
}
.t-name{ font-weight:700; }
.t-role{ color:var(--white-45); font-size:var(--fs-small); }

.t-controls{
  display:flex; align-items:center; justify-content:center; gap:var(--sp-3);
  margin-top:var(--sp-4);
}
.t-arrow{
  width:42px; height:42px; border:1px solid var(--line-navy); background:transparent; color:var(--white);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background var(--dur-s) var(--ease), border-color var(--dur-s) var(--ease);
}
.t-arrow:hover{ background:rgba(255,255,255,.08); border-color:var(--white-45); }
.t-arrow svg{ width:16px; height:16px; }
.t-dots{ display:flex; gap:.5rem; }
.t-dot{
  width:8px; height:8px; border-radius:50%; border:1px solid var(--white-45); background:transparent; padding:0; cursor:pointer;
  transition:background var(--dur-s) var(--ease), width var(--dur-s) var(--ease);
}
.t-dot.is-active{ background:var(--white); width:22px; border-radius:5px; }
.t-cite{ display:block; margin-top:var(--sp-3); font-style:normal; color:var(--white-45); font-size:var(--fs-small); }

/* ---- Homepage teaching slider: bigger decorative mark, pure crossfade ---- */
.home-teaching-slider{ max-width:44rem; margin-inline:auto; }
.home-teaching-slider .t-card{ padding-top:var(--sp-6); position:relative; }
.home-teaching-slider .t-card.is-active{ animation:tfadeonly .7s ease; }
@keyframes tfadeonly{ from{ opacity:0; } to{ opacity:1; } }
.home-teaching-slider .t-quote-mark{
  position:absolute; top:var(--sp-3); left:var(--sp-4);
  width:64px; height:64px; color:var(--white); opacity:.18;
}
.home-teaching-slider .t-text{ position:relative; z-index:1; }
.home-teaching-slider .t-cite{ position:relative; z-index:1; }
@media (max-width:560px){
  .home-teaching-slider .t-card{ padding-top:var(--sp-5); }
  .home-teaching-slider .t-quote-mark{ width:44px; height:44px; top:var(--sp-2); left:var(--sp-3); }
}

/* ============================== RESEARCH ================================ */
.award-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-4);
  margin-bottom:var(--sp-6);
}
.award-card{
  border:1px solid var(--line);
  padding:var(--sp-4);
  display:flex; gap:var(--sp-3); align-items:flex-start;
}
.award-icon{
  width:52px; height:52px; flex-shrink:0;
  border:1px solid var(--navy-800);
  display:flex; align-items:center; justify-content:center; color:var(--navy-800);
}
.award-icon svg{ width:24px; height:24px; }
.award-title{ font-weight:700; font-size:1.05rem; }
.award-meta{ font-size:var(--fs-small); color:var(--ink-45); font-style:italic; margin-top:.2rem; }
.award-desc{ font-size:var(--fs-small); color:var(--ink-70); margin-top:.5rem; }

.pub-list{ display:flex; flex-direction:column; }
.pub-item{
  display:grid; grid-template-columns:6.5rem 1fr; gap:var(--sp-4);
  padding-block:var(--sp-4);
  border-top:1px solid var(--line);
}
.pub-item:last-child{ border-bottom:1px solid var(--line); }
.pub-year{ font-size:var(--fs-h3); font-weight:700; color:var(--ink-45); font-variant-numeric:tabular-nums; }
.pub-title{ font-size:1.08rem; font-weight:700; }
.pub-venue{ color:var(--ink-70); font-style:italic; margin-top:.25rem; font-size:var(--fs-small); }
.pub-tag{ display:inline-block; margin-top:.6rem; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--navy-700); }

@media (max-width:700px){
  .award-grid{ grid-template-columns:1fr; }
  .pub-item{ grid-template-columns:1fr; gap:.4rem; }
}

/* ============================== FACT-CHECKING ============================ */
.factcheck-lede{
  display:flex; gap:var(--sp-4); align-items:center;
  padding:var(--sp-4); border:1px solid var(--line); margin-bottom:var(--sp-6);
}
.seal{
  width:86px; height:86px; flex-shrink:0; position:relative; color:var(--navy-900);
}
.seal-mini{ width:44px; height:44px; color:var(--navy-900); }

.fc-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-3);
}
.fc-item{
  display:flex; gap:var(--sp-3);
  border:1px solid var(--line);
  padding:var(--sp-3);
  align-items:flex-start;
}
.fc-num{ font-size:var(--fs-small); color:var(--ink-45); font-variant-numeric:tabular-nums; padding-top:.15rem; }
.fc-title{ font-weight:700; font-size:.98rem; }
.fc-verdict{ margin-top:.3rem; font-size:var(--fs-caption); letter-spacing:.06em; text-transform:uppercase; color:var(--navy-700); font-weight:700; }
.fc-desc{ margin-top:.35rem; color:var(--ink-70); font-size:var(--fs-small); }

@media (max-width:760px){ .fc-grid{ grid-template-columns:1fr; } }

/* ============================== BLOG ===================================== */
.blog-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-4);
}
.blog-card{ border-top:1px solid var(--line); padding-top:var(--sp-3); }
.blog-num{ font-size:var(--fs-caption); color:var(--ink-45); letter-spacing:.1em; }
.blog-title{ font-size:1.15rem; font-weight:700; margin-top:.5rem; }
.blog-title a{ background-image:linear-gradient(currentColor,currentColor); background-position:0 100%; background-repeat:no-repeat; background-size:0% 1px; transition:background-size var(--dur-m) var(--ease); }
.blog-title a:hover{ background-size:100% 1px; }
.blog-excerpt{ margin-top:.5rem; color:var(--ink-70); font-size:var(--fs-small); }
.blog-meta{ margin-top:var(--sp-2); font-size:var(--fs-caption); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-45); }

@media (max-width:900px){ .blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .blog-grid{ grid-template-columns:1fr; } }

/* ============================== MEDIA PRODUCTION ========================= */
.media-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-3);
}
.media-card{
  border:1px solid var(--line-navy);
  padding:var(--sp-4);
  text-align:left;
  transition:background var(--dur-s) var(--ease), border-color var(--dur-s) var(--ease), transform var(--dur-s) var(--ease);
}
.media-card:hover{ background:rgba(255,255,255,.06); border-color:var(--white-45); transform:translateY(-3px); }
.media-icon{ width:30px; height:30px; color:var(--white); }
.media-name{ margin-top:var(--sp-3); font-weight:700; }
.media-sub{ margin-top:.25rem; font-size:var(--fs-small); color:var(--white-45); }
.media-link{ margin-top:var(--sp-3); display:inline-flex; align-items:center; gap:.4rem; font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase; color:var(--white-70); }
.media-link svg{ width:12px; height:12px; }

.media-grid.on-light .media-card{ border-color:var(--line); }
.media-grid.on-light .media-card:hover{ background:var(--paper); border-color:var(--navy-700); }
.media-grid.on-light .media-icon{ color:var(--navy-800); }
.media-grid.on-light .media-name{ color:var(--ink); }
.media-grid.on-light .media-sub{ color:var(--ink-45); }
.media-grid.on-light .media-link{ color:var(--navy-700); }

.feature-strip{
  margin-top:var(--sp-5);
  border:1px solid var(--line-navy);
  padding:var(--sp-4);
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap;
}
.feature-strip .tag{ font-size:var(--fs-caption); letter-spacing:.1em; text-transform:uppercase; color:var(--white-45); }
.feature-strip h4{ font-size:1.1rem; margin-top:.35rem; }
.feature-strip p{ color:var(--white-70); font-size:var(--fs-small); margin-top:.25rem; max-width:36rem; }

@media (max-width:980px){ .media-grid{ grid-template-columns:repeat(2,1fr); } }

/* ============================== CONTACT ================================== */
.contact-grid{
  display:grid; grid-template-columns:1.1fr .9fr; gap:var(--sp-7);
}
.contact-list{ margin-top:var(--sp-4); display:flex; flex-direction:column; }
.contact-row{
  display:flex; align-items:center; justify-content:space-between;
  padding-block:var(--sp-3);
  border-top:1px solid var(--line);
}
.contact-list .contact-row:last-child{ border-bottom:1px solid var(--line); }
.contact-row .label{ display:flex; align-items:center; gap:var(--sp-3); }
.contact-row svg{ width:20px; height:20px; color:var(--navy-800); flex-shrink:0; }
.contact-row .value{ font-style:italic; color:var(--ink-70); }
.contact-row a.value:hover{ color:var(--navy-800); }

.cv-box{
  border:1px solid var(--ink);
  padding:var(--sp-5);
  height:fit-content;
}
.cv-box h3{ font-size:var(--fs-h3); font-weight:700; }
.cv-box p{ color:var(--ink-70); margin-top:var(--sp-2); font-size:var(--fs-small); }
.cv-box .btn{ margin-top:var(--sp-4); width:100%; justify-content:center; }

@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; gap:var(--sp-5); } }

/* ============================== FOOTER ==================================== */
.site-footer{
  background:var(--navy-950); color:var(--white-45);
  padding-block:var(--sp-5);
  font-size:var(--fs-small);
}
.footer-row{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--sp-2);
}
.footer-socials{ display:flex; gap:var(--sp-3); }
.footer-socials a{ color:var(--white-45); transition:color var(--dur-s) var(--ease); }
.footer-socials a:hover{ color:var(--white); }
.footer-socials svg{ width:18px; height:18px; }
.to-top{
  color:var(--white-45); font-size:var(--fs-caption); letter-spacing:.1em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:.4rem;
}
.to-top:hover{ color:var(--white); }

/* ============================== RESPONSIVE bits shared ==================== */
@media (max-width:760px){
  .section-head{ margin-bottom:var(--sp-5); }
}

/* ============================== SUBPAGE CHROME ============================ */
.page-header{
  background:
    radial-gradient(ellipse 60% 60% at 85% 15%, rgba(44,85,134,.35), transparent 60%),
    linear-gradient(160deg, var(--navy-950) 0%, var(--navy-900) 55%, var(--navy-800) 100%);
  color:var(--white);
  padding-top:calc(var(--nav-h) + var(--sp-6));
  padding-bottom:var(--sp-6);
}
.breadcrumb{
  display:flex; align-items:center; gap:.5rem;
  font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase;
  color:var(--white-45); margin-bottom:var(--sp-3);
}
.breadcrumb a{ color:var(--white-70); }
.breadcrumb a:hover{ color:var(--white); }
.page-header h1{
  font-size:var(--fs-h1); font-weight:700; letter-spacing:-.01em;
}
.page-header p{
  margin-top:var(--sp-2); color:var(--white-70); font-size:var(--fs-lead); max-width:38rem;
}
.page-header.has-photo .container{
  display:grid; grid-template-columns:1.3fr .7fr; gap:var(--sp-6); align-items:center;
}
.page-header-photo{ justify-self:center; }
.page-header-photo .portrait-frame.sm{ width:min(240px,64vw); }
@media (max-width:860px){
  .page-header.has-photo .container{ grid-template-columns:1fr; }
  .page-header-photo{ order:-1; justify-self:flex-start; margin-bottom:var(--sp-3); }
  .page-header-photo .portrait-frame.sm{ width:min(180px,52vw); }
}

/* Media page: headshot intro + a featured "Pinak" music block */
.media-intro{
  display:grid; grid-template-columns:.6fr 1.4fr; gap:var(--sp-6);
  align-items:center; margin-bottom:var(--sp-7);
}
.media-headshot{
  border:1px solid var(--line); background:var(--white);
  padding:10px;
}
.media-headshot img{ width:100%; height:auto; display:block; }
@media (max-width:760px){
  .media-intro{ grid-template-columns:1fr; }
  .media-headshot{ max-width:220px; }
}

.music-feature{
  display:grid; grid-template-columns:.6fr 1.4fr; gap:var(--sp-5);
  align-items:center;
  border:1px solid var(--line-navy);
  background:rgba(255,255,255,.03);
  padding:var(--sp-4);
  margin-bottom:var(--sp-4);
}
.music-feature .portrait-frame{ width:100%; max-width:180px; margin-inline:auto; }
.music-feature h3{ font-size:1.15rem; font-weight:700; color:var(--white); }
.music-feature p{ color:var(--white-70); font-size:var(--fs-small); margin-top:.4rem; max-width:32rem; }
.music-feature .music-links{ display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-3); }
@media (max-width:700px){ .music-feature{ grid-template-columns:1fr; text-align:center; } }

.learn-more{
  display:inline-flex; align-items:center; gap:.5rem;
  margin-top:var(--sp-4);
  font-size:.85rem; font-weight:700; letter-spacing:.04em;
  color:var(--navy-800);
  border-bottom:1px solid var(--navy-800);
  padding-bottom:2px;
}
.on-navy .learn-more{ color:var(--white); border-color:var(--white-45); }
.learn-more svg{ width:14px; height:14px; transition:transform var(--dur-s) var(--ease); }
.learn-more:hover svg{ transform:translateX(3px); }

.brief-lede{ font-size:var(--fs-lead); color:var(--ink-70); max-width:40rem; }
.on-navy .brief-lede{ color:var(--white-70); }

/* Role history (About full page) */
.role-history{ display:flex; flex-direction:column; }
.role-item{
  display:grid; grid-template-columns:8.5rem 1fr; gap:var(--sp-4);
  padding-block:var(--sp-4); border-top:1px solid var(--line);
}
.role-history .role-item:last-child{ border-bottom:1px solid var(--line); }
.role-when{ font-size:var(--fs-caption); letter-spacing:.06em; text-transform:uppercase; color:var(--ink-45); }
.role-when b{ display:block; font-size:var(--fs-small); letter-spacing:.02em; text-transform:none; color:var(--navy-700); margin-bottom:.3rem; }
.role-title{ font-weight:700; font-size:1.05rem; }
.role-org{ color:var(--ink-70); font-style:italic; margin-top:.2rem; font-size:var(--fs-small); }
.role-desc{ color:var(--ink-70); margin-top:.4rem; font-size:var(--fs-small); }
@media (max-width:640px){ .role-item{ grid-template-columns:1fr; gap:.3rem; } }

/* ============================== WORK (homepage, 3 cards) ================== */
.work-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-4);
  align-items:stretch;
}
.work-card{
  border:1px solid var(--line-navy);
  padding:var(--sp-4);
  display:flex; flex-direction:column;
  background:rgba(255,255,255,.02);
}
.work-card-head{ display:flex; align-items:center; gap:.6rem; margin-bottom:var(--sp-3); }
.work-card-head svg{ width:20px; height:20px; color:var(--white); }
.work-card-head h3{ font-size:1.05rem; font-weight:700; color:var(--white); }

/* Mini fact-check slider inside its card */
.mini-slider{ position:relative; flex:1; display:flex; flex-direction:column; }
.mini-track{ position:relative; min-height:9.5rem; }
.mini-card{ display:none; }
.mini-card.is-active{ display:block; animation:tfade .5s var(--ease); }
.mini-verdict{ font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--white-45); }
.mini-title{ margin-top:.5rem; font-size:.95rem; line-height:1.5; color:var(--white); }
.mini-title a{ color:inherit; }
.mini-title a:hover{ text-decoration:underline; }
.mini-controls{ display:flex; align-items:center; justify-content:space-between; margin-top:var(--sp-3); }
.mini-dots{ display:flex; gap:.35rem; }
.mini-dot{ width:6px; height:6px; border-radius:50%; border:1px solid var(--white-45); background:none; padding:0; cursor:pointer; }
.mini-dot.is-active{ background:var(--white); width:16px; border-radius:4px; }
.mini-arrow{ width:30px; height:30px; border:1px solid var(--line-navy); background:none; color:var(--white); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.mini-arrow:hover{ background:rgba(255,255,255,.08); }
.mini-arrow svg{ width:12px; height:12px; }
.mini-arrows{ display:flex; gap:.4rem; }

/* Media list inside its card */
.media-list{ display:flex; flex-direction:column; flex:1; }
.media-list-item{
  display:flex; align-items:center; gap:.7rem;
  padding-block:.65rem; border-top:1px solid var(--line-navy);
}
.media-list .media-list-item:first-child{ border-top:0; }
.media-list-item svg{ width:18px; height:18px; color:var(--white-70); flex-shrink:0; }
.media-list-item .m-name{ font-size:.88rem; color:var(--white); }
.media-list-item .m-sub{ font-size:.72rem; color:var(--white-45); }
.media-list-item{ color:inherit; }
.media-list-item:hover svg,
.media-list-item:hover .m-name{ color:var(--white); }
.media-list-item:hover{ background:rgba(255,255,255,.04); }

/* Blog list inside its card */
.blog-mini-list{ display:flex; flex-direction:column; flex:1; }
.blog-mini-item{ padding-block:.75rem; border-top:1px solid var(--line-navy); }
.blog-mini-list .blog-mini-item:first-child{ border-top:0; }
.blog-mini-title{ font-size:.92rem; color:var(--white); line-height:1.45; }
.blog-mini-title a{ color:inherit; }
.blog-mini-title a:hover{ text-decoration:underline; }

.work-card-foot{ margin-top:var(--sp-4); padding-top:var(--sp-3); border-top:1px solid var(--line-navy); }
.card-view-all{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--white-70);
}
.card-view-all:hover{ color:var(--white); }
.card-view-all svg{ width:12px; height:12px; }

@media (max-width:980px){ .work-grid{ grid-template-columns:1fr; } }

/* ============================== LINKS LIST (research / contact) =========== */
.links-list{ display:flex; flex-direction:column; margin-top:var(--sp-4); }
.links-list .contact-row svg{ color:var(--navy-800); }
.on-navy .links-list .contact-row{ border-top-color:var(--line-navy); }
.on-navy .links-list .contact-row:last-child{ border-bottom-color:var(--line-navy); }
.on-navy .links-list svg{ color:var(--white-70); }
.on-navy .links-list .value{ color:var(--white-70); }

/* Mini column grid (About: Published Novel / Languages / Certifications) */
.mini-col-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5);
}
.mini-col h4{
  font-size:.78rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--navy-700); font-weight:700; margin-bottom:.9rem;
}
.mini-col p{ font-size:var(--fs-small); color:var(--ink-70); }
.mini-col .novel-title{ font-size:1.15rem; font-weight:700; font-style:italic; color:var(--ink); margin-bottom:.3rem; }
.mini-col ul{ display:flex; flex-direction:column; gap:.5rem; }
.mini-col li{ font-size:var(--fs-small); color:var(--ink-70); border-top:1px solid var(--line); padding-top:.5rem; }
.mini-col li:first-child{ border-top:0; padding-top:0; }
@media (max-width:760px){ .mini-col-grid{ grid-template-columns:1fr; gap:var(--sp-5); } }

/* Research interests */
.interest-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-3); }
.interest-item{ border-top:1px solid var(--line); padding-top:var(--sp-2); font-size:var(--fs-small); color:var(--ink-70); }
@media (max-width:640px){ .interest-grid{ grid-template-columns:1fr; } }

/* Full Fact-Checking page grid */
.fc-full-item{
  border:1px solid var(--line); padding:var(--sp-4);
  display:flex; flex-direction:column; gap:.5rem;
}
.fc-full-verdict{ font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase; color:var(--navy-700); font-weight:700; }
.fc-full-title{ font-size:1.05rem; font-weight:700; }
.fc-full-title a:hover{ text-decoration:underline; }
.fc-full-link{ margin-top:.3rem; font-size:.78rem; color:var(--ink-45); word-break:break-word; }
.fc-full-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-3); }
@media (max-width:760px){ .fc-full-grid{ grid-template-columns:1fr; } }

/* ============================== SINGLE POST (WordPress content) =========== */
.post-content-wrap{ max-width:42rem; }
.post-meta{
  font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase;
  color:var(--white-45); margin-top:var(--sp-2);
}
.post-featured-image{ margin-bottom:var(--sp-6); }
.post-featured-image img{ width:100%; height:auto; }

.entry-content{ font-size:var(--fs-body); color:var(--ink-70); line-height:1.8; }
.entry-content > * + *{ margin-top:1.4em; }
.entry-content h2{ font-size:var(--fs-h2); color:var(--ink); font-weight:700; margin-top:1.8em; letter-spacing:-.01em; }
.entry-content h3{ font-size:1.4rem; color:var(--ink); font-weight:700; margin-top:1.6em; }
.entry-content h4{ font-size:1.15rem; color:var(--ink); font-weight:700; margin-top:1.4em; }
.entry-content p{ margin:0; }
.entry-content a{ color:var(--navy-800); text-decoration:underline; text-underline-offset:2px; }
.entry-content a:hover{ color:var(--navy-700); }
.entry-content strong{ color:var(--ink); }
.entry-content blockquote{
  border-left:3px solid var(--navy-800); padding-left:var(--sp-4);
  font-style:italic; color:var(--ink);
}
.entry-content img{ max-width:100%; height:auto; }
.entry-content ul, .entry-content ol{ padding-left:1.4em; }
.entry-content li + li{ margin-top:.5em; }
.entry-content figure{ margin:0; }
.entry-content figcaption{ font-size:var(--fs-caption); color:var(--ink-45); margin-top:.5rem; }
.entry-content hr{ border:0; border-top:1px solid var(--line); margin:2em 0; }

.post-nav{
  display:flex; justify-content:space-between; gap:var(--sp-4);
  margin-top:var(--sp-7); padding-top:var(--sp-4); border-top:1px solid var(--line);
  max-width:42rem;
}
.post-nav a{ font-size:var(--fs-small); color:var(--navy-800); }
.post-nav a:hover{ color:var(--navy-700); }

.blog-post-date{ display:block; margin-top:.35rem; }