/* Beofantastika - light shell + dark timeline-style content cards */

:root{
  --accent:#b88a44;              /* timeline gold */
  --accent-2: rgba(184,138,68,.45);

  --bg:#f6f7fb;                  /* clean light background */
  --bg-2:#ffffff;
  --text:#14151a;
  --muted: rgba(20,21,26,.72);

  --card-text:#f5f5f5;           /* dark cards */
  --card-bg-1:#000000;
  --card-bg-2:#121212;

  --radius-xl:18px;
  --shadow-strong: 0 18px 45px rgba(0,0,0,.45);
  --shadow-soft: 0 12px 30px rgba(0,0,0,.25);
  --glass: rgba(255,255,255,.70);
  --glass-border: rgba(20,21,26,.08);

  --container: 1200px;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  background: linear-gradient(180deg, var(--bg), var(--bg-2));
  color: var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.55;
}

a{ color: inherit; text-decoration:none; }
a:hover{ color: var(--accent); }

.bfk-container{ max-width: var(--container); margin: 0 auto; padding: 0 18px; }
.bfk-container--wide{ width: 100%; margin: 0; padding: 0 18px; }

.bfk-main{ padding: 26px 0 46px; }
.bfk-stack{ display:flex; flex-direction:column; gap:18px; }

/* Header: clean light + rich gold accents */
.bfk-header{
  position: sticky;
  top:0;
  z-index:999;
  backdrop-filter: blur(10px);
  background: var(--glass);
  border-bottom: 1px solid var(--glass-border);
  box-shadow: 0 14px 30px rgba(0,0,0,.10);
}

.bfk-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding: 14px 0;
}

.bfk-header__accent-line{
  height:2px;
  background: linear-gradient(90deg, transparent, rgba(184,138,68,.85), transparent);
}

.bfk-logo img{ width:100%; height:auto; display:block; }

.bfk-site-title{
  font-weight:900;
  letter-spacing:.5px;
  color: #111;
  padding:10px 14px;
  border-radius:12px;
  background: #fff;
  border:1px solid rgba(20,21,26,.10);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
}

/* Menu: elements with timeline accent */
.bfk-menu{
  list-style:none;
  display:flex;
  gap:10px;
  padding:0;
  margin:0;
  align-items:center;
}
.bfk-menu a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(20,21,26,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.08);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.bfk-menu a:hover{
  transform: translateY(-1px);
  border-color: var(--accent-2);
  box-shadow: 0 14px 28px rgba(0,0,0,.12);
}

/* Dark card (timeline look) for content */
.bfk-card{
  color: var(--card-text);
  background: linear-gradient(180deg, var(--card-bg-1), var(--card-bg-2));
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-strong), inset 0 1px 0 rgba(255,255,255,.03);
  overflow:hidden;
}

.bfk-post, .bfk-page{ padding:18px; }
.bfk-post__title, .bfk-page__title{ margin:0 0 10px; }
.bfk-post__title a{ text-decoration:none; color: var(--card-text); }
.bfk-post__title a:hover{ color: var(--accent); }
.bfk-post__meta{ color: rgba(245,245,245,.70); font-size: 14px; margin-bottom: 10px; }

/* Featured image inside cards */
.bfk-post__thumb{
  display:block;
  margin: 0 0 14px;
  border-radius: 18px;
  overflow:hidden;
  box-shadow: 0 18px 45px rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.06);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.bfk-post__thumb img{
  display:block;
  width:100%;
  height:auto;
}
.bfk-post__thumb--single{ margin: 0 0 18px; }
.bfk-post__thumb:hover{
  transform: translateY(-1px);
  border-color: rgba(184,138,68,.35);
  box-shadow: 0 22px 55px rgba(0,0,0,.55);
}

.bfk-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(184,138,68,.28), rgba(0,0,0,.70));
  border: 1px solid rgba(184,138,68,.40);
  box-shadow: 0 14px 32px rgba(0,0,0,.55);
  color: #fff;
}
.bfk-btn:hover{
  border-color: rgba(184,138,68,.65);
}

/* Footer: clean */
.bfk-footer{
  border-top: 1px solid rgba(20,21,26,.08);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(8px);
  padding: 18px 0;
}
.bfk-footer__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color: var(--muted);
}

/* Pagination */
.bfk-pagination .nav-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.bfk-pagination a, .bfk-pagination span{
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid rgba(20,21,26,.10);
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 20px rgba(0,0,0,.06);
}
.bfk-pagination .current{
  border-color: var(--accent-2);
}

/* WP blocks defaults inside cards */
.bfk-page__content :where(h2,h3,h4){ margin-top: 18px; }
.bfk-page__content p{ margin: 0 0 12px; }

