/* Vitrine editorial. Consumida somente por /sitepronto/. */
.sp-v2 .site-header { background:#fff; backdrop-filter:none; }
.sp-v2 .sp-brand > img { width:34px; height:34px; flex:none; }
.sp-v2 .sp-hero { background:#fff; padding:clamp(44px,6vw,82px) 0; }
.sp-v2 .sp-hero__inner { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; max-width:1240px; }
.sp-v2 .sp-hero h1 { font-size:clamp(42px,4.6vw,66px); line-height:1.05; letter-spacing:-.055em; margin:20px 0 26px; }
.sp-v2 .sp-hero h1 span { color:#244bd1; }
.sp-v2 .sp-hero__lead { font-size:18px; line-height:1.7; max-width:47ch; }
.sp-v2 .sp-hero__actions { display:flex; gap:12px; margin:26px 0; flex-wrap:wrap; }
.sp-v2 .sp-price { margin:24px 0 12px; display:flex; align-items:center; gap:18px; }
.sp-v2 .sp-price__value { font-size:48px; }
.sp-v2 .sp-price__note { font-size:13px; line-height:1.6; }
.sp-v2 .sp-price__note a { color:#244bd1; text-decoration:underline; text-underline-offset:3px; }
.sp-v2 .sp-hero__hint { font-size:12px; max-width:45ch; }
.sp-showcase { padding:20px; background:#f2f2ef; border:1px solid var(--tofy-line); border-radius:24px; transform:rotate(1deg); }
.sp-showcase a { display:block; color:var(--tofy-ink); text-decoration:none; background:white; border:1px solid var(--tofy-line); border-radius:12px; overflow:hidden; }
.sp-showcase img { display:block; width:100%; height:auto; }
.sp-browser { display:flex; align-items:center; gap:5px; padding:10px 12px; background:#fff; }
.sp-browser i { width:5px; height:5px; background:#a3a3aa; border-radius:50%; }
.sp-browser > span { margin-left:auto; font:10px var(--tofy-mono); color:var(--tofy-text-2); }
.sp-preview-caption { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:16px; font-size:12px; }
.sp-preview-caption strong { font-size:14px; max-width:24ch; }
.sp-preview-caption > span { white-space:nowrap; color:#244bd1; }
.sp-showcase-pair { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
.sp-showcase-pair span { display:block; padding:10px 12px; font-size:12px; font-weight:600; }
.sp-benefit-strip { border-block:1px solid var(--tofy-line); padding:26px 0; background:var(--tofy-paper); }
.sp-benefit-strip .tofy-container { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.sp-benefit-strip span { font-size:13px; color:var(--tofy-text-2); }
.sp-benefit-strip strong { color:var(--tofy-ink); display:block; font-size:15px; margin-bottom:3px; }
.sp-v2 .sp-models { background:#fff; }
.sp-v2 .sp-models__head { max-width:750px; }
.sp-v2 .sp-models__head h2 { font-size:clamp(32px,3.7vw,48px); letter-spacing:-.04em; line-height:1.15; }
.sp-catalog-tools { margin:0 0 32px; }
.sp-catalog-tools[hidden],.sp-empty[hidden],.sp-grid > li[hidden] { display:none !important; }
.sp-search { display:flex; flex-direction:column; max-width:520px; gap:8px; font-size:13px; font-weight:600; }
.sp-search input { border:1px solid var(--tofy-line-strong); border-radius:8px; padding:14px 16px; font:16px var(--tofy-font); background:#fff; color:var(--tofy-ink); min-height:48px; }
.sp-filters { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.sp-filters button { border:1px solid var(--tofy-line-strong); border-radius:40px; padding:10px 17px; font:500 13px var(--tofy-font); min-height:44px; background:white; color:var(--tofy-ink); cursor:pointer; }
.sp-filters button[aria-pressed="true"] { background:var(--tofy-ink); color:white; border-color:var(--tofy-ink); }
#model-count { font-size:12px; color:var(--tofy-text-2); margin:0; }
.sp-v2 .sp-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.sp-v2 .sp-grid > li { min-width:0; }
.sp-v2 .sp-card { border:1px solid var(--tofy-line); border-radius:14px; box-shadow:none; padding:0; height:100%; }
.sp-v2 .sp-card:hover { border-color:#9ca8cf; transform:translateY(-3px); box-shadow:0 12px 26px #1111140a; }
.sp-v2 .sp-card__shot { position:relative; background:#f4f4f2; aspect-ratio:8/5; border-bottom:1px solid var(--tofy-line); }
.sp-v2 .sp-card__shot img { opacity:1; width:100%; height:100%; object-fit:cover; }
.sp-v2 .sp-card__body { padding:24px; display:flex; flex-direction:column; gap:12px; }
.sp-v2 .sp-card h3 { font-size:21px; letter-spacing:-.025em; margin:0; }
.sp-v2 .sp-card p { font-size:14px; line-height:1.65; display:block; margin:0; }
.sp-v2 .sp-card__ico { display:none; }
.sp-v2 .sp-card .tofy-tag { align-self:flex-start; margin:8px 0 0; }
.sp-new-label { position:absolute; left:12px; top:12px; background:#244bd1; color:#fff; padding:5px 9px; border-radius:4px; font:600 10px var(--tofy-mono); letter-spacing:.1em; }
.sp-empty { background:var(--tofy-paper); border:1px solid var(--tofy-line); padding:32px; border-radius:14px; }
.sp-empty h3 { margin-top:0; }
.sp-v2 .sp-how { border-top:1px solid var(--tofy-line); background:var(--tofy-paper); }
.sp-v2 .sp-steps { grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; }
.sp-v2 .sp-steps li { background:white; border:1px solid var(--tofy-line); padding:24px 20px; border-radius:12px; min-width:0; }
.sp-v2 .sp-steps h3 { font-size:18px; }
.sp-v2 .sp-how__extra { border:1px solid var(--tofy-line); padding:36px; border-radius:16px; background:#fff; scroll-margin-top:100px; }
.sp-v2 .sp-faq { background:#fff; }
.sp-v2 .sp-faq__list { max-width:900px; }
.sp-buy-dock { position:fixed; right:20px; bottom:20px; z-index:45; display:flex; align-items:center; gap:6px; }
.sp-buy-dock .sp-buy-float { position:static; }
.sp-buy-dock__close { display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--tofy-line-strong); border-radius:50%; background:rgba(255,255,255,.94); color:var(--tofy-ink); font:24px/1 var(--tofy-font); cursor:pointer; box-shadow:0 8px 24px rgba(17,17,20,.14); }
.sp-buy-dock__close:focus-visible { outline:2px solid var(--tofy-accent); outline-offset:2px; }
.sp-buy-float__arrow { font-size:18px; line-height:1; }
@media(max-width:1100px) { .sp-v2 .sp-hero__inner { gap:32px; } .sp-v2 .sp-steps { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:860px) {
 html:not(.tofy-nav-pronto) .sp-v2 .sp-header { flex-wrap:wrap; padding-block:14px; }
 html:not(.tofy-nav-pronto) .sp-v2 .sp-nav { display:flex; width:100%; flex-wrap:wrap; gap:8px 18px; }
 html:not(.tofy-nav-pronto) .sp-v2 .sp-nav .sp-nav__cta { width:auto; margin:0; }
 .sp-v2 .sp-hero__inner { grid-template-columns:minmax(0,1fr); }
 .sp-v2 .sp-hero h1 { max-width:17ch; font-size:clamp(42px,7vw,66px); }
 .sp-v2 .sp-showcase { max-width:660px; transform:none; }
 .sp-v2 .sp-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
 .sp-v2 .sp-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .sp-v2 .sp-card__body { padding:18px; }
 .sp-v2 .sp-card h3 { font-size:20px; }
 .sp-v2 .sp-how__extra { padding:24px; }
}
@media(max-width:560px) {
 /* A goteira de 32px do brand.css tira 64px de uma tela de 375 — 17% da
    largura. Aqui vale 20px. Escopo em .sp-v2 de proposito: o token e das
    nove unidades da TOFY e mexer nele mudaria todas. */
 .sp-v2 { --tofy-gutter:20px; }

 .sp-v2 .sp-grid,.sp-v2 .sp-steps { grid-template-columns:minmax(0,1fr); }
 .sp-v2 .sp-how__extra { grid-template-columns:minmax(0,1fr); }
 .sp-v2 .sp-hero { padding:28px 0 22px; }
 .sp-v2 .sp-hero__inner,
 .sp-v2 .sp-hero__inner > *,
 .sp-v2 .sp-hero-copy,
 .sp-v2 .sp-showcase { min-width:0; width:100%; max-width:100%; }
 .sp-v2 .sp-hero h1 { max-width:100%; margin:12px 0 16px; font-size:clamp(36px,10.2vw,40px); line-height:1.06; letter-spacing:-.045em; overflow-wrap:normal; }
 .sp-v2 .sp-hero__lead { width:100%; max-width:100%; margin-top:0; font-size:16px; line-height:1.55; }
 .sp-v2 .sp-hero__actions { width:100%; max-width:100%; gap:4px; margin:18px 0 14px; }
 .sp-v2 .sp-hero__actions .sp-btn { max-width:100%; white-space:normal; }
 .sp-v2 .sp-hero__actions .sp-btn--ghost { width:auto; min-height:44px; align-self:center; padding:9px 14px; border:0; background:transparent; color:var(--tofy-accent); }
 .sp-v2 .sp-price { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; width:100%; max-width:100%; margin:16px 0 8px; }
 .sp-v2 .sp-price__note { min-width:0; font-size:11.5px; letter-spacing:.075em; }
 .sp-v2 .sp-hero__hint { margin-top:12px; line-height:1.45; }
 .sp-benefit-strip .tofy-container { grid-template-columns:1fr; gap:14px; }
 .sp-benefit-strip span { display:flex; flex-wrap:wrap; gap:6px; align-items:baseline; }
 .sp-benefit-strip strong { margin:0; }
 .sp-showcase { padding:10px; border-radius:14px; }

 /* Este bloco encolhia a letra no celular, que e onde ela precisa crescer.
    O rotulo do navegador falso ia a 8px: ninguem le, e ele so decora a
    barra que as tres bolinhas ja explicam. Sai da tela em vez de fingir
    que esta sendo lido. */
 .sp-browser > span { display:none; }
 .sp-preview-caption { flex-wrap:wrap; gap:8px; }
 .sp-preview-caption strong { max-width:none; }
 .sp-showcase-pair { gap:10px; }
 .sp-showcase-pair span { font-size:12.5px; }

 /* 10.5px em versalete com entreletra larga e o tamanho de etiqueta do
    brand.css. Como aqui a etiqueta e a chamada de cada um dos 13 cartoes,
    ela sobe — so nesta pagina, so no celular. */
 .sp-v2 .sp-card .tofy-tag { font-size:12px; padding:7px 12px; }

 /* "Veja o que esta incluido" tinha 17px de altura. O padding com margem
    negativa da os 44px que o dedo precisa sem mover o texto de lugar. */
 .sp-v2 .sp-price__note a {
   display:inline-flex; align-items:center; min-height:44px;
   padding-block:12px; margin-block:-12px;
 }
 .sp-v2 .sp-models__head h2 br { display:none; }
 .sp-v2 .sp-hero__actions { align-items:stretch; }
 .sp-v2 .sp-price__value { font-size:46px; }

 /* O dock só entra depois que o hero sai da tela. Sem JavaScript ele
    continua visível como contingência; a classe ready liga a progressão. */
 .sp-buy-dock { left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom,0px)); gap:4px; padding:3px; border:1px solid rgba(255,255,255,.2); border-radius:18px; background:rgba(36,75,209,.94); box-shadow:0 8px 28px rgba(17,17,20,.2); backdrop-filter:blur(14px); transition:opacity .2s var(--tofy-ease), transform .2s var(--tofy-ease), visibility .2s; }
 .sp-buy-dock .sp-buy-float { min-width:0; min-height:48px; flex:1; justify-content:center; gap:8px; padding:8px 10px; border-radius:14px; box-shadow:none; background:transparent; font-size:15px; }
 .sp-buy-dock .sp-buy-float::before { content:none; }
 .sp-buy-dock .sp-buy-float__t { display:inline; overflow:hidden; text-overflow:ellipsis; }
 .sp-buy-dock .sp-buy-float__p { flex:0 0 auto; font-size:14px; }
 .sp-buy-dock__close { flex:0 0 44px; border-color:rgba(255,255,255,.3); background:rgba(0,0,0,.14); color:#fff; box-shadow:none; }
 html.sp-buy-dock-ready .sp-buy-dock:not(.is-visible) { visibility:hidden; opacity:0; pointer-events:none; transform:translateY(calc(100% + 24px)); }
 html.sp-buy-dock-ready .sp-buy-dock.is-visible { visibility:visible; opacity:1; transform:translateY(0); }
 body { padding-bottom:calc(68px + env(safe-area-inset-bottom,0px)); }
}
@media(max-width:359px) {
 .sp-v2 { --tofy-gutter:16px; }
 .sp-v2 .sp-hero h1 { font-size:34px; }
 .sp-v2 .sp-price__value { font-size:42px; }
 .sp-buy-dock .sp-buy-float__t { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { .sp-v2 .sp-showcase { transform:none; } .sp-v2 * { scroll-behavior:auto !important; transition:none !important; } }