/* =========================================================
   Backdrova — GLOBAL Panel + Spacing System
   Use .bd-panel on every major “box” sitewide
   ========================================================= */

:root{
  /* container */
  --bd-wrap-max: 1160px;
  --bd-wrap-pad: clamp(14px, 3.5vw, 18px);

  /* vertical rhythm */
  --bd-section-gap: clamp(16px, 2.6vw, 26px);

  /* panels */
  --bd-panel-radius: 14px;
  --bd-panel-pad: clamp(16px, 2.2vw, 22px);
  --bd-panel-bg: rgba(255,255,255,.02);
  --bd-panel-border: rgba(255,255,255,.08);

  /* inner cards (when you need a nested box) */
  --bd-inner-radius: 12px;
  --bd-inner-pad: clamp(14px, 2vw, 20px);
  --bd-inner-bg: rgba(255,255,255,.01);
  --bd-inner-border: rgba(255,255,255,.06);
}

/* Ensure iOS “overscroll” never shows the old blue */
html, body{
  background:#0b0f19;
}

/* If a template forgets bd-wrap, this keeps edges consistent */
.bd-wrap{
  max-width: var(--bd-wrap-max);
  margin: 0 auto;
  padding: 28px var(--bd-wrap-pad);
}

/* Standard spacing between big sections */
.bd-section,
.bd-panel{
  margin: 0 0 var(--bd-section-gap);
}

/* ONE panel style everywhere */
.bd-panel{
  background: var(--bd-panel-bg);
  border: 1px solid var(--bd-panel-border);
  border-radius: var(--bd-panel-radius);
  padding: var(--bd-panel-pad);
}

/* Optional inner box (use sparingly) */
.bd-inner{
  background: var(--bd-inner-bg);
  border: 1px solid var(--bd-inner-border);
  border-radius: var(--bd-inner-radius);
  padding: var(--bd-inner-pad);
}

/* Tight version for small blocks (FAQ rows etc.) */
.bd-panel.bd-panel-tight{
  padding: clamp(14px, 2vw, 18px);
}

/* Mobile: keep panels off the edge evenly */
@media (max-width:640px){
  .bd-wrap{ padding: 22px var(--bd-wrap-pad); }
}

/* GRID CARD: consistent title rhythm */
.bd-card-grid .bd-card-title{
  line-height: 1.08;
  margin: 0;
}

/* GRID CARD: row layout */
.bd-card-grid .bd-card-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

/* Keep the button from shrinking weirdly */
.bd-card-grid .bd-card-actions{
  flex:0 0 auto;
  display:flex;
  align-items:flex-start;
}

/* MOBILE: stack title/meta, then full-width button */
@media (max-width:640px){
  .bd-card-grid .bd-card-row{
    flex-direction:column;
    gap:12px;
  }

  .bd-card-grid .bd-card-actions{
    width:100%;
  }

  .bd-card-grid .bd-card-actions .bd-btn{
    width:100%;
    justify-content:center;
  }

  .bd-card-grid .bd-card-title{
    line-height:1.04; /* matches your premium mobile headings */
  }
}

/* === HOME: Featured overlay spacing + typography polish === */
.bd-featured-overlay{
  display:flex;
  flex-direction:column;
  gap:14px;                 /* space between title and actions */
}

.bd-featured-title{
  margin:0;
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.2px;
	margin-top: 10px;
}

/* More space between the buttons */
.bd-featured-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;                 /* space between buttons */
}

/* Desktop-only: a little more separation */
@media (min-width:900px){
  .bd-featured-overlay{ gap:18px; }
  .bd-featured-actions{ gap:14px; }
}

/* Remove the collapse footer background */
.collapse-footer{
  background-color: transparent !important;
}

/* If it’s coming from a CSS var and you want to nuke it everywhere: */
:root{
  --subnav-color-10: transparent;
}

/* Collections page layout helpers (uses your global panels/sections) */
.bd-collections-page{
  display:block;
}

.bd-collections-page .bd-section{
  margin-top:22px;
}

/* Make bd-tint work on a panel (not only on the template wrapper) */
.bd-panel.bd-tint{
  background:
    linear-gradient(180deg, rgba(185,255,59,.06) 0%, rgba(255,255,255,.03) 40%, rgba(255,255,255,.03) 100%);
}

/* 2-column grid for the info panels */
.bd-collections-grid{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}
@media (min-width: 940px){
  .bd-collections-grid{
    grid-template-columns:1fr 1fr;
    align-items:start;
  }
}

/* Chips wrap nicely */
.bd-collections-page .bd-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.bd-btn.ghost{
  background: transparent;
  border: 1px solid rgba(255,255,255,.14);
  color: #e5e7eb;
}
.bd-btn.ghost:hover{
  border-color: rgba(185,255,0,.45);
}


/* =========================================
   BACKDROVA — Collections page polish
   Scoped: only affects /collections/ content
   ========================================= */

.bd-collections-page{
  display:block;
}

/* Match your global “panel” padding + feel */
.bd-collections-page .bd-collections-hero,
.bd-collections-page .bd-collections-card{
  padding:22px 20px 18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  box-shadow:0 18px 55px rgba(0,0,0,.35);
}

/* spacing rhythm between blocks */
.bd-collections-page .bd-collections-hero{ margin:0 0 18px; }
.bd-collections-page .bd-collections-card{ margin:0 0 18px; }

/* Eyebrow */
.bd-collections-page .bd-eyebrow{
  margin:0 0 10px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#9aa5b1;
}

/* Hero headline (make it feel like your standard big title) */
.bd-collections-page .bd-collections-hero h2{
  margin:0 0 12px;
  color:#fff;
  font-weight:800;
  font-size:clamp(1.55rem,2.15vw,2.15rem);
  line-height:1.12;
  letter-spacing:.2px;
}

/* Paragraph rhythm + readable width */
.bd-collections-page p{
  margin:0 0 14px;
  max-width:78ch;
}

/* “Popular Collections” heading */
.bd-collections-page .bd-collections-card h3{
  margin:0 0 8px;
  color:#fff;
  font-size:1.25rem;
  letter-spacing:.2px;
}
.bd-collections-page .bd-collections-card .lead{
  margin:0;
  color:#cbd5e1;
  opacity:.92;
}

/* The 2-column info grid */
.bd-collections-page .bd-collections-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin:0 0 18px;
}
@media (max-width: 900px){
  .bd-collections-page .bd-collections-grid{
    grid-template-columns:1fr;
  }
}

/* Chips */
.bd-collections-page .bd-collections-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}

/* Section dividers inside the page panel */
.bd-collections-page hr{
  border:0;
  height:1px;
  background:rgba(255,255,255,.10);
  margin:18px 0;
}

/* === FIX GRID CARD ALIGNMENT (CSS ONLY, no markup changes) === */

/* 1) Make the card body a flex column */
.bd-card.bd-card-grid .bd-card-body{
  display:flex;
  flex-direction:column;
  min-height: 220px; /* adjust if you want taller/shorter bodies */
}

/* 2) Let the title/date area take full width */
.bd-card.bd-card-grid .bd-card-row{
  display:flex;
  flex-direction:column; /* stack title/date and button */
  gap:10px;
}

/* 3) Ensure title can use full width */
.bd-card.bd-card-grid .bd-card-left{
  width:100%;
}

/* 4) Push formats + button to the bottom */
.bd-card.bd-card-grid .bd-formats{
  margin-top:auto;       /* this pins the formats block to bottom */
  padding-top:10px;
}

/* 5) Put the download button bottom-right (below formats) */
.bd-card.bd-card-grid .bd-card-actions{
  margin-top:10px;
  display:flex;
  justify-content:flex-end;
}

/* 6) Optional: keep button from looking “floaty” */
.bd-card.bd-card-grid .bd-btn.primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}



/* ================================
   GRID CARD ACTION BUTTONS (View + Download)
   Matches homepage/featured "ghost" vibe but scoped to grid cards only
================================ */

/* Make actions row look intentional */
.bd-card.bd-card-grid .bd-card-actions{
  margin-top: 10px;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start; /* keep like screenshot; change to flex-end if you want right */
  flex-wrap: wrap;
}

/* Base button style (same feel as featured) */
.bd-card.bd-card-grid .bd-card-actions .bd-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .58rem .95rem;
  border-radius: 12px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
  white-space: nowrap;
}

/* Ghost = EXACT featured vibe, but scoped */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.ghost{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.03);
  color: #e5e7eb;
}

/* Ghost hover */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.ghost:hover{
  transform: translateY(-1px);
  border-color: rgba(185,255,59,.35);
  background: rgba(255,255,255,.05);
  color: #fff;
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}

/* Primary (Download) – keep your neon look, but ensure it matches sizing */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.primary{
  border: 1px solid rgba(185,255,59,.45);
  background: #b9ff3b;
  color: #0b0f0a;
}

/* Primary hover */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}

/* If any global rules are adding weird shadows/filters, neutralize here */
.bd-card.bd-card-grid .bd-card-actions .bd-btn{
  box-shadow: none;
  filter: none;
}

/* === Make grid card CTAs match .bd-featured button sizing === */
.bd-card.bd-card-grid .bd-card-actions .bd-btn{
  padding: .6rem 1rem;     /* same as featured */
  border-radius: 12px;     /* same as featured */
  font-weight: 900;        /* same as featured */
  font-size: 14px;         /* slight bump to match visual weight */
  min-height: 47px;        /* consistent height across cards */
}

/* Primary matches featured "glow" feel */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.primary{
  border: 1px solid rgba(185, 255, 59, .55);
  background: var(--bd-accent);
  color: #0b0f19;
  box-shadow: 0 0 28px rgba(185, 255, 59, .18);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

/* Optional: make ghost feel closer too */
.bd-card.bd-card-grid .bd-card-actions .bd-btn.ghost{
  padding: .6rem 1rem; /* keep identical sizing */
}

.bd-card.bd-card-grid .bd-card-actions .bd-btn{ min-width: 120px; }

/* === FIX: keep action buttons aligned across cards (desktop grid) === */
.bd-card.bd-card-grid { height: 100%; }

.bd-card.bd-card-grid .bd-card-body{
  display: flex;
  flex-direction: column;
  min-height: 210px; /* tweak 200–240 to taste */
}

/* Make the title/date + actions row take up remaining space */
.bd-card.bd-card-grid .bd-card-row{
  display: flex;
  flex: 1 1 auto;
  align-items: flex-start;
  gap: 14px;
}

/* Left side should be a column so it doesn't fight the action area */
.bd-card.bd-card-grid .bd-card-left{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

/* Push actions to the bottom of the stretched row */
.bd-card.bd-card-grid .bd-card-actions{
  margin-top: auto;              /* key: bottom align within stretched row */
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;   /* keeps buttons on one line */
  flex: 0 0 auto;
}

/* Formats always sit below the row (footer area) */
.bd-card.bd-card-grid .bd-formats{
  margin-top: -3px;
}

/* === GRID CARD: lock title height so actions + formats align consistently === */

/* Ensure body stacks row + formats predictably */
.bd-card.bd-card-grid .bd-card-body{
  display:flex;
  flex-direction:column;
}

/* Keep the top row layout stable */
.bd-card.bd-card-grid .bd-card-row{
  display:flex;
  gap:14px;
  align-items:flex-start;
}

/* Let left side grow, actions stay fixed */
.bd-card.bd-card-grid .bd-card-left{
  flex:1 1 auto;
  min-width:0; /* allows clamp without overflow */
}

/* FORCE titles to behave like 2-line titles (even when 1-line) */
.bd-card.bd-card-grid .bd-card-title{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;

  line-height:1.15;
  min-height: calc(1.15em * 2); /* reserves 2 lines */
}

/* Keep the date from messing with spacing */
.bd-card.bd-card-grid .bd-card-meta{
  margin-top:6px;
}

/* Actions aligned and consistent */
.bd-card.bd-card-grid .bd-card-actions{
  flex:0 0 auto;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  white-space:nowrap;
}

/* Formats sit in a consistent spot */
.bd-card.bd-card-grid .bd-formats{
  margin-top:-3px; /* adjust 8–12px to taste */
}


/* =========================================
   Shortcode output: [bd_popular_collections]
   Make it lay out like a real grid
   ========================================= */

.bd-collections-page .bd-popular-collections,
.bd-collections-page .bd-collections{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
  gap:16px;
  margin-top:14px;
}

/* Covers common shortcode structures: links/cards */
.bd-collections-page .bd-popular-collections a,
.bd-collections-page .bd-collections a{
  display:block;
  text-decoration:none;
  color:#fff;
}

.bd-collections-page .bd-popular-collections img,
.bd-collections-page .bd-collections img{
  width:100%;
  height:auto;
  border-radius:14px;
  display:block;
}

/* If the shortcode prints a title + count under the image */
.bd-collections-page .bd-popular-collections .name,
.bd-collections-page .bd-collections .name{
  margin-top:10px;
  font-weight:800;
}
.bd-collections-page .bd-popular-collections .count,
.bd-collections-page .bd-collections .count{
  margin-top:4px;
  opacity:.75;
  font-size:.95rem;
}

.bd-wrap.bd-page .bd-page-panel .bd-collections-page .bd-panel,
.bd-wrap.bd-page .bd-page-panel .bd-collections-page .bd-collections-hero,
.bd-wrap.bd-page .bd-page-panel .bd-collections-page .bd-collections-card{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 0 18px !important;
}

.bd-wrap.bd-page .bd-page-panel .bd-collections-page .bd-collections-hero{
  padding-bottom:18px !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  margin-bottom:18px !important;
}

.bd-wrap.bd-page .bd-page-panel .bd-collections-page hr{
  display:none !important;
}

/* Backdrova: About/Collections hero full-width */
.bd-aboutpage .bd-about-hero{
  max-width: none !important;
}

/* ===== Latest Wallpapers grid: 3 columns desktop ===== */
.bd-latest-grid,
.bd-wall-grid,
.bd-grid,
.wallpaper-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1024px){
  .bd-latest-grid,
  .bd-wall-grid,
  .bd-grid,
  .wallpaper-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .bd-latest-grid,
  .bd-wall-grid,
  .bd-grid,
  .wallpaper-grid{
    grid-template-columns: 1fr;
  }
}

/* ===== Popular Collections: 3 columns desktop ===== */
.bd-collections{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Tablet */
@media (max-width: 1024px){
  .bd-collections{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 640px){
  .bd-collections{
    grid-template-columns: 1fr;
  }
}

/* Make sure cards behave inside grid */
.bd-col-card{ min-width: 0; width: 100%; }
.bd-col-left{ min-width: 0; }
.bd-col-name{ min-width: 0; }


/* ===============================
   POPULAR COLLECTIONS (shortcode)
   Fix layout + match homepage cards
================================= */

/* Grid wrapper */
.bd-collections{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-top:12px;
}

/* Card */
.bd-collections .bd-col-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;

  padding:14px 16px;
  border-radius:14px;

  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.18);

  text-decoration:none !important;   /* override your template’s underline links */
  color:#fff !important;
}

/* Left side: thumb + name */
.bd-collections .bd-col-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.bd-collections .bd-col-name{
  font-weight:800;
  letter-spacing:.1px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Count on the right */
.bd-collections .bd-col-count{
  color:#9aa5b1;
  font-weight:700;
  font-size:.95rem;
  white-space:nowrap;
  flex:0 0 auto;
}

/* Thumbnail */
.bd-collections .bd-col-thumb{
  width:44px;
  height:44px;
  border-radius:12px;
  overflow:hidden;
  flex:0 0 44px;

  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.10);
}

.bd-collections .bd-col-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Hover */
.bd-collections .bd-col-card:hover{
  border-color:rgba(185,255,59,.65);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 12px 34px rgba(0,0,0,.24),
    0 0 0 2px rgba(185,255,59,.15);
}

.bd-collections .bd-col-card:hover .bd-col-name{
  color:var(--bd-accent);
}

/* Responsive */
@media (max-width: 820px){
  .bd-collections{ grid-template-columns:1fr; }
}

/* Backdrova — Popular Collections: make cards fill the panel (desktop + mobile) */
.bd-page-panel .bd-collections{
  display:grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap:14px;
  align-items:stretch;
}

/* card should ALWAYS be allowed to stretch */
.bd-page-panel a.bd-col-card{
  width:100% !important;
  max-width:none !important;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.18);
  text-decoration:none;
}

/* left side should be able to shrink without breaking layout */
.bd-page-panel .bd-col-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0; /* IMPORTANT for truncation issues */
}

