/* ==========================================================================
   Memorial Archive — "Blueprint" theme (v2)
   Styled after heronaiapp.com/about-us: cream ground, ink text, one bright
   accent, hairline borders, uppercase mono labels, sharp corners.
   English/Latin: Space Grotesk (headings, uppercase) + Space Mono (labels).
   Malayalam: Anek Malayalam (headings) + Noto Sans Malayalam (body), as
   specified by https://fonts.google.com/specimen/Anek+Malayalam and
   https://fonts.google.com/noto/specimen/Noto+Sans+Malayalam.
   Note: Heron AI's actual typefaces ("BT Grotesk", "Geist Mono") are not
   available as free/licensable web fonts; Space Grotesk + Space Mono are
   the closest open equivalents in visual character (geometric grotesk,
   tight negative tracking, monospace technical labels).
   ========================================================================== */

:root{
  --ink:        #282828;
  --ink-soft:   rgba(40,40,40,.68);
  --paper:      #f5f4ee;
  --paper-alt:  #ececE2;
  --card:       #fffefb;
  --line:       rgba(40,40,40,.18);
  --line-strong:#282828;
  --brand:      #fa3600;   /* Heron's exact accent orange-red */
  --brand-dark: #c22900;
  --brand-soft: #fde3d8;
  --gold:       #fa3600;   /* secondary accent reuses the single brand color, Heron-style */
  --shadow:     0 14px 30px -18px rgba(40,40,40,.28);
  --shadow-sm:  0 1px 0 rgba(40,40,40,.06);
  --radius:     2px;
  --radius-sm:  2px;
  --sans:       "Space Grotesk","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --mono:       "Space Mono","JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --mal:        "Noto Sans Malayalam","Manjari",sans-serif;
  --mal-heading:"Anek Malayalam","Noto Sans Malayalam",sans-serif;
  --maxw: 2200px;
}

html[data-theme="dark"]{
  --ink:        #ece9e2;
  --ink-soft:   rgba(236,233,226,.66);
  --paper:      #1b1a17;
  --paper-alt:  #242320;
  --card:       #232220;
  --line:       rgba(236,233,226,.14);
  --line-strong:rgba(236,233,226,.38);
  --brand:      #ff6b45;
  --brand-dark: #ff9270;
  --brand-soft: #3a2016;
  --gold:       #ff6b45;
  --shadow:     0 14px 30px -18px rgba(0,0,0,.7);
  --shadow-sm:  0 1px 0 rgba(0,0,0,.5);
}
html[data-theme="dark"] body{
  background-image:
    repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 1px, transparent 1px 64px);
}
body, .site-header, .site-header .wrap, .site-footer, .memorial-card, .info-card,
.figure-inline, .theme-toggle, .theme-toggle-thumb, .main-nav a, a{
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; font-size:19px; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  background-image:
    repeating-linear-gradient(135deg, rgba(40,40,40,.035) 0 1px, transparent 1px 64px);
  line-height:1.72;
  font-size:1.08rem;
  font-weight:500;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--brand); text-decoration:none; }
