/* ═══════════════════════════════════════════════════════════════════════════
   Sleep Match — KingStar · v11 "Suíte Presidencial" (redesign 09/07/2026)
   Reescrita completa aprovada pelo Felipe em demo local (_ks-local/sm-demo/).
   Spec: _ks-local/handoff/SPEC-sleepmatch-redesign-20260709.md
   Reverter: git revert do commit (CSS+JS+template+vendor sobem juntos).
   Overrides de plataforma (scs.css: p{color:#1f1f1f}, margin de img/p,
   wrapper #middle) ficam marcados com [PLAT] — não remover os !important.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Fontes (self-hosted; Montserrat já vem do tema global) ── */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300;font-display:swap;
  src:url('/custom/content/themes/KingStar2023/assets/fonts/fraunces-latin-300.woff2') format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400;font-display:swap;
  src:url('/custom/content/themes/KingStar2023/assets/fonts/fraunces-latin-ital400.woff2') format('woff2');}

/* ── [PLAT] full-bleed dark, escopado à rota (validado ao vivo 07/07) ── */
body.sleep-match{background:#070604 !important;}
body.sleep-match #middle{margin-left:0 !important;margin-right:0 !important;max-width:none !important;width:100% !important;}
body.sleep-match .wd-browsing-breadcrumbs{display:none !important;}
body.sm-locked{overflow:hidden !important;}

/* ── base ── */
#sm-page{--smbg:#070604;--smcard:#12100b;--smgold:#c8a84b;--smgold2:#f0d880;--smcream:#efe9dc;--smbronze:#8a7a5c;}
/* Reset: SÓ box-sizing no universal. NUNCA zerar margin/padding via "#sm-page *"
   — a especificidade de ID (1,0,0) engole o padding/margin de TODA classe (0,1,0)
   e achata botões/cards (era o CTA "NICIAR" quebrado da v10). Baseline explícita: */
#sm-page *,#sm-page *::before,#sm-page *::after{box-sizing:border-box;}
#sm-page h1,#sm-page h2,#sm-page h3,#sm-page p,#sm-page ul,#sm-page figure{margin:0;padding:0;}
#sm-page{font-family:'Montserrat',-apple-system,'Segoe UI',sans-serif;background:var(--smbg);color:var(--smcream);overflow-x:hidden;position:relative;}
#sm-page button{font-family:inherit;}
#sm-page :focus-visible{outline:2px solid var(--smgold);outline-offset:3px;border-radius:4px;}

/* partículas + vinheta (canvas fica atrás de tudo da página) */
#sm-dust{position:fixed;inset:0;z-index:0;pointer-events:none;}
.sm-vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 40%,transparent 55%,rgba(0,0,0,.55) 100%);}

