:root{
  --bg:#0f0f12;
  --bg-hero:#121317;
  --txt:#f5f7fa;
  --muted:#cfd6df;
  --line:#1e1e23;
  --brand:#ff6b3d;
  --brand-2:#ff8f66;
}

*{box-sizing:border-box}
html,body{
  margin:0;padding:0;
  background:var(--bg);color:var(--txt);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}

.container{width:min(1140px,94vw);margin:0 auto}
.row{display:flex;align-items:center;justify-content:space-between}

/* ===== Botões & badges ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 22px;border-radius:14px;background:#111;border:1px solid #2a2a30;
  color:#fff;font-weight:800;letter-spacing:.2px;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  transition:transform .18s ease, box-shadow .18s ease
}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(0,0,0,.45)}
.btn--brand{background:linear-gradient(135deg,var(--brand),var(--brand-2));border:none}

.badge{
  display:inline-flex;gap:8px;align-items:center;padding:10px 14px;border-radius:999px;
  background:#1a1b20;border:1px solid #23232a;color:#d7dde5;font-weight:700
}
.subtle{color:#cfd6df;margin-top:12px}

/* ===== Header (fixo no topo) ===== */
:root{ --header-h:44px; --header-h-sm:40px; } /* antes: 52px / 46px */

header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:#0f0f12cc; backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
body{ padding-top:var(--header-h); }
@media (max-width:560px){ body{ padding-top:var(--header-h-sm); } }

