:root{
  --paper:#F4E9D8; --paper2:#EBDCC4; --ink:#1B2A52; --ink-soft:#4B5878;
  --red:#C23B3B; --red-dark:#9E2B2E; --wall:#FBF5EA; --wood:#243766; --wood-dark:#14204a;
  --green:#2F7A5A; --green-dark:#22593F; --glow:#F6C979;
  --font:"Cabinet Grotesk",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--paper);color:var(--ink);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.35;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55  0 0 0 0 .45  0 0 0 0 .3  0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:6px}
.wrap{width:min(1240px,100% - clamp(36px,8vw,144px));margin-inline:auto}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(18px,4vw,56px);transition:background .3s,box-shadow .3s}
.nav.scrolled{background:rgba(244,233,216,.88);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(27,42,82,.1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:800;font-size:17px;letter-spacing:-.01em}
.brand img{width:46px;height:46px;border-radius:50%}
.nav ul{display:flex;gap:30px;list-style:none;padding:0;font-weight:500}
.nav ul a{text-decoration:none}
.nav ul a:hover{color:var(--red)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--red);color:#fff;font:700 1rem var(--font);padding:14px 24px;border:0;border-radius:14px;text-decoration:none;cursor:pointer;box-shadow:0 2px 0 var(--red-dark),0 14px 30px -14px rgba(158,43,46,.7);transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.btn.wa{background:var(--green);color:#fff;box-shadow:0 2px 0 var(--green-dark),0 14px 30px -14px rgba(47,122,90,.6)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.btn.big{padding:18px 30px;font-size:1.1rem}

/* hero */
.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;padding:110px clamp(18px,5vw,72px) 60px;gap:2vw;overflow:hidden}
.blob{position:absolute;border-radius:50%;pointer-events:none}
.b1{width:60vw;height:60vw;left:-18vw;top:-22vw;background:radial-gradient(circle at 40% 40%,#EBD7B8 0,#F0DFC4 55%,transparent 70%)}
.b2{width:34vw;height:34vw;right:-8vw;bottom:-14vw;background:radial-gradient(circle,#E9CDB0 0,transparent 68%)}
.copy{position:relative;z-index:3;max-width:760px}
h1{font-size:clamp(2.7rem,5.1vw,5.2rem);line-height:1.02;letter-spacing:-.035em;font-weight:800;max-width:15ch}
h1 em{font-style:normal;color:var(--red)}
.sub{margin-top:26px;font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.5;color:var(--ink-soft);max-width:34ch;font-weight:500}
.cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.stage{position:relative;z-index:2;justify-self:center;width:min(100%,640px);aspect-ratio:4/4.6}
.roof{position:absolute;left:-4%;right:-4%;top:0;height:30%;filter:drop-shadow(0 18px 14px rgba(27,42,82,.25))}
.house{position:absolute;left:6%;right:6%;top:22%;bottom:0;background:var(--wall);border-radius:6px 6px 0 0;box-shadow:0 40px 60px -30px rgba(27,42,82,.45), inset 0 -14px 0 var(--paper2)}
.window{position:absolute;top:18%;width:20%;aspect-ratio:3/4;background:#FFF;border:5px solid var(--ink);border-radius:8px;overflow:hidden}
.window::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,var(--ink) 48% 52%,transparent 52%),linear-gradient(0deg,transparent 48%,var(--ink) 48% 52%,transparent 52%)}
.w1{left:7%}.w2{right:7%}
.door{position:absolute;left:50%;bottom:0;width:36%;height:62%;transform:translateX(-50%);border-radius:200px 200px 0 0;overflow:hidden;background:#2a1b14}
.door .in{position:absolute;inset:0;background:url(assets/hero-sorriso.jpg) 38% 50%/cover no-repeat;transform-origin:50% 40%}
.door .in::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 20%,transparent 40%,rgba(30,18,10,.55))}
.leaf{position:absolute;left:50%;bottom:0;width:36%;height:62%;transform-origin:left center;margin-left:-18%;background:var(--wood);border-radius:200px 200px 0 0;box-shadow:inset 0 0 0 6px #1a2850, inset 0 0 0 12px #2c4177;z-index:2;transform:perspective(900px) rotateY(-24deg);will-change:transform}
.leaf::after{content:"";position:absolute;right:10%;top:54%;width:10px;height:10px;border-radius:50%;background:#e6c27a}
.step{position:absolute;left:30%;right:30%;bottom:-2%;height:3%;background:var(--paper2);border-radius:4px}
.sign{position:absolute;left:50%;top:6%;transform:translateX(-50%);width:20%;aspect-ratio:1;border-radius:50%;background:var(--paper);display:grid;place-items:center;z-index:3;box-shadow:0 0 0 4px var(--wall),0 10px 20px -8px rgba(27,42,82,.5)}
.sign img{width:92%;border-radius:50%}

/* sections */
section{position:relative}
.pad{padding-block:clamp(88px,13vw,180px)}
h2{font-size:clamp(2.1rem,4.2vw,4rem);line-height:1.04;letter-spacing:-.03em;font-weight:800;max-width:20ch}
h2 em{font-style:normal;color:var(--red)}
.lede{font-size:clamp(1.05rem,1.3vw,1.25rem);line-height:1.55;color:var(--ink-soft);font-weight:500;max-width:46ch}

/* scrubbed line */
.verso{padding-block:clamp(70px,10vw,140px) clamp(30px,5vw,70px)}
.verso p{font-size:clamp(1.7rem,3.6vw,3.3rem);line-height:1.18;letter-spacing:-.025em;font-weight:700;max-width:26ch}
.verso .w{opacity:.14;transition:opacity .15s}

/* vitrine */
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.filtros{display:flex;gap:10px;flex-wrap:wrap}
.filtros button{font:700 .95rem var(--font);color:var(--ink);background:transparent;border:0;border-radius:12px;padding:11px 18px;cursor:pointer;box-shadow:inset 0 0 0 2px rgba(27,42,82,.25)}
.filtros button[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:none}
.grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:48px 28px;margin-top:64px;grid-auto-flow:dense}
.win{all:unset;box-sizing:border-box;cursor:pointer;display:block;position:relative}
.win:focus-visible{outline:3px solid var(--red);outline-offset:6px;border-radius:12px}
.win:nth-child(even){margin-top:34px}
.arch{position:relative;aspect-ratio:3/4;border-radius:999px 999px 10px 10px;overflow:hidden;border:6px solid var(--ink);background:var(--paper2);box-shadow:0 30px 40px -28px rgba(27,42,82,.55)}
.arch img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.win:hover .arch img{transform:scale(1.06)}
.sill{height:12px;margin:0 -8px;background:var(--wall);border-radius:4px;box-shadow:0 8px 0 -2px var(--paper2)}
.win h3{margin-top:22px;font-size:1.6rem;letter-spacing:-.02em;font-weight:800}
.win p{margin-top:4px;color:var(--ink-soft);font-weight:500;font-size:.98rem}
.win .tag{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:2;background:var(--red);color:#fff;font:700 .78rem var(--font);padding:5px 12px;border-radius:99px}
.vazio{margin-top:64px;padding:48px 28px;background:var(--wall);border-radius:24px;max-width:620px}
.vazio p{margin:10px 0 24px;color:var(--ink-soft);font-weight:500;line-height:1.5}
.casa-nova{margin-top:110px}
.casa-nova h3{font-size:1.5rem;font-weight:800;letter-spacing:-.02em}
.casa-nova .fila{display:flex;gap:22px;margin-top:26px;overflow-x:auto;padding-bottom:14px;scroll-snap-type:x proximity}
.cn{flex:none;width:130px;scroll-snap-align:start}
.cn .arch{border-width:4px;filter:grayscale(.85);opacity:.8}
.cn b{display:block;margin-top:10px;font-weight:800}
.cn span{font-size:.85rem;color:var(--ink-soft)}

dialog{border:0;padding:0;background:transparent;max-width:min(880px,100% - 24px);width:100%;margin:auto}
dialog::backdrop{background:rgba(20,32,74,.62);backdrop-filter:blur(3px)}
.ficha{display:grid;grid-template-columns:1fr 1.05fr;background:var(--wall);border-radius:28px;overflow:hidden;position:relative}
.ficha .foto{min-height:420px;background:var(--paper2)}
.ficha .foto img{width:100%;height:100%;object-fit:cover}
.ficha .txt{padding:clamp(24px,4vw,48px);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.ficha h3{font-size:clamp(2rem,3.6vw,3.2rem);letter-spacing:-.03em;line-height:1;font-weight:800}
.ficha dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:6px 0 10px;font-weight:500}
.ficha dt{color:var(--ink-soft)}
.ficha dd{font-weight:700}
.ficha .jeito{color:var(--ink-soft);line-height:1.55;font-weight:500}
.ficha .fecha{position:absolute;top:14px;right:14px;width:42px;height:42px;border-radius:50%;border:0;background:var(--paper);font:700 1.2rem var(--font);cursor:pointer;color:var(--ink)}

/* como ajudar */
.ajudar{background:linear-gradient(var(--paper),var(--paper2))}
.pilha{margin-top:64px;display:grid;gap:26px;padding-bottom:30px}
.card{position:sticky;top:calc(96px + var(--i)*20px);border-radius:32px;padding:clamp(28px,4.5vw,64px);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;min-height:min(62vh,460px);box-shadow:0 30px 60px -36px rgba(27,42,82,.55);transform-origin:50% 0}
.card h3{font-size:clamp(1.9rem,3.6vw,3.3rem);line-height:1.02;letter-spacing:-.03em;font-weight:800}
.card p{margin-top:14px;font-size:1.1rem;line-height:1.55;font-weight:500;max-width:38ch}
.card .btn{margin-top:26px}
.c-adotar{background:var(--red);color:#fff}
.c-adotar p{color:#fde8e0}
.c-apad{background:var(--wood);color:#fff}
.c-apad p{color:#d3dcf5}
.c-pix{background:var(--wall)}
.c-pix p{color:var(--ink-soft)}
.c-bazar{background:var(--glow)}
.c-bazar p{color:#4a3a1a}
.btn.paper{background:#fff;color:var(--red-dark);box-shadow:0 14px 30px -14px rgba(0,0,0,.4)}
.btn.line{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px #fff}
.visual{display:grid;place-items:center;min-height:200px}
.visual svg{width:min(100%,300px);height:auto}
.pixcard{width:min(100%,380px);background:#fff;border-radius:22px;padding:26px;box-shadow:0 30px 50px -30px rgba(27,42,82,.5);display:grid;gap:14px}
.pixcard small{color:var(--ink-soft);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.75rem}
.pixcard .chave{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;letter-spacing:-.02em}
.pixcard .conta{font-size:.92rem;color:var(--ink-soft);font-weight:500;line-height:1.4}
.bazar-lista{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.bazar-lista li{background:rgba(255,255,255,.55);padding:9px 16px;border-radius:99px;font-weight:700;color:#4a3a1a}

/* pix */
.doar{background:var(--red);color:#fff;overflow:hidden;padding-block:clamp(80px,11vw,150px)}
.doar::before{content:"";position:absolute;inset:auto -10% -40% auto;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(circle,rgba(246,201,121,.35),transparent 65%);pointer-events:none}
.doar-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,96px);align-items:center;position:relative}
.doar h2{color:#fff}
.doar h2 em{color:var(--glow)}
.doar .lede{color:#ffe3dc;margin-top:20px}
.ticket{justify-self:center;width:min(100%,400px);background:var(--wall);color:var(--ink);border-radius:28px;padding:26px 26px 24px;display:grid;gap:18px;box-shadow:0 50px 70px -34px rgba(60,10,12,.75);position:relative}
.t-top{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.05rem}
.t-top img{border-radius:50%}
.qrbox{position:relative;background:#fff;border-radius:18px;padding:10px;box-shadow:inset 0 0 0 2px rgba(27,42,82,.1)}
.qrbox .qr{display:block;width:100%;height:auto}
.scan{position:absolute;left:6px;right:6px;top:0;height:3px;background:var(--red);box-shadow:0 0 14px 3px rgba(194,59,59,.55);border-radius:2px}
.t-corte{position:relative;height:0;border-top:2px dashed rgba(27,42,82,.25);margin:0 -26px}
.t-corte::before,.t-corte::after{content:"";position:absolute;top:-13px;width:24px;height:24px;border-radius:50%;background:var(--red)}
.t-corte::before{left:-12px}.t-corte::after{right:-12px}
.t-chave small{display:block;color:var(--ink-soft);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.75rem}
.t-chave strong{font-size:clamp(1.7rem,3vw,2.2rem);letter-spacing:-.02em;font-weight:800}
.t-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.t-btns .btn{padding:13px 10px;font-size:.95rem}
.t-conta{font-size:.88rem;line-height:1.45;color:var(--ink-soft);font-weight:500}

/* contato */
.fecho{background:var(--wood-dark);color:#fff;overflow:hidden}
.fecho .pin{min-height:100svh;display:grid;align-items:center;padding:100px 0}
.fecho-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,6vw,96px);align-items:center}
.porta{position:relative;width:min(100%,420px);aspect-ratio:3/4.6;justify-self:center;perspective:1300px}
.porta .batente{position:absolute;inset:0;border-radius:999px 999px 6px 6px;background:#0d1634;padding:12px}
.porta .dentro{position:absolute;inset:12px;border-radius:999px 999px 0 0;overflow:hidden;background:#2a1b14}
.porta .dentro .luz{position:absolute;inset:0;background:radial-gradient(90% 70% at 50% 40%,var(--glow),#b9743a 70%)}
.porta .dentro img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 38%;opacity:0}
.porta .folha{position:absolute;inset:12px;border-radius:999px 999px 0 0;background:var(--wood);transform-origin:left center;box-shadow:inset 0 0 0 8px #1a2850,inset 0 0 0 16px #2c4177;will-change:transform}
.porta .folha::after{content:"";position:absolute;right:11%;top:56%;width:16px;height:16px;border-radius:50%;background:#e6c27a;box-shadow:0 0 0 4px rgba(230,194,122,.25)}
.porta .tapete{position:absolute;left:12%;right:12%;bottom:-18px;height:20px;border-radius:6px;background:var(--red)}
.fecho h2{color:#fff}
.fecho h2 em{color:var(--glow)}
.fecho .lede{color:#c6d0ee;margin-top:18px}
.zap{margin-top:32px;background:var(--wall);color:var(--ink);border-radius:26px;padding:clamp(22px,3vw,34px);display:grid;gap:18px;box-shadow:0 40px 60px -30px rgba(0,0,0,.6);max-width:560px}
.zap legend,.zap label.t{font-weight:800;font-size:1rem;margin-bottom:10px;display:block;padding:0}
.zap fieldset{border:0;padding:0;min-width:0}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:11px 16px;border-radius:12px;font-weight:700;box-shadow:inset 0 0 0 2px rgba(27,42,82,.22);transition:background .2s,color .2s}
.chips input:checked+span{background:var(--ink);color:#fff;box-shadow:none}
.chips input:focus-visible+span{outline:3px solid var(--red);outline-offset:2px}
.zap input[type=text]{width:100%;font:500 1.05rem var(--font);color:var(--ink);padding:14px 16px;border-radius:12px;border:2px solid rgba(27,42,82,.18);background:#fff}
.zap input[type=text]:focus{outline:none;border-color:var(--ink)}
.bolha{background:#DCF3E4;color:#17432f;border-radius:18px 18px 18px 4px;padding:14px 16px;font-weight:500;line-height:1.45;font-size:1.02rem}
.fatos{margin-top:30px;display:grid;gap:8px;color:#c6d0ee;font-weight:500;font-size:1.02rem}
.fatos b{color:#fff}
.fatos a{text-decoration:underline;text-underline-offset:3px}
footer{background:var(--wood-dark);color:#9fb0dc;padding:30px 0 40px;font-weight:500;font-size:.95rem}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;border-top:1px solid rgba(255,255,255,.12);padding-top:26px}
footer img{width:38px;height:38px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:10px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 20px;border-radius:12px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:80}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media(max-width:860px){
  .hero{grid-template-columns:1fr;padding-top:96px}
  .nav ul{display:none}
  .stage{width:min(100%,460px)}
  .card{grid-template-columns:1fr;position:relative;top:auto;min-height:0}
  .fecho-grid,.doar-grid{grid-template-columns:1fr}
  .ficha{grid-template-columns:1fr}
  .ficha .foto{min-height:300px;max-height:46vh}
  .grade{grid-template-columns:repeat(2,1fr);gap:36px 16px}
  .win h3{font-size:1.25rem}
  .win:nth-child(even){margin-top:22px}
  .nav .btn{padding:11px 16px;font-size:.92rem}
  .brand span{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
  .verso .w{opacity:1}
}
