:root{color-scheme:dark;--bg:#10091f;--surface:#1a1328;--muted:#bcb3ca;--purple:#511692;--bright:#b978f2;--line:#352a43;--white:#fff;--green:#25dba6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:Manrope,Arial,sans-serif;font-size:15px;line-height:1.6}::selection{background:#a464e5;color:#10091f}a{color:inherit;text-decoration:none}button{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,iframe:focus-visible{outline:3px solid #c59aff;outline-offset:4px}.wrap{width:min(1320px,calc(100% - 64px));margin-inline:auto}.site-header{height:90px;border-bottom:1px solid #2a2038}.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:inline-flex;flex:none}.brand img{width:145px;height:auto;object-fit:contain}.main-nav{display:flex;align-items:center;padding:6px 8px;border:1px solid #3a3046;border-radius:50px;background:#1b1428;gap:3px}.main-nav a{font-size:12px;font-weight:700;color:#d3cada;padding:5px 13px;border-radius:30px;white-space:nowrap}.main-nav a:hover{color:white}.main-nav .nav-active{color:#fff;background:#52179a}.nav-active span{display:inline-block;width:7px;height:7px;background:#2be4b3;border-radius:50%;margin-right:7px;vertical-align:middle}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:#511895;color:#fff;font-weight:800;border-radius:13px;padding:12px 19px;transition:background .2s,transform .2s}.button:hover{background:#6b22ba;transform:translateY(-2px)}.button img{height:16px;width:auto}.header-cta{font-size:13px;white-space:nowrap}.hero{min-height:720px;display:grid;grid-template-columns:minmax(0, 1.25fr) minmax(340px,.75fr);gap:70px;align-items:center;padding-top:32px;padding-bottom:30px}.hero-copy{padding-bottom:20px}.feature-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.pill{border:1px solid #3b3049;border-radius:50px;background:#251d32;color:#e0c8f2;font-size:12px;font-weight:800;line-height:1;padding:6px 11px;white-space:nowrap}.pill img{height:12px;vertical-align:-2px}.pill-primary{background:#521895;color:#fff;border-color:#521895}.pill>span{color:#a8d7e0}.hero h1{font-size:clamp(38px,3.15vw,51px);line-height:1.02;letter-spacing:-.045em;margin:0 0 16px;font-weight:800}.hero h1 em,.intro-section h2 em{font-style:normal;color:var(--bright)}.hero-description{font-size:16px;color:#d5cde0;line-height:1.55;margin:0 0 22px}.portfolio-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:11px;margin:0 0 10px}.portfolio-heading>strong{color:#d7a4ff;letter-spacing:.04em}.portfolio-heading span{color:#a99db8}.portfolio-heading b{color:#fff}.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.client{min-width:0;min-height:72px;display:flex;align-items:center;text-align:left;gap:12px;border:2px solid #382e46;border-radius:16px;padding:12px 14px;background:#1b1429;color:#fff;cursor:pointer;transition:background .2s,border-color .2s}.client:hover{border-color:#a976d5}.client.active{background:#4c158a;border-color:#e8d5fa;outline:1px solid #4c158a;outline-offset:2px}.client-icon{width:40px;height:40px;display:grid;place-items:center;flex:none;border-radius:12px;background:#393046;border:1px solid #51455d}.client.active .client-icon{background:#7142a4;border-color:#9668c3}.client-icon img{height:24px;width:auto}.client-copy{min-width:0;flex:1;line-height:1.35}.client-copy strong{display:block;font-size:13px}.client-copy small{display:block;color:#b7acc5;font-size:11px}.client.active small{color:#e2d4f1}.client-action{flex:none;background:#393045;color:#e5cafa;border-radius:9px;padding:5px 9px;font-size:10px;font-weight:800;white-space:nowrap}.client.active .client-action{background:#fff;color:#4d138c}.hero-bottom{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:32px}.button-large{padding:15px 23px;font-size:14px;border-radius:16px}.button-large span{margin-left:4px}.ready{font-size:11px;color:#bdb2c9}.ready span{display:inline-grid;place-items:center;background:#0d302f;color:#30dfa8;width:20px;height:20px;border-radius:50%;margin-right:6px}.demo{min-width:0;display:flex;align-items:center;flex-direction:column;align-self:center}.view-switch{align-self:center;display:flex;align-items:center;gap:3px;border:1px solid #3a2e49;border-radius:30px;padding:4px 5px 4px 14px;background:#21162e;color:#afa3bd;font-size:10px;margin-bottom:12px}.view-switch button{cursor:pointer;border:0;color:#c9bbd8;background:transparent;border-radius:20px;padding:4px 12px;font-size:10px}.view-switch button.selected{color:#fff;background:#571a9b;font-weight:700}.phone-wrap{position:relative;width:340px;max-width:100%;transition:width .3s ease}.demo.wide .phone-wrap{width:390px}.phone{height:650px;padding:9px;background:#060e20;border:1px solid #252c45;border-radius:49px;box-shadow:0 20px 60px #06020e90;overflow:hidden}.phone-top{height:40px;display:flex;justify-content:space-between;align-items:center;padding:0 22px;color:#e2ebfb;font-weight:800;font-size:10px}.notch{height:20px;width:96px;border-radius:20px;background:#000;position:relative}.notch:before,.notch i{content:"";position:absolute;top:6px;width:8px;height:8px;border-radius:50%;background:#2e1053}.notch:before{left:12px}.notch i{right:12px;background:#151a3d;border:1px solid #344264}.browser-bar{display:flex;gap:5px;align-items:center;height:37px;padding:0 5px}.browser-address{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;background:#080f20;border:1px solid #29334a;border-radius:10px;color:#d7e1f4;padding:6px 9px;font:10px monospace}.browser-bar button,.browser-bar a{display:grid;place-items:center;width:27px;height:27px;border:0;border-radius:8px;background:#263149;color:white;cursor:pointer;font-size:16px}.browser-bar a{background:#571c98}.phone iframe{display:block;width:100%;height:calc(100% - 98px);background:#fff;border:0}.phone-home{height:5px;width:100px;background:#b4bac4;border-radius:8px;margin:9px auto 0}.floating-badge{position:absolute;z-index:2;display:flex;align-items:center;gap:9px;background:#111c30;border:1px solid #35425a;border-radius:17px;padding:10px;box-shadow:0 9px 24px #08010e55;white-space:nowrap;line-height:1.3}.floating-badge small,.floating-badge strong{display:block}.floating-badge small{font-size:9px;color:#d6a8fa;font-weight:800;letter-spacing:.03em}.floating-badge strong{font-size:11px}.badge-bio{top:35px;left:-100px}.badge-icon{width:36px;height:36px;display:grid;place-items:center;background:#591b9b;border-radius:12px}.badge-icon img{height:24px}.badge-google{right:-85px;bottom:70px}.badge-google small{color:#27e1ac}.google-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#123b3c;color:#32e2b0;font-weight:800}.demo-hint{font-size:10px;color:#a99bb8;margin:12px 0 0;text-align:center}.intro-section{background:#f5f1fa;color:#21132e;padding:110px 0}.intro-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px}.intro-layout h2,.presence-section h2,.price-layout h2,.steps-section h2,.closing h2{font-size:clamp(30px,3.5vw,48px);line-height:1.13;letter-spacing:-.04em;margin:0 0 20px}.intro-layout>div>p,.presence-section p,.price-layout>div>p,.steps-section>div>p{font-size:16px;max-width:560px}.intro-section h2 em{color:#7024b5}.intro-section p{color:#655a6f}.link-list>div{display:grid;grid-template-columns:45px 1fr;column-gap:10px;padding:20px 0;border-bottom:1px solid #d8cce1}.link-list>div:first-child{padding-top:0}.link-list span{grid-row:span 2;color:#8b53b5;font-size:12px;font-weight:800}.link-list strong{font-size:18px}.link-list p{margin:4px 0 0}.presence-section{display:grid;grid-template-columns:.7fr 1fr;gap:80px;align-items:center;padding-block:120px}.presence-mark{display:grid;place-items:center;min-height:320px;background:#511895;border-radius:36px}.presence-mark img{width:110px}.presence-section p,.price-layout>div>p,.steps-section>div>p{color:#c4b8d0}.text-link{display:inline-block;margin-top:14px;color:#d7a7ff;font-weight:800}.text-link span{margin-left:10px}.price-section{background:#1b112b;padding:110px 0}.price-layout{display:grid;grid-template-columns:1fr .8fr;gap:100px;align-items:center}.price-layout ul{padding:0;margin:32px 0 0;list-style:none}.price-layout li{padding:8px 0;color:#e2daea}.price-layout li:before{content:'✓';color:#41ddb3;margin-right:12px}.price-panel{padding:36px;background:#f7f3fa;color:#24112e;border-radius:24px}.price-panel>span{font-weight:800;color:#6d458a}.price{font-size:70px;line-height:1.1;font-weight:800;letter-spacing:-.05em;margin:12px 0}.price small{font-size:24px;letter-spacing:0}.price-panel p{color:#685b70;margin:0 0 25px}.price-panel .button{width:100%}.price-panel>small{display:block;color:#71647a;margin-top:18px;line-height:1.5}.steps-section{padding-block:120px;display:grid;grid-template-columns:1fr 1fr;gap:100px}.steps-section ol{counter-reset:step;list-style:none;padding:0;margin:0}.steps-section li{counter-increment:step;display:grid;grid-template-columns:45px 1fr;gap:2px 12px;padding:19px 0;border-bottom:1px solid var(--line)}.steps-section li:before{content:counter(step,decimal-leading-zero);grid-row:span 2;color:#bb81e9;font-weight:800}.steps-section li strong{font-size:17px}.steps-section li span{color:#bcb0c9}.closing{text-align:center;background:#511895;padding:70px 30px;border-radius:30px}.closing h2{max-width:750px;margin-inline:auto}.closing p{color:#e0cdea;margin-bottom:25px}.button-light{background:#fff;color:#4c148a}.button-light:hover{background:#f1e4fb}.footer-inner{display:flex;align-items:center;gap:35px;padding-block:55px;color:#b8aabe;font-size:12px}.footer-inner p{flex:1}.footer-inner .brand img{width:120px}
@media(max-width:1100px){.main-nav a{padding-inline:8px}.hero{gap:35px;grid-template-columns:minmax(0,1fr) 340px}.hero h1{font-size:40px}.badge-bio{left:-40px}.badge-google{right:-25px}.client-action{display:none}.intro-layout,.price-layout,.steps-section{gap:50px}}
@media(max-width:780px){.wrap{width:min(100% - 36px,600px)}.site-header{height:72px}.brand img{width:120px}.main-nav{display:none}.header-cta{font-size:11px;padding:10px 12px}.hero{display:flex;flex-direction:column;align-items:stretch;gap:38px;padding-top:48px;padding-bottom:60px}.hero-copy{padding:0}.feature-pills{gap:6px;margin-bottom:22px}.pill{font-size:10px}.hero h1{font-size:clamp(35px,9vw,48px)}.hero-description{font-size:14px}.desktop-break{display:none}.portfolio-heading{align-items:flex-start;flex-direction:column;gap:3px}.portfolio-grid{gap:8px}.client{padding:10px;gap:8px;min-height:70px}.client-icon{width:32px;height:32px;border-radius:10px}.client-icon img{height:20px}.client-copy strong{font-size:11px}.client-copy small{font-size:10px}.hero-bottom{margin-top:24px}.hero-bottom .button{width:100%}.demo{width:100%}.phone-wrap{width:min(340px,calc(100% - 30px))}.demo.wide .phone-wrap{width:min(390px,calc(100% - 10px))}.phone{height:610px}.badge-bio{left:-12px;top:30px}.badge-google{right:-12px;bottom:60px}.intro-section,.price-section{padding:75px 0}.intro-layout,.price-layout,.steps-section,.presence-section{grid-template-columns:1fr;gap:38px}.intro-layout h2,.presence-section h2,.price-layout h2,.steps-section h2,.closing h2{font-size:34px}.presence-section,.steps-section{padding-block:75px}.presence-mark{min-height:220px}.presence-mark img{width:80px}.price-panel{padding:28px}.closing{padding:55px 24px}.footer-inner{flex-wrap:wrap;gap:15px}.footer-inner p{flex-basis:60%;margin:0}.footer-inner>span{margin-left:auto}}
@media(max-width:380px){.client-copy strong{font-size:10px}.client-copy small{font-size:9px}.feature-pills .pill{font-size:9px}.hero h1{font-size:34px}.phone{height:560px}.floating-badge{transform:scale(.9)}.badge-bio{transform-origin:left top}.badge-google{transform-origin:right bottom}}
.price-layout>.price-panel>p{color:#685b70}.view-switch,.view-switch button,.client-action,.demo-hint{font-size:11px}.floating-badge small{font-size:10px}.client-copy small{font-size:11px}@media(max-width:780px){.pill,.client-copy strong,.client-copy small{font-size:11px}}@media(max-width:380px){.feature-pills .pill,.client-copy strong,.client-copy small{font-size:11px}}

/* Movimento discreto para acompanhar a demonstração e suas interações. */
.main-nav a,.pill,.view-switch button,.browser-bar button,.browser-bar a{
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.client-icon,.client-action{
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}
.client-copy small{transition:color .2s ease}
.button span,.text-link span{display:inline-block;transition:transform .2s ease}
.button:active,.client:active,.view-switch button:active{transform:scale(.98)}
.client{transition:background-color .2s ease,border-color .2s ease,transform .15s ease}
.view-switch button{transition:background-color .2s ease,color .2s ease,transform .15s ease}

@media(hover:hover){
  a.pill:hover{background:#393045;border-color:#a976d5}
  .view-switch button:not(.selected):hover{background:#393045;color:#fff}
  .browser-bar button:hover,.browser-bar a:hover{background:#6b22ba}
  .button:hover span,.text-link:hover span{transform:translateX(4px)}
}

@media(prefers-reduced-motion:no-preference){
  /* As seções entram apenas quando se aproximam da área visível. */
  .scroll-reveal{
    transition:opacity .7s cubic-bezier(.16,1,.3,1),translate .7s cubic-bezier(.16,1,.3,1);
  }
  .scroll-reveal.reveal-pending:not(:focus-within){opacity:.2;translate:0 24px}
  .link-list > .scroll-reveal:nth-child(2),
  .steps-section li.scroll-reveal:nth-child(2){transition-delay:.06s}
  .link-list > .scroll-reveal:nth-child(3),
  .steps-section li.scroll-reveal:nth-child(3){transition-delay:.12s}
  .steps-section li.scroll-reveal:nth-child(4){transition-delay:.18s}

  /* A mensagem chega primeiro; em seguida, a demonstração. */
  .hero-copy > h1,
  .hero-copy > .hero-description,
  .hero-copy > .hero-bottom{
    animation:hero-arrive .8s cubic-bezier(.16,1,.3,1) backwards;
  }
  .hero-copy > .hero-description{animation-delay:.08s}
  .hero-copy > .hero-bottom{animation-delay:.16s}
  .phone{animation:phone-arrive .9s cubic-bezier(.16,1,.3,1) .12s backwards}
  @keyframes hero-arrive{
    from{opacity:.15;translate:0 20px}
    to{opacity:1;translate:0 0}
  }
  @keyframes phone-arrive{
    from{opacity:.15;translate:0 28px}
    to{opacity:1;translate:0 0}
  }
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .phone-wrap{transition:none}
  .button:hover,.button:active,.client:active,.view-switch button:active,
  .button:hover span,.text-link:hover span{transform:none}
}

/* A demonstração continua acessível, com a mensagem e a ação em primeiro plano. */
.hero{gap:clamp(48px,7vw,100px);padding-top:64px;padding-bottom:72px}
.hero-copy{padding-bottom:0}
.hero h1{max-width:14ch;letter-spacing:-.04em;text-wrap:balance}
.hero-description{max-width:48ch;margin-top:22px}
.hero-bottom{margin-top:30px;margin-bottom:54px}
.portfolio-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-bottom:12px}
.portfolio-heading strong{font-size:14px;letter-spacing:0;text-transform:none;color:#fff}
.portfolio-heading span{font-size:12px;color:var(--muted)}
.portfolio-grid{display:flex;flex-wrap:wrap;gap:8px}
.client{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 14px;border:1px solid var(--line);border-radius:13px;background:transparent;color:var(--white);font-size:12px;font-weight:700;line-height:1.35;text-align:center;cursor:pointer}
.client.active{background:#511895;border-color:var(--bright);color:#fff}
.demo-hint{color:var(--muted)}
@media(hover:hover){.client:not(.active):hover{background:var(--surface);border-color:var(--bright);color:#fff}}
@media(max-width:780px){
  .hero{gap:40px;padding-top:54px;padding-bottom:64px}
  .hero h1{max-width:15ch}
  .hero-bottom{margin-top:26px;margin-bottom:42px}
  .hero-bottom .button{width:auto}
  .portfolio-heading{flex-direction:column;align-items:flex-start}
  .client{min-height:44px;padding:9px 12px;font-size:12px}
}

/* Direção visual: uma vitrine de endereços iluminada em violeta. */
:root{--bg:#0c0b0e;--surface:#151020;--muted:#b4acbf;--purple:#4b18db;--bright:#c9b8ff;--line:#30283a}
body{background:var(--bg);font-family:'DM Sans',Arial,sans-serif;color:#faf8ff}
.wrap{width:min(1280px,calc(100% - 64px))}
.site-header{position:sticky;top:16px;z-index:10;height:auto;border:0;margin:20px auto -80px;width:min(1000px,calc(100% - 40px))}
.header-inner{width:100%;height:60px;padding:7px 9px 7px 20px;border-radius:40px;background:rgba(22,21,25,.94);backdrop-filter:blur(16px);gap:15px}
.brand img{width:140px}.main-nav{border:0;background:none;padding:0}.main-nav a{font-size:13px;font-weight:500;padding:10px 12px}.main-nav .nav-active{background:#26252a}.nav-active span{display:none}
.button{background:#4b18db;border-radius:50px;font-weight:500;padding:13px 22px}.button:hover{background:#6330ed}.header-cta{font-size:12px}.button-large{padding:15px 24px;font-size:15px}
.hero{position:relative;display:flex;flex-direction:column;min-height:0;gap:36px;padding-top:180px;padding-bottom:90px;text-align:center}
.hero:before{content:'';position:absolute;z-index:-1;inset:0 calc((1280px - 100vw)/2) -70px;background:radial-gradient(ellipse at 50% 85%,#3b169e 0%,#1a0d36 40%,#0c0b0e 75%);pointer-events:none}
.hero-copy{width:100%;display:flex;flex-direction:column;align-items:center}.section-label{display:inline-block;border-radius:30px;background:#20113d;color:#e0d6ff;padding:5px 15px;font-size:12px;font-weight:500;margin-bottom:20px}
.hero h1{max-width:950px;margin:0;font-size:clamp(43px,5.2vw,72px);line-height:1.14;font-weight:500;letter-spacing:-.045em}.hero h1 em,.intro-section h2 em,.faq-section h2 em,.closing h2 em{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-style:italic;color:#eee7ff}
.hero-description{max-width:700px;margin:26px 0 0;color:var(--muted);font-size:17px}.hero-bottom{justify-content:center;margin:30px 0 48px}.portfolio-heading{justify-content:center;align-items:center;margin-bottom:12px}.portfolio-heading strong{font-weight:500}.portfolio-heading span{color:var(--muted)}.portfolio-grid{justify-content:center}.client{min-height:40px;border-radius:30px;background:#17121f;border:1px solid #3d2b59;font-weight:500}.client.active{background:#4b18db;border-color:#7551ee;outline:0}
.demo{width:100%;padding:30px 24px 24px;border:1px solid #38265d;border-radius:26px;background:linear-gradient(145deg,#120e1e,#1a1031);box-shadow:0 28px 80px #08040f70}.view-switch{background:#1b1230;border-color:#3b2860}.view-switch button.selected{background:#4b18db}.phone{background:#090811;border-color:#504266;box-shadow:0 20px 70px #06020ec9}.demo-hint{font-size:12px}
.intro-section{background:radial-gradient(ellipse at 50% 50%,#1c1034,#0c0b0e 70%);color:#faf8ff;padding:120px 0}.intro-layout{display:block;text-align:center}.intro-layout>div:first-child{max-width:740px;margin:auto}.intro-layout h2,.presence-section h2,.price-layout h2,.steps-section h2,.closing h2,.faq-section h2{font-size:clamp(34px,4vw,52px);font-weight:500;letter-spacing:-.035em;line-height:1.18}.intro-layout>div>p{margin-inline:auto}.intro-section p{color:var(--muted)}.link-list{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:75px;text-align:left}.link-list>div,.link-list>div:first-child{display:block;padding:0 0 0 25px;border:0;border-left:1px solid #51329c}.link-list span{display:none}.link-list strong{font-size:23px;font-weight:500}.link-list p{margin-top:15px}
.presence-section{padding-block:110px}.presence-mark{background:radial-gradient(circle,#4b1ac0,#1b1035 65%);border:1px solid #38265d;border-radius:24px}.text-link{color:#cbb8ff;font-weight:500}
.price-section{background:#100d16;padding:110px 0}.price-panel{background:#190f2d;color:#fff;border:1px solid #5a25df;border-radius:24px}.price-panel>span{color:#d7c8ff}.price-layout>.price-panel>p,.price-panel>small{color:#bcb1c9}.price-layout li:before{color:#bba4ff}.price{font-weight:500}.steps-section{padding-block:110px}.steps-section li{border-color:#30283a}.steps-section li:before{color:#b9a0ff}
.faq-section{text-align:center;padding-block:100px 120px}.faq-section h2{margin:0 0 55px}.faq-list{max-width:850px;margin:auto;padding:32px;background:#15101c;border:1px solid #30283a;border-radius:24px;text-align:left}.faq-list details{background:#21113d;border-radius:9px;margin:12px 0;color:#eee8f8}.faq-list summary{cursor:pointer;list-style:none;padding:20px;display:flex;justify-content:space-between;gap:20px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'↗';flex:none}.faq-list details[open] summary:after{content:'↙'}.faq-list details p{margin:0 20px;padding:18px 0 22px;border-top:1px solid #49326b;color:#c4b8d0}.faq-list summary:focus-visible{outline:3px solid #c59aff;outline-offset:3px}
.closing{background:#1a112b;border-radius:24px;padding:75px 30px}.closing p{color:#c4b8d0}footer{background:radial-gradient(ellipse at 50% 130%,#321285,#0c0b0e 65%)}.footer-inner{padding-block:65px;color:#b4acbf}
@media(max-width:780px){.wrap{width:min(100% - 36px,600px)}.site-header{top:10px;margin:10px auto -70px;width:calc(100% - 24px)}.header-inner{height:60px;padding-left:14px}.brand img{width:120px}.header-cta{padding:10px 13px}.hero{gap:30px;padding-top:135px;padding-bottom:65px}.hero:before{inset:0 -18px -30px}.hero h1{max-width:100%;font-size:clamp(37px,9vw,52px)}.hero-description{font-size:15px}.hero-bottom{margin:25px 0 38px}.portfolio-heading{align-items:center}.portfolio-grid{gap:8px}.client{min-height:40px;font-size:12px}.demo{padding:24px 12px}.phone-wrap{width:min(340px,100%)}.demo.wide .phone-wrap{width:min(390px,100%)}.intro-section,.price-section{padding:75px 0}.link-list{grid-template-columns:1fr;gap:28px;margin-top:45px}.presence-section,.steps-section{padding-block:75px}.faq-section{padding-block:75px}.faq-list{padding:14px}.closing{padding:55px 24px}.footer-inner{padding-block:45px}}

/* Os projetos ficam ao lado da demonstração, como uma seleção de vitrines. */
.portfolio-showcase{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(32px,6vw,80px);padding:40px;border:1px solid #38265d;border-radius:26px;background:linear-gradient(145deg,#120e1e,#1a1031);box-shadow:0 28px 80px #08040f70;text-align:left}
.portfolio-heading{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:24px}
.portfolio-heading strong{font-size:clamp(30px,3.5vw,46px);font-weight:500;line-height:1.15;letter-spacing:-.035em}
.portfolio-heading span{font-size:14px}
.portfolio-grid{display:flex;flex-direction:column;align-items:stretch;gap:10px}
.portfolio-grid .client{justify-content:flex-start;text-align:left;padding:14px 20px;font-size:14px}
.portfolio-showcase .demo{padding:0;border:0;background:none;box-shadow:none}
@media(max-width:780px){.portfolio-showcase{grid-template-columns:1fr;gap:32px;padding:24px 18px}.portfolio-heading{align-items:flex-start}.portfolio-heading strong{font-size:32px}.portfolio-grid .client{min-height:44px}.portfolio-showcase .demo{padding:0}}

/* Recorta a barra do documento externo sem desativar a rolagem do iframe. */
.frame-viewport{height:calc(100% - 98px);overflow:hidden}
.phone .frame-viewport iframe{width:calc(100% + 20px);height:100%}

.portfolio-showcase{align-items:start}
.portfolio-instruction{max-width:440px;margin:24px 0 0;color:var(--muted);font-size:14px;line-height:1.6}
.portfolio-controls .view-switch{width:max-content;margin:20px 0 0}
.site-header{width:min(1280px,calc(100% - 40px))}
@media(max-width:780px){.site-header{width:calc(100% - 24px)}}
.main-nav a span{margin-right:4px;color:#c9b8ff}
@media(max-width:780px){.header-inner{gap:6px}.main-nav{display:flex;margin-left:auto}.main-nav a{padding:8px;font-size:12px}.header-cta{font-size:11px}}
@media(max-width:480px){.header-inner .brand img{width:90px}.main-nav a{padding:6px;font-size:11px}.main-nav a span{display:none}.header-cta{padding:9px;font-size:10px}}
@media(max-width:780px){.header-inner{height:auto;min-height:60px;flex-wrap:wrap}.main-nav{order:3;width:100%;justify-content:center;overflow-x:auto}.header-cta{margin-left:auto}}
.product-list{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:48px}.product-list p{overflow-wrap:anywhere}.product-list b{font-weight:600;color:#ddd2ef}
@media(max-width:780px){.product-list{grid-template-columns:1fr;row-gap:28px}}

/* Navegação móvel: um único header e um painel de links sob ele. */
.menu-toggle{display:none}
.main-nav .mobile-menu-cta{display:none}
@media(max-width:780px){
  .header-inner{position:relative;flex-wrap:nowrap;height:60px;min-height:0;gap:10px}
  .header-inner .brand img{width:clamp(95px,24vw,120px)}
  .header-cta{display:none}
  .menu-toggle{margin-left:auto}
  .menu-toggle{display:flex;flex:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:40px;height:40px;padding:0;border:1px solid #3d354b;border-radius:50%;background:#24202b;color:#fff;cursor:pointer}
  .menu-toggle span{display:block;width:17px;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
  .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(6px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-6px) rotate(-45deg)}
  .header-inner .main-nav{display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;order:initial;width:auto;margin:0;padding:10px;border:1px solid #382d49;border-radius:20px;background:#17131e;box-shadow:0 20px 45px #0008;overflow:visible}
  .header-inner .main-nav.is-open{display:flex;flex-direction:column;align-items:stretch}
  .header-inner .main-nav a{display:block;padding:12px 16px;font-size:14px}
  .header-inner .main-nav a:hover{background:#292035}
  .header-inner .main-nav .mobile-menu-cta{display:flex;align-items:center;justify-content:center;gap:8px;margin:8px 0 0;padding:12px 16px;background:#4b18db;color:#fff}
  .mobile-menu-cta img{width:16px;height:16px;object-fit:contain}
}
@media(max-width:380px){.header-inner{gap:6px}.header-inner .brand img{width:88px}.header-cta{padding:9px;font-size:10px;gap:5px}.header-cta img{width:14px;height:14px;object-fit:contain}}
@media(prefers-reduced-motion:reduce){.menu-toggle span{transition:none}}

/* Vidro no topo; uma navegação mais compacta durante a leitura. */
.site-header{transition:width .45s cubic-bezier(.22,1,.36,1)}
.site-header.is-scrolled{width:min(900px,calc(100% - 40px))}
.header-inner{background:rgba(31,26,40,.58);border:1px solid rgba(226,211,255,.14);backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%);box-shadow:0 8px 32px rgba(0,0,0,.15);transition:background-color .45s,border-color .45s,box-shadow .45s}
.is-scrolled .header-inner{background:rgba(22,19,27,.94);border-color:rgba(226,211,255,.08);box-shadow:0 12px 36px rgba(0,0,0,.3)}
.site-header:not(.is-scrolled) .header-inner{height:72px}
@media(max-width:780px){.site-header.is-scrolled{width:calc(100% - 24px)}.site-header:not(.is-scrolled) .header-inner{height:60px}}
@media(prefers-reduced-motion:reduce){.site-header,.header-inner{transition:none}}

/* Um halo suave surge atrás do item, sem contorno. */
@media(hover:hover){
  .main-nav a:not(.mobile-menu-cta){position:relative;isolation:isolate;transition:color .35s}
  .main-nav a:not(.mobile-menu-cta)::after{content:'';position:absolute;z-index:-1;inset:-8px -12px;background:radial-gradient(ellipse,rgba(139,94,255,.38),rgba(105,55,221,.12) 45%,transparent 75%);opacity:0;transition:opacity .35s ease;pointer-events:none}
  .main-nav a:not(.mobile-menu-cta):hover{color:#fff;background:transparent;box-shadow:none}
  .main-nav a:not(.mobile-menu-cta):hover::after{opacity:1}
}
@media(prefers-reduced-motion:reduce){.main-nav a:not(.mobile-menu-cta),.main-nav a:not(.mobile-menu-cta)::after{transition:none}}

/* Benefícios apresentados como uma coleção de recursos da página. */
.product-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:64px}
.product-list>div,.product-list>div:first-child{grid-column:span 2;position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:30px;border:1px solid rgba(192,170,241,.12);border-radius:20px;background:linear-gradient(145deg,rgba(39,27,62,.8),rgba(20,15,29,.85));transition:background-color .25s,border-color .25s,transform .25s}
.product-list>div:nth-child(n+4){grid-column:span 3}
.product-list>div::before{content:'';width:28px;height:3px;margin-bottom:25px;border-radius:4px;background:#a989f4;box-shadow:0 0 14px rgba(169,137,244,.45)}
.product-list strong{font-size:21px;line-height:1.3;letter-spacing:-.02em}
.product-list p{margin:14px 0 0;font-size:15px;line-height:1.7;color:#bbb2c8;overflow-wrap:anywhere}
.product-list b{display:inline;color:#ded2ff;font-weight:600}
@media(hover:hover){.product-list>div:hover{border-color:rgba(192,170,241,.3);transform:translateY(-3px)}}
@media(max-width:780px){.product-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:40px}.product-list>div,.product-list>div:first-child,.product-list>div:nth-child(n+4){grid-column:span 1;padding:24px}.product-list>div:last-child{grid-column:1/-1}}
@media(max-width:540px){.product-list{grid-template-columns:minmax(0,1fr)}.product-list>div,.product-list>div:first-child,.product-list>div:nth-child(n+4),.product-list>div:last-child{grid-column:auto}.product-list>div::before{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.product-list>div{transition:none}.product-list>div:hover{transform:none}}
.product-list .product-icon{position:absolute;z-index:0;top:18px;right:20px;width:88px;height:88px;padding:8px;overflow:visible;fill:none;stroke:#c4a8ff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.26;transform:rotate(8deg);filter:drop-shadow(0 8px 12px rgba(130,78,235,.35));pointer-events:none}
.product-list>div::before{margin-bottom:38px}
.product-list strong,.product-list p{position:relative;z-index:1}.product-list strong{max-width:100%}
@media(max-width:540px){.product-list .product-icon{top:14px;right:18px;width:76px;height:76px}.product-list>div::before{margin-bottom:30px}}

/* FAQ: luz concentrada no item ativo, sem alterar a navegação nativa. */
.faq-section{position:relative;isolation:isolate}
.faq-section::before{content:'';position:absolute;z-index:-1;inset:12% 8% 0;background:radial-gradient(ellipse at center,rgba(91,42,181,.2),transparent 68%);pointer-events:none}
.faq-list{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(28,20,42,.96),rgba(17,13,24,.98));border-color:rgba(191,166,239,.14);box-shadow:0 30px 80px rgba(0,0,0,.22)}
.faq-list details{position:relative;overflow:hidden;background:#1e1432;border:1px solid transparent;transition:background-color .35s ease,border-color .35s ease,box-shadow .35s ease}
.faq-list details::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 85% 0,rgba(130,80,235,.24),transparent 55%);opacity:0;transition:opacity .35s ease;pointer-events:none}
.faq-list details[open]{background:#261641;border-color:rgba(174,138,255,.24);box-shadow:0 8px 30px rgba(69,29,147,.2)}
.faq-list details[open]::before{opacity:1}
.faq-list summary{position:relative;color:#d1c6dc;transition:color .3s ease}
.faq-list details[open] summary{color:#fff}
.faq-list summary:after{color:#c9b1ff;transition:transform .35s ease,color .35s ease}
.faq-list details[open] summary:after{content:'↗';transform:rotate(180deg);color:#fff}
.faq-list details p{position:relative;border-color:rgba(194,164,255,.14)}
@media(hover:hover){.faq-list details:hover{border-color:rgba(174,138,255,.2)}.faq-list details:hover::before{opacity:.65}.faq-list details[open]:hover::before{opacity:1}.faq-list summary:hover{color:#fff}}
@media(prefers-reduced-motion:no-preference){.faq-list details[open] p{animation:faq-answer-in .35s ease both}@keyframes faq-answer-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){.faq-list details,.faq-list details::before,.faq-list summary,.faq-list summary:after{transition:none}}

/* FAQ mais escuro: o violeta aparece apenas como luz de interação. */
.faq-section::before{background:radial-gradient(ellipse at center,rgba(76,30,150,.1),transparent 65%)}
.faq-list{background:#100d15;border-color:rgba(177,151,218,.1);box-shadow:0 30px 80px rgba(0,0,0,.3)}
.faq-list details{background:#17121e}
.faq-list details::before{background:radial-gradient(ellipse at 100% 50%,rgba(104,47,202,.25),transparent 65%)}
.faq-list details[open]{background:#1b1327;border-color:rgba(134,85,220,.2);box-shadow:inset 3px 0 0 #7545d1,0 8px 28px rgba(58,20,117,.14)}
.faq-list summary:after{color:#a981ed}
.faq-list summary:after,.faq-list details[open] summary:after{content:'+';display:grid;place-items:center;width:32px;height:32px;margin:-4px 0;flex:none;border-radius:50%;background:rgba(139,94,220,.12);color:#c3a4ff;font-size:22px;font-weight:400;line-height:1;transform:none;transition:transform .35s ease,background-color .35s ease,color .35s ease}
.faq-list details[open] summary:after{transform:rotate(45deg);background:rgba(139,94,220,.22);color:#fff}
@media(prefers-reduced-motion:reduce){.faq-list summary:after,.faq-list details[open] summary:after{transition:none}}
.footer-inner .brand{margin-right:auto}
@media(max-width:780px){.footer-inner{flex-wrap:nowrap}.footer-inner>span{margin-left:0}}
@media(max-width:480px){.footer-inner{gap:12px;flex-wrap:wrap}.footer-inner .brand{width:100%;margin:0 0 8px}}

/* Carregamento da demonstração, independente do conteúdo externo. */
.frame-viewport{position:relative}
.frame-loading{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:radial-gradient(circle at 50% 45%,#28134a,#100c19 65%);color:#d7c9ea;font-size:12px;letter-spacing:.02em;opacity:1;visibility:visible;transition:opacity .35s ease,visibility .35s ease}
.frame-viewport[aria-busy="false"] .frame-loading{opacity:0;visibility:hidden;pointer-events:none}
.frame-loading-orbit{position:relative;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:rgba(116,72,203,.14)}
.frame-loading-orbit::after{content:'';position:absolute;inset:-5px;border:2px solid rgba(183,147,255,.15);border-top-color:#b793ff;border-radius:50%;animation:frame-spin .9s linear infinite}
.frame-loading-orbit img{width:30px;height:30px;object-fit:contain}
@keyframes frame-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.frame-loading{transition:none}.frame-loading-orbit::after{animation:none;border-top-color:#b793ff}}

/* Acesso por teclado e espaço para o cabeçalho fixo nos links internos. */
.skip-link{position:fixed;top:8px;left:8px;z-index:100;padding:10px 16px;background:#fff;color:#10091f;border-radius:8px;transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}
main[id],section[id],.portfolio-showcase[id]{scroll-margin-top:110px}

/* O painel agrupa os controles; a demonstração flutua fora dele. */
.portfolio-showcase{align-items:center;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.portfolio-controls{min-width:0;padding:40px;border:1px solid #38265d;border-radius:26px;background:linear-gradient(145deg,#120e1e,#1a1031);box-shadow:0 28px 80px #08040f70}
.portfolio-showcase .phone-wrap{width:380px}
@media(max-width:780px){
  .portfolio-showcase{gap:32px;padding:0}
  .portfolio-controls{padding:24px 18px}
  .portfolio-showcase .phone-wrap{width:min(380px,100%)}
}

/* Moldura fina e tela ampla, com acabamento discreto de aparelho atual. */
.phone{display:flex;flex-direction:column;padding:5px;border:1px solid #71667f;border-radius:42px;background:#090811;box-shadow:0 0 0 2px #1b1722,0 24px 70px #06020ec9}
.phone-top{height:36px;flex:none;padding:0 20px;font-weight:700}
.notch{width:90px;height:19px;background:#000}
.browser-bar{height:37px;flex:none;padding:0 5px 4px}
.frame-viewport{flex:1;min-height:0;height:auto;border-radius:4px;overflow:hidden}
.phone-home{position:relative;flex:none;width:100%;height:22px;margin:0;border-radius:0 0 35px 35px;background:#090811}
.phone-home::after{content:'';position:absolute;left:50%;bottom:7px;width:100px;max-width:35%;height:4px;border-radius:8px;background:#ddd9e4;transform:translateX(-50%)}

/* Presença digital: a identidade da marca como centro de gravidade. */
.presence-section{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);align-items:center;gap:clamp(32px,6vw,90px);padding:70px clamp(28px,6vw,84px);border:1px solid #34254d;border-radius:32px;background:linear-gradient(120deg,#17121f 0%,#120e1b 58%,#1d1037 100%);overflow:hidden}
.presence-section::before{content:'';position:absolute;z-index:-1;inset:auto auto -190px -120px;width:380px;height:380px;border-radius:50%;background:#4b18db;filter:blur(150px);opacity:.25;pointer-events:none}
.presence-copy{position:relative;z-index:1}
.presence-label{display:inline-flex;align-items:center;gap:12px;color:#c7b0ff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.presence-label span{font-size:16px}
.presence-section h2{max-width:16ch;margin:24px 0;font-size:clamp(34px,3.8vw,52px)}
.presence-section h2 em{font-family:'Playfair Display',Georgia,serif;font-weight:400;color:#cdbdff}
.presence-section p{max-width:52ch;margin:0;color:var(--muted);line-height:1.75}
.presence-link{display:inline-flex;align-items:center;gap:18px;margin-top:32px;color:#f5f0ff;font-weight:600}
.presence-link span{display:grid;place-items:center;width:42px;height:42px;border:1px solid #7459a5;border-radius:50%;color:#d7c5ff;font-size:19px;transition:background-color .2s,transform .2s}
@media(hover:hover){.presence-link:hover span{background:#4b18db;transform:translate(3px,-3px)}}
.presence-art{position:relative;display:grid;place-items:center;min-height:360px;isolation:isolate}
.presence-art::before{content:'';position:absolute;z-index:-1;width:70%;aspect-ratio:1;border-radius:50%;background:#4b18db;filter:blur(70px);opacity:.4}
.presence-orbit{position:absolute;left:50%;top:50%;aspect-ratio:1;border:1px solid rgba(198,176,255,.15);border-radius:50%;transform:translate(-50%,-50%)}
.presence-orbit-outer{width:min(100%,360px)}
.presence-orbit-inner{width:min(74%,270px);border-color:rgba(198,176,255,.24)}
.presence-core{display:grid;place-items:center;width:150px;aspect-ratio:1;border:1px solid rgba(226,211,255,.32);border-radius:38px;background:linear-gradient(145deg,#6638e4,#301079);box-shadow:0 22px 65px #08031580,inset 0 1px 0 #ffffff45;transform:rotate(-8deg)}
.presence-core img{width:68px;height:auto;transform:rotate(8deg)}
.presence-tag{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 15px;border:1px solid #5b477b;border-radius:50px;background:#1b1528;color:#f0eaff;font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 12px 30px #08031570}
.presence-tag span{color:#c5acff;font-size:17px;line-height:1}
.presence-tag-top{top:15%;right:0}
.presence-tag-bottom{bottom:14%;left:0}
@media(max-width:780px){.presence-section{grid-template-columns:1fr;gap:20px;padding:48px 28px}.presence-section h2{max-width:18ch}.presence-art{min-height:300px}.presence-orbit-outer{width:min(100%,300px)}.presence-orbit-inner{width:min(74%,225px)}.presence-core{width:130px}.presence-core img{width:58px}.presence-tag-top{top:13%;right:0}.presence-tag-bottom{bottom:13%;left:0}}
@media(max-width:380px){.presence-section{padding:38px 20px}.presence-art{min-height:270px}.presence-tag{padding:8px 11px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.presence-link span{transition:none}}

/* O convite e o ícone formam uma única área de interação. */
.presence-link{gap:14px;padding:7px 8px 7px 20px;border:1px solid #7459a5;border-radius:50px;background:rgba(75,24,219,.1);transition:background-color .25s,border-color .25s,box-shadow .25s}
.presence-link span{width:38px;height:38px;border-color:rgba(199,176,255,.3);background:rgba(75,24,219,.25);transition:background-color .25s,transform .25s}
@media(hover:hover){.presence-link:hover{border-color:#b59af5;background:rgba(75,24,219,.25);box-shadow:0 0 24px rgba(115,69,220,.25)}.presence-link:hover span{background:#4b18db;transform:scale(1.05)}}
@media(prefers-reduced-motion:reduce){.presence-link,.presence-link span{transition:none}.presence-link:hover span{transform:none}}