header .row{ padding:6px 0; } /* antes: 8px */
.logo{ display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.2px }
.logo svg{ width:26px; height:26px; display:block }
.nav-min{ display:flex; gap:18px; align-items:center; color:#cfd6df }
.nav-min a{ font-weight:600; opacity:.9 }
.nav-min a:hover{ opacity:1 }

/* âncoras com compensação correta */
#kits, #pontos-fortes, #beneficios, #reviews, .hero { scroll-margin-top:var(--header-h); }
@media (max-width:560px){
  #kits, #pontos-fortes, #beneficios, #reviews, .hero { scroll-margin-top:var(--header-h-sm); }
}

/* ===== Hero: reduzir espaço no topo ===== */
.hero{ padding:28px 0 28px; }          /* antes 36px/32px */
@media (max-width:560px){
  .hero{ padding:22px 0 24px; }       /* antes 28px/26px */
}



/* ===== Hero ===== */
.hero{background:var(--bg-hero);padding:64px 0 44px}
.hero__wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(34px,6vw,64px);line-height:1.05;margin:10px 0 12px}
.hero h1 .accent{color:var(--brand)}
.hero .lead{font-size:clamp(16px,2.6vw,20px);color:var(--muted);max-width:62ch;margin:0 0 18px}
.hero__media{border:1px solid #23232a;border-radius:20px;overflow:hidden;background:#0b0b0d}

/* ===== Swipe (carrossel base) ===== */
.swipe{position:relative;display:grid}
.swipe__viewport{
  overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  grid-area:1/1;z-index:1
}
.swipe__viewport::-webkit-scrollbar{display:none}
.swipe__track{display:grid;grid-auto-flow:column;grid-auto-columns:100%}
.swipe__slide{
  width:100%;display:block;object-fit:cover;aspect-ratio:3/4;
  scroll-snap-align:start;user-select:none;-webkit-user-drag:none
}
.swipe__nav{
  grid-area:1/1;align-self:center;
  width:42px;height:42px;border-radius:50%;border:1px solid #2a2a30;
  background:rgba(20,20,24,.80);color:#fff;font-size:22px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  z-index:3; /* acima do conteúdo */
  transition:background .2s ease,opacity .2s ease;opacity:.95;
  pointer-events:auto;
}
.swipe__nav:hover{background:rgba(20,20,24,.95)}
.swipe__nav.prev{justify-self:start;margin-left:10px}
.swipe__nav.next{justify-self:end;margin-right:10px}

@media (max-width:980px){
  .hero__wrap{grid-template-columns:1fr;gap:28px}
  .hero__copy{max-width:720px}
  .hero__media{max-width:720px;margin:0 auto}
}
@media (max-width:560px){
  header .row{padding:10px 0}
  .nav-min{gap:14px}
  .hero{padding:48px 0 32px}
  .hero__copy{text-align:center}
  .btn{width:100%}
  .badge{margin-left:auto;margin-right:auto}
  .swipe__nav{width:34px;height:34px;font-size:18px}
  .swipe__nav.prev{margin-left:6px}
  .swipe__nav.next{margin-right:6px}
}

/* ===== Proof bar ===== */
.proof.proof--carousel{
  background:#15171d;
  border-top:1px solid #20232a;
  border-bottom:1px solid #20232a;
  padding:0
}
.proof--carousel .container{width:min(1140px,94vw);margin:0 auto}
.proof__viewport{ position:relative;height:56px;display:grid;place-items:center;color:#d7dde5 }
.proof--carousel .item{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .35s ease;pointer-events:none;font-size:18px;gap:10px;color:#e0e4eb
}
.proof--carousel .item.is-active{opacity:1;pointer-events:auto}
@media (max-width:560px){
  .proof__viewport{height:48px}
  .proof--carousel .item{font-size:16px}
}

/* ===== Strengths (Benefícios) ===== */
.strengths{
  background:#101215;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:48px 0 44px
}
.section-head{ text-align:center; margin-bottom:26px }
.section-title{ font-size:clamp(24px,3.5vw,36px); line-height:1.15; margin:0 0 6px }
.section-sub{ color:var(--muted); margin:0 }

.strengths .section-title{font-size:clamp(28px,3.6vw,44px);margin:0 0 6px}
.strengths .section-sub{color:var(--muted);margin:0 0 18px}

.strengths__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.strength-card{
  background:#15171d;border:1px solid #20232a;border-radius:22px;padding:22px 24px;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.18)
}
.strength-card:hover{transform:translateY(-2px);box-shadow:0 18px 30px rgba(0,0,0,.25);border-color:#2e2e36}
.strength-card h3{margin:0 0 10px;font-size:22px;font-weight:800}
.strength-card p{margin:0;color:#cfd6df;font-size:16px;line-height:1.6}

@media (max-width:680px){
  .strengths{padding:40px 0 36px}
  .strengths__grid{grid-template-columns:1fr;gap:14px;overflow:visible;padding:0;margin:0}
  .strength-card{min-width:auto;border-radius:20px;box-shadow:0 8px 20px rgba(0,0,0,.2);padding:18px 20px}
  .strength-card h3{font-size:18px;margin-bottom:6px}
  .strength-card p{font-size:14.5px;line-height:1.55}
  .section-head{text-align:center}
  .section-title{text-align:center;margin-left:auto;margin-right:auto}
}

/* ========== KITS (SEÇÃO OFERTA) ========== */
.kits{
  background:#1a1c22;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:48px 0
}

/* Cabeçalho */
.kits__head{text-align:center;margin-bottom:24px}
.kits__head .section-title{font-size:clamp(28px,3.6vw,42px);margin:8px 0 4px}
.kits__head .section-sub{color:var(--muted);margin:0}

/* Intro: texto + carrossel (desktop centralizado) */
.kits__intro{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  align-items:center;
  margin-bottom:24px;
  max-width:1000px;
  margin-inline:auto;
}
.kits__head{ text-align:center; margin:0 auto; }
.kits__media{ max-width:300px; justify-self:center; }

@media (max-width:980px){
  .kits__intro{ grid-template-columns:1fr; gap:18px; }
  .kits__head{ text-align:center; }
  .kits__media{ justify-self:center; width:100%; max-width:320px; }
}

/* Grid dos cards */
.kits__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(260px, 1fr));
  gap:30px;
  align-items:stretch;
}

/* Card base */
.kit-card{
  background:#15171d;
  border:1px solid rgba(255,107,61,.35);
  border-radius:18px;
  padding:18px;
  display:flex; flex-direction:column; gap:14px;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.kit-card:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 28px rgba(0,0,0,.25);
  border-color:rgba(255,107,61,.55);
}
.kit-card__top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.kit-title{margin:0;font-size:20px;font-weight:800}
.per-unit{margin:0;color:#cfd6df;font-size:14px}
.kit-price .price{font-size:32px;font-weight:900;line-height:1}
.kit-cta{margin-top:auto}
.kit-card .economy{margin:2px 0 0;color:#76e59a;font-weight:700;font-size:13px;opacity:.9;}
.kit-card--best{
  border-color:rgba(255,107,61,.65);
  box-shadow:0 16px 40px rgba(255,107,61,.12),0 10px 28px rgba(0,0,0,.25);
  position:relative;
}
.kit-card--best .kit-badge{
  position:absolute; top:-12px; right:16px;
  padding:6px 12px; border-radius:999px;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff; font-weight:800; font-size:12px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 6px 16px rgba(255,107,61,.25);
  pointer-events:none;
}

/* Variantes */
.kit-card .opt, .kit-card .swatch{ -webkit-appearance:none; appearance:none; background:none; border:none; outline:0; }
.kit-card .v-options{display:flex;gap:8px;flex-wrap:wrap}
.kit-card .opt{
  border:1px solid #2a2d36; background:#101218; color:#e6e9f0;
  padding:8px 12px; border-radius:999px; font-weight:700; font-size:13px;
  cursor:pointer; transition:transform .12s ease, background .12s ease, border-color .12s ease;
}
.kit-card .opt:hover{ transform:translateY(-1px) }
.kit-card .opt.is-selected{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  border-color:transparent; color:#fff;
}
.kit-card .v-swatches{display:flex;gap:10px;flex-wrap:wrap}
.kit-card .swatch{
  --size:26px;
  width:var(--size); height:var(--size);
  display:inline-block;
  border-radius:999px;
  border:2px solid #2a2d36;
  background:var(--c);
  padding:0; margin:0;
  font-size:0; line-height:0;
  vertical-align:middle;
  cursor:pointer;
  transition:border-color .12s ease, transform .12s ease;
}
.kit-card .swatch:hover{ transform:translateY(-1px) }
.kit-card .swatch.is-selected{ border-color:#fff }
.kit-card .swatch--sortido{
  width:auto; min-width:34px; padding:0 10px;
  background:#1b1e26; color:#e6e9f0;
  border:2px solid #2a2d36; border-radius:999px;
  font-size:12px; line-height:1;
  display:flex; align-items:center; justify-content:center;
}

/* Reordenação dos kits */
.kit-card[data-kit="3"]{ order:1; }
.kit-card[data-kit="10"]{ order:2; }
.kit-card[data-kit="5"]{ order:3; }

/* Destaque do Kit 10 (maior, com margem) */
.kit-card[data-kit="10"]{
  transform:scale(1.20);
  transform-origin:center center;
  margin:20px 16px;
  z-index:2;
  border-color:rgba(255,107,61,.75);
  box-shadow:0 18px 40px rgba(255,107,61,.2), 0 12px 28px rgba(0,0,0,.25);
}
.kit-card[data-kit="10"]:hover{ transform:scale(1.08) translateY(-2px); }

/* Responsivo grid kits */
@media (max-width:980px){
  .kits__grid{ grid-template-columns:1fr; place-items:center; gap:18px; }
  .kit-card{padding:16px; max-width:340px; width:100%; margin-inline:auto;}
  .kit-price .price{font-size:28px}
  .kit-card .opt{padding:7px 11px;font-size:12px}
  .kit-card .swatch{--size:24px}
  .kit-card[data-kit="10"]{
    transform:scale(1.05);
    margin-top:24px; margin-bottom:24px;
  }
}

/* CTA desabilitado */
.kit-cta[disabled]{opacity:.55;cursor:not-allowed}

/* ===== Imagens/vídeos dentro do swipe ===== */
.swipe__slide{ width:100%; height:auto; display:block; object-fit:cover; aspect-ratio:4/5; scroll-snap-align:start; user-select:none; }
video.swipe__slide{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; border-radius:inherit; display:block; }

/* ===== KITS – carrossel sem travar altura ===== */
.kits .swipe,
.kits .swipe__viewport,
.kits .swipe__track,
.kits .swipe__slide{ height:auto !important; min-height:0 !important; }
.kits .swipe__slide img{ width:100%; height:auto !important; display:block; object-fit:cover; }

/* ===== KITS – carrossel no mobile com margem lateral (igual ao do topo) ===== */
@media (max-width:768px){
  #kits .kits__media{
    width:calc(100vw - 32px); /* ~16px de margem em cada lado */
    max-width:640px;
    margin-left:auto; margin-right:auto;
    justify-self:center;
  }
  #kits .swipe{ overflow:hidden; border-radius:16px; }
}

/* === 1) MOBILE: cards com a MESMA largura do carrossel (#kits .kits__media) === */
@media (max-width: 980px){
  /* seu carrossel usa calc(100vw - 32px); vamos aplicar igual aos cards */
  #kits .kits__grid{
    place-items: center;
    gap: 16px;
  }
  #kits .kit-card{
    width: calc(100vw - 32px);  /* mesma largura do carrossel */
    max-width: 640px;           /* mesmo limite do carrossel */
    margin-inline: auto;
  }
}

/* === 2) DESKTOP: remover “zoom negativo” do kit 10 no hover === */
/* mantém o destaque (scale) que você já definiu para o kit 10,
   mas o hover NÃO deve reduzir o scale; aplica o mesmo leve translate dos demais */
@media (min-width: 981px){
  .kit-card:hover{
    transform: translateY(-2px);     /* efeito leve para todos */
  }
  .kit-card[data-kit="10"]:hover{
    transform: scale(1.20) translateY(-2px);  /* conserva o scale do estado base */
  }
}

/* Reduz tamanho do "R$" dentro dos preços dos kits */
.kit-price .price {
  font-size: 32px;      /* mantém o valor grande */
  font-weight: 900;
  line-height: 1;
}

/* Estiliza o R$ dentro do preço */
.kit-price .currency {
  font-size: 18px;       /* menor que o número */
  font-weight: 600;
  margin-right: 4px;     /* espaço entre R$ e o número */
  vertical-align: baseline; /* alinhado à linha base */
}

/* ===== Strengths (Benefícios) – imagem grande dentro do card ===== */
.strength-card {
  background:#15171d;
  border:1px solid #20232a;
  border-radius:22px;
  padding:22px 24px;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  overflow:hidden; /* garante que a imagem siga as bordas abauladas */
}

/* Título com margem menor para “colar” na imagem */
.strength-card h3{
  margin:0 0 10px;
}

/* Imagem ocupa a largura do card, com corte elegante */
.strength-card__img{
  width:100%;
  height:auto;         /* mantém proporção original */
  display:block;
  margin:8px 0 12px;   /* entre o título e o texto */
  object-fit:cover;    /* caso a imagem seja muito alta/larga */
  border-radius:16px;  /* arredonda a própria imagem para harmonia */
  user-select:none;
  -webkit-user-drag:none;
  opacity:.98;
}

/* Responsivo */
@media (max-width:680px){
  .strength-card{ padding:18px 20px; border-radius:20px; }
  .strength-card__img{
    margin:6px 0 10px;
    border-radius:14px;
  }
}
/* Centralizar textos dentro dos cards de benefícios */
.strength-card {
  text-align: center;
}

.strength-card h3,
.strength-card p {
  text-align: inherit; /* segue o alinhamento do card */
}

.nav-min a.active {
  color: #fff;
  font-weight: 700;
  border-bottom: 2px solid var(--brand);
}

.nav-min a.active{
  color:#fff;
  font-weight:700;
  border-bottom:2px solid var(--brand);
}

/* === Flag do item "Kits" no cabeçalho === */
.nav-min a.nav-flag{
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color:#fff !important;
  font-weight:800;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 6px 16px rgba(255,107,61,.25);
  /* impede o sublinhado do .active padrão do menu */
  border-bottom:none !important;
}

/* Hover/foco: leve realce */
@media (hover:hover){
  .nav-min a.nav-flag:hover{
    box-shadow:0 8px 20px rgba(255,107,61,.35);
    transform: translateY(-1px);
  }
}
.nav-min a.nav-flag:focus-visible{
  outline:2px solid rgba(255,107,61,.5);
  outline-offset:2px;
}

/* Quando a seção Kits estiver ativa, mantenha o chip e só intensifique o glow */
.nav-min a.nav-flag.active{
  box-shadow:
    0 0 0 2px rgba(255,107,61,.25),
    0 10px 24px rgba(255,107,61,.40);
}

/* Garante contraste no mobile */
@media (max-width:560px){
  .nav-min a.nav-flag{ padding:7px 12px; }
}

.nav-min a[href="#hero"] { display:none; }

/* Marca enxuta */
header .logo .brand{
  font-weight:800;
  font-size:clamp(1rem, 2.8vw, 1.15rem);
  letter-spacing:.2px;
  white-space:nowrap;
}

/* Espaço flexível entre logo e menu em qualquer device */
header .logo{
  margin-right:clamp(16px, 6vw, 56px);
}

/* Menu com espaçamento adaptativo */
.nav-min{ gap:clamp(10px, 3.2vw, 22px); }
.nav-min a.nav-flag{
  padding:clamp(4px, 1.2vw, 6px) clamp(10px, 3vw, 14px);
}
/* Logo na cor de destaque (mesma de .hero h1 .accent) */
header .logo .brand{
  color: var(--brand); /* #ff6b3d */
}

/* Barra flutuante estilo oferta */
.float-offer {
  position: fixed;
  left: 50%;
  bottom: calc(16px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  z-index: 1200;

  display: flex;
  align-items: center;
  gap: 12px;

  background:#2f323a;
  border:1px solid #3a3f48;
  border-radius: 999px;
  padding: 10px 16px;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);

  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}

.float-offer.show {
  opacity: 1;
  pointer-events: auto;
}

/* Texto da oferta */
.float-offer .offer-text {
  font-weight: 700;
  font-size: .95rem;
  white-space: nowrap;
  color: #fff;
}

/* Botão */
.float-offer .offer-btn {
  background: linear-gradient(135deg, var(--brand, #ff6b3d), var(--brand-2, #ff8f66));
  color: #fff;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s ease;
}
.float-offer .offer-btn:hover {
  filter: brightness(1.1);
}

/* Ajustes para telas muito estreitas (até 380px) */
@media (max-width: 380px) {
  .float-offer {
    gap: 8px;
    padding: 8px 12px;
  }
  .float-offer .offer-text {
    font-size: 0.85rem;
    white-space: normal; /* permite quebrar linha se precisar */
  }
  .float-offer .offer-btn {
    padding: 8px 12px;
    font-size: 0.9rem;
  }
}




/* ===== FAQ – Dark, bordas abauladas, linhas sutis ===== */
.faq{
  padding:60px 20px;
  background:var(--bg, #0f0f12);
  color:var(--txt, #f5f7fa);
}
.faq .section-head{
  text-align:center;
  margin:0 auto 28px;
  max-width:820px;
}
.faq .badge{
  display:inline-block;
  padding:6px 10px;
  font-size:.75rem;
  border:1px solid var(--line, #1e1e23);
  border-radius:999px;
  color:var(--muted, #cfd6df);
  background:rgba(255,255,255,.02);
}
.faq .section-title{
  margin:10px 0 8px;
  font-size:clamp(1.6rem, 2.4vw, 2.2rem);
  line-height:1.15;
}
.faq .section-sub{
  color:var(--muted, #cfd6df);
  font-size:.98rem;
}

.faq-list{
  display:grid;
  gap:14px;
  max-width:880px;
  margin:26px auto 0;
}

.faq-item{
  background:#15171d;
  border:1px solid #20232a;
  border-radius:22px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  overflow:hidden;
}

/* botão pergunta */
.faq-q{
  width:100%;
  background:transparent;
  border:0;
  text-align:left;
  padding:18px 60px 18px 18px;
  color:#fff;
  font-weight:700;
  font-size:1rem;
  cursor:pointer;
  position:relative;
  transition:background .2s ease, border-color .2s ease, transform .06s ease;
}
.faq-q:hover{ background:rgba(255,255,255,.02); }

/* ícone + / − */
.faq-icon{
  position:absolute;
  right:16px; top:50%;
  width:26px; height:26px;
  border:1px solid #20232a;
  border-radius:10px;
  transform:translateY(-50%);
}
.faq-icon::before,
.faq-icon::after{
  content:"";
  position:absolute; inset:0;
  margin:auto; width:14px; height:2px;
  background:var(--brand, #ff6b3d);
  border-radius:2px;
}
.faq-icon::after{ /* haste vertical (some quando aberto) */
  transform:rotate(90deg);
  transition:opacity .2s ease;
}

/* resposta com animação de altura */
.faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .28s ease, padding .28s ease, border-color .28s ease;
  padding:0 18px;
  border-top:1px solid transparent;
  color:var(--muted, #cfd6df);
  line-height:1.6;
}
.faq-a p{ margin:14px 0 18px; }

/* estado aberto */
.faq-q[aria-expanded="true"] + .faq-a{
  padding:6px 18px 16px;
  border-top:1px solid #20232a;
  max-height:280px; /* suficiente p/ 2-3 parágrafos */
}
.faq-q[aria-expanded="true"] .faq-icon::after{ opacity:0; }

/* foco/teclado */
.faq-q:focus-visible{
  outline:2px solid var(--brand, #ff6b3d);
  outline-offset:3px;
  border-radius:18px;
}

/* mobile tweaks */
@media (max-width: 640px){
  .faq{ padding:48px 16px; }
  .faq-q{ padding-right:56px; }
}

.footer {
  background:#20232a;
  padding:20px 0 110px; /* espaço extra p/ botão flutuante */
  color:#cfd6df;
  font-size:0.9rem;
  text-align:center;
}

.footer__brand p {
  margin:4px 0;
}

.footer__payments {
  margin:16px 0 10px;
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
}

.footer__payments img {
  height:18px;
  margin:0 6px;
  object-fit:contain;
  transition:transform .2s;
}
.footer__payments img.pix-logo {
  height:22px; /* Pix um pouco maior */
}
.footer__payments img:hover {
  transform:scale(1.08);
}

.footer__secure {
  margin-top:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:500;
  color:#fff;
}

.footer__secure img {
  height:18px;
  opacity:0.9;
}

.footer__brand p {
  margin:4px 0;
}

.footer__policies {
  font-size:0.75rem;  /* menor que o texto padrão */
  opacity:0.85;       /* levemente mais clara */
}

/* ===== Benefícios: grades separadas ===== */
.strengths__grid{
  display:grid;
  gap:22px;
}

/* Linha 1: 3 colunas no desktop */
.strengths__grid--top{
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

/* Linha 2: 2 colunas no desktop (para imagens horizontais) */
.strengths__grid--wide{
  margin-top: 10px; /* leve respiro entre as linhas */
  grid-template-columns: repeat(2, minmax(280px, 1fr));
}

/* Mobile: tudo em 1 coluna */
@media (max-width:680px){
  .strengths__grid--top,
  .strengths__grid--wide{
    grid-template-columns: 1fr;
    gap:14px;
  }
}

/* Opcional: reforço para imagens horizontais ficarem perfeitas */
.strength-card--landscape .strength-card__img{
  width:100%;
  aspect-ratio: 16 / 9;   /* molda altura automaticamente */
  object-fit: cover;      /* preenche sem distorcer */
  display:block;
}

.kits__image {
  margin-top: 32px;
  text-align: center;
}

.kits__image img {
  max-width: 100%;
  height: auto;
  border-radius: 12px; /* opcional, para combinar com os cards */
}

.badge--vantajoso {
  background: #ff6b3d; /* laranja chamativo */
  color: #fff;
}

.badge--kits {
  background: #ff6b3d;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 700;
  padding: 12px 32px;
  border-radius: 999px;
  display: inline-block;
  box-shadow: 0 4px 12px rgba(255, 107, 61, 0.4);
}

/* Botão */
.sizechart-btn{
  margin-top:10px;
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  background: #2f323a;
  color:var(--muted); font-weight:700; font-size:.95rem;
  transition:background .2s ease, border-color .2s ease, color .2s ease;
}
.sizechart-btn:hover{ background:rgba(255,255,255,.04); border-color:#2a2a30; color:#fff; }

/* Modal CSS-only (abre com :target) */
.modal{ position:fixed; inset:0; z-index:1300; display:none; }
.modal:target{ display:grid; place-items:center; }
.modal__overlay{
  position:absolute; inset:0;
  background:rgba(0,0,0,.6); backdrop-filter:blur(2px);
}
.modal__box{
  position:relative;
  background:#15171d; border:1px solid #20232a; border-radius:16px;
  box-shadow:0 18px 40px rgba(0,0,0,.45);
  width:min(860px, 94vw);
  padding:16px;
}
.modal__title{ margin:0 0 10px; font-size:1.1rem; font-weight:800; text-align:center; }
.modal__close{
  position:absolute; top:8px; right:8px;
  background:#1a1b20; color:#fff; border:1px solid #2a2a30;
  width:34px; height:34px; border-radius:10px;
  display:grid; place-items:center; text-decoration:none;
}
.modal__close:hover{ background:#20232a; }
.sizechart-img{ display:block; max-width:100%; height:auto; border-radius:12px; }

/* Mobile refino */
@media (max-width:680px){
  .modal__box{ width:94vw; padding:12px; border-radius:14px; }
  .modal__title{ font-size:1rem; margin-bottom:8px; }
}

html {
  scroll-behavior: smooth;
}

/* ===== Hero flags (tópicos lado a lado) ===== */
.hero-flags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:16px 0 18px;
}

.flag{
  background:#22232A;
  color:#fff;
  font-weight:700;
  font-size:clamp(14px, 2.4vw, 16px);
  padding:6px 14px;
  border-radius:999px;   /* formato “pílula” */
  display:inline-block;
  white-space:nowrap;
  opacity:.95;
}

/* Subtexto logo abaixo */
.lead-sub{
  font-size:clamp(15px, 2.4vw, 18px);
  color:var(--muted);
  margin:0 0 12px;
}

/* ===== Mobile: centralizar flags ===== */
@media (max-width:680px){
  .hero-flags{
    justify-content:center;
    text-align:center;
  }
}

/* ===== Modal de Variantes (popup completo) ===== */
.vmodal{ position:fixed; inset:0; z-index:1400; display:none; }
.vmodal.is-open{ display:grid; place-items:center; }
.vmodal[hidden]{ display:none !important; }

/* Fundo mais escuro e com blur maior */
.vmodal__overlay{
  position:absolute; inset:0;
  background:rgba(0,0,0,.65);
  backdrop-filter:blur(10px);
}

/* Card do popup com borda destacada */
.vmodal__box{
  position:relative;
  background:#15171d; color:#f5f7fa;
  border:2px solid rgba(255,255,255,.15);
  border-radius:18px;
  box-shadow:0 24px 60px rgba(0,0,0,.7);
  width:min(680px, 94vw);
  transform:scale(.98); opacity:0;
  transition:transform .2s ease, opacity .2s ease, box-shadow .2s ease;
}
.vmodal.is-open .vmodal__box{ transform:scale(1); opacity:1; }

.vmodal__close{
  position:absolute; top:8px; right:8px;
  background:#1a1b20; color:#fff; border:1px solid #2a2a30;
  width:34px; height:34px; border-radius:10px;
  display:grid; place-items:center; cursor:pointer;
}
.vmodal__close:hover{ background:#20232a; }

.vmodal__content{ padding:16px 18px 22px; }

/* Linha 1: nome do kit; linha 2: preço (maior) + /un (menor) */
.vmodal__kitinfo{
  text-align:center;
  margin-bottom:8px;
}
.vmodal__kittitle{
  display:block;
  margin-bottom:4px;
  font-weight:800; color:#fff;
  font-size:1.24rem; /* maior */
}
.vmodal__kitprice{
  font-size:1.22rem; font-weight:800; color:var(--brand,#ff6b3d);
}
.vmodal__perunit{
  font-size:.9rem; font-weight:600; color:#b8c1cc; margin-left:6px;
}

/* Título destacado com mais espaçamento abaixo */
.vmodal__title{
  margin:0 0 22px; /* mais espaço */
  text-align:center;
  color:var(--brand,#ff6b3d); font-size:1.08rem; font-weight:800; letter-spacing:.2px;
}
.vmodal__title::after{
  content:""; display:block; width:110px; height:2px; margin:10px auto 0;
  border-radius:2px;
  background:linear-gradient(90deg, rgba(255,107,61,.9), rgba(255,143,102,.6));
}

/* Seções e espaçamento extra entre Tamanho -> Cor */
.vmodal__section{ margin-top:14px; }
.vmodal__section + .vmodal__section{
  margin-top:24px; padding-top:10px; border-top:1px solid rgba(255,255,255,.06);
}
.vmodal__label{ font-weight:800; font-size:.95rem; margin:0 0 8px; color:#dfe4ec; }

/* Mostrar nome da cor selecionada ao lado do rótulo */
.vmodal__label .vmodal__colorname{
  margin-left:6px; font-weight:800; color:#fff;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  border-radius:999px; padding:2px 8px; font-size:.85rem;
}

/* Grids */
.vmodal__sizes, .vmodal__colors{ display:flex; flex-wrap:wrap; gap:10px; }

/* Botões de tamanho */
.vmodal .size-btn{
  border:1px solid #2a2d36; background:#101218; color:#e6e9f0;
  padding:8px 12px; border-radius:999px; font-weight:700; font-size:13px;
  cursor:pointer; transition:transform .12s ease, background .12s ease, border-color .12s ease;
}
.vmodal .size-btn:hover{ transform:translateY(-1px); }
.vmodal .size-btn.is-selected{
  background:linear-gradient(135deg,var(--brand,#ff6b3d),var(--brand-2,#ff8f66));
  border-color:transparent; color:#fff;
}

/* Botões de cor */
.vmodal .color-btn{
  --size:28px; width:var(--size); height:var(--size);
  border-radius:999px; border:2px solid #2a2d36; background:var(--c,#222);
  font-size:0; line-height:0; cursor:pointer;
  transition:border-color .12s ease, transform .12s ease;
}
.vmodal .color-btn:hover{ transform:translateY(-1px); }
.vmodal .color-btn.is-selected{ border-color:#fff; }

/* Sortido: bolinha com "?" */
.vmodal .color-btn.--mix{
  width:28px; height:28px; padding:0;
  border-radius:999px; border:2px solid #2a2d36;
  background:#1b1e26; color:#fff;
  font-size:14px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
}

/* Ações */
.vmodal__actions{ margin-top:20px; text-align:center; }
.vmodal__buy{
  display:block; width:100%; padding:14px 18px; font-size:1rem; border-radius:12px;
  background:linear-gradient(135deg,var(--brand,#ff6b3d),var(--brand-2,#ff8f66));
  color:#fff; font-weight:900; border:none; cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.vmodal__buy[disabled]{ opacity:.55; cursor:not-allowed; }
.vmodal__alt{
  display:inline-block; margin-top:10px; padding:8px 12px; font-size:.92rem;
  border-radius:10px; background:#1a1b20; border:1px solid #2a2a30; color:#fff; font-weight:800; cursor:pointer;
}
.vmodal__alt:hover{ background:#20232a; }

@media (max-width:640px){
  .vmodal__content{ padding:14px; }
  .vmodal__kittitle{ font-size:1.18rem; }
  .vmodal__kitprice{ font-size:1.14rem; }
  .vmodal__perunit{ font-size:.82rem; }
  .vmodal__title{ font-size:1.02rem; margin-bottom:18px; }
  .vmodal__title::after{ width:96px; }
}

.kit-cta {
  font-size: 1.1rem; /* ~17.6px */
}