/* =========================================================
   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;
}