a:hover{ color:var(--brand-dark); text-decoration:underline; }
h1,h2,h3,h4{
  font-family:var(--sans); color:var(--ink); line-height:1.08; margin:0 0 .5em;
  font-weight:600; letter-spacing:-.02em; text-transform:uppercase;
}
p{ margin:0 0 1.3em; overflow-wrap:anywhere; }
:lang(ml){ font-family:var(--mal); line-height:2.05; }
h1:lang(ml), h2:lang(ml), h3:lang(ml), h4:lang(ml){ font-family:var(--mal-heading); line-height:1.4; text-transform:none; letter-spacing:0; font-weight:700; }
::selection{ background:#e15c46; color:#fff; }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:32px; }
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- Skip link ---------- */
.skip-link{
  position:absolute; left:-999px; top:0; background:var(--ink); color:var(--paper); padding:10px 16px;
  z-index:300; font-family:var(--mono); text-transform:uppercase; font-size:.78rem;
}
.skip-link:focus{ left:0; }
.brand img.logo-dark, .footer-wordmark img.logo-dark{ display:none; }
html[data-theme="dark"] .brand img.logo-light, html[data-theme="dark"] .footer-wordmark img.logo-light{ display:none; }
html[data-theme="dark"] .brand img.logo-dark, html[data-theme="dark"] .footer-wordmark img.logo-dark{ display:block; }

/* ---------- Top utility bar ---------- */
.topbar{
  background:var(--ink); color:var(--paper); font-family:var(--mono); font-size:.72rem; letter-spacing:.02em;
}
.topbar .wrap{ display:flex; justify-content:center; align-items:center; padding-block:7px; gap:12px; flex-wrap:wrap; text-align:center; }
.topbar a{ color:var(--paper); opacity:.85; }
.topbar a:hover{ opacity:1; color:var(--brand); text-decoration:none; }
.topbar span{ opacity:.7; }

/* ---------- Header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:200; background:var(--paper); padding:0;
}
.site-header .wrap{
  display:flex; align-items:stretch; min-height:92px; max-width:100%;
  border:1px solid var(--line-strong); border-radius:0; background:var(--paper);
  padding-inline:0; overflow:hidden; border-left:0; border-right:0;
}
.brand{
  display:flex; align-items:center; gap:12px; min-width:0; flex:1 1 auto;
  padding:0 26px; border-right:1px solid var(--line-strong);
}
.brand img{ height:46px; width:auto; flex-shrink:0; }

.nav-toggle{
  display:none; width:38px; height:38px; border:1px solid var(--line-strong); background:var(--card);
  align-items:center; justify-content:center; cursor:pointer; position:relative; flex-shrink:0;
  margin-block:auto; margin-left:16px; margin-right:16px;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  display:block; width:18px; height:2px; background:var(--ink); position:relative; transition:transform .18s;
}
.nav-toggle span::before{ content:""; position:absolute; top:-6px; }
.nav-toggle span::after{ content:""; position:absolute; top:6px; }

.main-nav ul{ list-style:none; display:flex; align-items:stretch; gap:0; margin:0; padding:0; height:100%; }
.main-nav li{ border-left:1px solid var(--line-strong); display:flex; }
.main-nav a{
  position:relative; display:block; color:var(--ink); font-weight:500; font-size:.78rem;
  padding:20px 26px 16px; border-radius:0; align-self:stretch;
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.02em;
}
.main-nav a:hover{ background:var(--paper-alt); text-decoration:none; color:var(--brand); }
.main-nav a.is-active{ background:transparent; color:var(--brand); font-weight:700; }
.main-nav li:last-child a{ color:var(--brand); padding-right:46px; }
.main-nav li:last-child a::after{
  content:"\2192"; position:absolute; right:18px; bottom:14px; font-size:1rem;
}
.main-nav li:last-child a.is-active{ color:var(--brand-dark); }
.main-nav li:last-child a.is-active::after{ color:var(--brand-dark); }

/* ---------- Theme toggle ---------- */
.theme-toggle{
  appearance:none; -webkit-appearance:none; border:1px solid var(--line-strong); background:var(--paper-alt);
  cursor:pointer; padding:0; border-radius:999px; width:65px; height:34px; display:flex; align-items:center;
  position:relative; flex-shrink:0; margin-block:auto; margin-inline:14px;
}
.theme-toggle-track{
  position:relative; width:100%; height:100%; display:flex; align-items:center; justify-content:space-between;
  padding:0 7px; pointer-events:none;
}
.theme-toggle-icon{ display:flex; align-items:center; justify-content:center; width:16px; height:16px; position:relative; z-index:1; color:var(--ink-soft); }
.theme-toggle-icon svg{ width:100%; height:100%; display:block; }
.theme-toggle-icon--sun{ color:var(--brand); }
.theme-toggle-icon--moon{ color:var(--ink-soft); }
.theme-toggle-thumb{
  position:absolute; top:2px; left:2px; width:26px; height:26px; border-radius:50%;
  background:var(--card); border:1px solid var(--line-strong); box-shadow:var(--shadow-sm);
  transform:translateX(0); transition:transform .25s ease, background-color .25s ease, border-color .25s ease;
}
.theme-toggle:hover{ border-color:var(--brand); }
html[data-theme="dark"] .theme-toggle{ background:#14161c; }
html[data-theme="dark"] .theme-toggle-thumb{ transform:translateX(35px); }
html[data-theme="dark"] .theme-toggle-icon--moon{ color:#e8c96b; }
html[data-theme="dark"] .theme-toggle-icon--sun{ color:var(--ink-soft); }

/* ---------- Hero (hub) ---------- */
.hero{
  background:var(--paper);
  border-bottom:1px solid var(--line-strong);
  position:relative;
}
.hero::before, .hero::after{
  content:"+"; position:absolute; color:var(--ink); font-size:14px; line-height:1; opacity:.6; font-family:var(--mono);
}
.hero::before{ top:10px; left:10px; }
.hero::after{ top:10px; right:10px; }
.hero .wrap{ padding-block:76px 68px; }
.hero-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; }
.hero-image{ display:flex; justify-content:center; }
.hero-image img{ max-width:100%; height:auto; }
@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-image{ order:-1; max-width:360px; margin-inline:auto; }
}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:.76rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--brand); margin-bottom:14px; font-family:var(--mono);
}
.eyebrow::before{ content:""; width:22px; height:1px; background:var(--brand); display:inline-block; }
.hero h1{ font-size:clamp(3rem,6vw,5rem); max-width:19ch; }
.hero-lead{ max-width:64ch; color:var(--ink-soft); font-size:1.22rem; line-height:1.68; font-weight:500; text-transform:none; }
.hero-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; }

