/* ═══════════════════════════════════════════════════════════════
   FINAL brand + hw fixes
   ═══════════════════════════════════════════════════════════════ */

/* ── Hardware section readability ── */
.hw-card-tag {
  font-size: 11.5px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
}
.hw-card.featured .hw-card-tag { color: #FCA5A5 !important; }

.hw-price-unit {
  font-size: 12.5px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-weight: 500 !important;
}
.hw-spec-k {
  font-size: 11px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
}
.hw-spec-v {
  color: #FFFFFF !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}
.hw-trust-item {
  color: rgba(255, 255, 255, 0.92) !important;
  font-weight: 500 !important;
}

/* ── Brand names: pure inherit, no jumps ── */
.brand-name {
  /* Force body font (Inter) — matches hw-card-name treatment on youShop/youResto,
     so the "y" always looks the same as the youcloud logo's y, even inside
     mono-badge / uppercase contexts. */
  font-family: var(--f-body) !important;
  font-size: inherit !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
  line-height: inherit !important;
  /* ALWAYS preserve case — even inside uppercase parents like .tag / .eyebrow —
     so youShop, y1000, y10D etc. keep their lowercase y and camelCase */
  text-transform: none !important;
  vertical-align: baseline !important;
}

/* ── Inside eyebrow pills: uppercase everything for uniform read
   ("WHY MERCHANTS PICK YOUCLOUD" reads as a single line, not mixed case) ── */
.eyebrow .brand-name,
.e-eyebrow .brand-name {
  text-transform: uppercase !important;
  font-family: inherit !important;   /* match the mono / small-caps eyebrow font */
  font-weight: inherit !important;
  letter-spacing: inherit !important;
}

/* ── Hardware model names (y1000, y4000, y5000, y7000, y10) ──
   The lowercase "y" must render in the YouCloud logo font.
   The digits keep the display font.
   Trick: use a leading-letter override via first-letter pseudo. */
.hw-card-name {
  font-family: var(--f-display, "Bricolage Grotesque", "Inter", sans-serif) !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  text-transform: none !important;
}
/* The first-letter (the "y") gets the logo font, matching youcloud/youResto */
.hw-card-name::first-letter {
  font-family: var(--f-logo, "Calibri", "Segoe UI", sans-serif) !important;
  font-weight: 700 !important;
  /* Slight optical size bump so the Calibri y matches Bricolage digits */
  font-size: 1.05em !important;
}

/* ── Corner badges: FIX invisible-on-white bug ──
   Badges are positioned inside .hw-card but sit ABOVE the white
   .hw-photo-wrap. White text on white = invisible.
   Fix: give badges a dark solid background + light text so they
   read on the white photo area beneath. */
.hw-card-corner-badge {
  background: rgba(11, 29, 58, 0.92) !important;   /* dark navy */
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 3 !important;
}
/* Featured badge — coral/rose stays, but with solid backing */
.hw-card-corner-badge.featured {
  background: linear-gradient(135deg, #E63946 0%, #C1121F 100%) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  color: #FFFFFF !important;
}
/* Youshop features amber — swap color */
.hw-card.featured .hw-card-corner-badge.featured {
  /* On youshop the featured card uses amber, on youresto it uses rose.
     Since this file is shared, keep the default rose and let youshop
     override inline if needed. */
}
/* New age badge — solid violet */
.hw-card-corner-badge.new-age {
  background: linear-gradient(135deg, #7C3AED 0%, #5B21B6 100%) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  color: #FFFFFF !important;
}