/* ════════════════════════════════════════════════════════════
   BYTES YATRA — MAIN STYLESHEET
   Version: 1.0.0
   ════════════════════════════════════════════════════════════ */

/* ── CSS Custom Properties ───────────────────────────────────── */
:root {
  --by-primary:       #C62828;
  --by-accent:        #E53935;
  --by-bg:            #F9FAFB;
  --by-surface:       #FFFFFF;
  --by-surface2:      #F3F4F6;
  --by-border:        #E5E7EB;
  --by-text:          #111827;
  --by-text-muted:    #6B7280;
  --by-text-light:    #9CA3AF;
  --by-heading-font:  'Playfair Display', Georgia, serif;
  --by-body-font:     'DM Sans', 'Source Sans 3', system-ui, sans-serif;
  --by-shadow-sm:     0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --by-shadow:        0 4px 12px rgba(0,0,0,.10), 0 2px 4px rgba(0,0,0,.06);
  --by-shadow-lg:     0 10px 30px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.08);
  --by-shadow-hover:  0 16px 40px rgba(0,0,0,.16);
  --by-radius:        10px;
  --by-radius-lg:     16px;
  --by-radius-full:   9999px;
  --by-transition:    0.25s cubic-bezier(0.4,0,0.2,1);
  --by-navbar-h:      52px;
  --by-header-h:      72px;
  --by-container:     1280px;
}

/* ── Reset & Base ─────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

body {
  font-family: var(--by-body-font);
  background: var(--by-bg);
  color: var(--by-text);
  line-height: 1.7;
  overflow-x: hidden;
  min-width: 320px;
}

img, video { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button { border:none; background:none; cursor:pointer; font:inherit; }
input,textarea,select { font:inherit; }

/* ── Skip Link ────────────────────────────────────────────────── */
.by-skip-link {
  position:absolute; top:-100px; left:1rem; z-index:10000;
  background:var(--by-primary); color:#fff; padding:.5rem 1rem;
  border-radius:var(--by-radius); font-weight:600;
  transition: top .2s;
}
.by-skip-link:focus { top:1rem; }

/* ── Container ────────────────────────────────────────────────── */
.by-container {
  max-width: var(--by-container);
  margin-inline: auto;
  padding-inline: 1rem;
  width: 100%;
  box-sizing: border-box;
}

/* ── Reading Progress Bar ─────────────────────────────────────── */
#by-reading-progress {
  position:fixed; top:0; left:0; right:0; height:3px;
  background:rgba(198,40,40,.15); z-index:10001;
}
#by-reading-bar {
  height:100%; width:0%;
  background:linear-gradient(90deg,var(--by-primary),var(--by-accent));
  transition:width .1s linear;
}

/* ── Top Ad Strip ─────────────────────────────────────────────── */
.by-top-ads {
  width:100%; background:transparent; padding:0; margin:0;
  display:flex; flex-direction:column; gap:0;
}
.by-top-ads .by-container {
  padding:0 !important; max-width:100% !important; width:100%;
  display:flex; flex-direction:column; gap:0;
}
.by-top-ad {
  width:100%; overflow:hidden; line-height:0;
  background:transparent; margin:0; padding:0;
  text-align:center;
}
/* Override base .by-ad-zone padding inside top banner only */
.by-top-ad .by-ad-zone {
  margin:0 auto !important; padding:0 !important;
  width:100%; max-width:728px;
  line-height:0; display:block;
}
.by-top-ad img,
.by-top-ad .by-ad-img {
  width:100% !important; max-width:728px !important;
  height:auto; max-height:90px;
  object-fit:cover; object-position:center;
  display:block; margin:0 auto !important; padding:0;
  border-radius:4px; background:transparent;
}

/* ══════════════════════════════════════════════════════════════
   HEADER
   ══════════════════════════════════════════════════════════════ */
.by-header {
  background:var(--by-surface);
  box-shadow:var(--by-shadow-sm);
  position:sticky; top:0; z-index:900;
  height:var(--by-header-h);
  max-width:100vw;
  overflow:hidden;
}
.by-header__inner {
  display:flex; align-items:center;
  justify-content:space-between;
  height:var(--by-header-h);
}
.by-logo { flex-shrink:0; }
.by-logo__text {
  display:flex; flex-direction:row; align-items:center;
  text-decoration:none; gap:8px;
}
.by-logo__img {
  height:42px; width:auto; max-width:42px;
  display:block; object-fit:contain;
  border-radius:6px;
}
.by-logo__icon {
  height:32px; width:32px; border-radius:6px;
  object-fit:contain; display:block; flex-shrink:0;
}
.by-logo__icon-default {
  width:32px; height:32px; border-radius:6px;
  background:var(--by-primary); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; flex-shrink:0;
}
.by-logo__wordmark {
  display:flex; flex-direction:column; gap:1px;
}
.by-logo__name {
  font-family:var(--by-heading-font);
  font-size:1.65rem; font-weight:800;
  color:var(--by-text); line-height:1;
  letter-spacing:-0.5px;
}
.by-logo__dot { color:var(--by-primary); }
.by-logo__tagline {
  font-size:.6rem; color:var(--by-text-muted);
  font-weight:500; letter-spacing:.5px;
  text-transform:uppercase;
}

@media(max-width:768px) {
  .by-logo__img { height:30px; width:30px; }
  .by-logo__name { font-size:1.3rem; }
  .by-logo__tagline { display:none; }
}

.by-header__right { display:flex; align-items:center; gap:.75rem; }

