/* ============ ANVAYA — THE DIALOGUE — SHARED STYLES v2 ============ */

/* ---------------------------------------------------------------
   COLOR ACCENT SYSTEM
   --rust  : primary brand accent — eyebrows, links, CTA buttons,
             hover states, callout "term" labels. Use for anything
             that should read as the site's default emphasis color.
   --teal  : secondary accent — in-paragraph text links, and the
             1st item whenever a list/grid cycles through accent
             colors (mission points, numbered steps, review criteria,
             area cards, speaker rings, etc).
   --olive : 2nd item in any accent-cycling list/grid.
   --gold  : 3rd/4th item in any accent-cycling list/grid, and
             document/publication-related frames (flyer, journal
             cover accent stripes).
   Cycling order is always: teal -> olive -> rust -> gold -> repeat.
   Keep new list/grid items (e.g. a 3rd conference speaker, another
   mission point) in this exact sequence so the whole site reads as
   one consistent system rather than arbitrary color choices.
--------------------------------------------------------------- */
:root{
  --cream:#faf5ec;
  --cream-deep:#f0e7d6;
  --ink:#241b15;
  --ink-soft:#5f5245;
  --teal:#204542;
  --olive:#69784a;
  --rust:#a8522e;
  --gold:#c48a3d;
  --line:rgba(36,27,21,0.13);
  --line-strong:rgba(36,27,21,0.22);
  --max:1120px;
  --shadow-sm:0 2px 10px rgba(36,27,21,0.06);
  --shadow-md:0 18px 40px rgba(36,27,21,0.10);
  --shadow-lg:0 30px 70px rgba(36,27,21,0.16);
  --radius:6px;
}

*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth; overflow-x:hidden; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{
  margin:0;
  overflow-x:hidden;
  background:var(--cream);
  color:var(--ink);
  font-family:'Work Sans', -apple-system, 'Segoe UI', sans-serif;
  font-weight:400;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}

h1,h2,h3{
  font-family:'Fraunces', Georgia, 'Times New Roman', serif;
  font-weight:500;
  color:var(--ink);
  margin:0;
  letter-spacing:-0.015em;
}
em{font-style:italic;}
p{margin:0;}

.eyebrow{
  font-family:'IBM Plex Mono', 'Courier New', monospace;
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--rust);
  display:inline-flex;
  align-items:center;
  font-weight:500;
}

.wrap{max-width:var(--max); margin:0 auto; padding:0 40px;}
a{color:inherit;}
img{max-width:100%;}

/* ---------- NAV ---------- */
header{
  position:sticky; top:0; z-index:60;
  background:rgba(250,245,236,0.94);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
nav.wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:80px;
  gap:12px;
}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; min-width:0;}
.brand img{
  height:40px; width:40px; object-fit:contain; display:block;
  border-radius:50%;
  box-shadow:0 0 0 1px var(--line);
}
.brand-word{font-family:'Fraunces', serif; font-size:1.28rem; color:var(--ink); font-weight:500; letter-spacing:-0.01em;}
.nav-links{display:flex; align-items:center; gap:34px; font-size:0.92rem;}
.nav-links a{text-decoration:none; color:var(--ink-soft); transition:color .2s; position:relative; padding-bottom:4px; font-weight:500;}
.nav-links a:hover{color:var(--rust);}
.nav-links a.active{color:var(--ink);}
.nav-links a.active::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-4px;
  height:2px; background:var(--rust); border-radius:2px;
}
.nav-right{display:flex; align-items:center; gap:22px;}

.btn{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78rem;
  letter-spacing:0.03em;
  text-decoration:none;
  padding:13px 24px;
  border-radius:3px;
  border:1px solid var(--ink);
  color:var(--ink);
  background:transparent;
  transition:background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}
