/* ═══════════════════════════════════════════════════════
   YUCAR LAB — Single-Page Full Stylesheet
═══════════════════════════════════════════════════════ */

/* ── CSS VARIABLES ── */
/* ══════════════════════════════════════════
   COLOR PALETTES — data-palette attribute
   Default palette = "academic" (light)
══════════════════════════════════════════ */

/* Shared layout/spacing tokens — never change */
:root {
  --nav-h:  72px;
  --r:      4px;
  --rl:     12px;
  --ease:   all 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ── 1. ACADEMIC BLUE (default light) ── */
[data-palette="academic-light"],
:root {
  --bg:        #f7f5f0;
  --bg-alt:    #edeae2;
  --bg-card:   #ffffff;
  --text:      #1a1814;
  --text-muted:#6b6560;
  --primary:   #2c5f8a;
  --primary-l: #4a90c4;
  --accent:    #c8824a;
  --accent-l:  #e8a870;
  --border:    rgba(44,95,138,0.15);
  --shadow:    0 4px 32px rgba(26,24,20,0.08);
  --shadow-lg: 0 12px 64px rgba(26,24,20,0.12);
}

/* ── 2. ACADEMIC DARK (neon teal) ── */
[data-palette="academic-dark"] {
  --bg:        #0e0e0e;
  --bg-alt:    #161616;
  --bg-card:   #1c1c1c;
  --text:      #f0ede8;
  --text-muted:#8a8580;
  --primary:   #00d4aa;
  --primary-l: #00ffcc;
  --accent:    #ff6b35;
  --accent-l:  #ff9060;
  --border:    rgba(0,212,170,0.15);
  --shadow:    0 4px 32px rgba(0,0,0,0.4);
  --shadow-lg: 0 12px 64px rgba(0,0,0,0.6);
}

/* ── 3. DEEP OCEAN (dark navy + cyan) ── */
[data-palette="ocean"] {
  --bg:        #050e1a;
  --bg-alt:    #0a1929;
  --bg-card:   #0d2137;
  --text:      #e8f4fd;
  --text-muted:#7aabcc;
  --primary:   #29b6f6;
  --primary-l: #81d4fa;
  --accent:    #ffd54f;
  --accent-l:  #ffe082;
  --border:    rgba(41,182,246,0.18);
  --shadow:    0 4px 32px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 64px rgba(0,0,0,0.7);
}

/* ── 4. FOREST LAB (dark green + emerald) ── */
[data-palette="forest"] {
  --bg:        #050f08;
  --bg-alt:    #091510;
  --bg-card:   #0d1f14;
  --text:      #e8f5e9;
  --text-muted:#81c784;
  --primary:   #00e676;
  --primary-l: #69f0ae;
  --accent:    #ffcc02;
  --accent-l:  #ffe57f;
  --border:    rgba(0,230,118,0.15);
  --shadow:    0 4px 32px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 64px rgba(0,0,0,0.7);
}

/* ── 5. CRIMSON RESEARCH (dark red + gold) ── */
[data-palette="crimson"] {
  --bg:        #110508;
  --bg-alt:    #1a080c;
  --bg-card:   #220b10;
  --text:      #fdf0f2;
  --text-muted:#cf8f97;
  --primary:   #ef5350;
  --primary-l: #ff8a80;
  --accent:    #ffd740;
  --accent-l:  #ffe57f;
  --border:    rgba(239,83,80,0.18);
  --shadow:    0 4px 32px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 64px rgba(0,0,0,0.7);
}

/* ── 6. NEBULA PURPLE (dark purple + violet) ── */
[data-palette="nebula"] {
  --bg:        #08040f;
  --bg-alt:    #110818;
  --bg-card:   #180c22;
  --text:      #f3eeff;
  --text-muted:#ab8fc9;
  --primary:   #ce93d8;
  --primary-l: #e040fb;
  --accent:    #80deea;
  --accent-l:  #b2ebf2;
  --border:    rgba(206,147,216,0.18);
  --shadow:    0 4px 32px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 64px rgba(0,0,0,0.7);
}

/* ── 7. ARCTIC (clean white + ice blue) ── */
[data-palette="arctic"] {
  --bg:        #f0f8ff;
  --bg-alt:    #e1f0fb;
  --bg-card:   #ffffff;
  --text:      #0d1f2d;
  --text-muted:#4a7fa5;
  --primary:   #0277bd;
  --primary-l: #039be5;
  --accent:    #00838f;
  --accent-l:  #00acc1;
  --border:    rgba(2,119,189,0.15);
  --shadow:    0 4px 32px rgba(13,31,45,0.08);
  --shadow-lg: 0 12px 64px rgba(13,31,45,0.12);
}

/* ── 8. AMBER LAB (warm parchment + amber) ── */
[data-palette="amber"] {
  --bg:        #fdf6e3;
  --bg-alt:    #f5ead0;
  --bg-card:   #fffdf7;
  --text:      #2d1f00;
  --text-muted:#7a5c2e;
  --primary:   #bf6000;
  --primary-l: #e07820;
  --accent:    #5c8a3c;
  --accent-l:  #7ab55a;
  --border:    rgba(191,96,0,0.15);
  --shadow:    0 4px 32px rgba(45,31,0,0.08);
  --shadow-lg: 0 12px 64px rgba(45,31,0,0.12);
}

/* ── Dynamic focus/accent helper ── */
[data-palette="academic-dark"] .btn-p,
[data-palette="ocean"] .btn-p,
[data-palette="forest"] .btn-p,
[data-palette="crimson"] .btn-p,
[data-palette="nebula"] .btn-p {
  box-shadow: 0 2px 16px rgba(0,0,0,.4);
}

/* ══ PALETTE PICKER UI ══ */
#palette-picker {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 8000;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .75rem;
}

