@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Space+Mono:wght@400;700&display=swap');

:root {
  --orange: #F47621;
  --orange-l: #fff4eb;
  --yellow: #F5B731;
  --red: #DE274A;
  --red-l: #fdedf0;
  --purple: #7E48C3;
  --purple-l: #f3edfc;
  --green: #10B981;
  --green-l: #ecfdf5;
  --blue: #4B5FBD;
  --blue-l: #eef0fb;
  --blue2: #5B7FE8;
  --bg: #fff;
  --bg-a: #f7f7f8;
  --bg-w: #faf9f7;
  --bd: #e5e5e5;
  --bd-h: #d0d0d0;
  --tx: #1a1a1a;
  --tx2: #4a4a4a;
  --mt: #717171;
  --dm: #9ca3af;
  --sh: 0 2px 8px rgba(0,0,0,.06);
  --sh-l: 0 8px 30px rgba(0,0,0,.1);
  --rd: 14px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: 'Outfit', sans-serif; background: var(--bg-w); color: var(--tx); font-size: 15px; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }
.mono { font-family: 'Space Mono', monospace; }

/* ===== ícones SVG monocromáticos (herdam currentColor) ===== */
.ic { display: inline-flex; align-items: center; justify-content: center; line-height: 0; }
.ic svg { width: 1em; height: 1em; display: block; }

.valor-bar { display: flex; height: 4px; width: 100%; }
.valor-bar span { flex: 1; }
.vb-orange { background: var(--orange); } .vb-yellow { background: var(--yellow); }
.vb-red { background: var(--red); } .vb-purple { background: var(--purple); } .vb-blue { background: var(--blue); }

