:root {
  --bg:        #120e00;
  --bg-2:      #1a1500;
  --surface:   #221b00;
  --card:      #2a2100;
  --card-2:    #322800;
  --border:    #3a3000;
  --border-2:  #4a3e08;
  --text:      #f5e6b8;
  --text-2:    #d4b878;
  --muted:     #a07840;
  --gold:      #f0c040;
  --gold-2:    #ffd76a;
  --gold-dark: #c8960c;
  --gold-deep: #a07808;
  --ink:       #1a1500;
  --shadow-a:  rgba(0,0,0,0.45);
}
html[data-theme="light"] {
  --bg:        #fbf3dc;
  --bg-2:      #f5e9c8;
  --surface:   #f0e0ae;
  --card:      #ffffff;
  --card-2:    #fdf6e3;
  --border:    #e0cc90;
  --border-2:  #d0b868;
  --text:      #2a1f00;
  --text-2:    #5a4410;
  --muted:     #8a6a2a;
  --gold:      #c8960c;
  --gold-2:    #a97a08;
  --gold-dark: #9e7208;
  --gold-deep: #7a5806;
  --ink:       #ffffff;
  --shadow-a:  rgba(120,90,20,0.14);
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background: var(--bg);
  color: var(--text);
  font-family:'Inter',sans-serif;
  font-size:15.5px;
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  transition:background 0.35s ease, color 0.35s ease;
}
::selection { background:var(--gold); color:var(--ink); }
::-webkit-scrollbar { width:10px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--border-2); border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold-dark); }

/* ═══════ PAGE LOADER ═══════ */
#page-loader {
  position:fixed; inset:0; z-index:9999;
  background:var(--bg);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px;
  transition:opacity 0.6s ease, visibility 0.6s;
}
#page-loader.hide { opacity:0; visibility:hidden; pointer-events:none; }
.loader-mark {
  width:64px; height:64px;
  position:relative;
}
.loader-mark svg { width:100%; height:100%; animation:spin 2.2s linear infinite; }
.loader-word {
  font-family:'Cinzel',serif;
  font-size:1.1rem;
  font-weight:600;
  letter-spacing:0.3em;
  color:var(--gold);
  opacity:0.9;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* ═══════ THEME + UTIL BUTTONS ═══════ */
.util-bar {
  position:fixed; top:18px; right:18px; z-index:300;
  display:flex; gap:8px;
}
.util-btn {
  width:40px; height:40px;
  border-radius:50%;
  background:rgba(20,16,0,0.55);
  border:1px solid var(--border-2);
  backdrop-filter:blur(10px);
  color:var(--gold);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  font-size:1.05rem;
  transition:transform 0.25s, border-color 0.25s, background 0.25s;
}
html[data-theme="light"] .util-btn { background:rgba(255,255,255,0.6); }
.util-btn:hover { transform:scale(1.08); border-color:var(--gold-dark); }
.util-btn:active { transform:scale(0.95); }

/* ═══════════ HERO ═══════════ */
.hero {
  position:relative;
  min-height:88vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:70px 20px 90px;
  overflow:hidden;
  background:
    radial-gradient(ellipse 90% 60% at 50% -10%, rgba(240,192,64,0.13), transparent 60%),
    radial-gradient(ellipse 60% 45% at 50% 110%, rgba(200,150,12,0.10), transparent 65%),
    var(--bg);
}
.mandala-wrap {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-56%);
  width:min(88vw, 720px); height:min(88vw, 720px);
  pointer-events:none;
  opacity:0.75;
}
html[data-theme="light"] .mandala-wrap { opacity:0.5; }
.mandala { width:100%; height:100%; animation:spin 160s linear infinite; }
.mandala-inner { position:absolute; inset:12%; animation:spinRev 110s linear infinite; }
.mandala-inner svg { width:100%; height:100%; }
@keyframes spinRev { to { transform:rotate(-360deg); } }

.dust { position:absolute; inset:0; pointer-events:none; }
.dust span {
  position:absolute;
  width:3px; height:3px;
  background:var(--gold);
  border-radius:50%;
  opacity:0;
  animation:rise linear infinite;
}
@keyframes rise {
  0%   { transform:translateY(0) scale(0.6); opacity:0; }
  12%  { opacity:0.85; }
  85%  { opacity:0.25; }
  100% { transform:translateY(-92vh) scale(1.1); opacity:0; }
}

