/* Ferramentas grátis (quiz de estilo + calculadora de orçamento). Vai por cima do assets/lp.css. */
:root{--r:22px;--sh:0 30px 60px -32px rgba(16,40,70,.5)}
.lbar nav{display:flex;align-items:center;gap:6px}
.lbar nav a.tlink{font-size:14px;font-weight:600;color:var(--marinho);text-decoration:none;padding:9px 12px;border-radius:99px}
.lbar nav a.tlink:hover,.lbar nav a.tlink[aria-current]{background:rgba(16,73,127,.08)}
.nb{white-space:nowrap}

/* primeira tela */
.sec:has(> .wrap > .quiz[hidden]){display:none}
.thero{padding:clamp(28px,5vw,64px) 0 clamp(40px,6vw,80px);overflow:hidden}
.thero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,64px);align-items:center}
.thero__grid > *{min-width:0}
.thero .h1{font-size:clamp(42px,6.4vw,84px)}
.thero .ctas{margin-top:28px}
.thero__head > *{animation:lpUp .9s cubic-bezier(.2,.8,.2,1) both}
.thero__head > :nth-child(2){animation-delay:.1s}.thero__head > :nth-child(3){animation-delay:.25s}.thero__head > :nth-child(4){animation-delay:.4s}.thero__head > :nth-child(5){animation-delay:.6s}
.thero .h1 em{display:inline-block;background:linear-gradient(transparent 78%,rgba(255,226,105,.75) 78%) no-repeat 0 0/0% 100%;animation:lpMark 1s .9s ease-out forwards}
.meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.meta span{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--linha);border-radius:99px;padding:7px 13px 7px 9px;font-size:14px;font-weight:600;color:var(--marinho)}
.meta span i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--limao);font-style:normal;font-size:11px}

