/* ============================================================
   MBIELSKI DESIGN — re-skin reportazy (single post) w motywie Fiji
   Ladowany TYLKO na is_single() (patrz flo_enque.php), po theme-css.
   Tokeny z prefiksem --mb- na body.single-post (dostepne dla CALEJ tresci,
   zero kolizji z :root motywu). Klasy .mb- nie koliduja z .flo-.
   Zmieniamy WYGLAD — tresc/strukture/galerie zostawiamy Flothemes.
   ============================================================ */

/* ====== TOKENY — na body.single-post, wiec dziedzicza je WSZYSTKIE elementy ====== */
body.single-post{
  --mb-paper:#f4f2ec; --mb-paper-2:#eae7de; --mb-ink:#14120f; --mb-ink-2:#0e0d0b;
  --mb-soft:#48443c; --mb-muted:#8d887b;
  --mb-line:rgba(20,18,15,.15); --mb-line-2:rgba(20,18,15,.07);
  --mb-accent:#d8401f; --mb-accent-deep:#b23312; --mb-accent-soft:#ffd9cd;
  --mb-serif:"Instrument Serif",Georgia,serif;
  --mb-sans:"Bricolage Grotesque",system-ui,sans-serif;
  --mb-gut:clamp(20px,4.5vw,64px);
  --mb-ease:cubic-bezier(.22,1,.36,1);
}

/* ====== 1. UKRYJ RAME MOTYWU na pojedynczym poscie ====== */
body.single-post .flo-block--header,
body.single-post .flo-header-mobile,
body.single-post .flo-footer{ display:none !important; }