.btn{
  display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:.8rem;
  padding:13px 22px; border-radius:8px; border:1px solid var(--line-strong); cursor:pointer;
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em; position:relative;
}
.btn-primary{ background:transparent; color:var(--brand); border-color:var(--brand); padding-right:52px; }
.btn-primary::before{ content:""; position:absolute; right:38px; top:10px; bottom:10px; border-left:1px dashed rgba(250,54,0,.5); }
.btn-primary::after{ content:"\2192"; position:absolute; right:16px; }
.btn-primary:hover{ background:var(--brand); border-color:var(--brand); color:#fff; text-decoration:none; }
.btn-primary:hover::before{ border-left-color:rgba(255,255,255,.5); }
.btn-ghost{ background:transparent; border-color:var(--line-strong); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--brand); color:var(--brand); text-decoration:none; }

/* ---------- Sections ---------- */
.section{ padding-block:76px; }
.section-alt{ background:var(--paper-alt); border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong); }
.section-alt.team-section{ background:transparent; }
.section-head{ max-width:70ch; margin-bottom:40px; }
.section-head h2{ font-size:clamp(2.2rem,3.6vw,3.2rem); }
.section-head p{ color:var(--ink-soft); font-size:1.1rem; text-transform:none; font-family:var(--sans); }

/* Resources-page-style section head (Memories Of / Editorial Board) */
.resources-section{ padding-block:0; }
.resources-head{ text-align:center; border-bottom:1px solid var(--line-strong); }
.resources-head .wrap{ padding-block:56px 40px; }
.resources-head h2{ font-size:clamp(2.4rem,5.2vw,4rem); margin:0; }
.resources-tabs{ border-bottom:1px solid var(--line-strong); }
.resources-tabs .wrap{ display:flex; justify-content:center; align-items:baseline; gap:28px; padding-block:16px; flex-wrap:wrap; }
.resources-tab{ font-family:var(--mono); text-transform:uppercase; font-size:.8rem; letter-spacing:.02em; color:var(--ink-soft); }
.resources-tab sup{ font-size:.7em; margin-left:2px; }
.resources-tab.is-active{ color:var(--brand); }

/* "Memories Of" — styled exactly like Heron's "Built by architects, powered by
   technologists" team section: eyebrow + big left title / description on the
   right, full-width divider, then a photo-name-role card grid. */