/* thumbnail */
.bd-page-panel .bd-col-thumb{
  width:44px;
  height:44px;
  border-radius:12px;
  overflow:hidden;
  flex:0 0 44px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
}
.bd-page-panel .bd-col-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* name + count */
.bd-page-panel .bd-col-name{
  color:#fff;
  font-weight:800;
  letter-spacing:.2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bd-page-panel .bd-col-count{
  color:#9aa5b1;
  font-weight:700;
  white-space:nowrap;
  flex:0 0 auto;
}

/* hover */
.bd-page-panel a.bd-col-card:hover{
  border-color: rgba(185,255,59,.45);
  box-shadow: 0 0 0 2px rgba(185,255,59z57,59,.08), 0 12px 34px rgba(0,0,0,.28);
}

/* tighten on small screens */
@media (max-width:680px){
  .bd-page-panel .bd-collections{
    grid-template-columns: 1fr;
  }
}

/* FORCE Popular Collections layout */
.bd-collections{
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

@media (max-width: 1024px){
  .bd-collections{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px){
  .bd-collections{
    grid-template-columns: 1fr !important;
  }
}

.bd-collections .bd-col-card{
  width: 100% !important;
  min-width: 0 !important;
}
.bd-collections .bd-col-left,
.bd-collections .bd-col-name{
  min-width: 0 !important;
}

/* ==========================
   LATEST WALLPAPERS GRID
   (section.bd-grid)
========================== */

/* Desktop: 3 per row */
section.bd-grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}

/* Tablet: 2 per row */
@media (max-width: 980px){
  section.bd-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: 1 per row */
@media (max-width: 640px){
  section.bd-grid{
    grid-template-columns: 1fr !important;
  }
}

/* Ensure cards don't have leftover width rules */
section.bd-grid > article.bd-card.bd-card-grid{
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  height: 100% !important;
}

/* Make thumbnails consistent (prevents odd crops from mixed image ratios) */
section.bd-grid .bd-card-media{
  display: block !important;
  overflow: hidden !important;
  border-radius: 18px !important;
}

section.bd-grid .bd-card-media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  aspect-ratio: 16 / 10 !important; /* tweak if you want taller/shorter */
}


/* === Backdrova palette === */
:root{
  --graphite:#0F172A;      /* page bg */
  --slate:#141A2B;         /* panels */
  --accent:#B9FF3B;        /* neon lime */
  --ink:#081020;           /* dark text on neon */
  --white:#FFFFFF;

  --chip-bg:#1C2436;
  --chip-border:#263147;
  --chip-text:#D3DAE7;
  --chip-text-dim:#9AA6BD;
  --chip-hover:#202B41;
  --chip-focus:#5B8CFF;
}

/* page shell tweaks (optional) */
body { background:#0B0F19; }

/* Chips */
.bd-meta-chips{display:grid;gap:.6rem;margin:1rem 0 1.4rem}
.bd-chipgroup{display:flex;flex-wrap:wrap;gap:.4rem .5rem;align-items:center}
.bd-chipgroup__label{
  color:var(--chip-text-dim);
  font-size:.9rem;
  letter-spacing:.02em;
  margin-right:.25rem;
}
.bd-chip{
  --ring:0 0 0 0 rgba(0,0,0,0);
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.45rem .6rem;
  background:var(--chip-bg);
  border:1px solid var(--chip-border);
  border-radius:999px;
  color:var(--chip-text);
  text-decoration:none;
  font-size:.92rem;
  line-height:1;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}
.bd-chip__dot{
  width:.55rem;height:.55rem;border-radius:999px;
  background:var(--chip-text-dim);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.bd-chip:hover{ background:var(--chip-hover); border-color:#32415C; color:#E7EEFA; }
.bd-chip:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(91,140,255,.45);
  border-color:var(--chip-focus);
}

/* Download Selected button */
.bd-btn.primary,
.button-download-selected,
a.button-download-selected{
  background:var(--accent);
  color:var(--ink);
  border:1px solid #89F12C;
  border-radius:14px;
  padding:.85rem 1.15rem;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 8px 22px rgba(185,255,59,.18), 0 2px 0 rgba(0,0,0,.18) inset;
  transition:transform .06s ease, box-shadow .15s ease, filter .15s ease;
}
.bd-btn.primary:hover,
.button-download-selected:hover{ filter:saturate(110%); box-shadow:0 10px 26px rgba(185,255,59,.24), 0 2px 0 rgba(0,0,0,.2) inset; }
.bd-btn.primary:active,
.button-download-selected:active{ transform:translateY(1px); }

/* About block */
.bd-about{
  margin:1.6rem 0 1rem; padding:1.1rem 1.1rem 1rem;
  background:var(--slate); border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
}
.bd-about h2{font-size:1.1rem;margin:0 0 .5rem;color:#E9EEF9}
.bd-about__content p{color:#C8D2E5; line-height:1.7}
.bd-about__content a{color:#9FDBFF;text-decoration:none;border-bottom:1px dotted rgba(159,219,255,.45)}
.bd-about__content a:hover{color:#C7EAFF;border-bottom-color:transparent}

.bd-card-grid{
  background:rgba(255,255,255,.02);
  border-radius:16px;
  border:1px solid rgba(255,255,255,.06);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

.bd-card-grid .bd-thumb{
  display:block;
  width:100%;
  height:220px;
  object-fit:cover;
  transition:transform .32s ease;
}

.bd-card-body{
  padding:10px 12px 12px;
}

.bd-card-title{
  margin:8px 0 3px;
  font-size:1.05rem;
  font-weight:600;
  color:#e5e7eb;
}

.bd-card-meta{
  margin:0 0 9px;
  font-size:.82rem;
  color:#9aa5b1;
}

.bd-card-grid .bd-actions{
  display:flex;
  align-items:center;
  gap:.5rem;
}

.bd-card-grid .bd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.4rem .75rem;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.6);
  font-size:.8rem;
  text-decoration:none;
  color:#e5e7eb;
}

.bd-card-grid .bd-btn.primary{
  background:#B9FF3B;
  border-color:#B9FF3B;
  color:#0b0f19;
}

.bd-formats{
  font-size:.78rem;
  color:#9aa5b1;
}

/* hover polish */
.bd-card-grid:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 35px rgba(0,0,0,.55);
  border-color:rgba(185,255,59,.65);
  background:rgba(255,255,255,.03);
}

.bd-card-grid:hover .bd-thumb{
  transform:scale(1.03);
}

/* About layout */
.bd-about-hero{max-width:920px}
.bd-about-eyebrow{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:rgba(203,213,225,.75);
  margin:0 0 8px;
}
.bd-about-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:18px;
  margin:18px 0 6px;
}
.bd-about-card{
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:18px 18px;
}
.bd-about-card h3{margin-top:0}
.bd-mission{
  margin-top:14px;
  padding:16px 16px;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
}
.bd-mission-title{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(203,213,225,.75);
  margin:0;
}

/* Comparison table */
.bd-compare{
  margin-top:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  overflow:hidden;
}
.bd-compare-row{
  display:grid;
  grid-template-columns: 1fr 120px 120px;
  gap:10px;
  padding:10px 12px;
  background:rgba(255,255,255,.015);
  border-top:1px solid rgba(255,255,255,.06);
}
.bd-compare-head{
  background:rgba(255,255,255,.03);
  border-top:0;
  font-weight:700;
  color:#e5e7eb;
}
.bd-ok{color:var(--bd-accent);font-weight:800}
.bd-no{color:rgba(255,255,255,.35);font-weight:800}

@media (max-width:900px){
  .bd-about-grid{grid-template-columns:1fr}
  .bd-compare-row{grid-template-columns:1fr 90px 90px}
}

/* =========================================================
   BACKDROVA ABOUT — premium polish (reduce nested boxes)
   Paste AFTER your existing page CSS
   ========================================================= */

/* 1) Soften the main panel a touch (more premium, less “outlined”) */
.bd-wrap.bd-page .bd-page-panel{
  background: rgba(255,255,255,.025);
  border-color: rgba(255,255,255,.06);
  box-shadow: 0 22px 80px rgba(0,0,0,.42);
}

/* 2) Remove the “card inside card” look */
.bd-about .bd-about-card{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

/* Add breathable spacing between sections instead */
.bd-about hr{
  margin: 22px 0;
  background: rgba(255,255,255,.08) !important;
}

/* 3) About hero: make it feel like a premium header block */
.bd-about .bd-about-hero{
  padding: 6px 0 10px;
}
.bd-about .bd-about-eyebrow{
  color: rgba(203,213,225,.65);
  letter-spacing: .18em;
}
.bd-about .bd-about-hero h2{
  margin: 6px 0 10px;
}

/* 4) Dropcap icon: remove the “double outline” and make it cleaner */
.bd-legal-dropcap{
  background: rgba(255,255,255,.015);
  border: 1px solid rgba(255,255,255,.07);
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
}
.bd-legal-dropcap img{
  border-radius: 12px;
}

/* 5) Two-column grid: keep it, but remove extra borders around each column */
.bd-about .bd-about-grid{
  gap: 22px;
}

/* 6) Tip bullets: keep the look, but reduce border intensity + remove “stacked” feel */
.bd-about ul{
  margin: 12px 0 14px;
}
.bd-about ul > li{
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.18) !important;
}

/* 7) Comparison table: THIS can remain a “card”, but make it single-surface */
.bd-about .bd-compare{
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  overflow: hidden;
}
.bd-about .bd-compare-row{
  border-top: 1px solid rgba(255,255,255,.06);
}
.bd-about .bd-compare-head{
  background: rgba(0,0,0,.18);
  border-top: 0;
}

/* 8) Mission block: let it be the second “card” */
.bd-about .bd-mission{
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 16px 16px;
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
}

/* 9) FAQ: remove boxy feel, make it read like premium text sections */
.bd-about h3{
  margin-top: 16px;
}
.bd-about .bd-about-card h3 + p{
  margin-top: 6px;
}

/* 10) Explore section: turn links into clean “rows” (less boxy than tip bullets) */
.bd-about .bd-about-card:last-of-type ul > li{
  padding: 10px 12px 10px 44px;
  border-radius: 12px;
  background: rgba(255,255,255,.015) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: none !important;
}

/* 11) Optional: reduce overall “outline noise” on small screens */
@media (max-width: 680px){
  .bd-about ul > li{
    border-color: rgba(255,255,255,.06) !important;
  }
}

/* BACKDROVA — About page premium polish (homepage feel) */

.bd-aboutpage{
  --ab-line: rgba(255,255,255,.08);
  --ab-bg-soft: rgba(255,255,255,.02);
  --ab-radius: 16px;
}

/* Soft dividers (not another “box”) */
.bd-aboutpage hr{
  border:0;
  height:1px;
  margin:22px 0;
  background:linear-gradient(90deg,
    rgba(255,255,255,0),
    rgba(255,255,255,.10),
    rgba(255,255,255,0)
  );
}

/* HERO: remove inner panel vibe */
.bd-aboutpage .bd-about-hero{
  background:transparent;
  border:0;
  padding:0;
  margin:0 0 6px;
}

/* Grid */
.bd-aboutpage .bd-about-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:18px;
}
@media (max-width:980px){
  .bd-aboutpage .bd-about-grid{grid-template-columns:1fr;}
}

/* Cards: flatten (less border, less backdrop) */
.bd-aboutpage .bd-about-card{
  background:transparent;
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--ab-radius);
  padding:16px 16px;
  box-shadow:none;
}
.bd-aboutpage .bd-about-card:hover{
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.02);
}

/* Spacing */
.bd-aboutpage .bd-about-card h3{margin:0 0 10px;}
.bd-aboutpage .bd-about-card p{margin:0 0 12px;}

/* Tip bullets: lighter + cleaner */
.bd-aboutpage .bd-about-card ul{
  list-style:none;
  padding-left:0;
  margin:12px 0 12px;
}
.bd-aboutpage .bd-about-card ul > li{
  position:relative;
  padding:12px 14px 12px 44px;
  margin:10px 0;
  border-radius:14px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.bd-aboutpage .bd-about-card ul > li:before{
  content:'';
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  width:12px;height:12px;
  border-radius:999px;
  background:var(--bd-accent);
  box-shadow:0 0 0 6px rgba(185,255,59,.10);
}

/* Compare table: remove “table inside a box inside a box” */
.bd-aboutpage .bd-compare{
  background:transparent;
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  overflow:hidden;
}
.bd-aboutpage .bd-compare-row{
  display:grid;
  grid-template-columns:1.2fr .7fr .7fr;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.bd-aboutpage .bd-compare-row:last-child{border-bottom:0;}
.bd-aboutpage .bd-compare-head{
  background:rgba(255,255,255,.03);
  font-weight:800;
  color:#e5e7eb;
}
.bd-aboutpage .bd-ok{color:var(--bd-accent); font-weight:900;}
.bd-aboutpage .bd-no{color:rgba(229,231,235,.55); font-weight:900;}

/* Mission block: featured, homepage-style */
.bd-aboutpage .bd-mission{
  margin-top:14px;
  padding:14px 16px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(185,255,59,.06), rgba(255,255,255,.02));
  border:1px solid rgba(185,255,59,.16);
}
.bd-aboutpage .bd-mission-title{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(203,213,225,.75);
  margin:0 0 6px;
}

/* === ABOUT PAGE FIXES: icon spacing + bullet alignment === */

/* 1) Icon: remove the “extra space” under it */
.bd-aboutpage .bd-legal-dropcap{
  padding:12px;                 /* slightly tighter */
  line-height:0;                /* kills baseline whitespace */
  display:inline-block;
}
.bd-aboutpage .bd-legal-dropcap img{
  display:block;                /* removes inline-image bottom gap */
  line-height:0;
}

/* If that icon block is inside a flex row anywhere, keep it snug */
.bd-aboutpage .bd-legal-dropcap{ align-self:flex-start; }

/* 2) Bullet cards: make them look premium + aligned */
.bd-aboutpage .bd-about-card ul > li{
  display:grid;
  grid-template-columns: 18px 1fr;   /* dot col + content col */
  column-gap:12px;
  align-items:center;               /* centers dot to text */
  padding:12px 14px;                /* remove left “fake padding” */
}

/* Remove the old absolute-position dot */
.bd-aboutpage .bd-about-card ul > li:before{
  position:static;
  transform:none;
  width:12px;height:12px;
  box-shadow:0 0 0 6px rgba(185,255,59,.10);
}

/* Keep label/value reading clean */
.bd-aboutpage .bd-about-card ul > li strong{
  display:inline;                    /* prevents weird blocky label wrap */
  margin-right:4px;
}

/* ========= BACKDROVA: COLLECTIONS PAGE (DROP-IN CSS) ========= */
/* Paste this whole block into your theme CSS. No markup/comments that trigger “markup not allowed”. */

.bd-collections-page{max-width:1160px;margin:0 auto;padding:0 16px}
.bd-collections-hero{margin-bottom:10px}

.bd-collections-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.bd-collections-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;box-shadow:0 14px 40px rgba(0,0,0,.22)}
.bd-collections-card h3{margin:0 0 10px;color:#fff;font-size:1.15rem}
.bd-collections-card p{margin:0 0 12px;color:#cbd5e1;line-height:1.6}
.bd-collections-card .lead{margin:-2px 0 12px;color:rgba(203,213,225,.85)}

.bd-collections-page .bd-plain-list{list-style:none;padding:0;margin:12px 0 0}
.bd-collections-page .bd-plain-list li{position:relative;margin:10px 0;padding:12px 14px 12px 56px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 30px rgba(0,0,0,.20);color:#cbd5e1;line-height:1.45}
.bd-collections-page .bd-plain-list li::before{content:"";position:absolute;left:22px;top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:999px;background:var(--accent,#B9FF3B);box-shadow:0 0 0 5px rgba(185,255,59,.12)}
.bd-collections-page .bd-plain-list li strong{color:#e5e7eb;display:inline-block;min-width:9.5rem;margin-right:6px}

.bd-collections-chips{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 4px}
.bd-chip-link{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);color:#e5e7eb;text-decoration:none;font-weight:800;font-size:.95rem;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.bd-chip-link::before{content:"";width:8px;height:8px;border-radius:999px;background:var(--accent,#B9FF3B);box-shadow:0 0 0 5px rgba(185,255,59,.10)}
.bd-chip-link:hover{background:rgba(255,255,255,.05);border-color:rgba(185,255,59,.35);transform:translateY(-1px)}

.bd-popular-collections .bd-collections{display:grid;gap:14px;margin-top:12px}
.bd-popular-collections .bd-col-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 40px rgba(0,0,0,.22);text-decoration:none;color:inherit;transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.bd-popular-collections .bd-col-card:hover{background:rgba(255,255,255,.05);border-color:rgba(185,255,59,.35);box-shadow:0 18px 55px rgba(0,0,0,.30);transform:translateY(-1px)}
.bd-popular-collections .bd-col-left{display:flex;align-items:center;gap:12px;min-width:0}
.bd-popular-collections .bd-col-thumb{width:44px;height:44px;border-radius:14px;overflow:hidden;flex:0 0 auto;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 26px rgba(0,0,0,.25)}
.bd-popular-collections .bd-col-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bd-popular-collections .bd-col-name{color:#fff;font-weight:900;font-size:1.02rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-popular-collections .bd-col-count{white-space:nowrap;color:rgba(203,213,225,.85);font-size:.95rem;font-weight:800;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08)}

.bd-collections-page .bd-nav-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch;margin-top:10px}
.bd-collections-page .bd-nav-card{position:relative;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:16px 18px;border-radius:14px;background:linear-gradient(180deg, rgba(185,255,59,.06), rgba(255,255,255,.02));border:1px solid rgba(185,255,59,.16);box-shadow:0 14px 40px rgba(0,0,0,.22);text-decoration:none;color:inherit;min-height:108px;transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.bd-collections-page .bd-nav-card:hover{background:linear-gradient(180deg, rgba(185,255,59,.08), rgba(255,255,255,.03));border-color:rgba(185,255,59,.28);box-shadow:0 18px 55px rgba(0,0,0,.30);transform:translateY(-1px)}
.bd-collections-page .bd-nav-title{margin:0;color:#fff;font-weight:900;font-size:1.02rem;line-height:1.15;text-decoration:none}
.bd-collections-page .bd-nav-sub{margin:0;color:rgba(203,213,225,.88);font-weight:650;font-size:.95rem;line-height:1.25;text-decoration:none}
.bd-collections-page .bd-nav-arrow{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:rgba(229,231,235,.85);font-weight:900}
.bd-collections-page .bd-nav-card br{display:none}

@media (max-width:900px){.bd-collections-grid{grid-template-columns:1fr}.bd-collections-page .bd-nav-cards{grid-template-columns:1fr}}
@media (max-width:640px){.bd-popular-collections .bd-col-card{padding:13px 14px}.bd-popular-collections .bd-col-thumb{width:40px;height:40px;border-radius:12px}.bd-popular-collections .bd-col-name{font-size:1rem}.bd-popular-collections .bd-col-count{font-size:.9rem;padding:6px 9px}}
@media (max-width:520px){.bd-collections-page .bd-plain-list li strong{min-width:0}}
@media (max-width:420px){.bd-popular-collections .bd-col-card{flex-wrap:wrap;align-items:flex-start}.bd-popular-collections .bd-col-count{margin-left:auto}}

/* COLLECTIONS — bullet pills: hard-fix dot overlap + perfect centering */
.bd-collections-page .bd-plain-list{list-style:none !important;padding:0 !important;margin:12px 0 0 !important;}

.bd-collections-page .bd-plain-list li{
  position:relative !important;
  padding:12px 14px 12px 68px !important; /* more left space so dot never touches text */
  line-height:1.45 !important;
}

.bd-collections-page .bd-plain-list li::before{
  content:"" !important;
  position:absolute !important;
  left:28px !important;                 /* pushes dot further left */
  top:50% !important;                   /* true vertical center */
  transform:translateY(-50%) !important;
  width:10px !important;
  height:10px !important;
  border-radius:999px !important;
  background:var(--accent,#B9FF3B) !important;
  box-shadow:0 0 0 5px rgba(185,255,59,.12) !important;
}

.bd-collections-page .bd-plain-list li strong{
  color:#e5e7eb !important;
  margin-right:10px !important;
  display:inline !important;            /* prevents weird alignment shifts */
  min-width:0 !important;               /* cancels any older “label column” attempts */
}

/* COLLECTIONS — only the pill list */
.bd-wrap.bd-page .bd-page-panel .bd-collections-page .bd-plain-list > li::before{
  margin-top: 0 !important;
}

/* Footer only */
#footer .block-h .heading-title,
.site-footer .block-h .heading-title,
.footer-wrap .block-h .heading-title{
  font-size:22px !important;
}

/* Footer menu link sizing */
.footer-col .widget_nav_menu a > span{
  font-size:20px;
  line-height:26px;
}

/* Middle column (“Backdrova”) text block: tighten + match density */
.footer-col .widget_custom_html p{
  font-size:18px;
  line-height:26px;
  margin:0 0 10px;
}

/* Optional: tighten the last tagline line a touch */
.footer-col .widget_custom_html p:last-child{
  margin-top:10px;
  line-height:24px;
}

/* Optional: if the middle column links feel too tall */
.footer-col .widget_custom_html a{
  line-height:26px;
}

.footer-col .widget_custom_html p{ font-size:19px; line-height:26px; }

/* ===== BACKDROVA FOOTER: consistent column rhythm ===== */

/* Column headings */
.block-h .heading-title{
  font-size:22px;
  line-height:1.2;
}

/* Menu links (Explore / Policies) */
.footer-col .widget_nav_menu .menu a > span{
  font-size:20px;
  line-height:26px;
  display:inline-block;
}

/* Tighten menu item spacing a bit */
.footer-col .widget_nav_menu .menu li{
  margin:0 0 8px;
}
.footer-col .widget_nav_menu .menu li:last-child{
  margin-bottom:0;
}

/* Middle custom HTML (“Backdrova” column) */
.footer-col .widget_custom_html p{
  font-size:18px;
  line-height:26px;
  margin:0 0 10px;
}
.footer-col .widget_custom_html p:last-child{
  margin-top:10px;
  margin-bottom:0;
  opacity:.85; /* keeps the slogan softer */
}

/* Middle column link line spacing */
.footer-col .widget_custom_html a{
  line-height:26px;
}

/* Bottom copyright row */
.bottom-footer-section{
  padding-top:12px;
  padding-bottom:12px;
}
.bottom-footer-section .copyright-text,
.bottom-footer-section .footer-copyright,
.bottom-footer-section p{
  line-height:22px;
}

/* BACKDROVA — Darker site base */
:root{
  --bd-bg: #060708;
}

/* Main wrapper + content area */
.site-wrap,
.site-content{
  background-color: var(--bd-bg) !important;
}

/* Ensure common theme containers don’t re-introduce lighter backgrounds */
#page,
#content,
.rb-site,
.rb-container,
.content-wrap,
.main-wrap,
.main-content{
  background-color: transparent !important;
}

/* Optional: if any inner panels show a lighter strip, keep them dark too */
.rb-content,
.site-main{
  background-color: transparent !important;
}

/* Optional polish for the darker base */
:root{
  --bd-bg:#060708;
}

/* Slightly deepen page separators so they don’t look washed */
hr,
.rb-separator,
.divider,
.footer-divider{
  border-color: rgba(255,255,255,.08) !important;
}

/* Keep footer sitting on the same deep base */
.footer-wrap,
.site-footer,
.bottom-footer-section{
  background: var(--bd-bg) !important;
}

/* Tiny readability bump for long body text blocks */
.site-content p,
.site-content li{
  color: rgba(203,213,225,.92);
}

/* Optional polish: slightly softer footer + cleaner separation */
.footer-wrap{
  border-top: 1px solid rgba(255,255,255,.06);
}

/* Optional polish: reduce footer link neon intensity just a touch */
.site-footer a{
  color: rgba(185,255,59,.9);
}
.site-footer a:hover{
  color: #B9FF3B;
  text-decoration: underline;
}

.bd-about{
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.08);
}

// Contact Page //

/* =========================
   Backdrova Contact Page
   ========================= */

.bd-contact-page{max-width:1160px;margin:0 auto}
.bd-contact-hero{margin:6px 0 14px;text-align:left}
.bd-contact-hero h2{margin:0 0 10px;color:#fff;font-size:clamp(1.7rem,2.2vw,2.2rem)}
.bd-contact-hero p{margin:0 0 12px;color:#cbd5e1;line-height:1.65}
.bd-contact-hero .bd-contact-sub{margin-top:-2px;color:rgba(203,213,225,.86)}
.bd-contact-hero a{color:#fff;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.35)}
.bd-contact-hero a:hover{color:var(--bd-accent,#B9FF3B);text-decoration-color:rgba(185,255,59,.9)}

.bd-contact-mark{margin:10px 0 12px}
.bd-contact-mark img{
  display:block;
  width:64px;height:auto;
  border-radius:14px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 12px 40px rgba(0,0,0,.26);
}

/* quick chips */
.bd-contact-quick{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.bd-contact-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 12px;border-radius:999px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  color:#e5e7eb;text-decoration:none;font-weight:800;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.bd-contact-chip:hover{background:rgba(255,255,255,.05);border-color:rgba(185,255,59,.35);transform:translateY(-1px)}

/* layout */
.bd-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:16px 0 18px}
@media (max-width:900px){.bd-contact-grid{grid-template-columns:1fr}}

/* cards */
.bd-contact-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:18px 18px;
  box-shadow:0 14px 40px rgba(0,0,0,.22);
}
.bd-contact-card h3{margin:0 0 10px;color:#fff;font-size:1.15rem}
.bd-contact-card p{margin:0 0 12px;color:#cbd5e1;line-height:1.65}
.bd-contact-card .lead{margin:-2px 0 12px;color:rgba(203,213,225,.88)}
.bd-contact-card a{color:#fff;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.35)}
.bd-contact-card a:hover{color:var(--bd-accent,#B9FF3B);text-decoration-color:rgba(185,255,59,.9)}

/* list: homepage-style bullets (clean + aligned) */
.bd-contact-list{list-style:none;padding:0;margin:10px 0 14px}
.bd-contact-list li{
  position:relative;
  padding:12px 14px 12px 52px;
  margin:10px 0;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  color:#cbd5e1;
  line-height:1.5;
}
.bd-contact-list li::before{
  content:"";
  position:absolute;
  left:18px;
  top:50%;
  transform:translateY(-50%);
  width:10px;height:10px;
  border-radius:999px;
  background:var(--bd-accent,#B9FF3B);
  box-shadow:0 0 0 5px rgba(185,255,59,.12);
}
.bd-contact-list strong{color:#e5e7eb}

/* mini blocks */
.bd-contact-mini p{
  margin:0 0 12px;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
}
.bd-contact-note{margin-top:10px;color:rgba(203,213,225,.86)}

/* form wrap */
.bd-form-wrap{
  margin-top:10px;
  padding:14px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
}
.bd-form-foot{margin-top:10px;color:rgba(203,213,225,.85)}

/* FAQ */
.bd-faq details{
  border-radius:14px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
  padding:12px 14px;
  margin:10px 0;
}
.bd-faq summary{
  cursor:pointer;
  color:#fff;
  font-weight:900;
  list-style:none;
}
.bd-faq summary::-webkit-details-marker{display:none}
.bd-faq details p{margin:10px 0 0}

/* Helpful links: use your existing nav cards, just ensure 2-column */
.bd-contact-links .bd-nav-cards--two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:10px;
}
@media (max-width:900px){.bd-contact-links .bd-nav-cards--two{grid-template-columns:1fr}}

/* =========================================
   CONTACT PAGE — FIX GRID HEIGHT + BULLETS
   ========================================= */

/* 1) DO NOT margin all cards (breaks the 2-col grid height)
   Instead: rely on gaps */
.bd-contact-page .bd-contact-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;              /* spacing between the two top cards */
  align-items: stretch;
}

@media (max-width: 900px){
  .bd-contact-page .bd-contact-grid{
    grid-template-columns: 1fr;
  }
}

/* 2) Add spacing ONLY for the stacked cards under the grid */
.bd-contact-page > .bd-contact-card{
  margin-top: 18px;
}

/* If your HTML is section.bd-contact-page (most likely), this targets
   only the “lower” cards, not the ones inside .bd-contact-grid */
.bd-contact-page .bd-contact-grid .bd-contact-card{
  margin: 0 !important;   /* just to be safe */
}

/* 3) “What can we help with?” list — true alignment fix */
.bd-contact-page .bd-contact-list{
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
}

.bd-contact-page .bd-contact-list li{
  position: relative;
  margin: 10px 0;
  padding: 14px 16px 14px 56px; /* room for dot */
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 30px rgba(0,0,0,.20);
  color: #cbd5e1;
  line-height: 1.45;

  /* THIS is the key: make the content a 2-col grid */
  display: grid;
  grid-template-columns: 165px 1fr;  /* label col / text col */
  column-gap: 14px;
  align-items: center;
}

/* Dot centered perfectly */
.bd-contact-page .bd-contact-list li::before{
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #B9FF3B;
  box-shadow: 0 0 0 5px rgba(185,255,59,.12);
}

/* Label styling */
.bd-contact-page .bd-contact-list li strong{
  color: #e5e7eb;
  font-weight: 800;
  margin: 0;
  display: block;
}

/* Mobile: stack label above text inside the pill */
@media (max-width: 640px){
  .bd-contact-page .bd-contact-list li{
    grid-template-columns: 1fr;
    row-gap: 6px;
    align-items: start;
  }
}

/* 4) Chips hover = neon lime (kills theme blue hover) */
.bd-contact-page .bd-contact-chip:hover,
.bd-contact-page .bd-contact-chip:focus,
.bd-contact-page .bd-contact-chip:focus-visible{
  background: rgba(185,255,59,.12) !important;
  border-color: rgba(185,255,59,.55) !important;
  color: #ffffff !important;
  transform: translateY(-1px);
  outline: none;
}


.bd-contact-page .bd-contact-list{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.bd-contact-page .bd-contact-list > li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
}

.bd-contact-page .bd-contact-list > li::before{
  content:"";
  width:12px;
  height:12px;
  border-radius:999px;
  margin-top:6px;
  background:#B9FF3B;
  box-shadow:0 0 0 6px rgba(185,255,59,0.12);
  flex:0 0 12px;
}

.bd-contact-page .bd-contact-list > li strong{
  display:inline-block;
  min-width:160px;
  max-width:160px;
  line-height:1.2;
}

.bd-contact-page .bd-contact-list > li br{
  display:none !important;
}

@media (max-width:600px){
  .bd-contact-page .bd-contact-list > li strong{
    min-width:132px;
    max-width:132px;
  }
}

.bd-contact-page .bd-contact-card.bd-contact-form{
  margin-top:18px;
}

.bd-contact-page .bd-contact-card.bd-contact-form + .bd-contact-card{
  margin-top:18px;
}

.bd-contact-page .bd-contact-links{
  margin-top:18px;
}

.bd-contact-page .bd-form-wrap{
  margin-top:12px;
  padding:16px;
  border-radius:14px;
  background:rgba(0,0,0,0.28);
  border:1px solid rgba(255,255,255,0.08);
}

.bd-contact-page .fluentform input[type="text"],
.bd-contact-page .fluentform input[type="email"],
.bd-contact-page .fluentform input[type="url"],
.bd-contact-page .fluentform input[type="tel"],
.bd-contact-page .fluentform input[type="number"],
.bd-contact-page .fluentform select,
.bd-contact-page .fluentform textarea,
.bd-contact-page .fluentform .ff-el-form-control{
  background:rgba(255,255,255,0.04) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  color:rgba(255,255,255,0.92) !important;
  border-radius:10px !important;
  box-shadow:none !important;
}

.bd-contact-page .fluentform *::placeholder{
  color:rgba(255,255,255,0.45) !important;
}

.bd-contact-page .fluentform input:focus,
.bd-contact-page .fluentform select:focus,
.bd-contact-page .fluentform textarea:focus,
.bd-contact-page .fluentform .ff-el-form-control:focus{
  outline:none !important;
  border-color:rgba(185,255,59,0.65) !important;
  box-shadow:0 0 0 6px rgba(185,255,59,0.10) !important;
}

.bd-contact-page .fluentform label{
  color:rgba(255,255,255,0.86) !important;
}

.bd-contact-page .fluentform button,
.bd-contact-page .fluentform input[type="submit"],
.bd-contact-page .fluentform .ff-btn{
  background:#B9FF3B !important;
  color:#060708 !important;
  border:0 !important;
  border-radius:10px !important;
  font-weight:800 !important;
  letter-spacing:0.02em;
  padding:10px 16px !important;
  box-shadow:0 10px 28px rgba(185,255,59,0.14);
  transition:transform 0.18s ease, filter 0.18s ease;
}

.bd-contact-page .fluentform button:hover,
.bd-contact-page .fluentform input[type="submit"]:hover,
.bd-contact-page .fluentform .ff-btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.02);
}

.bd-contact-page .bd-contact-chip:hover{
border-color:#B9FF3B !important;
color:#B9FF3B !important;
background: rgba(185,255,59,.10) !important;
box-shadow: 0 0 0 6px rgba(185,255,59,.10) !important;
}

.bd-contact-page .bd-contact-grid{
margin-bottom: 18px;
}

.bd-contact-page .bd-contact-form{ margin-top: 18px; }
.bd-contact-page .bd-contact-form + .bd-contact-card{ margin-top: 18px; }
.bd-contact-page .bd-contact-card + .bd-contact-links{ margin-top: 18px; }

.bd-contact-page .bd-contact-form .bd-form-wrap{
margin: 12px 0 14px;
}

.bd-contact-page .bd-contact-form .bd-form-wrap + p{
margin-top: 14px !important;
}

.bd-contact-page .bd-contact-note{
margin-top: 14px !important;
padding-top: 12px;
border-top: 1px solid rgba(255,255,255,.08);
opacity: .92;
}

.bd-contact-page .bd-contact-list{
list-style: none;
padding: 0;
margin: 0;
}

.bd-contact-page .bd-contact-list li{
display: flex;
align-items: flex-start;
gap: 14px;
}

.bd-contact-page .bd-contact-list li::before{
content: "";
width: 12px;
height: 12px;
border-radius: 999px;
background: #B9FF3B;
box-shadow: 0 0 0 6px rgba(185,255,59,.12);
flex: 0 0 12px;
margin-top: .35em !important;
}

.bd-contact-page .bd-contact-list strong{
display: inline-block;
min-width: 150px;
line-height: 1.15;
}

.bd-contact-page .bd-contact-list br{
display: none !important;
}

.bd-contact-page .bd-contact-list{
list-style:none;
margin:0;
padding:0;
display:grid;
gap:12px;
}

.bd-contact-page .bd-contact-list li{
position:relative;
margin:0;
padding:14px 16px 14px 54px;
border-radius:14px;
background: rgba(255,255,255,.03);
border: 1px solid rgba(255,255,255,.08);
}

.bd-contact-page .bd-contact-list li::before{
content:"";
position:absolute;
left:20px;
top:22px;
width:12px;
height:12px;
border-radius:999px;
background:#B9FF3B;
box-shadow:0 0 0 6px rgba(185,255,59,.12);
}

.bd-contact-page .bd-contact-list li strong{
display:inline;
margin-right:10px;
}

.bd-contact-page .bd-contact-list li br{
display:none !important;
}

And since you also needed the “sections touching” spacing + the text under the form sitting too close, paste these right under it:

.bd-contact-page .bd-contact-form .bd-form-wrap + p{
margin-top:14px !important;
}

.bd-contact-page .bd-contact-note{
margin-top:14px !important;
padding-top:12px;
border-top:1px solid rgba(255,255,255,.08);
}

.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-list{list-style:none!important;margin:0!important;padding:0!important}
.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-list>li{display:block!important;align-items:unset!important;gap:0!important;position:relative!important;margin:0 0 12px!important;padding:16px 16px 16px 64px!important;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-list>li:before{content:""!important;position:absolute!important;left:26px!important;top:22px!important;width:10px!important;height:10px!important;border-radius:999px!important;background:#B9FF3B!important;box-shadow:0 0 0 6px rgba(185,255,59,.12)!important}
.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-list>li strong{display:inline-block!important;margin-right:10px!important;line-height:1.2!important}
.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-list>li br{display:none!important}

PADDING FIXES (also raw CSS):

.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-note{margin-top:14px!important;padding-top:14px!important;border-top:1px solid rgba(255,255,255,.08)!important}
.bd-wrap.bd-page .bd-page-panel .bd-contact-page .bd-contact-form .bd-form-wrap + p{margin-top:14px!important;padding-top:14px!important}

.bd-collections-card .bd-chip-link:hover,
.bd-collections-card .bd-chip-link:focus{
  border-color:#B9FF3B !important;
  box-shadow: 0 0 0 6px rgba(185,255,59,.10);
}

.bd-collections-grid a:hover,
.bd-collections-grid a:focus{
  border-color:#B9FF3B !important;
  box-shadow: 0 0 0 6px rgba(185,255,59,.10);
}

.bd-popular-collections .bd-col-card:hover,
.bd-popular-collections .bd-col-card:focus,
.bd-popular-collections .bd-col-card:focus-visible{
  border-color: #B9FF3B !important;
  box-shadow: 0 0 0 6px rgba(185,255,59,.10) !important;
}

.bd-popular-collections .bd-col-card:hover .bd-col-name,
.bd-popular-collections .bd-col-card:focus .bd-col-name{
  color: #B9FF3B;
}

/* optional: subtle thumb ring on hover */
.bd-popular-collections .bd-col-card:hover .bd-col-thumb,
.bd-popular-collections .bd-col-card:focus .bd-col-thumb{
  box-shadow: 0 0 0 2px rgba(185,255,59,.35);
}

/* Neon hover/focus for collection cards (homepage + collections page) */
.bd-collections .bd-col-card:hover,
.bd-collections .bd-col-card:focus,
.bd-collections .bd-col-card:focus-visible{
  border-color: #B9FF3B !important;
  box-shadow: 0 0 0 6px rgba(185,255,59,.10) !important;
}

.bd-collections .bd-col-card:hover .bd-col-name,
.bd-collections .bd-col-card:focus .bd-col-name{
  color: #B9FF3B;
}

/* Optional: subtle thumb ring on hover */
.bd-collections .bd-col-card:hover .bd-col-thumb,
.bd-collections .bd-col-card:focus .bd-col-thumb{
  box-shadow: 0 0 0 2px rgba(185,255,59,.35);
}

/* Neon hover/focus for wallpaper cards */
.bd-card.bd-card-grid{
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.bd-card.bd-card-grid:hover,
.bd-card.bd-card-grid:focus-within{
  border-color:#B9FF3B !important;
  box-shadow:0 0 0 6px rgba(185,255,59,.10) !important;
}

/* Optional: make the title pop on hover */
.bd-card.bd-card-grid:hover .bd-card-title a,
.bd-card.bd-card-grid:focus-within .bd-card-title a{
  color:#B9FF3B;
}

/* Optional: subtle thumb ring on hover */
.bd-card.bd-card-grid:hover .bd-thumb,
.bd-card.bd-card-grid:focus-within .bd-thumb{
  box-shadow:0 0 0 2px rgba(185,255,59,.35);
  border-radius:14px; /* only helps if image isn't already clipped */
}

/* Accessibility: keyboard focus */
.bd-card.bd-card-grid a:focus-visible{
  outline:2px solid #B9FF3B;
  outline-offset:3px;
}

/* ===== Featured Pick: shimmer/shine ===== */
.bd-featured-card{
  position: relative;
  overflow: hidden; /* keeps the shine inside the rounded card */
}

.bd-featured-card > a{
  display:block;
  position:relative;
}

/* Shine layer */
.bd-featured-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(
    110deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.06) 30%,
    rgba(255,255,255,0) 60%
  );
  transform: translateX(-120%);
  animation: bdFeaturedShine 2.8s linear infinite;
  z-index: 3;
}

/* Make sure overlay/buttons sit above the shine */
.bd-featured-card .bd-featured-overlay{ position: relative; z-index: 4; }

/* Optional: pause shimmer on hover (comment out if you want it always moving) */
/*
.bd-featured-card:hover::before{ animation-play-state: paused; }
*/

@keyframes bdFeaturedShine{
  0%   { transform: translateX(-120%); }
  100% { transform: translateX(120%); }
}



/* ==== Fix the “line” under the image + keep hover on the OUTSIDE only ==== */

/* 1) Clip everything to the card so the image/body seam disappears */
.bd-card.bd-card-grid{
  overflow: hidden;
  border-radius: 18px; /* match your card rounding */
}

/* 2) Make the image link a block so there’s no baseline gap */
.bd-card.bd-card-grid > a{
  display: block;
  line-height: 0;
}

/* 3) Only round the TOP of the image (prevents a visible seam) */
.bd-card.bd-card-grid .bd-thumb{
  display: block;
  width: 100%;
  border-radius: 18px 18px 0 0 !important;
  box-shadow: none !important; /* kill the inner hover edge */
}

/* 4) Keep your hover effect on the card (outer border/glow), not the image */
.bd-card.bd-card-grid:hover .bd-thumb,
.bd-card.bd-card-grid:focus-within .bd-thumb{
  box-shadow: none !important;
}

/* Optional: if you want the neon hover outline to feel cleaner */
.bd-card.bd-card-grid:hover,
.bd-card.bd-card-grid:focus-within{
  box-shadow: 0 0 0 2px rgba(185, 255, 59, .35);
}


/* === Unify chip style (Collections + Popular Colors) to match homepage .bd-chip === */

/* Chip container spacing */
.bd-collections-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Make chip links look like homepage chips */
.bd-collections-chips a.bd-chip-link,
.bd-collections-chips a{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem .8rem;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .03);
  color: #e5e7eb !important;
  font-size: .9rem;
  text-decoration: none !important;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

/* Hover/Focus = neon pop */
.bd-collections-chips a.bd-chip-link:hover,
.bd-collections-chips a:hover,
.bd-collections-chips a.bd-chip-link:focus-visible,
.bd-collections-chips a:focus-visible{
  transform: translateY(-1px);
  border-color: rgba(185, 255, 59, .75);
  background: rgba(185, 255, 59, .08);
  box-shadow: 0 0 0 2px rgba(185, 255, 59, .14);
  outline: none;
}

/* Kill the global underline rule ONLY for chips (keep underlines for normal links) */
.bd-wrap.bd-page .bd-page-panel .bd-collections-chips a{
  text-decoration: none !important;
  text-decoration-color: transparent !important;
}

/* Popular Colors: add the dot back when using .bd-chip */
.bd-collections-page .bd-collections-chips .bd-chip{
  position: relative;
  padding-left: 34px; /* room for dot */
}

/* dot */
.bd-collections-page .bd-collections-chips .bd-chip::before{
  content:"";
  position:absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #B9FF3B;
  box-shadow: 0 0 0 3px rgba(255,255,255,.06);
}

/* hover/focus dot goes neon */
.bd-collections-page .bd-collections-chips .bd-chip:hover::before,
.bd-collections-page .bd-collections-chips .bd-chip:focus-visible::before{
  background: #B9FF3B;
  box-shadow: 0 0 0 3px rgba(185,255,59,.16);
}

/* =========================
   HOME: Newsletter / Subscribe form styling (Fluent Forms)
   ========================= */

/* If your form sits inside a panel, this will keep it consistent */
.bd-wrap.bd-home .bd-panel .fluentform {
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.18);
}

/* Inputs + textarea */
.bd-wrap.bd-home .bd-panel .fluentform .ff-el-form-control,
.bd-wrap.bd-home .bd-panel .fluentform input[type="text"],
.bd-wrap.bd-home .bd-panel .fluentform input[type="email"],
.bd-wrap.bd-home .bd-panel .fluentform input[type="tel"],
.bd-wrap.bd-home .bd-panel .fluentform textarea,
.bd-wrap.bd-home .bd-panel .fluentform select {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #e5e7eb !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

/* Placeholder text */
.bd-wrap.bd-home .bd-panel .fluentform ::placeholder {
  color: rgba(229,231,235,.55) !important;
}

/* Focus glow like contact page */
.bd-wrap.bd-home .bd-panel .fluentform .ff-el-form-control:focus,
.bd-wrap.bd-home .bd-panel .fluentform input:focus,
.bd-wrap.bd-home .bd-panel .fluentform textarea:focus,
.bd-wrap.bd-home .bd-panel .fluentform select:focus {
  outline: none !important;
  border-color: rgba(185,255,59,.55) !important;
  box-shadow: 0 0 0 3px rgba(185,255,59,.14), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Labels */
.bd-wrap.bd-home .bd-panel .fluentform .ff-el-input--label label,
.bd-wrap.bd-home .bd-panel .fluentform label {
  color: #e5e7eb !important;
  font-weight: 700;
}

/* Button */
.bd-wrap.bd-home .bd-panel .fluentform button,
.bd-wrap.bd-home .bd-panel .fluentform input[type="submit"]{
  background: #B9FF3B !important;
  color: #050708 !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .02em;
  padding: 11px 18px !important;
  box-shadow: 0 10px 22px rgba(185,255,59,.22);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

.bd-wrap.bd-home .bd-panel .fluentform button:hover,
.bd-wrap.bd-home .bd-panel .fluentform input[type="submit"]:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
  box-shadow: 0 14px 28px rgba(185,255,59,.26);
}

/* Cloudflare turnstile / success row spacing if present */
.bd-wrap.bd-home .bd-panel .fluentform .cf-turnstile,
.bd-wrap.bd-home .bd-panel .fluentform .ff-el-section-break,
.bd-wrap.bd-home .bd-panel .fluentform .ff-el-group {
  margin-top: 12px;
}

.bd-wrap.bd-home .bd-seo li:before{
  background:#B9FF3B !important;
  box-shadow: 0 0 0 6px rgba(185,255,59,.12), 0 0 18px rgba(185,255,59,.25) !important;
  opacity: .95;
}


.bd-wrap.bd-home .bd-seo li{
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.bd-wrap.bd-home .bd-seo li:hover{
  border-color: rgba(185,255,59,.22);
  background: rgba(255,255,255,.03);
  transform: translateY(-1px);
}

/* HOME FAQ: stop double borders */
.bd-wrap.bd-home .bd-faq details{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.bd-wrap.bd-home .bd-faq summary{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Keep spacing only */
.bd-wrap.bd-home .bd-faq{
  padding: 22px !important;
}
.bd-wrap.bd-home .bd-faq details + details{
  margin-top: 12px;
}


/* HOME: SEO bullet dot (smaller + glow) */
.bd-wrap.bd-home .bd-seo li::before{
  content:"";
  position:absolute;
  left:12px;
  top:18px;
  width:10px;
  height:10px;
  border-radius:999px;
  background: var(--bd-accent);
  box-shadow: 0 0 18px rgba(185,255,59,.25);
  opacity:.9;
}

.mobile-logo-wrap img{
  width:180px !important;
  height:auto;
  max-width:none;
  max-height: var(--mlogo-height, var(--mbnav-height, 42px));
}

/* iOS overscroll / bounce background fix */
html, body{
  background:#060708 !important; /* match Backdrova theme */
}

/* optional: reduce iOS bounce artifacts (supported in most modern browsers) */
body{
  overscroll-behavior-y: none;
}

/* =========================================
   FIX: Popular Collections block on /collections/
   Targets the shortcode wrapper: aria-label="Popular collections grid"
   Forces homepage-style row cards (thumb + name + count)
   ========================================= */

.bd-collections[aria-label="Popular collections grid"]{
  display:block !important;               /* outer wrapper must NOT be a grid item */
}

/* The INNER .bd-collections is the real grid */
.bd-collections[aria-label="Popular collections grid"] .bd-collections{
  display:grid !important;
  gap:14px !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  margin-top:14px !important;
}

@media (max-width: 1024px){
  .bd-collections[aria-label="Popular collections grid"] .bd-collections{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px){
  .bd-collections[aria-label="Popular collections grid"] .bd-collections{
    grid-template-columns:1fr !important;
  }
}

/* Force the card layout back to “row card” */
.bd-collections[aria-label="Popular collections grid"] .bd-collections > a.bd-col-card{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;

  width:100% !important;
  min-width:0 !important;

  padding:14px 16px !important;
  border-radius:14px !important;

  background:rgba(255,255,255,.03) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.18) !important;

  text-decoration:none !important;
  color:#fff !important;
}

/* Kill any “tile/overlay” positioning that’s messing you up */
.bd-collections[aria-label="Popular collections grid"] .bd-col-left,
.bd-collections[aria-label="Popular collections grid"] .bd-col-name,
.bd-collections[aria-label="Popular collections grid"] .bd-col-count{
  position:static !important;
  display:block !important;
}

/* Left side = thumb + name */
.bd-collections[aria-label="Popular collections grid"] .bd-col-left{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  min-width:0 !important;
}

/* Thumb returns to fixed 44x44 (not full-width tile) */
.bd-collections[aria-label="Popular collections grid"] .bd-col-thumb{
  width:44px !important;
  height:44px !important;
  border-radius:12px !important;
  overflow:hidden !important;
  flex:0 0 44px !important;

  background:rgba(0,0,0,.25) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}

.bd-collections[aria-label="Popular collections grid"] .bd-col-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

/* Name + Count styling */
.bd-collections[aria-label="Popular collections grid"] .bd-col-name{
  font-weight:800 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.bd-collections[aria-label="Popular collections grid"] .bd-col-count{
  color:#9aa5b1 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  flex:0 0 auto !important;
}

/* Hover matches your neon vibe */
.bd-collections[aria-label="Popular collections grid"] .bd-collections > a.bd-col-card:hover{
  border-color:rgba(185,255,59,.45) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 12px 34px rgba(0,0,0,.24),
    0 0 0 2px rgba(185,255,59,.12) !important;
}

/* Featured title spacing override */
.bd-featured .bd-featured-title{
  margin-top: 6px !important;
}

/* ============================= */
/* BACKDROVA SETUP PAGE STYLES  */
/* ============================= */

/* CONTAINER SAFETY */
.bd-about-card {
  max-width: 1200px;
  margin: 0 auto;
}

/* INTRO LINE */
.bd-setup-intro {
  text-align: center;
  font-size: 14px;
  opacity: 0.7;
  margin: 10px 0 30px;
}

/* ============================= */
/* SHOWCASE LAYOUT              */
/* ============================= */

.bd-setup-showcase {
  display: grid !important;
  grid-template-columns: 1fr 520px 1fr;
  gap: 40px;
  justify-content: center;
  align-items: center;
  max-width: 1100px;
  margin: 40px auto;
}

/* FORCE GRID CHILD CONSISTENCY */
.bd-setup-showcase > div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ============================= */
/* IMAGE NORMALIZATION (KEY FIX) */
/* ============================= */

.bd-setup-side img,
.bd-setup-center img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  transition: all 0.35s ease;
}

/* SIDE IMAGES */
.bd-setup-side img {
  max-width: 260px;
  opacity: 0.85;
}

/* CENTER IMAGE */
.bd-setup-center img {
  max-width: 520px;
  border-radius: 14px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.6);
  transform: scale(1.05);
  z-index: 2;
}

/* HOVER EFFECT */
.bd-setup-showcase img:hover {
  transform: scale(1.04);
  opacity: 1;
}

/* ============================= */
/* META TEXT                    */
/* ============================= */

.bd-setup-meta {
  margin-top: 12px;
  font-size: 13px;
  text-align: center;
  line-height: 1.5;
}

.bd-setup-meta a {
  display: inline-block;
  margin-top: 6px;
  color: #9eff00;
  text-decoration: none;
}

.bd-setup-meta a:hover {
  text-decoration: underline;
}

/* ============================= */
/* TYPOGRAPHY IMPROVEMENT       */
/* ============================= */

.bd-about-card h3 {
  margin-bottom: 10px;
}


/* ============================= */
/* MOBILE FIX                   */
/* ============================= */

@media (max-width: 768px) {

  .bd-setup-showcase {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .bd-setup-center img,
  .bd-setup-side img {
    max-width: 100%;
    transform: none;
    opacity: 1;
  }

}

.bd-aboutpage {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.bd-about-card {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

.bd-setup-showcase {
  width: 100%;
  max-width: 1000px;
  margin: 40px auto;
}

/* SIMPLE, RELIABLE 3-UP LAYOUT */

.bd-setup-showcase-simple {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 25px;
  max-width: 1100px;
  margin: 40px auto;
}

/* EACH ITEM */
.bd-setup-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 260px;
}

/* CENTER FEATURED */
.bd-setup-item.featured {
  width: 420px;
}

/* IMAGES */
.bd-setup-item img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 12px;
  transition: all 0.3s ease;
}

/* CENTER IMAGE POP */
.bd-setup-item.featured img {
  transform: scale(1.05);
  box-shadow: 0 25px 70px rgba(0,0,0,0.5);
}

/* HOVER */
.bd-setup-item img:hover {
  transform: scale(1.03);
}

/* META */
.bd-setup-meta {
  margin-top: 10px;
  font-size: 13px;
  text-align: center;
}

.bd-setup-meta a {
  display: inline-block;
  margin-top: 6px;
  color: #9eff00;
  text-decoration: none;
}

.bd-setup-meta a:hover {
  text-decoration: underline;
}

/* MOBILE */
@media (max-width: 768px) {
  .bd-setup-showcase-simple {
    flex-direction: column;
    align-items: center;
  }

  .bd-setup-item,
  .bd-setup-item.featured {
    width: 100%;
    max-width: 400px;
  }
}

.bd-setup-showcase-simple {
  position: relative;
}

.bd-setup-showcase-simple::before {
  content: "";
  position: absolute;
  width: 500px;
  height: 200px;
  background: radial-gradient(
    rgba(158, 255, 0, 0.08),
    transparent 70%
  );
  top: 50%;
  left: 50%;
  transform: translate(-50%, -40%);
  pointer-events: none;
  z-index: 0;
}

.bd-setup-item img {
  box-shadow: 0 10px 30px rgba(0,0,0,0.4);
}

.bd-setup-item.featured img {
  box-shadow: 0 30px 80px rgba(0,0,0,0.6);
}

.bd-setup-meta {
  margin-top: 8px;
  font-size: 12.5px;
  opacity: 0.9;
}

.bd-setup-item {
  transform: scale(0.95);
}

.bd-setup-item.featured {
  transform: scale(1);
}

.bd-setup-intro {
  text-align: center;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.75; /* was too faint */
  margin: 25px 0 20px; /* slightly tighter to images */
  position: relative;
	padding-top: 20px;
}

.bd-setup-intro::before,
.bd-setup-intro::after {
  content: "";
  display: inline-block;
  width: 50px;
  height: 1px;
  background: rgba(255,255,255,0.2); /* slightly stronger */
  margin: 0 12px;
  vertical-align: middle;
}

/* Backdrova Wallpaper Guides Page */

.bd-guides-hero,
.bd-guides-body {
  background:
    radial-gradient(circle at 22% 0%, rgba(174, 255, 34, 0.08), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(71, 119, 255, 0.06), transparent 30%),
    #050706;
  color: #f5f7f2;
}

.bd-guides-body {
  padding: 0 0 72px;
}

.bd-guides-wrap {
  width: min(100% - 32px, 880px);
  margin: 0 auto;
}

.bd-guides-hero {
  padding: 34px 0 22px;
}

.bd-guides-kicker,
.bd-guides-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bd-guides-kicker span,
.bd-guides-section-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #b7ff28;
  box-shadow: 0 0 14px rgba(183, 255, 40, 0.85);
}

.bd-guides-hero-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.75fr);
  gap: 18px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(183, 255, 40, 0.08), rgba(255, 255, 255, 0.02) 38%, rgba(255, 255, 255, 0.04)),
    #101311;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.42);
  overflow: hidden;
}

.bd-guides-hero-panel::after {
  content: "";
  position: absolute;
  inset: auto -18% -45% 28%;
  height: 190px;
  background: radial-gradient(circle, rgba(183, 255, 40, 0.12), transparent 68%);
  pointer-events: none;
}

.bd-guides-hero-copy,
.bd-guides-hero-card {
  position: relative;
  z-index: 1;
}

.bd-guides-eyebrow {
  margin: 0 0 8px;
  color: #d7ded0;
  font-size: 13px;
  line-height: 1.5;
}

.bd-guides-hero h1 {
  margin: 0;
  max-width: 620px;
  color: #fff;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 0.92;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.bd-guides-lead {
  max-width: 650px;
  margin: 14px 0 0;
  color: #dce3d7;
  font-size: 15px;
  line-height: 1.75;
}

.bd-guides-actions,
.bd-guides-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.bd-guides-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none !important;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.bd-guides-btn:hover {
  transform: translateY(-1px);
}

.bd-guides-btn-primary {
  background: #b7ff28;
  color: #061006 !important;
  box-shadow: 0 0 24px rgba(183, 255, 40, 0.28);
}

.bd-guides-btn-primary:hover {
  background: #caff4d;
  box-shadow: 0 0 34px rgba(183, 255, 40, 0.38);
}

.bd-guides-btn-secondary {
  border: 1px solid rgba(255, 255, 255, 0.13);
  background: rgba(255, 255, 255, 0.045);
  color: #f6f8f3 !important;
}

.bd-guides-btn-secondary:hover {
  border-color: rgba(183, 255, 40, 0.42);
  background: rgba(183, 255, 40, 0.08);
}

.bd-guides-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 18px;
}

.bd-guides-proof span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.26);
  color: #cfd8c9;
  font-size: 11px;
  font-weight: 800;
}

.bd-guides-hero-card {
  align-self: stretch;
  min-height: 250px;
  padding: 16px;
  border: 1px solid rgba(183, 255, 40, 0.18);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(183, 255, 40, 0.1), rgba(255, 255, 255, 0.025)),
    rgba(0, 0, 0, 0.34);
  overflow: hidden;
}

.bd-guides-card-glow {
  height: 92px;
  margin-bottom: 16px;
  border-radius: 11px;
  background:
    linear-gradient(135deg, rgba(183, 255, 40, 0.2), transparent 42%),
    radial-gradient(circle at 76% 24%, rgba(183, 255, 40, 0.24), transparent 34%),
    linear-gradient(120deg, #121812, #070907);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 0 42px rgba(183, 255, 40, 0.05);
}

.bd-guides-mini-title {
  margin-bottom: 10px;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.bd-guides-mini-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.bd-guides-mini-grid a {
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  color: #e9eee3 !important;
  font-size: 11px;
  font-weight: 850;
  text-decoration: none !important;
}

.bd-guides-mini-grid a:hover {
  border-color: rgba(183, 255, 40, 0.4);
  background: rgba(183, 255, 40, 0.08);
}

.bd-guides-intro-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 16px;
}

.bd-guides-intro-grid article,
.bd-guides-content-card,
.bd-guides-side-card,
.bd-guides-topic-section,
.bd-guides-faq,
.bd-guides-cta {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #101311;
}

.bd-guides-intro-grid article {
  padding: 16px;
}

.bd-guides-intro-grid span {
  display: inline-flex;
  margin-bottom: 10px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 950;
}

.bd-guides-intro-grid h2 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 16px;
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.bd-guides-intro-grid p {
  margin: 0;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.65;
}

.bd-guides-posts-head {
  margin: 28px auto 18px;
  text-align: center;
}

.bd-guides-posts-head-tight {
  margin-top: 0;
}

.bd-guides-posts-head h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.bd-guides-posts-head p:not(.bd-guides-section-kicker) {
  max-width: 560px;
  margin: 10px auto 0;
  color: #cfd8c9;
  font-size: 14px;
  line-height: 1.7;
}

.bd-guides-split {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(250px, 0.75fr);
  gap: 14px;
  padding-top: 30px;
}

.bd-guides-content-card,
.bd-guides-side-card,
.bd-guides-topic-section,
.bd-guides-faq,
.bd-guides-cta {
  padding: 22px;
}

.bd-guides-content-card h2,
.bd-guides-topic-section h2,
.bd-guides-faq h2,
.bd-guides-cta h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(24px, 3.2vw, 38px);
  line-height: 0.98;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.bd-guides-content-card p,
.bd-guides-cta p {
  color: #d7ded0;
  font-size: 14px;
  line-height: 1.75;
}

.bd-guides-check-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.bd-guides-check-list div {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.18);
}

.bd-guides-check-list span {
  width: 9px;
  height: 9px;
  margin-top: 7px;
  border-radius: 999px;
  background: #b7ff28;
  box-shadow: 0 0 14px rgba(183, 255, 40, 0.7);
}

.bd-guides-check-list p {
  margin: 0;
}

.bd-guides-side-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 18px;
  letter-spacing: -0.02em;
}

.bd-guides-side-card a {
  display: block;
  padding: 13px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  text-decoration: none !important;
}

.bd-guides-side-card a span {
  display: block;
  color: #f7faf1;
  font-size: 13px;
  font-weight: 900;
}

.bd-guides-side-card a em {
  display: block;
  margin-top: 4px;
  color: #aeb8a7;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.bd-guides-side-card a:hover span {
  color: #b7ff28;
}

.bd-guides-topic-section,
.bd-guides-faq,
.bd-guides-cta {
  margin-top: 14px;
}

.bd-guides-topic-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 18px;
}

.bd-guides-topic-grid a {
  min-height: 130px;
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 11px;
  background:
    radial-gradient(circle at 100% 0%, rgba(183, 255, 40, 0.1), transparent 36%),
    rgba(0, 0, 0, 0.2);
  text-decoration: none !important;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.bd-guides-topic-grid a:hover {
  transform: translateY(-2px);
  border-color: rgba(183, 255, 40, 0.38);
  background:
    radial-gradient(circle at 100% 0%, rgba(183, 255, 40, 0.16), transparent 38%),
    rgba(0, 0, 0, 0.28);
}

.bd-guides-topic-grid span {
  display: inline-flex;
  margin-bottom: 18px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.bd-guides-topic-grid strong {
  display: block;
  color: #e6ece0;
  font-size: 13px;
  line-height: 1.55;
}

.bd-guides-faq-list {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.bd-guides-faq details {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.18);
  overflow: hidden;
}

.bd-guides-faq summary {
  cursor: pointer;
  padding: 15px 16px;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  list-style: none;
}

.bd-guides-faq summary::-webkit-details-marker {
  display: none;
}

.bd-guides-faq summary::after {
  content: "+";
  float: right;
  color: #b7ff28;
  font-weight: 950;
}

.bd-guides-faq details[open] summary::after {
  content: "–";
}

.bd-guides-faq details p {
  margin: 0;
  padding: 0 16px 16px;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.7;
}

.bd-guides-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background:
    linear-gradient(135deg, rgba(183, 255, 40, 0.11), rgba(255, 255, 255, 0.025)),
    #101311;
}

.bd-guides-cta p {
  margin-bottom: 0;
}

/* Optional: lightly style common Beaver Builder post output inside the guide page area */
.bd-guides-hero + .fl-builder-content .fl-post-grid-post,
.bd-guides-hero + .fl-builder-content .fl-post-feed-post {
  border-radius: 12px;
  overflow: hidden;
}

/* Responsive */
@media (max-width: 820px) {
  .bd-guides-hero-panel,
  .bd-guides-split,
  .bd-guides-intro-grid,
  .bd-guides-topic-grid,
  .bd-guides-cta {
    grid-template-columns: 1fr;
  }

  .bd-guides-cta {
    display: grid;
  }

  .bd-guides-hero-card {
    min-height: auto;
  }
}

@media (max-width: 520px) {
  .bd-guides-wrap {
    width: min(100% - 22px, 880px);
  }

  .bd-guides-hero {
    padding-top: 24px;
  }

  .bd-guides-hero-panel,
  .bd-guides-content-card,
  .bd-guides-side-card,
  .bd-guides-topic-section,
  .bd-guides-faq,
  .bd-guides-cta {
    padding: 16px;
  }

  .bd-guides-hero h1 {
    font-size: 38px;
  }

  .bd-guides-lead {
    font-size: 14px;
  }

  .bd-guides-mini-grid {
    grid-template-columns: 1fr;
  }

  .bd-guides-actions,
  .bd-guides-cta-actions {
    display: grid;
  }

  .bd-guides-btn {
    width: 100%;
  }
}

/* Backdrova Wallpaper Guides Hub - Final Build */

.bdg-hero,
.bdg-body {
  color: #f5f7f2;
}

.bdg-hero {
  padding: 42px 0 34px;
  background:
    radial-gradient(circle at 18% 0%, rgba(183, 255, 40, 0.1), transparent 32%),
    radial-gradient(circle at 88% 16%, rgba(57, 83, 255, 0.06), transparent 30%),
    linear-gradient(180deg, #070a08 0%, #050706 100%);
}

.bdg-body {
  padding: 46px 0 86px;
  background:
    radial-gradient(circle at 92% 96%, rgba(183, 255, 40, 0.14), transparent 34%),
    radial-gradient(circle at 7% 30%, rgba(54, 93, 42, 0.12), transparent 34%),
    linear-gradient(180deg, #050706 0%, #070908 48%, #050706 100%);
}

.bdg-shell {
  width: min(100% - 44px, 1180px);
  margin: 0 auto;
}

.bdg-kicker,
.bdg-section-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 0 12px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bdg-kicker span,
.bdg-section-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #b7ff28;
  box-shadow: 0 0 16px rgba(183, 255, 40, 0.86);
}

.bdg-hero-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.68fr);
  gap: 24px;
  align-items: stretch;
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, 0.105);
  border-radius: 18px;
  background:
    radial-gradient(circle at 86% 22%, rgba(183, 255, 40, 0.12), transparent 30%),
    linear-gradient(135deg, rgba(183, 255, 40, 0.08), rgba(255, 255, 255, 0.025) 42%, rgba(255, 255, 255, 0.04)),
    #101311;
  box-shadow:
    0 34px 90px rgba(0, 0, 0, 0.48),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  overflow: hidden;
}

.bdg-hero-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.035), transparent 32%),
    radial-gradient(circle at 10% 0%, rgba(183, 255, 40, 0.08), transparent 26%);
  pointer-events: none;
}

.bdg-hero-panel::after {
  content: "";
  position: absolute;
  right: -18%;
  bottom: -48%;
  width: 520px;
  height: 260px;
  background: radial-gradient(circle, rgba(183, 255, 40, 0.13), transparent 68%);
  pointer-events: none;
}

.bdg-hero-copy,
.bdg-hero-finder {
  position: relative;
  z-index: 2;
}

.bdg-eyebrow {
  margin: 0 0 10px;
  color: #d9e1d3;
  font-size: 13px;
  line-height: 1.55;
}

.bdg-hero h1,
.bdg-posts-heading h2,
.bdg-content-card h2,
.bdg-topic-section h2,
.bdg-faq h2,
.bdg-cta h2 {
  color: #fff;
  line-height: 1.02 !important;
  letter-spacing: -0.035em !important;
  text-wrap: balance;
}

.bdg-hero h1 {
  max-width: 780px;
  margin: 0;
  font-size: clamp(44px, 4.8vw, 72px) !important;
}

.bdg-lead {
  max-width: 760px;
  margin: 18px 0 0;
  color: #dbe5d4;
  font-size: 15px;
  line-height: 1.78;
}

.bdg-actions,
.bdg-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.bdg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 17px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 950;
  text-decoration: none !important;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.bdg-btn:hover {
  transform: translateY(-2px);
}

.bdg-btn-primary {
  background: #b7ff28;
  color: #071008 !important;
  box-shadow: 0 0 26px rgba(183, 255, 40, 0.3);
}

.bdg-btn-primary:hover {
  background: #caff4d;
  box-shadow: 0 0 38px rgba(183, 255, 40, 0.42);
}

.bdg-btn-secondary {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.045);
  color: #f8fbf3 !important;
}

.bdg-btn-secondary:hover {
  border-color: rgba(183, 255, 40, 0.42);
  background: rgba(183, 255, 40, 0.08);
}

.bdg-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.bdg-proof span {
  display: inline-flex;
  align-items: center;
  min-height: 29px;
  padding: 0 11px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.25);
  color: #d3ddcc;
  font-size: 11px;
  font-weight: 850;
}

/* Hero Guide Finder */

.bdg-finder-preview,
.bdg-preview-orb,
.bdg-preview-orb-one,
.bdg-preview-orb-two {
  display: none !important;
}

.bdg-hero-finder {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  padding: 0 4px 0 24px !important;
  border: 0 !important;
  border-left: 1px solid rgba(183, 255, 40, 0.2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.bdg-finder-label {
  margin: 0 0 6px !important;
  color: #b7ff28;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bdg-hero-finder h2 {
  margin: 0 0 16px !important;
  color: #fff;
  font-size: 30px;
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.bdg-finder-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.bdg-finder-links a {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.025)),
    rgba(255,255,255,0.03);
  color: #edf4e9 !important;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none !important;
  overflow: hidden;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease;
}

.bdg-finder-links a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 22% 0%, rgba(183,255,40,0.2), transparent 36%);
  opacity: 0;
  transition: opacity 0.18s ease;
}

.bdg-finder-links a:hover {
  transform: translateY(-2px);
  border-color: rgba(183, 255, 40, 0.5);
  color: #b7ff28 !important;
  box-shadow: 0 14px 28px rgba(0,0,0,0.32);
}

.bdg-finder-links a:hover::before {
  opacity: 1;
}

/* Feature Cards */

.bdg-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 18px;
}

.bdg-feature-grid article,
.bdg-content-card,
.bdg-side-card,
.bdg-topic-section,
.bdg-faq,
.bdg-cta {
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 15px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.014)),
    #101311;
  box-shadow: 0 22px 54px rgba(0, 0, 0, 0.28);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
}

.bdg-feature-grid article {
  padding: 20px;
}

.bdg-feature-grid article:hover,
.bdg-content-card:hover,
.bdg-side-card:hover,
.bdg-topic-section:hover,
.bdg-faq:hover,
.bdg-cta:hover {
  border-color: rgba(183, 255, 40, 0.24);
  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.36),
    0 0 36px rgba(183, 255, 40, 0.045);
}

.bdg-feature-grid article:hover {
  transform: translateY(-3px);
}

.bdg-feature-grid span {
  display: inline-flex;
  margin-bottom: 12px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 950;
}

.bdg-feature-grid h2 {
  margin: 0 0 9px;
  color: #fff;
  font-size: 18px;
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.bdg-feature-grid p {
  margin: 0;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.65;
}

/* Posts Heading */

.bdg-posts-heading {
  max-width: 720px;
  margin: 34px auto 20px;
  text-align: center;
}

.bdg-posts-heading-tight {
  margin-top: 0;
}

.bdg-posts-heading .bdg-section-kicker {
  margin-left: auto;
  margin-right: auto;
}

.bdg-posts-heading h2 {
  margin: 0;
  font-size: clamp(30px, 3vw, 42px) !important;
}

.bdg-posts-heading p:not(.bdg-section-kicker) {
  max-width: 640px;
  margin: 11px auto 0;
  color: #cfd8c9;
  font-size: 14px;
  line-height: 1.72;
}

/* Bottom Layout */

.bdg-split {
  display: grid;
  grid-template-columns: minmax(0, 1.48fr) minmax(300px, 0.72fr);
  gap: 18px;
}

.bdg-content-card,
.bdg-side-card,
.bdg-topic-section,
.bdg-faq,
.bdg-cta {
  padding: 30px;
}

.bdg-content-card h2,
.bdg-topic-section h2,
.bdg-faq h2,
.bdg-cta h2 {
  margin: 0;
  font-size: clamp(30px, 3.15vw, 46px) !important;
}

.bdg-content-card p,
.bdg-cta p {
  color: #d7ded0;
  font-size: 14px;
  line-height: 1.78;
}

.bdg-check-list {
  display: grid;
  gap: 11px;
  margin-top: 18px;
}

.bdg-check-list div {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 11px;
  background: rgba(0, 0, 0, 0.19);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
}

.bdg-check-list div:hover {
  transform: translateY(-3px);
  border-color: rgba(183, 255, 40, 0.24);
}

.bdg-check-list span {
  width: 9px;
  height: 9px;
  margin-top: 7px;
  border-radius: 999px;
  background: #b7ff28;
  box-shadow: 0 0 15px rgba(183, 255, 40, 0.75);
}

.bdg-check-list p {
  margin: 0;
}

/* Sidebar */

.bdg-side-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 20px;
  letter-spacing: -0.025em;
}

.bdg-side-card > a {
  display: block;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.085);
  text-decoration: none !important;
}

