/*
 * Motifirmasi Theme — Custom CSS
 * Military/Patriotic portal theme for Laravel Sintesis
 * Prefix: mf- (scoped, no conflict)
 */

:root {
  --mf-red:       #cc0000;
  --mf-red-dark:  #990000;
  --mf-dark:      #111111;
  --mf-dark2:     #1a1a1a;
  --mf-dark3:     #222222;
  --mf-light:     #f5f5f5;
  --mf-muted:     #888888;
  --mf-white:     #ffffff;
  --mf-gold:      #9a7000;
  --mf-orange:    #c45a00;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body.mf-portal {
  background: var(--mf-dark);
  color: var(--mf-white);
  font-family: 'Barlow', sans-serif;
  overflow-x: hidden;
}

/* ── HEADER ── */
.mf-header {
  background: var(--mf-white);
  padding: 14px 0;
  position: relative;
}
.mf-logo-wrap {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
}
.mf-logo-img {
  width: 58px;
  height: 58px;
  object-fit: contain;
}
.mf-logo-svg {
  width: 58px;
  height: 58px;
  flex-shrink: 0;
}
.mf-logo-name {
  font-family: 'Oswald', sans-serif;
  font-size: 32px;
  font-weight: 700;
  color: var(--mf-dark);
  letter-spacing: 2px;
  line-height: 1;
}
.mf-tagline-badge {
  background: var(--mf-red);
  color: var(--mf-white);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  padding: 10px 22px;
  letter-spacing: 1px;
  clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
  text-align: center;
  white-space: nowrap;
}

/* ── NAVBAR ── */
.mf-main-nav {
  background: var(--mf-dark);
  border-bottom: 3px solid var(--mf-red);
}

/* Nav scroll wrap (shared with RadarFaktual pattern) */
.mf-nav-scroll-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.mf-nav-menu {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  scroll-behavior: smooth;
}
.mf-nav-menu::-webkit-scrollbar { display: none; }

.mf-nav-arrow {
  position: absolute;
  top: 0; bottom: 0;
  width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s;
  font-size: 13px;
  color: rgba(255,255,255,.6);
}
.mf-nav-arrow.visible { opacity: 1; pointer-events: auto; cursor: pointer; }
.mf-nav-arrow-left  { left: 0;  background: linear-gradient(to right, #111111 40%, transparent 100%); }
.mf-nav-arrow-right { right: 0; background: linear-gradient(to left,  #111111 40%, transparent 100%); }

.mf-nav-link {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--mf-white);
  padding: 14px 20px;
  transition: color .2s;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  display: block;
}
.mf-nav-link:hover { color: var(--mf-red); }
.mf-nav-link.active {
  background: var(--mf-red);
  color: var(--mf-white);
}

.mf-nav-socials { display: flex; align-items: center; }
.mf-nav-socials a {
  color: var(--mf-white);
  font-size: 17px;
  margin-left: 10px;
  transition: color .2s;
  text-decoration: none;
}
.mf-nav-socials a:hover { color: var(--mf-red); }

.mf-nav-search-btn {
  background: none;
  border: none;
  color: var(--mf-white);
  font-size: 17px;
  cursor: pointer;
  margin-left: 14px;
  padding: 0 4px;
  flex-shrink: 0;
  transition: color .2s;
}
.mf-nav-search-btn:hover { color: var(--mf-red); }

/* ── HERO ── */
.mf-hero {
  position: relative;
  min-height: 460px;
  background: linear-gradient(135deg, #0a0a0a 0%, #1a0a0a 40%, #0d1a1a 100%);
  overflow: hidden;
  display: flex;
  align-items: center;
}
.mf-hero-bg {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,.92) 38%, rgba(0,0,0,.25) 100%);
  z-index: 1;
}
.mf-hero-img-wrap {
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 65%;
  clip-path: polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.mf-hero-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: .75;
}
.mf-hero-placeholder {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, #1a2a1a 0%, #2a3a20 40%, #3a2a10 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 120px;
  color: rgba(255,255,255,.06);
}
.mf-hero-accent {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 6px;
  background: var(--mf-red);
  z-index: 2;
}
.mf-hero-content {
  position: relative;
  z-index: 3;
  padding: 60px 0;
}
.mf-hero-label {
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--mf-red);
  letter-spacing: 1.5px;
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 14px;
}
.mf-hero-label i { color: #ffcc00; }
.mf-hero-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 58px;
  font-weight: 700;
  line-height: .95;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--mf-white);
  margin-bottom: 6px;
}
.mf-hero-red-line {
  display: block;
  width: 80px; height: 4px;
  background: var(--mf-red);
  margin: 14px 0;
}
.mf-hero-sub {
  font-size: 14px;
  color: rgba(255,255,255,.7);
  max-width: 360px;
  line-height: 1.6;
  margin-bottom: 28px;
}