.hero-content { position:relative; z-index:3; max-width:820px; }
.hero-eyebrow {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:clamp(1rem, 2.4vw, 1.25rem);
  color:var(--text-2);
  letter-spacing:0.22em;
  opacity:0;
  animation:fadeUp 1s ease 0.25s forwards;
}
.hero-title {
  font-family:'Cinzel',serif;
  font-size:clamp(3.4rem, 12vw, 7.2rem);
  font-weight:800;
  line-height:1.02;
  margin:10px 0 4px;
  background:linear-gradient(178deg, var(--gold-2) 8%, var(--gold) 42%, var(--gold-dark) 88%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 4px 30px rgba(240,192,64,0.28));
  opacity:0;
  animation:fadeUp 1.1s ease 0.45s forwards;
}
.hero-divider {
  display:flex; align-items:center; justify-content:center; gap:14px;
  margin:22px auto 20px;
  opacity:0;
  animation:fadeUp 1s ease 0.7s forwards;
}
.hero-divider .line { height:1px; width:min(140px,26vw); background:linear-gradient(90deg, transparent, var(--gold-dark)); }
.hero-divider .line:last-child { background:linear-gradient(90deg, var(--gold-dark), transparent); }
.hero-divider .gem {
  width:9px; height:9px;
  background:var(--gold);
  transform:rotate(45deg);
  box-shadow:0 0 14px rgba(240,192,64,0.75);
}
.hero-sub {
  font-size:clamp(0.95rem, 2vw, 1.1rem);
  color:var(--text-2);
  max-width:560px;
  margin:0 auto;
  font-weight:300;
  letter-spacing:0.04em;
  opacity:0;
  animation:fadeUp 1s ease 0.9s forwards;
}
.hero-cta {
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap;
  margin-top:38px;
  opacity:0;
  animation:fadeUp 1s ease 1.15s forwards;
}
.btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:14px 30px;
  border-radius:100px;
  font-family:'Inter',sans-serif;
  font-size:0.9rem; font-weight:600;
  letter-spacing:0.05em;
  text-decoration:none;
  cursor:pointer;
  border:none;
  transition:transform 0.25s cubic-bezier(.34,1.56,.64,1), box-shadow 0.25s;
}
.btn-gold {
  background:linear-gradient(135deg, var(--gold-2), var(--gold-dark));
  color:var(--ink);
  box-shadow:0 8px 30px rgba(240,192,64,0.32), inset 0 1px 0 rgba(255,255,255,0.35);
}
.btn-gold:hover { transform:translateY(-3px) scale(1.02); box-shadow:0 14px 42px rgba(240,192,64,0.45); }
.btn-ghost {
  background:rgba(240,192,64,0.06);
  color:var(--gold);
  border:1px solid var(--border-2);
  backdrop-filter:blur(6px);
}
.btn-ghost:hover { transform:translateY(-3px); border-color:var(--gold-dark); background:rgba(240,192,64,0.12); }
.btn-play {
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border-2);
}
.btn-play:hover { transform:translateY(-3px); border-color:var(--gold-dark); }
.btn-play svg { width:20px; height:20px; flex-shrink:0; }

.hero-stats {
  display:flex; gap:34px; justify-content:center; flex-wrap:wrap;
  margin-top:34px;
  opacity:0;
  animation:fadeUp 1s ease 1.35s forwards;
}
.stat { text-align:center; }
.stat-num {
  font-family:'Cinzel',serif;
  font-size:1.7rem; font-weight:700;
  color:var(--gold);
}
.stat-label {
  font-size:0.68rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--muted);
  margin-top:2px;
}

.scroll-hint {
  position:absolute; bottom:26px; left:50%; transform:translateX(-50%);
  z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:6px;
  color:var(--muted); font-size:0.7rem; letter-spacing:0.28em; text-transform:uppercase;
  opacity:0; animation:fadeUp 1s ease 1.6s forwards;
}
.scroll-hint .wheel {
  width:22px; height:36px;
  border:1.5px solid var(--border-2);
  border-radius:12px;
  position:relative;
}
.scroll-hint .wheel::after {
  content:''; position:absolute; top:7px; left:50%; transform:translateX(-50%);
  width:3px; height:7px; background:var(--gold); border-radius:2px;
  animation:wheelDot 1.8s ease infinite;
}
@keyframes wheelDot { 0%{opacity:1;top:7px;} 70%{opacity:0;top:19px;} 100%{opacity:0;top:7px;} }
@keyframes fadeUp { from { opacity:0; transform:translateY(26px); } to { opacity:1; transform:translateY(0); } }