.bdg-side-card > a span {
  display: block;
  color: #f7faf1;
  font-size: 13px;
  font-weight: 950;
}

.bdg-side-card > a em {
  display: block;
  margin-top: 4px;
  color: #aeb8a7;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.bdg-side-card > a:hover span {
  color: #b7ff28;
}

.bdg-side-chip-group {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.085);
}

.bdg-side-chip-group p {
  margin: 0 0 10px;
  color: #b7ff28;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bdg-side-chip-group div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bdg-side-chip-group div a {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.105);
  border-radius: 999px;
  background: rgba(255,255,255,0.04);
  color: #dce5d6 !important;
  font-size: 11px;
  font-weight: 850;
  text-decoration: none !important;
  transition:
    transform 0.18s ease,
    color 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.bdg-side-chip-group div a:hover {
  transform: translateY(-2px);
  color: #071008 !important;
  border-color: #b7ff28;
  background: #b7ff28;
  box-shadow: 0 0 22px rgba(183,255,40,0.22);
}

/* Popular Topics */

.bdg-topic-section,
.bdg-faq,
.bdg-cta {
  margin-top: 18px;
}

.bdg-topic-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 20px;
}

.bdg-topic-grid a {
  position: relative;
  min-height: 150px;
  padding: 17px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 13px;
  background:
    radial-gradient(circle at 100% 0%, rgba(183, 255, 40, 0.1), transparent 36%),
    rgba(0, 0, 0, 0.22);
  text-decoration: none !important;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.bdg-topic-grid a:nth-child(-n+4)::after {
  content: "Collection";
}

.bdg-topic-grid a:nth-child(n+5)::after {
  content: "Color";
}

.bdg-topic-grid a::after {
  position: absolute;
  right: 14px;
  top: 14px;
  color: rgba(255,255,255,0.38);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: color 0.18s ease;
}

.bdg-topic-grid a:hover {
  transform: translateY(-3px);
  border-color: rgba(183, 255, 40, 0.38);
  background:
    radial-gradient(circle at 100% 0%, rgba(183, 255, 40, 0.16), transparent 38%),
    rgba(0, 0, 0, 0.3);
  box-shadow: 0 22px 45px rgba(0,0,0,0.3);
}

.bdg-topic-grid a:hover::after {
  color: rgba(183,255,40,0.85);
}

.bdg-topic-grid span {
  display: inline-flex;
  margin-bottom: 20px;
  color: #b7ff28;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.065em;
}

.bdg-topic-grid strong {
  display: block;
  color: #e6ece0;
  font-size: 13px;
  line-height: 1.58;
}

/* FAQ */

.bdg-faq-list {
  display: grid;
  gap: 9px;
  margin-top: 20px;
}

.bdg-faq details {
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 11px;
  background: rgba(0, 0, 0, 0.19);
  overflow: hidden;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.bdg-faq details:hover {
  border-color: rgba(183,255,40,0.34);
  background:
    radial-gradient(circle at 100% 50%, rgba(183,255,40,0.08), transparent 30%),
    rgba(0,0,0,0.22);
}

.bdg-faq details:hover summary {
  color: #b7ff28;
}

.bdg-faq details[open] {
  border-color: rgba(183,255,40,0.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(183,255,40,0.12), transparent 34%),
    rgba(0,0,0,0.26);
  box-shadow: 0 0 28px rgba(183,255,40,0.06);
}

.bdg-faq details[open] summary {
  color: #b7ff28;
}

.bdg-faq summary {
  cursor: pointer;
  padding: 17px 18px;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  list-style: none;
}

.bdg-faq summary::-webkit-details-marker {
  display: none;
}

.bdg-faq summary::after {
  content: "+";
  float: right;
  color: #b7ff28;
  font-weight: 950;
}

.bdg-faq details[open] summary::after {
  content: "–";
}

.bdg-faq details p {
  margin: 0;
  padding: 0 18px 18px;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.72;
}

/* CTA */

.bdg-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 34px;
  background:
    radial-gradient(circle at 92% 82%, rgba(183, 255, 40, 0.2), transparent 36%),
    linear-gradient(135deg, rgba(183, 255, 40, 0.105), rgba(255, 255, 255, 0.025)),
    #11150f;
}

.bdg-cta h2 {
  max-width: 650px;
}

.bdg-cta p {
  max-width: 650px;
  margin-bottom: 0;
}

/* Beaver Builder Post Widget Light Polish */

body.page .fl-post-grid-post,
body.page .fl-post-feed-post {
  border-radius: 14px;
  overflow: hidden;
}

/* Full Width Support */

body.page .entry-content,
body.page .site-content,
body.page .fl-builder-content,
body.page .elementor-section,
body.page .elementor-container {
  max-width: none;
}

/* Responsive */

@media (max-width: 980px) {
  .bdg-shell {
    width: min(100% - 28px, 1180px);
  }

  .bdg-hero-panel,
  .bdg-split,
  .bdg-feature-grid,
  .bdg-topic-grid {
    grid-template-columns: 1fr;
  }

  .bdg-hero h1 {
    font-size: clamp(42px, 11vw, 66px) !important;
  }

  .bdg-hero-finder {
    padding: 18px !important;
    border: 1px solid rgba(183, 255, 40, 0.18) !important;
    border-radius: 14px !important;
    background:
      radial-gradient(circle at 88% 10%, rgba(183, 255, 40, 0.1), transparent 30%),
      rgba(0,0,0,0.22) !important;
  }

  .bdg-cta {
    display: grid;
  }
}

@media (max-width: 560px) {
  .bdg-shell {
    width: min(100% - 22px, 1180px);
  }

  .bdg-hero {
    padding: 28px 0 26px;
  }

  .bdg-body {
    padding: 34px 0 64px;
  }

  .bdg-hero-panel,
  .bdg-content-card,
  .bdg-side-card,
  .bdg-topic-section,
  .bdg-faq,
  .bdg-cta {
    padding: 18px;
    border-radius: 14px;
  }

  .bdg-feature-grid article {
    padding: 17px;
  }

  .bdg-hero h1 {
    font-size: 42px !important;
  }

  .bdg-lead {
    font-size: 14px;
  }

  .bdg-finder-links {
    grid-template-columns: 1fr;
  }

  .bdg-actions,
  .bdg-cta-actions {
    display: grid;
  }

  .bdg-btn {
    width: 100%;
  }

  .bdg-topic-grid a::after {
    top: 13px;
    right: 13px;
  }
}

/* Quick Backdrova homepage/header fixes */

/* Mobile dropdown CTA: green button with dark text */
.bdhf-mobile-menu a.bdhf-mobile-cta,
body:not(.wp-admin) .bdhf-mobile-menu a.bdhf-mobile-cta,
body.bdhf-mobile-open .bdhf-mobile-menu a.bdhf-mobile-cta {
	color: #071008 !important;
	background: #b9ff3b !important;
	border-color: #b9ff3b !important;
	text-shadow: none !important;
	box-shadow: 0 0 28px rgba(185,255,59,.22) !important;
}

.bdhf-mobile-menu a.bdhf-mobile-cta:hover,
.bdhf-mobile-menu a.bdhf-mobile-cta:focus {
	color: #071008 !important;
	background: #c7ff59 !important;
	border-color: #c7ff59 !important;
}

/* Remove card image radius inside wallpaper grid */
section.bd-grid .bd-card-media,
.bd-grid .bd-card-media {
	border-radius: 0 !important;
}

/* Homepage hero mobile title polish */
@media (max-width: 560px) {
	.bd-archive-head h1 {
		font-size: clamp(2.65rem, 11.5vw, 3.45rem) !important;
		line-height: 1.02 !important;
		letter-spacing: -.045em !important;
		max-width: 11ch !important;
	}

	.bd-archive-head .bd-desc,
	.bd-archive-head .bd-sub {
		font-size: 1rem !important;
		line-height: 1.55 !important;
	}
}

/* Hide underbuilt phone/tablet chips for now */
.bd-archive-head .bd-chip[href*="/devices/iphone/"],
.bd-archive-head .bd-chip[href*="/devices/android/"],
.bd-archive-head .bd-chip[href*="/devices/ipad/"] {
	display: none !important;
}

:root {
  --bda-accent: #B9FF3B;
  --bda-bg: #050706;
  --bda-panel: #111410;
  --bda-panel-2: #151914;
  --bda-border: rgba(255,255,255,.095);
  --bda-muted: #c9d3c4;
  --bda-dim: #94a08f;
  --bda-text: #f7faf4;
  --bda-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bda-radius: 16px;
}

.bda-stage,
.bda-stage * {
  box-sizing: border-box;
}

.bda-stage {
  position: relative;
  isolation: isolate;
  color: var(--bda-text);
  background:
    radial-gradient(circle at 9% 3%, rgba(185,255,59,.12), transparent 32%),
    radial-gradient(circle at 94% 82%, rgba(185,255,59,.16), transparent 34%),
    radial-gradient(circle at 88% 14%, rgba(64,106,255,.045), transparent 31%),
    linear-gradient(180deg, #050706 0%, #070908 48%, #050706 100%);
  overflow: hidden;
}

.bda-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 22%, transparent 78%, rgba(255,255,255,.012)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0, rgba(255,255,255,.012) 1px, transparent 1px, transparent 7px);
  opacity: .26;
  pointer-events: none;
}