.btn::after{content:"→"; transition:transform .25s ease; font-size:0.9em;}
.btn:hover{background:var(--ink); color:var(--cream); transform:translateY(-1px); box-shadow:var(--shadow-sm);}
.btn:hover::after{transform:translateX(3px);}
.btn:active{transform:translateY(0) scale(0.97);}
.btn-solid{background:var(--rust); border-color:var(--rust); color:var(--cream); box-shadow:var(--shadow-sm);}
.btn-solid:hover{background:#8f4726; border-color:#8f4726; color:var(--cream); box-shadow:var(--shadow-md);}
.btn-ghost{border-color:var(--line-strong); color:var(--ink-soft);}
.btn-ghost:hover{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn-ghost::after, .btn-ghost:hover{box-shadow:none;}

.nav-toggle{
  display:none;
  flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:11px;
  min-width:44px; min-height:44px;
  align-items:center; justify-content:center;
  border-radius:50%;
  transition:background .2s ease;
}
.nav-toggle:active{background:var(--cream-deep);}
.nav-toggle span{width:22px; height:1.5px; background:var(--ink); display:block; transition:transform .25s, opacity .25s;}
.nav-toggle.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

.mobile-menu{
  position:fixed; inset:80px 0 0 0;
  background:var(--cream);
  z-index:55;
  display:none;
  flex-direction:column;
  padding:44px 40px;
  gap:28px;
  border-top:1px solid var(--line);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.mobile-menu.open{display:flex;}
.mobile-menu a{
  font-family:'Fraunces', serif;
  font-size:1.7rem;
  text-decoration:none;
  color:var(--ink);
}
.mobile-menu a.active{color:var(--rust);}

/* ---------- PAGE HERO (inner pages) ---------- */
.page-hero{
  padding:88px 0 72px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse 900px 500px at 88% -12%, rgba(196,138,61,0.13), transparent 60%);
}
.page-hero .wrap{position:relative; z-index:1;}
.page-hero h1{
  font-size:clamp(2.3rem, 4.4vw, 3.5rem);
  margin-top:18px;
  max-width:19ch;
  line-height:1.08;
}
.page-hero p.lede{
  margin-top:22px; font-size:1.1rem; color:var(--ink-soft); max-width:58ch;
}
.page-hero .hero-ctas{display:flex; gap:16px; margin-top:32px; flex-wrap:wrap;}

/* ---------- PAGE HERO WITH FIGURE (e.g. Publications) ---------- */
.page-hero.has-figure .wrap{
  display:grid; grid-template-columns:1.2fr 0.8fr; gap:56px; align-items:center;
}

/* ---------- JOURNAL COVER (Publications hero) ---------- */
.journal-cover{
  display:flex; flex-direction:column; align-items:center;
  max-width:260px;
  margin:0 auto;
}
.journal-cover-frame{
  position:relative;
  width:100%;
  background:linear-gradient(160deg, var(--cream-deep) 0%, #f3d7b3 100%);
  border:1px solid var(--line);
  border-radius:calc(var(--radius) + 6px);
  padding:12px;
  box-shadow:0 26px 60px rgba(180,120,55,0.20), 0 0 0 1px var(--line);
}
.journal-cover-frame::before{
  content:"";
  position:absolute; top:0; left:12px; right:12px; height:4px;
  background:linear-gradient(90deg, var(--rust), var(--gold), var(--teal));
  border-radius:0 0 3px 3px;
}
.journal-cover-frame img{
  display:block;
  width:100%;
  height:auto;
  border-radius:calc(var(--radius) - 1px);
  box-shadow:0 0 0 1px var(--line);
}
.journal-cover-caption{
  margin-top:16px;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--ink-soft);
  text-align:center;
}

/* ---------- CALL FOR PAPERS FLYER ---------- */
.cfp-flyer{
  margin:44px auto 0;
  max-width:380px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.cfp-flyer-frame{
  position:relative;
  width:100%;
  background:var(--cream);
  border:1px solid var(--line);
  border-radius:calc(var(--radius) + 6px);
  padding:14px;
  box-shadow:var(--shadow-lg);
  transition:transform .35s ease, box-shadow .35s ease;
}
.cfp-flyer-frame::before{
  content:"";
  position:absolute; top:0; left:14px; right:14px; height:4px;
  background:linear-gradient(90deg, var(--teal), var(--gold), var(--rust));
  border-radius:0 0 3px 3px;
}
.cfp-flyer-frame:hover{transform:translateY(-4px); box-shadow:0 34px 76px rgba(36,27,21,0.20);}
.cfp-flyer-frame img{
  display:block;
  width:100%;
  height:auto;
  border-radius:calc(var(--radius) - 1px);
  box-shadow:0 0 0 1px var(--line);
}
.cfp-flyer-caption{
  margin-top:18px;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

/* ---------- HOME HERO ---------- */
.home-hero{
  position:relative; padding:88px 0 100px; overflow:hidden;
  background:
    radial-gradient(ellipse 1000px 560px at 92% -14%, rgba(196,138,61,0.16), transparent 62%),
    radial-gradient(ellipse 700px 500px at -6% 108%, rgba(32,69,66,0.08), transparent 60%);
}
.home-hero .wrap{display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:center;}
.home-hero h1{font-size:clamp(2.7rem, 5vw, 4.3rem); line-height:1.06;}
.home-hero h1 em{color:var(--rust);}
.home-hero p.lede{margin-top:24px; font-size:1.14rem; color:var(--ink-soft); max-width:44ch;}
.hero-ctas{display:flex; gap:16px; margin-top:36px; flex-wrap:wrap;}

.hero-figure{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;}
.hero-figure-frame{
  position:relative;
  width:100%; max-width:320px; aspect-ratio:1/1;
  border-radius:50%;
  background:var(--cream);
  box-shadow:var(--shadow-lg), 0 0 0 1px var(--line);
  display:flex; align-items:center; justify-content:center;
  padding:26px;
  overflow:hidden;
}
.hero-figure-frame::before{
  content:"";
  position:absolute; inset:-14px;
  border-radius:50%;
  border:1px solid var(--line-strong);
}
.hero-figure-frame img{width:100%; height:100%; object-fit:contain;}
.hero-caption{
  margin-top:22px;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.74rem;
  letter-spacing:0.06em;
  color:var(--ink-soft);
  text-align:center;
}

/* ---------- SECTION GENERIC ---------- */
section{padding:84px 0;}
section.roomy{padding:110px 0;}
section.alt{background:var(--cream-deep);}
section.tight{padding:76px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:clamp(1.95rem, 3.2vw, 2.6rem); margin-top:16px; line-height:1.15;}
.section-head p{color:var(--ink-soft); margin-top:18px; font-size:1.04rem;}
/* Used when a section-head has no h2 (heading removed) — the default
   margin-bottom/paragraph spacing was tuned for eyebrow+heading+text and
   looks oversized with just an eyebrow (or eyebrow+text) above it. */
.section-head.compact{margin-bottom:30px;}
.section-head.compact p{margin-top:10px;}
.subhead-mini{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:18px; display:block; font-weight:500;
}

/* ---------- WORD ORIGIN CARD ---------- */
.word-origin{
  background:var(--cream);
  border:1px solid var(--line);
  padding:36px 38px;
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  position:relative;
}
.word-origin::before{
  content:"";
  position:absolute; top:0; left:0; width:3px; height:100%;
  background:var(--gold); border-radius:var(--radius) 0 0 var(--radius);
}
.word-origin .term{font-family:'Fraunces', serif; font-style:italic; font-size:1.5rem; color:var(--teal);}
.word-origin p{margin-top:16px;}
.word-origin p + p{margin-top:12px;}

/* ---------- CLOSED / STATUS NOTICE (e.g. submissions closed) ---------- */
.closed-notice{
  background:var(--cream-deep);
  border:1px solid var(--line);
  border-top:4px solid var(--rust);
  border-radius:var(--radius);
  padding:40px 36px;
  max-width:720px;
}
.closed-badge{
  display:inline-block;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--cream);
  background:var(--rust);
  padding:7px 16px;
  border-radius:999px;
}
.closed-notice h2{margin-top:20px; font-size:1.6rem; line-height:1.2;}
.closed-notice p{margin-top:16px; color:var(--ink-soft);}
.closed-notice p strong{color:var(--ink);}
.closed-notice .btn{margin-top:24px;}
@media (max-width:560px){
  .closed-notice{padding:30px 24px;}
}

.fact-list{list-style:none; margin:20px 0 0; padding:0; display:grid; gap:0;}
.fact-list li{
  display:flex; flex-direction:column; gap:5px;
  padding:13px 0;
  border-bottom:1px solid var(--line);
  font-size:0.94rem;
}
.fact-list li:last-child{border-bottom:none; padding-bottom:0;}
.fact-list li span:first-child{
  font-family:'IBM Plex Mono', monospace; font-size:0.7rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--ink-soft);
}
.fact-list li span:last-child{color:var(--ink); font-weight:500;}

/* ---------- TWO COL GRID ---------- */
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start;}
.two-col p{color:var(--ink-soft); font-size:1.03rem; margin:0;}
.two-col p + p{margin-top:16px;}

/* ---------- CORE AREAS ---------- */
.areas{display:grid; grid-template-columns:repeat(5, 1fr); gap:22px;}
.area-card{
  background:var(--cream);
  border:1px solid var(--line);
  border-top:3px solid var(--area-color, var(--gold));
  border-radius:var(--radius);
  padding:32px 24px 28px;
  text-align:left;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  display:flex; flex-direction:column;
}
.area-card:hover{border-color:var(--line-strong); border-top-color:var(--area-color, var(--gold)); box-shadow:var(--shadow-md); transform:translateY(-4px);}
.area-index{
  font-family:'IBM Plex Mono', monospace; font-size:0.75rem; color:var(--area-color, var(--gold));
  margin-bottom:20px; font-weight:500;
}
.area-card h3{font-size:1.08rem; font-weight:500; margin-bottom:10px;}
.area-card p{font-size:0.93rem; color:var(--ink-soft); margin:0;}
@media (max-width: 980px){.areas{grid-template-columns:repeat(2, 1fr);}}
@media (max-width: 560px){.areas{grid-template-columns:1fr;}}

/* ---------- THEMES / PILLS ---------- */
.themes{display:flex; flex-wrap:wrap; gap:11px; margin-top:8px;}
.theme-pill{
  border:1px solid var(--line); padding:10px 18px; font-size:0.85rem; border-radius:999px;
  color:var(--ink-soft); background:var(--cream); transition:border-color .2s, color .2s, box-shadow .2s;
}
.theme-pill:hover{border-color:var(--rust); color:var(--ink); box-shadow:var(--shadow-sm);}

/* ---------- TIMELINE / STEPS ---------- */
.timeline{position:relative; padding-left:30px; margin-top:8px;}
.timeline::before{content:""; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:var(--line-strong);}
.t-item{position:relative; padding-bottom:32px;}
.t-item:last-child{padding-bottom:0;}
.t-item::before{content:""; position:absolute; left:-30px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--cream); border:2px solid var(--rust);}
.t-item .t-date{font-family:'IBM Plex Mono', monospace; font-size:0.82rem; color:var(--rust); display:block; font-weight:500;}
.t-item .t-label{font-size:1rem; color:var(--ink); margin-top:5px;}
.t-item .t-sub{font-size:0.88rem; color:var(--ink-soft); margin-top:4px;}