/* ── ATO 1: HERO ── */
#sm-hero{position:relative;z-index:2;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:calc(84px + 4vh) 24px 64px;background:radial-gradient(ellipse 85% 60% at 50% -12%,#241a04 0%,transparent 60%);}
.sm-hero-in{max-width:680px;}
.sm-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(200,168,75,.32);background:rgba(200,168,75,.07);border-radius:100px;padding:8px 20px;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--smgold);font-weight:600;}
.sm-badge svg{width:12px;height:12px;}
#sm-page .sm-hero-logo{width:118px;margin:34px auto 30px !important;display:block;opacity:.9;} /* [PLAT] mata override de margin */
#sm-page .sm-h1{font-family:'Fraunces',Georgia,serif;font-weight:300;font-size:clamp(2.4rem,6.4vw,4.6rem);line-height:1.06;letter-spacing:-.02em;color:var(--smcream);}
#sm-page .sm-h1 em{font-style:italic;font-weight:400;color:var(--smgold2);}
.sm-h1 .sm-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em;}
.sm-h1 .sm-wi{display:inline-block;}
#sm-page .sm-hero-sub{margin:26px auto 0 !important;max-width:440px;color:#c6bba3 !important;font-size:clamp(.92rem,2vw,1.05rem);line-height:1.75;font-weight:500;} /* [PLAT] */
.sm-cta{margin-top:44px;display:inline-flex;align-items:center;gap:12px;background:linear-gradient(135deg,#d9b85c,#c8a84b 55%,#a9883a);color:#0a0805 !important;font-weight:800;font-size:.92rem;letter-spacing:1.5px;text-transform:uppercase;border:none;border-radius:100px;padding:19px 44px;cursor:pointer;text-decoration:none !important;transition:transform .25s;animation:smCtaPulse 2.8s ease-in-out infinite;}
.sm-cta:hover{transform:translateY(-3px);}
.sm-cta svg{width:17px;height:17px;transition:transform .25s;}
.sm-cta:hover svg{transform:translateX(5px);}
@keyframes smCtaPulse{0%,100%{box-shadow:0 0 0 0 rgba(200,168,75,.35),0 14px 44px rgba(200,168,75,.22);}50%{box-shadow:0 0 0 9px rgba(200,168,75,0),0 14px 44px rgba(200,168,75,.34);}}
.sm-stats{display:flex;gap:56px;justify-content:center;margin-top:72px;flex-wrap:wrap;}
.sm-stat{text-align:center;}
/* KS 31/07 — line-height FIXO e nao "normal". A estrela ★ (U+2605) nao existe na
   Fraunces e vem de uma fonte de fallback com metrica mais alta: com line-height
   normal a caixa do "4,9★" ficava 8,5px mais alta que a do "6" e do "3MM+", e isso
   empurrava o rotulo "NO GOOGLE" para baixo — os tres rotulos desalinhados.
   Com line-height fixo a caixa nao depende mais do glifo: desvio zero. Vale para
   desktop tambem (la o desvio era ainda maior, 8,5px contra 7,5px do celular). */
.sm-stat-n{font-family:'Fraunces',Georgia,serif;font-weight:400;font-size:2rem;line-height:1.2;color:var(--smgold2);letter-spacing:-.5px;}
.sm-stat-l{font-size:.68rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--smbronze);margin-top:6px;font-weight:600;}
/* KS 31/07 — era left:50% + translateX(-50%): num absoluto, isso limita a largura
   disponivel a METADE do hero (196px no celular), e "uma experiencia King Star"
   quebrava em duas linhas ("...KING / STAR") com 3px de entreletra. left/right:0 +
   text-align da a largura toda e centraliza igual, em uma linha. No desktop nunca
   apareceu porque metade da tela ja era larga o suficiente. */
.sm-scroll-hint{position:absolute;bottom:26px;left:0;right:0;text-align:center;color:var(--smbronze);font-size:.62rem;letter-spacing:3px;text-transform:uppercase;opacity:.7;}

/* ── ATO 2: QUIZ (overlay tela-cheia) ── */
#sm-quiz-section{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse 90% 70% at 50% 0%,#1a1303 0%,var(--smbg,#070604) 62%);background-color:#070604;padding:64px 22px 28px;overflow-y:auto;}
#sm-quiz-section.sm-on{display:flex;}
.sm-qz{width:100%;max-width:780px;display:flex;flex-direction:column;align-items:center;margin:auto;}
/* constelação */
.sm-constel{width:min(520px,86vw);margin-bottom:10px;}
.sm-constel line{stroke:var(--smgold,#c8a84b);stroke-width:1;opacity:.85;}
.sm-constel line.sm-guide{stroke:rgba(200,168,75,.16);stroke-width:.8;stroke-dasharray:2.5 5.5;opacity:1;}
.sm-constel .sm-core{fill:#544729;transition:fill .4s;}
.sm-constel .sm-ring{fill:none;stroke:rgba(200,168,75,.28);stroke-width:.8;}
.sm-constel .sm-halo{fill:none;stroke:var(--smgold2,#f0d880);stroke-width:.8;opacity:0;}
.sm-constel .sm-star.sm-lit .sm-core{fill:var(--smgold2,#f0d880);}
.sm-constel .sm-star.sm-lit .sm-ring{stroke:rgba(240,216,128,.55);}
#sm-page .sm-qz-label,#sm-quiz-section .sm-qz-label{font-size:.66rem;letter-spacing:3px;text-transform:uppercase;color:#c6bba3 !important;font-weight:600;margin-bottom:34px;} /* [PLAT] */
.sm-qz-label b{color:var(--smgold,#c8a84b);font-weight:700;}
/* palco 3D */
.sm-stage{perspective:1200px;width:100%;position:relative;}
#sm-q-card{width:100%;transform-style:preserve-3d;}
.sm-q-title{font-family:'Fraunces',Georgia,serif;font-weight:300;font-size:clamp(1.7rem,4.4vw,2.7rem);letter-spacing:-.01em;line-height:1.12;text-align:center;color:var(--smcream,#efe9dc);}
.sm-q-title em{font-style:italic;color:var(--smgold2,#f0d880);}
#sm-quiz-section .sm-q-sub{text-align:center;color:#c6bba3 !important;font-size:.9rem;font-weight:500;margin:14px 0 36px;line-height:1.6;} /* [PLAT] */
.sm-opts{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);}
.sm-opts.sm-c3,.sm-opts.sm-c5{grid-template-columns:repeat(3,1fr);}
.sm-opts.sm-c4{grid-template-columns:repeat(4,1fr);}
.sm-opt{position:relative;background:linear-gradient(160deg,rgba(255,252,240,.035),rgba(255,252,240,.012));border:1px solid rgba(200,168,75,.14);border-radius:16px;padding:22px 16px 19px;text-align:center;cursor:pointer;transition:border-color .25s,background .25s;transform-style:preserve-3d;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;}
.sm-opt:hover{border-color:rgba(200,168,75,.45);background:linear-gradient(160deg,rgba(200,168,75,.07),rgba(200,168,75,.02));}
.sm-opt.sm-on{border-color:var(--smgold,#c8a84b);background:linear-gradient(160deg,rgba(200,168,75,.12),rgba(200,168,75,.03));box-shadow:0 0 0 1px rgba(200,168,75,.3),0 12px 34px rgba(0,0,0,.4),inset 0 0 30px rgba(200,168,75,.05);}
.sm-opt-ic{width:30px;height:30px;margin:0 auto 12px;color:var(--smgold,#c8a84b);display:block;}
.sm-opt.sm-on .sm-opt-ic{color:var(--smgold2,#f0d880);}
.sm-opt-ic svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.sm-opt-lb{font-size:.9rem;font-weight:700;color:var(--smcream,#efe9dc);line-height:1.3;}
#sm-quiz-section .sm-opt-ds{font-size:.7rem;color:#a1947a !important;font-weight:500;margin-top:5px;line-height:1.45;} /* [PLAT] */
.sm-opt-chk{position:absolute;top:10px;right:12px;width:20px;height:20px;opacity:0;}
.sm-opt-chk circle{fill:var(--smgold,#c8a84b);}
.sm-opt-chk path{fill:none;stroke:#0a0805;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:12;stroke-dashoffset:12;}
.sm-opt.sm-on .sm-opt-chk{opacity:1;}
.sm-opt.sm-on .sm-opt-chk path{animation:smChk .3s .05s ease-out forwards;}
@keyframes smChk{to{stroke-dashoffset:0;}}
/* navegação */
.sm-nav{display:flex;gap:12px;margin-top:38px;width:100%;max-width:560px;}
#sm-btn-back{background:transparent;border:1px solid rgba(239,233,220,.18);color:#d8d2c6;border-radius:100px;padding:15px 26px;font-size:.85rem;font-weight:600;cursor:pointer;transition:border-color .25s,color .25s;white-space:nowrap;touch-action:manipulation;}
#sm-btn-back:hover:not(:disabled){border-color:rgba(239,233,220,.4);color:var(--smcream,#efe9dc);}
#sm-btn-back:disabled{opacity:.35;cursor:default;color:#9a8f7a;}
#sm-btn-next{flex:1;background:linear-gradient(135deg,#d9b85c,#c8a84b 55%,#a9883a);color:#0a0805;border:none;border-radius:100px;padding:16px 30px;font-size:.9rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:transform .25s,box-shadow .25s;touch-action:manipulation;}
#sm-btn-next.sm-wait{background:rgba(200,168,75,.1);color:#b9a97f;border:1px solid rgba(200,168,75,.35);cursor:default;}
#sm-btn-next:not(.sm-wait):hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(200,168,75,.32);}
.sm-qz-close{position:absolute;top:20px;right:22px;background:none;border:none;color:var(--smbronze,#8a7a5c);font-size:.66rem;letter-spacing:2px;text-transform:uppercase;cursor:pointer;font-weight:600;opacity:.85;}
.sm-qz-close:hover{color:var(--smcream,#efe9dc);}

/* "lendo o mapa" */
#sm-calc{position:fixed;inset:0;z-index:1000000;display:none;align-items:center;justify-content:center;flex-direction:column;background:rgba(7,6,4,.94);}
#sm-calc.sm-on{display:flex;}
.sm-calc-star{width:54px;height:54px;color:var(--smgold2,#f0d880);animation:smSpinStar 1.6s ease-in-out infinite;}
@keyframes smSpinStar{0%{transform:rotate(0) scale(1);}50%{transform:rotate(180deg) scale(1.25);}100%{transform:rotate(360deg) scale(1);}}
#sm-page .sm-calc-t,#sm-calc .sm-calc-t{margin-top:26px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:1.3rem;color:var(--smcream,#efe9dc);}
#sm-calc .sm-calc-s{margin-top:8px;font-size:.7rem;letter-spacing:2.5px;text-transform:uppercase;color:#c6bba3 !important;font-weight:600;}

/* ── ATO 3: RESULTADO ── */
#sm-results{position:relative;z-index:2;display:none;min-height:100vh;padding:calc(84px + 4vh) 24px 90px;}
#sm-results.sm-show{display:block;}
.sm-res-top{text-align:center;margin-bottom:64px;}
.sm-res-eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(200,168,75,.3);background:rgba(200,168,75,.07);color:var(--smgold,#c8a84b);border-radius:100px;padding:7px 20px;font-size:.64rem;letter-spacing:2.5px;text-transform:uppercase;font-weight:700;margin-bottom:26px;}
.sm-res-h2{font-family:'Fraunces',Georgia,serif;font-weight:300;font-size:clamp(2rem,5vw,3.2rem);letter-spacing:-.01em;color:var(--smcream,#efe9dc);}
.sm-res-h2 em{font-style:italic;color:var(--smgold2,#f0d880);}
#sm-page .sm-res-sub{color:#c6bba3 !important;font-size:.92rem;font-weight:500;max-width:430px;margin:18px auto 0 !important;text-align:center !important;line-height:1.7;} /* [PLAT] */
#sm-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;max-width:1080px;margin-left:auto !important;margin-right:auto !important;margin-bottom:72px;}
.sm-card{flex:0 1 328px;background:linear-gradient(175deg,#16130c 0%,var(--smcard,#12100b) 40%);border:1px solid rgba(200,168,75,.14);border-radius:22px;overflow:hidden;transform-style:preserve-3d;transition:border-color .3s;}
.sm-card:hover{border-color:rgba(200,168,75,.4);}
.sm-card.sm-card-top{border-color:rgba(200,168,75,.5);box-shadow:0 24px 70px rgba(0,0,0,.5),0 0 44px rgba(200,168,75,.07);}
.sm-card-imgw{position:relative;height:212px;overflow:hidden;background:radial-gradient(ellipse 90% 80% at 50% 30%,#26200f 0%,#0c0a06 75%);}
/* [PLAT] img{height:auto} da plataforma vence height:100% sem !important -> a imagem
   viva do .json (smRefreshCards) renderizava 326px e vazava por cima do badge/texto
   (bug pego AO VIVO 09/07; overflow:hidden no wrapper = cinto e suspensório). */
#sm-page .sm-card-img{width:100% !important;height:100% !important;max-width:100% !important;object-fit:cover !important;filter:contrast(1.03) saturate(1.02);display:block;}
.sm-card-imgw::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(10,8,5,.18) 0%,transparent 30%,transparent 55%,#14110a 98%);}
.sm-card-bd{padding:0 26px 28px;}
.sm-card-badge{display:inline-flex;align-items:center;gap:7px;font-size:.6rem;letter-spacing:2px;text-transform:uppercase;font-weight:800;padding:7px 14px;border-radius:100px;margin:-14px 0 18px;position:relative;z-index:2;}
.sm-badge-gold{background:linear-gradient(135deg,#d9b85c,#a9883a);color:#0a0805;}
.sm-badge-silver{background:rgba(190,190,195,.1);color:#c9c9ce;border:1px solid rgba(190,190,195,.25);}
.sm-badge-bronze{background:rgba(184,120,64,.1);color:#cf9868;border:1px solid rgba(184,120,64,.3);}
.sm-card-name{font-family:'Fraunces',Georgia,serif;font-weight:400;font-size:1.45rem;color:var(--smcream,#efe9dc);letter-spacing:-.01em;}
#sm-page .sm-card-why{font-size:.78rem;color:#b3a78f !important;font-weight:500;line-height:1.65;margin:10px 0 20px;} /* [PLAT] */
.sm-card-price{font-family:'Fraunces',Georgia,serif;font-size:1.65rem;color:var(--smgold2,#f0d880);letter-spacing:-.5px;}
#sm-page .sm-card-parcel{font-size:.72rem;color:#9d9077 !important;font-weight:500;margin:4px 0 20px;} /* [PLAT] */
#sm-page .sm-card-cta{display:block;text-align:center;background:linear-gradient(135deg,#d9b85c,#c8a84b 55%,#a9883a);color:#0a0805 !important;text-decoration:none !important;padding:14px;border-radius:100px;font-size:.84rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;transition:transform .25s,box-shadow .25s;} /* [PLAT] reset .ksl-like de <a> */
.sm-card-cta:hover{transform:translateY(-2px);box-shadow:0 8px 26px rgba(200,168,75,.3);}
.sm-res-restart{text-align:center;}
#sm-btn-restart{background:transparent;border:1px solid rgba(239,233,220,.18);color:#d8d2c6;border-radius:100px;padding:14px 36px;font-size:.85rem;font-weight:600;cursor:pointer;transition:border-color .25s,color .25s;touch-action:manipulation;}
#sm-btn-restart:hover{border-color:rgba(239,233,220,.4);color:var(--smcream,#efe9dc);}

/* ── responsivo ── */
@media(max-width:560px){
  /* === KS 31/07 — o hero media 100svh mas COMECA 127px abaixo do topo ===
     O cabecalho (107px) + o espaco antes da secao somam 127px, e o hero pedia
     100svh DEPOIS disso: ele sobrava 127px para fora da tela. Como o conteudo e
     centralizado verticalmente (align-items:center), esse excesso empurrava tudo
     para baixo — sobravam 147px de vazio acima do selo e os numeros (4,9 / 6 /
     3MM+) ficavam cortados no rodape, como nos prints do celular.
     Descontar os 127px resolve os dois de uma vez: o hero passa a terminar
     exatamente na borda inferior e a composicao inteira cabe na primeira tela.
     Os 127px sao estaveis (medidos identicos em 360, 393 e 430 de largura); se o
     cabecalho mudar de altura, e este o unico numero a ajustar.

     31/07 (2a rodada): descontar os 127px resolveu o hero sair da tela, mas em
     celular ALTO (430x932, iPhone Pro Max) ainda sobrava faixa preta morta: o hero
     ficava com 805px para um conteudo de ~504px, e a centralizacao jogava metade da
     folga (234px!) acima do selo e a outra metade abaixo da prova social. O teto de
     540px corta essa folga: a faixa cai de 234 para 101px e o vazio entre a prova
     social e a assinatura de 190 para 57px. Em tela menor o calc ja e menor que 540,
     entao nada muda la. Nao usar min-height:auto — testei: a assinatura, que e
     absoluta em bottom:26px, passa a SOBREPOR a prova social. */
  #sm-hero{min-height:min(calc(100svh - 127px), 540px);padding:calc(24px + 2vh) 20px 36px;}
  /* === KS 31/07 — CTA na PRIMEIRA TELA no mobile ===
     Clarity 29-31/07: /sleep-match tem a MAIOR taxa de volta imediata do site (26,9%,
     199 sessoes em 3 dias) — e o quiz e justamente a ferramenta de quem esta indeciso.
     Medido em 375x667: o botao INICIAR terminava em 656px, 11px da borda; no Safari do
     iPhone, com a barra de endereco, ele cai FORA da tela — o cliente ve titulo e logo,
     nenhuma acao, e volta. O hero empilhava badge + logo(118px, margens 34/30) + h1 +
     sub antes do CTA. O logo aqui e redundante: o cabecalho ja mostra a marca ~200px
     acima. Escondendo-o no mobile ganhamos ~123px e o CTA sobe para a primeira tela.
     Desktop fica intacto (la ha espaco e o logo compoe o ato de abertura).
     Para voltar o logo: trocar o display:none por width:72px. */
  #sm-page .sm-hero-logo{display:none !important;}
  .sm-badge{padding:7px 16px;letter-spacing:2.4px;}
  #sm-page .sm-hero-sub{margin:18px auto 0 !important;line-height:1.65;}
  .sm-cta{margin-top:26px;padding:17px 34px;}
  /* Os 3 numeros cabiam 2 + 1: com gap de 32px o terceiro ("3MM+ familias King
     Star", o mais largo) nao entrava e caia sozinho numa segunda linha, orfao.
     space-evenly distribui os tres pela largura toda sem gap fixo, e o rotulo
     menor com menos entreletra deixa "FAMILIAS KING STAR" em uma linha so.
     O flex-wrap da regra base fica de rede: numa tela absurdamente estreita
     ele volta a quebrar em vez de estourar na horizontal. */
  .sm-stats{gap:0;justify-content:space-evenly;margin-top:40px;}
  .sm-stat-n{font-size:1.7rem;}
  .sm-stat-l{letter-spacing:1.4px;font-size:.6rem;white-space:nowrap;}
  .sm-opts,.sm-opts.sm-c3,.sm-opts.sm-c4{grid-template-columns:repeat(2,1fr);}
  #sm-quiz-section{padding:60px 16px 22px;}
  /* 5 opções no mobile: LISTA compacta (ícone à esquerda) — cabe sem rolar */
  .sm-opts.sm-c5{display:flex;flex-direction:column;gap:9px;}
  .sm-opts.sm-c5 .sm-opt{display:grid;grid-template-columns:26px 1fr;column-gap:13px;align-items:center;text-align:left;padding:12px 40px 12px 16px;}
  .sm-opts.sm-c5 .sm-opt-ic{grid-row:1/3;margin:0;width:24px;height:24px;}
  .sm-opts.sm-c5 .sm-opt-lb{grid-column:2;font-size:.86rem;}
  .sm-opts.sm-c5 .sm-opt-ds{grid-column:2;margin-top:2px;}
  .sm-opts.sm-c5 .sm-opt-chk{top:50%;margin-top:-10px;right:12px;}
  .sm-card{flex-basis:100%;}
  #sm-cards{margin-bottom:56px;}
}
@media(max-width:350px){.sm-opts,.sm-opts.sm-c3,.sm-opts.sm-c4{grid-template-columns:1fr;}}
/* telas baixas: compacta o palco (rolagem do overlay fica de rede de segurança) */
@media(max-height:790px){
  #sm-quiz-section{padding-top:56px;padding-bottom:22px;}
  .sm-constel{width:min(430px,78vw);margin-bottom:2px;}
  #sm-quiz-section .sm-qz-label{margin-bottom:18px;}
  #sm-quiz-section .sm-q-sub{margin:10px 0 20px;}
  .sm-opt{padding:14px 12px 12px;}
  .sm-opt-ic{width:23px;height:23px;margin-bottom:7px;}
  .sm-opt-lb{font-size:.82rem;}
  #sm-quiz-section .sm-opt-ds{font-size:.66rem;}
  .sm-nav{margin-top:22px;}
  .sm-q-title{font-size:clamp(1.4rem,3.6vw,2.1rem);}
}
/* === KS 31/07 — o mesmo problema do mobile existe no NOTEBOOK ===
   Depois de resolver o mobile, medi 1366x650 (1366x768 e a resolucao de tela mais
   comum, e a barra do navegador come ~100px dela): o botao INICIAR terminava em
   727px, ou seja 76px FORA da tela — identico ao caso do iPhone. O bloco
   max-height:790px acima so compactava o quiz; o hero ficava com o espacamento
   de tela cheia.
   Aqui a query e por ALTURA, nao por largura, porque o que falta e espaco vertical
   (um monitor 1920x1080 nao precisa disso). O min-width:561px isola do bloco mobile
   para nao sobrescrever o que ja foi ajustado la.
   Ganho medido: 131px (padding do hero 57 + logo menor e mais justo 50 + CTA 16 +
   subtitulo 8), o botao sobe para ~596px. O h1 fica intacto de proposito: e a tese
   da pagina. O logo AQUI permanece (so encolhe) porque no desktop ele compoe a
   abertura e ha espaco para ele. */
@media(min-width:561px) and (max-height:760px){
  #sm-hero{padding:calc(32px + 1.5vh) 24px 36px;}
  #sm-page .sm-hero-logo{width:78px;margin:14px auto 12px !important;}
  #sm-page .sm-hero-sub{margin:18px auto 0 !important;}
  .sm-cta{margin-top:24px;}
  .sm-stats{margin-top:44px;}
}
/* Segundo degrau, so para janela realmente apertada (<=610px de altura util:
   notebook com barra de favoritos + barra de tarefas, ou janela nao maximizada).
   O limiar e 610 e nao 660 de proposito: um 1366x768 tipico entrega entre 607 e
   681px de altura util, e nessa faixa o logo AINDA cabe pelo degrau de cima —
   nao vale tirar a marca de quem tem espaco. Abaixo disso o logo sai, pelo mesmo
   motivo do mobile: o cabecalho ja carrega a marca a poucos pixels acima. */
@media(min-width:561px) and (max-height:610px){
  #sm-hero{padding:calc(24px + 1vh) 24px 30px;}
  #sm-page .sm-hero-logo{display:none !important;}
  .sm-cta{margin-top:20px;}
}
/* acessibilidade de movimento */
@media (prefers-reduced-motion: reduce){
  .sm-cta{animation:none;}
  #sm-page *,#sm-quiz-section *,#sm-calc *{transition-duration:.01ms !important;animation-duration:.01ms !important;}
}

/* ═══════════════════════════════════════════════════════════════════════════
   v13 (16/07/2026) — CARD RICO + auto-avanço.
   Bloco ADITIVO: vence por ordem, não reescreve nada da v11/v12.
   Mesma linguagem visual (dark + gold, Fraunces, pílulas) — só ganha campos.
   ═══════════════════════════════════════════════════════════════════════════ */

/* 4 cards (era 3) — 4×328 + 3×22 = 1378 */
#sm-cards{max-width:1400px;align-items:stretch;}
/* card vira coluna p/ os botões colarem no rodapé, alinhados entre cards */
.sm-card{display:flex;flex-direction:column;}
.sm-card-bd{display:flex;flex-direction:column;flex:1 1 auto;}

/* nav só com Voltar (escolher já avança) */
.sm-nav-solo{justify-content:center;max-width:280px;margin-left:auto;margin-right:auto;}

/* badges do catálogo do Ahmed (tags: Airbnb/idoso/criança/hotel/praia/visita) */
.sm-tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;}
.sm-tag{font-size:.61rem;font-weight:700;letter-spacing:.2px;padding:4px 9px;border-radius:100px;border:1px solid;white-space:nowrap;line-height:1.5;}
.sm-tag-airbnb{background:rgba(214,120,110,.1);border-color:rgba(214,120,110,.3);color:#e0938a;}
.sm-tag-hotel {background:rgba(200,168,75,.1);border-color:rgba(200,168,75,.32);color:#d9b85c;}
.sm-tag-kids  {background:rgba(120,180,140,.1);border-color:rgba(120,180,140,.3);color:#8fc9a4;}
.sm-tag-elder {background:rgba(120,150,200,.1);border-color:rgba(120,150,200,.3);color:#96b0d9;}
.sm-tag-beach {background:rgba(110,180,190,.1);border-color:rgba(110,180,190,.3);color:#84c3cc;}
.sm-tag-guest {background:rgba(160,130,190,.1);border-color:rgba(160,130,190,.3);color:#b39bd0;}

/* blocos de argumento: "Perfeito para você porque" / "O que você ganha a mais" */
.sm-blk{margin:16px 0 0;padding:13px 15px;border-radius:12px;background:rgba(200,168,75,.045);border:1px solid rgba(200,168,75,.1);}
.sm-blk-up{background:rgba(120,180,140,.05);border-color:rgba(120,180,140,.16);}
.sm-blk-h{font-size:.61rem;letter-spacing:1.3px;text-transform:uppercase;font-weight:800;color:var(--smgold,#c8a84b);margin-bottom:8px;}
.sm-blk-up .sm-blk-h{color:#8fc9a4;}
.sm-blk-l{list-style:none;margin:0;padding:0;}
.sm-blk-l li{position:relative;padding-left:17px;font-size:.74rem;line-height:1.5;color:#c2b69c !important;margin-bottom:5px;}
.sm-blk-l li:last-child{margin-bottom:0;}
.sm-blk-l li::before{content:'✓';position:absolute;left:0;top:0;color:var(--smgold,#c8a84b);font-weight:700;font-size:.72rem;}
.sm-blk-up .sm-blk-l li::before{content:'+';color:#8fc9a4;}

/* tamanho escolhido + altura */
.sm-card-szl{font-size:.67rem;color:#8a7f68 !important;letter-spacing:.3px;margin:18px 0 10px;font-weight:600;}

/* De → por + % OFF + custo/noite */
.sm-card-de{font-size:.71rem;color:#8a7f68 !important;margin:0 0 3px;}
.sm-card-de s{opacity:.75;}
.sm-card-off{display:inline-block;background:rgba(120,180,140,.14);color:#8fc9a4;border:1px solid rgba(120,180,140,.3);border-radius:100px;padding:2px 8px;font-size:.6rem;font-weight:800;margin-left:6px;letter-spacing:.3px;}
.sm-card-parcel{margin:4px 0 0 !important;}
.sm-card-night{font-size:.69rem;color:var(--smgold,#c8a84b) !important;margin:9px 0 0;font-weight:600;}
.sm-hide{display:none !important;}

/* 2 botões: comprar direto (primário) + ver produto (secundário) */
.sm-card-btns{display:flex;flex-direction:column;gap:9px;margin-top:auto;padding-top:18px;}
.sm-card-buy{border:none;width:100%;cursor:pointer;font-family:inherit;}
.sm-card-buy:disabled{opacity:.62;cursor:default;transform:none;}
.sm-card-alt{display:block;text-align:center;padding:11px;border-radius:100px;font-size:.74rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--smgold,#c8a84b) !important;text-decoration:none !important;border:1px solid rgba(200,168,75,.3);transition:border-color .25s,background .25s;}
.sm-card-alt:hover{border-color:rgba(200,168,75,.6);background:rgba(200,168,75,.06);}

/* chips: noites de teste · garantia · frete · instalação · elevador */
.sm-chips{display:flex;flex-wrap:wrap;gap:7px 12px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(200,168,75,.1);}
.sm-chip{display:inline-flex;align-items:center;gap:5px;font-size:.62rem;color:#9d9077 !important;font-weight:600;}
.sm-chip svg{width:11px;height:11px;flex:0 0 11px;fill:none;stroke:var(--smgold,#c8a84b);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.85;}

/* nota honesta quando o filtro precisou relaxar */
.sm-res-note{flex-basis:100%;text-align:center;font-size:.73rem;color:#8a7f68 !important;margin:4px 0 0;font-style:italic;}

@media(max-width:560px){
  .sm-blk{padding:11px 13px;}
  .sm-tag{font-size:.58rem;}
}

/* prova social REAL (share de venda por perfil — GA4 90d; ver sleep-match.js) */
.sm-social{display:flex;flex-direction:column;gap:2px;margin:12px 0 0;padding:9px 12px;border-radius:10px;background:linear-gradient(135deg,rgba(200,168,75,.13),rgba(200,168,75,.05));border:1px solid rgba(200,168,75,.26);}
.sm-social b{font-size:.74rem;font-weight:800;color:var(--smgold2,#f0d880) !important;letter-spacing:.1px;line-height:1.35;}
.sm-social span{font-size:.58rem;color:#8a7f68 !important;letter-spacing:.5px;text-transform:uppercase;font-weight:600;}

/* ═══ 02/08/2026: trilha de travesseiro + joias do resultado (recap, comparativo, descarte, upsell) ═══ */
.sm-prof{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:16px auto 0;max-width:680px;}
.sm-prof-t{color:#8a7a5c;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;}
.sm-prof-chip{border:1px solid rgba(200,168,75,.35);background:rgba(200,168,75,.07);color:#e7dfc8;border-radius:50px;padding:5px 13px;font-size:.8rem;font-weight:600;}
.sm-compare{flex:0 0 100%;width:100%;max-width:720px;margin:10px auto 0;background:rgba(20,16,10,.88);border:1px solid rgba(200,168,75,.3);border-radius:16px;padding:22px 24px;text-align:center;box-sizing:border-box;}
.sm-compare-h{color:#c8a84b;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;margin-bottom:14px;}
.sm-compare-l{display:flex;flex-direction:column;gap:12px;color:#f3ecd9;font-size:.95rem;}
.sm-compare-l b{color:#f0d880;}
.sm-compare-l span{display:block;color:rgba(243,236,217,.55);font-size:.8rem;margin-top:2px;}
.sm-discard{flex:0 0 100%;width:100%;max-width:720px;margin:8px auto 0;border:1px solid rgba(255,120,120,.18);background:rgba(255,90,90,.05);border-radius:14px;padding:16px 20px;text-align:center;box-sizing:border-box;}
.sm-discard-h{color:rgba(243,236,217,.5);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-bottom:6px;}
.sm-discard-b{color:rgba(243,236,217,.75);font-size:.86rem;line-height:1.55;}
.sm-up-note{display:block;color:#9a8a5e;font-weight:600;font-size:.72rem;margin-top:3px;letter-spacing:.02em;text-transform:none;}