/* Buttons */
.mf-btn-primary {
  background: var(--mf-red);
  border: none;
  color: var(--mf-white);
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1.2px;
  padding: 12px 28px;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 100%, 8px 100%);
  cursor: pointer;
  transition: background .2s;
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
}
.mf-btn-primary:hover { background: var(--mf-red-dark); color: var(--mf-white); }

.mf-btn-outline {
  background: transparent;
  border: 2px solid var(--mf-white);
  color: var(--mf-white);
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1.2px;
  padding: 10px 24px;
  cursor: pointer;
  transition: background .2s, border-color .2s;
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
}
.mf-btn-outline:hover { background: rgba(255,255,255,.1); color: var(--mf-white); }

.mf-btn-lihat {
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--mf-white);
  background: var(--mf-red);
  border: none;
  padding: 6px 18px;
  cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 100%, 6px 100%);
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px;
  transition: background .2s;
}
.mf-btn-lihat:hover { background: var(--mf-red-dark); color: var(--mf-white); }

.mf-btn-read {
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--mf-white);
  background: var(--mf-red);
  border: none;
  padding: 10px 26px;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 100%, 6px 100%);
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
  transition: background .2s;
}
.mf-btn-read:hover { background: var(--mf-red-dark); color: var(--mf-white); }

/* ── ARTICLE CARDS (section-wrap) ── */
.mf-section-wrap {
  background: var(--mf-dark2);
  padding: 40px 0;
}

.mf-cat-badge {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--mf-white);
  background: var(--mf-red);
  padding: 5px 14px 5px 10px;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 100%, 0% 100%);
  margin-bottom: 14px;
  text-decoration: none;
}
.mf-cat-badge.orange { background: var(--mf-orange); }
.mf-cat-badge.gold   { background: var(--mf-gold); }

.mf-art-card {
  background: var(--mf-dark3);
  border-top: 3px solid var(--mf-red);
  height: 100%;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition: opacity .2s;
}
.mf-art-card:hover { opacity: .88; }
.mf-art-card.orange { border-top-color: var(--mf-orange); }
.mf-art-card.gold   { border-top-color: var(--mf-gold); }

.mf-art-thumb {
  width: 100%;
  aspect-ratio: 16/9;
  background: linear-gradient(135deg, #1a2a1a, #2e3a2e);
  display: flex; align-items: center; justify-content: center;
  font-size: 50px;
  color: rgba(255,255,255,.1);
  overflow: hidden;
  flex-shrink: 0;
}
.mf-art-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  transition: clip-path .35s ease, transform .35s ease;
}
.mf-art-card:hover .mf-art-thumb img,
.mf-art-card:focus-within .mf-art-thumb img {
  clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
  transform: scale(1.04);
}

.mf-art-body { padding: 18px; flex: 1; display: flex; flex-direction: column; }
.mf-art-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--mf-white);
  line-height: 1.25;
  margin-bottom: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mf-art-excerpt {
  font-size: 13px;
  color: rgba(255,255,255,.6);
  line-height: 1.55;
  margin-bottom: 14px;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mf-art-meta {
  font-size: 12px;
  color: var(--mf-muted);
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap;
}
.mf-art-meta .mf-tag { color: var(--mf-red); font-weight: 600; }

/* ── BOTTOM SECTION ── */
.mf-bottom-section { background: var(--mf-dark); padding: 40px 0 50px; }

.mf-section-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
  border-bottom: 2px solid var(--mf-red);
  padding-bottom: 10px;
}
.mf-section-header-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1.2px;
  display: flex; align-items: center; gap: 10px;
  color: var(--mf-white);
}
.mf-section-header-title i { color: var(--mf-red); }