/* leque de fotos da primeira tela */
.fan{position:relative;height:clamp(320px,36vw,470px)}
.fan figure{position:absolute;left:50%;top:50%;width:min(300px,56%);aspect-ratio:4/5;border-radius:20px;overflow:hidden;box-shadow:var(--sh);background:#ddd;transform:translate(-50%,-50%) rotate(var(--r0)) translateX(var(--x0));animation:fanIn 1.1s cubic-bezier(.2,.8,.2,1) both,fanFloat 7s ease-in-out infinite alternate;animation-delay:var(--d),calc(var(--d) + 1.1s)}
.fan figure img{width:100%;height:100%;object-fit:cover}
.fan figure figcaption{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);color:var(--marinho);border-radius:99px;padding:6px 12px;font-size:13px;font-weight:600}
@keyframes fanIn{from{opacity:0;transform:translate(-50%,-30%) rotate(0) translateX(0) scale(.85)}}
@keyframes fanFloat{to{transform:translate(-50%,-52%) rotate(calc(var(--r0) * 1.15)) translateX(var(--x0))}}
.fan .sw{position:absolute;right:4%;bottom:6%;display:flex;gap:6px;background:#fff;border-radius:99px;padding:8px 10px;box-shadow:var(--sh);animation:lpPop .7s 1.2s cubic-bezier(.2,.9,.3,1.2) both;z-index:5}
.fan .sw i{width:22px;height:22px;border-radius:50%;background:var(--c)}

/* palco do quiz */
.quiz{background:#fff;border:1px solid var(--linha);border-radius:28px;box-shadow:var(--sh);padding:clamp(18px,3vw,36px);position:relative}
.qtop{display:flex;align-items:center;justify-content:space-between;gap:12px}
.qback{border:0;background:none;color:var(--marinho);font-weight:600;cursor:pointer;padding:8px 4px;font-size:15px}
.qback[disabled]{opacity:.3;cursor:default}
.qcount{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);font-weight:600}
.qbar{height:4px;border-radius:99px;background:rgba(16,73,127,.1);margin-top:10px;overflow:hidden}
.qbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--toranja),var(--tomate));border-radius:99px;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.qtitle{font:400 clamp(30px,4vw,48px)/1.04 var(--serif);color:var(--marinho);margin-top:18px;text-wrap:balance}
.qsub{color:var(--soft);font-size:15.5px;margin-top:6px}
.opts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}
.opts--3{grid-template-columns:repeat(3,1fr)}
.opts--5{grid-template-columns:repeat(5,1fr)}
.opt{position:relative;display:flex;flex-direction:column;border:0;padding:0;background:var(--off);border-radius:18px;overflow:hidden;cursor:pointer;text-align:left;box-shadow:0 0 0 1px var(--linha);transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .2s;animation:optIn .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 55ms)}
@keyframes optIn{from{opacity:0;transform:translateY(16px) scale(.97)}}
.opt:hover{transform:translateY(-3px);box-shadow:0 0 0 1.5px var(--marinho),0 16px 30px -18px rgba(16,40,70,.45)}
.opt:focus-visible{outline:3px solid var(--toranja);outline-offset:2px}
.opt.is-on{box-shadow:0 0 0 3px var(--marinho),0 16px 30px -18px rgba(16,40,70,.45);transform:scale(.98)}
.opt.is-on::after{content:"✓";position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:var(--marinho);color:#fff;display:grid;place-items:center;font-weight:800;font-size:14px;animation:lpPop .4s both}
.opt__img{aspect-ratio:7/5;background:#ddd center/cover;position:relative}
.opt__img img{width:100%;height:100%;object-fit:cover}
.opt__art{aspect-ratio:7/5;display:grid;place-items:center;background:var(--bg,var(--papel));font-size:clamp(34px,4vw,46px);line-height:1}
.opt__art svg{height:78%;width:auto}
.opt b{display:block;padding:10px 12px 2px;font-size:15px;font-weight:600;color:var(--marinho);line-height:1.2}
.opt small{display:block;padding:0 12px 11px;font-size:12.5px;color:var(--soft);line-height:1.3}
.opt b:last-child{padding-bottom:12px}
.pal{display:flex;height:64px}
.pal i{flex:1;background:var(--c)}
.dots{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;align-content:center;width:72%;height:70%}
.dots i{width:9px;height:9px;border-radius:50%;background:var(--marinho);opacity:.85}
.money{font:400 clamp(30px,3.6vw,42px)/1 var(--serif);color:var(--marinho);display:flex;align-items:flex-end;gap:3px}
.money s{text-decoration:none;opacity:.25}

/* resultado */
.res{display:grid;gap:clamp(18px,3vw,28px)}
.res__top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,36px);align-items:center}
.res__top > *{min-width:0}
.res__img{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#ddd;box-shadow:var(--sh);animation:resImg 1.2s cubic-bezier(.2,.8,.2,1) both}
.res__img img{width:100%;height:100%;object-fit:cover}
@keyframes resImg{from{clip-path:inset(12% 12% 12% 12% round 22px);transform:scale(1.04)}to{clip-path:inset(0 0 0 0 round 22px)}}
.res__k{font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--toranja);font-weight:600}
.res__name{font:400 clamp(44px,6vw,78px)/.98 var(--serif);color:var(--marinho);margin-top:8px;text-wrap:balance}
.res__name em{font-style:italic;color:var(--tomate)}
.res__desc{color:var(--soft);font-size:17px;margin-top:14px}
.also{margin-top:16px;font-size:14.5px;color:var(--soft)}
.also button{white-space:nowrap;border:0;background:var(--off);border-radius:99px;padding:6px 12px;margin:4px 4px 0 0;font-weight:600;color:var(--marinho);cursor:pointer;font-size:14px}
.res__top .res__k,.res__top .res__name,.res__top .res__desc,.res__top .also{animation:lpUp .9s cubic-bezier(.2,.8,.2,1) both}
.res__top .res__name{animation-delay:.12s}.res__top .res__desc{animation-delay:.25s}.res__top .also{animation-delay:.4s}
.box{background:var(--off);border-radius:22px;padding:clamp(18px,3vw,28px)}
.box h3{font:400 clamp(26px,3vw,34px)/1.05 var(--serif);color:var(--marinho)}
.box > p.sub{color:var(--soft);font-size:15px;margin-top:4px}
.swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:16px}
.swatch{border:0;background:#fff;border-radius:16px;padding:0 0 10px;cursor:pointer;overflow:hidden;box-shadow:0 0 0 1px var(--linha);text-align:center;animation:lpPop .6s cubic-bezier(.2,.9,.3,1.2) both;animation-delay:calc(.3s + var(--i) * 90ms)}
.swatch i{display:block;aspect-ratio:16/10;background:var(--c)}
.swatch b{display:block;font-size:13.5px;color:var(--marinho);margin-top:8px;padding:0 4px;line-height:1.2}
.swatch code{display:block;font:600 12.5px/1.4 ui-monospace,Menlo,monospace;color:var(--soft);margin-top:2px}
.swatch.copied code{color:#1e7a3a}
@media (max-width:560px){
  .swatches{grid-template-columns:1fr;gap:6px}
  .swatch{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:12px;padding:0 14px 0 0;text-align:left;border-radius:14px}
  .swatch i{aspect-ratio:auto;height:46px}
  .swatch b{margin:0;font-size:15px;padding:0}
  .swatch code{margin:0;font-size:13px}
}
.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px;list-style:none;counter-reset:t}
.tips li{background:#fff;border-radius:18px;padding:18px;font-size:15.5px;color:var(--ink);counter-increment:t;position:relative}
.tips li::before{content:counter(t);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--limao);color:var(--marinho);font:400 20px var(--serif);margin-bottom:10px}
.rec{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(16px,3vw,32px);align-items:center;background:var(--marinho);color:#fff;border-radius:24px;padding:clamp(18px,3vw,30px)}
.rec > *{min-width:0}
.rec .res__k{color:var(--limao)}
.rec h3{font:400 clamp(30px,3.6vw,44px)/1.02 var(--serif);margin-top:6px;color:#fff}
.rec p{color:rgba(246,241,233,.84);margin-top:8px;font-size:15.5px}
.rec__pv{position:relative;border:0;padding:0;border-radius:18px;overflow:hidden;aspect-ratio:1200/630;cursor:pointer;background:#123;box-shadow:0 24px 50px -20px rgba(0,0,0,.6)}
.rec__pv img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.rec__pv:hover img{transform:scale(1.04)}
.rec__pv span{position:absolute;right:10px;bottom:10px;background:var(--limao);color:var(--marinho);border-radius:99px;padding:8px 14px;font-weight:700;font-size:14px}
.rec .ctas{margin-top:18px}
.rec .link{color:#fff}
.share{display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,3vw,28px);align-items:center}
.share__pv{width:150px;aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:#ddd;box-shadow:var(--sh)}
.share__pv canvas,.share__pv img{width:100%;height:100%;display:block}
.again{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;align-items:center}

/* captura opcional (depois do resultado) */
.lead{background:#fff;border:1.5px dashed rgba(16,73,127,.28);border-radius:24px;padding:clamp(18px,3vw,30px);display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(16px,3vw,36px);align-items:center}
.lead > *{min-width:0}
.lead h3{font:400 clamp(28px,3.4vw,40px)/1.04 var(--serif);color:var(--marinho)}
.lead p.sub{color:var(--soft);font-size:15.5px;margin-top:8px}
.lead form{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.lead .fld{margin-top:10px}
.lead .fld--full{grid-column:1/-1}
.lead .fld input{width:100%;font-size:16px;padding:13px 14px}
.lead .fld small{font-weight:400;color:var(--soft)}
.chk{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:13.5px;color:var(--soft);cursor:pointer;line-height:1.4}
.chk input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--marinho)}
.chk.is-bad{color:var(--tomate)}
.lead .btn{grid-column:1/-1;margin-top:14px;width:100%}
.lead .err{grid-column:1/-1;color:var(--tomate);font-size:14px;margin-top:10px}
.lead .err:empty{display:none}
.lead input.is-bad{border-color:var(--tomate)}
.lead .ok{grid-column:1/-1;text-align:left;padding:0}

/* conteúdo útil (SEO) */
.prose{max-width:780px;margin:0 auto}
.prose h2{font:400 clamp(32px,4vw,48px)/1.04 var(--serif);color:var(--marinho);margin-top:10px}
.prose h3{font:400 26px/1.1 var(--serif);color:var(--marinho);margin-top:26px}
.prose p,.prose li{color:var(--soft);font-size:16.5px;margin-top:12px}
.prose ul{padding-left:20px}
.styles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}
.stc{text-decoration:none;color:inherit;transition:transform .3s,box-shadow .3s;display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--linha);border-radius:18px;padding:14px;text-align:left}
.stc:hover{transform:translateY(-3px);box-shadow:0 16px 30px -20px rgba(16,40,70,.45)}
.stc .mini{display:grid;grid-template-columns:repeat(5,1fr);width:58px;height:58px;border-radius:12px;overflow:hidden;flex:none}
.stc .mini i{background:var(--c)}
.stc b{display:block;font:400 22px/1.1 var(--serif);color:var(--marinho)}
.stc p{font-size:14px;color:var(--soft);margin-top:4px;line-height:1.4}
.toolx{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;background:var(--limao);border-radius:24px;padding:clamp(20px,3vw,32px);color:var(--marinho)}
.toolx h3{font:400 clamp(28px,3.4vw,40px)/1.05 var(--serif)}
.toolx p{margin-top:6px}

.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--ink);color:#fff;border-radius:99px;padding:10px 18px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:.3s;z-index:90}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){.fan figure,.opt,.swatch,.res__img,.res__top *,.thero__head > *{animation:none!important}.thero .h1 em{background-size:100% 100%}}

@media (max-width:980px){.opts,.opts--5{grid-template-columns:repeat(3,1fr)}.styles{grid-template-columns:1fr 1fr}}
@media (max-width:860px){
  .thero__grid,.res__top,.rec,.lead,.share{grid-template-columns:1fr}
  .thero{padding-top:18px}
  .thero__head{text-align:center}
  .thero .h1{font-size:clamp(38px,10.4vw,52px)}
  .meta{justify-content:center}
  .fan{height:250px;margin-top:4px}
  .fan figure{width:42vw;max-width:210px}
  .fan figure:not(:last-of-type) figcaption{display:none}
  .lbar nav a.tlink{display:none}
  .opts,.opts--3,.opts--5{grid-template-columns:1fr 1fr;gap:10px}
  .quiz{border-radius:22px;padding:16px 14px 18px}
  .qtitle{font-size:clamp(28px,8vw,36px);margin-top:12px;text-align:center}
  .qsub{text-align:center}
  .opt b{font-size:14.5px;padding:9px 10px 2px}
  .opt small{padding:0 10px 10px}
  .res__top{text-align:center}
  .res__img{order:-1;aspect-ratio:16/10}
  .swatch{border-radius:12px}
  .tips{grid-template-columns:1fr}
  .box,.box h3,.box > p.sub{text-align:center}
  .tips li{text-align:left}
  .rec{text-align:center}
  .rec__pv{order:-1}
  .share{justify-items:center;text-align:center}
  .share .ctas{justify-content:center}
  .lead{text-align:center}
  .lead form{grid-template-columns:1fr;text-align:left}
  .styles{grid-template-columns:1fr}
  .toolx{grid-template-columns:1fr;text-align:center}
  .toolx .btn{justify-self:center}
}
@media (max-width:380px){.opt b{font-size:13.5px}}

/* ===== calculadora ===== */
.thero--calc{padding-bottom:clamp(24px,4vw,44px)}
.thero--calc .lede{margin-inline:auto}
.calcg{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(18px,3vw,32px);align-items:start}
.calcg > *{min-width:0}
.cin{background:#fff;border:1px solid var(--linha);border-radius:26px;padding:clamp(18px,3vw,30px);box-shadow:var(--sh);position:sticky;top:76px;animation:lpUp .9s .2s cubic-bezier(.2,.8,.2,1) both}
.cin__blk + .cin__blk{margin-top:22px;padding-top:20px;border-top:1px solid var(--linha)}
.cin label,.cin .lbl{display:block;font-weight:600;color:var(--marinho);font-size:15px}
.cin__row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.stepper{display:inline-flex;align-items:center;gap:6px}
.stepper button{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--linha);background:var(--off);color:var(--marinho);font-size:20px;cursor:pointer;line-height:1}
.stepper button:hover{border-color:var(--marinho)}
.stepper output{min-width:64px;text-align:center;font:400 40px/1 var(--serif);color:var(--marinho)}
.cin input[type=range]{width:100%;accent-color:var(--marinho);margin-top:10px;height:28px}
.cin__scale{display:flex;justify-content:space-between;font-size:12px;color:var(--soft)}
.cin__txt{display:block;width:100%;box-sizing:border-box;margin-top:8px}
.cin__hint{margin:8px 0 0;font-size:13px;color:var(--soft)}
.opc{font-weight:400;color:var(--soft);font-size:.86em}
.cin select,.cin__txt{font:inherit;font-size:16px;color:var(--ink);border:1.5px solid var(--linha);border-radius:14px;padding:12px 14px;background:var(--off);min-width:0}
.segs{display:inline-flex;background:var(--off);border-radius:14px;padding:4px;gap:4px}
.segs button{border:0;background:none;border-radius:10px;padding:7px 12px;font-weight:600;color:var(--soft);cursor:pointer;text-align:center;line-height:1.15;font-size:14.5px}
.segs button small{display:block;font-weight:400;font-size:11.5px;max-width:104px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.segs button[aria-pressed=true]{background:#fff;color:var(--marinho);box-shadow:0 2px 8px -3px rgba(16,40,70,.35)}
.estilos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.seg{border:1.5px solid var(--linha);background:var(--off);border-radius:16px;padding:12px;text-align:left;cursor:pointer;transition:transform .25s,border-color .2s}
.seg:hover{transform:translateY(-2px)}
.seg b{display:block;color:var(--marinho);font-size:15px}
.seg small{display:block;color:var(--soft);font-size:12.5px;line-height:1.3;margin-top:4px}
.seg[aria-pressed=true]{border-color:var(--marinho);background:var(--marinho)}
.seg[aria-pressed=true] b{color:#fff}.seg[aria-pressed=true] small{color:rgba(255,255,255,.8)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--linha);border-radius:99px;padding:8px 13px;font-size:14px;font-weight:600;color:var(--soft);transition:.2s}
.chip span::before{content:"+";font-weight:800}
.chip input:checked + span{background:var(--marinho);border-color:var(--marinho);color:#fff}
.chip input:checked + span::before{content:"✓";color:var(--limao)}
.chip input:focus-visible + span{outline:3px solid var(--toranja);outline-offset:2px}
.cout{display:grid;gap:16px}
.total{background:var(--marinho);color:#fff;border-radius:26px;padding:clamp(20px,3vw,32px);box-shadow:var(--sh);animation:lpUp .9s .35s cubic-bezier(.2,.8,.2,1) both}
.total .eb{color:var(--limao)}
.total__v{font:400 clamp(38px,5.4vw,64px)/1.14 var(--serif);margin-top:8px}
.total__v span{white-space:nowrap}
.total__v i{font-style:italic;color:rgba(255,255,255,.6);font-size:.6em}
.total__ctx{color:rgba(246,241,233,.8);font-size:15px;margin-top:8px}
.total__kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.total__kpis div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:12px 14px}
.total__kpis small{display:block;font-size:12.5px;color:rgba(246,241,233,.75)}
.total__kpis b{font:400 28px/1.15 var(--serif)}
.total .ctas{margin-top:18px}
.total__note{font-size:13px;color:rgba(246,241,233,.7);margin-top:12px}
.total__note a{color:#fff}
.bars{list-style:none;display:grid;gap:14px;margin-top:16px}
.bar__h{display:flex;justify-content:space-between;gap:10px;font-size:14.5px;color:var(--ink)}
.bar__h span{font-weight:600;color:var(--marinho)}
.bar__h b{font-weight:600;white-space:nowrap}
.bar{position:relative;height:12px;border-radius:99px;background:rgba(16,73,127,.08);margin-top:6px;overflow:hidden}
.bar i{position:absolute;top:0;bottom:0;border-radius:99px;transition:left .6s cubic-bezier(.2,.8,.2,1),width .6s cubic-bezier(.2,.8,.2,1)}
.bar__fill{left:0;background:var(--marinho)}
.bar__rng{background:linear-gradient(90deg,var(--toranja),var(--limao))}
.bars small{display:block;font-size:12.5px;color:var(--soft);margin-top:4px}
.bars .empty{color:var(--soft);font-size:15px}
.calc2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,28px);align-items:start}
.calc2 > *{min-width:0}
.calc2 .lead{grid-column:1/-1}
.box--w{background:#fff;border:1px solid var(--linha)}
.box--w h3{margin-top:8px}
.tips--list{grid-template-columns:1fr}
.tips--list li{background:var(--off);font-size:15px}
.tips--list li b{color:var(--marinho)}
.gift{background:var(--marinho);color:#fff;border-radius:22px;padding:clamp(18px,3vw,28px)}
.gift h3{font:400 clamp(28px,3.2vw,38px)/1.05 var(--serif);margin-top:8px}
.gift > p{color:rgba(246,241,233,.85);margin-top:10px;font-size:15.5px}
.gift > p b{color:var(--limao)}
.gift .calc__row{color:#fff;margin-top:18px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-weight:600}
.gift .calc__row output{font:400 28px var(--serif)}
.gift input[type=range]{width:100%;accent-color:var(--limao);margin-top:8px}
.gift__s{font-size:12.5px;color:rgba(246,241,233,.7);margin-top:4px}
.gift__r{background:var(--limao);color:var(--marinho);border-radius:16px;padding:14px 16px;margin-top:16px}
.gift__r small{display:block;font-size:13px}
.gift__r b{display:block;font:400 40px/1.1 var(--serif);color:var(--tomate)}
.tblw{overflow-x:auto;margin-top:22px;border-radius:16px;border:1px solid var(--linha);background:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:520px}
.tbl th,.tbl td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--linha);white-space:nowrap}
.tbl th{color:var(--marinho);background:var(--papel)}
.tbl td:first-child{font-weight:600;color:var(--marinho);white-space:normal}
.tbl tr:last-child td{border-bottom:0}
.tbl__n{font-size:13.5px!important}
.fontes{padding-left:22px}
.fontes li{font-size:15px!important;margin-top:8px!important}
.fontes a{color:var(--marinho);font-weight:600}
@media (max-width:860px){
  .calcg,.calc2{grid-template-columns:1fr}
  .cin{position:static}
  .thero--calc{padding-top:22px}
  .estilos{grid-template-columns:1fr}
  .seg{display:flex;align-items:baseline;gap:10px}
  .seg small{margin-top:0}
  .cin__loc{grid-template-columns:1fr}
  .segs{display:grid;grid-template-columns:1fr 1fr}
  .segs button small{max-width:none}
  .total{text-align:center}
  .total .ctas{justify-content:center}
  .gift{text-align:center}
  .gift .ctas{justify-content:center}
  .box--w{text-align:center}
  .tips--list li{text-align:left}
  .chips{justify-content:flex-start}
}
@media (max-width:400px){.total__kpis b{font-size:24px}.bar__h{font-size:13.5px}}

.prose:not(.center),.prose:not(.center) h2{text-align:left}

/* ===== bloqueio do resultado (quiz e calculadora) ===== */
.lock{position:relative}
.res--locked{pointer-events:none;user-select:none}
.res--locked .res__img,.res--locked .res__desc,.res--locked > .box{filter:blur(9px);opacity:.6}
.res--locked .res__img{animation:none}
.res--locked .res__name{-webkit-mask-image:linear-gradient(90deg,#000 30%,rgba(0,0,0,.08) 72%);mask-image:linear-gradient(90deg,#000 30%,rgba(0,0,0,.08) 72%)}
.gate{position:absolute;left:0;right:0;margin-inline:auto;top:var(--gt,140px);width:min(560px,100%);background:#fff;border-radius:26px;padding:clamp(20px,3vw,32px);box-shadow:0 40px 90px -30px rgba(16,40,70,.55),0 0 0 1px var(--linha);z-index:5;animation:lpUp .8s cubic-bezier(.2,.8,.2,1) both;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.gate > h3,.gate > .sub,.gate > .fld--full,.gate > .chk,.gate > .err,.gate > .btn,.gate > .note{grid-column:1/-1}
.gate .fld small{font-weight:400;color:var(--soft);font-size:12.5px}
.gate h3{font:400 clamp(30px,3.6vw,40px)/1.04 var(--serif);color:var(--marinho);text-wrap:balance}
.gate .sub{color:var(--soft);font-size:15.5px;margin-top:8px}
.gate .fld{margin-top:12px}
.gate .fld input,.gate .fld select{width:100%;font-size:16px;padding:13px 14px}
.gate .fld select{font:inherit;font-size:16px;color:var(--ink);border:1.5px solid var(--linha);border-radius:14px;background:var(--off);margin-top:6px}
.gate select.is-bad{border-color:var(--tomate)}
.gate .fld input:disabled{opacity:.45}
.gate .chk--sm{grid-column:1;margin-top:8px;align-self:start;font-size:14px;font-weight:600;color:var(--marinho);padding-top:0}  /* "Ainda não definimos" logo abaixo da data */
.gate .fld--data{grid-column:1}
.gate .btn{width:100%;margin-top:16px}
.gate .note{font-size:12.5px;color:var(--soft);margin-top:10px;text-align:center}
.gate .err{color:var(--tomate);font-size:14px;margin-top:10px}
.gate .err:empty{display:none}
.gate input.is-bad{border-color:var(--tomate)}
.chk{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:13px;color:var(--soft);cursor:pointer;line-height:1.4}
.chk input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--marinho)}
.chk.is-bad{color:var(--tomate)}

/* save the date */
.stdb{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,36px);align-items:center;background:var(--papel);border:1px solid var(--linha);border-radius:24px;padding:clamp(18px,3vw,30px)}
.stdb > *{min-width:0}
.stdb__pv{width:250px;aspect-ratio:9/16;border-radius:16px;overflow:hidden;box-shadow:var(--sh);background:#ddd;animation:lpUp 1s .2s cubic-bezier(.2,.8,.2,1) both}
.stdb__pv canvas{width:100%;height:100%;display:block}
.stdb h3{font:400 clamp(30px,3.6vw,44px)/1.04 var(--serif);color:var(--marinho)}
.stdb .sub{color:var(--soft);font-size:15.5px;margin-top:8px}
.stdb__data{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-top:14px}
.stdb__data .fld{margin:0}
.stdb__data input{font-size:16px;padding:11px 12px}
.stdb .ctas{margin-top:18px}
.stdb__link{margin-top:12px;font-size:14px;color:var(--soft)}
@media (max-width:860px){
  .gate{grid-template-columns:1fr;text-align:left}
  .gate h3,.gate .sub{text-align:center}
  .gate .chk--sm,.gate .fld--data{grid-column:1}
  .stdb{grid-template-columns:1fr;justify-items:center;text-align:center}
  .stdb__pv{width:min(250px,68vw)}
  .stdb .ctas,.stdb__data{justify-content:center}
}

/* calculadora bloqueada + acordeão das fontes */
.cout{position:relative}
.calc-locked .cout > :not(.gate),.calc-locked #dicasBox .tips{filter:blur(9px);opacity:.55;pointer-events:none;user-select:none}
.cout .gate{width:min(560px,calc(100% - 8px));top:var(--gt,0px)}
.acc{border:1px solid var(--linha);border-radius:18px;background:#fff;padding:0 20px}
.acc summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:600;color:var(--marinho);display:flex;justify-content:space-between;gap:12px;align-items:center}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:24px;line-height:1}
.acc[open] summary::after{content:"–"}
.acc__in{padding-bottom:20px}
.acc__in > p:first-child{margin-top:0}

/* ===== 15/out: celular centralizado (regra do Léo) ===== */
@media (max-width:640px){
  .prose:not(.center),.prose:not(.center) h2{text-align:center}
  .prose ul,.fontes{padding-left:0;list-style:none}
  .stc{flex-direction:column;align-items:center;text-align:center}
  .opt{text-align:center}
  .tips li,.tips--list li{text-align:center}
  .tips li::before{margin-inline:auto}
  .lead form{text-align:center}
  .gate{text-align:center}
  .lead .fld input,.gate .fld input,.stdb__data input{text-align:left}
  .chk{justify-content:center;text-align:center}
  .cin label,.cin .lbl{text-align:center}
  .cin__row{flex-direction:column;justify-content:center;gap:8px}
  .seg{flex-direction:column;align-items:center;gap:2px;text-align:center}
  .chips{justify-content:center}
  .acc summary{justify-content:center;position:relative;padding-inline:28px;text-align:center}
  .acc summary::after{position:absolute;right:0}
  .acc__in{text-align:center}
  .gift .calc__row{flex-direction:column;align-items:center;gap:2px}
}

/* ===== 16/out: prévia do site do casal (modelo da loja num celular, com os nomes e a data) ===== */
.pvw{display:grid;grid-template-columns:1fr auto;gap:clamp(20px,4vw,56px);align-items:center;background:var(--marinho);color:#fff;border-radius:24px;padding:clamp(22px,3.4vw,40px) clamp(20px,3.4vw,48px);overflow:hidden;position:relative}
.pvw > *{min-width:0}
.pvw h3{font:400 clamp(32px,3.8vw,48px)/1.04 var(--serif);color:#fff;text-wrap:balance}
.pvw p{color:rgba(246,241,233,.86);margin-top:12px;font-size:15.5px;text-wrap:pretty;max-width:52ch}
.pvw p b{color:#fff}
.pvw .ctas{margin-top:22px}
/* 17/out: R$ 197 (principal) + R$ 997 personalizado + dúvidas no WhatsApp, empilhados */
.pvw .ctas{display:flex;flex-direction:column;align-items:flex-start;gap:10px;max-width:440px}
.pvw .ctas .btn{justify-content:center;text-align:center;line-height:1.25;white-space:normal;max-width:100%;box-sizing:border-box}
.pvw .btn--line{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);font-size:14.5px;padding:12px 20px}
.pvw .btn--line:hover{background:rgba(255,255,255,.1)}
.pvw .btn--wa-line{background:transparent;color:#7ee2a1;padding:8px 2px;font-size:14.5px;text-decoration:underline;text-underline-offset:3px}
@media (max-width:700px){.pvw .ctas{align-items:stretch;max-width:none}.pvw .btn--wa-line{align-self:center}}
.pvw__links{font-size:14px;display:flex;flex-wrap:wrap;gap:4px 18px}
.pvw__links .link{color:#fff;padding:6px 0}
.pvw__dev{position:relative;display:block;width:clamp(240px,23vw,290px);aspect-ratio:390/780;border-radius:38px;background:#0b1424;padding:10px;box-shadow:0 40px 80px -30px rgba(0,0,0,.65),inset 0 0 0 2px rgba(255,255,255,.14);text-decoration:none;animation:pvwIn .9s .1s cubic-bezier(.2,.8,.2,1) both}
.pvw__dev::before{content:"";position:absolute;left:50%;top:16px;width:64px;height:7px;border-radius:9px;background:#0b1424;transform:translateX(-50%);z-index:3}
.pvw__scr{position:relative;display:block;width:100%;height:100%;border-radius:29px;overflow:hidden;background:var(--off)}
.pvw__scr iframe{position:absolute;left:0;top:0;width:390px;height:780px;border:0;transform-origin:0 0;opacity:0;transition:opacity .6s}
.pvw__scr.is-on iframe{opacity:1}
.pvw__load{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;font:400 24px/1.15 var(--serif);color:var(--marinho);background:linear-gradient(110deg,var(--off) 30%,#fff 50%,var(--off) 70%) 0 0/300% 100%;animation:pvwShine 1.6s linear infinite}
.pvw__scr.is-on .pvw__load{opacity:0;transition:opacity .4s;pointer-events:none}
.pvw__tap{display:none;position:absolute;left:50%;bottom:-16px;transform:translateX(-50%);background:var(--limao);color:var(--marinho);border-radius:99px;padding:8px 14px;font-weight:700;font-size:13.5px;white-space:nowrap;z-index:4;box-shadow:0 10px 20px -10px rgba(0,0,0,.5)}
@media (hover:hover) and (pointer:fine){.pvw__dev:hover{transform:translateY(-4px);transition:transform .4s}}
@media (pointer:coarse){.pvw__scr iframe{pointer-events:none}.pvw__tap{display:block}}
@keyframes pvwIn{from{opacity:0;transform:translateY(30px) rotate(3deg)}}
@keyframes pvwShine{to{background-position:-300% 0}}
.res > .pvw{margin-top:clamp(18px,3vw,28px)}
.previa-sec .pvw{animation:lpUp .8s cubic-bezier(.2,.8,.2,1) both}
@media (max-width:860px){
  .pvw{grid-template-columns:1fr;justify-items:center;text-align:center}
  .pvw p{margin-inline:auto}
  .pvw .ctas,.pvw__links{justify-content:center}
  .pvw__dev{margin-bottom:12px}
  .pvw__dev{width:min(270px,72vw)}
}
@media (prefers-reduced-motion:reduce){.pvw__dev,.pvw__load,.previa-sec .pvw{animation:none}}
/* 17/out: campo de data não pode vazar no celular (iOS dá largura mínima própria ao input date) */
.fld{min-width:0}
.fld input,.fld select{box-sizing:border-box;max-width:100%}
.fld input[type=date]{display:block;width:100%;min-width:0;-webkit-appearance:none;appearance:none;min-height:50px;line-height:1.2;text-align:left}
.fld input[type=date]::-webkit-date-and-time-value{text-align:left;margin:0}
.fld input[type=date]::-webkit-datetime-edit{padding:0}

/* 17/out: calculadora liberada → no celular o resultado vem primeiro e os campos pra ajustar ficam abaixo */
.total__edit{display:none;margin-top:10px;font-size:14px}
.total__edit a{color:var(--marinho);font-weight:600}
@media (max-width:860px){.calc-ok .calcg > .cout{order:-1}.calc-ok .total__edit{display:block}}
/* 18/out: "Deixem o site com a cara de vocês" (assets/completar.js), dentro do bloco do site pronto */
.pvw > .cmp{grid-column:1/-1}
.cmp{background:#fff;color:var(--ink);border-radius:20px;padding:clamp(18px,2.6vw,28px);text-align:left}
.cmp__top h3{font:400 clamp(26px,2.6vw,34px)/1.08 var(--serif);color:var(--marinho)}
.cmp__top p{color:var(--soft)!important;margin-top:6px!important;font-size:15px}
.cmp__bar{height:10px;border-radius:99px;background:var(--off);margin-top:14px;overflow:hidden}
.cmp__bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--marinho),#3f7fc4);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.cmp__pct{display:block;margin-top:6px;font-size:13px;font-weight:700;color:var(--marinho)}
.cmp__steps{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.cmp__step{border:1.5px solid var(--linha);border-radius:16px;overflow:hidden;background:#fff}
.cmp__step.is-open{border-color:var(--marinho)}
.cmp__step.is-ok{background:#f3f8f2;border-color:#bfdcbc}
.cmp__head{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;padding:14px 16px;cursor:pointer;text-align:left;font:inherit;color:var(--ink)}
.cmp__ic{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--off);font-size:17px}
.cmp__step.is-ok .cmp__ic{background:#2f8f4e;color:#fff;font-weight:800}
.cmp__head b{flex:1;font-size:16px}
.cmp__st{font-size:13px;font-weight:700;color:var(--marinho)}
.cmp__step.is-ok .cmp__st{color:#2f8f4e}
.cmp__body{padding:2px 16px 16px}
.cmp__ajuda{color:var(--soft)!important;font-size:14px!important;margin:0 0 12px!important}
.cmp__lbl{display:block;font-weight:700;font-size:14px;margin:12px 0 6px;color:var(--ink)}
.cmp__chips{display:flex;flex-wrap:wrap;gap:8px}
.cmp__chip input{position:absolute;opacity:0;pointer-events:none}
.cmp__chip span{display:inline-block;padding:9px 14px;border-radius:99px;border:1.5px solid var(--linha);background:var(--off);font-size:14px;font-weight:600;cursor:pointer;color:var(--ink)}
.cmp__chip input:checked + span{background:var(--marinho);border-color:var(--marinho);color:#fff}
.cmp__chip input:focus-visible + span{outline:2px solid var(--marinho);outline-offset:2px}
.cmp__fld{display:block;margin-top:12px;font-weight:700;font-size:14px;color:var(--ink)}
.cmp__fld small{font-weight:400;color:var(--soft)}
.cmp__fld input,.cmp__fld select,.cmp__fld textarea{display:block;width:100%;box-sizing:border-box;margin-top:6px;font:inherit;font-size:16px;font-weight:400;color:var(--ink);border:1.5px solid var(--linha);border-radius:12px;padding:11px 13px;background:var(--off);resize:vertical}
.cmp__btn{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;border:0;border-radius:99px;padding:13px 22px;background:var(--marinho);color:#fff;font:inherit;font-weight:700;font-size:15px;cursor:pointer}
.cmp__btn:disabled,.cmp__btn.is-busy{opacity:.6;pointer-events:none}
.cmp__btn--file{margin-top:0}
.cmp__err{color:var(--tomate)!important;font-size:14px!important;margin:8px 0 0!important}
.cmp__err:empty{display:none}
@media (max-width:700px){.cmp{text-align:left}.cmp__top{text-align:center}.cmp__btn{width:100%}.cmp__head b{font-size:15px}}
/* 18/out: o que o site já traz (lista com ✓) */
.pvw__lista{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:7px;max-width:52ch}
.pvw__lista li{position:relative;padding-left:28px;color:#fff;font-size:15.5px;line-height:1.4;text-align:left}
.pvw__lista li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--limao);color:var(--marinho);font-weight:800;font-size:12px;display:grid;place-items:center;margin-top:1px}
@media (max-width:700px){.pvw__lista{width:fit-content;margin-inline:auto}}

/* 19/out: ajuda do campo do convidado especial */
.gate .fld__aj{display:block;font-weight:400;color:var(--soft);font-size:12.5px;margin-top:2px;line-height:1.35}

/* 23/out: botão "Receber o link do site no WhatsApp" (a noiva chama primeiro) */
.pvw__zap{display:flex;width:100%;justify-content:center;margin-top:16px;background:#25D366!important;color:#fff!important;box-shadow:0 14px 28px -14px rgba(37,211,102,.8);white-space:normal;text-align:center}
.pvw__zap-sub{font-size:13.5px;color:var(--soft);margin-top:8px;text-align:center}

/* 31/out: calculadora → painel do Sapia Casamentos (F.painelCalc) no lugar da prévia do site */
.pvw--painel .pnl__cond{margin-top:12px;background:rgba(255,255,255,.08);border-radius:14px;padding:12px 14px;font-size:15px;line-height:1.5;color:#fff}
.pvw--painel .pnl__cond b{color:var(--limao)}
.pvw--painel .pnl__cond s{opacity:.7}
.pvw--painel .pnl__sub{margin-top:10px;font-size:13.5px;color:rgba(255,255,255,.75)}
.pnl__orc{display:block;width:min(320px,100%);background:#fff;color:var(--marinho);border-radius:20px;padding:18px 18px 14px;text-decoration:none;box-shadow:0 24px 50px -28px rgba(0,0,0,.6)}
.pnl__orc b{display:block;font:400 22px/1.1 var(--serif,Georgia,serif)}
.pnl__tot{display:block;font-weight:700;font-size:15px;margin-top:4px;opacity:.75}
.pnl__orc ul{list-style:none;margin:12px 0 0;padding:0}
.pnl__orc li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid rgba(16,73,127,.1);font-size:14.5px;text-align:left}
.pnl__orc li i{font-style:normal;font-weight:700;white-space:nowrap}
.pnl__orc u{display:block;margin-top:10px;font-weight:700;font-size:14px;text-decoration:none;text-align:center}
@media (max-width:700px){.pnl__orc{margin-inline:auto}.pvw--painel .pnl__cond{text-align:center}}
.pvw--painel .pnl__lede{margin-top:10px;font-size:16px;line-height:1.55;color:rgba(255,255,255,.88)}
.pvw--painel .pnl__lede b{color:#fff}
.pvw--painel .pvw__lista li b{color:var(--limao);font-weight:700}
.gate .chk--sm.chk--est{grid-column:1/-1}   /* 31/out: "Ainda não definimos" do estilo, logo abaixo do select */
/* 31/out: calculadora com o painel → valor, item por item, venda, edição por último (calc.js · organizarPainel) */
.calc-painel .calcg{grid-template-columns:minmax(0,1fr);max-width:820px;margin-inline:auto}
.calc-painel .total__edit{display:block}
.edt{max-width:820px;margin:0 auto;text-align:center}
.edt .lede{margin:10px auto 0;max-width:560px}
.edt .lede a{color:var(--marinho);font-weight:700}
.edt .cin{text-align:left;margin-top:20px}
.calc-painel .total__edit a{color:var(--limao)}
@media (max-width:700px){.calc-painel .pnl__orc{display:none}}   /* no celular o item por item já está logo acima */