.bda-shell {
  width: min(100% - 44px, 1180px);
  margin-inline: auto;
  padding: 42px 0 88px;
}

.bda-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--bda-border);
  border-radius: var(--bda-radius);
  background:
    radial-gradient(circle at 10% 0%, rgba(185,255,59,.065), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    var(--bda-panel);
  box-shadow: var(--bda-shadow);
}

.bda-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.07), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.026), transparent 34%);
  pointer-events: none;
  opacity: .9;
}

.bda-panel > * {
  position: relative;
  z-index: 2;
}

.bda-hover {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.bda-hover:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.24);
  box-shadow:
    0 32px 86px rgba(0,0,0,.48),
    0 0 42px rgba(185,255,59,.04);
}

.bda-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--bda-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.bda-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--bda-accent);
  box-shadow: 0 0 16px rgba(185,255,59,.82);
}

.bda-stage h1,
.bda-stage h2,
.bda-stage h3 {
  margin: 0;
  color: #fff;
  line-height: 1.02 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}

.bda-stage h1 {
  max-width: 900px;
  font-size: clamp(46px, 5vw, 78px) !important;
}

.bda-stage h2 {
  font-size: clamp(30px, 3vw, 44px) !important;
}

.bda-stage h3 {
  font-size: clamp(21px, 2vw, 30px) !important;
}

.bda-stage p {
  color: var(--bda-muted);
  font-size: 15px;
  line-height: 1.72;
}

.bda-stage a {
  color: inherit;
}

.bda-hero {
  padding: 34px;
  background:
    radial-gradient(circle at 94% 13%, rgba(185,255,59,.15), transparent 34%),
    linear-gradient(135deg, rgba(185,255,59,.09), rgba(255,255,255,.022) 42%, rgba(255,255,255,.035)),
    #111510;
}

.bda-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(310px, .82fr);
  gap: 30px;
  align-items: center;
}

.bda-hero-copy p {
  max-width: 840px;
  margin: 18px 0 0;
}

.bda-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.bda-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 17px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 950;
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease, filter .18s ease;
}

.bda-btn:hover {
  transform: translateY(-2px);
}

.bda-btn.primary {
  border: 1px solid rgba(185,255,59,.58);
  background: var(--bda-accent);
  color: #071008 !important;
  box-shadow: 0 0 26px rgba(185,255,59,.24);
}

.bda-btn.primary:hover {
  background: #c8ff58;
  color: #071008 !important;
  box-shadow: 0 0 38px rgba(185,255,59,.38);
}

.bda-btn.ghost {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.045);
  color: #f8fbf3 !important;
}

.bda-btn.ghost:hover {
  border-color: rgba(185,255,59,.42);
  background: rgba(185,255,59,.08);
  color: #fff !important;
}

.bda-brand-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.22);
}

.bda-brand-card strong {
  display: block;
  color: #fff;
  font-size: clamp(30px, 3.3vw, 48px);
  line-height: .95;
  letter-spacing: -.045em;
}

.bda-brand-card span {
  display: block;
  margin-top: 10px;
  color: var(--bda-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bda-brand-card p {
  margin: 14px 0 0;
  font-size: 14px;
}

.bda-mini-proof {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 16px;
}

.bda-proof-item {
  min-height: 76px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(255,255,255,.035);
}

.bda-proof-item b {
  display: block;
  color: #fff;
  font-size: 14px;
  line-height: 1.15;
}

.bda-proof-item small {
  display: block;
  margin-top: 6px;
  color: var(--bda-dim);
  font-size: 12px;
  line-height: 1.35;
}

.bda-section {
  padding: 30px;
  margin-top: 22px;
}

.bda-section-head {
  max-width: 840px;
  margin-bottom: 22px;
}

.bda-section-head p {
  margin: 12px 0 0;
}

.bda-two {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 18px;
}

.bda-copy-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(0,0,0,.19);
}

.bda-copy-card p {
  margin: 12px 0 0;
}

.bda-copy-card p:first-of-type {
  margin-top: 0;
}

.bda-values {
  display: grid;
  gap: 10px;
}

.bda-value {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  padding: 14px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    rgba(0,0,0,.2);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.bda-value:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.26);
}

.bda-icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  border: 1px solid rgba(185,255,59,.24);
  background:
    radial-gradient(circle at 50% 30%, rgba(185,255,59,.26), transparent 58%),
    rgba(185,255,59,.08);
  box-shadow: 0 0 24px rgba(185,255,59,.08);
}

.bda-value h3 {
  font-size: 18px !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}

.bda-value p {
  margin: 6px 0 0;
  font-size: 13.5px;
  line-height: 1.58;
}

.bda-path-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}

.bda-path {
  min-height: 190px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    rgba(0,0,0,.2);
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bda-path:hover {
  transform: translateY(-3px);
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.28);
  box-shadow: 0 20px 46px rgba(0,0,0,.32);
}

.bda-path em {
  display: inline-flex;
  align-items: center;
  margin-bottom: 22px;
  color: var(--bda-accent);
  font-size: 12px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bda-path strong {
  display: block;
  color: #fff;
  font-size: 22px;
  line-height: 1.02;
  letter-spacing: -.035em;
}

.bda-path span {
  display: block;
  margin-top: 10px;
  color: var(--bda-muted);
  font-size: 13.5px;
  line-height: 1.55;
}

.bda-compare {
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(0,0,0,.18);
}

.bda-compare-head,
.bda-compare-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px 150px;
  align-items: center;
}

.bda-compare-head {
  background:
    radial-gradient(circle at 90% 0%, rgba(185,255,59,.13), transparent 40%),
    rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.085);
}

.bda-compare-head div {
  padding: 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bda-compare-head div:nth-child(2) {
  color: var(--bda-accent);
}

.bda-compare-row {
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.bda-compare-row:last-child {
  border-bottom: 0;
}

.bda-compare-row > div {
  padding: 14px;
  color: #d6dfd0;
  font-size: 14px;
  line-height: 1.35;
}

.bda-compare-row > div:nth-child(2),
.bda-compare-row > div:nth-child(3) {
  text-align: center;
}

.bda-ok,
.bda-no {
  display: inline-grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 950;
}

.bda-ok {
  color: #071008;
  background: var(--bda-accent);
  box-shadow: 0 0 18px rgba(185,255,59,.28);
}

.bda-no {
  color: #ff7d7d;
  border: 1px solid rgba(255,125,125,.35);
  background: rgba(255,125,125,.08);
}

.bda-standards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.bda-standard {
  padding: 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 36%),
    rgba(0,0,0,.19);
}

.bda-standard strong {
  display: block;
  color: #fff;
  font-size: 18px;
  line-height: 1.1;
  letter-spacing: -.025em;
}

.bda-standard p {
  margin: 9px 0 0;
  font-size: 13.5px;
  line-height: 1.6;
}

.bda-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 18px;
}

.bda-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 34px;
  padding: .45rem .8rem;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.12);
  color: #e5e7eb !important;
  font-size: .80rem;
  font-weight: 550;
  line-height: 1;
  text-decoration: none !important;
  transform: skewX(-6deg);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}

.bda-chip > span {
  transform: skewX(6deg);
}

.bda-chip .dot {
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: var(--bda-accent);
  box-shadow: 0 0 12px rgba(185,255,59,.32);
}

.bda-chip:hover {
  transform: skewX(-6deg) translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: var(--bda-accent);
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.22), 0 0 16px rgba(185,255,59,.08);
}

.bda-rights {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr);
  gap: 18px;
  align-items: stretch;
}

.bda-rights-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(0,0,0,.19);
}

.bda-rights-card p {
  margin: 12px 0 0;
}

.bda-rights-list {
  display: grid;
  gap: 10px;
}

.bda-rights-list a {
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(255,255,255,.035);
  color: #fff !important;
  font-size: 13.5px;
  font-weight: 850;
  text-decoration: none !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.bda-rights-list a:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.38);
  background: rgba(185,255,59,.08);
}

.bda-final {
  padding: 34px;
  margin-top: 22px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 100%, rgba(185,255,59,.15), transparent 36%),
    linear-gradient(135deg, rgba(185,255,59,.08), rgba(255,255,255,.025)),
    #11150f;
}

.bda-final h2 {
  max-width: 760px;
  margin-inline: auto;
}

.bda-final p {
  max-width: 720px;
  margin: 14px auto 0;
}

.bda-final .bda-hero-actions {
  justify-content: center;
}

@media (max-width: 980px) {
  .bda-shell {
    width: min(100% - 28px, 1180px);
    padding: 30px 0 72px;
  }

  .bda-hero-grid,
  .bda-two,
  .bda-rights {
    grid-template-columns: 1fr;
  }

  .bda-path-grid,
  .bda-standards {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 640px) {
  .bda-shell {
    width: min(100% - 22px, 1180px);
    padding: 28px 0 64px;
  }

  .bda-hero,
  .bda-section,
  .bda-final {
    padding: 18px;
    border-radius: 14px;
  }

  .bda-stage h1 {
    font-size: 42px !important;
    line-height: 1.02 !important;
  }

  .bda-stage p {
    font-size: 14px;
    line-height: 1.66;
  }

  .bda-hero-actions {
    display: grid;
  }

  .bda-btn {
    width: 100%;
  }

  .bda-mini-proof,
  .bda-path-grid,
  .bda-standards {
    grid-template-columns: 1fr;
  }

  .bda-compare {
    overflow-x: auto;
  }

  .bda-compare-head,
  .bda-compare-row {
    grid-template-columns: minmax(190px, 1fr) 92px 92px;
    min-width: 420px;
  }

  .bda-compare-head div,
  .bda-compare-row > div {
    padding: 12px;
  }

  .bda-chip {
    min-height: 36px;
    padding: .5rem .78rem;
    font-size: .80rem;
  }
}

/* =========================================================
   BACKDROVA ABOUT — FINAL POLISH PATCHES
   Hero hovers, compact value rows, real homepage chips,
   centered comparison icons, standards hover
   ========================================================= */


/* ---------------------------------------------
   1) Hero proof boxes hover
--------------------------------------------- */

.bda-proof-item {
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.bda-proof-item:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(185,255,59,.34) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 38%),
    rgba(255,255,255,.05) !important;
  box-shadow:
    0 14px 30px rgba(0,0,0,.22),
    0 0 18px rgba(185,255,59,.055) !important;
}

.bda-proof-item:hover b {
  color: #ffffff !important;
}

.bda-proof-item:hover small {
  color: #cfd8c9 !important;
}


/* ---------------------------------------------
   2) Why Backdrova Exists — cleaner compact rows
   Replaces the oversized rectangle-box feel
--------------------------------------------- */

.bda-values-compact {
  display: grid !important;
  gap: 10px !important;
}

.bda-value-line {
  display: grid !important;
  grid-template-columns: 12px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  padding: 14px 15px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 34%),
    rgba(0,0,0,.19) !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.bda-value-line:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(185,255,59,.34) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.25) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.25) !important;
}

.bda-value-line > span {
  width: 9px !important;
  height: 9px !important;
  margin-top: 5px !important;
  border-radius: 999px !important;
  background: var(--bda-accent) !important;
  box-shadow: 0 0 15px rgba(185,255,59,.75) !important;
}

.bda-value-line h3 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 18px !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}

.bda-value-line p {
  margin: 6px 0 0 !important;
  color: #c9d3c4 !important;
  font-size: 13.5px !important;
  line-height: 1.58 !important;
}


/* ---------------------------------------------
   3) Library Structure chips
   Match final homepage chip system and actual colors
--------------------------------------------- */

.bda-library-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  margin-top: 18px !important;
}

.bda-library-chips .bdh-chip {
  clip-path: none !important;
  border-radius: 10px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .4rem !important;

  min-height: 34px !important;
  padding: .45rem .8rem !important;

  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #e5e7eb !important;

  font-size: .80rem !important;
  font-weight: 550 !important;
  line-height: 1 !important;
  text-decoration: none !important;

  position: relative !important;
  overflow: hidden !important;

  transform: skewX(-6deg) !important;
  transition:
    transform .15s ease,
    background .15s ease,
    border-color .15s ease,
    box-shadow .15s ease,
    color .15s ease !important;
}

.bda-library-chips .bdh-chip .bdh-dot {
  width: .55rem !important;
  height: .55rem !important;
  border-radius: 999px !important;
  flex: 0 0 auto !important;
  box-shadow: 0 0 12px rgba(255,255,255,.08) !important;
}

.bda-library-chips .bdh-chip:hover {
  transform: skewX(-6deg) translateY(-1px) !important;
  background: rgba(255,255,255,.06) !important;
  border-color: #B9FF3B !important;
  color: #fff !important;
  box-shadow:
    0 12px 24px rgba(0,0,0,.22),
    0 0 16px rgba(185,255,59,.08) !important;
}


/* ---------------------------------------------
   4) Comparison table icon centering
--------------------------------------------- */

.bda-compare-row > div:nth-child(2),
.bda-compare-row > div:nth-child(3),
.bda-compare-head > div:nth-child(2),
.bda-compare-head > div:nth-child(3) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.bda-ok,
.bda-no {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  text-align: center !important;
}

.bda-ok {
  padding-bottom: 1px !important;
}

.bda-no {
  padding-bottom: 2px !important;
}


/* ---------------------------------------------
   5) Library Standards hover polish
--------------------------------------------- */

.bda-standard {
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.bda-standard:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(185,255,59,.38) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.26) !important;
  box-shadow:
    0 20px 46px rgba(0,0,0,.32),
    0 0 18px rgba(185,255,59,.055) !important;
}

.bda-standard:hover strong {
  color: #ffffff !important;
}

.bda-standard:hover p {
  color: #d5dfce !important;
}


/* ---------------------------------------------
   Mobile balance
--------------------------------------------- */

@media (max-width: 640px) {
  .bda-value-line {
    padding: 13px 14px !important;
  }

  .bda-value-line h3 {
    font-size: 17px !important;
  }

  .bda-value-line p {
    font-size: 13.5px !important;
  }

  .bda-library-chips .bdh-chip {
    min-height: 36px !important;
    padding: .5rem .78rem !important;
    font-size: .80rem !important;
    transform: skewX(-6deg) !important;
  }

  .bda-library-chips .bdh-chip:hover {
    transform: skewX(-6deg) translateY(-1px) !important;
  }
}

/* =========================================================
   BACKDROVA ABOUT — CLEAN VALUE ROWS + REAL HOMEPAGE CHIPS
   ========================================================= */

/* Remove old decorative icon boxes if any old HTML remains */
.bda-icon {
  display: none !important;
}

/* Cleaner Why Backdrova Exists rows */
.bda-values-clean {
  display: grid !important;
  gap: 10px !important;
}

.bda-value-clean {
  display: grid !important;
  grid-template-columns: 10px minmax(0, 1fr) !important;
  gap: 13px !important;
  align-items: start !important;
  padding: 15px 16px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 34%),
    rgba(0,0,0,.19) !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.bda-value-clean:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(185,255,59,.34) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.25) !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.25),
    0 0 18px rgba(185,255,59,.055) !important;
}

.bda-value-dot {
  width: 8px !important;
  height: 8px !important;
  margin-top: 7px !important;
  border-radius: 999px !important;
  background: #B9FF3B !important;
  box-shadow: 0 0 15px rgba(185,255,59,.75) !important;
}

.bda-value-clean h3 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 18px !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}

.bda-value-clean p {
  margin: 6px 0 0 !important;
  color: #c9d3c4 !important;
  font-size: 13.5px !important;
  line-height: 1.58 !important;
}

/* Library Structure — force real homepage chip styling */
.bda-library-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  margin-top: 18px !important;
}

.bda-library-chips .bdh-chip,
.bda-library-chips .bd-chip {
  clip-path: none !important;
  border-radius: 10px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .4rem !important;

  min-height: 34px !important;
  padding: .45rem .8rem !important;

  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #e5e7eb !important;

  font-size: .80rem !important;
  font-weight: 550 !important;
  line-height: 1 !important;
  text-decoration: none !important;

  position: relative !important;
  overflow: hidden !important;

  transform: skewX(-6deg) !important;
  transition:
    transform .15s ease,
    background .15s ease,
    border-color .15s ease,
    box-shadow .15s ease,
    color .15s ease !important;
}

.bda-library-chips .bdh-chip > span,
.bda-library-chips .bd-chip > span {
  transform: skewX(6deg) !important;
}

.bda-library-chips .bdh-dot,
.bda-library-chips .dot {
  width: .55rem !important;
  height: .55rem !important;
  border-radius: 999px !important;
  flex: 0 0 auto !important;
  box-shadow: 0 0 12px rgba(255,255,255,.08) !important;
}

.bda-library-chips .bdh-chip:hover,
.bda-library-chips .bd-chip:hover {
  transform: skewX(-6deg) translateY(-1px) !important;
  background: rgba(255,255,255,.06) !important;
  border-color: #B9FF3B !important;
  color: #fff !important;
  box-shadow:
    0 12px 24px rgba(0,0,0,.22),
    0 0 16px rgba(185,255,59,.08) !important;
}

/* Keep inline chip colors visible before hover */
.bda-library-chips .bdh-chip[style]:not(:hover),
.bda-library-chips .bd-chip[style]:not(:hover) {
  border-color: inherit;
}

/* Mobile */
@media (max-width: 640px) {
  .bda-value-clean {
    padding: 13px 14px !important;
  }

  .bda-value-clean h3 {
    font-size: 17px !important;
  }

  .bda-value-clean p {
    font-size: 13.5px !important;
  }

  .bda-library-chips .bdh-chip,
  .bda-library-chips .bd-chip {
    min-height: 36px !important;
    padding: .5rem .78rem !important;
    font-size: .80rem !important;
  }
}

:root {
  --bdc-accent: #B9FF3B;
  --bdc-bg: #050706;
  --bdc-panel: #111410;
  --bdc-border: rgba(255,255,255,.095);
  --bdc-muted: #c9d3c4;
  --bdc-dim: #94a08f;
  --bdc-text: #f7faf4;
  --bdc-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bdc-radius: 16px;
}

.bdc-stage,
.bdc-stage * {
  box-sizing: border-box;
}

.bdc-stage {
  position: relative;
  isolation: isolate;
  color: var(--bdc-text);
  background:
    radial-gradient(circle at 9% 3%, rgba(185,255,59,.12), transparent 32%),
    radial-gradient(circle at 94% 82%, rgba(185,255,59,.16), transparent 34%),
    radial-gradient(circle at 88% 14%, rgba(64,106,255,.045), transparent 31%),
    linear-gradient(180deg, #050706 0%, #070908 48%, #050706 100%);
  overflow: hidden;
}

.bdc-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 22%, transparent 78%, rgba(255,255,255,.012)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0, rgba(255,255,255,.012) 1px, transparent 1px, transparent 7px);
  opacity: .26;
  pointer-events: none;
}

.bdc-shell {
  width: min(100% - 44px, 1180px);
  margin-inline: auto;
  padding: 42px 0 88px;
}

.bdc-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--bdc-border);
  border-radius: var(--bdc-radius);
  background:
    radial-gradient(circle at 10% 0%, rgba(185,255,59,.065), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    var(--bdc-panel);
  box-shadow: var(--bdc-shadow);
}

.bdc-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.07), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.026), transparent 34%);
  pointer-events: none;
  opacity: .9;
}

.bdc-panel > * {
  position: relative;
  z-index: 2;
}

.bdc-hover {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.bdc-hover:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.24);
  box-shadow:
    0 32px 86px rgba(0,0,0,.48),
    0 0 42px rgba(185,255,59,.04);
}

.bdc-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--bdc-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.bdc-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--bdc-accent);
  box-shadow: 0 0 16px rgba(185,255,59,.82);
}

.bdc-stage h1,
.bdc-stage h2,
.bdc-stage h3 {
  margin: 0;
  color: #fff;
  line-height: 1.02 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}

.bdc-stage h1 {
  max-width: 850px;
  font-size: clamp(46px, 5vw, 78px) !important;
}

.bdc-stage h2 {
  font-size: clamp(30px, 3vw, 44px) !important;
}

.bdc-stage h3 {
  font-size: clamp(21px, 2vw, 30px) !important;
}

.bdc-stage p,
.bdc-stage li {
  color: var(--bdc-muted);
  font-size: 15px;
  line-height: 1.72;
}

.bdc-stage a {
  color: inherit;
}

.bdc-hero {
  padding: 34px;
  background:
    radial-gradient(circle at 94% 13%, rgba(185,255,59,.15), transparent 34%),
    linear-gradient(135deg, rgba(185,255,59,.09), rgba(255,255,255,.022) 42%, rgba(255,255,255,.035)),
    #111510;
}

.bdc-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(310px, .82fr);
  gap: 30px;
  align-items: center;
}

.bdc-hero-copy p {
  max-width: 840px;
  margin: 18px 0 0;
}

.bdc-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.bdc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 17px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 950;
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease, filter .18s ease;
}

.bdc-btn:hover {
  transform: translateY(-2px);
}

.bdc-btn.primary {
  border: 1px solid rgba(185,255,59,.58);
  background: var(--bdc-accent);
  color: #071008 !important;
  box-shadow: 0 0 26px rgba(185,255,59,.24);
}

.bdc-btn.primary:hover {
  background: #c8ff58;
  color: #071008 !important;
  box-shadow: 0 0 38px rgba(185,255,59,.38);
}

.bdc-btn.ghost {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.045);
  color: #f8fbf3 !important;
}

.bdc-btn.ghost:hover {
  border-color: rgba(185,255,59,.42);
  background: rgba(185,255,59,.08);
  color: #fff !important;
}

.bdc-quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 20px;
}

.bdc-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 34px;
  padding: .45rem .8rem;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.12);
  color: #e5e7eb !important;
  font-size: .80rem;
  font-weight: 550;
  line-height: 1;
  text-decoration: none !important;
  transform: skewX(-6deg);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}

.bdc-chip > span {
  transform: skewX(6deg);
}

.bdc-chip .dot {
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: var(--bdc-accent);
  box-shadow: 0 0 12px rgba(185,255,59,.32);
}

.bdc-chip:hover {
  transform: skewX(-6deg) translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: var(--bdc-accent);
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.22), 0 0 16px rgba(185,255,59,.08);
}

.bdc-support-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.22);
}

.bdc-support-card strong {
  display: block;
  color: #fff;
  font-size: clamp(30px, 3.3vw, 48px);
  line-height: .95;
  letter-spacing: -.045em;
}

.bdc-support-card > span {
  display: block;
  margin-top: 10px;
  color: var(--bdc-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bdc-proof-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 18px;
}

.bdc-proof-item {
  min-height: 82px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(255,255,255,.035);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdc-proof-item:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 38%),
    rgba(255,255,255,.05);
  box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 18px rgba(185,255,59,.055);
}

.bdc-proof-item b {
  display: block;
  color: #fff;
  font-size: 14px;
  line-height: 1.15;
}

.bdc-proof-item small {
  display: block;
  margin-top: 6px;
  color: var(--bdc-dim);
  font-size: 12px;
  line-height: 1.35;
}

.bdc-section {
  padding: 30px;
  margin-top: 22px;
}

.bdc-section-head {
  max-width: 840px;
  margin-bottom: 22px;
}

.bdc-section-head p {
  margin: 12px 0 0;
}

.bdc-two,
.bdc-form-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 18px;
}

.bdc-card,
.bdc-form-card,
.bdc-rights-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(0,0,0,.19);
}

.bdc-card h3 {
  margin-bottom: 14px;
}

.bdc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}

.bdc-list li {
  position: relative;
  padding: 10px 13px 10px 38px;
  border-radius: 11px;
  background: rgba(0,0,0,.19);
  border: 1px solid rgba(255,255,255,.085);
  color: #d3dccd;
  font-size: 14px;
  line-height: 1.58;
}

.bdc-list li::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 18px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--bdc-accent);
  box-shadow: 0 0 15px rgba(185,255,59,.75);
}

.bdc-list strong,
.bdc-mini strong,
.bdc-note strong {
  color: #fff;
  font-weight: 900;
}

.bdc-note {
  margin: 16px 0 0;
  color: #d7ded0;
  font-size: 13.5px;
  line-height: 1.62;
}

.bdc-mini {
  display: grid;
  gap: 10px;
}

.bdc-mini p {
  margin: 0;
  padding: 14px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 34%),
    rgba(0,0,0,.19);
  font-size: 13.5px;
  line-height: 1.62;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdc-mini p:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.25);
}

.bdc-stage a:not(.bdc-btn):not(.bdc-chip):not(.bdc-nav-card) {
  color: #f0f7e9 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(185,255,59,.24);
}

.bdc-stage a:not(.bdc-btn):not(.bdc-chip):not(.bdc-nav-card):hover {
  color: #fff !important;
  border-bottom-color: rgba(185,255,59,.66);
}

.bdc-form-section {
  background:
    radial-gradient(circle at 92% 82%, rgba(185,255,59,.16), transparent 36%),
    linear-gradient(135deg, rgba(185,255,59,.08), rgba(255,255,255,.025)),
    #11150f;
}

.bdc-form-copy p {
  margin: 12px 0 0;
}

.bdc-form-foot {
  color: #d7ded0 !important;
}

.bdc-sub {
  color: var(--bdc-dim) !important;
  font-size: 13.5px !important;
}

.bdc-form-wrap {
  width: 100%;
}

.bdc-form-wrap input,
.bdc-form-wrap textarea,
.bdc-form-wrap select,
.bdc-form-wrap button {
  border-radius: 10px !important;
}

.bdc-form-wrap input,
.bdc-form-wrap textarea,
.bdc-form-wrap select {
  background: rgba(0,0,0,.24) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
}

.bdc-form-wrap label,
.bdc-form-wrap .ff-el-form-check-label,
.bdc-form-wrap .ff-el-input--label label {
  color: #d7ded0 !important;
}

.bdc-form-wrap button,
.bdc-form-wrap .ff-btn-submit {
  border: 1px solid rgba(185,255,59,.58) !important;
  background: var(--bdc-accent) !important;
  color: #071008 !important;
  font-weight: 950 !important;
  box-shadow: 0 0 26px rgba(185,255,59,.24) !important;
}

.bdc-faq {
  display: grid;
  gap: 9px;
}

.bdc-faq details {
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 11px;
  background: rgba(0,0,0,.19);
  overflow: hidden;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.bdc-faq details:hover {
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 50%, rgba(185,255,59,.08), transparent 30%),
    rgba(0,0,0,.22);
}

.bdc-faq details[open] {
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 34%),
    rgba(0,0,0,.26);
  box-shadow: 0 0 28px rgba(185,255,59,.06);
}

.bdc-faq summary {
  cursor: pointer;
  padding: 17px 18px;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  list-style: none;
}

.bdc-faq summary::-webkit-details-marker {
  display: none;
}

.bdc-faq summary::after {
  content: "+";
  float: right;
  color: var(--bdc-accent);
  font-weight: 950;
}

.bdc-faq details[open] summary::after {
  content: "–";
}

.bdc-faq details p {
  margin: 0;
  padding: 0 18px 18px;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.72;
}

.bdc-nav-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}

.bdc-nav-card {
  min-height: 150px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    rgba(0,0,0,.2);
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdc-nav-card:hover {
  transform: translateY(-3px);
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.28);
  box-shadow: 0 20px 46px rgba(0,0,0,.32);
}

.bdc-nav-title {
  display: block;
  color: #fff;
  font-size: 21px;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.bdc-nav-sub {
  display: block;
  margin-top: 10px;
  color: var(--bdc-muted);
  font-size: 13.5px;
  line-height: 1.55;
}

.bdc-nav-arrow {
  display: inline-flex;
  margin-top: 18px;
  color: var(--bdc-accent);
  font-size: 20px;
  font-weight: 950;
}

@media (max-width: 980px) {
  .bdc-shell {
    width: min(100% - 28px, 1180px);
    padding: 30px 0 72px;
  }

  .bdc-hero-grid,
  .bdc-two,
  .bdc-form-grid {
    grid-template-columns: 1fr;
  }

  .bdc-nav-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 640px) {
  .bdc-shell {
    width: min(100% - 22px, 1180px);
    padding: 28px 0 64px;
  }

  .bdc-hero,
  .bdc-section {
    padding: 18px;
    border-radius: 14px;
  }

  .bdc-stage h1 {
    font-size: 42px !important;
    line-height: 1.02 !important;
  }

  .bdc-stage p,
  .bdc-stage li {
    font-size: 14px;
    line-height: 1.66;
  }

  .bdc-hero-actions {
    display: grid;
  }

  .bdc-btn {
    width: 100%;
  }

  .bdc-proof-list,
  .bdc-nav-grid {
    grid-template-columns: 1fr;
  }

  .bdc-chip {
    min-height: 36px;
    padding: .5rem .78rem;
    font-size: .80rem;
  }

  .bdc-list li {
    padding: 10px 12px 10px 36px;
    font-size: 13.5px;
    line-height: 1.55;
  }

  .bdc-list li::before {
    top: 17px;
    width: 7px;
    height: 7px;
  }
}

:root {
  --bds-accent: #B9FF3B;
  --bds-bg: #050706;
  --bds-panel: #111410;
  --bds-border: rgba(255,255,255,.095);
  --bds-muted: #c9d3c4;
  --bds-dim: #94a08f;
  --bds-text: #f7faf4;
  --bds-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bds-radius: 16px;
}

.bds-stage,
.bds-stage * {
  box-sizing: border-box;
}

.bds-stage {
  position: relative;
  isolation: isolate;
  color: var(--bds-text);
  background:
    radial-gradient(circle at 9% 3%, rgba(185,255,59,.12), transparent 32%),
    radial-gradient(circle at 94% 82%, rgba(185,255,59,.16), transparent 34%),
    radial-gradient(circle at 88% 14%, rgba(64,106,255,.045), transparent 31%),
    linear-gradient(180deg, #050706 0%, #070908 48%, #050706 100%);
  overflow: hidden;
}

.bds-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 22%, transparent 78%, rgba(255,255,255,.012)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0, rgba(255,255,255,.012) 1px, transparent 1px, transparent 7px);
  opacity: .26;
  pointer-events: none;
}