/* ---------- FEES ---------- */
.fee-tabs{display:flex; gap:0; margin-bottom:0; border-bottom:1px solid var(--line);}
.fee-tab{font-family:'IBM Plex Mono', monospace; font-size:0.8rem; letter-spacing:0.03em; padding:15px 0; margin-right:40px; cursor:pointer; color:var(--ink-soft); border-bottom:2px solid transparent; background:none; border-top:none; border-left:none; border-right:none; transition:color .2s;}
.fee-tab.active{color:var(--ink); border-bottom-color:var(--rust);}
.fee-tab:hover{color:var(--ink);}
.fee-table{width:100%; border-collapse:collapse; margin-top:0; display:none; background:var(--cream); box-shadow:var(--shadow-sm); border-radius:var(--radius); overflow:hidden;}
.fee-table.active{display:table;}
.fee-table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch;}
.fee-table th{text-align:left; font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); font-weight:500; padding:18px 22px; border-bottom:1px solid var(--line); background:var(--cream-deep);}
.fee-table td{padding:18px 22px; border-bottom:1px solid var(--line); font-size:0.98rem;}
.fee-table tr:last-child td{border-bottom:none;}
.fee-table td:last-child, .fee-table th:last-child{text-align:right; font-family:'IBM Plex Mono', monospace; color:var(--teal); font-weight:500;}