.team-section{ padding-block:0; }
.team-head{
  display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:end;
  padding-block:56px 40px;
}
.team-head-title .eyebrow{ margin-bottom:18px; }
.team-head-title h2{ font-size:clamp(2.2rem,4.4vw,3.4rem); margin:0; max-width:14ch; }
.team-head-desc p{ color:var(--ink-soft); font-size:1.1rem; text-transform:none; font-family:var(--sans); max-width:48ch; margin:0; }
.team-section .card-body{ text-align:center; padding:24px 20px 30px; }
.team-section .memorial-card h3{ font-size:1.15rem; text-transform:uppercase; letter-spacing:-.01em; overflow-wrap:break-word; }
.team-section .memorial-card .tagline{
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em; font-size:.72rem; color:var(--ink-soft);
  transition:color .25s ease;
}
.team-section .memorial-card:hover h3{ color:#fff; }
.team-section .memorial-card:hover .tagline{ color:rgba(255,255,255,.88); }
.team-section .memorial-card .photo,
.team-section .people-card .avatar{
  border-bottom:none; background:transparent; padding:24px 24px 0;
}
.team-section .memorial-card .photo img,
.team-section .people-card .avatar img{
  object-position:center top;
}
.team-section .memorial-grid{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){
  .team-section .memorial-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .team-section .memorial-grid{ grid-template-columns:1fr; }
}
@media (max-width:760px){
  .team-head{ grid-template-columns:1fr; }
}
.resources-body{ padding-block:40px; }
.subgroup-label{
  font-family:var(--mono); text-transform:uppercase; font-size:.76rem; letter-spacing:.04em;
  color:var(--ink-soft); margin-bottom:14px;
}
.team-section .subgroup-label{ text-align:center; }
.subgroup-label strong{ color:var(--ink); font-weight:700; }

.prose{ max-width:72ch; font-size:1.1rem; }
.prose p{ color:var(--ink-soft); }
.prose strong{ color:var(--ink); }

/* ---------- Memorial grid (hub "Memories Of") — edge-to-edge hairline grid ---------- */
.memorial-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:0;
  border-top:1px solid var(--line-strong); border-left:1px solid var(--line-strong);
}
.memorial-card{
  position:relative; background:transparent; border-right:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong);
  border-radius:0; overflow:hidden; box-shadow:none;
  display:flex; flex-direction:column;
}
.memorial-card::before{
  content:""; position:absolute; inset:0; background:#000;
  transform:scaleY(0); transform-origin:bottom; transition:transform .4s ease; z-index:0; pointer-events:none;
}
.memorial-card:hover::before{ transform:scaleY(1); }
.memorial-card a.card-link{ position:relative; z-index:1; color:inherit; text-decoration:none; display:flex; flex-direction:column; height:100%; }
.memorial-card .photo{ aspect-ratio:4/5; overflow:hidden; background:var(--paper-alt); filter:grayscale(1); transition:filter .4s ease; border-bottom:1px solid var(--line-strong); }
.memorial-card .photo img{ width:100%; height:100%; object-fit:cover; }
.memorial-card:hover .photo{ filter:grayscale(0); }
.memorial-card .card-body{ padding:18px 20px 22px; display:flex; flex-direction:column; gap:6px; flex:1; transition:color .25s ease; }
.memorial-card h3{ font-size:1.05rem; margin:0; transition:color .25s ease; }
.memorial-card .tagline{ color:var(--ink-soft); font-size:.86rem; margin:0; text-transform:none; font-family:var(--sans); transition:color .25s ease; }
.memorial-card .view-link{ margin-top:auto; font-weight:600; font-size:.74rem; color:var(--brand); font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em; padding-top:10px; transition:color .25s ease; }
.memorial-card:hover h3{ color:#fff; }
.memorial-card:hover .tagline{ color:rgba(255,255,255,.88); }
.memorial-card:hover .view-link{ color:#fff; }

/* ---------- Editorial board ---------- */
.people-grid{
  display:grid; grid-template-columns:repeat(6, 1fr); gap:0;
  border-top:1px solid var(--line-strong); border-left:1px solid var(--line-strong);
}
.people-grid.is-1{ grid-template-columns:repeat(1,1fr); max-width:16.6667%; margin-inline:auto; }
.people-grid.is-2{ grid-template-columns:repeat(2,1fr); max-width:33.3333%; margin-inline:auto; }
@media (max-width:1200px){
  .people-grid{ grid-template-columns:repeat(3, 1fr); }
  .people-grid.is-1{ max-width:33.3333%; }
  .people-grid.is-2{ max-width:66.6667%; }
}
@media (max-width:640px){
  .people-grid{ grid-template-columns:repeat(2, 1fr); }
  .people-grid.is-1{ max-width:50%; }
  .people-grid.is-2{ max-width:100%; }
}
.people-card{
  display:flex; flex-direction:column; text-align:center; background:transparent; transition:background .15s;
  border-right:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong);
}
.people-card:hover{ background:var(--paper-alt); }
.people-card .avatar{
  width:100%; aspect-ratio:4/5; border-radius:0; margin:0;
  background:var(--paper-alt); border:0; border-bottom:1px solid var(--line-strong); filter:grayscale(.15);
}
.people-card .avatar img{ width:100%; height:100%; object-fit:cover; }
.people-card .name{
  order:1; font-weight:700; font-size:.95rem; font-family:var(--sans); text-transform:uppercase; letter-spacing:-.01em;
  padding:16px 12px 0;
}
.people-card .role{
  order:2; display:block; font-size:.68rem; color:var(--ink-soft); font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; font-family:var(--mono); padding:4px 12px 0;
}
.people-card .tagline{ order:3; font-size:.72rem!important; color:var(--ink-soft); padding:4px 12px 16px; }
.people-card:not(:has(.tagline)):not(:has(.role)){ padding-bottom:16px; }

/* ---------- Person / memorial page — Heron "insight article" layout ---------- */
.article-meta{ border-bottom:1px solid var(--line-strong); background:var(--paper); }
.article-meta-inner{ display:flex; padding:0; }
.article-meta-left{
  padding:20px 32px; border-right:1px solid var(--line-strong);
  font-family:var(--mono); text-transform:uppercase; font-size:.78rem; letter-spacing:.02em; color:var(--ink-soft);
  white-space:nowrap;
}
.article-meta-right{
  padding:20px 32px; flex:1;
  font-family:var(--mono); text-transform:uppercase; font-size:.78rem; letter-spacing:.02em; color:var(--ink-soft);
}
.article-meta-right .sep{ color:var(--brand); margin:0 4px; }

.article-layout{ display:grid; grid-template-columns:300px 1fr; align-items:start; }
.article-sidebar{
  border-right:1px solid var(--line-strong); padding:0 32px 40px 0;
  position:sticky; top:92px; align-self:start;
  max-height:calc(100vh - 92px); overflow-y:auto;
}
.article-photo{
  border:1px solid var(--line-strong); aspect-ratio:4/5; overflow:hidden; filter:grayscale(.2); margin-top:32px;
}
.article-photo img{ width:100%; height:100%; object-fit:cover; }
.article-toc-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  padding-top:26px; margin-bottom:4px;
}
.article-toc-head h2{ font-size:1.15rem; margin:0; }
.article-toc-head .count{ font-family:var(--mono); color:var(--ink-soft); font-size:.78rem; text-transform:none; }
.article-toc{ display:flex; flex-direction:column; }
.article-toc a{
  display:flex; align-items:center; gap:10px; padding:13px 0; border-bottom:1px dashed var(--line);
  font-family:var(--sans); font-size:.88rem; font-weight:600; color:var(--ink); text-transform:none; letter-spacing:0;
}
.article-toc a:hover{ color:var(--brand); text-decoration:none; }
.article-toc a.is-active{ color:var(--brand); }
.article-toc .idx{ font-family:var(--mono); font-size:.76rem; color:var(--ink-soft); font-weight:400; }
.article-tags{ padding-top:22px; border-top:1px solid var(--line); margin-top:18px; }
.tag-row{ display:flex; gap:8px; flex-wrap:wrap; }
.tag{
  display:inline-block; padding:5px 11px; border:1px solid var(--line-strong); border-radius:999px;
  font-size:.7rem; color:var(--ink-soft); background:transparent; font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em;
}

