{"id":99,"date":"2026-09-16T02:01:08","date_gmt":"2026-09-16T02:01:08","guid":{"rendered":"https:\/\/newlifefast.com.br\/?page_id=99"},"modified":"2026-09-16T02:28:15","modified_gmt":"2026-09-16T02:28:15","slug":"elementor-99","status":"publish","type":"page","link":"https:\/\/newlifefast.com.br\/","title":{"rendered":"maristela angotti"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\nMaristela Angotti \u2014 Corretora de Im\u00f3veis em Araraquara<\/title>\n<meta name=\"description\" content=\"Maristela Angotti, corretora de im\u00f3veis em Araraquara. Atendimento pr\u00f3ximo e personalizado para encontrar o im\u00f3vel certo para voc\u00ea.\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght,ital@9..144,300;9..144,400;9..144,500;9..144,600;9..144,500italic&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\n<style>\n\/* ===================================================================\n MARISTELA ANGOTTI \u2014 DESIGN TOKENS\n =================================================================== *\/\n:root{\n --ink: #062D3E;\n --teal: #25535B;\n --terracotta: #B15330;\n --clay: #C9AFA5;\n --paper: #FBF8F5;\n --paper-dim: #F4EFE9;\n --white: #FFFFFF;\n --line: rgba(6, 45, 62, 0.14);\n --line-soft: rgba(6, 45, 62, 0.08);\n\n --font-display: 'Fraunces', Georgia, serif;\n --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n\n --container: 1180px;\n --radius: 6px;\n --ease: cubic-bezier(.25,.7,.35,1);\n}\n\n*,*::before,*::after{ box-sizing:border-box; }\nhtml{ scroll-behavior:smooth; }\n@media (prefers-reduced-motion: reduce){\n html{ scroll-behavior:auto; }\n *,*::before,*::after{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }\n}\n\nbody{\n margin:0;\n background:var(--paper);\n color:var(--ink);\n font-family:var(--font-body);\n font-size:16px;\n line-height:1.65;\n -webkit-font-smoothing:antialiased;\n -moz-osx-font-smoothing:grayscale;\n overflow-x:hidden;\n position:relative;\n}\n\nh1,h2,h3,h4{\n font-family:var(--font-display);\n font-weight:500;\n line-height:1.12;\n margin:0;\n color:var(--ink);\n letter-spacing:-0.01em;\n}\np{ margin:0; }\na{ color:inherit; text-decoration:none; }\nbutton{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }\n::selection{ background:var(--terracotta); color:var(--white); }\n:focus-visible{ outline:2px solid var(--terracotta); outline-offset:3px; }\nimg{ max-width:100%; display:block; }\n\n.container{\n width:100%;\n max-width:var(--container);\n margin:0 auto;\n padding:0 28px;\n position:relative;\n}\n@media (max-width: 640px){ .container{ padding:0 22px; } }\n\n.section{ padding:130px 0; position:relative; }\n@media (max-width: 900px){ .section{ padding:88px 0; } }\n.section-dim{ background:var(--paper-dim); }\n.section-dark{ background:var(--ink); color:var(--paper); }\n.section-dark h1, .section-dark h2, .section-dark h3{ color:var(--paper); }\n\n\/* ===================================================================\n TEXTURA DE PAPEL (sutil, discreta, fixa)\n =================================================================== *\/\n.grain{\n position:fixed;\n inset:0;\n z-index:1;\n pointer-events:none;\n opacity:0.035;\n mix-blend-mode:multiply;\n}\n\n\/* ===================================================================\n BARRA DE PROGRESSO DE LEITURA\n =================================================================== *\/\n.scroll-progress{\n position:fixed;\n top:0; left:0;\n height:2px;\n width:0%;\n background:var(--terracotta);\n z-index:200;\n transition:width 0.1s linear;\n}\n\n\/* ===================================================================\n MARCAS DE CANTO (refer\u00eancia a plantas t\u00e9cnicas)\n =================================================================== *\/\n.corner-marks{ position:absolute; inset:24px; pointer-events:none; z-index:1; opacity:0.5; }\n.corner-marks span{ position:absolute; width:14px; height:14px; }\n.corner-marks span::before,.corner-marks span::after{ content:\"\"; position:absolute; background:var(--teal); }\n.corner-marks .tl{ top:0; left:0; } .corner-marks .tl::before{ width:1px; height:14px; } .corner-marks .tl::after{ width:14px; height:1px; }\n.corner-marks .tr{ top:0; right:0; } .corner-marks .tr::before{ width:1px; height:14px; right:0; } .corner-marks .tr::after{ width:14px; height:1px; right:0; }\n@media (max-width: 780px){ .corner-marks{ display:none; } }\n\n\/* ===================================================================\n BLOBS DE PROFUNDIDADE (camadas de cor suaves, desfocadas)\n =================================================================== *\/\n.blob{\n position:absolute;\n border-radius:50%;\n filter:blur(90px);\n pointer-events:none;\n z-index:0;\n animation:blobFloat 24s ease-in-out infinite;\n}\n@keyframes blobFloat{\n 0%,100%{ transform:translate(0,0) scale(1); }\n 50%{ transform:translate(26px,-22px) scale(1.06); }\n}\n.blob-teal{ background:radial-gradient(circle, rgba(37,83,91,0.30), transparent 70%); }\n.blob-terracotta{ background:radial-gradient(circle, rgba(177,83,48,0.24), transparent 70%); animation-delay:-9s; }\n.blob-clay{ background:radial-gradient(circle, rgba(201,175,165,0.4), transparent 70%); animation-delay:-15s; }\n\n\/* ===================================================================\n FAIXA MARQUEE \u2014 TIPOS DE IM\u00d3VEL\n =================================================================== *\/\n.marquee-band{\n position:relative;\n border-top:1px solid var(--line);\n border-bottom:1px solid var(--line);\n overflow:hidden;\n padding:20px 0;\n background:var(--paper);\n}\n.marquee-track{\n display:flex;\n width:max-content;\n animation:marqueeScroll 34s linear infinite;\n}\n@keyframes marqueeScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }\n.marquee-item{\n display:flex;\n align-items:center;\n gap:18px;\n padding:0 30px;\n font-family:var(--font-display);\n font-style:italic;\n font-size:1.05rem;\n color:var(--teal);\n white-space:nowrap;\n}\n.marquee-item .sep{\n width:5px; height:5px;\n border-radius:50%;\n background:var(--terracotta);\n display:inline-block;\n}\n@media (prefers-reduced-motion: reduce){\n .marquee-track{ animation:none; }\n .blob{ animation:none; }\n}\n\n\/* ===================================================================\n BUTTONS\n =================================================================== *\/\n.btn{\n display:inline-flex;\n align-items:center;\n justify-content:center;\n gap:10px;\n padding:17px 34px;\n border-radius:var(--radius);\n font-size:0.9375rem;\n font-weight:500;\n letter-spacing:0.01em;\n transition:transform 0.35s var(--ease), color 0.35s var(--ease);\n white-space:nowrap;\n position:relative;\n overflow:hidden;\n}\n.btn-primary{ background:var(--terracotta); color:var(--white); }\n.btn-primary::before{\n content:\"\";\n position:absolute; inset:0;\n background:#0F4854;\n transform:translateY(101%);\n transition:transform 0.4s var(--ease);\n z-index:0;\n}\n.btn-primary span, .btn-primary{ z-index:1; }\n.btn-primary:hover::before{ transform:translateY(0); }\n.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 32px -14px rgba(177,83,48,0.55); }\n.btn-primary > *{ position:relative; z-index:1; }\n\n.btn-outline{ background:transparent; color:var(--ink); border:1px solid var(--line); }\n.btn-outline:hover{ border-color:var(--terracotta); color:var(--terracotta); transform:translateY(-2px); }\n.section-dark .btn-outline{ color:var(--paper); border-color:rgba(251,248,245,0.28); }\n.section-dark .btn-outline:hover{ border-color:var(--terracotta); color:var(--terracotta); }\n\n.btn-row{ display:flex; gap:16px; flex-wrap:wrap; }\n@media (max-width: 480px){ .btn{ width:100%; padding:18px 24px; } .btn-row{ flex-direction:column; } }\n\n.center-row{ justify-content:center; }\n\n\/* ===================================================================\n HEADER\n =================================================================== *\/\n.site-header{\n position:fixed;\n top:0; left:0; right:0;\n z-index:150;\n padding:26px 0;\n transition:padding 0.4s var(--ease), background 0.4s var(--ease), border-color 0.4s var(--ease), backdrop-filter 0.4s var(--ease);\n border-bottom:1px solid transparent;\n}\n.site-header.is-scrolled{\n padding:16px 0;\n background:rgba(251,248,245,0.82);\n backdrop-filter:blur(10px);\n -webkit-backdrop-filter:blur(10px);\n border-bottom-color:var(--line);\n}\n.site-header .container{ display:flex; align-items:center; justify-content:space-between; }\n.brand{ font-family:var(--font-display); font-size:1.15rem; font-weight:500; color:var(--ink); letter-spacing:0.01em; }\n.header-cta{ font-size:0.875rem; font-weight:500; color:var(--ink); border-bottom:1px solid var(--terracotta); padding-bottom:3px; transition:opacity 0.3s var(--ease); }\n.header-cta:hover{ opacity:0.6; }\n@media (max-width: 560px){ .header-cta span{ display:none; } .header-cta{ border-bottom:none; } }\n\n\/* ===================================================================\n HERO \u2014 CENTRALIZADO\n =================================================================== *\/\n.hero{\n position:relative;\n min-height:100vh;\n display:flex;\n align-items:center;\n justify-content:center;\n padding:140px 0 100px;\n overflow:hidden;\n text-align:center;\n}\n\n.hero-art{\n position:absolute;\n inset:0;\n z-index:0;\n display:flex;\n align-items:center;\n justify-content:center;\n opacity:0;\n animation:fadeIn 1.6s var(--ease) forwards;\n animation-delay:0.2s;\n transition:transform 0.4s cubic-bezier(.2,.6,.3,1);\n will-change:transform;\n}\n@keyframes fadeIn{ to{ opacity:1; } }\n\n.hero-art svg{ width:min(1100px, 130vw); height:auto; }\n.hero-art .draw{\n stroke-dasharray:1400;\n stroke-dashoffset:1400;\n animation:draw 2.6s var(--ease) forwards;\n}\n@keyframes draw{ to{ stroke-dashoffset:0; } }\n\n.hero-ring{\n position:absolute;\n width:560px; height:560px;\n border:1px solid var(--line-soft);\n border-radius:50%;\n animation:ringSpin 160s linear infinite;\n}\n.hero-ring::before{\n content:\"\";\n position:absolute;\n top:-1px; left:50%;\n width:6px; height:6px;\n margin-left:-3px;\n background:var(--terracotta);\n border-radius:50%;\n}\n.hero-ring-pulse{\n position:absolute;\n width:560px; height:560px;\n border:1px solid var(--terracotta);\n border-radius:50%;\n opacity:0;\n animation:ringPulse 5s var(--ease) infinite;\n}\n@keyframes ringPulse{\n 0%{ transform:scale(0.9); opacity:0.45; }\n 70%{ transform:scale(1.18); opacity:0; }\n 100%{ opacity:0; }\n}\n@keyframes ringSpin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }\n@media (max-width: 780px){ .hero-ring, .hero-ring-pulse{ width:340px; height:340px; } }\n@media (prefers-reduced-motion: reduce){ .hero-ring-pulse{ display:none; } }\n\n.hero-content{\n position:relative;\n z-index:2;\n display:flex;\n flex-direction:column;\n align-items:center;\n max-width:720px;\n margin:0 auto;\n}\n\n.hero-kicker{ font-size:0.9375rem; color:var(--teal); font-weight:500; margin-bottom:22px; }\n\n.hero h1{\n font-size:clamp(2.4rem, 6vw, 4.4rem);\n font-weight:500;\n max-width:14ch;\n}\n.hero h1 .word{ display:inline-block; opacity:0; transform:translateY(18px); animation:wordIn 0.9s var(--ease) forwards; }\n@keyframes wordIn{ to{ opacity:1; transform:translateY(0); } }\n\n.hero-sub{\n margin-top:26px;\n font-size:1.0625rem;\n color:var(--teal);\n max-width:40ch;\n line-height:1.7;\n opacity:0;\n animation:fadeUp 0.9s var(--ease) forwards;\n animation-delay:0.75s;\n}\n\n.hero-meta{\n margin-top:36px;\n display:flex;\n align-items:center;\n justify-content:center;\n gap:20px;\n flex-wrap:wrap;\n opacity:0;\n animation:fadeUp 0.9s var(--ease) forwards;\n animation-delay:0.95s;\n}\n.hero-meta span{ font-size:0.8125rem; color:var(--teal); position:relative; padding-left:20px; }\n.hero-meta span::before{ content:\"\"; position:absolute; left:0; top:50%; width:11px; height:1px; background:var(--clay); transform:translateY(-50%); }\n.hero-meta span:first-child{ padding-left:0; }\n.hero-meta span:first-child::before{ display:none; }\n\n.hero-actions{ margin-top:46px; opacity:0; animation:fadeUp 0.9s var(--ease) forwards; animation-delay:1.15s; }\n\n@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }\n\n.scroll-cue{\n position:absolute;\n bottom:36px; left:50%;\n transform:translateX(-50%);\n z-index:2;\n display:flex;\n flex-direction:column;\n align-items:center;\n gap:8px;\n opacity:0;\n animation:fadeUp 0.9s var(--ease) forwards;\n animation-delay:1.4s;\n}\n.scroll-cue .line{ width:1px; height:34px; background:linear-gradient(var(--clay), transparent); animation:cuePulse 2.4s var(--ease) infinite; }\n@keyframes cuePulse{ 0%,100%{ opacity:0.3; } 50%{ opacity:1; } }\n@media (max-width: 640px){ .scroll-cue{ display:none; } }\n\n\/* ===================================================================\n DIVISOR ANIMADO ENTRE SE\u00c7\u00d5ES\n =================================================================== *\/\n.line-reveal{\n height:1px;\n width:0%;\n background:var(--line);\n margin:0 auto;\n transition:width 1.1s var(--ease);\n}\n.line-reveal.is-visible{ width:100%; }\n\n\/* ===================================================================\n SOBRE \u2014 CENTRALIZADO\n =================================================================== *\/\n.about-inner{\n max-width:700px;\n margin:0 auto;\n text-align:center;\n}\n.about-inner h2{ font-size:clamp(1.9rem, 3.6vw, 2.7rem); max-width:16ch; margin:0 auto 34px; }\n.about-inner p{ font-size:1.0625rem; color:var(--teal); margin-bottom:22px; max-width:56ch; margin-left:auto; margin-right:auto; }\n\n.about-quote{ margin:44px auto 0; max-width:480px; }\n.about-quote .line-reveal{ margin-bottom:26px; }\n.about-quote p{ font-family:var(--font-display); font-style:italic; font-size:1.5rem; color:var(--ink); line-height:1.45; }\n.about-quote .line-reveal.bottom{ margin-top:26px; margin-bottom:0; }\n\n.about-credentials{\n margin-top:44px;\n display:flex;\n justify-content:center;\n flex-wrap:wrap;\n gap:0;\n}\n.about-credentials .cred{\n font-size:0.85rem;\n color:var(--teal);\n padding:0 22px;\n border-left:1px solid var(--line);\n}\n.about-credentials .cred:first-child{ border-left:none; }\n@media (max-width: 560px){\n .about-credentials{ flex-direction:column; gap:10px; }\n .about-credentials .cred{ border-left:none; padding:0; }\n}\n\n\/* ===================================================================\n O QUE VOC\u00ca PROCURA\n =================================================================== *\/\n.choice-head{ text-align:center; max-width:640px; margin:0 auto 64px; }\n.choice-head h2{ font-size:clamp(1.9rem, 3.6vw, 2.75rem); }\n.choice-head p{ margin-top:18px; font-size:1.0625rem; color:var(--teal); }\n\n.choice-wrap{\n max-width:960px;\n margin:0 auto;\n border:1px solid var(--line);\n border-radius:10px;\n overflow:hidden;\n background:var(--paper);\n box-shadow:0 40px 70px -46px rgba(6,45,62,0.28);\n}\n\n.choice-grid{\n display:grid;\n grid-template-columns:1fr 1fr;\n}\n@media (max-width: 820px){ .choice-grid{ grid-template-columns:1fr; } }\n\n\/* op\u00e7\u00e3o discreta \u2014 \"Quero vender meu im\u00f3vel\" *\/\n.choice-sell{\n border-top:1px solid var(--line);\n background:var(--paper-dim);\n}\n.choice-sell-btn{\n width:100%;\n padding:26px 40px;\n display:flex;\n flex-direction:column;\n align-items:center;\n text-align:center;\n gap:7px;\n transition:background 0.35s var(--ease);\n}\n.choice-sell-btn:hover{ background:rgba(177,83,48,0.06); }\n.choice-sell-title{\n font-family:var(--font-display);\n font-size:1.05rem;\n color:var(--ink);\n transition:color 0.3s var(--ease);\n display:inline-flex;\n align-items:center;\n gap:9px;\n}\n.choice-sell-title::before{\n content:\"\";\n width:5px; height:5px;\n border-radius:50%;\n background:var(--terracotta);\n flex-shrink:0;\n}\n.choice-sell-btn:hover .choice-sell-title{ color:var(--terracotta); }\n.choice-sell-sub{\n font-size:0.85rem;\n color:var(--teal);\n max-width:44ch;\n}\n@media (max-width: 640px){ .choice-sell-btn{ padding:22px 26px; } }\n\n.choice-panel{\n padding:58px 46px;\n position:relative;\n transition:background 0.4s var(--ease);\n text-align:center;\n width:100%;\n display:flex;\n flex-direction:column;\n align-items:center;\n}\n.choice-panel:first-child{ border-right:1px solid var(--line); }\n@media (max-width: 820px){ .choice-panel:first-child{ border-right:none; border-bottom:1px solid var(--line); } }\n.choice-panel:hover{ background:var(--paper-dim); }\n\n.choice-panel::before,.choice-panel::after{\n content:\"\";\n position:absolute;\n width:16px; height:16px;\n border-top:1px solid transparent;\n border-left:1px solid transparent;\n transition:border-color 0.4s var(--ease), width 0.4s var(--ease), height 0.4s var(--ease);\n top:14px; left:14px;\n}\n.choice-panel::after{ top:auto; left:auto; bottom:14px; right:14px; border-top:none; border-left:none; border-bottom:1px solid transparent; border-right:1px solid transparent; }\n.choice-panel:hover::before,.choice-panel:hover::after{ border-color:var(--terracotta); width:22px; height:22px; }\n\n.choice-num{ font-family:var(--font-display); font-size:0.9rem; color:var(--clay); margin-bottom:26px; }\n.choice-panel h3{ font-size:1.6rem; margin-bottom:14px; }\n.choice-panel p{ color:var(--teal); font-size:0.98rem; max-width:34ch; margin-bottom:28px; }\n.choice-link{ font-size:0.9rem; font-weight:500; color:var(--terracotta); display:inline-flex; align-items:center; gap:8px; transition:gap 0.35s var(--ease); }\n.choice-panel:hover .choice-link{ gap:12px; }\n@media (max-width: 640px){ .choice-panel{ padding:44px 26px; } }\n\n\/* ===================================================================\n QUESTION\u00c1RIO (MODAL)\n =================================================================== *\/\n.quiz-overlay{ position:fixed; inset:0; background:var(--paper); z-index:300; display:none; opacity:0; transition:opacity 0.4s var(--ease); }\n.quiz-overlay.is-open{ display:block; opacity:1; }\n.quiz-progress-track{ position:absolute; top:0; left:0; right:0; height:2px; background:var(--line-soft); }\n.quiz-progress-fill{ height:100%; background:var(--terracotta); width:0%; transition:width 0.5s var(--ease); }\n.quiz-close{ position:absolute; top:30px; right:28px; z-index:5; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; transition:background 0.3s var(--ease); }\n.quiz-close:hover{ background:var(--paper-dim); }\n.quiz-back{ position:absolute; top:30px; left:28px; z-index:5; font-size:0.875rem; color:var(--teal); padding:8px 4px; visibility:hidden; }\n.quiz-back.is-visible{ visibility:visible; }\n.quiz-wrap{ height:100%; display:flex; align-items:center; justify-content:center; padding:100px 28px 60px; overflow-y:auto; }\n.quiz-step{ width:100%; max-width:560px; display:none; }\n.quiz-step.is-active{ display:block; animation:stepIn 0.5s var(--ease); }\n@keyframes stepIn{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:translateY(0); } }\n.quiz-step-count{ font-size:0.8125rem; color:var(--clay); margin-bottom:16px; }\n.quiz-question{ font-size:clamp(1.5rem, 3.4vw, 2.1rem); margin-bottom:38px; max-width:16ch; }\n.quiz-input{ width:100%; padding:16px 0; font-family:var(--font-body); font-size:1.125rem; color:var(--ink); background:transparent; border:none; border-bottom:1px solid var(--line); transition:border-color 0.3s var(--ease); }\n.quiz-input::placeholder{ color:var(--clay); }\n.quiz-input:focus{ border-color:var(--terracotta); outline:none; }\n.quiz-options{ display:flex; flex-direction:column; gap:0; }\n.quiz-option{ padding:19px 4px; text-align:left; border-bottom:1px solid var(--line); font-size:1.0625rem; color:var(--teal); display:flex; align-items:center; justify-content:space-between; transition:color 0.3s var(--ease), padding-left 0.3s var(--ease); }\n.quiz-option:hover{ color:var(--ink); padding-left:10px; }\n.quiz-option.is-selected{ color:var(--terracotta); font-weight:500; }\n.quiz-option .mark{ width:7px; height:7px; border-radius:50%; border:1px solid var(--clay); flex-shrink:0; transition:background 0.25s var(--ease), border-color 0.25s var(--ease); }\n.quiz-option.is-selected .mark{ background:var(--terracotta); border-color:var(--terracotta); }\n.quiz-actions{ margin-top:44px; display:flex; gap:14px; }\n.quiz-hint{ margin-top:14px; font-size:0.85rem; color:var(--clay); }\n.quiz-summary-list{ display:flex; flex-direction:column; margin-bottom:36px; }\n.quiz-summary-row{ display:flex; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid var(--line-soft); font-size:0.98rem; }\n.quiz-summary-row .label{ color:var(--clay); }\n.quiz-summary-row .value{ color:var(--ink); font-weight:500; text-align:right; }\n\n\/* ===================================================================\n COMO FUNCIONA \u2014 CENTRALIZADO COM LINHA DE CONEX\u00c3O\n =================================================================== *\/\n.steps-head{ text-align:center; margin-bottom:64px; }\n.steps-head h2{ font-size:clamp(1.8rem,3vw,2.4rem); }\n\n.steps-row{ position:relative; display:grid; grid-template-columns:repeat(3, 1fr); max-width:900px; margin:0 auto; }\n.steps-connector{ position:absolute; top:11px; left:8%; right:8%; height:1px; background:var(--line); z-index:0; }\n.steps-connector-fill{ position:absolute; top:0; left:0; height:100%; width:0%; background:var(--terracotta); transition:width 1.6s var(--ease); }\n@media (max-width: 780px){ .steps-connector{ display:none; } }\n\n.step-item{ position:relative; z-index:1; text-align:center; padding:0 20px; }\n.step-num{\n width:22px; height:22px;\n margin:0 auto 20px;\n border-radius:50%;\n background:var(--paper);\n border:1px solid var(--terracotta);\n color:var(--terracotta);\n font-family:var(--font-display);\n font-size:0.75rem;\n display:flex; align-items:center; justify-content:center;\n}\n.step-item p{ font-size:1.0625rem; color:var(--ink); max-width:22ch; margin:0 auto; }\n@media (max-width: 780px){\n .steps-row{ grid-template-columns:1fr; gap:38px; }\n}\n\n\/* ===================================================================\n CTA FINAL\n =================================================================== *\/\n.cta-final{ text-align:center; padding:140px 0; position:relative; }\n.cta-final h2{ font-size:clamp(2.1rem, 5vw, 3.4rem); max-width:16ch; margin:0 auto 44px; }\n.cta-final .btn-row{ justify-content:center; }\n.cta-arch{ position:absolute; left:50%; top:0; transform:translateX(-50%); width:900px; max-width:90vw; height:100%; opacity:0.12; pointer-events:none; }\n\n\/* ===================================================================\n FOOTER\n =================================================================== *\/\n.site-footer{ padding:56px 0; border-top:1px solid var(--line); text-align:center; }\n.footer-brand p{ font-family:var(--font-display); font-size:1.05rem; margin-bottom:6px; }\n.footer-brand span{ display:block; font-size:0.85rem; color:var(--teal); }\n.footer-credentials{ display:flex; justify-content:center; gap:26px; font-size:0.85rem; color:var(--teal); margin-top:22px; }\n.footer-social{ display:flex; justify-content:center; gap:18px; margin-top:26px; }\n.footer-social a{ width:36px; height:36px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:border-color 0.3s var(--ease), transform 0.3s var(--ease); }\n.footer-social a:hover{ border-color:var(--terracotta); transform:translateY(-2px); }\n@media (max-width: 640px){ .footer-credentials{ flex-direction:column; gap:8px; } }\n\n\/* ===================================================================\n REVEAL ON SCROLL\n =================================================================== *\/\n.reveal{ opacity:0; transform:translateY(22px); transition:opacity 0.8s var(--ease), transform 0.8s var(--ease); }\n.reveal.is-visible{ opacity:1; transform:translateY(0); }\n<\/style>\n<\/head>\n<body>\n\n<div class=\"scroll-progress\" id=\"scrollProgress\"><\/div>\n\n<svg class=\"grain\" aria-hidden=\"true\">\n <filter id=\"noiseFilter\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.8\" numOctaves=\"2\" stitchTiles=\"stitch\"\/><\/filter>\n <rect width=\"100%\" height=\"100%\" filter=\"url(#noiseFilter)\"\/>\n<\/svg>\n\n<!-- =====================================================================\n HEADER\n ===================================================================== -->\n<header class=\"site-header\" id=\"siteHeader\">\n <div class=\"container\">\n <div class=\"brand\">Maristela Angotti<\/div>\n <a href=\"#\" class=\"header-cta\" id=\"headerWhatsapp\">Falar com Maristela <span>\u2192 WhatsApp<\/span><\/a>\n <\/div>\n<\/header>\n\n<!-- =====================================================================\n HERO \u2014 CENTRALIZADO\n ===================================================================== -->\n<section class=\"hero\" id=\"hero\">\n <div class=\"blob blob-teal\" style=\"width:480px;height:480px; top:-120px; left:-120px;\" aria-hidden=\"true\"><\/div>\n <div class=\"blob blob-terracotta\" style=\"width:420px;height:420px; bottom:-140px; right:-100px;\" aria-hidden=\"true\"><\/div>\n <div class=\"blob blob-clay\" style=\"width:320px;height:320px; top:40%; right:6%;\" aria-hidden=\"true\"><\/div>\n\n <div class=\"hero-art\" id=\"heroArt\" aria-hidden=\"true\">\n <div class=\"hero-ring\"><\/div>\n <div class=\"hero-ring-pulse\"><\/div>\n <svg viewBox=\"0 0 900 620\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <path class=\"draw\" d=\"M120 560 L120 260 A330 330 0 0 1 780 260 L780 560\" fill=\"none\" stroke=\"#25535B\" stroke-width=\"1\" opacity=\"0.5\"\/>\n <path class=\"draw\" d=\"M220 560 L220 340 A230 230 0 0 1 680 340 L680 560\" fill=\"none\" stroke=\"#25535B\" stroke-width=\"1\" opacity=\"0.32\" style=\"animation-delay:0.3s\"\/>\n <line x1=\"60\" y1=\"560\" x2=\"840\" y2=\"560\" stroke=\"#062D3E\" stroke-width=\"1\" opacity=\"0.45\"\/>\n <line x1=\"450\" y1=\"560\" x2=\"450\" y2=\"60\" stroke=\"#C9AFA5\" stroke-width=\"1\" opacity=\"0.4\" stroke-dasharray=\"2 7\"\/>\n <circle cx=\"450\" cy=\"560\" r=\"4\" fill=\"#B15330\"\/>\n <path class=\"draw\" d=\"M540 130 A90 90 0 0 1 720 130\" fill=\"none\" stroke=\"#B15330\" stroke-width=\"1.3\" opacity=\"0.55\" style=\"animation-delay:0.6s\"\/>\n <rect x=\"380\" y=\"440\" width=\"140\" height=\"120\" fill=\"none\" stroke=\"#062D3E\" stroke-width=\"0.75\" opacity=\"0.22\"\/>\n <\/svg>\n <\/div>\n\n <div class=\"hero-content\">\n <div class=\"hero-kicker\">Maristela Angotti<\/div>\n <h1 id=\"heroTitle\">Seu pr\u00f3ximo im\u00f3vel come\u00e7a com uma boa conversa.<\/h1>\n <p class=\"hero-sub\">Atendimento pr\u00f3ximo, escolhas personalizadas e uma busca pensada para encontrar o im\u00f3vel que realmente combina com o seu momento.<\/p>\n\n <div class=\"hero-meta\">\n <span>Corretora de im\u00f3veis em Araraquara<\/span>\n <span>Especialista Perplan<\/span>\n <span>Teedwork<\/span>\n <\/div>\n\n <div class=\"hero-actions btn-row center-row\">\n <button class=\"btn btn-primary\" id=\"findPropertyBtn\"><span>Encontrar meu im\u00f3vel<\/span><\/button>\n <button class=\"btn btn-outline\" id=\"talkToMaristelaBtn\">Falar com Maristela<\/button>\n <\/div>\n <\/div>\n\n <div class=\"scroll-cue\" aria-hidden=\"true\"><div class=\"line\"><\/div><\/div>\n<\/section>\n\n<div class=\"marquee-band\" aria-hidden=\"true\">\n <div class=\"marquee-track\" id=\"marqueeTrack\"><\/div>\n<\/div>\n\n<!-- =====================================================================\n SOBRE \u2014 CENTRALIZADO\n ===================================================================== -->\n<section class=\"section\" id=\"sobre\">\n <div class=\"blob blob-clay\" style=\"width:380px;height:380px; top:-60px; right:-140px; opacity:0.5;\" aria-hidden=\"true\"><\/div>\n <div class=\"corner-marks\" aria-hidden=\"true\"><span class=\"tl\"><\/span><span class=\"tr\"><\/span><\/div>\n <div class=\"container about-inner\">\n <h2 class=\"reveal\">Experi\u00eancia que aproxima voc\u00ea do im\u00f3vel certo.<\/h2>\n <p class=\"reveal\">Maristela Angotti atua no mercado imobili\u00e1rio de Araraquara, no interior de S\u00e3o Paulo, com experi\u00eancia em diferentes perfis de im\u00f3veis e atendimento personalizado.<\/p>\n <p class=\"reveal\">Integrando a Teedwork e como especialista Perplan, acompanha cada cliente de forma pr\u00f3xima, buscando entender necessidades, estilo de vida e prioridades antes de apresentar as melhores possibilidades.<\/p>\n <p class=\"reveal\">Com conhecimento do mercado da regi\u00e3o e diferentes op\u00e7\u00f5es de im\u00f3veis, seu objetivo \u00e9 tornar cada busca mais simples, personalizada e segura.<\/p>\n\n <div class=\"about-quote reveal\">\n <div class=\"line-reveal\"><\/div>\n <p>Mais do que encontrar um im\u00f3vel. Encontrar o lugar certo.<\/p>\n <div class=\"line-reveal bottom\"><\/div>\n <\/div>\n\n <div class=\"about-credentials reveal\">\n <div class=\"cred\">Corretora de im\u00f3veis \u2014 Araraquara, SP<\/div>\n <div class=\"cred\">Especialista Perplan<\/div>\n <div class=\"cred\">Atua\u00e7\u00e3o via Teedwork<\/div>\n <\/div>\n <\/div>\n<\/section>\n\n<!-- =====================================================================\n O QUE VOC\u00ca PROCURA\n ===================================================================== -->\n<section class=\"section section-dim\" id=\"procura\">\n <div class=\"container\">\n <div class=\"choice-head reveal\">\n <h2>O que voc\u00ea procura?<\/h2>\n <p>Conte um pouco sobre o im\u00f3vel que voc\u00ea deseja. Eu cuido do restante.<\/p>\n <\/div>\n\n <div class=\"choice-wrap reveal\">\n <div class=\"choice-grid\">\n <button class=\"choice-panel\" id=\"panelTalk\">\n <div class=\"choice-num\">01<\/div>\n <h3>Falar com Maristela<\/h3>\n <p>Prefere conversar diretamente? Inicie agora seu atendimento pelo WhatsApp.<\/p>\n <span class=\"choice-link\">Iniciar conversa <span aria-hidden=\"true\">\u2192<\/span><\/span>\n <\/button>\n <button class=\"choice-panel\" id=\"panelFind\">\n <div class=\"choice-num\">02<\/div>\n <h3>Encontrar meu im\u00f3vel<\/h3>\n <p>Responda algumas perguntas r\u00e1pidas e receba um atendimento sob medida.<\/p>\n <span class=\"choice-link\">Come\u00e7ar agora <span aria-hidden=\"true\">\u2192<\/span><\/span>\n <\/button>\n <\/div>\n <div class=\"choice-sell\">\n <button class=\"choice-sell-btn\" id=\"panelSell\">\n <span class=\"choice-sell-title\">Quero vender meu im\u00f3vel<\/span>\n <span class=\"choice-sell-sub\">Est\u00e1 pensando em vender? Fale com Maristela e apresente seu im\u00f3vel.<\/span>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n<!-- =====================================================================\n COMO FUNCIONA\n ===================================================================== -->\n<section class=\"section\" id=\"comofunciona\">\n <div class=\"container\">\n <div class=\"steps-head reveal\"><h2>Como funciona<\/h2><\/div>\n <div class=\"steps-row reveal\" id=\"stepsRow\">\n <div class=\"steps-connector\"><div class=\"steps-connector-fill\" id=\"stepsFill\"><\/div><\/div>\n <div class=\"step-item\"><div class=\"step-num\">01<\/div><p>Voc\u00ea conta o que procura<\/p><\/div>\n <div class=\"step-item\"><div class=\"step-num\">02<\/div><p>Maristela entende sua busca<\/p><\/div>\n <div class=\"step-item\"><div class=\"step-num\">03<\/div><p>As melhores possibilidades s\u00e3o apresentadas<\/p><\/div>\n <\/div>\n <\/div>\n<\/section>\n\n<!-- =====================================================================\n CTA FINAL\n ===================================================================== -->\n<section class=\"section-dark\" style=\"position:relative; overflow:hidden;\">\n <div class=\"blob blob-terracotta\" style=\"width:460px;height:460px; top:-160px; left:50%; margin-left:-460px; opacity:0.5;\" aria-hidden=\"true\"><\/div>\n <div class=\"blob blob-clay\" style=\"width:360px;height:360px; bottom:-140px; right:4%; opacity:0.25;\" aria-hidden=\"true\"><\/div>\n <div class=\"container cta-final\">\n <svg class=\"cta-arch\" viewBox=\"0 0 900 500\" aria-hidden=\"true\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <path d=\"M150 480 L150 220 A300 300 0 0 1 750 220 L750 480\" fill=\"none\" stroke=\"#C9AFA5\" stroke-width=\"1\"\/>\n <line x1=\"450\" y1=\"480\" x2=\"450\" y2=\"40\" stroke=\"#C9AFA5\" stroke-width=\"1\" stroke-dasharray=\"2 8\"\/>\n <\/svg>\n <h2 class=\"reveal\">Seu pr\u00f3ximo endere\u00e7o pode come\u00e7ar aqui.<\/h2>\n <div class=\"btn-row center-row reveal\">\n <button class=\"btn btn-primary\" id=\"ctaFindBtn\"><span>Encontrar meu im\u00f3vel<\/span><\/button>\n <button class=\"btn btn-outline\" id=\"ctaTalkBtn\">Falar com Maristela<\/button>\n <\/div>\n <\/div>\n<\/section>\n\n<!-- =====================================================================\n FOOTER\n ===================================================================== -->\n<footer class=\"site-footer\">\n <div class=\"container\">\n <div class=\"footer-brand\">\n <p>Maristela Angotti<\/p>\n <span>Corretora de im\u00f3veis \u2014 Araraquara, SP<\/span>\n <\/div>\n <div class=\"footer-credentials\">\n <span>Especialista Perplan<\/span>\n <span>Teedwork<\/span>\n <\/div>\n <div class=\"footer-social\">\n <a href=\"#\" id=\"footerWhatsapp\" aria-label=\"WhatsApp\">\n <svg width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#062D3E\" stroke-width=\"1.6\"><path d=\"M20.5 11.9c0 4.9-4 8.9-8.9 8.9-1.6 0-3-.4-4.3-1.1L3 21l1.4-4.1a8.8 8.8 0 0 1-1.3-4.6c0-4.9 4-8.9 8.9-8.9s8.9 4 8.9 8.9z\"\/><path d=\"M8.5 8.7c.2-.5.5-.5.8-.5h.6c.2 0 .5 0 .7.5.2.6.7 1.9.8 2 .1.2.1.4 0 .6-.1.2-.2.3-.4.5-.2.2-.4.4-.2.7.2.4 .9 1.4 1.9 2.2 1.3 1 2.3 1.4 2.6 1.5.3.1.5.1.7-.1.2-.2.7-.8.9-1.1.2-.3.4-.2.6-.1.2.1 1.6.8 1.9.9.3.1.5.2.5.4 0 .2 0 1-.4 1.4-.4.4-1.1.8-2 .8-.9 0-2.4-.3-4.5-1.8-2.5-1.8-4-4.1-4.2-4.5-.2-.4-1.1-1.7-1.1-3.2 0-1.5.8-2.2 1.1-2.5z\" fill=\"#062D3E\" stroke=\"none\"\/><\/svg>\n <\/a>\n <a href=\"https:\/\/instagram.com\" target=\"_blank\" rel=\"noopener\" aria-label=\"Instagram\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#062D3E\" stroke-width=\"1.6\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"5\"\/><circle cx=\"12\" cy=\"12\" r=\"4\"\/><circle cx=\"17.2\" cy=\"6.8\" r=\"1\"\/><\/svg>\n <\/a>\n <\/div>\n <\/div>\n<\/footer>\n\n<!-- =====================================================================\n QUESTION\u00c1RIO \u2014 \"ENCONTRAR MEU IM\u00d3VEL\"\n ===================================================================== -->\n<div class=\"quiz-overlay\" id=\"quizOverlay\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Encontrar meu im\u00f3vel\">\n <div class=\"quiz-progress-track\"><div class=\"quiz-progress-fill\" id=\"quizProgress\"><\/div><\/div>\n <button class=\"quiz-back\" id=\"quizBack\" aria-label=\"Voltar\">\u2190 Voltar<\/button>\n <button class=\"quiz-close\" id=\"quizClose\" aria-label=\"Fechar\">\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#062D3E\" stroke-width=\"1.6\"><path d=\"M5 5l14 14M19 5L5 19\"\/><\/svg>\n <\/button>\n <div class=\"quiz-wrap\"><div id=\"quizSteps\"><\/div><\/div>\n<\/div>\n\n<script>\n(function(){\n \"use strict\";\n\n \/* ===================================================================\n CONFIGURA\u00c7\u00c3O \u2014 ALTERE O N\u00daMERO DE WHATSAPP AQUI\n =================================================================== *\/\n const WHATSAPP_NUMBER = \"5516997997232\"; \/\/ Maristela Angotti \u2014 +55 16 99799-7232\n\n function openWhatsApp(message){\n const url = \"https:\/\/wa.me\/\" + WHATSAPP_NUMBER + \"?text=\" + encodeURIComponent(message);\n window.open(url, \"_blank\", \"noopener\");\n }\n\n const DEFAULT_MESSAGE = \"Ol\u00e1, Maristela! Gostaria de falar com voc\u00ea sobre im\u00f3veis.\";\n\n document.querySelectorAll(\"#headerWhatsapp, #talkToMaristelaBtn, #panelTalk, #ctaTalkBtn, #footerWhatsapp\").forEach(function(el){\n el.addEventListener(\"click\", function(e){\n e.preventDefault();\n openWhatsApp(DEFAULT_MESSAGE);\n });\n });\n\n const SELL_MESSAGE = \"Ol\u00e1, Maristela! Gostaria de conversar com voc\u00ea sobre a venda do meu im\u00f3vel.\";\n const panelSell = document.getElementById(\"panelSell\");\n if(panelSell){\n panelSell.addEventListener(\"click\", function(e){\n e.preventDefault();\n openWhatsApp(SELL_MESSAGE);\n });\n }\n\n \/* ===================================================================\n HEADER \u2014 MUDA APAR\u00caNCIA AO ROLAR\n =================================================================== *\/\n const header = document.getElementById(\"siteHeader\");\n const scrollProgress = document.getElementById(\"scrollProgress\");\n let ticking = false;\n function onScroll(){\n if(!ticking){\n window.requestAnimationFrame(function(){\n header.classList.toggle(\"is-scrolled\", window.scrollY > 40);\n const docHeight = document.documentElement.scrollHeight - window.innerHeight;\n const pct = docHeight > 0 ? (window.scrollY \/ docHeight) * 100 : 0;\n scrollProgress.style.width = pct + \"%\";\n ticking = false;\n });\n ticking = true;\n }\n }\n window.addEventListener(\"scroll\", onScroll, { passive:true });\n onScroll();\n\n \/* ===================================================================\n FAIXA MARQUEE \u2014 TIPOS DE IM\u00d3VEL\n =================================================================== *\/\n (function(){\n const track = document.getElementById(\"marqueeTrack\");\n if(!track) return;\n const items = [\"Casas\",\"Apartamentos\",\"Terrenos\",\"Condom\u00ednios\",\"Alto padr\u00e3o\",\"Araraquara e regi\u00e3o\"];\n function buildSet(){\n return items.map(function(label){\n return '<span class=\"marquee-item\">' + label + '<span class=\"sep\" aria-hidden=\"true\"><\/span><\/span>';\n }).join(\"\");\n }\n \/\/ duplicado para loop cont\u00ednuo (translateX -50%)\n track.innerHTML = buildSet() + buildSet();\n })();\n\n \/* ===================================================================\n HERO \u2014 PARALAXE SUAVE COM O CURSOR (desktop)\n =================================================================== *\/\n (function(){\n const heroArt = document.getElementById(\"heroArt\");\n if(!heroArt) return;\n const isTouch = window.matchMedia(\"(pointer: coarse)\").matches;\n const reduced = window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n if(isTouch || reduced) return;\n const hero = document.getElementById(\"hero\");\n let raf = null;\n hero.addEventListener(\"mousemove\", function(e){\n const rect = hero.getBoundingClientRect();\n const x = ((e.clientX - rect.left) \/ rect.width - 0.5) * 2;\n const y = ((e.clientY - rect.top) \/ rect.height - 0.5) * 2;\n if(raf) return;\n raf = window.requestAnimationFrame(function(){\n heroArt.style.transform = \"translate(\" + (x * 12) + \"px, \" + (y * 10) + \"px)\";\n raf = null;\n });\n });\n hero.addEventListener(\"mouseleave\", function(){\n heroArt.style.transform = \"translate(0,0)\";\n });\n })();\n\n \/* ===================================================================\n HERO \u2014 PALAVRAS APARECENDO\n =================================================================== *\/\n (function(){\n const el = document.getElementById(\"heroTitle\");\n const text = el.textContent.trim();\n const words = text.split(\" \");\n el.innerHTML = words.map(function(w, i){\n return '<span class=\"word\" style=\"animation-delay:' + (0.15 + i*0.07).toFixed(2) + 's\">' + w + ' <\/span>';\n }).join(\"\");\n })();\n\n \/* ===================================================================\n REVEAL ON SCROLL (inclui linhas e conector de \"Como funciona\")\n =================================================================== *\/\n const revealEls = document.querySelectorAll(\".reveal, .line-reveal\");\n const stepsFill = document.getElementById(\"stepsFill\");\n if(\"IntersectionObserver\" in window){\n const io = new IntersectionObserver(function(entries){\n entries.forEach(function(entry){\n if(entry.isIntersecting){\n entry.target.classList.add(\"is-visible\");\n if(entry.target.id === \"stepsRow\" && stepsFill){\n window.setTimeout(function(){ stepsFill.style.width = \"100%\"; }, 200);\n }\n io.unobserve(entry.target);\n }\n });\n }, { threshold: 0.2, rootMargin: \"0px 0px -60px 0px\" });\n revealEls.forEach(function(el){ io.observe(el); });\n const stepsRow = document.getElementById(\"stepsRow\");\n if(stepsRow) io.observe(stepsRow);\n } else {\n revealEls.forEach(function(el){ el.classList.add(\"is-visible\"); });\n if(stepsFill) stepsFill.style.width = \"100%\";\n }\n\n \/* ===================================================================\n QUESTION\u00c1RIO \u2014 \"ENCONTRAR MEU IM\u00d3VEL\"\n =================================================================== *\/\n const questions = [\n { id: \"nome\", type: \"text\", question: \"Como voc\u00ea se chama?\", placeholder: \"Seu nome\" },\n { id: \"tipo\", type: \"choice\", question: \"O que voc\u00ea procura?\", options: [\"Casa\",\"Apartamento\",\"Terreno\",\"Condom\u00ednio\",\"Outro\"] },\n { id: \"cidade\", type: \"text\", question: \"Em qual cidade ou regi\u00e3o?\", placeholder: \"Ex: Araraquara\" },\n { id: \"quartos\", type: \"choice\", question: \"Quantos quartos voc\u00ea procura?\", options: [\"1\",\"2\",\"3\",\"4 ou mais\",\"N\u00e3o \u00e9 prioridade\"] },\n { id: \"terreno\", type: \"choice\", question: \"Como imagina o terreno ou espa\u00e7o externo?\", options: [\"Pequeno\",\"M\u00e9dio\",\"Grande\",\"N\u00e3o \u00e9 prioridade\"] },\n { id: \"valor\", type: \"choice\", question: \"Qual faixa de valor voc\u00ea considera?\", options: [\"At\u00e9 R$ 300 mil\",\"R$ 300 mil a R$ 500 mil\",\"R$ 500 mil a R$ 800 mil\",\"R$ 800 mil a R$ 1,2 milh\u00e3o\",\"Acima de R$ 1,2 milh\u00e3o\",\"Quero conversar sobre isso\"] },\n { id: \"interesse\", type: \"choice\", question: \"Voc\u00ea procura comprar ou alugar?\", options: [\"Comprar\",\"Alugar\",\"Ainda estou avaliando\"] },\n { id: \"caracteristicas\", type: \"text\", question: \"Existe alguma caracter\u00edstica importante?\", placeholder: \"Ex: condom\u00ednio fechado, piscina, \u00e1rea gourmet... (opcional)\", optional: true }\n ];\n\n const TOTAL = questions.length + 1;\n const state = { current: 0, answers: {} };\n\n const overlay = document.getElementById(\"quizOverlay\");\n const stepsContainer = document.getElementById(\"quizSteps\");\n const progressFill = document.getElementById(\"quizProgress\");\n const backBtn = document.getElementById(\"quizBack\");\n\n function buildSteps(){\n stepsContainer.innerHTML = \"\";\n\n questions.forEach(function(q, index){\n const step = document.createElement(\"div\");\n step.className = \"quiz-step\";\n step.dataset.index = index;\n\n const count = document.createElement(\"div\");\n count.className = \"quiz-step-count\";\n count.textContent = (index + 1) + \" de \" + TOTAL;\n step.appendChild(count);\n\n const title = document.createElement(\"h3\");\n title.className = \"quiz-question\";\n title.textContent = q.question;\n step.appendChild(title);\n\n if(q.type === \"text\"){\n const input = document.createElement(\"input\");\n input.type = \"text\";\n input.className = \"quiz-input\";\n input.placeholder = q.placeholder || \"\";\n input.value = state.answers[q.id] || \"\";\n input.addEventListener(\"input\", function(){\n state.answers[q.id] = input.value;\n updateNextState();\n });\n input.addEventListener(\"keydown\", function(e){\n if(e.key === \"Enter\"){ e.preventDefault(); goNext(); }\n });\n step.appendChild(input);\n if(q.optional){\n const hint = document.createElement(\"div\");\n hint.className = \"quiz-hint\";\n hint.textContent = \"Campo opcional\";\n step.appendChild(hint);\n }\n } else {\n const optionsWrap = document.createElement(\"div\");\n optionsWrap.className = \"quiz-options\";\n q.options.forEach(function(opt){\n const optBtn = document.createElement(\"button\");\n optBtn.type = \"button\";\n optBtn.className = \"quiz-option\";\n if(state.answers[q.id] === opt) optBtn.classList.add(\"is-selected\");\n const label = document.createElement(\"span\");\n label.textContent = opt;\n const mark = document.createElement(\"span\");\n mark.className = \"mark\";\n optBtn.appendChild(label);\n optBtn.appendChild(mark);\n optBtn.addEventListener(\"click\", function(){\n state.answers[q.id] = opt;\n optionsWrap.querySelectorAll(\".quiz-option\").forEach(function(b){ b.classList.remove(\"is-selected\"); });\n optBtn.classList.add(\"is-selected\");\n window.setTimeout(goNext, 260);\n });\n optionsWrap.appendChild(optBtn);\n });\n step.appendChild(optionsWrap);\n }\n\n const actions = document.createElement(\"div\");\n actions.className = \"quiz-actions\";\n if(q.type === \"text\"){\n const nextBtn = document.createElement(\"button\");\n nextBtn.type = \"button\";\n nextBtn.className = \"btn btn-primary quiz-next-btn\";\n nextBtn.innerHTML = \"<span>\" + (index === questions.length - 1 ? \"Ver resumo\" : \"Continuar\") + \"<\/span>\";\n nextBtn.addEventListener(\"click\", goNext);\n actions.appendChild(nextBtn);\n }\n step.appendChild(actions);\n\n stepsContainer.appendChild(step);\n });\n\n const summaryStep = document.createElement(\"div\");\n summaryStep.className = \"quiz-step\";\n summaryStep.dataset.index = questions.length;\n summaryStep.innerHTML =\n '<div class=\"quiz-step-count\">' + TOTAL + ' de ' + TOTAL + '<\/div>' +\n '<h3 class=\"quiz-question\" style=\"max-width:22ch;\">Est\u00e1 tudo certo?<\/h3>' +\n '<div class=\"quiz-summary-list\" id=\"summaryList\"><\/div>' +\n '<div class=\"quiz-actions\">' +\n '<button type=\"button\" class=\"btn btn-primary\" id=\"sendToMaristela\"><span>Enviar para Maristela<\/span><\/button>' +\n '<\/div>';\n stepsContainer.appendChild(summaryStep);\n }\n\n function currentIsValid(){\n const q = questions[state.current];\n if(!q) return true;\n if(q.optional) return true;\n const val = state.answers[q.id];\n return !!(val && val.trim && val.trim().length > 0) || (val && val.length > 0);\n }\n\n function updateNextState(){\n const btn = stepsContainer.querySelector('.quiz-step[data-index=\"' + state.current + '\"] .quiz-next-btn');\n if(btn) btn.style.opacity = currentIsValid() ? \"1\" : \"0.45\";\n }\n\n function labelFor(q, value){ return value || \"\u2014\"; }\n\n function fieldLabels(){\n return {\n nome: \"Nome\",\n tipo: \"Tipo de im\u00f3vel\",\n cidade: \"Cidade \/ regi\u00e3o\",\n quartos: \"Quartos\",\n terreno: \"Terreno \/ espa\u00e7o externo\",\n valor: \"Faixa de valor\",\n interesse: \"Interesse\",\n caracteristicas: \"Prefer\u00eancias adicionais\"\n };\n }\n\n function renderSummary(){\n const list = document.getElementById(\"summaryList\");\n if(!list) return;\n const labels = fieldLabels();\n list.innerHTML = \"\";\n questions.forEach(function(q){\n const val = state.answers[q.id];\n if(q.optional && !val) return;\n const row = document.createElement(\"div\");\n row.className = \"quiz-summary-row\";\n row.innerHTML =\n '<span class=\"label\">' + labels[q.id] + '<\/span>' +\n '<span class=\"value\">' + labelFor(q, val) + '<\/span>';\n list.appendChild(row);\n });\n }\n\n function buildWhatsAppMessage(){\n const a = state.answers;\n const name = a.nome ? a.nome.trim() : \"\";\n let msg = \"Ol\u00e1, Maristela!\\n\\n\";\n msg += name ? (\"Meu nome \u00e9 \" + name + \" e estou procurando um im\u00f3vel.\\n\\n\") : \"Estou procurando um im\u00f3vel.\\n\\n\";\n msg += \"Tipo: \" + (a.tipo || \"\u2014\") + \"\\n\";\n msg += \"Cidade\/regi\u00e3o: \" + (a.cidade || \"\u2014\") + \"\\n\";\n msg += \"Quartos: \" + (a.quartos || \"\u2014\") + \"\\n\";\n msg += \"Terreno\/espa\u00e7o externo: \" + (a.terreno || \"\u2014\") + \"\\n\";\n msg += \"Faixa de valor: \" + (a.valor || \"\u2014\") + \"\\n\";\n msg += \"Interesse: \" + (a.interesse || \"\u2014\") + \"\\n\";\n if(a.caracteristicas && a.caracteristicas.trim().length > 0){\n msg += \"\\nPrefer\u00eancias adicionais:\\n\" + a.caracteristicas.trim() + \"\\n\";\n }\n msg += \"\\nGostaria de conhecer algumas op\u00e7\u00f5es.\";\n return msg;\n }\n\n function goTo(index){\n state.current = index;\n stepsContainer.querySelectorAll(\".quiz-step\").forEach(function(s){\n s.classList.toggle(\"is-active\", parseInt(s.dataset.index, 10) === index);\n });\n progressFill.style.width = (( (index) \/ (TOTAL - 1) ) * 100) + \"%\";\n backBtn.classList.toggle(\"is-visible\", index > 0);\n\n if(index === questions.length){\n renderSummary();\n } else {\n updateNextState();\n const activeInput = stepsContainer.querySelector('.quiz-step[data-index=\"' + index + '\"] input');\n if(activeInput){ window.setTimeout(function(){ activeInput.focus(); }, 350); }\n }\n }\n\n function goNext(){\n if(state.current < questions.length && !currentIsValid()) return;\n if(state.current < TOTAL - 1){ goTo(state.current + 1); }\n }\n function goBack(){\n if(state.current > 0){ goTo(state.current - 1); }\n }\n\n function openQuiz(){\n document.body.style.overflow = \"hidden\";\n overlay.classList.add(\"is-open\");\n state.current = 0;\n goTo(0);\n }\n function closeQuiz(){\n document.body.style.overflow = \"\";\n overlay.classList.remove(\"is-open\");\n }\n\n buildSteps();\n\n document.getElementById(\"quizClose\").addEventListener(\"click\", closeQuiz);\n backBtn.addEventListener(\"click\", goBack);\n document.addEventListener(\"keydown\", function(e){\n if(e.key === \"Escape\" && overlay.classList.contains(\"is-open\")) closeQuiz();\n });\n\n stepsContainer.addEventListener(\"click\", function(e){\n if(e.target && (e.target.id === \"sendToMaristela\" || (e.target.closest && e.target.closest(\"#sendToMaristela\")))){\n openWhatsApp(buildWhatsAppMessage());\n }\n });\n\n document.getElementById(\"findPropertyBtn\").addEventListener(\"click\", openQuiz);\n document.getElementById(\"panelFind\").addEventListener(\"click\", openQuiz);\n document.getElementById(\"ctaFindBtn\").addEventListener(\"click\", openQuiz);\n\n})();\n<\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Maristela Angotti Falar com Maristela \u2192 WhatsApp Maristela Angotti Seu pr\u00f3ximo im\u00f3vel come\u00e7a com uma boa conversa. Atendimento pr\u00f3ximo, escolhas personalizadas e uma busca pensada para encontrar o im\u00f3vel que realmente combina com o seu momento. Corretora de im\u00f3veis em Araraquara Especialista Perplan Teedwork Encontrar meu im\u00f3vel Falar com Maristela Experi\u00eancia que aproxima voc\u00ea do im\u00f3vel certo. Maristela Angotti atua no mercado imobili\u00e1rio de Araraquara, no interior de S\u00e3o Paulo, com experi\u00eancia em diferentes perfis de im\u00f3veis e atendimento personalizado. Integrando a Teedwork e como especialista Perplan, acompanha cada cliente de forma pr\u00f3xima, buscando entender necessidades, estilo de vida e prioridades antes de apresentar as melhores possibilidades. Com conhecimento do mercado da regi\u00e3o e diferentes op\u00e7\u00f5es de im\u00f3veis, seu objetivo \u00e9 tornar cada busca mais simples, personalizada e segura. Mais do que encontrar um im\u00f3vel. Encontrar o lugar certo. Corretora de im\u00f3veis \u2014 Araraquara, SP Especialista Perplan Atua\u00e7\u00e3o via Teedwork O que voc\u00ea procura? Conte um pouco sobre o im\u00f3vel que voc\u00ea deseja. Eu cuido do restante. 01 Falar com Maristela Prefere conversar diretamente? Inicie agora seu atendimento pelo WhatsApp. Iniciar conversa \u2192 02 Encontrar meu im\u00f3vel Responda algumas perguntas r\u00e1pidas e receba um atendimento sob medida. Come\u00e7ar agora \u2192 Quero vender meu im\u00f3vel Est\u00e1 pensando em vender? Fale com Maristela e apresente seu im\u00f3vel. Como funciona 01 Voc\u00ea conta o que procura 02 Maristela entende sua busca 03 As melhores possibilidades s\u00e3o apresentadas Seu pr\u00f3ximo endere\u00e7o pode come\u00e7ar aqui. Encontrar meu im\u00f3vel Falar com Maristela Maristela Angotti Corretora de im\u00f3veis \u2014 Araraquara, SP Especialista Perplan Teedwork \u2190 Voltar<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-99","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/pages\/99","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=99"}],"version-history":[{"count":8,"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/pages\/99\/revisions"}],"predecessor-version":[{"id":107,"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=\/wp\/v2\/pages\/99\/revisions\/107"}],"wp:attachment":[{"href":"https:\/\/newlifefast.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=99"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}