/* =========================
   Gallery support (posts/pages)
   ========================= */

/* Block editor gallery */
.bfk-page__content .wp-block-gallery{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}
.bfk-page__content .wp-block-gallery figure{ margin:0; }
.bfk-page__content .wp-block-gallery img{
  width: 100%;
  height: auto;
  display:block;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 14px 35px rgba(0,0,0,.35);
}

/* Classic gallery shortcode */
.bfk-page__content .gallery{
  display:grid;
  grid-template-columns: repeat(var(--bfk-gallery-cols, 3), minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}
.bfk-page__content .gallery-item{ width:auto !important; margin:0; }
.bfk-page__content .gallery-icon{ margin:0; }
.bfk-page__content .gallery img{
  width:100%;
  height:auto;
  display:block;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 14px 35px rgba(0,0,0,.35);
}
.bfk-page__content .gallery-caption{
  color: rgba(245,245,245,.80);
  font-size: 13px;
  margin-top: 6px;
}

.bfk-page__content .gallery-columns-1{ --bfk-gallery-cols:1; }
.bfk-page__content .gallery-columns-2{ --bfk-gallery-cols:2; }
.bfk-page__content .gallery-columns-3{ --bfk-gallery-cols:3; }
.bfk-page__content .gallery-columns-4{ --bfk-gallery-cols:4; }
.bfk-page__content .gallery-columns-5{ --bfk-gallery-cols:5; }
.bfk-page__content .gallery-columns-6{ --bfk-gallery-cols:6; }
.bfk-page__content .gallery-columns-7{ --bfk-gallery-cols:7; }
.bfk-page__content .gallery-columns-8{ --bfk-gallery-cols:8; }
.bfk-page__content .gallery-columns-9{ --bfk-gallery-cols:9; }

@media (max-width: 980px){
  .bfk-page__content .wp-block-gallery{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .bfk-page__content .wp-block-gallery{ grid-template-columns: 1fr; }
  .bfk-page__content .gallery{ grid-template-columns: 1fr; }
}

/* Elementor sanity: don't fight Elementor backgrounds */
.elementor-section,
.elementor-widget-wrap{
  background: transparent;
}


/* Footer widgets layout */
.bfk-footer__widgets{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:30px;
  padding: 40px 0 30px;
}

.bfk-widget{
  background: linear-gradient(180deg, #000000, #121212);
  padding:18px;
  border-radius:18px;
  box-shadow: 0 18px 45px rgba(0,0,0,.45);
  color:#f5f5f5;
}

.bfk-widget__title{
  margin-top:0;
  margin-bottom:12px;
  color:#b88a44;
}

.bfk-footer__bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 0;
  border-top:1px solid rgba(20,21,26,.08);
  color: rgba(20,21,26,.6);
}

/* Mobile hamburger + drawer nav */
.bfk-nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid rgba(20,21,26,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 20px rgba(0,0,0,.08);
  padding:10px;
  cursor:pointer;
}

.bfk-nav-toggle__bar{
  display:block;
  height:2px;
  width:100%;
  background: rgba(20,21,26,.85);
  border-radius:2px;
  margin:6px 0;
}

.bfk-nav-overlay{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  z-index: 998;
}

@media (max-width: 900px){
  .bfk-nav-toggle{ display:inline-flex; align-items:center; justify-content:center; }

  /* Drawer nav */
  .bfk-nav{
    position:fixed;
    top:0;
    right:0;
    height:100vh;
    width:min(86vw, 340px);
    padding:18px;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    border-left: 1px solid rgba(20,21,26,.10);
    box-shadow: -18px 0 45px rgba(0,0,0,.18);
    transform: translateX(110%);
    transition: transform .18s ease;
    z-index: 999;
    overflow:auto;
  }

  .bfk-menu{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }

  .bfk-menu a{
    width:100%;
    justify-content:flex-start;
  }

  body.bfk-nav-open .bfk-nav{ transform: translateX(0); }
  body.bfk-nav-open{ overflow:hidden; }
}



/* Social icons positioning (header + footer) */
.bfk-header__right{
  display:flex;
  align-items:center;
  gap:14px;
}

/* default icons */
.bf-social-icons{
  display:flex;
  align-items:center;
  gap:12px;
}

.bf-social-icons a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:12px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(20,21,26,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.08);
  color: rgba(20,21,26,.85);
  transition: transform .12s ease, color .12s ease, background .12s ease;
}

.bf-social-icons a:hover{
  transform: translateY(-1px);
  color: var(--accent);
}

.bf-social-icons--footer a{
  background: rgba(255,255,255,.85);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

.bfk-footer__left{
  display:flex;
  align-items:center;
  gap:12px;
}