.article-main{ padding:40px 0 40px 40px; min-width:0; }
.article-main h1{ font-size:clamp(2rem,3.6vw,3rem); margin-bottom:16px; }
.article-summary{
  color:var(--ink-soft); max-width:75ch; text-transform:none; font-family:var(--sans); font-size:1.16rem; line-height:1.6;
  padding-bottom:32px; border-bottom:1px solid var(--line-strong); margin-bottom:8px;
}

.breadcrumb{ font-size:.76rem; color:var(--ink-soft); padding-top:18px; font-family:var(--mono); text-transform:uppercase; letter-spacing:.02em; }
.breadcrumb a{ color:var(--ink-soft); }
.breadcrumb a:hover{ color:var(--brand); }

/* Language toggle */
.lang-toggle{
  display:inline-flex; border:1px solid var(--line-strong); border-radius:0; padding:0; background:transparent;
}
.lang-toggle button{
  border:0; background:transparent; padding:7px 16px; border-radius:0; font-weight:700; font-size:.72rem;
  cursor:pointer; color:var(--ink-soft); font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em;
}
.lang-toggle button:hover{ background:var(--paper-alt); color:var(--ink); }
.lang-toggle button + button{ border-left:1px solid var(--line-strong); }
.lang-toggle button.is-active{ background:transparent; color:var(--brand); box-shadow:none; }
.lang-toggle button.is-active:hover{ background:var(--paper-alt); }

