/* ============================================================
   tiki-about.css  v4 — companion to style.css
   Selectors written to BEAT style.css specificity, not tie it.
   ============================================================ */

/* ------------------------------------------------------------
   HERO LOGO (index.html)
   style.css: img{display:block} with no auto margins — block
   images never centre. This wins at (0,2,1).
   ------------------------------------------------------------ */
.hero img.hero-logo{
  display:block;
  margin:0 auto 18px;
  max-width:min(400px,70vw);
  width:auto;
  height:auto;
  position:relative;
  z-index:1;
  border-radius:var(--radius);
}

.hero a.map-link{
  color:inherit;
  text-decoration:none;
  border-bottom:1px dotted currentColor;
}
.hero a.map-link:hover,
.hero a.map-link:focus-visible{ border-bottom-style:solid; }

/* ------------------------------------------------------------
   LANGUAGE BUTTON ROW — five equal cells
   .btn in style.css is inline-block; grid cell + flex wins here
   because these selectors are more specific than .btn.
   ------------------------------------------------------------ */
div.tiki-langs{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px;
  align-items:stretch;
  max-width:900px;
  margin:36px auto 0;
}
div.tiki-langs a.btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding-left:10px;
  padding-right:10px;
  text-align:center;
}
div.tiki-langs a.btn[aria-current="page"]{
  opacity:.4;
  pointer-events:none;
  box-shadow:none;
  transform:translateY(6px);
}
@media (max-width:860px){
  div.tiki-langs{ grid-template-columns:repeat(2,1fr); }
  div.tiki-langs a.btn:first-child{ grid-column:1 / -1; }
}

section.tiki-langs-wrap{ padding-top:0; }

/* ------------------------------------------------------------
   ABOUT PAGE HERO — shorter than homepage
   ------------------------------------------------------------ */
header.tiki-hero-sm{ padding:56px 20px 90px; }
header.tiki-hero-sm .tagline{ opacity:.9; }

/* ------------------------------------------------------------
   DEFINITION CARDS
   NOTE: style.css has `.section h2` (0,1,1) which was beating
   `.tiki-term` (0,1,0) and turning terms teal. These are (0,2,1)
   and (0,3,1) — they win.
   ------------------------------------------------------------ */
section.tiki-defs{ padding-bottom:32px; }
.section div.tiki-glossary{
  display:flex;
  flex-direction:column;
  gap:18px;
  max-width:760px;
  margin:0 auto;
}
.tiki-glossary div.tiki-entry{ padding:24px 28px; }

.section .tiki-entry h2.tiki-term{
  font-family:var(--display);
  font-weight:400;
  font-size:1.45rem;
  line-height:1.25;
  color:var(--coral);
  margin:0 0 8px;
}
.tiki-term span.tiki-pos{
  font-family:var(--body);
  font-style:italic;
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.4px;
  color:var(--jungle);
  opacity:.5;
  white-space:nowrap;
}
.tiki-glossary .tiki-entry p{ margin:0; }

.section p.tiki-arrival{
  max-width:760px;
  margin:34px auto 0;
  text-align:center;
  font-family:var(--display);
  font-size:clamp(1.3rem,4vw,1.8rem);
  line-height:1.4;
  color:var(--lagoon-d);
}

/* ------------------------------------------------------------
   STORY PROSE
   ------------------------------------------------------------ */
section.tiki-story{
  max-width:720px;
  padding-top:24px;
}
section.tiki-story p{ margin-bottom:20px; }
section.tiki-story p.lead{ font-weight:800; }
section.tiki-story p.tiki-signoff{
  font-weight:800;
  color:var(--lagoon-d);
}
section.tiki-story div.tiki-cta{ margin-top:32px; }

/* ------------------------------------------------------------
   NON-LATIN SCRIPTS
   ------------------------------------------------------------ */
html[lang="th"] .hero h1,
html[lang="th"] .section .tiki-entry h2.tiki-term,
html[lang="th"] .section p.tiki-arrival{ font-family:'Noto Sans Thai',var(--body); font-weight:900; }
html[lang="th"] body{ line-height:1.85; }

html[lang="ru"] .hero h1,
html[lang="ru"] .section .tiki-entry h2.tiki-term,
html[lang="ru"] .section p.tiki-arrival{ font-family:'Noto Sans',var(--body); font-weight:900; }

html[lang="zh-CN"] .hero h1,
html[lang="zh-CN"] .section .tiki-entry h2.tiki-term,
html[lang="zh-CN"] .section p.tiki-arrival{ font-family:'Noto Sans SC',var(--body); font-weight:900; }
html[lang="zh-CN"] body{ line-height:1.85; }

html[lang="ja"] .hero h1,
html[lang="ja"] .section .tiki-entry h2.tiki-term,
html[lang="ja"] .section p.tiki-arrival{ font-family:'Noto Sans JP',var(--body); font-weight:900; }
html[lang="ja"] body{ line-height:1.85; }

html[lang="th"] .hero h1,
html[lang="zh-CN"] .hero h1,
html[lang="ja"] .hero h1{
  font-size:clamp(2rem,6.5vw,3.4rem);
  line-height:1.25;
}