.bds-shell {
  width: min(100% - 44px, 1180px);
  margin-inline: auto;
  padding: 42px 0 88px;
}

.bds-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--bds-border);
  border-radius: var(--bds-radius);
  background:
    radial-gradient(circle at 10% 0%, rgba(185,255,59,.065), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    var(--bds-panel);
  box-shadow: var(--bds-shadow);
}

.bds-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.07), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.026), transparent 34%);
  pointer-events: none;
  opacity: .9;
}

.bds-panel > * {
  position: relative;
  z-index: 2;
}

.bds-hover {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.bds-hover:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.24);
  box-shadow:
    0 32px 86px rgba(0,0,0,.48),
    0 0 42px rgba(185,255,59,.04);
}

.bds-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--bds-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.bds-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--bds-accent);
  box-shadow: 0 0 16px rgba(185,255,59,.82);
}

.bds-stage h1,
.bds-stage h2,
.bds-stage h3 {
  margin: 0;
  color: #fff;
  line-height: 1.02 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}

.bds-stage h1 {
  max-width: 850px;
  font-size: clamp(46px, 5vw, 78px) !important;
}

.bds-stage h2 {
  font-size: clamp(30px, 3vw, 44px) !important;
}

.bds-stage h3 {
  font-size: clamp(21px, 2vw, 30px) !important;
}

.bds-stage p {
  color: var(--bds-muted);
  font-size: 15px;
  line-height: 1.72;
}

.bds-stage a {
  color: inherit;
}

.bds-hero {
  padding: 34px;
  background:
    radial-gradient(circle at 94% 13%, rgba(185,255,59,.15), transparent 34%),
    linear-gradient(135deg, rgba(185,255,59,.09), rgba(255,255,255,.022) 42%, rgba(255,255,255,.035)),
    #111510;
}

.bds-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(310px, .82fr);
  gap: 30px;
  align-items: center;
}

.bds-hero-copy p {
  max-width: 840px;
  margin: 18px 0 0;
}

.bds-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.bds-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 17px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 950;
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease, filter .18s ease;
}

.bds-btn:hover {
  transform: translateY(-2px);
}

.bds-btn.primary {
  border: 1px solid rgba(185,255,59,.58);
  background: var(--bds-accent);
  color: #071008 !important;
  box-shadow: 0 0 26px rgba(185,255,59,.24);
}

.bds-btn.primary:hover {
  background: #c8ff58;
  color: #071008 !important;
  box-shadow: 0 0 38px rgba(185,255,59,.38);
}

.bds-btn.ghost {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.045);
  color: #f8fbf3 !important;
}

.bds-btn.ghost:hover {
  border-color: rgba(185,255,59,.42);
  background: rgba(185,255,59,.08);
  color: #fff !important;
}

.bds-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 20px;
}

.bds-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 34px;
  padding: .45rem .8rem;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.12);
  color: #e5e7eb !important;
  font-size: .80rem;
  font-weight: 550;
  line-height: 1;
  text-decoration: none !important;
  transform: skewX(-6deg);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}

.bds-chip > span {
  transform: skewX(6deg);
}

.bds-chip .dot {
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: var(--bds-accent);
  box-shadow: 0 0 12px rgba(185,255,59,.32);
}

.bds-chip:hover {
  transform: skewX(-6deg) translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: var(--bds-accent);
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.22), 0 0 16px rgba(185,255,59,.08);
}

.bds-hero-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.22);
}

.bds-hero-card strong {
  display: block;
  color: #fff;
  font-size: clamp(30px, 3.3vw, 48px);
  line-height: .95;
  letter-spacing: -.045em;
}

.bds-hero-card > span {
  display: block;
  margin-top: 10px;
  color: var(--bds-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bds-proof-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 18px;
}

.bds-proof {
  min-height: 82px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(255,255,255,.035);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bds-proof:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 38%),
    rgba(255,255,255,.05);
  box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 18px rgba(185,255,59,.055);
}

.bds-proof b {
  display: block;
  color: #fff;
  font-size: 14px;
  line-height: 1.15;
}

.bds-proof small {
  display: block;
  margin-top: 6px;
  color: var(--bds-dim);
  font-size: 12px;
  line-height: 1.35;
}

.bds-section {
  padding: 30px;
  margin-top: 22px;
}

.bds-section-head {
  max-width: 860px;
  margin-bottom: 22px;
}

.bds-section-head p {
  margin: 12px 0 0;
}

.bds-showcase {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}

.bds-setup-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.06), transparent 36%),
    rgba(0,0,0,.2);
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.bds-setup-card:hover {
  transform: translateY(-4px);
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.28);
  box-shadow: 0 24px 58px rgba(0,0,0,.42), 0 0 0 1px rgba(185,255,59,.12) inset;
}

.bds-setup-card-featured {
  grid-column: span 2;
}

.bds-setup-image {
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-bottom: 1px solid rgba(255,255,255,.085);
}

.bds-setup-card-featured .bds-setup-image {
  aspect-ratio: 16 / 8.6;
}

.bds-setup-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .32s ease, filter .32s ease;
}

.bds-setup-card:hover .bds-setup-image img {
  transform: scale(1.025);
  filter: saturate(1.04) contrast(1.03);
}

.bds-setup-body {
  padding: 16px;
}

.bds-tag {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--bds-accent);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bds-setup-body h3 {
  font-size: 24px !important;
  line-height: 1.04 !important;
}

.bds-setup-body p {
  margin: 10px 0 0;
  font-size: 13.5px;
  line-height: 1.6;
}

.bds-setup-body dl {
  display: grid;
  gap: 7px;
  margin: 14px 0 0;
}

.bds-setup-body dl div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-top: 7px;
  border-top: 1px solid rgba(255,255,255,.075);
}

.bds-setup-body dt {
  color: var(--bds-dim);
  font-size: 12px;
  font-weight: 850;
}

.bds-setup-body dd {
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 850;
  text-align: right;
}

.bds-mini-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  margin-top: 15px;
  padding: 0 13px;
  border-radius: 10px;
  border: 1px solid rgba(185,255,59,.52);
  background: rgba(185,255,59,.11);
  color: #fff !important;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none !important;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}

.bds-mini-btn:hover {
  transform: translateY(-2px);
  border-color: var(--bds-accent);
  background: rgba(185,255,59,.17);
}

.bds-three {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.bds-info-card,
.bds-copy-card {
  padding: 20px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 36%),
    rgba(0,0,0,.19);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bds-info-card:hover,
.bds-copy-card:hover {
  transform: translateY(-3px);
  border-color: rgba(185,255,59,.38);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.26);
  box-shadow: 0 20px 46px rgba(0,0,0,.32), 0 0 18px rgba(185,255,59,.055);
}

.bds-info-card h3 {
  font-size: 22px !important;
}

.bds-info-card p,
.bds-copy-card p {
  margin: 10px 0 0;
  font-size: 13.5px;
  line-height: 1.62;
}

.bds-info-card a {
  display: inline-flex;
  margin-top: 14px;
  color: #fff !important;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(185,255,59,.32);
}

.bds-info-card a:hover {
  border-bottom-color: rgba(185,255,59,.75);
}

.bds-two {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 18px;
}

.bds-benefits {
  display: grid;
  gap: 10px;
}

.bds-benefit {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr);
  gap: 13px;
  align-items: start;
  padding: 14px 15px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 34%),
    rgba(0,0,0,.19);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bds-benefit:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.25);
  box-shadow: 0 16px 34px rgba(0,0,0,.25), 0 0 18px rgba(185,255,59,.055);
}

.bds-benefit span {
  width: 8px;
  height: 8px;
  margin-top: 8px;
  border-radius: 999px;
  background: var(--bds-accent);
  box-shadow: 0 0 15px rgba(185,255,59,.75);
}

.bds-benefit p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.58;
}

.bds-benefit strong {
  color: #fff;
  font-weight: 900;
}

.bds-faq {
  display: grid;
  gap: 9px;
}

.bds-faq details {
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 11px;
  background: rgba(0,0,0,.19);
  overflow: hidden;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.bds-faq details:hover {
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 50%, rgba(185,255,59,.08), transparent 30%),
    rgba(0,0,0,.22);
}

.bds-faq details[open] {
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 34%),
    rgba(0,0,0,.26);
  box-shadow: 0 0 28px rgba(185,255,59,.06);
}

.bds-faq summary {
  cursor: pointer;
  padding: 17px 18px;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  list-style: none;
}

.bds-faq summary::-webkit-details-marker {
  display: none;
}

.bds-faq summary::after {
  content: "+";
  float: right;
  color: var(--bds-accent);
  font-weight: 950;
}

.bds-faq details[open] summary::after {
  content: "–";
}

.bds-faq details p {
  margin: 0;
  padding: 0 18px 18px;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.72;
}

.bds-final {
  padding: 34px;
  margin-top: 22px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 100%, rgba(185,255,59,.15), transparent 36%),
    linear-gradient(135deg, rgba(185,255,59,.08), rgba(255,255,255,.025)),
    #11150f;
}

.bds-final h2 {
  max-width: 760px;
  margin-inline: auto;
}

.bds-final p {
  max-width: 720px;
  margin: 14px auto 0;
}

.bds-nav-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-top: 22px;
  text-align: left;
}

.bds-nav-card {
  min-height: 150px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    rgba(0,0,0,.2);
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bds-nav-card:hover {
  transform: translateY(-3px);
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.28);
  box-shadow: 0 20px 46px rgba(0,0,0,.32);
}

.bds-nav-title {
  display: block;
  color: #fff;
  font-size: 21px;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.bds-nav-sub {
  display: block;
  margin-top: 10px;
  color: var(--bds-muted);
  font-size: 13.5px;
  line-height: 1.55;
}

.bds-nav-arrow {
  display: inline-flex;
  margin-top: 18px;
  color: var(--bds-accent);
  font-size: 20px;
  font-weight: 950;
}

@media (max-width: 980px) {
  .bds-shell {
    width: min(100% - 28px, 1180px);
    padding: 30px 0 72px;
  }

  .bds-hero-grid,
  .bds-two {
    grid-template-columns: 1fr;
  }

  .bds-showcase,
  .bds-three,
  .bds-nav-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .bds-setup-card-featured {
    grid-column: span 2;
  }
}

@media (max-width: 640px) {
  .bds-shell {
    width: min(100% - 22px, 1180px);
    padding: 28px 0 64px;
  }

  .bds-hero,
  .bds-section,
  .bds-final {
    padding: 18px;
    border-radius: 14px;
  }

  .bds-stage h1 {
    font-size: 42px !important;
    line-height: 1.02 !important;
  }

  .bds-stage p {
    font-size: 14px;
    line-height: 1.66;
  }

  .bds-hero-actions {
    display: grid;
  }

  .bds-btn {
    width: 100%;
  }

  .bds-proof-grid,
  .bds-showcase,
  .bds-three,
  .bds-nav-grid {
    grid-template-columns: 1fr;
  }

  .bds-setup-card-featured {
    grid-column: auto;
  }

  .bds-setup-card-featured .bds-setup-image,
  .bds-setup-image {
    aspect-ratio: 16 / 10;
  }

  .bds-chip {
    min-height: 36px;
    padding: .5rem .78rem;
    font-size: .80rem;
  }
}

/* =========================================================
   DESKTOP SETUPS — BENEFIT ROW + DISPLAY CARD ALIGNMENT
   ========================================================= */

/* 1) Benefit rows: centered, balanced, not stuck to the top */
.bds-benefits {
  display: grid !important;
  gap: 12px !important;
}

.bds-benefit {
  min-height: 76px !important;
  align-items: center !important;
  padding: 15px 16px !important;
}

.bds-benefit span {
  margin-top: 0 !important;
  align-self: center !important;
}

.bds-benefit p {
  margin: 0 !important;
  font-size: 13.75px !important;
  line-height: 1.6 !important;
}

/* 2) Display type cards: keep CTA links aligned across all cards */
.bds-three {
  align-items: stretch !important;
}

.bds-info-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 255px !important;
}

.bds-info-card p {
  margin-bottom: 16px !important;
}

.bds-info-card a {
  margin-top: auto !important;
  align-self: flex-start !important;
  line-height: 1.2 !important;
}

/* Mobile: keep cards natural, but still clean */
@media (max-width: 640px) {
  .bds-benefit {
    min-height: 0 !important;
    padding: 14px 15px !important;
  }

  .bds-info-card {
    min-height: 0 !important;
  }
}

/* =========================================================
   BACKDROVA ABOUT — OFFICIAL BADGE + EST. 2025 STAMP
   ========================================================= */

.bda-brand-card {
  position: relative !important;
}

.bda-est-stamp {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  z-index: 3 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 5px 12px 6px !important;
  border-radius: 999px !important;

  color: #B9FF3B !important;
  border: 1px solid rgba(185,255,59,.34) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(185,255,59,.16), transparent 62%),
    rgba(0,0,0,.28) !important;

  font-family: "Brush Script MT", "Segoe Script", "Snell Roundhand", cursive !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .01em !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 20px rgba(185,255,59,.08) !important;

  transform: rotate(-4deg) !important;
}

.bda-proof-official {
  position: relative !important;
  overflow: hidden !important;
}

.bda-official-badge {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;

  margin: 0 0 9px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;

  color: #071008 !important;
  background: #B9FF3B !important;
  border: 1px solid rgba(185,255,59,.7) !important;

  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;

  box-shadow: 0 0 18px rgba(185,255,59,.22) !important;
}

.bda-proof-official::after {
  content: "";
  position: absolute;
  right: -22px;
  bottom: -22px;
  width: 76px;
  height: 76px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(185,255,59,.16), transparent 64%);
  pointer-events: none;
}

@media (max-width: 640px) {
  .bda-est-stamp {
    top: 14px !important;
    right: 14px !important;
    font-size: 18px !important;
    padding: 5px 10px 6px !important;
  }

  .bda-brand-card strong {
    padding-right: 74px !important;
  }
}

/* =========================================================
   ABOUT — OFFICIAL CARD BADGE REFINEMENT
   Keeps badge, stops it from pushing card content down
   ========================================================= */

.bda-proof-official {
  position: relative !important;
  padding: 14px !important;
}

.bda-proof-official .bda-official-badge {
  position: absolute !important;
  top: 11px !important;
  right: 11px !important;

  margin: 0 !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;

  font-size: 8px !important;
  line-height: 1 !important;
  letter-spacing: .075em !important;
  white-space: nowrap !important;

  background: #B9FF3B !important;
  color: #071008 !important;
  box-shadow: 0 0 14px rgba(185,255,59,.24) !important;
}

.bda-proof-official b {
  padding-right: 72px !important;
}

.bda-proof-official small {
  max-width: 100% !important;
}

:root {
  --bdcol-accent: #B9FF3B;
  --bdcol-bg: #050706;
  --bdcol-panel: #111410;
  --bdcol-border: rgba(255,255,255,.095);
  --bdcol-muted: #c9d3c4;
  --bdcol-dim: #94a08f;
  --bdcol-text: #f7faf4;
  --bdcol-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bdcol-radius: 16px;
}

.bdcol-stage,
.bdcol-stage * {
  box-sizing: border-box;
}

.bdcol-stage {
  position: relative;
  isolation: isolate;
  color: var(--bdcol-text);
  background:
    radial-gradient(circle at 9% 3%, rgba(185,255,59,.12), transparent 32%),
    radial-gradient(circle at 94% 82%, rgba(185,255,59,.16), transparent 34%),
    radial-gradient(circle at 88% 14%, rgba(64,106,255,.045), transparent 31%),
    linear-gradient(180deg, #050706 0%, #070908 48%, #050706 100%);
  overflow: hidden;
}

.bdcol-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 22%, transparent 78%, rgba(255,255,255,.012)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0, rgba(255,255,255,.012) 1px, transparent 1px, transparent 7px);
  opacity: .26;
}

.bdcol-shell {
  width: min(100% - 44px, 1180px);
  margin-inline: auto;
  padding: 42px 0 88px;
}

.bdcol-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--bdcol-border);
  border-radius: var(--bdcol-radius);
  background:
    radial-gradient(circle at 10% 0%, rgba(185,255,59,.065), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    var(--bdcol-panel);
  box-shadow: var(--bdcol-shadow);
}

.bdcol-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.07), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.026), transparent 34%);
  opacity: .9;
}

.bdcol-panel > * {
  position: relative;
  z-index: 2;
}

.bdcol-hover {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.bdcol-hover:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.24);
  box-shadow:
    0 32px 86px rgba(0,0,0,.48),
    0 0 42px rgba(185,255,59,.04);
}

.bdcol-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--bdcol-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.bdcol-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--bdcol-accent);
  box-shadow: 0 0 16px rgba(185,255,59,.82);
}

.bdcol-stage h1,
.bdcol-stage h2,
.bdcol-stage h3 {
  margin: 0;
  color: #fff;
  line-height: 1.02 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}

.bdcol-stage h1 {
  max-width: 850px;
  font-size: clamp(46px, 5vw, 78px) !important;
}

.bdcol-stage h2 {
  font-size: clamp(30px, 3vw, 44px) !important;
}

.bdcol-stage h3 {
  font-size: clamp(21px, 2vw, 30px) !important;
}

.bdcol-stage p,
.bdcol-stage li {
  color: var(--bdcol-muted);
  font-size: 15px;
  line-height: 1.72;
}

.bdcol-stage a {
  color: inherit;
}

/* HERO */
.bdcol-hero {
  padding: 34px;
  background:
    radial-gradient(circle at 94% 13%, rgba(185,255,59,.15), transparent 34%),
    linear-gradient(135deg, rgba(185,255,59,.09), rgba(255,255,255,.022) 42%, rgba(255,255,255,.035)),
    #111510;
}

.bdcol-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(310px, .82fr);
  gap: 30px;
  align-items: center;
}

.bdcol-hero-copy p {
  max-width: 860px;
  margin: 18px 0 0;
}

.bdcol-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.bdcol-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 17px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 950;
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease, filter .18s ease;
}

.bdcol-btn:hover {
  transform: translateY(-2px);
}

.bdcol-btn.primary {
  border: 1px solid rgba(185,255,59,.58);
  background: var(--bdcol-accent);
  color: #071008 !important;
  box-shadow: 0 0 26px rgba(185,255,59,.24);
}

.bdcol-btn.primary:hover {
  background: #c8ff58;
  color: #071008 !important;
  box-shadow: 0 0 38px rgba(185,255,59,.38);
}

.bdcol-btn.ghost {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.045);
  color: #f8fbf3 !important;
}

.bdcol-btn.ghost:hover {
  border-color: rgba(185,255,59,.42);
  background: rgba(185,255,59,.08);
  color: #fff !important;
}

/* Chips */
.bdcol-chips,
.bdcol-color-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 20px;
}

.bdcol-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 34px;
  padding: .45rem .8rem;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.12);
  color: #e5e7eb !important;
  font-size: .80rem;
  font-weight: 550;
  line-height: 1;
  text-decoration: none !important;
  transform: skewX(-6deg);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}

.bdcol-chip > span {
  transform: skewX(6deg);
}

.bdcol-chip .dot {
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: var(--bdcol-accent);
  box-shadow: 0 0 12px rgba(185,255,59,.32);
}

.bdcol-chip:hover {
  transform: skewX(-6deg) translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: var(--bdcol-accent) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.22), 0 0 16px rgba(185,255,59,.08);
}

/* Hero card */
.bdcol-brand-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.22);
}

.bdcol-brand-card > strong {
  display: block;
  color: #fff;
  font-size: clamp(30px, 3.3vw, 48px);
  line-height: .95;
  letter-spacing: -.045em;
}

.bdcol-brand-card > span {
  display: block;
  margin-top: 10px;
  color: var(--bdcol-accent);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bdcol-brand-card > p {
  margin: 14px 0 0;
  font-size: 13.5px;
  line-height: 1.62;
}

.bdcol-proof-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 18px;
}

.bdcol-proof-item {
  min-height: 82px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(255,255,255,.035);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdcol-proof-item:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 38%),
    rgba(255,255,255,.05);
  box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 18px rgba(185,255,59,.055);
}

.bdcol-proof-item b {
  display: block;
  color: #fff;
  font-size: 14px;
  line-height: 1.15;
}

.bdcol-proof-item small {
  display: block;
  margin-top: 6px;
  color: var(--bdcol-dim);
  font-size: 12px;
  line-height: 1.35;
}

/* Sections */
.bdcol-section {
  padding: 30px;
  margin-top: 22px;
}

.bdcol-section-head {
  max-width: 860px;
  margin-bottom: 22px;
}

.bdcol-section-head p {
  margin: 12px 0 0;
}

.bdcol-featured {
  background:
    radial-gradient(circle at 92% 18%, rgba(185,255,59,.14), transparent 32%),
    linear-gradient(135deg, rgba(185,255,59,.085), rgba(255,255,255,.022) 42%, rgba(255,255,255,.035)),
    #111510;
}

/* Popular collections shortcode styling */
.bdcol-shortcode-wrap {
  margin-top: 18px;
}

.bdcol-shortcode-wrap .bd-collections,
.bdcol-shortcode-wrap {
  width: 100%;
}

.bdcol-shortcode-wrap .bd-col-card {
  min-height: 76px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 36%),
    rgba(0,0,0,.18) !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
}

.bdcol-shortcode-wrap .bd-col-card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(185,255,59,.42) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.28) !important;
  box-shadow: 0 20px 46px rgba(0,0,0,.32) !important;
}

.bdcol-shortcode-wrap .bd-col-thumb {
  border-radius: 10px !important;
  overflow: hidden !important;
}

.bdcol-shortcode-wrap .bd-col-name {
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  letter-spacing: -.025em !important;
}

.bdcol-shortcode-wrap .bd-col-count {
  color: #c9d3c4 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

/* Grids */
.bdcol-two {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 18px;
}

.bdcol-copy-card,
.bdcol-card,
.bdcol-request-card {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background: rgba(0,0,0,.19);
}

.bdcol-copy-card p {
  margin: 12px 0 0;
}

.bdcol-copy-card a,
.bdcol-faq a {
  color: #f0f7e9 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(185,255,59,.24);
}

.bdcol-copy-card a:hover,
.bdcol-faq a:hover {
  border-bottom-color: rgba(185,255,59,.66);
}

.bdcol-benefits {
  display: grid;
  gap: 10px;
}

.bdcol-benefit {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr);
  gap: 13px;
  align-items: center;
  min-height: 76px;
  padding: 15px 16px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 34%),
    rgba(0,0,0,.19);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdcol-benefit:hover {
  transform: translateY(-2px);
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 36%),
    rgba(0,0,0,.25);
}

.bdcol-benefit span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--bdcol-accent);
  box-shadow: 0 0 15px rgba(185,255,59,.75);
}

.bdcol-benefit p {
  margin: 0;
  font-size: 13.75px;
  line-height: 1.6;
}

.bdcol-benefit strong {
  color: #fff;
  font-weight: 900;
}

.bdcol-path-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}

.bdcol-path-card,
.bdcol-device-grid a {
  min-height: 170px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    rgba(0,0,0,.2);
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.bdcol-path-card:hover,
.bdcol-device-grid a:hover {
  transform: translateY(-3px);
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.13), transparent 36%),
    rgba(0,0,0,.28);
  box-shadow: 0 20px 46px rgba(0,0,0,.32);
}

.bdcol-path-card em {
  display: block;
  color: var(--bdcol-accent);
  font-style: normal;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bdcol-path-card strong,
.bdcol-device-grid strong {
  display: block;
  margin-top: 10px;
  color: #fff;
  font-size: 21px;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.bdcol-path-card span,
.bdcol-device-grid span {
  display: block;
  margin-top: 10px;
  color: var(--bdcol-muted);
  font-size: 13.5px;
  line-height: 1.55;
}

.bdcol-card p {
  margin: 12px 0 0;
}

.bdcol-device-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 18px;
}

.bdcol-device-grid a {
  min-height: 120px;
}

/* Request */
.bdcol-request {
  background:
    radial-gradient(circle at 92% 82%, rgba(185,255,59,.16), transparent 36%),
    linear-gradient(135deg, rgba(185,255,59,.08), rgba(255,255,255,.025)),
    #11150f;
}

.bdcol-request-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 20px;
  align-items: center;
}

.bdcol-request p {
  margin: 12px 0 0;
}

.bdcol-request-card strong {
  display: block;
  color: #fff;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.bdcol-request-card .bdcol-btn {
  margin-top: 16px;
}

/* FAQ */
.bdcol-faq {
  display: grid;
  gap: 9px;
}

.bdcol-faq details {
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 11px;
  background: rgba(0,0,0,.19);
  overflow: hidden;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.bdcol-faq details:hover {
  border-color: rgba(185,255,59,.34);
  background:
    radial-gradient(circle at 100% 50%, rgba(185,255,59,.08), transparent 30%),
    rgba(0,0,0,.22);
}

.bdcol-faq details[open] {
  border-color: rgba(185,255,59,.42);
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 34%),
    rgba(0,0,0,.26);
  box-shadow: 0 0 28px rgba(185,255,59,.06);
}

.bdcol-faq summary {
  cursor: pointer;
  padding: 17px 18px;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  list-style: none;
}

.bdcol-faq summary::-webkit-details-marker {
  display: none;
}

.bdcol-faq summary::after {
  content: "+";
  float: right;
  color: var(--bdcol-accent);
  font-weight: 950;
}

.bdcol-faq details[open] summary::after {
  content: "–";
}

.bdcol-faq details p {
  margin: 0;
  padding: 0 18px 18px;
  color: #cfd8c9;
  font-size: 13px;
  line-height: 1.72;
}

/* Final */
.bdcol-final {
  padding: 34px;
  margin-top: 22px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 100%, rgba(185,255,59,.15), transparent 36%),
    linear-gradient(135deg, rgba(185,255,59,.08), rgba(255,255,255,.025)),
    #11150f;
}

.bdcol-final h2 {
  max-width: 760px;
  margin-inline: auto;
}

.bdcol-final p {
  max-width: 720px;
  margin: 14px auto 0;
}

.bdcol-final .bdcol-actions {
  justify-content: center;
}

/* Responsive */
@media (max-width: 980px) {
  .bdcol-shell {
    width: min(100% - 28px, 1180px);
    padding: 30px 0 72px;
  }

  .bdcol-hero-grid,
  .bdcol-two,
  .bdcol-request-grid {
    grid-template-columns: 1fr;
  }

  .bdcol-path-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 640px) {
  .bdcol-shell {
    width: min(100% - 22px, 1180px);
    padding: 28px 0 64px;
  }

  .bdcol-hero,
  .bdcol-section,
  .bdcol-final {
    padding: 18px;
    border-radius: 14px;
  }

  .bdcol-stage h1 {
    font-size: 42px !important;
    line-height: 1.02 !important;
  }

  .bdcol-stage p,
  .bdcol-stage li {
    font-size: 14px;
    line-height: 1.66;
  }

  .bdcol-actions {
    display: grid;
  }

  .bdcol-btn {
    width: 100%;
  }

  .bdcol-proof-grid,
  .bdcol-path-grid,
  .bdcol-device-grid {
    grid-template-columns: 1fr;
  }

  .bdcol-chip {
    min-height: 36px;
    padding: .5rem .78rem;
    font-size: .80rem;
  }
}

/* =========================================================
   COLLECTIONS PAGE — FINAL POLISH PATCH
   ========================================================= */

/* Remove any old hero chip spacing if cached HTML/CSS lingers */
.bdcol-hero-copy .bdcol-chips {
  display: none !important;
}

/* Use the original site-wide utility chip look for color chips */
.bdcol-color-chips .bdcol-chip {
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.03) !important;
  box-shadow: none !important;
}

.bdcol-color-chips .bdcol-chip:hover {
  border-color: #B9FF3B !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow:
    0 12px 24px rgba(0,0,0,.22),
    0 0 16px rgba(185,255,59,.08) !important;
}

/* Benefit rows: fuller copy, better vertical balance */
.bdcol-benefit {
  min-height: 86px !important;
  align-items: center !important;
  padding: 15px 16px !important;
}

.bdcol-benefit span {
  align-self: center !important;
}

.bdcol-benefit p {
  margin: 0 !important;
  font-size: 13.75px !important;
  line-height: 1.58 !important;
}

/* Keeps the two info cards from feeling oddly uneven */
.bdcol-copy-card,
.bdcol-card {
  min-height: 100% !important;
}

/* Mobile keeps natural spacing */
@media (max-width: 640px) {
  .bdcol-benefit {
    min-height: 0 !important;
  }
}

/* Hide author meta on tag archive pages */
.tag .meta-el.meta-author,
.tag .meta-author {
  display: none !important;
}

/* Tighten remaining meta row spacing */
.tag .meta-inner {
  gap: 6px !important;
}

/* Hide author + avatar on tag archive pages */
.tag .meta-avatar,
.tag .meta-el.meta-author,
.tag .meta-author {
  display: none !important;
}

.tag .meta-inner {
  gap: 6px !important;
}

/* =========================================================
   BACKDROVA GUIDES PAGE — MOBILE FOXIZ GRID OVERFLOW FIX
   Fixes guide cards running off-screen on iPhone/mobile
   ========================================================= */

