/* --------
   Base
   -------- */
:root{
  --bg:#f9f6f7;
  --surface:#f1eef2;
  --text:#332b29;
  --muted:#6e5f5b;
  --brand:#847d80;
  --brand-deep:#655d6c;
  --brand-2:#cfc9cb;
  --brand-soft:#f6f5f5;
  --brand-cta:#8a8081;
  --accent:#d6b85a; /* warm yellow/gold */
  --accent-rgb:214,184,90;
  --accent-600:#b58f3e;
  --accent-700:#8f6f2e;
  --accent-100:#fff2d0; /* light background yellow supplied by designer */
  --sage:#a8c0b0;
  --sage-rgb:168,192,176;
  --gold:#eadbb8;
  --ring: 0 0 0 4px rgba(var(--accent-rgb),.22);
  --e-out: cubic-bezier(.2,.9,.2,1);
  --e-soft: cubic-bezier(.16,.84,.44,1);
  --dur-1: .45s;
  --dur-2: .65s;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
}
img{max-width:100%;display:block}
html{scroll-behavior:smooth}

.container{width:min(1200px, 100% - 2rem); margin-inline:auto}
.narrow{ margin-inline:auto}
.section-title{font-size:1.8rem; margin:0 0 1rem 0; color:var(--brand-deep)}
.display{
  font-family:"Playfair Display",serif;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height:1.1;
  margin:0 0 .75rem 0;
  color:var(--brand-deep);
}
.subtitle{font-weight:600; color:var(--muted); margin:.25rem 0 1rem}

.grad{
  /* stronger, gold-accent gradient for headline emphasis */
  background:linear-gradient(135deg, var(--accent-700) 0%, var(--accent) 50%, var(--brand-cta) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:800;
  /* slightly larger relative size so the emphasized phrase stands out */
  font-size:1.04em;
  /* subtle shadow to lift from busy backgrounds */
  text-shadow: 0 1px 0 rgba(255,255,255,0.15), 0 6px 20px rgba(0,0,0,0.08);
}

a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#fff;padding:.5rem .75rem;border-radius:.5rem;box-shadow:var(--ring)}

/* --------
   Header
   -------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(165%) blur(18px);
  border-bottom:1px solid rgba(207,174,184,.22);
  transition:background .3s ease, box-shadow .3s ease;
}
.site-header.is-scrolled{background:rgba(255,255,255,.95); box-shadow:0 18px 45px rgba(97,90,110,.12)}
.header-glow{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(70% 110% at 18% -40%, rgba(234,219,184,.38), transparent 72%),
    radial-gradient(55% 120% at 82% -45%, rgba(var(--accent-rgb),.28), transparent 74%);
  opacity:.38;
}
.header-inner{
  position:relative;
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem;
  padding:.9rem 0;
}
.brand{
  display:flex; align-items:center; gap:.75rem;
  color:var(--text);
  font-weight:800;
  text-decoration:none;
}
.brand:hover{text-decoration:none}
.brand-logo{
  height:46px;
  width:auto;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 8px 16px rgba(129,138,155,.18));
}
.brand-stack{display:flex; flex-direction:column; gap:.15rem}
.brand-text{letter-spacing:.25px; font-size:1.05rem}
.brand-sub{font-size:.8rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#5f6c80}

.nav-primary{margin-left:auto; position:relative; z-index:5}
.nav-list{display:flex; align-items:center; gap:.4rem; list-style:none; margin:0; padding:0}
.nav-list li{display:flex}
.nav-list a{
  position:relative;
  display:inline-flex;
  align-items:center;
  padding:.55rem .9rem;
  border-radius:.9rem;
  font-weight:600;
  font-size:.95rem;
  color:var(--brand-deep);
  transition:color .2s ease, background .2s ease;
}
.nav-list a::after{
  content:"";
  position:absolute;
  left:14px; right:14px; bottom:.35rem;
  height:2px; border-radius:2px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s ease-in-out;
  opacity:.85;
}
.nav-list a:hover,
.nav-list a:focus{background:rgba(var(--accent-rgb),.22); text-decoration:none}
.nav-list a:hover::after,
.nav-list a:focus::after{transform:scaleX(1)}
.nav-list a.active{color:var(--brand-cta)}
.nav-list a.active::after{transform:scaleX(1)}
.nav-cta{margin-left:1rem}
.nav-cta .btn{font-weight:700; box-shadow:0 12px 20px rgba(var(--accent-rgb),.18)}

.nav-toggle{display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:40px; height:40px; background:rgba(255,255,255,.75); border:1px solid rgba(198,170,176,.28); border-radius:.8rem; padding:0; transition:background .2s ease, border .2s ease}
.nav-toggle:hover{background:rgba(255,255,255,.92)}
.nav-toggle:focus{box-shadow:var(--ring)}
.nav-toggle-bar{display:block; width:18px; height:2px; border-radius:999px; background:var(--text); transition:transform .25s ease, opacity .25s ease}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-of-type(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-of-type(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-of-type(3){transform:translateY(-7px) rotate(-45deg)}

/* --------
   Hero
   -------- */
.hero{
  padding: clamp(2rem, 5vw, 4rem) 0 0;
  background:
    radial-gradient(78% 58% at 18% 8%, rgba(234,219,184,.28), transparent 62%),
    linear-gradient(180deg, rgba(var(--accent-rgb),.22), transparent 45%);
}
.hero-grid{
  display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem; align-items:center;
}
.hero-figure img{border-radius:1.2rem; box-shadow:0 12px 34px rgba(129,138,155,.2)}

.page-connect .hero{
  padding:clamp(3rem, 8vw, 5.5rem) 0;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(253,246,233,.82)),
    radial-gradient(120% 130% at 15% -35%, rgba(211,74,74,.2), transparent 70%),
    radial-gradient(110% 140% at 80% -30%, rgba(246,210,146,.22), transparent 72%),
    url('assets/images/dr-elaine-give-talk.jpg');
  background-size: 100% 100%, 150% 150%, 150% 150%, cover;
  background-position: center, center top, center bottom, center;
  background-repeat:no-repeat;
  animation: connect-bg-pan 26s ease-in-out infinite alternate;
}
.page-connect .hero::before,
.page-connect .hero::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:.35;
}
.page-connect .hero::before{
  width:48vw; max-width:520px; aspect-ratio:1;
  top:-32%; left:-18%;
  background:radial-gradient(circle, rgba(211,74,74,.28), transparent 68%);
  animation: connect-orbit 22s ease-in-out infinite;
}
.page-connect .hero::after{
  width:40vw; max-width:460px; aspect-ratio:1;
  bottom:-35%; right:-12%;
  background:radial-gradient(circle, rgba(246,210,146,.32), rgba(211,74,74,.18) 55%, transparent 80%);
  animation: connect-orbit 28s ease-in-out infinite reverse;
}
.page-connect .hero-grid{
  grid-template-columns:1fr;
  justify-items:start;
  gap:clamp(1.4rem, 5vw, 2.6rem);
  position:relative;
  z-index:1;
  max-width:min(920px, 100% - 2.5rem);
  margin-inline:auto;
  width:100%;
}
.connect-hero-copy{max-width:min(640px, 100%); display:grid; gap:1rem; animation: hero-fade 0.9s var(--e-soft) forwards; opacity:0; text-align:left}
.connect-hero-copy > *{animation: hero-slide 0.8s var(--e-soft) forwards; opacity:0}
.connect-hero-copy > *:nth-child(1){animation-delay:.1s}
.connect-hero-copy > *:nth-child(2){animation-delay:.24s}
.connect-hero-copy > *:nth-child(3){animation-delay:.38s}
.connect-hero-copy > *:nth-child(4){animation-delay:.52s}
.connect-hero-copy > *:nth-child(5){animation-delay:.66s}
.page-connect .hero .cta-row{justify-content:flex-start}
.hero-tag{
  display:inline-flex;
  align-self:flex-start;
  padding:.35rem .85rem;
  border-radius:999px;
  font-size:.8rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  background:rgba(var(--accent-rgb),.28);
  color:var(--text);
  font-weight:700;
}
.hero-highlight{
  background:linear-gradient(120deg, var(--brand), var(--brand-2), var(--brand-soft));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation: highlight-pulse 6s ease-in-out infinite;
}
.page-connect .hero .subtitle{margin:0 auto clamp(1rem, 4vw, 1.6rem); color:var(--muted); max-width:58ch}

@media (max-width:640px){
  .hero-tag{letter-spacing:.14em; font-size:.75rem}
  .page-connect .hero-grid{max-width:100%;}
  .connect-hero-copy{margin-inline:auto}
  .page-connect .hero .cta-row{justify-content:center}
}