/* News list items */
.mf-news-item {
  display: flex; gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
  align-items: flex-start;
  text-decoration: none;
  transition: opacity .2s;
}
.mf-news-item:last-child { border-bottom: none; }
.mf-news-item:hover { opacity: .8; }

.mf-news-thumb {
  width: 90px; height: 65px; flex-shrink: 0;
  background: linear-gradient(135deg, #1a2a2a, #2a3a3a);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: rgba(255,255,255,.15);
  overflow: hidden;
}
.mf-news-thumb img { width: 100%; height: 100%; object-fit: cover; }

.mf-news-cat {
  font-family: 'Oswald', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--mf-red);
  margin-bottom: 4px;
}
.mf-news-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--mf-white);
  line-height: 1.3;
  margin-bottom: 6px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mf-news-meta-row {
  font-size: 11px;
  color: var(--mf-muted);
  display: flex; gap: 12px; flex-wrap: wrap;
}
.mf-news-meta-row i { margin-right: 3px; }

/* Featured card (taruna-style) */
.mf-featured-card {
  background: var(--mf-dark3);
  border-top: 3px solid var(--mf-red);
  overflow: hidden;
  text-decoration: none;
  display: block;
  transition: opacity .2s;
}
.mf-featured-card:hover { opacity: .88; }

.mf-featured-thumb {
  width: 100%;
  height: 200px;
  background: linear-gradient(135deg, #1a1a2a, #2a1a0a);
  display: flex; align-items: center; justify-content: center;
  font-size: 60px; color: rgba(255,255,255,.08);
  overflow: hidden;
}
.mf-featured-thumb img { width: 100%; height: 100%; object-fit: cover; }
.mf-featured-body { padding: 20px; }
.mf-featured-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--mf-white);
  margin-bottom: 10px;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mf-featured-desc {
  font-size: 13px;
  color: rgba(255,255,255,.6);
  line-height: 1.55;
  margin-bottom: 18px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── ARTICLE DETAIL ── */
.mf-article-wrap { background: var(--mf-dark); padding: 32px 0 60px; }

.mf-breadcrumb-bar {
  background: var(--mf-dark2);
  border-bottom: 1px solid rgba(255,255,255,.07);
  padding: 10px 0;
}
.mf-breadcrumb-bar .breadcrumb { margin: 0; }
.mf-breadcrumb-bar .breadcrumb-item a {
  color: var(--mf-muted);
  text-decoration: none;
  font-size: 13px;
  transition: color .2s;
}
.mf-breadcrumb-bar .breadcrumb-item a:hover { color: var(--mf-red); }
.mf-breadcrumb-bar .breadcrumb-item.active { color: var(--mf-red); font-size: 13px; }
.mf-breadcrumb-bar .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.2); }

.mf-article-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 38px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--mf-white);
  line-height: 1.1;
  margin-bottom: 16px;
}
.mf-article-meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 13px;
  color: var(--mf-muted);
  margin-bottom: 20px;
  align-items: center;
}
.mf-article-meta-bar i { color: var(--mf-red); margin-right: 4px; }

.mf-article-hero-img {
  width: 100%;
  max-height: 460px;
  object-fit: cover;
  clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
  margin-bottom: 24px;
}
.mf-img-credit {
  font-size: 11px;
  color: var(--mf-muted);
  font-style: italic;
  margin-top: -16px;
  margin-bottom: 20px;
  text-align: right;
}

.mf-article-body {
  background: var(--mf-dark2);
  border-top: 3px solid var(--mf-red);
  padding: 28px;
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255,255,255,.88);
}
.mf-article-body h1, .mf-article-body h2, .mf-article-body h3,
.mf-article-body h4, .mf-article-body h5, .mf-article-body h6 {
  font-family: 'Barlow Condensed', sans-serif;
  color: var(--mf-white);
  text-transform: uppercase;
  margin: 1.2em 0 .5em;
}
.mf-article-body p { margin-bottom: 1em; }
.mf-article-body img { max-width: 100%; margin: .5em 0; }
.mf-article-body a { color: var(--mf-red); }
.mf-article-body blockquote {
  border-left: 4px solid var(--mf-red);
  padding: 10px 20px;
  margin: 1.2em 0;
  background: rgba(204,0,0,.07);
  font-style: italic;
  color: rgba(255,255,255,.6);
}

