.fbn{
  --ink:#0B1533; --body:#1C2740; --muted:#5A6B90; --dim:#8792AE;
  --line:rgba(11,21,51,.12); --card:#F4F6FB;
  --purple:#7A4FE0; --purple-dk:#5A2FC0;
  --freen:#2E7396; --becky:#D93B85; --violet:#A97AFF;
  --duo:linear-gradient(90deg,#2E7396 0%,#7A4FE0 52%,#D93B85 100%);
  --max:1200px; --gutter:clamp(20px,5vw,48px);
  --display:"Playfair Display",Georgia,serif; --ui:"Jost",system-ui,sans-serif;
  background:transparent; color:var(--body); max-width:100%; overflow-x:clip;
  font-family:var(--ui); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.fbn *{box-sizing:border-box;min-width:0;max-width:100%;}
.fbn :where(p,span){margin:0;padding:0;}
.fbn h1,.fbn b{color:var(--ink);-webkit-text-fill-color:var(--ink);}
.fbn h1{font-family:var(--display);}
.fbn .fbn-head h2,.fbn .fbn-head h3,.fbn .fbn-head h4{color:var(--ink);-webkit-text-fill-color:var(--ink);}
.fbn a{text-decoration:none;color:inherit;}
.fbn img{display:block;width:100%;height:auto;}

.fbn-sec{padding:clamp(34px,5vw,72px) 0;}
.fbn-in{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);}
.fbn-kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  background-image:var(--duo);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:600;}
.fbn-h1{font-weight:600;font-size:clamp(32px,5.5vw,56px);line-height:1.03;margin-top:10px;}
.fbn-intro{color:var(--muted);max-width:64ch;margin-top:14px;font-size:16.5px;}

/* featured (square corners) */
.fbn-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:0;margin-top:34px;
  background:#fff;border:1px solid var(--line);border-radius:0;overflow:hidden;
  box-shadow:0 14px 40px rgba(11,21,51,.08);transition:transform .3s,box-shadow .3s;}
.fbn-feature:hover{transform:translateY(-4px);box-shadow:0 24px 54px rgba(11,21,51,.14);}
.fbn-feat-shot{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--card);}
.fbn-feat-shot img{width:100%;height:100%;object-fit:cover;object-position:center 20%;transition:transform .8s cubic-bezier(.2,.7,.3,1);}
.fbn-feature:hover .fbn-feat-shot img{transform:scale(1.04);}
/* category pill: bottom-left so it stays clear of faces */
.fbn-feat-cat,.fbn-cat{position:absolute;left:14px;bottom:14px;top:auto;z-index:2;font-size:10px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;border-radius:99px;
  color:#fff;-webkit-text-fill-color:#fff;background-image:var(--duo);
  box-shadow:0 2px 10px rgba(7,14,36,.35);}
.fbn-feat-body{padding:clamp(24px,3vw,38px);display:flex;flex-direction:column;justify-content:center;}
.fbn-feat-t{font-family:var(--display);font-weight:600;font-size:clamp(22px,2.8vw,30px);line-height:1.18;color:#191970;}
.fbn-feat-d{color:var(--body);font-size:16.5px;line-height:1.55;margin-top:12px;}
.fbn-feat-meta{font-size:13px;letter-spacing:.06em;color:#353935;margin-top:16px;}

/* grid (square corners) */
.fbn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px;}
.fbn-grid.is-flush{margin-top:0;}
.fbn-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:0;
  overflow:hidden;box-shadow:0 8px 24px rgba(11,21,51,.06);transition:transform .28s,box-shadow .28s;}