#palette-fab {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 2px solid var(--border);
  background: var(--bg-card);
  box-shadow: var(--shadow-lg);
  cursor: pointer;
  font-size: 1.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--ease);
  color: var(--text);
}
#palette-fab:hover { border-color: var(--primary); transform: scale(1.08); }

#palette-panel {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1.25rem;
  box-shadow: var(--shadow-lg);
  width: 260px;
  display: none;
  flex-direction: column;
  gap: .6rem;
}
#palette-panel.open { display: flex; }

.pp-title {
  font-family: 'DM Mono', monospace;
  font-size: .62rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: .25rem;
}

.pp-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .6rem .75rem;
  border-radius: 10px;
  cursor: pointer;
  border: 1.5px solid transparent;
  transition: var(--ease);
  background: transparent;
  width: 100%;
  text-align: left;
}
.pp-item:hover { background: var(--bg-alt); border-color: var(--border); }
.pp-item.active { border-color: var(--primary); background: var(--bg-alt); }

.pp-swatch {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}
.pp-dot {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pp-info { display: flex; flex-direction: column; }
.pp-name {
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
  line-height: 1.2;
}
.pp-desc {
  font-size: .68rem;
  color: var(--text-muted);
  margin-top: .1rem;
}
.pp-check {
  margin-left: auto;
  font-size: .9rem;
  opacity: 0;
  transition: var(--ease);
  flex-shrink: 0;
}
.pp-item.active .pp-check { opacity: 1; }

@media (max-width: 768px) {
  #palette-picker { bottom: 1.25rem; right: 1.25rem; }
  #palette-panel { width: 240px; }
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'DM Sans',sans-serif;font-weight:300;background:var(--bg);color:var(--text);line-height:1.7;transition:background .4s,color .4s;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary);text-decoration:none;transition:var(--ease)}
a:hover{color:var(--accent)}

/* ── TYPE ── */
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1.15;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,5vw,4.2rem)}
h2{font-size:clamp(1.8rem,3.5vw,2.8rem)}
h3{font-size:clamp(1.15rem,2vw,1.55rem)}
p{font-size:1rem;margin-bottom:1rem;color:var(--text)}

/* ── LAYOUT ── */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 2rem}
.section{padding:6rem 0}
.section-sm{padding:3rem 0}
.text-center{text-align:center}

