.hero-badge-card{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-lg); padding:32px; }
.hero-badge-card h3{ font-size:28px; font-weight:700; color:#fff; margin-bottom:10px; }
.hero-badge-card p{ color:#C7D0E3; font-size:14px; line-height:1.6; margin-bottom:20px; }
.hero-badge-card .std-list{ display:flex; flex-wrap:wrap; gap:8px; }
.hero-badge-card .std{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:4px; padding:5px 11px; font-family:var(--font-body); font-size:11px; color:rgba(255,255,255,.85); letter-spacing:.08em; }

.fitt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.fitt-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s; }
.fitt-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.fitt-card .fc-photo{
  aspect-ratio:1; background:var(--bg-2); border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; padding:18px;
}
.fitt-card .fc-photo img{ width:100%; height:100%; object-fit:contain; }
.fitt-card .fh{ padding:28px 24px; background:linear-gradient(135deg, #0B2A24, #0E4F3F); position:relative; overflow:hidden; }
.fitt-card .fh::before{ content:""; position:absolute; inset:0; background:repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 20px); }
.fitt-card .fh h3{ color:#fff; font-size:21px; font-weight:700; position:relative; }
.fitt-card .fh p{ color:rgba(255,255,255,.7); font-size:13px; margin-top:4px; position:relative; }
.fitt-card .fb{ padding:22px 24px 26px; flex:1; }
.fitt-card .fb h4{ font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:10px; }
.fitt-card .fb ul{ list-style:none; padding:0; margin:0 0 14px; display:flex; flex-direction:column; gap:6px; }
.fitt-card .fb li{ font-size:13.5px; color:var(--ink-2); padding-left:16px; position:relative; }
.fitt-card .fb li::before{ content:""; position:absolute; left:0; top:8px; width:5px; height:5px; background:var(--red); border-radius:50%; }
.fitt-card .fb .mat-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.mat-chip{ background:var(--bg-3); color:var(--ink-2); font-family:var(--font-body); font-size:11px; letter-spacing:.06em; padding:3px 9px; border-radius:4px; }

/* Why Choose BETFITT */
.why-section{ background:#fff; }
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:36px; }
.why-card{
  background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:28px 24px 30px; display:flex; flex-direction:column;
  transition:transform .2s, box-shadow .2s;
}
.why-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.why-num{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%;
  background:var(--navy); color:#fff;
  font-family:var(--font-display); font-size:13px; font-weight:700; letter-spacing:.04em;
}
.why-card h3{
  font-family:var(--font-display); font-size:18px; font-weight:700; line-height:1.3;
  color:var(--navy); margin:18px 0 10px;
}
.why-card p{ font-size:14px; line-height:1.7; color:var(--muted); margin:0; }
@media(max-width:1100px){
  .why-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:640px){
  .why-grid{ grid-template-columns:1fr; }
}
@media(max-width:900px){
  .fitt-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:560px){
  .fitt-grid{ grid-template-columns:1fr; }
}

/* Product photos are shot on a white background — multiply-blend them so the
   white drops out and only the product sits on the panel. */
.bf-product-page .bf-slider{
  min-height: 460px;
}
.bf-product-page .bf-slider-viewport{
  padding: clamp(24px, 4vw, 56px);
}
.bf-product-page .bf-slider-slide img{
  max-height: 440px;
  height: 440px;
  mix-blend-mode: multiply;
  filter: none;
}
.manifold-card .mc-photo img{
  mix-blend-mode: multiply;
}
@media (max-width: 900px){
  .bf-product-page .bf-slider{
    min-height: clamp(300px, 62vw, 400px);
  }
  .bf-product-page .bf-slider-slide img{
    max-height: clamp(260px, 55vw, 360px);
    height: clamp(260px, 55vw, 360px);
  }
}

/* Product detail pages (/products/betfitt/<slug>/) */
.fitt-crumb{ margin:0 0 18px; }
.fitt-crumb a{
  font-family:var(--font-display); font-size:12px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--navy);
  text-decoration:none;
}
.fitt-crumb a:hover{ color:var(--red); }
.fitt-detail-section.block{
  padding-top: clamp(40px, 5vw, 68px);
  padding-bottom: clamp(40px, 5vw, 68px);
}
.fitt-detail-section .section-head{ margin-bottom:26px; }

.fitt-faq-list{ display:grid; gap:12px; }
.fitt-faq{
  border-radius:var(--radius-lg); background:#fff;
  border:1px solid var(--line); border-left:3px solid var(--line);
  overflow:hidden; transition:border-color .2s ease, box-shadow .2s ease;
}
.fitt-faq:hover{ border-color:var(--navy); border-left-color:var(--navy); box-shadow:var(--shadow-sm); }
.fitt-faq[open]{ border-left-color:var(--red); box-shadow:var(--shadow-sm); }
.fitt-faq summary{
  display:flex; align-items:center; gap:14px; cursor:pointer;
  padding:16px 18px; font-size:15px; font-weight:700; color:var(--ink);
  list-style:none;
}
.fitt-faq summary::-webkit-details-marker{ display:none; }
.fitt-faq-num{
  font-family:var(--font-display); font-size:12px; font-weight:700;
  letter-spacing:.06em; color:var(--muted);
}
.fitt-faq-q{ flex:1; }
.fitt-faq-icon{
  width:26px; height:26px; border-radius:50%; flex:none;
  background:var(--bg-3); color:var(--navy);
  display:grid; place-items:center;
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.fitt-faq[open] .fitt-faq-icon{ transform:rotate(45deg); background:var(--red); color:#fff; }
.fitt-faq-a{ padding:0 18px 18px 54px; }
.fitt-faq-a p{ margin:0; font-size:14.5px; line-height:1.7; color:var(--muted); }
@media(max-width:640px){
  .fitt-faq-a{ padding-left:18px; }
}
