/* ==========================================================
   GLOBAL.CSS — Abida Parveen Official Website
   Shared Design System: tokens, reset, nav, footer,
   buttons, cards, utilities, cursor, WhatsApp, reveals
   ========================================================== */

/* ─── TOKENS ─── */
:root {
  --beige:        #eed9c4;
  --ice:          #d9b99b;
  --beige-dark:   #e8e0d0;
  --beige-border: #d8cfc0;
  --gold:         #c9a84c;
  --gold-dark:    #9e7d2c;
  --gold-light:   #e0cd7e;
  --gold-glow:    #f2df90;
  --black:        #1a1a1a;
  --black-soft:   #2c2c2c;
  --black-deep:   #0f0f0f;
  --purple:       #4a2c5e;
  --purple-light: #6b4f80;
  --purple-pale:  #f0eaf6;
  --white:        #ffffff;
  --dark-purple:  #81007f;

  --glass-bg:          rgba(245,240,232,0.40);
  --glass-border:      rgba(201,168,76,0.28);
  --glass-bg-strong:   rgba(245,240,232,0.78);
  --glass-bg-dark:     rgba(26,26,26,0.82);
  --glass-border-dark: rgba(201,168,76,0.20);

  --neu-shadow:    12px 12px 24px #d1c7b8, -12px -12px 24px #ffffff;
  --neu-shadow-sm: 6px 6px 12px #d1c7b8, -6px -6px 12px #ffffff;
  --neu-inset:     inset 6px 6px 12px #d1c7b8, inset -6px -6px 12px #ffffff;

  --font-heading: 'Cormorant Garamond','Cinzel',serif;
  --font-display: 'Playfair Display',serif;
  --font-label:   'Cinzel',serif;
  --font-body:    'Raleway',sans-serif;

  --ease:         cubic-bezier(0.25,0.46,0.45,0.94);
  --ease-out:     cubic-bezier(0.16,1,0.3,1);
  --ease-elastic: cubic-bezier(0.34,1.56,0.64,1);

  --r-sm:  10px;  --r-md: 16px;
  --r-lg:  24px;  --r-xl: 32px;  --r-pill: 50px;
}

/* ─── RESET ─── */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; }
body {
  background:var(--beige); color:var(--black);
  font-family:var(--font-body); line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
/* overflow-x clipped at wrapper — overflow-x:clip does NOT create a scroll container so sticky still works */
.page-clip { overflow-x: clip; }
h1,h2,h3,h4,h5 { font-family:var(--font-heading); font-weight:500; line-height:1.2; }
h6 {
    color:#ffffff;
}
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button { cursor:pointer; font-family:var(--font-body); border:none; outline:none; }
input,select,textarea { font-family:var(--font-body); }
::-webkit-scrollbar       { width:5px; }
::-webkit-scrollbar-track { background:var(--beige); }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold-dark); }
::selection { background:rgba(201,168,76,0.25); }

/* ─── LAYOUT ─── */
.container { width:100%; max-width:1300px; margin:0 auto; padding:0 1.5rem; }
@media(max-width:768px){ .container { padding:0 1.1rem; } }

/* ─── PROGRESS BAR ─── */
#progress-bar {
  position:fixed; top:0; left:0; height:2px; width:0%;
  z-index:10001; pointer-events:none;
  background:linear-gradient(90deg,var(--purple),var(--gold),var(--gold-light));
  transition:width 0.08s linear;
}