/* ── SECTION LABEL ── */
.slabel{display:inline-block;font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--primary);border:1px solid var(--primary);padding:.3rem .8rem;border-radius:2px;margin-bottom:1.2rem}
.divider{width:60px;height:2px;background:var(--accent);margin:1.2rem 0}
.divider-c{margin:1.2rem auto}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 2rem;font-family:'DM Sans',sans-serif;font-size:.875rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;border:none;border-radius:var(--r);cursor:pointer;transition:var(--ease);min-height:48px;white-space:nowrap;text-decoration:none}
.btn-p{background:var(--primary);color:#fff;box-shadow:0 2px 12px rgba(44,95,138,.3)}
.btn-p:hover{background:var(--primary-l);color:#fff;transform:translateY(-2px);box-shadow:0 6px 24px rgba(44,95,138,.4)}
.btn-o{background:transparent;color:var(--primary);border:1.5px solid var(--primary)}
.btn-o:hover{background:var(--primary);color:#fff;transform:translateY(-2px)}
[data-theme="dark"] .btn-p{box-shadow:0 2px 16px rgba(0,212,170,.3)}
[data-theme="dark"] .btn-p:hover{box-shadow:0 6px 32px rgba(0,212,170,.4)}

/* ── CARDS ── */
.card{background:var(--bg-card);border-radius:var(--rl);padding:2rem;border:1px solid var(--border);box-shadow:var(--shadow);transition:var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary)}

/* ── FEATURE LIST ── */
.flist{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-top:1rem}
.flist li{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:var(--text-muted)}
.flist li::before{content:'—';color:var(--accent);flex-shrink:0;margin-top:.1rem}

/* ── PLACEHOLDER BOX ── */
.ph-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;border:2px dashed var(--border);border-radius:var(--rl);background:var(--bg-alt);position:relative;overflow:hidden}
.ph-box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph-icon{font-size:2.5rem;opacity:.25;position:relative;z-index:1}
.ph-lbl{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);opacity:.5;text-align:center;padding:0 1rem;position:relative;z-index:1}

/* ── HIGHLIGHT ROW ── */
.hirow{background:linear-gradient(135deg,var(--primary),var(--primary-l));border-radius:var(--rl);padding:3rem;color:#fff;position:relative;overflow:hidden}
.hirow::after{content:'';position:absolute;top:-40%;right:-10%;width:400px;height:400px;border-radius:50%;background:rgba(255,255,255,.05);pointer-events:none}
.hirow h2,.hirow p{color:#fff}
.hirow p{opacity:.85}

/* ── REVEAL ANIMATION ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s}
.reveal.visible{opacity:1;transform:none}

/* ═══════ HEADER ═══════ */
.site-header{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:1000;background:var(--bg);border-bottom:1px solid var(--border);transition:var(--ease)}
.site-header.scrolled{box-shadow:0 2px 24px rgba(0,0,0,.08)}
.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.nav-logo{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:700;color:var(--text);letter-spacing:-.01em;flex-shrink:0;text-decoration:none}
.nav-logo span{color:var(--primary)}
.nav-logo:hover{color:var(--primary)}
.nav-links{display:flex;align-items:center;gap:.1rem;list-style:none}
.nav-links a{font-size:.8rem;font-weight:400;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);padding:.5rem .65rem;border-radius:var(--r);transition:var(--ease)}
.nav-links a:hover,.nav-links a.active{color:var(--primary);background:rgba(44,95,138,.07)}
[data-theme="dark"] .nav-links a:hover,[data-theme="dark"] .nav-links a.active{background:rgba(0,212,170,.07)}

/* Theme toggle */
.theme-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1.5px solid var(--border);border-radius:50%;background:transparent;color:var(--text-muted);cursor:pointer;transition:var(--ease);flex-shrink:0;font-size:1.1rem}
.theme-toggle:hover{border-color:var(--primary);color:var(--primary);background:rgba(44,95,138,.07)}