.modes-row{display:flex; gap:14px; margin-top:26px; flex-wrap:wrap;}
.mode-chip{font-size:0.85rem; color:var(--ink-soft); border:1px solid var(--line); padding:9px 18px; border-radius:6px; background:var(--cream);}

/* ---------- CTA BANNER ---------- */
.cta-banner{
  margin-top:70px;
  background:linear-gradient(135deg, var(--cream-deep), var(--cream));
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:48px 48px;
  display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap;
  box-shadow:var(--shadow-sm);
}
.cta-banner h3{font-size:1.45rem; max-width:34ch;}
.cta-banner p{margin:10px 0 0; color:var(--ink-soft); font-size:0.96rem;}

/* ---------- GRID CARDS (publication, faqs, features) ---------- */
.grid-cards{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;}
.grid-cards.cols-3{grid-template-columns:repeat(3,1fr);}
.card-cell{background:var(--cream); padding:36px 28px; transition:background .25s;}
.card-cell:hover{background:var(--cream-deep);}
.card-cell .num{font-family:'IBM Plex Mono', monospace; font-size:0.75rem; color:var(--rust); font-weight:500;}
.card-cell h3{font-size:1.02rem; font-weight:500; margin-top:16px;}
.card-cell p{font-size:0.9rem; color:var(--ink-soft); margin-top:10px;}
.how-it-works-grid .card-cell p{text-align:justify; text-justify:inter-word;}
@media (max-width:820px){.grid-cards, .grid-cards.cols-3{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.grid-cards, .grid-cards.cols-3{grid-template-columns:1fr;}}

/* ---------- MISSION LIST ---------- */
.mission-list{list-style:none; margin:0; padding:0; display:grid; gap:20px;}
.mission-list li{display:flex; gap:18px; align-items:flex-start; font-size:1.02rem; color:var(--ink-soft); padding-bottom:20px; border-bottom:1px solid var(--line);}
.mission-list li:last-child{border-bottom:none; padding-bottom:0;}
.mission-list .m-icon{width:8px; height:8px; border-radius:50%; margin-top:9px; flex-shrink:0;}

/* ---------- CONFERENCE SPEAKERS ---------- */
.speaker-row{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:52px;
  align-items:start;
  padding:44px 0;
  border-bottom:1px solid var(--line);
}
.speaker-row:first-of-type{padding-top:8px;}
.speaker-row:last-child{border-bottom:none; padding-bottom:0;}
.speaker-row.reverse{grid-template-columns:1fr 220px;}
.speaker-row.reverse .speaker-photo{order:2;}
.speaker-row.reverse .speaker-bio{order:1;}

.speaker-photo{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  border-radius:50%;
  overflow:hidden;
  box-shadow:var(--shadow-lg), 0 0 0 6px var(--cream), 0 0 0 8px var(--ring, var(--gold));
}
.speaker-photo img{width:100%; height:100%; object-fit:cover; display:block;}

.speaker-role{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--rust);
  display:block;
}
.speaker-bio h3{margin-top:10px; font-size:1.35rem;}
.speaker-bio p{margin-top:14px; color:var(--ink-soft); text-align:justify; text-justify:inter-word;}

