/* BJ Locação: mesma linguagem da LP da Bela Louça (mosaico de fotos, cards, faixa escura), nas cores do logo da BJ */
:root{
  color-scheme:light only;
  --blush:#FBF6F5;--blush-2:#F5E9E8;--surface:#fff;
  --ink:#2A1E20;--ink-2:#4F3F42;--muted:#7B6B6E;--hair:#EEE0DE;--hair-2:#E2CDCA;
  --brand:#C24A55;--brand-deep:#A3303C;--brand-text:#9A2B37;--brand-wash:#FCEDED;
  --verde:#2F6E4C;--escuro:#2B1A1D;
  --wa:#1FA855;--wa-deep:#158140;
  --sans:'Plus Jakarta Sans',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r:14px;--shadow:0 2px 10px rgba(80,40,45,.06);--shadow-lg:0 12px 34px rgba(80,40,45,.13);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--blush);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;font-variant-numeric:lining-nums}
img{max-width:100%;display:block;height:auto}
a{color:var(--brand-text)}
.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 20px}
h1,h2,h3{margin:0;letter-spacing:-.025em;text-wrap:balance;line-height:1.1;color:var(--ink)}
h1{font-size:clamp(31px,5.4vw,52px);font-weight:800}
h1 em,.home h1 em{font-style:normal;color:var(--brand-text)}
h2{font-size:clamp(26px,4.2vw,40px);font-weight:800}
h3{font-size:18px;font-weight:700;letter-spacing:-.01em}
p{margin:0;text-wrap:pretty}
figure{margin:0}
.ic{width:20px;height:20px;flex:none}