/* ─── GOLD TEXT ─── */
.gold-text {
  background: linear-gradient(135deg, #c9a84c 0%, #e8c060 50%, #9e7d2c 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─── H2 HEADINGS — dark purple/black, accent gold only on .gold-text spans ─── */
h2 {
  background: none;
  -webkit-text-fill-color: var(--purple);
  color: var(--purple);
}

/* h2 on dark/overlay sections — use near-white so it reads */
.page-hero-content h2,
.cta-section h2,
.unesco-section h2,
.venues h2,
.jn-quote-section h2 {
  background: none;
  -webkit-text-fill-color: rgba(255,255,255,0.92);
  color: rgba(255,255,255,0.92);
}

/* ─── SECTION TAG / HEADER ─── */
.section-tag {
  display:inline-block;
  font-family:var(--font-label);
  font-size:0.72rem; letter-spacing:4px;
  color:var(--purple); text-transform:uppercase;
  margin-bottom:0.6rem; font-weight:600;
}
.section-tag.light { color:rgba(201,168,76,0.85); }
.section-tag.gold  { color:var(--gold-dark); }
.section-header { text-align:center; margin-bottom:3.5rem; }
.section-header h2 { font-size:clamp(2rem,4vw,3rem); }
@media(max-width:768px){ .section-header { margin-bottom:2.5rem; } }

/* ─── BUTTONS ─── */
.btn {
  display:inline-flex; align-items:center; gap:0.55rem;
  padding:0.88rem 2.1rem; border-radius:var(--r-pill);
  font-family:var(--font-body); font-weight:600; font-size:0.92rem;
  cursor:pointer; transition:all .38s var(--ease);
  text-decoration:none; border:none; white-space:nowrap;
  position:relative; overflow:hidden;
}
.btn-gold {
  background:linear-gradient(135deg,var(--gold) 0%,#b8943a 100%);
  color:#fff; box-shadow:0 8px 24px rgba(201,168,76,0.42);
}
.btn-gold:hover { transform:translateY(-3px); box-shadow:0 18px 34px rgba(201,168,76,0.58); }
.btn-outline { border:2px solid var(--gold); color:var(--gold); background:transparent; }
.btn-outline:hover { background:var(--gold); color:#fff; transform:translateY(-2px); }
.btn-dark { background:var(--black-soft); color:var(--beige); border:1px solid rgba(255,255,255,0.08); }
.btn-dark:hover { background:var(--purple); transform:translateY(-2px); }
.btn-white { background:var(--white); color:var(--black); }
.btn-white:hover { background:var(--ice); transform:translateY(-2px); }
.btn-lg { padding:1rem 2.7rem; font-size:1rem; }
.btn-sm { padding:0.58rem 1.35rem; font-size:0.82rem; }

/* ─── CARDS ─── */
.glass-card {
  background:var(--glass-bg);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--glass-border); border-radius:var(--r-lg);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease);
}
.glass-card:hover { transform:translateY(-5px); box-shadow:0 20px 44px rgba(0,0,0,0.10); }
.neumorph-card {
  background:var(--beige); border-radius:var(--r-lg);
  box-shadow:var(--neu-shadow);
  transition:all .38s var(--ease);
}
.neumorph-card:hover { box-shadow:var(--neu-shadow-sm); transform:translateY(-3px); }
.neumorph-frame {
  background:linear-gradient(145deg,#ffffff,#e6ddd0);
  box-shadow:var(--neu-shadow); border-radius:30px; padding:10px;
}
.neumorph-frame img { border-radius:24px; width:100%; height:auto; }

/* ─── REVEAL TARGETS (GSAP) ─── */
/* No opacity or transform here — GSAP sets start values via fromTo()
   so elements are always visible if JS is slow or fails */
[data-reveal]         { }
[data-reveal="up"]    { }
[data-reveal="left"]  { }
[data-reveal="right"] { }
[data-reveal="scale"] { }
[data-reveal="fade"]  { }

/* ─── WHATSAPP FLOAT ─── */
.wa-float {
  position:fixed; bottom:28px; right:28px;
  width:60px; height:60px; background:#25D366; color:#fff;
  border-radius:50%; font-size:28px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 25px rgba(37,211,102,0.45);
  z-index:997; animation:waPulse 2.5s infinite;
  transition:transform .3s,box-shadow .3s;
}
.wa-float:hover { transform:scale(1.12); animation:none; box-shadow:0 12px 30px rgba(37,211,102,0.62); }
@keyframes waPulse {
  0%   { box-shadow:0 0 0 0 rgba(37,211,102,0.65); }
  70%  { box-shadow:0 0 0 18px rgba(37,211,102,0); }
  100% { box-shadow:0 0 0 0 rgba(37,211,102,0); }
}
@media(max-width:480px){ .wa-float { bottom:18px; right:16px; width:52px; height:52px; font-size:24px; } }

/* ─── NAVIGATION ─── */
.nav {
  position:fixed; top:0; width:100%; z-index:999;
  background:rgba(245,240,232,0.82);
  backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
  border-bottom:1px solid rgba(201,168,76,0.12);
  transition:background .4s var(--ease),box-shadow .4s var(--ease);
}
.nav.scrolled {
  background:rgba(250,248,243,0.97);
  box-shadow:0 4px 24px rgba(0,0,0,0.08);
  border-bottom-color:rgba(201,168,76,0.22);
}
.nav-inner {
  max-width:1420px; margin:0 auto;
  display:flex; justify-content:space-between; align-items:center;
  padding:0.82rem 1.5rem;
}
.brand { display:flex; flex-direction:column; text-decoration:none; }
.brand-name {
  font-family:var(--font-heading); font-size:1.78rem; font-weight:600;
  background:linear-gradient(135deg,var(--gold),var(--gold-light),var(--gold-dark));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  line-height:1;
}
.brand-sub { font-family:var(--font-label); font-size:0.61rem; letter-spacing:3px; color:var(--purple); text-transform:uppercase; }
.nav-links { display:flex; gap:1.9rem; list-style:none; align-items:center; }
.nav-links a { font-weight:500; font-size:0.86rem; color:var(--black-soft); position:relative; transition:color .3s; padding-bottom:3px; }
.nav-links a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--gold); transition:width .32s var(--ease); border-radius:2px; }
.nav-links a:hover          { color:var(--gold-dark); }
.nav-links a:hover::after   { width:100%; }
.nav-links a.active         { color:var(--gold-dark); }
.nav-links a.active::after  { width:100%; }
.nav-links .btn             { margin-left:0.4rem; }
.nav-toggle {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; z-index:1001; padding:4px;
}
.nav-toggle span { display:block; width:26px; height:2px; background:var(--black); border-radius:2px; transition:all .35s var(--ease); }
.nav-toggle.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-toggle.active span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
@media(max-width:960px){
  .nav-toggle { display:flex; }
  .nav-links {
    position:fixed; top:0; left:0; width:100%; height:100dvh;
    background:rgba(250,248,243,0.98); backdrop-filter:blur(22px);
    flex-direction:column; justify-content:center; align-items:center; gap:2.5rem;
    transform:translateY(-110%); transition:transform .5s cubic-bezier(0.16,1,0.3,1);
    z-index:1000;
  }
  .nav-links.active { transform:translateY(0); }
  .nav-links a { font-size:1.1rem; }
  .nav-links .btn { margin:0; }
}

/* ─── PAGE HERO (inner pages) ─── */
.page-hero { position:relative; min-height:56vh; display:flex; align-items:center; overflow:hidden; }
.page-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center 25%;
  background-attachment:scroll;
  filter:brightness(0.42) saturate(0.78);
  transition:transform 6s ease;
}
.page-hero:hover .page-hero-bg { transform:scale(1.04); }
.page-hero::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(74,44,94,0.55),rgba(15,15,15,0.42));
}
.page-hero-content {
  position:relative; z-index:2;
  width:100%; max-width:1300px; margin:0 auto;
  padding:8rem 1.5rem 5rem; text-align:center;
}
.page-hero-content h1 { font-size:clamp(2.6rem,6vw,5rem); margin:0.4rem 0 1.2rem; line-height:1.08;
  background: linear-gradient(135deg, #ffffff 0%, #f5d98a 30%, #fffbf0 55%, #e8c97a 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.page-hero-content p  { font-size:1.1rem; color:rgba(255,248,230,0.92); max-width:560px; margin:0 auto; font-style:italic; font-family:var(--font-heading); text-shadow: 0 1px 8px rgba(0,0,0,0.5); }
.page-hero-content .section-tag { color: rgba(255, 230, 140, 0.95); }
.page-hero-breadcrumb {
  position:absolute; bottom:20px; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; align-items:center; gap:0.4rem;
  font-size:0.74rem; color:rgba(255,255,255,0.42);
  font-family:var(--font-label); letter-spacing:1.5px;
}
.page-hero-breadcrumb a    { color:rgba(201,168,76,0.75); transition:color .3s; }
.page-hero-breadcrumb a:hover { color:var(--gold); }
.page-hero-breadcrumb .sep { opacity:0.38; }

/* ─── SHARED CTA SECTION ─── */
.cta-section {
  padding:6rem 0; text-align:center;
  background:linear-gradient(135deg,var(--purple) 0%,var(--black-soft) 100%);
  position:relative; overflow:hidden;
}
.cta-section::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 70% at 50% 50%,rgba(201,168,76,0.09),transparent);
}
.cta-section .section-tag.light { display:block; }
.cta-section h2 { font-size:clamp(2rem,4vw,3.2rem); color:var(--ice); margin:.5rem 0 1.4rem; }
.cta-section p  { color:rgba(250,248,240,0.62); max-width:520px; margin:0 auto 2.5rem; font-size:1.05rem; font-style:italic; font-family:var(--font-heading); }
.cta-section .btn-row { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.cta-note { margin-top:1.1rem; font-size:0.72rem; color:rgba(255,255,255,0.26); letter-spacing:2px; font-family:var(--font-label); text-transform:uppercase; }

/* ─── FOOTER ─── */

.footer { 
    background:var(--dark-purple);
    padding:4rem 0 0; 
    border-top:1px solid rgba(201,168,76,0.1);
}
.footer-grid {
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr;
  gap:3rem; padding-bottom:3rem;
  border-bottom:1px solid rgba(255,255,255,0.07); margin-bottom:0;
}
.footer-brand h3 {
  font-family:var(--font-heading); font-size:1.65rem;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  margin-bottom:.7rem;
}
.footer-brand p { font-size:.95rem; color:rgba(255,255,255,0.82); line-height:1.7; margin-bottom:1.4rem; }
.footer-social  { display:flex; gap:.6rem; }
.footer-social a {
  width:36px; height:36px; border:1px solid rgba(201,168,76,0.22); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.75); font-size:.84rem; transition:all .3s;
}
.footer-social a:hover { background:var(--gold); color:var(--black); border-color:var(--gold); transform:translateY(-2px); }
.footer-links h4 { font-family:var(--font-label); font-size:.72rem; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:1.1rem; }
.footer-links ul { list-style:none; }
.footer-links ul li { margin-bottom:.6rem; }
.footer-links ul a { font-size:.92rem; color:rgba(255,255,255,0.88); transition:all .3s; }
.footer-links ul a:hover { color:var(--gold-light); padding-left:4px; }
.footer-contact-item { display:flex; align-items:flex-start; gap:.65rem; margin-bottom:.72rem; }
.footer-contact-item i { color:var(--gold); margin-top:3px; font-size:.9rem; flex-shrink:0; }
.footer-contact-item span { font-size:.9rem; color:rgba(255,255,255,0.82); line-height:1.55; }
.footer-bottom { padding:1.5rem 1.5rem; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { font-size:.84rem; color:rgba(255,255,255,0.88); }
.footer-bottom-links { display:flex; gap:1.4rem; }
.footer-bottom-links a { font-size:.82rem; color:rgba(255,255,255,0.75); transition:color .3s; }
.footer-bottom-links a:hover { color:var(--gold); }
@media(max-width:960px){ .footer-grid { grid-template-columns:1fr 1fr; gap:2rem; } }
@media(max-width:580px){
  .footer-grid { grid-template-columns:1fr; text-align:center; }
  .footer-brand p { font-size:1rem; }
  .footer-links ul a { font-size:1rem; }
  .footer-contact-item { justify-content:center; }
  .footer-contact-item span { font-size:.95rem; }
  .footer-social { justify-content:center; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .footer-bottom p { font-size:.88rem; }
  .footer-bottom-links { justify-content:center; }
  .footer-bottom-links a { font-size:.86rem; }
}

/* ─── FORM SUCCESS STATE ─── */
.form-success-msg {
  display:flex; align-items:center; gap:.75rem;
  background:rgba(34,197,94,0.1); border:1px solid rgba(34,197,94,0.3);
  border-radius:var(--r-md); padding:.95rem 1.2rem;
  color:#15803d; font-weight:600; margin-top:1rem; font-size:.93rem;
}
.form-success-msg i { font-size:1.15rem; flex-shrink:0; }

/* ─── KEYFRAMES ─── */
@keyframes float      { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes gradShift  { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
@keyframes pulseGold  { 0%,100%{box-shadow:0 0 0 0 rgba(201,168,76,.5)} 50%{box-shadow:0 0 0 14px rgba(201,168,76,0)} }

/* ═══════════════════════════════════════════════════════
   PRELOADER — Dual-Ring Spinner (Gold + Purple)
═══════════════════════════════════════════════════════ */
#preloader {
  position:fixed; inset:0; z-index:99999;
  background: var(--beige);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:2rem;
  transition:opacity .6s ease, visibility .6s ease;
}
#preloader.hidden { opacity:0; visibility:hidden; pointer-events:none; }

.preloader-scene {
  position: relative;
  width: 100px; height: 100px;
  display: flex; align-items: center; justify-content: center;
}

/* Outer ring — gold */
.preloader-ring-outer {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 4px solid transparent;
  border-top-color: var(--gold);
  border-right-color: var(--gold-light);
  animation: ringSpinOuter 1.1s cubic-bezier(0.6,0.2,0.4,0.8) infinite;
  box-shadow: 0 0 14px rgba(201,168,76,0.35);
}

/* Inner ring — purple, counter-spin */
.preloader-ring-inner {
  position: absolute;
  inset: 14px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: var(--purple);
  border-left-color: var(--purple-light);
  animation: ringSpinInner 0.85s cubic-bezier(0.6,0.2,0.4,0.8) infinite reverse;
  box-shadow: 0 0 10px rgba(74,44,94,0.25);
}

/* Centre dot — gold */
.preloader-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle, var(--gold-light), var(--gold));
  box-shadow: 0 0 8px rgba(201,168,76,0.7);
  animation: dotPulse 1.1s ease-in-out infinite alternate;
}

@keyframes ringSpinOuter {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes ringSpinInner {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes dotPulse {
  0%   { transform: scale(0.8); opacity: 0.6; }
  100% { transform: scale(1.2); opacity: 1; }
}

.preloader-text {
  font-family:var(--font-label); font-size:.72rem; letter-spacing:6px;
  color: var(--purple); text-transform:uppercase;
  opacity: 0.75;
}
.preloader-dots { animation:dotTextPulse 1.2s steps(3,end) infinite; }
@keyframes dotTextPulse { 0%{content:'.'} 33%{content:'..'} 66%{content:'...'} }

/* ═══════════════════════════════════════════════════════
   DARK MODE — CSS variable overrides
═══════════════════════════════════════════════════════ */
[data-theme="dark"] {
  --beige:        #1a1614;
  --ice:          #211e1b;
  --beige-dark:   #2a2420;
  --beige-border: #3d352c;
  --black:        #f0ebe0;
  --black-soft:   #d4ccbc;
  --black-deep:   #0f0d0b;
  --white:        #1a1614;
  --purple-pale:  #2a1f35;
  --glass-bg:          rgba(30,24,20,0.72);
  --glass-border:      rgba(201,168,76,0.22);
  --glass-bg-strong:   rgba(30,24,20,0.92);
  --neu-shadow:    12px 12px 24px #0e0c0a, -12px -12px 24px #2e2620;
  --neu-shadow-sm: 6px 6px 12px #0e0c0a, -6px -6px 12px #2e2620;
  --neu-inset:     inset 6px 6px 12px #0e0c0a, inset -6px -6px 12px #2e2620;
}

/* Dark mode — targeted component fixes */
[data-theme="dark"] body { background:var(--beige); }
[data-theme="dark"] .nav { background:rgba(20,16,12,0.88); border-bottom-color:rgba(201,168,76,0.14); }
[data-theme="dark"] .nav.scrolled { background:rgba(18,14,10,0.97); }
[data-theme="dark"] .nav-links { background:rgba(20,16,12,0.98); }
[data-theme="dark"] .nav-links a { color:var(--black-soft); }
[data-theme="dark"] .nav-toggle span { background:var(--black-soft); }
[data-theme="dark"] .neumorph-card { background:var(--beige); }
[data-theme="dark"] .neumorph-frame { background:linear-gradient(145deg,#2e2620,#1a1614); }
[data-theme="dark"] footer.footer { background:#0f0d0b; }
[data-theme="dark"] ::-webkit-scrollbar-track { background:var(--beige); }

/* ═══════════════════════════════════════════════════════
   THEME TOGGLE BUTTON
═══════════════════════════════════════════════════════ */
.nav-actions {
  display:flex; align-items:center; gap:0.5rem;
}
.theme-toggle {
  width:38px; height:38px; border-radius:50%;
  background:rgba(201,168,76,0.10);
  border:1.5px solid rgba(201,168,76,0.30);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold-dark); cursor:pointer;
  transition:background .3s, border-color .3s, transform .3s, color .3s;
  flex-shrink:0;
}
.theme-toggle:hover { background:rgba(201,168,76,0.22); border-color:var(--gold); transform:scale(1.1); }
/* Dark mode h2 — gold so it reads on dark background */
[data-theme="dark"] h2 { -webkit-text-fill-color: var(--gold-light) !important; color: var(--gold-light) !important; background: none !important; }
[data-theme="dark"] .law-trust-intro h2 { -webkit-text-fill-color: var(--gold-light) !important; color: var(--gold-light) !important; }
[data-theme="dark"] .ap-content-col h2 { -webkit-text-fill-color: rgba(255,255,255,0.92) !important; color: rgba(255,255,255,0.92) !important; }
[data-theme="dark"] .theme-toggle { background:rgba(201,168,76,0.12); border-color:rgba(201,168,76,0.35); color:var(--gold); }
[data-theme="dark"] .theme-toggle:hover { background:rgba(201,168,76,0.25); }

/* show/hide sun vs moon icon based on theme */
.theme-icon-dark  { display:none; }
.theme-icon-light { display:flex; }
[data-theme="dark"] .theme-icon-dark  { display:flex; }
[data-theme="dark"] .theme-icon-light { display:none; }

/* Desktop toggle li — shows toggle right after Book Event in the nav */
.nav-toggle-desktop-li {
  display: flex;
  align-items: center;
  list-style: none;
}

@media(max-width:960px){
  .nav-actions { order:1; }
  .theme-toggle { width:34px; height:34px; }
  /* Hide desktop toggle li on mobile — it lives inside hamburger menu instead */
  .nav-toggle-desktop-li { display: none !important; }
  .theme-toggle-desktop { display:none !important; }
}

/* ═══════════════════════════════════════════════════════
   DIAGONAL CORNER CURTAIN — Page Transition
   TL + BR triangles meet exactly at centre diagonal.
═══════════════════════════════════════════════════════ */
#page-curtain {
  position: fixed; inset: 0;
  z-index: 99998;
  pointer-events: none;
}
.curtain-panel {
  position: absolute; inset: 0;
  will-change: clip-path;
  transition: clip-path 0.78s cubic-bezier(0.76, 0, 0.24, 1);
}
.curtain-tl { background: linear-gradient(135deg, #f5ead0 0%, #eddcb8 40%, #e4cea0 100%); }
.curtain-br { background: linear-gradient(315deg, #f5ead0 0%, #eddcb8 40%, #e4cea0 100%); }

/* OPEN — retracted to corners */
#page-curtain.curtain-open .curtain-tl { clip-path: polygon(0 0, 0 0, 0 0); }
#page-curtain.curtain-open .curtain-br { clip-path: polygon(100% 100%, 100% 100%, 100% 100%); }

/* CLOSING — meet precisely at centre diagonal */
#page-curtain.curtain-closing .curtain-tl { clip-path: polygon(0 0, 100% 0, 0 100%); }
#page-curtain.curtain-closing .curtain-br { clip-path: polygon(100% 100%, 0 100%, 100% 0); }

#page-curtain.curtain-closing { pointer-events: all; }

/* ═══════════════════════════════════════════════════════
   MOBILE NAV EXTRAS — Theme toggle + Social icons
═══════════════════════════════════════════════════════ */
.nav-mobile-extras {
  display: none; /* hidden on desktop */
  flex-direction: column;
  align-items: center;
  gap: 1.4rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(201,168,76,0.18);
  width: 100%;
  max-width: 280px;
}
@media(max-width:960px){
  .nav-mobile-extras { display: flex; }
}

.theme-toggle-mobile {
  display: flex; align-items: center; gap: 0.7rem;
  background: rgba(201,168,76,0.1);
  border: 1.5px solid rgba(201,168,76,0.3);
  border-radius: var(--r-pill);
  padding: 0.6rem 1.4rem;
  color: var(--gold-dark);
  font-family: var(--font-label);
  font-size: 0.72rem; letter-spacing: 2px; text-transform: uppercase;
  cursor: pointer; transition: all 0.3s;
  width: auto;
  height: auto;
}
.theme-toggle-mobile:hover { background: rgba(201,168,76,0.22); border-color: var(--gold); }
.theme-toggle-label { font-size: 0.68rem; letter-spacing: 2px; }

.nav-mobile-social {
  display: flex; gap: 1rem; align-items: center; justify-content: center;
}
.nav-mobile-social a {
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(201,168,76,0.28);
  display: flex; align-items: center; justify-content: center;
  color: var(--black-soft); font-size: 1rem;
  transition: all 0.3s;
}
.nav-mobile-social a:hover { background: var(--gold); color: #fff; border-color: var(--gold); }
/* dark mode */
[data-theme="dark"] .theme-toggle-mobile { color: var(--gold); }
[data-theme="dark"] .nav-mobile-social a { color: var(--black-soft); }

/* ═══════════════════════════════════════════════════════
   FOOTER CONTACT ITEMS — clickable link styles
═══════════════════════════════════════════════════════ */
.footer-contact-item a {
  display: flex; align-items: flex-start; gap: 0.65rem;
  text-decoration: none; transition: color 0.3s;
}
.footer-contact-item a i  { color: var(--gold); margin-top: 3px; font-size: .9rem; flex-shrink: 0; }
.footer-contact-item a span { font-size: .9rem; color: rgba(255,255,255,0.82); line-height: 1.55; }
.footer-contact-item a:hover span { color: var(--gold-light); }
.footer-contact-item a:hover i    { color: var(--gold-light); }

/* ═══════════════════════════════════════════════════════
   AP ENTERTAINMENTS SECTION
═══════════════════════════════════════════════════════ */
.ap-section {
  padding: 100px 24px 110px;
  background: linear-gradient(160deg, var(--purple) 0%, #2e1245 50%, var(--black-deep) 100%);
  position: relative; overflow: hidden;
}
.ap-section::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 10% 50%, rgba(201,168,76,0.09), transparent),
    radial-gradient(ellipse 40% 60% at 90% 30%, rgba(201,168,76,0.06), transparent);
  pointer-events: none;
}
.ap-inner {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1.6fr; gap: 80px;
  align-items: center; position: relative; z-index: 1;
}
.ap-logo-col { display: flex; justify-content: center; align-items: center; }
.ap-logo-wrap {
  width: 280px; height: 280px;
  border-radius: 50%;
  border: 2px solid rgba(201,168,76,0.3);
  box-shadow:
    0 0 0 8px rgba(201,168,76,0.07),
    0 0 0 16px rgba(201,168,76,0.04),
    0 24px 60px rgba(0,0,0,0.4);
  overflow: hidden;
  transition: box-shadow 0.5s ease, transform 0.5s ease;
}
.ap-logo-wrap:hover {
  transform: scale(1.03);
  box-shadow:
    0 0 0 10px rgba(201,168,76,0.12),
    0 0 0 20px rgba(201,168,76,0.06),
    0 32px 80px rgba(0,0,0,0.5);
}
.ap-logo-img { width: 100%; height: 100%; object-fit: cover; display: block; }

.ap-content-col .section-tag { color: rgba(201,168,76,0.85); margin-bottom: 1rem; display: block; }
.ap-content-col h2 {
  font-size: clamp(2.2rem, 4vw, 3.2rem); margin-bottom: 0.4rem;
  background: none !important;
  -webkit-text-fill-color: rgba(255,255,255,0.92) !important;
  color: rgba(255,255,255,0.92);
}
.ap-content-col h2 .gold-text {
  background: linear-gradient(135deg, #c9a84c 0%, #e8c060 50%, #9e7d2c 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.ap-tagline {
  font-family: var(--font-heading);
  font-style: italic;
  color: rgba(201,168,76,0.7);
  font-size: 1.05rem;
  margin-bottom: 1.4rem;
  letter-spacing: 0.03em;
}
.ap-desc {
  color: rgba(255,248,235,0.72);
  line-height: 1.82; font-size: 0.96rem;
  margin-bottom: 2rem;
  max-width: 560px;
}
.ap-details { display: flex; flex-direction: column; gap: 0.85rem; }
.ap-detail-item {
  display: flex; align-items: center; gap: 0.75rem;
  font-size: 0.9rem;
}
.ap-detail-item i { color: var(--gold); font-size: 0.85rem; width: 16px; flex-shrink: 0; }
.ap-detail-item a { color: rgba(255,248,235,0.8); text-decoration: none; transition: color 0.3s; }
.ap-detail-item a:hover { color: var(--gold-light); }
.ap-detail-item span { color: rgba(255,248,235,0.65); }
.ap-sep { color: rgba(201,168,76,0.4); margin: 0 0.3rem; }

@media(max-width:900px){
  .ap-inner { grid-template-columns: 1fr; gap: 48px; text-align: center; }
  .ap-logo-wrap { width: 200px; height: 200px; margin: 0 auto; }
  .ap-desc { max-width: 100%; }
  .ap-detail-item { justify-content: center; }
}

/* ─── FONT DISPLAY SWAP (improves FCP when fonts load slowly) ─── */
@font-face {
  font-display: swap;
}

/* ─── YOUTUBE FACADE ─── */
.yt-facade {
  position: relative;
  width: 100%;
  height: 100%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
}
.yt-facade img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.85;
  transition: opacity 0.3s;
}
.yt-facade:hover img { opacity: 0.7; }
.yt-play-btn {
  position: relative;
  z-index: 2;
  transition: transform 0.3s;
  filter: drop-shadow(0 4px 20px rgba(0,0,0,0.5));
}
.yt-facade:hover .yt-play-btn { transform: scale(1.12); }