/* ---------- PULL QUOTE ---------- */
.pull-quote{
  border-left:3px solid var(--rust);
  padding:8px 0 8px 36px;
  font-family:'Fraunces', serif;
  font-style:italic;
  font-size:clamp(1.35rem,2.4vw,1.75rem);
  color:var(--ink);
  max-width:62ch;
  line-height:1.45;
}

/* ---------- FAQ ACCORDION ---------- */
.faq-list{border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:26px 0; display:flex; justify-content:space-between; align-items:center;
  font-family:'Fraunces', serif; font-size:1.12rem; color:var(--ink); gap:20px;
}
.faq-q:hover{color:var(--rust);}
.faq-q .plus{font-family:'IBM Plex Mono', monospace; font-size:1.2rem; color:var(--rust); transition:transform .25s; flex-shrink:0;}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .35s ease;}
.faq-a p{color:var(--ink-soft); font-size:0.98rem; padding-bottom:26px; margin:0; max-width:65ch;}

/* ---------- FORMS ---------- */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.form-grid .full{grid-column:1 / -1;}
.field label{
  display:block; font-family:'IBM Plex Mono', monospace; font-size:0.72rem;
  letter-spacing:0.07em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:9px;
}
.field input, .field select, .field textarea{
  width:100%; border:1px solid var(--line-strong); background:var(--cream);
  padding:14px 16px; font-family:'Work Sans', sans-serif; font-size:16px; color:var(--ink);
  border-radius:4px; transition:border-color .2s, box-shadow .2s;
  -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f5245' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px;
  padding-right:44px;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--rust); box-shadow:0 0 0 3px rgba(168,82,46,0.12);
}
.field textarea{resize:vertical; min-height:150px;}
.form-note{font-size:0.85rem; color:var(--ink-soft); margin-top:20px;}
.form-status{margin-top:18px; font-size:0.9rem; color:var(--teal); display:none; font-weight:500;}
.form-status.show{display:block;}
@media (max-width:700px){.form-grid{grid-template-columns:1fr;}}

