/* ════════════════════════════════════════════════════════════
   FUTURISTIC INTERACTIVE LAYER — Ticksol
   Additive stylesheet: theme toggle, AI assistant, wishlist,
   currency widget, live ticker, search/filter, toasts, cursor glow.
   ════════════════════════════════════════════════════════════ */

:root{
  --neon-cyan: #34e1e8;
  --neon-gold: #F5C518;
  --glass-bg: rgba(20,20,24,0.72);
  --glass-border: rgba(255,255,255,0.12);
}

/* ── Navbar icon buttons ───────────────────────────────────── */
.gn-icon-btn{
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:50%;
  background:rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.08);
  color:var(--black,#0A0A0A);cursor:pointer;font-size:15px;
  transition:all .25s ease;margin-right:6px;
}
.gn-icon-btn:hover{background:var(--yellow,#F5C518);transform:translateY(-2px);box-shadow:0 6px 16px rgba(245,197,24,0.4);}
.gn-icon-btn .wishlist-count{
  position:absolute;top:-4px;right:-4px;background:#e0354b;color:#fff;
  font-size:10px;font-weight:800;min-width:16px;height:16px;border-radius: 17px;
  display:flex;align-items:center;justify-content:center;padding:0 3px;
  box-shadow:0 0 0 2px #fff;
}
.gn-icon-btn.active-heart i{color:#e0354b;}
.gn-icon-btn.active-heart{background:rgba(224,53,75,0.1);}

/* ── DARK / FUTURISTIC MODE ────────────────────────────────── */
body.theme-dark{
  background:#07070a;
  color:#e9e9ee;
}
body.theme-dark .section-pad{background:transparent;}
body.theme-dark #navbar,
body.theme-dark .gn-wrapper{
  background:rgba(10,10,14,0.85)!important;
  backdrop-filter:blur(14px);
  border-color:rgba(255,255,255,0.08)!important;
}
body.theme-dark .gn-link{color:#d8d8e0!important;}
body.theme-dark .gn-logo-tag{color:#9a9aa6!important;}
body.theme-dark .h2,
body.theme-dark .h3,
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3{color:#f3f3f8!important;text-shadow:0 0 18px rgba(52,225,232,0.12);}
body.theme-dark .body-text,
body.theme-dark p{color:#b6b6c2;}
body.theme-dark section,
body.theme-dark .pkg-card,
body.theme-dark .airline-card,
body.theme-dark .blog-card,
body.theme-dark .visa-card{
  background:#111116!important;border-color:rgba(255,255,255,0.07)!important;
}
body.theme-dark .pkg-card,
body.theme-dark .blog-card{
  box-shadow:0 0 0 1px rgba(255,255,255,0.05),0 12px 30px rgba(0,0,0,0.5);
}
body.theme-dark .gn-icon-btn{background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.12);color:#f0f0f5;}
body.theme-dark .pkg-search-bar,
body.theme-dark .wishlist-drawer{
  background:var(--glass-bg);border-color:var(--glass-border);
}
body.theme-dark ::selection{background:var(--neon-cyan);color:#000;}

/* ── DARK MODE: remaining cards, modals & form fields ────────── */
body.theme-dark .spirit-card,
body.theme-dark .service-card,
body.theme-dark .review-card{
  background:#111116!important;
  border-color:rgba(255,255,255,0.07)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,0.05),0 12px 30px rgba(0,0,0,0.5);
}

body.theme-dark .visa-icon,
body.theme-dark .corp-svc,
body.theme-dark .why-feat{
  background:rgba(255,255,255,0.06)!important;
}
/* Airline logos keep their original light chip — logos are designed for
   a white/light backdrop and go illegible on a dark tint. */
body.theme-dark .airline-logo{
  background:#FAF8F4!important;
}

body.theme-dark .blog-tag{
  background:rgba(255,255,255,0.08)!important;
  color:#d8d8e0!important;
  border-color:rgba(255,255,255,0.14)!important;
}

body.theme-dark .contact-form-box,
body.theme-dark .modal-box,
body.theme-dark .wa-panel,
body.theme-dark .consult-dropdown,
body.theme-dark .scroll-hint{
  background:#111116!important;
  color:#e9e9ee;
  border-color:rgba(255,255,255,0.08)!important;
}
body.theme-dark .modal-head{ border-bottom:1px solid rgba(255,255,255,0.08); }

body.theme-dark .pkg-summary,
body.theme-dark .tp-counter-box{
  background:rgba(255,255,255,0.05)!important;
  border-color:rgba(255,255,255,0.12)!important;
}

body.theme-dark .form-group input,
body.theme-dark .form-group select,
body.theme-dark .form-group textarea,
body.theme-dark .modal-input,
body.theme-dark .tp-input{
  background:rgba(255,255,255,0.04)!important;
  color:#f0f0f5!important;
  border-color:rgba(255,255,255,0.16)!important;
}
body.theme-dark .form-group input::placeholder,
body.theme-dark .form-group textarea::placeholder,
body.theme-dark .modal-input::placeholder{
  color:rgba(233,233,238,0.4);
}
body.theme-dark .tp-input.tp-input-error{ background:rgba(224,53,61,0.1)!important; }

body.theme-dark .tp-counter button{
  background:rgba(255,255,255,0.08)!important;
  color:#f0f0f5!important;
}
body.theme-dark .tp-label{ color:#9a9aa6!important; }

body.theme-dark .consult-option{ color:#e9e9ee!important; border-bottom-color:rgba(255,255,255,0.08)!important; }
body.theme-dark .consult-option.wa-opt:hover{ background:rgba(37,211,102,0.12)!important; }
body.theme-dark .consult-option.email-opt:hover{ background:rgba(26,115,232,0.14)!important; }
body.theme-dark .consult-option.phone-opt:hover{ background:rgba(245,197,24,0.1)!important; }
body.theme-dark .consult-option small{ color:#9a9aa6!important; }
body.theme-dark .exit-modal{ background:#111116!important; color:#e9e9ee; }
body.theme-dark .exit-modal p{ color:#b6b6c2; }

#theme-toggle-btn i{transition:transform .4s ease;}
body.theme-dark #theme-toggle-btn i{transform:rotate(360deg);}
body.theme-dark #theme-toggle-btn i.fa-moon::before{content:"\f185";} /* sun icon swap */

/* ── LIVE TICKER ───────────────────────────────────────────── */
.live-ticker{
  position:fixed;top:0;left:0;right:0;z-index:1001;overflow:hidden;
  background:linear-gradient(90deg,#0A0A0A,#1c1c1c 50%,#0A0A0A);
  border-bottom:1px solid rgba(245,197,24,0.25);
  height:34px;display:flex;align-items:center;
}
.live-ticker-track{
  display:flex;gap:48px;white-space:nowrap;
  animation:ticker-scroll 70s linear infinite;
  padding-left:100%;
}
.live-ticker-track span{
  color:#F5C518;font-size:12.5px;font-weight:600;letter-spacing:.3px;
  display:inline-flex;align-items:center;gap:8px;
}
.live-ticker-track span i{color:#34e1e8;}
.live-ticker-track span.ticker-highlight{
  background:#F5C518;color:#0A0A0A;padding:3px 14px 3px 10px;border-radius:20px;
  font-weight:800;animation:tickerHighlightPulse 1.6s ease-in-out infinite;
}
.live-ticker-track span.ticker-highlight i{color:#0A0A0A;}
@keyframes tickerHighlightPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,197,24,0.6);}
  50%{box-shadow:0 0 0 6px rgba(245,197,24,0);}
}
@keyframes ticker-scroll{
  0%{transform:translateX(0);}
  100%{transform:translateX(-100%);}
}
@media (prefers-reduced-motion: reduce){ .live-ticker-track{animation:none;} }

/* ── PACKAGE SEARCH BAR ────────────────────────────────────── */
.pkg-search-bar{
  max-width:780px;margin:36px auto 8px;
  background:#fff;border:1px solid rgba(0,0,0,0.08);
  border-radius: 17px;padding:18px 20px;box-shadow:var(--shadow-md,0 8px 40px rgba(0,0,0,.12));
}
.pkg-search-input-wrap{
  display:flex;align-items:center;gap:10px;
  background:var(--beige-lt,#FAF8F4);border-radius: 17px;padding:10px 16px;
}
.pkg-search-input-wrap i.fa-search{color:var(--amber,#E6A800);}
.pkg-search-input-wrap input{
  flex:1;border:none;background:transparent;outline:none;font-size:14.5px;font-family:inherit;color:inherit;
}
#pkg-voice-btn{
  border:none;background:var(--yellow,#F5C518);color:#0A0A0A;width:34px;height:34px;border-radius:50%;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0;
}
#pkg-voice-btn:hover{transform:scale(1.08);}
#pkg-voice-btn.listening{background:#e0354b;color:#fff;animation:pulse-mic 1s ease-in-out infinite;}
@keyframes pulse-mic{0%,100%{box-shadow:0 0 0 0 rgba(224,53,75,.5);}50%{box-shadow:0 0 0 8px rgba(224,53,75,0);}}
.pkg-filter-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.chip{
  border:1px solid rgba(0,0,0,0.12);background:transparent;border-radius: 17px;
  padding:7px 16px;font-size:12.5px;font-weight:600;cursor:pointer;transition:all .2s ease;color:var(--gray,#6B6B6B);
}
.chip:hover{border-color:var(--amber,#E6A800);color:var(--black,#0A0A0A);}
.chip.active{background:var(--black,#0A0A0A);border-color:var(--black,#0A0A0A);color:#fff;}
.pkg-search-status{margin-top:10px;font-size:12.5px;color:var(--gray,#6B6B6B);min-height:16px;}
.pkg-card.pkg-hidden{display:none!important;}

/* heart / wishlist button injected into each package card */
.pkg-heart-btn{
  position:absolute;top:14px;right:14px;z-index:3;
  width:36px;height:36px;border-radius:50%;border:none;
  background:rgba(255,255,255,0.9);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  color:#999;font-size:15px;transition:all .25s ease;box-shadow:0 4px 12px rgba(0,0,0,0.15);
}
.pkg-heart-btn:hover{transform:scale(1.12);}
.pkg-heart-btn.saved{color:#e0354b;}
.pkg-heart-btn.saved i{animation:heart-pop .35s ease;}
@keyframes heart-pop{0%{transform:scale(1);}50%{transform:scale(1.4);}100%{transform:scale(1);}}
.pkg-img{position:relative;}
/* heart btn on dest, spirit, visa cards */
.dest-img,.spirit-img,.visa-img{position:relative;}
.wishlist-item-section{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:.5px;
  padding:2px 7px;border-radius: 17px;margin-top:3px;
  background:rgba(245,197,24,0.15);color:#8a6d00;
}
body.theme-dark .wishlist-item-section{background:rgba(245,197,24,0.12);color:#F5C518;}

/* ── WISHLIST DRAWER ───────────────────────────────────────── */
.wishlist-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:9990;
  opacity:0;pointer-events:none;transition:opacity .3s ease;backdrop-filter:blur(2px);
}
.wishlist-overlay.open{opacity:1;pointer-events:auto;}
.wishlist-drawer{
  position:fixed;top:0;right:-380px;width:340px;max-width:88vw;height:100%;
  background:#fff;z-index:9991;box-shadow:-12px 0 40px rgba(0,0,0,0.2);
  transition:right .35s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;
}
.wishlist-drawer.open{right:0;}
.wishlist-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 22px;border-bottom:1px solid rgba(0,0,0,0.08);
}
.wishlist-head strong{font-size:16px;display:flex;gap:8px;align-items:center;}
.wishlist-head strong i{color:#e0354b;}
.wishlist-head button{background:none;border:none;font-size:22px;cursor:pointer;color:var(--gray,#6B6B6B);}
.wishlist-body{flex:1;overflow-y:auto;padding:16px 20px;}
.wishlist-empty{text-align:center;color:var(--gray,#6B6B6B);font-size:13.5px;padding:60px 10px;}
.wishlist-item{
  display:flex;flex-direction:column;gap:10px;padding:14px 0;
  border-bottom:1px solid rgba(0,0,0,0.06);
}
.wishlist-item-row{display:flex;gap:12px;align-items:center;}
.wishlist-item img{width:56px;height:56px;border-radius: 17px;object-fit:cover;flex-shrink:0;}
.wishlist-item-name{font-weight:700;font-size:13.5px;}
.wishlist-item-cat{font-size:11.5px;color:var(--gray,#6B6B6B);}
.wishlist-item-remove{margin-left:auto;background:none;border:none;color:#c33;cursor:pointer;font-size:14px;}
.wishlist-item-book{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;padding:10px;border:none;border-radius: 17px;cursor:pointer;
  background:var(--black,#0A0A0A);color:var(--yellow,#F5C518);
  font-weight:700;font-size:12.5px;letter-spacing:.3px;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.wishlist-item-book:hover{background:var(--yellow,#F5C518);color:var(--black,#0A0A0A);transform:translateY(-1px);}
body.theme-dark .wishlist-item-book{background:var(--yellow,#F5C518);color:#0A0A0A;}
body.theme-dark .wishlist-item-book:hover{background:#fff;color:#0A0A0A;}

.wishlist-footer{
  padding:14px 20px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(0,0,0,0.08);
  display:none;
}
.wishlist-footer.show{display:block;}
.wishlist-book-all{
  display:flex;align-items:center;justify-content:center;gap:9px;
  width:100%;padding:13px;border:none;border-radius: 17px;cursor:pointer;
  background:linear-gradient(135deg,#F5C518,#E6A800);color:#0A0A0A;
  font-weight:800;font-size:14px;letter-spacing:.3px;
  box-shadow:0 8px 20px rgba(245,197,24,0.35);
  transition:transform .2s ease,box-shadow .2s ease;
}
.wishlist-book-all:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(245,197,24,0.45);}

/* ── EXIT-INTENT MODAL ─────────────────────────────────────── */
.exit-modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:9995;
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .3s ease;padding:20px;
}
.exit-modal-overlay.open{opacity:1;pointer-events:auto;}
.exit-modal{
  background:#fff;border-radius: 17px;max-width:380px;width:100%;padding:36px 30px;text-align:center;position:relative;
  transform:scale(.9);transition:transform .3s ease;box-shadow:0 30px 80px rgba(0,0,0,0.3);
}
.exit-modal-overlay.open .exit-modal{transform:scale(1);}
.exit-modal-close{position:absolute;top:14px;right:16px;background:none;border:none;font-size:22px;cursor:pointer;color:var(--gray,#6B6B6B);}
.exit-modal-icon{
  width:64px;height:64px;border-radius:50%;background:var(--yellow,#F5C518);color:#0A0A0A;
  display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 16px;
}
.exit-modal h3{font-family:'Playfair Display',serif;font-size:22px;margin-bottom:10px;}
.exit-modal p{font-size:14px;color:var(--gray,#6B6B6B);margin-bottom:20px;line-height:1.6;}

/* ── TOASTS ─────────────────────────────────────────────────── */
.toast-stack{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;align-items:flex-end;}
.toast{
  background:#0A0A0A;color:#fff;padding:12px 18px;border-radius: 17px;font-size:13px;
  display:flex;align-items:center;gap:10px;box-shadow:0 10px 30px rgba(0,0,0,0.25);
  transform:translateX(120%);opacity:0;transition:all .35s cubic-bezier(.2,.8,.2,1);max-width:300px;
}
.toast.show{transform:translateX(0);opacity:1;}
.toast i{color:var(--yellow,#F5C518);}

/* ── CURSOR GLOW (desktop only, futuristic touch) ─────────────── */
.cursor-glow{
  position:fixed;width:26px;height:26px;border-radius:50%;
  border:1.5px solid rgba(245,197,24,0.6);
  pointer-events:none;z-index:9999;transform:translate(-50%,-50%);
  transition:width .2s ease,height .2s ease,border-color .2s ease,opacity .2s ease;
  opacity:0;mix-blend-mode:difference;
}
.cursor-glow.show{opacity:1;}
.cursor-glow.grow{width:46px;height:46px;border-color:rgba(52,225,232,0.8);}
@media (hover:none), (pointer:coarse){ .cursor-glow{display:none;} }

/* ── REVEAL ANIMATIONS (progressive enhancement) ──────────────── */
.reveal-up, .reveal-card{ opacity:1; }
.reveal-up.fx-init, .reveal-card.fx-init{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.reveal-up.fx-in, .reveal-card.fx-in{ opacity:1; transform:translateY(0); }

/* Back-to-top progress ring */
#back-top{ position:fixed; }
#back-top::before{
  content:'';position:absolute;inset:-4px;border-radius:50%;
  background:conic-gradient(var(--yellow,#F5C518) calc(var(--scrollpct,0) * 1%), rgba(0,0,0,0.08) 0);
  z-index:-1;
}

/* ═══════════════════════════════════════════════════════════════
   HOW-TO-BOOK BANNER — real 3D textured toy globe (Three.js)
   (pure decoration, no click actions / no data)
   ═══════════════════════════════════════════════════════════════ */
.htb-toy-globe-wrap{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  user-select: none;
}
.htb-toy-globe{
  position: relative;
  width: 150px;
  height: 150px;
  cursor: grab;
  touch-action: none;
}
.htb-toy-globe:active{ cursor: grabbing; }
.htb-toy-globe canvas{
  display: block;
  width: 100% !important;
  height: 100% !important;
}
.htb-toy-globe-glow{
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(52,225,232,0.16) 0%, rgba(245,197,24,0.14) 45%, transparent 72%);
  pointer-events: none;
  z-index: -1;
}
.htb-toy-globe-fallback{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 64px;
  line-height: 1;
  cursor: default;
  animation: htbFallbackSpin 8s linear infinite;
}
@keyframes htbFallbackSpin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

.htb-toy-globe-label{
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: rgba(255,255,255,0.65);
  text-transform: uppercase;
}

@media (max-width: 700px){
  .htb-toy-globe-wrap{ margin: 0 auto; }
}

/* ═══════════════════════════════════════════════════════════════
   PERFORMANCE NOTE (read before editing below):
   Every animation in this block only touches `transform` and
   `opacity` (compositor-only properties — no layout, no repaint
   of surrounding content). No JS timers/intervals are used, no
   new DOM nodes are created for these effects, and everything is
   wrapped in `prefers-reduced-motion` + a mobile downgrade so it
   never taxes low-power devices. Safe to run indefinitely.
   ═══════════════════════════════════════════════════════════════ */

/* ── VISA SECTION — FUTURISTIC LAYER ─────────────────────────── */
#visa{ position:relative; isolation:isolate; }

/* Slow-panning circuit grid, contained to its own compositor layer */
#visa::before{
  content:'';
  position:absolute; inset:-20% -10%;
  background-image:
    linear-gradient(rgba(52,225,232,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(52,225,232,0.06) 1px, transparent 1px);
  background-size: 44px 44px;
  transform: translate3d(0,0,0);
  animation: visa-grid-pan 30s linear infinite;
  pointer-events: none;
  z-index: 0;
  contain: strict;
  will-change: transform;
  opacity: .7;
  mask-image: radial-gradient(ellipse 85% 70% at 50% 40%, #000 45%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 85% 70% at 50% 40%, #000 45%, transparent 100%);
}
#visa > .container{ position: relative; z-index: 1; }
@keyframes visa-grid-pan{
  from{ transform: translate3d(0,0,0); }
  to{ transform: translate3d(-44px,-44px,0); }
}
body.theme-dark #visa::before{ opacity: 1; }

/* Neon edge + holographic sweep on card hover (hover-triggered only, so idle cost is zero) */
.visa-card{ position: relative; }
.visa-card::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 42%, rgba(52,225,232,.28) 50%, transparent 58%);
  transform:translate3d(-130%,0,0);
  pointer-events:none; z-index:2;
}
.visa-card:hover::after{ animation: visa-sweep .85s ease forwards; }
@keyframes visa-sweep{
  from{ transform:translate3d(-130%,0,0); }
  to{ transform:translate3d(130%,0,0); }
}
.visa-card:hover{
  box-shadow: var(--shadow), 0 0 0 1px rgba(52,225,232,.4), 0 0 26px rgba(52,225,232,.22);
}

/* Icon glow-ring ping, hover-triggered */
.visa-icon{ position:relative; }
.visa-icon::before{
  content:'';
  position:absolute; inset:-6px; border-radius: 17px;
  border:1px solid rgba(52,225,232,.55);
  opacity:0; transform:scale3d(.85,.85,1);
  pointer-events:none;
}
.visa-card:hover .visa-icon::before{ animation: visa-icon-ping .9s ease-out; }
@keyframes visa-icon-ping{
  0%{ opacity:.85; transform:scale3d(.85,.85,1); }
  100%{ opacity:0; transform:scale3d(1.4,1.4,1); }
}

/* Process-step connector — quiet always-on cyan pulse (single 1px-wide element, negligible paint cost) */
.visa-process .process-step:not(:last-child)::after{
  background: linear-gradient(180deg, transparent, rgba(52,225,232,.7), transparent);
  animation: visa-connector-pulse 2.6s ease-in-out infinite;
  will-change: opacity;
}
@keyframes visa-connector-pulse{
  0%, 100%{ opacity:.35; }
  50%{ opacity:1; }
}
.step-num{ position:relative; transition: box-shadow .3s ease; }
.process-step:hover .step-num{ box-shadow: 0 0 0 4px rgba(52,225,232,.18), 0 0 18px rgba(52,225,232,.35); }

@media (max-width: 700px){
  #visa::before{ animation-duration: 46s; opacity:.4; } /* slower + fainter on small/low-power screens */
}

/* ── FOOTER — FUTURISTIC LAYER ───────────────────────────────── */
/* Scanning neon line along the very top edge of the footer */
footer{ position: relative; }
footer::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:2px; z-index:2;
  background: linear-gradient(90deg, transparent, var(--neon-cyan) 20%, var(--neon-gold) 50%, var(--neon-cyan) 80%, transparent);
  background-size: 220% 100%;
  transform: translate3d(0,0,0);
  animation: footer-scanline 7s linear infinite;
  opacity: .8;
  will-change: background-position;
  pointer-events: none;
}
@keyframes footer-scanline{
  0%{ background-position: 0% 0; }
  100%{ background-position: -220% 0; }
}

/* Soft glow pulse behind the footer logo */
.footer-logo-link{ position: relative; }
.footer-logo-img{ position: relative; z-index: 1; }
.footer-logo-link::before{
  content:'';
  position:absolute; left:0; top:50%; width:48px; height:48px;
  transform: translate3d(0,-50%,0) scale3d(1,1,1);
  border-radius:50%;
  background: radial-gradient(circle, rgba(52,225,232,.35) 0%, transparent 70%);
  animation: footer-logo-pulse 3.6s ease-in-out infinite;
  pointer-events:none; z-index:0;
  will-change: transform, opacity;
}
@keyframes footer-logo-pulse{
  0%,100%{ transform: translate3d(0,-50%,0) scale3d(1,1,1); opacity:.5; }
  50%{ transform: translate3d(0,-50%,0) scale3d(1.35,1.35,1); opacity:.15; }
}

/* Social icons — neon ring on hover only */
.social-btn{ position: relative; }
.social-btn::before{
  content:'';
  position:absolute; inset:-4px; border-radius:50%;
  border:1px solid rgba(52,225,232,.6);
  opacity:0; transform:scale3d(.8,.8,1);
  pointer-events:none; transition: opacity .25s ease, transform .25s ease;
}
.social-btn:hover::before{ opacity:1; transform:scale3d(1,1,1); box-shadow:0 0 14px rgba(52,225,232,.4); }

/* QR premium card — holographic border sweep on hover only */
.footer-qr{ position: relative; overflow: hidden; }
.footer-qr::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 42%, rgba(52,225,232,.25) 50%, transparent 58%);
  transform:translate3d(-130%,0,0);
  pointer-events:none;
}
.footer-qr:hover::after{ animation: visa-sweep .85s ease forwards; }

/* Newsletter subscribe button — neon glow sweep on hover only */
.newsletter-form button{ position: relative; overflow: hidden; }
.newsletter-form button::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 42%, rgba(255,255,255,.5) 50%, transparent 58%);
  transform:translate3d(-130%,0,0);
  pointer-events:none;
}
.newsletter-form button:hover::after{ animation: visa-sweep .7s ease forwards; }

@media (max-width: 700px){
  footer::before{ animation-duration: 11s; }
  .footer-logo-link::before{ animation-duration: 5s; }
}

/* Respect reduced-motion preference — kill every continuous loop, keep static glows */
@media (prefers-reduced-motion: reduce){
  #visa::before,
  footer::before,
  .footer-logo-link::before,
  .visa-process .process-step:not(:last-child)::after{
    animation: none !important;
  }
  .visa-card::after,
  .footer-qr::after,
  .newsletter-form button::after,
  .visa-icon::before,
  .social-btn::before{
    transition: none !important;
    animation: none !important;
  }
}

/* ════════════════════════════════════════════════════════════
   REVIEWS PAGE — trust summary, filters, verified badge,
   helpful votes, and the "rate your trip" mini widget.
   ════════════════════════════════════════════════════════════ */

.rv-summary{
  display:grid;grid-template-columns:280px 1fr;gap:40px;align-items:center;
  background:var(--white);border:1px solid rgba(0,0,0,0.06);border-radius: 17px;
  padding:36px 40px;box-shadow:var(--shadow);margin-top:40px;
}
body.theme-dark .rv-summary{background:#111116!important;border-color:rgba(255,255,255,0.07)!important;}
.rv-score-block{text-align:center;border-right:1px solid rgba(0,0,0,0.08);padding-right:32px;}
body.theme-dark .rv-score-block{border-color:rgba(255,255,255,0.1);}
.rv-score{font-family:'Playfair Display',serif;font-size:56px;font-weight:800;color:var(--black);line-height:1;}
body.theme-dark .rv-score{color:#fff;}
.rv-score-stars{color:var(--amber);font-size:18px;letter-spacing:3px;margin:10px 0 8px;}
.rv-score-count{font-size:12.5px;color:var(--gray);}
.rv-trust-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.rv-trust-chip{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  color:var(--amber);background:rgba(245,197,24,0.12);border-radius: 17px;padding:5px 10px;
}
.rv-bars{display:flex;flex-direction:column;gap:10px;}
.rv-bar-row{
  display:grid;grid-template-columns:52px 1fr 44px;align-items:center;gap:12px;
  cursor:pointer;background:none;border:none;font:inherit;text-align:left;padding:4px 0;
}
.rv-bar-row-label{font-size:12.5px;font-weight:700;color:var(--black);white-space:nowrap;}
body.theme-dark .rv-bar-row-label{color:#fff;}
.rv-bar-track{height:9px;border-radius: 17px;background:rgba(0,0,0,0.07);overflow:hidden;}
body.theme-dark .rv-bar-track{background:rgba(255,255,255,0.08);}
.rv-bar-fill{height:100%;border-radius: 17px;background:linear-gradient(90deg,var(--amber),var(--yellow));}
.rv-bar-row-count{font-size:11.5px;color:var(--gray);text-align:right;}
.rv-bar-row.active .rv-bar-row-label{color:var(--amber);}

.rv-toolbar{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;
  margin-top:36px;margin-bottom:8px;
}
.rv-filters{display:flex;flex-wrap:wrap;gap:8px;}
.rv-filter-chip{
  border:1px solid rgba(0,0,0,0.12);background:var(--white);color:var(--black);
  font-size:12.5px;font-weight:700;padding:8px 16px;border-radius: 17px;cursor:pointer;
  transition:all .2s;
}
body.theme-dark .rv-filter-chip{background:#111116;border-color:rgba(255,255,255,0.12);color:#fff;}
.rv-filter-chip:hover{border-color:var(--amber);}
.rv-filter-chip.active{background:var(--black);color:var(--yellow);border-color:var(--black);}
body.theme-dark .rv-filter-chip.active{background:var(--yellow);color:var(--black);border-color:var(--yellow);}
.rv-sort{
  font-size:12.5px;font-weight:600;padding:8px 14px;border-radius: 17px;
  border:1px solid rgba(0,0,0,0.12);background:var(--white);color:var(--black);cursor:pointer;
}
body.theme-dark .rv-sort{background:#111116;border-color:rgba(255,255,255,0.12);color:#fff;}

.rv-empty{
  text-align:center;padding:48px 20px;color:var(--gray);font-size:14px;display:none;
}

.review-card{transition:opacity .25s, transform .25s;}
.review-card.rv-hidden{display:none;}

.rv-verified{
  display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.4px;color:#1b8a4d;background:rgba(27,138,77,0.1);
  border-radius: 17px;padding:4px 9px;margin-left:10px;vertical-align:middle;
}
body.theme-dark .rv-verified{background:rgba(46,204,113,0.15);color:#4CD97B;}
.rv-trip-tag{
  display:inline-block;font-size:10.5px;font-weight:700;color:var(--amber);
  background:rgba(245,197,24,0.12);border-radius: 17px;padding:4px 10px;margin-bottom:14px;
}
.rv-meta-row{display:flex;align-items:center;justify-content:space-between;margin-top:18px;gap:10px;}
.rv-date{font-size:11px;color:var(--gray);}
.rv-helpful{
  display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;
  color:var(--black);background:rgba(0,0,0,0.05);border:none;border-radius: 17px;
  padding:6px 12px;cursor:pointer;transition:all .2s;
}
body.theme-dark .rv-helpful{color:#fff;background:rgba(255,255,255,0.08);}
.rv-helpful:hover{background:rgba(245,197,24,0.18);color:var(--amber);}
.rv-helpful.voted{background:var(--yellow);color:var(--black);}
.rv-helpful i{font-size:11px;}

.rv-rate-widget{
  margin-top:64px;background:linear-gradient(135deg,var(--black),#1c1c1c);
  border-radius: 17px;padding:44px 36px;text-align:center;color:#fff;
}
.rv-rate-widget h3{font-family:'Playfair Display',serif;font-size:24px;margin-bottom:8px;}
.rv-rate-widget p{color:rgba(255,255,255,0.6);font-size:13.5px;margin-bottom:22px;}
.rv-rate-stars{display:flex;justify-content:center;gap:8px;margin-bottom:20px;}
.rv-rate-star{
  font-size:34px;color:rgba(255,255,255,0.25);cursor:pointer;transition:transform .15s,color .15s;
  line-height:1;background:none;border:none;padding:0;
}
.rv-rate-star:hover, .rv-rate-star.hover{transform:scale(1.15);}
.rv-rate-star.hover, .rv-rate-star.selected{color:var(--yellow);}
.rv-rate-note{font-size:12px;color:rgba(255,255,255,0.45);min-height:18px;}
.rv-rate-cta{
  margin-top:18px;display:none;background:var(--yellow);color:var(--black);border:none;
  font-weight:800;font-size:13px;padding:12px 26px;border-radius: 17px;cursor:pointer;
  align-items:center;gap:8px;justify-content:center;margin-left:auto;margin-right:auto;
}
.rv-rate-cta.show{display:inline-flex;}

@media (max-width:800px){
  .rv-summary{grid-template-columns:1fr;padding:28px 24px;}
  .rv-score-block{border-right:none;border-bottom:1px solid rgba(0,0,0,0.08);padding-right:0;padding-bottom:24px;}
  body.theme-dark .rv-score-block{border-color:rgba(255,255,255,0.1);}
  .rv-toolbar{flex-direction:column;align-items:stretch;}
}

/* ════════════════════════════════════════════════════════════
   MEET OUR TEAM — clean, uniform leadership cards with graceful
   photo fallback. Drop real photos into images/team/ using the
   existing filenames and the lettered placeholder avatar is
   automatically replaced.
   ════════════════════════════════════════════════════════════ */
.team-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:32px;
  margin-top:56px;
  align-items:stretch;
}
@media (max-width:860px){
  .team-grid{ grid-template-columns:1fr; max-width:360px; margin-left:auto; margin-right:auto; }
}

.team-card{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  height:100%;
  background:
    radial-gradient(120% 140% at 50% -10%, rgba(245,197,24,0.10), transparent 55%),
    linear-gradient(160deg, #1c1c1f 0%, #131315 55%, #0b0b0c 100%);
  border:1px solid rgba(245,197,24,0.22);
  border-radius:20px;
  padding:36px 24px 32px;
  text-align:center;
  box-shadow:
    0 2px 0 0 rgba(255,255,255,0.04) inset,
    0 1px 0 0 rgba(0,0,0,0.6) inset,
    0 22px 40px -18px rgba(0,0,0,0.65),
    0 8px 20px -6px rgba(245,197,24,0.10);
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .12s ease-out, box-shadow .3s ease, border-color .3s ease;
}
.team-card::before{
  /* thin gold accent bar along the top of every card, same on all three */
  content:"";
  position:absolute; top:0; left:20px; right:20px; height:3px;
  border-radius:0 0 3px 3px;
  background:linear-gradient(90deg, var(--yellow), var(--amber));
  opacity:.9;
  box-shadow:0 0 12px rgba(245,197,24,0.6);
}
/* Roaming gold glare that follows the cursor — driven by JS via
   --mx/--my custom properties for a subtle glass/3D sheen. */
.team-card::after{
  content:"";
  position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(280px circle at var(--mx,50%) var(--my,-20%), rgba(245,197,24,0.16), transparent 60%);
  opacity:0; transition:opacity .35s ease;
  pointer-events:none;
  z-index:0;
}
.team-card:hover::after{ opacity:1; }
.team-card:hover{
  border-color:rgba(245,197,24,0.5);
  box-shadow:
    0 2px 0 0 rgba(255,255,255,0.06) inset,
    0 1px 0 0 rgba(0,0,0,0.6) inset,
    0 32px 60px -20px rgba(0,0,0,0.75),
    0 10px 30px -4px rgba(245,197,24,0.22);
}

/* CEO card reads as "lead" through a soft gold border + crown badge —
   not through a different, mismatched size. All three cards stay the
   same height so the row lines up perfectly. */
.team-card.team-lead{
  border-color:rgba(245,197,24,0.55);
  box-shadow:
    0 2px 0 0 rgba(255,255,255,0.05) inset,
    0 1px 0 0 rgba(0,0,0,0.6) inset,
    0 22px 44px -18px rgba(0,0,0,0.7),
    0 0 0 1px rgba(245,197,24,0.12),
    0 10px 30px -6px rgba(245,197,24,0.22);
}

.team-crown{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%) translateZ(40px);
  width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--yellow),var(--amber));
  color:var(--black);font-size:13px;
  box-shadow:0 4px 12px rgba(245,197,24,0.5), 0 0 0 4px #131315, 0 8px 18px rgba(0,0,0,0.4);
  z-index:2;
}

/* Photo circle: identical size for every team member so the grid reads
   as one consistent set, not three unrelated shapes. */
.team-photo-wrap{
  position:relative; width:112px;height:112px;border-radius:50%;
  overflow:hidden; margin-bottom:20px;
  box-shadow:0 0 0 4px #131315, 0 10px 24px rgba(0,0,0,0.5), 0 0 0 6px rgba(245,197,24,0.35), 0 0 22px rgba(245,197,24,0.12);
  transition:transform .3s ease, box-shadow .3s ease;
  z-index:1;
}
.team-card:hover .team-photo-wrap{
  transform:scale(1.06);
  box-shadow:0 0 0 4px #131315, 0 12px 28px rgba(0,0,0,0.55), 0 0 0 6px rgba(245,197,24,0.5), 0 0 30px rgba(245,197,24,0.22);
}

.team-initials{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--yellow),var(--amber));
  color:var(--black); font-weight:800; font-size:20px; letter-spacing:1px;
}
.team-photo{
  position:relative; width:100%; height:100%; object-fit:cover; object-position:center top;
}

.team-role-badge{
  position:relative; z-index:1;
  display:inline-block; font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.6px;
  color:var(--yellow); background:rgba(245,197,24,0.14); border:1px solid rgba(245,197,24,0.25);
  border-radius:17px; padding:5px 14px; margin-bottom:12px;
}
.team-name{
  position:relative; z-index:1;
  font-family:'Playfair Display',serif; font-size:20px; font-weight:700; color:#fff; margin-bottom:10px;
  text-shadow:0 2px 12px rgba(0,0,0,0.4);
}
.team-quote{
  position:relative; z-index:1;
  font-size:13px; color:rgba(255,255,255,0.62); line-height:1.7; max-width:240px;
  flex:1 1 auto; margin-bottom:20px;
}

.team-socials{
  position:relative; z-index:1;
  display:flex; gap:10px; margin-top:auto; padding-top:4px;
}
.team-socials a{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.08); color:#fff;
  font-size:13px; transition:background .2s ease, color .2s ease, transform .2s ease;
}
.team-socials a:hover{ background:var(--yellow); border-color:var(--yellow); color:var(--black); transform:translateY(-2px); }

/* ── Interactive flip cards ────────────────────────────────
   A "tap to flip" hint invites interaction, and clicking (or
   Enter/Space on keyboard) flips the card to a bio side with
   quick stats and a button that opens the full profile modal. */
.team-card{
  cursor:pointer;
  perspective:1200px;
  outline:none;
}
.team-card:focus-visible{ box-shadow:0 0 0 3px rgba(245,197,24,0.55), var(--shadow-md); }

.team-flip-hint{
  position:absolute; top:14px; right:16px; z-index:2;
  font-size:10px; font-weight:700; letter-spacing:.3px;
  color:var(--amber); background:rgba(245,197,24,0.16);
  border-radius:20px; padding:4px 10px 4px 8px;
  display:flex; align-items:center; gap:5px;
  opacity:1; transform:translateY(0);
  transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;
  animation:teamFlipHintPulse 2.2s ease-in-out infinite;
}
.team-card.is-flipped .team-flip-hint{ animation:none; opacity:0; }
.team-flip-hint i{ font-size:9px; }

@keyframes teamFlipHintPulse{
  0%, 100%{ box-shadow:0 0 0 0 rgba(245,197,24,0.35); }
  50%{ box-shadow:0 0 0 6px rgba(245,197,24,0); }
}

.team-card-inner{
  position:relative; width:100%; flex:1 1 auto;
  display:flex; flex-direction:column;
  transform-style:preserve-3d;
  transition:transform .6s cubic-bezier(.4,.2,.2,1);
}
.team-card.is-flipped .team-card-inner{ transform:rotateY(180deg); }

.team-card-face{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  display:flex; flex-direction:column; align-items:center;
  width:100%;
}
.team-card-front{ position:relative; }
.team-card-back{
  position:absolute; inset:0;
  transform:rotateY(180deg);
  justify-content:center;
  padding-top:6px;
}
.team-card-back .team-role-badge{ margin-bottom:10px; }
.team-card-back .team-name{ margin-bottom:12px; }

.team-bio{
  position:relative; z-index:1;
  font-size:12.5px; color:rgba(255,255,255,0.68); line-height:1.65;
  max-width:250px; margin-bottom:16px;
}

.team-stats{
  position:relative; z-index:1;
  list-style:none; display:flex; gap:22px; margin:0 0 18px; padding:0;
}
.team-stats li{ display:flex; flex-direction:column; align-items:center; }
.team-stats strong{
  font-family:'Playfair Display',serif; font-size:17px; font-weight:800; color:var(--yellow);
  text-shadow:0 0 16px rgba(245,197,24,0.35);
}
.team-stats span{
  font-size:9.5px; text-transform:uppercase; letter-spacing:.4px; color:rgba(255,255,255,0.5); margin-top:2px;
}

.team-view-btn{
  margin-top:auto;
  display:inline-flex; align-items:center; gap:8px;
  border:none; border-radius:10px; cursor:pointer;
  background:linear-gradient(135deg,var(--yellow),var(--amber));
  color:var(--black); font-weight:700; font-size:12.5px;
  padding:10px 18px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.team-view-btn:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(245,197,24,0.35); }

/* ── Team profile modal — themed to match the site's black &
   gold palette instead of the generic white modal box ────── */
.tm-modal-box{
  text-align:center;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(245,197,24,0.12), transparent 55%),
    linear-gradient(165deg, #1c1c1f 0%, #131315 55%, #0b0b0c 100%) !important;
  border:1px solid rgba(245,197,24,0.28);
  box-shadow:
    0 2px 0 0 rgba(255,255,255,0.05) inset,
    0 30px 80px rgba(0,0,0,0.55),
    0 0 0 1px rgba(245,197,24,0.08),
    0 10px 40px rgba(245,197,24,0.10) !important;
  padding-top:8px;
}
.tm-modal-box .cd-modal-close{
  background:rgba(245,197,24,0.14); border:1px solid rgba(245,197,24,0.35);
  color:var(--yellow);
}
.tm-modal-box .cd-modal-close:hover{ background:var(--yellow); color:var(--black); }
.tm-modal-box .cd-modal-content{ padding-top:26px; }
.tm-modal-box #tm-modal-title{
  font-family:'Playfair Display',serif; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,0.4);
}
.tm-modal-photo-wrap{
  position:relative; width:120px; height:120px; border-radius:50%;
  overflow:hidden; margin:0 auto 18px;
  box-shadow:0 0 0 4px #131315, 0 10px 24px rgba(0,0,0,0.5), 0 0 0 6px rgba(245,197,24,0.4), 0 0 26px rgba(245,197,24,0.15);
}
.tm-modal-photo-wrap .team-initials{ font-size:22px; }
.tm-modal-content{ display:flex; flex-direction:column; align-items:center; }
.tm-modal-content #tm-modal-bio{
  font-size:14px; color:rgba(255,255,255,0.68); line-height:1.7; max-width:420px; margin:10px 0 18px;
}
.tm-modal-stats{ justify-content:center; gap:32px; margin-bottom:18px; }
.tm-modal-funfact{
  display:flex; align-items:center; gap:10px;
  background:rgba(245,197,24,0.1); border:1px solid rgba(245,197,24,0.3);
  border-radius:14px; padding:12px 16px; margin-bottom:22px;
  font-size:12.5px; color:#fff; text-align:left; max-width:420px;
}
.tm-modal-funfact i{ color:var(--yellow); font-size:16px; flex-shrink:0; }
.tm-modal-actions{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.tm-modal-box .btn-book-now{
  background:linear-gradient(135deg,var(--yellow),var(--amber));
  color:var(--black); box-shadow:0 8px 20px rgba(245,197,24,0.25);
}
.tm-modal-box .btn-book-now:hover{ box-shadow:0 10px 26px rgba(245,197,24,0.4); }
.tm-modal-email-btn{
  display:inline-flex; align-items:center; gap:8px;
  border:1.5px solid rgba(245,197,24,0.3); border-radius:10px; cursor:pointer;
  background:rgba(255,255,255,0.04); color:#fff; font-weight:700; font-size:13px;
  padding:11px 20px; transition:background .2s ease, transform .2s ease, border-color .2s ease;
}
.tm-modal-email-btn:hover{ background:rgba(245,197,24,0.12); border-color:rgba(245,197,24,0.6); transform:translateY(-2px); }

/* Nav is position:fixed, so anchor jumps (e.g. the "Why Us" link landing on
   reviews.html#why) need extra top margin or the section hides underneath it. */
#why{ scroll-margin-top: 130px; }

/* ── HERO STATS — extra prominence accent ────────────────────
   A thin static gradient edge along the top of each stat card.
   No animation/JS — purely a one-time paint, so it costs nothing. */
.hero-stat{ position: relative; overflow: hidden; }
.hero-stat::before{
  content:'';
  position:absolute; top:0; left:12%; right:12%; height:2px;
  background: linear-gradient(90deg, transparent, var(--neon-gold), var(--neon-cyan), transparent);
  opacity:.75;
  pointer-events:none;
}

/* ═══ PAGE BANNER + BREADCRUMBS (subpages: services / travel-guide / reviews) ═══ */
.page-banner{
  padding: 56px 0 44px;
  text-align: center;
  background: var(--black, #0c1220);
  position: relative;
}
.breadcrumb-nav{
  padding: 14px 0;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.breadcrumb-list{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  font-size: 13px;
  color: rgba(255,255,255,0.55);
}
.breadcrumb-list li{ display:flex; align-items:center; gap:6px; }
.breadcrumb-list a{
  color: rgba(255,255,255,0.7);
  text-decoration: none;
  transition: color .2s;
}
.breadcrumb-list a:hover{ color: var(--yellow, #F5C518); }
.breadcrumb-list li:last-child{ color: var(--yellow, #F5C518); font-weight: 600; }
.breadcrumb-list li:not(:last-child)::after{
  content: "/";
  margin-left: 6px;
  color: rgba(255,255,255,0.3);
}

/* ═══ FAQ SECTION ═══ */
.faq-list{ max-width: 820px; margin: 32px auto 0; display: flex; flex-direction: column; gap: 12px; }
.faq-item{
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 17px;
  overflow: hidden;
}
.faq-question{
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  padding: 18px 22px;
  font-size: 15.5px;
  font-weight: 600;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.faq-question i{ color: var(--yellow, #F5C518); transition: transform .25s; flex-shrink: 0; }
.faq-item.open .faq-question i{ transform: rotate(180deg); }
.faq-answer{
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.faq-item.open .faq-answer{ max-height: 400px; }
.faq-answer p{
  padding: 0 22px 18px;
  margin: 0;
  color: rgba(255,255,255,0.65);
  font-size: 14.5px;
  line-height: 1.7;
}

/* ════════════════════════════════════════════════════════════
   DARK MODE FEATURE ANNOUNCEMENT (spotlight popover)
   ════════════════════════════════════════════════════════════ */
.dm-announce{
  position: fixed;
  top: 110px;
  right: 24px;
  z-index: 10001;
  width: 300px;
  max-width: calc(100vw - 32px);
  background: #14141a;
  color: #fff;
  border-radius: 17px;
  padding: 20px 20px 18px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35), 0 2px 12px rgba(245,197,24,0.15);
  border: 1px solid rgba(245,197,24,0.25);
  opacity: 0;
  transform: translateY(-10px) scale(0.96);
  pointer-events: none;
  transition: opacity .35s cubic-bezier(.2,.8,.2,1), transform .35s cubic-bezier(.2,.8,.2,1);
}
.dm-announce.show{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
  animation: dmFloat 3.2s ease-in-out 0.5s infinite;
}
@keyframes dmFloat{
  0%, 100% { transform: translateY(0) scale(1); }
  50%      { transform: translateY(-4px) scale(1); }
}
.dm-announce-arrow{
  position: absolute;
  top: -8px;
  right: 34px;
  width: 16px;
  height: 16px;
  background: #14141a;
  border-left: 1px solid rgba(245,197,24,0.25);
  border-top: 1px solid rgba(245,197,24,0.25);
  transform: rotate(45deg);
}
.dm-announce-close{
  position: absolute;
  top: 12px;
  right: 12px;
  width: 24px;
  height: 24px;
  border: none;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.65);
  border-radius: 50%;
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.dm-announce-close:hover{ background: rgba(255,255,255,0.18); color: #fff; }
.dm-announce-top{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.dm-announce-icon{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  background: linear-gradient(135deg, #F5C518, #E6A800);
  color: #14141a;
  border-radius: 50%;
  font-size: 16px;
  box-shadow: 0 4px 14px rgba(245,197,24,0.35);
}
.dm-announce-badge{
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  background: rgba(245,197,24,0.15);
  color: #F5C518;
  border: 1px solid rgba(245,197,24,0.4);
  padding: 3px 9px;
  border-radius: 100px;
}
.dm-announce-title{
  font-family: 'Playfair Display', serif;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #fff;
}
.dm-announce-text{
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(255,255,255,0.62);
  margin-bottom: 16px;
}
.dm-announce-actions{
  display: flex;
  align-items: center;
  gap: 10px;
}
.dm-announce-try{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #F5C518;
  color: #14141a;
  border: none;
  border-radius: 100px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s, transform .2s;
}
.dm-announce-try:hover{ background: #E6A800; transform: translateY(-1px); }
.dm-announce-later{
  background: none;
  border: none;
  color: rgba(255,255,255,0.5);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  padding: 10px 6px;
  transition: color .2s;
}
.dm-announce-later:hover{ color: rgba(255,255,255,0.85); }

/* Pulsing highlight ring drawn around the theme toggle button while announcement is visible */
#theme-toggle-btn.dm-pulse{ position: relative; }
#theme-toggle-btn.dm-pulse::after{
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid #F5C518;
  animation: dmPulseRing 1.8s ease-out infinite;
  pointer-events: none;
}
@keyframes dmPulseRing{
  0%   { transform: scale(1);   opacity: 0.9; }
  100% { transform: scale(1.6); opacity: 0;   }
}

@media (max-width: 640px){
  .dm-announce{ top: 96px; right: 16px; width: 268px; padding: 16px 16px 14px; }
  .dm-announce-arrow{ right: 26px; }
  .dm-announce-title{ font-size: 16.5px; }
}