.by-header-search-btn,
.by-dark-toggle,
.by-hamburger {
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:var(--by-radius-full);
  background:var(--by-surface2); color:var(--by-text);
  transition:all var(--by-transition);
}
.by-dark-toggle { display:none !important; }
.by-header-search-btn:hover,
.by-dark-toggle:hover { background:var(--by-primary); color:#fff; }
.by-hamburger { display:none; flex-direction:column; gap:5px; padding:10px; }
.by-hamburger span { display:block; width:20px; height:2px; background:var(--by-text); border-radius:2px; transition:all var(--by-transition); }

/* Header Search Dropdown */
.by-header-search {
  background:var(--by-surface2); border-top:1px solid var(--by-border);
  max-height:0; overflow:hidden; transition:max-height .3s ease, padding .3s ease;
}
.by-header-search.is-open { max-height:80px; padding:.75rem 0; }
.by-search-form { display:flex; gap:.5rem; max-width:700px; margin-inline:auto; }
.by-search-input {
  flex:1; padding:.6rem 1rem; border:2px solid var(--by-border);
  border-radius:var(--by-radius-full); background:var(--by-surface);
  outline:none; transition:border-color var(--by-transition);
}
.by-search-input:focus { border-color:var(--by-primary); }
.by-search-submit,.by-search-close {
  padding:.6rem 1.2rem; border-radius:var(--by-radius-full);
  background:var(--by-primary); color:#fff;
  transition:background var(--by-transition);
}
.by-search-submit:hover,.by-search-close:hover { background:var(--by-accent); }
.by-search-close { background:var(--by-border); color:var(--by-text); }

/* ══════════════════════════════════════════════════════════════
   NAVBAR (Red Bar)
   ══════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════
   NAVBAR  –  dark navy bar matching design reference
   ══════════════════════════════════════════════════════════════ */
.by-navbar {
  background:var(--by-primary);
  height:var(--by-navbar-h);
  position:sticky; top:var(--by-header-h);
  z-index:9000;
  box-shadow:0 2px 8px rgba(0,0,0,.35);
  max-width:100vw;
  overflow:visible !important;
}
.by-navbar__inner {
  display:flex; align-items:center;
  justify-content:space-between;
  height:var(--by-navbar-h); gap:.5rem;
  overflow:visible !important;
  position:relative;
  z-index:9001;
}

/* ── Nav list — shrinks so search never overlaps ── */
.by-nav-list {
  display:flex; align-items:center;
  list-style:none; margin:0; padding:0;
  height:var(--by-navbar-h); gap:0;
  overflow:visible !important;
  flex:1 1 auto;
  min-width:0;
}

/* Home icon item */
.by-nav-home { background:rgba(0,0,0,.2); flex-shrink:0; }
.by-nav-home > a {
  display:flex; align-items:center; justify-content:center;
  width:52px; height:100%;
  color:#fff; font-size:1.1rem;
  transition:background var(--by-transition);
}
.by-nav-home > a:hover { background:rgba(0,0,0,.35); }

/* All top-level items */
.by-nav-list > .menu-item { position:relative; height:100%; }
.by-nav-list > .menu-item > a {
  display:flex; align-items:center; gap:.3rem;
  height:100%; padding:0 .75rem;
  color:#e8ecf5; font-weight:700; font-size:.78rem;
  letter-spacing:.4px; text-transform:uppercase;
  transition:background var(--by-transition), color var(--by-transition);
  white-space:nowrap; cursor:pointer;
}
.by-nav-list > .menu-item > a:hover,
.by-nav-list > .menu-item.current-menu-item > a,
.by-nav-list > .menu-item.current-menu-ancestor > a {
  background:rgba(255,255,255,.1); color:#fff;
}

/* Arrow icon */
.by-arrow {
  font-size:.6rem;
  transition:transform var(--by-transition);
  margin-left:.1rem;
  opacity:.8;
}
.by-nav-list > .menu-item:hover > a .by-arrow { transform:rotate(180deg); }

/* ── Desktop Dropdown ── */
.by-dropdown {
  position:absolute; top:100%; left:0;
  min-width:200px;
  background:#fff;
  border-top:3px solid var(--by-primary);
  border-radius:0 0 6px 6px;
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateY(-4px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s;
  z-index:9999; list-style:none; margin:0; padding:.35rem 0;
}
.by-nav-list > .menu-item:hover > .by-dropdown,
.by-nav-list > .menu-item:focus-within > .by-dropdown {
  opacity:1; visibility:visible; pointer-events:all;
  transform:translateY(0);
}
.by-dropdown li { border-bottom:1px solid #f0f0f0; }
.by-dropdown li:last-child { border-bottom:none; }
.by-dropdown li a {
  display:block; padding:.7rem 1.2rem;
  color:#2c3338; font-size:.88rem; font-weight:500;
  text-transform:uppercase; letter-spacing:.4px;
  transition:background var(--by-transition), color var(--by-transition), padding var(--by-transition);
}
.by-dropdown li a:hover {
  color:var(--by-primary); background:#fef2f2;
  padding-left:1.5rem;
}
.by-dropdown li.current-menu-item a { color:var(--by-primary); background:#fef2f2; font-weight:700; }

/* Navbar Search */
.by-navbar__search { flex-shrink:0; min-width:160px; }
.by-navbar-search-wrap {
  display:flex; align-items:center;
  background:rgba(255,255,255,.1);
  border-radius:var(--by-radius-full);
  padding:0 .75rem;
  border:1px solid rgba(255,255,255,.2);
  transition:background var(--by-transition);
}
.by-navbar-search-wrap:focus-within { background:rgba(255,255,255,.18); }
.by-navbar-search-wrap input {
  background:none; border:none; outline:none;
  color:#fff; padding:.35rem .5rem;
  font-size:.82rem; width:110px;
}
.by-navbar-search-wrap input::placeholder { color:rgba(255,255,255,.55); }
.by-navbar-search-wrap button { color:rgba(255,255,255,.8); padding:.35rem; }

/* ══════════════════════════════════════════════════════════════
   MOBILE MENU  –  accordion style
   ══════════════════════════════════════════════════════════════ */
.by-mobile-overlay {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,.55); z-index:1000;
  backdrop-filter:blur(3px);
}
.by-mobile-overlay.is-open { display:block; }

.by-mobile-menu {
  position:fixed; top:0; left:-320px; width:300px;
  height:100vh; background:#1a1a2e;
  z-index:1001; overflow-y:auto;
  transition:left .28s cubic-bezier(.4,0,.2,1);
  box-shadow:4px 0 24px rgba(0,0,0,.6);
}
.by-mobile-menu.is-open { left:0; }

.by-mobile-menu__header {
  display:flex; align-items:center; justify-content:space-between;
  padding:.9rem 1.2rem; background:var(--by-primary);
  color:#fff; font-weight:700; font-size:1rem;
  letter-spacing:.4px; text-transform:uppercase;
}
.by-mobile-menu__header button {
  color:rgba(255,255,255,.7); font-size:1.25rem;
  transition:color var(--by-transition);
}
.by-mobile-menu__header button:hover { color:#fff; }

.by-mobile-menu__body { padding:.5rem 0 2rem; }

/* Mobile nav list */
.by-mobile-nav-list { list-style:none; margin:0; padding:0; }

/* Individual item */
.by-mobile-item { border-bottom:1px solid rgba(255,255,255,.08); }
.by-mobile-item:last-child { border-bottom:none; }

/* Item row: link + toggle button */
.by-mobile-item__row {
  display:flex; align-items:center;
}
.by-mobile-item__link {
  flex:1; display:flex; align-items:center; gap:.6rem;
  padding:.85rem 1.4rem;
  color:#e8ecf5; font-weight:700; font-size:.85rem;
  text-transform:uppercase; letter-spacing:.5px;
  transition:color var(--by-transition), background var(--by-transition);
}
.by-mobile-item__link:hover,
.by-mobile-item--active > .by-mobile-item__row .by-mobile-item__link {
  color:#fff; background:rgba(198,40,40,.25);
}
.by-mobile-item__link .fa-home { font-size:1rem; }

/* Toggle arrow button */
.by-mobile-item__toggle {
  padding:.85rem 1.1rem;
  color:rgba(255,255,255,.5); font-size:.75rem;
  transition:color var(--by-transition), transform var(--by-transition);
  flex-shrink:0;
}
.by-mobile-item__toggle:hover { color:#fff; }
.by-mobile-item__toggle.is-open { transform:rotate(180deg); color:var(--by-primary); }

/* Submenu – hidden by default, shown via JS */
.by-mobile-submenu {
  display:none; list-style:none; margin:0; padding:0;
  background:rgba(0,0,0,.25);
}
.by-mobile-submenu.is-open { display:block; }

.by-mobile-submenu li { border-top:1px solid rgba(255,255,255,.05); }
.by-mobile-subitem__link {
  display:block; padding:.68rem 1.4rem .68rem 2.6rem;
  color:#9aa5c4; font-size:.82rem; font-weight:500;
  text-transform:uppercase; letter-spacing:.4px;
  transition:color var(--by-transition), background var(--by-transition);
}
.by-mobile-subitem__link:hover,
.by-mobile-submenu li.by-mobile-subitem--active .by-mobile-subitem__link {
  color:#fff; background:rgba(198,40,40,.2);
}

/* Mobile Search */
.by-mobile-search {
  display:flex; gap:.5rem; margin:1rem 1.2rem 0;
  padding:.5rem .75rem; background:rgba(255,255,255,.08);
  border-radius:var(--by-radius-full);
  border:1px solid rgba(255,255,255,.15);
}
.by-mobile-search input {
  flex:1; background:none; border:none; outline:none;
  color:#fff; padding:.3rem .4rem; font-size:.87rem;
}
.by-mobile-search input::placeholder { color:rgba(255,255,255,.4); }
.by-mobile-search button { color:rgba(255,255,255,.5); }
.by-mobile-search button:hover { color:#fff; }

/* ══════════════════════════════════════════════════════════════
   SECTION COMMON
   ══════════════════════════════════════════════════════════════ */
.by-section { padding:3rem 0; }

.by-section-header {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1.5rem;
}
.by-section-heading {
  font-family:var(--by-heading-font);
  font-size:1.5rem; font-weight:700;
  color:var(--by-text); position:relative;
  padding-left:1rem;
}
.by-section-heading::before {
  content:'';
  position:absolute; left:0; top:50%;
  transform:translateY(-50%);
  width:4px; height:85%; min-height:28px;
  background:var(--by-primary);
  border-radius:2px;
}
.by-view-all {
  display:flex; align-items:center; gap:.35rem;
  color:var(--by-primary); font-weight:600;
  font-size:.85rem; text-transform:uppercase;
  letter-spacing:.5px;
  transition:gap var(--by-transition);
}
.by-view-all:hover { gap:.6rem; }

/* ══════════════════════════════════════════════════════════════
   CARDS
   ══════════════════════════════════════════════════════════════ */
.by-card {
  background:var(--by-surface);
  border-radius:var(--by-radius-lg);
  overflow:hidden;
  box-shadow:var(--by-shadow-sm);
  transition:transform var(--by-transition), box-shadow var(--by-transition);
  display:flex; flex-direction:column;
  border:1px solid var(--by-border);
}
.by-card:hover {
  transform:translateY(-5px);
  box-shadow:var(--by-shadow-hover);
}
.by-card__img-link { display:block; overflow:hidden; }
.by-card__img {
  width:100%; height:200px;
  position:relative; overflow:hidden;
}
.by-card__img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .4s ease;
}
.by-card:hover .by-card__img img { transform:scale(1.05); }
.by-card__gradient-placeholder {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
}
.by-card__gradient-placeholder span {
  color:rgba(255,255,255,.8); font-weight:700;
  font-size:.9rem; text-transform:uppercase;
  letter-spacing:1px;
}
.by-card__body {
  padding:1rem 1.1rem 1.2rem;
  flex:1; display:flex; flex-direction:column; gap:.5rem;
}
.by-card__title {
  font-family:var(--by-heading-font);
  font-size:1rem; font-weight:700;
  line-height:1.4; color:var(--by-text);
  display:-webkit-box; -webkit-line-clamp:3;
  -webkit-box-orient:vertical; overflow:hidden;
}
.by-card__title a:hover { color:var(--by-primary); }
.by-card__meta {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:.5rem; font-size:.78rem; color:var(--by-text-muted);
}
.by-card__meta i { color:var(--by-primary); }
.by-card__product-meta {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.5rem;
}
.by-price {
  font-weight:700; color:var(--by-primary);
  font-size:.95rem;
}
.by-stars { display:flex; align-items:center; gap:.25rem; font-size:.78rem; color:#F59E0B; }
.by-stars small { color:var(--by-text-muted); }

/* Category badge on card image (position absolute) */
.by-card__img .by-cat-badge { display:none; /* hidden on cards */ } .by-card__img .by-cat-badge--KEEP {
  position:absolute; bottom:.6rem; left:.6rem; z-index:2;
}

/* ── Category Badge ──────────────────────────────────────────── */
.by-cat-badge {
  display:inline-flex; align-items:center;
  padding:.25rem .7rem; border-radius:var(--by-radius-full);
  font-size:.72rem; font-weight:700; color:#fff;
  text-transform:uppercase; letter-spacing:.5px;
  white-space:nowrap; flex-shrink:0;
}
.by-cat-badge--lg { font-size:.8rem; padding:.35rem 1rem; }
.by-cat-badge--xs { font-size:.65rem; padding:.15rem .5rem; }

/* Hide category name badge on article cards and archive pages */
.by-card__img .by-cat-badge,
.by-card .by-cat-badge { display:none !important; }

/* ── Grids ───────────────────────────────────────────────────── */
.by-grid { display:grid; gap:1.25rem; }
.by-grid--3 { grid-template-columns:repeat(3,1fr); }
.by-grid--4 { grid-template-columns:repeat(4,1fr); }
.by-grid--2 { grid-template-columns:repeat(2,1fr); }

/* ── Scroll Row ──────────────────────────────────────────────── */
.by-scroll-row {
  display:flex; gap:1.25rem; overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none; -webkit-overflow-scrolling:touch;
  padding-bottom:.5rem;
}
.by-scroll-row::-webkit-scrollbar { display:none; }
.by-scroll-row .by-card {
  flex:0 0 280px; scroll-snap-align:start;
}

/* ══════════════════════════════════════════════════════════════
   HERO SECTION
   ══════════════════════════════════════════════════════════════ */
.by-hero { background:var(--by-surface2); }
.by-hero__inner {
  display:grid; grid-template-columns:1fr 380px;
  gap:1.25rem; min-height:460px;
}
.by-hero__card {
  height:100%; min-height:420px; border-radius:var(--by-radius-lg);
  overflow:hidden; position:relative;
  background-size:cover !important; background-position:center !important;
  display:flex; align-items:flex-end;
  transition:transform var(--by-transition);
}
.by-hero__link:hover .by-hero__card { transform:scale(1.01); }
.by-hero__overlay {
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.3) 50%, transparent 100%);
}
.by-hero__content {
  position:relative; z-index:2; padding:2rem;
  display:flex; flex-direction:column; gap:.85rem;
}
.by-hero__title {
  font-family:var(--by-heading-font);
  font-size:1.9rem; font-weight:800; color:#fff;
  line-height:1.2; text-shadow:0 2px 8px rgba(0,0,0,.4);
}
.by-hero__meta {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:.75rem; color:rgba(255,255,255,.85); font-size:.82rem;
}
.by-hero__avatar { border-radius:50%; border:2px solid rgba(255,255,255,.5); }
.by-hero__author { font-weight:600; }
.by-hero__btn {
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--by-primary); color:#fff;
  padding:.6rem 1.25rem; border-radius:var(--by-radius-full);
  font-weight:700; font-size:.85rem; align-self:flex-start;
  transition:background var(--by-transition), transform var(--by-transition);
}
.by-hero__link:hover .by-hero__btn { background:var(--by-accent); transform:translateX(3px); }

/* Hero Sidebar */
.by-hero__sidebar {
  display:flex; flex-direction:column; gap:.75rem;
}
.by-hero__side-card {
  display:flex; gap:.85rem; align-items:center;
  background:var(--by-surface); border-radius:var(--by-radius);
  padding:.6rem; box-shadow:var(--by-shadow-sm);
  border:1px solid var(--by-border);
  transition:all var(--by-transition); flex:1;
}
.by-hero__side-card:hover {
  box-shadow:var(--by-shadow); transform:translateX(3px);
}
.by-hero__side-img {
  flex-shrink:0; width:80px; height:65px;
  border-radius:var(--by-radius); background-size:cover !important;
  background-position:center !important;
}
.by-hero__side-info { flex:1; overflow:hidden; }
.by-hero__side-info h3 {
  font-family:var(--by-heading-font);
  font-size:.88rem; font-weight:700; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden;
}
.by-hero__side-info small { color:var(--by-text-muted); font-size:.75rem; }

/* ══════════════════════════════════════════════════════════════
   TRENDING + JUST PUBLISHED
   ══════════════════════════════════════════════════════════════ */
.by-trending-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:1.5rem;
}
.by-trending-panel,
.by-just-published-panel {
  background:var(--by-surface); border-radius:var(--by-radius-lg);
  box-shadow:var(--by-shadow-sm); border:1px solid var(--by-border);
  overflow:hidden;
}
.by-panel-header {
  padding:1rem 1.25rem; border-bottom:2px solid var(--by-border);
}
.by-panel-header .by-section-heading { margin:0; }
.by-panel-header--dark {
  background:#1a1a2e; padding:1rem 1.25rem;
  display:flex; align-items:center; gap:.75rem;
}
.by-panel-header--dark h2 {
  font-family:var(--by-heading-font);
  color:#fff; font-size:1.15rem; font-weight:700;
}

/* Blinking Dot */
.by-blink-dot {
  width:10px; height:10px; border-radius:50%;
  background:var(--by-accent);
  animation: by-blink 1.2s ease-in-out infinite;
}
@keyframes by-blink {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:.3; transform:scale(.7); }
}

/* Trending List */
.by-trending-list { padding:.5rem 1.25rem; }
.by-trending-item {
  display:flex; gap:1rem; align-items:flex-start;
  padding:.85rem 0; border-bottom:1px solid var(--by-border);
}
.by-trending-item:last-child { border-bottom:none; }
.by-trending-num {
  font-family:var(--by-heading-font);
  font-size:1.5rem; font-weight:800; color:var(--by-border);
  min-width:36px; line-height:1;
}
.by-trending-info h4 {
  font-family:var(--by-heading-font);
  font-size:.95rem; font-weight:700; line-height:1.35;
  transition:color var(--by-transition);
}
.by-trending-item:hover .by-trending-info h4 { color:var(--by-primary); }
.by-trending-info h4 a { color:inherit; }
.by-trending-info small { color:var(--by-text-muted); font-size:.75rem; }
.by-trending-info small i { color:var(--by-primary); margin-right:.2rem; }

/* Just Published List */
.by-just-published-list { padding:.75rem 1.25rem; }
.by-thumb-card {
  display:flex; gap:.75rem; align-items:center;
  padding:.75rem 0; border-bottom:1px solid var(--by-border);
}
.by-thumb-card:last-child { border-bottom:none; }
.by-thumb-card__img {
  flex-shrink:0; width:72px; height:58px;
  border-radius:var(--by-radius); overflow:hidden;
}
.by-thumb-card__img img { width:100%; height:100%; object-fit:cover; }
.by-thumb-card__placeholder {
  width:100%; height:100%;
  background-size:cover;
}
.by-thumb-card__info { flex:1; overflow:hidden; }
.by-thumb-card__info h4 {
  font-family:var(--by-heading-font);
  font-size:.88rem; font-weight:700; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden;
  transition:color var(--by-transition);
}
.by-thumb-card:hover .by-thumb-card__info h4 { color:var(--by-primary); }
.by-thumb-card__info small { color:var(--by-text-muted); font-size:.75rem; }

/* ══════════════════════════════════════════════════════════════
   TABS (Education)
   ══════════════════════════════════════════════════════════════ */
.by-tabs {
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-bottom:1.5rem;
}
.by-tab {
  padding:.5rem 1.25rem; border-radius:var(--by-radius-full);
  border:2px solid var(--by-border);
  font-weight:600; font-size:.85rem;
  color:var(--by-text-muted);
  transition:all var(--by-transition);
}
.by-tab:hover { border-color:var(--by-primary); color:var(--by-primary); }
.by-tab--active {
  background:var(--by-surface); color:var(--by-text);
  border-color:var(--by-border); font-weight:600;
}

/* ══════════════════════════════════════════════════════════════
   PILLS (Automobiles)
   ══════════════════════════════════════════════════════════════ */
.by-pills {
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-bottom:1.25rem;
}
.by-pill {
  padding:.4rem 1rem; border-radius:var(--by-radius-full);
  border:1.5px solid var(--by-border);
  font-weight:600; font-size:.82rem;
  color:var(--by-text-muted);
  transition:all var(--by-transition);
}
.by-pill:hover { border-color:var(--by-primary); color:var(--by-primary); }
.by-pill--active {
  background:var(--by-primary); color:#fff;
  border-color:var(--by-primary);
}

/* Sub-category buttons */
.by-subcats {
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-top:1.25rem; padding-top:1.25rem;
  border-top:1px solid var(--by-border);
}
.by-subcat-btn {
  display:inline-flex; align-items:center;
  padding:.4rem 1rem; border-radius:var(--by-radius-full);
  background:var(--by-surface2); border:1.5px solid var(--by-border);
  font-size:.82rem; font-weight:500; color:var(--by-text);
  transition:all var(--by-transition);
}
.by-subcat-btn:hover {
  background:var(--by-primary); color:#fff;
  border-color:var(--by-primary);
}

/* ══════════════════════════════════════════════════════════════
   TRAVEL SECTION
   ══════════════════════════════════════════════════════════════ */
.by-travel-large {
  display:grid; grid-template-columns:1fr 1fr;
  gap:1.25rem; margin-bottom:1.25rem;
}
.by-travel-large__card {
  min-height:300px; border-radius:var(--by-radius-lg);
  position:relative; display:flex; align-items:flex-end;
  overflow:hidden; background-size:cover !important;
  background-position:center !important;
  transition:transform var(--by-transition);
}
.by-travel-large__card:hover { transform:scale(1.02); }
.by-travel-large__overlay {
  position:absolute; inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 60%);
}
.by-travel-large__content {
  position:relative; z-index:2; padding:1.5rem;
  display:flex; flex-direction:column; gap:.5rem;
}
.by-travel-large__content h3 {
  font-family:var(--by-heading-font);
  color:#fff; font-size:1.2rem; font-weight:700;
  line-height:1.3;
}
.by-travel-large__meta { display:flex; gap:1rem; color:rgba(255,255,255,.8); font-size:.8rem; }

