*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}.wrap{width:min(1200px,calc(100% - 72px));margin-inline:auto}.skip{position:absolute;top:-90px;left:16px;background:var(--paper);padding:12px;z-index:10}.skip:focus{top:12px}:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,h3,p{margin-top:0}.demo-notice{min-height:35px;display:flex;justify-content:center;align-items:center;gap:18px;padding:7px 18px;text-align:center;background:var(--ink);color:var(--paper);font-size:10px;font-weight:700;letter-spacing:.12em}.demo-notice a{text-decoration:underline;text-underline-offset:3px}.topbar{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:26px}.brand{font-size:29px;font-weight:700;letter-spacing:-.08em;white-space:nowrap}.brand-mark{color:var(--accent);margin-right:5px}.brand-period{color:var(--accent)}.topbar nav{display:flex;gap:30px;font-size:13px;font-weight:700}.topbar nav a:hover,.subtle-link:hover,.footer a:hover{color:var(--accent)}.top-cta{display:flex;align-items:center;gap:16px;padding:12px 18px;border:1px solid var(--ink);font-size:12px;font-weight:700;white-space:nowrap;transition:background .2s,color .2s}.top-cta:hover{background:var(--ink);color:var(--paper)}.hero{min-height:630px;display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center;padding-block:52px 80px}.hero-copy{position:relative;z-index:1}.eyebrow{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--accent)}.hero h1,.section h2,.promise h2,.final-cta h2{font-family:var(--display);font-size:clamp(52px,5.2vw,78px);font-weight:500;line-height:1.09;letter-spacing:-.055em;margin:24px 0}.hero h1 em,.section h2 em,.promise h2 em,.final-cta h2 em{color:var(--accent);font-style:normal}.hero-copy>p{max-width:480px;line-height:1.75;color:var(--muted);font-size:17px}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:35px}.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:55px;padding:15px 22px;background:var(--accent);color:var(--button-text);font-size:13px;font-weight:700;transition:transform .2s,filter .2s}.btn:hover{transform:translateY(-3px);filter:brightness(1.08)}.subtle-link{font-size:13px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:5px}.hero-micro{display:flex;align-items:center;gap:13px;margin-top:65px;font-size:12px;line-height:1.45;color:var(--muted)}.sparkle{color:var(--accent);font-size:42px;line-height:1}.hero-art{position:relative;min-height:530px;overflow:hidden;isolation:isolate}.ticker{display:flex;justify-content:space-around;align-items:center;gap:18px;overflow:hidden;white-space:nowrap;min-height:70px;padding:16px;background:var(--accent);color:var(--button-text);font-size:12px;font-weight:700;letter-spacing:.17em}.ticker span:nth-child(even){font-size:25px}.section{padding-block:105px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:44px}.section-heading h2{font-size:clamp(43px,4.6vw,65px);margin-bottom:0}.section-heading>p{max-width:380px;color:var(--muted);line-height:1.7;margin:0}.service-grid,.journey-grid,.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.service-grid article{min-height:265px;padding:30px;background:var(--card);display:flex;flex-direction:column;transition:transform .25s}.service-grid article:hover{transform:translateY(-5px)}.service-symbol{color:var(--accent);font-size:13px;font-weight:700;letter-spacing:2px}.service-grid h3{font:600 29px/1.12 var(--display);letter-spacing:-.04em;margin:auto 0 12px}.service-grid p,.journey-grid p,.menu-grid p{color:var(--muted);font-size:14px;line-height:1.65;margin:0}.promise{padding-block:92px;background:var(--ink);color:var(--paper)}.promise-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px 70px;align-items:end}.promise .eyebrow{grid-column:1/-1}.promise h2{margin:0}.promise p{color:var(--promise-muted);line-height:1.7;max-width:390px;margin:0}.btn-light{grid-column:2;justify-self:start;background:var(--paper);color:var(--ink)}.journey-grid{margin-top:45px}.journey-grid>div{border-top:2px solid var(--accent);padding:25px 8px}.journey-grid strong{color:var(--accent);font:500 48px var(--display)}.journey-grid h3{font:600 23px var(--display);margin:38px 0 10px}.faq{background:var(--card)}.faq-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:9%}.faq-grid h2{font-size:clamp(43px,4.5vw,65px)}.faq-grid>div:first-child>p{color:var(--muted);line-height:1.7}.faq-list details{border-bottom:1px solid var(--line);padding:20px 0}.faq-list summary{display:flex;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;font-weight:700}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{color:var(--accent);font-size:21px}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details p{color:var(--muted);line-height:1.65;max-width:510px}.final-cta{padding:105px 0;background:var(--final-bg);color:var(--final-ink)}.final-cta h2{max-width:850px}.final-cta p{max-width:520px;color:var(--final-muted);line-height:1.7}.footer{min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer>span{font-size:21px;font-weight:700}.footer small{font:700 10px 'DM Sans',sans-serif;letter-spacing:.12em;color:var(--muted);margin-left:12px}.footer a{font-size:12px;font-weight:700}
/* Dental: warm clinical calm, tactile illustration rather than stock smiles. */
[data-demo=clinica]{--paper:#f8f6f0;--ink:#183534;--muted:#526a68;--accent:#187f73;--card:#ebece4;--line:#bfd3ce;--button-text:#fff;--promise-muted:#cadbd4;--final-bg:#dbeae1;--final-ink:#183534;--final-muted:#526a68;--display:'Fraunces',Georgia,serif}[data-demo=clinica] .hero-art{background:#dce9df;border-radius:50% 50% 5px 5px}[data-demo=clinica] .art-halo{position:absolute;inset:10%;border:1px solid #97bdb1;border-radius:50%;box-shadow:0 0 0 65px #ffffff55}[data-demo=clinica] .art-face{position:absolute;z-index:1;left:19%;top:14%;width:62%;height:72%;border-radius:46% 48% 44% 45%;background:radial-gradient(circle at 32% 23%,#fffefa,#c9d8bf);box-shadow:24px 25px 0 #588a7655;transform:rotate(-8deg)}[data-demo=clinica] .eye{position:absolute;top:37%;height:18px;width:9px;background:#183534;border-radius:50%}[data-demo=clinica] .eye-left{left:32%}[data-demo=clinica] .eye-right{right:32%}[data-demo=clinica] .smile{position:absolute;left:31%;top:50%;width:39%;height:22%;border:7px solid #187f73;border-top:0;border-radius:0 0 100% 100%;transform:rotate(5deg)}[data-demo=clinica] .art-leaf{position:absolute;width:160px;height:60px;border-radius:90% 0 90% 0;background:#529481;z-index:2}[data-demo=clinica] .leaf-one{bottom:11%;left:4%;transform:rotate(-27deg)}[data-demo=clinica] .leaf-two{right:-2%;top:17%;transform:rotate(135deg);background:#85b69c}[data-demo=clinica] .floating-note{position:absolute;z-index:3;right:5%;bottom:7%;padding:15px 20px;background:#fff;color:#183534;box-shadow:12px 12px 0 #187f7355;font:italic 20px var(--display)}[data-demo=clinica] .floating-note strong{color:#187f73}
/* Restaurant: editorial appetite, warm contrast and stylized overhead plate. */
[data-demo=restaurante]{--paper:#f6efe4;--ink:#261910;--muted:#65584a;--accent:#c24c28;--card:#ecdfcf;--line:#c9b8a4;--button-text:#fff;--promise-muted:#d3bdab;--final-bg:#b94124;--final-ink:#fff4e6;--final-muted:#ffe0cd;--display:'Fraunces',Georgia,serif}[data-demo=restaurante] .brand-mark{font-size:22px}[data-demo=restaurante] .hero-art{background:#ae4129;border-radius:47% 47% 4px 4px;display:grid;place-items:center}[data-demo=restaurante] .plate-shadow{position:absolute;width:75%;aspect-ratio:1;border-radius:50%;background:#55231888;filter:blur(28px);transform:translate(16px,23px)}[data-demo=restaurante] .plate{position:relative;width:72%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#f5e2c4 0 48%,#fff5e6 49% 65%,#e9caa8 66% 70%,#fff0dc 71%);box-shadow:inset -15px -14px 22px #6f3e2729,0 10px 22px #40150b55}[data-demo=restaurante] .food{position:absolute;display:block}[data-demo=restaurante] .leaf-a,[data-demo=restaurante] .leaf-b{width:35%;height:16%;border-radius:100% 0 100% 0;background:#355c37;left:33%;top:35%;transform:rotate(-35deg)}[data-demo=restaurante] .leaf-b{left:28%;top:52%;background:#638448;transform:rotate(37deg)}[data-demo=restaurante] .pepper{width:27%;height:21%;border-radius:48% 52% 42% 58%;background:#e67b34;left:48%;top:42%;box-shadow:inset 8px 6px #f4aa54}[data-demo=restaurante] .pepper.second{left:25%;top:30%;transform:rotate(-33deg);background:#bf512b}[data-demo=restaurante] .cutlery{width:35%;height:5px;background:#eee0cc;left:31%;top:72%;transform:rotate(-25deg)}[data-demo=restaurante] .stamp{position:absolute;z-index:2;right:3%;bottom:5%;display:grid;place-items:center;width:125px;height:125px;border-radius:50%;background:#f3d795;color:#5a2b21;font:700 14px/1.4 'DM Sans',sans-serif;text-align:center;letter-spacing:.12em;transform:rotate(14deg)}[data-demo=restaurante] .menu-grid article{min-height:300px;padding:27px;background:var(--card);position:relative;overflow:hidden}[data-demo=restaurante] .menu-grid article>span:first-child{font-size:11px;font-weight:700;letter-spacing:.17em;color:var(--accent)}[data-demo=restaurante] .menu-grid h3{font:500 30px var(--display);margin:34px 0 11px}[data-demo=restaurante] .menu-art{position:absolute;right:15px;bottom:-65px;font-size:150px;color:#c24c2835}
/* Automotive: strong geometry, direct messaging and technical schematic. */
[data-demo=oficina]{--paper:#f4f5f4;--ink:#121d2b;--muted:#53606c;--accent:#ed612f;--card:#e4e9ec;--line:#a8b4c0;--button-text:#101c38;--promise-muted:#bfceda;--final-bg:#ed612f;--final-ink:#121d2b;--final-muted:#2c3540;--display:'DM Sans',sans-serif}[data-demo=oficina] .brand{font-weight:700;letter-spacing:-.075em}[data-demo=oficina] .brand-mark{display:inline-grid;place-items:center;width:33px;height:33px;background:var(--accent);color:var(--ink);font-size:20px;letter-spacing:-3px}[data-demo=oficina] .brand-mark span{font-size:14px}[data-demo=oficina] h1,[data-demo=oficina] h2{text-transform:uppercase;font-weight:700;letter-spacing:-.07em}[data-demo=oficina] .hero-art{background:linear-gradient(140deg,#23384b,#101c38);clip-path:polygon(6% 0,100% 0,100% 100%,0 100%)}[data-demo=oficina] .hero-art:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px);background-size:50px 50px}[data-demo=oficina] .car{position:absolute;left:16%;top:44%;width:72%;height:24%;background:#ed612f;clip-path:polygon(8% 28%,25% 28%,37% 0,74% 0,88% 38%,100% 53%,100% 90%,0 90%,0 57%);border-radius:20px;filter:drop-shadow(0 18px 10px #030d18)}[data-demo=oficina] .car-window{position:absolute;top:8%;left:40%;width:34%;height:42%;background:#9bc2d4;transform:skew(20deg)}[data-demo=oficina] .car-light{position:absolute;right:0;top:54%;width:9%;height:16%;background:#fff4d3}[data-demo=oficina] .wheel{position:absolute;bottom:0;width:13%;aspect-ratio:1;border:11px solid #0c131b;border-radius:50%;background:#96a7b5}[data-demo=oficina] .wheel-one{left:17%}[data-demo=oficina] .wheel-two{right:12%}[data-demo=oficina] .speed{position:absolute;height:3px;background:var(--accent);left:4%;width:25%;transform:skew(-30deg)}[data-demo=oficina] .speed-one{top:36%}[data-demo=oficina] .speed-two{top:73%;width:18%}[data-demo=oficina] .badge{position:absolute;right:7%;bottom:10%;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.15em;color:#fff}[data-demo=oficina] .service-grid article{border-top:5px solid var(--accent)}
@media(max-width:900px){.topbar nav{gap:15px}.hero{gap:25px}.hero h1{font-size:clamp(42px,5.4vw,65px)}}
/* Make the demonstrations distinct beyond their palette. */
[data-demo=clinica] .hero{grid-template-columns:1.05fr .95fr;gap:70px}
[data-demo=clinica] .hero-art{border-radius:44% 44% 8px 8px;background:radial-gradient(circle at 50% 40%,#f6faf4 0 25%,#c5e0d2 70%,#92bfac 100%)}
[data-demo=clinica] .art-face{left:22%;top:18%;width:56%;height:67%;border-radius:46% 46% 45% 45%;clip-path:polygon(8% 0,92% 0,100% 29%,87% 75%,68% 100%,53% 77%,47% 77%,32% 100%,13% 75%,0 29%);background:linear-gradient(135deg,#fff 25%,#e8f0ea 76%,#b1cbbb);transform:rotate(-5deg);box-shadow:none;filter:drop-shadow(12px 16px 8px #38766144)}
[data-demo=clinica] .eye,[data-demo=clinica] .smile,[data-demo=clinica] .art-leaf{display:none}
[data-demo=clinica] .hero-art::after{content:'SEU SORRISO. SUA HISTÓRIA.';position:absolute;z-index:3;top:7%;left:7%;max-width:165px;font:600 11px/1.5 'DM Sans',sans-serif;letter-spacing:.17em;color:#21534b}
[data-demo=clinica] .floating-note{font-style:normal;border-radius:2px;font-size:18px;right:3%;bottom:5%}
[data-demo=restaurante] .hero{grid-template-columns:.85fr 1.15fr;gap:64px}
[data-demo=restaurante] .hero-art{border-radius:240px 240px 10px 10px}
[data-demo=restaurante] .hero h1{font-size:clamp(58px,5.9vw,88px)}
[data-demo=oficina] .hero{grid-template-columns:1.1fr .9fr;gap:48px}
[data-demo=oficina] .hero-art{order:-1;min-height:560px;clip-path:none;display:grid;place-items:center;background:radial-gradient(circle at center,#22374e,#121d2b 70%)}
[data-demo=oficina] .car,[data-demo=oficina] .speed{display:none}
[data-demo=oficina] .hero-art::after{content:'84';font:700 clamp(170px,24vw,340px)/1 'DM Sans',sans-serif;letter-spacing:-.13em;color:var(--accent);text-shadow:14px 18px 0 #fca68122}
[data-demo=oficina] .hero-art .badge{z-index:2;left:10%;right:auto;bottom:9%;padding-top:14px;border-top:2px solid var(--accent)}
[data-demo=oficina] .hero h1{font-size:clamp(55px,5vw,82px)}
@media(max-width:700px){.wrap{width:calc(100% - 40px)}.demo-notice{font-size:9px;letter-spacing:.06em}.topbar{min-height:68px}.topbar nav{display:none}.brand{font-size:23px}.top-cta{font-size:11px;padding:10px}.hero{grid-template-columns:1fr;gap:24px;padding-block:46px 60px;min-height:0}.hero h1{font-size:clamp(44px,10.5vw,66px)}.hero-copy>p{font-size:15px}.hero-micro{margin-top:35px}.hero-art{min-height:400px}.ticker{justify-content:start;font-size:10px}.section{padding-block:75px}.section-heading{flex-direction:column;align-items:start;gap:20px}.section-heading h2{font-size:clamp(40px,9vw,58px)}.section-heading>p{font-size:14px}.service-grid,.journey-grid,.menu-grid{grid-template-columns:1fr}.service-grid article{min-height:210px}.promise{padding-block:75px}.promise-grid{grid-template-columns:1fr}.promise .eyebrow{grid-column:auto}.promise p{margin:0}.btn-light{grid-column:1}.faq-grid{grid-template-columns:1fr;gap:25px}.final-cta{padding:78px 0}.final-cta h2{font-size:clamp(42px,9vw,66px)}.footer{min-height:125px;align-items:start;justify-content:center;flex-direction:column}.footer small{display:block;margin:6px 0 0}}@media(max-width:390px){.hero-art{min-height:340px}.top-cta{font-size:10px}.hero-actions .btn{width:100%}.demo-notice{gap:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(max-width:700px){[data-demo=clinica] .hero,[data-demo=restaurante] .hero,[data-demo=oficina] .hero{grid-template-columns:1fr;gap:24px}[data-demo=oficina] .hero-art{order:0;min-height:370px}[data-demo=restaurante] .hero h1,[data-demo=oficina] .hero h1{font-size:clamp(44px,10.5vw,66px)}}
@media(max-width:700px){
  .demo-notice{flex-wrap:wrap;gap:3px 12px;line-height:1.4}
  .topbar{gap:12px}.topbar .brand{min-width:0}.top-cta{white-space:normal;line-height:1.2;text-align:center}
  .hero-copy,.hero-art{min-width:0}
  .hero h1,[data-demo=restaurante] .hero h1,[data-demo=oficina] .hero h1{font-size:clamp(37px,9vw,56px);overflow-wrap:break-word}
  .hero-copy>p{overflow-wrap:break-word}
  .hero-actions{flex-direction:column;align-items:flex-start;gap:20px}
  .hero-actions .btn{max-width:100%;white-space:normal}
}
@media(max-width:480px){
  .top-cta{display:none}
  .hero-copy{width:100%;max-width:100%}
  .hero h1,[data-demo=restaurante] .hero h1,[data-demo=oficina] .hero h1{font-size:clamp(33px,8vw,39px);line-height:1.12;overflow-wrap:anywhere}
  .hero-copy>p{max-width:100%;font-size:14px;line-height:1.6}
  .hero-actions{width:100%}
  .hero-actions .btn{max-width:100%;font-size:12px}
}