.bio-section{ padding-block:44px; border-top:1px solid var(--line); scroll-margin-top:120px; }
.bio-section:first-of-type{ border-top:none; }
.bio-section-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px;
}
.bio-section-head:has(.lang-toggle){
  position:sticky; top:91px; z-index:80; background:var(--paper);
  padding-block:18px 12px; margin-bottom:14px; border-bottom:1px solid var(--line-strong);
}
.bio-section-head h2{ margin:0; font-size:2.1rem; }
.bio-section-head h2 .num{ color:var(--brand); font-family:var(--mono); font-weight:700; font-size:.85rem; margin-right:8px; text-transform:none; }

.lang-panel{ max-width:74ch; font-size:1.1rem; }
.lang-panel[hidden]{ display:none; }
.lang-panel h3{ font-size:1.4rem; margin-top:1.7em; color:var(--ink); }
.lang-panel h3:first-child{ margin-top:0; }
.lang-panel p{ color:var(--ink-soft); }
.lang-panel figure{ margin:0 0 1.2em; }
.lang-panel figure img{ border-radius:var(--radius-sm); border:1px solid var(--line-strong); }
.lang-panel figcaption{ font-size:.76rem; color:var(--ink-soft); margin-top:6px; font-family:var(--mono); }

/* Inline biography photos — float beside flowing text, WP-style */
.figure-inline{
  margin:4px 0 18px; max-width:260px; box-shadow:none;
  border-radius:0; overflow:hidden; background:var(--card); border:1px solid var(--line-strong);
}
.figure-inline img{ display:block; width:100%; height:auto; border-radius:0; border:0; filter:grayscale(.1); }
.figure-inline figcaption{ padding:8px 10px; font-size:.72rem; color:var(--ink-soft); border-top:1px solid var(--line-strong); font-family:var(--mono); }
.figure-inline.float-left{ float:left; margin-right:22px; clear:left; }
.figure-inline.float-right{ float:right; margin-left:22px; clear:right; }
@media (max-width:520px){
  .figure-inline.float-left, .figure-inline.float-right{ float:none; margin-inline:0; max-width:100%; clear:both; }
}
.figure-inline.figure-full{
  float:none; clear:both; max-width:100%; width:100%; margin:6px 0 22px;
}
.figure-inline.figure-full img{ max-height:520px; object-fit:cover; }
.figure-inline.figure-full figcaption{ text-align:center; }

.pull{
  border-left:3px solid var(--brand); padding:2px 0 2px 18px; margin:1.6em 0; font-family:var(--sans);
  font-style:normal; font-weight:600; color:var(--ink); text-transform:none;
}