.mf-tag-badge {
  font-size: 12px;
  color: var(--mf-muted);
  border: 1px solid rgba(255,255,255,.15);
  padding: 4px 12px;
  border-radius: 2px;
  text-decoration: none;
  transition: border-color .2s, color .2s;
}
.mf-tag-badge:hover { border-color: var(--mf-red); color: var(--mf-red); }

.mf-entities-block {
  background: var(--mf-dark2);
  border-left: 4px solid var(--mf-red);
  padding: 16px 20px;
  margin-top: 20px;
  font-size: 13px;
  color: var(--mf-muted);
}
.mf-entities-block strong { color: rgba(255,255,255,.8); }

.mf-sentiment-badge {
  font-size: 12px;
  font-weight: 600;
  padding: 3px 10px;
  clip-path: polygon(0 0, calc(100% - 4px) 0, 100% 100%, 4px 100%);
}
.mf-sentiment-positive { background: rgba(52,211,153,.15); color: #34d399; }
.mf-sentiment-negative { background: rgba(204,0,0,.2);      color: #ff6666; }
.mf-sentiment-neutral  { background: rgba(136,136,136,.2);  color: #aaaaaa; }

/* Sidebar */
.mf-sidebar { padding-left: 18px; }
.mf-sidebar-block { margin-bottom: 28px; }
.mf-sidebar-title {
  font-family: 'Oswald', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--mf-white);
  border-bottom: 2px solid var(--mf-red);
  padding-bottom: 8px;
  margin-bottom: 14px;
  display: flex; align-items: center; gap: 8px;
}
.mf-sidebar-title i { color: var(--mf-red); }

.mf-sidebar-cat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 14px;
  background: var(--mf-dark3);
  border-left: 3px solid transparent;
  margin-bottom: 6px;
  text-decoration: none;
  color: rgba(255,255,255,.75);
  font-size: 13px;
  font-family: 'Oswald', sans-serif;
  letter-spacing: .8px;
  transition: border-color .2s, color .2s, background .2s;
}
.mf-sidebar-cat:hover, .mf-sidebar-cat.active {
  border-left-color: var(--mf-red);
  color: var(--mf-white);
  background: rgba(204,0,0,.1);
}

.mf-sidebar-news {
  display: flex; gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
  text-decoration: none;
  align-items: flex-start;
  transition: opacity .2s;
}
.mf-sidebar-news:last-child { border-bottom: none; }
.mf-sidebar-news:hover { opacity: .8; }
.mf-sidebar-thumb {
  width: 68px; height: 50px;
  object-fit: cover;
  flex-shrink: 0;
}
.mf-sidebar-thumb-placeholder {
  width: 68px; height: 50px;
  background: var(--mf-dark3);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: rgba(255,255,255,.1);
  flex-shrink: 0;
}
.mf-sidebar-news-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--mf-white);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mf-sidebar-news:hover .mf-sidebar-news-title { color: var(--mf-red); }
.mf-sidebar-news-date { font-size: 11px; color: var(--mf-muted); margin-top: 4px; }

/* ── CATEGORY PAGE ── */
.mf-cat-page-header {
  border-bottom: 3px solid var(--mf-red);
  padding-bottom: 14px;
  margin-bottom: 24px;
}
.mf-cat-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 32px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--mf-white);
  display: flex; align-items: center; gap: 12px;
}
.mf-cat-count {
  font-size: 14px;
  font-family: 'Barlow', sans-serif;
  font-weight: 400;
  color: var(--mf-muted);
  text-transform: none;
  letter-spacing: 0;
}

