/* ================================================================
   Tumata Lo Reli - assets/css/style.css
   Reli Kingdom brand: warm cream background, gold accents, deep ink text,
   Nile-blue secondary accent. System font stack (no external font fetch).
   Ported directly from the approved Reli site design mockups.
   ================================================================ */

  :root{
    --cream:#f7f0e0;
    --cream-2:#efe4c9;
    --cream-3:#fbf7ec;
    --ink:#241d13;
    --ink-soft:#4a3f2c;
    --ink-faint:#7c705a;
    --gold:#a9791f;
    --gold-bright:#7d5b16;
    --gold-line:#c9a24a;
    --gold-tint:#efe0b8;
    --blue:#1c3a52;
    --blue-tint:#e7edf0;
  }

  *{ box-sizing:border-box; margin:0; padding:0; }

  html{ scroll-behavior:smooth; }

  body{
    background:var(--cream);
    color:var(--ink);
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    line-height:1.6;
    overflow-x:hidden;
  }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
  }

  a{ color:inherit; }
  img{ max-width:100%; display:block; }

  .wrap{
    max-width:1180px;
    margin:0 auto;
    padding:0 6vw;
  }

  a:focus-visible, button:focus-visible{
    outline:2px solid var(--gold-bright);
    outline-offset:3px;
  }

  /* ---------- river-wave divider, the signature motif ----------
     Every crossing in Reli history happened at a river: the Nile,
     the Enyau, the Onvoso. A single hand-drawn wave marks each
     threshold on the page instead of a generic straight rule. */
  .wave-divider{
    width:100%;
    height:28px;
    display:block;
  }
  .wave-divider svg{ width:100%; height:100%; display:block; }

  /* ---------- NAV ---------- */
  header{
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(247,240,224,0.94);
    backdrop-filter:blur(6px);
    border-bottom:1px solid rgba(169,121,31,0.25);
  }

  .nav-inner{
    max-width:1180px;
    margin:0 auto;
    padding:0.9rem 6vw;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
  }

  .brand{
    display:flex;
    align-items:center;
    gap:0.65rem;
    text-decoration:none;
  }
  .brand img{ width:40px; height:40px; object-fit:contain; }
  .brand-text{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:1rem;
    letter-spacing:0.08em;
    color:var(--ink);
  }
  .brand-text small{
    display:block;
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight:400;
    font-size:0.6rem;
    letter-spacing:0.28em;
    color:var(--gold-bright);
    margin-top:2px;
  }

  nav.main-nav{
    display:flex;
    align-items:center;
    gap:1.7rem;
    flex-wrap:wrap;
  }
  nav.main-nav a{
    font-size:0.82rem;
    letter-spacing:0.03em;
    text-decoration:none;
    color:var(--ink-soft);
    position:relative;
    padding:0.3rem 0;
    white-space:nowrap;
  }
  nav.main-nav a::after{
    content:"";
    position:absolute;
    left:0; bottom:-2px;
    width:0; height:1px;
    background:var(--gold-bright);
    transition:width 0.25s ease;
  }
  nav.main-nav a:hover::after,
  nav.main-nav a:focus-visible::after{ width:100%; }

  nav.main-nav a.nav-cta{
    color:var(--cream);
    padding:0.55rem 1.1rem;
  }
  .nav-cta{
    font-size:0.75rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--cream);
    background:var(--ink);
    padding:0.55rem 1.1rem;
    border:1px solid var(--ink);
    white-space:nowrap;
    transition:background 0.2s ease, color 0.2s ease;
  }
  .nav-cta:hover{ background:transparent; color:var(--ink); }
  nav.main-nav a.nav-cta:hover{ color:var(--ink); }

  .nav-toggle{ display:none; }

  @media (max-width:920px){
    nav.main-nav{ display:none; }
    .nav-toggle{
      display:block;
      background:none;
      border:1px solid var(--ink);
      width:38px; height:38px;
      font-size:1.1rem;
      cursor:pointer;
      color:var(--ink);
    }
    nav.main-nav.open{
      display:flex;
      flex-direction:column;
      position:absolute;
      top:100%; left:0; right:0;
      background:var(--cream-3);
      border-bottom:1px solid rgba(169,121,31,0.25);
      padding:1rem 6vw 1.4rem;
      gap:0.9rem;
    }
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding:8vh 6vw 6vh;
    text-align:center;
    background:
      radial-gradient(ellipse 70% 60% at 50% 30%, rgba(28,58,82,0.09), transparent 70%),
      radial-gradient(ellipse 90% 80% at 50% 100%, rgba(169,121,31,0.08), transparent 60%),
      var(--cream);
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:0.5;
    background-image:
      linear-gradient(45deg, rgba(169,121,31,0.05) 25%, transparent 25%, transparent 75%, rgba(169,121,31,0.05) 75%),
      linear-gradient(45deg, rgba(169,121,31,0.05) 25%, transparent 25%, transparent 75%, rgba(169,121,31,0.05) 75%);
    background-size:64px 64px;
    background-position:0 0, 32px 32px;
    pointer-events:none;
  }

  .hero-inner{ position:relative; max-width:720px; margin:0 auto; }

  /* ---------- HERO SLIDER (full-bleed width, unchanged height, true L-R slide) ---------- */
  .hero-slider{
    position:relative;
    width:100vw;
    left:50%;
    right:50%;
    margin-left:-50vw;
    margin-right:-50vw;
    height:min(38vw, 172px);
    margin-bottom:1.8rem;
    overflow:hidden;
  }
  .hero-track{
    display:flex;
    height:100%;
    width:300%;
    transition:transform 0.6s cubic-bezier(.4,0,.2,1);
    transform:translateX(0%);
  }
  .hero-track[data-pos="1"]{ transform:translateX(-33.3333%); }
  .hero-track[data-pos="2"]{ transform:translateX(-66.6667%); }

  .hero-pane{
    flex:0 0 33.3333%;
    width:33.3333%;
    height:100%;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0 6vw;
  }
  .hero-pane p{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-style:italic;
    font-weight:600;
    font-size:clamp(0.95rem, 2.6vw, 1.2rem);
    color:var(--blue);
    line-height:1.4;
    max-width:480px;
  }
  .hero-pane .slide-tag{
    display:block;
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-style:normal;
    font-size:0.6rem;
    letter-spacing:0.24em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:0.4rem;
  }

  .hero-dots{
    position:absolute;
    bottom:0.6rem;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    gap:0.5rem;
  }
  .hero-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    border:1px solid var(--gold);
    background:transparent;
    padding:0;
    cursor:pointer;
    transition:background 0.25s ease;
  }
  .hero-dot.is-active{ background:var(--gold-bright); }

  /* emblem pane: plain transparent crest, no glow/background box */
  .pane-emblem img{
    width:auto;
    height:78%;
    object-fit:contain;
  }

  .eyebrow{
    font-size:0.7rem;
    letter-spacing:0.4em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:0.9rem;
  }

  h1.hero-title{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:700;
    font-size:clamp(2.3rem, 6vw, 3.6rem);
    letter-spacing:0.05em;
    color:var(--ink);
    margin-bottom:0.7rem;
  }

  .hero-tagline{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-style:italic;
    font-weight:600;
    font-size:clamp(1.25rem, 3vw, 1.55rem);
    color:var(--gold-bright);
    margin-bottom:1.4rem;
  }

  .hero-lede{
    font-size:1rem;
    color:var(--ink-soft);
    max-width:540px;
    margin:0 auto 2.1rem;
  }
  .hero-lede p{ margin:0; }
  .hero-lede p + p{ margin-top:0.8em; }

  .hero-actions{
    display:flex;
    gap:0.9rem;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:1.6rem;
  }

  .btn{
    display:inline-block;
    font-size:0.78rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    text-decoration:none;
    padding:0.75rem 1.5rem;
    border:1px solid var(--ink);
    transition:background 0.2s ease, color 0.2s ease;
  }
  .btn-solid{ background:var(--ink); color:var(--cream); }
  .btn-solid:hover{ background:transparent; color:var(--ink); }
  .btn-outline{ background:transparent; color:var(--ink); }
  .btn-outline:hover{ background:var(--ink); color:var(--cream); }

  .hero-location{
    font-size:0.72rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--ink-faint);
  }

  /* ---------- FACTS BAR ---------- */
  .facts{
    background:var(--ink);
    color:var(--cream);
    padding:2.6rem 6vw;
  }
  .facts-grid{
    max-width:1180px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:1.5rem;
    text-align:center;
  }
  .fact-num{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:clamp(1.5rem, 3vw, 2.1rem);
    color:var(--gold-tint);
  }
  .fact-label{
    font-size:0.66rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:rgba(247,240,224,0.65);
    margin-top:0.35rem;
  }
  @media (max-width:820px){
    .facts-grid{ grid-template-columns:repeat(2, 1fr); }
  }

  /* ---------- SECTION SCAFFOLDING ---------- */
  section.block{ padding:6.5vh 6vw; }
  .block-inner{ max-width:1180px; margin:0 auto; }

  .section-head{ max-width:640px; margin-bottom:2.6rem; }
  .section-eyebrow{
    font-size:0.68rem;
    letter-spacing:0.32em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:0.6rem;
  }
  h2.section-title{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:clamp(1.7rem, 3.6vw, 2.3rem);
    letter-spacing:0.02em;
    color:var(--ink);
    margin-bottom:0.8rem;
  }
  .section-dek{
    color:var(--ink-soft);
    font-size:0.98rem;
    max-width:560px;
  }

  .link-more{
    display:inline-flex;
    align-items:center;
    gap:0.4rem;
    font-size:0.78rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--gold-bright);
    border-bottom:1px solid var(--gold-line);
    padding-bottom:2px;
    margin-top:1.1rem;
  }
  .link-more:hover{ color:var(--ink); border-color:var(--ink); }

  /* ---------- WELCOME ---------- */
  .welcome{ background:var(--cream); }
  .welcome-inner{
    max-width:760px;
    margin:0 auto;
    text-align:center;
  }
  .welcome blockquote{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-style:italic;
    font-weight:600;
    font-size:clamp(1.3rem, 2.6vw, 1.6rem);
    color:var(--ink);
    line-height:1.5;
    margin:1.4rem 0 1.6rem;
  }
  .welcome p{ color:var(--ink-soft); font-size:0.98rem; }

  /* ---------- HISTORY (two column w/ pull quote) ---------- */
  .history{ background:var(--cream-2); }
  .history-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:3.5rem;
    align-items:center;
  }
  .history-media{
    background:var(--blue);
    aspect-ratio:4/3;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2rem;
    position:relative;
    overflow:hidden;
  }
  .history-media::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:0;
    height:38%;
    background:
      repeating-linear-gradient(100deg, rgba(247,240,224,0.10) 0 2px, transparent 2px 26px);
  }
  .history-media p{
    position:relative;
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-style:italic;
    font-weight:600;
    color:var(--cream);
    font-size:clamp(1.1rem, 2vw, 1.35rem);
    text-align:center;
    line-height:1.5;
  }
  .history-body p{ color:var(--ink-soft); margin-bottom:1rem; font-size:0.96rem; }
  .history-body p:last-of-type{ margin-bottom:0; }

  @media (max-width:820px){
    .history-grid{ grid-template-columns:1fr; gap:2rem; }
  }

  /* ---------- KINGDOM / GOVERNANCE ---------- */
  .kingdom{ background:var(--cream); }
  .kingdom-grid{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:3.5rem;
    align-items:start;
  }
  .monarch-card{
    border:1px solid rgba(169,121,31,0.35);
    padding:2.2rem 1.8rem;
    text-align:center;
    background:var(--cream-3);
  }
  .monarch-card img{ width:76px; height:76px; margin:0 auto 1.1rem; object-fit:contain; }
  .monarch-title{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:1.15rem;
    color:var(--ink);
    margin-bottom:0.3rem;
  }
  .monarch-role{
    font-size:0.72rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:1rem;
  }
  .monarch-card p{ font-size:0.9rem; color:var(--ink-soft); }

  .org-list{ list-style:none; }
  .org-list li{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    padding:0.85rem 0;
    border-bottom:1px solid rgba(169,121,31,0.22);
    font-size:0.9rem;
  }
  .org-list li:first-child{ padding-top:0; }
  .org-role{ font-weight:500; color:var(--ink); }
  .org-desc{ color:var(--ink-faint); text-align:right; max-width:56%; font-size:0.84rem; }

  @media (max-width:820px){
    .kingdom-grid{ grid-template-columns:1fr; gap:2.2rem; }
    .org-desc{ max-width:100%; text-align:left; }
    .org-list li{ flex-direction:column; gap:0.2rem; }
  }

  /* ---------- CULTURE CARDS ---------- */
  .culture{ background:var(--cream-2); }
  .culture-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:1.4rem;
  }
  .culture-card{
    background:var(--cream-3);
    border:1px solid rgba(169,121,31,0.25);
    padding:1.8rem 1.5rem;
  }
  .culture-card .mark{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-size:0.75rem;
    letter-spacing:0.14em;
    color:var(--gold-bright);
    margin-bottom:0.9rem;
  }
  .culture-card h3{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:1.02rem;
    color:var(--ink);
    margin-bottom:0.6rem;
  }
  .culture-card p{ font-size:0.86rem; color:var(--ink-soft); }

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

  /* ---------- ECONOMY STRIP ---------- */
  .economy{ background:var(--blue); color:var(--cream); }
  .economy .section-eyebrow{ color:var(--gold-tint); }
  .economy .section-title{ color:var(--cream); }
  .economy .section-dek{ color:rgba(247,240,224,0.78); }
  .economy-row{
    display:flex;
    gap:2.4rem;
    flex-wrap:wrap;
    margin-top:1rem;
  }
  .economy-item{ flex:1 1 200px; }
  .economy-item .mark{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-size:0.72rem;
    letter-spacing:0.14em;
    color:var(--gold-tint);
    margin-bottom:0.6rem;
  }
  .economy-item p{ font-size:0.88rem; color:rgba(247,240,224,0.82); }
  .economy .link-more{ color:var(--gold-tint); border-color:rgba(233,214,143,0.6); }
  .economy .link-more:hover{ color:var(--cream); border-color:var(--cream); }

  /* ---------- NEWS ---------- */
  .news{ background:var(--cream); }
  .news-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1.6rem;
  }
  .news-card{
    border-top:2px solid var(--gold-bright);
    padding-top:1.1rem;
  }
  .news-date{
    font-size:0.7rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:0.5rem;
  }
  .news-card h3{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:1rem;
    color:var(--ink);
    margin-bottom:0.5rem;
    line-height:1.4;
  }
  .news-card .excerpt{ font-size:0.86rem; color:var(--ink-soft); }
  .news-card .excerpt p{ margin:0; }
  .news-card .excerpt p + p{ margin-top:0.6em; }

  @media (max-width:820px){
    .news-grid{ grid-template-columns:1fr; }
  }

  /* ---------- GET INVOLVED CTA ---------- */
  .involved{
    background:var(--ink);
    color:var(--cream);
    text-align:center;
    padding:7vh 6vw;
  }
  .involved h2{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:clamp(1.6rem, 3.4vw, 2.1rem);
    margin-bottom:0.8rem;
  }
  .involved p{
    color:rgba(247,240,224,0.75);
    max-width:520px;
    margin:0 auto 1.8rem;
    font-size:0.96rem;
  }
  .involved .hero-actions{ margin-bottom:0; }
  .involved .btn-solid{ background:var(--gold-tint); color:var(--ink); border-color:var(--gold-tint); }
  .involved .btn-solid:hover{ background:transparent; color:var(--gold-tint); }
  .involved .btn-outline{ color:var(--cream); border-color:rgba(247,240,224,0.5); }
  .involved .btn-outline:hover{ background:var(--cream); color:var(--ink); }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--cream-3); padding:5vh 6vw 3vh; border-top:1px solid rgba(169,121,31,0.25); }
  .footer-grid{
    max-width:1180px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr;
    gap:2.4rem;
    margin-bottom:2.6rem;
  }
  .footer-brand{ display:flex; gap:0.7rem; align-items:flex-start; }
  .footer-brand img{ width:44px; height:44px; object-fit:contain; }
  .footer-brand-text{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:0.98rem;
    color:var(--ink);
  }
  .footer-brand-text small{
    display:block;
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight:400;
    font-size:0.72rem;
    color:var(--ink-faint);
    margin-top:0.5rem;
    line-height:1.6;
  }
  .footer-col h4{
    font-size:0.7rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:1rem;
  }
  .footer-col ul{ list-style:none; }
  .footer-col li{ margin-bottom:0.6rem; }
  .footer-col a{
    font-size:0.85rem;
    text-decoration:none;
    color:var(--ink-soft);
    border-bottom:1px solid transparent;
  }
  .footer-col a:hover{ color:var(--ink); border-color:var(--gold-line); }

  .social-row{
    display:flex;
    gap:0.7rem;
    margin-top:1.3rem;
  }
  .social-icon{
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(169,121,31,0.65);
    color:var(--ink-soft);
    text-decoration:none;
    transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }
  .footer-col .social-icon{
    border-bottom:1px solid rgba(169,121,31,0.65);
  }
  .social-icon svg{ width:16px; height:16px; }
  .social-icon:hover{
    background:var(--ink);
    color:var(--cream);
    border-color:var(--ink);
  }

  .footer-bottom{
    max-width:1180px;
    margin:0 auto;
    padding-top:2rem;
    border-top:1px solid rgba(169,121,31,0.22);
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:0.8rem;
    font-size:0.75rem;
    color:var(--ink-faint);
  }

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

  /* ---------- PAGE HERO (simple banner for interior pages) ---------- */
  .page-hero{
    position:relative;
    padding:7vh 6vw 5vh;
    text-align:center;
    background:
      radial-gradient(ellipse 70% 60% at 50% 30%, rgba(28,58,82,0.09), transparent 70%),
      radial-gradient(ellipse 90% 80% at 50% 100%, rgba(169,121,31,0.08), transparent 60%),
      var(--cream);
    overflow:hidden;
  }
  .page-hero::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:0.5;
    background-image:
      linear-gradient(45deg, rgba(169,121,31,0.05) 25%, transparent 25%, transparent 75%, rgba(169,121,31,0.05) 75%),
      linear-gradient(45deg, rgba(169,121,31,0.05) 25%, transparent 25%, transparent 75%, rgba(169,121,31,0.05) 75%);
    background-size:64px 64px;
    background-position:0 0, 32px 32px;
    pointer-events:none;
  }
  .page-hero-inner{ position:relative; max-width:680px; margin:0 auto; }
  .page-hero h1{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:700;
    font-size:clamp(2rem, 5vw, 2.8rem);
    letter-spacing:0.02em;
    color:var(--ink);
    margin-bottom:0.7rem;
  }
  .page-hero .dek{
    color:var(--ink-soft);
    font-size:1rem;
    max-width:560px;
    margin:0 auto;
  }
  .page-hero .dek p{ margin:0; }
  .page-hero .dek p + p{ margin-top:0.8em; }

  /* ---------- generic content helpers for interior pages ---------- */
  .prose p{ color:var(--ink-soft); font-size:0.98rem; margin-bottom:1.1rem; max-width:760px; }
  .prose p:last-child{ margin-bottom:0; }
  .prose h3{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:700;
    color:var(--ink);
    font-size:1.2rem;
    margin:2rem 0 0.8rem;
  }
  .prose h3:first-child{ margin-top:0; }

  .callout{
    border:1px solid rgba(169,121,31,0.35);
    background:var(--cream-3);
    padding:1.8rem;
    margin-top:1rem;
  }
  .callout h4{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:700;
    color:var(--ink);
    font-size:1.05rem;
    margin-bottom:0.5rem;
  }
  .callout p{ color:var(--ink-soft); font-size:0.9rem; }

  .chiefdom-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:0.9rem;
    margin-top:1.2rem;
  }
  .chiefdom-chip{
    border:1px solid rgba(169,121,31,0.3);
    background:var(--cream-3);
    padding:0.9rem 1rem;
    font-size:0.86rem;
    color:var(--ink-soft);
    text-align:center;
  }
  @media (max-width:700px){ .chiefdom-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:460px){ .chiefdom-grid{ grid-template-columns:1fr; } }

  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1rem;
  }
  .gallery-tile-link{
    display:block;
    text-decoration:none;
  }
  .gallery-tile{
    position:relative;
    aspect-ratio:4/3;
    display:flex;
    align-items:flex-end;
    padding:1rem;
    color:var(--cream);
    font-size:0.8rem;
    letter-spacing:0.04em;
    transition:transform 0.2s ease;
  }
  .gallery-tile-link:hover .gallery-tile,
  .gallery-tile-link:focus-visible .gallery-tile{ transform:scale(1.02); }
  .gallery-tile span{ position:relative; }
  .gallery-tile::before{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.55));
  }
  .gt-1{ background:linear-gradient(135deg, #1c3a52, #2c5678); }
  .gt-2{ background:linear-gradient(135deg, #7d5b16, #a9791f); }
  .gt-3{ background:linear-gradient(135deg, #241d13, #4a3f2c); }
  .gt-4{ background:linear-gradient(135deg, #2c5678, #1c3a52); }
  .gt-5{ background:linear-gradient(135deg, #a9791f, #7d5b16); }
  .gt-6{ background:linear-gradient(135deg, #4a3f2c, #241d13); }
  @media (max-width:700px){ .gallery-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:460px){ .gallery-grid{ grid-template-columns:1fr; } }

  /* Photos / Videos tabs, reused on each category page */
  .gallery-tabs{
    display:flex;
    border:1px solid rgba(169,121,31,0.35);
    max-width:360px;
    margin:0 auto 2rem;
  }
  .gallery-tab{
    flex:1;
    background:var(--cream-3);
    border:none;
    border-right:1px solid rgba(169,121,31,0.35);
    padding:0.65rem 0.5rem;
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--ink-soft);
    cursor:pointer;
    transition:background 0.2s ease, color 0.2s ease;
  }
  .gallery-tab:last-child{ border-right:none; }
  .gallery-tab.is-active{
    background:var(--ink);
    color:var(--cream);
  }
  .gallery-panel{ display:none; }
  .gallery-panel.is-active{ display:grid; }
  .gallery-tile.is-video::after{
    content:"";
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%, -50%);
    width:0; height:0;
    border-style:solid;
    border-width:9px 0 9px 15px;
    border-color:transparent transparent transparent var(--cream);
    filter:drop-shadow(0 1px 3px rgba(0,0,0,0.5));
  }
  .back-link{
    display:inline-block;
    font-size:0.8rem;
    letter-spacing:0.05em;
    text-decoration:none;
    color:var(--gold-bright);
    border-bottom:1px solid var(--gold-line);
    padding-bottom:2px;
    margin-bottom:1.6rem;
  }
  .back-link:hover{ color:var(--ink); border-color:var(--ink); }

  .involved-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1.4rem;
  }
  @media (max-width:700px){ .involved-grid{ grid-template-columns:1fr; } }

  /* ---------- Contact form (mockup, non-functional) ---------- */
  .contact-form{
    max-width:520px;
    margin:0 auto;
  }
  .form-row{ margin-bottom:1.1rem; }
  .form-row label{
    display:block;
    font-size:0.7rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--gold-bright);
    margin-bottom:0.4rem;
  }
  .form-row input,
  .form-row textarea{
    width:100%;
    border:1px solid rgba(169,121,31,0.4);
    background:var(--cream-3);
    color:var(--ink);
    font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size:0.92rem;
    padding:0.7rem 0.8rem;
  }
  .form-row textarea{ min-height:120px; resize:vertical; }
  .form-row input:focus,
  .form-row textarea:focus{ outline:2px solid var(--gold-bright); outline-offset:1px; }

  .contact-card-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1.4rem;
    max-width:640px;
    margin:0 auto;
  }
  @media (max-width:640px){ .contact-card-grid{ grid-template-columns:1fr; } }