/* ══════════════════════════════════════════════════════════════
   AD ZONES
   ══════════════════════════════════════════════════════════════ */
.by-ad-zone { text-align:center; padding:0; }
.by-ad-zone img { max-width:100%; margin-inline:auto; border-radius:var(--by-radius); }
/* .by-ad-zone--full base — defined below */
.by-ad-placeholder {
  background:repeating-linear-gradient(45deg,var(--by-surface2),var(--by-surface2) 10px,var(--by-border) 10px,var(--by-border) 20px);
  border:2px dashed var(--by-border);
  border-radius:var(--by-radius); padding:2rem 1rem;
  text-align:center; color:var(--by-text-muted);
  font-size:.8rem;
}
.by-ad-placeholder--300x250 { width:300px; height:250px; display:flex; align-items:center; justify-content:center; margin:0 auto; }

/* ═══════════════════════════════════════
   AD ZONE STYLES
   Handles any image size gracefully.
   1600×600 uploaded → shown full-width,
   scaled down to fit, never distorted.
   ═══════════════════════════════════════ */

/* Base ad zone wrapper */
.by-ad-zone { text-align:center; margin:.5rem 0; line-height:0; }
.by-ad-zone a { display:block; line-height:0; }
.by-ad-img {
  display:block; width:100%; height:auto; max-width:100%;
  border-radius:4px; margin:0 auto;
  transition:opacity .2s; object-fit:cover; object-position:center;
}
.by-ad-img:hover { opacity:.9; cursor:pointer; }

