/* ==========================================================================
   Anustup Kundu — site-wide stylesheet
   Design: warm cream page, floating white cards, navy/gold accents
   Fonts: Fraunces (headings) + Inter (body) + IBM Plex Mono (meta/labels)
   ========================================================================== */

:root{
  --cream:        #F3EFE6;
  --card-white:   #FFFFFF;
  --navy:         #1C2B4A;
  --slate:        #5C6B85;
  --body-text:    #33415E;
  --gold:         #B08D3E;
  --rule:         rgba(28,43,74,0.14);
  --card-shadow:  0 1px 0 rgba(28,43,74,0.05), 0 24px 48px -12px rgba(28,43,74,0.18);
  --card-shadow-sm: 0 1px 0 rgba(28,43,74,0.04), 0 10px 24px -8px rgba(28,43,74,0.12);
  --card-shadow-hover: 0 1px 0 rgba(28,43,74,0.05), 0 16px 32px -8px rgba(28,43,74,0.18);
}
*{ box-sizing:border-box; }
body{ margin:0; background:var(--cream); font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; color:var(--body-text); }
a{ color:var(--gold); }

/* ---------- Nav — brand left, links right ---------- */
.site-nav{ display:flex; justify-content:space-between; align-items:center; max-width:980px; margin:0 auto; padding:28px 20px 10px; }
.site-nav .brand{ font-family:'Fraunces',serif; font-weight:600; font-size:18px; color:var(--navy); text-decoration:none; }
.site-nav .links{ display:flex; gap:32px; flex-wrap:wrap; }
.site-nav .links a{ font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--slate); text-decoration:none; padding-bottom:4px; border-bottom:2px solid transparent; transition:color .2s ease, border-color .2s ease; }
.site-nav .links a:hover, .site-nav .links a[aria-current="page"]{ color:var(--gold); border-bottom-color:var(--gold); }

/* ---------- Hero card (homepage) ---------- */
.hero-wrap{ display:flex; justify-content:center; padding:20px 20px 60px; }
.hero-card{ background:var(--card-white); max-width:980px; width:100%; border-radius:6px; box-shadow:var(--card-shadow); padding:56px; display:grid; grid-template-columns:1fr 260px; gap:48px; align-items:start; }

.eyebrow{ font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin:0 0 14px; }
.name{ font-family:'Fraunces',serif; font-weight:600; font-size:clamp(32px,4.2vw,46px); line-height:1.05; color:var(--navy); margin:0 0 14px; }
.affiliation{ font-size:15px; color:var(--slate); margin:0 0 2px; }
.location{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--slate); margin:0 0 20px; }

.connect-row{ display:flex; gap:12px; margin:0 0 22px; }
.connect-row a{ display:inline-flex; align-items:center; gap:7px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-decoration:none; color:var(--navy); border:1px solid var(--rule); padding:7px 14px; border-radius:20px; transition:border-color .15s ease, color .15s ease; }
.connect-row a:hover{ border-color:var(--gold); color:var(--gold); }
.connect-row svg{ width:13px; height:13px; }

.mobility-line{ width:100%; max-width:400px; height:36px; display:block; margin:0 0 26px; }
.mobility-line path{ fill:none; stroke:var(--gold); stroke-width:1.6; }
.mobility-line circle{ fill:var(--navy); }

.pull-quote{ font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:22px; line-height:1.45; color:var(--navy); border-left:3px solid var(--gold); padding-left:20px; margin:0 0 26px; max-width:500px; }

.bio{ font-size:15.5px; line-height:1.7; color:var(--body-text); margin:0 0 16px; max-width:500px; }
.bio:last-of-type{ margin-bottom:0; }