/* Hamburger */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;background:transparent;border:1.5px solid var(--border);border-radius:var(--r);cursor:pointer;padding:10px;transition:var(--ease)}
.hamburger span{display:block;height:1.5px;background:var(--text);border-radius:2px;transition:var(--ease)}
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* Mobile drawer */
.mobile-nav{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:var(--bg);border-bottom:1px solid var(--border);padding:1.5rem 2rem;z-index:999;flex-direction:column;gap:.25rem;box-shadow:0 8px 32px rgba(0,0,0,.08)}
.mobile-nav.open{display:flex}
.mobile-nav a{font-size:.95rem;color:var(--text-muted);padding:.875rem 1rem;border-radius:var(--r);text-transform:uppercase;letter-spacing:.05em;min-height:48px;display:flex;align-items:center;transition:var(--ease)}
.mobile-nav a:hover{color:var(--primary);background:rgba(44,95,138,.07)}
.mobile-nav .theme-toggle{width:100%;border-radius:var(--r);height:48px;gap:.75rem;padding:0 1rem;justify-content:flex-start;font-size:.85rem;letter-spacing:.05em;text-transform:uppercase}

/* ═══════ 1. HERO ═══════ */
#home{
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch;
  padding-top:var(--nav-h);
}
.hero-left{display:flex;flex-direction:column;justify-content:center;padding:5rem max(2rem,calc((100vw - 1200px)/2 + 2rem)) 5rem max(2rem,calc((100vw - 1200px)/2 + 2rem));padding-right:3rem}
.hero-eyebrow{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:1.25rem;display:flex;align-items:center;gap:.75rem}
.hero-eyebrow::before{content:'';width:32px;height:1px;background:var(--accent);flex-shrink:0}
.hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,4vw,4rem);font-weight:700;line-height:1.06;letter-spacing:-.02em;margin-bottom:1.5rem}
.hero-title em{font-style:italic;color:var(--primary)}
.hero-desc{font-size:.97rem;line-height:1.85;color:var(--text-muted);max-width:520px;margin-bottom:1rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}
.hero-right{position:relative;background:var(--bg-alt);overflow:hidden;min-height:560px}
.hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-right::after{content:'';position:absolute;inset:0;background:linear-gradient(to right,var(--bg) 0%,transparent 20%);pointer-events:none;z-index:1}
.hero-badge{position:absolute;bottom:2.5rem;left:2rem;z-index:2;background:var(--primary);color:#fff;border-radius:var(--rl);padding:1rem 1.5rem;box-shadow:var(--shadow-lg)}
.hero-badge strong{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;display:block;line-height:1}
.hero-badge span{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85}

/* ═══════ 2. ABOUT ═══════ */
#about{background:var(--bg);padding:6rem 0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.about-stats{display:flex;gap:1.5rem;margin:2rem 0;flex-wrap:wrap}
.astat{text-align:center;padding:1.25rem 1.5rem;border:1px solid var(--border);border-radius:var(--rl);background:var(--bg-card);flex:1;min-width:100px}
.astat-n{font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:700;color:var(--primary);line-height:1}
.astat-l{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-top:.35rem}
.about-img-wrap{position:relative}
.about-img{aspect-ratio:3/4;border-radius:var(--rl);overflow:hidden;border:1px solid var(--border)}
.about-badge-corner{position:absolute;bottom:-1.25rem;right:-1.25rem;background:var(--accent);color:#fff;border-radius:var(--rl);padding:1rem 1.5rem;box-shadow:var(--shadow-lg)}
.about-badge-corner div{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:700;line-height:1.2}
.about-badge-corner span{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;opacity:.85;margin-top:.2rem;display:block}

/* ═══════ 3. RESEARCH ACCORDION ═══════ */
#research{background:var(--bg-alt);padding:6rem 0}
.res-item{border-bottom:1px solid var(--border)}
.res-item:first-child{border-top:1px solid var(--border)}
.res-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.75rem 0;background:transparent;border:none;text-align:left;cursor:pointer;transition:var(--ease);min-height:72px}
.res-tl{display:flex;align-items:center;gap:1.25rem}
.res-num{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.15em;color:var(--text-muted);width:24px;flex-shrink:0}
.res-ttitle{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:600;color:var(--text);transition:var(--ease);line-height:1.2}
.res-tlink{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.05em;text-transform:uppercase;color:var(--primary);opacity:0;transition:var(--ease);white-space:nowrap;overflow:hidden}
.res-trigger:hover .res-tlink{opacity:1}
.res-icon{font-size:1.5rem;flex-shrink:0;transition:var(--ease);color:var(--border)}
.res-item.open .res-icon{transform:rotate(45deg);color:var(--primary)}
.res-trigger:hover .res-ttitle,.res-item.open .res-ttitle{color:var(--primary)}
.res-trigger:hover .res-icon{color:var(--primary)}
.res-panel{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(0.4,0,0.2,1)}
.res-item.open .res-panel{max-height:2000px}
.res-item.open{border-bottom-color:var(--primary)}
.res-panel-inner{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;padding-bottom:2.5rem}
.res-panel-img{aspect-ratio:4/3;border-radius:var(--rl)}
.res-panel-text p{color:var(--text-muted);line-height:1.85;font-size:.95rem;margin-bottom:1rem}

/* ═══════ 4. PUBLICATIONS ═══════ */
#publications{background:var(--bg);padding:6rem 0}
.pub-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.pub-ticker-wrap{overflow:hidden;border:1px solid var(--border);border-radius:var(--rl);background:var(--bg-card)}
.pub-ticker-track{display:flex;transition:transform .65s cubic-bezier(0.4,0,0.2,1)}
.pub-slide{min-width:100%;padding:2rem}
.pt-date{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.6rem}
.pub-slide h4{font-size:.95rem;font-weight:500;margin-bottom:.5rem;line-height:1.5;font-family:'DM Sans',sans-serif}
.pt-journal{font-family:'DM Mono',monospace;font-size:.7rem;color:var(--primary);letter-spacing:.05em;text-transform:uppercase}
.pt-authors{font-size:.8rem;color:var(--text-muted);margin-top:.4rem}
.pub-dots{display:flex;justify-content:center;gap:.5rem;padding:1rem;border-top:1px solid var(--border)}
.pub-dot{width:7px;height:7px;border-radius:50%;background:var(--border);border:none;cursor:pointer;transition:var(--ease);padding:0}
.pub-dot.active{background:var(--primary);transform:scale(1.4)}
.pub-right-img{aspect-ratio:3/4;border-radius:var(--rl)}

/* ═══════ 5. SERVICES ═══════ */
#services{background:var(--bg-alt);padding:6rem 0}
.svc-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.5rem}
.svc-pill{padding:.55rem 1.1rem;border:1.5px solid var(--border);border-radius:100px;background:transparent;color:var(--text-muted);font-size:.8rem;font-weight:500;cursor:pointer;transition:var(--ease);min-height:40px}
.svc-pill:hover{border-color:var(--primary);color:var(--primary)}
.svc-pill.active{background:var(--primary);border-color:var(--primary);color:#fff}
.svc-panel{display:none}
.svc-panel.active{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.svc-img-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.svc-img-box{aspect-ratio:1;border-radius:var(--rl);transition:var(--ease)}
.svc-img-box:hover{border-color:var(--primary)}
.svc-text h3{font-size:1.5rem;margin-bottom:.75rem}
.svc-text p{color:var(--text-muted);line-height:1.85;font-size:.95rem;margin-bottom:1rem}

/* ═══════ 6. AWARDS ═══════ */
#awards{background:var(--bg);padding:6rem 0}
.aw-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;margin-bottom:3rem}
.aw-hero-img{aspect-ratio:4/3;border-radius:var(--rl)}
.aw-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;margin-bottom:4rem}
.aw-stat-cell{background:var(--bg-card);padding:1.5rem 1rem;text-align:center}
.aw-stat-n{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--primary);line-height:1}
.aw-stat-l{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-top:.3rem}
.aw-timeline{display:flex;flex-direction:column}
.aw-period{display:grid;grid-template-columns:180px 1fr;position:relative}
.aw-period::before{content:'';position:absolute;left:179px;top:0;bottom:0;width:1px;background:var(--border)}
.aw-period-year{padding:2.5rem 2rem 2.5rem 0}
.aw-year-num{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--primary);line-height:1}
.aw-year-title{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);margin-top:.35rem;line-height:1.5}
.aw-year-sub{font-size:.8rem;color:var(--accent);font-style:italic;margin-top:.2rem}
.aw-period-content{padding:2.5rem 0 2.5rem 2.5rem;border-bottom:1px solid var(--border);position:relative}
.aw-period-content::before{content:'';position:absolute;left:-4.5px;top:2.75rem;width:9px;height:9px;border-radius:50%;background:var(--primary);border:2px solid var(--bg)}
.aw-period:last-child .aw-period-content{border-bottom:none}
.aw-item{display:flex;align-items:flex-start;gap:.875rem;padding:.875rem 0;border-bottom:1px solid var(--border)}
.aw-item:last-child{border-bottom:none}
.aw-trophy{font-size:1.2rem;flex-shrink:0;margin-top:.05rem}
.aw-text{font-size:.9rem;line-height:1.6}
.aw-text strong{display:block;font-weight:600;color:var(--text);margin-bottom:.15rem}
.aw-text span{color:var(--text-muted);font-size:.82rem}

