/* QUISO LAB — quisolab.com Page composition. Built on the design-system tokens (css/tokens.css) and component styles (css/ds.css). Three themes — escuro, amarelo, claro — switch through the `data-tema` attribute on (set pre-paint by the inline script in index.html, so no flash of the wrong theme). */ *{box-sizing:border-box} html{scroll-behavior:smooth} body{ margin:0; background:#1A1A1A; font-family:var(--font-body),system-ui,sans-serif; -webkit-font-smoothing:antialiased; } img{max-width:100%} ::selection{background:var(--qs-gold);color:var(--qs-ink)} a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, textarea:focus-visible{outline:2px solid var(--qs-gold);outline-offset:3px} .qs-skip{ position:absolute;left:12px;top:12px;z-index:100; background:var(--qs-gold);color:var(--qs-ink); padding:12px 20px;font-size:14px;text-decoration:none; clip-path:inset(50%); } .qs-skip:focus{clip-path:none} /* =========================================================== THEME TOKENS */ .qs-root{ --t-bg:#1A1A1A; --t-deep:#111111; --t-footer:#0A0A0A; --t-header:rgba(26,26,26,.82); --t-text:#fff; --t-text2:rgba(255,255,255,.85); --t-muted:rgba(255,255,255,.65); --t-soft:rgba(255,255,255,.5); --t-faint:rgba(255,255,255,.52); --t-hairline:rgba(255,255,255,.12); --t-hairline2:rgba(255,255,255,.3); --t-accent:#FFD100; /* grafismos: reguas, bordas, marcadores */ --t-accent-text:#FFD100; /* texto em acento */ --t-logo:#FFD100; /* floating hero glyphs */ --t-grid:rgba(255,255,255,.035); --t-mark:#fff; /* oversized hero watermark */ --t-logo-header:#fff; --t-logo-footer:#fff; background:var(--t-bg); color:var(--t-text); } [data-tema="amarelo"] .qs-root{ --t-bg:#FFD100;--t-deep:#F3C500;--t-footer:#E6BC00;--t-header:rgba(255,209,0,.85); --t-text:#1A1A1A;--t-text2:rgba(26,26,26,.85);--t-muted:rgba(26,26,26,.70); --t-soft:rgba(26,26,26,.68);--t-faint:rgba(26,26,26,.70); --t-hairline:rgba(26,26,26,.16);--t-hairline2:rgba(26,26,26,.35); --t-accent:#1A1A1A;--t-accent-text:#1A1A1A;--t-logo:#1A1A1A;--t-grid:rgba(26,26,26,.05); --t-mark:#1A1A1A;--t-logo-header:#1A1A1A;--t-logo-footer:#1A1A1A; } [data-tema="claro"] .qs-root{ --t-bg:#FFFFFF;--t-deep:#FAFAFA;--t-footer:#F5F5F3;--t-header:rgba(26,26,26,.88); --t-text:#1A1A1A;--t-text2:rgba(26,26,26,.85);--t-muted:rgba(26,26,26,.62); --t-soft:rgba(26,26,26,.64);--t-faint:rgba(26,26,26,.66); --t-hairline:rgba(26,26,26,.12);--t-hairline2:rgba(26,26,26,.3); --t-accent:#E6BC00;--t-accent-text:#1A1A1A;--t-logo:#1A1A1A;--t-grid:rgba(26,26,26,.045); --t-mark:#1A1A1A;--t-logo-header:#fff;--t-logo-footer:#1A1A1A; } /* `.qs-t` re-points the design-system component tokens at the active theme so Buttons/Kickers/Rules invert correctly inside themed sections. */ [data-tema="amarelo"] .qs-t{--qs-gold:#1A1A1A;--qs-gold-hi:#333333;--qs-ink:#FFD100;--qs-ink-900:#111111} [data-tema="claro"] .qs-t{--qs-gold:#E6BC00} /* The header stays dark in the light theme — it needs its own token island. */ [data-tema="claro"] .qs-header{ --t-header:rgba(26,26,26,.88);--t-bg:#1A1A1A;--t-text:#fff;--t-text2:rgba(255,255,255,.85); --t-muted:rgba(255,255,255,.65);--t-hairline:rgba(255,255,255,.12);--t-hairline2:rgba(255,255,255,.3); --t-accent:#FFD100;--t-accent-text:#FFD100;--qs-gold:#FFD100;--qs-gold-hi:#FFE066;--qs-ink:#1A1A1A; } .qs-root .qs-btn{border-radius:var(--radius-pill)} /* Palavra em destaque dentro de um titulo. */ .qs-accent{color:var(--t-accent-text)} /* O kicker dourado herda --qs-gold; no tema claro isso cai sobre #FAFAFA. */ [data-tema="claro"] .qs-kicker--gold{color:var(--t-accent-text)} /* ================================================================= LAYOUT */ .qs-pad{max-width:1200px;margin:0 auto;padding:96px 40px} section[id],#topo{scroll-margin-top:80px} .qs-h1{ font-family:var(--font-display);font-weight:var(--fw-medium); font-size:72px;line-height:1.08;letter-spacing:.01em;text-transform:uppercase; color:var(--t-text);max-width:920px;margin:0; } .qs-h2{ font-family:var(--font-display);font-weight:var(--fw-medium); font-size:44px;line-height:1.15;text-transform:uppercase;margin:0; } .qs-lede{ font-family:var(--font-display);font-weight:var(--fw-light); font-size:24px;line-height:1.5;color:var(--t-muted);max-width:640px;margin:0; } /* ================================================================= HEADER */ .qs-header{ position:sticky;top:0;z-index:40; background:var(--t-header); backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--t-hairline); } .qs-header-bar{ max-width:1200px;margin:0 auto;padding:0 40px;height:72px; display:flex;align-items:center;justify-content:space-between; } .qs-logo{display:flex;align-items:center;text-decoration:none} .qs-logo-mark{ display:block;width:58px;height:34px; background:var(--t-logo-header); -webkit-mask:url("../assets/logos/logo.svg") left center/contain no-repeat; mask:url("../assets/logos/logo.svg") left center/contain no-repeat; } .qs-header-right{display:flex;align-items:center;gap:14px} .qs-nav-links{display:flex;align-items:center;gap:30px} .qs-nav-links a:not(.qs-btn){font-size:14px;color:var(--t-muted);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)} .qs-nav-links a:not(.qs-btn):hover{color:var(--t-text)} .qs-theme-toggle{ width:34px;height:34px;border-radius:var(--radius-pill); border:1px solid var(--t-hairline2);background:transparent;cursor:pointer; display:flex;align-items:center;justify-content:center;padding:0; transition:border-color var(--dur-fast) var(--ease-standard); } .qs-theme-toggle:hover{border-color:var(--t-text)} .qs-theme-toggle > span{ width:14px;height:14px;border-radius:var(--radius-pill); border:1px solid var(--t-hairline2);display:block; } /* The swatch previews the NEXT theme in the cycle. */ [data-tema="escuro"] .qs-theme-toggle > span{background:#FFD100} [data-tema="amarelo"] .qs-theme-toggle > span{background:#FFFFFF} [data-tema="claro"] .qs-theme-toggle > span{background:#1A1A1A} .qs-burger{ display:none;flex-direction:column;align-items:center;gap:4px; background:none;border:none;cursor:pointer;padding:10px 14px; } .qs-burger:hover{opacity:.7} .qs-burger > span{width:5px;height:5px;border-radius:var(--radius-pill);background:var(--t-text);display:block} .qs-burger > span:nth-child(2){background:var(--t-accent)} .qs-mobile-nav{ display:none;flex-direction:column;gap:2px; padding:8px 24px 20px;border-top:1px solid var(--t-hairline); } .qs-mobile-nav.is-open{display:flex} .qs-mobile-nav a{font-size:16px;color:var(--t-text2);text-decoration:none;padding:12px 0} .qs-mobile-nav a:last-child{color:var(--t-accent-text)} /* =================================================================== HERO */ .qs-hero{position:relative;overflow:hidden} .qs-hero-grid{ position:absolute;inset:0;pointer-events:none; background-image:linear-gradient(var(--t-grid) 1px,transparent 1px), linear-gradient(90deg,var(--t-grid) 1px,transparent 1px); background-size:80px 80px; -webkit-mask-image:radial-gradient(ellipse 65% 62% at 30% 50%,#000,transparent 78%); mask-image:radial-gradient(ellipse 65% 62% at 30% 50%,#000,transparent 78%); animation:qsGridDrift 32s linear infinite; } .qs-hero-cells{position:absolute;inset:0;overflow:hidden;pointer-events:none} .qs-hero-cells > i{ position:absolute;display:block; background:var(--t-logo); -webkit-mask:url("../assets/logos/icone.svg") center/contain no-repeat; mask:url("../assets/logos/icone.svg") center/contain no-repeat; translate:var(--fx,0px) var(--fy,0px); transition:translate .9s var(--ease-out); } .qs-hero-cells > i:nth-child(1){left:960px;top:240px;width:120px;height:120px;--o:.2;opacity:.2;animation:qsCellHop 12s ease-in-out infinite,qsCellBlink 6s ease-in-out infinite} .qs-hero-cells > i:nth-child(2){left:640px;top:80px;width:96px;height:96px;--o:.13;opacity:.13;animation:qsCellHop 16s ease-in-out infinite reverse,qsCellBlink 7s ease-in-out -2s infinite} .qs-hero-cells > i:nth-child(3){left:1200px;top:400px;width:140px;height:140px;--o:.1;opacity:.1;animation:qsCellHop 18s ease-in-out -7s infinite,qsCellBlink 9s ease-in-out -4s infinite} .qs-hero-cells > i:nth-child(4){left:480px;top:480px;width:84px;height:84px;--o:.1;opacity:.1;animation:qsCellHop 20s ease-in-out -11s infinite reverse,qsCellBlink 8s ease-in-out -1s infinite} .qs-hero-cells > i:nth-child(5){left:1120px;top:80px;width:108px;height:108px;--o:.09;opacity:.09;animation:qsCellHop 14s ease-in-out -5s infinite,qsCellBlink 10s ease-in-out -6s infinite} .qs-hero-mark{ position:absolute;right:-140px;top:50%;transform:translateY(-50%); width:620px;height:420px;opacity:.05;pointer-events:none; background:var(--t-mark); -webkit-mask:url("../assets/logos/icone.svg") center/contain no-repeat; mask:url("../assets/logos/icone.svg") center/contain no-repeat; animation:qsPulse 9s ease-in-out infinite; } .qs-hero-pad{ position:relative;max-width:1200px;margin:0 auto;padding:120px 40px 100px; display:flex;flex-direction:column;gap:32px;align-items:flex-start; } .qs-hero-actions{display:flex;gap:14px;margin-top:8px;flex-wrap:wrap} /* Hairline button — theme-aware, inverts on hover. */ .qs-btn--line{ display:inline-flex;align-items:center;justify-content:center; padding:15px 30px;font-family:var(--font-body);font-weight:var(--fw-medium); font-size:16px;letter-spacing:.01em;line-height:1; color:var(--t-text);background:transparent; border:1px solid var(--t-hairline2);border-radius:var(--radius-pill); cursor:pointer;text-decoration:none; transition:background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard); } .qs-btn--line:hover{background:var(--t-text);color:var(--t-bg);border-color:var(--t-text)} .qs-hero-facts{display:flex;gap:40px;margin-top:36px;flex-wrap:wrap} .qs-fact{border-left:2px solid var(--t-accent);padding-left:16px;display:flex;flex-direction:column;gap:5px} .qs-fact > b{ font-family:var(--font-head);font-weight:400;font-size:10px; letter-spacing:.18em;text-transform:uppercase;color:var(--t-soft); } .qs-fact > span{font-size:16px;color:var(--t-text2)} /* ================================================================ MARQUEE */ .qs-marquee-bar{ border-top:1px solid var(--t-hairline);border-bottom:1px solid var(--t-hairline); overflow:hidden;padding:16px 0; } .qs-marquee{display:flex;gap:56px;width:max-content;animation:qsMarquee 36s linear infinite} .qs-marquee:hover{animation-play-state:paused} .qs-marquee span{ font-family:var(--font-head);font-size:11px;letter-spacing:.26em; text-transform:uppercase;color:var(--t-muted);white-space:nowrap; } /* =============================================================== SERVIÇOS */ .qs-sec-white{background:#fff;color:#1A1A1A} .qs-sec-alt{background:#FAFAFA;color:#1A1A1A} .qs-sec-gold{background:#FFD100;color:#1A1A1A} .qs-sec-head{ display:flex;justify-content:space-between;align-items:flex-end; margin-bottom:48px;gap:40px;flex-wrap:wrap; } .qs-sec-head > div{display:flex;flex-direction:column;gap:18px} .qs-right{ font-family:var(--font-display);font-weight:var(--fw-light);font-size:20px; color:rgba(26,26,26,.62);max-width:380px;text-align:right;margin:0; } .qs-grid-svc{ display:grid;grid-template-columns:1fr 1.1fr;gap:2px; background:rgba(26,26,26,.1);border:1px solid rgba(26,26,26,.1); } .qs-svc-tabs{display:flex;flex-direction:column;background:rgba(26,26,26,.1);gap:1px} .qs-svc-tab{ all:unset;box-sizing:border-box;cursor:pointer;flex:1; display:flex;align-items:center;gap:18px;padding:22px 24px; background:#fff;transition:background var(--dur-fast) var(--ease-standard); } .qs-svc-tab:hover{background:#F5F5F3} .qs-svc-tab .n{font-family:var(--font-head);font-size:15px;color:#D8D8D6} .qs-svc-tab .t{font-family:var(--font-body);font-size:19px;color:#1A1A1A} .qs-svc-tab .a{margin-left:auto;font-size:18px;color:transparent} .qs-svc-tab[aria-selected="true"]{background:#1A1A1A} .qs-svc-tab[aria-selected="true"]:hover{background:#111} .qs-svc-tab[aria-selected="true"] .n{color:#FFD100} .qs-svc-tab[aria-selected="true"] .t{color:#fff} .qs-svc-tab[aria-selected="true"] .a{color:#FFD100} .qs-svc-panels{background:#fff} .qs-svc-panel{ padding:44px 40px;display:flex;flex-direction:column;gap:22px; justify-content:center;height:100%; } .qs-svc-panel .num{font-family:var(--font-head);font-size:40px;color:rgba(26,26,26,.1)} .qs-svc-panel h3{ font-family:var(--font-display);font-weight:var(--fw-medium);font-size:30px; text-transform:uppercase;margin:0;line-height:1.2; } .qs-svc-panel p{font-size:18px;line-height:1.6;color:rgba(26,26,26,.7);margin:0} .qs-tags{display:flex;gap:10px;flex-wrap:wrap} .qs-svc-panel .qs-tags{margin-top:4px} .qs-svc-panel .qs-tag{border-color:rgba(26,26,26,.15);color:rgba(26,26,26,.75)} /* =============================================================== PROCESSO */ .qs-grid-split{display:grid;grid-template-columns:1fr 1.4fr;gap:64px;align-items:start} .qs-sticky{position:sticky;top:104px;display:flex;flex-direction:column;gap:20px} .qs-sticky > p{ font-family:var(--font-display);font-weight:var(--fw-light);font-size:19px; line-height:1.55;color:var(--t-soft);margin:0;max-width:380px; } .qs-steps{display:flex;flex-direction:column;border-bottom:1px solid var(--t-hairline)} .qs-step{ display:grid;grid-template-columns:88px 1fr;column-gap:24px;row-gap:8px; padding:30px 0;border-top:1px solid var(--t-hairline);align-items:start; } .qs-step > .n{font-family:var(--font-head);font-size:28px;color:var(--t-accent-text);grid-row:1 / span 2} .qs-step h3{ font-family:var(--font-display);font-weight:var(--fw-medium);font-size:22px; text-transform:uppercase;margin:0;color:var(--t-text); } .qs-step p{font-size:15px;line-height:1.55;color:var(--t-soft);margin:0} /* ================================================================== SOBRE */ .qs-sobre .qs-pad{padding:110px 40px 96px;display:flex;flex-direction:column;gap:64px} .qs-manifesto{ font-family:var(--font-display);font-weight:var(--fw-medium);font-size:68px; line-height:1.12;color:#1A1A1A;margin:0;max-width:1060px; } .qs-manifesto .up{text-transform:uppercase} .qs-manifesto .dim{font-weight:var(--fw-light);color:rgba(26,26,26,.52)} .qs-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start} .qs-grid-2 > *,.qs-grid-split > *,.qs-grid-svc > *{min-width:0} .qs-sobre-copy{display:flex;flex-direction:column;gap:28px} .qs-sobre-copy > p{font-size:20px;line-height:1.65;color:rgba(26,26,26,.7);margin:0} .qs-sobre-copy .qs-tag{border-color:rgba(26,26,26,.25)} .qs-figure{margin:0;width:100%;aspect-ratio:4 / 3;min-height:280px} .qs-figure img{ width:100%;height:100%;object-fit:cover; border-radius:var(--radius-sm);display:block; } /* ============================================================= RESULTADOS */ .qs-eyebrow{ font-family:var(--font-head);font-size:11px;letter-spacing:.2em; text-transform:uppercase;color:var(--t-soft); } .qs-tag--dark{border-color:var(--t-hairline2);color:var(--t-text2);padding:7px 16px} .qs-quote{ margin:0;border-left:2px solid var(--t-accent);padding-left:28px; display:flex;flex-direction:column;gap:20px; } .qs-quote blockquote{ margin:0;font-family:var(--font-display);font-weight:var(--fw-light); font-size:24px;line-height:1.5;color:var(--t-text); } .qs-quote figcaption{display:flex;flex-direction:column;gap:3px} .qs-quote figcaption > span:first-child{font-size:15px;color:var(--t-text2)} .qs-quote figcaption > span:last-child{ font-family:var(--font-head);font-size:10px;letter-spacing:.18em; text-transform:uppercase;color:var(--t-faint); } /* ==================================================================== FAQ */ details.qs-faq{border-top:1px solid rgba(26,26,26,.1)} details.qs-faq:last-child{border-bottom:1px solid rgba(26,26,26,.1)} details.qs-faq > summary{ display:flex;align-items:baseline;gap:18px;padding:24px 0; font-size:18px;color:rgba(26,26,26,.85); list-style:none;cursor:pointer;transition:color var(--dur-fast) var(--ease-standard); } details.qs-faq > summary:hover, details.qs-faq[open] > summary{color:#1A1A1A} details.qs-faq > summary::-webkit-details-marker{display:none} details.qs-faq > summary .qs-plus{font-family:var(--font-head);font-size:14px;color:#E6BC00;width:20px;flex-shrink:0} details.qs-faq > summary .qs-plus::after{content:'+'} details.qs-faq[open] > summary .qs-plus::after{content:'\2212'} details.qs-faq > p{margin:0 0 24px 38px;font-size:15px;line-height:1.65;color:rgba(26,26,26,.6)} /* ================================================================ CONTATO */ .qs-contato .qs-pad{display:grid;grid-template-columns:1fr 1fr;gap:80px} .qs-contact-copy{display:flex;flex-direction:column;gap:22px} .qs-contact-copy > p{font-size:18px;line-height:1.6;color:rgba(26,26,26,.7);margin:0;max-width:400px} .qs-contact-list{display:flex;flex-direction:column;gap:16px;margin-top:8px} .qs-contact-item{border-left:2px solid #FFD100;padding-left:18px;display:flex;flex-direction:column;gap:3px} .qs-contact-item > b{ font-family:var(--font-head);font-weight:400;font-size:10px;letter-spacing:.2em; text-transform:uppercase;color:rgba(26,26,26,.62); } .qs-contact-item > a{font-size:17px;color:#1A1A1A;text-decoration:none} .qs-contact-item > a:hover{text-decoration:underline} .qs-form-card{background:#F5F5F3;padding:40px;border-radius:var(--radius-sm)} .qs-form{display:flex;flex-direction:column;gap:18px} .qs-form .qs-note{font-size:13px;color:rgba(26,26,26,.62);margin:0} .qs-form-erro{font-size:14px;line-height:1.5;color:var(--qs-danger);margin:0} .qs-form-done{ display:flex;flex-direction:column;gap:16px;align-items:flex-start; min-height:360px;justify-content:center; } .qs-form-done .check{ width:48px;height:48px;border-radius:var(--radius-pill);background:#FFD100; display:flex;align-items:center;justify-content:center;font-size:24px;color:#1A1A1A; } .qs-form-done h3{ font-family:var(--font-display);font-weight:var(--fw-medium);font-size:28px; text-transform:uppercase;margin:0; } .qs-form-done p{font-size:16px;color:rgba(26,26,26,.7);margin:0} .qs-form-done a{color:#1A1A1A;text-decoration:underline} [hidden]{display:none !important} /* ============================================================== CTA FINAL */ .qs-cta{background:var(--t-bg);border-top:1px solid var(--t-hairline)} .qs-cta .qs-pad{ padding:88px 40px;display:flex;align-items:center; justify-content:space-between;gap:40px;flex-wrap:wrap; } .qs-cta-copy{display:flex;flex-direction:column;gap:16px;max-width:640px} .qs-cta-copy p{font-size:18px;line-height:1.6;color:var(--t-muted);margin:0} /* ================================================================= FOOTER */ .qs-footer{background:var(--t-footer);border-top:1px solid var(--t-hairline)} .qs-footer-grid{ max-width:1200px;margin:0 auto;padding:72px 40px 0; display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px; } .qs-footer-brand{display:flex;flex-direction:column;gap:20px;align-items:flex-start} .qs-footer-brand .qs-logo-mark{width:75px;height:44px;background:var(--t-logo-footer)} .qs-footer-brand p{font-size:14px;line-height:1.6;color:var(--t-faint);margin:0;max-width:280px} .qs-footer-col{display:flex;flex-direction:column;gap:14px} .qs-footer-col > b{ font-family:var(--font-head);font-weight:400;font-size:10px;letter-spacing:.2em; text-transform:uppercase;color:var(--t-faint); } .qs-footer-col a{font-size:14px;color:var(--t-muted);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)} .qs-footer-col a:hover{color:var(--t-text)} .qs-footer-col > span{font-size:14px;color:var(--t-faint)} .qs-footer-base{ max-width:1200px;margin:56px auto 0;padding:28px 40px; display:flex;align-items:center;justify-content:space-between;gap:16px; flex-wrap:wrap;border-top:1px solid var(--t-hairline); } .qs-footer-base p{font-size:12px;color:var(--t-faint);margin:0} .qs-footer-base > span{ font-family:var(--font-head);font-size:9px;letter-spacing:.22em; text-transform:uppercase;color:var(--t-faint); } /* =============================================================== WHATSAPP */ .qs-wa{ position:fixed;right:28px;bottom:28px;z-index:50; width:52px;height:52px;border-radius:var(--radius-pill);background:#FFD100; display:flex;align-items:center;justify-content:center; box-shadow:0 6px 20px rgba(0,0,0,.35);text-decoration:none; transition:background var(--dur-fast) var(--ease-standard); } .qs-wa:hover{background:#FFE066} /* ================================================================= MOTION */ @keyframes qsMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}} @keyframes qsPulse{0%,100%{opacity:.05}50%{opacity:.09}} @keyframes qsGridDrift{from{background-position:0 0,0 0}to{background-position:80px 80px,80px 80px}} @keyframes qsCellHop{0%,100%{transform:translate(0,0)}25%{transform:translate(80px,0)}50%{transform:translate(80px,-80px)}75%{transform:translate(0,-80px)}} @keyframes qsCellBlink{0%,100%{opacity:var(--o)}50%{opacity:calc(var(--o)*2.4)}} .js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)} .js [data-reveal].is-visible{opacity:1;transform:none} /* ============================================================= RESPONSIVE */ @media (max-width:900px){ .qs-nav-links{display:none} .qs-burger{display:flex} .qs-h1{font-size:44px} .qs-manifesto{font-size:36px} .qs-hero-pad{padding:88px 24px 72px} .qs-pad,.qs-sobre .qs-pad,.qs-cta .qs-pad{padding:64px 24px} .qs-header-bar{padding:0 24px} .qs-h2{font-size:32px} .qs-grid-2,.qs-grid-split,.qs-contato .qs-pad{grid-template-columns:1fr;gap:40px} .qs-grid-svc{grid-template-columns:1fr} .qs-right{text-align:left;max-width:none} .qs-sticky{position:static} .qs-marquee{gap:32px} .qs-marquee span{font-size:10px} .qs-figure{min-height:0} .qs-hero-cells{display:none} .qs-footer-grid{grid-template-columns:1fr 1fr;padding:64px 24px 0} .qs-footer-base{padding:28px 24px} } @media (max-width:560px){ .qs-footer-grid{grid-template-columns:1fr} .qs-hero-mark{width:420px;right:-180px} .qs-form-card{padding:28px 22px} .qs-svc-panel{padding:32px 24px} .qs-hero-facts{gap:24px} } @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .js [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important} .qs-marquee,.qs-hero-grid,.qs-hero-mark,.qs-hero-cells > i{animation:none !important} .qs-hero-cells > i{transition:none !important} }