/* ---------- CONTACT LIST ---------- */
.contact-list{list-style:none; margin:28px 0 0; padding:0; display:grid; gap:0;}
.contact-list a{text-decoration:none; font-size:1.04rem; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; padding:18px 4px; transition:padding-left .2s;}
.contact-list a:hover{padding-left:10px;}
.contact-list a span:first-child{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.1em;}
.contact-list a span:last-child{color:var(--ink); transition:color .2s; font-weight:500;}
.contact-list a:hover span:last-child{color:var(--rust);}

/* ---------- FOOTER ---------- */
footer{background:var(--ink); color:rgba(250,245,236,0.82); padding:64px 0 32px; margin-top:0;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:44px; padding-bottom:40px;}
.footer-brand{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
.footer-brand img{height:34px; width:34px; border-radius:50%; box-shadow:0 0 0 1px rgba(250,245,236,0.22);}
.footer-brand span{font-family:'Fraunces', serif; font-size:1.15rem; color:var(--cream);}
.footer-tagline{font-size:0.92rem; max-width:34ch; color:rgba(250,245,236,0.6);}
.footer-col h4{font-family:'IBM Plex Mono', monospace; font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; color:rgba(250,245,236,0.45); margin-bottom:16px; font-weight:500;}
.footer-col ul{list-style:none; margin:0; padding:0; display:grid; gap:12px;}
.footer-col a{text-decoration:none; color:rgba(250,245,236,0.8); font-size:0.92rem; transition:color .2s;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(250,245,236,0.14); padding-top:26px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.footer-bottom p{font-size:0.82rem; color:rgba(250,245,236,0.5); margin:0;}
@media (max-width:760px){.footer-grid{grid-template-columns:1fr;}}

/* ---------- REVEAL ---------- */
.reveal{opacity:0; transform:translateY(20px); transition:opacity .8s ease, transform .8s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---------- NAV COLLAPSE (separate, higher breakpoint than content) ---------- */
/* The full desktop nav (logo + 6 links + CTA button) needs ~985px to fit on
   one line without wrapping. Switching to the hamburger menu here, rather
   than at the lower content breakpoint below, prevents the nav from ever
   wrapping awkwardly on tablet-landscape / small-laptop widths. */
@media (max-width: 1100px){
  .nav-links{display:none;}
  .nav-toggle{display:flex;}
}

@media (max-width: 900px){
  .wrap{padding:0 24px;}
  .home-hero .wrap{grid-template-columns:1fr; text-align:left;}
  .hero-figure{order:-1; margin-bottom:12px;}
  .hero-figure-frame{max-width:220px;}
  .page-hero.has-figure .wrap{grid-template-columns:1fr; text-align:left;}
  .journal-cover{order:-1; margin-bottom:8px; max-width:210px;}
  .speaker-row, .speaker-row.reverse{grid-template-columns:1fr; gap:22px; text-align:left; padding:32px 0;}
  .speaker-row.reverse .speaker-photo, .speaker-row.reverse .speaker-bio{order:0;}
  .speaker-photo{max-width:170px; margin:0 auto;}
  .two-col, .form-grid{grid-template-columns:1fr;}
  section{padding:76px 0;}
  .cta-banner{padding:36px 28px;}
}

/* ---------- Small phones: prevent header/table overflow, tighten spacing ---------- */
@media (max-width: 560px){
  .nav-right{gap:14px;}
  .nav-right .btn-solid{display:none;}
  .brand-word{font-size:1.12rem;}
  nav.wrap{height:70px;}
  .mobile-menu{inset:70px 0 0 0; padding:36px 26px; gap:22px;}
  .mobile-menu a{font-size:1.45rem;}

  .wrap{padding:0 18px;}
  section{padding:56px 0;}
  section.tight{padding:48px 0;}
  .home-hero{padding:52px 0 60px;}
  .page-hero{padding:56px 0 48px;}
  .page-hero .hero-ctas, .hero-ctas{flex-direction:column; align-items:stretch;}
  .page-hero .hero-ctas .btn, .hero-ctas .btn{justify-content:center;}
  .hero-figure-frame{max-width:180px; padding:20px;}
  .journal-cover{max-width:170px;}
  .speaker-photo{max-width:140px;}
  .speaker-row{padding:26px 0;}

  .cta-banner{flex-direction:column; align-items:stretch; text-align:left; padding:28px 22px;}
  .cta-banner .btn{justify-content:center;}

  .fee-tabs{overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap;}
  .fee-tab{margin-right:24px; font-size:0.74rem; white-space:nowrap;}
  .fee-table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch;}
  .fee-table th, .fee-table td{padding:14px 16px; font-size:0.9rem;}

  .countdown{gap:10px;}
  .countdown .c-unit{padding:12px 14px; min-width:64px;}
  .countdown .c-num{font-size:1.25rem;}

  .timeline{padding-left:24px;}
  .t-item::before{left:-24px;}

  .word-origin{padding:26px 24px;}
  .card-cell{padding:28px 22px;}

  .theme-pill{padding:8px 14px; font-size:0.8rem;}
  .mode-chip{padding:8px 14px; font-size:0.8rem;}
  .area-card{padding:26px 20px 24px;}
  .back-to-top{right:16px; bottom:16px; width:44px; height:44px;}
}

/* ---------- Ultra-small phones (older/compact devices) ---------- */
@media (max-width: 380px){
  .home-hero h1{font-size:2.15rem;}
  .page-hero h1{font-size:1.85rem;}
  .hero-figure-frame{max-width:150px;}
  .countdown .c-unit{min-width:56px; padding:10px 10px;}
  .countdown .c-num{font-size:1.05rem;}
  .btn{padding:12px 18px; font-size:0.74rem;}
}

/* ============================================================
   ACCESSIBILITY & INTERACTION UPGRADES
   ============================================================ */

/* ---------- Focus visibility (keyboard users) ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.nav-toggle:focus-visible{
  outline:2px solid var(--rust);
  outline-offset:3px;
  border-radius:2px;
}
.faq-q:focus-visible{outline-offset:-2px;}

/* ---------- Skip to content link ---------- */
.skip-link{
  position:fixed;
  top:-60px; left:12px;
  z-index:200;
  background:var(--ink);
  color:var(--cream);
  padding:12px 20px;
  border-radius:4px;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.82rem;
  text-decoration:none;
  transition:top .25s ease;
  box-shadow:var(--shadow-md);
}
.skip-link:focus{top:12px;}

/* ---------- Scroll progress bar ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; right:0;
  height:3px; z-index:70;
  background:transparent;
  pointer-events:none;
}
.scroll-progress__bar{
  height:100%; width:0%;
  background:linear-gradient(90deg, var(--rust), var(--gold));
  transition:width .1s linear;
}

/* ---------- Header state on scroll ---------- */
header{transition:box-shadow .3s ease, background .3s ease;}
header.is-scrolled{box-shadow:var(--shadow-sm);}

/* ---------- Mobile menu overlay + lock ---------- */
.menu-backdrop{
  position:fixed; inset:0; z-index:54;
  background:rgba(36,27,21,0.35);
  opacity:0; pointer-events:none;
  transition:opacity .25s ease;
}
.menu-backdrop.open{opacity:1; pointer-events:auto;}
body.menu-locked{overflow:hidden;}
.mobile-menu{transform:translateY(-8px); opacity:0; transition:opacity .22s ease, transform .22s ease;}
.mobile-menu.open{transform:translateY(0); opacity:1;}
.mobile-menu .mobile-cta{
  margin-top:8px;
}

/* ---------- Corner arcs (decorative) ---------- */
.corner-arc{
  display:block;
  position:absolute;
  width:520px; height:520px;
  opacity:0.55;
  pointer-events:none;
  z-index:0;
}
.home-hero{isolation:isolate;}
.home-hero .corner-arc{right:-220px; top:-200px;}
.page-hero .corner-arc{right:-230px; top:-190px; width:480px; height:480px;}
@media (max-width:900px){
  .corner-arc{display:none;}
}

/* ---------- Back to top button ---------- */
.back-to-top{
  position:fixed;
  right:22px; bottom:22px;
  width:46px; height:46px;
  border-radius:50%;
  background:var(--ink);
  color:var(--cream);
  border:none;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  box-shadow:var(--shadow-md);
  opacity:0; visibility:hidden;
  transform:translateY(12px);
  transition:opacity .25s ease, transform .25s ease, background .25s ease, visibility .25s;
  z-index:65;
}
.back-to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{background:var(--rust);}
.back-to-top svg{width:18px; height:18px;}

/* ---------- Countdown ---------- */
.countdown{
  display:flex; gap:14px; flex-wrap:wrap; margin-top:26px;
}
.countdown .c-unit{
  background:var(--cream);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px 20px;
  min-width:78px;
  text-align:center;
  box-shadow:var(--shadow-sm);
}
.countdown .c-num{
  font-family:'IBM Plex Mono', monospace;
  font-size:1.55rem;
  font-weight:500;
  color:var(--rust);
  display:block;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.countdown .c-label{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.66rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink-soft);
  display:block;
  margin-top:8px;
}
.countdown.is-past .c-num{color:var(--olive);}

/* ---------- Copy button (contact / submission fallback) ---------- */
.copy-btn{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.04em;
  border:1px solid var(--line-strong);
  background:transparent;
  color:var(--ink-soft);
  padding:6px 12px;
  border-radius:3px;
  cursor:pointer;
  transition:border-color .2s, color .2s, background .2s;
  display:inline-flex; align-items:center; gap:6px;
}
.copy-btn:hover{border-color:var(--rust); color:var(--rust);}
.copy-btn.copied{border-color:var(--olive); color:var(--olive);}

/* ---------- Form validation states ---------- */
.field input:invalid:not(:placeholder-shown):not(:focus),
.field select:invalid:not(:focus),
.field textarea:invalid:not(:placeholder-shown):not(:focus){
  border-color:var(--rust);
}
.field .field-error{
  display:none;
  font-size:0.78rem;
  color:var(--rust);
  margin-top:6px;
  font-family:'IBM Plex Mono', monospace;
}
.field.show-error .field-error{display:block;}
.field.show-error input,
.field.show-error select,
.field.show-error textarea{border-color:var(--rust); box-shadow:0 0 0 3px rgba(168,82,46,0.1);}

/* ---------- Button loading state ---------- */
.btn[disabled]{opacity:0.7; cursor:progress; pointer-events:none;}
.btn .spinner{
  width:13px; height:13px;
  border-radius:50%;
  border:2px solid rgba(250,245,236,0.4);
  border-top-color:currentColor;
  animation:spin .7s linear infinite;
  display:none;
}
.btn.is-loading .spinner{display:inline-block;}
.btn.is-loading::after{display:none;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---------- Form status variants ---------- */
.form-status{padding:12px 16px; border-radius:4px; background:rgba(32,69,66,0.08);}
.form-status.is-error{color:var(--rust); background:rgba(168,82,46,0.08);}

/* ---------- Fee table refinements ---------- */
.fee-table thead th{position:relative;}

/* ---------- Toast (copy confirmation etc.) ---------- */
.toast{
  position:fixed; left:50%; bottom:28px; transform:translate(-50%, 20px);
  background:var(--ink); color:var(--cream);
  padding:14px 22px; border-radius:6px;
  font-size:0.88rem;
  box-shadow:var(--shadow-lg);
  opacity:0; pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
  z-index:120;
  max-width:90vw;
}
.toast.show{opacity:1; transform:translate(-50%, 0);}

@media (prefers-reduced-motion: reduce){
  .back-to-top, .mobile-menu, .menu-backdrop, .toast{transition:none;}
}