/* ═══════ 7. SCIENCE ART ═══════ */
#science-art{background:var(--bg-alt);padding:6rem 0}
.filter-bar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2.5rem}
.filter-btn{padding:.6rem 1.25rem;border:1.5px solid var(--border);border-radius:100px;background:transparent;color:var(--text-muted);font-size:.82rem;font-weight:500;letter-spacing:.05em;cursor:pointer;transition:var(--ease);min-height:44px}
.filter-btn:hover,.filter-btn.active{border-color:var(--primary);color:var(--primary);background:rgba(44,95,138,.07)}
[data-theme="dark"] .filter-btn.active{background:rgba(0,212,170,.07)}
.art-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.art-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;transition:var(--ease)}
.art-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary)}
.art-card.art-hidden{display:none}
.art-card[data-hidden="true"]{display:none}
.art-img{width:100%;overflow:hidden;background:var(--bg-alt);display:flex;align-items:center;justify-content:center}
.art-img img{width:100%;height:auto;display:block;object-fit:contain;object-position:center;transition:transform .4s}
.art-card:hover .art-img img{transform:scale(1.02)}
.art-img.landscape{aspect-ratio:1800/1273}
.art-img.portrait{aspect-ratio:1273/1800}
.art-img.landscape img,.art-img.portrait img{width:100%;height:100%;object-fit:contain}
.art-body{padding:.875rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;border-top:1px solid var(--border)}
.art-title-text{font-size:.95rem;font-weight:600;font-family:'Cormorant Garamond',serif;color:var(--text)}
.art-badge{font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;padding:.2rem .55rem;border-radius:100px;background:rgba(44,95,138,.08);color:var(--primary);font-weight:500;white-space:nowrap;flex-shrink:0}
.art-badge.emb{background:rgba(200,130,74,.1);color:var(--accent)}