.page-programs .programs-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(3.2rem, 9vw, 5.8rem) 0 clamp(2.4rem, 7vw, 4.2rem);
  background:
    linear-gradient(180deg, rgba(11,18,38,.78), rgba(11,18,38,.65) 60%, rgba(11,18,38,.55)),
    url('assets/images/dr-elaine-give-talk.jpg');
  background-size:100% 100%, cover;
  background-position:center, center;
  color:#e9efff;
}
.page-programs .programs-hero-grid{
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items:center;
  gap:clamp(1.8rem, 6vw, 3.4rem);
}
.page-programs .programs-hero-copy{display:grid; gap:1.1rem; max-width:620px}
.page-programs .programs-hero-copy .subtitle{color:#cfd8ff; margin-bottom:0}
.page-programs .programs-hero-copy p{color:#d9e3ff; font-size:1.02rem; line-height:1.75; margin:0}
.page-programs .hero .cta-row{justify-content:flex-start}
.programs-hero-figure{position:relative}
.programs-hero-figure img{border-radius:1.4rem; box-shadow:0 30px 70px rgba(4,9,20,.4)}
.programs-hero-figure::after{
  content:"";
  position:absolute;
  inset:-10% -12% -14% -12%;
  border-radius:1.8rem;
  border:1px solid rgba(229,199,203,.35);
  opacity:.6;
  pointer-events:none;
}
.page-programs .hero .btn-ghost{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.24); color:#f6f8ff}
.page-programs .hero .btn-ghost:hover{background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.3)}

@media (max-width:900px){
  .header-inner{align-items:center; position:relative}
  /* brand left, toggle pinned to top-right, nav dropdown remains anchored to right */
  .brand{order:1}
  .nav-primary{position:relative; width:auto; margin-left:auto; order:3}
  .nav-toggle{display:flex; order:2; margin-left:0; position:absolute; top:0.6rem; right:1rem; z-index:60}
  /* increase hit area slightly on mobile for easier tapping */
  .nav-toggle{min-width:44px; min-height:44px; padding:6px}
}

@keyframes connect-bg-pan{
  0%{background-position:center, 50% -4%, 50% 104%, center}
  50%{background-position:center, 48% 6%, 52% 96%, center 45%}
  100%{background-position:center, 50% -6%, 50% 110%, center 60%}
}

@keyframes connect-orbit{
  0%,100%{transform:translate3d(0,0,0) scale(1); opacity:.3}
  50%{transform:translate3d(6%, -4%, 0) scale(1.08); opacity:.45}
}

@keyframes hero-fade{
  to{opacity:1}
}

@keyframes hero-slide{
  from{transform:translateY(16px); opacity:0}
  to{transform:translateY(0); opacity:1}
}

@keyframes highlight-pulse{
  0%,100%{filter:brightness(1);}
  50%{filter:brightness(1.18);}
}

.cta-row{display:flex; gap:.75rem; flex-wrap:wrap; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; padding:.8rem 1.1rem; border-radius:.9rem; font-weight:700;
  text-decoration:none; border:1px solid transparent;
  transition: background var(--dur-1) var(--e-soft), color var(--dur-1) var(--e-soft), box-shadow var(--dur-1) var(--e-soft), transform var(--dur-1) var(--e-soft);
  will-change: transform, background, box-shadow;
}
.btn:focus{box-shadow:var(--ring)}
.btn-sm{padding:.65rem .95rem; font-size:.9rem; border-radius:.8rem}
.btn.is-pressed{transform: scale(.98) translateY(1px)}
.btn-primary{background:linear-gradient(135deg, var(--accent) 0%, var(--accent-600) 50%, var(--accent-700) 100%); color:#fff}
.btn-primary:hover{background:linear-gradient(135deg, var(--accent-600) 0%, var(--accent-700) 60%, var(--accent-700) 100%); box-shadow:0 18px 44px rgba(var(--accent-rgb),.28)}
.btn-ghost{background:#ffffff; border-color:var(--brand-deep); color:var(--brand-deep)}
.btn-ghost:hover{border-color:var(--accent); background:rgba(var(--accent-rgb),.12); color:var(--text)}
.btn-lg{padding:1rem 1.3rem; font-size:1.05rem}

/* button sheen micro-interaction */
.btn-primary{position:relative; overflow:hidden}
.btn-primary::after{content:""; position:absolute; inset:0; background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.25) 50%, transparent 100%); transform: translateX(-120%);}
.btn-primary:hover::after{transition: transform .7s var(--e-soft); transform: translateX(120%)}

/* --------
   Intro
   -------- */
.intro{padding:2.5rem 0}
.intro p{font-size:1.05rem; color:var(--text)}
.intro-split{display:grid; grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr); gap:clamp(1.5rem,5vw,3rem); align-items:center}
.intro-figure{margin:0; position:relative; border-radius:clamp(1rem, 3vw, 1.4rem); overflow:hidden; box-shadow:0 18px 38px rgba(129,138,155,.12)}
.intro-figure::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(var(--accent-rgb),.32), transparent 55%); pointer-events:none}
.intro-figure img{width:100%; height:100%; object-fit:cover; display:block}
.intro-copy{display:grid; gap:1rem}
.intro-copy p{margin:0}
@media (max-width: 900px){
  .intro-split{grid-template-columns:1fr}
  .intro-figure{order:-1}
}

/* --------
   Stats
   -------- */
.stats{padding:1.5rem 0 2rem}
.stats-grid{
  display:grid; grid-template-columns:repeat(5, 1fr); gap:1rem;
}
.stat{background:linear-gradient(145deg, rgba(255,255,255,.96), var(--surface)); border:1px solid rgba(var(--accent-rgb),.32); border-radius:1rem; padding:1rem; text-align:center;
  box-shadow:0 12px 28px rgba(122,109,99,.08);
}
.stat img{width:28px; height:28px; margin-inline:auto; opacity:.85}
.stat h3{margin:.5rem 0 .25rem; font-size:1.15rem; color:var(--brand-deep)}
.stat p{margin:0; color:var(--muted); font-size:.95rem}

/* unified hover lift for cards (tilt-aware) */
.stat,.hl-card,.topic-card,.about-card,.pub-card,.book-card,.rec-card,.gcard,.talk-card,.mention-card,.aud-card{
  --rx: 0deg; --ry: 0deg;
  transition: transform .25s var(--e-soft), box-shadow .25s var(--e-soft);
  will-change: transform, box-shadow;
}
.stat:hover,.hl-card:hover,.topic-card:hover,.about-card:hover,.pub-card:hover,.book-card:hover,.rec-card:hover,.gcard:hover,.talk-card:hover,.mention-card:hover,.aud-card:hover{
  transform: translateY(-4px) rotateX(var(--rx)) rotateY(var(--ry));
  box-shadow: 0 10px 30px rgba(60,42,28,.08);
}

/* --------
   Featured logos
   -------- */
.featured{padding:2.5rem 0}
.logo-row{
  display:grid; grid-template-columns:repeat(5, 1fr); gap:1rem; list-style:none; margin:0; padding:0;
}
.logo-row img{width:100%; height:48px; object-fit:contain; filter:none; opacity:.9}

/* --------
   Quote
   -------- */
.quote{padding:1rem 0 2rem}
.quote blockquote{
  font-family:"Playfair Display",serif;
  font-size: clamp(1.4rem, 3vw, 2rem);
  text-align:center;
  padding:1.25rem 1rem;
  background:linear-gradient(180deg, rgba(var(--accent-rgb),.18), rgba(234,219,184,.16));
  border-radius:1rem;
}

/* --------
   Gallery
   -------- */
.gallery{padding:1rem 0 3rem}
.gallery-head{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.pill{background:var(--surface); border:1px solid rgba(var(--accent-rgb),.32); padding:.35rem .6rem; border-radius:999px; font-size:.85rem; color:var(--text)}
.gallery-grid{margin-top:1rem; display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:clamp(.8rem, 2vw, 1.4rem)}
.gcard{display:block; border-radius:.75rem; overflow:hidden; border:1px solid rgba(213,186,189,.28)}
button.gcard{background:linear-gradient(145deg, rgba(255,255,255,.96), var(--surface)); padding:0; cursor:pointer; border:1px solid rgba(213,186,189,.32)}
button.gcard:focus-visible{outline:3px solid rgba(var(--accent-rgb),.45); outline-offset:4px}
.gcard img{aspect-ratio: 4 / 3; object-fit:cover; display:block; transition:transform .25s ease; width:100%}
.gcard:hover img{transform:scale(1.02)}

/* tilt utility for interactive cards/buttons; JS will set --rx/--ry */
.tiltable{transform-style:preserve-3d}
.tiltable:hover{transform: rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}

.embed-grid{display:grid; gap:clamp(1.2rem, 4vw, 2rem); grid-template-columns:repeat(auto-fit, minmax(280px, 1fr))}
.fb-embed{width:100%; min-height:620px; background:#fff; border-radius:1.1rem; box-shadow:0 18px 48px rgba(129,138,155,.12); border:1px solid rgba(var(--accent-rgb),.28)}
.fb-embed::backdrop{background:transparent}
.talks-section{padding-top:clamp(2.4rem, 6vw, 4rem); padding-bottom:clamp(2.2rem, 6vw, 4rem)}
.talks-content{display:grid; gap:clamp(1.2rem, 4vw, 2rem); grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); align-items:center}
.talks-copy{display:grid; gap:.9rem}
.talk-card{background:linear-gradient(150deg,#ffffff,var(--surface)); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1rem; padding:clamp(.9rem, 3vw, 1.15rem); box-shadow:0 16px 36px rgba(122,109,99,.08)}
.talk-card p{margin:0; color:var(--muted); line-height:1.7; font-weight:500}
.talk-media{margin:0}
.talk-media img{border-radius:1.1rem; box-shadow:0 20px 44px rgba(129,138,155,.14); object-fit:cover}
.talks-links{margin-top:clamp(1rem, 3vw, 1.5rem); gap:.6rem; flex-wrap:wrap}
.talks-links .btn{border-radius:.9rem}

/* reveal on scroll utilities (composable + tilt-aware) */
[data-reveal]{
  --reveal-x: 0px;
  --reveal-y: 12px;
  --reveal-scale: 1;
  --rx: 0deg; /* shared with tilt */
  --ry: 0deg; /* shared with tilt */
  opacity: 0;
  transform: translate(var(--reveal-x), var(--reveal-y)) scale(var(--reveal-scale)) rotateX(var(--rx)) rotateY(var(--ry));
  filter: blur(2px);
  transition:
    opacity var(--dur-2) var(--e-out),
    transform var(--dur-2) var(--e-out),
    filter var(--dur-2) var(--e-out);
  will-change: opacity, transform, filter;
}
[data-reveal].is-visible{
  opacity:1;
  transform: translate(0,0) scale(1) rotateX(var(--rx)) rotateY(var(--ry));
  filter:none;
}
[data-reveal="left"]{ --reveal-x: -14px; --reveal-y: 0 }
[data-reveal="right"]{ --reveal-x: 14px; --reveal-y: 0 }
[data-reveal="up"]{ --reveal-y: -14px }
[data-reveal="down"]{ --reveal-y: 14px }
[data-reveal="zoom"]{ --reveal-y: 0; --reveal-scale: .98 }

@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1 !important; transform:none !important; filter:none !important}
  .stat,.hl-card,.topic-card,.about-card,.pub-card,.book-card,.rec-card,.gcard,.talk-card,.mention-card,.aud-card{transition:none}
}

/* --------
   CTA banner
   -------- */
.cta-banner{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.96), transparent 70%);
  padding:2.6rem 0;
  border-top:1px solid rgba(var(--accent-rgb),.24);
  border-bottom:1px solid rgba(var(--accent-rgb),.2);
  isolation:isolate;
}
.cta-banner::before,
.cta-banner::after{
  content:"";
  position:absolute;
  inset:auto;
  pointer-events:none;
  border-radius:50%;
  mix-blend-mode:screen;
}
.cta-banner::before{
  width:420px; aspect-ratio:1;
  top:-50%; left:-12%;
  background:radial-gradient(circle at 50% 50%, rgba(var(--accent-rgb),.32), transparent 75%);
  animation:cta-orbit 26s ease-in-out infinite;
}
.cta-banner::after{
  width:320px; aspect-ratio:1;
  bottom:-45%; right:-8%;
  background:radial-gradient(circle at 50% 50%, rgba(234,219,184,.28), rgba(var(--accent-rgb),.22) 55%, transparent 80%);
  animation:cta-orbit 32s ease-in-out infinite reverse;
}
.cta-inner{position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap}
.cta-inner h2{margin:0; font-size: clamp(1.2rem, 2.5vw, 1.6rem)}

