.elementor-kit-9{--e-global-color-primary:#003366;--e-global-color-secondary:#00509E;--e-global-color-text:#000000;--e-global-color-accent:#FFCC00;--e-global-color-background:#FFFFFF;--e-global-color-backgroundAccent:#F0F4F8;--e-global-color-transparent:#00000000;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:24px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Figtree";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"Figtree";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-line-height:1.5em;--e-global-typography-heading_xl-font-family:"Poppins";--e-global-typography-heading_xl-font-size:56px;--e-global-typography-heading_xl-font-weight:600;--e-global-typography-heading_xl-line-height:1.2em;--e-global-typography-heading_l-font-family:"Poppins";--e-global-typography-heading_l-font-size:48px;--e-global-typography-heading_l-font-weight:600;--e-global-typography-heading_l-line-height:1.2em;--e-global-typography-heading_m-font-family:"Poppins";--e-global-typography-heading_m-font-size:40px;--e-global-typography-heading_m-font-weight:600;--e-global-typography-heading_m-line-height:1.2em;--e-global-typography-heading_s-font-family:"Poppins";--e-global-typography-heading_s-font-size:18px;--e-global-typography-heading_s-font-weight:500;--e-global-typography-body_s-font-family:"Figtree";--e-global-typography-body_s-font-size:14px;--e-global-typography-body_s-font-weight:400;--e-global-typography-body_s-line-height:1.5em;background-color:var( --e-global-color-background );}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-9{--e-global-typography-primary-font-size:22px;--e-global-typography-secondary-font-size:18px;--e-global-typography-heading_xl-font-size:48px;--e-global-typography-heading_l-font-size:40px;--e-global-typography-heading_m-font-size:32px;--e-global-typography-heading_s-font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-9{--e-global-typography-primary-font-size:18px;--e-global-typography-secondary-font-size:16px;--e-global-typography-heading_xl-font-size:40px;--e-global-typography-heading_l-font-size:32px;--e-global-typography-heading_m-font-size:32px;--e-global-typography-heading_s-font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS */<!-- =========================================================
FBM PREMIUM GUIDE — ONE-PASTE CSS (includes dark screenshot background)
Paste once in Elementor > Site Settings > Custom CSS
(or paste at the top of each guide page HTML)

This version makes screenshots clearly separated with a darker frame.
========================================================= -->
<style>
  :root{
    --navy:#003366;
    --gold:#FFCC00;

    --text:#0b1220;
    --muted:#5b667a;

    --border: rgba(11,18,32,.10);
    --border2: rgba(11,18,32,.14);

    --bg1:#f6f8fc;
    --bg2:#ffffff;

    --shadow1: 0 22px 60px rgba(11,18,32,.12);
    --shadow2: 0 10px 28px rgba(11,18,32,.08);

    --radius:22px;
    --radius2:18px;

    --max: 1060px;
  }

  .fbm-guide{
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
    color: var(--text);
    font-size: 17px;
    line-height: 1.9;
    letter-spacing: -0.01em;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  .fbm-guide *{ box-sizing:border-box; }
  .fbm-wrap{ max-width: var(--max); margin: 0 auto; padding: 36px 16px 54px; }

  /* Topbar */
  .fbm-topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom: 18px; }
  .fbm-back{
    display:inline-flex; align-items:center; gap:10px;
    padding: 10px 12px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.86);
    backdrop-filter: blur(12px);
    color: var(--muted);
    text-decoration:none;
    font-weight: 900;
    font-size: 14px;
    transition: .16s ease;
  }
  .fbm-back:hover{
    color: var(--navy);
    border-color: rgba(0,51,102,.25);
    transform: translateY(-1px);
    box-shadow: var(--shadow2);
  }
  .fbm-badge{
    display:inline-flex; gap:8px; align-items:center;
    padding: 10px 14px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(0,51,102,.10), rgba(0,51,102,.05));
    border: 1px solid rgba(0,51,102,.18);
    color: var(--navy);
    font-weight: 1000;
    font-size: 13px;
    letter-spacing: .03em;
  }

  /* Hero */
  .fbm-hero{
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background:
      radial-gradient(1200px 420px at 12% 0%, rgba(255,204,0,.22), transparent 55%),
      radial-gradient(900px 420px at 92% 12%, rgba(0,51,102,.18), transparent 55%),
      linear-gradient(180deg, var(--bg2), var(--bg1));
    box-shadow: var(--shadow1);
    padding: 28px;
    position: relative;
    overflow: hidden;
  }
  .fbm-hero:after{
    content:"";
    position:absolute; inset:-2px;
    border-radius: var(--radius);
    pointer-events:none;
    background: linear-gradient(135deg, rgba(255,255,255,.55), rgba(255,255,255,0));
    mix-blend-mode: overlay;
    opacity:.65;
  }
  .fbm-title{
    margin:0;
    color: var(--navy);
    font-size: 40px;
    line-height: 1.12;
    letter-spacing: -0.03em;
    font-weight: 1000;
  }
  .fbm-sub{
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.75;
    font-weight: 700;
    max-width: 72ch;
  }

  /* Meta */
  .fbm-meta{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 16px; }
  .fbm-meta .pill{
    display:inline-flex; align-items:center; gap:8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.90);
    border: 1px solid var(--border);
    color: rgba(11,18,32,.92);
    font-size: 14px;
    font-weight: 900;
    backdrop-filter: blur(10px);
  }

  /* Buttons */
  .fbm-cta{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: 18px; position: relative; z-index: 1; }
  .fbm-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    padding: 14px 18px;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.92);
    color: var(--navy);
    text-decoration:none;
    font-size: 15px;
    font-weight: 1000;
    transition: .16s ease;
    box-shadow: 0 1px 0 rgba(11,18,32,.02);
  }
  .fbm-btn:hover{
    transform: translateY(-1px);
    border-color: rgba(0,51,102,.22);
    box-shadow: 0 20px 40px rgba(11,18,32,.12);
  }
  .fbm-btn.primary{
    background: linear-gradient(180deg, rgba(255,204,0,1), rgba(255,204,0,.86));
    border-color: rgba(0,0,0,.06);
    color: #111827;
  }

  /* Cards */
  .fbm-section{ margin-top: 18px; }
  .fbm-card{
    border-radius: var(--radius);
    background: #fff;
    border: 1px solid var(--border);
    box-shadow: var(--shadow2);
    overflow:hidden;
  }
  .fbm-card-hd{
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,248,252,.92));
  }
  .fbm-step{ display:flex; gap: 14px; align-items:flex-start; }
  .fbm-stepnum{
    min-width: 46px; height: 46px;
    border-radius: 16px;
    display:flex; align-items:center; justify-content:center;
    font-weight: 1000;
    font-size: 15px;
    color: #111827;
    background: linear-gradient(180deg, rgba(255,204,0,.34), rgba(255,204,0,.18));
    border: 1px solid rgba(255,204,0,.40);
    box-shadow: 0 12px 26px rgba(255,204,0,.20);
  }
  .fbm-step-title{
    margin: 0;
    font-size: 19px;
    line-height: 1.35;
    font-weight: 1000;
    color: rgba(11,18,32,.98);
    letter-spacing: -0.02em;
  }
  .fbm-step-desc{
    margin: 8px 0 0;
    font-size: 17px;
    line-height: 1.9;
    color: var(--muted);
    font-weight: 700;
    max-width: 80ch;
  }
  .fbm-card-bd{ padding: 16px 20px 22px; }

  /* Screenshots — DARK FRAME (requested) */
  .fbm-shot{
    border-radius: 18px;
    overflow:hidden;
    padding: 14px; /* frame thickness */
    background: linear-gradient(180deg, #0b1220, #111827); /* dark background/frame */
    border: 1px solid rgba(255,255,255,.08);
    box-shadow:
      0 26px 60px rgba(0,0,0,.28),
      0 10px 26px rgba(0,0,0,.18);
  }
  .fbm-shot img{
    width:100%;
    height:auto;
    display:block;
    border-radius: 14px; /* inner radius */
    box-shadow: 0 10px 28px rgba(0,0,0,.35);
  }
  .fbm-shot .ph{
    padding: 34px;
    text-align:center;
    color: rgba(255,255,255,.82);
    font-weight: 900;
    font-size: 14px;
    background: transparent;
    border-radius: 14px;
    border: 1px dashed rgba(255,255,255,.18);
  }

  /* Callouts */
  .fbm-callout{
    margin-top: 14px;
    border-radius: 18px;
    border: 1px solid rgba(0,51,102,.18);
    background: linear-gradient(180deg, rgba(0,51,102,.07), rgba(0,51,102,.04));
    padding: 14px 16px;
  }
  .fbm-callout h4{
    margin: 0 0 6px;
    color: var(--navy);
    font-weight: 1000;
    font-size: 15px;
    letter-spacing: -0.01em;
  }
  .fbm-callout p, .fbm-callout li{
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.9;
    font-weight: 700;
  }
  .fbm-callout ul{ margin: 10px 0 0 20px; padding:0; }
  .fbm-callout li{ margin: 6px 0; }

  /* Security */
  .fbm-security{
    margin-top: 14px;
    border-radius: 18px;
    border: 1px solid rgba(11,18,32,.10);
    background: rgba(255,255,255,.90);
    padding: 14px 16px;
    position: relative;
    z-index: 1;
  }
  .fbm-security strong{ color: var(--navy); font-weight: 1000; }
  .fbm-security p{ margin: 6px 0 0; color: var(--muted); font-size: 17px; line-height: 1.9; font-weight: 700; }

  /* Other guides */
  .fbm-divider{ height:1px; background: rgba(11,18,32,.10); margin: 24px 0; }
  .fbm-other h3{ margin:0 0 12px; font-size: 19px; font-weight: 1000; color: var(--navy); letter-spacing: -0.02em; }
  .fbm-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  @media (min-width: 900px){ .fbm-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); } }
  .fbm-mini{ margin-top: 10px; color: var(--muted); font-size: 14px; font-weight: 800; }

  .fbm-guide strong{ color: rgba(11,18,32,.96); font-weight: 950; }
</style>/* End custom CSS */