/* Premium layer: richer surfaces, ornament, depth. Loaded after site.css; themes are chosen in Admin → Website Settings. */
:root{
  --gold:#b98a1f;--gold-d:#8a6414;--gold-l:#f1e2b8;
  --paper:#fffdf9;--cream:#f8f2e6;--sand:#ece1c9;--line:#e3d6b8;
  --shadow:0 18px 44px -18px rgba(15,31,77,.28),0 2px 6px rgba(15,31,77,.06);
  --shadow-lg:0 30px 70px -24px rgba(15,31,77,.38);
  --gold-grad:linear-gradient(135deg,#e8c871 0%,#c9962d 45%,#8f6417 100%);
}
:root[data-theme=aurora]{
  --forest:#1e3a8a;--forest-d:#0f1f4d;--forest-l:#e3e9fb;
  --terra:#0e8f8a;--terra-d:#0a6b67;--maroon:#0f1f4d;
  --gold:#f59e0b;--gold-d:#b45309;--gold-l:#fdecc8;--gold-grad:linear-gradient(135deg,#fcd34d 0%,#f59e0b 50%,#d97706 100%);
  --paper:#ffffff;--cream:#f4f7fc;--sand:#e8eef8;--line:#d8e0ee;--ink:#14213d;--muted:#52607a;
  --ok:#0f7a4a;--err:#b42318;--warn-bg:#fff4d6;
  --shadow:0 18px 44px -18px rgba(15,31,77,.28),0 2px 6px rgba(15,31,77,.06);--shadow-lg:0 30px 70px -24px rgba(15,31,77,.4)
}
:root[data-theme=aurora] .site-footer{background:linear-gradient(180deg,var(--forest-d),#070f2b)}
:root[data-theme=maroon]{--forest:#6d2219;--forest-d:#47120c;--forest-l:#f5e4df;--terra:#a96a15;--terra-d:#85500d;--cream:#faf3ea}
:root[data-theme=ink]{--forest:#2a2f34;--forest-d:#14171a;--forest-l:#eceae4;--terra:#9a7418;--terra-d:#78590f;--cream:#f6f2ea;--gold-l:#efe2bd}

::selection{background:var(--gold-l);color:var(--forest-d)}
body{background:
  radial-gradient(1200px 500px at 85% -10%,rgba(201,150,45,.10),transparent 60%),
  radial-gradient(900px 500px at -10% 20%,rgba(30,58,138,.06),transparent 60%),var(--cream);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3{letter-spacing:-.012em}

/* ---- header ---- */
.site-header{background:rgba(255,253,249,.82);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:0;box-shadow:0 1px 0 rgba(201,150,45,.45),0 12px 30px -20px rgba(15,31,77,.4)}
.brand-text b{font-size:1.2rem;letter-spacing:.005em}
.brand-text small{letter-spacing:.18em;text-transform:uppercase;font-size:.62rem;color:var(--gold-d)}
.header-search{box-shadow:inset 0 1px 2px rgba(15,31,77,.06)}
.header-search button{background:var(--forest)}
.main-nav{background:linear-gradient(180deg,var(--forest),var(--forest-d));position:relative}
.main-nav::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold-grad);opacity:.9}
.main-nav a{letter-spacing:.02em;border-bottom-width:2px;transition:background .25s,color .25s}
.main-nav a[aria-current=page]{border-bottom-color:#e8c871;background:rgba(255,255,255,.08);color:#fff}

/* ---- buttons ---- */
.btn{border-radius:999px;padding:12px 24px;transition:transform .2s,box-shadow .25s,background .25s}
.btn-primary{background:linear-gradient(180deg,var(--terra),var(--terra-d));box-shadow:0 10px 22px -10px var(--terra-d),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-primary:hover{box-shadow:0 16px 28px -12px var(--terra-d),inset 0 1px 0 rgba(255,255,255,.3);background:linear-gradient(180deg,var(--terra),var(--terra-d))}
.btn-ghost{border-color:rgba(30,58,138,.35);background:rgba(255,255,255,.7)}
.btn-sm,.btn-link{border-radius:10px}

/* ---- hero ---- */
.hero{position:relative;background:
  radial-gradient(700px 420px at 78% 40%,rgba(201,150,45,.16),transparent 65%),
  linear-gradient(135deg,var(--cream) 0%,var(--sand) 100%);border-bottom:0;padding:72px 0 84px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:
    linear-gradient(45deg,rgba(14,143,138,.05) 25%,transparent 25%),linear-gradient(-45deg,rgba(14,143,138,.05) 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,rgba(14,143,138,.05) 75%),linear-gradient(-45deg,transparent 75%,rgba(14,143,138,.05) 75%);
  background-size:44px 44px;background-position:0 0,0 22px,22px -22px,-22px 0;
  -webkit-mask:linear-gradient(90deg,#000,transparent 70%);mask:linear-gradient(90deg,#000,transparent 70%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(90deg,var(--terra) 0 14px,var(--gold) 14px 28px,var(--forest) 28px 42px);opacity:.9}
.hero .container{position:relative}
.hero h1{font-size:clamp(2.4rem,5.6vw,4.1rem);line-height:1.05}
.hero h1 em{background:linear-gradient(100deg,var(--terra-d),var(--terra) 60%,#b9791c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--terra-d)}
.hero-stats dd{background:linear-gradient(135deg,var(--forest),var(--gold-d));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-search input{border-radius:999px;padding:13px 20px;box-shadow:var(--shadow)}
.hero-media{box-shadow:var(--shadow-lg)}

/* ---- section rhythm + ornament ---- */
.section-head{position:relative;padding-bottom:18px}
.section-head::after,.page-head::after{content:"";display:block;width:84px;height:12px;margin-top:14px;
  background:radial-gradient(circle at 6px 6px,var(--gold) 0 3px,transparent 3.5px),linear-gradient(var(--gold),var(--gold)) 18px 5px/66px 2px no-repeat;background-repeat:no-repeat}
.section.band{background:linear-gradient(180deg,var(--forest-l),#fff9ee)}
.eyebrow{color:var(--terra);letter-spacing:.2em}

/* ---- cards ---- */
.card,.topic,.living-grid a,.resource,.side,.comment{border-radius:18px;border-color:rgba(201,150,45,.28);background:linear-gradient(180deg,#fff,var(--paper));box-shadow:0 1px 0 #fff inset,0 10px 30px -22px rgba(15,31,77,.5)}
.card,.topic{position:relative}
.card::before,.topic::before{content:"";position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 4px 4px;background:var(--gold-grad);opacity:0;transition:opacity .3s;z-index:2}
.card:hover::before,.topic:hover::before{opacity:1}
.card:hover,.topic:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.card-media .cover,.topic-img .cover{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover .cover,.topic:hover .cover{transform:scale(1.05)}
.tile{border-radius:18px;box-shadow:0 14px 30px -18px rgba(15,31,77,.55)}
.tile::after{content:"";position:absolute;inset:0;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(201,150,45,.45);pointer-events:none}
.date-chip{background:linear-gradient(160deg,var(--forest),var(--forest-d))}
.badge{background:var(--gold-l);color:var(--gold-d)}
.chip{background:var(--forest-l)}

/* ---- forms & filters ---- */
.filters{border-radius:18px;background:linear-gradient(180deg,#fff,var(--paper));border-color:rgba(201,150,45,.3);box-shadow:var(--shadow)}
.tab[aria-current=page]{border-bottom-color:var(--gold)}
.photo-main{box-shadow:var(--shadow-lg)}
.pager-num.current{background:var(--forest)}

/* ---- footer ---- */
.site-footer{background:linear-gradient(180deg,var(--forest-d),#0b1f13);position:relative;margin-top:56px}
:root[data-theme=maroon] .site-footer{background:linear-gradient(180deg,var(--forest-d),#2a0a06)}
:root[data-theme=ink] .site-footer{background:linear-gradient(180deg,var(--forest-d),#0b0d0f)}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:repeating-linear-gradient(90deg,var(--terra) 0 14px,var(--gold) 14px 28px,#f1e2b8 28px 42px)}
.footer-grid{padding-top:12px}

@media (max-width:560px){.hero{padding:44px 0 56px}.btn{padding:11px 20px}}
@media (prefers-reduced-motion:reduce){.card:hover,.topic:hover{transform:none}.card:hover .cover,.topic:hover .cover{transform:none}}

/* route changes move focus to the page heading for screen readers; no visible box */
#app h1:focus,#app h1:focus-visible{outline:none}
#app{min-height:70vh}  /* keeps the footer from jumping while a page loads */

/* ---- hero with admin-uploaded image/video ---- */
.hero-bg{position:absolute;inset:0;z-index:0;background:#0d2619}
.hero-bg video,.hero-bg .hero-img{width:100%;height:100%;object-fit:cover;display:block}
.hero--cover{color:#fff;min-height:min(86vh,760px);display:flex;align-items:center;padding:96px 0 110px}
.hero--cover::before{z-index:1;opacity:1;background:linear-gradient(90deg,rgba(7,15,43,.82) 0%,rgba(7,15,43,.55) 48%,rgba(7,15,43,.22) 100%),linear-gradient(0deg,rgba(7,15,43,.55),transparent 40%);-webkit-mask:none;mask:none}
.hero--cover .container{z-index:2}
.hero--cover .hero-grid{grid-template-columns:minmax(0,720px)}
.hero--cover h1,.hero--cover .lead,.hero--cover .hero-stats dt{color:#fff}
.hero--cover .lead{color:rgba(255,255,255,.9)}
.hero--cover .eyebrow{color:var(--gold-l)}
.hero--cover h1 em{background:none;-webkit-text-fill-color:var(--gold-l);color:var(--gold-l)}
.hero--cover .hero-stats dd{background:none;-webkit-text-fill-color:var(--gold-l);color:var(--gold-l)}
.hero--cover .btn-ghost{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.7)}
.hero--cover .btn-ghost:hover{background:rgba(255,255,255,.28)}
.hero--cover .hero-search input{background:rgba(255,255,255,.95)}
.hero-ctl{position:absolute;right:16px;bottom:16px;display:flex;gap:8px;z-index:3}
.hero--cover .hero-ctl{right:max(16px,calc((100vw - var(--max)) / 2));bottom:22px}
.hero-ctl button{border:1px solid rgba(255,255,255,.55);background:rgba(7,15,43,.6);color:#fff;border-radius:999px;width:42px;height:42px;font-size:1rem;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero-ctl button:hover{background:rgba(7,15,43,.85)}
.hero--cover::after{z-index:3}
.hero-media .hero-ctl{right:12px;bottom:12px}
@media (max-width:560px){.hero--cover{min-height:auto;padding:64px 0 90px}.hero--cover::before{background:linear-gradient(0deg,rgba(7,15,43,.8),rgba(7,15,43,.55))}}

/* YouTube hero: cover-fit a 16:9 iframe inside the banner */
.hero-bg{container-type:size;overflow:hidden}
.hero-bg iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(100cqw,177.78cqh);height:max(100cqh,56.25cqw);border:0;pointer-events:none}
.hero-yt-link{position:absolute;right:16px;bottom:22px;z-index:3;color:#fff;background:rgba(7,15,43,.65);padding:8px 14px;border-radius:999px;text-decoration:none}
/* logo shown beside the text over the video */
.hero--cover .hero-grid{grid-template-columns:minmax(0,1fr) auto;gap:40px}
.hero--cover .hero-logo-over{justify-self:end}
.hero--cover .hero-logo-over .tharu-logo-wrapper{--s:min(360px,30vw)}
@media (max-width:1000px){.hero--cover .hero-grid{grid-template-columns:1fr}.hero--cover .hero-logo-over{justify-self:start;order:-1}.hero--cover .hero-logo-over .tharu-logo-wrapper{--s:min(200px,52vw)}}