.speaking-cta .cta-inner{align-items:flex-start; gap:clamp(1rem, 4vw, 2.4rem)}
.speaking-cta-copy{flex:1 1 420px; display:grid; gap:1rem}
.speaking-cta-copy p{margin:0; color:var(--muted); line-height:1.75}
.speaking-cta-action{flex:0 0 auto; display:flex; align-items:center}
.speaking-cta-action .btn{box-shadow:0 24px 42px rgba(var(--accent-rgb),.2)}

@media (max-width:720px){
  .speaking-cta-action{width:100%; justify-content:flex-start}
  .speaking-cta-action .btn{width:100%; justify-content:center}
}

.research-cta .cta-inner{align-items:flex-start; gap:clamp(1rem, 4vw, 2.2rem)}
.research-cta-copy{flex:1 1 420px; display:grid; gap:.9rem}
.research-cta-copy p{margin:0; color:#1a2742; line-height:1.75}
.research-cta-action{flex:0 0 auto; display:flex; align-items:center}
.research-cta-action .btn{box-shadow:0 24px 42px rgba(var(--accent-rgb),.2)}

@media (max-width:720px){
  .research-cta-action{width:100%; justify-content:flex-start}
  .research-cta-action .btn{width:100%; justify-content:center}
}

.program-section{padding-top:clamp(2.4rem, 6vw, 4rem)}
.program-section .section-head{display:grid; gap:.6rem; margin-bottom:clamp(1.2rem, 4vw, 2rem)}
.program-section .section-lead{margin:0; font-size:1.02rem; color:#1a2742; max-width:60ch}
.program-layout{display:grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap:clamp(1.4rem, 5vw, 2.4rem); align-items:center}
.program-layout--flip{grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items:center}
.media-tight{margin:0}
.program-card{display:grid; gap:1.2rem}
.program-card > p{color:var(--muted); line-height:1.7}
.program-block{display:grid; gap:.55rem; padding:clamp(.6rem, 2vw, .9rem) clamp(.6rem, 3vw, 1rem); border-radius:.9rem; background:var(--surface); border:1px solid rgba(var(--accent-rgb),.28)}
.program-block{transition: transform .25s var(--e-soft), box-shadow .25s var(--e-soft), border-color .25s var(--e-soft)}
.program-block:hover{transform: translateY(-3px); box-shadow:0 12px 26px rgba(60,42,28,.08); border-color: rgba(var(--accent-rgb),.4)}
.program-block:nth-of-type(even){background:rgba(248,237,240,.94)}
.meta-title{font-size:.85rem; letter-spacing:.24em; text-transform:uppercase; font-weight:700; color:#4c5b75}
.meta-list{list-style:none; margin:0; padding:0; display:grid; gap:.5rem}
.meta-list li{position:relative; padding-left:1.6rem; line-height:1.65; color:var(--muted); font-weight:500}
.meta-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.45rem;
  width:.6rem;
  height:.6rem;
  border-radius:50%;
  background:linear-gradient(135deg, var(--brand), var(--brand-2));
  box-shadow:0 6px 14px rgba(var(--accent-rgb),.25);
}
.meta-list strong{color:var(--text)}
.meta-list li .meta-sub{display:block; margin:.25rem 0 0 0; color:var(--text)}
.meta-list li .meta-sub + .meta-sub{margin-top:.3rem; padding-top:.3rem; border-top:1px dashed rgba(var(--accent-rgb),.25)}
.program-cta{display:flex; flex-wrap:wrap; gap:.6rem; padding-top:.4rem}
.program-gallery{display:grid; gap:1rem; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr))}
.program-gallery .media-wide{margin:0}
.program-gallery .media-wide img{height:100%; object-fit:cover}
.programs-cta .cta-inner{align-items:flex-start; gap:clamp(1rem, 4vw, 2.2rem)}
.programs-cta-copy{flex:1 1 420px; display:grid; gap:.9rem}
.programs-cta-copy p{margin:0; color:var(--muted); line-height:1.75}
.programs-cta-action{flex:0 0 auto; display:flex; align-items:center}
.programs-cta-action .btn{box-shadow:0 24px 42px rgba(var(--accent-rgb),.2)}

@media (max-width:900px){
  .program-layout,
  .program-layout--flip{grid-template-columns:1fr}
}

@media (max-width:720px){
  .programs-cta-action,
  .program-cta{width:100%;}
  .programs-cta-action .btn,
  .program-cta .btn{width:100%; justify-content:center}
  .program-section .section-lead{text-align:left}
  .program-block{padding:.85rem}
}

@media (max-width:860px){
  .talks-content{grid-template-columns:1fr}
  .talks-copy{order:2}
  .talk-media{order:1}
}

.why-programs{padding-bottom:clamp(2.4rem, 6vw, 4rem)}
.why-programs-inner{
  background:linear-gradient(160deg, rgba(255,255,255,.96), rgba(250,239,242,.92));
  border:1px solid rgba(var(--accent-rgb),.28);
  border-radius:1.2rem;
  box-shadow:0 20px 44px rgba(129,138,155,.1);
  padding:clamp(1.9rem, 5vw, 2.8rem);
  text-align:center;
  max-width:720px;
  margin-inline:auto;
  display:grid;
  gap:1rem;
}

/* --------
   Footer
   -------- */