/* Homepage ads — centered, max width so not stretched on large screens */
.by-ad-zone--full { width:100%; text-align:center; }
.by-ad-zone--full:empty { display:none; }
.by-ad-zone--full .by-ad-zone { padding:.5rem 0; }
.by-home-ad { text-align:center; padding:.4rem 0; }
.by-home-ad .by-ad-zone { display:inline-block; max-width:728px; width:100%; margin:0 auto; }
.by-home-ad .by-ad-img {
  max-width:728px; max-height:90px;
  width:100%; height:auto;
  object-fit:cover; object-position:center;
  margin:0 auto; display:block; border-radius:4px;
}

/* Sidebar ads — medium size, stacked */
.by-sidebar-ad { margin-bottom:.5rem; text-align:center; }
.by-sidebar-ad:has(.by-ad-zone:empty) { display:none; }
.by-sidebar-ad .by-ad-zone,.by-ad-sidebar .by-ad-zone { margin:0; }
.by-ad-sidebar .by-ad-img,.by-sidebar-ad .by-ad-img {
  max-width:250px; max-height:200px;         /* medium — not huge */
  width:100%; height:auto;
  object-fit:contain; border-radius:var(--by-radius); margin:0 auto; display:block;
}

/* Article ads — full width like banner ads */
.by-article-ad { margin:1.25rem 0; text-align:center; line-height:0; }
.by-article-ad .by-ad-zone { width:100%; max-width:728px; margin:0 auto; display:block; line-height:0; }
.by-article-ad .by-ad-img {
  width:100%; height:auto;
  max-width:728px; max-height:90px;
  object-fit:cover; object-position:center;
  border-radius:4px; margin:0 auto; display:block;
}
.by-article-ad a { display:block; line-height:0; }

