/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.start{inset-inline-start:var(--spacing)}.hidden{display:none}.table{display:table}.resize{resize:both}}.action-icon{flex:none;width:1.55rem;height:1.55rem;display:inline-block}.action-icon.small{width:1rem;height:1rem}.mobile-contact-actions a{justify-content:center;align-items:center;gap:.28rem;display:flex}@media (width<=650px) and (height<=760px){.site-header{height:52px!important}.mobile-conversion{height:calc(100dvh - 52px)!important;padding-bottom:48px!important}.mobile-hero-copy{height:205px!important;min-height:0!important;padding-top:.65rem!important}.mobile-hero-photo{height:205px!important;top:52px!important}.mobile-hero-copy h2{font-size:clamp(1.14rem,5.8vw,1.5rem)!important}.mobile-hero-copy>p:not(.mobile-kicker){font-size:.6rem!important}.mobile-whatsapp-primary{padding:.38rem .25rem!important}.mobile-benefits{height:109px!important;margin:.3rem .65rem!important}.mobile-benefits p{height:35px!important}.mobile-benefits i{flex-basis:22px!important;width:22px!important;height:22px!important}.mobile-benefits span{font-size:.62rem!important}.mobile-benefits small{font-size:.48rem!important}.mobile-trust{height:62px!important;margin:0 .65rem .25rem!important;padding:.28rem!important}.mobile-trust p{font-size:.43rem!important}.mobile-trust div{font-size:.68rem!important}.mobile-trust strong{margin:.1rem!important;font-size:.62rem!important}.mobile-trust small{font-size:.45rem!important}.mobile-cta-secondary{height:33px!important;margin:0 .65rem .25rem!important;padding:.55rem .2rem!important;font-size:.54rem!important}.mobile-contact-actions{height:32px!important;margin:0 .65rem .25rem!important}.mobile-contact-actions a{padding:.52rem .1rem!important;font-size:.46rem!important}.mobile-contact-info{height:43px!important;padding:.3rem .7rem!important;font-size:.42rem!important}.mobile-contact-info b{font-size:.58rem!important}.mobile-whatsapp-fixed{height:42px!important;min-height:42px!important}.mobile-whatsapp-fixed>b{font-size:1.1rem!important}}@media (width<=360px){.site-header .logo small{max-width:145px!important}.mobile-hero-copy{padding-left:.65rem!important;padding-right:40%!important}.mobile-hero-copy h2{font-size:1.08rem!important}.mobile-hero-copy>p:not(.mobile-kicker){font-size:.57rem!important}.mobile-hero-photo{width:62%!important}.mobile-benefits,.mobile-trust,.mobile-cta-secondary,.mobile-contact-actions{margin-left:.55rem!important;margin-right:.55rem!important}.mobile-contact-actions a{font-size:.43rem!important}}@media (width<=650px) and (height>=900px){.mobile-hero-copy,.mobile-hero-photo{height:285px!important}.mobile-benefits{height:142px!important}.mobile-benefits p{height:45px!important}.mobile-trust{height:88px!important}.mobile-contact-info{height:60px!important}}@media (width<=650px){.site-header:after{display:none!important}.mobile-hero-copy{background:linear-gradient(90deg,#ffffffe6 0% 38%,#fffffff0 46%,#fff5 64%,#fff0 76%)!important}.mobile-hero-photo img{filter:contrast(1.04)saturate(1.04)}.mobile-whatsapp-fixed{justify-content:center!important;width:190px!important;padding:.28rem .65rem!important;left:auto!important;right:8px!important}.mobile-whatsapp-fixed>b{margin-right:.4rem!important}.mobile-whatsapp-fixed i,.mobile-whatsapp-fixed small{display:none}.mobile-contact-info{padding-right:.7rem!important}}@media (width<=360px){.mobile-whatsapp-fixed{width:165px!important}.mobile-whatsapp-fixed span{font-size:.58rem!important}}:root{--dark:#0f1c1b;--green:#194c47;--accent:#c88418;--accent2:#e5a735;--cream:#f6f3ec;--ink:#171b1a;--muted:#626866;--line:#d7d2c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:#fff;margin:0;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.gold-label{letter-spacing:.17em;color:var(--accent);margin:0 0 1.1rem;font-size:.69rem;font-weight:800}.site-header{z-index:30;background:#fff;border-bottom:1px solid #e6e2da;justify-content:space-between;align-items:center;height:80px;padding:0 4vw;display:flex;position:sticky;top:0}.logo{align-items:center;gap:.8rem;display:flex}.logo i{border:2px solid var(--accent);width:42px;height:47px;color:var(--accent);place-items:center;font-family:Georgia,serif;font-style:normal;font-weight:700;display:grid}.logo span{flex-direction:column;display:flex}.logo b{letter-spacing:.06em;font-family:Georgia,serif;font-size:1.55rem}.logo small{letter-spacing:.1em;font-size:.49rem;font-weight:700}.site-header nav{gap:1.7rem;font-size:.68rem;font-weight:800;display:flex}.site-header nav a:hover{color:var(--accent)}.header-contact{background:var(--dark);color:#fff;border:1px solid var(--accent);flex-direction:column;padding:.75rem 1rem;display:flex}.header-contact small{color:var(--accent2);font-size:.5rem}.header-contact b{margin-top:.25rem;font-size:.72rem}.mobile-conversion,.mobile-whatsapp-fixed{display:none}.desktop-hero-title{margin:0 0 1.8rem;font-family:Georgia,serif;font-size:clamp(2.65rem,4vw,4.25rem);line-height:1.15}.desktop-hero-title em{color:var(--accent);font-style:normal;display:block}.xerox-hero{background:var(--cream);border-bottom:1px solid var(--accent);grid-template-columns:38% 29% 33%;min-height:725px;display:grid}.hero-message{padding:6.4rem 3.4rem 3.2rem 6.5vw}.hero-message h1{margin:0 0 1.8rem;font-family:Georgia,serif;font-size:clamp(2.65rem,4vw,4.25rem);line-height:1.15}.hero-message h1 em{color:var(--accent);font-style:normal;display:block}.hero-description{color:#555;max-width:520px;font-size:1rem;line-height:1.75}.hero-icons{grid-template-columns:repeat(4,1fr);gap:.8rem;margin-top:2.8rem;display:grid}.hero-icons span{text-align:center;flex-direction:column;align-items:center;font-size:.65rem;line-height:1.4;display:flex}.hero-icons i{border:1px solid var(--accent);width:38px;height:38px;color:var(--accent);border-radius:50%;place-items:center;margin-bottom:.6rem;font-size:1rem;font-style:normal;display:grid}.hero-photo{overflow:hidden}.hero-photo img{object-fit:cover;object-position:center;width:100%;height:100%}.hero-form{color:#fff;border:2px solid var(--accent);background:#111716;flex-direction:column;margin:2.65rem 2.2rem 2.65rem 0;padding:2.4rem 2.2rem;display:flex;box-shadow:0 20px 35px #0003}.hero-form h2{text-align:center;margin:0;font-family:Georgia,serif;font-size:clamp(1.05rem,2.2vw,1.45rem);line-height:1.2;text-wrap:balance}.hero-form h3{text-align:center;color:var(--accent);margin:.35rem 0;font-size:.82rem}.hero-form>p{text-align:center;color:#c7c7c7;margin:.2rem 0 1rem;font-size:.72rem}.free-box{border:1px solid var(--accent);color:#f0c575;text-align:center;background:#2a2218;margin-bottom:.8rem;padding:.75rem;font-size:.72rem;font-weight:800}.free-box small{color:#d9d0c2;margin-top:.2rem;font-size:.5rem;display:block}.hero-form input,.hero-form select,.hero-form textarea{color:#333;background:#fff;border:0;width:100%;margin:.22rem 0;padding:.69rem .75rem;font-size:.74rem}.hero-form .upload{color:#222;text-align:center;background:#fff;margin:.22rem 0;padding:.6rem;font-size:.58rem}.hero-form .upload input{margin:0 0 .2rem;padding:0;font-size:.65rem}.consent{color:#bdbdbd;align-items:center;padding:.45rem 0;font-size:.52rem;display:flex}.consent input{width:auto;margin-right:.4rem}.hero-form button{color:#fff;background:linear-gradient(90deg,#c87909,#e4a63b);border:0;padding:.9rem;font-size:.72rem;font-weight:900}.hero-form>small{text-align:center;color:#bbb;margin-top:.6rem;font-size:.56rem}.stats{color:#fff;background:#111716;grid-template-columns:repeat(4,1fr);padding:1.55rem 6vw;display:grid}.stats div{border-right:1px solid #3a403e;padding:0 2rem}.stats div:last-child{border:0}.stats b{color:var(--accent2);font-family:Georgia,serif;font-size:1.35rem;display:block}.stats span{letter-spacing:.07em;color:#c2c2c2;font-size:.56rem}.channels{border-bottom:1px solid var(--line);background:#fff;padding:2.7rem 6vw}.channels>p{text-align:center;letter-spacing:.18em;color:#777;margin:0 0 1.5rem;font-size:.61rem;font-weight:900}.channels>div{grid-template-columns:repeat(6,1fr);gap:1rem;display:grid}.channels figure{border:1px solid var(--line);background:#fff;justify-content:center;align-items:center;height:92px;margin:0;display:flex;overflow:hidden}.channels img{object-fit:contain;max-width:78%;max-height:65px}.channels figcaption{position:absolute;left:-9999px}.channels .amazon img{object-fit:cover;width:100%;max-width:none;height:100%;max-height:none}.testimonials{border-bottom:1px solid var(--line);background:#f6f3ec;padding:5.5rem 6vw}.testimonial-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.2rem;max-width:1180px;margin:auto;display:grid}.testimonial-grid article{border:1px solid var(--line);border-top:3px solid var(--accent);background:#fff;padding:2rem;position:relative;box-shadow:0 12px 30px #0f1c1b0b}.testimonial-stars{color:#e5a735;letter-spacing:.15em;font-size:1rem}.testimonial-grid blockquote{color:#29302e;margin:1rem 0 1.6rem;font-family:Georgia,serif;font-size:1.15rem;line-height:1.55}.testimonial-grid article footer{color:inherit;background:0 0;flex-direction:column;grid-template-columns:none;align-items:flex-start;gap:.2rem;margin:0;padding:0;display:flex}.testimonial-grid article footer b{font-size:.82rem}.testimonial-grid article footer span{color:var(--muted);font-size:.66rem}.sample{border-bottom:1px solid var(--line);background:#ede9e0;justify-content:space-between;align-items:center;gap:3rem;padding:4.5rem 7vw;display:flex}.sample h2{max-width:720px;margin:.3rem 0;font-family:Georgia,serif;font-size:2.25rem}.sample p:not(.gold-label){color:var(--muted);max-width:700px;line-height:1.7}.sample>a{background:var(--dark);color:#fff;border:1px solid var(--accent);white-space:nowrap;padding:1.1rem 1.4rem;font-size:.7rem;font-weight:900}.areas-section,.blog,.faq,.regimes{padding:6rem 6vw}.section-title{text-align:center;max-width:850px;margin:0 auto 3rem}.section-title h2{margin:.3rem 0;font-family:Georgia,serif;font-size:2.55rem}.section-title>p:not(.gold-label){color:var(--muted);line-height:1.7}.area-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.area-card{border:1px solid var(--line);background:#fff;flex-direction:column;min-height:520px;padding:2rem;transition:all .2s;display:flex}.area-card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 12px 30px #0001}.area-card .number{color:var(--accent);font-family:Georgia,serif;font-size:1.2rem}.area-card h3{margin:1rem 0 .2rem;font-family:Georgia,serif;font-size:1.35rem}.area-card>small{color:var(--accent);font-size:.65rem;font-weight:700}.area-card ul{gap:.53rem;margin:1.5rem 0;padding:0;list-style:none;display:grid}.area-card li{color:#515755;padding-left:1rem;font-size:.76rem;position:relative}.area-card li:before{content:"";background:var(--accent);border-radius:50%;width:4px;height:4px;position:absolute;top:.43rem;left:0}.area-card>a{border-top:1px solid var(--line);margin-top:auto;padding-top:1rem;font-size:.65rem;font-weight:900}.area-card>a span{float:right;color:var(--accent)}.method-section{background:var(--dark);color:#fff;padding:5rem 6vw}.section-title.light h2{color:#fff}.method-steps{border-top:1px solid #43504d;grid-template-columns:repeat(7,1fr);display:grid}.method-steps div{border-right:1px solid #43504d;min-height:140px;padding:2rem 1rem}.method-steps b{color:var(--accent2);margin-bottom:1rem;font-family:Georgia,serif;font-size:1.4rem;display:block}.method-steps span{font-size:.63rem;font-weight:800;line-height:1.5}.director{background:var(--cream);grid-template-columns:.8fr 1.2fr;align-items:center;gap:7vw;padding:6rem 8vw;display:grid}.director-photo{max-width:500px}.director-photo img{width:100%;display:block}.director h2{margin:.2rem 0;font-family:Georgia,serif;font-size:3rem}.director>div>p:not(.gold-label){color:#555;font-family:Georgia,serif;font-size:1.2rem;line-height:1.65}.formation{border-top:1px solid var(--line);border-left:1px solid var(--line);grid-template-columns:1fr 1fr;margin:1.5rem 0;display:grid}.formation span{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:.8rem;font-size:.7rem;font-weight:700}.languages{flex-wrap:wrap;align-items:center;gap:.7rem;display:flex}.languages p{letter-spacing:.15em;width:100%;color:var(--accent);font-size:.61rem;font-weight:900}.languages span{align-items:center;gap:.35rem;font-size:.57rem;font-weight:900;display:flex}.languages b{color:#fff;border-radius:8px;place-items:center;width:34px;height:34px;display:grid}.basic b{background:#326b9c}.cobol b{background:#174c7a}.clipper b{background:#d04a34}.python b{color:#111;background:linear-gradient(135deg,#3776ab 50%,#ffd343 50%)}.blog{overflow:hidden}.blog-carousel{position:relative}.blog-track{scroll-snap-type:x mandatory;scrollbar-width:none;gap:1.3rem;padding:.4rem .1rem 1.5rem;display:flex;overflow-x:auto}.blog-track::-webkit-scrollbar{display:none}.blog-card{border:1px solid var(--line);scroll-snap-align:start;background:#fff;flex-direction:column;flex:0 0 calc(33.3333% - .866667rem);transition:all .25s;display:flex}.blog-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 18px 38px #00000012}.blog-visual{background:#172a28;height:225px;position:relative;overflow:hidden}.blog-visual:after{content:"";background:linear-gradient(#0000,#0b1212d9);position:absolute;inset:45% 0 0}.blog-visual img{object-fit:cover;width:100%;height:100%;transition:all .5s;display:block}.blog-card:hover .blog-visual img{transform:scale(1.04)}.blog-visual span{z-index:1;color:#fff;letter-spacing:.14em;font-size:.58rem;font-weight:900;position:absolute;bottom:1rem;left:1.2rem}.blog-content{flex-direction:column;min-height:350px;padding:1.65rem;display:flex}.blog-content small{color:var(--accent);letter-spacing:.08em;font-size:.58rem;font-weight:900}.blog-content h3{margin:.85rem 0;font-family:Georgia,serif;font-size:1.32rem;line-height:1.35}.blog-content p{color:var(--muted);margin:0 0 1.4rem;font-size:.79rem;line-height:1.75}.blog-content a{border-top:1px solid var(--line);margin-top:auto;padding-top:1rem;font-size:.62rem;font-weight:900}.blog-content a b{float:right;color:var(--accent);font-size:.9rem}.blog-controls{justify-content:center;align-items:center;gap:1.3rem;margin-top:1.1rem;display:flex}.blog-controls>button{border:1px solid var(--dark);width:43px;height:43px;color:var(--dark);cursor:pointer;background:#fff;font-size:1.1rem;transition:all .2s}.blog-controls>button:hover{background:var(--dark);color:#fff}.blog-dots{align-items:center;gap:.55rem;display:flex}.blog-dots button{cursor:pointer;background:#c8c5bd;border:0;border-radius:50%;width:8px;height:8px;padding:0}.blog-dots button.active{background:var(--accent);border-radius:8px;width:25px}.faq{background:#f3f0e9}.faq-list{max-width:950px;margin:auto}.faq details{border-top:1px solid #cfc9bd;padding:1.25rem}.faq details:last-child{border-bottom:1px solid #cfc9bd}.faq summary{cursor:pointer;font-family:Georgia,serif;font-size:1.12rem;font-weight:700}.faq details p{color:var(--muted);font-size:.8rem;line-height:1.7}.closing{text-align:center;background:var(--green);color:#fff;padding:5.5rem 1rem}.closing h2{margin:1rem 0 2rem;font-family:Georgia,serif;font-size:3.5rem}.closing a{background:var(--dark);border:1px solid var(--accent);padding:1rem 1.3rem;font-size:.68rem;font-weight:900}footer{color:#fff;background:#0d1514;grid-template-columns:1fr 1fr auto;align-items:center;gap:2rem;padding:3rem 5vw;display:grid}footer p{color:#aaa;font-size:.7rem}footer nav{gap:1rem;font-size:.6rem;font-weight:900;display:flex}footer>small{color:#777;border-top:1px solid #35403e;grid-column:1/-1;padding-top:1rem;font-size:.55rem}@media (width<=1050px){.site-header nav{display:none}.xerox-hero{grid-template-columns:1fr 1fr}.hero-message{padding:4rem 5vw}.hero-photo{min-height:620px}.hero-form{grid-column:1/-1;margin:0;padding:3rem 8vw}.area-grid{grid-template-columns:repeat(2,1fr)}.blog-card{flex-basis:calc(50% - .65rem)}.method-steps{grid-template-columns:repeat(4,1fr)}.channels>div{grid-template-columns:repeat(3,1fr)}.testimonial-grid{grid-template-columns:1fr}}@media (width<=650px){body{padding-bottom:72px}.site-header{height:68px;padding:0 1rem;position:relative}.site-header:after{content:none}.header-contact{display:none}.logo i{width:36px;height:40px}.logo b{font-size:1.25rem}.logo small{max-width:205px;font-size:.42rem}.mobile-conversion{background:#fff;display:block}.mobile-hero-copy{z-index:2;background:linear-gradient(90deg,#ffffffe6 0% 49%,#ffffffa8 65%,#ffffff08 82%);min-height:365px;padding:2.2rem 43% 1.5rem 1.1rem;position:relative}.mobile-hero-copy h2{color:var(--dark);margin:.55rem 0 .8rem;font-family:Georgia,serif;font-size:clamp(1.65rem,8vw,2.2rem);line-height:1.06}.mobile-hero-copy>p:not(.mobile-kicker){color:#4d5552;margin:0 0 1rem;font-size:.83rem;line-height:1.45}.mobile-kicker{letter-spacing:.11em;color:var(--accent);margin:0;font-size:.52rem;font-weight:900;line-height:1.35}.mobile-hero-photo{z-index:1;background:var(--cream);width:58%;height:365px;position:absolute;top:68px;right:0;overflow:hidden}.mobile-hero-photo img{object-fit:cover;object-position:46% top;width:100%;height:100%}.mobile-whatsapp-primary{color:#fff;text-align:left;background:#12a84a;border-radius:6px;justify-content:center;align-items:center;gap:.6rem;padding:.72rem .6rem;font-size:.74rem;font-weight:800;line-height:1.05;display:flex;box-shadow:0 7px 15px #0b7e3838}.mobile-whatsapp-primary>b{font-size:1.65rem}.mobile-whatsapp-primary small{font-size:.63rem;font-weight:600}.mobile-benefits{background:#fff;border:1px solid #dedbd4;border-radius:5px;margin:1rem;padding:.35rem 1rem}.mobile-benefits p{border-bottom:1px solid #e3e0da;align-items:center;gap:.9rem;margin:0;padding:.75rem 0;display:flex}.mobile-benefits p:last-child{border:0}.mobile-benefits i{border:1px solid var(--accent);width:32px;height:32px;color:var(--accent);border-radius:50%;place-items:center;font-style:normal;font-weight:900;display:grid}.mobile-benefits span{flex-direction:column;font-size:.83rem;display:flex}.mobile-benefits small{color:var(--muted);margin-top:.18rem;font-size:.65rem}.mobile-trust{text-align:center;background:var(--cream);border:1px solid #dedbd4;border-radius:5px;margin:0 1rem 1rem;padding:1rem}.mobile-trust p{letter-spacing:.06em;margin:0 0 .35rem;font-size:.62rem;font-weight:900}.mobile-trust div{color:#e3a51d;letter-spacing:.15em;font-size:1.2rem}.mobile-trust strong{margin:.4rem 0;font-family:Georgia,serif;font-size:.96rem;display:block}.mobile-trust small{color:var(--muted);font-size:.67rem;line-height:1.45;display:block}.mobile-cta-secondary{text-align:center;background:var(--dark);color:#fff;border-bottom:3px solid var(--accent);border-radius:5px;margin:0 1rem .7rem;padding:1rem .6rem;font-size:.75rem;font-weight:900;display:block}.mobile-contact-actions{border:1px solid #ddd;border-radius:5px;grid-template-columns:1fr 1.35fr;margin:0 1rem 1rem;display:grid}.mobile-contact-actions a{text-align:center;padding:.85rem .35rem;font-size:.62rem;font-weight:900}.mobile-contact-actions a+a{color:#0c973e;border-left:1px solid #ddd}.mobile-contact-info{background:var(--dark);color:#fff;flex-direction:column;gap:.3rem;padding:1.2rem 1.15rem 1.5rem;font-size:.69rem;display:flex}.mobile-contact-info b{color:var(--accent2);font-family:Georgia,serif;font-size:.95rem}.mobile-contact-info span{color:#d3d8d6}.mobile-whatsapp-fixed{z-index:60;color:#fff;background:#10ad4a;border-radius:30px;align-items:center;min-height:56px;padding:.45rem 1rem;display:flex;position:fixed;bottom:8px;left:12px;right:12px;box-shadow:0 4px 20px #0004}.mobile-whatsapp-fixed>b{margin-right:.65rem;font-size:1.65rem}.mobile-whatsapp-fixed span{flex-direction:column;font-size:.75rem;font-weight:900;display:flex}.mobile-whatsapp-fixed small{font-size:.61rem;font-weight:500}.mobile-whatsapp-fixed i{margin-left:auto;font-size:1.1rem;font-style:normal}.xerox-hero{display:none}.stats,.area-grid,.method-steps,.formation{grid-template-columns:1fr}.blog-card{flex-basis:100%}.blog-content{min-height:330px}.blog-visual{height:210px}.stats div{border-bottom:1px solid #3a403e;border-right:0;padding:1rem}.channels>div{grid-template-columns:repeat(2,1fr)}.sample{flex-direction:column;align-items:flex-start}.area-card{min-height:500px}.director{grid-template-columns:1fr;padding:4rem 1.3rem}.closing h2{font-size:2.5rem}footer{grid-template-columns:1fr}footer nav{flex-wrap:wrap}}.form-success,.form-error{text-align:center;margin-top:.4rem;padding:.6rem;font-size:.68rem;display:block}.form-success{color:#9ee0bc}.form-error{color:#ff9a9a}.admin-shell{background:#f3f0e9;min-height:100vh}.admin-shell>header{color:#fff;border-bottom:2px solid var(--accent);background:#111716;justify-content:space-between;align-items:center;height:76px;padding:0 5vw;display:flex}.admin-shell>header div{align-items:center;gap:1rem;display:flex}.admin-shell>header span{border:1px solid var(--accent);width:40px;height:40px;color:var(--accent);place-items:center;font-family:Georgia,serif;display:grid}.admin-shell>header b{letter-spacing:.05em;font-family:Georgia,serif}.admin-shell>header a{color:var(--accent2);font-size:.65rem;font-weight:900}.admin-summary{grid-template-columns:repeat(2,240px);gap:1rem;padding:3rem 5vw 0;display:grid}.admin-summary div{border:1px solid var(--line);background:#fff;padding:1.4rem}.admin-summary b{color:var(--accent);font-family:Georgia,serif;font-size:2.2rem}.admin-summary span{margin-top:.4rem;font-size:.58rem;font-weight:900;display:block}.admin-content{padding:3rem 5vw 6rem}.admin-content>h1{font-family:Georgia,serif}.admin-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.admin-grid article{border:1px solid var(--line);background:#fff;flex-direction:column;padding:1.5rem;display:flex}.admin-card-head{color:var(--accent);justify-content:space-between;font-size:.62rem;display:flex}.admin-grid h2{margin:.9rem 0;font-family:Georgia,serif}.admin-grid p{margin:.25rem 0;font-size:.73rem}.admin-message{white-space:pre-wrap;background:#f3f0e9;margin:1rem 0;padding:1rem;font-size:.75rem;line-height:1.6}.admin-files{gap:.4rem;margin-bottom:1rem;display:grid}.admin-files a{color:var(--green);font-size:.68rem;font-weight:800}.admin-grid button{color:#9b3024;cursor:pointer;background:#fff;border:1px solid #b64435;margin-top:auto;padding:.7rem;font-size:.62rem;font-weight:900}.admin-denied{color:#fff;text-align:center;background:#111716;place-content:center;min-height:100vh;display:grid}.admin-denied h1{color:var(--accent2);font-family:Georgia,serif}.admin-denied a{color:var(--accent2)}@media (width<=950px){.admin-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.admin-summary,.admin-grid{grid-template-columns:1fr}.admin-summary{padding-top:2rem}.admin-shell>header b{font-size:.72rem}}.hero-photo{background:#e9e5dc}.hero-photo img{object-position:center top}.channels figure{background:#fff;padding:1rem}.channels img,.channels .amazon img{object-fit:contain;width:auto;max-width:82%;height:auto;max-height:56px}.channels .magalu{background:#fff}.channels .shopee img{max-height:62px}.channels .shein img{max-height:48px}.blog-track{margin-bottom:1.5rem}@media (width<=650px){main>.stats,main>.channels,main>.testimonials,main>.sample,main>.areas-section,main>.method-section,main>.blog,main>.faq,main>.closing,main>footer{display:none}.mobile-conversion{min-height:calc(100vh - 68px)}.mobile-contact-info{padding-bottom:1.8rem}html,body{height:100%;overflow:hidden}body{padding-bottom:0}.site-header{height:58px;padding:0 .85rem}.site-header:after{font-size:1.3rem}.site-header .logo{gap:.55rem}.site-header .logo i{width:32px;height:34px;font-size:.8rem}.site-header .logo b{font-size:1.05rem}.site-header .logo small{max-width:190px;font-size:.36rem}.mobile-conversion{height:calc(100dvh - 58px);min-height:0;padding-bottom:58px;overflow:hidden}.mobile-hero-copy{height:250px;min-height:0;padding:1rem 42% .7rem .85rem}.mobile-kicker{font-size:.46rem}.mobile-hero-copy h2{margin:.35rem 0 .45rem;font-size:clamp(1.3rem,6.7vw,1.75rem);line-height:1.02}.mobile-hero-copy>p:not(.mobile-kicker){margin-bottom:.55rem;font-size:.68rem;line-height:1.28}.mobile-hero-photo{width:60%;height:250px;top:58px}.mobile-whatsapp-primary{gap:.35rem;max-width:190px;padding:.48rem .35rem;font-size:.62rem}.mobile-whatsapp-primary>b{font-size:1.25rem}.mobile-whatsapp-primary small{font-size:.52rem}.mobile-benefits{height:128px;margin:.45rem .75rem;padding:.1rem .75rem}.mobile-benefits p{gap:.6rem;height:41px;padding:.25rem 0}.mobile-benefits i{flex:0 0 26px;width:26px;height:26px;font-size:.72rem}.mobile-benefits span{font-size:.7rem}.mobile-benefits small{margin-top:.06rem;font-size:.54rem}.mobile-trust{height:78px;margin:0 .75rem .4rem;padding:.42rem .6rem}.mobile-trust p{margin-bottom:.1rem;font-size:.49rem}.mobile-trust div{font-size:.86rem;line-height:1}.mobile-trust strong{margin:.2rem 0;font-size:.72rem}.mobile-trust small{font-size:.51rem;line-height:1.2}.mobile-cta-secondary{border-bottom-width:2px;height:39px;margin:0 .75rem .35rem;padding:.7rem .3rem;font-size:.61rem}.mobile-contact-actions{height:37px;margin:0 .75rem .35rem}.mobile-contact-actions a{padding:.65rem .2rem;font-size:.52rem}.mobile-contact-info{gap:.08rem;height:54px;padding:.5rem .85rem;font-size:.48rem}.mobile-contact-info b{font-size:.67rem}.mobile-whatsapp-fixed{height:48px;min-height:48px;padding:.3rem .85rem;bottom:5px;left:9px;right:9px}.mobile-whatsapp-fixed>b{font-size:1.3rem}.mobile-whatsapp-fixed span{font-size:.65rem}.mobile-whatsapp-fixed small{font-size:.5rem}}.admin-blog{color:#fff;border-top:3px solid var(--accent);background:#111716;grid-template-columns:1fr 1.3fr;gap:3rem;margin:3rem 5vw 0;padding:2rem;display:grid}.admin-blog h1{margin:.2rem 0;font-family:Georgia,serif;font-size:2rem}.admin-blog>div>p:not(.gold-label){color:#bbb;font-size:.75rem}.admin-blog form{gap:.65rem;display:grid}.admin-blog input,.admin-blog textarea{font:inherit;border:0;padding:.8rem;font-size:.75rem}.admin-blog button{background:var(--accent);color:#fff;cursor:pointer;border:0;padding:.9rem;font-size:.7rem;font-weight:900}.admin-blog form small{color:#f0c575}.admin-post-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.admin-post-grid article{border:1px solid var(--line);background:#fff;flex-direction:column;padding:1.2rem;display:flex}.admin-post-grid img{object-fit:cover;width:100%;height:150px;margin-bottom:1rem}.admin-post-grid small{color:var(--accent);font-weight:900}.admin-post-grid h2{font-size:1.15rem}.admin-post-grid p{color:var(--muted);font-size:.72rem;line-height:1.6}.admin-post-actions{grid-template-columns:1fr 1fr;gap:.5rem;margin-top:auto;display:grid}.admin-post-actions button{border:1px solid var(--green);color:var(--green);cursor:pointer;background:#fff;padding:.7rem;font-size:.6rem;font-weight:900}.admin-post-actions button:last-child{color:#9b3024;border-color:#b64435}.admin-leads{border-top:1px solid var(--line)}@media (width<=800px){.admin-blog,.admin-post-grid{grid-template-columns:1fr}}body{font-family:var(--font-sans),Arial,Helvetica,sans-serif}h1,h2,h3,.desktop-hero-title,.mobile-trust strong,.logo b{font-family:var(--font-serif),Georgia,serif}img{max-width:100%}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px;outline:3px solid #e5a735}.channels figure{background:#fff;padding:1rem;position:relative}.channels figure b{letter-spacing:-.035em;white-space:nowrap;font-size:clamp(.82rem,1.45vw,1.18rem);font-weight:900}.channels .ml b{color:#2d3277}.channels .shopee b{color:#ee4d2d}.channels .amazon b{color:#111}.channels .magalu b{color:#168bdf}.channels .shein b{letter-spacing:.16em;font-family:Arial,sans-serif}.channels .ali b{color:#e62e04}.blog-visual{background:radial-gradient(circle at 75% 20%,#c884184d 0 12%,#0000 13%),linear-gradient(135deg,#193d39,#0f1c1b 58%,#273b38)}@media (width<=650px){html,body{background:#fff;width:100%;height:100%;overflow:hidden}body{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;margin:0;padding:0!important}main{background:#fff;width:100%;height:100%;overflow:hidden}.site-header{height:58px;min-height:58px;padding:0 .85rem;position:relative}.site-header:after{display:none}.site-header .logo{gap:.55rem;min-width:0}.site-header .logo i{flex:0 0 32px;width:32px;height:34px;font-size:.8rem}.site-header .logo span{min-width:0}.site-header .logo b{font-size:1.05rem}.site-header .logo small{text-overflow:ellipsis;white-space:nowrap;max-width:calc(100vw - 80px);font-size:.36rem;overflow:hidden}.mobile-conversion{background:#fff;grid-template-rows:39% 4% 20% 15% 6% 6% 10%;grid-template-columns:minmax(0,1fr);width:100%;height:calc(100dvh - 58px);min-height:0;padding:0;display:grid;overflow:hidden}.mobile-hero-copy{z-index:2;background:linear-gradient(90deg,#ffffffe6 0% 38%,#fffffff0 47%,#fff5 65%,#fff0 78%);flex-direction:column;grid-area:1/1;justify-content:center;align-self:stretch;padding:.25rem 42% .25rem .85rem;display:flex;position:relative;overflow:hidden;height:auto!important;min-height:0!important}.mobile-hero-photo{width:60%;max-height:none;line-height:0;top:58px;right:0;overflow:hidden;height:calc(39dvh - 22.62px)!important;min-height:0!important}.mobile-hero-photo img{object-fit:cover;object-position:46% top;filter:contrast(1.06)saturate(1.05);width:100%;height:100%;display:block}.mobile-marketplaces{box-sizing:border-box;z-index:4;white-space:nowrap;background:#fff;border-top:1px solid #eeeae2;border-bottom:1px solid #d8d3c9;grid-area:2/1;justify-content:space-evenly;align-items:center;gap:.35rem;width:100%;height:auto;min-height:0;padding:0 .75rem;display:flex;overflow:hidden}.mobile-marketplaces span{letter-spacing:-.025em;font-size:clamp(.47rem,1.9vw,.62rem);font-weight:900}.mobile-marketplaces .ml{color:#2d3277}.mobile-marketplaces .shopee{color:#ee4d2d}.mobile-marketplaces .amazon{color:#111}.mobile-marketplaces .magalu{color:#168bdf}.mobile-kicker{font-size:clamp(.42rem,1.55vw,.5rem);line-height:1.25}.mobile-hero-copy h2{overflow-wrap:normal;margin:.3rem 0 .4rem;font-size:clamp(1.18rem,6.2vw,1.72rem);line-height:1.02}.mobile-hero-copy>p:not(.mobile-kicker){margin:0 0 .5rem;font-size:clamp(.58rem,2.35vw,.7rem);line-height:1.25}.mobile-whatsapp-primary{gap:.35rem;width:min(100%,190px);min-height:38px;padding:.42rem .35rem;font-size:.61rem;line-height:1.05}.mobile-whatsapp-primary .action-icon{width:1.2rem;height:1.2rem}.mobile-whatsapp-primary small{font-size:.5rem}.mobile-benefits{grid-row:3;align-self:stretch;margin:.38rem .72rem;padding:.08rem .7rem;overflow:hidden;height:auto!important;min-height:0!important}.mobile-benefits p{gap:.55rem;padding:.16rem 0;height:calc(33.3333% - .666667px)!important;min-height:0!important}.mobile-benefits i{flex:0 0 25px;width:25px;height:25px;font-size:.68rem}.mobile-benefits span{min-width:0;font-size:clamp(.61rem,2.35vw,.71rem);line-height:1.1}.mobile-benefits small{white-space:normal;margin-top:.06rem;font-size:clamp(.46rem,1.85vw,.55rem);line-height:1.1}.mobile-trust{grid-row:4;grid-template-rows:auto auto 1fr auto;align-self:stretch;align-items:center;margin:0 .72rem .32rem;padding:.28rem .55rem;display:grid;overflow:hidden;height:auto!important;min-height:0!important}.mobile-trust p{letter-spacing:.055em;margin:0;font-size:clamp(.42rem,1.55vw,.49rem);line-height:1}.mobile-trust div{color:#e5a735;letter-spacing:.12em;font-size:clamp(.7rem,3vw,.88rem);line-height:1}.mobile-trust strong{margin:.05rem 0;font-size:clamp(.59rem,2.45vw,.71rem);line-height:1.12;display:block}.mobile-trust small{color:#626866;margin:0;font-size:clamp(.42rem,1.65vw,.5rem);line-height:1.05;display:block}.mobile-cta-secondary{border-bottom-width:2px;grid-row:5;justify-content:center;align-self:stretch;align-items:center;margin:0 .72rem .3rem;padding:0 .3rem;font-size:clamp(.53rem,2.1vw,.62rem);line-height:1;display:flex;height:auto!important;min-height:0!important}.mobile-contact-actions{grid-row:6;align-self:stretch;margin:0 .72rem .3rem;overflow:hidden;height:auto!important;min-height:0!important}.mobile-contact-actions a{white-space:nowrap;gap:.22rem;min-width:0;min-height:0;padding:.35rem .12rem;font-size:clamp(.44rem,1.85vw,.53rem)}.mobile-contact-actions .action-icon{width:1rem;height:1rem}.mobile-whatsapp-fixed{z-index:80;max-width:none;box-shadow:none;border:0;border-top:2px solid #fff;border-radius:0;grid-row:7;justify-content:center;align-items:center;gap:.55rem;display:flex;width:100%!important;height:max(56px,10dvh)!important;min-height:56px!important;padding:.35rem max(1rem,env(safe-area-inset-right)) max(.35rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important}.mobile-whatsapp-fixed .action-icon{width:1.45rem;height:1.45rem}.mobile-whatsapp-fixed span{text-align:left;font-size:.68rem;line-height:1.05}.mobile-whatsapp-fixed small{font-size:.5rem;line-height:1.05;display:block}.mobile-whatsapp-fixed i{display:none}}@media (width<=650px) and (height<=760px){.site-header{height:52px;min-height:52px}.mobile-conversion{grid-template-rows:39% 4% 20% 15% 6% 6% 10%;height:calc(100dvh - 52px);padding-bottom:0}.mobile-hero-photo{top:52px;height:calc(39dvh - 20.28px)!important;min-height:0!important}.mobile-hero-copy{padding-top:.2rem;padding-bottom:.2rem}.mobile-hero-copy h2{font-size:clamp(1.08rem,5.75vw,1.42rem)}.mobile-trust{margin-bottom:.25rem;padding:.2rem .45rem}.mobile-trust strong{font-size:clamp(.54rem,2.25vw,.64rem)}.mobile-cta-secondary,.mobile-contact-actions{margin-bottom:.25rem}.mobile-whatsapp-fixed{border-radius:0;height:max(56px,10dvh)!important;min-height:56px!important}}@media (width<=650px) and (height<=600px){.site-header{height:48px;min-height:48px}.mobile-conversion{height:calc(100dvh - 48px);grid-template-rows:39% 4% 20% 15% 6% 6% 10%!important;padding:0!important}.mobile-hero-photo{top:48px;height:calc(39dvh - 18.72px)!important;min-height:0!important}.mobile-marketplaces{min-height:20px}.mobile-hero-copy{padding-top:.12rem;padding-bottom:.12rem}.mobile-hero-copy h2{margin:.2rem 0 .28rem;font-size:clamp(.96rem,5.3vw,1.2rem)}.mobile-hero-copy>p:not(.mobile-kicker){margin-bottom:.3rem;font-size:.54rem}.mobile-whatsapp-primary{min-height:30px;padding:.25rem;font-size:.52rem}.mobile-benefits{margin:.22rem .55rem;padding:0 .55rem}.mobile-benefits i{flex-basis:20px;width:20px;height:20px}.mobile-benefits span{font-size:.57rem}.mobile-benefits small{font-size:.43rem}.mobile-trust{margin:0 .55rem .18rem;padding:.12rem .35rem}.mobile-trust p{font-size:.38rem}.mobile-trust div{font-size:.62rem}.mobile-trust strong{font-size:.5rem}.mobile-trust small{font-size:.38rem}.mobile-cta-secondary,.mobile-contact-actions{margin-bottom:.18rem;margin-left:.55rem;margin-right:.55rem}.mobile-whatsapp-fixed{height:56px!important;min-height:56px!important}}@media (width<=360px){.mobile-hero-copy{padding-left:.62rem;padding-right:40%}.mobile-hero-photo{width:62%}.mobile-benefits,.mobile-trust,.mobile-cta-secondary,.mobile-contact-actions{margin-left:.52rem;margin-right:.52rem}.mobile-contact-actions a{font-size:.42rem}.mobile-whatsapp-fixed{width:100%}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (forced-colors:active){a,button,input,select,textarea{forced-color-adjust:auto}}

/* ==========================================================================
   AJUSTES GKFD — 2026-08-20
   Bloco acrescentado no fim do arquivo de proposito: ele precisa vencer as
   regras anteriores por ordem de cascata, sem !important onde nao for preciso.
   ========================================================================== */

/* --- 1. Menu de navegacao ------------------------------------------------
   O <nav> desaparece abaixo de 1050px e nao havia nenhum botao para abri-lo,
   deixando tablets sem navegacao. O botao abaixo cobre essa faixa toda. */
.nav-toggle { display: none; }

@media (width<=1050px) {
  .nav-toggle {
    box-sizing: border-box; flex-direction: column; justify-content: center;
    gap: 5px; width: 46px; height: 40px; padding: 0 10px; margin-left: auto;
    background: #fff; border: 1px solid var(--accent); border-radius: 4px;
    cursor: pointer; display: flex;
  }
  .nav-toggle span {
    display: block; height: 2px; background: var(--dark); border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
  }
  .nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle.is-open span:nth-child(2) { opacity: 0; }
  .nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .site-header nav.is-open {
    z-index: 70; background: #fff; border-top: 2px solid var(--accent);
    flex-direction: column; gap: 0; display: flex;
    position: absolute; top: 100%; left: 0; right: 0;
    box-shadow: 0 14px 26px #00000029;
  }
  .site-header nav.is-open a {
    border-bottom: 1px solid var(--line); padding: .95rem 1.2rem; font-size: .78rem;
  }
  .site-header nav.is-open a:last-child { border-bottom: 0; }
}

/* --- 2. Celular volta a mostrar o site inteiro ---------------------------
   Antes o CSS escondia dez secoes abaixo de 650px e travava a rolagem, entao
   o visitante de celular so via a tela de conversao. A tela de conversao
   continua sendo a primeira coisa que aparece; o resto passa a existir abaixo
   dela. Os estilos de celular dessas secoes ja existiam no arquivo. */
@media (width<=650px) {
  /* overflow precisa ficar visible nos dois eixos: com overflow-x:hidden o
     navegador promove o eixo Y para auto, o <body> vira um contêiner de
     rolagem proprio e o cabecalho sticky para de grudar no topo. */
  html, body { height: auto; min-height: 100%; overflow: visible; }
  main { height: auto; overflow: visible; }
  body { padding-bottom: calc(max(56px, 10dvh) + .5rem) !important; }

  .site-header { position: sticky; top: 0; }

  main > .xerox-hero  { display: block; min-height: 0; }
  main > .stats       { display: grid; }
  main > .channels,
  main > .testimonials,
  main > .areas-section,
  main > .method-section,
  main > .blog,
  main > .faq,
  main > .closing     { display: block; }
  main > .sample      { display: flex; }
  main > footer       { display: grid; }

  /* O hero do desktop repetiria o texto e a foto que a tela de conversao ja
     mostra; abaixo de 650px aproveitamos dele apenas o formulario, que era o
     unico caminho de contato que faltava no celular. */
  .xerox-hero > .hero-message,
  .xerox-hero > .hero-photo { display: none; }
  .hero-form { border-left: 0; border-right: 0; padding: 2.6rem 7vw; }

  /* A barra do WhatsApp usava left:0 + right:0 + width:100%; quando os dois
     lados estao presos, o width sobra e passa a medir a viewport inteira,
     barra de rolagem inclusa, criando rolagem lateral. Deixando o width
     automatico ela se ajusta entre left e right. */
  .mobile-whatsapp-fixed { width: auto !important; }
}

/* --- 3. Seta discreta indicando que a pagina rola ------------------------ */
.scroll-cue { display: none; }

@media (width<=650px) {
  .scroll-cue {
    z-index: 75; background: #fffffff2; border: 1px solid var(--accent);
    border-radius: 50%; width: 34px; height: 34px; display: block;
    position: fixed; left: 50%; bottom: calc(max(56px, 10dvh) + 12px);
    box-shadow: 0 3px 10px #0000002e; animation: gkfd-cue 1.8s ease-in-out infinite;
  }
  .scroll-cue span {
    border-right: 2px solid var(--dark); border-bottom: 2px solid var(--dark);
    width: 9px; height: 9px; margin: 9px auto 0; display: block;
    transform: rotate(45deg);
  }
  .scroll-cue.is-hidden { display: none; }
}

@keyframes gkfd-cue {
  0%, 100% { transform: translate(-50%, 0); }
  50%      { transform: translate(-50%, 6px); }
}

/* --- 4. Formulario: campo-armadilha e retorno de envio ------------------- */
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form-status {
  min-height: 1.15rem; margin-top: .55rem; font-size: .66rem;
  font-weight: 700; line-height: 1.4;
}
.form-status.is-ok       { color: #6fd6a0; }
.form-status.is-erro     { color: #ff9c8b; }
.form-status.is-enviando { color: var(--accent2); }

.hero-form button[disabled] { cursor: progress; opacity: .65; }

/* --- 5. Ancoras nao ficam mais escondidas atras do cabecalho fixo -------- */
main > section[id], .hero-form[id] { scroll-margin-top: 92px; }
@media (width<=650px) { main > section[id], .hero-form[id] { scroll-margin-top: 66px; } }

/* --- 6. Controles do carrossel e foco visivel --------------------------- */
.blog-controls button[disabled] { cursor: default; opacity: .35; }
.blog-dots button { cursor: pointer; }
.blog-dots button.active { background: var(--accent); }

a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--accent2); outline-offset: 2px;
}

/* --- 7. Pular para o conteúdo -------------------------------------------
   Fica fora da tela até receber o foco pelo Tab. */
.skip-link {
  z-index: 200; background: var(--dark); color: #fff;
  border-bottom: 2px solid var(--accent); padding: .8rem 1.2rem;
  font-size: .75rem; font-weight: 800; text-decoration: none;
  position: fixed; top: 0; left: 0; transform: translateY(-120%);
  transition: transform .15s ease;
}
.skip-link:focus { transform: translateY(0); }

/* ==========================================================================
   GERAÇÃO DE LEADS — 2026-08-20
   Formulário em duas etapas, formulário rápido do celular, barra fixa de
   contato e seção comparativa.
   ========================================================================== */

/* --- 8. Formulário em duas etapas --------------------------------------- */
.etapa-1, .etapa-2 { flex-direction: column; display: flex; }
.etapa-1[hidden], .etapa-2[hidden] { display: none; }

.etapa-aviso {
  color: var(--accent2); margin: 0 0 .5rem; font-size: .58rem;
  font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.etapa-aviso b { color: #fff; }

.hero-form .resposta {
  color: #9aa5a2; margin-top: .55rem; font-size: .58rem;
  font-weight: 600; text-align: center;
}
.hero-form .resposta.atendimento-aberto { color: #6fd6a0; }
.hero-form .resposta.atendimento-aberto span::before { content: "● "; }

.hero-form .consent a { color: var(--accent2); text-decoration: underline; }

/* --- 9. Barra fixa de contato (telas médias e grandes) ------------------- */
.barra-contato { display: none; }

@media (width>650px) {
  .barra-contato {
    z-index: 90; background: var(--dark); border-top: 2px solid var(--accent);
    align-items: center; gap: 1rem; padding: .7rem 4vw; display: flex;
    position: fixed; bottom: 0; left: 0; right: 0;
    transform: translateY(120%); transition: transform .25s ease;
    box-shadow: 0 -6px 22px #00000038;
  }
  .barra-contato.visivel { transform: translateY(0); }

  .barra-texto { color: #fff; flex: 1; min-width: 0; line-height: 1.3; }
  .barra-texto b { font-size: .82rem; display: block; }
  .barra-texto small { color: #9aa5a2; font-size: .62rem; display: block; }

  .barra-contato a {
    white-space: nowrap; border-radius: 4px; padding: .7rem 1.1rem;
    font-size: .64rem; font-weight: 900; letter-spacing: .05em;
  }
  .barra-form { background: linear-gradient(90deg, #c87909, #e4a63b); color: #fff; }
  .barra-whats { background: #10ad4a; color: #fff; }
  .barra-tel {
    color: #fff; border: 1px solid #3a4a47;
    flex-direction: column; align-items: center; display: flex; line-height: 1.15;
  }
  .barra-tel small { color: #9aa5a2; font-size: .5rem; font-weight: 600; }
  .barra-tel.atendimento-aberto { border-color: #6fd6a0; }
  .barra-tel.atendimento-aberto small { color: #6fd6a0; }
}

@media (width<=880px) {
  .barra-texto { display: none; }
  .barra-contato { justify-content: center; }
}

/* Rodapé some atrás da barra fixa de contato no fim da página — dá folga
   extra pra a última linha (créditos + contador) não ficar por baixo dela. */
@media (width>650px) {
  footer > small { padding-bottom: 3.5rem; }
}

.como-funciona-grid { grid-template-columns: repeat(3, 1fr); }
@media (width<=880px) { .como-funciona-grid { grid-template-columns: 1fr; } }

.blog-regime { background: var(--cream); padding: 5rem 6vw; }
.blog-regime-grid {
  grid-template-columns: repeat(3, 1fr); gap: 2rem;
  max-width: 1080px; margin: 0 auto; display: grid;
}
.blog-regime-col {
  background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--accent);
  padding: 1.6rem 1.5rem; display: flex; flex-direction: column; gap: .7rem;
}
.blog-regime-col h3 {
  color: var(--green); margin: 0 0 .3rem; font-family: Georgia, serif; font-size: 1.05rem;
}
.blog-regime-col a { color: var(--ink); font-size: .85rem; line-height: 1.4; font-weight: 700; }
.blog-regime-col a:hover { color: var(--accent); }
@media (width<=880px) { .blog-regime-grid { grid-template-columns: 1fr; } }

.capa-texto.capa-texto {
  background: radial-gradient(circle at 75% 20%, #c884184d 0 12%, #0000 13%), linear-gradient(135deg, #193d39, #0f1c1b 58%, #273b38);
  height: 260px; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 1rem; display: flex;
}
.capa-texto span { color: var(--accent2); letter-spacing: .15em; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.capa-texto strong { color: #fff; margin-top: .7rem; font-family: Georgia, serif; font-size: 1.7rem; line-height: 1.2; }
.blog-visual.capa-texto { height: 100%; min-height: 178px; }
.blog-lista-grid .blog-visual.capa-texto { height: 200px; }

.gestao-categoria {
  color: var(--accent); letter-spacing: .12em; font-size: .68rem; font-weight: 900;
  margin: 2.6rem 0 1rem;
}
.gestao-categoria:first-of-type { margin-top: 0; }

footer .dev-credito {
  color: #777; font-size: 9px; display: inline-flex; align-items: center; gap: 6px;
  margin-left: .4em;
}
footer .dev-credito b { font-weight: 700; color: #999; }

/* --- 10. Formulário rápido (folha que sobe no celular) ------------------- */
.rapido-fundo {
  z-index: 95; background: #0b1413cc; position: fixed; inset: 0;
  opacity: 0; transition: opacity .25s ease;
}
.rapido-fundo.aberto { opacity: 1; }

.rapido {
  z-index: 100; background: #111716; color: #fff;
  border-top: 3px solid var(--accent); border-radius: 14px 14px 0 0;
  padding: 1.5rem 1.2rem 1.8rem; position: fixed; bottom: 0; left: 0; right: 0;
  max-height: 92dvh; overflow-y: auto;
  transform: translateY(100%); transition: transform .25s ease;
  box-shadow: 0 -10px 40px #00000059;
}
.rapido.aberto { transform: translateY(0); }

.rapido-fechar {
  color: #9aa5a2; cursor: pointer; background: none; border: 0;
  width: 40px; height: 40px; font-size: 1.7rem; line-height: 1;
  position: absolute; top: .4rem; right: .5rem;
}

.rapido-form { flex-direction: column; display: flex; }
.rapido-form h2 {
  color: #fff; margin: 0 2.2rem .3rem 0; font-family: var(--font-serif), Georgia, serif;
  font-size: 1.25rem;
}
.rapido-sub { color: #9aa5a2; margin: 0 0 1rem; font-size: .78rem; line-height: 1.5; }

.rapido-form input, .rapido-form select, .rapido-form textarea {
  color: #333; background: #fff; border: 0; border-radius: 4px; width: 100%;
  margin: .25rem 0; padding: .85rem .8rem; font-size: .95rem;
}
.rapido-form button {
  color: #fff; cursor: pointer; background: linear-gradient(90deg, #c87909, #e4a63b);
  border: 0; border-radius: 4px; margin-top: .7rem; padding: 1rem;
  font-size: .78rem; font-weight: 900; letter-spacing: .04em;
}
.rapido-form button[disabled] { cursor: progress; opacity: .65; }
.rapido-form .consent {
  color: #bdbdbd; align-items: flex-start; gap: .5rem; padding: .6rem 0;
  font-size: .68rem; line-height: 1.4; display: flex;
}
.rapido-form .consent input { width: auto; margin: .15rem 0 0; flex: 0 0 auto; }
.rapido-form .consent a { color: var(--accent2); text-decoration: underline; }
.rapido-form .resposta { color: #9aa5a2; margin-top: .5rem; font-size: .66rem; text-align: center; }
.rapido-form .resposta.atendimento-aberto { color: #6fd6a0; }
.rapido-form .resposta.atendimento-aberto span::before { content: "● "; }
.rapido-form .etapa-aviso { margin-top: .3rem; }

.rapido-ou { color: #9aa5a2; margin: 1rem 0 0; font-size: .74rem; text-align: center; }
.rapido-ou a { color: #6fd6a0; font-weight: 700; text-decoration: underline; }

body.sem-rolagem { overflow: hidden; }

@media (width>650px) {
  .rapido {
    border-radius: 12px; max-width: 460px; padding: 2rem;
    top: 50%; bottom: auto; left: 50%; right: auto;
    transform: translate(-50%, -46%) scale(.97);
    opacity: 0; transition: transform .2s ease, opacity .2s ease;
  }
  .rapido.aberto { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

/* --- 11. Comparativo com/sem conciliação -------------------------------- */
.comparativo { background: var(--cream); border-bottom: 1px solid var(--line); padding: 5rem 6vw; }

.comparativo-grid {
  grid-template-columns: repeat(2, 1fr); gap: 1.3rem;
  max-width: 1080px; margin: 0 auto; display: grid;
}
.comparativo-grid article { background: #fff; border: 1px solid var(--line); padding: 2rem 1.8rem; }
.comparativo-grid h3 {
  margin: 0 0 1.1rem; padding-bottom: .8rem; font-size: .8rem;
  font-weight: 900; letter-spacing: .09em;
}
.comp-antes { border-top: 3px solid #b9b2a4; }
.comp-antes h3 { color: #7a7469; border-bottom: 1px solid var(--line); }
.comp-depois { border-top: 3px solid var(--accent); }
.comp-depois h3 { color: var(--green); border-bottom: 1px solid var(--line); }

.comparativo-grid ul { margin: 0; padding: 0; list-style: none; }
.comparativo-grid li {
  padding: .55rem 0 .55rem 1.6rem; font-size: .82rem; line-height: 1.5;
  position: relative;
}
.comp-antes li { color: #6c6a63; }
.comp-antes li::before { content: "✕"; color: #b06a5a; position: absolute; left: 0; font-weight: 700; }
.comp-depois li { color: var(--ink); }
.comp-depois li::before { content: "✓"; color: var(--green); position: absolute; left: 0; font-weight: 700; }

.comp-cta {
  background: linear-gradient(90deg, #c87909, #e4a63b); color: #fff;
  margin: 2.4rem auto 0; padding: 1.1rem 2.2rem; font-size: .74rem;
  font-weight: 900; letter-spacing: .05em; display: table;
}

@media (width<=880px) { .comparativo-grid { grid-template-columns: 1fr; } }
@media (width<=650px) {
  .comparativo { padding: 3.2rem 6vw; }
  .comparativo-grid article { padding: 1.5rem 1.2rem; }
  .comp-cta { width: 100%; text-align: center; display: block; }
}

/* ==========================================================================
   PÁGINAS INTERNAS — privacidade, quem somos, blog e landings por canal
   ========================================================================== */

.pagina-texto {
  background: #fff; max-width: 820px; margin: 0 auto;
  padding: 4.5rem 6vw 3.5rem; line-height: 1.75;
}

.pagina-cabecalho { border-bottom: 1px solid var(--line); margin-bottom: 2.4rem; padding-bottom: 1.6rem; }
.pagina-cabecalho h1 {
  color: var(--dark); margin: .5rem 0 0;
  font-family: var(--font-serif), Georgia, serif;
  font-size: clamp(1.7rem, 4.4vw, 2.5rem); line-height: 1.15;
}
.pagina-data { color: var(--muted); margin: .8rem 0 0; font-size: .78rem; }

.pagina-texto h2 {
  color: var(--green); margin: 2.6rem 0 .9rem;
  font-family: var(--font-serif), Georgia, serif; font-size: 1.25rem;
}
.pagina-texto h3 { color: var(--dark); margin: 1.9rem 0 .6rem; font-size: 1rem; font-weight: 800; }
.pagina-texto p { color: #3b423f; margin: 0 0 1.1rem; font-size: .95rem; }
.pagina-texto ul { margin: 0 0 1.3rem; padding-left: 1.2rem; }
.pagina-texto li { color: #3b423f; margin-bottom: .5rem; font-size: .95rem; }
.pagina-texto a { color: var(--green); text-decoration: underline; }
.pagina-texto .destaque {
  border-left: 3px solid var(--accent); padding-left: 1rem;
  font-size: 1.05rem; color: var(--dark);
}

/* --- Chamada de contato no fim das páginas internas --------------------- */
.pagina-cta { text-align: center; background: var(--dark); color: #fff; padding: 4rem 6vw; }
.pagina-cta h2 {
  color: #fff; margin: .6rem 0 .8rem;
  font-family: var(--font-serif), Georgia, serif; font-size: clamp(1.3rem, 3.5vw, 1.9rem);
}
.pagina-cta p { color: #9aa5a2; margin: 0 auto 1.8rem; max-width: 520px; font-size: .92rem; }
.pagina-cta-acoes { flex-wrap: wrap; justify-content: center; gap: .8rem; display: flex; }
.pagina-cta-acoes a {
  border-radius: 4px; padding: 1.05rem 1.9rem;
  font-size: .72rem; font-weight: 900; letter-spacing: .05em;
}
.cta-primario { background: linear-gradient(90deg, #c87909, #e4a63b); color: #fff; }
.cta-whats { background: #10ad4a; color: #fff; }

/* --- Quem somos --------------------------------------------------------- */
.sobre-topo { grid-template-columns: 250px 1fr; align-items: start; gap: 2rem; display: grid; }
.sobre-foto { background: var(--cream); width: 100%; height: auto; display: block; }
.sobre-lista { padding-left: 0; list-style: none; }
.sobre-lista li {
  border-bottom: 1px solid var(--line); padding: .8rem 0 .8rem 1.5rem; position: relative;
}
.sobre-lista li::before { content: "→"; color: var(--accent); position: absolute; left: 0; }

@media (width<=760px) {
  .sobre-topo { grid-template-columns: 1fr; }
  .sobre-foto { max-width: 230px; }
}

/* --- Blog: lista -------------------------------------------------------- */
.blog-lista { background: #fff; max-width: 1120px; margin: 0 auto; padding: 4rem 6vw 3rem; }
.blog-lista-grid { grid-template-columns: repeat(3, 1fr); gap: 1.3rem; display: grid; }
.blog-lista-grid .blog-card { flex-basis: auto; }
@media (width<=1050px) { .blog-lista-grid { grid-template-columns: repeat(2, 1fr); } }
@media (width<=650px) { .blog-lista-grid { grid-template-columns: 1fr; } }

/* --- Blog: artigo ------------------------------------------------------- */
.artigo-capa { background: var(--cream); max-height: 380px; overflow: hidden; }
.artigo-capa img { object-fit: cover; width: 100%; height: 380px; display: block; }

.artigo-meta {
  color: var(--accent); margin: 0 0 .4rem; font-size: .62rem;
  font-weight: 900; letter-spacing: .14em;
}
.artigo-resumo {
  color: var(--muted); border-left: 3px solid var(--accent);
  margin: 1.4rem 0 0; padding-left: 1rem; font-size: 1.02rem; line-height: 1.6;
}

.artigo-relacionados { background: var(--cream); border-top: 1px solid var(--line); padding: 3.5rem 6vw; }
.artigo-relacionados h2 {
  text-align: center; color: var(--dark); margin: 0 0 1.8rem;
  font-family: var(--font-serif), Georgia, serif; font-size: 1.35rem;
}
.relacionados-grid {
  grid-template-columns: repeat(3, 1fr); gap: 1.2rem;
  max-width: 1080px; margin: 0 auto; display: grid;
}
.relacionado {
  background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--accent);
  padding: 1.3rem; display: block;
}
.relacionado small { color: var(--accent); font-size: .58rem; font-weight: 900; letter-spacing: .12em; }
.relacionado b { color: var(--dark); margin-top: .5rem; font-size: .92rem; line-height: 1.4; display: block; }
@media (width<=760px) { .relacionados-grid { grid-template-columns: 1fr; } }

.artigo-aviso {
  color: var(--muted); border-top: 1px solid var(--line);
  margin-top: 2.5rem; padding-top: 1.2rem; font-size: .8rem; font-style: italic;
}

/* --- O rodapé das páginas internas não precisa do respiro do celular ---- */
@media (width<=650px) {
  .pagina-interna .pagina-texto { padding: 2.6rem 6vw 2rem; }
  .pagina-interna .pagina-cta { padding: 3rem 6vw; }
  .pagina-cta-acoes a { width: 100%; text-align: center; }
}

/* --- Bloco específico de canal (landings do Google Ads) ----------------- */
.canal-foco { background: #fff; border-bottom: 1px solid var(--line); padding: 4.5rem 6vw; }
.canal-itens {
  grid-template-columns: repeat(2, 1fr); gap: .2rem 2rem;
  max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; display: grid;
}
.canal-itens li {
  border-bottom: 1px solid var(--line); padding: .85rem 0 .85rem 1.7rem;
  font-size: .88rem; line-height: 1.5; position: relative;
}
.canal-itens li::before { content: "✓"; color: var(--accent); position: absolute; left: 0; font-weight: 700; }
@media (width<=760px) { .canal-itens { grid-template-columns: 1fr; } .canal-foco { padding: 3rem 6vw; } }

/* --- Link para o blog completo ----------------------------------------- */
.blog-todos { text-align: center; margin: 2rem 0 0; }
.blog-todos a {
  color: var(--green); border-bottom: 2px solid var(--accent); padding-bottom: .3rem;
  font-size: .72rem; font-weight: 900; letter-spacing: .07em;
}

/* ==========================================================================
   CORREÇÃO DOS ESPAÇOS VAZIOS
   Dois buracos que apareciam por motivos diferentes: os cards de serviço
   tinham altura mínima maior que a lista, e a caixa do formulário esticava
   até a altura do hero mesmo com o passo 1 tendo só dois campos.
   ========================================================================== */

/* --- Cards de serviço: a lista ocupa o espaço, com linha separando ------- */
.area-card ul {
  flex: 1; align-content: space-between; gap: 0;
  margin: 1.2rem 0 .4rem; display: grid;
}
.area-card li {
  border-bottom: 1px solid #efece4; padding: .6rem 0 .6rem 1rem;
  line-height: 1.35;
}
.area-card li:last-child { border-bottom: 0; }

/* --- Formulário: a caixa passa a ter a altura do próprio conteúdo -------- */
.hero-form { align-self: start; }

/* --- "O que acontece depois": ocupa o espaço com algo que ajuda a decidir */
.form-passos { border-top: 1px solid #2b3634; margin-top: 1.6rem; padding-top: 1.2rem; }
.form-passos-titulo {
  color: var(--accent2); margin: 0 0 .9rem; font-size: .56rem;
  font-weight: 800; letter-spacing: .13em;
}
.form-passos ol { counter-reset: passo; margin: 0; padding: 0; list-style: none; }
.form-passos li {
  counter-increment: passo; padding: 0 0 .95rem 2rem;
  position: relative; line-height: 1.4;
}
.form-passos li:last-child { padding-bottom: 0; }
.form-passos li::before {
  content: counter(passo);
  color: var(--accent2); background: #1c2523; border: 1px solid #34403d;
  border-radius: 50%; width: 22px; height: 22px;
  font-size: .62rem; font-weight: 800; line-height: 20px; text-align: center;
  position: absolute; top: -1px; left: 0;
}
.form-passos b { color: #fff; font-size: .74rem; display: block; }
.form-passos span { color: #8b9491; font-size: .68rem; }

@media (width<=650px) {
  .hero-form { align-self: stretch; }
  .form-passos { margin-top: 1.3rem; }
}

/* ==========================================================================
   PÁGINAS DE SERVIÇO
   ========================================================================== */

/* --- Card da home: título clicável e dois botões ------------------------ */
.area-card h3 a { color: inherit; text-decoration: none; }
.area-card:hover h3 a { color: var(--green); }

.area-acoes {
  border-top: 1px solid var(--line); align-items: center; gap: .9rem;
  margin-top: 1rem; padding-top: 1rem; display: flex;
}
.area-detalhe {
  color: var(--green); border-bottom: 2px solid var(--accent); padding-bottom: .2rem;
  font-size: .63rem; font-weight: 900; letter-spacing: .06em; white-space: nowrap;
}
.area-analise {
  color: var(--muted); justify-content: flex-end; align-items: center; gap: .5rem;
  flex: 1; font-size: .63rem; font-weight: 800; letter-spacing: .06em; display: flex;
}
.area-analise span { color: var(--accent); font-size: .85rem; }
.area-card:hover .area-analise { color: var(--dark); }

/* --- Topo da página de serviço ----------------------------------------- */
.servico-topo { background: var(--cream); border-bottom: 1px solid var(--line); padding: 4rem 6vw 3.5rem; }
.servico-topo-interno { max-width: 820px; margin: 0 auto; }
.servico-numero {
  color: var(--accent); margin: 0 0 .7rem; font-size: .62rem;
  font-weight: 900; letter-spacing: .14em;
}
.servico-topo h1 {
  color: var(--dark); margin: 0 0 1.2rem;
  font-family: var(--font-serif), Georgia, serif;
  font-size: clamp(1.8rem, 4.6vw, 2.7rem); line-height: 1.12;
}
.servico-topo p { color: #3b423f; margin: 0 0 1rem; font-size: 1rem; line-height: 1.7; }

.servico-topo-acoes { flex-wrap: wrap; gap: .8rem; margin-top: 1.8rem; display: flex; }
.servico-topo-acoes a {
  border-radius: 4px; padding: 1rem 1.7rem;
  font-size: .7rem; font-weight: 900; letter-spacing: .05em;
}
.cta-vazado { color: var(--dark); border: 1px solid var(--dark); }
.cta-vazado:hover { background: var(--dark); color: #fff; }

/* --- Corpo: os nove itens detalhados ------------------------------------ */
.servico-itens { margin: 0 0 1.5rem; }
.servico-itens dt {
  color: var(--dark); border-top: 1px solid var(--line);
  margin-top: 1rem; padding-top: 1rem; font-size: .95rem; font-weight: 800;
}
.servico-itens dt:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.servico-itens dd {
  color: #575e5b; margin: .35rem 0 0; padding-left: 0;
  font-size: .9rem; line-height: 1.65;
}

.servico-processo { counter-reset: etapa; margin: 0 0 1.6rem; padding: 0; list-style: none; }
.servico-processo li {
  counter-increment: etapa; border-bottom: 1px solid var(--line);
  padding: .9rem 0 .9rem 2.6rem; font-size: .92rem; line-height: 1.55;
  position: relative;
}
.servico-processo li:last-child { border-bottom: 0; }
.servico-processo li::before {
  content: counter(etapa);
  color: #fff; background: var(--green); border-radius: 50%;
  width: 26px; height: 26px; font-size: .7rem; font-weight: 800;
  line-height: 26px; text-align: center;
  position: absolute; top: .8rem; left: 0;
}

.servico-entrega { margin: 0 0 1.6rem; padding: 1.4rem 1.6rem; list-style: none;
  background: #f2f6f4; border-left: 3px solid var(--green); }
.servico-entrega li {
  padding: .45rem 0 .45rem 1.6rem; font-size: .92rem; position: relative;
}
.servico-entrega li::before {
  content: "✓"; color: var(--green); font-weight: 700; position: absolute; left: 0;
}

.servico-sinais { margin: 0 0 1.4rem; padding: 0; list-style: none; }
.servico-sinais li {
  border-left: 3px solid var(--accent); background: #fbf8f2;
  margin-bottom: .5rem; padding: .8rem 1rem; font-size: .92rem; line-height: 1.5;
}

/* --- Hub /servicos/ ----------------------------------------------------- */
.servicos-grupo-titulo {
  font-family: var(--font-serif), Georgia, serif; font-size: 1.15rem;
  letter-spacing: .04em; color: var(--accent); margin: 2.4rem 0 1.1rem;
  padding-top: 1.6rem; border-top: 1px solid var(--line);
}
.servicos-grid + .servicos-grupo-titulo { margin-top: 2.8rem; }
.section-title + .servicos-grupo-titulo { margin-top: 0; padding-top: 0; border-top: 0; }
.servicos-grid { grid-template-columns: repeat(3, 1fr); gap: 1.2rem; display: grid; }
.servico-card {
  background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--accent);
  flex-direction: column; padding: 1.8rem 1.6rem; transition: all .2s; display: flex;
}
.servico-card:hover { box-shadow: 0 12px 28px #0000001a; transform: translateY(-3px); }
.servico-card .number { color: var(--accent); font-family: var(--font-serif), Georgia, serif; font-size: 1.5rem; }
.servico-card h2 {
  color: var(--dark); margin: .5rem 0 .7rem;
  font-family: var(--font-serif), Georgia, serif; font-size: 1.2rem; line-height: 1.25;
}
.servico-card p { color: var(--muted); flex: 1; margin: 0 0 1.2rem; font-size: .85rem; line-height: 1.55; }
.servico-card span {
  color: var(--green); border-top: 1px solid var(--line); padding-top: .9rem;
  font-size: .64rem; font-weight: 900; letter-spacing: .07em;
}

@media (width<=1050px) { .servicos-grid { grid-template-columns: repeat(2, 1fr); } }
@media (width<=650px) {
  .servicos-grid { grid-template-columns: 1fr; }
  .servico-topo { padding: 2.6rem 6vw 2.4rem; }
  .servico-topo-acoes a { width: 100%; text-align: center; }
  .area-acoes { flex-direction: column; align-items: stretch; gap: .7rem; }
  .area-analise { justify-content: flex-start; }
}

/* --- Cards de serviço: alinhamento entre cards vizinhos -----------------
   Dois desalinhamentos sobravam. "CONTABILIDADE DO E-COMMERCE" quebra em duas
   linhas e os outros títulos não, então a linha 1 ficava 33px mais alta que as
   demais — e, dentro da própria linha, as listas ganhavam alturas diferentes
   para compensar, o que fazia as linhas separadoras dos cards vizinhos não se
   alinharem. Reservando duas linhas para todo título e igualando as linhas da
   grade, os nove cards passam a ter a mesma altura e as separadoras se alinham
   de ponta a ponta. */
@media (width>650px) {
  .area-grid { grid-auto-rows: 1fr; }
  .area-card h3 { min-height: 3em; }
}

/* ==========================================================================
   CAMADA VISUAL — 2026-08-20
   Tipografia, profundidade, movimento e respiro. Vai por último de propósito:
   precisa vencer as regras antigas na cascata.
   ========================================================================== */

:root {
  /* Escala tipográfica fluida: um só valor serve do celular ao monitor. */
  --t-display: clamp(2rem, 6.2vw, 3.4rem);
  --t-titulo:  clamp(1.5rem, 3.6vw, 2.5rem);
  --t-sub:     clamp(1.05rem, 2vw, 1.35rem);
  --t-corpo:   clamp(.92rem, 1.2vw, 1rem);

  /* Profundidade em três níveis, sempre com a mesma direção de luz. */
  --sombra-1: 0 1px 2px #0f1c1b0f, 0 2px 8px #0f1c1b0a;
  --sombra-2: 0 4px 12px #0f1c1b14, 0 12px 28px #0f1c1b12;
  --sombra-3: 0 10px 24px #0f1c1b1f, 0 28px 60px #0f1c1b1a;
  --sombra-ouro: 0 8px 22px #c8841833;

  --raio: 10px;
  --raio-p: 6px;
  --transicao: .22s cubic-bezier(.2, .7, .3, 1);
}

/* --- 1. Ritmo de tipografia ---------------------------------------------- */
.section-title h2 { font-size: var(--t-titulo); line-height: 1.1; letter-spacing: -.01em; }
.section-title p  { font-size: var(--t-corpo); line-height: 1.65; }
.gold-label { font-size: .64rem; letter-spacing: .19em; }

.desktop-hero-title { letter-spacing: -.015em; }
.desktop-hero-title em { font-style: normal; color: var(--green); }

/* --- 2. Botões: reação ao toque e ao mouse ------------------------------- */
.hero-form button, .rapido-form button, .comp-cta, .cta-primario,
.mobile-cta-secondary, .mobile-whatsapp-primary, .barra-form, .barra-whats,
.sample a, .closing a, .cta-whats, .cta-vazado {
  border-radius: var(--raio-p);
  transition: transform var(--transicao), box-shadow var(--transicao), filter var(--transicao);
}
.hero-form button:hover, .rapido-form button:hover, .comp-cta:hover,
.cta-primario:hover, .sample a:hover, .closing a:hover, .cta-whats:hover {
  transform: translateY(-2px);
  box-shadow: var(--sombra-ouro);
  filter: brightness(1.05);
}
.hero-form button:active, .rapido-form button:active, .comp-cta:active,
.cta-primario:active, .mobile-cta-secondary:active,
.mobile-whatsapp-primary:active, .cta-whats:active {
  transform: translateY(0) scale(.985);
}

/* --- 3. Cartões com profundidade real ------------------------------------ */
.area-card, .blog-card, .comparativo-grid article, .servico-card,
.testimonial-grid article {
  border-radius: var(--raio);
  box-shadow: var(--sombra-1);
  transition: transform var(--transicao), box-shadow var(--transicao),
              border-color var(--transicao);
}
.area-card:hover, .blog-card:hover, .servico-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--sombra-2);
  border-color: #c9c3b6;
}
.blog-visual { border-radius: var(--raio) var(--raio) 0 0; overflow: hidden; }
.blog-visual img { transition: transform .5s cubic-bezier(.2, .7, .3, 1); }
.blog-card:hover .blog-visual img { transform: scale(1.05); }

.hero-form { border-radius: var(--raio); box-shadow: var(--sombra-3); }
.free-box { border-radius: var(--raio-p); }
.hero-form input, .hero-form select, .hero-form textarea {
  border-radius: var(--raio-p);
  transition: box-shadow var(--transicao);
}
.hero-form input:focus, .hero-form select:focus, .hero-form textarea:focus,
.rapido-form input:focus, .rapido-form select:focus, .rapido-form textarea:focus {
  box-shadow: 0 0 0 3px #e5a73545;
  outline: none;
}

/* --- 4. Faixa de números: virou destaque, não rodapé --------------------- */
.stats {
  background: linear-gradient(135deg, #0f1c1b 0%, #172725 55%, #12201e 100%);
  border-top: 1px solid #2a3634; border-bottom: 1px solid #2a3634;
  padding: 2.6rem 6vw;
}
.stats div { border-right: 1px solid #ffffff14; padding: .2rem 2rem; }
.stats div:last-child { border-right: 0; }
.stats b {
  font-family: var(--font-serif), Georgia, serif;
  font-size: clamp(1.6rem, 2.6vw, 2.2rem);
  line-height: 1.1; letter-spacing: -.01em;
}
.stats span { color: #93a09d; font-size: .58rem; letter-spacing: .13em; }

/* --- 5. Movimento na entrada das seções ---------------------------------
   Só enfeite não justifica animação; aqui ela guia o olho de uma seção para a
   próxima. Quem pede menos movimento no sistema não recebe nenhum. */
.revelar { opacity: 0; transform: translateY(18px); }
.revelar.visivel {
  opacity: 1; transform: none;
  transition: opacity .55s ease, transform .55s cubic-bezier(.2, .7, .3, 1);
}

@media (prefers-reduced-motion: reduce) {
  .revelar, .revelar.visivel { opacity: 1; transform: none; transition: none; }
}

/* --- 6. Cabeçalho ganha corpo ao rolar ----------------------------------- */
.site-header { transition: box-shadow var(--transicao), background var(--transicao); }
.site-header.rolado { background: #fffffff2; backdrop-filter: blur(10px); box-shadow: var(--sombra-1); }

/* --- 7. Celular: fim do aperto ------------------------------------------
   A tela de conversão tinha altura travada em 100dvh e sete linhas em
   porcentagem — em aparelho menor tudo comprimia junto. Agora a altura é
   mínima, não fixa: continua ocupando a tela inteira em telas normais e
   cresce, em vez de espremer, nas pequenas. */
@media (width<=650px) {
  .mobile-conversion {
    height: auto !important;
    min-height: calc(100dvh - 58px) !important;
    grid-template-rows: auto auto auto auto auto auto !important;
    padding: 0 0 calc(max(56px, 10dvh) + .9rem) !important;
    overflow: visible !important;
    row-gap: .1rem;
  }

  /* CORREÇÃO: eu tinha travado a altura deste bloco em 39dvh. Em aparelho
     com tela estreita o título ocupa mais linhas do que cabe ali, e o que
     passava do limite era simplesmente cortado — o kicker aparecia pela
     metade e o botão verde ficava sem a parte de baixo.

     Agora 39dvh é altura MÍNIMA, não fixa: em tela normal fica igual, e em
     tela apertada o bloco cresce em vez de cortar. O texto também ganhou
     largura, que era a raiz do problema: com 42% de recuo à direita sobravam
     menos de 200px para um título de 45 caracteres. */
  .mobile-hero-copy {
    height: auto !important;
    min-height: calc(39dvh - 22.62px) !important;
    padding: .7rem 36% .9rem 1.1rem !important;
    overflow: visible !important;
    justify-content: center !important;
  }
  .mobile-kicker { font-size: .52rem !important; letter-spacing: .11em !important; }
  .mobile-hero-copy h2 {
    font-size: clamp(1.35rem, 6.4vw, 1.95rem) !important;
    letter-spacing: -.015em !important; line-height: 1.1 !important;
    margin: .45rem 0 .55rem !important;
  }
  .mobile-hero-copy > p:not(.mobile-kicker) { font-size: .74rem !important; line-height: 1.4 !important; }

  /* A foto acompanha o bloco de texto em vez de ter altura própria fixa. */
  .mobile-hero-photo {
    height: auto !important; min-height: 0 !important;
    top: 58px !important; bottom: auto !important;
    width: 55% !important;
  }

  .mobile-whatsapp-primary {
    border-radius: 8px !important; padding: .85rem .7rem !important;
    box-shadow: 0 8px 20px #0b7e3840, 0 2px 4px #0b7e3826 !important;
  }

  .mobile-marketplaces, .mobile-benefits, .mobile-trust,
  .mobile-cta-secondary, .mobile-contact-actions {
    height: auto !important; min-height: 0 !important;
  }
  .mobile-benefits {
    border-radius: 8px !important; box-shadow: var(--sombra-1);
    margin: .5rem .9rem !important; padding: .55rem 1rem !important;
  }
  .mobile-trust {
    border-radius: 8px !important; box-shadow: var(--sombra-1);
    margin: 0 .9rem .6rem !important; padding: .9rem !important;
  }
  .mobile-cta-secondary {
    border-radius: 8px !important; margin: 0 .9rem .55rem !important;
    padding: .95rem .6rem !important; font-size: .68rem !important;
    box-shadow: var(--sombra-1);
  }
  .mobile-contact-actions {
    border-radius: 8px !important; margin: 0 .9rem !important;
    overflow: hidden !important; box-shadow: var(--sombra-1);
  }
  .mobile-whatsapp-fixed { box-shadow: 0 -4px 18px #0b7e3833 !important; }

  /* Respiro entre seções no celular */
  .section-title { margin-bottom: 2rem; }
  .area-card { border-radius: var(--raio); }
}

/* --- 8. Desempenho: o navegador só desenha o que está perto da tela ------ */
.areas-section, .method-section, .comparativo, .blog, .faq, .testimonials {
  content-visibility: auto;
  contain-intrinsic-size: auto 700px;
}

/* --- "Para quem atendemos": 3 frentes de atuação, sem enquadrar nenhuma como exceção --- */
.tambem-atendemos { background: var(--cream); border-bottom: 1px solid var(--line); padding: 4.5rem 6vw; }
.atendemos-grid {
  grid-template-columns: repeat(3, 1fr); gap: 1.3rem;
  max-width: 1180px; margin: 0 auto; display: grid;
}
@media (width<=1050px) { .atendemos-grid { grid-template-columns: 1fr 1fr; } }
.atende-card {
  background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--green);
  border-radius: var(--raio); flex-direction: column; padding: 2rem 1.8rem;
  box-shadow: var(--sombra-1); transition: transform var(--transicao), box-shadow var(--transicao);
  display: flex;
}
.atende-card:hover { transform: translateY(-4px); box-shadow: var(--sombra-2); }
.atende-card b {
  color: var(--dark); margin-bottom: .7rem;
  font-family: var(--font-serif), Georgia, serif; font-size: 1.3rem; font-weight: 700;
}
.atende-card p { color: var(--muted); flex: 1; margin: 0 0 1.3rem; font-size: .88rem; line-height: 1.6; }
.atende-card span {
  color: var(--green); border-top: 1px solid var(--line); padding-top: .9rem;
  font-size: .64rem; font-weight: 900; letter-spacing: .07em;
}

@media (width<=650px) {
  .tambem-atendemos { padding: 3rem 6vw; }
  .atendemos-grid { grid-template-columns: 1fr; }
  .atende-card { padding: 1.6rem 1.3rem; }
}

/* ==========================================================================
   LAYOUT — reconstrução das três seções que estavam estruturalmente erradas
   ========================================================================== */

/* --- 1. HERO: de três colunas para duas ---------------------------------
   Era 541px de texto | 413px de foto | 470px de formulário. A foto virava uma
   faixa vertical estreita espremida no meio, e o título de 57px tinha só 460px
   úteis para respirar — quebrava em quatro linhas.

   Agora são duas colunas. A foto ocupa toda a metade esquerda como imagem de
   fundo, com o texto por cima num degradê — o mesmo recurso que a versão de
   celular já usava. O título ganha o dobro de largura e a foto deixa de ser
   uma tira para virar ambiente. */
@media (width>1050px) {
  /* Três zonas em fluxo: texto | foto | formulário.

     A tentativa anterior punha a foto atrás do texto. Duas coisas davam
     errado: o degradê que protege a leitura lavava a pessoa até quase sumir,
     e uma área larga e baixa faz o "cover" ajustar pela largura — o que corta
     o topo da cabeça e ainda anula o object-position horizontal.

     Em coluna própria, a foto é mais alta que larga: o "cover" ajusta pela
     altura, a pessoa aparece inteira, e nada passa por cima dela. */
  .xerox-hero {
    /* A terceira coluna era 1fr e ficava bem mais larga que o formulário,
       que tem 440px. A diferença virava um vão morto de creme entre a foto e
       o formulário. Agora a coluna tem a largura exata de que o formulário
       precisa, e o espaço que sobrava vai para a foto. */
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .85fr) 505px;
    position: relative;
    min-height: 660px;
  }

  /* As três ficam na MESMA linha, explicitamente. Sem isso, a foto ocupando
     as colunas 2 e 3 fazia o formulário ser empurrado para uma segunda linha
     da grade — o hero dobrava de altura e a foto encolhia. */
  .hero-message {
    grid-row: 1; grid-column: 1;
    background: none;
    display: flex; flex-direction: column; justify-content: center;
    padding: 5.5rem 2.5rem 5rem 6.5vw;
  }
  .hero-message .desktop-hero-title {
    font-size: clamp(2.15rem, 2.6vw, 3.1rem); margin: .2rem 0 1.2rem; line-height: 1.1;
  }
  .hero-description { max-width: none; font-size: .98rem; line-height: 1.7; }
  .hero-icons { max-width: none; margin-top: 2.2rem; }

  /* A foto atravessa a segunda coluna E a terceira, indo até a borda direita
     da tela. O formulário flutua por cima dela.

     Ganho duplo: acaba o vão de creme entre a foto e o formulário, e o fundo
     desfocado do saguão — que na foto original fica à direita da pessoa —
     passa a preencher a área atrás do formulário, em vez de ser descartado.
     A borda esquerda se dissolve no creme para não bater no texto. */
  .hero-photo {
    grid-row: 1; grid-column: 2 / -1;
    position: relative; min-height: 0; overflow: hidden; z-index: 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 13%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 13%, #000 100%);
  }
  /* Duas camadas, e é isso que resolve o problema.

     A foto é retrato (0,80). Esticá-la sozinha até a borda criava uma área
     larga e baixa (1,30), e nessa proporção o navegador amplia pela largura:
     virava um zoom enorme com a cabeça cortada.

     Agora quem preenche a faixa inteira é uma cópia desfocada da própria
     imagem — vira só ambiente de luz e cor, sem forma reconhecível. Por cima
     dela, a foto nítida ocupa apenas a largura em que a pessoa cabe inteira,
     sem corte nenhum. O fundo continua até a borda, atrás do formulário. */
  .hero-photo::before {
    content: ""; position: absolute; inset: -8%;
    background: url(fabio-hero-premium.webp) center 30% / cover no-repeat;
    filter: blur(38px) saturate(1.06) brightness(1.06);
    transform: scale(1.15);
  }

  .hero-photo img {
    position: absolute; top: 0; bottom: 0; left: 0;
    width: 56%; height: 100%;
    object-fit: cover; object-position: 50% 8%;
    display: block;
  }

  /* Véu suave só atrás do formulário, para o cartão escuro não disputar com
     o mármore claro do fundo. */
  .hero-photo::after {
    content: ""; position: absolute; inset: 0 0 0 auto; width: 46%;
    background: linear-gradient(90deg, #0f1c1b00 0%, #0f1c1b1f 45%, #0f1c1b3d 100%);
  }

  .hero-form {
    grid-row: 1; grid-column: 3; position: relative; z-index: 2;
    width: 100%; max-width: 440px;
    margin: 3rem 2.2rem 3rem auto;
  }
}

/* Entre 651 e 1050px o hero já empilhava; só ajusta a foto para não cortar
   o rosto na faixa larga e baixa. */
@media (width>650px) and (width<=1050px) {
  .hero-photo img { object-fit: cover; object-position: 70% 18%; width: 100%; height: 100%; }
}

/* --- 2. METODOLOGIA: sete colunas viraram linha do tempo ----------------
   Eram sete colunas de 179px. "AUDITORIA DOS RELATÓRIOS" não cabe em 179px:
   quebrava em três linhas e desalinhava as etapas entre si. Agora é uma linha
   do tempo com o traço ligando os números, e o número de colunas acompanha a
   largura disponível. */
.method-steps {
  border-top: 0;
  grid-template-columns: repeat(7, 1fr);
  gap: 0; position: relative;
}
.method-steps::before {
  content: ""; position: absolute; top: 27px; left: 7%; right: 7%;
  height: 2px; background: linear-gradient(90deg, #43504d 0%, var(--accent) 50%, #43504d 100%);
  opacity: .55;
}
.method-steps > div {
  border: 0 !important; text-align: center; padding: 0 .5rem;
  display: flex; flex-direction: column; align-items: center; gap: .9rem;
  position: relative; z-index: 1;
}
.method-steps b {
  background: var(--dark); color: var(--accent2);
  border: 2px solid var(--accent); border-radius: 50%;
  width: 54px; height: 54px; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif), Georgia, serif; font-size: 1.05rem; font-weight: 700;
  box-shadow: 0 0 0 6px #0f1c1b;
}
.method-steps span {
  color: #c3ccca; font-size: .63rem; font-weight: 800; letter-spacing: .06em;
  line-height: 1.4; max-width: 11rem;
}

@media (width<=1050px) {
  .method-steps { grid-template-columns: repeat(4, 1fr); row-gap: 2.4rem; }
  .method-steps::before { display: none; }
}
@media (width<=650px) {
  .method-steps { grid-template-columns: repeat(2, 1fr) !important; row-gap: 2rem; }
  .method-steps b { width: 46px; height: 46px; font-size: .95rem; }
  .method-steps span { font-size: .6rem; }
}

/* --- 3. BLOG DA HOME: grade em vez de três carrosséis -------------------
   Eram três trilhas horizontais empilhadas, 1.937px de altura, cada uma com
   rolagem lateral. No celular obrigava a arrastar de lado para ler — gesto que
   quase ninguém faz numa página que rola para baixo. Agora é uma grade de seis,
   e os quinze artigos ficam no /blog. */
.blog-grade {
  grid-template-columns: repeat(3, 1fr); gap: 1.3rem;
  max-width: 1180px; margin: 0 auto; display: grid;
}
.blog-grade .blog-card { flex-basis: auto; }
.blog-grade .blog-visual { height: 178px; }
.blog-grade .blog-visual img { width: 100%; height: 100%; object-fit: cover; }

@media (width<=1050px) { .blog-grade { grid-template-columns: repeat(2, 1fr); } }
@media (width<=650px) {
  .blog-grade { grid-template-columns: 1fr; gap: 1rem; }
  .blog-grade .blog-visual { height: 190px; }
}

/* --- 4. Grade de serviços: destaque para o primeiro card ---------------
   Nove cards iguais em 3x3 são uma parede. O primeiro passa a ocupar duas
   colunas, criando um ponto de entrada para o olho. */
/* --- Grade de serviços: 3x3 exato ---------------------------------------
   O primeiro card ocupava duas colunas. Com nove cards, isso somava dez
   células numa grade de três: sobrava o card 9 sozinho na quarta linha, com
   dois buracos ao lado. Sem o destaque, os nove fecham 3x3 certinho e nenhum
   serviço precisa sair do ar. */
@media (width>1050px) {
  .area-grid { grid-template-columns: repeat(3, 1fr); }
}

/* --- Rodapé: o menu cresceu e a terceira coluna passou a estourar --------
   Eram quatro links numa coluna "auto"; com QUEM SOMOS e PRIVACIDADE viraram
   sete, e em 768px o bloco ultrapassava a largura da tela, criando rolagem
   lateral na página inteira. O menu passa a quebrar linha sempre, e abaixo de
   1050px o rodapé empilha em vez de disputar espaço em três colunas. */
footer nav { flex-wrap: wrap; }

@media (width<=1050px) {
  footer { grid-template-columns: 1fr; gap: 1.5rem; }
  footer nav { justify-content: flex-start; row-gap: .6rem; }
}

@media (width>1600px) {
  .xerox-hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr) 505px; }
}

/* --- Celular: texto e foto lado a lado, sem um por cima do outro --------
   O texto ficava POR CIMA da foto, e o degradê branco que garante a leitura
   cobria justamente a área onde a pessoa aparecia — ela virava um fantasma.
   Foi o mesmo problema que o desktop teve, e a solução é a mesma: separar.

   A primeira linha vira duas colunas — texto à esquerda, foto à direita.
   Nada passa por cima de nada, o degradê some, e a foto aparece nítida. Os
   demais blocos continuam ocupando a largura inteira. */
@media (width<=650px) {
  .mobile-conversion { grid-template-columns: 1fr 41% !important; }

  .mobile-hero-copy {
    grid-area: 1 / 1 / 2 / 2 !important;
    background: none !important;
    padding: .8rem .8rem 1rem 1.1rem !important;
  }

  .mobile-hero-photo {
    position: static !important;
    grid-area: 1 / 2 / 2 / 3 !important;
    width: auto !important; height: auto !important;
    top: auto !important; right: auto !important;
    background: var(--cream); overflow: hidden;
  }
  .mobile-hero-photo img {
    width: 100%; height: 100%; display: block;
    object-fit: cover; object-position: 52% 14%;
  }

  /* Tudo abaixo da primeira linha volta a ocupar a largura toda. */
  .mobile-marketplaces, .mobile-benefits, .mobile-trust,
  .mobile-cta-secondary, .mobile-contact-actions {
    grid-column: 1 / -1 !important;
  }

  .mobile-hero-copy h2 { font-size: clamp(1.25rem, 5.6vw, 1.7rem) !important; }
}

/* ===========================================================================
   CELULAR: DENSIDADE
   ---------------------------------------------------------------------------
   O celular tinha 23,5 telas de rolagem. Medindo por dentro, quase tudo era
   espaço vazio, não texto: 96px de respiro em cima e embaixo de cada seção,
   19px de padding em CADA item de lista, botões empilhados um sobre o outro.

   Regra desta camada: NADA fica escondido. Nenhum display:none em bloco de
   conteúdo, nenhum texto cortado. O Google indexa pela versão de celular —
   o que ele vê aqui é o que vale. O que muda é só a forma.

   Os seletores repetem a classe da seção de propósito: as regras originais
   usam classe, então "main > section" perdia a disputa e não valia nada.
   =========================================================================== */
@media (width<=650px) {

  /* ---- Respiro entre seções: era quase meia tela de vazio por bloco ---- */
  .areas-section, .blog, .faq, .testimonials, .comparativo,
  .tambem-atendemos, .method-section, .sample, .closing,
  .channels, .stats, .regimes { padding-block: 2.5rem; }

  .section-title { margin-bottom: 1.3rem; }
  .section-title .gold-label { margin-bottom: .3rem; }
  .section-title h2 { font-size: clamp(1.35rem, 5.4vw, 1.75rem); line-height: 1.18; margin-bottom: .45rem; }
  .section-title > p { font-size: .9rem; line-height: 1.45; }

  /* ---- Serviços: 9 cartões que somavam 7,6 telas ---- */
  .areas-section .area-grid { gap: .7rem; }

  /* O cartao tinha min-height: 500px — um piso fixo. A lista de 108px era
     esticada ate 298px so para preencher o vazio. Sem o piso, cada cartao
     passa a ter a altura do proprio conteudo. */
  .areas-section .area-card {
    padding: .9rem 1rem 1rem;
    min-height: 0; height: auto;
  }
  .areas-section .area-card ul { flex: 0 0 auto; }
  .areas-section .area-card .number { font-size: 1.45rem; line-height: 1; }
  .areas-section .area-card h3 { font-size: 1rem; line-height: 1.2; margin: .1rem 0 .1rem; }
  .areas-section .area-card small { font-size: .72rem; }

  .areas-section .area-card ul { margin: .55rem 0 .7rem; }
  .areas-section .area-card li {
    font-size: .82rem; line-height: 1.35;
    padding: .26rem 0 .26rem .85rem;
  }

  /* Os dois botões lado a lado em vez de um embaixo do outro. */
  .areas-section .area-acoes {
    display: flex; align-items: center; justify-content: space-between;
    flex-direction: row; gap: .5rem; padding-top: .55rem; margin: 0;
  }
  .areas-section .area-acoes a {
    font-size: .73rem; padding: .45rem .65rem; margin: 0; white-space: nowrap;
  }

  /* ---- Blog: miniatura ao lado do texto, não empilhada em cima ---- */
  .blog-grade { gap: .7rem; }
  .blog-card {
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr);
    align-items: stretch;
    gap: 0; padding: 0; overflow: hidden;
    min-height: 0; height: auto;
  }
  .blog-card .blog-visual { height: auto; min-height: 100%; aspect-ratio: auto; margin: 0; }
  .blog-card .blog-visual img { width: 100%; height: 100%; object-fit: cover; display: block; }
  /* A tarja de categoria sobre a foto sai só da miniatura: a mesma categoria
     continua escrita ao lado, em texto, então nada se perde. */
  .blog-card .blog-visual span { display: none; }

  .blog-card .blog-content {
    padding: .7rem .85rem .75rem; display: flex; flex-direction: column;
    gap: .2rem; min-width: 0;
    min-height: 0;              /* tinha piso de 330px */
  }
  .blog-card .blog-content small { font-size: .65rem; letter-spacing: .06em; margin: 0; }
  .blog-card .blog-content h3 { font-size: .92rem; line-height: 1.25; margin: 0; }
  .blog-card .blog-content p { font-size: .77rem; line-height: 1.38; margin: 0; }
  .blog-card .blog-content a { font-size: .71rem; margin-top: auto; padding: .35rem 0 0; }

  /* ---- Depoimentos ---- */
  .testimonials .testimonial-grid { gap: .7rem; }
  .testimonials .testimonial { padding: 1rem 1.1rem; }
  .testimonials .testimonial p { font-size: .87rem; line-height: 1.45; }

  /* ---- Comparativo ---- */
  .comparativo .comparativo-grid { gap: .7rem; }
  .comparativo .comparativo-grid > * { padding: 1rem 1.1rem; }
  .comparativo .comparativo-grid li { font-size: .83rem; line-height: 1.4; padding-block: .28rem; }

  /* ---- Quem mais atendemos ---- */
  .tambem-atendemos .atendemos-grid { gap: .7rem; }
  .tambem-atendemos .atende-card { padding: 1rem 1.1rem; }

  /* ---- Como trabalhamos ---- */
  .method-section .method-steps { gap: 1.1rem 0; }
  .method-section .method-steps > div { min-height: 0; }   /* tinha piso de 140px cada */

  /* A seção do formulário reservava 725px fixos; passa a ter a altura
     do próprio formulário. */
  .xerox-hero { min-height: 0; }

  /* ---- Dúvidas ---- */
  .faq .faq-list details { padding-block: .65rem; }
  .faq .faq-list summary { font-size: .91rem; line-height: 1.3; }
}

/* ===========================================================================
   CELULAR: ALVO DE TOQUE
   ---------------------------------------------------------------------------
   Ao compactar os cartões acima, alguns botões ficaram com 34-37px de altura.
   O mínimo recomendado para o dedo é 44px (o Google mede isso na avaliação de
   usabilidade em celular, e ela pesa no Índice de qualidade do Ads).
   Aqui a altura volta ao mínimo sem desfazer a compactação: o ganho veio do
   espaço entre as seções e dos pisos fixos, não de botão pequeno.
   =========================================================================== */
@media (width<=650px) {

  /* Os dois botões de contato do topo: são os que geram o lead. */
  .mobile-cta-secondary,
  .mobile-contact-actions a,
  .mobile-whatsapp-fixed {
    min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }

  /* Ações dentro do cartão de serviço. */
  .areas-section .area-acoes a {
    min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }

  /* O título do cartão é link: ganha área de toque sem mudar de tamanho. */
  .areas-section .area-card h3 a { display: inline-block; padding-block: .35rem; }

  /* Link de "continuar lendo" das matérias. */
  .blog-card .blog-content a { min-height: 44px; display: inline-flex; align-items: center; }

  /* Links do rodapé. Estava escrito .site-footer, classe que nao existe no
     HTML — a regra nunca valeu. O rodape usa a tag <footer> pura. */
  footer nav a { display: inline-block; padding-block: .45rem; }
}

/* ===========================================================================
   CARTÃO DE SERVIÇO: PISO DE ALTURA APOSENTADO (todas as larguras)
   ---------------------------------------------------------------------------
   O cartão tinha min-height fixo (520px no desktop, 500px no celular), herdado
   de quando cada um listava 9 itens. Agora que a home lista 4 e os 9 vivem na
   página do serviço, esse piso virava 101px de vazio esticado dentro da lista,
   abrindo um buraco entre o último item e os botões.

   Não precisa existir: em CSS Grid os cartões de uma mesma linha já se igualam
   pela mais alta. Medido — sem o piso, os 9 ficam em 419px, todos iguais.
   =========================================================================== */
.area-card { min-height: 0; }
.area-card ul { flex: 0 0 auto; }
.blog-content { min-height: 0; }

/* ===========================================================================
   CELULAR: A FAIXA BRANCA ANTES DO BLOCO PRETO
   ---------------------------------------------------------------------------
   A seção de conversão do topo é forçada a ocupar uma tela inteira
   (min-height: 100dvh - 58px). O conteúdo dela pede só ~751px, então sobravam
   ~100px que viravam padding-bottom — a faixa branca morta que aparecia entre
   os botões de contato e o bloco preto "ENVIE SUA OPERAÇÃO".

   Essa folga NÃO era desperdício: é a zona de segurança da barra verde fixa
   do WhatsApp (92px). Sem ela, a barra cobre "LIGAR AGORA" e "CHAMAR NO
   WHATSAPP" — justamente os botões que geram contato.

   A correção não apaga a folga: transfere. A seção encurta exatamente a altura
   da barra, e essa altura vira padding no topo do bloco preto. A zona de
   segurança continua existindo, só deixa de ser um vazio branco e passa a ser
   o começo do bloco preto.

   Medido no site, com a barra verde nunca cobrindo os botões:
     360x740   faixa 88px  -> 14px   (folga dos botões 20px -> 30px)
     390x844   faixa 99px  -> 14px   (folga 14px -> 22px)
     412x915   faixa 106px -> 14px   (folga 14px -> 15px)

   O !important é necessário: as regras de altura desta seção já usam
   !important em várias faixas de tela, e sem ele esta não valeria.
   =========================================================================== */
@media (width<=650px) {
  .mobile-conversion {
    min-height: calc(100dvh - 58px - 92px) !important;
    padding-bottom: .9rem !important;
  }
  /* CORRIGIDO: eu tinha posto 112px aqui achando que .xerox-hero era o bloco
     preto. Nao e — .xerox-hero e um involucro CREME; o preto e o .hero-form
     dentro dele. O resultado foi trocar 106px de vazio branco por 126px de
     vazio creme, ou seja, PIOR que antes. Com zero, o bloco preto encosta
     logo abaixo dos botoes (14px) e a faixa de seguranca da barra verde passa
     a ser o proprio topo do bloco preto, que e o que se queria desde o inicio. */
  .xerox-hero { padding-top: 0 !important; }
}

/* ===========================================================================
   FAIXA DE PROVA DO FUNDADOR  +  PÁGINA NOSSA HISTÓRIA
   ---------------------------------------------------------------------------
   O selo é SVG desenhado (não é imagem): fica nítido em qualquer tela e não
   carrega arquivo nenhum. Os gradientes ficam num <defs> único no topo da
   página; por isso o mesmo desenho pode ser repetido em vários tamanhos sem
   pesar.
   =========================================================================== */

.selo-gkfd { display: block; height: auto; max-width: 100%; }

/* ---- faixa de prova, logo depois do formulário na home ---- */
.prova-fundador {
  background: var(--dark);
  color: var(--cream);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2.4rem;
  align-items: center;
  padding: 3.4rem clamp(1.1rem, 5vw, 4rem);
}
.prova-selo { display: flex; justify-content: center; }
.prova-texto .gold-label { color: var(--accent2); margin-bottom: .5rem; }
.prova-texto h2 {
  font-size: clamp(1.35rem, 3.2vw, 2rem);
  line-height: 1.2;
  margin-bottom: .7rem;
}
.prova-texto h2 em { color: var(--accent2); font-style: normal; }
.prova-texto > p { font-size: .96rem; line-height: 1.6; opacity: .8; max-width: 56ch; }

.prova-fatos { list-style: none; margin: 1.3rem 0 1.4rem; display: grid; gap: .6rem; }
.prova-fatos li { display: flex; gap: .9rem; align-items: baseline; font-size: .92rem; }
.prova-fatos b {
  color: var(--accent2); font-size: .74rem; letter-spacing: .08em;
  white-space: nowrap; min-width: 11.5rem;
}
.prova-fatos span { opacity: .78; }

.prova-link {
  display: inline-flex; align-items: center; min-height: 44px;
  font-size: .78rem; letter-spacing: .1em; font-weight: 700;
  color: var(--accent2); border-bottom: 1px solid rgba(229, 167, 53, .45);
}
.prova-link:hover { border-bottom-color: var(--accent2); }

@media (width<=880px) {
  .prova-fundador { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 1.5rem; }
  .prova-texto > p { margin-inline: auto; }
  .prova-fatos li { flex-direction: column; align-items: center; gap: .1rem; }
  .prova-fatos b { min-width: 0; }
}
@media (width<=650px) {
  .prova-fundador { padding: 2.5rem 1.1rem; }
  .prova-selo .selo-gkfd { width: 132px; }
}

/* ---- página Nossa História ---- */
.historia { max-width: 46rem; margin: 0 auto; padding: 3rem clamp(1.1rem, 5vw, 2rem) 4rem; }

.historia-topo {
  display: grid; grid-template-columns: auto minmax(0, 1fr);
  gap: 1.8rem; align-items: center;
  padding-bottom: 2rem; margin-bottom: 2.2rem;
  border-bottom: 1px solid var(--line);
}
.historia-topo h1 {
  font-size: clamp(1.6rem, 4.4vw, 2.5rem); line-height: 1.16;
  margin: .3rem 0 .6rem;
}
.historia-linha { color: var(--muted); font-size: 1rem; line-height: 1.55; }

.historia-corpo > p { margin-bottom: 1.15rem; line-height: 1.75; }
.historia-corpo > h2 {
  font-size: clamp(1.15rem, 2.8vw, 1.45rem); line-height: 1.28;
  margin: 2.4rem 0 .9rem;
}
.historia-corpo > h2::before {
  content: ""; display: block; width: 34px; height: 2px;
  background: var(--accent); margin-bottom: .8rem;
}

/* As duas frases que o próprio texto destaca. */
.historia-destaque {
  font-size: clamp(1.15rem, 3vw, 1.5rem); line-height: 1.35; font-weight: 700;
  color: var(--dark); border-left: 3px solid var(--accent);
  padding: .2rem 0 .2rem 1.1rem; margin: 1.8rem 0 !important;
}
.historia-marcos {
  background: var(--dark); color: var(--cream);
  padding: 1.3rem 1.5rem; border-radius: 12px;
  font-weight: 600; line-height: 1.55; margin: 2rem 0 !important;
}

.historia-cta {
  margin-top: 3rem; padding: 2rem 1.6rem;
  background: var(--cream); border: 1px solid var(--line); border-radius: 14px;
  text-align: center;
}
.historia-cta h2 { font-size: 1.25rem; margin-bottom: .5rem; }
.historia-cta p { color: var(--muted); margin-bottom: 1.2rem; }
.historia-cta a {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 1.6rem;
  background: var(--dark); color: var(--cream);
  font-size: .8rem; letter-spacing: .09em; font-weight: 700; border-radius: 8px;
}
.historia-cta a:hover { background: var(--green); }

@media (width<=650px) {
  .historia { padding-top: 2rem; }
  .historia-topo { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 1.1rem; }
  .historia-topo .selo-gkfd { width: 120px; }
  .historia-destaque { font-size: 1.1rem; }
}

/* ---- redes no rodapé ---- */
.rodape-redes { display: flex; gap: 1.4rem; flex-wrap: wrap; }
.rodape-redes a {
  font-size: .82rem; letter-spacing: .04em;
  border-bottom: 1px solid rgba(246, 243, 236, .25);
  display: inline-block; padding-block: .35rem;
}
.rodape-redes a:hover { border-bottom-color: var(--accent2); }
@media (width<=650px) { .rodape-redes { justify-content: center; } }

/* ===========================================================================
   FAIXA DE PROVA — COMPOSIÇÃO DO DESKTOP
   ---------------------------------------------------------------------------
   Erro que isto corrige: a faixa ocupava a largura toda com o conteúdo
   encostado à esquerda. Em 1920px a coluna de texto tinha 1571px de largura
   com ~570px de texto dentro — sobrava metade do bloco preta e vazia.

   Agora o bloco tem composição de três partes: selo, discurso e os três
   marcos como cartões. Nenhum conteúdo novo foi criado — os mesmos elementos
   foram redistribuídos —, então o celular continua exatamente como estava.
   =========================================================================== */

@media (width>880px) {
  /* Duas colunas: selo e texto. Os marcos ficam sob o texto, alinhados a ele. */
  .prova-fundador {
    /* A SEÇÃO continua sangrando de ponta a ponta: é uma faixa escura na
       sequência da página, e limitar a largura dela abria duas tiras claras
       nas laterais, quebrando a continuidade. Quem se limita é o CONTEÚDO,
       via padding que cresce com a tela — o mesmo recurso que as outras
       seções do site já usam. */
    column-gap: 3rem;
    padding-inline: max(2rem, calc((100% - 1480px) / 2));
  }
  .prova-fatos { grid-column: 2; }
}

@media (width>1180px) {
  /* Largura suficiente para as três partes lado a lado. */
  .prova-fundador {
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 25rem);
    align-items: center;
    column-gap: 3.4rem;
    padding-block: 4rem;
  }

  /* O selo cresce junto com o espaço: em tela larga ele é o âncora visual. */
  .prova-selo .selo-gkfd { width: 216px; }

  .prova-texto > p { max-width: 42ch; }

  /* Os marcos deixam de ser lista corrida e viram cartões: preenchem a
     terceira coluna com peso visual em vez de linhas soltas. */
  .prova-fatos {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    margin: 0;
    gap: .8rem;
  }
  .prova-fatos li {
    flex-direction: column;
    align-items: flex-start;
    gap: .3rem;
    padding: 1rem 1.2rem;
    border: 1px solid rgba(229, 167, 53, .26);
    border-radius: 10px;
    background: rgba(255, 255, 255, .025);
  }
  .prova-fatos b { min-width: 0; font-size: .76rem; }
  .prova-fatos span { font-size: .89rem; line-height: 1.45; opacity: .82; }
}

@media (width>1500px) {
  .prova-selo .selo-gkfd { width: 244px; }
  .prova-fundador { column-gap: 4rem; }
}

/* Ao virar irmã de .prova-texto, a lista de marcos passou a somar o espaçamento
   do grid ADEMAIS da margem própria que ela já tinha — 24px a mais no celular.
   Quem cuida do respiro aqui é o grid; a margem sai. */
@media (width<=880px) {
  .prova-fatos { margin: 0; }
}

/* ===========================================================================
   CELULAR: CARTÃO DE SERVIÇO CENTRALIZADO
   ---------------------------------------------------------------------------
   Duas coisas aqui.

   1. Alinhamento central do cartão (número, título, contagem e os dois botões).

   2. O sublinhado dourado do "VER DETALHES" estava 10px à esquerda e 11px à
      direita da palavra. Causa: quando aumentei os botões para os 44px mínimos
      de toque, pus acolchoamento nos quatro lados. O vertical era o necessário;
      o horizontal só esticou a caixa, e a linha acompanha a caixa, não o texto.
      A altura continua garantida pelo min-height, então o horizontal sai.

   A lista de itens continua alinhada à esquerda de propósito: item de lista
   centralizado, com marcador e divisória, perde a leitura de coluna.
   =========================================================================== */
@media (width<=650px) {
  .areas-section .area-card { text-align: center; }

  /* A lista permanece à esquerda — é texto de leitura, não título. */
  .areas-section .area-card ul { text-align: left; }

  .areas-section .area-acoes {
    justify-content: center;
    gap: 1.4rem;
  }
  /* Sem acolchoamento lateral: o sublinhado volta a ter a largura da palavra.
     E sem esticar: o "SOLICITAR ANÁLISE" vinha com flex:1, crescia até a borda
     e empurrava o par para as pontas — com ele esticado, centralizar não fazia
     efeito nenhum. Cada botão passa a ter a largura do próprio texto. */
  .areas-section .area-acoes a { padding-inline: 0; flex: 0 1 auto; }
}

/* ===========================================================================
   CALCULADORA DE REPASSE
   ---------------------------------------------------------------------------
   Ferramenta, não artigo. O visitante precisa ENTRAR e usar — é o formato que
   o resumo com IA do Google não substitui, e o que seller compartilha em
   grupo (que é como se ganha link).

   No desktop, formulário à esquerda e resultado grudado à direita: a pessoa
   mexe num campo e vê o número mudar sem tirar os olhos. No celular, empilha.
   =========================================================================== */

.ferramenta { max-width: 62rem; margin: 0 auto; padding: 2.6rem clamp(1.1rem, 5vw, 2rem) 4rem; }

.ferramenta-topo { max-width: 44rem; margin-bottom: 2rem; }
.ferramenta-topo h1 {
  font-size: clamp(1.6rem, 4.4vw, 2.5rem); line-height: 1.15; margin: .3rem 0 .7rem;
}
.ferramenta-linha { color: var(--muted); font-size: 1.02rem; line-height: 1.6; }

/* ---- o quadro da calculadora ---- */
.calc {
  background: var(--dark); color: var(--cream);
  border-radius: 16px; overflow: hidden;
  box-shadow: 0 18px 40px rgba(15, 28, 27, .18);
}
.calc-cabeca { padding: 1.7rem clamp(1.1rem, 3vw, 2rem) 0; }
.calc-cabeca h2 { font-size: clamp(1.2rem, 3vw, 1.55rem); margin-bottom: .45rem; }
.calc-cabeca p { font-size: .9rem; line-height: 1.55; opacity: .78; max-width: 46ch; }

.calc-corpo {
  display: grid; gap: 1.6rem;
  padding: 1.5rem clamp(1.1rem, 3vw, 2rem) 2rem;
}
@media (width>860px) { .calc-corpo { grid-template-columns: 1fr 20rem; align-items: start; } }

.calc-form { display: grid; gap: .85rem; }
@media (width>560px) { .calc-form { grid-template-columns: 1fr 1fr; } }
.calc-form > label:first-child { grid-column: 1 / -1; }
.calc-aviso {
  grid-column: 1 / -1; font-size: .76rem; color: var(--accent2);
  min-height: 1em; margin: -.35rem 0 .1rem;
}

.calc-campo { display: flex; flex-direction: column; gap: .3rem; }
.calc-rot { font-size: .74rem; letter-spacing: .04em; opacity: .82; display: flex; align-items: center; gap: .35rem; }
.calc-dica {
  width: 15px; height: 15px; border-radius: 50%; flex: 0 0 15px;
  background: rgba(229, 167, 53, .22); color: var(--accent2);
  font-size: .58rem; font-weight: 700; display: grid; place-items: center; cursor: help;
}
.calc-entrada {
  display: flex; align-items: center; gap: .5rem;
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(229, 167, 53, .22); border-radius: 8px;
  padding: 0 .7rem; min-height: 46px;
  transition: border-color .18s, background .18s;
}
.calc-entrada:focus-within { border-color: var(--accent2); background: rgba(255, 255, 255, .1); }
.calc-entrada i { font-style: normal; font-size: .74rem; opacity: .6; flex: 0 0 auto; }
.calc-entrada input, .calc-entrada select {
  flex: 1; min-width: 0; background: none; border: 0; color: var(--cream);
  font: inherit; font-size: .95rem; padding: .6rem 0; outline: none;
}
.calc-entrada select { cursor: pointer; }
.calc-entrada option { background: var(--dark); color: var(--cream); }

/* ---- resultado ---- */
.calc-saida {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(229, 167, 53, .2); border-radius: 12px;
  padding: 1.1rem 1.2rem;
}
@media (width>860px) { .calc-saida { position: sticky; top: 96px; } }

.calc-tabela { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.calc-tabela th, .calc-tabela td { padding: .42rem 0; font-size: .82rem; text-align: left; }
.calc-tabela th { font-weight: 400; opacity: .78; }
.calc-tabela td { text-align: right; white-space: nowrap; }
.calc-tabela tr.base th, .calc-tabela tr.base td { font-weight: 700; opacity: 1; }
.calc-tabela tr.subtotal th, .calc-tabela tr.subtotal td {
  border-top: 1px solid rgba(229, 167, 53, .28);
  border-bottom: 1px solid rgba(229, 167, 53, .28);
  padding-block: .6rem; color: var(--accent2); font-weight: 700; opacity: 1;
}

.calc-resultado {
  margin-top: 1rem; padding-top: 1rem; border-top: 2px solid rgba(229, 167, 53, .35);
  display: flex; flex-direction: column; gap: .12rem;
}
.calc-rotulo { font-size: .64rem; letter-spacing: .14em; opacity: .6; }
.calc-resultado strong { font-size: clamp(1.6rem, 5vw, 2.1rem); line-height: 1.1; font-variant-numeric: tabular-nums; }
.calc-resultado.ok strong { color: #6fd6a0; }
.calc-resultado.ruim strong { color: #ff8f7a; }
.calc-margem { font-size: .76rem; opacity: .68; }
.calc-alerta {
  margin-top: .6rem; font-size: .76rem; line-height: 1.45;
  color: #ffb9a8; border-left: 2px solid #ff8f7a; padding-left: .6rem;
}

.calc-notas { display: none; }

.calc-campo-principal .calc-rot { font-size: .82rem; font-weight: 700; opacity: 1; }
.calc-campo-principal .calc-entrada { min-height: 52px; border-color: rgba(229, 167, 53, .4); }
.calc-campo-principal .calc-entrada input { font-size: 1.1rem; }

.calc-ver-btn {
  grid-column: 1 / -1; border: 0; border-radius: 8px; cursor: pointer;
  padding: .95rem 1rem; margin-top: .2rem;
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  color: var(--dark); font: inherit; font-weight: 800; font-size: .84rem;
  letter-spacing: .04em; transition: filter .18s, transform .18s;
}
.calc-ver-btn:hover { filter: brightness(1.08); }
.calc-ver-btn:active { transform: scale(.98); }

.calc-avancado { grid-column: 1 / -1; margin-top: .3rem; }
.calc-avancado summary {
  cursor: pointer; font-size: .78rem; opacity: .72; padding: .5rem 0;
  list-style: none; display: flex; align-items: center; gap: .4rem;
}
.calc-avancado summary::-webkit-details-marker { display: none; }
.calc-avancado summary::before { content: "+"; font-weight: 700; color: var(--accent2); }
.calc-avancado[open] summary::before { content: "−"; }
.calc-avancado summary:hover { opacity: 1; }
.calc-avancado[open] summary { margin-bottom: .5rem; }
/* A visibilidade é controlada por JS via [hidden] (nem todo navegador
   recolhe sozinho o conteúdo de um <details> fechado — ver site.js/calc
   inline). Por isso o grid só vale quando NÃO tem [hidden]: "display" de
   autor sempre vence "[hidden]{display:none}" do user-agent, então declarar
   grid sem essa guarda deixaria o conteúdo visível mesmo escondido. */
.calc-avancado-corpo:not([hidden]) { display: grid; gap: .85rem; }
@media (width>560px) { .calc-avancado-corpo:not([hidden]) { grid-template-columns: 1fr 1fr; } }
.calc-avancado-corpo > .calc-plataforma { grid-column: 1 / -1; }

.calc-whats {
  display: block; text-align: center; margin-top: 1rem; padding: .85rem 1rem;
  border-radius: 8px; text-decoration: none;
  background: rgba(111, 214, 160, .14); border: 1px solid rgba(111, 214, 160, .4);
  color: #6fd6a0; font-weight: 800; font-size: .78rem; letter-spacing: .03em;
  transition: background .18s;
}
.calc-whats:hover { background: rgba(111, 214, 160, .24); }

/* ---- texto que sustenta a página na busca ---- */
.calc-explica, .calc-faq { margin-top: 3rem; }
.calc-explica > h2, .calc-faq > h2 {
  font-size: clamp(1.25rem, 3vw, 1.6rem); margin-bottom: 1.3rem;
}
.calc-explica > h2::before, .calc-faq > h2::before {
  content: ""; display: block; width: 34px; height: 2px;
  background: var(--accent); margin-bottom: .8rem;
}
.calc-itens { display: grid; gap: 1.1rem; }
@media (width>760px) { .calc-itens { grid-template-columns: 1fr 1fr; } }
.calc-item {
  border: 1px solid var(--line); border-radius: 12px; padding: 1.1rem 1.25rem;
  background: var(--cream);
}
.calc-item h3 { font-size: .98rem; margin-bottom: .4rem; }
.calc-item p { font-size: .87rem; line-height: 1.55; color: var(--muted); }

@media (width<=650px) {
  .ferramenta { padding-top: 1.8rem; }
  .calc-corpo { padding-inline: 1.1rem; }
  .calc-explica, .calc-faq { margin-top: 2.2rem; }
}

/* ---- abas de plataforma (no lugar da lista suspensa) ---------------------
   Aba mostra as três opções de uma vez e troca num toque; lista suspensa
   esconde e exige dois. Setas do teclado navegam entre elas. ------------- */
.calc-plataforma { grid-column: 1 / -1; display: flex; flex-direction: column; gap: .45rem; }

.calc-abas {
  display: flex; gap: .4rem; flex-wrap: wrap;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(229, 167, 53, .2);
  border-radius: 10px; padding: .3rem;
}
.calc-aba {
  flex: 1 1 auto; min-width: 6.5rem; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 0; border-radius: 7px; cursor: pointer;
  color: var(--cream); font: inherit; font-size: .8rem; font-weight: 600;
  padding: .4rem .7rem; opacity: .68;
  transition: background .18s, opacity .18s, color .18s;
}
.calc-aba:hover { opacity: 1; background: rgba(255, 255, 255, .06); }
.calc-aba:focus-visible { outline: 2px solid var(--accent2); outline-offset: 2px; }
.calc-aba[aria-selected="true"] {
  background: var(--accent); color: #fff; opacity: 1;
  box-shadow: 0 3px 10px rgba(200, 132, 24, .3);
}

/* O FAQ desta página não é o da home: a regra de espaçamento de lá está
   presa a .faq e não alcançava aqui, deixando o resumo com 24px de toque. */
.calc-faq summary { min-height: 44px; display: flex; align-items: center; }

@media (width<=560px) {
  .calc-aba { flex: 1 1 45%; font-size: .76rem; min-width: 0; }
}

/* ===========================================================================
   VALIDADOR E GERADOR DE EAN
   =========================================================================== */
.ean-corpo { padding: 1.4rem clamp(1.1rem, 3vw, 2rem) 2rem; display: grid; gap: 1.2rem; }
.ean-painel { display: grid; gap: 1rem; }
.ean-entrada input {
  font-size: 1.15rem; letter-spacing: .09em;
  font-variant-numeric: tabular-nums; padding-block: .75rem;
}
.ean-form { display: grid; gap: .85rem; }
@media (width>620px) { .ean-form { grid-template-columns: 2fr 1fr 1fr; } }

.ean-interno {
  display: flex; gap: .6rem; align-items: flex-start;
  font-size: .8rem; line-height: 1.45; cursor: pointer;
  padding: .7rem .85rem; border-radius: 8px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(229, 167, 53, .18);
}
.ean-interno input { margin-top: .18rem; accent-color: var(--accent); flex: 0 0 auto; }

.ean-saida { display: grid; gap: .7rem; }
.ean-bloco {
  border-radius: 10px; padding: .95rem 1.1rem;
  border-left: 3px solid; display: grid; gap: .3rem;
}
.ean-bloco strong { font-size: .96rem; line-height: 1.3; }
.ean-bloco span { font-size: .84rem; line-height: 1.5; opacity: .84; }
.ean-bloco b { font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.ean-bloco.ok     { background: rgba(111, 214, 160, .1); border-color: #6fd6a0; }
.ean-bloco.ok strong { color: #6fd6a0; }
.ean-bloco.ruim   { background: rgba(255, 143, 122, .1); border-color: #ff8f7a; }
.ean-bloco.ruim strong { color: #ff8f7a; }
.ean-bloco.calc   { background: rgba(229, 167, 53, .1); border-color: var(--accent2); }
.ean-bloco.calc strong { color: var(--accent2); }
.ean-bloco.neutro { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .28); }

.ean-lista {
  margin: 0; padding: .9rem 1.1rem .9rem 2.6rem;
  background: rgba(0, 0, 0, .26); border-radius: 10px;
  max-height: 20rem; overflow-y: auto;
  font-variant-numeric: tabular-nums; letter-spacing: .05em;
  display: grid; gap: .3rem;
}
.ean-lista li { font-size: .92rem; }
.ean-lista li::marker { color: rgba(246, 243, 236, .4); font-size: .72rem; }

.ean-copiar {
  justify-self: start; min-height: 44px; padding: 0 1.3rem;
  background: var(--accent); color: #fff; border: 0; border-radius: 8px;
  font: inherit; font-size: .76rem; font-weight: 700; letter-spacing: .09em;
  cursor: pointer; transition: filter .18s;
}
.ean-copiar:hover { filter: brightness(1.08); }

.ean-alerta {
  margin-top: 1.4rem; padding: 1.2rem 1.4rem;
  background: var(--cream); border: 1px solid var(--line);
  border-left: 3px solid var(--accent); border-radius: 12px;
}
.ean-alerta strong { display: block; margin-bottom: .45rem; font-size: 1rem; }
.ean-alerta p { font-size: .88rem; line-height: 1.6; color: var(--muted); }
.ean-alerta p + p { margin-top: .6rem; }

/* ===========================================================================
   TABELA COMPARATIVA DE TARIFAS
   ---------------------------------------------------------------------------
   Tabela é o formato que o Google puxa para o destaque e para a resposta com
   citação. Cada bloco carrega fonte e data à vista: tarifa publicada é
   afirmação de fato, e seller precifica em cima dela.
   =========================================================================== */

.tar-aviso {
  background: var(--cream); border: 1px solid var(--line);
  border-left: 3px solid var(--accent); border-radius: 12px;
  padding: 1.2rem 1.4rem; margin-bottom: 2.4rem;
}
.tar-aviso strong { display: block; margin-bottom: .45rem; font-size: 1rem; }
.tar-aviso p { font-size: .88rem; line-height: 1.6; color: var(--muted); }

.tar-bloco { margin-bottom: 2.6rem; }
.tar-cabeca {
  display: flex; align-items: center; gap: .8rem; flex-wrap: wrap;
  margin-bottom: .9rem;
}
.tar-cabeca h2 { font-size: clamp(1.2rem, 3vw, 1.5rem); margin: 0; }

.tar-selo {
  font-size: .58rem; letter-spacing: .1em; font-weight: 700;
  padding: .3rem .55rem; border-radius: 20px;
  background: rgba(98, 104, 102, .13); color: var(--muted);
}
.tar-selo.oficial { background: rgba(25, 76, 71, .12); color: var(--green); }

/* Tabela larga não pode empurrar a página: rola dentro do próprio quadro. */
.tar-rolagem {
  overflow-x: auto; border: 1px solid var(--line);
  border-radius: 12px; background: #fff;
  -webkit-overflow-scrolling: touch;
}
.tar-tabela { width: 100%; border-collapse: collapse; min-width: 30rem; }
.tar-tabela th, .tar-tabela td {
  padding: .8rem 1rem; text-align: left; font-size: .87rem;
  border-bottom: 1px solid var(--line); vertical-align: top;
}
.tar-tabela thead th {
  background: var(--dark); color: var(--cream);
  font-size: .68rem; letter-spacing: .09em; text-transform: uppercase;
  border-bottom: 0; position: sticky; top: 0;
}
.tar-tabela tbody th { font-weight: 600; }
.tar-tabela tbody td { color: var(--muted); font-variant-numeric: tabular-nums; }
.tar-tabela tbody tr:last-child th, .tar-tabela tbody tr:last-child td { border-bottom: 0; }
.tar-tabela tbody tr:hover { background: rgba(200, 132, 24, .045); }

.tar-obs { list-style: none; margin: .9rem 0 0; display: grid; gap: .4rem; }
.tar-obs li {
  font-size: .84rem; line-height: 1.5; color: var(--muted);
  padding-left: 1.1rem; position: relative;
}
.tar-obs li::before {
  content: ""; position: absolute; left: 0; top: .55em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--accent);
}

.tar-fonte {
  margin-top: .8rem; font-size: .72rem; color: var(--muted);
  padding-top: .6rem; border-top: 1px dashed var(--line);
}
.tar-fonte a { color: var(--accent); border-bottom: 1px solid rgba(200, 132, 24, .35); }

.tar-intro { color: var(--muted); font-size: .92rem; line-height: 1.6; margin: -.6rem 0 1.3rem; max-width: 60ch; }

.tar-ferramenta {
  margin-top: 2.6rem; padding: 1.7rem;
  background: var(--dark); color: var(--cream); border-radius: 14px;
}
.tar-ferramenta h2 { font-size: 1.2rem; margin-bottom: .45rem; }
.tar-ferramenta p { font-size: .9rem; line-height: 1.55; opacity: .8; margin-bottom: 1.1rem; max-width: 52ch; }
.tar-ferramenta a {
  display: inline-flex; align-items: center; min-height: 46px; padding: 0 1.4rem;
  background: var(--accent); color: #fff; border-radius: 8px;
  font-size: .76rem; letter-spacing: .09em; font-weight: 700;
}
.tar-ferramenta a:hover { filter: brightness(1.08); }

@media (width<=650px) {
  .tar-bloco { margin-bottom: 2rem; }
  .tar-tabela th, .tar-tabela td { padding: .65rem .8rem; font-size: .82rem; }
}

/* ===========================================================================
   APROFUNDAMENTO DAS PÁGINAS DE SERVIÇO
   ---------------------------------------------------------------------------
   O que faltava nelas não era marcação — era substância. Cada uma ganhou um
   H2 escrito como a pergunta que a pessoa digita, uma tabela de mecânica, um
   exemplo em reais e um FAQ. Isto estiliza esse bloco.
   =========================================================================== */

.servico-fundo { margin-top: 2.6rem; }
.servico-fundo > h2 {
  font-size: clamp(1.2rem, 3vw, 1.55rem); line-height: 1.25; margin: 2rem 0 .9rem;
}
.servico-fundo > h2:first-child { margin-top: 0; }
.servico-fundo > h2::before {
  content: ""; display: block; width: 34px; height: 2px;
  background: var(--accent); margin-bottom: .8rem;
}
.serv-intro { font-size: .96rem; line-height: 1.7; color: var(--muted); margin-bottom: 1.4rem; }

/* Tabela larga rola dentro do próprio quadro, nunca empurra a página. */
.serv-rolagem {
  overflow-x: auto; border: 1px solid var(--line); border-radius: 12px;
  background: #fff; margin-bottom: 1.4rem; -webkit-overflow-scrolling: touch;
}
.serv-rolagem .tar-tabela { min-width: 26rem; margin: 0; }
.serv-rolagem caption {
  text-align: left; padding: .85rem 1rem; font-size: .78rem; font-weight: 700;
  letter-spacing: .05em; color: var(--muted); border-bottom: 1px solid var(--line);
}

.serv-exemplo {
  background: var(--cream); border: 1px solid var(--line);
  border-left: 3px solid var(--accent); border-radius: 12px;
  padding: 1.2rem 1.4rem; margin-bottom: 1.4rem;
}
.serv-exemplo-rot {
  font-size: .6rem; letter-spacing: .16em; font-weight: 700;
  color: var(--accent); margin-bottom: .4rem;
}
.serv-exemplo h3 { font-size: 1rem; line-height: 1.3; margin-bottom: .5rem; }
.serv-exemplo p { font-size: .89rem; line-height: 1.65; color: var(--muted); }

.serv-ferramenta {
  margin-top: 1.6rem; padding: 1.2rem 1.4rem;
  background: var(--dark); color: var(--cream); border-radius: 12px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
}
.serv-ferramenta p { font-size: .88rem; line-height: 1.5; opacity: .82; max-width: 42ch; margin: 0; }
.serv-ferramenta a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.2rem;
  background: var(--accent); color: #fff; border-radius: 8px; white-space: nowrap;
  font-size: .73rem; letter-spacing: .08em; font-weight: 700;
}
.serv-ferramenta a:hover { filter: brightness(1.08); }

.servico-fundo .faq-list summary { min-height: 44px; display: flex; align-items: center; }

@media (width<=650px) {
  .serv-ferramenta { flex-direction: column; align-items: stretch; }
  .serv-ferramenta a { justify-content: center; }
}

/* Bloco de aprofundamento dos artigos — reaproveita o estilo das páginas de
   serviço, só com o respiro próprio do texto corrido do blog. */
.artigo-fundo { margin-top: 2.4rem; }
.artigo-fundo > h2 {
  font-size: clamp(1.15rem, 2.9vw, 1.45rem); line-height: 1.28; margin: 2rem 0 .9rem;
}
.artigo-fundo > h2:first-child { margin-top: 0; }
.artigo-fundo > h2::before {
  content: ""; display: block; width: 34px; height: 2px;
  background: var(--accent); margin-bottom: .8rem;
}
.artigo-fundo .serv-rolagem { margin-bottom: 1.3rem; }
.artigo-fundo .faq-list summary { min-height: 44px; display: flex; align-items: center; }

/* Blocos de aprofundamento do "sobre" e do índice de serviços — mesmo padrão
   das páginas de serviço. */
.sobre-fundo, .serv-indice-guia {
  max-width: 46rem; margin: 2.6rem auto 0; padding-inline: clamp(1.1rem, 5vw, 2rem);
}
.sobre-fundo > h2, .serv-indice-guia > h2 {
  font-size: clamp(1.2rem, 3vw, 1.5rem); line-height: 1.26; margin: 2rem 0 .9rem;
}
.sobre-fundo > h2:first-child, .serv-indice-guia > h2:first-child { margin-top: 0; }
.sobre-fundo > h2::before, .serv-indice-guia > h2::before {
  content: ""; display: block; width: 34px; height: 2px;
  background: var(--accent); margin-bottom: .8rem;
}
.sobre-fundo .faq-list summary, .serv-indice-guia .faq-list summary {
  min-height: 44px; display: flex; align-items: center;
}

/* ===========================================================================
   SECAO DE MECANICA DA PLATAFORMA  (contabilidade-mercado-livre / shopee /
   amazon) — o conteudo proprio de cada canal, que e o que separa uma pagina
   da outra aos olhos do Google. Usa as classes de tabela e destaque que ja
   existiam nas paginas de servico, para nao criar estilo novo.
   =========================================================================== */
.plataforma-fundo {
  background: var(--cream);
  border-bottom: 1px solid var(--line);
  padding: 4.5rem 6vw;
}
.plataforma-corpo { max-width: 60rem; margin: 0 auto; }
.plataforma-corpo h3 {
  font-family: Georgia, serif;
  font-size: 1.28rem;
  line-height: 1.25;
  margin: 2rem 0 .5rem;
}
.plataforma-corpo > p {
  font-size: .95rem;
  line-height: 1.75;
  color: var(--muted);
}
.plataforma-corpo .serv-exemplo { margin-top: 2rem; }
.plataforma-corpo .serv-exemplo h3 { margin-top: 0; }

@media (width <= 650px) {
  .plataforma-fundo { padding: 3rem 6vw; }
  .plataforma-corpo h3 { font-size: 1.12rem; margin-top: 1.6rem; }
  .plataforma-corpo > p { font-size: .9rem; line-height: 1.65; }
}

/* Atalhos por marketplace — leva o leitor da home para a pagina do canal onde
   ele vende. Antes essas tres paginas eram orfas: nenhum link do site
   apontava para elas. */
.plataforma-atalhos {
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding: 3.5rem 6vw;
}
.plataforma-atalhos-grade {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .9rem;
  max-width: 60rem;
  margin: 0 auto;
}
.plataforma-atalhos-grade a,
.plataforma-atalhos-grade span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 1rem;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: var(--raio-p);
  background: var(--cream);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .03em;
  transition: transform var(--transicao), box-shadow var(--transicao);
}
.plataforma-atalhos-grade a:hover {
  transform: translateY(-2px);
  box-shadow: var(--sombra-ouro);
  border-color: var(--accent);
}
.plataforma-atalhos-grade span {
  background: var(--dark);
  color: var(--cream);
  border-color: var(--dark);
}

@media (width <= 650px) {
  .plataforma-atalhos { padding: 2.4rem 6vw; }
  .plataforma-atalhos-grade { grid-template-columns: 1fr; gap: .6rem; }
}

/* ==========================================================================
   GKFD — briefing de conversão, 2026-08-27
   ========================================================================== */

.hero-preco, .mobile-preco {
  color: var(--ink);
  font-weight: 600;
  font-size: .85rem;
  margin: .8rem 0 0;
}
.hero-preco b, .mobile-preco b { color: var(--accent); }

.etapa1-bullets {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.etapa1-bullets li {
  font-size: .74rem;
  line-height: 1.4;
  color: #dfe8e5;
  padding-left: 1.1rem;
  position: relative;
}
.etapa1-bullets li::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--accent2);
  font-weight: 900;
}

.etapa-0 { display: flex; flex-direction: column; gap: .5rem; }
.etapa-0 .gk-mini-cta { margin-top: .3rem; }

.etapa1-economia:not(:empty) {
  color: #5fd9a4 !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.14);
  padding-bottom: .6rem;
  margin-bottom: .8rem !important;
}

.hero-urgencia {
  color: #9fb0ac;
  font-size: .66rem;
  line-height: 1.4;
  margin: .6rem 0 0;
}

.gk-garantia {
  max-width: 46rem;
  margin: 2.2rem auto 0;
  text-align: center;
  font-size: .82rem;
  color: var(--muted);
  line-height: 1.6;
  border-top: 1px solid var(--line);
  padding-top: 1.4rem;
}
.gk-garantia b { color: var(--ink); }

.migracao { background: var(--dark); color: var(--cream); padding: 4.5rem 6vw; }
.migracao .gold-label { color: var(--accent2); }
.migracao .section-title h2 { color: #fff; }
.migracao .section-title p { color: #c9d4d1; }
.migracao-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.2rem;
  max-width: 1180px;
  margin: 0 auto 2rem;
}
.migracao-passo {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--raio-p);
  padding: 1.4rem 1.2rem;
}
.migracao-passo b {
  display: block;
  font-family: Georgia, serif;
  font-size: 1.6rem;
  color: var(--accent2);
  margin-bottom: .5rem;
}
.migracao-passo h3 {
  font-size: .85rem;
  margin: 0 0 .4rem;
  color: #fff;
  line-height: 1.35;
}
.migracao-passo p {
  font-size: .74rem;
  color: #b8c4c0;
  line-height: 1.5;
  margin: 0;
}
.migracao-prazo {
  text-align: center;
  color: #c9d4d1;
  font-size: .8rem;
  margin: 0 0 1.6rem;
}
.migracao-cta {
  display: table;
  margin: 0 auto;
  background: linear-gradient(90deg, #c87909, #e4a63b);
  color: #fff;
  padding: 1rem 2rem;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .05em;
  border-radius: var(--raio-p);
}
@media (max-width: 900px) {
  .migracao-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .migracao-grid { grid-template-columns: 1fr; }
}

.equipe { background: #fff; padding: 4.5rem 6vw; border-bottom: 1px solid var(--line); }
.equipe-card {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 2.4rem;
  align-items: center;
  max-width: 900px;
  margin: 0 auto;
}
.equipe-card img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  border-radius: var(--raio);
  box-shadow: var(--sombra-2);
}
.equipe-cargo { color: var(--muted); font-size: .82rem; margin: .2rem 0 .9rem; }
.equipe-info p { font-size: .9rem; line-height: 1.6; margin: 0 0 .8rem; color: #444; }
.equipe-destaque {
  font-weight: 700;
  color: var(--ink);
  border-left: 3px solid var(--accent);
  padding-left: .9rem;
}
.equipe-cta {
  display: inline-block;
  margin-top: .6rem;
  background: linear-gradient(90deg, #c87909, #e4a63b);
  color: #fff;
  padding: .9rem 1.6rem;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .05em;
  border-radius: var(--raio-p);
}
@media (max-width: 650px) {
  .equipe-card { grid-template-columns: 1fr; text-align: center; }
  .equipe-card img { max-width: 220px; margin: 0 auto; }
  .equipe-destaque { border-left: 0; border-top: 3px solid var(--accent); padding-left: 0; padding-top: .7rem; }
}

/* Celular: a foto do herói fica ao lado do texto (não por cima — resolve
   o "efeito fantasma" documentado acima). A costura entre o painel branco
   e a foto era um corte reto; isto só suaviza essa borda, sem cobrir o
   rosto nem o corpo da pessoa na foto. */
@media (width <= 650px) {
  .mobile-hero-photo { position: relative !important; }
  .mobile-hero-photo::before {
    content: "";
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: 14%;
    background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));
    pointer-events: none;
    z-index: 1;
  }
}

/* ==========================================================================
   GKFD — barra do Sistema de Gestão (placeholder), 2026-08-28
   ========================================================================== */
.gestao-home {
  background: var(--dark); color: #fff;
  padding: 12px clamp(20px, 5vw, 90px);
  display: flex; align-items: center; gap: 22px; row-gap: 10px; flex-wrap: wrap;
  border-bottom: 1px solid var(--accent);
}
.gestao-home .gestao-tag {
  flex: 0 0 auto; color: var(--accent2);
  font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.gestao-numero {
  flex: 0 0 auto; display: flex; align-items: baseline; gap: 6px;
  background: rgba(232, 178, 58, .12); border: 1px solid var(--accent2);
  border-radius: 6px; padding: 3px 12px;
}
.gestao-numero strong { font-size: 21px; font-weight: 900; color: var(--accent2); line-height: 1; }
.gestao-numero span { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #d8d2c6; white-space: nowrap; }
.gestao-home-linha { flex: 1 1 260px; min-width: 260px; margin: 0; font-size: 13.5px; color: #d8d2c6; line-height: 1.4; }
.gestao-home-acoes { flex: 0 0 auto; display: flex; align-items: center; gap: 16px; margin-left: auto; }
.gestao-iniciar {
  background: linear-gradient(90deg, #c87909, #e4a63b); color: #fff;
  font-weight: 850; font-size: 12.5px; letter-spacing: .03em;
  padding: 9px 18px; border-radius: 4px; white-space: nowrap;
}
.gestao-login {
  border: 1px solid rgba(255, 255, 255, .3); color: #fff;
  font-weight: 700; font-size: 12.5px;
  padding: 9px 18px; border-radius: 4px; white-space: nowrap;
}
.gestao-home-ver { color: #e7c98a; font-size: 12.5px; font-weight: 700; text-decoration: underline; white-space: nowrap; }

.gestao-home-mobile { display: none; }

@media (width <= 650px) {
  .gestao-home { display: none; }
  .gestao-home-mobile {
    display: block; background: var(--dark); color: #fff;
    padding: 20px 20px 22px; text-align: center;
    border-bottom: 1px solid var(--accent);
  }
  .gestao-home-mobile .gestao-tag {
    color: var(--accent2); font-size: 11px; font-weight: 800;
    letter-spacing: .1em; text-transform: uppercase;
  }
  .gestao-numero-mobile { display: flex; flex-direction: column; align-items: center; margin: 8px 0 2px; }
  .gestao-numero-mobile strong { font-size: 34px; font-weight: 900; color: var(--accent2); line-height: 1; }
  .gestao-numero-mobile span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #d8d2c6; }
  .gestao-home-mobile-sub { margin: 4px 0 14px; font-size: 12px; color: #cfc8bd; }
  .gestao-home-mobile-acoes { display: flex; gap: 10px; justify-content: center; max-width: 360px; margin: 0 auto; }
  .gestao-home-mobile-acoes a { flex: 1; }
  .gestao-home-mobile .gestao-home-ver { display: inline-block; margin-top: 10px; }
}