/* ═══════ 8. SUMMER RESEARCH / TEAM ═══════ */
#team{background:var(--bg);padding:6rem 0}
.srp-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:5rem;align-items:start;margin-bottom:5rem}

/* FAQ form */
.fq-item{border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;margin-bottom:1rem;background:var(--bg-card);transition:var(--ease)}
.fq-item:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(44,95,138,.1)}
[data-theme="dark"] .fq-item:focus-within{box-shadow:0 0 0 3px rgba(0,212,170,.1)}
.fq-header{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.25rem;cursor:pointer;min-height:52px;user-select:none}
.fq-q{font-family:'Cormorant Garamond',serif;font-size:1.05rem;font-weight:600;color:var(--text);line-height:1.3}
.fq-tog{font-size:1.3rem;color:var(--primary);flex-shrink:0;transition:transform .3s;margin-left:1rem}
.fq-item.open .fq-tog{transform:rotate(45deg)}
.fq-body{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(0.4,0,0.2,1)}
.fq-item.open .fq-body{max-height:320px}
.fq-inner{padding:0 1.25rem 1.25rem;display:flex;flex-direction:column;gap:.75rem}
.fq-inner p{font-size:.88rem;color:var(--text-muted);line-height:1.7;margin:0}
.fq-inner textarea{width:100%;min-height:80px;resize:vertical;font-family:'DM Sans',sans-serif;font-size:.88rem;color:var(--text);background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--r);padding:.75rem;transition:var(--ease);line-height:1.6}
.fq-inner textarea:focus{outline:none;border-color:var(--primary)}
.fq-send{align-self:flex-end;padding:.55rem 1.1rem;font-size:.78rem;min-height:38px}