/* ===== salll banner ===== */
.salll-banner {
  background: #111; color: rgba(255,255,255,.75);
  font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1px; text-transform: uppercase;
  padding: 9px 24px; display: flex; align-items: center; gap: 10px; justify-content: center; flex-wrap: wrap;
}
.salll-banner b { color: #fff; font-weight: 700; }
.salll-banner .demo { background: rgba(244,118,33,.2); color: #FFB880; padding: 3px 9px; border-radius: 4px; font-weight: 700; }
.salll-banner a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }

/* ===== header (escuro — logo em evidência) ===== */
/* sticky no wrapper (o header é injetado dentro dele; sticky no header interno
   soltaria porque o wrapper tem a altura exata do header) */
#store-header-root { position: sticky; top: 0; z-index: 50; }
.store-header { background: #141414; border-bottom: 1px solid #262626; }
.store-header-top {
  display: flex; align-items: center; gap: 20px;
  padding: 14px 24px; max-width: 1320px; margin: 0 auto;
}
.store-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.store-logo img { height: 28px; }
.store-logo .tag { font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #9a9a9a; border-left: 1px solid #333; padding-left: 10px; }
.store-search { flex: 1; display: flex; align-items: center; gap: 8px; background: #1f1f1f; border: 1px solid #333; border-radius: 10px; padding: 10px 14px; max-width: 560px; transition: all .2s; }
.store-search:focus-within { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(244,118,33,.18); }
.store-search select { background: 0; border: 0; font-size: 12px; color: #bdbdbd; padding-right: 8px; border-right: 1px solid #333; font-family: inherit; }
.store-search input { flex: 1; background: 0; border: 0; outline: 0; font-size: 14px; font-family: inherit; color: #fff; }
.store-search input::placeholder { color: #888; }
.store-search button { background: 0; border: 0; cursor: pointer; color: #cfcfcf; display: flex; padding: 0; }
.store-search button .ic { font-size: 18px; }
.store-account { display: flex; align-items: center; gap: 18px; flex-shrink: 0; font-size: 13px; }
.store-account .col { display: flex; flex-direction: column; line-height: 1.3; cursor: pointer; }
.store-account .col small { color: #9a9a9a; font-size: 11px; }
.store-account .col b { font-size: 13px; color: #fff; }
.store-cart { display: flex; align-items: center; gap: 7px; cursor: pointer; background: var(--orange); color: #fff; padding: 8px 14px; border-radius: 10px; font-size: 12px; font-weight: 700; }
.store-cart .badge { background: #fff; color: var(--orange); font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 8px; }
.store-nav-bottom {
  display: flex; gap: 22px; padding: 10px 24px; max-width: 1320px; margin: 0 auto;
  overflow-x: auto; white-space: nowrap; font-size: 13px; font-weight: 600; color: #cfcfcf;
}
.store-nav-bottom a { display: inline-flex; align-items: center; gap: 6px; }
.store-nav-bottom a:hover { color: var(--orange); }
.store-nav-bottom .all { font-weight: 800; color: #fff; }
.store-nav-bottom .all .ic, .store-nav-bottom .off .ic { font-size: 15px; }

/* ===== shell ===== */
.store-main { max-width: 1320px; margin: 0 auto; padding: 24px; }
.store-footer { background: #0a0a0a; color: rgba(255,255,255,.6); margin-top: 50px; }
.store-footer .top { text-align: center; padding: 14px; background: #171717; cursor: pointer; font-size: 12px; font-weight: 700; }
.store-footer .mid { display: flex; justify-content: center; gap: 60px; padding: 34px 24px; max-width: 1100px; margin: 0 auto; flex-wrap: wrap; }
.store-footer .mid h4 { font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--orange); margin: 0 0 12px; }
.store-footer .mid a { display: block; font-size: 12.5px; color: rgba(255,255,255,.75); padding: 4px 0; }
.store-footer .mid a:hover { color: #fff; }
.store-footer .bottom { text-align: center; padding: 20px; font-size: 11.5px; color: rgba(255,255,255,.4); border-top: 1px solid rgba(255,255,255,.1); line-height: 1.6; }

.breadcrumb { font-size: 12px; color: var(--dm); margin-bottom: 14px; }
.breadcrumb a:hover { color: var(--orange); }

/* ===== hero ===== */
.hero-band {
  border-radius: var(--rd); overflow: hidden; margin-bottom: 26px; padding: 52px 40px;
  background: linear-gradient(135deg, #fff8f3 0%, #f5f0ff 50%, #fff5f5 100%);
  border: 1px solid var(--bd);
}
.hero-band .eyebrow { display: inline-block; padding: 6px 14px; border-radius: 6px; background: rgba(244,118,33,.12); font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--orange); margin-bottom: 16px; }
.hero-band h1 { font-size: clamp(28px, 4vw, 44px); font-weight: 900; letter-spacing: -1.5px; margin: 0 0 12px; line-height: 1.05; }
.hero-band h1 .hl { color: var(--orange); }
.hero-band p { max-width: 620px; color: var(--tx2); font-size: 15px; line-height: 1.7; margin: 0; }

/* ===== campaign carousel (banner largo full-bleed, arte com texto+CTA) ===== */
.campaign-carousel { position: relative; border-radius: var(--rd); overflow: hidden; margin-bottom: 30px; aspect-ratio: 2172/724; background: var(--bg-a); border: 1px solid var(--bd); }
.cc-track { position: relative; width: 100%; height: 100%; }
.cc-slide {
  position: absolute; inset: 0; display: block; opacity: 0; pointer-events: none;
  transition: opacity .6s ease; overflow: hidden;
}
.cc-slide.active { opacity: 1; pointer-events: auto; }
.cc-slide img.cc-img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.cc-dots { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 3; }
.cc-dots button { width: 8px; height: 8px; border-radius: 50%; border: 0; background: rgba(255,255,255,.55); box-shadow: 0 0 0 1px rgba(0,0,0,.15); cursor: pointer; padding: 0; }
.cc-dots button.active { background: var(--orange); width: 22px; border-radius: 5px; }
.cc-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(255,255,255,.8); color: var(--tx); font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.cc-nav:hover { background: #fff; }
.cc-nav.prev { left: 14px; } .cc-nav.next { right: 14px; }

/* ===== hub / category tiles ===== */
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 34px 0 18px; }
.section-head .lbl { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--orange); font-weight: 700; margin-bottom: 6px; }
.section-head h2 { font-size: 22px; font-weight: 800; letter-spacing: -.5px; margin: 0; }
.section-head p { font-size: 13px; color: var(--mt); margin: 4px 0 0; max-width: 560px; }
.see-all { font-family: 'Space Mono', monospace; font-size: 11px; font-weight: 700; letter-spacing: 1px; color: var(--mt); border: 1px solid var(--bd); padding: 8px 14px; border-radius: 8px; }
.see-all:hover { color: var(--orange); border-color: var(--orange); }

.hub-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
@media (max-width: 1024px) { .hub-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .hub-grid { grid-template-columns: repeat(2, 1fr); } }
.hub-tile {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  padding: 18px; height: 130px; border-radius: var(--rd); color: var(--tx); overflow: hidden;
  background: var(--bg-a); border: 1px solid var(--bd); transition: all .2s;
}
.hub-tile:hover { transform: translateY(-3px); box-shadow: var(--sh-l); border-color: var(--bd-h); }
.hub-tile .em { font-size: 28px; margin-bottom: 8px; color: var(--tx); }
.hub-tile .nm { font-size: 15px; font-weight: 800; letter-spacing: -.2px; }
.hub-tile .ct { font-size: 11px; color: var(--mt); }

/* ===== product cards ===== */
.result-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.product-card {
  background: #fff; border: 1px solid var(--bd); border-radius: var(--rd);
  overflow: hidden; transition: all .25s; display: flex; flex-direction: column; position: relative;
}
.product-card:hover { transform: translateY(-3px); box-shadow: var(--sh-l); border-color: var(--bd-h); }
.product-card .thumb-wrap { position: relative; width: 100%; aspect-ratio: 1; background: var(--bg-a); display: flex; align-items: center; justify-content: center; }
.product-card img.thumb { width: 100%; height: 100%; object-fit: contain; padding: 18px; transition: transform .35s; }
.product-card:hover img.thumb { transform: scale(1.05); }
.product-card .badges { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; gap: 4px; z-index: 2; }
.product-card .badges .badge-pill { transition: opacity .2s ease; }
/* no hover somem os badges auxiliares (patrocinado, +18) — o desconto NUNCA some */
.product-card:hover .badges .badge-pill:not(.off) { opacity: 0; }
.badge-pill { padding: 4px 9px; border-radius: 5px; font-family: 'Space Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; }
.badge-pill.dark { background: #111; color: #fff; }
.badge-pill.sponsored { background: var(--orange); color: #fff; }
.badge-pill.framework { background: var(--orange-l); color: var(--orange); }
.product-card .info { padding: 14px 14px 16px; display: flex; flex-direction: column; flex: 1; }
.product-card .cat { font-family: 'Space Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--dm); margin-bottom: 6px; }
.product-card .title { font-size: 13px; font-weight: 600; line-height: 1.32; color: var(--tx2); min-height: 34px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 8px; }
.product-card:hover .title { color: var(--orange); }
.product-card .stars-row { font-size: 11px; color: var(--mt); display: flex; align-items: center; gap: 5px; margin-bottom: 10px; }
.product-card .stars { color: var(--yellow); font-size: 12px; letter-spacing: -1px; }
.product-card .price-wrap { margin-top: auto; }
.product-card .price-old { font-size: 11px; color: var(--dm); text-decoration: line-through; }
.product-card .price { font-size: 19px; font-weight: 900; color: var(--tx); letter-spacing: -.5px; }
.product-card .prime { font-size: 10px; color: #00a8e1; font-weight: 700; margin-top: 3px; }

/* ===== SERP ===== */
.serp-header { background: #fff; padding: 14px 24px; border-bottom: 1px solid var(--bd); font-size: 13px; color: var(--mt); }
.serp-layout { display: grid; grid-template-columns: 230px 1fr; gap: 22px; align-items: start; }
.serp-filters { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 18px; }
.serp-filters h4 { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--orange); margin: 16px 0 10px; font-weight: 700; }
.serp-filters h4:first-child { margin-top: 0; }
.serp-filters label { display: flex; gap: 8px; align-items: center; padding: 5px 0; font-size: 13px; color: var(--tx2); cursor: pointer; }
.serp-filters label input { accent-color: var(--orange); }
.ads-strip { background: var(--orange-l); border: 1px solid #fbd9bd; border-radius: var(--rd); padding: 12px 16px; margin-bottom: 16px; font-size: 12px; color: var(--tx2); display: flex; align-items: center; gap: 10px; }
.ads-strip .tag { background: var(--orange); color: #fff; font-family: 'Space Mono', monospace; padding: 3px 9px; border-radius: 4px; font-weight: 700; font-size: 10px; }

/* ===== category / brand ===== */
.category-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin: 20px 0; }
.category-tile { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 20px; text-align: center; transition: all .2s; }
.category-tile:hover { transform: translateY(-3px); box-shadow: var(--sh-l); border-color: var(--orange); }
.category-tile img { height: 110px; object-fit: contain; margin-bottom: 12px; }
.category-tile h3 { font-size: 15px; margin: 0 0 4px; font-weight: 700; }
.category-tile .link { font-size: 12px; color: var(--orange); font-weight: 700; }

.brand-header { display: flex; gap: 22px; align-items: center; background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 26px; margin-bottom: 22px; }
.brand-header img { width: 100px; height: 100px; object-fit: contain; border-radius: 10px; background: var(--bg-a); padding: 10px; }
.brand-header h1 { margin: 0 0 8px; font-size: 22px; font-weight: 800; letter-spacing: -.5px; }
.brand-header p { margin: 0; color: var(--mt); font-size: 13px; max-width: 580px; line-height: 1.6; }
.brand-stats { display: flex; gap: 26px; margin-top: 12px; font-size: 12px; color: var(--mt); }
.brand-stats b { color: var(--tx); display: block; font-size: 17px; font-weight: 900; }

/* ===== home service cards ===== */
.svc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 16px; margin: 20px 0; }
.svc-card { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 22px; transition: all .2s; }
.svc-card:hover { transform: translateY(-3px); box-shadow: var(--sh-l); }
.svc-card .tag { display: inline-block; font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 4px 10px; border-radius: 5px; margin-bottom: 12px; }
.svc-card h3 { margin: 0 0 8px; font-size: 17px; font-weight: 800; letter-spacing: -.3px; }
.svc-card p { color: var(--tx2); font-size: 13px; line-height: 1.6; margin: 0 0 12px; }
.svc-card .cta { font-size: 12px; font-weight: 700; }
.svc-card.c-orange .tag { background: var(--orange-l); color: var(--orange); } .svc-card.c-orange .cta { color: var(--orange); }
.svc-card.c-yellow .tag { background: #fff8e6; color: #92660a; } .svc-card.c-yellow .cta { color: #92660a; }
.svc-card.c-red .tag { background: var(--red-l); color: var(--red); } .svc-card.c-red .cta { color: var(--red); }
.svc-card.c-purple .tag { background: var(--purple-l); color: var(--purple); } .svc-card.c-purple .cta { color: var(--purple); }
.svc-card.c-blue .tag { background: var(--blue-l); color: var(--blue); } .svc-card.c-blue .cta { color: var(--blue); }
.svc-card.c-green .tag { background: var(--green-l); color: var(--green); } .svc-card.c-green .cta { color: var(--green); }

/* ===== PDP ===== */
.pdp-state-toggle { display: inline-flex; background: #fff; border: 1px solid var(--bd); border-radius: 999px; padding: 4px; gap: 4px; box-shadow: var(--sh); margin-bottom: 8px; }
.pdp-state-toggle button {
  font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 1.2px; text-transform: uppercase; font-weight: 700;
  padding: 9px 18px; border-radius: 999px; border: 0; background: 0; color: var(--mt); cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px; transition: all .2s;
}
.pdp-state-toggle button .dt { width: 8px; height: 8px; border-radius: 50%; background: #D1D5DB; }
.pdp-state-toggle button.active { background: #111; color: #fff; }
.pdp-state-toggle button.active.antes .dt { background: var(--red); }
.pdp-state-toggle button.active.depois .dt { background: var(--orange); }
.pdp-state-note { font-size: 12.5px; color: var(--mt); margin-bottom: 20px; line-height: 1.6; }

.pdp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; align-items: flex-start; background: transparent; padding: 0; }
@media (max-width: 900px) { .pdp-grid { grid-template-columns: 1fr; } }
.pdp-gallery { position: sticky; top: 110px; display: flex; gap: 12px; align-items: flex-start; }
.pdp-main { position: relative; flex: 1; min-width: 0; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; background: var(--bg-a); border: 1px solid var(--bd); border-radius: var(--rd); padding: 24px; overflow: hidden; cursor: zoom-in; }
.pdp-main img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform .3s; }
.pdp-main:hover img { transform: scale(1.04); }
.pdp-pos-label { position: absolute; top: 14px; left: 14px; display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--bd); border-radius: 8px; padding: 6px 10px; box-shadow: var(--sh); }
.pdp-pos-label .lt { font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 1px; color: #fff; padding: 2px 7px; border-radius: 4px; }
.pdp-pos-label .nm { font-size: 12px; font-weight: 700; }
.letter-orange { background: var(--orange); } .letter-yellow { background: var(--yellow); } .letter-red { background: var(--red); } .letter-blue { background: var(--blue); } .letter-purple { background: var(--purple); }
.pdp-thumbs { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.pdp-thumb { width: 74px; aspect-ratio: 1; border-radius: 10px; border: 2px solid var(--bd); overflow: hidden; cursor: pointer; background: var(--bg-a); display: flex; flex-direction: column; padding: 0; transition: all .2s; }
.pdp-thumb img { flex: 1; width: 100%; height: 100%; object-fit: contain; padding: 6px; }
.pdp-thumb .ph { font-family: 'Space Mono', monospace; font-size: 8px; font-weight: 700; background: #fff; color: var(--mt); padding: 2px 0; text-align: center; border-top: 1px solid var(--bd); }
.pdp-thumb:hover { border-color: var(--orange); }
.pdp-thumb.active { border-color: var(--orange); box-shadow: 0 0 0 2px rgba(244,118,33,.15); }
.pdp-thumb.active .ph { background: var(--orange); color: #fff; border-top-color: var(--orange); }

.pdp-info { display: flex; flex-direction: column; gap: 16px; }
.pdp-info .brand-link { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--orange); font-weight: 700; }
.pdp-info h1 { font-size: clamp(19px, 2.4vw, 25px); font-weight: 800; letter-spacing: -.5px; line-height: 1.2; margin: 0; }
.pdp-slots { display: flex; flex-wrap: wrap; gap: 6px; }
.pdp-slot { font-family: 'Space Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; padding: 5px 9px; border-radius: 4px; color: #fff; }
.stars-row-pdp { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--mt); }
.stars-row-pdp .stars { color: var(--yellow); font-size: 15px; letter-spacing: -1px; }
.stars-row-pdp strong { color: var(--tx); font-weight: 700; }

.price-box { background: var(--bg-a); border: 1px solid var(--bd); border-radius: var(--rd); padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.price-box .price-r { display: flex; align-items: baseline; gap: 10px; }
.price-box .price-main { font-size: 32px; font-weight: 900; letter-spacing: -1px; }
.price-box .price-main sup { font-size: 16px; }
.price-box .installments { font-size: 13px; color: var(--tx2); }
.price-box .pix { font-size: 12px; color: var(--green); font-weight: 600; }
.btn-buy { width: 100%; padding: 15px; font-size: 13px; font-weight: 800; color: #fff; background: var(--orange); border: 0; border-radius: 10px; cursor: pointer; font-family: inherit; text-transform: uppercase; letter-spacing: 1.2px; transition: all .2s; }
.btn-buy:hover { background: #d86215; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(244,118,33,.3); }
.btn-cart { width: 100%; padding: 13px; font-size: 12px; font-weight: 700; color: var(--orange); background: #fff; border: 1px solid var(--orange); border-radius: 10px; cursor: pointer; font-family: inherit; text-transform: uppercase; letter-spacing: 1.2px; margin-top: 8px; }
.btn-cart:hover { background: var(--orange-l); }
.ship-row { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 10px; border: 1px solid var(--bd); font-size: 13px; color: var(--tx2); background: #fff; }
.ship-row b { color: var(--green); }

.pdp-bullets { display: flex; flex-direction: column; gap: 10px; list-style: none; margin: 0; padding: 0; }
.pdp-bullets li { display: flex; gap: 10px; padding: 10px 12px; background: var(--bg-a); border: 1px solid var(--bd); border-radius: 10px; font-size: 13.5px; line-height: 1.5; color: var(--tx2); }

/* A+ */
.aplus-wrap { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); margin-top: 30px; overflow: hidden; }
.aplus-tabs { display: flex; gap: 6px; padding: 16px 22px 0; border-bottom: 1px solid var(--bd); flex-wrap: wrap; }
.aplus-tab { border: 1px solid var(--bd); border-bottom: 0; background: var(--bg-a); padding: 10px 16px; border-radius: 8px 8px 0 0; cursor: pointer; font-size: 12.5px; font-weight: 700; color: var(--mt); font-family: inherit; }
.aplus-tab.active { background: #fff; color: var(--orange); border-color: var(--orange); }
.aplus-pane { display: none; padding: 26px; }
.aplus-pane.active { display: block; }
.aplus-mod { padding: 22px 0; border-bottom: 1px solid #f0f0f0; }
.aplus-mod:last-child { border-bottom: 0; }
.aplus-mod h3 { font-size: 18px; font-weight: 800; letter-spacing: -.3px; margin: 0 0 12px; }
.aplus-mod img.full { width: 100%; border-radius: 10px; display: block; }
.aplus-mod p.desc { margin: 12px 2px 0; color: var(--tx2); font-size: 13.5px; line-height: 1.6; }
.aplus-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.aplus-cards img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }
.aplus-cards h4 { font-size: 13px; margin: 8px 0 2px; font-weight: 700; }
.aplus-cards p { font-size: 12px; color: var(--mt); margin: 0; }
.meli-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 22px; }
.meli-gallery figure { margin: 0; background: #fff; border: 1px solid var(--bd); border-radius: 10px; overflow: hidden; position: relative; }
.meli-gallery img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.meli-gallery figcaption { font-size: 11px; color: var(--mt); padding: 8px 10px; }
.meli-wbtag { position: absolute; top: 8px; left: 8px; background: var(--orange); color: #fff; font-family: 'Space Mono', monospace; font-size: 9px; font-weight: 700; padding: 3px 7px; border-radius: 4px; }
.meli-rich-block { border-radius: 10px; overflow: hidden; border: 1px solid var(--bd); margin-bottom: 12px; }
.meli-rich-block img { width: 100%; display: block; }

/* reviews */
.reviews-block { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 26px; margin-top: 24px; }
.reviews-block h2 { font-size: 19px; font-weight: 800; letter-spacing: -.4px; margin: 0 0 16px; }
.review { border-bottom: 1px solid #f0f0f0; padding: 16px 0; }
.review:last-child { border: 0; }
.review .who { font-size: 13px; font-weight: 700; }
.review .stars { color: var(--yellow); font-size: 13px; margin: 5px 0; letter-spacing: -1px; }
.review p { font-size: 13.5px; margin: 6px 0 0; color: var(--tx2); line-height: 1.6; }

@media (max-width: 1100px) { .serp-layout { grid-template-columns: 1fr; } }

/* ============================================================
   ADIÇÕES — e-commerce store (Fase 1/2)
   ============================================================ */

/* toast */
.store-toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px); background: #111; color: #fff; padding: 13px 20px; border-radius: 12px; font-size: 13.5px; font-weight: 600; box-shadow: var(--sh-l); opacity: 0; pointer-events: none; transition: all .3s cubic-bezier(.2,.8,.2,1); z-index: 200; display: flex; align-items: center; gap: 8px; }
.store-toast .ok { color: var(--green); font-size: 17px; }
.store-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* header extras */
.store-cart .ci { font-size: 15px; }
.store-nav-bottom .off { color: var(--orange); font-weight: 700; }

/* benefits strip */
.benefits-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin: 22px 0 8px; }
.benefit { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: 14px 16px; }
.benefit .bi { font-size: 22px; color: var(--tx2); flex-shrink: 0; }
.benefit b { display: block; font-size: 13px; }
.benefit small { color: var(--mt); font-size: 11.5px; }
@media (max-width: 900px) { .benefits-strip { grid-template-columns: repeat(2, 1fr); } .benefit:last-child { display: none; } }

/* product row (carrossel horizontal) */
.product-row { position: relative; }
.row-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(210px, 1fr); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 14px; scrollbar-width: thin; }
.row-track > .product-card { scroll-snap-align: start; }
.row-track::-webkit-scrollbar { height: 6px; }
.row-track::-webkit-scrollbar-thumb { background: var(--bd-h); border-radius: 3px; }
.row-nav { position: absolute; top: 38%; z-index: 5; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--bd); background: #fff; box-shadow: var(--sh); font-size: 20px; cursor: pointer; color: var(--tx); display: flex; align-items: center; justify-content: center; }
.row-nav:hover { color: var(--orange); border-color: var(--orange); }
.row-nav.prev { left: -14px; } .row-nav.next { right: -14px; }
@media (max-width: 700px) { .row-nav { display: none; } .row-track { grid-auto-columns: 70%; } }

/* card additions */
.product-card .pc-link { display: flex; flex-direction: column; flex: 1; }
.badge-pill.off { background: var(--red); color: #fff; }
.badge-pill.reg { background: #111; color: #fff; }
.product-card .rvc { color: var(--dm); }
.product-card .price-line { display: flex; align-items: baseline; gap: 8px; }
.product-card .price-off { font-family: 'Space Mono', monospace; font-size: 11px; font-weight: 700; color: var(--red); }
.product-card .price-pix { font-size: 11.5px; color: var(--green); font-weight: 600; margin-top: 2px; }
.product-card .price-inst { font-size: 11px; color: var(--mt); margin-top: 1px; }
.pc-add { margin: 0 14px 14px; padding: 10px; border: 1px solid var(--orange); background: var(--orange-l); color: var(--orange); font-family: inherit; font-weight: 700; font-size: 12px; border-radius: 9px; cursor: pointer; transition: all .2s; }
.pc-add:hover { background: var(--orange); color: #fff; }

/* promo banner */
.promo-banner { margin: 34px 0 6px; border-radius: var(--rd); overflow: hidden; }
.pb-inner { background: linear-gradient(120deg, #065f46, #10B981); padding: 40px; color: #fff; }
.pb-badge { display: inline-block; background: rgba(255,255,255,.2); font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 5px 11px; border-radius: 5px; margin-bottom: 12px; }
.pb-copy h3 { font-size: clamp(22px, 3vw, 32px); font-weight: 900; margin: 0 0 8px; letter-spacing: -.5px; }
.pb-copy h3 span { color: #C6F6E0; }
.pb-copy p { margin: 0 0 16px; opacity: .95; }
.pb-cta { display: inline-block; background: #fff; color: #065f46; font-weight: 800; font-size: 13px; padding: 12px 20px; border-radius: 10px; }

/* category hero */
.cat-hero { margin-bottom: 18px; }
.ch-inner { display: flex; align-items: center; gap: 20px; padding: 32px; border-radius: var(--rd); background: #141414; color: #fff; }
.ch-em { font-size: 44px; color: #fff; }
.ch-inner h1 { margin: 0; font-size: 28px; font-weight: 900; letter-spacing: -.6px; }
.ch-inner p { margin: 4px 0 0; opacity: .9; font-size: 14px; }

/* serp toolbar */
.serp-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; font-size: 13px; color: var(--tx2); flex-wrap: wrap; }
.serp-sort select { font-family: inherit; font-size: 13px; padding: 7px 10px; border: 1px solid var(--bd); border-radius: 8px; background: #fff; color: var(--tx); }
.official { display: inline-block; background: var(--green-l); color: #047857; font-family: 'Space Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 2px 7px; border-radius: 4px; vertical-align: middle; }

/* ===== PDP tabs ===== */
.pdp-tabs { display: inline-flex; background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: 5px; gap: 4px; box-shadow: var(--sh); margin-bottom: 22px; }
.pdp-tab { font-size: 13px; font-weight: 700; padding: 10px 22px; border-radius: 9px; border: 0; background: 0; color: var(--mt); cursor: pointer; font-family: inherit; transition: all .2s; }
.pdp-tab:hover { color: var(--tx); }
.pdp-tab.active { background: var(--orange); color: #fff; }
.pdp-tabpane { display: none; }
.pdp-tabpane.active { display: block; animation: fadein .25s ease; }
@keyframes fadein { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* gallery zoom */
.pdp-main { cursor: zoom-in; }
.zoom-hint { position: absolute; bottom: 12px; right: 12px; font-size: 11px; color: var(--mt); background: #fff; border: 1px solid var(--bd); padding: 4px 9px; border-radius: 6px; opacity: 0; transition: opacity .2s; }
.pdp-main:hover .zoom-hint { opacity: 1; }
.pdp-thumb { width: 66px; }

/* lightbox */
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.85); display: none; align-items: center; justify-content: center; z-index: 300; padding: 40px; }
.lightbox.open { display: flex; }
.lightbox img { max-width: 90vw; max-height: 88vh; object-fit: contain; border-radius: 10px; }
.lb-close { position: absolute; top: 20px; right: 24px; background: rgba(255,255,255,.15); border: 0; color: #fff; width: 44px; height: 44px; border-radius: 50%; font-size: 20px; cursor: pointer; }

/* ===== buybox ===== */
.buybox { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 20px; display: flex; flex-direction: column; gap: 12px; box-shadow: var(--sh); }
.buybox.basic { background: var(--bg-a); box-shadow: none; }
.bb-de { font-size: 13px; color: var(--dm); text-decoration: line-through; }
.bb-main-row { display: flex; align-items: baseline; gap: 12px; }
.bb-main { font-size: 34px; font-weight: 900; letter-spacing: -1.5px; }
.bb-main sup { font-size: 17px; }
.bb-off { font-family: 'Space Mono', monospace; font-size: 13px; font-weight: 700; color: #fff; background: var(--red); padding: 3px 9px; border-radius: 6px; }
.bb-pix { font-size: 14px; color: var(--green); font-weight: 700; }
.bb-pix span { font-weight: 500; opacity: .85; }
.bb-inst { font-size: 13px; color: var(--tx2); }
.bb-inst.muted, .bb-seller.muted { color: var(--mt); }
.bb-ship { font-size: 13px; padding: 10px 12px; border-radius: 10px; background: var(--bg-a); border: 1px solid var(--bd); color: var(--tx2); }
.bb-ship.free b { color: var(--green); }
.bb-seller { font-size: 12.5px; color: var(--tx2); }
.bb-seller .srating { color: var(--yellow); font-weight: 700; }
.stk { font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 4px; }
.stk.ok { background: var(--green-l); color: #047857; }
.stk.low { background: #fff8e6; color: #92660a; }
.stk.out { background: var(--red-l); color: var(--red); }
.bb-others-toggle { border: 0; background: 0; color: var(--blue); font-weight: 700; font-size: 13px; cursor: pointer; text-align: left; padding: 6px 0; font-family: inherit; }
.bb-others-toggle .chev { display: inline-block; transition: transform .2s; }
.bb-others-toggle.open .chev { transform: rotate(180deg); }
.bb-others { display: none; flex-direction: column; gap: 8px; border-top: 1px solid var(--bd); padding-top: 12px; }
.bb-others.open { display: flex; }
.seller-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--bd); border-radius: 10px; }
.seller-row.win { border-color: var(--green); background: var(--green-l); }
.sr-name { font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.winbadge { background: var(--green); color: #fff; font-family: 'Space Mono', monospace; font-size: 8px; font-weight: 700; padding: 2px 6px; border-radius: 4px; text-transform: uppercase; }
.sr-meta { font-size: 11.5px; color: var(--mt); margin-top: 3px; }
.sr-right { text-align: right; flex-shrink: 0; }
.sr-price { font-size: 15px; font-weight: 800; }
.sr-pix { font-size: 11px; color: var(--green); }
.sr-add { margin-top: 5px; border: 1px solid var(--orange); color: var(--orange); background: #fff; font-family: inherit; font-weight: 700; font-size: 11px; padding: 5px 12px; border-radius: 7px; cursor: pointer; }
.sr-add:hover { background: var(--orange); color: #fff; }

.pdp-bullets li { align-items: flex-start; }

/* desc / reviews / qa */
.desc-block { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 26px; margin-top: 24px; }
.desc-block h2 { font-size: 19px; font-weight: 800; margin: 0 0 12px; letter-spacing: -.4px; }
.desc-block p { font-size: 14px; line-height: 1.75; color: var(--tx2); margin: 0 0 12px; }
.desc-block p:last-child { margin: 0; }
.rt-summary { display: flex; gap: 30px; align-items: center; padding-bottom: 18px; border-bottom: 1px solid #f0f0f0; margin-bottom: 6px; flex-wrap: wrap; }
.rt-score { text-align: center; }
.rt-score b { font-size: 40px; font-weight: 900; letter-spacing: -1.5px; display: block; line-height: 1; }
.rt-score .stars { color: var(--yellow); font-size: 15px; letter-spacing: -1px; }
.rt-score small { display: block; color: var(--mt); font-size: 11.5px; margin-top: 3px; }
.rt-bars { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 5px; }
.rt-bar { display: flex; align-items: center; gap: 10px; font-size: 11px; color: var(--mt); }
.rt-bar > span { width: 22px; }
.rt-track { flex: 1; height: 8px; background: var(--bg-a); border-radius: 4px; overflow: hidden; }
.rt-track i { display: block; height: 100%; background: var(--yellow); }
.rv-head { display: flex; align-items: center; gap: 10px; }
.rv-head .who { font-size: 13px; font-weight: 700; }
.rv-head .stars { color: var(--yellow); font-size: 13px; letter-spacing: -1px; }
.rv-date { font-size: 11px; color: var(--dm); margin-left: auto; }
.rv-reply { margin-top: 8px; padding: 10px 12px; background: var(--bg-a); border-left: 3px solid var(--orange); border-radius: 6px; font-size: 12.5px; color: var(--tx2); }
.qa-block { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 26px; margin-top: 24px; }
.qa-block h2 { font-size: 19px; font-weight: 800; margin: 0 0 14px; letter-spacing: -.4px; }
.qa { padding: 12px 0; border-bottom: 1px solid #f0f0f0; }
.qa:last-child { border: 0; }
.qa .q { font-size: 13.5px; font-weight: 700; }
.qa .a { font-size: 13.5px; color: var(--tx2); margin-top: 5px; line-height: 1.55; }

/* A+ extras */
.aplus-brand { display: flex; gap: 18px; align-items: center; }
.aplus-brand img { width: 120px; flex-shrink: 0; border-radius: 10px; }
.aplus-hero-prem { position: relative; border-radius: 12px; overflow: hidden; padding: 0; display: flex; align-items: stretch; min-height: 240px; color: #fff; }
.aplus-hero-prem img { width: 50%; object-fit: cover; }
.ahp-copy { padding: 30px; display: flex; flex-direction: column; justify-content: center; }
.prem-tag { font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; background: var(--orange); color: #fff; padding: 4px 10px; border-radius: 5px; align-self: flex-start; margin-bottom: 12px; }
.ahp-copy h3 { font-size: 22px; margin: 0 0 8px; }
.ahp-copy p { opacity: .9; font-size: 14px; line-height: 1.6; margin: 0; }
.cmp-wrap { overflow-x: auto; }
.cmp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.cmp-table td { border: 1px solid var(--bd); padding: 10px 12px; color: var(--tx2); }
.cmp-table td.cmp-name { font-weight: 700; color: var(--tx); }
.cmp-table tr.this { background: var(--orange-l); }
.cmp-table tr.this td { border-color: #f6c79c; }
.cmp-tag { font-family: 'Space Mono', monospace; font-size: 8px; font-weight: 700; text-transform: uppercase; color: var(--orange); background: #fff; padding: 1px 6px; border-radius: 4px; margin-left: 6px; }

/* ===== ANTES ===== */
.antes-note { background: #fff8e6; border: 1px solid #f5e2b0; color: #8a6206; font-size: 13px; padding: 12px 16px; border-radius: 10px; margin-bottom: 18px; }
.antes-main img { filter: saturate(.8) contrast(.92) brightness(.98); }
.antes-title { font-size: 17px !important; font-weight: 600 !important; text-transform: uppercase; color: var(--tx2) !important; letter-spacing: 0 !important; line-height: 1.4 !important; }
.brand-link.muted { color: var(--dm); }
.antes-bullets li { background: #fff; }
.antes-desc p { color: var(--mt); }

/* ===== EXPLICAÇÃO ===== */
.exp-intro { text-align: center; max-width: 640px; margin: 0 auto 24px; }
.exp-intro h2 { font-size: 24px; font-weight: 900; letter-spacing: -.6px; margin: 0 0 8px; }
.exp-intro p { color: var(--mt); font-size: 14px; line-height: 1.6; margin: 0; }
.exp-scores { display: flex; align-items: center; justify-content: center; gap: 24px; margin: 0 auto 30px; max-width: 720px; flex-wrap: wrap; }
.exp-score-col { flex: 1; min-width: 220px; background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 18px; }
.exp-score-col .tag { font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 4px 10px; border-radius: 5px; }
.exp-score-col .tag.antes { background: var(--red-l); color: var(--red); }
.exp-score-col .tag.depois { background: var(--green-l); color: #047857; }
.exp-arrow { font-size: 26px; color: var(--dm); font-weight: 900; }
.sc-bar { margin-top: 12px; }
.sc-track { height: 12px; background: var(--bg-a); border-radius: 6px; overflow: hidden; }
.sc-track i { display: block; height: 100%; border-radius: 6px; }
.sc-bar.cri .sc-track i { background: var(--red); } .sc-bar.atc .sc-track i { background: var(--yellow); }
.sc-bar.bom .sc-track i { background: var(--blue); } .sc-bar.exc .sc-track i { background: var(--green); }
.sc-meta { font-size: 12px; color: var(--mt); margin-top: 6px; }
.sc-meta b { color: var(--tx); font-size: 18px; font-weight: 900; }
.exp-axes { display: flex; flex-direction: column; gap: 16px; }
.exp-axis { background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 22px; }
.ea-h { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.ea-ic { font-size: 20px; }
.ea-h h3 { margin: 0; font-size: 17px; font-weight: 800; }
.ea-before, .ea-after { padding: 12px 14px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; }
.ea-before { background: var(--red-l); color: #9b2743; border: 1px solid #f3c6d0; margin-bottom: 8px; }
.ea-after { background: var(--green-l); color: #065f46; border: 1px solid #b6e6d3; }
.ea-before ul, .ea-after ul { margin: 6px 0 0; padding-left: 18px; }
.ea-before ul li, .ea-after ul li { margin: 3px 0; }
.ea-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ea-cols .ea-before, .ea-cols .ea-after { margin: 0; }
.ea-note { margin-top: 12px; font-size: 12.5px; color: var(--mt); line-height: 1.6; }
.ea-note b { color: var(--tx); }
.ea-imgs { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ea-imgs figure { margin: 0; text-align: center; }
.ea-1 img { width: 90px; height: 90px; object-fit: contain; border: 1px solid var(--bd); border-radius: 10px; background: var(--bg-a); filter: saturate(.8) contrast(.9); }
.ea-1 figcaption { font-size: 10px; color: var(--red); margin-top: 4px; }
.ea-vs { font-family: 'Space Mono', monospace; font-size: 12px; color: var(--dm); font-weight: 700; }
.ea-valor { display: flex; gap: 8px; flex-wrap: wrap; }
.ea-valor figure { position: relative; }
.ea-valor img { width: 74px; height: 74px; object-fit: contain; border: 1px solid var(--bd); border-radius: 10px; background: var(--bg-a); }
.ea-valor .vl { position: absolute; top: -6px; left: -6px; width: 20px; height: 20px; border-radius: 50%; color: #fff; font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.exp-foot { text-align: center; margin-top: 22px; font-size: 15px; color: var(--tx2); background: #fff; border: 1px solid var(--bd); border-radius: var(--rd); padding: 20px; }
.exp-foot b { color: var(--orange); font-weight: 900; }
@media (max-width: 600px) { .ea-cols { grid-template-columns: 1fr; } }

/* aplus-cards já existe; garante imagem contida */
.aplus-cards img { background: var(--bg-a); object-fit: contain; padding: 8px; }

/* ===== placeholders — aguardando conteúdo enriquecido ===== */
.enrich-ph {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 9px; height: 100%; min-height: 220px; padding: 34px 24px;
  background: var(--bg-a); border: 1.5px dashed var(--bd-h); border-radius: var(--rd); color: var(--mt);
}
.enrich-ph .eph-ic { font-size: 34px; color: var(--dm); line-height: 0; }
.enrich-ph h3 { margin: 0; font-size: 15px; font-weight: 800; color: var(--tx2); }
.enrich-ph p { margin: 0; font-size: 12.5px; max-width: 48ch; line-height: 1.5; }
.enrich-ph .eph-tag { margin-top: 4px; font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; color: var(--orange); background: var(--orange-l); padding: 5px 10px; border-radius: 6px; }
.aplus-wrap .enrich-ph { min-height: 260px; }
.antes-main.pdp-main { cursor: default; }
.antes-main img { image-rendering: auto; }
.pdp-thumb.ph { align-items: center; justify-content: center; color: var(--dm); font-size: 20px; border-style: dashed; cursor: default; }
.pdp-thumb.ph:hover { border-color: var(--bd-h); }