.portrait-frame{ width:100%; aspect-ratio:3/4; border-radius:12px; overflow:hidden; background:#EDE9DF; border:1px solid rgba(28,43,74,0.08); display:flex; align-items:center; justify-content:center; margin-top:1px; }
.portrait-frame img{ width:100%; height:100%; object-fit:cover; display:block; }
.portrait-placeholder{ font-size:13px; color:#9AA1AE; text-align:center; padding:20px; }

@media (max-width:720px){
  .site-nav{ gap:16px; }
  .site-nav .links{ gap:18px; }
  .hero-card{ grid-template-columns:1fr; padding:36px 28px; gap:28px; }
  .portrait-frame{ max-width:220px; margin:0 auto; order:-1; }
  .pull-quote, .bio{ max-width:100%; }
}

/* ---------- Generic content card (used by inner pages) ---------- */
.page-wrap{ display:flex; justify-content:center; padding:20px 20px 60px; }
.page-card{ background:var(--card-white); max-width:980px; width:100%; border-radius:6px; box-shadow:var(--card-shadow); padding:56px; }
@media (max-width:720px){ .page-card{ padding:36px 26px; } }

.page-title{ font-family:'Fraunces',serif; font-weight:600; font-size:clamp(28px,4vw,38px); color:var(--navy); margin:0 0 10px; }
.page-sub{ font-size:15.5px; color:var(--slate); margin:0 0 34px; max-width:640px; }

.divider{ border:none; border-top:1px solid var(--rule); margin:36px 0; }

/* Explore grid (also reused as a general 3-up card row) */
.explore-heading{ font-family:'Fraunces',serif; font-weight:600; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--navy); margin:0 0 22px; }
.explore-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:720px){ .explore-grid{ grid-template-columns:1fr; } }
.explore-card{ background:var(--card-white); border-radius:6px; box-shadow:var(--card-shadow-sm); padding:24px 22px; text-decoration:none; color:var(--body-text); display:block; transition:transform .15s ease, box-shadow .15s ease; border:1px solid var(--rule); }
.explore-card:hover{ transform:translateY(-3px); box-shadow:var(--card-shadow-hover); }
.card-eyebrow{ font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.explore-card h3{ font-family:'Fraunces',serif; font-weight:600; font-size:19px; margin:0 0 8px; color:var(--navy); }
.explore-card p{ font-size:13.5px; line-height:1.55; margin:0; color:var(--slate); }

/* ---------- Publications list (Research page) ---------- */
.pub-list{ list-style:none; margin:0; padding:0; }
.pub-list li{ padding:22px 0; border-bottom:1px solid var(--rule); }
.pub-list li:first-child{ padding-top:0; }
.pub-list li:last-child{ border-bottom:none; }
.pub-title{ font-family:'Fraunces',serif; font-size:18px; font-weight:600; color:var(--navy); text-decoration:none; }
.pub-title:hover{ color:var(--gold); }
.pub-meta{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--slate); margin-top:7px; line-height:1.6; }
.pub-meta a{ color:var(--slate); }
.pub-feature{ display:inline-block; margin-top:8px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--gold); text-decoration:none; }
.wp-title{ font-family:'Fraunces',serif; font-size:17px; font-weight:600; color:var(--navy); margin:0 0 8px; }
.wp-abstract{ font-size:14.5px; line-height:1.65; color:var(--body-text); margin:0; }

/* ---------- Book page ---------- */
.book-grid{ display:grid; grid-template-columns:170px 1fr; gap:40px; align-items:start; }
@media (max-width:640px){ .book-grid{ grid-template-columns:1fr; } }
.spine{ width:170px; height:240px; background:linear-gradient(180deg,var(--navy),#142038); border-radius:4px; position:relative; box-shadow:var(--card-shadow-sm); }
.spine::before{ content:''; position:absolute; left:12px; top:16px; right:12px; bottom:16px; border:1px solid rgba(176,141,62,0.5); }
.spine .title{ position:absolute; inset:28px 16px; color:var(--cream); font-family:'Fraunces',serif; font-size:13.5px; line-height:1.4; font-weight:600; }
.toc-list{ list-style:none; margin:0; padding:0; counter-reset:chapter; }
.toc-list li{ counter-increment:chapter; padding:14px 0; border-bottom:1px solid var(--rule); display:grid; grid-template-columns:26px 1fr; gap:12px; }
.toc-list li::before{ content:counter(chapter); font-family:'IBM Plex Mono',monospace; color:var(--gold); font-size:13px; }
.chap-title{ font-size:15px; color:var(--body-text); }
.chap-authors{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--slate); display:block; margin-top:3px; }

/* ---------- Buttons ---------- */
.btn{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; color:var(--cream); background:var(--navy); padding:12px 22px; border-radius:4px; border:1px solid var(--navy); }
.btn:hover{ background:var(--gold); border-color:var(--gold); }
.btn-outline{ background:transparent; color:var(--navy); border:1px solid var(--navy); }
.btn-outline:hover{ background:var(--navy); color:var(--cream); }

/* ---------- Contact ---------- */
.contact-block{ font-size:15.5px; line-height:2; }
.map-frame{ border:1px solid var(--rule); border-radius:6px; width:100%; height:300px; margin-top:24px; }

/* ---------- Footer ---------- */
footer{ max-width:980px; margin:0 auto; padding:0 20px 60px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--slate); }
footer .footer-socials a{ margin-left:16px; text-decoration:none; color:var(--slate); transition:color .15s ease; }
footer .footer-socials a:hover{ color:var(--gold); }