:root{--ink:#101a4a;--muted:#5f6685;--line:#e1e6f2;--paper:#f7f9ff;--white:#fff;--teal:#29cf92;--blue:#1678ff;--violet:#7357f6;--sky:#2f6df6;--shadow:0 24px 70px rgba(16,26,74,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:14px clamp(18px,4vw,56px);background:rgba(247,249,251,.9);border-bottom:1px solid rgba(223,229,236,.75);backdrop-filter:blur(18px)}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800}.brand-logo{display:block;width:190px;max-width:42vw;height:auto}.brand-mark{display:grid;place-items:center;width:42px;height:42px;color:var(--white);background:linear-gradient(135deg,var(--blue),var(--violet));border-radius:8px;letter-spacing:0}.brand-name{font-size:1.08rem}.site-nav{display:flex;align-items:center;gap:28px;color:var(--muted);font-size:.94rem;font-weight:600}.site-nav a:hover{color:var(--ink)}.site-nav .client-area-link{display:inline-flex;align-items:center;min-height:38px;padding:0 13px;color:var(--white);background:linear-gradient(135deg,var(--blue),var(--violet));border-radius:8px}.site-nav .client-area-link:hover{color:var(--white);background:var(--ink)}.menu-button{display:none;width:42px;height:42px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.menu-button span{display:block;height:2px;margin:5px 0;background:var(--ink)}.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr);gap:clamp(28px,5vw,70px);align-items:center;min-height:calc(100vh - 72px);padding:clamp(42px,7vw,92px) clamp(18px,4vw,56px) clamp(34px,5vw,64px);overflow:hidden}.hero:before{content:"";position:absolute;inset:auto -10% -24% 44%;height:58%;background:radial-gradient(circle at center,rgba(47,109,246,.2),transparent 63%);pointer-events:none}.hero-content{position:relative;max-width:720px}.eyebrow,.section-kicker{margin:0 0 14px;color:var(--blue);font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{margin-bottom:14px;font-size:clamp(1.8rem,5.5vw,3.4rem);line-height:1.08;letter-spacing:-0.02em}h2{max-width:760px;margin-bottom:22px;font-size:clamp(1.4rem,3.5vw,2.2rem);line-height:1.18;letter-spacing:-0.01em}h3{margin-bottom:10px;font-size:1.08rem}.hero-lead{max-width:650px;color:#313a67;font-size:clamp(1.08rem,2vw,1.32rem)}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 26px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border:1px solid transparent;border-radius:8px;font-weight:800;cursor:pointer}.button.primary{color:var(--white);background:var(--ink)}.button.primary:hover{background:linear-gradient(135deg,var(--blue),var(--violet))}.button.secondary{border-color:var(--line);background:var(--white)}.trust-line{display:flex;flex-wrap:wrap;gap:10px;color:var(--muted);font-size:.9rem;font-weight:700}.trust-line span{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.68)}.hero-media{position:relative;min-height:420px} .dashboard-window{position:relative;margin-left:auto;max-width:620px;padding:12px;border:1px solid rgba(255,255,255,.75);border-radius:8px;background:rgba(255,255,255,.74);box-shadow:var(--shadow);backdrop-filter:blur(14px)}.window-bar{display:flex;gap:7px;padding:6px 6px 14px}.window-bar span{width:11px;height:11px;border-radius:50%;background:var(--violet)}.window-bar span:nth-child(2){background:var(--teal)}.window-bar span:nth-child(3){background:var(--teal)}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metric-panel,.chart-panel,.list-panel,.contact-panel{min-height:150px;padding:18px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.metric-panel small{display:block;margin-bottom:18px;color:var(--muted);font-weight:800;text-transform:uppercase}.metric-panel strong{display:block;margin-bottom:8px;font-size:1.45rem;line-height:1.1}.metric-panel span{color:var(--muted);font-size:.95rem}.metric-panel.strong{color:var(--white);background:linear-gradient(135deg,var(--ink),#4d43d9)}.metric-panel.strong span,.metric-panel.strong small{color:rgba(255,255,255,.78)}.chart-panel{display:flex;align-items:end;gap:12px;background:#eef3ff}.chart-panel i{flex:1;min-height:30px;border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,var(--blue),var(--violet))}.contact-panel{display:grid;align-content:center;gap:8px;background:#f3f6ff}.contact-panel small{color:var(--violet);font-weight:900;text-transform:uppercase}.contact-panel strong{font-size:1.45rem;line-height:1.1}.contact-panel span{color:var(--muted);font-size:.95rem}.contact-panel a{width:max-content;margin-top:8px;color:var(--ink);font-weight:900;border-bottom:2px solid var(--violet)}.section{padding:clamp(58px,8vw,108px) clamp(18px,4vw,56px)}.intro-section{padding-top:26px}.tagline-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.tagline{min-height:86px;padding:16px;color:var(--ink);text-align:left;border:1px solid var(--line);border-radius:8px;background:var(--white);font:inherit;font-weight:800;cursor:pointer}.tagline.active,.tagline:hover{color:var(--white);border-color:var(--ink);background:var(--ink)}.split-section{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(30px,6vw,80px)}.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.service-card{min-height:246px;padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.service-card p,.benefit p,.timeline p,.contact-copy p{color:var(--muted)}.icon-box{display:grid;place-items:center;width:54px;height:42px;margin-bottom:22px;color:var(--white);border-radius:8px;background:var(--blue);font-size:.78rem;font-weight:900}.service-card:nth-child(2) .icon-box{background:var(--teal)}.service-card:nth-child(3) .icon-box{background:var(--violet)}.service-card:nth-child(4) .icon-box{color:var(--white);background:var(--teal)}.solutions{background:var(--white)}.section-heading{margin-bottom:34px}.benefit-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.benefit{min-height:250px;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.benefit span{display:block;margin-bottom:54px;color:var(--teal);font-weight:900}.process{background:#eef3ff}.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.timeline article{position:relative;min-height:240px;padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.timeline span{display:grid;place-items:center;width:38px;height:38px;margin-bottom:42px;color:var(--white);border-radius:50%;background:var(--ink);font-weight:900}.contact-section{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,.72fr);gap:clamp(28px,6vw,86px);padding:clamp(58px,8vw,108px) clamp(18px,4vw,56px);color:var(--white);background:var(--ink)}.contact-copy p,.contact-section .eyebrow{color:rgba(255,255,255,.72)}.contact-form{display:grid;gap:14px;padding:22px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:rgba(255,255,255,.08)}.contact-form label{display:grid;gap:7px;color:rgba(255,255,255,.78);font-size:.9rem;font-weight:700}.contact-form input,.contact-form textarea{width:100%;padding:13px 14px;color:var(--white);border:1px solid rgba(255,255,255,.2);border-radius:8px;background:rgba(255,255,255,.08);font:inherit}.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,.45)}.contact-form .button.primary{color:var(--white);background:var(--teal)}.form-note{margin:0;color:rgba(255,255,255,.58);font-size:.82rem}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px clamp(18px,4vw,56px);border-top:1px solid var(--line);background:var(--white)}.site-footer div{display:grid;gap:2px}.site-footer span,.site-footer a{color:var(--muted);font-size:.92rem}@media (max-width:980px){.hero,.split-section,.contact-section{grid-template-columns:1fr}.hero{min-height:auto}.hero-media{order:-1;min-height:auto}.tagline-board,.timeline{grid-template-columns:repeat(2,minmax(0,1fr))}.benefit-list{grid-template-columns:1fr}}@media (max-width:720px){.brand-logo{width:152px}.menu-button{display:block}.site-nav{position:absolute;top:72px;right:18px;left:18px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:var(--shadow)}.site-nav.open{display:flex}.site-nav a{padding:14px}h1{font-size:clamp(1.4rem,8vw,2.0rem);line-height:1.15}h2{font-size:clamp(1.1rem,6vw,1.5rem);line-height:1.25}.dashboard-grid,.service-grid,.tagline-board,.timeline{grid-template-columns:1fr}.dashboard-window{padding:10px}.metric-panel,.chart-panel,.list-panel,.contact-panel{min-height:132px}.site-footer{align-items:flex-start;flex-direction:column}} .whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:30;display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 16px;color:#fff;background:#29cf92;border-radius:999px;font-weight:900;box-shadow:0 14px 34px rgba(41,207,146,.34);animation:whatsapp-pulse 1.7s ease-in-out infinite}.whatsapp-float svg{width:26px;height:26px;fill:currentColor}.whatsapp-float:hover{background:#22b87f;transform:translateY(-2px)}@keyframes whatsapp-pulse{0%,100%{box-shadow:0 14px 34px rgba(41,207,146,.34);filter:brightness(1)}50%{box-shadow:0 14px 34px rgba(41,207,146,.62),0 0 0 9px rgba(41,207,146,.16);filter:brightness(1.08)}}@media (max-width:720px){.whatsapp-float{right:16px;bottom:16px;min-height:52px;padding:0 14px}.whatsapp-float span{display:none}.whatsapp-float svg{width:28px;height:28px}} .industries{background:var(--paper)}.industries .section-heading p:not(.eyebrow){max-width:780px;color:var(--muted);font-size:1.05rem}.industry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.industry-grid article{min-height:190px;padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.industry-grid h3{margin-bottom:10px}.industry-grid p{color:var(--muted)}@media (max-width:980px){.industry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.industry-grid{grid-template-columns:1fr}} .text-link{display:inline-flex;align-items:center;width:max-content;margin-top:14px;color:var(--blue);font-weight:900;border-bottom:2px solid var(--violet)}.industry-grid article{display:flex;flex-direction:column}.industry-grid .text-link{margin-top:auto}.detail-page{background:var(--paper)}.detail-hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(320px,1.15fr);gap:clamp(28px,5vw,70px);align-items:center;padding:clamp(48px,7vw,92px) clamp(18px,4vw,56px)}.detail-hero h1{font-size:clamp(1.7rem,5vw,2.8rem);line-height:1.15;letter-spacing:-0.01em}.detail-hero p{max-width:760px;color:#313a67;font-size:1.15rem}.detail-hero img{width:100%;border-radius:8px;box-shadow:var(--shadow)}.detail-section{padding:clamp(50px,7vw,92px) clamp(18px,4vw,56px);background:var(--white);border-top:1px solid var(--line)}.detail-section:nth-of-type(odd){background:var(--paper)}.detail-cards{display:grid;gap:14px}.detail-cards.three{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-cards article,.insight-panel{padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.detail-cards span{display:block;margin-bottom:14px;color:var(--blue);font-weight:900;text-transform:uppercase}.detail-cards p,.insight-panel p,.check-list,.example-list{color:var(--muted)}.detail-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);gap:clamp(24px,5vw,64px);align-items:start}.check-list,.example-list{display:grid;gap:12px;padding-left:20px;font-size:1.03rem}.insight-panel{background:#f3f6ff}.insight-panel strong{display:block;margin-bottom:12px;font-size:1.25rem}.detail-cta{padding:clamp(54px,7vw,90px) clamp(18px,4vw,56px);color:var(--white);background:linear-gradient(135deg,var(--ink),var(--violet))}.detail-cta p{max-width:760px;color:rgba(255,255,255,.76);font-size:1.08rem}.detail-cta .button.primary{color:var(--ink);background:var(--white)}@media (max-width:980px){.detail-hero,.detail-split{grid-template-columns:1fr}.detail-cards.three{grid-template-columns:1fr}}@media (max-width:720px){.detail-hero h1{font-size:clamp(1.35rem,8vw,1.8rem);line-height:1.2}} .benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.benefit-grid article{min-height:230px}.benefit-grid span{text-transform:none;font-size:1.05rem}@media (max-width:720px){.benefit-grid{grid-template-columns:1fr}} .rich-section{display:grid;grid-template-columns:minmax(0,.92fr) minmax(320px,1.08fr);gap:clamp(26px,5vw,66px);align-items:center}.rich-section.reverse{grid-template-columns:minmax(320px,1.08fr) minmax(0,.92fr)}.rich-section.reverse>img{order:-1}.rich-section>div>p:not(.eyebrow){max-width:760px;color:var(--muted);font-size:1.08rem}.rich-section img{width:100%;border-radius:8px;box-shadow:var(--shadow)}.feature-stack{display:grid;gap:14px}.feature-stack article,.example-grid article{padding:22px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.feature-stack strong{display:block;margin-bottom:8px;color:var(--ink);font-size:1.08rem}.feature-stack p,.example-grid p{color:var(--muted)}.differential-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.differential-list p{margin:0;padding:22px;border:1px solid var(--line);border-radius:8px;background:#f3f6ff;color:var(--muted)}.example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}@media (max-width:980px){.rich-section,.rich-section.reverse{grid-template-columns:1fr}.rich-section.reverse>img{order:0}.differential-list,.example-grid{grid-template-columns:1fr}} .solution-page{background:var(--paper)}.solution-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);gap:clamp(30px,5vw,70px);align-items:center;padding:clamp(48px,7vw,94px) clamp(18px,4vw,56px)}.solution-hero h1{font-size:clamp(1.7rem,5vw,2.8rem);line-height:1.15;letter-spacing:-0.01em}.solution-hero p{max-width:780px;color:#313a67;font-size:1.06rem;line-height:1.75}.solution-hero .lead{font-size:clamp(1.2rem,2vw,1.55rem);color:var(--ink);font-weight:700}.solution-hero img,.solution-band img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:var(--shadow)}.solution-band{padding:clamp(54px,7vw,92px) clamp(18px,4vw,56px);background:var(--white);border-top:1px solid var(--line)}.solution-band:nth-of-type(odd){background:var(--paper)}.solution-band h2{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.15;letter-spacing:-0.01em}.solution-band p,.solution-band li{color:var(--muted);font-size:1.04rem;line-height:1.72}.two-col{display:grid;grid-template-columns:minmax(0,.9fr) minmax(340px,1.1fr);gap:clamp(28px,5vw,70px);align-items:center}.two-col.reverse{grid-template-columns:minmax(340px,1.1fr) minmax(0,.9fr)}.two-col.reverse>img{order:-1}.solution-grid,.difference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.solution-grid article,.difference-grid article,.strong-examples article{padding:26px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.solution-grid strong,.difference-grid strong{display:block;margin-bottom:10px;color:var(--ink);font-size:1.12rem}.solution-grid p,.difference-grid p,.strong-examples p{margin:0;color:var(--muted);line-height:1.7}.solution-band ul{display:grid;gap:12px;margin:24px 0 0;padding-left:22px}.strong-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}@media (max-width:980px){.solution-hero,.two-col,.two-col.reverse{grid-template-columns:1fr}.two-col.reverse>img{order:0}.solution-grid,.difference-grid,.strong-examples{grid-template-columns:1fr}}@media (max-width:720px){.solution-hero,.solution-band{padding-left:18px;padding-right:18px}.solution-hero h1{font-size:clamp(1.35rem,8vw,1.8rem);line-height:1.2}} .visual-showcase{display:grid;gap:28px}.visual-copy{max-width:900px}.visual-copy p:not(.eyebrow){color:var(--muted);font-size:1.08rem;line-height:1.72}.visual-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.visual-grid figure{margin:0;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:0 14px 34px rgba(16,26,74,.08)}.visual-grid img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:none}.visual-grid figcaption{padding:12px 4px 2px;color:var(--ink);font-weight:800}@media (max-width:980px){.visual-grid{grid-template-columns:1fr}} .stock-photo{display:block;width:100%;height:100%;min-height:340px;max-height:560px;object-fit:cover;border-radius:8px;box-shadow:var(--shadow);background:#dfe6f6}.solution-hero .stock-photo{min-height:420px}.two-col .stock-photo{min-height:360px}.stock-grid figure{overflow:hidden}.stock-grid img{aspect-ratio:4/3;object-fit:cover}.stock-grid figcaption{font-size:.94rem}@media (max-width:720px){.stock-photo,.solution-hero .stock-photo,.two-col .stock-photo{min-height:240px;max-height:360px}} .seo-local{background:#eef3ff}.seo-local .section-heading p:not(.eyebrow){max-width:900px;color:var(--muted);font-size:1.08rem}.seo-keyword-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.seo-keyword-grid article{min-height:190px;padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:0 14px 34px rgba(16,26,74,.06)}.seo-keyword-grid h3{margin-bottom:10px;color:var(--ink)}.seo-keyword-grid p{margin:0;color:var(--muted)}@media (max-width:1100px){.seo-keyword-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.seo-keyword-grid{grid-template-columns:1fr}} .social-links{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.social-links a{display:inline-flex;align-items:center;min-height:34px;padding:0 11px;color:var(--ink);border:1px solid var(--line);border-radius:8px;background:var(--paper);font-weight:800}.social-links a:hover{color:var(--white);border-color:var(--ink);background:var(--ink)}@media (max-width:720px){.social-links{width:100%}.social-links a{flex:1;justify-content:center}} /* Ajuste para o botao flutuante nao cobrir as redes sociais no rodape */ .site-footer{padding-bottom:104px} .social-links{margin-left:auto} @media (max-width:720px){ .site-footer{padding-bottom:112px} .social-links{margin-left:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} .social-links a{width:100%;min-height:42px;padding:0 8px;font-size:.86rem} } .blog-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.55fr);gap:clamp(24px,5vw,64px);align-items:end;padding:clamp(54px,7vw,94px) clamp(18px,4vw,56px);background:#eef3ff}.blog-hero h1{max-width:880px;font-size:clamp(1.6rem,4.5vw,2.6rem);line-height:1.15}.blog-hero p{max-width:780px;color:var(--muted);font-size:1.08rem}.blog-tools{display:grid;gap:14px;padding:20px;border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:0 14px 34px rgba(16,26,74,.08)}.blog-tools label,.admin-form label,.calculator-card label{display:grid;gap:7px;color:var(--muted);font-weight:800}.blog-tools input,.blog-tools select,.admin-form input,.admin-form textarea,.calculator-card input,.calculator-card select,.export-section textarea{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:8px;background:var(--white);font:inherit;color:var(--ink)}.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.blog-card{border:1px solid var(--line);border-radius:8px;background:var(--white);overflow:hidden;box-shadow:0 14px 34px rgba(16,26,74,.08)}.blog-card a{display:grid;grid-template-columns:minmax(220px,.45fr) minmax(0,1fr);min-height:260px}.blog-card img{width:100%;height:100%;min-height:260px;object-fit:cover}.blog-card div{padding:24px}.blog-card span,.article-meta{display:block;margin-bottom:12px;color:var(--blue);font-weight:900}.blog-card p,.article-content p,.admin-hero p{color:var(--muted)}.blog-card strong{display:inline-flex;margin-top:10px;color:var(--ink);border-bottom:2px solid var(--violet)}.article-page{background:var(--paper)}.article-shell{max-width:980px;margin:0 auto;padding:clamp(44px,7vw,92px) clamp(18px,4vw,42px)}.article-shell h1{font-size:clamp(1.6rem,4.5vw,2.6rem);line-height:1.15}.article-cover{width:100%;max-height:520px;object-fit:cover;border-radius:8px;box-shadow:var(--shadow);margin:24px 0 34px}.article-content{font-size:1.12rem;line-height:1.85}.article-content p{margin-bottom:22px}.admin-page{background:var(--paper)}.admin-hero{padding:clamp(44px,7vw,80px) clamp(18px,4vw,56px);background:#eef3ff}.admin-hero h1{font-size:clamp(1.6rem,4.5vw,2.6rem);line-height:1.15}.admin-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.4fr);gap:22px;padding:clamp(34px,5vw,64px) clamp(18px,4vw,56px)}.admin-form,.admin-side,.export-section{padding:22px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.admin-form{display:grid;gap:14px}.admin-row{display:grid;grid-template-columns:1fr 180px 160px;gap:12px}.preview-card,.draft-list button{display:grid;gap:8px;width:100%;padding:18px;border:1px solid var(--line);border-radius:8px;background:#f3f6ff;text-align:left}.draft-list{display:grid;gap:10px}.draft-list button{cursor:pointer}.draft-list span,.empty-state{color:var(--muted)}.calculator-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.calculator-card{display:grid;gap:16px;padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:0 14px 34px rgba(16,26,74,.08)}.calculator-card h2{font-size:1.45rem;line-height:1.15}.calculator-card strong[data-result],.calculator-card [data-tax-result],.calculator-card [data-margin-result],.calculator-card [data-revenue-result],.calculator-card [data-st-result],.calculator-card [data-difal-st-result],.calculator-card [data-difal-nc-result]{display:block;padding:16px;border-radius:8px;color:var(--white);background:linear-gradient(135deg,var(--ink),var(--violet))} @media (max-width:980px){.blog-hero,.blog-card a,.admin-layout{grid-template-columns:1fr}.blog-grid,.calculator-grid{grid-template-columns:1fr}.admin-row{grid-template-columns:1fr}.blog-card img{min-height:220px}} /* --- Melhorias Comerciais, SEO e IA --- */ .video-link-container { display: flex; justify-content: center; margin-top: 14px; } .video-link { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-weight: 800; font-size: 1.05rem; transition: all 0.2s ease; border-bottom: 2px dashed var(--blue); padding-bottom: 2px; } .video-link:hover { color: var(--violet); border-bottom-color: var(--violet); transform: translateY(-1px); } /* Métricas / Prova Social */ .metrics-section { background: var(--ink); color: var(--white); padding: clamp(58px,8vw,108px) clamp(18px,4vw,56px); position: relative; overflow: hidden; } .metrics-section::before { content: ""; position: absolute; inset: auto 0 -20% auto; width: 40%; height: 60%; background: radial-gradient(circle at center, rgba(115, 87, 246, 0.25), transparent 70%); pointer-events: none; } .metrics-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; max-width: 1200px; margin: 0 auto; } .metric-card { padding: 34px 28px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 12px; background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(8px); text-align: center; transition: transform 0.3s ease; } .metric-card:hover { transform: translateY(-4px); border-color: rgba(255, 255, 255, 0.25); } .metric-card strong { display: block; font-size: clamp(2.8rem, 4vw, 4.5rem); line-height: 1; font-weight: 800; background: linear-gradient(135deg, var(--teal), var(--sky)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 12px; } .metric-card p { margin: 0; color: rgba(255, 255, 255, 0.8); font-size: 1.05rem; font-weight: 500; } /* Planos Comerciais */ .pricing-section { background: var(--paper); } .pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 1300px; margin: 40px auto 0; } .pricing-card { position: relative; display: flex; flex-direction: column; padding: 32px 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: 0 4px 20px rgba(16, 26, 74, 0.02); } .pricing-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--blue); } .pricing-card.featured { border-color: var(--violet); background: linear-gradient(180deg, var(--white), #fbfaff); box-shadow: 0 10px 40px rgba(115, 87, 246, 0.12); } .pricing-card.featured::before { content: "Mais Recomendado"; position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg, var(--blue), var(--violet)); color: var(--white); padding: 4px 14px; border-radius: 50px; font-size: 0.72rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; white-space: nowrap; } .pricing-card h3 { font-size: 1.35rem; font-weight: 800; margin-bottom: 8px; color: var(--ink); } .pricing-card .price-badge { display: inline-block; padding: 3px 8px; background: rgba(22, 120, 255, 0.08); color: var(--blue); font-size: 0.78rem; font-weight: 800; border-radius: 6px; width: max-content; margin-bottom: 20px; text-transform: uppercase; } .pricing-card.featured .price-badge { background: rgba(115, 87, 246, 0.08); color: var(--violet); } .pricing-card ul { list-style: none; padding: 0; margin: 0 0 32px 0; display: grid; gap: 12px; } .pricing-card li { font-size: 0.94rem; color: var(--muted); display: flex; align-items: flex-start; gap: 8px; line-height: 1.4; } .pricing-card li::before { content: "✓"; color: var(--teal); font-weight: 800; flex-shrink: 0; } .pricing-card .button { margin-top: auto; width: 100%; } /* Tabela Comparativa */ .compare-section { background: var(--white); border-top: 1px solid var(--line); } .compare-container { max-width: 900px; margin: 40px auto 0; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: 0 4px 20px rgba(16,26,74,0.02); } .compare-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 0.96rem; } .compare-table th, .compare-table td { padding: 16px 20px; border-bottom: 1px solid var(--line); } .compare-table th { background: var(--paper); font-weight: 800; color: var(--ink); } .compare-table tr:last-child td { border-bottom: none; } .compare-table td.brand-col { font-weight: 800; color: var(--blue); } .compare-table td.highlight { background: rgba(22, 120, 255, 0.02); } .check-icon { color: var(--teal); font-weight: 800; font-size: 1.15rem; } .cross-icon { color: #ff5b60; font-weight: 800; font-size: 1.15rem; } /* Integrações */ .integrations-section { background: var(--white); border-top: 1px solid var(--line); text-align: center; } .integrations-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; max-width: 1000px; margin: 34px auto 0; } .integration-badge { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; border: 1px solid var(--line); border-radius: 50px; background: var(--paper); font-weight: 700; font-size: 0.94rem; color: var(--ink); transition: all 0.2s ease; } .integration-badge:hover { transform: translateY(-2px); border-color: var(--blue); background: var(--white); box-shadow: 0 8px 24px rgba(22, 120, 255, 0.08); } .integration-badge svg, .integration-badge img { width: 20px; height: 20px; object-fit: contain; } /* Simulador de IA (Oficina) */ .ai-simulator { max-width: 580px; margin: 30px 0; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 12px; background: rgba(16, 26, 74, 0.95); box-shadow: var(--shadow); overflow: hidden; color: var(--white); font-family: Inter, sans-serif; text-align: left; } .ai-simulator-header { background: rgba(255, 255, 255, 0.06); padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .ai-simulator-header span { font-size: 0.82rem; font-weight: 800; color: rgba(255, 255, 255, 0.8); letter-spacing: 0.05em; text-transform: uppercase; } .ai-dots { display: flex; gap: 6px; } .ai-dots i { width: 8px; height: 8px; border-radius: 50%; background: #ff5b60; } .ai-dots i:nth-child(2) { background: #ffbe2e; } .ai-dots i:nth-child(3) { background: #29cf92; } .ai-simulator-body { padding: 20px; } .ai-input-group { margin-bottom: 18px; } .ai-input-group label { display: block; font-size: 0.82rem; font-weight: 800; margin-bottom: 8px; color: rgba(255, 255, 255, 0.7); } .ai-select-symptom { width: 100%; padding: 11px 14px; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; color: var(--white); font: inherit; font-size: 0.94rem; cursor: pointer; outline: none; } .ai-select-symptom option { background: #101a4a; color: var(--white); } .ai-button-run { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 42px; background: linear-gradient(135deg, var(--blue), var(--violet)); border: none; border-radius: 8px; color: var(--white); font-weight: 800; font-size: 0.9rem; cursor: pointer; transition: opacity 0.2s ease; margin-top: 4px; } .ai-button-run:hover { opacity: 0.9; } .ai-output-container { margin-top: 20px; padding: 16px; border-radius: 8px; background: rgba(255, 255, 255, 0.04); border: 1px dashed rgba(255, 255, 255, 0.15); min-height: 120px; } .ai-output-title { display: flex; align-items: center; gap: 8px; font-size: 0.85rem; font-weight: 800; color: var(--teal); margin-bottom: 8px; text-transform: uppercase; } .ai-output-text { font-size: 0.92rem; line-height: 1.6; color: rgba(255, 255, 255, 0.9); margin: 0; } .ai-loader { display: none; align-items: center; justify-content: center; gap: 8px; height: 80px; } .ai-loader span { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); animation: ai-bounce 1.2s infinite ease-in-out; } .ai-loader span:nth-child(2) { animation-delay: 0.2s; background: var(--violet); } .ai-loader span:nth-child(3) { animation-delay: 0.4s; background: var(--teal); } @keyframes ai-bounce { 0%, 80%, 100% { transform: scale(0); } 40% { transform: scale(1); } } /* Chat Mock (Clinica) */ .chat-mock { max-width: 480px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: #efeae2; box-shadow: var(--shadow); overflow: hidden; font-family: Arial, sans-serif; text-align: left; } .chat-header { background: #075e54; color: var(--white); padding: 10px 14px; display: flex; align-items: center; gap: 10px; } .chat-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.2); display: grid; place-items: center; font-weight: 800; font-size: 0.9rem; } .chat-info { display: grid; line-height: 1.2; } .chat-name { font-weight: 700; font-size: 0.92rem; } .chat-status { font-size: 0.72rem; color: rgba(255,255,255,0.7); } .chat-body { padding: 14px; display: grid; gap: 12px; min-height: 240px; align-content: start; } .chat-msg { max-width: 80%; padding: 10px 12px; border-radius: 8px; font-size: 0.88rem; line-height: 1.4; position: relative; } .chat-msg.sent { background: #d9fdd3; justify-self: end; border-top-right-radius: 0; } .chat-msg.received { background: var(--white); justify-self: start; border-top-left-radius: 0; } .chat-time { display: block; text-align: right; font-size: 0.65rem; color: var(--muted); margin-top: 4px; } /* Responsividade Geral */ @media (max-width: 1100px) { .pricing-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 720px) { .metrics-grid, .pricing-grid { grid-template-columns: 1fr; } .compare-container { border-radius: 0; margin-left: -18px; margin-right: -18px; } .ai-simulator, .chat-mock { max-width: 100%; } } /* Simulador de Roteirização (Distribuidoras) */ .route-simulator { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .route-simulator-header { background: var(--paper); padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); } .route-simulator-header span { font-size: 0.82rem; font-weight: 800; color: var(--ink); letter-spacing: 0.05em; text-transform: uppercase; } .route-simulator-body { padding: 20px; } .route-checkbox-group { display: grid; gap: 10px; margin-bottom: 18px; } .route-checkbox-group label { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; color: var(--ink); cursor: pointer; } .route-checkbox-group input { width: 18px; height: 18px; cursor: pointer; } .route-map-panel { margin-top: 18px; padding: 16px; border-radius: 8px; background: var(--paper); border: 1px solid var(--line); min-height: 150px; } .route-node-list { display: flex; flex-direction: column; gap: 12px; } .route-node { display: flex; align-items: center; gap: 12px; opacity: 0.5; transition: opacity 0.3s ease; } .route-node.active { opacity: 1; } .route-node-num { width: 24px; height: 24px; border-radius: 50%; background: var(--blue); color: var(--white); display: grid; place-items: center; font-weight: 800; font-size: 0.78rem; } .route-node:nth-child(2) .route-node-num { background: var(--violet); } .route-node:nth-child(3) .route-node-num { background: var(--teal); } .route-node-info { display: grid; } .route-node-title { font-weight: 700; font-size: 0.88rem; } .route-node-desc { font-size: 0.74rem; color: var(--muted); } .route-results { margin-top: 14px; display: none; grid-template-columns: repeat(2, 1fr); gap: 12px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 0.86rem; } .route-results span { color: var(--teal); font-weight: 800; } /* Simulador de Ordens Técnicas (Assistências) */ .ticket-simulator { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .ticket-simulator-header { background: var(--paper); padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); } .ticket-simulator-header span { font-size: 0.86rem; font-weight: 800; color: var(--ink); } .ticket-simulator-body { padding: 20px; display: grid; gap: 14px; } .ticket-input-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; } .ticket-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 10px; } .ticket-col { padding: 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; min-height: 140px; } .ticket-col h4 { font-size: 0.72rem; font-weight: 800; text-transform: uppercase; color: var(--muted); margin: 0 0 10px 0; border-bottom: 1px solid var(--line); padding-bottom: 4px; } .ticket-card-item { padding: 10px; background: var(--white); border: 1px solid var(--line); border-radius: 6px; font-size: 0.76rem; line-height: 1.3; margin-bottom: 8px; box-shadow: 0 2px 6px rgba(16,26,74,0.03); animation: ticket-slide-in 0.3s ease forwards; } @keyframes ticket-slide-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } /* Simulador de Split Payment (Reforma Tributária) */ .split-simulator { max-width: 580px; margin: 30px auto; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .split-simulator-header { background: var(--paper); padding: 14px 20px; border-bottom: 1px solid var(--line); font-weight: 800; } .split-simulator-body { padding: 20px; display: grid; gap: 16px; } .split-calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .split-graphic-container { margin-top: 14px; padding: 18px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; display: grid; gap: 14px; } .split-bar-outer { height: 24px; background: var(--line); border-radius: 50px; overflow: hidden; display: flex; } .split-bar-fill { height: 100%; display: flex; align-items: center; justify-content: center; color: var(--white); font-size: 0.72rem; font-weight: 800; } .split-bar-fill.net { background: var(--blue); } .split-bar-fill.tax { background: #ff5b60; } .split-legend { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; font-size: 0.8rem; } .split-legend-item { display: flex; align-items: center; gap: 6px; } .split-legend-color { width: 12px; height: 12px; border-radius: 3px; } .split-legend-color.net { background: var(--blue); } .split-legend-color.ibs { background: var(--violet); } .split-legend-color.cbs { background: var(--teal); } .split-values-list { display: grid; gap: 8px; font-size: 0.88rem; } .split-val-row { display: flex; justify-content: space-between; border-bottom: 1px dashed var(--line); padding-bottom: 6px; } .split-val-row.total { font-weight: 800; border-bottom: none; font-size: 0.98rem; color: var(--ink); } @media (max-width: 720px) { .route-simulator, .ticket-simulator, .split-simulator { max-width: 100%; } } /* Widget Simulador Pet Shop */ .pet-vaccine-widget { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .pet-widget-header { background: var(--paper); padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); } .pet-widget-header span { font-size: 0.86rem; font-weight: 800; color: var(--ink); } .pet-widget-body { padding: 20px; } .pet-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; } .pet-vaccine-card { margin-top: 16px; padding: 14px; background: #f0f7ff; border: 1px solid #d0e6ff; border-radius: 8px; display: none; animation: ticket-slide-in 0.3s ease forwards; } .pet-vaccine-title { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 0.88rem; color: var(--blue); margin-bottom: 6px; } /* Widget Calculadora de Comissão (Estética) */ .commission-calc-widget { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .commission-header { background: var(--paper); padding: 14px 20px; border-bottom: 1px solid var(--line); font-weight: 800; } .commission-body { padding: 20px; } .commission-row { display: grid; grid-template-columns: 1.5fr 1fr; gap: 12px; margin-bottom: 14px; } .commission-result-box { margin-top: 18px; padding: 16px; background: #fbf8ff; border: 1px solid #ebdfff; border-radius: 8px; display: none; grid-template-columns: 1fr 1fr; gap: 12px; animation: ticket-slide-in 0.3s ease forwards; } .commission-result-box div { display: grid; gap: 4px; font-size: 0.84rem; color: var(--muted); } .commission-result-box strong { font-size: 1.15rem; color: var(--violet); } /* Widget Agendamento Academia/Pilates */ .gym-booking-widget { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .gym-header { background: var(--paper); padding: 14px 20px; border-bottom: 1px solid var(--line); font-weight: 800; } .gym-body { padding: 20px; } .gym-slot-list { display: grid; gap: 10px; margin-top: 14px; } .gym-slot-item { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); transition: all 0.2s ease; } .gym-slot-item.full { background: var(--paper); border-color: var(--line); } .gym-slot-info { display: grid; line-height: 1.3; } .gym-slot-time { font-weight: 800; font-size: 0.94rem; } .gym-slot-status { font-size: 0.76rem; color: var(--muted); } .gym-slot-status span { font-weight: 800; } .gym-slot-status.available span { color: var(--teal); } .gym-slot-status.full span { color: #ff5b60; } /* Widget Checklist de Inspeção (Locadoras) */ .rental-inspect-widget { max-width: 580px; margin: 30px 0; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 12px; background: rgba(16, 26, 74, 0.95); box-shadow: var(--shadow); overflow: hidden; color: var(--white); font-family: Inter, sans-serif; text-align: left; } .rental-header { background: rgba(255, 255, 255, 0.06); padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .rental-header span { font-size: 0.82rem; font-weight: 800; color: rgba(255, 255, 255, 0.8); letter-spacing: 0.05em; text-transform: uppercase; } .rental-body { padding: 20px; } .rental-checkbox-list { display: grid; gap: 10px; margin-bottom: 16px; } .rental-checkbox-list label { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; cursor: pointer; } .rental-checkbox-list input { width: 18px; height: 18px; } .rental-result-panel { margin-top: 16px; padding: 14px; background: rgba(255,255,255,0.04); border: 1px dashed rgba(255,255,255,0.15); border-radius: 8px; display: none; animation: ticket-slide-in 0.3s ease forwards; } /* Widget Orçamento de Lavanderia (Lavanderias) */ .laundry-budget-widget { max-width: 580px; margin: 30px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: var(--shadow); overflow: hidden; color: var(--ink); font-family: Inter, sans-serif; text-align: left; } .laundry-header { background: var(--paper); padding: 14px 20px; border-bottom: 1px solid var(--line); font-weight: 800; } .laundry-body { padding: 20px; } .laundry-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; } .laundry-output-box { margin-top: 16px; padding: 14px; background: #f2fcf9; border: 1px solid #d2f5eb; border-radius: 8px; display: none; animation: ticket-slide-in 0.3s ease forwards; } .laundry-output-box strong { font-size: 1.18rem; color: var(--teal); } @media (max-width: 720px) { .pet-vaccine-widget, .commission-calc-widget, .gym-booking-widget, .rental-inspect-widget, .laundry-budget-widget { max-width: 100%; } } /* Mobile Menu Button X Animation */ .menu-button { transition: all 0.3s ease; } .menu-button span { transition: all 0.3s ease; } .menu-button.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); } .menu-button.open span:nth-child(2) { opacity: 0; } .menu-button.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } /* Accessibility Contrast Fix for Contact Placeholders */ .contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(255,255,255,.75) !important; } /* --- Componente de Fluxo de Processo Operacional (CRM/ERP) --- */ .process-flow-container { margin: 40px auto 0; max-width: 1200px; } .process-flow-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; position: relative; } .process-step-card { position: relative; padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: 0 4px 18px rgba(16, 26, 74, 0.02); transition: all 0.3s ease; display: flex; flex-direction: column; align-items: flex-start; z-index: 2; } .process-step-card:hover { transform: translateY(-4px); border-color: var(--blue); box-shadow: var(--shadow); } .process-step-badge { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: var(--white); background: linear-gradient(135deg, var(--blue), var(--violet)); font-weight: 800; font-size: 0.94rem; margin-bottom: 16px; } .process-step-card:nth-child(2n) .process-step-badge { background: linear-gradient(135deg, var(--violet), var(--teal)); } .process-step-card:nth-child(3n) .process-step-badge { background: linear-gradient(135deg, var(--teal), var(--sky)); } .process-step-card strong { display: block; font-size: 1.05rem; color: var(--ink); margin-bottom: 8px; font-weight: 700; } .process-step-card p { margin: 0; font-size: 0.88rem; color: var(--muted); line-height: 1.5; } /* Estilo para setas direcionais em desktop */ .process-flow-steps::before { content: ""; position: absolute; top: 42px; left: 40px; right: 40px; height: 2px; border-top: 2px dashed var(--line); z-index: 1; pointer-events: none; } @media (max-width: 980px) { .process-flow-steps { grid-template-columns: repeat(3, 1fr); } .process-flow-steps::before { display: none; } } @media (max-width: 720px) { .process-flow-steps { grid-template-columns: 1fr; gap: 20px; } } /* --- Novo Rodapé Premium --- */ .site-footer { background-color: #090e24 !important; color: rgba(255, 255, 255, 0.7) !important; padding: 64px clamp(18px, 4vw, 56px) 110px !important; /* Mantém 110px para não sobrepor o WhatsApp */ border-top: 1px solid rgba(255, 255, 255, 0.08) !important; font-family: Inter, Arial, sans-serif; display: block !important; } .footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1.2fr 1fr; gap: clamp(24px, 4vw, 48px); max-width: 1200px; margin: 0 auto; } .footer-col { display: flex; flex-direction: column; gap: 14px; } .footer-col h4 { color: var(--white) !important; font-size: 0.94rem; font-weight: 800; margin: 0 0 4px 0; text-transform: uppercase; letter-spacing: 0.05em; } .footer-col p { margin: 0; font-size: 0.88rem; line-height: 1.6; color: rgba(255, 255, 255, 0.6) !important; } .footer-col a { color: rgba(255, 255, 255, 0.6) !important; font-size: 0.88rem !important; transition: all 0.2s ease; display: inline-block; width: max-content; margin: 0 !important; } .footer-col a:hover { color: var(--teal) !important; transform: translateX(3px); } .footer-logo-wrap { display: inline-block; background: var(--white) !important; padding: 12px 18px !important; border-radius: 8px !important; max-width: 170px !important; margin-bottom: 16px !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important; } .footer-logo { display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; opacity: 1 !important; filter: none !important; } .footer-location { font-size: 0.78rem; color: rgba(255, 255, 255, 0.45); margin-top: 4px; } .footer-socials { display: flex !important; flex-direction: row !important; flex-wrap: wrap; gap: 12px; margin-top: 16px; margin-left: 0 !important; } .footer-socials a { display: flex !important; align-items: center; justify-content: center; gap: 8px; width: max-content !important; height: auto; border-radius: 50px; background: rgba(255, 255, 255, 0.05) !important; color: rgba(255, 255, 255, 0.9) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; padding: 8px 16px !important; font-size: 0.85rem !important; font-weight: 500; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; } .footer-socials a:hover { color: var(--white) !important; transform: translateY(-3px) !important; } .footer-socials a span, .footer-socials a i { color: inherit !important; } .footer-socials a.instagram:hover { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important; border-color: transparent !important; box-shadow: 0 4px 12px rgba(220, 39, 67, 0.3); } .footer-socials a.facebook:hover { background: #1877f2 !important; border-color: #1877f2 !important; box-shadow: 0 4px 12px rgba(24, 119, 242, 0.3); } .footer-socials a.linkedin:hover { background: #0077b5 !important; border-color: #0077b5 !important; box-shadow: 0 4px 12px rgba(0, 119, 181, 0.3); } .footer-socials i { font-size: 1.1rem; } .footer-bottom { max-width: 1200px; margin: 40px auto 0; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, 0.06); text-align: center; font-size: 0.78rem; color: rgba(255, 255, 255, 0.4); } .footer-bottom p { margin: 0; } @media (max-width: 980px) { .site-footer { padding-bottom: 112px !important; /* Espaço para o botão do WhatsApp no mobile */ } .footer-grid { grid-template-columns: 1.2fr 1fr; gap: 36px; } .footer-col a { width: 100%; } } @media (max-width: 580px) { .footer-grid { grid-template-columns: 1fr; gap: 28px; } .footer-bottom { margin-top: 32px; } } /* --- Estilos para Exibição de Preços nos Planos PRO --- */ .pricing-grid { grid-template-columns: repeat(3, 1fr) !important; max-width: 1160px !important; margin: 40px auto 0 !important; } .price-container { margin: 16px 0 24px; } .price-value { font-family: 'Outfit', 'Inter', sans-serif; font-size: 2.3rem; font-weight: 800; color: var(--ink); line-height: 1.1; display: flex; align-items: baseline; justify-content: flex-start; } .price-value span { font-size: 0.95rem; color: var(--muted); font-weight: 500; margin-left: 4px; } @media (max-width: 980px) { .pricing-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 24px !important; } } @media (max-width: 680px) { .pricing-grid { grid-template-columns: 1fr !important; max-width: 420px !important; } } /* Estilo para imagem promocional do módulo nos planos */ .pricing-card-media { width: 100%; height: 140px; object-fit: cover; border-radius: 8px; margin-bottom: 18px; border: 1px solid var(--line); } /* ========================================================================== MOCKUPS DOS PAINÉIS DO SISTEMA REAL QZENNIX (PT e ES) ========================================================================== */ .sys-mockup-window { background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 12px; box-shadow: 0 10px 25px rgba(0,0,0,0.1); font-family: 'Inter', sans-serif; color: #334155; overflow: hidden; width: 100%; max-width: 500px; margin: 0 auto; display: flex; flex-direction: column; } .sys-mockup-topbar { background: #e2e8f0; padding: 8px 12px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid #cbd5e1; } .sys-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; } .sys-dot.red { background: #ef4444; } .sys-dot.yellow { background: #f59e0b; } .sys-dot.green { background: #10b981; } .sys-mockup-title { font-size: 0.7rem; color: #64748b; font-weight: 600; margin-left: 10px; font-family: monospace; } .sys-mockup-body { background: #f8fafc; display: flex; height: 280px; } .sys-mockup-sidebar { background: #0f172a; color: #94a3b8; width: 80px; padding: 12px 6px; display: flex; flex-direction: column; gap: 12px; font-size: 0.55rem; align-items: center; } .sys-sidebar-item { display: flex; flex-direction: column; align-items: center; gap: 2px; width: 100%; padding: 4px 0; border-radius: 4px; cursor: pointer; opacity: 0.7; } .sys-sidebar-item.active { background: rgba(255,255,255,0.08); color: #38bdf8; opacity: 1; } .sys-mockup-content { flex-grow: 1; padding: 12px; overflow-y: auto; font-size: 0.75rem; display: flex; flex-direction: column; justify-content: space-between; } /* Efeito de animação moderno para Integrações */ .integration-badge { transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; overflow: hidden; cursor: pointer; background: var(--white); border: 1px solid var(--line); padding: 14px 20px; border-radius: 12px; font-weight: 600; color: var(--ink); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05); } .integration-badge:hover { transform: translateY(-6px) scale(1.03); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1); border-color: var(--violet); color: var(--violet); } .integration-badge::after { content: ''; position: absolute; top: 0; left: -100%; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); transform: skewX(-25deg); } .integration-badge:hover::after { animation: shineEffect 1s ease-out forwards; } @keyframes shineEffect { 0% { left: -100%; } 100% { left: 200%; } } /* Efeitos premium para Cartões de Áreas de Atuação */ .industry-grid article { transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; z-index: 1; } .industry-grid article i { transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.4s ease; transform-origin: left bottom; } .industry-grid article .text-link { transition: all 0.3s ease; } /* Efeito ao passar o mouse (Hover) */ .industry-grid article:hover { transform: translateY(-8px); box-shadow: 0 22px 40px rgba(16, 26, 74, 0.08); border-color: var(--blue); z-index: 2; } .industry-grid article:hover i { transform: scale(1.15) rotate(-4deg); filter: drop-shadow(0 8px 12px rgba(0,0,0,0.15)); } .industry-grid article:hover .text-link { transform: translateX(8px); color: var(--violet); border-bottom-color: var(--blue); } .section-heading h2 { margin-left: auto; margin-right: auto; } /* CSS DA TABELA DE PREÇOS (5 COLUNAS) GLOBAL */ .pricing-section { padding: 80px 20px; background: #f8fafc; border-top: 1px solid #e2e8f0; font-family: 'Inter', sans-serif; } .pricing-container { max-width: 1400px; margin: 0 auto; } .pricing-header { text-align: center; margin-bottom: 50px; } .pricing-header h2 { font-size: 2.5rem; color: #0f172a; margin-bottom: 15px; margin-left: auto; margin-right: auto; } .pricing-header p { font-size: 1.1rem; color: #64748b; } .pricing-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; align-items: stretch; } .pricing-card { background: white; border: 1px solid #e2e8f0; border-radius: 16px; padding: 30px 20px; text-align: center; position: relative; display: flex; flex-direction: column; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); transition: transform 0.2s, box-shadow 0.2s; } .pricing-card:hover { transform: translateY(-5px); box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); } .pricing-card h3 { font-size: 1.3rem; color: #1e293b; margin-bottom: 10px; } .pricing-card .price { font-size: 2.5rem; font-weight: 800; color: #0f172a; margin: 20px 0; } .pricing-card .price span { font-size: 1rem; color: #64748b; font-weight: 500; } .pricing-card .ideal-for { font-size: 0.95rem; color: #475569; margin-bottom: 20px; line-height: 1.5; flex-grow: 0; /* GARANTE QUE NÃO CRESÇA E EMPURRE A LISTA */ } .pricing-card .features-list { list-style: none; padding: 0; margin: 0 0 30px 0; text-align: left; flex-grow: 1; /* A LISTA CRESCE PARA ALINHAR O BOTÃO NO FUNDO */ } .pricing-card .features-list li { font-size: 0.9rem; color: #334155; margin-bottom: 12px; line-height: 1.4; position: relative; padding-left: 24px; text-align: left; display: block; } .pricing-card .features-list li i { position: absolute; left: 0; top: 4px; color: #10b981; font-size: 0.85rem; } .pricing-card .btn { display: block; width: 100%; padding: 12px; border-radius: 8px; font-weight: bold; text-decoration: none; transition: all 0.2s; margin-top: auto; /* Garante botão colado no fundo */ } .btn-outline { background: white; border: 2px solid #0070f3; color: #0070f3; } .btn-outline:hover { background: rgba(0,112,243,0.05); } .pricing-card.recommended { border: 2px solid #0070f3; box-shadow: 0 10px 25px -5px rgba(0,112,243,0.15); transform: scale(1.03); z-index: 2; } .pricing-card.recommended:hover { transform: scale(1.03) translateY(-5px); } .pricing-card.recommended .badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: #0070f3; color: white; font-size: 0.8rem; font-weight: bold; padding: 4px 12px; border-radius: 20px; text-transform: uppercase; } .pricing-card.recommended .btn-primary { background: #0070f3; color: white; border: none; } .pricing-card.recommended .btn-primary:hover { background: #005bb5; } .mei-card { background: #fffbeb; border-color: #f59e0b; } .custom-card { background: #f1f5f9; } .custom-card .price { font-size: 1.6rem; } @media (max-width: 1200px) { .pricing-grid { grid-template-columns: repeat(3, 1fr); } .pricing-card.recommended { transform: none; } .pricing-card.recommended:hover { transform: translateY(-5px); } } @media (max-width: 768px) { .pricing-grid { grid-template-columns: 1fr; } }