.fbn-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(11,21,51,.13);}
.fbn-shot{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--card);}
.fbn-shot img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform .7s cubic-bezier(.2,.7,.3,1);}
.fbn-card:hover .fbn-shot img{transform:scale(1.05);}
.fbn-body{padding:16px 18px 20px;display:flex;flex-direction:column;flex:1 1 auto;}
.fbn-t{font-family:var(--display);font-weight:600;font-size:17px;line-height:1.25;color:#191970;}
.fbn-d{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:17px;line-height:1.5;color:#303030;margin-top:8px;}
.fbn-meta{font-size:12px;letter-spacing:.06em;color:var(--dim);margin-top:auto;padding-top:12px;}

/* pager */
.fbn-pager{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px;}
.fbn-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;
  padding:10px 16px;border-radius:99px;border:1px solid var(--line);font-size:13px;font-weight:500;
  letter-spacing:.06em;color:var(--ink);-webkit-text-fill-color:var(--ink);transition:border-color .2s,color .2s;}
.fbn-pager .page-numbers:hover{border-color:var(--purple);color:var(--purple);-webkit-text-fill-color:var(--purple);}
.fbn-pager .page-numbers.current{background-image:var(--duo);border-color:transparent;color:#fff;-webkit-text-fill-color:#fff;font-weight:600;}
.fbn-pager .page-numbers.dots{border-color:transparent;}

/* who / when filters */
.fbn-filters{display:grid;gap:10px;margin-top:26px;scroll-margin-top:var(--anchor-offset,100px);}
.fbn-frow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.fbn-flabel{width:52px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--muted);}
.fbn .fbn-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:99px;border:1px solid var(--line);
  background:#fff;font-size:14px;font-weight:600;line-height:1.2;color:var(--ink);-webkit-text-fill-color:var(--ink);transition:border-color .2s,background .2s;}
.fbn .fbn-chip small{font-size:12px;font-weight:500;color:var(--dim);-webkit-text-fill-color:var(--dim);}
.fbn .fbn-chip:hover{border-color:var(--purple);}
.fbn .fbn-chip.is-freen:hover{border-color:var(--freen);} .fbn .fbn-chip.is-becky:hover{border-color:var(--becky);}
.fbn .fbn-chip.is-on{background:#0B1533;border-color:#0B1533;color:#fff;-webkit-text-fill-color:#fff;}
.fbn .fbn-chip.is-on.is-freen{background:var(--freen);border-color:var(--freen);}
.fbn .fbn-chip.is-on.is-becky{background:var(--becky);border-color:var(--becky);}
.fbn .fbn-chip.is-on.is-freenbecky{background-image:var(--duo);border-color:transparent;}
.fbn .fbn-chip.is-on small{color:rgba(255,255,255,.8);-webkit-text-fill-color:rgba(255,255,255,.8);}
.fbn-status{font-size:13px;letter-spacing:.04em;color:var(--muted);}
.fbn .fbn-status a,.fbn .fbn-empty a{color:var(--purple);-webkit-text-fill-color:var(--purple);font-weight:600;margin-left:6px;}
.fbn-empty{margin-top:24px;padding:20px 22px;background:var(--card);color:var(--body);}
@media (max-width:767px){ .fbn-flabel{width:100%;} }

/* actions */
.fbn-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:38px;}
.fbn-btn{display:inline-block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  padding:13px 24px;border-radius:99px;color:#fff;-webkit-text-fill-color:#fff;
  background-image:var(--duo);transition:transform .2s,box-shadow .2s;}
.fbn-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(122,79,224,.28);}
.fbn-btn.is-ghost{background-image:none;border:1px solid var(--line);color:var(--ink);-webkit-text-fill-color:var(--ink);font-weight:500;}
.fbn-btn.is-ghost:hover{border-color:var(--purple);color:var(--purple);-webkit-text-fill-color:var(--purple);}

/* responsive */
@media (min-width:2400px){ .fbn{font-size:19px;--max:1440px;} }
@media (max-width:1366px){ .fbn{--gutter:clamp(20px,4.5vw,44px);} }
@media (max-width:1200px){ .fbn-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:1024px){ .fbn-feature{grid-template-columns:1fr;} .fbn-feat-shot{aspect-ratio:16/9;} }
@media (max-width:880px){ .fbn-grid{gap:14px;} }
@media (max-width:767px){
  .fbn{--gutter:20px;}
  .fbn-grid{grid-template-columns:1fr;max-width:440px;}
  .fbn-actions .fbn-btn{flex:1 1 100%;text-align:center;}
}
@media (prefers-reduced-motion:reduce){ .fbn *{transition:none!important;} }