/* ====== 2. BAZA + zaznaczanie tekstu ====== */
body.single-post{
  background:var(--mb-paper) !important;
  color:var(--mb-ink) !important;
  font-family:var(--mb-sans) !important;
  -webkit-font-smoothing:antialiased;
}
body.single-post ::selection{ background:#d8401f; color:#fff; }
body.single-post ::-moz-selection{ background:#d8401f; color:#fff; }
body.mb-menu-open{ overflow:hidden !important; }
.mb-grain{ position:fixed; inset:0; z-index:40; pointer-events:none; opacity:.05; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ====== 3. NASZA BELKA ====== */
.mb-nav{ position:fixed; top:0; left:0; right:0; z-index:1200; display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:20px var(--mb-gut); color:#f4f2ec; transition:background .5s,color .5s,padding .5s,border-color .5s; border-bottom:1px solid transparent; font-family:var(--mb-sans); }
.mb-nav::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,rgba(10,9,8,.55),rgba(10,9,8,0)); transition:opacity .5s; }
.mb-nav.solid{ background:rgba(244,242,236,.9); backdrop-filter:saturate(1.1) blur(14px); -webkit-backdrop-filter:saturate(1.1) blur(14px);
  color:var(--mb-ink); border-bottom-color:var(--mb-line-2); padding-top:12px; padding-bottom:12px; }
.mb-nav.solid::before{ opacity:0; }
.mb-nav .mb-brand{ display:flex; align-items:center; line-height:0; }
.mb-nav .mb-brand img{ height:26px; width:auto; }
.mb-nav.solid .mb-brand img{ filter:invert(1); }
.mb-nav .mb-links{ display:flex; gap:30px; list-style:none; align-items:center; margin:0; padding:0; }
.mb-nav .mb-links li{ margin:0; padding:0; }
.mb-nav .mb-links a{ font-size:13px; font-weight:600; position:relative; padding-bottom:3px; white-space:nowrap; color:inherit; text-decoration:none; letter-spacing:0; text-transform:none; font-family:var(--mb-sans); }
.mb-nav .mb-links a::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--mb-accent); transition:width .3s var(--mb-ease); }
.mb-nav .mb-links a:hover::after,.mb-nav .mb-links a:focus-visible::after{ width:100%; }
.mb-nav .mb-links .mb-cta a{ border:1px solid currentColor; padding:10px 18px; }
.mb-nav .mb-links .mb-cta a::after{ display:none; }
.mb-nav .mb-links .mb-cta a:hover{ background:var(--mb-accent); border-color:var(--mb-accent); color:#fff; }
.mb-nav .mb-menu-btn{ display:none; background:none; border:1px solid currentColor; color:inherit; font-family:var(--mb-sans); font-weight:600; font-size:12px; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; padding:10px 16px; min-height:44px; }

/* ====== 4. MENU MOBILNE ====== */
.mb-mobile-menu{ position:fixed; inset:0; z-index:1150; background:var(--mb-ink-2); color:var(--mb-paper); display:flex; flex-direction:column; justify-content:flex-end;
  padding:90px var(--mb-gut) clamp(28px,6vh,56px); opacity:0; visibility:hidden; transition:opacity .4s,visibility .4s; }
body.mb-menu-open .mb-mobile-menu{ opacity:1; visibility:visible; }
.mb-mobile-menu nav{ display:flex; flex-direction:column; }
.mb-mobile-menu a{ font-family:var(--mb-serif); font-size:clamp(36px,9.5vw,64px); line-height:1.16; padding:10px 0; border-bottom:1px solid rgba(244,242,236,.13); color:var(--mb-paper); text-decoration:none; letter-spacing:normal;
  transform:translateY(26px); opacity:0; transition:transform .55s var(--mb-ease),opacity .45s; }
body.mb-menu-open .mb-mobile-menu a{ transform:none; opacity:1; }
.mb-mobile-menu a:nth-child(2){ transition-delay:.05s; }.mb-mobile-menu a:nth-child(3){ transition-delay:.1s; }
.mb-mobile-menu a:nth-child(4){ transition-delay:.15s; }.mb-mobile-menu a:nth-child(5){ transition-delay:.2s; }.mb-mobile-menu a:nth-child(6){ transition-delay:.25s; }
.mb-mobile-menu a .mb-idx{ font-family:var(--mb-sans); font-size:13px; font-weight:600; color:var(--mb-accent); margin-right:16px; vertical-align:middle; }
.mb-mobile-menu .mb-mfoot{ margin-top:30px; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(244,242,236,.5); }
@media(max-width:920px){
  .mb-nav .mb-links{ display:none; }
  .mb-nav .mb-menu-btn{ display:block; }
}

/* ====== 5. RE-SKIN TRESCI SINGLE'A — twardy override typografii motywu ====== */
/* 5a. cala tresc na Bricolage + wyzeruj rozstrzelenie (letter-spacing) motywu */
body.single-post .flo-wp-content,
body.single-post .flo-wp-content *,
body.single-post .flo-post,
body.single-post .flo-post *,
body.single-post .flo-block-intro-block,
body.single-post .flo-block-intro-block *{
  font-family:var(--mb-sans) !important;
  letter-spacing:normal !important;
}
body.single-post .flo-wp-content p,
body.single-post .flo-post p,
body.single-post .flo-block-intro-block p{ color:var(--mb-soft) !important; font-size:clamp(17px,1.4vw,19px) !important; line-height:1.75 !important; }
body.single-post .flo-wp-content li,
body.single-post .flo-post li{ color:var(--mb-soft) !important; }
/* 5b. naglowki w tresci -> serif, ciemny atrament */
body.single-post .flo-wp-content h1, body.single-post .flo-wp-content h2, body.single-post .flo-wp-content h3,
body.single-post .flo-wp-content h4, body.single-post .flo-wp-content h5, body.single-post .flo-wp-content h6,
body.single-post .flo-post h1, body.single-post .flo-post h2, body.single-post .flo-post h3,
body.single-post .flo-block-intro-block h1, body.single-post .flo-block-intro-block h2, body.single-post .flo-block-intro-block h3{
  font-family:var(--mb-serif) !important; font-weight:400 !important; color:var(--mb-ink) !important; letter-spacing:-.01em !important; }
/* 5c. cytat -> serif italic (jak pull-quote na homepage) */
body.single-post .flo-post blockquote,
body.single-post .flo-post blockquote p{ font-family:var(--mb-serif) !important; font-style:italic !important; color:var(--mb-ink) !important; }
/* 5d. linki w tresci */
body.single-post .flo-wp-content a,
body.single-post .flo-post a{ color:var(--mb-accent) !important; }

/* HERO — item title 2 (tytul + kategoria + data) */
body.single-post .flo-block-item-title-2 h1,
body.single-post [class*="flo-block-item-title-2__title"]{
  font-family:var(--mb-serif) !important; font-weight:400 !important; letter-spacing:-.015em !important; line-height:1.04 !important; color:var(--mb-ink) !important; }
body.single-post [class*="flo-block-item-title-2__category"],
body.single-post [class*="flo-block-item-title-2__date"]{
  font-family:var(--mb-sans) !important; font-size:12px !important; font-weight:600 !important; letter-spacing:.14em !important; text-transform:uppercase !important; line-height:1.4 !important; }
body.single-post [class*="flo-block-item-title-2__category"] a{ color:var(--mb-accent) !important; }

/* MORE MOMENTS — powiazane */
body.single-post [class*="flo-block-related-items__item-category"]{
  font-family:var(--mb-sans) !important; font-size:11px !important; font-weight:600 !important; letter-spacing:.12em !important; text-transform:uppercase !important; color:var(--mb-muted) !important; }
body.single-post [class*="flo-block-related-items__item-title"],
body.single-post .flo-block-related-items h2,
body.single-post .flo-block-related-items h3{ font-family:var(--mb-serif) !important; font-weight:400 !important; color:var(--mb-ink) !important; letter-spacing:normal !important; }
body.single-post [class*="flo-block-related-items__item-featured-image"] img{ transition:transform .9s var(--mb-ease); }
body.single-post .flo-block-related-items__item:hover [class*="__item-featured-image"] img{ transform:scale(1.05); }

/* DIVIDER */
body.single-post .flo-block-horizontal-divider hr,
body.single-post .flo-block-horizontal-divider{ border-color:var(--mb-line) !important; }

/* ====== 6. NASZA STOPKA (instagramowa) ====== */
.mb-foot{ background:var(--mb-ink-2); color:var(--mb-paper); position:relative; z-index:2; font-family:var(--mb-sans); }
.mb-foot *{ letter-spacing:normal; }
.mb-foot .mb-wrap{ max-width:1240px; margin:0 auto; padding-inline:var(--mb-gut); }
.mb-foot .mb-ig-wrap{ padding-block:clamp(44px,6vw,80px) clamp(28px,4vw,46px); }
.mb-foot .mb-igrid-sec{ position:relative; overflow:hidden; max-width:960px; margin-inline:auto; }
.mb-foot .mb-ig-grid{ display:grid; grid-template-columns:repeat(6,1fr); }
.mb-foot .mb-ig-grid a{ display:block; position:relative; aspect-ratio:1/1; overflow:hidden; }
.mb-foot .mb-ig-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--mb-ease); display:block; }
.mb-foot .mb-ig-grid a:hover img{ transform:scale(1.07); }
.mb-foot .mb-ig-handle{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:3; background:rgba(244,242,236,.85); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); color:var(--mb-ink); padding:10px 22px; display:flex; flex-direction:column; align-items:center; gap:3px; text-align:center; box-shadow:0 16px 44px rgba(0,0,0,.2); transition:transform .4s var(--mb-ease); text-decoration:none; }
.mb-foot .mb-ig-handle:hover{ transform:translate(-50%,-50%) scale(1.05); }
.mb-foot .mb-ig-handle .mb-at{ font-weight:500; font-size:clamp(11px,1.3vw,14px); letter-spacing:.10em; }
.mb-foot .mb-ig-handle .mb-sub{ font-size:9px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--mb-soft); }
.mb-foot .mb-seo-words{ padding-block:30px; border-top:1px solid rgba(244,242,236,.12); }
.mb-foot .mb-seo-words p{ font-size:12px; line-height:2; color:rgba(244,242,236,.42); margin:0; }
.mb-foot .mb-seo-words b{ color:rgba(244,242,236,.72); }
.mb-foot .mb-foot-bottom{ display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-block:24px; border-top:1px solid rgba(244,242,236,.12); font-size:12px; letter-spacing:.04em; color:rgba(244,242,236,.5); }
.mb-foot .mb-foot-bottom a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(244,242,236,.22); transition:color .3s,border-color .3s; }
.mb-foot .mb-foot-bottom a:hover{ color:#fff; border-color:#fff; }
@media(max-width:560px){
  .mb-foot .mb-ig-grid{ grid-template-columns:repeat(3,1fr); }
}

@media(prefers-reduced-motion:reduce){
  .mb-nav,.mb-mobile-menu,.mb-mobile-menu a,.mb-foot .mb-ig-grid img{ transition:none !important; }
}
