/* ===================================================================
   Ishani Mondal — shared stylesheet
   Linked by: index.html, teaching.html, mentoring.html, service.html
   =================================================================== */

:root{
  --text:#222;
  --ink:#1a1a1f;
  --muted:#5c5f6b;
  --blue:#2a7ae2;
  --blue-head:#2b46e0;
  --red:#c0392b;
  --green:#5cb85c;
  --rule:#e6e6e6;
  --line:#e4e4ec;
  --chip:#f3f3f8;
  --header-bg:#f7f7f7;
  --accent-q1:#0f766e;
  --accent-q2:#b45309;
  --accent-q3:#6d28d9;
  --accent-q4:#0369a1;
  --max:1080px;
  --sans:'Lato',system-ui,-apple-system,Arial,sans-serif;
  --script:'Dancing Script',cursive;
  --mono:'Roboto Mono',monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:#fff;color:var(--text);font-family:var(--sans);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 26px;}

/* ---------- Header ---------- */
header.site{background:var(--header-bg);border-bottom:1px solid var(--rule);}
.head-inner{display:flex;align-items:center;justify-content:center;gap:52px;
  height:78px;position:relative;}
.brand{font-family:var(--script);font-weight:700;font-size:34px;color:#333;
  line-height:1;white-space:nowrap;}
.brand a{color:#333;}.brand a:hover{text-decoration:none;}
.site-nav{display:flex;gap:28px;}
.site-nav a{color:#333;font-size:17px;font-weight:400;}
.site-nav a:hover{color:var(--blue);text-decoration:none;}
.site-nav a.active{color:var(--blue);font-weight:700;}
.nav-toggle{display:none;position:absolute;right:0;background:none;border:1px solid #ccc;
  border-radius:6px;padding:7px 11px;font-family:var(--mono);font-size:12px;cursor:pointer;}

/* ---------- Intro / hero ---------- */
.intro{padding:46px 0 6px;}
.intro-grid{display:flex;gap:48px;align-items:flex-start;}
.intro-text{flex:1 1 auto;}
.intro-text p{margin:0 0 18px;}
.photo{flex:0 0 280px;width:280px;height:280px;border-radius:50%;overflow:hidden;
  background:#ece9e2 url('Ishani.jpg') center/cover no-repeat;
  box-shadow:0 6px 22px -12px rgba(0,0,0,.4);margin-top:6px;}
.wave{font-style:normal;}

.callout{border:2px solid var(--green);border-radius:10px;padding:14px 22px;
  margin:26px 0 22px;max-width:760px;}
.callout p{margin:0;font-family:var(--mono);font-weight:700;color:var(--red);font-size:14.5px;}
.callout p::before{content:"\2022";margin-right:12px;color:var(--text);}

.doclinks{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px;}
.doclinks a{border:1.5px solid var(--blue);color:var(--blue);border-radius:8px;
  padding:8px 16px;font-weight:700;font-size:14.5px;}
.doclinks a:hover{background:var(--blue);color:#fff;text-decoration:none;}

.linkrow{text-align:center;font-size:18px;color:#999;margin:6px 0 8px;}
.linkrow a{margin:0 4px;}
.linkrow .sep{margin:0 8px;color:#bbb;}

/* ---------- Page header (sub-pages) ---------- */
.pagehead{padding:44px 0 6px;border-bottom:1px solid var(--rule);margin-bottom:12px;}
.pagehead h1{font-size:38px;margin:0 0 10px;color:var(--blue-head);letter-spacing:-.015em;}
.pagehead .kicker{font-family:var(--mono);font-size:12px;text-transform:uppercase;
  letter-spacing:.1em;color:#888;margin:0 0 8px;}
.pagehead p{max-width:68ch;color:var(--muted);margin:0 0 18px;}

/* ---------- Sections ---------- */
h2.sec{font-weight:700;font-size:30px;color:var(--blue-head);margin:54px 0 18px;}
h3.sub{font-size:20px;margin:34px 0 12px;color:var(--ink);}
.lede{max-width:70ch;}

/* pull-quote for philosophy statements */
.creed{border-left:4px solid var(--blue-head);padding:6px 0 6px 22px;margin:26px 0 30px;
  max-width:68ch;font-size:19px;line-height:1.55;color:var(--ink);}
.creed b{color:var(--ink);}

/* principle cards */
.principles{display:flex;flex-direction:column;gap:26px;margin-top:24px;}
.principle{border-left:3px solid var(--pc,#ccc);padding-left:18px;}
.principle.p1{--pc:var(--accent-q1);}
.principle.p2{--pc:var(--accent-q2);}
.principle.p3{--pc:var(--accent-q3);}
.principle .pk{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--pc);margin-bottom:6px;}
.principle h3{font-size:20px;margin:0 0 8px;letter-spacing:-.01em;}
.principle p{margin:0 0 10px;color:var(--muted);max-width:64ch;}

/* ---------- Research themes (index) ---------- */
.themes{display:flex;flex-direction:column;gap:34px;margin-top:34px;}
.theme{position:relative;padding-left:18px;border-left:3px solid var(--theme,#ccc);}
.theme.q1{--theme:var(--accent-q1);}
.theme.q2{--theme:var(--accent-q2);}
.theme.q3{--theme:var(--accent-q3);}
.theme.q4{--theme:var(--accent-q4);}
.qk{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--theme);margin-bottom:6px;}
.theme h3{font-size:21px;margin:0 0 6px;letter-spacing:-.01em;}
.theme>p{margin:0 0 16px;color:var(--muted);max-width:60ch;}
.count{font-size:11px;font-weight:600;color:var(--muted);background:var(--chip);
  border-radius:20px;padding:2px 9px;margin-left:8px;vertical-align:2px;}

.bubbles{display:flex;flex-direction:column;gap:8px;}
details.pub{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden;
  transition:border-color .15s ease,box-shadow .15s ease;}
details.pub:hover{border-color:#cdd0db;}
details.pub[open]{border-color:var(--theme,#cdd0db);
  box-shadow:0 1px 0 rgba(0,0,0,.02),0 8px 24px -16px rgba(0,0,0,.25);}
summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;}
summary::-webkit-details-marker{display:none;}
.chev{flex:0 0 auto;margin-top:3px;width:14px;height:14px;color:var(--muted);transition:transform .18s ease;}
details.pub[open] .chev{transform:rotate(90deg);color:var(--theme);}
.sum-main{flex:1 1 auto;min-width:0;}
.pub-title{display:block;font-weight:600;font-size:15.5px;line-height:1.4;color:var(--ink);}
.pub-venue{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:5px;
  font-size:12.5px;color:var(--muted);}
.venue-chip{background:var(--chip);border-radius:6px;padding:1px 8px;font-weight:600;color:#3b3e49;}
.award{color:var(--red);font-weight:600;}
.award.soft{color:#d35400;}
.pub-body{padding:0 16px 18px;display:grid;grid-template-columns:96px 1fr;gap:18px;}
.pub-body .thumb{width:96px;border-radius:8px;border:1px solid var(--line);display:block;}
.pub-authors{font-size:13.5px;color:#3b3e49;margin:0 0 8px;line-height:1.55;}
.pub-authors .me{font-weight:700;color:var(--ink);}
.pub-links{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;}
.pub-links a{font-size:12px;font-weight:600;color:var(--theme,#444);border:1px solid var(--line);
  border-radius:6px;padding:3px 9px;transition:background .12s ease;}
.pub-links a:hover{background:var(--chip);text-decoration:none;}
.pub-abstract{font-size:13.5px;color:var(--muted);margin:0;line-height:1.6;}

/* ---------- Entry lists (courses, mentees, service) ---------- */
.entries{margin-top:18px;}
.entry{display:grid;grid-template-columns:190px 1fr;gap:22px;padding:16px 0;
  border-bottom:1px solid #f0f0f0;}
.entry:last-child{border-bottom:0;}
.entry .when{font-family:var(--mono);font-size:12.5px;color:#888;padding-top:3px;}
.entry .what h4{margin:0 0 3px;font-size:16.5px;color:var(--ink);}
.entry .what .where{color:var(--muted);font-size:15px;}
.entry .what p{margin:7px 0 0;color:var(--muted);font-size:15px;max-width:62ch;}

/* two-column simple lists */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:26px 50px;margin-top:18px;}

/* service rows */
.srow{display:grid;grid-template-columns:210px 1fr;gap:22px;padding:13px 0;
  border-bottom:1px solid #f0f0f0;align-items:baseline;}
.srow:last-child{border-bottom:0;}
.srow .label{font-weight:700;color:var(--ink);font-size:15.5px;}
.srow .val{color:var(--muted);font-size:15.5px;}
.srow .val .venue{color:var(--ink);}

/* tag pills */
.pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:6px;}
.pill{background:var(--chip);border-radius:20px;padding:3px 12px;font-size:13px;color:#3b3e49;}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--rule);margin-top:60px;padding:30px 0 50px;color:#999;
  font-size:13.5px;text-align:center;}
footer a{color:#888;}

/* ---------- Responsive ---------- */
@media (max-width:820px){
  .intro-grid{flex-direction:column-reverse;align-items:center;text-align:left;}
  .photo{flex-basis:220px;width:220px;height:220px;}
  .cols{grid-template-columns:1fr;}
  .entry{grid-template-columns:1fr;gap:4px;}
  .entry .when{padding-top:0;}
  .srow{grid-template-columns:1fr;gap:2px;}
  .site-nav{display:none;flex-direction:column;gap:0;position:absolute;top:78px;left:0;right:0;
    background:var(--header-bg);border-bottom:1px solid var(--rule);padding:6px 26px 16px;z-index:20;}
  .site-nav.open{display:flex;}
  .site-nav a{padding:11px 0;border-bottom:1px solid var(--rule);}
  .head-inner{justify-content:flex-start;gap:0;}
  .nav-toggle{display:block;}
}
@media(max-width:620px){
  .pub-body{grid-template-columns:1fr;}
  .pub-body .thumb{width:120px;}
}
@media (max-width:520px){
  body{font-size:16px;}
  .brand{font-size:28px;}
  .linkrow{font-size:16px;}
  h2.sec{font-size:25px;}
  .pagehead h1{font-size:30px;}
}
@media(prefers-reduced-motion:reduce){.chev{transition:none;}}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}