.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--brand-text);background:var(--brand-wash);border:1px solid #F3D6D6;border-radius:100px;padding:6px 14px}
.eyebrow .ic{width:15px;height:15px}
.eyebrow-escuro{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#F3C9CC}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:inherit;font-size:17px;font-weight:700;line-height:1.2;
  padding:16px 28px;border-radius:100px;border:0;cursor:pointer;text-decoration:none;min-height:56px;
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease,border-color .12s ease}
.btn .ic{width:19px;height:19px}
.btn-primary{background:var(--brand-deep);color:#fff;box-shadow:0 5px 16px rgba(163,48,60,.3)}
.btn-primary:hover{background:#8C2632;transform:translateY(-1px);box-shadow:0 8px 22px rgba(163,48,60,.36)}
.btn-wa{background:var(--wa);color:#fff;box-shadow:0 5px 16px rgba(31,168,85,.28)}
.btn-wa:hover{background:var(--wa-deep);transform:translateY(-1px)}
.btn-ghost{background:var(--surface);color:var(--ink);border:1.5px solid var(--hair-2)}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand-text)}
.btn-ghost-claro{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost-claro:hover{border-color:#fff}
.btn:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.btn-full{width:100%}
.btn-sm{min-height:44px;padding:10px 18px;font-size:15px}
.cta-par{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* topo */
.topo{background:var(--surface);border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:40}
.topo-in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:10px;padding-bottom:10px}
.marca{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.marca img{border-radius:50%;border:1px solid var(--hair)}
.marca b{display:block;font-size:18px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.marca small{font-size:12.5px;color:var(--muted)}
.topo-dir{display:flex;align-items:center;gap:18px}
.topo-local{font-size:13.5px;color:var(--muted);text-align:right;line-height:1.35}
.topo-local b{display:block;color:var(--ink-2);font-size:14px}

/* hero */
.hero{padding:40px 0 36px}
.hero-grid{display:grid;grid-template-columns:1fr;gap:30px;align-items:center}
.hero h1{margin-top:16px}
.lede{margin-top:16px;font-size:18px;color:var(--ink-2);max-width:38ch}
.dois-fatos{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair);border:1px solid var(--hair);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);max-width:440px}
.dois-fatos div{background:var(--surface);padding:14px 16px}
.dois-fatos .rot{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dois-fatos .val{display:block;font-size:25px;font-weight:800;color:var(--brand-text);letter-spacing:-.03em;line-height:1.15;margin-top:3px}
.dois-fatos .sub{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.nota-google{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:9px 16px 9px 12px;background:var(--surface);
  border:1px solid var(--hair);border-radius:100px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);font-size:14.5px;
  transition:box-shadow .12s ease,border-color .12s ease}
a.nota-google:hover{border-color:var(--hair-2);box-shadow:var(--shadow-lg)}
.nota-google b{font-size:17px;font-weight:800}
.nota-google .aval{color:var(--muted);text-decoration:underline;text-decoration-color:var(--hair-2);text-underline-offset:3px}
.g-logo{width:20px;height:20px;flex:none}
.estrelas{display:inline-block;width:88px;height:16px;flex:none;
  background:linear-gradient(90deg,#FBBC05 var(--pct),#DDD5D5 var(--pct));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.8l3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.8l-6.2 3.3 1.2-7L1.9 9.2l7-1z'/%3E%3C/svg%3E") 0 0/17.6px 16px repeat-x;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.8l3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.8l-6.2 3.3 1.2-7L1.9 9.2l7-1z'/%3E%3C/svg%3E") 0 0/17.6px 16px repeat-x}
.nota-loja{margin-top:14px;box-shadow:none}
.nota-card{margin:10px 0 0;padding:0;border:0;box-shadow:none;background:none}
.hero-txt>.nota-google+.dois-fatos{margin-top:16px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.aviso-data{display:flex;gap:9px;align-items:flex-start;margin-top:18px;font-size:14.5px;color:var(--ink-2)}
.aviso-data .ic{color:var(--brand);width:18px;height:18px;margin-top:2px}
.aviso-data b{color:var(--brand-text)}

.mosaico{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.mosaico figure{border-radius:9px;overflow:hidden;background:var(--blush-2)}
.mosaico img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .25s ease}
.mosaico figure:hover img{transform:scale(1.05)}
.mosaico .m-grande{grid-column:span 2;grid-row:span 2;box-shadow:0 6px 20px rgba(80,40,45,.18)}
.mosaico .m-grande img{height:100%}
.mosaico figure:nth-child(n+10){display:none}
.mosaico-legenda{margin-top:12px;font-size:13.5px;color:var(--muted)}

/* faixa de garantias */
.strip{background:var(--surface);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.strip ul{list-style:none;margin:0;padding:20px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px 28px}
.strip li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:var(--muted);line-height:1.45}
.strip b{color:var(--ink);display:block;font-size:15.5px}
.ic-strip{width:38px;height:38px;flex:none;padding:9px;border-radius:50%;background:var(--brand-wash);color:var(--brand-deep)}

/* seções */
.sec{padding:64px 0}
.sec-head{max-width:64ch;margin-bottom:32px}
.sec-head h2{margin-top:14px}
.sec-head p{margin-top:12px;color:var(--ink-2)}

.itens{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.item{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);transition:transform .14s ease,box-shadow .14s ease}
.item:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.item img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--blush-2)}
.item div{padding:12px 14px 15px}
.item h3{font-size:16.5px}
.item p{font-size:14px;color:var(--muted);margin-top:2px;line-height:1.4}
.faixa-cta{margin-top:30px;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);padding:22px 24px;box-shadow:var(--shadow);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px}
.faixa-cta p{color:var(--ink-2);max-width:46ch}
.faixa-cta b{color:var(--ink)}
.faixa-cta .cta-par{margin-top:12px}

/* faixa escura: passos */
.escuro{background:var(--escuro);color:#E9D9DA}
.escuro h2,.escuro h3{color:#fff}
.passos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:16px;counter-reset:p}
.passos li{counter-increment:p;position:relative;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:22px 22px 22px 76px}
.passos li::before{content:counter(p);position:absolute;top:22px;left:22px;width:40px;height:40px;border-radius:50%;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:17px}
.passos p{margin-top:6px;font-size:15.5px;color:#D8C5C7}

/* formulário */
.sec-form{background:var(--surface);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.form-grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
.form-txt h2{margin-top:14px}
.form-txt>p{margin-top:14px;color:var(--ink-2)}
.lista-ok{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px}
.lista-ok li{display:flex;gap:10px;font-size:15.5px;color:var(--ink-2)}
.lista-ok .ic{color:var(--verde);margin-top:3px;width:18px;height:18px}
.lista-ok b{color:var(--ink)}
.form-card{background:var(--blush);border:1px solid var(--hair);border-radius:18px;padding:26px 22px;box-shadow:var(--shadow)}
.form-orc{display:grid;gap:18px}
.form-orc label{display:grid;gap:7px;font-size:14.5px;font-weight:700;color:var(--ink)}
.form-orc label>span{display:block}
.form-orc label em,.chips legend em{font-weight:500;color:var(--muted);font-style:normal}
.form-orc input{font-family:inherit;font-size:16.5px;color:var(--ink);background:var(--surface);border:1.5px solid var(--hair-2);border-radius:11px;
  padding:14px 15px;width:100%;min-height:52px;transition:border-color .12s ease,box-shadow .12s ease}
.form-orc input:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px rgba(194,74,85,.18)}
.form-orc input.invalido{border-color:var(--brand-deep);background:#fff7f7}
.form-par{display:grid;grid-template-columns:1fr;gap:16px}
.chips{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.chips legend{font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:10px;padding:0}
.form-orc .chip{display:block;position:relative;font-weight:600}
.form-orc .chip input{position:absolute;inset:0;width:1px;height:1px;min-height:0;padding:0;border:0;opacity:0;pointer-events:none}
.chip span{display:block;padding:9px 15px;border:1.5px solid var(--hair-2);border-radius:100px;font-size:14.5px;color:var(--ink-2);background:var(--surface);
  cursor:pointer;user-select:none;transition:background .12s,border-color .12s,color .12s}
.chip span:hover{border-color:var(--brand);color:var(--brand-text)}
.chip input:checked+span{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff}
.chip input:focus-visible+span{outline:3px solid rgba(194,74,85,.35);outline-offset:1px}
.chips.invalido legend{color:var(--brand-deep)}
.form-nota{font-size:13.5px;color:var(--muted);text-align:center}
.form-erro{font-size:14.5px;color:var(--brand-deep);font-weight:700;text-align:center}
.form-ok{text-align:center;display:grid;gap:12px;padding:12px 0}
.form-ok b{font-size:24px;font-weight:800;color:var(--ink);letter-spacing:-.02em}

/* loja */
.sec-branca{padding-top:64px}
.loja-grid{display:grid;grid-template-columns:1fr;gap:20px;align-items:stretch}
.loja-card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);padding:28px 26px;box-shadow:var(--shadow)}
.loja-card h2{margin-top:14px;font-size:clamp(26px,3.4vw,34px)}
.dados{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:14px}
.dados li{display:flex;gap:12px;font-size:15.5px;color:var(--ink-2)}
.dados .ic{color:var(--brand);margin-top:2px}
.dados b{color:var(--ink)}
.dados a{font-weight:700}
.perto{margin:16px 0 22px;font-size:14.5px;color:var(--muted)}
.outra{margin-top:16px;font-size:14.5px;color:var(--muted);text-align:center}
.outra a{font-weight:700}
.mapa{border:0;width:100%;min-height:340px;height:100%;border-radius:var(--r);box-shadow:var(--shadow);background:var(--blush-2)}

/* faq */
.faq{display:grid;grid-template-columns:1fr;gap:11px;align-items:start}
.faq details{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);overflow:hidden}
.faq details[open]{border-color:var(--hair-2);box-shadow:var(--shadow)}
.faq summary{list-style:none;cursor:pointer;padding:18px 20px;font-weight:700;font-size:16.5px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.sinal{position:relative;width:22px;height:22px;flex:none;border-radius:50%;background:var(--brand-wash)}
.sinal::before,.sinal::after{content:"";position:absolute;background:var(--brand-deep);border-radius:2px;top:50%;left:50%;transform:translate(-50%,-50%)}
.sinal::before{width:10px;height:2px}.sinal::after{width:2px;height:10px;transition:opacity .15s}
details[open] .sinal::after{opacity:0}
.faq details p{padding:0 20px 18px;color:var(--ink-2);font-size:15.5px}

/* fecho */
.fecho{background:var(--brand-deep);color:#FBE6E8;padding:48px 0}
.fecho-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px}
.fecho h2{color:#fff}
.fecho p{margin-top:8px}

.rodape{background:var(--escuro);color:#BFA9AC;padding:30px 0 110px;font-size:14px}
.rodape-in{display:flex;gap:16px;align-items:center}
.rodape img{border-radius:50%;background:#fff}
.rodape a{color:#F1D3D6}
.rodape p+p{margin-top:4px}
.rodape b{color:#fff}

.barra-cel{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-top:1px solid var(--hair);
  padding:11px 16px calc(11px + env(safe-area-inset-bottom));display:flex;gap:10px;box-shadow:0 -4px 20px rgba(80,40,45,.09);transition:transform .22s ease}
.barra-cel .btn-wa{flex:1}
.btn-ico{padding:0;width:56px;flex:none}
.barra-cel.oculta{transform:translateY(110%)}

/* botão flutuante (computador) e popup do orçamento */
.fab-wa{position:fixed;right:22px;bottom:22px;z-index:55;display:none;align-items:center;gap:9px;background:var(--wa);color:#fff;text-decoration:none;
  font-weight:700;font-size:16px;padding:14px 20px;border-radius:999px;box-shadow:0 8px 24px rgba(31,168,85,.36);
  transition:transform .18s ease,box-shadow .18s ease,opacity .2s ease}
.fab-wa .ic{width:24px;height:24px}
.fab-wa:hover{background:var(--wa-deep);transform:translateY(-2px);box-shadow:0 12px 30px rgba(31,168,85,.42)}
body.modal-aberto{overflow:hidden}
body.modal-aberto .fab-wa,body.modal-aberto .barra-cel{opacity:0;pointer-events:none}
.modal-orc{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center}
.modal-orc[hidden]{display:none}
.modal-fundo{position:absolute;inset:0;background:rgba(43,26,29,.62);backdrop-filter:blur(3px);animation:modalFade .2s ease-out}
.modal-orc .caixa{position:relative;width:100%;max-width:560px;max-height:92vh;overflow-y:auto;overscroll-behavior:contain;background:var(--surface);
  border-radius:20px 20px 0 0;padding:26px 20px calc(22px + env(safe-area-inset-bottom));box-shadow:var(--shadow-lg);animation:modalSobe .22s ease-out}
.modal-orc h2{margin-top:12px;font-size:28px}
.modal-sub{margin:6px 0 20px;color:var(--ink-2);font-size:15.5px}
.modal-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:0;background:var(--blush-2);color:var(--ink);
  font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center}
.modal-x:hover{background:var(--hair-2)}
.modal-x:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
@keyframes modalSobe{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes modalFade{from{opacity:0}to{opacity:1}}
@media (min-width:640px){
  .modal-orc{align-items:center;padding:20px}
  .modal-orc .caixa{border-radius:var(--r);padding:32px 30px 28px}
}
@media (min-width:960px){.fab-wa{display:inline-flex}}

/* home */
.home-main{padding:44px 0 64px}
.home-cab{max-width:760px}
.home h1{margin-top:16px}
.unid-grade{display:grid;grid-template-columns:1fr;gap:20px;margin-top:32px}
.unid-card{display:block;background:var(--surface);border:1px solid var(--hair);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);
  box-shadow:var(--shadow);transition:transform .14s ease,box-shadow .14s ease}
.unid-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.unid-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.unid-txt{padding:22px 22px 24px}
.unid-txt h2{margin-top:12px}
.unid-txt p{display:flex;gap:9px;margin:10px 0 20px;color:var(--ink-2);font-size:15.5px}
.unid-txt p .ic{color:var(--brand);margin-top:2px}
.dois-fatos-home{margin:32px auto 0}
.home .rodape{padding-bottom:30px}

@media (min-width:620px){
  .mosaico{grid-template-columns:repeat(4,1fr)}
  .mosaico figure:nth-child(n+10){display:block}
  .itens{grid-template-columns:repeat(3,1fr);gap:16px}
  .form-par{grid-template-columns:1fr 1fr}
  .faq{grid-template-columns:1fr 1fr}
  .unid-grade{grid-template-columns:1fr 1fr}
}
@media (min-width:960px){
  .hero{padding:52px 0 48px}
  .hero-grid{grid-template-columns:1fr 1.05fr;gap:48px}
  .itens{grid-template-columns:repeat(4,1fr)}
  .passos{grid-template-columns:repeat(4,1fr)}
  .passos li{padding:76px 22px 24px}
  .form-grid{grid-template-columns:1fr 1.05fr;gap:56px}
  .form-txt{position:sticky;top:100px}
  .form-card{padding:32px 30px}
  .loja-grid{grid-template-columns:.9fr 1.1fr}
  .sec{padding:84px 0}
  .barra-cel{display:none}
  .rodape{padding-bottom:30px}
}
@media (max-width:959px){
  .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .hero-txt{display:contents}
  .hero-txt>.eyebrow{order:1;align-self:flex-start}
  .hero-txt>h1{order:2}
  .hero-txt>.lede{order:3}
  .hero-txt>.nota-google{order:3;align-self:flex-start;margin-top:14px}
  .hero-fotos{order:4;margin-top:20px}
  .hero-txt>.dois-fatos{order:5}
  .hero-txt>.hero-cta{order:6}
  .hero-txt>.aviso-data{order:7}
  .mosaico-legenda{display:none}
}
@media (max-width:619px){
  .topo-local,.marca small{display:none}
  .hero-cta .btn-ghost{display:none}
  .mosaico{gap:5px}
  .topo .btn-sm{min-height:40px;padding:8px 14px}
  .hero{padding:26px 0 30px}
  .lede{font-size:16.5px}
  .dois-fatos .val{font-size:21px}
  .hero-cta .btn{flex:1 1 100%}
  .cta-par .btn{flex:1 1 100%}
  .faixa-cta{padding:20px}
  .form-card{padding:22px 16px;margin:0 -4px}
  .fecho .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