/* Admin placeholder */
.by-ad-placeholder {
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:.3rem; text-align:center;
  background:repeating-linear-gradient(45deg,#f9f9f9,#f9f9f9 10px,#f0f0f0 10px,#f0f0f0 20px);
  border:2px dashed #c62828; border-radius:6px;
  padding:.65rem 1rem; min-height:55px;
}
.by-ad-placeholder__label { font-weight:700; font-size:.76rem; color:#c62828; }
.by-ad-placeholder__size  { font-size:.71rem; color:#999; }
.by-ad-placeholder__hint  { font-size:.68rem; color:#aaa; font-style:italic; }

@media(max-width:768px) {
  .by-top-ad .by-ad-img    { max-height:50px; }
  .by-home-ad .by-ad-img   { max-height:60px; max-width:100%; }
  .by-article-ad .by-ad-img{ max-width:100%; max-height:60px; }
  .by-sidebar-ad .by-ad-img,.by-ad-sidebar .by-ad-img { max-width:200px; max-height:150px; }
}

/* ══════════════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════════════ */
.by-footer { background:#111827; color:#E5E7EB; margin-top:2.5rem; }
.by-footer__top { padding:1.75rem 0 1.25rem; }
.by-footer__grid { display:grid; grid-template-columns:1.6fr 1fr; gap:2.5rem; align-items:start; }
.by-footer__logo { display:block; margin-bottom:.5rem; }
.by-footer__logo .by-logo__name { color:#fff; font-size:1.35rem; }
.by-footer__tagline { color:rgba(255,255,255,.6); font-size:.76rem; margin-bottom:.5rem; }
.by-footer__about {
  color:rgba(255,255,255,.7); font-size:.84rem; line-height:1.6;
  margin-bottom:.9rem; display:block;
  width:260px;           /* fixed width — never stretches */
  min-height:60px;       /* fixed height box */
  white-space:normal;
  word-break:break-word;
  overflow:hidden;
}
.by-social-links { display:flex; gap:.75rem; }
.by-social-links a {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.1); color:#fff;
  font-size:.9rem; transition:all var(--by-transition);
}
.by-social-links a:hover { background:var(--by-primary); transform:translateY(-3px); }
.by-footer__heading {
  font-family:var(--by-heading-font);
  font-size:1.05rem; font-weight:700; color:#fff;
  margin-bottom:1.25rem; padding-bottom:.5rem;
  border-bottom:2px solid var(--by-primary);
  display:inline-block;
}
.by-footer__links { display:flex; flex-direction:column; gap:.5rem; }
.by-footer__links a {
  display:flex; align-items:center; gap:.5rem;
  color:rgba(255,255,255,.7); font-size:.88rem;
  transition:all var(--by-transition);
}
.by-footer__links a:hover { color:#fff; padding-left:.25rem; }
.by-footer__links a i { color:var(--by-primary); font-size:.7rem; }
.by-footer__popular { display:flex; flex-direction:column; gap:.85rem; }
.by-footer__popular a {
  display:flex; gap:.75rem; align-items:center;
  color:rgba(255,255,255,.8); transition:color var(--by-transition);
}
.by-footer__popular a:hover { color:#fff; }
.by-footer__popular-img { width:60px; height:48px; border-radius:6px; overflow:hidden; flex-shrink:0; }
.by-footer__popular-img img { width:100%; height:100%; object-fit:cover; }
.by-footer__popular-placeholder { width:100%; height:100%; background:rgba(255,255,255,.1); }
.by-footer__popular span { font-size:.85rem; font-weight:500; display:block; }
.by-footer__popular small { font-size:.75rem; color:rgba(255,255,255,.5); }
.by-footer__bottom {
  border-top:1px solid rgba(255,255,255,.1);
  padding:1.25rem 0; text-align:center;
}
.by-footer__bottom p { font-size:.82rem; color:rgba(255,255,255,.5); }
.by-footer__bottom a { color:var(--by-accent); }
.by-footer__brand-link { color:var(--by-primary) !important; font-weight:600; text-decoration:none; }
.by-footer__brand-link:hover { text-decoration:underline; }

/* ══════════════════════════════════════════════════════════════
   ARTICLE PAGE
   ══════════════════════════════════════════════════════════════ */
.by-article-layout {
  display:grid;
  grid-template-columns:1fr 300px;
  grid-template-rows:auto;        /* row height = tallest column = article */
  gap:1.5rem;
  align-items:start;
  padding:1.5rem 0;
}
.by-article {
  max-width:100%;
  min-width:0;
  overflow:hidden;
  align-self:start;
  grid-row:1;
  grid-column:1;
}
/* ── ARTICLE SIDEBAR — sticky, ads scroll with page ── */
.by-article-sidebar {
  grid-row:1;
  grid-column:2;
  align-self:start;
  position:sticky;
  top:calc(var(--by-header-h) + 1rem);
  /* No max-height — let ads flow naturally, sidebar sticks as user scrolls */
}
/* Each ad block inside sidebar */
.by-article-sidebar .by-sidebar-ad {
  margin-bottom:.6rem;
}
.by-article-sidebar .by-sidebar-ad:last-child { margin-bottom:0; }

.by-article__featured-img {
  border-radius:var(--by-radius-lg); overflow:hidden;
  margin-bottom:1rem;
  width:100%; max-width:100%;
  max-height:480px;
}
.by-article__img {
  width:100%; height:auto; display:block;
  max-height:480px;
  object-fit:cover; object-position:center;
}

.by-article__header {
  margin-bottom:1.5rem;
  padding-bottom:1.25rem;
  border-bottom:2px solid var(--by-border);
  min-width:0;
  width:100%;
}
.by-article__title {
  font-family:var(--by-heading-font);
  font-size:2.15rem; font-weight:800;
  line-height:1.25; margin:1rem 0 1.25rem;
  color:var(--by-text);
}
.by-article__meta {
  display:flex; align-items:flex-start; justify-content:space-between;
  flex-wrap:wrap; gap:.75rem; margin-bottom:1rem;
  width:100%;
}
.by-article__author { display:flex; gap:.75rem; align-items:center; }
.by-article__avatar { border-radius:50%; width:44px; height:44px; }
.by-article__author-name { font-weight:700; color:var(--by-text); font-size:.95rem; }
.by-article__meta-row {
  display:flex; flex-wrap:wrap; gap:.75rem;
  font-size:.8rem; color:var(--by-text-muted); margin-top:.25rem;
}
.by-article__meta-row i { color:var(--by-primary); margin-right:.2rem; }

/* Font Controls */
.by-font-controls { display:flex; gap:.5rem; align-items:center; flex-shrink:0; }
.by-font-btn {
  padding:.4rem .8rem; border-radius:var(--by-radius-full);
  background:var(--by-surface2); border:1.5px solid var(--by-border);
  font-weight:700; font-size:.9rem; color:var(--by-text);
  transition:all var(--by-transition);
}
.by-font-btn:hover { background:var(--by-primary); color:#fff; border-color:var(--by-primary); }

/* Article Body */
.by-article__body {
  font-size:1.05rem; line-height:1.85;
  color:var(--by-text);
  overflow-x:hidden;
  overflow-wrap:break-word;
  word-break:break-word;
  min-width:0;
  width:100%;
}
.by-article__body h2 {
  font-family:var(--by-heading-font);
  font-size:1.6rem; font-weight:700;
  margin:2.5rem 0 1rem;
  padding-left:1rem; position:relative;
}
.by-article__body h2::before {
  content:''; position:absolute; left:0; top:50%;
  transform:translateY(-50%); width:4px; height:80%;
  background:var(--by-primary); border-radius:2px;
}
.by-article__body h3 {
  font-family:var(--by-heading-font);
  font-size:1.3rem; font-weight:700;
  margin:2rem 0 .75rem;
}
.by-article__body h4 { font-size:1.1rem; font-weight:700; margin:1.5rem 0 .5rem; }
.by-article__body p { margin-bottom:1.25rem; }
.by-article__body img { border-radius:var(--by-radius); margin:1.5rem 0; box-shadow:var(--by-shadow); max-width:100% !important; width:auto; height:auto; display:block; }
.by-article__body a { color:var(--by-primary); text-decoration:underline; }

/* ── Responsive Tables (editor-generated) ── */
.by-article__body table {
  width:100%; border-collapse:collapse;
  margin:1.25rem 0;
  font-family:inherit;
  line-height:1.5;
  overflow-x:auto;
  display:table;
  table-layout:fixed;      /* forces all columns equal width */
  -webkit-overflow-scrolling:touch;
  white-space:normal;
  font-size:.88rem;         /* slightly smaller than body so more fits */
}
.by-article__body table th,
.by-article__body table td {
  padding:.4rem .6rem;     /* compact padding */
  border:1px solid var(--by-border);
  text-align:left; vertical-align:top;
  white-space:normal;
  word-break:break-word;   /* long words wrap instead of expanding cell */
  overflow:hidden;
  font-size:inherit;
  line-height:1.5;
}
.by-article__body table th {
  background:var(--by-surface2);
  color:var(--by-text);
  font-weight:700;
  border-bottom:2px solid var(--by-primary);
}
.by-article__body table tr:nth-child(even) td {
  background:var(--by-surface2);
}
.by-article__body table tr:hover td {
  background:rgba(198,40,40,.04);
}

/* Gutenberg table block wrapper */
.by-article__body figure.wp-block-table {
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  margin:1.25rem 0; width:100%;
}
.by-article__body figure.wp-block-table table {
  margin:0; width:100%;
}

/* Auto-reduce font based on column count via CSS container approach */
/* Many columns — browser compresses equally due to table-layout:fixed */
/* Extra safety: if table overflows on small screens, scroll horizontally */
@media(max-width:768px) {
  .by-article__body table {
    display:block;
    overflow-x:auto;
    font-size:.78rem;
    white-space:nowrap;       /* on mobile let it scroll sideways */
  }
  .by-article__body table th,
  .by-article__body table td {
    padding:.3rem .45rem;
    white-space:normal;
    min-width:60px;
  }
}

/* ── iframes / embeds (YouTube etc) ── */
.by-article__body iframe,
.by-article__body embed,
.by-article__body object {
  max-width:100%; display:block;
}
/* Responsive video wrapper */
.by-article__body .wp-block-embed__wrapper {
  position:relative; padding-bottom:56.25%; height:0; overflow:hidden;
}
.by-article__body .wp-block-embed__wrapper iframe {
  position:absolute; top:0; left:0; width:100%; height:100%;
}

/* ── WP Gutenberg blocks ── */
.by-article__body .wp-block-image img { max-width:100%; height:auto; }
.by-article__body .wp-block-gallery { overflow-x:auto; }
.by-article__body pre {
  overflow-x:auto; background:var(--by-surface2);
  border:1px solid var(--by-border); border-radius:var(--by-radius);
  padding:1rem; font-size:.85rem; white-space:pre-wrap;
  word-break:break-all;
}
.by-article__body code {
  background:var(--by-surface2); padding:.1rem .4rem;
  border-radius:4px; font-size:.85em;
}
.by-article__body ul,.by-article__body ol { padding-left:1.5rem; margin-bottom:1.25rem; }
.by-article__body ul { list-style:disc; }
.by-article__body ol { list-style:decimal; }
.by-article__body li { margin-bottom:.5rem; }
.by-article__body blockquote {
  border-left:4px solid var(--by-primary);
  padding:.75rem 1.5rem; margin:2rem 0;
  background:var(--by-surface2); border-radius:0 var(--by-radius) var(--by-radius) 0;
  font-style:italic; font-size:1.1rem; color:var(--by-text-muted);
}

/* Table of Contents */
.by-toc {
  background:var(--by-surface2); border:1px solid var(--by-border);
  border-left:4px solid var(--by-primary);
  border-radius:var(--by-radius); padding:1.25rem;
  margin-bottom:2rem;
}
.by-toc__title { font-weight:700; margin-bottom:.75rem; font-size:.95rem; }
.by-toc__title i { color:var(--by-primary); margin-right:.5rem; }
.by-toc__list { padding-left:1.5rem; list-style:decimal; }
.by-toc__list li { margin-bottom:.35rem; }
.by-toc__list a { color:var(--by-primary); font-size:.9rem; }

/* Specs Table */
.by-specs-section { margin:2rem 0; }
.by-specs-table-display {
  width:100%; border-collapse:collapse;
  border-radius:var(--by-radius); overflow:hidden;
  box-shadow:var(--by-shadow-sm);
}
.by-specs-table-display th,.by-specs-table-display td { padding:.7rem 1rem; font-size:.9rem; text-align:left; }
.by-specs-table-display th { background:var(--by-surface2); font-weight:700; width:40%; border-right:2px solid var(--by-border); }
.by-specs-table-display td { background:var(--by-surface); }
.by-specs-table-display tr { border-bottom:1px solid var(--by-border); }
.by-specs-table-display tr:last-child { border-bottom:none; }

/* Social Share */
.by-share {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:.6rem; margin:1.5rem 0;
}
.by-share--top { padding-bottom:1.5rem; border-bottom:1px solid var(--by-border); }
.by-share--bottom { padding-top:1.5rem; border-top:1px solid var(--by-border); }
.by-share__label { font-weight:700; font-size:.85rem; color:var(--by-text-muted); }
.by-share__btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .9rem; border-radius:var(--by-radius-full);
  font-size:.82rem; font-weight:600; color:#fff;
  transition:all var(--by-transition);
}
.by-share__btn:hover { transform:translateY(-2px); filter:brightness(1.1); }
.by-share__btn--fb { background:#1877F2; }
.by-share__btn--tw { background:#000; }
.by-share__btn--wa { background:#25D366; }
.by-share__btn--cp { background:var(--by-text-muted); }

/* Tags */
.by-tags { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:1.5rem 0; }
.by-tags__label { font-weight:700; font-size:.85rem; color:var(--by-text-muted); }
.by-tag {
  padding:.3rem .8rem; border-radius:var(--by-radius-full);
  background:var(--by-surface2); border:1px solid var(--by-border);
  font-size:.8rem; color:var(--by-text);
  transition:all var(--by-transition);
}
.by-tag:hover { background:var(--by-primary); color:#fff; border-color:var(--by-primary); }

/* Author Box */
.by-author-box {
  display:flex; gap:1.25rem; align-items:flex-start;
  background:var(--by-surface2); border-radius:var(--by-radius-lg);
  padding:1.5rem; margin:2rem 0;
  border:1px solid var(--by-border);
  border-top:4px solid var(--by-primary);
}
.by-author-box__avatar img { border-radius:50%; width:80px; height:80px; flex-shrink:0; }
.by-author-box__role { font-size:.75rem; text-transform:uppercase; font-weight:700; color:var(--by-primary); letter-spacing:.5px; }
.by-author-box__name { font-family:var(--by-heading-font); font-size:1.1rem; font-weight:700; margin:.25rem 0 .5rem; }
.by-author-box__info p { font-size:.9rem; color:var(--by-text-muted); }

/* Post Navigation */
.by-post-nav { margin:2rem 0; }
.by-post-nav__grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.by-post-nav__item {
  padding:1rem; border-radius:var(--by-radius);
  background:var(--by-surface2); border:1px solid var(--by-border);
  display:flex; flex-direction:column; gap:.35rem;
  transition:all var(--by-transition);
}
.by-post-nav__item:hover { background:var(--by-primary); color:#fff; }
.by-post-nav__label { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--by-primary); }
.by-post-nav__item:hover .by-post-nav__label { color:rgba(255,255,255,.8); }
.by-post-nav__title { font-family:var(--by-heading-font); font-size:.95rem; font-weight:700; line-height:1.3; }
.by-post-nav__next { text-align:right; }

/* Related Articles */
.by-related { margin-top:2.5rem; }


.by-sidebar-ad {
  margin-bottom:1.25rem; text-align:center;
}
.by-sidebar-ad img { border-radius:var(--by-radius); max-width:300px; margin-inline:auto; }
.by-sidebar-widget {
  background:var(--by-surface); border-radius:var(--by-radius-lg);
  border:1px solid var(--by-border); overflow:hidden; margin-bottom:1.25rem;
}
.by-sidebar-widget__title {
  font-family:var(--by-heading-font);
  font-size:1rem; font-weight:700; padding:1rem;
  border-bottom:2px solid var(--by-primary);
  background:var(--by-surface2);
}
.by-sidebar-widget .by-thumb-card { padding:.6rem 1rem; }

/* Article Ads */
.by-article-ad { margin:2rem 0; text-align:center; }

/* ══════════════════════════════════════════════════════════════
   ARCHIVE / CATEGORY
   ══════════════════════════════════════════════════════════════ */
.by-archive-banner {
  padding:.4rem 0 .5rem; margin-bottom:.75rem;
  background:linear-gradient(135deg,#b71c1c 0%,#c62828 60%,#d32f2f 100%);
}
.by-archive-banner .by-breadcrumb { color:rgba(255,255,255,.75); margin-bottom:.15rem; font-size:.74rem; }
.by-archive-banner .by-breadcrumb a { color:rgba(255,255,255,.9); }
.by-archive-banner .by-breadcrumb span { color:rgba(255,255,255,.5); }
.by-archive-banner__title { font-family:var(--by-heading-font); font-size:1.25rem; font-weight:800; color:#fff; line-height:1.2; }
.by-archive-banner__desc { color:rgba(255,255,255,.8); margin-top:.15rem; font-size:.82rem; }
.by-archive-banner__count { display:inline-block; margin-top:.25rem; background:rgba(255,255,255,.18); color:#fff; padding:.15rem .6rem; border-radius:var(--by-radius-full); font-size:.72rem; font-weight:600; }

.by-archive-layout { display:grid; grid-template-columns:280px 1fr; gap:2rem; align-items:start; }

/* Archive Toolbar */
.by-archive-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:1rem; margin-bottom:1.5rem;
  padding:1rem; background:var(--by-surface);
  border-radius:var(--by-radius); border:1px solid var(--by-border);
}
.by-archive-toolbar__left,.by-archive-toolbar__right { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; }
.by-archive-count { font-size:.85rem; color:var(--by-text-muted); font-weight:500; }
.by-filter-toggle {
  display:none; align-items:center; gap:.5rem;
  background:var(--by-primary); color:#fff;
  padding:.4rem .9rem; border-radius:var(--by-radius-full);
  font-weight:600; font-size:.85rem;
}
.by-sort-wrap { display:flex; align-items:center; gap:.5rem; }
.by-sort-wrap label { font-size:.85rem; font-weight:500; color:var(--by-text-muted); }
.by-sort-select {
  padding:.4rem .75rem; border-radius:var(--by-radius-full);
  border:1.5px solid var(--by-border);
  background:var(--by-surface); color:var(--by-text);
  font-size:.85rem; cursor:pointer;
}
.by-archive-search {
  display:flex; background:var(--by-surface2);
  border:1.5px solid var(--by-border);
  border-radius:var(--by-radius-full); overflow:hidden;
}
.by-archive-search input { padding:.4rem .85rem; background:none; border:none; outline:none; font-size:.85rem; }
.by-archive-search button { padding:.4rem .85rem; color:var(--by-primary); }

/* ── Filter Sidebar ── */
.by-filter-sidebar {
  position:sticky;
  top:calc(var(--by-header-h) + var(--by-navbar-h) + 1.5rem);
  max-height:calc(100vh - var(--by-header-h) - var(--by-navbar-h) - 3rem);
  overflow-y:auto; overflow-x:hidden;
  background:var(--by-surface);
  border-radius:var(--by-radius-lg);
  border:1px solid var(--by-border);
  scrollbar-width:thin;
  scrollbar-color:var(--by-border) transparent;
}
.by-filter-sidebar::-webkit-scrollbar { width:4px; }
.by-filter-sidebar::-webkit-scrollbar-thumb { background:var(--by-border); border-radius:4px; }

.by-filter-panel { padding:.85rem; }

/* Header row */
.by-filter-header {
  display:flex; justify-content:space-between; align-items:center;
  padding-bottom:.7rem; border-bottom:2px solid var(--by-primary);
  margin-bottom:.85rem;
}
.by-filter-header h3 {
  font-family:var(--by-heading-font); font-weight:700;
  font-size:1rem; display:flex; align-items:center; gap:.45rem;
}
.by-filter-header h3 i { color:var(--by-primary); }
.by-clear-all {
  font-size:.75rem; color:var(--by-primary); font-weight:600;
  text-decoration:underline; white-space:nowrap;
}
.by-clear-all:hover { color:var(--by-accent); }

/* Global keyword search */
.by-filter-keyword { margin-bottom:.85rem; }
.by-filter-keyword__wrap {
  display:flex; align-items:center; gap:.5rem;
  background:var(--by-surface2);
  border:1.5px solid var(--by-border);
  border-radius:var(--by-radius-full);
  padding:.38rem .75rem;
  transition:border-color var(--by-transition);
}
.by-filter-keyword__wrap:focus-within { border-color:var(--by-primary); }
.by-filter-keyword__wrap i { color:var(--by-text-muted); font-size:.85rem; flex-shrink:0; }
.by-filter-keyword__input {
  flex:1; border:none; outline:none; background:transparent;
  font-size:.85rem; color:var(--by-text);
}
.by-filter-keyword__input::placeholder { color:var(--by-text-muted); }

/* Active tags (sidebar) */
.by-active-filters {
  display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.75rem;
}
.by-active-filters:empty { display:none; }

/* Filter group */
.by-filter-group {
  border-bottom:1px solid var(--by-border);
  padding-bottom:.6rem; margin-bottom:.6rem;
}
.by-filter-group:last-child { border-bottom:none; margin-bottom:0; }
.by-filter-group.by-filter-group--hidden { display:none; } /* keyword search hides groups */

/* Group title / toggle */
.by-filter-group__title {
  display:flex; align-items:center; justify-content:space-between;
  width:100%; font-weight:700; font-size:.86rem;
  padding:.45rem 0; color:var(--by-text); cursor:pointer; text-align:left;
  transition:color var(--by-transition);
}
.by-filter-group__title:hover { color:var(--by-primary); }
.by-filter-group__title i {
  font-size:.65rem; flex-shrink:0; margin-left:.5rem;
  transition:transform var(--by-transition); color:var(--by-text-muted);
}
.by-filter-group__title[aria-expanded="false"] i { transform:rotate(-90deg); }

/* Group body */
.by-filter-group__body { padding:.25rem 0 .35rem; }
.by-filter-group__body[hidden] { display:none; }

/* Per-group search input */
.by-filter-group__search-wrap { margin-bottom:.45rem; }
.by-filter-group__search {
  width:100%; padding:.32rem .65rem;
  border:1px solid var(--by-border);
  border-radius:var(--by-radius-full);
  font-size:.8rem;
  background:var(--by-surface2);
  color:var(--by-text); outline:none;
  transition:border-color var(--by-transition);
}
.by-filter-group__search:focus { border-color:var(--by-primary); }

/* Checkbox options */
.by-filter-group__options { display:flex; flex-direction:column; gap:.05rem; }

.by-filter-check {
  display:flex; align-items:center; gap:.5rem;
  padding:.3rem .2rem; font-size:.84rem;
  cursor:pointer; color:var(--by-text);
  border-radius:4px;
  transition:background var(--by-transition), color var(--by-transition);
}
.by-filter-check:hover { color:var(--by-primary); background:var(--by-surface2); }
.by-filter-check.is-hidden { display:none; } /* group search hides options */
.by-filter-check input[type=checkbox] {
  accent-color:var(--by-primary);
  width:15px; height:15px; flex-shrink:0; cursor:pointer;
}
.by-filter-check input[type=checkbox]:checked + span { color:var(--by-primary); font-weight:600; }
.by-filter-count { margin-left:auto; color:var(--by-text-muted); font-size:.72rem; }

/* "No filters" message */
.by-filter-none { font-size:.85rem; color:var(--by-text-muted); padding:.5rem 0; }

/* ── Province Accordion (inside Location group) ── */
.by-province-accordion { margin-bottom:.4rem; }
.by-province-btn {
  width:100%; text-align:left; padding:.38rem .55rem;
  display:flex; align-items:center; justify-content:space-between;
  font-size:.82rem; font-weight:600; color:var(--by-text);
  border-radius:var(--by-radius); background:var(--by-surface2);
  border:1px solid var(--by-border); cursor:pointer;
  transition:background var(--by-transition);
}
.by-province-btn:hover { background:var(--by-border); }
.by-province-btn i { font-size:.6rem; transition:transform var(--by-transition); }
.by-province-btn.is-open i { transform:rotate(180deg); }
.by-district-list { padding:.35rem 0 .25rem .8rem; display:none; }
.by-district-list.is-open { display:block; }
.by-district-list .by-filter-check { font-size:.8rem; }

/* Foreign / International option */
.by-filter-check--foreign {
  font-weight:600; color:var(--by-primary);
  padding:.4rem .2rem; margin-bottom:.25rem;
}
.by-filter-check--foreign i { font-size:.85rem; }
.by-filter-divider {
  border:none; border-top:1px solid var(--by-border);
  margin:.35rem 0 .5rem;
}

/* ── Active filter tags ── */
.by-active-filters-bar {
  display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom:1rem;
}
.by-active-filter-tag {
  display:inline-flex; align-items:center; gap:.35rem;
  background:var(--by-primary); color:#fff;
  padding:.22rem .7rem; border-radius:var(--by-radius-full);
  font-size:.76rem; font-weight:600;
}
.by-active-filter-tag button {
  color:rgba(255,255,255,.75); font-size:.8rem;
  line-height:1; margin-left:.1rem;
  transition:color var(--by-transition);
}
.by-active-filter-tag button:hover { color:#fff; }

/* Mobile Drawer */
.by-filter-drawer-overlay {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,.5); z-index:1002;
}
.by-filter-drawer-overlay.is-open { display:block; }
.by-filter-drawer {
  position:fixed; left:-320px; top:0; width:300px;
  height:100vh; background:var(--by-surface);
  z-index:1003; overflow-y:auto;
  transition:left var(--by-transition);
  display:flex; flex-direction:column;
}
.by-filter-drawer.is-open { left:0; }
.by-filter-drawer__header {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem; background:var(--by-primary); color:#fff;
  flex-shrink:0;
}
.by-filter-drawer__header h3 { font-family:var(--by-heading-font); font-size:1rem; }
.by-filter-drawer__header button { color:#fff; font-size:1.1rem; }
.by-filter-drawer__body { flex:1; overflow-y:auto; padding:1rem; }
.by-filter-drawer__footer { padding:1rem; border-top:1px solid var(--by-border); flex-shrink:0; }

/* ══════════════════════════════════════════════════════════════
   BREADCRUMB
   ══════════════════════════════════════════════════════════════ */
.by-breadcrumb {
  display:flex; flex-wrap:wrap; align-items:center; gap:.35rem;
  font-size:.8rem; color:var(--by-text-muted); margin-bottom:1.25rem;
}
.by-breadcrumb a { color:var(--by-primary); }
.by-breadcrumb a:hover { text-decoration:underline; }
.by-breadcrumb span { color:var(--by-border); }

/* ══════════════════════════════════════════════════════════════
   PAGINATION
   ══════════════════════════════════════════════════════════════ */
.by-pagination {
  display:flex; justify-content:center; flex-wrap:wrap;
  gap:.5rem; margin-top:2.5rem; padding-top:1.5rem;
  border-top:1px solid var(--by-border);
}
.by-pagination .page-numbers {
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:var(--by-radius-full);
  background:var(--by-surface); border:1.5px solid var(--by-border);
  font-weight:600; font-size:.88rem; color:var(--by-text);
  transition:all var(--by-transition);
}
.by-pagination .page-numbers:hover,
.by-pagination .page-numbers.current {
  background:var(--by-primary); color:#fff; border-color:var(--by-primary);
}
.by-pagination .prev,.by-pagination .next { width:auto; padding:0 1rem; }

/* ══════════════════════════════════════════════════════════════
   UTILITY CLASSES
   ══════════════════════════════════════════════════════════════ */
.by-btn {
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--by-primary); color:#fff;
  padding:.6rem 1.35rem; border-radius:var(--by-radius-full);
  font-weight:700; font-size:.88rem;
  transition:all var(--by-transition);
}
.by-btn:hover { background:var(--by-accent); transform:translateY(-1px); }
.by-btn--full { width:100%; justify-content:center; }

.by-no-results {
  grid-column:1/-1; text-align:center; padding:4rem 2rem;
  color:var(--by-text-muted);
}
.by-no-results i { font-size:3rem; display:block; margin-bottom:1rem; opacity:.3; }

/* Back to Top */
.by-back-to-top {
  position:fixed; bottom:2rem; right:1.5rem; z-index:800;
  width:44px; height:44px; border-radius:50%;
  background:var(--by-primary); color:#fff;
  box-shadow:var(--by-shadow-lg);
  opacity:0; pointer-events:none;
  transition:all var(--by-transition);
  display:flex; align-items:center; justify-content:center;
}
.by-back-to-top.is-visible { opacity:1; pointer-events:all; }
.by-back-to-top:hover { background:var(--by-accent); transform:translateY(-3px); }

/* Loading Spinner */
.by-spinner {
  display:flex; align-items:center; justify-content:center;
  padding:3rem; color:var(--by-primary);
}
.by-spinner::after {
  content:''; width:36px; height:36px; border-radius:50%;
  border:3px solid var(--by-border);
  border-top-color:var(--by-primary);
  animation:by-spin .7s linear infinite;
}
@keyframes by-spin { to { transform:rotate(360deg); } }

/* ══════════════════════════════════════════════════════════════
   SEARCH PAGE
   ══════════════════════════════════════════════════════════════ */
.by-search-main { padding:3rem 0; }
.by-search-header { text-align:center; margin-bottom:2.5rem; }
.by-search-header h1 { font-family:var(--by-heading-font); font-size:2rem; margin-bottom:.5rem; }
.by-search-header h1 span { color:var(--by-primary); }
.by-search-count { color:var(--by-text-muted); margin-bottom:1.5rem; }
.by-search-form--large { max-width:600px; margin-inline:auto; display:flex; gap:.5rem; }
.by-search-form--large input {
  flex:1; padding:.7rem 1.25rem; border:2px solid var(--by-border);
  border-radius:var(--by-radius-full); font-size:1rem; outline:none;
  background:var(--by-surface);
}
.by-search-form--large input:focus { border-color:var(--by-primary); }

/* ══════════════════════════════════════════════════════════════
   ANIMATIONS
   ══════════════════════════════════════════════════════════════ */
@keyframes by-fade-up {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
.by-card { animation:by-fade-up .4s ease both; }
.by-card:nth-child(1) { animation-delay:.05s; }
.by-card:nth-child(2) { animation-delay:.1s; }
.by-card:nth-child(3) { animation-delay:.15s; }
.by-card:nth-child(4) { animation-delay:.2s; }

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET (max 1024px)
   ══════════════════════════════════════════════════════════════ */
@media (max-width:1024px) {
  :root { --by-container:100%; }
  .by-hero__inner { grid-template-columns:1fr 300px; }
  .by-grid--4 { grid-template-columns:repeat(2,1fr); }
  .by-footer__grid { grid-template-columns:1fr 1fr; gap:1.5rem; }
  /* Keep sidebar visible on tablet but narrower */
  .by-article-layout { grid-template-columns:1fr 260px; gap:1rem; }
  .by-article-sidebar { position:sticky; }
  .by-archive-layout { grid-template-columns:240px 1fr; }
  .by-trending-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:860px) {
  /* Below 860px — hide sidebar, full width article */
  .by-article-layout { grid-template-columns:1fr !important; }
  .by-article-sidebar { display:none !important; }
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE (max 768px)
   ══════════════════════════════════════════════════════════════ */
@media (max-width:768px) {
  html { font-size:15px; overflow-x:hidden; }
  body { overflow-x:hidden; }

  /* Universal clamp — nothing wider than viewport */
  * { max-width:100%; box-sizing:border-box; }
  img,video,iframe,embed,object,table,pre { max-width:100% !important; }

  .by-container { padding-inline:.9rem; width:100%; }

  /* Header */
  .by-header { height:60px; overflow:hidden; }
  .by-header__inner { height:60px; }
  :root { --by-header-h:60px; --by-navbar-h:0px; }
  .by-logo__name { font-size:1.4rem; }
  .by-logo__tagline { display:none; }
  .by-hamburger { display:flex; }

  /* Navbar — HIDDEN on mobile, drawer used instead */
  .by-navbar { display:none !important; }

  /* Hero */
  .by-hero__inner { grid-template-columns:1fr; gap:1rem; }
  .by-hero__card { min-height:280px; }
  .by-hero__title { font-size:1.3rem; }
  .by-hero__sidebar { display:none; }

  /* Grids */
  .by-grid--3 { grid-template-columns:repeat(2,1fr); }
  .by-grid--4 { grid-template-columns:repeat(2,1fr); }
  .by-grid--2 { grid-template-columns:1fr; }
  .by-trending-grid { grid-template-columns:1fr; }
  .by-travel-large { grid-template-columns:1fr; }

  /* Footer */
  .by-footer__grid { grid-template-columns:1fr; gap:1.25rem; }
  .by-footer__top { padding:1.25rem 0 .75rem; }

  /* Archive */
  .by-archive-layout { grid-template-columns:1fr !important; }
  .by-filter-sidebar { display:none; }
  .by-filter-toggle { display:flex; }
  .by-archive-banner__title { font-size:1.05rem; }

  /* Article layout — single column, no blowout */
  .by-article-main { overflow-x:hidden; width:100%; }
  .by-article-layout {
    display:block !important;  /* block instead of grid — safest on mobile */
    width:100%;
    padding:.75rem 0;
  }
  .by-article-sidebar { display:none; }  /* hide sidebar on mobile */
  .by-article {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:hidden;
  }
  .by-article__featured-img { width:100%; margin-bottom:1rem; border-radius:8px; overflow:hidden; }
  .by-article__featured-img img,.by-article__img { width:100% !important; height:auto !important; display:block; }
  .by-article__title { font-size:1.25rem; line-height:1.3; word-break:break-word; }
  .by-article__meta { flex-direction:column; gap:.5rem; }
  .by-article__meta-row { flex-wrap:wrap; gap:.4rem; }
  .by-font-btn { padding:.28rem .55rem; font-size:.8rem; }

  /* Article body */
  .by-article__body {
    font-size:.95rem; line-height:1.8;
    overflow-x:hidden;
    overflow-wrap:break-word;
    word-break:break-word;
    width:100%;
  }
  .by-article__body h2 { font-size:1.15rem; padding-left:.65rem; margin:1.25rem 0 .5rem; }
  .by-article__body h3 { font-size:1rem; margin:1rem 0 .4rem; }
  .by-article__body h4 { font-size:.92rem; }
  .by-article__body p { margin-bottom:1rem; }
  .by-article__body blockquote { padding:.55rem .9rem; font-size:.9rem; }

  /* Images inside body */
  .by-article__body img { max-width:100% !important; width:auto !important; height:auto !important; display:block; }

  /* Tables — horizontal scroll */
  .by-article__body table { display:block !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch; white-space:nowrap; border-collapse:collapse; font-size:.82rem; }
  .by-article__body table th,.by-article__body table td { padding:.35rem .6rem; white-space:normal; word-break:break-word; min-width:70px; border:1px solid #e0e0e0; }
  .by-article__body table th { background:#c62828; color:#fff; }
  .by-article__body figure.wp-block-table { display:block !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch; }
  .by-article__body figure.wp-block-table table { display:table; }

  /* Embeds */
  .by-article__body iframe { max-width:100% !important; width:100% !important; }
  .by-article__body .wp-block-embed__wrapper { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; }
  .by-article__body .wp-block-embed__wrapper iframe { position:absolute; top:0; left:0; width:100% !important; height:100% !important; }

  /* Code */
  .by-article__body pre { overflow-x:auto; white-space:pre-wrap; word-break:break-all; font-size:.78rem; }
  .by-article__body code { font-size:.8em; word-break:break-all; }

  /* Share */
  .by-share { flex-wrap:wrap !important; gap:.45rem; }
  .by-share__btn { padding:.35rem .75rem !important; font-size:.78rem !important; }

  /* Post nav */
  .by-post-nav { display:block; }
  .by-post-nav__item { margin-bottom:.75rem; }
  .by-scroll-row .by-card { flex:0 0 220px; }
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — SMALL MOBILE (max 480px)
   ══════════════════════════════════════════════════════════════ */
@media (max-width:480px) {
  .by-container { padding-inline:.75rem; }
  .by-grid--3 { grid-template-columns:1fr; }
  .by-grid--4 { grid-template-columns:1fr; }
  .by-hero__card { min-height:260px; }
  .by-hero__title { font-size:1.2rem; }
  .by-section { padding:2rem 0; }
  .by-archive-toolbar { flex-direction:column; align-items:flex-start; }

  /* Article small mobile */
  .by-article__title { font-size:1.15rem; }
  .by-article__body { font-size:.9rem; line-height:1.75; }
  .by-article__body h2 { font-size:1.1rem; }
  .by-article__body h3 { font-size:1rem; }
  .by-article__body table { font-size:.78rem; }
  .by-article__body table th,
  .by-article__body table td { padding:.35rem .5rem; }
  .by-font-btn { padding:.28rem .55rem; font-size:.78rem; }
}

/* ══════════════════════════════════════════════════════════════
   COMMENTS
   ══════════════════════════════════════════════════════════════ */
.by-comments { margin-top:2.5rem; }
.comment-list { list-style:none; }
.comment { padding:1.25rem 0; border-bottom:1px solid var(--by-border); }
.comment-author img { border-radius:50%; }
.comment-meta { font-size:.8rem; color:var(--by-text-muted); }
.comment-body p { margin:.5rem 0; font-size:.93rem; }
.comment-reply-link { font-size:.8rem; color:var(--by-primary); font-weight:600; }
#respond { margin-top:2rem; }
#respond h3 { font-family:var(--by-heading-font); font-size:1.25rem; margin-bottom:1rem; }
.comment-form-comment textarea,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
  width:100%; padding:.6rem 1rem;
  border:1.5px solid var(--by-border);
  border-radius:var(--by-radius);
  font:inherit; margin-bottom:.75rem;
  background:var(--by-surface);
}
.comment-form input:focus,
.comment-form textarea:focus { border-color:var(--by-primary); outline:none; }
#submit { background:var(--by-primary); color:#fff; padding:.6rem 1.5rem; border-radius:var(--by-radius-full); font-weight:700; cursor:pointer; border:none; transition:background var(--by-transition); }
#submit:hover { background:var(--by-accent); }

/* Blog Main */
.by-blog-main { padding:3rem 0; }

/* ── Parent Category Page ── */
.by-parent-cat-desc {
  padding:1rem 0 .5rem;
  color:var(--by-text-muted); font-size:.95rem;
}
.by-subcat-pills {
  display:flex; flex-wrap:wrap; gap:.6rem;
  padding:1rem 0 1.25rem;
}
.by-subcat-pill {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.45rem 1rem; border-radius:var(--by-radius-full);
  background:var(--by-surface); border:1.5px solid var(--by-border);
  font-size:.83rem; font-weight:600; color:var(--by-text);
  transition:all var(--by-transition);
}
.by-subcat-pill:hover {
  background:var(--by-primary); color:#fff;
  border-color:var(--by-primary);
}
.by-subcat-pill__count {
  background:var(--by-surface2); color:var(--by-text-muted);
  border-radius:var(--by-radius-full); font-size:.72rem;
  padding:.1rem .45rem; font-weight:700;
  transition:all var(--by-transition);
}
.by-subcat-pill:hover .by-subcat-pill__count {
  background:rgba(255,255,255,.25); color:#fff;
}
.by-archive-toolbar--full { margin-bottom:1.25rem; }
.by-grid--4 {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
}
@media(max-width:1024px){ .by-grid--4{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:768px) {
  /* Homepage — 1 post per section, then ad */
  .by-homepage .by-section .by-grid--4 {
    grid-template-columns:1fr !important;
  }
  .by-homepage .by-section .by-grid--4 .by-card:nth-child(n+2) {
    display:none !important;
  }
  /* Homepage ad — full width between sections */
  .by-home-ad { margin:0; padding:.35rem 0; }

  /* Archive/category pages — keep 2 columns */
  .by-archive-grid .by-grid--4,
  .by-cat-main .by-grid--4 { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:480px) {
  .by-grid--4 { grid-template-columns:1fr; }
  .by-homepage .by-section .by-grid--4 .by-card:nth-child(n+2) { display:none !important; }
}

/* Hide category badges on homepage */
.by-homepage .by-cat-badge { display:none !important; }

/* ── Simplified article meta (views + font controls only) ── */
.by-article__meta-simple {
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; margin:.5rem 0 1rem; flex-wrap:wrap;
}
.by-article__views {
  display:flex; align-items:center; gap:.35rem;
  font-size:.85rem; color:var(--by-text-muted);
}
.by-article__views i { color:var(--by-primary); }

/* ── Article toolbar: share icons + views + font controls ── */
.by-article__toolbar {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.75rem;
  padding:.65rem 0; margin-bottom:.75rem;
  border-bottom:1px solid var(--by-border);
}
.by-article__share-icons {
  display:flex; align-items:center; gap:.4rem; flex-wrap:wrap;
}
.by-share-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:50%;
  font-size:.85rem; color:#fff; border:none; cursor:pointer;
  transition:opacity var(--by-transition);
}
.by-share-icon:hover { opacity:.85; }
.by-share-icon--fb  { background:#1877f2; }
.by-share-icon--tw  { background:#000; }
.by-share-icon--wa  { background:#25d366; }
.by-share-icon--copy{ background:#6b7280; }
.by-article__toolbar-right {
  display:flex; align-items:center; gap:.75rem;
}
.by-article__views {
  display:flex; align-items:center; gap:.3rem;
  font-size:.83rem; color:var(--by-text-muted);
}
.by-article__views i { color:var(--by-primary); }
@media(max-width:480px){
  .by-article__toolbar { gap:.5rem; }
  .by-share-icon { width:28px; height:28px; font-size:.78rem; }
}

/* ── Homepage section empty state ── */
.by-section-empty {
  text-align:center; padding:1.5rem 1rem;
  color:var(--by-text-muted); border:2px dashed var(--by-border);
  border-radius:var(--by-radius-lg); margin:.5rem 0;
}
.by-section-empty i { font-size:2rem; margin-bottom:.75rem; display:block; color:var(--by-border); }
.by-section-empty p { font-size:.9rem; margin:0; }
.by-section-empty a { color:var(--by-primary); text-decoration:underline; }


/* Homepage grid — tablet: 2 cols, show 2 posts; mobile: 1 col, show 1 post */
@media(max-width:1024px) and (min-width:769px) {
  .by-homepage .by-section .by-grid--4 { grid-template-columns:repeat(2,1fr) !important; }
  .by-homepage .by-section .by-grid--4 .by-card:nth-child(n+3) { display:none !important; }
}
@media(max-width:768px) {
  .by-homepage .by-section .by-grid--4 { grid-template-columns:1fr !important; }
  .by-homepage .by-section .by-grid--4 .by-card:nth-child(n+2) { display:none !important; }
  .by-home-ad { margin:0; padding:.35rem 0; }
  .by-archive-grid .by-grid--4,
  .by-cat-main .by-grid--4 { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:480px) {
  .by-grid--4 { grid-template-columns:1fr; }
  .by-homepage .by-section .by-grid--4 .by-card:nth-child(n+2) { display:none !important; }
}
/* ── Sticky footer — no gap below footer on any device ── */
html { height:100%; }
body { min-height:100%; display:flex; flex-direction:column; }
#main-content { flex:1 0 auto; }
.by-footer { flex-shrink:0; }

/* ── Header social icons ── */
.by-header__social {
  display:flex; align-items:center; gap:.35rem;
  margin-left:auto; padding-right:.5rem;
}
.by-header-social__icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%;
  background:transparent; color:var(--by-text-muted);
  font-size:.85rem; border:1.5px solid var(--by-border);
  transition:all var(--by-transition);
  text-decoration:none;
}
.by-header-social__icon:hover { background:var(--by-primary); color:#fff; border-color:var(--by-primary); }
@media(max-width:768px) { .by-header__social { display:none; } }

/* ── Article bottom share bar ── */
.by-article__share-bottom {
  display:flex; align-items:center; gap:.5rem;
  flex-wrap:wrap; margin:1.5rem 0 1rem;
  padding:1rem 0; border-top:1px solid var(--by-border);
}
.by-share-bottom__label {
  font-size:.85rem; font-weight:700; color:var(--by-text-muted);
  margin-right:.25rem;
}
/* Share icon — already defined as by-share-icon above */
.by-share-icon--li { background:#0077b5; }