@media (max-width: 767px) {
  body.page-id-124 {
    overflow-x: hidden !important;
  }

  body.page-id-124 .bdg-top,
  body.page-id-124 .bdg-body,
  body.page-id-124 .bdg-shell,
  body.page-id-124 .elementor,
  body.page-id-124 .elementor-section,
  body.page-id-124 .elementor-container,
  body.page-id-124 .elementor-widget-container {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Kill Foxiz row/column overflow behavior on mobile */
  body.page-id-124 .block-wrap,
  body.page-id-124 .block-inner,
  body.page-id-124 .block-grid-2,
  body.page-id-124 .rb-row,
  body.page-id-124 .rb-col-m12,
  body.page-id-124 .rb-col-d6,
  body.page-id-124 .rb-col-m12.rb-col-d6 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Force guide posts into one clean mobile column */
  body.page-id-124 .block-inner,
  body.page-id-124 .block-grid-2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 38px !important;
  }

  /* Make each card respect viewport width */
  body.page-id-124 .p-wrap.p-grid.p-grid-2 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2:hover {
    transform: none !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .feat-holder,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-featured,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-flink {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .featured-img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* Keep title/text inside the card */
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-summary,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-meta {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    box-sizing: border-box !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title {
    font-size: 27px !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
  }
}

/* Extra iPhone 12 / narrow phone safety */
@media (max-width: 430px) {
  body.page-id-124 .bdg-shell {
    width: min(100% - 22px, 1180px) !important;
    margin-inline: auto !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title {
    font-size: 25px !important;
    line-height: 1.1 !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-summary {
    font-size: 14.5px !important;
    line-height: 1.68 !important;
  }
}

 /* =========================================================
   BACKDROVA GUIDES PAGE — REMOVE FOXIZ TITLE HIGHLIGHT HOVER
   ========================================================= */

body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url {
  background: none !important;
  background-image: none !important;
  background-size: 0 0 !important;
  background-position: initial !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  color: #fff !important;
  text-decoration: none !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a:hover,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url:hover {
  background: none !important;
  background-image: none !important;
  background-size: 0 0 !important;
  box-shadow: none !important;
  color: #B9FF3B !important;
  text-shadow: 0 0 22px rgba(185,255,59,.16) !important;
}

/* Extra override for Foxiz animated title hover layers */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a::before,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a::after,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url::before,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url::after {
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* =========================================================
   BACKDROVA GUIDES PAGE — FOXIZ GRID STYLE MATCH
   Page: /blog/ Guides landing page
   ========================================================= */

body.page-id-124 {
  --bdg-accent: #B9FF3B;
  --bdg-bg: #050706;
  --bdg-panel: #111410;
  --bdg-border: rgba(255,255,255,.095);
  --bdg-text: #f7faf4;
  --bdg-muted: #c9d3c4;
  --bdg-dim: #94a08f;
  --bdg-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bdg-radius: 16px;
}

/* Main post grid spacing */
body.page-id-124 .block-grid-2,
body.page-id-124 .rb-col-m12.rb-col-d6 {
  gap: 28px !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Hide admin edit link on front end cards */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .post-edit-link {
  display: none !important;
}

/* Featured image panel */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .feat-holder {
  position: relative !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background:
    radial-gradient(circle at 88% 15%, rgba(185,255,59,.14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    #101410 !important;
  box-shadow:
    0 24px 64px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-featured {
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-flink {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background: #050706 !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-flink::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(0,0,0,.10), transparent 40%, rgba(185,255,59,.08)),
    radial-gradient(circle at 90% 18%, rgba(185,255,59,.12), transparent 34%) !important;
  opacity: .85 !important;
  transition: opacity .18s ease !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2:hover .p-flink::after {
  opacity: 1 !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .featured-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  transform: scale(1.001) !important;
  transition: transform .22s ease, filter .22s ease !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2:hover .featured-img {
  transform: scale(1.025) !important;
  filter: brightness(1.05) contrast(1.03) !important;
}

/* Category badge — matches single post badge */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-categories,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-categories.p-top {
  display: flex !important;
  align-items: center !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  background: transparent !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-category {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  border-radius: 9px !important;
  background: var(--bdg-accent) !important;
  border: 1px solid rgba(185,255,59,.6) !important;
  color: #071008 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transform: skewX(-6deg) !important;
  box-shadow: 0 0 24px rgba(185,255,59,.22) !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-category:hover {
  background: #c8ff58 !important;
  border-color: rgba(185,255,59,.85) !important;
  color: #071008 !important;
  box-shadow: 0 0 30px rgba(185,255,59,.34) !important;
}

/* Title */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: clamp(24px, 2.2vw, 32px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  font-weight: 950 !important;
  text-wrap: balance !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url {
  color: #fff !important;
  text-decoration: none !important;
  transition: color .16s ease, text-shadow .16s ease !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title a:hover,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-url:hover {
  color: var(--bdg-accent) !important;
  text-shadow: 0 0 20px rgba(185,255,59,.14) !important;
}

/* Summary */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-summary {
  max-width: 92% !important;
  margin: 0 0 16px !important;
  color: var(--bdg-muted) !important;
  font-size: 15px !important;
  line-height: 1.72 !important;
}

/* Date/meta */
body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-meta {
  margin-top: auto !important;
  padding-top: 2px !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2 .meta-inner,
body.page-id-124 .p-wrap.p-grid.p-grid-2 .meta-el,
body.page-id-124 .p-wrap.p-grid.p-grid-2 time {
  color: rgba(247,250,244,.82) !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

/* Subtle hover lift for the whole card */
body.page-id-124 .p-wrap.p-grid.p-grid-2 {
  transition: transform .18s ease !important;
}

body.page-id-124 .p-wrap.p-grid.p-grid-2:hover {
  transform: translateY(-3px) !important;
}

/* Better column rhythm */
body.page-id-124 .block-inner {
  row-gap: 46px !important;
}

body.page-id-124 .block-inner > * {
  min-width: 0 !important;
}

/* Mobile polish */
@media (max-width: 767px) {
  body.page-id-124 .block-inner,
  body.page-id-124 .block-grid-2 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 36px !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .feat-holder {
    margin-bottom: 16px !important;
    border-radius: 14px !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-featured,
  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-flink {
    border-radius: 14px !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-title {
    font-size: 27px !important;
    line-height: 1.08 !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .entry-summary {
    max-width: 100% !important;
    font-size: 14.5px !important;
    line-height: 1.68 !important;
  }

  body.page-id-124 .p-wrap.p-grid.p-grid-2 .p-category {
    min-height: 28px !important;
    padding: 0 11px !important;
    font-size: 10.5px !important;
  }
}




/* =========================================================
   BACKDROVA SINGLE GUIDE POSTS — CONSOLIDATED FINAL LAYER
   Scope: Wallpaper Guides single posts only
   Replaces legacy single-guide / TOC / related / share patches
   ========================================================= */

body.single-post article.category-wallpaper-guides {
  --bdg-accent: #B9FF3B;
  --bdg-bg: #050706;
  --bdg-panel: #111410;
  --bdg-panel-2: #151915;
  --bdg-border: rgba(255,255,255,.095);
  --bdg-border-strong: rgba(185,255,59,.36);
  --bdg-text: #f7faf4;
  --bdg-muted: #c9d3c4;
  --bdg-dim: #8f9b8c;
  --bdg-shadow: 0 28px 80px rgba(0,0,0,.42);
  --bdg-radius: 16px;
}

/* ---------------------------------------------------------
   ARTICLE SHELL + HEADER
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .single-header,
body.single-post article.category-wallpaper-guides .grid-container {
  width: min(100% - 44px, 900px) !important;
  max-width: 900px !important;
  margin-inline: auto !important;
}

body.single-post article.category-wallpaper-guides .single-header {
  padding-top: 34px !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

body.single-post article.category-wallpaper-guides .single-header + .grid-container {
  margin-top: 20px !important;
}

body.single-post article.category-wallpaper-guides .s-ct,
body.single-post article.category-wallpaper-guides .s-ct-wrap,
body.single-post article.category-wallpaper-guides .s-ct-inner,
body.single-post article.category-wallpaper-guides .e-ct-outer,
body.single-post article.category-wallpaper-guides .entry-content,
body.single-post article.category-wallpaper-guides .rbct {
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.single-post article.category-wallpaper-guides .breadcrumb-wrap,
body.single-post article.category-wallpaper-guides .breadcrumb-inner {
  margin: 0 0 22px !important;
  color: rgba(255,255,255,.52) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

body.single-post article.category-wallpaper-guides .breadcrumb-wrap a {
  color: rgba(255,255,255,.66) !important;
  text-decoration: none !important;
}

body.single-post article.category-wallpaper-guides .breadcrumb-wrap a:hover {
  color: var(--bdg-accent) !important;
}

body.single-post article.category-wallpaper-guides .p-categories,
body.single-post article.category-wallpaper-guides .single-header .p-category {
  margin-bottom: 18px !important;
}

body.single-post article.category-wallpaper-guides .p-category {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(185,255,59,.6) !important;
  border-radius: 9px !important;
  background: var(--bdg-accent) !important;
  color: #071008 !important;
  box-shadow: 0 0 24px rgba(185,255,59,.22) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transform: skewX(-6deg) !important;
}

body.single-post article.category-wallpaper-guides .s-title {
  max-width: 880px !important;
  margin: 0 0 14px !important;
  color: #fff !important;
  font-size: clamp(34px, 4.2vw, 58px) !important;
  line-height: .98 !important;
  letter-spacing: -.045em !important;
  font-weight: 950 !important;
  text-wrap: balance !important;
}

/* Keep the existing "last updated" presentation; suppress author-only theme pieces. */
body.single-post article.category-wallpaper-guides .p-meta,
body.single-post article.category-wallpaper-guides .meta-author,
body.single-post article.category-wallpaper-guides .meta-author-url,
body.single-post article.category-wallpaper-guides .meta-el:has(.meta-author-url) {
  display: none !important;
}

body.single-post article.category-wallpaper-guides .single-meta {
  margin: 0 0 34px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.single-post article.category-wallpaper-guides .smeta-in,
body.single-post article.category-wallpaper-guides .smeta-sec,
body.single-post article.category-wallpaper-guides .meta-inner {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  color: var(--bdg-dim) !important;
  font-size: 12px !important;
}

body.single-post article.category-wallpaper-guides .smeta-sec {
  align-items: center !important;
}

body.single-post article.category-wallpaper-guides .smeta-bottom {
  margin: 0 !important;
}

body.single-post article.category-wallpaper-guides .updated-date,
body.single-post article.category-wallpaper-guides .meta-text,
body.single-post article.category-wallpaper-guides .single-meta .meta-el {
  margin-top: 0 !important;
  padding-top: 0 !important;
  color: var(--bdg-dim) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

/* Top share icons */
body.single-post article.category-wallpaper-guides .t-shared-sec .share-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.78) !important;
  line-height: 1 !important;
}

body.single-post article.category-wallpaper-guides .t-shared-sec .share-action:hover {
  border-color: rgba(185,255,59,.42) !important;
  background: rgba(185,255,59,.10) !important;
  color: #fff !important;
}

/* ---------------------------------------------------------
   FEATURED IMAGE + ARTICLE TYPOGRAPHY
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .s-feat-outer {
  width: min(100%, 820px) !important;
  margin: 0 auto 42px !important;
  padding: 0 !important;
}

body.single-post article.category-wallpaper-guides .s-feat {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 90% 20%, rgba(185,255,59,.13), transparent 36%),
    rgba(255,255,255,.025) !important;
  box-shadow:
    0 28px 80px rgba(0,0,0,.48),
    0 0 0 1px rgba(185,255,59,.06) inset !important;
}

body.single-post article.category-wallpaper-guides .s-feat img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 0 !important;
}

body.single-post article.category-wallpaper-guides .feat-caption {
  display: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  color: var(--bdg-text) !important;
  font-size: 16px !important;
  line-height: 1.82 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article p {
  margin: 0 0 18px !important;
  color: var(--bdg-muted) !important;
  font-size: 16px !important;
  line-height: 1.82 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article strong {
  color: #fff !important;
  font-weight: 900 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article a {
  color: #fff !important;
  font-weight: 850 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(185,255,59,.42) !important;
  text-underline-offset: 3px !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article a:hover {
  color: var(--bdg-accent) !important;
  text-decoration-color: var(--bdg-accent) !important;
}

/* Intro */
body.single-post article.category-wallpaper-guides .bd-guide-intro {
  margin: 0 0 20px !important;
  padding: 22px 24px 22px 25px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-left: 3px solid var(--bdg-accent) !important;
  border-radius: var(--bdg-radius) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(185,255,59,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    #101410 !important;
  box-shadow: 0 22px 56px rgba(0,0,0,.34) !important;
  color: #d7e1d2 !important;
  font-size: 17px !important;
  line-height: 1.78 !important;
}

/* Quick answer */
body.single-post article.category-wallpaper-guides .bd-guide-answer {
  margin: 0 0 26px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(185,255,59,.28) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.12), transparent 34%),
    rgba(185,255,59,.055) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.26) !important;
  color: #dce7d8 !important;
  font-size: 15px !important;
  line-height: 1.72 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-answer strong {
  color: var(--bdg-accent) !important;
}

/* Jump links */
body.single-post article.category-wallpaper-guides .bd-guide-jump {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 0 36px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(255,255,255,.025) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-jump br {
  display: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-jump a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: .45rem .8rem !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
    rgba(255,255,255,.03) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 10px 24px rgba(0,0,0,.12) !important;
  color: #e5e7eb !important;
  font-size: .80rem !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transform: skewX(-6deg) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-jump a:hover {
  color: #fff !important;
  border-color: rgba(185,255,59,.46) !important;
  background: rgba(185,255,59,.08) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.24), 0 0 18px rgba(185,255,59,.10) !important;
}

/* Headings */
body.single-post article.category-wallpaper-guides .bd-guide-article h2 {
  margin: 42px 0 14px !important;
  color: #fff !important;
  font-size: clamp(25px, 3vw, 36px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.04em !important;
  font-weight: 950 !important;
  text-wrap: balance !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-article h2::before {
  content: "" !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  margin: 0 9px 4px 0 !important;
  border-radius: 999px !important;
  background: var(--bdg-accent) !important;
  box-shadow: 0 0 16px rgba(185,255,59,.55) !important;
}

/* Guide lists */
body.single-post article.category-wallpaper-guides .bd-guide-list {
  display: grid !important;
  gap: 10px !important;
  margin: 18px 0 28px !important;
  padding: 0 !important;
  list-style: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-list li {
  position: relative !important;
  margin: 0 !important;
  padding: 14px 16px 14px 40px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014)),
    rgba(255,255,255,.025) !important;
  color: var(--bdg-muted) !important;
  font-size: 15px !important;
  line-height: 1.62 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-list li::before {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 22px !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: var(--bdg-accent) !important;
  box-shadow: 0 0 14px rgba(185,255,59,.5) !important;
}

/* Callouts */
body.single-post article.category-wallpaper-guides .bd-guide-callout {
  margin: 24px 0 34px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(185,255,59,.30) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(185,255,59,.12), transparent 34%),
    linear-gradient(180deg, rgba(185,255,59,.055), rgba(255,255,255,.016)),
    #101410 !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.28) !important;
  color: #dce7d8 !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-callout strong {
  color: var(--bdg-accent) !important;
}

/* Tables */
body.single-post article.category-wallpaper-guides .bd-guide-table-wrap {
  margin: 20px 0 34px !important;
  overflow-x: auto !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: 0 20px 56px rgba(0,0,0,.34) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-table {
  width: 100% !important;
  min-width: 680px !important;
  margin: 0 !important;
  border-collapse: collapse !important;
  background: transparent !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-table th,
body.single-post article.category-wallpaper-guides .bd-guide-table td {
  padding: 15px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
  color: var(--bdg-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  vertical-align: top !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-table th {
  color: #fff !important;
  background: rgba(185,255,59,.075) !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-table tr:last-child td {
  border-bottom: 0 !important;
}

/* ---------------------------------------------------------
   FAQ — RETAIN TONIGHT'S FINAL DESIGN
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .bd-guide-faq {
  margin: 46px 0 42px !important;
  padding: 24px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    #101410 !important;
  box-shadow: var(--bdg-shadow) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq h2 {
  margin: 0 0 18px !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details {
  margin: 0 0 10px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.22) !important;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details:last-child {
  margin-bottom: 0 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details:hover,
body.single-post article.category-wallpaper-guides .bd-guide-faq details[open] {
  border-color: rgba(185,255,59,.42) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.10), transparent 38%),
    rgba(0,0,0,.28) !important;
  box-shadow: 0 16px 38px rgba(0,0,0,.22) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq summary {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-height: 62px !important;
  padding: 18px 52px 18px 18px !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq summary::-webkit-details-marker {
  display: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq summary::marker {
  content: "" !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq summary::after {
  content: "+" !important;
  position: absolute !important;
  top: 50% !important;
  right: 18px !important;
  transform: translateY(-50%) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  color: var(--bdg-accent) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details[open] summary {
  color: var(--bdg-accent) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details[open] summary::after {
  content: "−" !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-faq details p {
  margin: 0 !important;
  padding: 0 18px 18px !important;
  color: var(--bdg-muted) !important;
  font-size: 14.5px !important;
  line-height: 1.72 !important;
}

/* ---------------------------------------------------------
   FOXIZ TABLE OF CONTENTS — ONE AUTHORITATIVE RULESET
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 34px 0 40px !important;
  padding: 20px 22px 16px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(185,255,59,.055), transparent 32%),
    linear-gradient(145deg, #1b201c 0%, #141815 55%, #111412 100%) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.20) !important;
}

/* One restrained accent only. */
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 22px !important;
  display: block !important;
  width: 58px !important;
  height: 1px !important;
  border: 0 !important;
  background: #b9ff3b !important;
  box-shadow: none !important;
  opacity: .8 !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  background: none !important;
  box-shadow: none !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header::before,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header > i:first-child,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-toggle,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-toggle i {
  color: #b9ff3b !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header > i:first-child {
  font-size: 17px !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header .h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-toggle {
  margin-left: auto !important;
}

/* Reset every Foxiz list decoration before rebuilding the rows. */
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content {
  counter-reset: bd-toc !important;
  column-count: 2 !important;
  column-gap: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  list-style: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content::before,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li {
  counter-increment: bd-toc !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: 23px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  break-inside: avoid !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 2px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  list-style: none !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li::after,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li > a::before,
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li > a::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* The only row marker is this number. */
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li::before {
  content: counter(bd-toc) !important;
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(185,255,59,.32) !important;
  border-radius: 5px !important;
  background: rgba(5,8,6,.72) !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.76) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  transition: color .22s ease, background .22s ease, border-color .22s ease !important;
}

body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li a.table-link {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.80) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.42 !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
  text-decoration: none !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  transition: color .22s ease, transform .22s ease !important;
}

@media (hover:hover) {
  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li:hover::before {
    color: #b9ff3b !important;
    border-color: rgba(185,255,59,.55) !important;
    background: rgba(185,255,59,.07) !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li:hover a.table-link {
    color: #fff !important;
    transform: translateX(3px) !important;
  }
}

/* ---------------------------------------------------------
   RELATED BACKDROVA GUIDES — EDITORIAL GRID
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .entry-bottom {
  margin: 34px 0 32px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget,
body.single-post article.category-wallpaper-guides .entry-widget.widget_text {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.single-post article.category-wallpaper-guides #text-2::before,
body.single-post article.category-wallpaper-guides #text-2::after,
body.single-post article.category-wallpaper-guides .entry-bottom::before,
body.single-post article.category-wallpaper-guides .entry-bottom::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 {
  position: relative !important;
  overflow: hidden !important;
  display: block !important;
  width: 100% !important;
  margin: 0 0 34px !important;
  padding: 22px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.075), transparent 38%),
    linear-gradient(145deg, #1b211c 0%, #141815 60%, #101311 100%) !important;
  box-shadow: 0 20px 48px rgba(0,0,0,.19) !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5::before {
  content: "KEEP EXPLORING" !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 7px !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #b9ff3b !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .inner,
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 10px !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner::before {
  content: "Related Backdrova Guides" !important;
  grid-column: 1 / -1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 5px !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  font-weight: 720 !important;
  letter-spacing: -.02em !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline {
  position: relative !important;
  overflow: hidden !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 12px !important;
  background: linear-gradient(105deg, rgba(255,255,255,.026), rgba(255,255,255,.012)) !important;
  box-shadow: none !important;
  transition: transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease !important;
}

/* Five-card layouts finish with a full-width editorial row. */
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:last-child:nth-child(odd) {
  grid-column: 1 / -1 !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 14px !important;
  bottom: 14px !important;
  display: block !important;
  width: 2px !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 99px !important;
  background: #b9ff3b !important;
  box-shadow: none !important;
  opacity: 0 !important;
  transform: scaleY(.35) !important;
  transform-origin: center !important;
  transition: opacity .24s ease, transform .24s ease !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline::after,
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4::before,
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4::after,
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 a.p-url::before,
body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 a.p-url::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 {
  display: grid !important;
  grid-template-columns: 29px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 72px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 14px 15px !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  line-height: 1.35 !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 > i.rbi-plus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  margin: 0 !important;
  border: 1px solid rgba(185,255,59,.42) !important;
  border-radius: 999px !important;
  background: rgba(185,255,59,.045) !important;
  color: #b9ff3b !important;
  font-size: 10px !important;
  line-height: 1 !important;
  transition: transform .24s ease, background .24s ease, border-color .24s ease, box-shadow .24s ease !important;
}

body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 a.p-url {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.86) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
  font-size: 13.5px !important;
  line-height: 1.42 !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

@media (hover:hover) {
  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(185,255,59,.28) !important;
    background:
      linear-gradient(90deg, rgba(185,255,59,.05), rgba(255,255,255,.018) 42%, rgba(255,255,255,.012)) !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.16) !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:hover::before {
    opacity: .9 !important;
    transform: scaleY(1) !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:hover .entry-title.h4 > i.rbi-plus {
    transform: rotate(90deg) !important;
    border-color: rgba(185,255,59,.72) !important;
    background: rgba(185,255,59,.09) !important;
    box-shadow: 0 0 18px rgba(185,255,59,.10) !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:hover a.p-url {
    color: #fff !important;
  }
}

/* ---------------------------------------------------------
   TAGS + BOTTOM SHARE
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides .efoot {
  margin: 0 0 42px !important;
}

body.single-post article.category-wallpaper-guides .tag-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.025) !important;
}

body.single-post article.category-wallpaper-guides .tag-bar::before,
body.single-post article.category-wallpaper-guides .tag-bar::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides .tag-bar .blabel {
  color: var(--bdg-dim) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .055em !important;
}

body.single-post article.category-wallpaper-guides .tag-bar a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: .4rem .7rem !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.035) !important;
  color: #e5e7eb !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.single-post article.category-wallpaper-guides .tag-bar a:hover {
  color: #fff !important;
  border-color: rgba(185,255,59,.42) !important;
  background: rgba(185,255,59,.08) !important;
}

/* Keep Foxiz sharing, but make it read like Backdrova. */
body.single-post article.category-wallpaper-guides .e-shared-sec,
body.single-post article.category-wallpaper-guides .e-shared-sec.entry-sec {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  margin: 0 0 54px !important;
  padding: 20px 22px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-style: solid !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(185,255,59,.08), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014)),
    #101410 !important;
  box-shadow: 0 20px 56px rgba(0,0,0,.30) !important;
}

body.single-post article.category-wallpaper-guides .e-shared-sec::before,
body.single-post article.category-wallpaper-guides .e-shared-sec::after,
body.single-post article.category-wallpaper-guides .e-shared-sec.entry-sec::before,
body.single-post article.category-wallpaper-guides .e-shared-sec.entry-sec::after {
  content: none !important;
  display: none !important;
}

body.single-post article.category-wallpaper-guides .e-shared-header {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  color: #fff !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
}

body.single-post article.category-wallpaper-guides .rbbsl {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

body.single-post article.category-wallpaper-guides .rbbsl .share-action,
body.single-post article.category-wallpaper-guides .t-shared-sec .share-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.035) !important;
  color: #fff !important;
  line-height: 1 !important;
  text-align: center !important;
}

body.single-post article.category-wallpaper-guides .rbbsl .share-action:hover {
  border-color: rgba(185,255,59,.42) !important;
  background: rgba(185,255,59,.08) !important;
  color: var(--bdg-accent) !important;
}

body.single-post article.category-wallpaper-guides .rbbsl .share-action i,
body.single-post article.category-wallpaper-guides .t-shared-sec .share-action i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1em !important;
  height: 1em !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

body.single-post article.category-wallpaper-guides .rbbsl .share-action span {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  line-height: 1 !important;
}

/* Empty editor paragraphs should never create mystery gaps around the TOC. */
body.single-post article.category-wallpaper-guides .entry-content > p:empty,
body.single-post article.category-wallpaper-guides .s-ct-inner > p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {
  body.single-post article.category-wallpaper-guides .single-header,
  body.single-post article.category-wallpaper-guides .grid-container {
    width: min(100% - 22px, 900px) !important;
    max-width: 900px !important;
  }

  body.single-post article.category-wallpaper-guides .single-header {
    padding-top: 26px !important;
  }

  body.single-post article.category-wallpaper-guides .single-header + .grid-container {
    margin-top: 16px !important;
  }

  body.single-post article.category-wallpaper-guides .breadcrumb-wrap,
  body.single-post article.category-wallpaper-guides .breadcrumb-inner {
    margin-bottom: 18px !important;
  }

  body.single-post article.category-wallpaper-guides .p-categories,
  body.single-post article.category-wallpaper-guides .single-header .p-category {
    margin-bottom: 16px !important;
  }

  body.single-post article.category-wallpaper-guides .s-title {
    margin-bottom: 12px !important;
    font-size: 34px !important;
    line-height: 1.02 !important;
    letter-spacing: -.04em !important;
  }

  body.single-post article.category-wallpaper-guides .single-meta {
    margin-bottom: 28px !important;
  }

  body.single-post article.category-wallpaper-guides .smeta-in {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  body.single-post article.category-wallpaper-guides .s-feat-outer {
    width: 100% !important;
    margin-bottom: 34px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    font-size: 14.5px !important;
    line-height: 1.74 !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article p,
  body.single-post article.category-wallpaper-guides .bd-guide-intro {
    font-size: 14.5px !important;
    line-height: 1.74 !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-intro,
  body.single-post article.category-wallpaper-guides .bd-guide-answer,
  body.single-post article.category-wallpaper-guides .bd-guide-faq,
  body.single-post article.category-wallpaper-guides .tag-bar,
  body.single-post article.category-wallpaper-guides .e-shared-sec {
    width: 100% !important;
    max-width: 100% !important;
    padding: 16px !important;
    border-radius: 14px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article h2 {
    margin-top: 34px !important;
    font-size: 27px !important;
    line-height: 1.08 !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-table {
    min-width: 620px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-list li {
    padding: 13px 14px 13px 36px !important;
    font-size: 14px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-list li::before {
    left: 14px !important;
    top: 21px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-faq {
    margin-bottom: 34px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-faq summary {
    min-height: 58px !important;
    padding: 16px 48px 16px 16px !important;
    font-size: 14.5px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-faq summary::after {
    right: 16px !important;
  }

  /* TOC becomes one clean column. */
  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc {
    width: 100% !important;
    max-width: 100% !important;
    margin: 30px 0 34px !important;
    padding: 18px 16px 12px !important;
    border-radius: 16px !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc::before {
    left: 17px !important;
    width: 54px !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc .toc-header {
    padding-bottom: 13px !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content {
    column-count: 1 !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li {
    grid-template-columns: 22px minmax(0,1fr) !important;
    gap: 9px !important;
    padding: 10px 1px !important;
  }

  body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc ul.toc-content li a.table-link {
    font-size: 13px !important;
    line-height: 1.43 !important;
  }

  /* Related guides: single editorial stack on mobile. */
  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 {
    margin: 0 0 28px !important;
    padding: 18px 16px !important;
    border-radius: 16px !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .p-wrap.p-list-inline:last-child:nth-child(odd) {
    grid-column: auto !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .block-inner::before {
    margin-bottom: 4px !important;
    font-size: 20px !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 {
    grid-template-columns: 27px minmax(0,1fr) !important;
    gap: 10px !important;
    min-height: 64px !important;
    height: auto !important;
    padding: 12px 13px !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 > i.rbi-plus {
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
  }

  body.single-post article.category-wallpaper-guides #text-2.widget_text .related-sec.related-5 .entry-title.h4 a.p-url {
    font-size: 13px !important;
    line-height: 1.42 !important;
  }

  body.single-post article.category-wallpaper-guides .entry-bottom {
    margin-bottom: 28px !important;
  }

  body.single-post article.category-wallpaper-guides .efoot {
    margin-bottom: 34px !important;
  }

  body.single-post article.category-wallpaper-guides .e-shared-sec,
  body.single-post article.category-wallpaper-guides .e-shared-sec.entry-sec {
    display: block !important;
    margin-bottom: 42px !important;
    padding: 18px 16px 20px !important;
  }

  body.single-post article.category-wallpaper-guides .e-shared-header {
    margin-bottom: 14px !important;
  }

  body.single-post article.category-wallpaper-guides .rbbsl {
    justify-content: center !important;
    gap: 8px !important;
  }

  body.single-post article.category-wallpaper-guides .rbbsl .share-action {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }

  body.single-post article.category-wallpaper-guides .rbbsl .share-action span {
    display: none !important;
  }

  /* Mac workflow polish: keep labels readable instead of collapsing word-by-word. */
  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow > div {
    display: grid !important;
    grid-template-columns: 34px minmax(0,1fr) !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 13px 15px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow strong {
    grid-column: 1 !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow span {
    grid-column: 2 !important;
    min-width: 0 !important;
    width: 100% !important;
    padding-left: 8px !important;
    font-size: 13px !important;
    line-height: 1.42 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow span br {
    display: none !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow > div::after {
    content: "↓" !important;
    top: auto !important;
    right: auto !important;
    bottom: -10px !important;
    left: 30px !important;
    transform: translate(-50%, 50%) !important;
    font-size: 13px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-article .bd-guide-workflow > div:last-child::after {
    display: none !important;
  }
}

 /* =========================================================
   BACKDROVA GUIDES PAGE — TOP PADDING MATCH SITE
   ========================================================= */

body.page-id-124 .bdg-top {
  padding-top: 34px !important;
}

body.page-id-124 .bdg-top .bdg-shell {
  padding-top: 0 !important;
}

/* Keep the top kicker aligned cleanly above the hero */
body.page-id-124 .bdg-top .bdg-kicker {
  margin-top: 0 !important;
  margin-bottom: 16px !important;
}

/* Mobile spacing */
@media (max-width: 767px) {
  body.page-id-124 .bdg-top {
    padding-top: 26px !important;
  }

  body.page-id-124 .bdg-top .bdg-kicker {
    margin-bottom: 14px !important;
  }
}

/* Center tax proof card content vertically */
.bd-tax-proof-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 16px !important;
  padding-bottom: 11px !important;
}

/* Tighten pagination item spacing */
.bd-pager {
  gap: 16px !important;
}

/* Tighten Backdrova pagination spacing */
.bd-pager {
  gap: 10px !important;
}

.bd-pager .page-numbers {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* =========================================================
   BACKDROVA TAG ARCHIVES — GUIDE CARD CLEANUP
   Carries guide-page card styling onto tag pages
========================================================= */

/* Hide featured images on tag archive cards */
.archive.tag .p-wrap.p-grid .feat-holder,
.archive.tag .p-wrap.p-grid .p-featured,
.archive.tag .p-wrap.p-grid .p-feat {
	display: none !important;
}

/* Keep post titles clean and readable */
.archive.tag .p-wrap.p-grid .entry-title a,
.archive.tag .p-wrap.p-grid .entry-title a:visited {
	color: #ffffff !important;
	background: none !important;
	background-image: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
	text-shadow: none !important;
	transition:
		color .16s ease,
		text-shadow .16s ease !important;
}

/* Softer title hover */
.archive.tag .p-wrap.p-grid .entry-title a:hover,
.archive.tag .p-wrap.p-grid .entry-title a:focus {
	color: #b7ff2f !important;
	background: none !important;
	background-image: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
	text-shadow: 0 0 12px rgba(183,255,47,.18) !important;
}

/* Fix category badge readability */
.archive.tag .p-category {
	color: #061007 !important;
	background: #b7ff2f !important;
	background-image: linear-gradient(135deg,#b7ff2f,#8fea14) !important;
	border: 1px solid rgba(183,255,47,.75) !important;
	box-shadow: 0 8px 22px rgba(183,255,47,.16) !important;
	text-shadow: none !important;
	text-decoration: none !important;
	font-weight: 900 !important;
	letter-spacing: .045em !important;
}

/* Softer category badge hover */
.archive.tag .p-category:hover,
.archive.tag .p-category:focus {
	color: #061007 !important;
	background: #c4ff45 !important;
	background-image: linear-gradient(135deg,#c4ff45,#9cf51c) !important;
	box-shadow: 0 10px 24px rgba(183,255,47,.22) !important;
	text-shadow: none !important;
	transform: translateY(-1px) !important;
}

/* =========================================================
   BACKDROVA GUIDES HUB — FRESH GUIDES CARD SPACING
========================================================= */

body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 {
	padding-left: 24px !important;
	padding-right: 24px !important;
}

body.page-id-124 .block-inner {
	margin-left: -24px !important;
	margin-right: -24px !important;
}

/* Give titles a touch more internal breathing room */
body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .entry-title {
	max-width: 94% !important;
	line-height: .98 !important;
}

/* Keep excerpts/date aligned cleanly after the title adjustment */
body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .entry-summary,
body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .p-meta {
	max-width: 94% !important;
}

@media (max-width: 1024px) {
	body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}

	body.page-id-124 .block-inner {
		margin-left: -18px !important;
		margin-right: -18px !important;
	}
}

@media (max-width: 767px) {
	body.page-id-124 .block-inner {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .entry-title,
	body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .entry-summary,
	body.page-id-124 .block-inner > .p-wrap.p-grid.p-grid-2 .p-meta {
		max-width: 100% !important;
	}
}

/* =========================================================
   BACKDROVA — BACK TO TOP BUTTON EXACT OVERRIDE
========================================================= */

html body #back-top.scroll-btn-visible {
	--btn-primary: rgba(8, 12, 8, .94) !important;
	--btn-primary-h: rgba(12, 20, 9, .97) !important;
	--btn-primary-h-90: rgba(183, 255, 47, .22) !important;
	--g-color: #b7ff2f !important;
	--g-color-90: rgba(183, 255, 47, .22) !important;

	background: rgba(8, 12, 8, .94) !important;
	background-color: rgba(8, 12, 8, .94) !important;
	border: 1px solid rgba(183, 255, 47, .48) !important;
	border-color: rgba(183, 255, 47, .48) !important;
	border-radius: 10px !important;
	box-shadow:
		0 10px 24px rgba(0, 0, 0, .42),
		0 0 18px rgba(183, 255, 47, .14) !important;
	color: #b7ff2f !important;
}

html body #back-top.scroll-btn-visible:hover,
html body #back-top.scroll-btn-visible:focus {
	--btn-primary-h: rgba(12, 20, 9, .97) !important;
	--btn-primary-h-90: rgba(183, 255, 47, .24) !important;
	--g-color: #b7ff2f !important;
	--g-color-90: rgba(183, 255, 47, .24) !important;

	background: rgba(12, 20, 9, .97) !important;
	background-color: rgba(12, 20, 9, .97) !important;
	border-color: rgba(183, 255, 47, .72) !important;
	box-shadow:
		0 12px 28px rgba(0, 0, 0, .48),
		0 0 22px rgba(183, 255, 47, .22) !important;
	color: #b7ff2f !important;
	transform: translateY(-2px) !important;
}

/* Exact Ruby icon class */
html body #back-top.scroll-btn-visible .rbi.rbi-darrow-top,
html body #back-top.scroll-btn-visible:hover .rbi.rbi-darrow-top,
html body #back-top.scroll-btn-visible:focus .rbi.rbi-darrow-top {
	color: #b7ff2f !important;
	fill: #b7ff2f !important;
	text-shadow: none !important;
}

/* Kill any theme pseudo hover color */
html body #back-top.scroll-btn-visible::before,
html body #back-top.scroll-btn-visible::after,
html body #back-top.scroll-btn-visible:hover::before,
html body #back-top.scroll-btn-visible:hover::after {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

/* =========================================================
   BACKDROVA SETUP SHOWCASE - VERTICAL IMAGE SUPPORT
========================================================= */

.bds-showcase .bds-setup-card-vertical .bds-setup-image {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #050805;
}

.bds-showcase .bds-setup-card-vertical .bds-setup-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
	image-rendering: auto !important;
	transform: none !important;
}

.bds-showcase .bds-setup-card-phone .bds-setup-image {
	aspect-ratio: 4 / 3;
}

.bds-showcase .bds-setup-card-phone .bds-setup-image img {
	object-position: center top !important;
}

.bds-mini-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
}

.bds-mini-actions .bds-mini-btn {
	margin-top: 0 !important;
	width: auto !important;
	max-width: max-content;
}

@media (max-width: 767px) {
	.bds-showcase .bds-setup-card-vertical .bds-setup-image,
	.bds-showcase .bds-setup-card-phone .bds-setup-image {
		aspect-ratio: 16 / 11;
	}

	.bds-mini-actions {
		gap: 7px;
	}

	.bds-mini-actions .bds-mini-btn {
		max-width: 100%;
	}
}

/* Guides page color chips — match Backdrova header/footer default */
.bdg-side-chip-group .bdg-color-chips-side {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: .55rem !important;
}

.bdg-side-chip-group .bdg-color-chips-side a.bdhf-color-chip {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: .4rem !important;
	min-height: 34px !important;
	padding: .45rem .8rem !important;
	border-radius: 10px !important;
	border: 1px solid rgba(255,255,255,.12) !important;
	background:
		linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
		rgba(255,255,255,.03) !important;
	color: #e5e7eb !important;
	font-size: .80rem !important;
	font-weight: 550 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	position: relative !important;
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.045),
		0 10px 24px rgba(0,0,0,.12) !important;
	transform: skewX(-6deg) !important;
	transition:
		transform .15s ease,
		background .15s ease,
		border-color .15s ease,
		color .15s ease,
		box-shadow .15s ease !important;
}

.bdg-side-chip-group .bdg-color-chips-side a.bdhf-color-chip .bdhf-dot {
	width: .55rem !important;
	height: .55rem !important;
	flex: 0 0 .55rem !important;
	border-radius: 50% !important;
	background: var(--bdhf-dot, #8ea0b3) !important;
}

.bdg-side-chip-group .bdg-color-chips-side a.bdhf-color-chip:hover {
	background:
		linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
		rgba(255,255,255,.06) !important;
	border-color: #B9FF3B !important;
	color: #fff !important;
	transform: skewX(-6deg) translateY(-1px) !important;
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.07),
		0 14px 30px rgba(0,0,0,.22),
		0 0 22px rgba(185,255,59,.08) !important;
}

/* =========================================================
   Backdrova Guide Tools + Calculators - Final Tight Version
========================================================= */

body.single-post article.category-wallpaper-guides .bd-guide-tool,
body.single-post article.category-wallpaper-guides .bd-guide-tool * {
  box-sizing: border-box !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool {
  margin: 30px 0 !important;
  padding: 24px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(185, 255, 59, .22) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(185, 255, 59, .10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014)),
    #101410 !important;
  box-shadow: 0 22px 56px rgba(0,0,0,.32) !important;
  overflow: hidden !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool h3 {
  margin: 0 0 9px 0 !important;
  padding: 0 !important;
  color: #fff !important;
  line-height: 1.15 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool > p:not(:has(button)) {
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  color: rgba(255,255,255,.78) !important;
  line-height: 1.5 !important;
}

/* input grid */
body.single-post article.category-wallpaper-guides .bd-guide-tool-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 22px !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  align-items: start !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-field {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-field label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
  letter-spacing: .01em !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-field input,
body.single-post article.category-wallpaper-guides .bd-guide-field select {
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(3, 7, 4, .58) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  line-height: 52px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-field input:focus,
body.single-post article.category-wallpaper-guides .bd-guide-field select:focus {
  border-color: rgba(185,255,59,.55) !important;
  box-shadow:
    0 0 0 3px rgba(185,255,59,.12),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* kill WP paragraph spacing around calculator buttons */
body.single-post article.category-wallpaper-guides .bd-guide-tool > p:has(button) {
  display: block !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* calculator button */
body.single-post article.category-wallpaper-guides .bd-guide-tool button,
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="button"],
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="submit"] {
  display: inline-grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 255px !important;
  height: 54px !important;
  min-height: 54px !important;
  max-height: 54px !important;
  margin: 0 !important;
  padding: 0 28px 2px 28px !important;
  border: 1px solid rgba(185,255,59,.7) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, #c8ff3a 0%, #aaff22 100%) !important;
  color: #071003 !important;
  font-size: 17px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.015em !important;
  text-align: center !important;
  text-transform: none !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  vertical-align: middle !important;
  box-shadow:
    0 14px 34px rgba(185,255,59,.18),
    inset 0 1px 0 rgba(255,255,255,.38) !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool button:hover,
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="button"]:hover,
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="submit"]:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.04) !important;
  box-shadow:
    0 18px 40px rgba(185,255,59,.24),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

/* result box */
body.single-post article.category-wallpaper-guides .bd-guide-tool-result {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(185,255,59,.06), transparent 32%),
    rgba(4, 8, 5, .58) !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool-result strong {
  color: #b9ff3b !important;
  font-weight: 900 !important;
}

/* cheat sheet / reference note */
body.single-post article.category-wallpaper-guides .bd-guide-cheat {
  margin: 28px 0 !important;
  padding: 18px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.014)),
    rgba(255,255,255,.025) !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-cheat strong {
  color: #b9ff3b !important;
  font-weight: 900 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-cheat code {
  display: block !important;
  white-space: normal !important;
  margin-top: 12px !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  background: rgba(0,0,0,.34) !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-mini-note {
  font-size: .92rem !important;
  color: rgba(255,255,255,.70) !important;
}

/* mobile */
@media (max-width: 767px) {
  body.single-post article.category-wallpaper-guides .bd-guide-tool {
    margin: 26px 0 !important;
    padding: 22px !important;
    border-radius: 16px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-tool-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-bottom: 16px !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-tool button,
  body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="button"],
  body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="submit"] {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.single-post article.category-wallpaper-guides .bd-guide-tool-result {
    font-size: 15px !important;
  }
}

/* Kill WordPress-injected breaks inside Backdrova guide calculator fields */
body.single-post article.category-wallpaper-guides .bd-guide-tool .bd-guide-field br {
  display: none !important;
  height: 0 !important;
  line-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Tighten calculator label-to-input spacing */
body.single-post article.category-wallpaper-guides .bd-guide-tool .bd-guide-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Button final alignment fix */
body.single-post article.category-wallpaper-guides .bd-guide-tool button,
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="button"],
body.single-post article.category-wallpaper-guides .bd-guide-tool input[type="submit"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  padding-top: 1px !important;
  padding-bottom: 0 !important;
}

/* Kill WordPress-injected breaks inside guide calculator fields/buttons */
body.single-post article.category-wallpaper-guides .bd-guide-tool .bd-guide-field br,
body.single-post article.category-wallpaper-guides .bd-guide-tool button br,
body.single-post article.category-wallpaper-guides .bd-guide-tool #bdAspectButton br {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  line-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Final button text alignment */
body.single-post article.category-wallpaper-guides .bd-guide-tool #bdAspectButton {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 28px !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-align: center !important;
}

/* Remove WordPress-injected line breaks inside guide cheat sheets */
body.single-post article.category-wallpaper-guides .bd-guide-cheat > br,
body.single-post article.category-wallpaper-guides .bd-guide-cheat code br {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  line-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Keep intentional spacing between cheat sheet label and code box */
body.single-post article.category-wallpaper-guides .bd-guide-cheat strong + code,
body.single-post article.category-wallpaper-guides .bd-guide-cheat code {
  margin-top: 10px !important;
}

/* Backdrova Wallpaper Fit Troubleshooter */
body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter,
body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter * {
  box-sizing: border-box !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter br {
  display: none !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter.bd-guide-tool {
  margin: 30px 0 !important;
  padding: 26px !important;
  border-radius: 18px !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter h3 {
  margin: 0 0 8px !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter > p {
  margin: 0 0 22px !important;
  color: rgba(255,255,255,.78) !important;
  line-height: 1.55 !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-fit-tool-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 22px !important;
  margin: 0 0 20px !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field-wide {
  grid-column: 1 / -1 !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field input,
body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field select {
  display: block !important;
  width: 100% !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(3, 7, 4, .58) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  outline: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field select {
  appearance: auto !important;
  -webkit-appearance: menulist !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field input:focus,
body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-guide-field select:focus {
  border-color: rgba(185,255,44,.58) !important;
  box-shadow:
    0 0 0 3px rgba(185,255,44,.12),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter #bdFitButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 245px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  margin: 0 0 18px !important;
  padding: 0 26px !important;
  border: 1px solid rgba(185,255,44,.70) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #c4ff37 0%, #aaff22 100%) !important;
  color: #071003 !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.01em !important;
  text-align: center !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-shadow:
    0 14px 34px rgba(185,255,44,.18),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter #bdFitButton:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.04) !important;
  box-shadow:
    0 18px 40px rgba(185,255,44,.24),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter #bdFitResult {
  margin: 0 !important;
  padding: 18px 20px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(185,255,44,.06), transparent 32%),
    rgba(4, 8, 5, .58) !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;
  overflow-wrap: anywhere !important;
}

body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter #bdFitResult strong {
  color: #b9ff2c !important;
  font-weight: 950 !important;
}

@media (max-width: 767px) {
  body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter.bd-guide-tool {
    padding: 22px !important;
  }

  body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter .bd-fit-tool-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.single-post article.category-wallpaper-guides #wallpaper-fit-troubleshooter #bdFitButton {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* Backdrova Blurry Wallpaper Fix Checker */
body.single-post article.category-wallpaper-guides #blur-tool,
body.single-post article.category-wallpaper-guides #blur-tool * {
  box-sizing: border-box !important;
}

body.single-post article.category-wallpaper-guides #blur-tool br {
  display: none !important;
}

body.single-post article.category-wallpaper-guides #blur-tool.bd-guide-tool {
  margin: 30px 0 !important;
  padding: 26px !important;
  border-radius: 18px !important;
}

body.single-post article.category-wallpaper-guides #blur-tool h3 {
  margin: 0 0 10px !important;
}

body.single-post article.category-wallpaper-guides #blur-tool > p {
  margin: 0 0 20px !important;
  color: rgba(255,255,255,.78) !important;
  line-height: 1.55 !important;
}

body.single-post article.category-wallpaper-guides #blur-tool .bd-guide-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  margin: 0 0 18px !important;
  min-width: 0 !important;
}

body.single-post article.category-wallpaper-guides #blur-tool .bd-guide-field label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

body.single-post article.category-wallpaper-guides #blur-tool .bd-guide-field select {
  display: block !important;
  width: 100% !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(3, 7, 4, .58) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  outline: none !important;
  appearance: auto !important;
  -webkit-appearance: menulist !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.single-post article.category-wallpaper-guides #blur-tool .bd-guide-field select:focus {
  border-color: rgba(185,255,44,.58) !important;
  box-shadow:
    0 0 0 3px rgba(185,255,44,.12),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body.single-post article.category-wallpaper-guides #blur-tool #bdBlurButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 245px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  margin: 0 0 18px !important;
  padding: 0 26px !important;
  border: 1px solid rgba(185,255,44,.70) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #c4ff37 0%, #aaff22 100%) !important;
  color: #071003 !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.01em !important;
  text-align: center !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-shadow:
    0 14px 34px rgba(185,255,44,.18),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
}

body.single-post article.category-wallpaper-guides #blur-tool #bdBlurButton span,
body.single-post article.category-wallpaper-guides #blur-tool #bdBlurButton p {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: 1 !important;
  text-align: center !important;
}

body.single-post article.category-wallpaper-guides #blur-tool #bdBlurResult {
  margin: 0 !important;
  padding: 18px 20px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(185,255,44,.06), transparent 32%),
    rgba(4, 8, 5, .58) !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;
}

body.single-post article.category-wallpaper-guides #blur-tool #bdBlurResult strong {
  color: #b9ff2c !important;
  font-weight: 950 !important;
}

@media (max-width: 767px) {
  body.single-post article.category-wallpaper-guides #blur-tool.bd-guide-tool {
    padding: 22px !important;
  }

  body.single-post article.category-wallpaper-guides #blur-tool #bdBlurButton {
    width: 100% !important;
    min-width: 0 !important;
  }
}

body.single-post article.category-wallpaper-guides .bd-guide-tool-result .bd-tool-result-line {
  display: block !important;
  margin: 0 0 6px !important;
}

body.single-post article.category-wallpaper-guides .bd-guide-tool-result .bd-tool-result-line:last-child {
  margin-bottom: 0 !important;
}

/* Backdrova Guides Grid - Hide Entry Excerpts */
body.page-id-124 .p-wrap.p-grid .entry-summary,
body.page-id-124 .p-wrap.p-grid-2 .entry-summary {
  display: none !important;
}

/* Tighten spacing now that excerpt is hidden */
body.page-id-124 .p-wrap.p-grid .entry-title,
body.page-id-124 .p-wrap.p-grid-2 .entry-title {
  margin-bottom: 14px !important;
}

/* Keep date clean under title */
body.page-id-124 .p-wrap.p-grid .p-meta,
body.page-id-124 .p-wrap.p-grid-2 .p-meta {
  margin-top: 0 !important;
}

/* Backdrova Guides Grid - Pagination Hover Text Fix */
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next:hover,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next:focus {
  color: #071008 !important;
}

/* Make sure inner arrow/text follows the button color */
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next *,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next:hover *,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-next:focus * {
  color: #071008 !important;
}

/* Keep previous/disabled pagination muted and clean */
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-prev,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-prev:hover,
body.page-id-124 .pagination-wrap.pagination-nextprev a.pagination-trigger.ajax-prev:focus {
  color: rgba(255,255,255,.72) !important;
}

/* Backdrova Colors Grid - Small Color Dot Polish */
.bd-color-card .bd-col-name {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.bd-color-card .bd-color-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
  box-shadow: 0 0 14px rgba(169, 255, 42, .18);
}

.bd-color-card .bd-color-fallback {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  display: block;
}

/* Backdrova Colors Page - Consistent Color Swatch Cards */
.bd-colors-swatch-grid .bd-color-swatch-card {
  position: relative;
  overflow: hidden;
}

.bd-colors-swatch-grid .bd-color-swatch-thumb {
  width: 48px !important;
  height: 48px !important;
  flex: 0 0 48px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.42)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 14px 28px rgba(0,0,0,.30) !important;
  position: relative;
  overflow: hidden;
}

.bd-colors-swatch-grid .bd-color-swatch-fill {
  position: absolute;
  inset: 4px;
  border-radius: 10px;
  display: block;
  overflow: hidden;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -10px 18px rgba(0,0,0,.18);
}

.bd-colors-swatch-grid .bd-color-swatch-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 28% 22%, rgba(255,255,255,.28), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.10), transparent 48%);
  pointer-events: none;
}

.bd-colors-swatch-grid .bd-col-name {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.bd-colors-swatch-grid .bd-color-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  flex: 0 0 auto;
  box-shadow: 0 0 14px rgba(169, 255, 42, .16);
}

.bd-colors-swatch-grid .bd-color-swatch-card:hover .bd-color-swatch-thumb {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 16px 34px rgba(0,0,0,.36),
    0 0 22px rgba(169,255,42,.08) !important;
}

@media (max-width: 640px) {
  .bd-colors-swatch-grid .bd-color-swatch-thumb {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
    border-radius: 11px !important;
  }

  .bd-colors-swatch-grid .bd-color-swatch-fill {
    inset: 4px;
    border-radius: 8px;
  }

  .bd-colors-swatch-grid .bd-color-dot {
    width: 8px;
    height: 8px;
  }
}

/* Backdrova Colors Page - Compact Popular Collections Card */
.bdcol-mini-collections {
  margin-top: 24px !important;
  width: 100% !important;
}

.bdcol-mini-collections .bd-collections {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
}

.bdcol-mini-collections .bd-col-card {
  width: 100% !important;
  min-height: 64px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

.bdcol-mini-collections .bd-col-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.bdcol-mini-collections .bd-col-thumb {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

.bdcol-mini-collections .bd-col-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
  display: block !important;
}

.bdcol-mini-collections .bd-col-name {
  display: block !important;
  font-size: 1rem !important;
  line-height: 1.1 !important;
  color: #fff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.bdcol-mini-collections .bd-col-count {
  display: block !important;
  font-size: .78rem !important;
  line-height: 1 !important;
  color: rgba(255,255,255,.76) !important;
  white-space: nowrap !important;
  margin-left: auto !important;
  flex: 0 0 auto !important;
  text-align: right !important;
}

@media (max-width: 640px) {
  .bdcol-mini-collections .bd-col-card {
    padding: 11px 12px !important;
    gap: 12px !important;
  }

  .bdcol-mini-collections .bd-col-thumb {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
  }

  .bdcol-mini-collections .bd-col-name {
    font-size: .95rem !important;
  }

  .bdcol-mini-collections .bd-col-count {
    font-size: .72rem !important;
  }
}

/* Backdrova Legal Pages - Cleaner Policy List Cards */
.bd-wrap.bd-page.bd-legal .bd-page-panel ul,
.bd-wrap.bd-page .bd-page-panel ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 14px 0 18px !important;
  display: grid !important;
  gap: 10px !important;
}

.bd-wrap.bd-page.bd-legal .bd-page-panel ul li,
.bd-wrap.bd-page .bd-page-panel ul li {
  position: relative !important;
  display: block !important;
  padding: 14px 16px 14px 42px !important;
  margin: 0 !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.14) !important;
  color: #cbd5e1 !important;
  line-height: 1.58 !important;
}

.bd-wrap.bd-page.bd-legal .bd-page-panel ul li::before,
.bd-wrap.bd-page .bd-page-panel ul li::before {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 19px !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: #b9ff3b !important;
  box-shadow: 0 0 0 5px rgba(185,255,59,.13), 0 0 16px rgba(185,255,59,.28) !important;
}

.bd-wrap.bd-page.bd-legal .bd-page-panel ul li strong,
.bd-wrap.bd-page .bd-page-panel ul li strong {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  color: #eef5ea !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
}

.bd-wrap.bd-page.bd-legal .bd-page-panel ul li a,
.bd-wrap.bd-page .bd-page-panel ul li a {
  color: #b9ff3b !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.bd-wrap.bd-page.bd-legal .bd-page-panel ul li a:hover,
.bd-wrap.bd-page .bd-page-panel ul li a:hover {
  color: #b9ff3b !important;
  text-decoration: underline !important;
}

@media (max-width: 768px) {
  .bd-wrap.bd-page.bd-legal .bd-page-panel ul li,
  .bd-wrap.bd-page .bd-page-panel ul li {
    padding: 13px 14px 13px 38px !important;
    border-radius: 13px !important;
    line-height: 1.55 !important;
  }

  .bd-wrap.bd-page.bd-legal .bd-page-panel ul li::before,
  .bd-wrap.bd-page .bd-page-panel ul li::before {
    left: 14px !important;
    top: 18px !important;
    width: 9px !important;
    height: 9px !important;
  }

  .bd-wrap.bd-page.bd-legal .bd-page-panel ul li strong,
  .bd-wrap.bd-page .bd-page-panel ul li strong {
    margin-bottom: 4px !important;
  }
}

/* Backdrova Legal Pages - Move List Dots Higher */
.bd-wrap.bd-page.bd-legal .bd-page-panel ul li::before,
.bd-wrap.bd-page .bd-page-panel ul li::before {
  top: 16px !important;
}

@media (max-width: 768px) {
  .bd-wrap.bd-page.bd-legal .bd-page-panel ul li::before,
  .bd-wrap.bd-page .bd-page-panel ul li::before {
    top: 15px !important;
  }
}

/* Backdrova FAQ - Lock Plus Icon Alignment on Wrapped Mobile Questions */
.bdcol-faq summary,
.bdg-faq summary,
.bdh-faq summary,
.bd-page-panel details summary {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 14px !important;
  list-style: none !important;
}

.bdcol-faq summary::-webkit-details-marker,
.bdg-faq summary::-webkit-details-marker,
.bdh-faq summary::-webkit-details-marker,
.bd-page-panel details summary::-webkit-details-marker {
  display: none !important;
}

.bdcol-faq summary::after,
.bdg-faq summary::after,
.bdh-faq summary::after,
.bd-page-panel details summary::after {
  float: none !important;
  margin-left: 0 !important;
  justify-self: end !important;
  align-self: center !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

@media (max-width: 768px) {
  .bdcol-faq summary,
  .bdg-faq summary,
  .bdh-faq summary,
  .bd-page-panel details summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    padding-right: 16px !important;
  }

  .bdcol-faq summary::after,
  .bdg-faq summary::after,
  .bdh-faq summary::after,
  .bd-page-panel details summary::after {
    justify-self: end !important;
    align-self: center !important;
  }
}

/* =========================================================
   BACKDROVA CLEAN SCREEN TEST
   ========================================================= */

.bd-clean-score-table td:first-child {
  font-weight: 700;
  white-space: nowrap;
}

.bd-clean-test {
  position: relative;
  overflow: hidden;
}

/* Kill WordPress/wpautop injected spacing inside the tool */
.bd-clean-test br,
.bd-clean-test-grid br,
.bd-clean-field br,
.bd-clean-test-button + br,
.bd-clean-test-result br {
  display: none !important;
}

.bd-clean-test > p:empty,
.bd-clean-test-grid > p:empty,
.bd-clean-field > p:empty,
.bd-clean-test-result > p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.bd-clean-test p {
  margin-top: 0;
}

.bd-clean-test::before {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  right: -150px;
  top: -150px;
  border-radius: 50%;
  background: rgba(185, 255, 59, 0.08);
  filter: blur(50px);
  pointer-events: none;
}

.bd-clean-test-heading {
  position: relative;
  z-index: 1;
}

.bd-clean-test-kicker {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--accent, #B9FF3B);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.bd-clean-test-heading h3 {
  margin: 0 0 8px !important;
}

.bd-clean-test-heading p {
  margin: 0 !important;
}

.bd-clean-test-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 14px;
  margin-top: 24px;
}

.bd-clean-field {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.bd-clean-field label {
  display: block;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: 0.87rem;
  font-weight: 700;
  line-height: 1.35;
}

.bd-clean-field select {
  display: block;
  width: 100%;
  min-height: 48px;
  margin: 0 !important;
  padding: 0 38px 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background-color: rgba(8, 16, 32, 0.82);
  color: #fff;
  font: inherit;
  line-height: normal;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.bd-clean-field select:hover {
  border-color: rgba(185, 255, 59, 0.42);
  background-color: rgba(10, 19, 36, 0.95);
}

.bd-clean-field select:focus {
  outline: none;
  border-color: var(--accent, #B9FF3B);
  box-shadow: 0 0 0 3px rgba(185, 255, 59, 0.12);
}

.bd-clean-test-button {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  margin: 18px 0 0 !important;
  padding: 0 22px;
  border: 0;
  border-radius: 10px;
  background: var(--accent, #B9FF3B);
  color: #081020;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(185, 255, 59, 0.13);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    opacity 0.2s ease;
}

.bd-clean-test-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(185, 255, 59, 0.2);
}

.bd-clean-test-button:active {
  transform: translateY(0);
}


/* =========================================================
   DEFAULT + CALCULATED RESULT
   ========================================================= */

.bd-clean-test-result {
  position: relative;
  z-index: 1;
  margin: 18px 0 0 !important;
  padding: 20px;
  border: 1px solid rgba(185, 255, 59, 0.26);
  border-radius: 12px;
  background:
    linear-gradient(
      135deg,
      rgba(185, 255, 59, 0.075),
      rgba(185, 255, 59, 0.025)
    );
}

.bd-clean-test-result > *:first-child {
  margin-top: 0 !important;
}

.bd-clean-test-result > *:last-child {
  margin-bottom: 0 !important;
}

.bd-clean-result-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 15px;
}

.bd-clean-result-label {
  display: block;
  margin-bottom: 5px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.bd-clean-result-score {
  display: block;
  margin: 0;
  color: var(--accent, #B9FF3B);
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 850;
  line-height: 0.95;
  letter-spacing: -0.04em;
}

.bd-clean-result-score span {
  margin-left: 5px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.34em;
  font-weight: 700;
  letter-spacing: 0;
}

.bd-clean-result-percent {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 62px;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid rgba(185, 255, 59, 0.34);
  border-radius: 999px;
  background: rgba(185, 255, 59, 0.075);
  color: var(--accent, #B9FF3B);
  font-size: 0.86rem;
  font-weight: 800;
}


/* Result progress meter */

.bd-clean-result-meter {
  position: relative;
  width: 100%;
  height: 7px;
  margin: 0 0 18px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}

.bd-clean-result-meter-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent, #B9FF3B);
  box-shadow: 0 0 18px rgba(185, 255, 59, 0.35);
}

.bd-clean-result-status {
  margin: 0 0 7px !important;
  color: #fff;
  font-size: 1.12rem;
  font-weight: 800;
  line-height: 1.3;
}

.bd-clean-test-result p {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.65;
}

.bd-clean-result-weak {
  margin: 16px 0 0 !important;
  padding: 14px 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  color: rgba(255, 255, 255, 0.74);
  font-size: 0.88rem;
  line-height: 1.6;
}

.bd-clean-result-weak strong {
  color: #fff;
}


/* Incomplete form response */

.bd-clean-result-notice {
  padding-left: 14px;
  border-left: 3px solid var(--accent, #B9FF3B);
}

.bd-clean-result-notice .bd-clean-result-status {
  color: var(--accent, #B9FF3B);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .bd-clean-test-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .bd-clean-score-table {
    min-width: 760px;
  }

  .bd-clean-test-button {
    width: 100%;
  }

  .bd-clean-result-top {
    align-items: flex-start;
  }

  .bd-clean-result-score {
    font-size: 3rem;
  }

}

/* Clean Screen Test - button spacing */
.bd-clean-test .bd-clean-test-button {
  margin-top: 30px !important;
}

/* =========================================================
   CLEAN SCREEN TEST - BUTTON WRAPPER SPACING
   WordPress wraps the button in a <p>, so space that wrapper.
   ========================================================= */

body.single-post article.category-wallpaper-guides
.bd-clean-test .bd-clean-test-grid + p {
  margin: 0 !important;
  padding: 30px 0 0 !important;
}

/* Keep the actual button clean inside the WP-generated wrapper */
body.single-post article.category-wallpaper-guides
.bd-clean-test .bd-clean-test-grid + p > .bd-clean-test-button {
  margin: 0 !important;
}
}

/* =========================================================
   CLEAN SCREEN TEST — GAP ABOVE SHARE CARD
   Post ID 8987 only
   ========================================================= */

body.single-post.postid-8987
article#post-8987
.e-shared-sec.entry-sec {
  position: relative !important;
  transform: translateY(28px) !important;
  margin-bottom: 82px !important;
}

/* =========================================================
   BACKDROVA COLOR INTENT MAP
   ========================================================= */

.bd-color-intent-table td:first-child {
  font-weight: 700;
  white-space: nowrap;
}

.bd-color-intent-table td:last-child {
  white-space: nowrap;
}

.bd-color-intent-table td:last-child a {
  font-weight: 700;
}

@media (max-width: 767px) {
  .bd-color-intent-table {
    min-width: 820px;
  }
}

/* =========================================================
   BACKDROVA — EDITORIAL GLASS FEATURED ROTATION
   ========================================================= */

.bdh-featured-magazine {
  position: relative;
  display: block !important;
  padding: 18px !important;
  overflow: hidden;
  isolation: isolate;
}

.bdh-featured-track {
  display: grid;
  position: relative;
}

.bdh-featured-slide {
  grid-area: 1 / 1;

  display: grid;
  grid-template-columns:
    minmax(0, 1.42fr)
    minmax(300px, .58fr);

  gap: 18px;
  align-items: stretch;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform: scale(.992);
  filter: blur(9px) saturate(.92);

  transition:
    opacity .82s cubic-bezier(.22,.61,.36,1),
    transform .95s cubic-bezier(.22,.61,.36,1),
    filter .82s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear .85s;

  z-index: 1;
}

.bdh-featured-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform: scale(1);
  filter: blur(0) saturate(1);

  transition-delay: 0s;

  z-index: 2;
}


/* Image frame */

.bdh-featured-magazine .bdh-featured-card {
  min-height: 420px;
}

.bdh-featured-magazine .bdh-featured-thumb {
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center;

  transform: scale(1.035);
  filter: saturate(.96);

  transition:
    transform 1.3s cubic-bezier(.22,.61,.36,1),
    filter 1s ease;
}

.bdh-featured-slide.is-active .bdh-featured-thumb {
  transform: scale(1);
  filter: saturate(1);
}

.bdh-featured-magazine .bdh-featured-card:hover .bdh-featured-thumb {
  transform: scale(1.018);
  filter: saturate(1.035) contrast(1.02);
}


/* High-end glass side panel */

.bdh-featured-magazine .bdh-featured-side {
  position: relative;
  overflow: hidden;

  padding: 26px 24px 82px;

  border: 1px solid rgba(255,255,255,.07);
  border-left-color: rgba(185,255,59,.26);

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(185,255,59,.12),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.016) 54%,
      rgba(185,255,59,.025)
    ),
    rgba(13,17,14,.78);

  backdrop-filter:
    blur(22px)
    saturate(1.08);

  -webkit-backdrop-filter:
    blur(22px)
    saturate(1.08);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 0 32px rgba(185,255,59,.02);

  transform: translateY(10px);
  opacity: .84;

  transition:
    transform .9s cubic-bezier(.22,.61,.36,1),
    opacity .8s ease;
}

.bdh-featured-slide.is-active .bdh-featured-side {
  transform: translateY(0);
  opacity: 1;
}

.bdh-featured-side::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  background:
    linear-gradient(
      115deg,
      rgba(255,255,255,.055),
      transparent 27%,
      transparent 72%,
      rgba(185,255,59,.045)
    );

  opacity: .52;
}


.bdh-featured-side-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;

  margin-bottom: 6px;
}

.bdh-featured-side-top .bdh-kicker {
  margin-bottom: 0;
}

.bdh-featured-edition {
  color: rgba(255,255,255,.42);

  font-size: 10px;
  font-weight: 850;
  letter-spacing: .13em;
  line-height: 1;

  white-space: nowrap;
}

.bdh-featured-magazine .bdh-featured-side h3 {
  margin-top: 12px;
}


/* =========================================================
   GLASS SWEEP TRANSITION
   ========================================================= */

.bdh-featured-magazine::after {
  content: "";

  position: absolute;
  z-index: 8;

  top: -22%;
  bottom: -22%;
  left: -45%;

  width: 36%;

  pointer-events: none;

  background:
    linear-gradient(
      105deg,
      transparent 0%,
      rgba(255,255,255,.025) 28%,
      rgba(255,255,255,.14) 47%,
      rgba(185,255,59,.09) 52%,
      rgba(255,255,255,.035) 67%,
      transparent 100%
    );

  filter: blur(5px);

  transform:
    translateX(-170%)
    skewX(-11deg);

  opacity: 0;
}

.bdh-featured-magazine.is-transitioning::after {
  animation:
    bdhFeaturedGlassSweep
    1.05s
    cubic-bezier(.22,.61,.36,1)
    both;
}

@keyframes bdhFeaturedGlassSweep {
  0% {
    transform:
      translateX(-180%)
      skewX(-11deg);
    opacity: 0;
  }

  18% {
    opacity: .72;
  }

  75% {
    opacity: .48;
  }

  100% {
    transform:
      translateX(520%)
      skewX(-11deg);
    opacity: 0;
  }
}


/* =========================================================
   CONTROLS
   ========================================================= */

.bdh-featured-controls {
  position: absolute;
  z-index: 10;

  right: 36px;
  bottom: 40px;

  display: flex;
  align-items: center;
  gap: 9px;
}

.bdh-featured-arrow,
.bdh-featured-dot {
  appearance: none;
  -webkit-appearance: none;

  margin: 0;
  padding: 0;

  cursor: pointer;
}

.bdh-featured-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 30px;
  height: 30px;

  border-radius: 999px !important;

  border:
    1px solid
    rgba(255,255,255,.12) !important;

  background:
    rgba(0,0,0,.24) !important;

  color: rgba(255,255,255,.72) !important;

  font-family: inherit;
  font-size: 19px;
  font-weight: 400;
  line-height: 1;

  backdrop-filter: blur(10px);

  transition:
    color .18s ease,
    background .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.bdh-featured-arrow:hover {
  color: #fff !important;

  border-color:
    rgba(185,255,59,.42) !important;

  background:
    rgba(185,255,59,.08) !important;

  transform: translateY(-1px);
}

.bdh-featured-dots {
  display: flex;
  align-items: center;
  gap: 6px;
}

.bdh-featured-dot {
  width: 6px;
  height: 6px;

  border: 0 !important;
  border-radius: 999px !important;

  background:
    rgba(255,255,255,.25) !important;

  box-shadow: none !important;

  transition:
    width .26s ease,
    background .26s ease,
    box-shadow .26s ease;
}

.bdh-featured-dot.is-active {
  width: 22px;

  background:
    #B9FF3B !important;

  box-shadow:
    0 0 12px
    rgba(185,255,59,.42) !important;
}


/* =========================================================
   PROGRESS LINE
   ========================================================= */

.bdh-featured-progress {
  position: absolute;

  z-index: 9;

  left: 18px;
  right: 18px;
  bottom: 0;

  height: 2px;

  overflow: hidden;

  background:
    rgba(255,255,255,.035);
}

.bdh-featured-progress span {
  display: block;

  width: 0%;
  height: 100%;

  background:
    linear-gradient(
      90deg,
      rgba(185,255,59,.28),
      #B9FF3B
    );

  box-shadow:
    0 0 15px
    rgba(185,255,59,.35);
}

.bdh-featured-magazine.is-running
.bdh-featured-progress span {
  animation:
    bdhFeaturedProgress
    8.5s
    linear
    forwards;
}

@keyframes bdhFeaturedProgress {
  from {
    width: 0%;
  }

  to {
    width: 100%;
  }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

  .bdh-featured-slide {
    grid-template-columns: 1fr;
  }

  .bdh-featured-magazine
  .bdh-featured-side {
    min-height: 240px;

    border-left-color:
      rgba(255,255,255,.07);

    border-top-color:
      rgba(185,255,59,.22);
  }

  .bdh-featured-controls {
    right: 38px;
    bottom: 38px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

  .bdh-featured-magazine {
    padding: 14px !important;
  }

  .bdh-featured-magazine
  .bdh-featured-card {
    min-height: 250px;
  }

  .bdh-featured-magazine
  .bdh-featured-thumb {
    min-height: 250px;
    height: 250px;
  }

  .bdh-featured-magazine
  .bdh-featured-side {
    min-height: 255px;

    padding:
      20px
      20px
      72px !important;
  }

  .bdh-featured-magazine
  .bdh-featured-side h3 {
    font-size:
      30px !important;
  }

  .bdh-featured-controls {
    left: 34px;
    right: auto;
    bottom: 34px;
  }

  .bdh-featured-edition {
    font-size: 9px;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .bdh-featured-slide,
  .bdh-featured-thumb,
  .bdh-featured-side,
  .bdh-featured-arrow,
  .bdh-featured-dot {
    transition: none !important;
  }

  .bdh-featured-magazine::after,
  .bdh-featured-progress span {
    animation: none !important;
  }

}

/* =========================================================
   BACKDROVA FEATURED SLIDER — CONTROL POSITION FINAL
   Keeps arrows / pagination out of the artwork and gives
   the carousel a clean editorial magazine finish.
   ========================================================= */


/* Desktop / tablet — lower-right editorial control */
.bdh-featured-magazine .bdh-featured-controls {
  left: auto !important;
  right: 38px !important;
  bottom: 38px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;

  width: auto !important;

  padding: 5px 7px !important;

  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 999px !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.018)
    ),
    rgba(5,7,6,.64) !important;

  backdrop-filter: blur(16px) saturate(1.08);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 10px 30px rgba(0,0,0,.28) !important;

  z-index: 20 !important;
}


/* Keep arrows compact inside new glass control */
.bdh-featured-magazine .bdh-featured-arrow {
  width: 29px !important;
  height: 29px !important;
  min-width: 29px !important;
  min-height: 29px !important;

  padding: 0 !important;
  margin: 0 !important;
}


/* Tighten pagination spacing */
.bdh-featured-magazine .bdh-featured-dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;

  padding: 0 2px !important;
}


/* =========================================================
   MOBILE
   Center navigation beneath the editorial information,
   rather than floating over the featured artwork.
   ========================================================= */

@media (max-width: 640px) {

  .bdh-featured-magazine .bdh-featured-controls {
    left: 50% !important;
    right: auto !important;
    bottom: 28px !important;

    transform: translateX(-50%) !important;

    padding: 5px 8px !important;
  }


  /*
   * Leave enough breathing room at the bottom of the
   * information card for the navigation.
   */
  .bdh-featured-magazine .bdh-featured-side {
    padding-bottom: 82px !important;
  }

}


/* Very small phones */
@media (max-width: 360px) {

  .bdh-featured-magazine .bdh-featured-controls {
    bottom: 24px !important;
  }

}

/* =========================================================
   BACKDROVA FEATURED ROTATION — FINAL CONTROL PLACEMENT
   Desktop: anchored inside bottom-right of wallpaper artwork
   Mobile: centered tightly below contextual chips
   ========================================================= */


/* ---------------------------------------------------------
   BASE CONTROL GLASS
   Critical: force absolute because .bdh-panel > * sets
   children to position:relative elsewhere in homepage CSS.
   --------------------------------------------------------- */

.bdh-featured-magazine .bdh-featured-controls {
  position: absolute !important;
  z-index: 30 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  width: auto !important;
  margin: 0 !important;
  padding: 5px 7px !important;

  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 999px !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.06),
      rgba(255,255,255,.018)
    ),
    rgba(5,7,6,.72) !important;

  backdrop-filter: blur(16px) saturate(1.08);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 28px rgba(0,0,0,.32) !important;
}


/* ---------------------------------------------------------
   DESKTOP — bottom-right INSIDE wallpaper box

   Featured layout:
   image = roughly 71%
   side  = roughly 29%

   This positions the controls against the right side
   of the artwork rather than against the entire panel.
   --------------------------------------------------------- */

@media (min-width: 981px) {

  .bdh-featured-magazine .bdh-featured-controls {
    left: auto !important;

    /*
     * Push inward by sidebar width + gap.
     * Result: controls land inside lower-right artwork.
     */
    right: calc(29% + 50px) !important;

    /*
     * Lifts controls above the bottom panel/progress area
     * and into the wallpaper itself.
     */
    bottom: 62px !important;

    transform: none !important;
  }

}


/* ---------------------------------------------------------
   TABLET — keep it centered beneath editorial content
   once the two columns stack.
   --------------------------------------------------------- */

@media (min-width: 641px) and (max-width: 980px) {

  .bdh-featured-magazine .bdh-featured-controls {
    left: 50% !important;
    right: auto !important;
    bottom: 22px !important;

    transform: translateX(-50%) !important;
  }

}


/* ---------------------------------------------------------
   MOBILE — tighten chips → slider controls spacing
   --------------------------------------------------------- */

@media (max-width: 640px) {

  /*
   * Remove some of the intentionally reserved space that
   * was making the bottom of the editorial card too tall.
   */
  .bdh-featured-magazine .bdh-featured-side {
    min-height: 0 !important;
    padding-bottom: 62px !important;
  }


  .bdh-featured-magazine .bdh-featured-controls {
    left: 50% !important;
    right: auto !important;

    /*
     * Pull navigation closer to the contextual chips.
     */
    bottom: 14px !important;

    transform: translateX(-50%) !important;
  }

}


/* ---------------------------------------------------------
   CONTROL DETAILS
   --------------------------------------------------------- */

.bdh-featured-magazine .bdh-featured-arrow {
  width: 29px !important;
  height: 29px !important;
  min-width: 29px !important;
  min-height: 29px !important;

  margin: 0 !important;
  padding: 0 !important;
}


.bdh-featured-magazine .bdh-featured-dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 6px !important;
  padding: 0 2px !important;
}


/* tiny phones */
@media (max-width: 360px) {

  .bdh-featured-magazine .bdh-featured-side {
    padding-bottom: 60px !important;
  }

  .bdh-featured-magazine .bdh-featured-controls {
    bottom: 13px !important;
  }

}

/* =========================================================
   BACKDROVA FEATURED — MINIMAL EDITORIAL NAV
   Removes outer capsule while preserving glass controls
   ========================================================= */

.bdh-featured-magazine .bdh-featured-controls {
  /* Remove the outer UI box */
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;

  gap: 8px !important;
}


/* Keep individual arrows as subtle glass buttons */
.bdh-featured-magazine .bdh-featured-arrow {
  width: 31px !important;
  height: 31px !important;
  min-width: 31px !important;
  min-height: 31px !important;

  border: 1px solid rgba(255,255,255,.13) !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    ),
    rgba(5,7,6,.58) !important;

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 6px 18px rgba(0,0,0,.24) !important;
}


/* Dots float cleanly between arrows */
.bdh-featured-magazine .bdh-featured-dots {
  gap: 6px !important;
  padding: 0 2px !important;
}


/* Desktop position is already right — retain it */
@media (min-width: 981px) {
  .bdh-featured-magazine .bdh-featured-controls {
    right: calc(29% + 50px) !important;
    bottom: 62px !important;
  }
}


/* Mobile — lift controls away from progress line */
@media (max-width: 640px) {

  .bdh-featured-magazine .bdh-featured-side {
    padding-bottom: 70px !important;
  }

  .bdh-featured-magazine .bdh-featured-controls {
    left: 50% !important;
    right: auto !important;
    bottom: 29px !important;
    transform: translateX(-50%) !important;
  }

}

.bd-mac-wallpaper-guide .bd-guide-answer {
  margin: 28px 0;
  padding: 22px 24px;
  border: 1px solid rgba(185,255,59,.22);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(185,255,59,.075), rgba(185,255,59,.018));
}

.bd-mac-wallpaper-guide .bd-guide-answer strong {
  color: #b9ff3b;
}

.bd-mac-wallpaper-guide .bd-guide-answer p {
  margin: 8px 0 0;
}

.bd-mac-wallpaper-guide .bd-guide-figure {
  margin: 32px 0;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  background: rgba(15,23,42,.48);
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
}

.bd-mac-wallpaper-guide .bd-guide-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.bd-mac-wallpaper-guide .bd-guide-figure figcaption {
  padding: 12px 8px 5px;
  margin: 0;
  font-size: .9rem;
  line-height: 1.55;
  opacity: .72;
}

.bd-mac-wallpaper-guide .bd-guide-path {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
  margin: 22px 0;
  padding: 15px 18px;
  border-radius: 12px;
  background: rgba(255,255,255,.045);
  font-size: .95rem;
}

.bd-mac-wallpaper-guide .bd-guide-path strong {
  color: #b9ff3b;
}

.bd-mac-wallpaper-guide .bd-guide-workflow {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  margin: 26px 0;
}

.bd-mac-wallpaper-guide .bd-guide-workflow > div {
  min-height: 112px;
  padding: 17px 15px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.bd-mac-wallpaper-guide .bd-guide-workflow strong {
  display: block;
  margin-bottom: 11px;
  color: #b9ff3b;
  font-size: 1.25rem;
}

.bd-mac-wallpaper-guide .bd-guide-workflow span {
  display: block;
  line-height: 1.45;
}

@media (max-width: 760px) {
  .bd-mac-wallpaper-guide .bd-guide-workflow {
    grid-template-columns: 1fr;
  }

  .bd-mac-wallpaper-guide .bd-guide-workflow > div {
    min-height: 0;
  }
}

/* =========================================================
   BACKDROVA GUIDE — INSTRUCTIONAL FIGURES
   ========================================================= */

.bd-guide-article .bd-guide-figure {
  width: 100%;
  max-width: 820px;
  margin: 30px 0 34px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  box-shadow: 0 18px 45px rgba(0,0,0,.22);
}

.bd-guide-article .bd-guide-figure img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  border-radius: 10px;
}

.bd-guide-article .bd-guide-figure figcaption {
  margin: 0;
  padding: 11px 7px 3px;
  color: rgba(255,255,255,.68);
  font-size: 13px;
  line-height: 1.5;
}


/* =========================================================
   GUIDE — NUMBERED INSTRUCTIONS
   ========================================================= */

.bd-guide-article ol {
  margin: 22px 0 26px;
  padding-left: 25px;
}

.bd-guide-article ol li {
  margin-bottom: 13px;
  padding-left: 3px;
  line-height: 1.6;
}

.bd-guide-article ol li:last-child {
  margin-bottom: 0;
}


/* MOBILE */
@media (max-width: 767px) {

  .bd-guide-article .bd-guide-figure {
    max-width: 100%;
    margin: 24px 0 28px;
    padding: 7px;
    border-radius: 13px;
  }

  .bd-guide-article .bd-guide-figure img {
    border-radius: 8px;
  }

  .bd-guide-article .bd-guide-figure figcaption {
    font-size: 12px;
    padding: 9px 5px 2px;
  }

}

/* =========================================================
   BACKDROVA GUIDE — MAC FOLDER PATH
   Finder → Pictures → Wallpapers
   ========================================================= */

.bd-guide-article .bd-guide-path {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 8px 0 24px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,.018)
    ) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.14) !important;
}

.bd-guide-article .bd-guide-path span,
.bd-guide-article .bd-guide-path strong {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border-radius: 9px !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.bd-guide-article .bd-guide-path span:nth-child(odd) {
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.88) !important;
  font-weight: 600 !important;
}

.bd-guide-article .bd-guide-path span:nth-child(even) {
  min-height: auto !important;
  padding: 0 2px !important;
  background: transparent !important;
  color: rgba(255,255,255,.38) !important;
  font-weight: 500 !important;
}

.bd-guide-article .bd-guide-path strong {
  border: 1px solid rgba(185,255,59,.22) !important;
  background: rgba(185,255,59,.08) !important;
  color: #b9ff3b !important;
  font-weight: 700 !important;
}


/* =========================================================
   BACKDROVA GUIDE — STEP WORKFLOW
   ========================================================= */

.bd-guide-article .bd-guide-workflow {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 26px 0 30px !important;
}

.bd-guide-article .bd-guide-workflow > div {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-width: 0 !important;
  min-height: 124px !important;
  margin: 0 !important;
  padding: 17px 16px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,.018)
    ) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.12) !important;
}

.bd-guide-article .bd-guide-workflow > div::after {
  content: "→";
  position: absolute;
  top: 50%;
  right: -10px;
  z-index: 3;
  transform: translate(50%, -50%);
  color: rgba(185,255,59,.48);
  font-size: 16px;
  font-weight: 700;
}

.bd-guide-article .bd-guide-workflow > div:last-child::after {
  display: none;
}

.bd-guide-article .bd-guide-workflow strong {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 31px !important;
  height: 31px !important;
  margin: 0 0 18px !important;
  border: 1px solid rgba(185,255,59,.30) !important;
  border-radius: 50% !important;
  background: rgba(185,255,59,.08) !important;
  color: #b9ff3b !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}

.bd-guide-article .bd-guide-workflow span {
  display: block !important;
  margin: 0 !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
}


/* Gentle emphasis on the final step */
.bd-guide-article .bd-guide-workflow > div:last-child {
  border-color: rgba(185,255,59,.18) !important;
  background:
    linear-gradient(
      145deg,
      rgba(185,255,59,.055),
      rgba(255,255,255,.018)
    ) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .bd-guide-article .bd-guide-path {
    display: flex !important;
    width: 100% !important;
    padding: 9px !important;
    gap: 6px !important;
  }

  .bd-guide-article .bd-guide-path span,
  .bd-guide-article .bd-guide-path strong {
    min-height: 35px !important;
    padding: 0 10px !important;
    font-size: 13px !important;
  }


  .bd-guide-article .bd-guide-workflow {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin: 22px 0 26px !important;
  }

  .bd-guide-article .bd-guide-workflow > div {
    display: grid !important;
    grid-template-columns: 34px 1fr !important;
    align-items: center !important;
    justify-content: initial !important;
    min-height: 0 !important;
    padding: 13px 15px !important;
  }

  .bd-guide-article .bd-guide-workflow strong {
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    font-size: 12px !important;
  }

  .bd-guide-article .bd-guide-workflow span {
    padding-left: 10px !important;
    font-size: 13px !important;
  }

  .bd-guide-article .bd-guide-workflow > div::after {
    content: "↓";
    top: auto;
    right: auto;
    bottom: -10px;
    left: 30px;
    transform: translate(-50%, 50%);
    font-size: 13px;
  }

}

/* =========================================================
   BACKDROVA SINGLE GUIDES — FINAL RHYTHM + WORKFLOW HOVER
   Consistent lower-page spacing + neon workflow interaction
   ========================================================= */

body.single-post article.category-wallpaper-guides {
  --bdg-section-space: 46px;
}


/* ---------------------------------------------------------
   1) LOWER ARTICLE VERTICAL RHYTHM
   FAQ → Contents → Related Guides → Share
   --------------------------------------------------------- */

/* FAQ owns the space beneath itself */
body.single-post article.category-wallpaper-guides .bd-guide-faq {
  margin-bottom: var(--bdg-section-space) !important;
}


/* Remove stacked top margin from Contents.
   Give it one controlled gap beneath. */
body.single-post article.category-wallpaper-guides .ruby-table-contents.rbtoc {
  margin-top: 0 !important;
  margin-bottom: var(--bdg-section-space) !important;
}


/* Foxiz wrapper was adding another 34px before Related Guides */
body.single-post article.category-wallpaper-guides .entry-bottom {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* Related Guides owns the space before the next section */
body.single-post article.category-wallpaper-guides
#text-2.widget_text
.related-sec.related-5 {
  margin-bottom: var(--bdg-section-space) !important;
}


/* Keep share panel from introducing another top gap */
body.single-post article.category-wallpaper-guides .e-shared-sec,
body.single-post article.category-wallpaper-guides .e-shared-sec.entry-sec {
  margin-top: 0 !important;
}


/* ---------------------------------------------------------
   2) BETTER WALLPAPER WORKFLOW — NEON HOVER
   --------------------------------------------------------- */

body.single-post article.category-wallpaper-guides
.bd-guide-article
.bd-guide-workflow > div {
  overflow: hidden !important;

  transition:
    transform .22s ease,
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease !important;
}


body.single-post article.category-wallpaper-guides
.bd-guide-article
.bd-guide-workflow strong {
  transition:
    color .22s ease,
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease,
    transform .22s ease !important;
}


body.single-post article.category-wallpaper-guides
.bd-guide-article
.bd-guide-workflow > div::after {
  transition:
    color .22s ease,
    text-shadow .22s ease !important;
}


@media (hover:hover) {

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:hover {
    transform: translateY(-3px) !important;

    border-color: rgba(185,255,59,.42) !important;

    background:
      radial-gradient(
        circle at 85% 10%,
        rgba(185,255,59,.10),
        transparent 42%
      ),
      linear-gradient(
        145deg,
        rgba(185,255,59,.055),
        rgba(255,255,255,.022)
      ) !important;

    box-shadow:
      0 18px 38px rgba(0,0,0,.25),
      0 0 0 1px rgba(185,255,59,.05) inset,
      0 0 24px rgba(185,255,59,.055) !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:hover strong {
    transform: scale(1.05) !important;

    border-color: rgba(185,255,59,.72) !important;
    background: rgba(185,255,59,.13) !important;

    color: #c8ff58 !important;

    box-shadow:
      0 0 18px rgba(185,255,59,.16) !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:hover::after {
    color: rgba(185,255,59,.85) !important;
    text-shadow: 0 0 12px rgba(185,255,59,.32) !important;
  }
}


/* Final step stays subtly featured before hover */
body.single-post article.category-wallpaper-guides
.bd-guide-article
.bd-guide-workflow > div:last-child {
  border-color: rgba(185,255,59,.22) !important;

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(185,255,59,.075),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      rgba(185,255,59,.055),
      rgba(255,255,255,.018)
    ) !important;
}


/* =========================================================
   BACKDROVA SINGLE GUIDES — FINAL SECTION RHYTHM
   One component owns each gap — no stacked spacing
   ========================================================= */

body.single-post article.category-wallpaper-guides {
  --bdg-section-space: 46px;
}


/* FAQ → Contents */
body.single-post article.category-wallpaper-guides .bd-guide-faq {
  margin-bottom: var(--bdg-section-space) !important;
}


/* Contents itself does NOT add another gap below */
body.single-post article.category-wallpaper-guides
.ruby-table-contents.rbtoc {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* Neutralize Foxiz wrapper spacing */
body.single-post article.category-wallpaper-guides
.entry-bottom {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* Contents → Related Guides
   Related Guides owns this gap */
body.single-post article.category-wallpaper-guides
#text-2.widget_text
.related-sec.related-5 {
  margin-top: var(--bdg-section-space) !important;
  margin-bottom: var(--bdg-section-space) !important;
}


/* Related Guides → Share
   Share doesn't create another stacked top margin */
body.single-post:has(article.category-wallpaper-guides)
.e-shared-sec.entry-sec {
  margin-top: 0 !important;
}


/* Mobile rhythm */
@media (max-width: 767px) {

  body.single-post article.category-wallpaper-guides {
    --bdg-section-space: 38px;
  }

}

/* =========================================================
   BACKDROVA GUIDE SHARE — MOBILE COMPACT UI
   ========================================================= */

@media (max-width: 767px) {

  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec.entry-sec {

    display: block !important;

    width: 100% !important;

    margin-bottom: 28px !important;
    padding: 14px 15px !important;

    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 15px !important;

    background:
      radial-gradient(
        circle at 100% 0%,
        rgba(185,255,59,.065),
        transparent 42%
      ),
      linear-gradient(
        145deg,
        rgba(26,31,27,.98),
        rgba(14,17,15,.99)
      ) !important;

    box-shadow:
      0 14px 34px rgba(0,0,0,.16) !important;
  }


  /* Header */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .e-shared-header {

    display: flex !important;
    align-items: center !important;
    gap: 8px !important;

    margin: 0 0 12px !important;
    padding: 0 !important;

    color: rgba(255,255,255,.86) !important;

    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
  }


  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .e-shared-header > i {

    color: #b9ff3b !important;

    font-size: 14px !important;

    filter:
      drop-shadow(0 0 7px rgba(185,255,59,.15));
  }


  /* One single icon row */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .rbbsl {

    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;

    gap: 6px !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  /* Hide network labels — icon UI only */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action span {

    display: none !important;
  }


  /* Every share control gets identical dimensions */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action {

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 32px !important;

    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 9px !important;

    background:
      rgba(255,255,255,.025) !important;

    color: rgba(255,255,255,.82) !important;

    font-size: 14px !important;
    line-height: 1 !important;

    box-shadow: none !important;

    transition:
      color .20s ease,
      border-color .20s ease,
      background .20s ease,
      box-shadow .20s ease,
      transform .20s ease !important;
  }


  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action i {

    margin: 0 !important;
    padding: 0 !important;

    font-size: 14px !important;
    line-height: 1 !important;
  }


  /* Copy link gets the tiniest Backdrova emphasis */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action.icon-copy {

    border-color: rgba(185,255,59,.25) !important;

    color: #b9ff3b !important;

    background:
      rgba(185,255,59,.045) !important;
  }


  /* Native "more/share" control */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .more-icon {

    border-color: rgba(185,255,59,.18) !important;
  }


  /* Touch / keyboard interaction */
  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action:active,

  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action:focus-visible {

    transform: translateY(-1px) !important;

    color: #b9ff3b !important;

    border-color: rgba(185,255,59,.52) !important;

    background:
      rgba(185,255,59,.075) !important;

    box-shadow:
      0 0 15px rgba(185,255,59,.10) !important;

    outline: none !important;
  }

}

@media (min-width: 768px) and (hover:hover) {

  body.single-post:has(article.category-wallpaper-guides)
  .e-shared-sec .share-action:hover {

    color: #b9ff3b !important;

    border-color: rgba(185,255,59,.42) !important;

    background:
      rgba(185,255,59,.055) !important;

    box-shadow:
      0 0 16px rgba(185,255,59,.075) !important;

    transform: translateY(-2px);
  }

}

/* =========================================================
   BACKDROVA GUIDES — REMOVE FOXIZ DESKTOP SECTION GAP
   ========================================================= */

@media (min-width: 1025px) {
  body.single-post article.category-wallpaper-guides
  .e-ct-outer > * {
    margin-bottom: 0 !important;
  }
}

.e-ct-outer > * {
  margin-bottom: 35px;
}

/* =========================================================
   BACKDROVA GUIDE WORKFLOW — MOBILE FINAL POLISH
   ========================================================= */

@media (max-width: 767px) {

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 1fr !important;

    gap: 9px !important;

    margin: 22px 0 28px !important;
  }


  /* -------------------------------------------------------
     STEP CARD
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div {
    position: relative !important;
    overflow: visible !important;

    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    align-items: center !important;

    gap: 12px !important;

    width: 100% !important;
    min-height: 66px !important;

    margin: 0 !important;
    padding: 14px 15px !important;

    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 13px !important;

    background:
      radial-gradient(
        circle at 100% 0%,
        rgba(185,255,59,.025),
        transparent 38%
      ),
      linear-gradient(
        145deg,
        rgba(24,28,25,.98),
        rgba(13,16,14,.99)
      ) !important;

    box-shadow:
      0 10px 25px rgba(0,0,0,.14) !important;

    transform: none !important;
  }


  /* -------------------------------------------------------
     STEP NUMBER
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow strong {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;
    min-width: 29px !important;

    margin: 0 !important;

    border: 1px solid rgba(185,255,59,.38) !important;
    border-radius: 999px !important;

    background:
      rgba(185,255,59,.07) !important;

    color: rgba(255,255,255,.92) !important;

    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    box-shadow:
      inset 0 0 0 1px rgba(185,255,59,.02) !important;
  }


  /* -------------------------------------------------------
     STEP TEXT
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow span {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: rgba(255,255,255,.88) !important;

    font-size: 13.5px !important;
    line-height: 1.35 !important;
    font-weight: 650 !important;

    letter-spacing: -.01em !important;

    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }


  /* -------------------------------------------------------
     CONNECTOR BETWEEN STEPS
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div::after {
    content: "" !important;

    position: absolute !important;

    top: 100% !important;
    left: 29px !important;

    width: 1px !important;
    height: 10px !important;

    background:
      linear-gradient(
        180deg,
        rgba(185,255,59,.55),
        rgba(185,255,59,.10)
      ) !important;

    transform: none !important;

    opacity: .8 !important;

    pointer-events: none !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:last-child::after {
    display: none !important;
  }


  /* -------------------------------------------------------
     FINAL STEP
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:last-child {
    border-color: rgba(185,255,59,.32) !important;

    background:
      radial-gradient(
        circle at 100% 0%,
        rgba(185,255,59,.09),
        transparent 45%
      ),
      linear-gradient(
        145deg,
        rgba(22,31,17,.98),
        rgba(12,17,11,.99)
      ) !important;

    box-shadow:
      0 12px 28px rgba(0,0,0,.16),
      inset 0 0 0 1px rgba(185,255,59,.018) !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:last-child strong {
    color: #c8ff58 !important;

    border-color: rgba(185,255,59,.58) !important;

    background:
      rgba(185,255,59,.11) !important;

    box-shadow:
      0 0 14px rgba(185,255,59,.07) !important;
  }


  /* -------------------------------------------------------
     TOUCH INTERACTION
     ------------------------------------------------------- */

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div:active {
    border-color: rgba(185,255,59,.40) !important;

    background:
      radial-gradient(
        circle at 100% 0%,
        rgba(185,255,59,.08),
        transparent 42%
      ),
      linear-gradient(
        145deg,
        rgba(26,31,27,.98),
        rgba(14,17,15,.99)
      ) !important;
  }

}

/* =========================================================
   BACKDROVA WORKFLOW — MOBILE TYPE / ALIGNMENT TUNING
   ========================================================= */

@media (max-width: 767px) {

  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow > div {

    grid-template-columns: 32px minmax(0,1fr) !important;
    align-items: center !important;

    min-height: 72px !important;

    padding: 12px 15px !important;
    gap: 12px !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow strong {

    align-self: center !important;

    width: 29px !important;
    height: 29px !important;

    margin: 0 !important;

    font-size: 12px !important;
    line-height: 1 !important;
  }


  body.single-post article.category-wallpaper-guides
  .bd-guide-article
  .bd-guide-workflow span {

    align-self: center !important;

    margin: 0 !important;

    font-size: 14.5px !important;
    line-height: 1.3 !important;
    font-weight: 650 !important;
  }

}