/* Family tree */
.tree{ list-style:none; margin:0; padding-left:0; overflow-wrap:anywhere; }
.tree li{ position:relative; margin:0; padding:10px 0 10px 26px; border-left:2px solid var(--line-strong); }
.tree > li{ border-left:none; padding-left:0; }
.tree li::before{ content:""; position:absolute; left:-2px; top:22px; width:16px; height:2px; background:var(--line-strong); }
.tree > li::before{ display:none; }
.tree ul{ list-style:none; margin:6px 0 0; padding-left:22px; }
.tree .couple{
  display:inline-block; font-weight:700; color:var(--ink); background:var(--paper-alt);
  border:1px solid var(--line-strong); padding:5px 12px; border-radius:0; font-size:.88rem; font-family:var(--mono);
}
.tree > li > .couple{ background:var(--brand); border-color:var(--brand); color:#fff; font-size:.95rem; }

/* Gallery */
.gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.gallery img{ border-radius:var(--radius-sm); border:1px solid var(--line-strong); aspect-ratio:1/1; object-fit:cover; filter:grayscale(.1); }

.note-card{
  background:var(--card); border:1px solid var(--line-strong); border-radius:var(--radius-sm);
  padding:16px 18px; font-size:.88rem; color:var(--ink-soft); font-family:var(--sans);
}

/* ---------- Person index strip (prev/next on person pages) ---------- */
.related-people{ padding-block:40px; }
.related-people h2{ font-size:1.05rem; margin-bottom:18px; }

/* ---------- Contact / reading-help pages ---------- */
.page-hero{ padding-block:48px 8px; border-bottom:1px solid var(--line-strong); background:var(--paper-alt); }
.page-hero h1{ font-size:clamp(2.2rem,4vw,3rem); }

.contact-layout{ display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:start; }

.form-grid{ display:grid; gap:16px; max-width:640px; }
.form-grid label{ font-weight:700; font-size:.76rem; display:block; margin-bottom:6px; font-family:var(--mono); text-transform:uppercase; letter-spacing:.03em; }
.form-grid input, .form-grid textarea{
  width:100%; padding:11px 13px; border:1px solid var(--line-strong); border-radius:0; font:inherit;
  background:var(--card);
}
.form-grid input:focus, .form-grid textarea:focus{ outline:2px solid var(--brand); outline-offset:1px; }
.form-grid input[aria-invalid="true"], .form-grid textarea[aria-invalid="true"]{ border-color:var(--brand); }
.field-error{ color:var(--brand); font-size:.78rem; margin-top:5px; font-family:var(--sans); text-transform:none; display:none; }
.field-error:not(:empty){ display:block; }

.info-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; margin-top:28px; }
.info-card{ background:transparent; border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:18px; box-shadow:none; transition:background .15s; }
.info-card:hover{ background:var(--paper-alt); }
.info-card h3{ font-size:.92rem; margin-bottom:6px; }
.info-card p{ color:var(--ink-soft); margin:0; font-size:.88rem; text-transform:none; font-family:var(--sans); }

ol.help-list{ padding-left:22px; }
ol.help-list li{ margin-bottom:14px; color:var(--ink-soft); }

/* ---------- Footer ---------- */
.site-footer{ background:var(--paper); color:var(--ink); margin-top:40px; border-top:1px solid var(--line-strong); }
.footer-statement{ border-bottom:1px solid var(--line-strong); padding-block:52px; }
.footer-statement h2{ margin:0; font-size:clamp(1.8rem,3.4vw,2.6rem); max-width:20ch; }
.footer-cols{ border-bottom:1px solid var(--line-strong); }
.footer-cols-inner{ display:grid; grid-template-columns:2fr 1fr 1fr; }
.footer-col{ padding:36px 32px; }
.footer-col + .footer-col{ border-left:1px solid var(--line-strong); }
.site-footer h4{ color:var(--ink); font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:16px; }
.site-footer p{ color:var(--ink-soft); font-size:.92rem; text-transform:none; font-family:var(--sans); }
.site-footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.site-footer a{ color:var(--ink); opacity:.85; font-size:.92rem; }
.site-footer a:hover{ opacity:1; color:var(--brand); }
.footer-wordmark{
  border-bottom:1px solid var(--line-strong); padding-block:44px; overflow:hidden; position:relative;
}
.footer-wordmark::before, .footer-wordmark::after{
  content:"+"; position:absolute; top:10px; color:var(--ink); font-family:var(--mono); font-size:14px; opacity:.6;
}
.footer-wordmark::before{ left:34px; }
.footer-wordmark::after{ right:34px; }
.footer-wordmark img{
  display:block; margin-inline:auto; height:clamp(64px,9vw,110px); width:auto;
}
.footer-base{
  padding:18px 0; font-size:.76rem; color:var(--ink-soft);
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.02em;
}
.footer-base-inner{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed; right:20px; bottom:20px; width:44px; height:44px; border-radius:50%;
  background:var(--brand); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s;
  font-size:1.1rem; border:0; cursor:pointer; z-index:150;
}
.back-to-top.show{ opacity:1; pointer-events:auto; }
.back-to-top:hover{ transform:translateY(-3px); }