/* Apply form */
.apply-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:2rem}
.apply-form h4{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1.25rem}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.45rem}
.form-input,.form-textarea,.form-select{width:100%;padding:.875rem 1rem;background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--r);color:var(--text);font-family:'DM Sans',sans-serif;font-size:.95rem;transition:var(--ease);min-height:48px;appearance:none}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(44,95,138,.1)}
[data-theme="dark"] .form-input:focus,[data-theme="dark"] .form-textarea:focus,[data-theme="dark"] .form-select:focus{box-shadow:0 0 0 3px rgba(0,212,170,.1)}
.form-textarea{min-height:120px;resize:vertical}

/* Team cards */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.tcard{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;transition:var(--ease)}
.tcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.pi-tcard{border-top:3px solid var(--primary)}
.tcard-avatar{aspect-ratio:1;background:var(--bg-alt);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:700;color:var(--primary);position:relative;overflow:hidden}
.tcard-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tcard-body{padding:1.25rem;flex:1;display:flex;flex-direction:column;gap:.35rem}
.tcard-name{font-size:1rem;font-weight:600;font-family:'Cormorant Garamond',serif;line-height:1.2}
.tcard-role{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-weight:500}
.tcard-email{font-size:.76rem;color:var(--primary);margin-top:.2rem;display:inline-block}
.tcard-desc{font-size:.78rem;color:var(--text-muted);line-height:1.6;margin-top:.3rem}
.li-btn{display:inline-flex;align-items:center;gap:.4rem;margin-top:.6rem;padding:.4rem .8rem;background:#0077B5;color:#fff;border-radius:var(--r);font-size:.7rem;font-weight:500;letter-spacing:.04em;text-transform:uppercase;transition:var(--ease);min-height:34px;text-decoration:none}
.li-btn:hover{background:#005885;color:#fff}
.li-svg{width:13px;height:13px;fill:currentColor}

/* ═══════ 9. CONTACT ═══════ */
#contact{background:var(--bg-alt);padding:6rem 0}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:4rem;align-items:start}
.ci-item{display:flex;gap:1rem;align-items:flex-start;padding:1.25rem 0;border-bottom:1px solid var(--border)}
.ci-item:last-child{border-bottom:none}
.ci-icon{font-size:1.2rem;flex-shrink:0;margin-top:.1rem}
.ci-label{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.2rem}
.ci-val{font-size:.95rem;color:var(--text)}

/* ═══════ FOOTER ═══════ */
.site-footer{background:var(--bg-alt);border-top:1px solid var(--border);padding:4rem 0 2rem}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:3rem;margin-bottom:3rem;padding-bottom:3rem;border-bottom:1px solid var(--border)}
.footer-brand h3{font-size:1.3rem;margin-bottom:.75rem}
.footer-brand p{font-size:.875rem;color:var(--text-muted);line-height:1.7;max-width:280px}
.footer-col h4{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1.25rem}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.footer-links a{font-size:.875rem;color:var(--text-muted);transition:var(--ease)}
.footer-links a:hover{color:var(--primary);padding-left:4px}
.footer-contact p,.footer-contact a{font-size:.875rem;color:var(--text-muted);margin-bottom:.3rem;display:block}
.footer-contact a{color:var(--primary)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-bottom p{font-size:.8rem;color:var(--text-muted);margin:0}

/* ═══════ RESPONSIVE ═══════ */
@media(max-width:1024px){
  #home{grid-template-columns:1fr;min-height:auto}
  .hero-left{padding:4rem 2rem 2rem}
  .hero-right{min-height:320px;display:block}
  .about-grid,.pub-grid,.aw-hero-grid,.contact-grid,.srp-grid{grid-template-columns:1fr;gap:3rem}
  .pub-right-img,.aw-hero-img{aspect-ratio:16/9}
  .art-gallery{grid-template-columns:repeat(2,1fr)}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .aw-stats{grid-template-columns:repeat(3,1fr)}
  .res-panel-inner,.svc-panel.active{grid-template-columns:1fr}
  .aw-period{grid-template-columns:130px 1fr}
  .aw-period::before{left:129px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .svc-header-grid{grid-template-columns:1fr !important}
}
@media(max-width:768px){
  :root{--nav-h:64px}
  .container{padding:0 1.25rem}
  .section{padding:4rem 0}
  .nav-links{display:none}
  .hamburger{display:flex}
  .theme-toggle{display:none}
  .nav-social{display:none}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%;justify-content:center}
  .hero-right{min-height:240px}
  .art-gallery{grid-template-columns:repeat(2,1fr)}
  .team-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  .aw-period{grid-template-columns:1fr}
  .aw-period::before{display:none}
  .aw-period-year{padding-bottom:0;position:static;border-bottom:2px solid var(--primary);margin-bottom:1rem}
  .aw-period-content{padding-left:0}
  .aw-period-content::before{display:none}
  .aw-stats{grid-template-columns:repeat(2,1fr)}
  .res-panel-img{aspect-ratio:16/9}
  .mobile-theme{display:flex !important}
  h1{font-size:2.2rem}
  h2{font-size:1.6rem}
}
@media(max-width:480px){
  .art-gallery{grid-template-columns:1fr}
}

/* ── PAGE HERO ── */
.page-hero{
  padding-top:calc(var(--nav-h) + 5rem) !important;
  padding-bottom:3rem;
  position:relative;
}
.page-hero-inner{ max-width:none; }
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-muted);margin-bottom:1.5rem;flex-wrap:wrap}
.breadcrumb a{color:var(--primary)}
.breadcrumb-sep{color:var(--border)}