.site-footer{
  margin-top:clamp(3rem, 6vw, 5.5rem);
  background:radial-gradient(140% 120% at 18% -10%, rgba(var(--accent-rgb),.28), transparent 68%),
    radial-gradient(140% 150% at 82% -12%, rgba(234,219,184,.32), transparent 72%),
    linear-gradient(180deg, #2f2a33, #1f1a24 72%);
  color:#f4f1f8;
  position:relative;
  overflow:hidden;
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(33,28,41,.45), transparent 40%, rgba(33,28,41,.85));
  pointer-events:none;
}
.site-footer > *{position:relative; z-index:1}
.site-footer a{color:#fce4d0}
.site-footer a:hover{color:#fff0e0}
.footer-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  padding:clamp(2rem, 6vw, 3.5rem) 0 clamp(1.5rem, 4vw, 2.5rem);
  border-bottom:1px solid rgba(177,150,160,.24);
}
.footer-eyebrow{
  letter-spacing:.24em;
  text-transform:uppercase;
  font-size:.75rem;
  margin:0 0 .35rem;
  color:#f4d7b8;
}
.footer-title{
  margin:0;
  font-family:"Playfair Display",serif;
  font-size:clamp(1.4rem, 3vw, 2.2rem);
  color:#fff;
  max-width:26rem;
}
.footer-cta-links{display:flex; gap:.75rem; flex-wrap:wrap; align-items:center; justify-content:flex-end}
.site-footer .btn{box-shadow:none}
.site-footer .btn-primary{box-shadow:0 18px 32px rgba(var(--accent-rgb),.25)}
.site-footer .btn-primary:hover{filter:brightness(1.05)}
.site-footer .btn-ghost{background:rgba(34,30,40,.55); border-color:rgba(177,150,160,.28); color:#f1edff}
.site-footer .btn-ghost:hover{background:rgba(var(--accent-rgb),.28); border-color:rgba(216,187,191,.5)}

.footer-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(1.5rem, 5vw, 3rem);
  padding:clamp(2rem, 5vw, 3.5rem) 0 clamp(1.5rem, 4vw, 2.5rem);
}
.footer-col{display:flex; flex-direction:column; gap:.75rem; color:#f8e6d8}
.footer-logo{font-family:"Playfair Display",serif; font-size:1.4rem; font-weight:700; color:#fff3e0}
.footer-about p{margin:0; line-height:1.7}
.footer-heading{margin:0; font-size:1rem; font-weight:700; color:#fff}
.footer-links{list-style:none; margin:0; padding:0; display:grid; gap:.4rem}
.footer-links a{color:#dee7f6; font-size:.95rem}
.footer-contact{list-style:none; margin:.5rem 0 0; padding:0; display:grid; gap:.4rem; font-size:.95rem}
.footer-icon{font-size:1rem; width:1.4rem; display:inline-flex; justify-content:center}
.footer-contact a{color:#eef0ff}

.footer-disclaimer{padding:.8rem 0; border-top:1px solid rgba(163,138,149,.15)}.footer-disclaimer p{margin:0; font-size:.75rem; color:rgba(220,215,234,.55); line-height:1.5}
.footer-bottom{border-top:1px solid rgba(163,138,149,.25); padding:1.2rem 0 1.6rem}
.footer-bottom-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#dcd7ea; font-size:.9rem}
.footer-bottom p{margin:0}
.footer-credit{max-width:24rem}

@media (max-width: 900px){
  .footer-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width: 640px){
  .footer-cta{flex-direction:column; align-items:flex-start; text-align:left}
  .footer-cta-links{justify-content:flex-start}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom-inner{flex-direction:column; align-items:flex-start}
}

/* --------
   Responsive
   -------- */
@media (max-width: 960px){
  .header-inner{align-items:center}
  .nav-primary{position:relative; width:auto; margin-left:auto; order:3}
  .nav-toggle{display:flex; order:2; margin-left:auto}
  .brand{order:1}
  .nav-list{
    position:absolute;
    top:calc(100% + .75rem);
    right:0;
    left:auto;
    width:min(320px, calc(100vw - 2rem));
    background:rgba(255,255,255,.96);
    border:1px solid rgba(var(--accent-rgb),.32);
    box-shadow:0 24px 44px rgba(129,138,155,.14);
    padding:1.1rem;
    border-radius:1rem;
    display:none;
    flex-direction:column;
    gap:.35rem;
    z-index:20;
  }
.nav-list.show,
body.nav-open .nav-list{display:flex}
body.nav-open{overflow:hidden}
  .nav-list li{width:100%}
  .nav-list a{width:100%; justify-content:flex-start; border-radius:.75rem}
  .nav-list a::after{left:16px; right:16px; bottom:.4rem}
  .nav-cta{margin:0; margin-top:.6rem; width:100%}
  .nav-cta .btn{width:100%; justify-content:center}
  .hero-grid{grid-template-columns:1fr; padding-bottom:1rem}
  .stats-grid{grid-template-columns:repeat(3, 1fr)}
  .logo-row{grid-template-columns:repeat(3, 1fr)}
}
@media (max-width: 720px){
  .brand{gap:.6rem}
  .brand-logo{height:40px}
  .brand-sub{display:none}
}
@media (max-width: 560px){
  .nav-primary{width:auto}
  .nav-list{ width:calc(100vw - 2rem);}
  .stats-grid{grid-template-columns:repeat(2, 1fr)}
  .logo-row{grid-template-columns:repeat(2, 1fr)}
}

/* --------
   Booking modal
   -------- */
.modal-backdrop{position:fixed; inset:0; background:rgba(32,37,50,.52); display:flex; align-items:center; justify-content:center; z-index:10000; padding:clamp(1rem, 4vw, 2rem)}
.modal{background:#fff; width:min(720px,100%); border-radius:1.4rem; box-shadow:0 32px 72px rgba(129,138,155,.24); padding:clamp(1.6rem, 4vw, 2.6rem); max-height:90vh; overflow:auto; display:grid; gap:clamp(1.4rem, 3vw, 2rem)}
.modal-header{display:flex; align-items:flex-start; justify-content:space-between; gap:clamp(.8rem, 2vw, 1.2rem)}
.modal-heading{display:grid; gap:.55rem}
.modal-kicker{margin:0; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--brand)}
.modal h3{margin:0; font-size:clamp(1.28rem, 3vw, 1.56rem); color:var(--text)}
.modal-subhead{margin:0; color:var(--muted); line-height:1.6; max-width:42ch}
.modal-close-icon{background:rgba(255,255,255,.92); border:0; width:2.4rem; height:2.4rem; border-radius:999px; color:var(--text); display:flex; align-items:center; justify-content:center; font-size:1.2rem; cursor:pointer; box-shadow:0 12px 30px rgba(129,138,155,.16); transition:transform .2s ease, background .2s ease}
.modal-close-icon:hover{background:rgba(var(--accent-rgb),.22); transform:scale(1.05)}
.modal .modal-body{margin:0}
.form-grid{display:grid; gap:clamp(1rem, 3vw, 1.4rem); grid-template-columns:repeat(auto-fit, minmax(210px, 1fr))}
.field{display:grid; gap:.45rem}
.field.full{grid-column:1 / -1}
.modal label{font-size:.82rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted)}
.modal input,
.modal textarea,
.modal select{width:100%; padding:.65rem .8rem; border-radius:.7rem; border:1px solid rgba(var(--accent-rgb),.28); background:#ffffff; box-shadow:inset 0 1px 0 rgba(var(--accent-rgb),.12); font-size:1rem; transition:border-color .2s ease, box-shadow .2s ease}
.modal input:focus,
.modal textarea:focus,
.modal select:focus{outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.28)}
.modal textarea{min-height:140px; resize:vertical}
.modal-note{margin-top:.4rem; background:linear-gradient(135deg, rgba(var(--accent-rgb),.12), rgba(234,219,184,.16)); border:1px solid rgba(var(--accent-rgb),.28); border-radius:.9rem; padding:1rem 1.1rem; font-size:.9rem; color:var(--text); line-height:1.6}
.modal-note strong{color:var(--brand)}
.modal-actions{display:flex; gap:.6rem; justify-content:flex-end; margin-top:.5rem}

@media (max-width:560px){
  .form-grid{grid-template-columns:1fr}
}

/* Enquiry form */
.enquiry-form{padding:0; margin-top:1rem}
.enquiry-form label{font-size:.9rem; color:var(--muted); margin-bottom:.25rem}
.enquiry-form input,.enquiry-form textarea{width:100%; padding:.6rem .75rem; border-radius:.6rem; border:1px solid rgba(var(--accent-rgb),.28); background:#ffffff}
.enquiry-form textarea{min-height:140px}
.enquiry-form .form-row{display:grid; grid-template-columns:1fr 1fr; gap:.75rem}
.enquiry-form .form-row .full{grid-column:1/-1}
.enquiry-form .modal-actions{display:flex; gap:.5rem; justify-content:flex-end; margin-top:1rem}

@media (max-width:560px){
  .enquiry-form .form-row{grid-template-columns:1fr}
}

/* -----------------------------
   CONNECT-COPY — refreshed styles
   ----------------------------- */
#connect-copy { padding: 2.5rem 0; }
#connect-copy .narrow{
  background: linear-gradient(180deg, rgba(255,255,255,0.97), var(--surface));
  border: 1px solid rgba(var(--accent-rgb),.28);
  box-shadow: 0 16px 40px rgba(129,138,155,0.08);
  padding: 1.6rem;
  border-radius: 14px;
}

#connect-copy .section-title{font-size:1.1rem; margin:0 0 .4rem}
#connect-copy .subtitle{margin-bottom:1rem}

#connect-copy .intro{font-size:1.03rem; color:var(--text)}

/* list styles */
#connect-copy ul{margin:0 0 1rem 1rem; padding:0; color:var(--text); line-height:1.7}
#connect-copy ul li{margin:.5rem 0; padding-left:.5rem; position:relative}
#connect-copy ul li:before{content:''; width:8px; height:8px; background:var(--sage); border-radius:999px; position:absolute; left:-1.1rem; top:.6rem}

/* layout: two-column on wide screens */
@media (min-width: 880px){
  #connect-copy .narrow{display:grid;  gap:1.25rem; align-items:start}
}

/* right column card for quick contact */
.contact-card{background:linear-gradient(165deg,#ffffff,var(--surface)); border-radius:10px; padding:1rem; border:1px solid rgba(var(--accent-rgb),.3)}
.contact-card h4{margin:.25rem 0 .5rem; color:var(--text)}
.contact-card p{margin:0; color:var(--muted)}
.contact-card .cta-row{margin-top:.75rem; display:flex; gap:.5rem; flex-wrap:wrap}

/* emphasis for CTAs */
#connect-copy .btn-primary{padding:.7rem 1rem; font-weight:700; box-shadow:0 10px 30px rgba(var(--accent-rgb),.18)}
#connect-copy .btn-ghost{background:#ffffff; border:1px solid rgba(var(--accent-rgb),.28)}

/* small visual separators */
#connect-copy h3.section-title{display:flex; align-items:center; gap:.6rem; background:linear-gradient(90deg, rgba(var(--accent-rgb),.16), transparent); padding:.45rem; border-radius:.6rem}

@media (max-width:560px){
  #connect-copy .narrow{padding:.9rem}
}

/* Redesigned connect layout */
.connect-layout{display:grid; gap:1rem}
@media(min-width:880px){
  .connect-layout{align-items:start}
}

.connect-left{padding-right:0}

.aud-grid{
  display:grid;
  gap:1rem 1.25rem;
  grid-template-columns: 1fr; /* mobile: single column */
  align-items:start;
}

@media(min-width:720px){
  /* two equal blocks per row, matching other section widths */
  .aud-grid{ grid-template-columns: repeat(2, 1fr); }
}

.aud-card{
  background:linear-gradient(150deg,#ffffff,var(--surface));
  border:1px solid rgba(var(--accent-rgb),.3);
  padding:1rem;
  border-radius:10px;
  display:flex;
  gap:.75rem;
  align-items:flex-start;
  box-shadow:0 12px 26px rgba(129,138,155,.1);
  transform: translateY(10px);
  opacity: 0;
  --delay: 0s;
  animation: fadeInUp .48s cubic-bezier(.2,.9,.2,1) var(--delay) forwards;
}
.aud-icon{width:44px; height:44px; flex:0 0 44px}
.aud-card h3{margin:.1rem 0 .35rem; font-size:1.05rem}
.aud-card p{margin:0; color:var(--muted); font-size:.96rem}

.contact-card{background:linear-gradient(165deg,#ffffff,var(--surface)); border-radius:12px; padding:1rem; border:1px solid rgba(var(--accent-rgb),.3)}
.contact-card .card-inner{display:flex; flex-direction:column; gap:.5rem}
.contact-card hr{border:0; border-top:1px solid rgba(213,186,189,.35); margin: .6rem 0}
.contact-card .socials{color:var(--muted); font-size:.95rem}

.muted{color:var(--muted)}

/* Enhanced visuals for audience cards and contact card */
.aud-card{transition:none; box-shadow:none; border:1px solid transparent; background:transparent; padding:0}
.aud-card h3{font-size:1.08rem; margin:0 0 .35rem}
.aud-card p{color:var(--muted); margin:0}
.aud-icon{background:none; padding:0; width:36px; height:36px}

/* simpler, flat contact card */
.contact-card{position:static; border:0; padding:0}
.contact-card .card-inner{background:transparent; padding:0}
.contact-card hr{display:none}

/* animations */
@keyframes fadeInUp{
  from{opacity:0; transform:translateY(10px)}
  to{opacity:1; transform:translateY(0)}
}

/* stagger delays for up to 8 cards */
.aud-grid > .aud-card:nth-child(1){ --delay: 0.04s }
.aud-grid > .aud-card:nth-child(2){ --delay: 0.10s }
.aud-grid > .aud-card:nth-child(3){ --delay: 0.16s }
.aud-grid > .aud-card:nth-child(4){ --delay: 0.22s }
.aud-grid > .aud-card:nth-child(5){ --delay: 0.28s }
.aud-grid > .aud-card:nth-child(6){ --delay: 0.34s }
.aud-grid > .aud-card:nth-child(7){ --delay: 0.40s }
.aud-grid > .aud-card:nth-child(8){ --delay: 0.46s }

@media (prefers-reduced-motion: reduce){
  .aud-card{ animation: none; transform:none; opacity:1 }
}

/* minimal CTA */
.contact-card .btn-primary{box-shadow:none; padding:.6rem .9rem}
.contact-card .btn-ghost{background:transparent; border:1px solid #eef4ff}

/* increase readability */
#connect-copy .section-title{font-size:1.15rem; font-weight:700}
#connect-copy .intro{font-size:1.06rem; line-height:1.8; margin-bottom:1.2rem}
#connect-copy .aud-grid{gap:1.25rem}
#connect-copy .narrow{padding:1rem}




/* -----------------------------
   SPEAKING PAGE — highlights & topics
   ----------------------------- */
.speaking-hero{
  background:
    radial-gradient(60% 80% at 10% 10%, rgba(234,219,184,.28), transparent 65%),
    radial-gradient(60% 80% at 90% 0%, rgba(var(--accent-rgb),.22), transparent 65%),
    linear-gradient(180deg, rgba(var(--accent-rgb),.14), transparent 42%);
}

.hl-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem; align-items:stretch}
.hl-card{background:linear-gradient(180deg,#ffffff,var(--surface)); border:1px solid rgba(var(--accent-rgb),.28); border-radius:1rem; overflow:hidden; box-shadow:0 12px 28px rgba(122,109,99,.1); animation: fadeInUp .5s cubic-bezier(.2,.9,.2,1) .02s both}
.hl-fig{overflow:hidden}
.hl-fig img{aspect-ratio: 16 / 9; object-fit:cover; width:100%; transition:transform .4s ease}
.hl-card:hover .hl-fig img{transform:scale(1.02)}
.hl-body{padding:1rem}
.hl-body h3{margin:.25rem 0 .5rem; font-size:1.08rem; position:relative}
.hl-body h3::after{content:''; position:absolute; left:0; bottom:-.35rem; width:56px; height:3px; border-radius:3px; background:linear-gradient(90deg, var(--brand), var(--brand-2))}
.hl-body .pill{display:inline-block; margin-top:.75rem}

.topics-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem}
.topic-card{background:linear-gradient(180deg,#ffffff,var(--surface)); border:1px solid rgba(var(--accent-rgb),.28); border-radius:1rem; padding:1rem; box-shadow:0 10px 26px rgba(122,109,99,.08); animation: fadeInUp .5s ease .06s both; position:relative}
.topic-card::before{content:""; position:absolute; inset:0 0 0 auto; width:4px; background:linear-gradient(180deg, var(--brand), var(--gold)); border-top-right-radius:1rem; border-bottom-right-radius:1rem}
.topic-card h3{margin:.25rem 0 .5rem; font-size:1.1rem}
.topic-card ul{margin:.25rem 0 0; padding:0; list-style:none}
.topic-card li{margin:.5rem 0 .5rem 1rem; position:relative}
.topic-card li::before{content:''; position:absolute; left:-1rem; top:.5rem; width:8px; height:8px; border-radius:999px; background:var(--brand)}

.sdg-row{display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1rem}
.sdg-row .pill{border:1px solid rgba(var(--accent-rgb),.35)}

/* SDG themed chips */
.sdg{color:#fff; border:0}
.sdg-3{background:#4C9F38}
.sdg-4{background:#C5192D}
.sdg-5{background:#FF3A21}
.sdg-8{background:#A21942}
.sdg-17{background:#19486A}

@media (max-width: 960px){
  .hl-grid{grid-template-columns:repeat(2, 1fr)}
  .topics-grid{grid-template-columns:repeat(2, 1fr)}
}
@media (max-width: 560px){
  .hl-grid{grid-template-columns:1fr}
  .topics-grid{grid-template-columns:1fr}
}

/* -----------------------------
   ABOUT PAGE — layout & media
   ----------------------------- */
.media-wide{margin:1rem 0}
.media-wide img{width:100%; border-radius:1rem; box-shadow:0 8px 30px rgba(0,0,0,.06)}
.media-wide-box{
  width:100%;
  aspect-ratio: 16 / 7;
  border-radius:1rem;
  background:
    radial-gradient(60% 80% at 20% 20%, rgba(var(--accent-rgb),.18), transparent 62%),
    linear-gradient(135deg, rgba(234,219,184,.2), rgba(var(--accent-rgb),.18));
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  box-shadow:0 12px 32px rgba(129,138,155,.12);
}
.mv{font-family:"Playfair Display",serif; font-size: clamp(1.4rem, 4vw, 2rem); margin-bottom:.5rem}
.mv-tags{display:flex; gap:.5rem; flex-wrap:wrap}
.cap{color:#64748b; font-size:.95rem; text-align:center; margin:.5rem 0 0}

/* Tighten caption spacing for SDG banner on Speaking page */
section[aria-label="Global Keynote Speaker"] .banner-overlay .cap{margin-top:.2rem}
.media-stack{display:grid; gap:1.2rem}

.about-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:1rem}
.about-card{
  position:relative;
  background:linear-gradient(160deg, rgba(255,255,255,.96), var(--surface));
  border:1px solid rgba(var(--accent-rgb),.3);
  border-radius:1.1rem;
  padding:clamp(1.1rem, 3vw, 1.6rem);
  box-shadow:0 18px 38px rgba(129,138,155,.1);
  animation: fadeInUp .5s ease .02s both;
}
.about-card h3{margin:.25rem 0 .4rem; font-size:1.12rem}
.about-card ul{margin:.75rem 0 0; padding:0}
.about-card li{margin:.4rem 0}

.endorsement-card{display:grid; gap:1.4rem}
.endorsement-header{display:grid; gap:.6rem}
.endorsement-header .badge{
  align-self:start;
  padding:.35rem .75rem;
  border-radius:999px;
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  background:rgba(var(--sage-rgb),.2);
  color:var(--brand-deep);
  font-weight:700;
  border:1px solid rgba(var(--sage-rgb),.25);
}
.endorsement-role{margin:0; color:var(--muted); font-weight:600; line-height:1.5}
.endorsement-body{display:grid; gap:1.1rem; color:var(--text)}
.endorsement-lead{
  margin:0;
  font-size:1.02rem;
  line-height:1.7;
  background:rgba(var(--accent-rgb),.12);
  border:1px solid rgba(var(--accent-rgb),.22);
  padding:1rem 1.1rem;
  border-radius:.9rem;
}
.endorsement-highlight{
  background:rgba(255,255,255,.78);
  border:1px solid rgba(var(--accent-rgb),.28);
  border-radius:.9rem;
  padding:1rem 1.1rem;
  display:grid;
  gap:.75rem;
}
.endorsement-highlight .tag{
  font-size:.78rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:#4c5b75;
}
.endorsement-list{list-style:none; margin:0; padding:0; display:grid; gap:.6rem}
.endorsement-list li{
  position:relative;
  padding-left:1.6rem;
  color:#1f2a44;
  line-height:1.65;
}
.endorsement-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.35rem;
  width:.9rem;
  height:.9rem;
  border-radius:50%;
  background:linear-gradient(135deg, var(--brand), var(--brand-2));
  box-shadow:0 6px 14px rgba(var(--accent-rgb),.25);
}

/* -----------------------------
   Image lightbox
   ----------------------------- */
.is-lightbox-enabled{cursor:zoom-in; transition:transform .3s var(--e-soft), box-shadow .3s var(--e-soft)}
.is-lightbox-enabled:hover{transform:translateY(-2px); box-shadow:0 18px 36px rgba(129,138,155,.12)}

#img-lightbox{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:11000;
  padding:clamp(1.2rem, 4vw, 2.5rem);
}
#img-lightbox.is-visible{display:flex}
#img-lightbox .lightbox-backdrop{
  position:absolute;
  inset:0;
  background:rgba(9,14,30,.72);
  opacity:0;
  transition:opacity .2s ease;
}
#img-lightbox.is-active .lightbox-backdrop{opacity:1}
#img-lightbox .lightbox-figure{
  position:relative;
  max-width:min(960px, 96vw);
  max-height:92vh;
  display:grid;
  gap:.6rem;
  z-index:1;
  transform:translateY(12px);
  opacity:0;
  transition:transform .25s var(--e-soft), opacity .25s var(--e-soft);
}
#img-lightbox.is-active .lightbox-figure{transform:translateY(0); opacity:1}
#img-lightbox .lightbox-media{position:relative; display:flex; align-items:center; justify-content:center}
#img-lightbox img{
  width:100%;
  max-height:80vh;
  object-fit:contain;
  border-radius:1rem;
  box-shadow:0 30px 70px rgba(4,9,20,.45);
  background:#000;
}
#img-lightbox figcaption{margin:0; text-align:center; color:#ffeede; font-size:.95rem}
.lightbox-close{
  position:absolute;
  top:-2.6rem;
  right:0;
  width:2.4rem;
  height:2.4rem;
  border-radius:999px;
  border:0;
  background:rgba(60,42,28,.78);
  color:#fff;
  font-size:1.2rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .2s ease;
}
.lightbox-close:hover{background:rgba(var(--accent-rgb),.9)}
.lightbox-nav{position:absolute; top:50%; transform:translateY(-50%); width:3rem; height:3rem; border-radius:999px; border:none; background:rgba(32,37,50,.72); color:#f8fafc; font-size:1.6rem; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s ease, transform .2s ease; box-shadow:0 16px 40px rgba(26,29,40,.32)}
.lightbox-nav:hover{background:rgba(var(--accent-rgb),.82); transform:translateY(-50%) scale(1.05)}
.lightbox-prev{left:1rem}
.lightbox-next{right:1rem}
.lightbox-nav span{display:block; transform:translateY(-2px)}
.lightbox-nav[hidden]{display:none}

@media (max-width:600px){
  #img-lightbox .lightbox-figure{max-width:100%;}
  .lightbox-close{top:-2.2rem}
  .lightbox-nav{width:2.6rem; height:2.6rem; font-size:1.3rem; box-shadow:0 12px 30px rgba(4,9,20,.3)}
  .lightbox-prev{left:.4rem}
  .lightbox-next{right:.4rem}
}

.rec-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem}
.rec-card{background:#fff; border:1px solid #eef4ff; border-radius:1rem; padding:1rem; box-shadow:0 1px 0 rgba(10,30,90,.04)}
.rec-card h3{margin:.25rem 0 .35rem; font-size:1.02rem}
.rec-card p{margin:0}

@media (max-width: 960px){
  .about-grid{grid-template-columns:1fr}
  .rec-grid{grid-template-columns:repeat(2, 1fr)}
}
@media (max-width: 560px){
  .rec-grid{grid-template-columns:1fr}
}

/* Video embed */
.video-embed{position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:1rem; overflow:hidden; box-shadow:0 8px 30px rgba(0,0,0,.06)}
.video-embed iframe,
.video-embed video{position:absolute; inset:0; width:100%; height:100%; border:0; object-fit:cover}

/* -----------------------------
   RESEARCH PAGE — grids & cards
   ----------------------------- */
.badge-row{display:flex; gap:.5rem; flex-wrap:wrap}
.pub-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:1rem}
.pub-card{background:linear-gradient(150deg, rgba(255,255,255,.97), var(--surface)); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1rem; padding:1rem; box-shadow:0 12px 26px rgba(116,104,94,.08)}
.pub-card .pub-figure{margin:0 0 .75rem; border-radius:.9rem; overflow:hidden; box-shadow:0 16px 34px rgba(116,104,94,.1)}
.pub-card .pub-figure img{width:100%; display:block; object-fit:cover; aspect-ratio:4/3}
.pub-card h3{margin:.25rem 0 .35rem; font-size:1.02rem}
.pub-card p{margin:0}

/* Publication card: remove link underlines and add hover animation */
.pub-card .pub-link{display:block; color:inherit; text-decoration:none}
.pub-card .pub-link h3,
.pub-card .pub-link p{ text-decoration:none }
.pub-card{transition:transform .45s cubic-bezier(.22,.68,.27,1), box-shadow .45s ease, border-color .45s ease; will-change:transform}
.pub-card:hover,
.pub-card:focus-within{transform:translateY(-6px) scale(1.01); box-shadow:0 28px 64px rgba(116,104,94,.12); border-color:rgba(var(--accent-rgb),.45)}
.pub-card .pub-figure{position:relative}
.pub-card .pub-figure img{transition:transform .55s cubic-bezier(.22,.68,.27,1)}
.pub-card:hover .pub-figure img,
.pub-card:focus-within .pub-figure img{transform:scale(1.06)}
.pub-card h3{transition:color .3s ease, transform .28s ease}
.pub-card:hover h3,
.pub-card:focus-within h3{color:var(--brand); transform:translateY(-2px)}
.pub-card .pub-figure::after{content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:linear-gradient(90deg, rgba(var(--accent-rgb),.6), rgba(234,219,184,.45)); transform:scaleX(0); transform-origin:left; transition:transform .36s ease}
.pub-card:hover .pub-figure::after,
.pub-card:focus-within .pub-figure::after{transform:scaleX(1)}

/* Download link styling inside publication cards */
.pub-downloads{display:inline-flex; gap:.6rem; margin-top:.6rem; align-items:center}
.pub-downloads .doc-link{display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .75rem; background:linear-gradient(90deg, rgba(var(--accent-rgb),.06), rgba(var(--accent-rgb),.03)); color:var(--brand); border-radius:.6rem; box-shadow:0 8px 20px rgba(var(--accent-rgb),.06); border:1px solid rgba(var(--accent-rgb),.12); text-decoration:none; font-weight:700; font-size:.92rem; transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease}
.pub-downloads .doc-link:hover,
.pub-downloads .doc-link:focus{transform:translateY(-2px); box-shadow:0 14px 30px rgba(var(--accent-rgb),.10); opacity:1}
.pub-downloads .doc-link:focus{outline:3px solid rgba(var(--accent-rgb),.10); outline-offset:4px}

@media (max-width: 720px){
  .pub-downloads{flex-direction:column; align-items:flex-start}
  .pub-downloads .doc-link{width:100%; justify-content:center}
}

.book-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:1rem}
.book-card{background:linear-gradient(150deg, rgba(255,255,255,.97), var(--surface)); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1rem; padding:1rem; box-shadow:0 12px 26px rgba(116,104,94,.08)}
.book-card .book-figure{margin:0 0 .75rem; border-radius:.9rem; overflow:hidden; box-shadow:0 16px 34px rgba(116,104,94,.1)}
.book-card .book-figure img{width:100%; display:block; object-fit:cover; aspect-ratio:4/3}
.book-card h3{margin:.25rem 0 .35rem}
.book-card p{margin:0 0 .5rem}

@media (max-width: 960px){
  .pub-grid{grid-template-columns:1fr}
  .book-grid{grid-template-columns:1fr}
}

/* -----------------------------
   HOME — marquee logos
   ----------------------------- */
.logo-marquee{position:relative; overflow:hidden; border-radius:1.35rem; border:1px solid rgba(var(--accent-rgb),.28); background:linear-gradient(135deg, rgba(255,255,255,.97), var(--surface)); box-shadow:0 24px 58px rgba(129,138,155,.14)}
.logo-marquee-track{display:flex; width:fit-content; gap:0}
.logo-strip{list-style:none; display:flex; align-items:center; gap:clamp(2.6rem, 5vw, 4.4rem); margin:0; padding:clamp(1.1rem, 3vw, 1.7rem) clamp(2.6rem, 6vw, 3.8rem); flex-shrink:0}
.logo-strip li{display:flex; align-items:center; justify-content:center; padding:.45rem 1.1rem; border-radius:1rem; background:rgba(255,255,255,.9); box-shadow:0 12px 34px rgba(129,138,155,.12); backdrop-filter:blur(6px)}
.logo-marquee-track{animation:logoMarqueeSlide 32s linear infinite; will-change:transform}
.logo-strip img{height:clamp(42px, 5vw, 58px); width:auto; object-fit:contain; filter:none; opacity:1; transition:transform .55s cubic-bezier(.22,.68,.27,1), box-shadow .55s ease, filter .55s ease, outline-color .3s ease}
.logo-marquee:hover .logo-marquee-track,
.logo-marquee:focus-within .logo-marquee-track{animation-play-state:paused}
.logo-strip img:hover,
.logo-strip img:focus-visible{transform:translateY(-4px) scale(1.05) rotateX(6deg); box-shadow:0 18px 38px rgba(var(--accent-rgb),.24); filter:saturate(1.05)}
.logo-strip img:focus-visible{outline:3px solid rgba(var(--accent-rgb),.45); outline-offset:4px}
@keyframes logoMarqueeSlide{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

/* subtle gradient overlay for banner figures */
.media-wide.banner-overlay{position:relative; overflow:hidden; border-radius:1rem}
.media-wide.banner-overlay img{transition:transform .4s ease}
.media-wide.banner-overlay::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(47,42,54,.14), rgba(var(--accent-rgb),.1) 65%, rgba(255,255,255,0) 100%);
}
.media-wide.banner-overlay:hover img{transform:scale(1.01)}

@media (prefers-reduced-motion: reduce){
  .logo-strip{animation:none}
  .media-wide.banner-overlay img{transition:none; transform:none}
}

/* ---------------------------------
   MEDIA PAGE — mobile refinements
   --------------------------------- */
@media (max-width: 720px){
  .page-media .hero{padding:clamp(1.6rem, 6vw, 2.2rem) 0}
  .page-media .hero .cta-row{flex-direction:column; gap:.6rem}
  .page-media .hero .cta-row .btn{width:100%; justify-content:center}

  .page-media .embed-grid{grid-template-columns:1fr; gap:.9rem}
  .page-media .fb-embed{min-height:520px; height:auto}

  .page-media .talks-section{padding-top:1.6rem; padding-bottom:1.6rem}
  .page-media .talks-content{grid-template-columns:1fr}
  .page-media .talk-media img{width:100%; height:auto}

  .page-media .mentions{padding-top:1.6rem; padding-bottom:1.6rem}
  .page-media .mentions-inner{padding:1rem}
  .page-media .mention-groups{grid-template-columns:1fr}

  .page-media .gallery-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}

@media (max-width: 420px){
  .page-media .fb-embed{min-height:460px}
  .page-media .gallery-grid{grid-template-columns:1fr}
}

/* -----------------------------
   Connect engagement section
   ----------------------------- */
.engage{padding:clamp(2.2rem, 6vw, 3.6rem) 0}
.engage-inner{
  background:linear-gradient(180deg,#fff,#f7f9ff);
  border:1px solid #eaf0ff;
  border-radius:1.1rem;
  box-shadow:0 18px 40px rgba(60,42,28,.08);
  padding:clamp(1.8rem, 5vw, 2.6rem);
  display:grid;
  gap:clamp(1.4rem, 4vw, 2.4rem);
  grid-template-columns:minmax(0, 1fr);
}
.engage-header{display:flex; flex-direction:column; gap:1rem}
.engage-header .section-title{margin:0}
.engage-header .cta-row{gap:.75rem; flex-wrap:wrap}
.engage-follow .section-title{margin:0 0 .75rem}
.social-list{list-style:none; margin:0; padding:0; display:grid; gap:.6rem}
.social-list li{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem;
  background:#fff;
  border:1px solid #eef4ff;
  padding:.75rem .9rem;
  border-radius:.85rem;
  box-shadow:0 10px 26px rgba(60,42,28,.08);
}
.social-list li strong{color:var(--text); min-width:96px}

@media (min-width: 768px){
  .engage-inner{grid-template-columns:minmax(0, 1.05fr) minmax(0, 0.95fr); align-items:start}
}
@media (max-width: 520px){
  .engage-header .cta-row{flex-direction:column}
  .engage-header .cta-row .btn{width:100%; justify-content:center}
}

/* -----------------------------
   Page-specific animation accents
   ----------------------------- */
.page-index .hero{position:relative; overflow:hidden}
.page-index .hero::before,
.page-index .hero::after{
  content:""; position:absolute; width:38vw; max-width:520px; aspect-ratio:1;
  border-radius:50%; pointer-events:none; opacity:.32; mix-blend-mode:screen;
  background:radial-gradient(circle at 50% 50%, rgba(var(--accent-rgb),.4), rgba(234,219,184,.18) 48%, transparent 70%);
  animation:index-orbit 22s ease-in-out infinite;
}
.page-index .hero::before{top:-14vw; left:-12vw; animation-delay:-4s}
.page-index .hero::after{bottom:-18vw; right:-10vw; animation-delay:-12s; background:radial-gradient(circle at 50% 50%, rgba(234,219,184,.32), rgba(var(--accent-rgb),.24) 45%, transparent 70%)}
@keyframes index-orbit{
  0%,100%{transform:translate3d(0,0,0) scale(1); opacity:.32}
  25%{transform:translate3d(10%, -8%, 0) scale(1.08); opacity:.4}
  50%{transform:translate3d(4%, 12%, 0) scale(.94); opacity:.28}
  75%{transform:translate3d(-12%, 6%, 0) scale(1.05); opacity:.36}
}

.page-home .hero .grad{background-size:220% 220%; animation:home-gradient 8s ease-in-out infinite}
@keyframes home-gradient{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
.page-home .banner-overlay img{transform-origin:center; animation:home-pan 26s ease-in-out infinite}
@keyframes home-pan{
  0%,100%{transform:scale(1) translate3d(0,0,0)}
  38%{transform:scale(1.07) translate3d(-1.5%, -1.2%, 0)}
  70%{transform:scale(1.05) translate3d(1.2%, 1%, 0)}
}

.page-about .hero-figure{position:relative}
.page-about .hero-figure::after{
  content:""; position:absolute; inset:-6% -6% -10%; border-radius:1.4rem; pointer-events:none;
  border:2px solid rgba(242,106,79,.28); box-shadow:0 16px 44px rgba(242,106,79,.22);
  animation:about-pulse 4.8s ease-in-out infinite;
}
@keyframes about-pulse{
  0%,100%{opacity:.38; transform:scale(1)}
  50%{opacity:.16; transform:scale(1.05)}
}

.page-programs .about-card{position:relative; overflow:hidden}
.page-programs .about-card::before{
  content:""; position:absolute; inset:-140% -30%; pointer-events:none;
  background:conic-gradient(from 180deg, rgba(var(--accent-rgb),0) 0deg, rgba(var(--accent-rgb),.16) 120deg, rgba(234,219,184,.24) 220deg, rgba(218,189,194,.18) 320deg, transparent 360deg);
  opacity:.55;
  animation:programs-sweep 18s linear infinite;
  filter:blur(0.5px);
}
@keyframes programs-sweep{to{transform:rotate(360deg)}}
.page-programs .about-card > *{position:relative}

.page-connect .aud-card{position:relative; overflow:hidden}
.page-connect .aud-card::after{
  content:""; position:absolute; inset:-3px; border-radius:1.1rem; pointer-events:none;
  border:2px solid rgba(var(--accent-rgb),.28); box-shadow:0 0 0 rgba(var(--accent-rgb),0);
  animation:connect-glow 6s ease-in-out infinite;
}
.page-connect .aud-card:nth-child(odd)::after{animation-delay:1.2s}
@keyframes connect-glow{
  0%,100%{opacity:.22; transform:scale(.98)}
  50%{opacity:.48; transform:scale(1); box-shadow:0 18px 36px rgba(var(--accent-rgb),.24)}
}

.page-speaking .speaking-hero{position:relative; overflow:hidden}
.page-speaking .speaking-hero::before,
.page-speaking .speaking-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  background:radial-gradient(ellipse at top left, rgba(255,255,255,.28), transparent 65%);
  animation:speaking-lights 16s ease-in-out infinite;
}
.page-speaking .speaking-hero::after{
  background:radial-gradient(ellipse at top right, rgba(var(--accent-rgb),.26), transparent 65%);
  animation-delay:-8s;
}
@keyframes speaking-lights{
  0%,100%{opacity:.26; transform:translate3d(-4%, -2%, 0) scale(1.05)}
  50%{opacity:.52; transform:translate3d(6%, 4%, 0) scale(1.12)}
}

.page-media .hero{position:relative; overflow:hidden}
.page-media .hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 45%, rgba(255,255,255,0) 70%);
  opacity:0; transform:translateX(-130%);
  animation:media-flash 12s ease-in-out infinite;
}
@keyframes media-flash{
  0%,86%,100%{opacity:0; transform:translateX(-130%)}
  90%{opacity:.45; transform:translateX(0)}
  94%{opacity:0; transform:translateX(130%)}
}
.page-media .gallery-grid .gcard{animation:media-glow 9s ease-in-out infinite}
.page-media .gallery-grid .gcard:nth-child(odd){animation-delay:-4.5s}
@keyframes media-glow{
  0%,100%{box-shadow:0 8px 22px rgba(129,138,155,.08)}
  50%{box-shadow:0 20px 40px rgba(var(--accent-rgb),.2)}
}

.page-research .badge-row .pill{position:relative; overflow:hidden; background:linear-gradient(135deg, rgba(var(--accent-rgb),.18), rgba(234,219,184,.24)); box-shadow:0 8px 20px rgba(var(--accent-rgb),.15)}
.page-research .badge-row .pill::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.7) 45%, transparent 70%);
  transform:translateX(-120%);
  animation:research-shine 7s ease-in-out infinite;
}
.page-research .badge-row .pill:nth-child(2)::after{animation-delay:.8s}
.page-research .badge-row .pill:nth-child(3)::after{animation-delay:1.6s}
.page-research .badge-row .pill:nth-child(4)::after{animation-delay:2.4s}

.page-research .pub-card,
.page-research .book-card{position:relative; animation:research-elevate 10s ease-in-out infinite}
.page-research .pub-card:nth-of-type(2){animation-delay:1.3s}
.page-research .book-card:nth-of-type(2){animation-delay:1.3s}
@keyframes research-shine{
  0%,35%{transform:translateX(-120%)}
  50%{transform:translateX(120%)}
  65%,100%{transform:translateX(120%)}
}
@keyframes research-elevate{
  0%,100%{transform:translateY(0); box-shadow:0 10px 30px rgba(var(--accent-rgb),.12)}
  50%{transform:translateY(-6px); box-shadow:0 24px 48px rgba(var(--accent-rgb),.18)}
}

/* Research page: enforce consistent hero figure sizing for rp_1 / rp_2 on larger viewports */
@media (min-width: 960px){
  .page-research .hero-figure{max-width:720px; height:620px; overflow:hidden; border-radius:1.2rem}
  .page-research .hero-figure img{width:100%; height:100%; object-fit:cover; display:block}
}

@media (prefers-reduced-motion: reduce){
  .page-index .hero::before,
  .page-index .hero::after,
  .page-home .hero .grad,
  .page-home .banner-overlay img,
  .page-about .hero-figure::after,
  .page-programs .about-card::before,
  .page-connect .aud-card::after,
  .page-speaking .speaking-hero::before,
  .page-speaking .speaking-hero::after,
  .page-media .hero::after,
  .page-media .gallery-grid .gcard,
  .page-research .badge-row .pill::after,
  .page-research .pub-card,
  .page-research .book-card{animation:none !important; transform:none}
  .page-research .badge-row .pill{box-shadow:none}
}

/* Force single-column talks layout on Media page at mobile widths */
@media (max-width: 860px){
  .page-media .talks-section .talks-content{grid-template-columns:1fr !important}
  .page-media .talks-section .talks-copy{order:2}
  .page-media .talks-section .talk-media{order:1}
}
.mentions{padding-top:clamp(2.6rem, 6vw, 4.4rem); padding-bottom:clamp(2.2rem, 6vw, 4rem)}
.mentions-inner{background:linear-gradient(160deg, rgba(255,255,255,.92), var(--surface)); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1.2rem; box-shadow:0 20px 44px rgba(129,138,155,.12); padding:clamp(1.8rem, 5vw, 2.6rem); display:grid; gap:clamp(1.2rem, 4vw, 2rem)}
.mentions-lead{margin:0; color:var(--text); font-size:1.02rem; line-height:1.7}
.mention-groups{display:grid; gap:clamp(1rem, 3vw, 1.8rem); grid-template-columns:repeat(auto-fit, minmax(220px, 1fr))}
.mention-card{background:linear-gradient(160deg, rgba(255,255,255,.96), var(--surface)); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1rem; padding:1.1rem; box-shadow:0 16px 36px rgba(129,138,155,.1); text-align:center; display:grid; gap:.4rem}
.mention-card h3{margin:0; font-size:1rem; color:var(--text)}
.mention-card p{margin:0; color:var(--muted); font-weight:600; letter-spacing:.03em}
.talks-section .talks-content{grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr)}
.talks-section .talks-copy{display:grid; gap:1.1rem}
.media-links{flex-wrap:wrap}
.recognitions{padding-top:clamp(2.6rem, 6vw, 4.2rem)}
.recognition-list{display:grid; gap:clamp(1.6rem, 4vw, 2.8rem)}
.recognition-card{--card-delay:0s; background:linear-gradient(155deg, rgba(255,255,255,.98), var(--surface) 55%, rgba(246,234,236,.9) 100%); border:1px solid rgba(var(--accent-rgb),.28); border-radius:1.4rem; box-shadow:0 26px 60px rgba(129,138,155,.12); padding:clamp(1.2rem, 3vw, 1.8rem); display:grid; gap:clamp(1.2rem, 3vw, 1.6rem); align-items:center; opacity:0; transform:translateY(36px) scale(.98); animation:recognitionRise .9s var(--card-delay) cubic-bezier(.16,.84,.44,1) forwards; transition:transform .55s ease, box-shadow .55s ease, border-color .55s ease; will-change:transform}
.recognition-card:nth-of-type(1){--card-delay:0s}
.recognition-card:nth-of-type(2){--card-delay:.08s}
.recognition-card:nth-of-type(3){--card-delay:.16s}
.recognition-card:nth-of-type(4){--card-delay:.24s}
.recognition-card:nth-of-type(5){--card-delay:.32s}
.recognition-card:nth-of-type(6){--card-delay:.4s}
.recognition-card:nth-of-type(7){--card-delay:.48s}
.recognition-card:hover{box-shadow:0 32px 72px rgba(129,138,155,.16); transform:translateY(-6px) scale(1.01); border-color:rgba(var(--accent-rgb),.6)}
.recognition-card:focus-within{box-shadow:0 32px 72px rgba(var(--accent-rgb),.22); border-color:rgba(var(--accent-rgb),.55)}
.recognition-figure{margin:0; position:relative; isolation:isolate; display:grid; place-items:center}
.recognition-figure::after{content:""; position:absolute; inset:12% -6%; background:linear-gradient(210deg, rgba(var(--accent-rgb),.28), rgba(234,219,184,.22)); filter:blur(32px); z-index:-1; opacity:.75; transition:transform .6s ease, opacity .6s ease}
.recognition-figure-link{display:block; position:relative; border-radius:1.05rem; overflow:hidden; box-shadow:0 18px 48px rgba(129,138,155,.14); transition:transform .6s cubic-bezier(.22,.68,.27,1), box-shadow .6s ease}
.recognition-figure-link::after{content:"Tap to expand"; position:absolute; inset:auto 0 0 0; padding:.45rem .75rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:#fefaf4; background:linear-gradient(120deg, rgba(var(--accent-rgb),.9), rgba(234,219,184,.8)); transform:translateY(100%); transition:transform .45s ease, opacity .45s ease; opacity:0}
.recognition-figure-link:hover::after,
.recognition-figure-link:focus-visible::after{transform:translateY(0); opacity:1}
.recognition-figure-link:focus-visible{outline:3px solid rgba(var(--accent-rgb),.55); outline-offset:6px}
.recognition-figure img{width:100%;  object-fit:contain; transition:transform .6s cubic-bezier(.22,.68,.27,1)}
.recognition-card:hover .recognition-figure-link,
.recognition-card:focus-within .recognition-figure-link{box-shadow:0 24px 60px rgba(var(--accent-rgb),.24); transform:translateY(-4px)}
.recognition-card:hover .recognition-figure img,
.recognition-card:focus-within .recognition-figure img{transform:scale(1.05)}
.recognition-card:hover .recognition-figure::after,
.recognition-card:focus-within .recognition-figure::after{opacity:1; transform:scale(1.08)}
.recognition-content{display:grid; gap:.95rem}
.recognition-content h3{margin:0; font-size:clamp(1.24rem, 2.6vw, 1.44rem); line-height:1.3; color:var(--text); font-family:"Playfair Display", serif; letter-spacing:.01em; position:relative; opacity:0; transform:translateY(16px); animation:recognitionTextFade .8s calc(var(--card-delay) + .12s) cubic-bezier(.18,.88,.36,1) forwards}
@supports (-webkit-background-clip:text){
  .recognition-content h3{background:linear-gradient(120deg, rgba(63,54,48,1) 0%, var(--brand) 55%, var(--gold) 100%); -webkit-background-clip:text; background-clip:text; color:transparent}
}
.recognition-content h3::after{content:""; position:absolute; left:0; bottom:-.45rem; width:62px; height:3px; border-radius:999px; background:linear-gradient(90deg, rgba(var(--accent-rgb),.6), rgba(234,219,184,.45)); transform-origin:left; transform:scaleX(.4); opacity:0; animation:recognitionAccent .6s calc(var(--card-delay) + .28s) ease-out forwards}
.recognition-content p{margin:0}
.recognition-content p:first-of-type{color:var(--muted); line-height:1.75; font-size:1rem; font-weight:500; letter-spacing:.01em; position:relative; padding:0 0 0 1.15rem; border-left:3px solid rgba(var(--accent-rgb),.35); background:linear-gradient(120deg, rgba(var(--accent-rgb),.12), rgba(234,219,184,.14)); border-radius:.35rem 0 0 .35rem; box-shadow:inset 3px 0 0 rgba(var(--accent-rgb),.18); opacity:0; transform:translateY(18px); animation:recognitionTextFade .9s calc(var(--card-delay) + .24s) cubic-bezier(.18,.88,.36,1) forwards}
.recognition-content p:first-of-type::before{content:""; position:absolute; top:.55rem; left:-.62rem; width:.6rem; height:.6rem; border-radius:50%; background:linear-gradient(135deg, var(--brand), var(--gold))}
.recognition-caption{color:var(--muted); font-size:.92rem; line-height:1.6; font-style:italic; position:relative; padding-left:1.35rem; opacity:0; transform:translateY(20px); animation:recognitionTextFade .9s calc(var(--card-delay) + .34s) cubic-bezier(.18,.88,.36,1) forwards}
.recognition-caption::after{content:""; position:absolute; left:0; bottom:-.35rem; width:46px; height:2px; border-radius:999px; background:linear-gradient(90deg, rgba(var(--accent-rgb),.38), rgba(234,219,184,.25))}
@media (min-width:720px){
  .recognition-card{grid-template-columns:minmax(0, 360px) minmax(0, 1fr); align-items:center}
  .recognition-figure img{height:100%; border-radius:1.2rem}
}
@media (min-width:1024px){
  .recognition-list{gap:clamp(1.8rem, 3vw, 3.2rem)}
  .recognition-card{padding:clamp(1.6rem, 2.2vw, 2.2rem)}
}
@keyframes recognitionRise{
  0%{opacity:0; transform:translateY(36px) scale(.98)}
  100%{opacity:1; transform:translateY(0) scale(1)}
}
@keyframes recognitionTextFade{
  0%{opacity:0; transform:translateY(18px)}
  60%{opacity:1}
  100%{opacity:1; transform:translateY(0)}
}
@keyframes recognitionAccent{
  0%{opacity:0; transform:scaleX(.4)}
  60%{opacity:1}
  100%{opacity:1; transform:scaleX(1)}
}
@media (prefers-reduced-motion:reduce){
  .recognition-card{animation-duration:0.01ms; animation-iteration-count:1; opacity:1; transform:none}
  .recognition-card:hover{transform:none}
  .recognition-content h3,
  .recognition-content p,
  .recognition-caption{animation:none; opacity:1; transform:none}
  .recognition-content h3::after{animation:none; opacity:1; transform:scaleX(1)}
}
.academic-section{padding-top:clamp(2.8rem, 6vw, 4.6rem)}
.academic-stack{display:grid; gap:clamp(1.6rem, 4vw, 2.6rem)}
.academic-duo{display:grid; gap:clamp(1.4rem, 3vw, 2rem)}
.academic-card{position:relative; padding:clamp(1.4rem, 3.3vw, 2rem); border-radius:1.4rem; background:linear-gradient(150deg, rgba(255,255,255,.97), var(--surface)); border:1px solid rgba(var(--accent-rgb),.32); box-shadow:0 18px 44px rgba(129,138,155,.14); display:grid; gap:clamp(1rem, 2.6vw, 1.5rem); overflow:hidden}
.academic-card-head{display:flex; flex-direction:column; gap:.55rem}
.academic-card h3{margin:0; font-size:clamp(1.2rem, 2.7vw, 1.46rem); color:var(--text)}
.academic-chip{display:inline-flex; align-items:center; width:max-content; gap:.4rem; padding:.35rem .85rem; border-radius:999px; background:rgba(var(--accent-rgb),.2); color:var(--brand); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; position:relative}
.academic-chip::before{content:""; width:.45rem; height:.45rem; border-radius:50%; background:linear-gradient(135deg, var(--brand), var(--gold))}
.academic-card p{margin:0; color:var(--muted); line-height:1.7; font-size:1.02rem}
.academic-list{margin:0; padding:0; list-style:none; display:grid; gap:.85rem}
.academic-list li{position:relative; padding-left:1.55rem; color:var(--muted); line-height:1.65; font-size:1.02rem}
.academic-list li::before{content:""; position:absolute; left:0; top:.45rem; width:.75rem; height:.75rem; border-radius:50%; background:linear-gradient(140deg, var(--brand), var(--gold)); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.25)}
.academic-figure{position:relative; overflow:hidden; border-radius:1.6rem; padding:0; display:grid; gap:.75rem; background:linear-gradient(180deg, rgba(var(--accent-rgb),.35), rgba(46,44,64,.78)); min-height:100%}
.academic-figure img{width:100%; height:100%; object-fit:cover; border-radius:inherit; mix-blend-mode:screen; opacity:.9}
.academic-figure .cap{margin:0; padding:1rem 1.2rem 1.2rem; color:#f1f5ff; font-weight:500; letter-spacing:.01em}
.academic-figure-glow{display:none}
.academic-card,
.academic-figure{transition:transform .55s cubic-bezier(.22,.68,.27,1), box-shadow .55s ease}
.academic-card:hover,
.academic-card:focus-within{transform:translateY(-6px); box-shadow:0 32px 66px rgba(60,42,28,.16)}
.academic-figure:hover,
.academic-figure:focus-within{transform:translateY(-4px); box-shadow:0 36px 72px rgba(60,42,28,.24)}
@media (min-width:960px){
  .academic-duo{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .academic-figure img{object-position:center top}
}
@media (max-width:599px){
  .academic-figure{border-radius:1.4rem}
}