.meander {
  height:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24' viewBox='0 0 48 24'%3E%3Cpath d='M0 4 h36 v16 h-24 v-8 h12' fill='none' stroke='%23c8960c' stroke-width='2.4' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat:repeat-x;
  background-position:center;
  background-size:48px 24px;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background-color:var(--bg-2);
}

nav {
  position:sticky; top:0; z-index:200;
  background:rgba(18,14,0,0.82);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid var(--border);
  display:flex; justify-content:center;
  overflow-x:auto;
  scrollbar-width:none;
}
html[data-theme="light"] nav { background:rgba(251,243,220,0.86); }
nav::-webkit-scrollbar { display:none; }
.tab-btn {
  padding:17px 26px;
  background:none; border:none;
  color:var(--muted);
  font-family:'Cinzel',serif;
  font-size:0.82rem; font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  white-space:nowrap;
  position:relative;
  transition:color 0.25s;
  display:inline-block;
}
.tab-btn::after {
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:0; height:2px;
  background:linear-gradient(90deg, var(--gold-2), var(--gold-dark));
  transition:width 0.32s cubic-bezier(.4,0,.2,1);
  box-shadow:0 0 12px rgba(240,192,64,0.6);
}
.tab-btn:hover { color:var(--text-2); }
.tab-btn.active { color:var(--gold); }
.tab-btn.active::after { width:64%; }

.tab-pane { padding:64px 22px 90px; max-width:760px; margin:0 auto; animation:paneIn 0.5s cubic-bezier(.22,1,.36,1); }
@keyframes paneIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

