/* ============================================================
   LIBAAS — Design System v1 (Phase 1, 4 Sep 2026)
   Navy + Gold luxury | Wear Elegance. Share Kindness.
   Fonts: Cormorant Garamond (display) + Lato (body)
   ============================================================ */
:root{
  --navy: #182A4C;
  --navy-deep: #112341;
  --navy-soft: #1E2F52;
  --gold: #C9973F;
  --gold-soft: #D9B36A;
  --gold-tint: rgba(201, 151, 63, .12);
  --ivory: #FAF3E8;
  --white-warm: #FDFAF6;
  --ink: #1A1A1A;
  --ink-55: #5C5C5C;
  --line: #E8E0D2;
  --ok: #2E7D32;
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Lato', 'Segoe UI', sans-serif;
  --wrap: 1680px;
}
/* ---------- Announcement bar ---------- */
.annc{ background: var(--navy-deep); color: var(--gold-soft); font: 500 12.5px/1 var(--sans);
  letter-spacing: .14em; text-transform: uppercase; overflow: hidden; height: 38px; display: flex; align-items: center; }
.annc__track{ display: flex; gap: 64px; white-space: nowrap; animation: annc 26s linear infinite; }
.annc:hover .annc__track{ animation-play-state: paused; }
.annc__track span{ display: inline-flex; align-items: center; gap: 8px; }
/* ---------- Header ---------- */
.hdr{ position: sticky; top: 0; z-index: 900; background: rgba(13, 22, 40, .97);
  backdrop-filter: blur(10px); border-bottom: 1px solid rgba(201, 151, 63, .25); }
