/* =========================================================================
   FF SURVIVAL GUIDE VIBE SKIN  ·  scoped to body.ff-survival-skin ONLY
   Dark vibe-kit skin painted over the live UAEL FAQ Elementor page (29822).
   Content stays 100% Elementor-editable; this only recolours the output and
   adds the dark chrome + an H1 hero. Self-contained (no dependency on the
   FAQ skin): declares its own --ff-* tokens and chrome CSS.
   ========================================================================= */
body.ff-survival-skin{
  --ff-teal:#56efe0; --ff-purple:#b46cff; --ff-green:#4ae08b; --ff-orange:#fb923c;
  --ff-bg:#0b0b0d; --ff-ink:#f4f6fb;
  --ff-g1:var(--ff-teal); --ff-g2:var(--ff-purple); --ff-g3:var(--ff-orange);
  background:var(--ff-bg) !important; color:var(--ff-ink) !important;
  font-family:'Archivo',system-ui,-apple-system,sans-serif;
  overflow-x:hidden;
}

/* ── ambient layers (injected by the mu-plugin) ── */
body.ff-survival-skin .ff-aurora{
  position:fixed; inset:0; z-index:-1; pointer-events:none; filter:blur(72px); opacity:.45;
  background:
    radial-gradient(38% 42% at 18% 22%, color-mix(in srgb, var(--ff-g1) 46%, transparent), transparent 60%),
    radial-gradient(40% 44% at 82% 28%, color-mix(in srgb, var(--ff-g2) 44%, transparent), transparent 62%),
    radial-gradient(46% 50% at 50% 90%, color-mix(in srgb, var(--ff-g3) 34%, transparent), transparent 60%);
}
body.ff-survival-skin .ff-grain{
  position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.04; mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ── hide the theme + Elementor theme-builder chrome (we inject our own) ── */
body.ff-survival-skin [data-elementor-type="header"],
body.ff-survival-skin [data-elementor-type="footer"],
body.ff-survival-skin .elementor-location-header,
body.ff-survival-skin .elementor-location-footer,
body.ff-survival-skin header.site-header,
body.ff-survival-skin footer.site-footer{ display:none !important; }

/* ── dark header chrome ── */
body.ff-survival-skin .ff-hd{ position:sticky; top:0; z-index:30; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px clamp(16px,4vw,48px); border-bottom:1px solid rgba(255,255,255,.08); }
body.ff-survival-skin .ff-hd.scrolled{ background:linear-gradient(180deg,rgba(12,14,22,.86),rgba(12,14,22,.72)); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
body.ff-survival-skin .ff-logo{ display:flex; align-items:center; text-decoration:none; }
body.ff-survival-skin .ff-logo svg{ height:30px; width:auto; display:block; }
body.ff-survival-skin .ff-nav{ display:flex; align-items:center; gap:26px; }
body.ff-survival-skin .ff-nav a{ color:rgba(244,246,251,.78) !important; text-decoration:none; font-size:13px; letter-spacing:.06em; text-transform:uppercase; transition:color .2s; }
body.ff-survival-skin .ff-nav a:hover{ color:#eafffb !important; }
body.ff-survival-skin .ff-lang{ display:inline-flex; align-items:center; gap:6px; font-size:12px; letter-spacing:.1em; color:rgba(244,246,251,.55); }
body.ff-survival-skin .ff-lang a{ color:rgba(244,246,251,.55); text-decoration:none; transition:color .2s; }
body.ff-survival-skin .ff-lang a:hover{ color:var(--ff-teal); }
body.ff-survival-skin .ff-lang .ff-lang-cur{ color:var(--ff-ink); font-weight:700; }
body.ff-survival-skin .ff-lang .ff-lang-sep{ color:rgba(244,246,251,.3); }
body.ff-survival-skin .ff-hd-right{ display:flex; align-items:center; gap:12px; }
body.ff-survival-skin .ff-btn{ display:inline-flex; align-items:center; gap:8px; font-weight:800; letter-spacing:.04em; text-decoration:none; border-radius:999px; padding:11px 22px; font-size:13px; text-transform:uppercase; transition:transform .2s ease,box-shadow .3s ease,background .2s; }
body.ff-survival-skin .ff-btn-primary{ background:var(--ff-teal); color:#06231f !important; box-shadow:0 10px 30px -10px rgba(86,239,224,.6); }
body.ff-survival-skin .ff-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 40px -12px rgba(86,239,224,.8); }
body.ff-survival-skin .ff-btn-sm{ padding:9px 18px; font-size:12px; }
body.ff-survival-skin .ff-navtoggle{ display:none; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; background:none; border:1px solid rgba(255,255,255,.18); border-radius:10px; cursor:pointer; padding:0; }
body.ff-survival-skin .ff-navtoggle span{ display:block; width:18px; height:2px; background:var(--ff-ink); margin:0 auto; transition:.25s; }
body.ff-survival-skin .ff-navtoggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
body.ff-survival-skin .ff-navtoggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
body.ff-survival-skin .ff-navtoggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ── H1 hero (injected by the mu-plugin) ── */
body.ff-survival-skin .ff-sg-hero{ position:relative; z-index:2; max-width:920px; margin:0 auto; padding:clamp(36px,6vw,72px) clamp(16px,4vw,48px) clamp(8px,2vw,18px); text-align:center; }
body.ff-survival-skin .ff-sg-kicker{ display:inline-flex; align-items:center; gap:10px; font-size:12px; letter-spacing:.26em; text-transform:uppercase; color:rgba(244,246,251,.55); margin:0 0 14px; }
body.ff-survival-skin .ff-sg-kicker::before{ content:""; width:26px; height:1px; background:var(--ff-g3); }
body.ff-survival-skin .ff-sg-h1{ font-size:clamp(34px,6vw,68px); line-height:1.03; letter-spacing:-.02em; margin:0; padding-bottom:.06em; font-weight:840;
  background:linear-gradient(100deg,var(--ff-g1),var(--ff-g2) 45%,var(--ff-g3) 82%); -webkit-background-clip:text; background-clip:text; color:transparent; }
body.ff-survival-skin .ff-sg-lead{ margin:16px auto 0; max-width:46em; font-size:clamp(15px,2vw,18px); line-height:1.6; color:rgba(244,246,251,.82); }

/* ── content column width + strip baked-in light backgrounds ── */
body.ff-survival-skin .elementor.elementor-29822,
body.ff-survival-skin .elementor.elementor-29823{ max-width:920px; margin:0 auto; padding:8px clamp(16px,4vw,48px) 30px; position:relative; z-index:2; }
body.ff-survival-skin .e-con, body.ff-survival-skin .e-con-inner,
body.ff-survival-skin .elementor-element, body.ff-survival-skin .elementor-widget-container,
body.ff-survival-skin .elementor-section, body.ff-survival-skin .page-content,
body.ff-survival-skin #content, body.ff-survival-skin .site-main{
  background-color:transparent !important; background-image:none !important; box-shadow:none !important;
}
body.ff-survival-skin .elementor-widget-image img{ border-radius:16px; }

/* ── general copy / links / headings inside the content ── */
body.ff-survival-skin p, body.ff-survival-skin li, body.ff-survival-skin span,
body.ff-survival-skin .elementor-widget-text-editor, body.ff-survival-skin .elementor-widget-html{
  color:rgba(244,246,251,.85) !important;
}
body.ff-survival-skin a{ color:var(--ff-teal) !important; }
body.ff-survival-skin a:hover{ color:#eafffb !important; }
body.ff-survival-skin strong, body.ff-survival-skin b{ color:var(--ff-ink) !important; }
body.ff-survival-skin h2, body.ff-survival-skin h3, body.ff-survival-skin h5, body.ff-survival-skin h6{ color:var(--ff-ink) !important; }
/* the big content H2 (e.g. "Celebrating 12 Years") gets the gradient glam */
body.ff-survival-skin .uael-accordion-content h2{
  background:linear-gradient(100deg,var(--ff-g1),var(--ff-g2) 45%,var(--ff-g3) 82%);
  -webkit-background-clip:text; background-clip:text; color:transparent !important;
  font-weight:820; letter-spacing:-.01em; font-size:clamp(22px,3.4vw,30px) !important; line-height:1.18;
}

/* =======================  UAEL FAQ ACCORDION  ======================= */
body.ff-survival-skin .uael-faq-wrapper{ max-width:880px; margin:18px auto 0; }
body.ff-survival-skin .uael-faq-container.uael-faq-layout-accordion{ display:flex; flex-direction:column; gap:12px; }
/* each Q row */
body.ff-survival-skin .uael-accordion-title{
  display:flex; align-items:center; gap:14px; cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02)) !important;
  border:1px solid rgba(255,255,255,.12) !important; border-radius:16px !important;
  padding:18px 20px !important; transition:border-color .2s, background .2s;
}
body.ff-survival-skin .uael-accordion-title:hover{ border-color:rgba(86,239,224,.4) !important; }
body.ff-survival-skin .uael-accordion-title[aria-expanded="true"]{
  border-color:rgba(86,239,224,.5) !important; border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important;
  background:linear-gradient(180deg,rgba(86,239,224,.08),rgba(255,255,255,.02)) !important;
}
/* the Q label (an <h4>) */
body.ff-survival-skin .uael-question-span{
  margin:0 !important; color:var(--ff-ink) !important; font-weight:800 !important;
  font-size:clamp(15px,2vw,18px) !important; letter-spacing:.04em; text-transform:uppercase; line-height:1.25;
}
/* expand/collapse icon */
body.ff-survival-skin .uael-accordion-icon{ color:var(--ff-teal) !important; }
body.ff-survival-skin .uael-accordion-icon svg{ width:16px; height:16px; fill:var(--ff-teal) !important; }
body.ff-survival-skin .uael-accordion-icon path{ fill:var(--ff-teal) !important; }
/* answer panel */
body.ff-survival-skin .uael-accordion-content{
  background:rgba(11,12,18,.5) !important; border:1px solid rgba(86,239,224,.5) !important; border-top:0 !important;
  border-radius:0 0 16px 16px !important; padding:6px 22px 22px !important;
  font-size:15px; line-height:1.65;
}
body.ff-survival-skin .uael-accordion-content p{ margin:12px 0 0; }
body.ff-survival-skin .uael-accordion-content ul, body.ff-survival-skin .uael-accordion-content ol{ margin:12px 0 0; padding-left:20px; }
body.ff-survival-skin .uael-accordion-content li{ margin:5px 0; }
/* override any inline-styled coloured text baked into the editor content */
body.ff-survival-skin .uael-accordion-content [style*="color"]{ color:rgba(244,246,251,.85) !important; }
body.ff-survival-skin .uael-accordion-content a[style*="color"]{ color:var(--ff-teal) !important; }

/* ── version / last-updated stamp ── */
body.ff-survival-skin .ff-sg-version{
  max-width:880px; margin:10px auto 0; padding:22px clamp(16px,4vw,48px) 0;
  border-top:1px solid rgba(255,255,255,.08); text-align:center;
  font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(244,246,251,.45); position:relative; z-index:2;
}

/* ── focus visibility ── */
body.ff-survival-skin .ff-nav a:focus-visible, body.ff-survival-skin .ff-btn:focus-visible,
body.ff-survival-skin .uael-accordion-title:focus-visible, body.ff-survival-skin .uael-question-span:focus-visible{
  outline:2px solid var(--ff-teal); outline-offset:2px; border-radius:8px;
}

/* ── responsive ── */
@media (max-width:860px){
  body.ff-survival-skin .ff-navtoggle{ display:flex; }
  body.ff-survival-skin .ff-nav{ display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:linear-gradient(180deg,rgba(12,14,22,.98),rgba(12,14,22,.96)); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid rgba(255,255,255,.1); padding:6px 24px 16px; }
  body.ff-survival-skin .ff-nav.open{ display:flex; }
  body.ff-survival-skin .ff-nav a{ padding:13px 0; font-size:14px; border-bottom:1px solid rgba(255,255,255,.06); }
  body.ff-survival-skin .ff-nav .ff-lang{ padding:13px 0; }
}
@media (prefers-reduced-motion:reduce){
  body.ff-survival-skin *{ scroll-behavior:auto !important; }
}