/* ══════════════════════════════════════════════════════════════════════
   FAIME — Cookie consent UI (standalone)
   ──────────────────────────────────────────────────────────────────────
   faime.js injects #faime-cookie-card and #fm-cookie-chip on every page it
   runs on, but their styles lived only in css/faime-motion.css, which the
   /lp/ ad landing pages do not load. The banner was therefore rendering
   unstyled at the foot of those pages — invisible in practice, so an ad
   visitor could never grant analytics consent, and the Meta Pixel (which
   waits on that consent) could never fire.

   This file carries just those rules, plus the --fm-* variables they
   depend on, so any page can load the consent UI without pulling in the
   full motion stylesheet. Rules are copied verbatim from faime-motion.css;
   that file is unchanged and remains the source for the main site.

   Added 2026-09-05 while wiring the Meta Pixel.
   ══════════════════════════════════════════════════════════════════════ */

:root{
  --fm-navy:#0C1F3F;
  --fm-navy2:#071428;
  --fm-gold:#C9A84C;
  --fm-gold2:#E5C060;
  --fm-ease:cubic-bezier(.22,1,.36,1);
}

/* ─────────── COOKIE CONSENT — CORNER CARD ───────────
   Bottom-LEFT corner: the bottom-right corner belongs to the WhatsApp +
   scroll-top floats — never cover them. */
#faime-cookie-card{
  position:fixed; left:22px; bottom:22px; z-index:9000;
  width:min(360px,calc(100vw - 110px));
  background:var(--fm-navy2);
  border:1px solid rgba(201,168,76,.35); border-top:3px solid var(--fm-gold);
  box-shadow:0 18px 60px rgba(0,0,0,.5);
  font-family:'Barlow',sans-serif;
  transform:translateY(24px); opacity:0;
  animation:fmCookieIn .6s var(--fm-ease) .8s both;
}
#faime-cookie-card.fm-closing{ transition:all .35s var(--fm-ease); transform:translateY(24px); opacity:0; }
.fm-ck-body{ padding:20px 22px 18px; }
.fm-ck-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.fm-ck-head svg{ width:18px; height:18px; stroke:var(--fm-gold); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.fm-ck-title{
  font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800;
  color:var(--fm-gold); letter-spacing:1.5px; text-transform:uppercase;
}
.fm-ck-text{ font-size:12.5px; line-height:1.55; color:rgba(255,255,255,.62); }
.fm-ck-text a{ color:var(--fm-gold); text-decoration:underline; }
.fm-ck-prefs{ display:none; margin-top:12px; border-top:1px solid rgba(255,255,255,.08); padding-top:12px; }
.fm-ck-prefs.fm-open{ display:block; }
.fm-ck-row{ display:flex; align-items:center; justify-content:space-between; padding:7px 0; }
.fm-ck-row-label{ font-size:12.5px; color:rgba(255,255,255,.78); font-weight:600; }
.fm-ck-row-sub{ font-size:10.5px; color:rgba(255,255,255,.38); margin-top:1px; }
.fm-ck-switch{ position:relative; width:38px; height:20px; flex-shrink:0; }
.fm-ck-switch input{ opacity:0; width:0; height:0; }
.fm-ck-slider{
  position:absolute; inset:0; cursor:pointer; border-radius:20px;
  background:rgba(255,255,255,.15); transition:background .25s;
}
.fm-ck-slider::before{
  content:''; position:absolute; left:3px; top:3px; width:14px; height:14px;
  border-radius:50%; background:#fff; transition:transform .25s var(--fm-ease);
}
.fm-ck-switch input:checked+.fm-ck-slider{ background:var(--fm-gold); }
.fm-ck-switch input:focus-visible+.fm-ck-slider{ outline:2px solid var(--fm-gold2); outline-offset:2px; }
.fm-ck-switch input:checked+.fm-ck-slider::before{ transform:translateX(18px); }
.fm-ck-switch input:disabled+.fm-ck-slider{ opacity:.5; cursor:not-allowed; }
.fm-ck-actions{ display:flex; gap:8px; margin-top:14px; }
.fm-ck-btn{
  flex:1; padding:10px 8px; cursor:pointer; border:none;
  font-family:'Barlow Condensed',sans-serif; font-size:12.5px; font-weight:800;
  letter-spacing:1.2px; text-transform:uppercase; transition:all .2s;
}
.fm-ck-btn.fm-primary{ background:var(--fm-gold); color:var(--fm-navy); }
.fm-ck-btn.fm-primary:hover{ background:var(--fm-gold2); }
.fm-ck-btn.fm-ghost{
  background:transparent; border:1.5px solid rgba(255,255,255,.2); color:rgba(255,255,255,.7);
}
.fm-ck-btn.fm-ghost:hover{ border-color:rgba(255,255,255,.5); color:#fff; }
.fm-ck-manage{
  margin-top:10px; background:none; border:none; cursor:pointer;
  font-size:11px; letter-spacing:1px; text-transform:uppercase;
  color:rgba(255,255,255,.4); text-decoration:underline; font-family:'Barlow',sans-serif;
}
.fm-ck-manage:hover{ color:var(--fm-gold); }
/* Re-open chip after a choice is made (also bottom-left) */
#fm-cookie-chip{
  position:fixed; left:18px; bottom:18px; z-index:8999;
  width:40px; height:40px; border-radius:50%;
  background:var(--fm-navy2); border:1px solid rgba(201,168,76,.4);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:.55; transition:opacity .25s, transform .25s;
}
#fm-cookie-chip:hover{ opacity:1; transform:scale(1.08); }
#fm-cookie-chip svg{ width:18px; height:18px; stroke:var(--fm-gold); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
@media (prefers-reduced-motion:reduce){
  #faime-cookie-card{ animation-duration:.01s !important; }
}
@media (max-width:600px){
  #faime-cookie-card{ left:10px; bottom:10px; width:min(330px,calc(100vw - 96px)); }
}
@media print{
  #faime-cookie-card,#fm-cookie-chip{ display:none !important; }
}

/* The entry animation the card depends on — without it the base rule
   leaves the card at opacity:0 and it never becomes visible. */
@keyframes fmCookieIn{
  from{ transform:translateY(24px); opacity:0; }
  to{ transform:translateY(0); opacity:1; }
}

/* Print safety, mirroring styles/faime-premium.css */
@media print{
  #faime-cookie-card,#fm-cookie-chip{display:none!important}
}