/* ── PAGINATION ── */
.mf-pagination .page-item .page-link {
  background: var(--mf-dark2);
  border-color: rgba(255,255,255,.15);
  color: rgba(255,255,255,.7);
  border-radius: 0;
}
.mf-pagination .page-item.active .page-link {
  background: var(--mf-red);
  border-color: var(--mf-red);
  color: var(--mf-white);
}
.mf-pagination .page-item .page-link:hover {
  background: var(--mf-red);
  border-color: var(--mf-red);
  color: var(--mf-white);
}
.mf-pagination .page-item.disabled .page-link {
  background: var(--mf-dark2);
  border-color: rgba(255,255,255,.1);
  color: var(--mf-muted);
}

/* ── EMPTY STATE ── */
.mf-empty-state {
  text-align: center;
  padding: 60px 20px;
  color: var(--mf-muted);
}
.mf-empty-state i { font-size: 48px; margin-bottom: 16px; color: rgba(255,255,255,.1); display: block; }
.mf-empty-state h4 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  text-transform: uppercase;
  color: var(--mf-white);
  margin-bottom: 8px;
}

/* ── SEARCH OVERLAY ── */
.mf-search-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(10,10,10,.96);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.mf-search-overlay.active { display: flex; }
.mf-search-form { width: 100%; max-width: 620px; padding: 0 24px; }
.mf-search-input {
  width: 100%;
  background: var(--mf-dark2);
  border: 2px solid var(--mf-red);
  color: var(--mf-white);
  font-family: 'Barlow', sans-serif;
  font-size: 20px;
  padding: 16px 20px;
  outline: none;
}
.mf-search-input::placeholder { color: var(--mf-muted); }
.mf-search-close {
  position: absolute;
  top: 24px; right: 24px;
  background: none;
  border: none;
  color: var(--mf-muted);
  font-size: 28px;
  cursor: pointer;
  line-height: 1;
}
.mf-search-close:hover { color: var(--mf-red); }

/* ── SCROLL TOP ── */
.mf-scroll-top {
  position: fixed;
  bottom: 30px; right: 24px;
  width: 40px; height: 40px;
  background: var(--mf-red);
  color: var(--mf-white);
  clip-path: polygon(0 0, calc(100% - 4px) 0, 100% 100%, 4px 100%);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  text-decoration: none;
  z-index: 999;
  transition: opacity .2s;
}
.mf-scroll-top.visible { display: flex; }
.mf-scroll-top:hover { color: var(--mf-white); opacity: .85; }

/* ── FOOTER ── */
.mf-footer {
  background: #0a0a0a;
  border-top: 3px solid var(--mf-red);
  padding: 28px 0;
}
.mf-footer-logo-name {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--mf-white);
  letter-spacing: 2px;
  text-decoration: none;
}
.mf-footer-nav a {
  font-family: 'Barlow', sans-serif;
  font-size: 14px;
  color: rgba(255,255,255,.6);
  text-decoration: none;
  margin: 0 12px;
  transition: color .2s;
}
.mf-footer-nav a:hover { color: var(--mf-red); }
.mf-footer-socials a {
  color: rgba(255,255,255,.6);
  font-size: 20px;
  margin-left: 12px;
  transition: color .2s;
  text-decoration: none;
}
.mf-footer-socials a:hover { color: var(--mf-red); }
.mf-footer-copy {
  font-size: 12px;
  color: rgba(255,255,255,.35);
  margin-top: 14px;
  text-align: center;
}

/* ── SPARK DECORATION ── */
.mf-spark {
  display: inline-block;
  width: 8px; height: 8px;
  background: var(--mf-red);
  transform: rotate(45deg);
  flex-shrink: 0;
}

/* ── SHARE BUTTONS ── */
.mf-share-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 20px;
  font-size: 13px;
  color: var(--mf-muted);
}

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .mf-hero-title { font-size: 38px; }
  .mf-hero-img-wrap { width: 100%; clip-path: none; opacity: .2; }
  .mf-hero-content { padding: 40px 0; }
  .mf-sidebar { padding-left: 0; margin-top: 32px; }
  .mf-article-title { font-size: 26px; }
  .mf-logo-name { font-size: 24px; }
  .mf-tagline-badge { font-size: 12px; padding: 8px 14px; }
}
@media (max-width: 576px) {
  .mf-hero-title { font-size: 30px; }
  .mf-hero-content { padding: 30px 0; }
}