/* ---------- Lightbox (gallery + full-width image overlay) ---------- */
.gallery img, .figure-full img{ cursor:zoom-in; transition:opacity .15s; }
.gallery img:hover, .figure-full img:hover{ opacity:.9; }
.lightbox{
  position:fixed; inset:0; z-index:1000; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:rgba(24,22,20,.95); opacity:0; pointer-events:none; transition:opacity .2s; padding:24px;
}
.lightbox.is-open{ opacity:1; pointer-events:auto; }
.lightbox-figure{ max-width:min(92vw,1100px); max-height:80vh; display:flex; flex-direction:column; align-items:center; gap:14px; }
.lightbox-img{ max-width:100%; max-height:80vh; width:auto; height:auto; object-fit:contain; border-radius:0; box-shadow:none; background:#111; border:1px solid rgba(255,255,255,.15); }
.lightbox-caption{ color:var(--paper); font-size:.86rem; text-align:center; max-width:70ch; font-family:var(--mono); }
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:fixed; background:transparent; color:#fff; border:1px solid rgba(255,255,255,.3);
  width:44px; height:44px; border-radius:0; display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; cursor:pointer; transition:background .15s;
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{ background:var(--brand); border-color:var(--brand); }
.lightbox-close{ top:20px; right:20px; }
.lightbox-prev{ left:20px; top:50%; transform:translateY(-50%); }
.lightbox-next{ right:20px; top:50%; transform:translateY(-50%); }
.lightbox-count{ position:fixed; bottom:18px; left:50%; transform:translateX(-50%); color:rgba(245,244,238,.7); font-size:.76rem; font-family:var(--mono); }
@media (max-width:640px){
  .lightbox-prev, .lightbox-next{ width:38px; height:38px; font-size:1.1rem; }
  .lightbox-close{ width:38px; height:38px; font-size:1.1rem; }
}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .person-hero .wrap{ grid-template-columns:1fr; text-align:center; }
  .person-photo{ width:200px; margin-inline:auto; }
  .tag-row, .hero-actions{ justify-content:center; }
}
@media (max-width: 1024px){
  .nav-toggle{ display:flex; }
  .main-nav{
    display:none; position:absolute; left:0; right:0; top:100%; background:var(--paper);
    border-bottom:1px solid var(--line-strong); box-shadow:var(--shadow);
  }
  .main-nav.is-open{ display:block; }
  .main-nav ul{ flex-direction:column; padding:10px; gap:2px; }
  .main-nav a{ display:block; }
}
@media (max-width: 760px){
  html{ font-size:18px; }
  .section{ padding-block:52px; }
  .resources-head .wrap{ padding-block:40px 28px; }
  .team-head{ padding-block:40px 28px; }
  .hero .wrap{ padding-block:52px 44px; }
  .article-layout{ grid-template-columns:1fr; }
  .article-sidebar{ position:static; border-right:none; border-bottom:1px solid var(--line-strong); padding:0 0 30px; max-height:none; }
  .article-main{ padding-left:0; }
  .bio-section-head:has(.lang-toggle){ top:91px; }
  .footer-cols-inner{ grid-template-columns:1fr; }
  .contact-layout{ grid-template-columns:1fr; gap:32px; }
  .form-grid{ max-width:none; }
  .footer-col + .footer-col{ border-left:none; border-top:1px solid var(--line-strong); }
}
@media (max-width: 520px){
  .theme-toggle{ margin-inline:8px; width:58px; height:31px; }
  .theme-toggle-thumb{ width:24px; height:24px; }
  html[data-theme="dark"] .theme-toggle-thumb{ transform:translateX(30px); }
  html{ font-size:16.5px; }
  body{ line-height:1.6; }
  .section{ padding-block:40px; }
  .hero-lead, .team-head-desc p, .section-head p{ font-size:1rem; }
  .memorial-card .card-body, .team-section .card-body{ padding:14px 14px 18px; }
}
@media (max-width: 520px){
  .memorial-grid{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
  .hero .wrap{ padding-block:44px 36px; }
  .topbar .wrap{ font-size:.7rem; }
}
/* ---------- Print ---------- */
@media print{
  .site-header, .toc, .back-to-top, .lang-toggle, .hero-actions, .lightbox, .theme-toggle{ display:none; }
}