.hdr__in{ max-width: var(--wrap); margin: 0 auto; padding: 0 22px; height: 70px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.logo{ display: flex; flex-direction: column; line-height: 1; }
.logo__word{ font: 600 30px/1 var(--serif); color: var(--gold); letter-spacing: .16em; }
.logo__sub{ font: 500 8.5px/1 var(--sans); color: rgba(250, 243, 232, .75);
  letter-spacing: .42em; text-transform: uppercase; margin-top: 5px; padding-left: 2px; }
.nav{ display: flex; gap: 26px; align-items: center; }
.nav a{ font: 600 12.5px/1 var(--sans); color: var(--ivory); letter-spacing: .09em;
  text-transform: uppercase; padding: 8px 0; border-bottom: 2px solid transparent; transition: .2s; }
.nav a:hover, .nav a.is-on{ color: var(--gold-soft); border-bottom-color: var(--gold); }
.hdr__icons{ display: flex; gap: 18px; align-items: center; }
.hdr__icons a, .hdr__icons button{ background: none; border: none; cursor: pointer; color: var(--ivory);
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; transition: .2s; position: relative; }
.hdr__icons a:hover, .hdr__icons button:hover{ color: var(--gold); background: rgba(201,151,63,.12); }
.hdr__burger{ display: none; }
/* ---------- Mobile ---------- */
.mobnav{ position: fixed; inset: 0; background: rgba(13, 22, 40, .98); z-index: 999;
  display: flex; flex-direction: column; padding: 26px; transform: translateX(100%); transition: .3s; }
.mobnav.is-open{ transform: none; }
.mobnav a{ font: 600 20px/1 var(--serif); color: var(--ivory); padding: 16px 0;
  border-bottom: 1px solid rgba(201, 151, 63, .2); }
.nav{ display: none; }
.hdr__burger{ display: grid; }
/* ═══ HEADER v2 (13 Oct): burger LEFT · logo CENTRE · nav RIGHT ═══ */
.hdr__in{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:18px; }
.hdr__left{ display:flex; align-items:center; gap:10px; justify-self:start; }
.logo{ text-align:center; align-items:center; }
.logo__cat{ font:700 10.5px/1 var(--sans); letter-spacing:.30em; text-transform:uppercase;
  color:var(--gold); margin-top:7px; }
.logo__tag{ font:italic 400 11px/1 var(--serif); color:rgba(250,243,232,.72); margin-top:4px; letter-spacing:.04em; }
.hdr__in .nav{ justify-self:end; }
.nav{ display:flex; gap:16px; align-items:center; }
.nav a{ color:var(--ivory); text-decoration:none; font:500 11.5px/1 var(--sans);
  letter-spacing:.14em; text-transform:uppercase; padding:8px 2px; position:relative; }
.nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--gold); transition:right .3s ease; }
.nav a:hover::after, .nav a.is-on::after{ right:0; }
.nav a.is-on{ color:var(--gold); }
.hdr__in .nav{ display:none; }
.hdr__burger{display:grid;}
.logo__word{font-size:25px}
.hdr__burger{ display:none; }
body.theme-dark .annc{ background:#000; color:var(--gold-soft); }
/* bigger logo block, centred */
.logo__word{ font-size:40px; letter-spacing:.20em; }
.logo__cat{ font-size:12.5px; letter-spacing:.30em; margin-top:8px; color:var(--gold); font-weight:700; }
.logo__tag{ font-size:12px; margin-top:5px; color:rgba(250,243,232,.66); font-style:italic; }
.hdr__in{ height:auto; padding-top:14px; padding-bottom:12px; }
/* icon row on the right of the logo */
.hdr__acts{ display:flex; align-items:center; gap:14px; justify-self:end; }
.hdr__acts button, .hdr__acts a.hdr__ic{ background:none; border:0; cursor:pointer; color:var(--ivory);
  display:inline-flex; align-items:center; gap:6px; padding:7px 8px; border-radius:9px; font:700 11px/1 var(--sans);
  letter-spacing:.10em; text-transform:uppercase }
.hdr__acts button:hover, .hdr__acts a.hdr__ic:hover{ color:var(--gold); background:rgba(201,151,63,.12) }
.hdr__cc{ display:inline-flex; align-items:center; gap:7px; border:1px solid rgba(201,151,63,.35); border-radius:999px;
  padding:6px 11px; color:var(--ivory); background:none; cursor:pointer; font:700 11px/1 var(--sans); letter-spacing:.10em }
.hdr__cc:hover{ border-color:var(--gold); color:var(--gold) }
.hdr__badge{ background:var(--gold); color:#182A4C; border-radius:999px; font-size:9.5px; font-weight:700; padding:1px 6px }
/* nav row UNDER the logo — LIBAAS's pattern */
.hdr__nav{ border-top:1px solid rgba(201,151,63,.18); background:rgba(13,22,40,.94) }
.hdr__nav .nav{ display:flex; justify-content:center; gap:30px; padding:0 20px }
.hdr__nav .nav a{ color:rgba(250,243,232,.82); padding:13px 2px }
.hdr__nav .nav a:hover, .hdr__nav .nav a.is-on{ color:var(--gold) }
.hdr__nav .nav a.is-on::after{ right:0 }
.hdr__nav .nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:6px; height:1px; background:var(--gold); transition:right .3s }
.hdr__nav{display:none}
.hdr__acts .hide-sm{display:none}
/* v5 (17 Oct): owner ka hukum — logo light-gold (New Stories wala --gold-soft), bas */
.logo__word,.logo__cat{color:#D9B36A}
.annc{ position: sticky; top: 34px; z-index: 945; }
.hdr{ top: 72px; }
/* v6.1 (17 Oct): owner list — logo +50%, hero images, timer-only dropbar, trust line, ctiles-scroll, per-piece price upar, chat bubble, 1680 width */
.logo__word{font-size:45px !important}
.logo__cat{font-size:15px !important;margin-top:9px !important}
.logo__tag{font-size:13px !important;letter-spacing:.18em}
.hdr__in{height:92px}
/* v6.4 */
.hdr__in{height:auto !important;padding:12px 22px 6px !important}
.logo__tag{margin-top:7px !important}
.hdr__nav{padding:2px 22px 10px !important}
.nav{gap:46px !important}
.nav a{font-size:15.5px !important;letter-spacing:.12em !important}
/* v6.5 */ .logo__word{font-size:56px !important}
.logo__cat{font-size:19px !important;letter-spacing:.3em !important;margin-top:10px !important}
.logo__tag{font-size:16px !important;margin-top:9px !important}
.hdr__nav{margin-top:2px}
/* v6.6 */
.logo__word{font-size:53px !important}
.logo__cat{font-size:18px !important;margin-top:9px !important}
.logo__tag{font-size:15px !important;margin-top:8px !important}
/* deploy fixes (17 Oct): burger dark, panels dark */
.hdr__burger{background:transparent !important;border:0 !important;color:#F3EEE3 !important;padding:6px}
.hdr__burger svg{stroke:#F3EEE3 !important}
.hdr__cc,.hdr__acts button,.hdr__acts a{color:#F3EEE3 !important}
/* v9 front */ .logo__word{font-size:47px !important}
.logo__cat{font-size:16px !important;margin-top:5px !important;letter-spacing:.26em !important}
.logo__tag{font-size:13px !important;margin-top:4px !important}
.hdr .nav a{font-size:13px !important;letter-spacing:.1em !important}
.hdr .nav{gap:34px !important}
.hdr__in{padding:8px 22px 3px !important;height:auto !important}
.hdr__nav{padding-bottom:5px !important}
.annc{height:31px !important;font-size:11.5px !important}
.annc{position:relative;top:0;height:28px !important;font-size:11px !important;color:#E8D5A0 !important;background:#0D1E38 !important;border-bottom:1px solid rgba(201,151,63,.25)}
.logo__word{font-size:42px !important}
.logo__cat{font-size:14.5px !important;letter-spacing:.26em !important;margin-top:4px !important}
.hdr .nav a{font-size:11px !important}
.hdr .nav{gap:36px !important}
.hdr__in{padding:6px 22px 2px !important;height:auto !important}
.hdr__nav{padding:1px 22px 3px !important;border-top:1px solid rgba(201,151,63,.14)}
/* v11 */ .hdr{top:0 !important}
.annc{position:static !important}
/* v12 */ .annc{position:sticky !important;top:0 !important;z-index:930;background:#0D1E38 !important}
.hdr{top:28px !important}
.hdr .nav a{font-size:12.5px !important;letter-spacing:.11em !important}
/* v16 */ .hdr .logo__tag{display:block !important;font:italic 400 13px/1.2 Georgia,serif !important; color:#F3EEE3 !important;opacity:.92 !important;margin-top:6px !important;visibility:visible !important}
.hdr__nav{display:block !important}
@media (max-width: 980px) {
  .nav { display: none; }
  .hdr__burger { display: grid; }
  .cats { grid-template-columns: repeat(2, 1fr); }
  .pgrid { grid-template-columns: repeat(2, 1fr); }
  .mission, .story { grid-template-columns: 1fr; }
  .revs { grid-template-columns: 1fr; }
  .trust { grid-template-columns: repeat(3, 1fr); }
  .ftr__grid { grid-template-columns: 1fr 1fr; }
  .hero { height: 66vh; }
}