/* ══════════════════════════════════════════
   DARK/LIGHT MODE COLOR FIXES
   Replace hardcoded hex colors used inline
   throughout the pages with theme-aware
   CSS variables, so text stays readable in
   both light and dark mode.
══════════════════════════════════════════ */
[style*="#1a3a6b"]{ color:var(--primary) !important; }
[style*="#1a1814"]{ color:var(--text) !important; }
[style*="#2a7a8c"]{ color:var(--text-muted) !important; }
[style*="#6b6b6b"]{ color:var(--text-muted) !important; }

/* ══════════════════════════════════════════
   GLOBAL TYPOGRAPHY — Times New Roman body
   text everywhere; headings keep their
   existing serif display font.
══════════════════════════════════════════ */
body, p, a, span, li, td, th, label, input, textarea, select, button,
.btn, .nav-links a, .nav-logo, .slabel, .breadcrumb, .res-tlink,
.pub-meta, .pub-authors, .card-desc, .footer-bottom, .hero-eyebrow {
  font-family: Arial, Helvetica, sans-serif !important;
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Cormorant Garamond', serif !important;
}

/* ══════════════════════════════════════════
   NAV STANDARDIZATION (all pages)
   Logo, link styling, spacing, responsive
══════════════════════════════════════════ */
.nav-inner{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:.75rem; }
.nav-links{ justify-self:center; }
.nav-social{ display:flex; align-items:center; gap:.85rem; margin-right:.5rem; }
.site-header .container{ max-width:none; }

.nav-logo{font-family:'Cormorant Garamond',serif!important;font-size:1.4rem!important;font-weight:800!important;color:#1a3a6b!important;text-decoration:none!important;white-space:nowrap;display:flex!important;align-items:center;gap:.5rem}

.nav-links{gap:0!important;flex-wrap:nowrap!important}
.nav-links a{font-weight:700!important;color:#1a3a6b!important;font-size:.74rem!important;letter-spacing:.04em!important;text-transform:uppercase!important;white-space:nowrap!important;padding:.5rem .55rem!important}

@media(min-width:769px) and (max-width:1100px){
  .nav-links a{font-size:.66rem!important;padding:.5rem .4rem!important}
  .nav-social{display:none!important}
  .nav-inner{grid-template-columns:auto 1fr auto}
}
@media(max-width:768px){
  .nav-social{display:none!important}
  .nav-inner{grid-template-columns:auto 1fr;justify-content:space-between}
  .nav-inner > div:last-child{justify-self:end}
}