.section-eyebrow {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  color:var(--muted);
  font-size:1.05rem;
  letter-spacing:0.16em;
  text-align:center;
}
.section-heading {
  font-family:'Cinzel',serif;
  font-size:clamp(1.7rem, 5vw, 2.3rem);
  font-weight:700;
  text-align:center;
  margin:4px 0 8px;
  background:linear-gradient(180deg, var(--gold-2), var(--gold-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.section-desc { color:var(--muted); font-size:0.92rem; text-align:center; margin-bottom:14px; }
.section-ornament {
  display:flex; align-items:center; justify-content:center; gap:12px;
  margin:0 auto 42px;
}
.section-ornament .line { height:1px; width:70px; background:linear-gradient(90deg, transparent, var(--border-2)); }
.section-ornament .line:last-child { background:linear-gradient(90deg, var(--border-2), transparent); }
.section-ornament .dot { width:6px; height:6px; background:var(--gold-dark); transform:rotate(45deg); }

.reveal { opacity:0; transform:translateY(26px); transition:opacity 0.7s ease, transform 0.7s cubic-bezier(.22,1,.36,1); }
.reveal.in { opacity:1; transform:translateY(0); }

.form-card {
  background:linear-gradient(180deg, var(--card) 0%, var(--surface) 100%);
  border:1px solid var(--border);
  border-radius:20px;
  padding:34px 30px;
  position:relative;
  box-shadow:0 24px 60px var(--shadow-a), inset 0 1px 0 rgba(240,192,64,0.06);
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:560px){ .form-row { grid-template-columns:1fr; } }
.form-group { margin-bottom:20px; }
label {
  display:block;
  font-family:'Cinzel',serif;
  color:var(--text-2);
  font-size:0.72rem;
  font-weight:600;
  letter-spacing:0.18em;
  text-transform:uppercase;
  margin-bottom:9px;
}
input, textarea, select {
  width:100%;
  background:var(--bg);
  border:1px solid var(--border);
  color:var(--text);
  padding:14px 16px;
  border-radius:12px;
  font-family:'Inter',sans-serif;
  font-size:0.92rem;
  outline:none;
  transition:border-color 0.25s, box-shadow 0.25s, background 0.25s;
  appearance:none;
}
input::placeholder, textarea::placeholder { color:var(--muted); opacity:0.6; }
input:focus, textarea:focus, select:focus {
  border-color:var(--gold-dark);
  box-shadow:0 0 0 4px rgba(240,192,64,0.10), 0 0 24px rgba(240,192,64,0.08);
}
select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23f0c040' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  padding-right:40px;
  cursor:pointer;
}
select option { background:var(--card); color:var(--text); }
textarea { resize:vertical; min-height:140px; }
.submit-btn {
  width:100%;
  padding:16px;
  background:linear-gradient(135deg, var(--gold-2) 0%, var(--gold) 45%, var(--gold-dark) 100%);
  background-size:200% 200%;
  color:var(--ink);
  border:none;
  border-radius:12px;
  font-family:'Cinzel',serif;
  font-size:0.92rem; font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  cursor:pointer;
  margin-top:6px;
  transition:background-position 0.5s, transform 0.2s, box-shadow 0.3s;
  box-shadow:0 10px 30px rgba(240,192,64,0.25), inset 0 1px 0 rgba(255,255,255,0.4);
}
.submit-btn:hover { background-position:100% 100%; transform:translateY(-2px); box-shadow:0 16px 42px rgba(240,192,64,0.4); }
.submit-btn:active { transform:translateY(0) scale(0.99); }
.submit-btn:disabled { opacity:0.55; cursor:not-allowed; transform:none; }
.direct-email { text-align:center; color:var(--muted); font-size:0.85rem; margin-top:22px; }
.direct-email a { color:var(--gold); text-decoration:none; border-bottom:1px dotted var(--gold-dark); padding-bottom:1px; transition:color 0.2s; }
.direct-email a:hover { color:var(--gold-2); }
.msg { padding:14px 18px; border-radius:12px; margin-bottom:22px; font-size:0.88rem; display:none; animation:paneIn 0.4s ease; }
.msg.success { background:rgba(60,110,0,0.16); border:1px solid #3a5010; color:#a8d060; }
.msg.error   { background:rgba(120,30,0,0.16);  border:1px solid #5a2010; color:#e08050; }

.faq-item {
  background:linear-gradient(180deg, var(--card), var(--surface));
  border:1px solid var(--border);
  border-radius:14px;
  margin-bottom:12px;
  overflow:hidden;
  transition:border-color 0.3s, box-shadow 0.3s;
}
.faq-item:hover { border-color:var(--border-2); }
.faq-item.open { border-color:var(--gold-dark); box-shadow:0 8px 32px rgba(240,192,64,0.10); }
.faq-q {
  padding:19px 20px;
  cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:14px;
  color:var(--text);
  font-weight:500;
  font-size:0.94rem;
  user-select:none;
  transition:color 0.2s;
}
.faq-q:hover { color:var(--gold-2); }
.faq-item.open .faq-q { color:var(--gold); }
.faq-num {
  font-family:'Cinzel',serif;
  color:var(--gold-dark);
  font-size:0.8rem;
  font-weight:700;
  min-width:26px;
  opacity:0.85;
}
.faq-q-text { flex:1; }
.faq-toggle {
  width:26px; height:26px; flex-shrink:0;
  border:1px solid var(--border-2);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--gold);
  font-size:1rem;
  transition:transform 0.35s cubic-bezier(.34,1.56,.64,1), background 0.3s, color 0.3s;
}
.faq-item.open .faq-toggle { transform:rotate(135deg); background:var(--gold); color:var(--ink); border-color:var(--gold); }
.faq-a {
  color:var(--text-2);
  font-size:0.89rem;
  font-weight:300;
  line-height:1.8;
  max-height:0;
  overflow:hidden;
  transition:max-height 0.4s cubic-bezier(.22,1,.36,1), padding 0.4s;
  padding:0 20px 0 66px;
}
.faq-item.open .faq-a { max-height:400px; padding:0 20px 20px 66px; }
@media (max-width:520px){ .faq-a { padding-left:20px; } .faq-item.open .faq-a { padding-left:20px; } }

.help-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:16px; }
.help-card {
  background:linear-gradient(160deg, var(--card) 0%, var(--surface) 100%);
  border:1px solid var(--border);
  border-radius:18px;
  padding:26px 24px;
  position:relative;
  overflow:hidden;
  transition:transform 0.35s cubic-bezier(.22,1,.36,1), border-color 0.3s, box-shadow 0.35s;
}
.help-card::after {
  content:'';
  position:absolute; top:-45px; right:-45px;
  width:130px; height:130px;
  border:1.5px solid rgba(240,192,64,0.10);
  border-radius:50%;
  transition:transform 0.5s ease, border-color 0.4s;
}
.help-card:hover { transform:translateY(-5px); border-color:var(--gold-dark); box-shadow:0 20px 48px var(--shadow-a), 0 0 32px rgba(240,192,64,0.07); }
.help-card:hover::after { transform:scale(1.25) rotate(20deg); border-color:rgba(240,192,64,0.28); }
.help-card-header { display:flex; align-items:center; gap:13px; margin-bottom:13px; position:relative; z-index:1; }
.help-icon-wrap {
  width:46px; height:46px; flex-shrink:0;
  border-radius:13px;
  background:linear-gradient(135deg, rgba(240,192,64,0.16), rgba(200,150,12,0.07));
  border:1px solid var(--border-2);
  display:flex; align-items:center; justify-content:center;
  font-size:1.35rem;
}
.help-card h3 {
  font-family:'Cinzel',serif;
  color:var(--gold);
  font-size:0.98rem;
  font-weight:600;
  letter-spacing:0.04em;
}
.help-card p { color:var(--text-2); font-size:0.87rem; font-weight:300; line-height:1.75; position:relative; z-index:1; }
.help-card p + p { margin-top:8px; }

.terms-wrap { position:relative; padding-left:34px; }
.terms-wrap::before {
  content:'';
  position:absolute; left:8px; top:8px; bottom:8px;
  width:1px;
  background:linear-gradient(180deg, var(--gold-dark), var(--border) 55%, transparent);
}
.terms-section { margin-bottom:36px; position:relative; }
.terms-section::before {
  content:'';
  position:absolute; left:-30.5px; top:7px;
  width:8px; height:8px;
  background:var(--gold);
  transform:rotate(45deg);
  box-shadow:0 0 10px rgba(240,192,64,0.55);
}
.terms-section h3 {
  font-family:'Cinzel',serif;
  color:var(--gold);
  font-size:1rem;
  font-weight:600;
  letter-spacing:0.05em;
  margin-bottom:10px;
}
.terms-section p { color:var(--text-2); font-size:0.89rem; font-weight:300; line-height:1.85; margin-bottom:9px; }
.terms-section a { color:var(--gold); text-decoration:none; border-bottom:1px dotted var(--gold-dark); }
.terms-date {
  text-align:center;
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  color:var(--muted);
  font-size:0.95rem;
  margin-bottom:40px;
}

footer {
  border-top:1px solid var(--border);
  padding:44px 20px 30px;
  text-align:center;
  background:
    radial-gradient(ellipse 70% 100% at 50% 100%, rgba(240,192,64,0.05), transparent 65%),
    var(--bg-2);
  position:relative;
}
.footer-brand {
  font-family:'Cinzel',serif;
  font-size:1.5rem;
  font-weight:700;
  background:linear-gradient(180deg, var(--gold-2), var(--gold-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  margin-bottom:6px;
}
.footer-tag {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  color:var(--muted);
  font-size:0.95rem;
  margin-bottom:20px;
}
.footer-links { display:flex; justify-content:center; gap:26px; flex-wrap:wrap; margin-bottom:22px; }
.footer-links a {
  color:var(--text-2);
  text-decoration:none;
  font-size:0.82rem;
  letter-spacing:0.06em;
  transition:color 0.2s;
  cursor:pointer;
}
.footer-links a:hover { color:var(--gold); }
.footer-copy { color:var(--muted); font-size:0.76rem; letter-spacing:0.04em; }
.footer-copy a { color:var(--gold); text-decoration:none; }
.footer-badge { margin-top:20px; }
.footer-visits {
  margin-top:14px;
  font-size:0.72rem;
  color:var(--muted);
  letter-spacing:0.06em;
}
.footer-visits span { color:var(--gold); font-weight:600; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:0.001s !important; transition-duration:0.001s !important; }
  .hero-eyebrow,.hero-title,.hero-divider,.hero-sub,.hero-cta,.hero-stats,.scroll-hint { opacity:1; }
  .reveal { opacity:1; transform:none; }
}
