/* Gerado por scripts/build-css-bundle.mjs a partir de index.html. Não editar. */ /* lib/bootstrap/bootstrap.purged.min.css */ /*! * Bootstrap v5.2.3 (https://getbootstrap.com/) * Copyright 2011-2022 The Bootstrap Authors * Copyright 2011-2022 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */:root{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-body-color-rgb:33,37,41;--bs-body-bg-rgb:255,255,255;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-bg:#fff;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-2xl:2rem;--bs-border-radius-pill:50rem;--bs-link-color:#0d6efd;--bs-link-hover-color:#0a58ca;--bs-code-color:#d63384;--bs-highlight-bg:#fff3cd}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;border:0;border-top:1px solid;opacity:.25}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}.h1,h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.h1,h1{font-size:2.5rem}}.h2,h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.h2,h2{font-size:2rem}}.h3,h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.h3,h3{font-size:1.75rem}}.h4,h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){.h4,h4{font-size:1.5rem}}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}b,strong{font-weight:bolder}.small,small{font-size:.875em}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:var(--bs-link-color);text-decoration:underline}a:hover{color:var(--bs-link-hover-color)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,pre{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6c757d;text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}iframe{border:0}summary{display:list-item;cursor:pointer}[hidden]{display:none!important}.lead{font-size:1.25rem;font-weight:300}.figure{display:inline-block}.container{--bs-gutter-x:1.5rem;--bs-gutter-y:0;width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}@media (min-width:1400px){.container{max-width:1320px}}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y)}.col{flex:1 0 0%}@media (min-width:992px){.col-lg-4{flex:0 0 auto;width:33.33333333%}}.table{--bs-table-color:var(--bs-body-color);--bs-table-bg:transparent;--bs-table-border-color:var(--bs-border-color);--bs-table-accent-bg:transparent;--bs-table-striped-color:var(--bs-body-color);--bs-table-striped-bg:rgba(0, 0, 0, 0.05);--bs-table-active-color:var(--bs-body-color);--bs-table-active-bg:rgba(0, 0, 0, 0.1);--bs-table-hover-color:var(--bs-body-color);--bs-table-hover-bg:rgba(0, 0, 0, 0.075);width:100%;margin-bottom:1rem;color:var(--bs-table-color);vertical-align:top;border-color:var(--bs-table-border-color)}.table>:not(caption)>*>*{padding:.5rem .5rem;background-color:var(--bs-table-bg);border-bottom-width:1px;box-shadow:inset 0 0 0 9999px var(--bs-table-accent-bg)}.table>tbody{vertical-align:inherit}.table>thead{vertical-align:bottom}.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.375rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control{transition:none}}.form-control[type=file]{overflow:hidden}.form-control[type=file]:not(:disabled):not([readonly]){cursor:pointer}.form-control:focus{color:#212529;background-color:#fff;border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-control::-webkit-date-and-time-value{height:1.5em}.form-control::-moz-placeholder{color:#6c757d;opacity:1}.form-control::placeholder{color:#6c757d;opacity:1}.form-control:disabled{background-color:#e9ecef;opacity:1}.form-control::-webkit-file-upload-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:#212529;background-color:#e9ecef;pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:1px;border-radius:0;-webkit-transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-control::file-selector-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:#212529;background-color:#e9ecef;pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:1px;border-radius:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control::-webkit-file-upload-button{-webkit-transition:none;transition:none}.form-control::file-selector-button{transition:none}}.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button{background-color:#dde0e3}.form-control:hover:not(:disabled):not([readonly])::file-selector-button{background-color:#dde0e3}textarea.form-control{min-height:calc(1.5em + .75rem + 2px)}.form-check{display:block;min-height:1.5rem;padding-left:1.5em;margin-bottom:.125rem}.form-check .form-check-input{float:left;margin-left:-1.5em}.form-check-input{width:1em;height:1em;margin-top:.25em;vertical-align:top;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:contain;border:1px solid rgba(0,0,0,.25);-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-print-color-adjust:exact;color-adjust:exact;print-color-adjust:exact}.form-check-input[type=checkbox]{border-radius:.25em}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-check-input:checked{background-color:#0d6efd;border-color:#0d6efd}.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-input[type=checkbox]:indeterminate{background-color:#0d6efd;border-color:#0d6efd;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.form-control.is-valid,.was-validated .form-control:valid{border-color:#198754;padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-valid:focus,.was-validated .form-control:valid:focus{border-color:#198754;box-shadow:0 0 0 .25rem rgba(25,135,84,.25)}.was-validated textarea.form-control:valid,textarea.form-control.is-valid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-check-input.is-valid,.was-validated .form-check-input:valid{border-color:#198754}.form-check-input.is-valid:checked,.was-validated .form-check-input:valid:checked{background-color:#198754}.form-check-input.is-valid:focus,.was-validated .form-check-input:valid:focus{box-shadow:0 0 0 .25rem rgba(25,135,84,.25)}.form-control.is-invalid,.was-validated .form-control:invalid{border-color:#dc3545;padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-invalid:focus,.was-validated .form-control:invalid:focus{border-color:#dc3545;box-shadow:0 0 0 .25rem rgba(220,53,69,.25)}.was-validated textarea.form-control:invalid,textarea.form-control.is-invalid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-check-input.is-invalid,.was-validated .form-check-input:invalid{border-color:#dc3545}.form-check-input.is-invalid:checked,.was-validated .form-check-input:invalid:checked{background-color:#dc3545}.form-check-input.is-invalid:focus,.was-validated .form-check-input:invalid:focus{box-shadow:0 0 0 .25rem rgba(220,53,69,.25)}.btn{--bs-btn-padding-x:0.75rem;--bs-btn-padding-y:0.375rem;--bs-btn-font-family: ;--bs-btn-font-size:1rem;--bs-btn-font-weight:400;--bs-btn-line-height:1.5;--bs-btn-color:#212529;--bs-btn-bg:transparent;--bs-btn-border-width:1px;--bs-btn-border-color:transparent;--bs-btn-border-radius:0.375rem;--bs-btn-hover-border-color:transparent;--bs-btn-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity:0.65;--bs-btn-focus-box-shadow:0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)}.btn:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn.active,.btn.show,.btn:first-child:active,:not(.btn-check)+.btn:active{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)}.btn.active:focus-visible,.btn.show:focus-visible,.btn:first-child:active:focus-visible,:not(.btn-check)+.btn:active:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)}.btn.disabled,.btn:disabled,fieldset:disabled .btn{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)}.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0b5ed7;--bs-btn-hover-border-color:#0a58ca;--bs-btn-focus-shadow-rgb:49,132,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0a58ca;--bs-btn-active-border-color:#0a53be;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#0d6efd;--bs-btn-disabled-border-color:#0d6efd}.btn-secondary{--bs-btn-color:#fff;--bs-btn-bg:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#5c636a;--bs-btn-hover-border-color:#565e64;--bs-btn-focus-shadow-rgb:130,138,145;--bs-btn-active-color:#fff;--bs-btn-active-bg:#565e64;--bs-btn-active-border-color:#51585e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#6c757d;--bs-btn-disabled-border-color:#6c757d}.btn-dark{--bs-btn-color:#fff;--bs-btn-bg:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#424649;--bs-btn-hover-border-color:#373b3e;--bs-btn-focus-shadow-rgb:66,70,73;--bs-btn-active-color:#fff;--bs-btn-active-bg:#4d5154;--bs-btn-active-border-color:#373b3e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#212529;--bs-btn-disabled-border-color:#212529}.btn-sm{--bs-btn-padding-y:0.25rem;--bs-btn-padding-x:0.5rem;--bs-btn-font-size:0.875rem;--bs-btn-border-radius:0.25rem}.fade{transition:opacity .15s linear}@media (prefers-reduced-motion:reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .35s ease}@media (prefers-reduced-motion:reduce){.collapsing{transition:none}}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s ease}@media (prefers-reduced-motion:reduce){.collapsing.collapse-horizontal{transition:none}}.dropdown,.dropdown-center,.dropend,.dropstart,.dropup,.dropup-center{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{--bs-dropdown-zindex:1000;--bs-dropdown-min-width:10rem;--bs-dropdown-padding-x:0;--bs-dropdown-padding-y:0.5rem;--bs-dropdown-spacer:0.125rem;--bs-dropdown-font-size:1rem;--bs-dropdown-color:#212529;--bs-dropdown-bg:#fff;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-border-radius:0.375rem;--bs-dropdown-border-width:1px;--bs-dropdown-inner-border-radius:calc(0.375rem - 1px);--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y:0.5rem;--bs-dropdown-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-dropdown-link-color:#212529;--bs-dropdown-link-hover-color:#1e2125;--bs-dropdown-link-hover-bg:#e9ecef;--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-item-padding-x:1rem;--bs-dropdown-item-padding-y:0.25rem;--bs-dropdown-header-color:#6c757d;--bs-dropdown-header-padding-x:1rem;--bs-dropdown-header-padding-y:0.5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}.dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}.dropdown-menu-start{--bs-position:start}.dropdown-menu-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-end{--bs-position:end}.dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media (min-width:576px){.dropdown-menu-sm-start{--bs-position:start}.dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-sm-end{--bs-position:end}.dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media (min-width:768px){.dropdown-menu-md-start{--bs-position:start}.dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-md-end{--bs-position:end}.dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media (min-width:992px){.dropdown-menu-lg-start{--bs-position:start}.dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-lg-end{--bs-position:end}.dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1200px){.dropdown-menu-xl-start{--bs-position:start}.dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xl-end{--bs-position:end}.dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1400px){.dropdown-menu-xxl-start{--bs-position:start}.dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xxl-end{--bs-position:end}.dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}.dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}.dropup .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}.dropend .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{vertical-align:0}.dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}.dropstart .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:""}.dropstart .dropdown-toggle::after{display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::before{vertical-align:0}.dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}.dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0}.dropdown-item:focus,.dropdown-item:hover{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}.dropdown-item.active,.dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}.dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}.dropdown-menu-dark{--bs-dropdown-color:#dee2e6;--bs-dropdown-bg:#343a40;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color:#dee2e6;--bs-dropdown-link-hover-color:#fff;--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg:rgba(255, 255, 255, 0.15);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-header-color:#adb5bd}.dropdown-toggle-split{padding-right:.5625rem;padding-left:.5625rem}.dropdown-toggle-split::after,.dropend .dropdown-toggle-split::after,.dropup .dropdown-toggle-split::after{margin-left:0}.dropstart .dropdown-toggle-split::before{margin-right:0}.btn-sm+.dropdown-toggle-split{padding-right:.375rem;padding-left:.375rem}.nav{--bs-nav-link-padding-x:1rem;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-link-color);--bs-nav-link-hover-color:var(--bs-link-hover-color);--bs-nav-link-disabled-color:#6c757d;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion:reduce){.nav-link{transition:none}}.nav-link:focus,.nav-link:hover{color:var(--bs-nav-link-hover-color)}.nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}.navbar{--bs-navbar-padding-x:0;--bs-navbar-padding-y:0.5rem;--bs-navbar-color:rgba(0, 0, 0, 0.55);--bs-navbar-hover-color:rgba(0, 0, 0, 0.7);--bs-navbar-disabled-color:rgba(0, 0, 0, 0.3);--bs-navbar-active-color:rgba(0, 0, 0, 0.9);--bs-navbar-brand-padding-y:0.3125rem;--bs-navbar-brand-margin-end:1rem;--bs-navbar-brand-font-size:1.25rem;--bs-navbar-brand-color:rgba(0, 0, 0, 0.9);--bs-navbar-brand-hover-color:rgba(0, 0, 0, 0.9);--bs-navbar-nav-link-padding-x:0.5rem;--bs-navbar-toggler-padding-y:0.25rem;--bs-navbar-toggler-padding-x:0.75rem;--bs-navbar-toggler-font-size:1.25rem;--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");--bs-navbar-toggler-border-color:rgba(0, 0, 0, 0.1);--bs-navbar-toggler-border-radius:0.375rem;--bs-navbar-toggler-focus-width:0.25rem;--bs-navbar-toggler-transition:box-shadow 0.15s ease-in-out;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)}.navbar>.container{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.navbar-nav{--bs-nav-link-padding-x:0;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-navbar-color);--bs-nav-link-hover-color:var(--bs-navbar-hover-color);--bs-nav-link-disabled-color:var(--bs-navbar-disabled-color);display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.navbar-nav .nav-link.active,.navbar-nav .show>.nav-link{color:var(--bs-navbar-active-color)}.navbar-nav .dropdown-menu{position:static}.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}.navbar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-toggler:hover{text-decoration:none}.navbar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.card{--bs-card-spacer-y:1rem;--bs-card-spacer-x:1rem;--bs-card-title-spacer-y:0.5rem;--bs-card-border-width:1px;--bs-card-border-color:var(--bs-border-color-translucent);--bs-card-border-radius:0.375rem;--bs-card-box-shadow: ;--bs-card-inner-border-radius:calc(0.375rem - 1px);--bs-card-cap-padding-y:0.5rem;--bs-card-cap-padding-x:1rem;--bs-card-cap-bg:rgba(0, 0, 0, 0.03);--bs-card-cap-color: ;--bs-card-height: ;--bs-card-color: ;--bs-card-bg:#fff;--bs-card-img-overlay-padding:1rem;--bs-card-group-margin:0.75rem;position:relative;display:flex;flex-direction:column;min-width:0;height:var(--bs-card-height);word-wrap:break-word;background-color:var(--bs-card-bg);background-clip:border-box;border:var(--bs-card-border-width) solid var(--bs-card-border-color);border-radius:var(--bs-card-border-radius)}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.accordion{--bs-accordion-color:#212529;--bs-accordion-bg:#fff;--bs-accordion-transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;--bs-accordion-border-color:var(--bs-border-color);--bs-accordion-border-width:1px;--bs-accordion-border-radius:0.375rem;--bs-accordion-inner-border-radius:calc(0.375rem - 1px);--bs-accordion-btn-padding-x:1.25rem;--bs-accordion-btn-padding-y:1rem;--bs-accordion-btn-color:#212529;--bs-accordion-btn-bg:var(--bs-accordion-bg);--bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");--bs-accordion-btn-icon-width:1.25rem;--bs-accordion-btn-icon-transform:rotate(-180deg);--bs-accordion-btn-icon-transition:transform 0.2s ease-in-out;--bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");--bs-accordion-btn-focus-border-color:#86b7fe;--bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-accordion-body-padding-x:1.25rem;--bs-accordion-body-padding-y:1rem;--bs-accordion-active-color:#0c63e4;--bs-accordion-active-bg:#e7f1ff}.badge{--bs-badge-padding-x:0.65em;--bs-badge-padding-y:0.35em;--bs-badge-font-size:0.75em;--bs-badge-font-weight:700;--bs-badge-color:#fff;--bs-badge-border-radius:0.375rem;display:inline-block;padding:var(--bs-badge-padding-y) var(--bs-badge-padding-x);font-size:var(--bs-badge-font-size);font-weight:var(--bs-badge-font-weight);line-height:1;color:var(--bs-badge-color);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--bs-badge-border-radius)}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.alert{--bs-alert-bg:transparent;--bs-alert-padding-x:1rem;--bs-alert-padding-y:1rem;--bs-alert-margin-bottom:1rem;--bs-alert-color:inherit;--bs-alert-border-color:transparent;--bs-alert-border:1px solid var(--bs-alert-border-color);--bs-alert-border-radius:0.375rem;position:relative;padding:var(--bs-alert-padding-y) var(--bs-alert-padding-x);margin-bottom:var(--bs-alert-margin-bottom);color:var(--bs-alert-color);background-color:var(--bs-alert-bg);border:var(--bs-alert-border);border-radius:var(--bs-alert-border-radius)}.list-group{--bs-list-group-color:#212529;--bs-list-group-bg:#fff;--bs-list-group-border-color:rgba(0, 0, 0, 0.125);--bs-list-group-border-width:1px;--bs-list-group-border-radius:0.375rem;--bs-list-group-item-padding-x:1rem;--bs-list-group-item-padding-y:0.5rem;--bs-list-group-action-color:#495057;--bs-list-group-action-hover-color:#495057;--bs-list-group-action-hover-bg:#f8f9fa;--bs-list-group-action-active-color:#212529;--bs-list-group-action-active-bg:#e9ecef;--bs-list-group-disabled-color:#6c757d;--bs-list-group-disabled-bg:#fff;--bs-list-group-active-color:#fff;--bs-list-group-active-bg:#0d6efd;--bs-list-group-active-border-color:#0d6efd;display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border-radius:var(--bs-list-group-border-radius)}.list-group-item{position:relative;display:block;padding:var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);color:var(--bs-list-group-color);text-decoration:none;background-color:var(--bs-list-group-bg);border:var(--bs-list-group-border-width) solid var(--bs-list-group-border-color)}.list-group-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.list-group-item:last-child{border-bottom-right-radius:inherit;border-bottom-left-radius:inherit}.list-group-item.disabled,.list-group-item:disabled{color:var(--bs-list-group-disabled-color);pointer-events:none;background-color:var(--bs-list-group-disabled-bg)}.list-group-item.active{z-index:2;color:var(--bs-list-group-active-color);background-color:var(--bs-list-group-active-bg);border-color:var(--bs-list-group-active-border-color)}.list-group-item+.list-group-item{border-top-width:0}.list-group-item+.list-group-item.active{margin-top:calc(-1 * var(--bs-list-group-border-width));border-top-width:var(--bs-list-group-border-width)}.toast{--bs-toast-zindex:1090;--bs-toast-padding-x:0.75rem;--bs-toast-padding-y:0.5rem;--bs-toast-spacing:1.5rem;--bs-toast-max-width:350px;--bs-toast-font-size:0.875rem;--bs-toast-color: ;--bs-toast-bg:rgba(255, 255, 255, 0.85);--bs-toast-border-width:1px;--bs-toast-border-color:var(--bs-border-color-translucent);--bs-toast-border-radius:0.375rem;--bs-toast-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-toast-header-color:#6c757d;--bs-toast-header-bg:rgba(255, 255, 255, 0.85);--bs-toast-header-border-color:rgba(0, 0, 0, 0.05);width:var(--bs-toast-max-width);max-width:100%;font-size:var(--bs-toast-font-size);color:var(--bs-toast-color);pointer-events:auto;background-color:var(--bs-toast-bg);background-clip:padding-box;border:var(--bs-toast-border-width) solid var(--bs-toast-border-color);box-shadow:var(--bs-toast-box-shadow);border-radius:var(--bs-toast-border-radius)}.toast.showing{opacity:0}.toast:not(.show){display:none}.modal{--bs-modal-zindex:1055;--bs-modal-width:500px;--bs-modal-padding:1rem;--bs-modal-margin:0.5rem;--bs-modal-color: ;--bs-modal-bg:#fff;--bs-modal-border-color:var(--bs-border-color-translucent);--bs-modal-border-width:1px;--bs-modal-border-radius:0.5rem;--bs-modal-box-shadow:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-modal-inner-border-radius:calc(0.5rem - 1px);--bs-modal-header-padding-x:1rem;--bs-modal-header-padding-y:1rem;--bs-modal-header-padding:1rem 1rem;--bs-modal-header-border-color:var(--bs-border-color);--bs-modal-header-border-width:1px;--bs-modal-title-line-height:1.5;--bs-modal-footer-gap:0.5rem;--bs-modal-footer-bg: ;--bs-modal-footer-border-color:var(--bs-border-color);--bs-modal-footer-border-width:1px;position:fixed;top:0;left:0;z-index:var(--bs-modal-zindex);display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}.modal-dialog{position:relative;width:auto;margin:var(--bs-modal-margin);pointer-events:none}.modal.fade .modal-dialog{transition:transform .3s ease-out;transform:translate(0,-50px)}@media (prefers-reduced-motion:reduce){.modal.fade .modal-dialog{transition:none}}.modal.show .modal-dialog{transform:none}.modal.modal-static .modal-dialog{transform:scale(1.02)}.modal-dialog-scrollable{height:calc(100% - var(--bs-modal-margin) * 2)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - var(--bs-modal-margin) * 2)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;color:var(--bs-modal-color);pointer-events:auto;background-color:var(--bs-modal-bg);background-clip:padding-box;border:var(--bs-modal-border-width) solid var(--bs-modal-border-color);border-radius:var(--bs-modal-border-radius);outline:0}.modal-backdrop{--bs-backdrop-zindex:1050;--bs-backdrop-bg:#000;--bs-backdrop-opacity:0.5;position:fixed;top:0;left:0;z-index:var(--bs-backdrop-zindex);width:100vw;height:100vh;background-color:var(--bs-backdrop-bg)}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:var(--bs-backdrop-opacity)}.modal-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;padding:var(--bs-modal-header-padding);border-bottom:var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);border-top-left-radius:var(--bs-modal-inner-border-radius);border-top-right-radius:var(--bs-modal-inner-border-radius)}.modal-header .btn-close{padding:calc(var(--bs-modal-header-padding-y) * .5) calc(var(--bs-modal-header-padding-x) * .5);margin:calc(-.5 * var(--bs-modal-header-padding-y)) calc(-.5 * var(--bs-modal-header-padding-x)) calc(-.5 * var(--bs-modal-header-padding-y)) auto}.modal-title{margin-bottom:0;line-height:var(--bs-modal-title-line-height)}.modal-body{position:relative;flex:1 1 auto;padding:var(--bs-modal-padding)}.modal-footer{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;padding:calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap) * .5);background-color:var(--bs-modal-footer-bg);border-top:var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);border-bottom-right-radius:var(--bs-modal-inner-border-radius);border-bottom-left-radius:var(--bs-modal-inner-border-radius)}.modal-footer>*{margin:calc(var(--bs-modal-footer-gap) * .5)}@media (min-width:576px){.modal{--bs-modal-margin:1.75rem;--bs-modal-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15)}.modal-dialog{max-width:var(--bs-modal-width);margin-right:auto;margin-left:auto}.modal-sm{--bs-modal-width:300px}}@media (min-width:992px){.modal-lg,.modal-xl{--bs-modal-width:800px}}@media (min-width:1200px){.modal-xl{--bs-modal-width:1140px}}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-footer,.modal-fullscreen .modal-header{border-radius:0}.modal-fullscreen .modal-body{overflow-y:auto}@media (max-width:575.98px){.modal-fullscreen-sm-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-sm-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-sm-down .modal-footer,.modal-fullscreen-sm-down .modal-header{border-radius:0}.modal-fullscreen-sm-down .modal-body{overflow-y:auto}}@media (max-width:767.98px){.modal-fullscreen-md-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-md-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-md-down .modal-footer,.modal-fullscreen-md-down .modal-header{border-radius:0}.modal-fullscreen-md-down .modal-body{overflow-y:auto}}@media (max-width:991.98px){.modal-fullscreen-lg-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-lg-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-lg-down .modal-footer,.modal-fullscreen-lg-down .modal-header{border-radius:0}.modal-fullscreen-lg-down .modal-body{overflow-y:auto}}@media (max-width:1199.98px){.modal-fullscreen-xl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xl-down .modal-footer,.modal-fullscreen-xl-down .modal-header{border-radius:0}.modal-fullscreen-xl-down .modal-body{overflow-y:auto}}@media (max-width:1399.98px){.modal-fullscreen-xxl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xxl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xxl-down .modal-footer,.modal-fullscreen-xxl-down .modal-header{border-radius:0}.modal-fullscreen-xxl-down .modal-body{overflow-y:auto}}.tooltip{--bs-tooltip-zindex:1080;--bs-tooltip-max-width:200px;--bs-tooltip-padding-x:0.5rem;--bs-tooltip-padding-y:0.25rem;--bs-tooltip-margin: ;--bs-tooltip-font-size:0.875rem;--bs-tooltip-color:#fff;--bs-tooltip-bg:#000;--bs-tooltip-border-radius:0.375rem;--bs-tooltip-opacity:0.9;--bs-tooltip-arrow-width:0.8rem;--bs-tooltip-arrow-height:0.4rem;z-index:var(--bs-tooltip-zindex);display:block;padding:var(--bs-tooltip-arrow-height);margin:var(--bs-tooltip-margin);font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-tooltip-font-size);word-wrap:break-word;opacity:0}.tooltip.show{opacity:var(--bs-tooltip-opacity)}.tooltip .tooltip-arrow{display:block;width:var(--bs-tooltip-arrow-width);height:var(--bs-tooltip-arrow-height)}.tooltip .tooltip-arrow::before{position:absolute;content:"";border-color:transparent;border-style:solid}.tooltip-inner{max-width:var(--bs-tooltip-max-width);padding:var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);color:var(--bs-tooltip-color);text-align:center;background-color:var(--bs-tooltip-bg);border-radius:var(--bs-tooltip-border-radius)}.popover{--bs-popover-zindex:1070;--bs-popover-max-width:276px;--bs-popover-font-size:0.875rem;--bs-popover-bg:#fff;--bs-popover-border-width:1px;--bs-popover-border-color:var(--bs-border-color-translucent);--bs-popover-border-radius:0.5rem;--bs-popover-inner-border-radius:calc(0.5rem - 1px);--bs-popover-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-popover-header-padding-x:1rem;--bs-popover-header-padding-y:0.5rem;--bs-popover-header-font-size:1rem;--bs-popover-header-color: ;--bs-popover-header-bg:#f0f0f0;--bs-popover-body-padding-x:1rem;--bs-popover-body-padding-y:1rem;--bs-popover-body-color:#212529;--bs-popover-arrow-width:1rem;--bs-popover-arrow-height:0.5rem;--bs-popover-arrow-border:var(--bs-popover-border-color);z-index:var(--bs-popover-zindex);display:block;max-width:var(--bs-popover-max-width);font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-popover-font-size);word-wrap:break-word;background-color:var(--bs-popover-bg);background-clip:padding-box;border:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-radius:var(--bs-popover-border-radius)}.popover .popover-arrow{display:block;width:var(--bs-popover-arrow-width);height:var(--bs-popover-arrow-height)}.popover .popover-arrow::after,.popover .popover-arrow::before{position:absolute;display:block;content:"";border-color:transparent;border-style:solid;border-width:0}.popover-header{padding:var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x);margin-bottom:0;font-size:var(--bs-popover-header-font-size);color:var(--bs-popover-header-color);background-color:var(--bs-popover-header-bg);border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-top-left-radius:var(--bs-popover-inner-border-radius);border-top-right-radius:var(--bs-popover-inner-border-radius)}.popover-header:empty{display:none}.popover-body{padding:var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x);color:var(--bs-popover-body-color)}.carousel{position:relative}.carousel.pointer-event{touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .6s ease-in-out}@media (prefers-reduced-motion:reduce){.carousel-item{transition:none}}.carousel-item-next,.carousel-item-prev,.carousel-item.active{display:block}.active.carousel-item-end,.carousel-item-next:not(.carousel-item-start){transform:translateX(100%)}.active.carousel-item-start,.carousel-item-prev:not(.carousel-item-end){transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;transform:none}.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end,.carousel-fade .carousel-item.active{z-index:1;opacity:1}.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{z-index:0;opacity:0;transition:opacity 0s .6s}@media (prefers-reduced-motion:reduce){.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{transition:none}}.carousel-control-next,.carousel-control-prev{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0;color:#fff;text-align:center;background:0 0;border:0;opacity:.5;transition:opacity .15s ease}@media (prefers-reduced-motion:reduce){.carousel-control-next,.carousel-control-prev{transition:none}}.carousel-control-next:focus,.carousel-control-next:hover,.carousel-control-prev:focus,.carousel-control-prev:hover{color:#fff;text-decoration:none;outline:0;opacity:.9}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-next-icon,.carousel-control-prev-icon{display:inline-block;width:2rem;height:2rem;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.carousel-control-prev-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")}.carousel-control-next-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin-right:15%;margin-bottom:1rem;margin-left:15%;list-style:none}.carousel-indicators [data-bs-target]{box-sizing:content-box;flex:0 1 auto;width:30px;height:3px;padding:0;margin-right:3px;margin-left:3px;text-indent:-999px;cursor:pointer;background-color:#fff;background-clip:padding-box;border:0;border-top:10px solid transparent;border-bottom:10px solid transparent;opacity:.5;transition:opacity .6s ease}@media (prefers-reduced-motion:reduce){.carousel-indicators [data-bs-target]{transition:none}}.carousel-indicators .active{opacity:1}.carousel-caption{position:absolute;right:15%;bottom:1.25rem;left:15%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;text-align:center}.carousel-dark .carousel-control-next-icon,.carousel-dark .carousel-control-prev-icon{filter:invert(1) grayscale(100)}.carousel-dark .carousel-indicators [data-bs-target]{background-color:#000}.carousel-dark .carousel-caption{color:#000}.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl{--bs-offcanvas-zindex:1045;--bs-offcanvas-width:400px;--bs-offcanvas-height:30vh;--bs-offcanvas-padding-x:1rem;--bs-offcanvas-padding-y:1rem;--bs-offcanvas-color: ;--bs-offcanvas-bg:#fff;--bs-offcanvas-border-width:1px;--bs-offcanvas-border-color:var(--bs-border-color-translucent);--bs-offcanvas-box-shadow:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075)}@media (max-width:575.98px){.offcanvas-sm{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media (max-width:575.98px) and (prefers-reduced-motion:reduce){.offcanvas-sm{transition:none}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media (max-width:575.98px){.offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing{transform:none}}@media (max-width:575.98px){.offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing{visibility:visible}}@media (min-width:576px){.offcanvas-sm{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-sm .offcanvas-header{display:none}.offcanvas-sm .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:767.98px){.offcanvas-md{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media (max-width:767.98px) and (prefers-reduced-motion:reduce){.offcanvas-md{transition:none}}@media (max-width:767.98px){.offcanvas-md.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media (max-width:767.98px){.offcanvas-md.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media (max-width:767.98px){.offcanvas-md.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media (max-width:767.98px){.offcanvas-md.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media (max-width:767.98px){.offcanvas-md.show:not(.hiding),.offcanvas-md.showing{transform:none}}@media (max-width:767.98px){.offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing{visibility:visible}}@media (min-width:768px){.offcanvas-md{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-md .offcanvas-header{display:none}.offcanvas-md .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:991.98px){.offcanvas-lg{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media (max-width:991.98px) and (prefers-reduced-motion:reduce){.offcanvas-lg{transition:none}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media (max-width:991.98px){.offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing{transform:none}}@media (max-width:991.98px){.offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing{visibility:visible}}@media (min-width:992px){.offcanvas-lg{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-lg .offcanvas-header{display:none}.offcanvas-lg .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1199.98px){.offcanvas-xl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media (max-width:1199.98px) and (prefers-reduced-motion:reduce){.offcanvas-xl{transition:none}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media (max-width:1199.98px){.offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing{transform:none}}@media (max-width:1199.98px){.offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing{visibility:visible}}@media (min-width:1200px){.offcanvas-xl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xl .offcanvas-header{display:none}.offcanvas-xl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1399.98px){.offcanvas-xxl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media (max-width:1399.98px) and (prefers-reduced-motion:reduce){.offcanvas-xxl{transition:none}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media (max-width:1399.98px){.offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing{transform:none}}@media (max-width:1399.98px){.offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing{visibility:visible}}@media (min-width:1400px){.offcanvas-xxl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xxl .offcanvas-header{display:none}.offcanvas-xxl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}.offcanvas{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}@media (prefers-reduced-motion:reduce){.offcanvas{transition:none}}.offcanvas.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas.show:not(.hiding),.offcanvas.showing{transform:none}.offcanvas.hiding,.offcanvas.show,.offcanvas.showing{visibility:visible}.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}.offcanvas-header{display:flex;align-items:center;justify-content:space-between;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)}.offcanvas-header .btn-close{padding:calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);margin-top:calc(-.5 * var(--bs-offcanvas-padding-y));margin-right:calc(-.5 * var(--bs-offcanvas-padding-x));margin-bottom:calc(-.5 * var(--bs-offcanvas-padding-y))}.offcanvas-title{margin-bottom:0;line-height:1.5}.offcanvas-body{flex-grow:1;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);overflow-y:auto}.placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5}.placeholder.btn::before{display:inline-block;content:""}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.d-none{display:none!important}.border{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-top{border-top:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.visible{visibility:visible!important} /* css/tokens.css */ /* SumUp Black (títulos) e SumUp Narrow variável 300–700 (corpo). Licença de uso web a confirmar (P-14). */ /* Peso único: o intervalo 100–900 evita negrito sintético quando o título pede 700/800. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.woff2") format("woff2"), url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; } /* Subset latino (npm run build:fonts). Declarado depois: o navegador usa ele para estes caracteres * e só baixa a fonte completa (acima) se a página tiver grego/cirílico. Manter o range igual ao do script. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Fallbacks métricos (mesmos ajustes do site sumup.com) */ @font-face { font-family: "SumUp Black fallback"; src: local("Arial Black"), local("Arial Bold"), local("Arial"); font-weight: 100 900; size-adjust: 90.1%; ascent-override: 102%; descent-override: 28%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial"); font-weight: 300 500; size-adjust: 95%; ascent-override: 101.1%; descent-override: 26.6%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial Bold"), local("Arial"); font-weight: 600 700; size-adjust: 90%; ascent-override: 101%; descent-override: 26.6%; line-gap-override: 0%; } :root { /* SumUp — paleta do site (Circuit UI) + complementos do KV "Mais Tap, Mais Chances" */ --sumup-pink: #ff61f2; --sumup-pink-hover: #eb58df; --sumup-pink-pressed: #da4ece; --sumup-pink-strong: #b342a9; --sumup-pink-text: #a33e9a; --sumup-pink-soft: #ffe4fd; --sumup-pink-light: #ffacf8; --sumup-pink-bag: #ff8ef3; --sumup-ink: #1e1c1c; --sumup-ink-box: #1c1a1a; --sumup-ink-hover: #494a4a; --sumup-ink-pressed: #696969; --sumup-ink-subtle: #706464; --sumup-ink-placeholder: #76716b; --sumup-on-ink: #fbfbf9; --sumup-on-ink-subtle: rgba(251, 251, 249, 0.7); --sumup-surface: #fbfbf9; --sumup-surface-subtle: #f5f4ed; --sumup-surface-neutral: #f0eee7; --sumup-surface-highlight: #e8e6dc; --sumup-kv-bg: #f0f1e7; --sumup-border-subtle: #e3e2d6; --sumup-border: #d0cdc3; --sumup-divider: #e7e6df; --sumup-dark: #250723; --sumup-dark-subtle: #3a1037; --sumup-dark-highlight: #63215e; --sumup-dark-elevated: #322430; --sumup-yellow: #f6cb32; --sumup-yellow-hover: #e9bc1f; --sumup-blue: #2f98eb; --sumup-lavender: #9a9def; --sumup-gold: #fffbcf; --sumup-terracotta: #5d1a03; --sumup-leaf: #174104; --sumup-success: #1e862d; --sumup-success-text: #3c7411; --sumup-success-bg: #dff4e2; --sumup-danger: #d23f04; --sumup-danger-text: #b13606; --sumup-danger-bg: #ffdacc; --sumup-warning: #da7603; --sumup-warning-bg: #feeed5; /* Nomes semânticos usados no CSS herdado — todos apontam para a paleta SumUp */ --color-brand-lime: var(--sumup-pink); --color-brand-green: var(--sumup-pink-strong); --color-brand-green-dark: var(--sumup-ink); --color-offer-mint: var(--sumup-lavender); --color-offer-blue: var(--sumup-blue); --color-offer-yellow: var(--sumup-yellow); --color-offer-offwhite: var(--sumup-surface); --color-offer-pink: var(--sumup-pink); --color-brand-yellow: var(--sumup-pink); --color-brand-yellow-strong: var(--sumup-pink-hover); --color-brand-yellow-soft: var(--sumup-pink-soft); --color-brand-blue: var(--sumup-ink); --color-brand-blue-hover: var(--sumup-ink-hover); --color-brand-blue-active: var(--sumup-ink-pressed); --color-ink-900: var(--sumup-ink); --color-ink-700: #3c3636; --color-ink-500: var(--sumup-ink-subtle); --color-ink-300: var(--sumup-border); --color-white: #ffffff; --color-black: var(--color-ink-900); --color-gray-light: var(--sumup-surface-subtle); --color-gray-dark: var(--color-ink-500); --color-primary: var(--sumup-ink); --color-primary-hover: var(--sumup-ink-hover); --color-primary-dark: var(--sumup-ink); --color-secondary: var(--sumup-pink); --color-fire: var(--color-primary); --color-gold: var(--sumup-yellow); --color-gold-soft: var(--sumup-gold); --color-surface: var(--sumup-surface); --color-surface-strong: #ffffff; --color-page-bg: var(--sumup-kv-bg); --color-card-bg: #ffffff; --color-border: var(--sumup-border); --color-border-strong: rgba(30, 28, 28, 0.4); --color-text: var(--sumup-ink); --color-text-muted: var(--sumup-ink-subtle); --color-text-soft: var(--sumup-ink-placeholder); --color-text-dark: var(--sumup-ink); --color-input-bg: #ffffff; --color-error: var(--sumup-danger-text); --color-error-soft: var(--sumup-danger); --color-success: var(--sumup-success); --color-success-soft: #89ec90; --color-btn-disabled: var(--sumup-surface-highlight); --color-btn-disabled-text: rgba(30, 28, 28, 0.5); /* Botões — Circuit UI (sumup.com): raio 12px, borda 1px, SumUp Narrow semibold 17px */ --btn-h: 48px; --btn-h-sm: 40px; --btn-radius: 12px; --btn-radius-sm: 10px; --btn-px: 24px; --btn-px-sm: 16px; --btn-fs: 17px; --btn-fs-sm: 15px; --btn-fw: 600; --btn-lh: 22px; --btn-border-w: 1px; --btn-ink: var(--sumup-ink); /* Destaque (amarelo) — ação principal / cadastro */ --btn-yellow-bg: var(--sumup-yellow); --btn-yellow-bg-hover: var(--sumup-yellow-hover); --btn-yellow-bg-pressed: #d9ad14; --btn-yellow-fg: var(--sumup-ink); /* Padrão (preto) */ --btn-dark-bg: var(--sumup-ink); --btn-dark-bg-hover: #3f3a3a; --btn-dark-bg-pressed: #756c6c; --btn-dark-fg: var(--sumup-on-ink); /* Secundário (contorno preto) */ --btn-outline-border: var(--sumup-ink); --btn-outline-bg: transparent; --btn-outline-bg-hover: rgba(30, 28, 28, 0.06); --btn-outline-bg-pressed: rgba(30, 28, 28, 0.12); --btn-outline-fg: var(--sumup-ink); /* Neutro (cinza) */ --btn-gray: var(--sumup-surface-neutral); --btn-gray-hover: var(--sumup-surface-highlight); --btn-gray-pressed: #d9d6c7; --btn-disabled-bg: rgba(30, 28, 28, 0.1); --btn-disabled-fg: rgba(30, 28, 28, 0.5); --btn-disabled-border: rgba(30, 28, 28, 0.2); --btn-focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--sumup-ink); --color-focus-ring: rgba(255, 97, 242, 0.45); --font-heading: "SumUp Black", "SumUp Black fallback", Arial, system-ui, sans-serif; --font-body: "SumUp Narrow", "SumUp Narrow fallback", Arial, system-ui, -apple-system, "Segoe UI", sans-serif; --font-ui: var(--font-body); --font-display: var(--font-heading); --radius-sm: 8px; --radius-btn: 999px; --radius-card: 24px; --radius-input: 12px; --radius-modal: 24px; --radius-table: 24px; --radius-pill: 999px; --radius-xl: 32px; --radius-2xl: 40px; --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px; --space-5: 48px; --space-6: 64px; --space-7: 96px; --header-h: 72px; --wc-menu-h: 67px; --promo-encerrada-h: 0px; --countdown-h: 0px; /* Countdown sobrepoe o conteudo - nao entra no empurrao do layout */ --hero-stack-h: calc(var(--header-h) + var(--promo-encerrada-h, 0px)); --sumup-bp-mobile: 991px; --sumup-asset-kv: url("../assets/sumup/kvPreview.webp"); --sumup-asset-kv-mobile: url("../assets/sumup/kvPreview.webp"); --hero-kv-mobile-h: calc(100vw * 1920 / 1080); --hero-mobile-content-offset: clamp(1.6rem, calc(var(--hero-kv-mobile-h) * 0.12), 4rem); --hero-mobile-content-offset-flow: clamp(1.2rem, calc(var(--hero-kv-mobile-h) * 0.1), 3.2rem); --hero-mobile-content-offset-logged: clamp(1.4rem, calc(var(--hero-kv-mobile-h) * 0.11), 3.6rem); --container: 1120px; --container-narrow: 720px; --shadow-lg: 0 20px 54px rgba(30, 28, 28, 0.16); --shadow-card: 0 12px 36px rgba(30, 28, 28, 0.1); --glow-mint: 0 0 24px rgba(255, 97, 242, 0.45); --glow-teal: 0 0 24px rgba(30, 28, 28, 0.2); --glow-accent: var(--glow-mint); --glow-red: 0 0 18px rgba(210, 63, 4, 0.22); --glow-fire: var(--glow-teal); --glow-gold: 0 0 24px rgba(246, 203, 50, 0.5); --gradient-page: linear-gradient(180deg, #f5f6ee 0%, var(--sumup-kv-bg) 60%, #e9eadf 100%); --gradient-brand: linear-gradient(135deg, var(--sumup-pink) 0%, var(--sumup-lavender) 55%, var(--sumup-blue) 100%); --gradient-fire: linear-gradient(135deg, var(--sumup-ink) 0%, var(--sumup-dark) 100%); --gradient-sky: linear-gradient(160deg, var(--sumup-pink-light) 0%, var(--sumup-lavender) 45%, var(--sumup-blue) 100%); --gradient-hero-overlay: linear-gradient(to left, rgba(30, 28, 28, 0.6) 0%, rgba(30, 28, 28, 0.18) 35%, transparent 58%); /* Legacy aliases */ --color-green-deep: var(--color-primary-dark); --color-green: var(--color-primary); --color-green-mid: #3c3636; --color-green-dark: var(--color-primary-hover); --color-teal-deep: var(--color-primary-dark); --color-teal: var(--color-primary); --color-teal-mid: #3c3636; --color-mint: var(--color-brand-yellow); --color-accent: var(--color-primary); --color-accent-dark: var(--color-primary-dark); --c-orange1: var(--color-primary); --c-orange2: var(--color-primary); --c-orange3: var(--color-primary-dark); --c-teal1: var(--color-primary); --c-teal2: #3c3636; --c-teal3: #3c3636; --c-teal4: var(--color-primary-dark); --c-teal7: #2d2a2a; --c-red1: var(--color-primary); --c-red2: var(--color-primary); --c-maroon1: var(--color-primary-dark); --c-maroon2: var(--color-primary-dark); --c-wine: var(--color-black); --c-blue1: var(--sumup-lavender); --c-darkBlue1: var(--sumup-ink); --c-darkBlue2: var(--sumup-dark); --c-darkBlue3: var(--sumup-dark); --c-darkBlue4: var(--sumup-dark); --c-darkBlue5: var(--sumup-dark-elevated); --c-darkBlue6: var(--sumup-dark-subtle); --c-darkBlue7: var(--sumup-ink); --c-darkBlue8: var(--sumup-dark-highlight); --c-white: #ffffff; --c-black: var(--color-black); --c-black2: var(--sumup-ink-subtle); --c-blackform: var(--sumup-ink-placeholder); --c-gray: var(--sumup-surface-subtle); --c-gray2: var(--sumup-surface-neutral); --c-graydark: var(--sumup-ink-subtle); --c-check: var(--color-success); --c-error: var(--color-error); --c-error1: var(--color-error); --c-error2: var(--color-error-soft); --c-offwhite: var(--sumup-surface); --c-yellow1: var(--sumup-yellow); } /* css/base.css */ /* SumUp Black (títulos) e SumUp Narrow variável 300–700 (corpo). Licença de uso web a confirmar (P-14). */ /* Peso único: o intervalo 100–900 evita negrito sintético quando o título pede 700/800. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.woff2") format("woff2"), url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; } /* Subset latino (npm run build:fonts). Declarado depois: o navegador usa ele para estes caracteres * e só baixa a fonte completa (acima) se a página tiver grego/cirílico. Manter o range igual ao do script. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Fallbacks métricos (mesmos ajustes do site sumup.com) */ @font-face { font-family: "SumUp Black fallback"; src: local("Arial Black"), local("Arial Bold"), local("Arial"); font-weight: 100 900; size-adjust: 90.1%; ascent-override: 102%; descent-override: 28%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial"); font-weight: 300 500; size-adjust: 95%; ascent-override: 101.1%; descent-override: 26.6%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial Bold"), local("Arial"); font-weight: 600 700; size-adjust: 90%; ascent-override: 101%; descent-override: 26.6%; line-gap-override: 0%; } :root { /* SumUp — paleta do site (Circuit UI) + complementos do KV "Mais Tap, Mais Chances" */ --sumup-pink: #ff61f2; --sumup-pink-hover: #eb58df; --sumup-pink-pressed: #da4ece; --sumup-pink-strong: #b342a9; --sumup-pink-text: #a33e9a; --sumup-pink-soft: #ffe4fd; --sumup-pink-light: #ffacf8; --sumup-pink-bag: #ff8ef3; --sumup-ink: #1e1c1c; --sumup-ink-box: #1c1a1a; --sumup-ink-hover: #494a4a; --sumup-ink-pressed: #696969; --sumup-ink-subtle: #706464; --sumup-ink-placeholder: #76716b; --sumup-on-ink: #fbfbf9; --sumup-on-ink-subtle: rgba(251, 251, 249, 0.7); --sumup-surface: #fbfbf9; --sumup-surface-subtle: #f5f4ed; --sumup-surface-neutral: #f0eee7; --sumup-surface-highlight: #e8e6dc; --sumup-kv-bg: #f0f1e7; --sumup-border-subtle: #e3e2d6; --sumup-border: #d0cdc3; --sumup-divider: #e7e6df; --sumup-dark: #250723; --sumup-dark-subtle: #3a1037; --sumup-dark-highlight: #63215e; --sumup-dark-elevated: #322430; --sumup-yellow: #f6cb32; --sumup-yellow-hover: #e9bc1f; --sumup-blue: #2f98eb; --sumup-lavender: #9a9def; --sumup-gold: #fffbcf; --sumup-terracotta: #5d1a03; --sumup-leaf: #174104; --sumup-success: #1e862d; --sumup-success-text: #3c7411; --sumup-success-bg: #dff4e2; --sumup-danger: #d23f04; --sumup-danger-text: #b13606; --sumup-danger-bg: #ffdacc; --sumup-warning: #da7603; --sumup-warning-bg: #feeed5; /* Nomes semânticos usados no CSS herdado — todos apontam para a paleta SumUp */ --color-brand-lime: var(--sumup-pink); --color-brand-green: var(--sumup-pink-strong); --color-brand-green-dark: var(--sumup-ink); --color-offer-mint: var(--sumup-lavender); --color-offer-blue: var(--sumup-blue); --color-offer-yellow: var(--sumup-yellow); --color-offer-offwhite: var(--sumup-surface); --color-offer-pink: var(--sumup-pink); --color-brand-yellow: var(--sumup-pink); --color-brand-yellow-strong: var(--sumup-pink-hover); --color-brand-yellow-soft: var(--sumup-pink-soft); --color-brand-blue: var(--sumup-ink); --color-brand-blue-hover: var(--sumup-ink-hover); --color-brand-blue-active: var(--sumup-ink-pressed); --color-ink-900: var(--sumup-ink); --color-ink-700: #3c3636; --color-ink-500: var(--sumup-ink-subtle); --color-ink-300: var(--sumup-border); --color-white: #ffffff; --color-black: var(--color-ink-900); --color-gray-light: var(--sumup-surface-subtle); --color-gray-dark: var(--color-ink-500); --color-primary: var(--sumup-ink); --color-primary-hover: var(--sumup-ink-hover); --color-primary-dark: var(--sumup-ink); --color-secondary: var(--sumup-pink); --color-fire: var(--color-primary); --color-gold: var(--sumup-yellow); --color-gold-soft: var(--sumup-gold); --color-surface: var(--sumup-surface); --color-surface-strong: #ffffff; --color-page-bg: var(--sumup-kv-bg); --color-card-bg: #ffffff; --color-border: var(--sumup-border); --color-border-strong: rgba(30, 28, 28, 0.4); --color-text: var(--sumup-ink); --color-text-muted: var(--sumup-ink-subtle); --color-text-soft: var(--sumup-ink-placeholder); --color-text-dark: var(--sumup-ink); --color-input-bg: #ffffff; --color-error: var(--sumup-danger-text); --color-error-soft: var(--sumup-danger); --color-success: var(--sumup-success); --color-success-soft: #89ec90; --color-btn-disabled: var(--sumup-surface-highlight); --color-btn-disabled-text: rgba(30, 28, 28, 0.5); /* Botões — Circuit UI (sumup.com): raio 12px, borda 1px, SumUp Narrow semibold 17px */ --btn-h: 48px; --btn-h-sm: 40px; --btn-radius: 12px; --btn-radius-sm: 10px; --btn-px: 24px; --btn-px-sm: 16px; --btn-fs: 17px; --btn-fs-sm: 15px; --btn-fw: 600; --btn-lh: 22px; --btn-border-w: 1px; --btn-ink: var(--sumup-ink); /* Destaque (amarelo) — ação principal / cadastro */ --btn-yellow-bg: var(--sumup-yellow); --btn-yellow-bg-hover: var(--sumup-yellow-hover); --btn-yellow-bg-pressed: #d9ad14; --btn-yellow-fg: var(--sumup-ink); /* Padrão (preto) */ --btn-dark-bg: var(--sumup-ink); --btn-dark-bg-hover: #3f3a3a; --btn-dark-bg-pressed: #756c6c; --btn-dark-fg: var(--sumup-on-ink); /* Secundário (contorno preto) */ --btn-outline-border: var(--sumup-ink); --btn-outline-bg: transparent; --btn-outline-bg-hover: rgba(30, 28, 28, 0.06); --btn-outline-bg-pressed: rgba(30, 28, 28, 0.12); --btn-outline-fg: var(--sumup-ink); /* Neutro (cinza) */ --btn-gray: var(--sumup-surface-neutral); --btn-gray-hover: var(--sumup-surface-highlight); --btn-gray-pressed: #d9d6c7; --btn-disabled-bg: rgba(30, 28, 28, 0.1); --btn-disabled-fg: rgba(30, 28, 28, 0.5); --btn-disabled-border: rgba(30, 28, 28, 0.2); --btn-focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--sumup-ink); --color-focus-ring: rgba(255, 97, 242, 0.45); --font-heading: "SumUp Black", "SumUp Black fallback", Arial, system-ui, sans-serif; --font-body: "SumUp Narrow", "SumUp Narrow fallback", Arial, system-ui, -apple-system, "Segoe UI", sans-serif; --font-ui: var(--font-body); --font-display: var(--font-heading); --radius-sm: 8px; --radius-btn: 999px; --radius-card: 24px; --radius-input: 12px; --radius-modal: 24px; --radius-table: 24px; --radius-pill: 999px; --radius-xl: 32px; --radius-2xl: 40px; --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px; --space-5: 48px; --space-6: 64px; --space-7: 96px; --header-h: 72px; --wc-menu-h: 67px; --promo-encerrada-h: 0px; --countdown-h: 0px; /* Countdown sobrepoe o conteudo - nao entra no empurrao do layout */ --hero-stack-h: calc(var(--header-h) + var(--promo-encerrada-h, 0px)); --sumup-bp-mobile: 991px; --sumup-asset-kv: url("../assets/sumup/kvPreview.webp"); --sumup-asset-kv-mobile: url("../assets/sumup/kvPreview.webp"); --hero-kv-mobile-h: calc(100vw * 1920 / 1080); --hero-mobile-content-offset: clamp(1.6rem, calc(var(--hero-kv-mobile-h) * 0.12), 4rem); --hero-mobile-content-offset-flow: clamp(1.2rem, calc(var(--hero-kv-mobile-h) * 0.1), 3.2rem); --hero-mobile-content-offset-logged: clamp(1.4rem, calc(var(--hero-kv-mobile-h) * 0.11), 3.6rem); --container: 1120px; --container-narrow: 720px; --shadow-lg: 0 20px 54px rgba(30, 28, 28, 0.16); --shadow-card: 0 12px 36px rgba(30, 28, 28, 0.1); --glow-mint: 0 0 24px rgba(255, 97, 242, 0.45); --glow-teal: 0 0 24px rgba(30, 28, 28, 0.2); --glow-accent: var(--glow-mint); --glow-red: 0 0 18px rgba(210, 63, 4, 0.22); --glow-fire: var(--glow-teal); --glow-gold: 0 0 24px rgba(246, 203, 50, 0.5); --gradient-page: linear-gradient(180deg, #f5f6ee 0%, var(--sumup-kv-bg) 60%, #e9eadf 100%); --gradient-brand: linear-gradient(135deg, var(--sumup-pink) 0%, var(--sumup-lavender) 55%, var(--sumup-blue) 100%); --gradient-fire: linear-gradient(135deg, var(--sumup-ink) 0%, var(--sumup-dark) 100%); --gradient-sky: linear-gradient(160deg, var(--sumup-pink-light) 0%, var(--sumup-lavender) 45%, var(--sumup-blue) 100%); --gradient-hero-overlay: linear-gradient(to left, rgba(30, 28, 28, 0.6) 0%, rgba(30, 28, 28, 0.18) 35%, transparent 58%); /* Legacy aliases */ --color-green-deep: var(--color-primary-dark); --color-green: var(--color-primary); --color-green-mid: #3c3636; --color-green-dark: var(--color-primary-hover); --color-teal-deep: var(--color-primary-dark); --color-teal: var(--color-primary); --color-teal-mid: #3c3636; --color-mint: var(--color-brand-yellow); --color-accent: var(--color-primary); --color-accent-dark: var(--color-primary-dark); --c-orange1: var(--color-primary); --c-orange2: var(--color-primary); --c-orange3: var(--color-primary-dark); --c-teal1: var(--color-primary); --c-teal2: #3c3636; --c-teal3: #3c3636; --c-teal4: var(--color-primary-dark); --c-teal7: #2d2a2a; --c-red1: var(--color-primary); --c-red2: var(--color-primary); --c-maroon1: var(--color-primary-dark); --c-maroon2: var(--color-primary-dark); --c-wine: var(--color-black); --c-blue1: var(--sumup-lavender); --c-darkBlue1: var(--sumup-ink); --c-darkBlue2: var(--sumup-dark); --c-darkBlue3: var(--sumup-dark); --c-darkBlue4: var(--sumup-dark); --c-darkBlue5: var(--sumup-dark-elevated); --c-darkBlue6: var(--sumup-dark-subtle); --c-darkBlue7: var(--sumup-ink); --c-darkBlue8: var(--sumup-dark-highlight); --c-white: #ffffff; --c-black: var(--color-black); --c-black2: var(--sumup-ink-subtle); --c-blackform: var(--sumup-ink-placeholder); --c-gray: var(--sumup-surface-subtle); --c-gray2: var(--sumup-surface-neutral); --c-graydark: var(--sumup-ink-subtle); --c-check: var(--color-success); --c-error: var(--color-error); --c-error1: var(--color-error); --c-error2: var(--color-error-soft); --c-offwhite: var(--sumup-surface); --c-yellow1: var(--sumup-yellow); } *, *::before, *::after { box-sizing: border-box; } html { font-size: 62.5%; scroll-behavior: smooth; scroll-padding-top: var(--hero-stack-h); overflow-x: hidden; max-width: 100%; } /* Fenix legado redefine html — mantém escala rem do DS em todas as páginas */ html { font-size: 62.5% !important; } body { margin: 0; min-height: 100vh; max-width: 100%; display: flex; flex-direction: column; font-family: var(--font-body); font-size: 1.6rem; line-height: 1.55; color: var(--color-text); background: var(--color-page-bg); -webkit-font-smoothing: antialiased; overflow-x: hidden; } img, video { max-width: 100%; display: block; } a { color: var(--color-primary); text-decoration: none; transition: color 0.2s ease; } a:hover, a:focus-visible { color: var(--color-primary-dark); } :focus-visible { outline: 0px solid var(--color-primary-dark); outline-offset: 3px; box-shadow: 0 0 0 4px var(--color-focus-ring); } .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .site-main, .site-header, .site-footer { position: relative; z-index: 1; } .w-full { width: 100%; } .desktop-only { display: none !important; } .mobile-only { display: block !important; } @media (min-width: 992px) { .desktop-only { display: block !important; } .mobile-only { display: none !important; } } /* Anti-flash de autenticação: aplica antes do primeiro paint. */ html[data-auth="conectado"] [data-login="desconectado"], html[data-auth="desconectado"] [data-login="conectado"] { display: none !important; } /* Fallback antes do auth-boot: assume visitante deslogado. */ html:not([data-auth]) [data-login="conectado"] { display: none !important; } /* css/site-fab.css */ /* CTA flutuante — desativado (Central IA ocupa a posição) */ .site-fab, .site-fab[hidden], #site-fab-cta, [data-site-fab] { display: none !important; } /* css/site-nav-dropdown.css */ /* * Menu principal — modelo SumUp (referência do cliente): * barra branca flutuante (raio 20px), itens com chevron, dropdown colado na barra * (largura total / alinhado à direita), botões Circuit UI (contorno + amarelo/preto, raio 12px) e overlay escuro. * Tokens espelham a referência: surface #fff · high var(--sumup-ink) · subtle #706464 (hover/ativo) * brand var(--sumup-pink) (hover var(--sumup-pink-hover)) · brand-text var(--sumup-ink-hover) · neutral-low rgba(30, 28, 28,.1) · neutral-subtle rgba(30, 28, 28,.07) */ .site-header { --nav-surface: #ffffff; --nav-high: var(--sumup-ink); --nav-brand: var(--sumup-pink); --nav-brand-hover: var(--sumup-pink-hover); --nav-brand-text: var(--sumup-ink-hover); --nav-neutral-low: rgba(30, 28, 28, 0.1); --nav-neutral-subtle: rgba(30, 28, 28, 0.07); --nav-body: var(--sumup-surface-neutral); --nav-subtle: var(--sumup-ink-subtle, #706464); --nav-font: var(--font-body, "SumUp Narrow", sans-serif); /* Tipografia do header sumup.com (Circuit UI): body-m, headline-s/m, pesos 375/650 */ --nav-fs-body: 17px; --nav-lh-body: 22px; --nav-fs-body-s: 15px; --nav-lh-body-s: 20px; --nav-fs-headline-s: 19px; --nav-lh-headline-s: 22px; --nav-fs-headline-m: 25px; --nav-lh-headline-m: 26px; --nav-fw-regular: 375; --nav-fw-bold: 650; --nav-gap: 8px; --nav-max: 1442px; --nav-stick-ease: cubic-bezier(0.22, 1, 0.36, 1); --nav-stick-dur: 0.45s; } .site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 900; padding: var(--nav-gap); background: transparent; pointer-events: none; font-family: var(--nav-font); box-sizing: border-box; } .site-header__wrap { position: relative; pointer-events: none; } .site-header__overlay { position: fixed; inset: 0; z-index: 10; background: rgba(0, 0, 0, 0.5); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.3s ease, visibility 0.3s; } /* Margens no lugar de max-width/auto para a largura poder animar até 100% (is-stuck) */ .site-header__bar { position: relative; top: 0; z-index: 50; display: flex; align-items: center; box-sizing: border-box; height: 72px; margin: 0 max(0px, calc((100% - var(--nav-max)) / 2)); padding: 0 12px; background: var(--nav-surface); color: var(--nav-high); border: 1px solid var(--nav-neutral-low); border-radius: 20px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); pointer-events: auto; transition: top var(--nav-stick-dur) var(--nav-stick-ease), margin var(--nav-stick-dur) var(--nav-stick-ease), padding var(--nav-stick-dur) var(--nav-stick-ease), border-radius var(--nav-stick-dur) var(--nav-stick-ease), border-color var(--nav-stick-dur) ease, box-shadow var(--nav-stick-dur) ease; } /* Após ~100px de scroll: barra cola no topo e ocupa a largura toda; o conteúdo não se move. Só a barra se desloca (top/margens) para não alterar a altura do header (--header-h). */ .site-header.is-stuck .site-header__bar { top: calc(-1 * var(--nav-gap)); margin: 0 calc(-1 * var(--nav-gap)); padding: 0 calc(12px + var(--nav-gap) + max(0px, calc((100% - var(--nav-max)) / 2))); border-color: transparent transparent var(--nav-neutral-low); border-radius: 0; box-shadow: 0 4px 16px -4px rgba(0, 0, 0, 0.08); } .site-header.is-stuck.is-dd-closed .site-header__bar { border-radius: 0 !important; } @media (prefers-reduced-motion: reduce) { .site-header__bar { transition: none; } } .site-header__logo { display: flex; align-items: center; flex-shrink: 0; height: 44px; margin-right: 16px; text-decoration: none; } .site-header__logo img { display: block; width: auto; height: 100%; max-width: 100%; object-fit: contain; } .site-nav { display: flex; flex: 1 1 auto; min-width: 0; height: 100%; align-items: center; justify-content: space-between; gap: 8px; } .site-nav a, .site-nav button { font-family: var(--nav-font); } .site-nav__menu { display: flex; align-items: center; height: 100%; gap: 8px; } .site-nav__item { display: inline-flex; align-items: center; height: 100%; } .site-nav__trigger, .site-nav__link { display: inline-flex; align-items: center; gap: 4px; height: 100%; padding: 0 8px; margin: 0; border: 0; background: transparent; color: inherit; font-size: var(--nav-fs-body); font-weight: var(--nav-fw-regular); line-height: var(--nav-lh-body); letter-spacing: 0; text-decoration: none; text-decoration-color: transparent; white-space: nowrap; cursor: pointer; transition: color 0.2s ease, text-decoration-color 0.2s ease; } /* Hover/ativo do sumup.com: cinza (fg-subtle) + sublinhado; botões ficam de fora */ .site-nav__trigger:hover, .site-nav__trigger:focus-visible, .site-nav__trigger:active, .site-nav__link:hover, .site-nav__link:focus-visible, .site-nav__link:active, .site-nav__link.is-active, .site-nav__panel a.site-nav__sublink:hover, .site-nav__panel a.site-nav__sublink:focus-visible, .site-nav__panel a.site-nav__sublink:active, .site-nav__panel a.site-nav__sublink.is-active { color: var(--nav-subtle); text-decoration: underline; text-decoration-color: currentColor; } .site-nav__chevron { width: 16px; height: 16px; min-width: 16px; transition: transform 0.2s ease; } .site-nav__panel-title { margin: 0 0 20px; color: var(--nav-subtle); font-size: var(--nav-fs-headline-s); font-weight: var(--nav-fw-bold); line-height: var(--nav-lh-headline-s); letter-spacing: 0; text-transform: uppercase; } .site-nav__panel-list { display: flex; flex-direction: column; gap: 20px; } .site-nav__panel a.site-nav__sublink { display: flex; align-items: center; gap: 16px; color: var(--nav-high); font-size: var(--nav-fs-body); font-weight: var(--nav-fw-regular); line-height: var(--nav-lh-body); letter-spacing: 0; text-decoration: none; text-decoration-color: transparent; transition: color 0.2s ease, text-decoration-color 0.2s ease; } .site-nav__panel a.site-nav__sublink.is-active { font-weight: var(--nav-fw-bold); } .site-nav__sublink-icon { display: block; flex: 0 0 24px; width: 24px; height: 24px; min-width: 24px; overflow: visible; shape-rendering: geometricPrecision; -webkit-font-smoothing: antialiased; } .site-nav__card { display: flex; flex-direction: column; gap: 20px; color: var(--nav-high); text-decoration: none; filter: blur(0); transition: filter 0.45s ease-in-out; will-change: filter; } /* Hover num item da esquerda: realça o card correspondente e desfoca os demais */ .site-nav__panel-inner:has(.site-nav__sublink[data-menu]:hover) .site-nav__card { filter: blur(4px); } .site-nav__panel-inner:has(.site-nav__sublink[data-menu="como-participar"]:hover) .site-nav__card[data-menu="como-participar"], .site-nav__panel-inner:has(.site-nav__sublink[data-menu="premios"]:hover) .site-nav__card[data-menu="premios"], .site-nav__panel-inner:has(.site-nav__sublink[data-menu="calendario"]:hover) .site-nav__card[data-menu="calendario"] { filter: blur(0); } @media (prefers-reduced-motion: reduce) { .site-nav__card { transition: none; } } .site-nav__card-media { position: relative; width: 100%; height: 320px; overflow: hidden; border-radius: 24px; background: var(--sumup-surface-highlight, #e8e6dc); transition: background-color 0.3s ease; } .site-nav__card:hover .site-nav__card-media, .site-nav__card:focus-visible .site-nav__card-media { background: var(--sumup-yellow, #f6cb32); } .site-nav__card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; } .site-nav__card-title { margin: 0; font-family: var(--nav-font); font-size: var(--nav-fs-headline-m); font-weight: var(--nav-fw-bold); line-height: var(--nav-lh-headline-m); letter-spacing: 0; } .site-nav__card-text { margin: 0; font-size: var(--nav-fs-body); font-weight: var(--nav-fw-regular); line-height: var(--nav-lh-body); } /* Botões */ .site-nav__actions { display: flex; align-items: center; gap: 8px; height: 100%; } /* Ordem no DOM: principal primeiro; no desktop o principal fica à direita (ButtonGroup do Circuit UI) */ .site-nav-account { display: flex; flex-direction: row-reverse; align-items: center; gap: 8px; margin: 0; } .site-nav a.site-nav__btn[hidden], .site-nav-account[hidden] { display: none !important; } /* Botões do header — Circuit UI (sumup.com): 48px · raio 12px · borda 1px · 17px semibold */ .site-nav a.site-nav__btn { --nav-btn-bg: var(--btn-dark-bg, #1e1c1c); --nav-btn-bg-hover: var(--btn-dark-bg-hover, #3f3a3a); --nav-btn-bg-pressed: var(--btn-dark-bg-pressed, #756c6c); --nav-btn-fg: var(--btn-dark-fg, #fbfbf9); --nav-btn-bd: transparent; position: relative; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; height: var(--btn-h, 48px); padding: 0 var(--btn-px, 24px); border: var(--btn-border-w, 1px) solid var(--nav-btn-bd) !important; border-radius: var(--btn-radius, 12px) !important; background: var(--nav-btn-bg) !important; color: var(--nav-btn-fg) !important; font-size: var(--btn-fs, 17px) !important; font-weight: var(--btn-fw, 600) !important; line-height: var(--btn-lh, 22px); white-space: nowrap; text-decoration: none !important; box-shadow: none !important; animation: none !important; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } .site-nav a.site-nav__btn::after { content: none !important; display: none !important; } .site-nav a.site-nav__btn:hover { background: var(--nav-btn-bg-hover) !important; } .site-nav a.site-nav__btn:active { background: var(--nav-btn-bg-pressed) !important; } /* Destaque — amarelo (cadastro) */ .site-nav a.site-nav__btn--primary { --nav-btn-bg: var(--btn-yellow-bg, #f6cb32); --nav-btn-bg-hover: var(--btn-yellow-bg-hover, #e9bc1f); --nav-btn-bg-pressed: var(--btn-yellow-bg-pressed, #d9ad14); --nav-btn-fg: var(--btn-yellow-fg, #1e1c1c); } /* Secundário — contorno preto */ .site-nav a.site-nav__btn--outline { --nav-btn-bg: var(--btn-outline-bg, transparent); --nav-btn-bg-hover: var(--btn-outline-bg-hover, rgba(30, 28, 28, 0.06)); --nav-btn-bg-pressed: var(--btn-outline-bg-pressed, rgba(30, 28, 28, 0.12)); --nav-btn-fg: var(--btn-outline-fg, #1e1c1c); --nav-btn-bd: var(--btn-outline-border, #1e1c1c); } .site-nav a.site-nav__btn:focus-visible { outline: none; box-shadow: var(--btn-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #1e1c1c) !important; } .site-nav__trigger:focus-visible, .site-nav__link:focus-visible { outline: 2px solid var(--nav-high); outline-offset: 2px; } @keyframes site-nav-flip-down { 0% { transform: rotateX(-90deg); transform-origin: 70px 0; } 100% { transform: rotateX(0deg); transform-origin: 70px 0; } } /* ───────── Desktop ───────── */ @media (min-width: 1200px) { .site-header { --nav-gap: 16px; } .site-nav-toggle { display: none !important; } .site-nav__item--dd { position: relative; } .site-nav__item--full { position: static; } .site-nav__trigger .site-nav__chevron { flex-shrink: 0; } .site-nav__panel { position: absolute; top: 100%; z-index: 50; visibility: hidden; opacity: 0; box-sizing: border-box; background: var(--nav-surface); color: var(--nav-high); border: 1px solid var(--nav-neutral-low); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); padding: 40px; transition: opacity 0.7s ease, visibility 0.7s; } .site-nav__item--full > .site-nav__panel { left: -1px; width: calc(100% + 2px); border-top: 0; border-radius: 0 0 28px 28px; } .site-nav__item--right > .site-nav__panel { top: calc(100% + 1rem); right: -12px; width: 398px; border-radius: 28px; } /* ponte de hover para o espaço de 1rem entre a barra e o box */ .site-nav__item--right > .site-nav__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -1.2rem; height: 1.2rem; } .site-nav__panel-inner { display: flex; gap: 40px; align-items: flex-start; width: 100%; } .site-nav__panel-col { flex: 1 1 auto; min-width: 0; } .site-nav__panel-aside { display: flex; flex: 0 0 auto; gap: 24px; } .site-nav__panel-aside .site-nav__card { width: 240px; gap: 16px; } .site-nav__panel-aside .site-nav__card-media { height: 240px; } .site-nav__card:hover .site-nav__card-title, .site-nav__card:focus-visible .site-nav__card-title { color: var(--nav-brand-text); } .site-nav__item--dd:hover > .site-nav__panel, .site-nav__item--dd:focus-within > .site-nav__panel { visibility: visible; opacity: 1; animation: site-nav-flip-down 0.5s ease-out forwards; } .site-nav__item--dd:hover > .site-nav__trigger .site-nav__chevron, .site-nav__item--dd:focus-within > .site-nav__trigger .site-nav__chevron { transform: rotate(180deg); } /* Gatilho segue em hover enquanto o mouse está no painel aberto */ .site-nav__item--dd:hover > .site-nav__trigger { color: var(--nav-subtle); text-decoration: underline; text-decoration-color: currentColor; } .site-nav__link.is-active { font-weight: var(--nav-fw-bold); } .site-header__wrap:has(.site-nav__item--dd:hover) .site-header__overlay, .site-header__wrap:has(.site-nav__item--dd:focus-within) .site-header__overlay { opacity: 1; visibility: visible; } .site-header__wrap:has(.site-nav__item--full:hover) .site-header__bar, .site-header__wrap:has(.site-nav__item--full:focus-within) .site-header__bar { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } } /* Recolhe o dropdown após clicar num link (até o mouse sair do item) */ @media (min-width: 1200px) { .site-header.is-dd-closed .site-nav__item--dd > .site-nav__panel { visibility: hidden !important; opacity: 0 !important; animation: none !important; transition: none !important; } .site-header.is-dd-closed .site-header__overlay { opacity: 0 !important; visibility: hidden !important; } .site-header.is-dd-closed .site-nav__item--dd > .site-nav__trigger .site-nav__chevron { transform: none !important; } .site-header.is-dd-closed .site-header__bar { border-bottom-left-radius: 20px !important; border-bottom-right-radius: 20px !important; } } @media (min-width: 1200px) and (max-width: 1360px) { .site-nav__trigger, .site-nav__link { font-size: var(--nav-fs-body-s); line-height: var(--nav-lh-body-s); padding: 0 6px; } .site-nav a.site-nav__btn { padding: 0 18px; } } @media (prefers-reduced-motion: reduce) { .site-nav__panel, .site-header__overlay { transition: none; animation: none !important; } } .form-control--locked, .form-control[readonly]:not(:focus) { opacity: 0.88; cursor: default; background: rgba(255, 255, 255, 0.72) !important; } /* css/participar-cpf.css */ /* Scroll confortável até o CPF (header fixo) */ #HomeCPF, #HomeEmail, .hero__vitrine-box[data-vitrine-panel="login"] { scroll-margin-top: calc(var(--hero-stack-h) + 1.25rem); scroll-margin-bottom: 1.5rem; } @keyframes cpf-neon-pulse { 0%, 100% { border-color: rgba(255, 97, 242, 0.45); box-shadow: 0 0 0 0 rgba(255, 97, 242, 0), 0 0 10px rgba(255, 97, 242, 0.28); } 50% { border-color: rgba(255, 97, 242, 0.9); box-shadow: 0 0 0 2px rgba(255, 97, 242, 0.35), 0 0 18px rgba(255, 97, 242, 0.55), 0 0 28px rgba(255, 97, 242, 0.28); } } #HomeCPF.cpf-neon-pulse { animation: cpf-neon-pulse 1.75s ease-in-out infinite; } #HomeCPF.cpf-neon-pulse:focus { animation: cpf-neon-pulse 1.75s ease-in-out infinite; outline: none; } /* Header CTA segue padrão SumUp (sem pisca) */ .site-nav a.nav-cta { animation: none; box-shadow: none; } .site-nav a.nav-cta:hover, .site-nav a.nav-cta:focus-visible { animation: none; box-shadow: none; } /* CTA do formulário de CPF na home */ .hero__cpf-cta { animation: none; box-shadow: none; } .hero__cpf-cta:hover, .hero__cpf-cta:focus-visible { animation: none; box-shadow: none; } @keyframes nav-cta-blink { 0%, 49.999% { background: var(--btn-yellow-bg); box-shadow: none; } 50%, 100% { background: var(--btn-yellow-bg-hover); box-shadow: none; } } @media (prefers-reduced-motion: reduce) { .site-nav a.nav-cta, .hero__cpf-cta { animation: none; } } /* css/sumup-popup.css */ /* SumUp Black (títulos) e SumUp Narrow variável 300–700 (corpo). Licença de uso web a confirmar (P-14). */ /* Peso único: o intervalo 100–900 evita negrito sintético quando o título pede 700/800. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.woff2") format("woff2"), url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; } /* Subset latino (npm run build:fonts). Declarado depois: o navegador usa ele para estes caracteres * e só baixa a fonte completa (acima) se a página tiver grego/cirílico. Manter o range igual ao do script. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Fallbacks métricos (mesmos ajustes do site sumup.com) */ @font-face { font-family: "SumUp Black fallback"; src: local("Arial Black"), local("Arial Bold"), local("Arial"); font-weight: 100 900; size-adjust: 90.1%; ascent-override: 102%; descent-override: 28%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial"); font-weight: 300 500; size-adjust: 95%; ascent-override: 101.1%; descent-override: 26.6%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial Bold"), local("Arial"); font-weight: 600 700; size-adjust: 90%; ascent-override: 101%; descent-override: 26.6%; line-gap-override: 0%; } :root { /* SumUp — paleta do site (Circuit UI) + complementos do KV "Mais Tap, Mais Chances" */ --sumup-pink: #ff61f2; --sumup-pink-hover: #eb58df; --sumup-pink-pressed: #da4ece; --sumup-pink-strong: #b342a9; --sumup-pink-text: #a33e9a; --sumup-pink-soft: #ffe4fd; --sumup-pink-light: #ffacf8; --sumup-pink-bag: #ff8ef3; --sumup-ink: #1e1c1c; --sumup-ink-box: #1c1a1a; --sumup-ink-hover: #494a4a; --sumup-ink-pressed: #696969; --sumup-ink-subtle: #706464; --sumup-ink-placeholder: #76716b; --sumup-on-ink: #fbfbf9; --sumup-on-ink-subtle: rgba(251, 251, 249, 0.7); --sumup-surface: #fbfbf9; --sumup-surface-subtle: #f5f4ed; --sumup-surface-neutral: #f0eee7; --sumup-surface-highlight: #e8e6dc; --sumup-kv-bg: #f0f1e7; --sumup-border-subtle: #e3e2d6; --sumup-border: #d0cdc3; --sumup-divider: #e7e6df; --sumup-dark: #250723; --sumup-dark-subtle: #3a1037; --sumup-dark-highlight: #63215e; --sumup-dark-elevated: #322430; --sumup-yellow: #f6cb32; --sumup-yellow-hover: #e9bc1f; --sumup-blue: #2f98eb; --sumup-lavender: #9a9def; --sumup-gold: #fffbcf; --sumup-terracotta: #5d1a03; --sumup-leaf: #174104; --sumup-success: #1e862d; --sumup-success-text: #3c7411; --sumup-success-bg: #dff4e2; --sumup-danger: #d23f04; --sumup-danger-text: #b13606; --sumup-danger-bg: #ffdacc; --sumup-warning: #da7603; --sumup-warning-bg: #feeed5; /* Nomes semânticos usados no CSS herdado — todos apontam para a paleta SumUp */ --color-brand-lime: var(--sumup-pink); --color-brand-green: var(--sumup-pink-strong); --color-brand-green-dark: var(--sumup-ink); --color-offer-mint: var(--sumup-lavender); --color-offer-blue: var(--sumup-blue); --color-offer-yellow: var(--sumup-yellow); --color-offer-offwhite: var(--sumup-surface); --color-offer-pink: var(--sumup-pink); --color-brand-yellow: var(--sumup-pink); --color-brand-yellow-strong: var(--sumup-pink-hover); --color-brand-yellow-soft: var(--sumup-pink-soft); --color-brand-blue: var(--sumup-ink); --color-brand-blue-hover: var(--sumup-ink-hover); --color-brand-blue-active: var(--sumup-ink-pressed); --color-ink-900: var(--sumup-ink); --color-ink-700: #3c3636; --color-ink-500: var(--sumup-ink-subtle); --color-ink-300: var(--sumup-border); --color-white: #ffffff; --color-black: var(--color-ink-900); --color-gray-light: var(--sumup-surface-subtle); --color-gray-dark: var(--color-ink-500); --color-primary: var(--sumup-ink); --color-primary-hover: var(--sumup-ink-hover); --color-primary-dark: var(--sumup-ink); --color-secondary: var(--sumup-pink); --color-fire: var(--color-primary); --color-gold: var(--sumup-yellow); --color-gold-soft: var(--sumup-gold); --color-surface: var(--sumup-surface); --color-surface-strong: #ffffff; --color-page-bg: var(--sumup-kv-bg); --color-card-bg: #ffffff; --color-border: var(--sumup-border); --color-border-strong: rgba(30, 28, 28, 0.4); --color-text: var(--sumup-ink); --color-text-muted: var(--sumup-ink-subtle); --color-text-soft: var(--sumup-ink-placeholder); --color-text-dark: var(--sumup-ink); --color-input-bg: #ffffff; --color-error: var(--sumup-danger-text); --color-error-soft: var(--sumup-danger); --color-success: var(--sumup-success); --color-success-soft: #89ec90; --color-btn-disabled: var(--sumup-surface-highlight); --color-btn-disabled-text: rgba(30, 28, 28, 0.5); /* Botões — Circuit UI (sumup.com): raio 12px, borda 1px, SumUp Narrow semibold 17px */ --btn-h: 48px; --btn-h-sm: 40px; --btn-radius: 12px; --btn-radius-sm: 10px; --btn-px: 24px; --btn-px-sm: 16px; --btn-fs: 17px; --btn-fs-sm: 15px; --btn-fw: 600; --btn-lh: 22px; --btn-border-w: 1px; --btn-ink: var(--sumup-ink); /* Destaque (amarelo) — ação principal / cadastro */ --btn-yellow-bg: var(--sumup-yellow); --btn-yellow-bg-hover: var(--sumup-yellow-hover); --btn-yellow-bg-pressed: #d9ad14; --btn-yellow-fg: var(--sumup-ink); /* Padrão (preto) */ --btn-dark-bg: var(--sumup-ink); --btn-dark-bg-hover: #3f3a3a; --btn-dark-bg-pressed: #756c6c; --btn-dark-fg: var(--sumup-on-ink); /* Secundário (contorno preto) */ --btn-outline-border: var(--sumup-ink); --btn-outline-bg: transparent; --btn-outline-bg-hover: rgba(30, 28, 28, 0.06); --btn-outline-bg-pressed: rgba(30, 28, 28, 0.12); --btn-outline-fg: var(--sumup-ink); /* Neutro (cinza) */ --btn-gray: var(--sumup-surface-neutral); --btn-gray-hover: var(--sumup-surface-highlight); --btn-gray-pressed: #d9d6c7; --btn-disabled-bg: rgba(30, 28, 28, 0.1); --btn-disabled-fg: rgba(30, 28, 28, 0.5); --btn-disabled-border: rgba(30, 28, 28, 0.2); --btn-focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--sumup-ink); --color-focus-ring: rgba(255, 97, 242, 0.45); --font-heading: "SumUp Black", "SumUp Black fallback", Arial, system-ui, sans-serif; --font-body: "SumUp Narrow", "SumUp Narrow fallback", Arial, system-ui, -apple-system, "Segoe UI", sans-serif; --font-ui: var(--font-body); --font-display: var(--font-heading); --radius-sm: 8px; --radius-btn: 999px; --radius-card: 24px; --radius-input: 12px; --radius-modal: 24px; --radius-table: 24px; --radius-pill: 999px; --radius-xl: 32px; --radius-2xl: 40px; --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px; --space-5: 48px; --space-6: 64px; --space-7: 96px; --header-h: 72px; --wc-menu-h: 67px; --promo-encerrada-h: 0px; --countdown-h: 0px; /* Countdown sobrepoe o conteudo - nao entra no empurrao do layout */ --hero-stack-h: calc(var(--header-h) + var(--promo-encerrada-h, 0px)); --sumup-bp-mobile: 991px; --sumup-asset-kv: url("../assets/sumup/kvPreview.webp"); --sumup-asset-kv-mobile: url("../assets/sumup/kvPreview.webp"); --hero-kv-mobile-h: calc(100vw * 1920 / 1080); --hero-mobile-content-offset: clamp(1.6rem, calc(var(--hero-kv-mobile-h) * 0.12), 4rem); --hero-mobile-content-offset-flow: clamp(1.2rem, calc(var(--hero-kv-mobile-h) * 0.1), 3.2rem); --hero-mobile-content-offset-logged: clamp(1.4rem, calc(var(--hero-kv-mobile-h) * 0.11), 3.6rem); --container: 1120px; --container-narrow: 720px; --shadow-lg: 0 20px 54px rgba(30, 28, 28, 0.16); --shadow-card: 0 12px 36px rgba(30, 28, 28, 0.1); --glow-mint: 0 0 24px rgba(255, 97, 242, 0.45); --glow-teal: 0 0 24px rgba(30, 28, 28, 0.2); --glow-accent: var(--glow-mint); --glow-red: 0 0 18px rgba(210, 63, 4, 0.22); --glow-fire: var(--glow-teal); --glow-gold: 0 0 24px rgba(246, 203, 50, 0.5); --gradient-page: linear-gradient(180deg, #f5f6ee 0%, var(--sumup-kv-bg) 60%, #e9eadf 100%); --gradient-brand: linear-gradient(135deg, var(--sumup-pink) 0%, var(--sumup-lavender) 55%, var(--sumup-blue) 100%); --gradient-fire: linear-gradient(135deg, var(--sumup-ink) 0%, var(--sumup-dark) 100%); --gradient-sky: linear-gradient(160deg, var(--sumup-pink-light) 0%, var(--sumup-lavender) 45%, var(--sumup-blue) 100%); --gradient-hero-overlay: linear-gradient(to left, rgba(30, 28, 28, 0.6) 0%, rgba(30, 28, 28, 0.18) 35%, transparent 58%); /* Legacy aliases */ --color-green-deep: var(--color-primary-dark); --color-green: var(--color-primary); --color-green-mid: #3c3636; --color-green-dark: var(--color-primary-hover); --color-teal-deep: var(--color-primary-dark); --color-teal: var(--color-primary); --color-teal-mid: #3c3636; --color-mint: var(--color-brand-yellow); --color-accent: var(--color-primary); --color-accent-dark: var(--color-primary-dark); --c-orange1: var(--color-primary); --c-orange2: var(--color-primary); --c-orange3: var(--color-primary-dark); --c-teal1: var(--color-primary); --c-teal2: #3c3636; --c-teal3: #3c3636; --c-teal4: var(--color-primary-dark); --c-teal7: #2d2a2a; --c-red1: var(--color-primary); --c-red2: var(--color-primary); --c-maroon1: var(--color-primary-dark); --c-maroon2: var(--color-primary-dark); --c-wine: var(--color-black); --c-blue1: var(--sumup-lavender); --c-darkBlue1: var(--sumup-ink); --c-darkBlue2: var(--sumup-dark); --c-darkBlue3: var(--sumup-dark); --c-darkBlue4: var(--sumup-dark); --c-darkBlue5: var(--sumup-dark-elevated); --c-darkBlue6: var(--sumup-dark-subtle); --c-darkBlue7: var(--sumup-ink); --c-darkBlue8: var(--sumup-dark-highlight); --c-white: #ffffff; --c-black: var(--color-black); --c-black2: var(--sumup-ink-subtle); --c-blackform: var(--sumup-ink-placeholder); --c-gray: var(--sumup-surface-subtle); --c-gray2: var(--sumup-surface-neutral); --c-graydark: var(--sumup-ink-subtle); --c-check: var(--color-success); --c-error: var(--color-error); --c-error1: var(--color-error); --c-error2: var(--color-error-soft); --c-offwhite: var(--sumup-surface); --c-yellow1: var(--sumup-yellow); } /** * Barra de rolagem — identidade SumUp (Mais Tap, Mais Chances). * Use a classe .sumup-scrollbar ou aplique em áreas roláveis de modais (.fenix-popup). */ :root { --sumup-scrollbar-size: 7px; --sumup-scrollbar-track: rgba(255, 255, 255, 0.05); --sumup-scrollbar-track-edge: rgba(255, 255, 255, 0.08); --sumup-scrollbar-thumb-top: rgba(30, 28, 28, 0.95); --sumup-scrollbar-thumb-mid: rgba(30, 28, 28, 0.88); --sumup-scrollbar-thumb-bottom: rgba(30, 28, 28, 0.82); --sumup-scrollbar-thumb-hover-top: var(--color-primary); --sumup-scrollbar-thumb-hover-mid: var(--sumup-pink-hover); --sumup-scrollbar-thumb-hover-bottom: var(--sumup-ink-hover); } .sumup-scrollbar, .fenix-popup .modal-body, .fenix-popup .modal-dialog-scrollable .modal-body, .sumup-cookies-modal__body, .sumup-ai-panel__messages { scrollbar-width: thin; scrollbar-color: rgba(30, 28, 28, 0.62) var(--sumup-scrollbar-track); } .sumup-scrollbar::-webkit-scrollbar, .fenix-popup .modal-body::-webkit-scrollbar, .fenix-popup .modal-dialog-scrollable .modal-body::-webkit-scrollbar, .sumup-cookies-modal__body::-webkit-scrollbar, .sumup-ai-panel__messages::-webkit-scrollbar { width: var(--sumup-scrollbar-size); height: var(--sumup-scrollbar-size); } .sumup-scrollbar::-webkit-scrollbar-track, .fenix-popup .modal-body::-webkit-scrollbar-track, .fenix-popup .modal-dialog-scrollable .modal-body::-webkit-scrollbar-track, .sumup-cookies-modal__body::-webkit-scrollbar-track, .sumup-ai-panel__messages::-webkit-scrollbar-track { margin-block: 6px; border-radius: 999px; background: var(--sumup-scrollbar-track); box-shadow: inset 0 0 0 1px var(--sumup-scrollbar-track-edge); } .sumup-scrollbar::-webkit-scrollbar-thumb, .fenix-popup .modal-body::-webkit-scrollbar-thumb, .fenix-popup .modal-dialog-scrollable .modal-body::-webkit-scrollbar-thumb, .sumup-cookies-modal__body::-webkit-scrollbar-thumb, .sumup-ai-panel__messages::-webkit-scrollbar-thumb { min-height: 48px; border: 2px solid transparent; border-radius: 999px; background: linear-gradient( 180deg, var(--sumup-scrollbar-thumb-top) 0%, var(--sumup-scrollbar-thumb-mid) 52%, var(--sumup-scrollbar-thumb-bottom) 100% ); background-clip: padding-box; box-shadow: 0 0 10px rgba(255, 97, 242, 0.12); } .sumup-scrollbar::-webkit-scrollbar-thumb:hover, .fenix-popup .modal-body::-webkit-scrollbar-thumb:hover, .fenix-popup .modal-dialog-scrollable .modal-body::-webkit-scrollbar-thumb:hover, .sumup-cookies-modal__body::-webkit-scrollbar-thumb:hover, .sumup-ai-panel__messages::-webkit-scrollbar-thumb:hover { background: linear-gradient( 180deg, var(--sumup-scrollbar-thumb-hover-top) 0%, var(--sumup-scrollbar-thumb-hover-mid) 52%, var(--sumup-scrollbar-thumb-hover-bottom) 100% ); background-clip: padding-box; } .sumup-scrollbar::-webkit-scrollbar-corner, .fenix-popup .modal-body::-webkit-scrollbar-corner, .fenix-popup .modal-dialog-scrollable .modal-body::-webkit-scrollbar-corner, .sumup-cookies-modal__body::-webkit-scrollbar-corner, .sumup-ai-panel__messages::-webkit-scrollbar-corner { background: transparent; } /* Pop-ups — alinhados ao box de formulário (hero__vitrine-box) */ .fenix-popup .modal-dialog { max-width: min(92vw, 480px); } .fenix-popup .modal-dialog.modal-lg { max-width: min(92vw, 520px); } .modal-backdrop { --bs-backdrop-bg: var(--sumup-ink); --bs-backdrop-opacity: 0.6; } .fenix-popup .modal-content, .fenix-popup .modal-content.sumup-popup__shell { position: relative; border: none; border-radius: var(--radius-modal); background: var(--color-card-bg); color: var(--sumup-ink); overflow: hidden; box-shadow: var(--shadow-lg); backdrop-filter: none; -webkit-backdrop-filter: none; } /* Fechar — botão de ícone neutro (mesmo padrão do Centro de Preferências de Cookies) */ .fenix-popup .btn-fechar { position: absolute; top: 1.6rem; right: 1.6rem; z-index: 3; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: var(--btn-gray); font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--btn-ink); transition: background-color 0.2s ease; } .fenix-popup .btn-fechar:hover { background: var(--btn-gray-hover); color: var(--btn-ink); } .fenix-popup .btn-fechar:active { background: var(--btn-gray-pressed); } .fenix-popup .btn-fechar:focus-visible { outline: none; box-shadow: var(--btn-focus-ring); } .sumup-popup__inner, .fenix-popup .modal-body.popup-confirm-cadastro-body, .fenix-popup .popup-confirm-cadastro-body { padding: clamp(2.4rem, 3.2vw, 3.2rem); text-align: left; } .sumup-popup__eyebrow, .sumup-popup__head .sumup-popup__eyebrow, .page-eyebrow.sumup-popup__eyebrow { margin: 0 0 0.6rem; font-family: var(--font-ui, "SumUp Narrow", sans-serif); font-size: 1.2rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sumup-ink); text-align: left; } .sumup-popup__title, .fenix-popup .sumup-popup__title, .fenix-popup .sumup-popup__head .titulo, .fenix-popup .titulo:not(.mb-20) { margin: 0 0 0.6rem; font-family: var(--font-heading, "SumUp Black", sans-serif); font-size: clamp(2rem, 2.4vw, 2.4rem); font-weight: 700; line-height: 1.25; letter-spacing: 0; text-transform: none; color: var(--sumup-ink); text-align: left; } .sumup-popup__lead, .sumup-popup__lead.sumup-popup__text, .fenix-popup .descricao { margin: 0 0 1.6rem; font-family: var(--font-body, "SumUp Narrow", sans-serif); font-size: 1.4rem; line-height: 1.45; color: var(--sumup-ink-subtle); text-align: left; } .sumup-popup__head { padding: clamp(2.4rem, 3.2vw, 3.2rem) clamp(2.4rem, 3.2vw, 3.2rem) 0; background: transparent; text-align: left; color: var(--sumup-ink); } .sumup-popup__head::after { display: none; } .sumup-popup__icon, .meusnumeros-sucesso-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin: 0 0 1.6rem; border-radius: 50%; background: var(--sumup-surface-neutral); border: none; font-size: 2.2rem; color: var(--sumup-ink); box-shadow: none; } .sumup-popup__icon--success { background: var(--sumup-success-bg); color: var(--sumup-success); } .sumup-popup__icon--info { background: var(--sumup-surface-neutral); color: var(--sumup-ink); } .sumup-popup__icon--alert { background: var(--sumup-warning-bg); color: var(--sumup-warning); } .sumup-popup__dados, .popup-confirm-cadastro-dados { margin: 0 0 1.6rem; padding: 1.2rem 1.6rem; border-radius: 16px; background: var(--sumup-surface-subtle); border: 1px solid var(--sumup-border-subtle); } .popup-confirm-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 0.85rem 0; border-bottom: 1px solid var(--sumup-border-subtle); font-size: 1.35rem; line-height: 1.4; } .popup-confirm-row:last-child { border-bottom: none; padding-bottom: 0; } .popup-confirm-label { font-family: var(--font-ui, "SumUp Narrow", sans-serif); font-weight: 600; font-size: 1.2rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sumup-ink-subtle); flex-shrink: 0; } .popup-confirm-valor { text-align: right; color: var(--sumup-ink); font-weight: 500; word-break: break-word; } .popup-confirm-bar, .sumup-popup__bar { margin: 0 0 1.6rem; padding: 1.2rem 1.6rem; border-radius: 12px; background: var(--sumup-surface-subtle); border: 1px solid var(--sumup-border-subtle); font-family: var(--font-ui, "SumUp Narrow", sans-serif); font-weight: 600; font-size: 1.25rem; line-height: 1.45; text-align: left; color: var(--sumup-ink-subtle); } .sumup-popup__note, .login-modal-notice, .hero__cpf-hint.sumup-popup__note { margin: 1.6rem 0 0; padding: 1.2rem 1.6rem; border-radius: 12px; background: var(--sumup-surface-subtle); border: 1px solid var(--sumup-border-subtle); font-size: 1.25rem; line-height: 1.45; color: var(--sumup-ink-subtle); text-align: left; } .sumup-popup__note strong, .login-modal-notice strong { color: var(--sumup-ink); font-weight: 600; } .sumup-popup__text, .login-modal-body-text { margin: 0 0 1.2rem; font-size: 1.35rem; line-height: 1.5; color: var(--sumup-ink-subtle); text-align: left; } .sumup-popup__actions, .popup-confirm-cadastro-body .button, .fenix-popup .button { display: flex; flex-direction: column; gap: 1.2rem; margin-top: 1.6rem; } .sumup-popup__actions--row { flex-direction: row; flex-wrap: wrap; } .sumup-popup__actions .btn, .popup-confirm-cadastro-body .btn, .fenix-popup .button .btn { width: 100%; } .sumup-popup__actions--row .btn { flex: 1 1 0; width: auto; min-width: 14rem; } .fenix-popup .modal-body.text-center { text-align: left; } .fenix-popup .titulo.mb-20 { margin: 0 0 0.6rem; font-family: var(--font-heading, "SumUp Black", sans-serif); font-size: clamp(2rem, 2.4vw, 2.4rem); font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--sumup-ink); text-align: left; } .fenix-popup .descricao.mb-0 { margin-bottom: 0; } .fenix-popup .descricao strong { color: var(--sumup-ink); font-weight: 600; } .fenix-popup .button.mt-20 { margin-top: 1.6rem; } /* components/wc-menu/wc-menu.css */ /* Web Component — o header (fixed) entra no fluxo do body */ wc-menu { display: contents; } /* components/wc-footer/wc-footer.css */ /* Web Component — rodape SumUp */ .sumup-footer { position: relative; margin-top: auto; color: var(--sumup-ink); background: #f5f5f5; /* border-top: 1px solid rgba(30, 28, 28, 0.12); */ overflow: hidden; } .sumup-footer::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient( 90deg, transparent 0%, rgba(30, 28, 28, 0.18) 18%, rgba(30, 28, 28, 0.28) 50%, rgba(30, 28, 28, 0.18) 82%, transparent 100% ); box-shadow: none; } .sumup-footer__inner { position: relative; z-index: 1; max-width: var(--container, 1120px); margin: 0 auto; padding: clamp(4rem, 2.8vw, 1.85rem) var(--space-5); display: flex; flex-direction: column; gap: clamp(1rem, 2vw, 2.5rem); } /* —— CTA (título + botões) —— */ .sumup-footer__cta { display: flex; flex-direction: column; align-items: center; gap: 3rem; text-align: center; } .sumup-footer__cta-title { margin: 0; font-family: var(--font-heading); font-size: clamp(2.8rem, 4vw, 4.2rem); font-weight: 900; line-height: 1.1; letter-spacing: -0.02em; color: var(--sumup-ink); } .sumup-footer__cta-title span { display: inline-block; padding: 0.08em 0.45em 0.14em; border-radius: 999px; background: var(--sumup-pink); color: var(--sumup-ink); transform: rotate(-2deg); } .sumup-footer__cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; } .sumup-footer__btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.8rem; box-sizing: border-box; height: var(--btn-h, 48px); padding: 0 var(--btn-px, 24px); border: var(--btn-border-w, 1px) solid transparent; border-radius: var(--btn-radius, 12px); font-family: var(--font-body, "SumUp Narrow", sans-serif); font-size: var(--btn-fs, 17px); font-weight: var(--btn-fw, 600); line-height: var(--btn-lh, 22px); text-decoration: none; white-space: nowrap; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } .sumup-footer__btn:focus-visible { outline: none; box-shadow: var(--btn-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #1e1c1c); } /* Destaque — amarelo (cadastro) */ .sumup-footer__btn--primary { background: var(--btn-yellow-bg, #f6cb32); color: var(--btn-yellow-fg, #1e1c1c); } .sumup-footer__btn--primary:hover { background: var(--btn-yellow-bg-hover, #e9bc1f); color: var(--btn-yellow-fg, #1e1c1c); } .sumup-footer__btn--primary:active { background: var(--btn-yellow-bg-pressed, #d9ad14); } /* Secundário — contorno preto */ .sumup-footer__btn--secondary { background: var(--btn-outline-bg, transparent); border-color: var(--btn-outline-border, #1e1c1c); color: var(--btn-outline-fg, #1e1c1c); } .sumup-footer__btn--secondary:hover { background: var(--btn-outline-bg-hover, rgba(30, 28, 28, 0.06)); color: var(--btn-outline-fg, #1e1c1c); } .sumup-footer__btn--secondary:active { background: var(--btn-outline-bg-pressed, rgba(30, 28, 28, 0.12)); } .sumup-footer__btn i { font-size: 2rem; } /* —— Siga nas redes —— */ .sumup-footer__follow { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 2.4rem; padding: 2.4rem 0; border-top: 1px solid rgba(30, 28, 28, 0.12); border-bottom: 1px solid rgba(30, 28, 28, 0.12); } .sumup-footer__follow-label { margin: 0; font-family: var(--font-body); font-size: 1.6rem; font-weight: 700; color: var(--sumup-ink); } .sumup-footer__follow-icons { display: flex; align-items: center; } .sumup-footer__legal { margin: 0; width: 100%; text-align: center; font-family: var(--font-body); font-size: clamp(1.35rem, 1.6vw, 1.55rem); line-height: 1.2; color: var(--sumup-ink-subtle); } .sumup-footer__legal--company { font-size: clamp(1.2rem, 1.4vw, 1.4rem); color: #6b6b6b; } .sumup-footer__legal a { color: inherit; font-weight: inherit; text-decoration: underline; text-underline-offset: 0.15em; } .sumup-footer__legal a:hover, .sumup-footer__legal a:focus-visible { color: var(--sumup-ink); } .sumup-footer__bar { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(1rem, 2.2vw, 1.75rem); } /* —— Marca —— */ .sumup-footer__brand { display: flex; flex-direction: column; gap: 0.55rem; flex: 1 1 auto; min-width: 0; } .sumup-footer__logos { display: flex; align-items: center; gap: 0.75rem; } .sumup-footer__logos img { max-width: 300px; height: auto; width: 100%; /* filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4)); */ } .sumup-footer__logos-sep { width: 1px; height: 100px; background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.18), transparent); flex-shrink: 0; } .sumup-footer__tagline { margin: 0; max-width: 200px; font-family: var(--font-heading); font-size: clamp(1.05rem, 1.2vw, 1.2rem); font-weight: 900; letter-spacing: 0.04em; line-height: 1.25; text-transform: uppercase; text-align: center; color: var(--sumup-ink); } /* —— Divisor —— */ .sumup-footer__divider { flex-shrink: 0; width: 1px; align-self: stretch; min-height: 2.75rem; background: linear-gradient( 180deg, transparent 0%, rgba(30, 28, 28, 0.18) 35%, rgba(30, 28, 28, 0.18) 65%, transparent 100% ); } /* —— Redes sociais —— */ .sumup-footer__social { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 0; flex: 0 1 auto; min-width: min(100%, 15rem); } .sumup-footer__social-rule { display: block; height: 1px; margin: 0.2rem 0; border: none; background: linear-gradient( 90deg, transparent 0%, rgba(30, 28, 28, 0.2) 22%, rgba(30, 28, 28, 0.28) 50%, rgba(30, 28, 28, 0.2) 78%, transparent 100% ); box-shadow: none; opacity: 0.85; } .sumup-footer__cluster { display: flex; align-items: center; gap: 0.65rem; padding: 0.28rem 0; border: none; border-radius: 0; background: none; backdrop-filter: none; } .sumup-footer__cluster-label { font-family: var(--font-body); font-size: 1.2rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sumup-ink); white-space: nowrap; flex: 0 0 auto; min-width: 5.5rem; padding: 0; border: none; margin: 0; } .sumup-footer__cluster-icons { display: flex; align-items: center; gap: 0.35rem; flex: 1 1 auto; justify-content: flex-start; } .sumup-footer__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid transparent; background: transparent; color: var(--sumup-ink); font-size: 2.27rem; text-decoration: none; transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; } .sumup-footer__icon:hover, .sumup-footer__icon:focus-visible { color: var(--sumup-ink); background: transparent; border-color: transparent; box-shadow: none; transform: translateY(-1px); } /* —— Navegação (alinhada ao .site-nav) —— */ .sumup-footer__nav { display: flex; flex-wrap: nowrap; flex-direction: column; align-items: flex-end; justify-content: center; gap: 0; flex-shrink: 0; min-width: 0; } .sumup-footer__nav a, .sumup-footer__nav .sumup-footer__link-btn { position: relative; display: inline-flex; align-items: center; gap: 0; color: var(--sumup-ink); font-family: var(--font-heading); font-size: 1.6rem; font-weight: 600; letter-spacing: 0; text-transform: none; text-decoration: none; white-space: nowrap; padding: 0.8rem 1.2rem; border-radius: 0; transition: color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease; } .sumup-footer__nav a::after, .sumup-footer__nav .sumup-footer__link-btn::after { content: ""; position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1rem; height: 1px; background: rgb(31 31 31); transform: scaleX(0); transform-origin: center; transition: transform 0.3s ease, opacity 0.3s ease; opacity: 0.9; pointer-events: none; } .sumup-footer__nav .sumup-footer__link-btn { appearance: none; border: 0; background: none; cursor: pointer; text-align: left; } .sumup-footer__nav a:hover, .sumup-footer__nav a:focus-visible, .sumup-footer__nav .sumup-footer__link-btn:hover, .sumup-footer__nav .sumup-footer__link-btn:focus-visible { color: var(--sumup-ink); background: transparent; transform: none; } .sumup-footer__nav a:hover::after, .sumup-footer__nav a:focus-visible::after, .sumup-footer__nav .sumup-footer__link-btn:hover::after, .sumup-footer__nav .sumup-footer__link-btn:focus-visible::after { transform: scaleX(1); } /* —— Desktop: faixa única —— */ @media (min-width: 960px) { .sumup-footer__bar { flex-wrap: nowrap; justify-content: space-between; align-items: center; } .sumup-footer__brand { flex: 0 1 auto; align-items: center; } .sumup-footer__logos { justify-content: center; } .sumup-footer__social { flex: 0 0 auto; min-width: 14rem; /* max-width: 18rem; */ } .sumup-footer__nav { align-items: flex-end; justify-content: center; text-align: left; } } /* —— Tablet —— */ @media (min-width: 640px) and (max-width: 959px) { .sumup-footer__divider--nav { display: none; } .sumup-footer__nav { flex-direction: column; flex-wrap: nowrap; width: 100%; align-items: center; justify-content: center; gap: 0; padding-top: 0.25rem; border-top: 1px solid rgba(30, 28, 28, 0.08); } } /* —— Mobile —— */ @media (max-width: 639px) { .sumup-footer__bar { flex-direction: column; align-items: stretch; gap: 1rem; } .sumup-footer__brand { max-width: none; align-items: center; text-align: center; } .sumup-footer__logos { justify-content: center; } .sumup-footer__tagline { font-size: 1.1rem; max-width: none; } .sumup-footer__divider { width: 100%; height: 0px; min-height: 0; background: linear-gradient( 90deg, transparent 0%, rgba(255, 97, 242, 0.2) 50%, transparent 100% ); } .sumup-footer__social { align-items: center; min-width: 0; max-width: 20rem; margin: 0 auto; } .sumup-footer__cluster { width: 100%; justify-content: center; } .sumup-footer__cluster-label { min-width: 5rem; } .sumup-footer__social-rule { width: 100%; } .sumup-footer__nav { flex-direction: column; flex-wrap: nowrap; align-items: stretch; justify-content: center; gap: 0; width: 100%; } .sumup-footer__nav a, .sumup-footer__nav .sumup-footer__link-btn { display: block; width: 100%; box-sizing: border-box; text-align: center; white-space: normal; padding: 1rem 0.8rem; } .sumup-footer__nav a::after, .sumup-footer__nav .sumup-footer__link-btn::after { left: 0.8rem; right: 0.8rem; bottom: 0.4rem; } } /* —— Bloco final: navegação (acima do legal) + logo centralizado —— */ .sumup-footer__nav, .sumup-footer__bar { width: 100%; } .sumup-footer__nav { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.4rem 2.4rem; padding: 0; border-top: 0; } .sumup-footer__nav a, .sumup-footer__nav .sumup-footer__link-btn { display: inline-flex; width: auto; font-family: var(--nav-font, var(--font-heading)); font-size: 16px; font-weight: 600; line-height: 130%; text-align: center; white-space: nowrap; padding: 0.8rem 0.8rem; } .sumup-footer__nav a::after, .sumup-footer__nav .sumup-footer__link-btn::after { left: 0.8rem; right: 0.8rem; bottom: 0.4rem; } .sumup-footer__bar { flex-direction: column; flex-wrap: nowrap; align-items: center; justify-content: center; } .sumup-footer__brand { flex: 0 1 auto; align-items: center; margin: 0 auto; } .sumup-footer__logos { justify-content: center; } /* Itens da navegação: mesma tipografia do menu (--nav-font é escopada em .site-header) */ .sumup-footer__nav a, .sumup-footer__nav .sumup-footer__link-btn, .sumup-footer__nav a span, .sumup-footer__nav .sumup-footer__link-btn span { font-family: var(--font-body, "SumUp Narrow", sans-serif); font-size: 16px; font-weight: 600; line-height: 130%; letter-spacing: 0; color: var(--sumup-ink); } /* Sublinhado no hover/foco */ .sumup-footer__nav a::after, .sumup-footer__nav .sumup-footer__link-btn::after { content: ""; position: absolute; left: 0.8rem; right: 0.8rem; bottom: 0.5rem; height: 1px; background: var(--sumup-ink); opacity: 1; transform: scaleX(0); transform-origin: center; } .sumup-footer__nav a:hover::after, .sumup-footer__nav a:focus-visible::after, .sumup-footer__nav .sumup-footer__link-btn:hover::after, .sumup-footer__nav .sumup-footer__link-btn:focus-visible::after { transform: scaleX(1); } /* components/wc-countdown-sorteio/wc-countdown-sorteio.css */ /** * Faixa countdown — próximo sorteio (modelo SumUp 2025 + gradiente do footer). */ wc-countdown-sorteio { display: block; } wc-countdown-sorteio:not(.is-visible) { display: none; } /* Faixa fixa abaixo do menu — sobrepõe o conteúdo (não empurra o layout) */ wc-countdown-sorteio.is-after-header .sumup-countdown--panel { position: fixed; top: var(--header-h); left: 0; right: 0; z-index: 199; } /* —— Painel —— */ .sumup-countdown--panel { position: relative; overflow: hidden; min-height: 4rem; border-bottom: 1px solid rgba(255, 255, 255, 0.14); background: radial-gradient(ellipse 80% 120% at 50% -40%, rgba(255, 255, 255, 0.22) 0%, transparent 55%), linear-gradient(180deg, var(--color-offer-pink, var(--sumup-pink)) 0%, #e0207a 100%); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28); will-change: transform; } /* Recolhe: sobe por trás do menu */ .sumup-countdown--panel.is-closing { animation: sumup-countdown-slide-up 0.48s cubic-bezier(0.4, 0, 0.2, 1) forwards; pointer-events: none; } /* Surge: desce por trás do menu */ .sumup-countdown--panel.is-opening { animation: sumup-countdown-slide-down 0.48s cubic-bezier(0.22, 1, 0.36, 1) forwards; } @keyframes sumup-countdown-slide-up { from { transform: translateY(0); } to { transform: translateY(-100%); } } @keyframes sumup-countdown-slide-down { from { transform: translateY(-100%); } to { transform: translateY(0); } } .sumup-countdown__inner { position: relative; display: flex; align-items: center; justify-content: center; gap: 0.75rem; width: 100%; margin: 0 auto; padding: 0.55rem calc(var(--space-3) + 2.2rem) 0.55rem var(--space-3); min-height: 4rem; } .sumup-countdown__count { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.7rem; } .sumup-countdown__description { margin: 0 1.2rem 0 0; color: #fff; font-family: var(--font-body); font-weight: 500; font-size: 1.4rem; text-align: center; white-space: nowrap; } .sumup-countdown__unit { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 40px; height: 30px; padding: 0; border-radius: 0.6rem; background: rgba(255, 255, 255, 0.18); border: 1px solid rgba(255, 255, 255, 0.35); box-shadow: none; } .sumup-countdown__value { font-family: var(--font-body); font-size: 1.4rem; font-weight: 500; line-height: 1; color: #fff; font-variant-numeric: tabular-nums; transition: transform 0.25s ease, color 0.25s ease; } .sumup-countdown__value.is-tick { transform: scale(1.06); color: #fff; } .sumup-countdown__caption.mobile { display: none; } .sumup-countdown__caption-desk.desktop { display: inline-block; color: #fff; font-family: var(--font-body); font-weight: 400; font-size: 1.4rem; text-align: center; } .sumup-countdown__close { position: absolute; top: 50%; right: max(0.65rem, env(safe-area-inset-right, 0px)); transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 50%; background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.75); cursor: pointer; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease; } .sumup-countdown__close:hover { background: rgba(255, 255, 255, 0.28); border-color: rgba(255, 255, 255, 0.7); color: #fff; transform: translateY(-50%) scale(1.06); } .sumup-countdown__close:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45); } .sumup-countdown__close i { font-size: 1.0625rem; } /* —— FAB reabrir —— */ .sumup-countdown-fab { display: none; position: relative; isolation: isolate; align-items: center; gap: 0.85rem; min-height: 3.25rem; padding: 0.7rem 1.35rem 0.7rem 0.8rem; border: 0px solid rgba(255, 97, 242, 0.35); border-radius: var(--radius-pill); background: radial-gradient(ellipse 80% 120% at 20% 50%, rgba(255, 255, 255, 0.22) 0%, transparent 60%), linear-gradient(180deg, var(--color-offer-pink, var(--sumup-pink)) 0%, #e0207a 100%); color: #fff; cursor: default; box-shadow: 0 10px 28px rgba(255, 60, 150, 0.45), 0 4px 10px rgba(0, 0, 0, 0.25); transition: transform 0.5s ease-in-out, filter 0.5s ease-in-out, box-shadow 0.5s ease-in-out, border-color 0.5s ease-in-out; animation: sumup-countdown-fab-in 0.5s ease-in-out; } wc-countdown-sorteio.is-collapsed .sumup-countdown-fab { display: inline-flex; } wc-countdown-sorteio.is-after-header.is-collapsed { position: fixed; top: calc(var(--header-h) + var(--promo-encerrada-h, 0px) + -0.5rem); left: max(1rem, env(safe-area-inset-left, 0px)); z-index: 199; width: 0; height: 0; overflow: visible; pointer-events: none; } wc-countdown-sorteio.is-after-header.is-collapsed .sumup-countdown-fab { pointer-events: none; } .sumup-countdown-fab__glow { position: absolute; inset: -1px; z-index: 0; border-radius: inherit; background: radial-gradient( 120% 90% at 20% 50%, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.12) 42%, transparent 72% ); opacity: 0; transition: opacity 0.28s ease; pointer-events: none; } .sumup-countdown-fab__icon { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; color: var(--color-offer-pink, var(--sumup-pink)); font-size: 1.3rem; flex-shrink: 0; } .sumup-countdown-fab__text { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 0.28rem; min-width: max-content; padding-right: 0.15rem; } .sumup-countdown-fab__label { font-family: var(--font-ui); font-size: 1.3rem; font-weight: 700; letter-spacing: 0; text-transform: none; color: #fff; line-height: 1.15; white-space: nowrap; } .sumup-countdown-fab__time { font-family: var(--font-body); font-size: 1.35rem; letter-spacing: 0rem; line-height: 1.2; font-variant-numeric: tabular-nums; color: #fff; white-space: nowrap; } @keyframes sumup-countdown-fab-in { 0% { opacity: 0; transform: scale(0.9); filter: brightness(1.1); } 100% { opacity: 1; transform: scale(1); filter: brightness(1); } } @media (max-width: 991px) { .sumup-countdown__count { gap: 0.35rem; } .sumup-countdown__description { margin: 0 0.75rem 0 0; font-size: 1.2rem; } .sumup-countdown__unit { width: 40px; height: 30px; border-radius: 0.6rem; } .sumup-countdown__value { font-size: 1.4rem; } .sumup-countdown__caption-desk.desktop { display: none; } .sumup-countdown__caption.mobile { display: block; margin-top: 0.05rem; font-size: 0.95rem; font-weight: 400; color: rgba(255, 255, 255, 0.9); letter-spacing: 0.02em; text-transform: none; } .sumup-countdown__unit { height: auto; min-height: 30px; padding: 0.2rem 0 0.25rem; } wc-countdown-sorteio.is-after-header.is-collapsed { top: calc(var(--header-h) + var(--promo-encerrada-h, 0px) + 0.35rem); left: max(0.65rem, env(safe-area-inset-left, 0px)); } } @media (prefers-reduced-motion: reduce) { .sumup-countdown--panel.is-closing, .sumup-countdown--panel.is-opening, .sumup-countdown-fab { animation: none; } } /* css/layout.css */ :root { --oficial-bar-h: 0px; --header-h: 88px; } @media (min-width: 1200px) { :root { --header-h: 104px; } } /* Header: ver site-nav-dropdown.css (desktop) e site-nav-mobile.css (mobile) */ .site-main { padding-top: calc(var(--header-h) + var(--promo-encerrada-h, 0px)); min-height: 0; flex: 0 0 auto; /* flex: 1 0 auto; */ max-width: 100%; overflow-x: clip; } .site-main--flush { padding-top: 0; } wc-footer { display: block; flex-shrink: 0; z-index: 2; } .site-footer { padding: var(--space-4) var(--space-3); text-align: center; font-size: 1.92rem; color: var(--sumup-ink-subtle); border-top: 1px solid rgba(30, 28, 28, 0.12); background: #f5f5f5; } .page-card { background: rgba(255, 255, 255, 0.96); border: 1px solid rgba(30, 28, 28, 0.14); backdrop-filter: blur(16px); border-radius: var(--radius-card); padding: clamp(2rem, 4vw, 3.2rem); box-shadow: var(--shadow-card); } .page-eyebrow { margin: 0 0 var(--space-1); font-family: var(--font-body); font-size: 1.1rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-primary-dark); } .page-title { font-family: var(--font-heading); font-size: clamp(2.8rem, 5vw, 3rem); font-weight: 800; letter-spacing: 0; text-transform: none; margin: 0 0 var(--space-2); line-height: 1.05; color: var(--color-primary-dark); /* text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6); */ } .page-subtitle { margin: 0 0 var(--space-4); color: var(--color-text-muted); font-size: 1.45rem; } /** * Page hero — título + subtítulo + espaçamento padrão das páginas internas * (exceto index). Fonte de verdade: mesmo ritmo do Regulamento. */ .page-hero, .regulamento-hero, .duvidas-hero, .catalog-hero, .atendimento-header, .section.meusnumeros .header-section { position: relative; width: min(100% - 4.8rem, 104rem); margin: 6.4rem auto 1.28rem; padding: 0 0 1.28rem; box-sizing: border-box; text-align: center; } .page-hero::before, .regulamento-hero.catalog-hero::before, .catalog-hero::before { display: none; } .page-hero .page-eyebrow, .regulamento-hero .page-eyebrow, .duvidas-hero .page-eyebrow, .catalog-hero .page-eyebrow, .atendimento-header .page-eyebrow { display: none; } .page-hero__title, .page-hero .page-title, .regulamento-hero__title, .regulamento-hero.catalog-hero .catalog-hero__title, .duvidas-hero .page-title, .catalog-hero__title, .atendimento-header .page-title, .section.meusnumeros .header-section h2 { margin: 0 0 1.2rem; font-family: var(--font-heading, "SumUp Black", sans-serif); font-size: clamp(2.56rem, 3.84vw, 4.48rem); font-weight: 700; line-height: 1.1; letter-spacing: 0; text-transform: none; color: #000; text-align: center; text-shadow: none; } .page-hero__lead, .page-hero .page-subtitle, .regulamento-hero__lead, .regulamento-hero.catalog-hero .catalog-hero__lead, .duvidas-hero__lead, .catalog-hero__lead, .atendimento-header__lead, .section.meusnumeros .header-section h3 { width: 100%; max-width: 72rem; margin: 0 auto; padding: 0; font-family: var(--font-body, "SumUp Narrow", sans-serif); font-size: 2rem; font-weight: 400; line-height: 2.5rem; color: #000; text-align: center; } @media (max-width: 991px) { .page-hero, .regulamento-hero, .duvidas-hero, .catalog-hero, .atendimento-header, .section.meusnumeros .header-section { width: min(100% - 3.2rem, 100%); margin-top: 8rem; padding-bottom: 0rem; /* padding-bottom: 2.4rem; */ } .page-hero__title, .page-hero .page-title, .regulamento-hero__title, .regulamento-hero.catalog-hero .catalog-hero__title, .duvidas-hero .page-title, .catalog-hero__title, .atendimento-header .page-title, .section.meusnumeros .header-section h2 { font-size: clamp(2.24rem, 6.4vw, 2.88rem); } .page-hero__lead, .page-hero .page-subtitle, .regulamento-hero__lead, .regulamento-hero.catalog-hero .catalog-hero__lead, .duvidas-hero__lead, .catalog-hero__lead, .atendimento-header__lead, .section.meusnumeros .header-section h3 { font-size: 1.6rem; line-height: 2.2rem; } } .success-panel { max-width: 560px; margin: var(--space-6) auto; text-align: center; padding: var(--space-3); } .success-panel__icon { font-size: 4.8rem; color: var(--color-gold); margin-bottom: var(--space-3); } .success-panel__actions { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-4); } /* css/site-nav-mobile.css */ /* Menu mobile — barra flutuante + painel (modelo SumUp) */ .site-nav-toggle { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 40px !important; height: 40px !important; margin: 0 0 0 auto; padding: 0; border: 0 !important; border-radius: 8px !important; background: transparent !important; cursor: pointer; flex-shrink: 0; pointer-events: auto; } .site-nav-toggle__bar { display: block; width: 20px; height: 2px; border-radius: 2px; background: var(--sumup-ink); transition: transform 0.28s ease, opacity 0.2s ease, width 0.2s ease; transform-origin: center; } .site-header.is-nav-open .site-nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); } .site-header.is-nav-open .site-nav-toggle__bar:nth-child(2) { opacity: 0; width: 0; } .site-header.is-nav-open .site-nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } body.nav-open { overflow: hidden; } @media (max-width: 1199px) { .site-header.is-nav-open { background: var(--sumup-surface-neutral); pointer-events: auto; } .site-header .site-header__bar { height: 64px; padding: 0 12px; } .site-header .site-header__logo { height: 36px; max-width: min(66vw, 20rem); } .site-header .site-nav-toggle { display: flex; } .site-header .site-header__overlay { display: none; } .site-header .site-nav { position: fixed; top: 80px; left: 0; right: 0; bottom: 0; z-index: 40; display: none; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; height: auto; box-sizing: border-box; padding: 16px 16px calc(96px + env(safe-area-inset-bottom, 0px)); background: #ffffff; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; pointer-events: auto; } .site-header.is-stuck .site-nav { top: 64px; } .site-header.is-nav-open .site-nav { display: flex; animation: site-nav-flip-down 0.5s ease-out forwards; } .site-header .site-nav__menu { flex-direction: column; align-items: stretch; height: auto; gap: 0; } .site-header .site-nav__item { display: block; height: auto; border-bottom: 1px solid rgba(30, 28, 28, 0.1); } .site-header .site-nav__trigger { display: none; } .site-header .site-nav__chevron { display: none; } .site-header .site-nav__panel { position: static; visibility: visible; opacity: 1; padding: 16px 0 8px; } .site-header .site-nav__panel-inner { display: block; } .site-header .site-nav__panel-title { margin-bottom: 4px; } .site-header .site-nav__panel-list { gap: 0; } .site-header .site-nav__panel a.site-nav__sublink { padding: 20px 0; border-bottom: 1px solid rgba(30, 28, 28, 0.1); font-size: var(--nav-fs-body); line-height: var(--nav-lh-body); } .site-header .site-nav__panel-list > a.site-nav__sublink:last-child { border-bottom: 0; } .site-header .site-nav__panel-aside { display: none; } .site-header .site-nav__link { display: flex; width: 100%; height: auto; padding: 20px 0; font-size: var(--nav-fs-body); line-height: var(--nav-lh-body); } .site-header .site-nav__link.is-active { font-weight: var(--nav-fw-bold); } .site-header .site-nav__actions { flex-direction: column; align-items: stretch; height: auto; gap: 8px; margin-top: 24px; } .site-header .site-nav-account { flex-direction: column; align-items: stretch; } .site-header .site-nav a.site-nav__btn { width: 100%; } } /* css/forms.css */ /* SumUp Black (títulos) e SumUp Narrow variável 300–700 (corpo). Licença de uso web a confirmar (P-14). */ /* Peso único: o intervalo 100–900 evita negrito sintético quando o título pede 700/800. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.woff2") format("woff2"), url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.woff2") format("woff2"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; } /* Subset latino (npm run build:fonts). Declarado depois: o navegador usa ele para estes caracteres * e só baixa a fonte completa (acima) se a página tiver grego/cirílico. Manter o range igual ao do script. */ @font-face { font-family: "SumUp Black"; src: url("../fonts/font-sumup/SumUpLGC/SumUpLGC-Black-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "SumUp Narrow"; src: url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2-variations"), url("../fonts/font-sumup/SumUpNarrow/SumUpNarrowLGC-VF-latin.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Fallbacks métricos (mesmos ajustes do site sumup.com) */ @font-face { font-family: "SumUp Black fallback"; src: local("Arial Black"), local("Arial Bold"), local("Arial"); font-weight: 100 900; size-adjust: 90.1%; ascent-override: 102%; descent-override: 28%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial"); font-weight: 300 500; size-adjust: 95%; ascent-override: 101.1%; descent-override: 26.6%; line-gap-override: 0%; } @font-face { font-family: "SumUp Narrow fallback"; src: local("Arial Bold"), local("Arial"); font-weight: 600 700; size-adjust: 90%; ascent-override: 101%; descent-override: 26.6%; line-gap-override: 0%; } :root { /* SumUp — paleta do site (Circuit UI) + complementos do KV "Mais Tap, Mais Chances" */ --sumup-pink: #ff61f2; --sumup-pink-hover: #eb58df; --sumup-pink-pressed: #da4ece; --sumup-pink-strong: #b342a9; --sumup-pink-text: #a33e9a; --sumup-pink-soft: #ffe4fd; --sumup-pink-light: #ffacf8; --sumup-pink-bag: #ff8ef3; --sumup-ink: #1e1c1c; --sumup-ink-box: #1c1a1a; --sumup-ink-hover: #494a4a; --sumup-ink-pressed: #696969; --sumup-ink-subtle: #706464; --sumup-ink-placeholder: #76716b; --sumup-on-ink: #fbfbf9; --sumup-on-ink-subtle: rgba(251, 251, 249, 0.7); --sumup-surface: #fbfbf9; --sumup-surface-subtle: #f5f4ed; --sumup-surface-neutral: #f0eee7; --sumup-surface-highlight: #e8e6dc; --sumup-kv-bg: #f0f1e7; --sumup-border-subtle: #e3e2d6; --sumup-border: #d0cdc3; --sumup-divider: #e7e6df; --sumup-dark: #250723; --sumup-dark-subtle: #3a1037; --sumup-dark-highlight: #63215e; --sumup-dark-elevated: #322430; --sumup-yellow: #f6cb32; --sumup-yellow-hover: #e9bc1f; --sumup-blue: #2f98eb; --sumup-lavender: #9a9def; --sumup-gold: #fffbcf; --sumup-terracotta: #5d1a03; --sumup-leaf: #174104; --sumup-success: #1e862d; --sumup-success-text: #3c7411; --sumup-success-bg: #dff4e2; --sumup-danger: #d23f04; --sumup-danger-text: #b13606; --sumup-danger-bg: #ffdacc; --sumup-warning: #da7603; --sumup-warning-bg: #feeed5; /* Nomes semânticos usados no CSS herdado — todos apontam para a paleta SumUp */ --color-brand-lime: var(--sumup-pink); --color-brand-green: var(--sumup-pink-strong); --color-brand-green-dark: var(--sumup-ink); --color-offer-mint: var(--sumup-lavender); --color-offer-blue: var(--sumup-blue); --color-offer-yellow: var(--sumup-yellow); --color-offer-offwhite: var(--sumup-surface); --color-offer-pink: var(--sumup-pink); --color-brand-yellow: var(--sumup-pink); --color-brand-yellow-strong: var(--sumup-pink-hover); --color-brand-yellow-soft: var(--sumup-pink-soft); --color-brand-blue: var(--sumup-ink); --color-brand-blue-hover: var(--sumup-ink-hover); --color-brand-blue-active: var(--sumup-ink-pressed); --color-ink-900: var(--sumup-ink); --color-ink-700: #3c3636; --color-ink-500: var(--sumup-ink-subtle); --color-ink-300: var(--sumup-border); --color-white: #ffffff; --color-black: var(--color-ink-900); --color-gray-light: var(--sumup-surface-subtle); --color-gray-dark: var(--color-ink-500); --color-primary: var(--sumup-ink); --color-primary-hover: var(--sumup-ink-hover); --color-primary-dark: var(--sumup-ink); --color-secondary: var(--sumup-pink); --color-fire: var(--color-primary); --color-gold: var(--sumup-yellow); --color-gold-soft: var(--sumup-gold); --color-surface: var(--sumup-surface); --color-surface-strong: #ffffff; --color-page-bg: var(--sumup-kv-bg); --color-card-bg: #ffffff; --color-border: var(--sumup-border); --color-border-strong: rgba(30, 28, 28, 0.4); --color-text: var(--sumup-ink); --color-text-muted: var(--sumup-ink-subtle); --color-text-soft: var(--sumup-ink-placeholder); --color-text-dark: var(--sumup-ink); --color-input-bg: #ffffff; --color-error: var(--sumup-danger-text); --color-error-soft: var(--sumup-danger); --color-success: var(--sumup-success); --color-success-soft: #89ec90; --color-btn-disabled: var(--sumup-surface-highlight); --color-btn-disabled-text: rgba(30, 28, 28, 0.5); /* Botões — Circuit UI (sumup.com): raio 12px, borda 1px, SumUp Narrow semibold 17px */ --btn-h: 48px; --btn-h-sm: 40px; --btn-radius: 12px; --btn-radius-sm: 10px; --btn-px: 24px; --btn-px-sm: 16px; --btn-fs: 17px; --btn-fs-sm: 15px; --btn-fw: 600; --btn-lh: 22px; --btn-border-w: 1px; --btn-ink: var(--sumup-ink); /* Destaque (amarelo) — ação principal / cadastro */ --btn-yellow-bg: var(--sumup-yellow); --btn-yellow-bg-hover: var(--sumup-yellow-hover); --btn-yellow-bg-pressed: #d9ad14; --btn-yellow-fg: var(--sumup-ink); /* Padrão (preto) */ --btn-dark-bg: var(--sumup-ink); --btn-dark-bg-hover: #3f3a3a; --btn-dark-bg-pressed: #756c6c; --btn-dark-fg: var(--sumup-on-ink); /* Secundário (contorno preto) */ --btn-outline-border: var(--sumup-ink); --btn-outline-bg: transparent; --btn-outline-bg-hover: rgba(30, 28, 28, 0.06); --btn-outline-bg-pressed: rgba(30, 28, 28, 0.12); --btn-outline-fg: var(--sumup-ink); /* Neutro (cinza) */ --btn-gray: var(--sumup-surface-neutral); --btn-gray-hover: var(--sumup-surface-highlight); --btn-gray-pressed: #d9d6c7; --btn-disabled-bg: rgba(30, 28, 28, 0.1); --btn-disabled-fg: rgba(30, 28, 28, 0.5); --btn-disabled-border: rgba(30, 28, 28, 0.2); --btn-focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--sumup-ink); --color-focus-ring: rgba(255, 97, 242, 0.45); --font-heading: "SumUp Black", "SumUp Black fallback", Arial, system-ui, sans-serif; --font-body: "SumUp Narrow", "SumUp Narrow fallback", Arial, system-ui, -apple-system, "Segoe UI", sans-serif; --font-ui: var(--font-body); --font-display: var(--font-heading); --radius-sm: 8px; --radius-btn: 999px; --radius-card: 24px; --radius-input: 12px; --radius-modal: 24px; --radius-table: 24px; --radius-pill: 999px; --radius-xl: 32px; --radius-2xl: 40px; --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px; --space-5: 48px; --space-6: 64px; --space-7: 96px; --header-h: 72px; --wc-menu-h: 67px; --promo-encerrada-h: 0px; --countdown-h: 0px; /* Countdown sobrepoe o conteudo - nao entra no empurrao do layout */ --hero-stack-h: calc(var(--header-h) + var(--promo-encerrada-h, 0px)); --sumup-bp-mobile: 991px; --sumup-asset-kv: url("../assets/sumup/kvPreview.webp"); --sumup-asset-kv-mobile: url("../assets/sumup/kvPreview.webp"); --hero-kv-mobile-h: calc(100vw * 1920 / 1080); --hero-mobile-content-offset: clamp(1.6rem, calc(var(--hero-kv-mobile-h) * 0.12), 4rem); --hero-mobile-content-offset-flow: clamp(1.2rem, calc(var(--hero-kv-mobile-h) * 0.1), 3.2rem); --hero-mobile-content-offset-logged: clamp(1.4rem, calc(var(--hero-kv-mobile-h) * 0.11), 3.6rem); --container: 1120px; --container-narrow: 720px; --shadow-lg: 0 20px 54px rgba(30, 28, 28, 0.16); --shadow-card: 0 12px 36px rgba(30, 28, 28, 0.1); --glow-mint: 0 0 24px rgba(255, 97, 242, 0.45); --glow-teal: 0 0 24px rgba(30, 28, 28, 0.2); --glow-accent: var(--glow-mint); --glow-red: 0 0 18px rgba(210, 63, 4, 0.22); --glow-fire: var(--glow-teal); --glow-gold: 0 0 24px rgba(246, 203, 50, 0.5); --gradient-page: linear-gradient(180deg, #f5f6ee 0%, var(--sumup-kv-bg) 60%, #e9eadf 100%); --gradient-brand: linear-gradient(135deg, var(--sumup-pink) 0%, var(--sumup-lavender) 55%, var(--sumup-blue) 100%); --gradient-fire: linear-gradient(135deg, var(--sumup-ink) 0%, var(--sumup-dark) 100%); --gradient-sky: linear-gradient(160deg, var(--sumup-pink-light) 0%, var(--sumup-lavender) 45%, var(--sumup-blue) 100%); --gradient-hero-overlay: linear-gradient(to left, rgba(30, 28, 28, 0.6) 0%, rgba(30, 28, 28, 0.18) 35%, transparent 58%); /* Legacy aliases */ --color-green-deep: var(--color-primary-dark); --color-green: var(--color-primary); --color-green-mid: #3c3636; --color-green-dark: var(--color-primary-hover); --color-teal-deep: var(--color-primary-dark); --color-teal: var(--color-primary); --color-teal-mid: #3c3636; --color-mint: var(--color-brand-yellow); --color-accent: var(--color-primary); --color-accent-dark: var(--color-primary-dark); --c-orange1: var(--color-primary); --c-orange2: var(--color-primary); --c-orange3: var(--color-primary-dark); --c-teal1: var(--color-primary); --c-teal2: #3c3636; --c-teal3: #3c3636; --c-teal4: var(--color-primary-dark); --c-teal7: #2d2a2a; --c-red1: var(--color-primary); --c-red2: var(--color-primary); --c-maroon1: var(--color-primary-dark); --c-maroon2: var(--color-primary-dark); --c-wine: var(--color-black); --c-blue1: var(--sumup-lavender); --c-darkBlue1: var(--sumup-ink); --c-darkBlue2: var(--sumup-dark); --c-darkBlue3: var(--sumup-dark); --c-darkBlue4: var(--sumup-dark); --c-darkBlue5: var(--sumup-dark-elevated); --c-darkBlue6: var(--sumup-dark-subtle); --c-darkBlue7: var(--sumup-ink); --c-darkBlue8: var(--sumup-dark-highlight); --c-white: #ffffff; --c-black: var(--color-black); --c-black2: var(--sumup-ink-subtle); --c-blackform: var(--sumup-ink-placeholder); --c-gray: var(--sumup-surface-subtle); --c-gray2: var(--sumup-surface-neutral); --c-graydark: var(--sumup-ink-subtle); --c-check: var(--color-success); --c-error: var(--color-error); --c-error1: var(--color-error); --c-error2: var(--color-error-soft); --c-offwhite: var(--sumup-surface); --c-yellow1: var(--sumup-yellow); } /* ========================================================================== Botões — padrão Circuit UI do site institucional SumUp 48px · raio 12px · borda 1px · padding 0 24px · SumUp Narrow 600 17px / 22px Variantes: .btn / .btn-dark → preto (padrão do projeto) .btn-primary → amarelo (destaque: ação principal, direcionamento para cadastro) .btn-secondary → contorno preto (apoio ao primário) .btn-gray → cinza (neutro, menor peso) Pares permitidos: contorno + amarelo · contorno + preto Tamanho: .btn-sm (40px · raio 10px) Aliases: .btn-yellow = primary · .btn-black = dark · .btn-outline = secondary · .btn-white = gray ========================================================================== */ /* :where() mantém especificidade de .btn para as variantes abaixo sobrescreverem as variáveis em / */ .btn, :where(button, a, input[type="submit"], input[type="button"]).btn { --btn-bg: var(--btn-dark-bg); --btn-bg-hover: var(--btn-dark-bg-hover); --btn-bg-pressed: var(--btn-dark-bg-pressed); --btn-fg: var(--btn-dark-fg); --btn-bd: transparent; box-sizing: border-box; position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.8rem; height: var(--btn-h); min-height: var(--btn-h); padding: 0 var(--btn-px); border: var(--btn-border-w) solid var(--btn-bd) !important; border-radius: var(--btn-radius); background: var(--btn-bg) !important; color: var(--btn-fg) !important; font-family: var(--font-body); font-size: var(--btn-fs); font-weight: var(--btn-fw); line-height: var(--btn-lh); letter-spacing: 0; text-align: center; text-transform: none; text-decoration: none; white-space: nowrap; overflow: hidden; cursor: pointer; box-shadow: none; animation: none; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; } .btn:hover:not(:disabled):not(.disabled) { background: var(--btn-bg-hover) !important; color: var(--btn-fg) !important; text-decoration: none; transform: none; } .btn:active:not(:disabled):not(.disabled) { background: var(--btn-bg-pressed) !important; } .btn:focus-visible { outline: none; box-shadow: var(--btn-focus-ring) !important; } /* Destaque — amarelo */ .btn-primary, .btn-yellow, .btn-orange { --btn-bg: var(--btn-yellow-bg); --btn-bg-hover: var(--btn-yellow-bg-hover); --btn-bg-pressed: var(--btn-yellow-bg-pressed); --btn-fg: var(--btn-yellow-fg); --btn-bd: transparent; } /* Padrão — preto */ .btn-dark, .btn-black { --btn-bg: var(--btn-dark-bg); --btn-bg-hover: var(--btn-dark-bg-hover); --btn-bg-pressed: var(--btn-dark-bg-pressed); --btn-fg: var(--btn-dark-fg); --btn-bd: transparent; } /* Secundário — contorno preto */ .btn-secondary, .btn-outline { --btn-bg: var(--btn-outline-bg); --btn-bg-hover: var(--btn-outline-bg-hover); --btn-bg-pressed: var(--btn-outline-bg-pressed); --btn-fg: var(--btn-outline-fg); --btn-bd: var(--btn-outline-border); } /* Neutro — cinza */ .btn-gray, .btn-white { --btn-bg: var(--btn-gray); --btn-bg-hover: var(--btn-gray-hover); --btn-bg-pressed: var(--btn-gray-pressed); --btn-fg: var(--btn-ink); --btn-bd: transparent; } .btn-sm { height: var(--btn-h-sm); min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); border-radius: var(--btn-radius-sm); font-size: var(--btn-fs-sm); line-height: 20px; } /* Desabilitado */ .btn:disabled, .btn.disabled { --btn-bg: var(--btn-disabled-bg); --btn-fg: var(--btn-disabled-fg); --btn-bd: transparent; opacity: 1; cursor: not-allowed; transform: none; box-shadow: none !important; } .btn-secondary:disabled, .btn-secondary.disabled, .btn-outline:disabled, .btn-outline.disabled { --btn-bg: transparent; --btn-bd: var(--btn-disabled-border); } .form-control, select.form-control { width: 100%; min-height: 48px; padding: 1.2rem 1.2rem; border: 1px solid rgba(0, 0, 0, 0.25) !important; border-radius: 6px !important; background: var(--color-input-bg) !important; color: var(--color-text-dark) !important; font-family: var(--font-body); font-size: 1.5rem; } .form-control::placeholder { color: var(--sumup-ink-subtle); opacity: 1; } select.form-control:has(option.option-placeholder:checked), select.form-control:invalid { color: var(--sumup-ink-subtle); } select.form-control option { color: var(--color-text-dark); } select.form-control option.option-placeholder { color: var(--sumup-ink-subtle); } .form-control:focus { border-color: var(--sumup-ink) !important; box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px var(--sumup-ink), 0 0 0 5px rgba(255, 97, 242, 0.4) !important; outline: none; } label.error { display: block; color: var(--color-error-soft); font-size: 1.2rem; margin-top: 0.2rem; } .form-check { display: grid; grid-template-columns: auto 1fr; align-items: start; column-gap: 1rem; row-gap: 0.2rem; margin-bottom: 1.2rem; padding-left: 0; text-align: left; } .form-check .form-check-input { float: none; margin-left: 0; } .form-check label, .custom-control-label { font-size: 1.3rem; line-height: 1.45; color: var(--color-text-muted); } .sumup-optin .form-check-input { width: 1.8rem; height: 1.8rem; margin-top: 0.2rem; accent-color: var(--color-primary); } .senha-regras { margin: var(--space-1) 0 var(--space-2); padding: var(--space-2); border-radius: var(--radius-input); background: rgba(30, 28, 28, 0.12); font-size: 1.25rem; } .senha-regra { display: flex; align-items: center; gap: 0.8rem; margin: 0.4rem 0; color: var(--color-text-soft); } .senha-regra.is-ok { color: var(--color-success-soft); } /* Receita foundation para tabelas globais */ .table, table.table { --bs-table-bg: #ffffff; --bs-table-striped-bg: #fffdea; --bs-table-hover-bg: var(--sumup-pink-soft); --bs-table-border-color: var(--color-border); color: var(--color-text); border-radius: var(--radius-table, 1.5rem); border-collapse: separate; border-spacing: 0; overflow: hidden; } .table-responsive, .table-wrap, .sumup-table-wrap, [class*="table-wrap"] { border-radius: var(--radius-table, 1.5rem); overflow: hidden; } .table thead th:first-child { border-top-left-radius: var(--radius-table, 1.5rem); } .table thead th:last-child { border-top-right-radius: var(--radius-table, 1.5rem); } .table:not(:has(thead)) tbody tr:first-child td:first-child { border-top-left-radius: var(--radius-table, 1.5rem); } .table:not(:has(thead)) tbody tr:first-child td:last-child { border-top-right-radius: var(--radius-table, 1.5rem); } .table tbody tr:last-child td:first-child { border-bottom-left-radius: var(--radius-table, 1.5rem); } .table tbody tr:last-child td:last-child { border-bottom-right-radius: var(--radius-table, 1.5rem); } .table thead th { border-bottom-color: var(--color-border-strong); color: var(--color-primary-dark); font-family: var(--font-ui); font-weight: 700; } /* css/home.css */ /* Hero — metade amarela (conteúdo) + metade KV */ .hero { position: relative; padding-top: var(--hero-stack-h); min-height: 100vh; min-height: 100dvh; background: var(--sumup-pink); overflow-x: clip; overflow-y: visible; max-width: 100%; } .hero img { user-select: none; -webkit-user-select: none; -webkit-user-drag: none; user-drag: none; pointer-events: none; } /* KV: metade direita no desktop — não invade a esquerda */ .hero:not(.hero--flow) .hero__media { position: absolute; top: var(--hero-stack-h); left: 50%; right: 0; bottom: 0; width: 50%; height: auto; overflow: hidden; pointer-events: none; z-index: 0; } .hero:not(.hero--flow) picture.hero__image--home, .hero:not(.hero--flow) .hero__image--home { width: 100%; height: 100%; min-height: 100%; } .hero:not(.hero--flow) picture.hero__image--home img, .hero:not(.hero--flow) .hero__image--home img { width: 100%; height: 100%; min-height: 100%; max-width: none; object-fit: cover; object-position: center center; } .hero:not(.hero--flow) .hero__image--cadastro { display: none !important; } /* Slideshow KV — crossfade em camadas (nova por cima da atual) */ .hero__slideshow { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; background: var(--sumup-pink); } .hero__slideshow .hero__image--home { position: absolute; inset: 0; margin: 0; opacity: 0; z-index: 0; pointer-events: none; /* transição controlada via JS no crossfade */ transition: none; } .hero__slideshow .hero__image--home.is-active, .hero__slideshow .hero__image--home.is-leaving { opacity: 1; } .hero__slideshow .hero__image--home.is-leaving { z-index: 1; } .hero__slideshow .hero__image--home.is-entering { z-index: 2; } .hero__media { position: relative; width: 100%; z-index: 0; line-height: 0; } picture.hero__image { display: block; width: 100%; height: 100%; } picture.hero__image img { display: block; width: 100%; height: 100%; object-fit: cover; } .hero__image { width: 100%; height: auto; } .hero__overlay { display: none; position: absolute; top: var(--hero-stack-h); left: 0; right: 0; bottom: 0; z-index: 1; pointer-events: none; } /* Elementos decorativos — acima do background, abaixo do conteúdo */ .hero__elementos { display: none; } .hero__elemento { position: absolute; width: 14%!important; width: 250px; line-height: 0; z-index: 2; } .hero__elemento picture, .hero__elemento img { display: block; width: 100%; height: auto; } .hero__elemento--1 img { animation: hero-elemento-spin 60s linear infinite; } .hero__elemento--2 img { animation: hero-elemento-spin 90s linear infinite; } .hero__elemento--hand img { animation: hero-elemento-pulse 1.4s ease-in-out infinite; } .hero__elemento--1 { top: calc(var(--hero-stack-h) + 1.2rem); right: -2rem; } .hero__elemento--2 { bottom: -2rem; left: 54%; transform: translateX(-50%); } .hero__elemento--hand { top: 61%; left: -2rem; width: 8% !important; max-width: 120px; transform: translateY(-50%); } .hero.hero--flow .hero__elementos, .hero.hero--logged .hero__elementos { /* display: none; */ } @keyframes hero-elemento-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes hero-elemento-pulse { 0%, 100% { transform: rotate(0deg) scale(1) translate(0, 0); } 15% { transform: rotate(-4deg) scale(1.04) translate(-2px, 1px); } 30% { transform: rotate(3deg) scale(1.08) translate(2px, -2px); } 45% { transform: rotate(-3deg) scale(1.05) translate(-1px, 2px); } 60% { transform: rotate(2deg) scale(1.1) translate(1px, -1px); } 75% { transform: rotate(-1deg) scale(1.03) translate(-1px, 0); } } @media (prefers-reduced-motion: reduce) { .hero__elemento img, .hero__selo-img { animation: none; } } .hero__content { position: relative; top: auto; left: auto; right: auto; height: auto; min-height: calc(100dvh - var(--hero-stack-h)); max-height: none; z-index: 2; display: block; width: 100%; max-width: 100%; margin: 0; padding: 0; box-sizing: border-box; pointer-events: none; overflow: visible; } /* Selo na metade amarela (esquerda) */ .hero__selo { position: absolute; top: 0; left: 0; width: 50%; height: 100%; display: flex; align-items: center; justify-content: center; padding: clamp(1.2rem, 3vh, 2.4rem) clamp(2rem, 4vw, 4.8rem); box-sizing: border-box; pointer-events: none; line-height: 0; z-index: 2; } .hero__selo picture { position: relative; display: block; width: min(100%, 520px); max-width: 520px; } @media (max-width: 991px) { .hero__selo picture { width: 100%; left: inherit; margin-top: 0; } } .hero__selo-img { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 28px rgba(0, 0, 0, 0.3)); transform-origin: center center; will-change: transform; } @keyframes hero-selo-wiggle { 0%, 12% { transform: rotate(0deg); } 18% { transform: rotate(-3.5deg); } 24% { transform: rotate(3.5deg); } 30% { transform: rotate(-2.5deg); } 36% { transform: rotate(2.5deg); } 42% { transform: rotate(-1.5deg); } 48% { transform: rotate(1deg); } 54%, 100% { transform: rotate(0deg); } } .hero.hero--flow .hero__selo { display: none; } .hero--flow .hero__image--home, .hero--flow .hero__slideshow { display: none !important; } .hero--flow .hero__image--cadastro:not([hidden]) { display: block !important; } /* Box login / logado — à esquerda da metade direita (mais imagem à vista) */ .hero__hub { position: absolute; top: 0; left: 50%; width: 50%; height: 100%; z-index: 3; display: flex; align-items: center; justify-content: flex-start; margin: 0; padding: clamp(1.6rem, 3vw, 3.2rem); box-sizing: border-box; pointer-events: none; } .hero__hub .hero__vitrine-box, .hero__hub .hero__logged-box, .hero__hub .page-card { width: min(100%, 42rem); margin: 0; pointer-events: auto; } .hero__cpf-form { display: flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; gap: 1.2rem; } .hero__cpf-form__field { flex: 1 1 16rem; min-width: 0; } .hero__cpf-form .form-control { min-height: 48px; padding: 1.2rem 1.4rem; background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 6px; font-size: 1.5rem; color: var(--color-text-dark); } .hero__cpf-form .form-control:focus { border-color: var(--sumup-ink); box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px var(--sumup-ink), 0 0 0 5px rgba(255, 97, 242, 0.4); outline: none; } .hero__cpf-form .btn { margin-top: 0; flex: 0 0 auto; width: auto; min-width: 14rem; } .hero__cpf-hint { margin-top: var(--space-2); font-size: 1.15rem; color: var(--color-text-soft); line-height: 1.45; } .hero__logged-actions { display: flex; flex-direction: column; gap: 1.2rem; } @media (min-width: 992px) { .hero__content { padding: 0; } } /* Desktop em resoluções menores / altura curta — amplia o hero para caber selo + login */ @media (min-width: 992px) and (max-width: 1440px) { .hero:not(.hero--flow):not(.hero--logged) { min-height: max(100dvh, 78rem); } .hero__selo picture { width: min(100%, 420px); max-width: 420px; } .hero__hub { padding: clamp(1.4rem, 2.4vw, 2.8rem); } } @media (min-width: 992px) and (max-height: 900px) { .hero:not(.hero--flow):not(.hero--logged) { min-height: max(100dvh, 86rem); } .hero__hub { align-items: center; padding-top: clamp(1.2rem, 2vh, 2.4rem); padding-bottom: clamp(1.2rem, 2vh, 2.4rem); } } @media (min-width: 992px) and (max-height: 760px) { .hero:not(.hero--flow):not(.hero--logged) { min-height: max(100dvh, 94rem); } } @media (max-width: 991px) { /* * O split 50/50 usa a altura do .hero__content — precisa ser maior que 100dvh * em telas baixas para o login + atalhos caberem sem cortar. */ .hero:not(.hero--flow):not(.hero--logged):not(.hero--hub-collapsed) { min-height: max(100dvh, 112rem); } /* KV: metade inferior — deslocada ~95% da altura do box de login */ .hero:not(.hero--flow) .hero__media { top: calc(50% + var(--hero-stack-h) / 2 + var(--hero-kv-nudge, calc(18rem * 0.95))); left: 0; right: 0; bottom: 0; width: 100%; height: auto; background: transparent; } .hero__content { width: 100%; max-width: 100%; min-height: max(calc(100dvh - var(--hero-stack-h)), 100rem); padding: 0; padding-bottom: 12rem; box-sizing: border-box; } /* Selo na metade superior amarela — respiro sob menu/countdown no mobile */ .hero__selo { top: 0; left: 0; width: 100%; height: 50%; padding: calc(var(--countdown-h, 0px) + 1.8rem) var(--space-3) var(--space-3); align-items: center; justify-content: center; box-sizing: border-box; } .hero__selo picture { width: min(88vw, 520px); max-width: 520px; top: 0; margin-top: 0.4rem; } /* Box no topo da metade inferior — altura auto para o card não estourar */ .hero__hub { top: 50%; left: 0; width: 100%; height: auto; min-height: 50%; align-items: flex-start; justify-content: center; padding: 0 1.6rem 1.6rem; } .hero__elementos { display: none; } } /* iPhone SE / alturas curtas — aproxima selo e login (menos vão amarelo) */ @media (max-width: 991px) and (max-height: 740px) { .hero:not(.hero--flow):not(.hero--logged):not(.hero--hub-collapsed) { min-height: max(100dvh, 112rem); } .hero__content { min-height: max(calc(100dvh - var(--hero-stack-h)), 100rem); padding-bottom: 12rem; } .hero__selo { height: 34%; align-items: flex-start; justify-content: center; padding-top: calc(var(--countdown-h, 0px) + 1rem); padding-bottom: 0.4rem; } .hero__selo picture { width: min(78vw, 420px); margin-top: 0; } .hero__hub { top: 34%; min-height: 66%; } .hero:not(.hero--flow) .hero__media { top: calc(34% + var(--hero-stack-h) / 2 + var(--hero-kv-nudge, calc(18rem * 0.95))); } } @media (max-width: 575px) { .hero__selo { padding-top: calc(var(--countdown-h, 0px) + 2.2rem); padding-bottom: var(--space-2); } .hero__selo picture { width: min(92vw, 520px); } } /* SE ~375×667 — aperta ainda mais o vão entre selo e card */ @media (max-width: 400px) and (max-height: 700px) { .hero:not(.hero--flow):not(.hero--logged):not(.hero--hub-collapsed) { min-height: max(100dvh, 108rem); } .hero__content { min-height: max(calc(100dvh - var(--hero-stack-h)), 96rem); padding-bottom: 11rem; } .hero__selo { height: 30%; align-items: flex-start; padding-top: calc(var(--countdown-h, 0px) + 0.6rem); padding-bottom: 0; padding-left: var(--space-2); padding-right: var(--space-2); } .hero__selo picture { width: min(76vw, 380px); margin-top: 0; } .hero__hub { top: 30%; min-height: 70%; padding-left: 1.2rem; padding-right: 1.2rem; } .hero:not(.hero--flow) .hero__media { top: calc(30% + var(--hero-stack-h) / 2 + var(--hero-kv-nudge, calc(18rem * 0.95))); } } @media (max-width: 375px) { .hero__hub { top: 33% !important; } .hero__selo { align-items: flex-start; padding-top: calc(var(--countdown-h, 0px) + 5.4rem) !important; } .hero__selo picture { margin-top: 0.8rem; } } /* 390–430px (ex.: iPhone 12/13/14) */ @media (min-width: 390px) and (max-width: 430px) { .hero__hub { top: 46% !important; } } /* css/home-shortcuts.css */ /** * Atalhos da home — barra de tabs na divisa Home → Como participar * Indicador amarelo desliza entre as tabs (js/home-shortcuts.js) */ /* Espaço no fim do hero para a barra sobrepor a divisa sem colidir com o CPF */ .hero__content { padding-bottom: clamp(5.6rem, 9vh, 9rem); } .home-shortcuts { --hs-bar-bg: #ffffff; --hs-indicator: var(--sumup-yellow); --hs-indicator-active: var(--sumup-yellow-hover); --hs-shadow: 0 10px 28px rgba(30, 28, 28, 0.12); --hs-text: var(--sumup-ink); --hs-ease: cubic-bezier(0.65, 0, 0.35, 1); position: relative; z-index: 6; width: min(100% - 3.2rem, 64rem); margin: -3.2rem auto -3.2rem; box-sizing: border-box; } .home-shortcuts__bar { position: relative; padding: 0.6rem; background: var(--hs-bar-bg); border: 1px solid var(--sumup-border-subtle); border-radius: 999px; box-shadow: var(--hs-shadow); } .home-shortcuts__list { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; } .home-shortcuts__tab { display: flex; align-items: center; justify-content: center; gap: 0.6rem; height: 4.8rem; padding: 0 1.6rem; border-radius: 999px; color: var(--hs-text); text-decoration: none; transition: background-color 0.3s ease; -webkit-tap-highlight-color: transparent; } /* Sem JS: o fundo amarelo fica na própria tab */ .home-shortcuts:not(.is-ready) .home-shortcuts__tab:hover { background: var(--hs-indicator); } .home-shortcuts__tab:focus-visible { outline: 2px solid var(--sumup-ink); outline-offset: 2px; } .home-shortcuts__label { font-family: var(--font-body, "SumUp Narrow", sans-serif); font-size: 1.6rem; font-weight: 700; line-height: 1.2; white-space: nowrap; } .home-shortcuts__chevron { flex: none; width: 1.4rem; height: 1.4rem; transform: rotate(180deg); transition: transform 0.3s ease; } .home-shortcuts__tab:hover .home-shortcuts__chevron, .home-shortcuts__tab:focus-visible .home-shortcuts__chevron { transform: translateY(0.2rem) rotate(180deg); } .home-shortcuts__indicator { position: absolute; top: 0.6rem; bottom: 0.6rem; left: 0; width: var(--hs-w, 0); border-radius: 999px; background: var(--hs-indicator); opacity: 0; transform: translateX(var(--hs-x, 0)); transition: transform 0.45s var(--hs-ease), width 0.45s var(--hs-ease), opacity 0.25s ease, background-color 0.2s ease; pointer-events: none; } .home-shortcuts.is-indicating .home-shortcuts__indicator { opacity: 1; } .home-shortcuts.is-pressing .home-shortcuts__indicator { background: var(--hs-indicator-active); } /* Primeira aparição: posiciona sem deslizar a partir da borda */ .home-shortcuts.is-instant .home-shortcuts__indicator { transition: opacity 0.25s ease; } /* Mobile */ @media (max-width: 767px) { .home-shortcuts { width: min(100% - 2.4rem, 100%); margin: -2.6rem auto -2.6rem; } .home-shortcuts__bar { padding: 0.4rem; } .home-shortcuts__indicator { top: 0.4rem; bottom: 0.4rem; } .home-shortcuts__tab { height: 4.4rem; padding: 0 0.6rem; } .home-shortcuts__label { font-size: 1.3rem; } .home-shortcuts__chevron { display: none; } } @media (prefers-reduced-motion: reduce) { .home-shortcuts__indicator, .home-shortcuts__tab, .home-shortcuts__chevron { transition: none; } .home-shortcuts__tab:hover .home-shortcuts__chevron, .home-shortcuts__tab:focus-visible .home-shortcuts__chevron { transform: rotate(180deg); } } /* css/home-vitrine.css */ /* Vitrine home — cadastro por steps e login no mesmo box */ .hero__vitrine-box[hidden], .hero__logged-box[hidden], .hero__hub[hidden] { display: none !important; } .hero__hub { position: absolute; z-index: 3; width: 50%; pointer-events: none; margin: 0; } .hero__vitrine-box { width: min(100%, 460px); margin: 0; text-align: left; pointer-events: auto; } .hero__vitrine-box::before { margin-left: 0; margin-right: auto; } .hero__vitrine-box .page-eyebrow { text-align: left; } .vitrine-back { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0 0 var(--space-2); padding: 0.55rem 1.1rem; border: 1px solid rgba(30, 28, 28, 0.28); border-radius: var(--radius-pill); background: linear-gradient(180deg, rgba(240, 249, 239, 0.96) 0%, rgba(232, 245, 230, 0.96) 100%); color: var(--color-primary-dark); font-size: 1.2rem; font-weight: 700; cursor: pointer; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; box-shadow: 0 2px 8px rgba(30, 28, 28, 0.08); } .vitrine-back:hover { background: linear-gradient(180deg, rgba(225, 242, 223, 1) 0%, rgba(214, 235, 212, 1) 100%); color: var(--color-primary-dark); border-color: rgba(30, 28, 28, 0.42); box-shadow: 0 4px 12px rgba(30, 28, 28, 0.14); } .vitrine-back:focus-visible { outline: 2px solid rgba(30, 28, 28, 0.45); outline-offset: 2px; } .vitrine-title { font-family: var(--font-heading); font-size: clamp(2rem, 3.6vw, 2.8rem); font-weight: 800; margin: 0 0 var(--space-1); line-height: 1.15; color: var(--color-primary-dark); } .vitrine-lead { margin: 0 0 var(--space-3); font-size: 1.4rem; line-height: 1.45; color: var(--sumup-ink-subtle); } /* Progresso do cadastro */ .vitrine-progress { margin-bottom: var(--space-3); } .vitrine-progress__track { height: 4px; border-radius: var(--radius-pill); background: rgba(30, 28, 28, 0.12); overflow: hidden; margin-bottom: var(--space-2); } .vitrine-progress__fill { height: 100%; width: 25%; border-radius: inherit; background: var(--gradient-fire); box-shadow: var(--glow-red); transition: width 0.35s ease; } .vitrine-progress__steps { display: flex; justify-content: space-between; gap: 0.4rem; margin: 0; padding: 0; list-style: none; } .vitrine-progress__steps li { flex: 1; text-align: center; font-size: 1rem; font-weight: 600; color: rgba(30, 28, 28, 0.4); line-height: 1.2; transition: color 0.25s ease; } .vitrine-progress__steps li.is-active { color: var(--color-gold-soft); } .vitrine-progress__steps li.is-done { color: var(--color-gold); } .vitrine-step-label { margin: 0 0 var(--space-2); font-size: 1.15rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-gold); } .cadastro-step { display: flex; flex-direction: column; gap: var(--space-2); } .cadastro-step[hidden] { display: none !important; } .cadastro-step .form-control { min-height: 50px; } /* Compensa o gap do flex: erro fica a 0.2rem do campo */ .cadastro-step > label.error { margin-top: calc(0.2rem - var(--space-2)); } .cadastro-step > .float-placeholder { display: none; } /* CPF no hub: sem float-label ao digitar (placeholder do input basta) */ .hero__vitrine-box .hero__cpf-form .float-placeholder, .hero__vitrine-box .float-placeholder:has(+ #HomeCPF), .hero__vitrine-box .float-placeholder:has(+ #LoginCPF), .hero__vitrine-box .float-placeholder:has(+ #CPF-display) { display: none !important; } .cadastro-step .senha-regras { margin-top: 0.45rem; margin-bottom: 0.2rem; padding: 1.1rem 1.25rem; border-radius: 1.5rem; border: 1px solid rgba(30, 28, 28, 0.15); background: linear-gradient(180deg, rgba(248, 253, 247, 0.98) 0%, rgba(241, 249, 240, 0.98) 100%); box-shadow: 0 6px 16px rgba(30, 28, 28, 0.08); } .hero__vitrine-box .senha-regras .senha-regra { margin: 0.3rem 0; font-size: 1.04rem; line-height: 1.35; color: #6b756b; } .hero__vitrine-box .senha-regras .senha-regra__icon { width: 1.2rem; display: inline-flex; align-items: center; justify-content: center; } .hero__vitrine-box .senha-regras .senha-regra__icon i { font-size: 0.9rem; color: rgba(107, 117, 107, 0.72); } .hero__vitrine-box .senha-regras .senha-regra.is-ok { color: var(--sumup-success-text); font-weight: 600; } .hero__vitrine-box .senha-regras .senha-regra.is-ok .senha-regra__icon i { color: var(--sumup-success); } .vitrine-step-actions { display: flex; gap: var(--space-2); margin-top: var(--space-1); } .vitrine-step-actions .btn { flex: 1; } .vitrine-step-actions .btn-secondary { flex: 0 0 auto; min-width: 100px; } /* Login no vitrine */ .vitrine-login-form { display: flex; flex-direction: column; gap: var(--space-2); } .vitrine-field { position: relative; } .vitrine-field .float-placeholder { display: none; } .vitrine-field__label { display: block; margin-bottom: 0.6rem; font-family: var(--font-ui); font-size: 1.2rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-primary-dark); } .vitrine-field__control { position: relative; display: grid; grid-template-columns: 1fr; align-items: center; } .vitrine-field__icon { position: relative; z-index: 3; grid-area: 1 / 1; justify-self: start; align-self: center; margin-left: 1.2rem; display: flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; border-radius: 10px; background: #eef6ec; border: 1px solid rgba(0, 72, 73, 0.22); color: var(--color-primary-dark); font-size: 1.35rem; line-height: 1; pointer-events: none; } .vitrine-field__icon i { color: inherit; } .vitrine-field__control > label.error { grid-area: 2 / 1; position: relative; z-index: 2; margin: 0.2rem 0 0; } .vitrine-field .form-control { position: relative; z-index: 1; grid-area: 1 / 1; width: 100%; padding-left: 5rem; min-height: 52px; background: rgba(255, 255, 255, 0.97); border: 1px solid rgba(30, 28, 28, 0.16); border-radius: 1.5rem; font-size: 1.45rem; color: var(--sumup-ink); } .vitrine-forgot-link { align-self: flex-end; margin: -0.2rem 0 0; padding: 0; border: none; background: none; font-family: var(--font-ui); font-size: 1.25rem; font-weight: 600; color: var(--color-primary-dark); text-decoration: none; cursor: pointer; } .vitrine-forgot-link:hover, .vitrine-forgot-link:focus-visible { color: var(--color-primary); text-decoration: underline; } .vitrine-field .form-control:focus { border-color: var(--color-gold); box-shadow: 0 0 0 3px rgba(0, 229, 206, 0.22); } .vitrine-field .form-control[readonly], #CPF-display { background: rgba(255, 255, 255, 0.72); color: var(--color-text-dark); cursor: default; } .vitrine-footer-link { margin: var(--space-2) 0 0; padding-top: var(--space-2); border-top: 1px solid rgba(255, 255, 255, 0.1); text-align: center; font-size: 1.3rem; color: var(--color-text-soft); } .vitrine-footer-link a { color: var(--color-primary-dark); font-weight: 600; text-decoration: none; } .vitrine-footer-link a:hover { color: var(--color-primary); text-decoration: underline; } .hero__cpf-hint { margin: var(--space-2) 0 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-input); background: rgba(30, 28, 28, 0.06); border: 1px solid rgba(30, 28, 28, 0.12); font-size: 1.1rem; line-height: 1.45; color: var(--color-text-soft); } .hero__cpf-hint__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-2); } .hero__cpf-hint__title { display: block; margin-bottom: 0; font-size: 1.1875rem; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: var(--color-primary-dark); flex: 1; min-width: 0; } .hero__cpf-hint__close { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; background: transparent; color: var(--color-text-soft); cursor: pointer; flex-shrink: 0; transition: color 0.15s, border-color 0.15s, background 0.15s; } .hero__cpf-hint__close:hover { color: var(--color-text); border-color: rgba(255, 255, 255, 0.22); background: rgba(255, 255, 255, 0.06); } .hero__cpf-hint__close:focus-visible { outline: 2px solid var(--color-gold); outline-offset: 2px; } .hero__cpf-hint__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.35rem; } .hero__cpf-hint__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); font-size: 1.05rem; } .hero__cpf-hint__cpf { display: inline-flex; align-items: center; gap: 0.4rem; min-width: 0; } .hero__cpf-hint strong { color: var(--color-primary-dark); font-weight: 600; font-variant-numeric: tabular-nums; } .hero__cpf-hint__copy { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 6px; background: rgba(255, 255, 255, 0.06); color: var(--color-text-soft); cursor: pointer; flex-shrink: 0; transition: color 0.15s, border-color 0.15s, background 0.15s; } .hero__cpf-hint__copy:hover { color: var(--color-primary); border-color: rgba(30, 28, 28, 0.35); background: rgba(30, 28, 28, 0.08); } .hero__cpf-hint__copy:focus-visible { outline: 2px solid var(--color-gold); outline-offset: 2px; } .hero__cpf-hint__copy.is-copied { color: var(--color-success, #5dd879); border-color: rgba(93, 216, 121, 0.45); background: rgba(93, 216, 121, 0.12); } .hero__cpf-hint__list li span { color: var(--color-text-soft); } .hero__cpf-hint__label { justify-self: end; text-align: right; white-space: nowrap; } /* Background cadastro no hero */ .hero__image--cadastro { display: none; } .hero.hero--flow .hero__image--home, .hero.hero--flow .hero__slideshow { display: none; } .hero.hero--flow .hero__image--cadastro { display: block; } /* Fluxo cadastro/login — box centralizado, página rola, vitrine expande */ .hero.hero--flow { min-height: 100dvh; height: auto; max-height: none; overflow: visible; padding-top: var(--hero-stack-h); position: relative; } .hero.hero--flow .hero__media { position: fixed; top: var(--hero-stack-h); left: 0; right: 0; bottom: 0; width: 100%; height: calc(100dvh - var(--hero-stack-h)); z-index: 0; overflow: hidden; pointer-events: none; } .hero.hero--flow .hero__image { width: 100%; height: 100%; min-height: 100%; object-fit: cover; object-position: center top; } .hero.hero--flow .hero__overlay { position: fixed; top: var(--hero-stack-h); left: 0; right: 0; bottom: 0; height: auto; z-index: 1; pointer-events: none; background: linear-gradient(to bottom, rgba(0, 42, 43, 0.52) 0%, rgba(0, 42, 43, 0.3) 45%, rgba(0, 42, 43, 0.48) 100%); } .hero.hero--flow .hero__content { position: relative; top: auto; left: auto; right: auto; height: auto; max-height: none; min-height: calc(100dvh - var(--hero-stack-h)); justify-content: center; align-items: center; padding: clamp(2rem, 4vh, 3.5rem) var(--space-3) clamp(3rem, 6vh, 5rem); overflow: visible; z-index: 2; } .hero.hero--flow .hero__vitrine-box { width: min(100%, 420px); margin-left: auto; margin-right: auto; max-height: none; height: auto; overflow: visible; flex-shrink: 0; } .hero.hero--flow .vitrine-title { font-size: clamp(1.85rem, 3.2vw, 2.5rem); } .hero.hero--flow .vitrine-lead { margin-bottom: var(--space-2); font-size: 1.3rem; } /* Home logada — mesmo hub/box do login; só permite altura do card com ações */ .hero.hero--logged { min-height: 100dvh; height: auto; max-height: none; overflow: visible; } .hero.hero--logged .hero__hub .hero__logged-box { max-height: none; overflow: visible; text-align: left; } .hero.hero--logged .hero__hub .hero__logged-box .vitrine-title, .hero.hero--logged .hero__hub .hero__logged-box .vitrine-lead { text-align: left; } @media (max-width: 991px) { .hero.hero--logged .hero__hub { align-items: flex-start; } } /* Popup de confirmacao do cadastro — mesmo box do formulário */ #popup-cadastropessoalconfirmacao .modal-content.sumup-popup__shell { border: none; background: var(--color-card-bg); color: var(--sumup-ink); box-shadow: var(--shadow-lg); backdrop-filter: none; -webkit-backdrop-filter: none; } #popup-cadastropessoalconfirmacao .sumup-popup__eyebrow { color: var(--sumup-ink); } #popup-cadastropessoalconfirmacao .sumup-popup__title { color: var(--sumup-ink); font-weight: 700; letter-spacing: 0; text-transform: none; } #popup-cadastropessoalconfirmacao .sumup-popup__lead { color: var(--sumup-ink-subtle); } #popup-cadastropessoalconfirmacao .popup-confirm-cadastro-dados { background: #f7f7f7; border: 1px solid rgba(0, 0, 0, 0.08); } #popup-cadastropessoalconfirmacao .popup-confirm-row { border-bottom-color: rgba(0, 0, 0, 0.08); } #popup-cadastropessoalconfirmacao .popup-confirm-label { color: var(--sumup-ink-subtle); } #popup-cadastropessoalconfirmacao .popup-confirm-valor { color: var(--sumup-ink); font-weight: 500; } #popup-cadastropessoalconfirmacao .sumup-popup__actions { margin-top: 1.6rem; } /* Campos unificados na vitrine */ .hero__vitrine-box .form-control, .hero__vitrine-box select.form-control { background: rgba(255, 255, 255, 0.97); border: 0px solid rgba(255, 255, 255, 0.35); color: var(--sumup-ink); } .hero__vitrine-box .form-control::placeholder { color: var(--sumup-ink-subtle); opacity: 1; } /* Select vazio (option-placeholder) com a mesma cor do placeholder dos inputs */ .hero__vitrine-box select.form-control:has(option.option-placeholder:checked), .hero__vitrine-box select.form-control:invalid { color: var(--sumup-ink-subtle); } .hero__vitrine-box select.form-control option { color: var(--sumup-ink); } .hero__vitrine-box select.form-control option.option-placeholder { color: var(--sumup-ink-subtle); } .hero__vitrine-box .form-control:-webkit-autofill, .hero__vitrine-box .form-control:-webkit-autofill:hover, .hero__vitrine-box .form-control:-webkit-autofill:focus { -webkit-text-fill-color: var(--sumup-ink); -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.97) inset; transition: background-color 9999s ease-out 0s; } .hero__vitrine-box .form-control.error { border-color: rgba(215, 20, 20, 0.28); background: rgba(255, 249, 249, 0.98); box-shadow: 0 0 0 3px rgba(215, 20, 20, 0.08); } /* Alertas de validacao — visual clean com tom red */ .hero__vitrine-box label.error:empty { display: none !important; } .hero__vitrine-box label.error:not(:empty) { display: inline-flex; align-items: center; gap: 0.55rem; margin: 0.3rem 0 0; padding: 0.55rem 0.85rem; border-radius: 10px; background: linear-gradient(135deg, rgba(255, 242, 242, 0.96) 0%, rgba(255, 232, 232, 0.96) 100%); border: 1px solid rgba(215, 20, 20, 0.22); color: #8e2020; font-family: var(--font-body); font-size: 1.1rem; font-weight: 600; line-height: 1.3; letter-spacing: 0.01em; box-shadow: 0 2px 8px rgba(130, 22, 22, 0.12); } .hero__vitrine-box .cadastro-step > label.error:not(:empty) { margin-top: calc(0.4rem - var(--space-2)); } .hero__vitrine-box label.error:not(:empty)::before { content: "\f06a"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 1rem; color: var(--color-error); flex: 0 0 auto; margin: 0; line-height: 1; display: inline-flex; align-items: center; justify-content: center; } .hero__vitrine-box .form-check > label.error, .hero__vitrine-box .sumup-optin > label.error { width: 100%; margin: 0.2rem 0 0; } /* Evita gap extra do passo: erro fica dentro do .form-check */ .hero__vitrine-box .cadastro-step > .form-check, .hero__vitrine-box .cadastro-step > .sumup-optin { margin-bottom: 0; } /* Legado se ainda houver erro irmão após hard refresh incompleto */ .hero__vitrine-box .cadastro-step > .form-check + label.error, .hero__vitrine-box .cadastro-step > .sumup-optin + label.error { margin-top: calc(0.2rem - var(--space-2)); margin-bottom: 0; } .hero__vitrine-box .vitrine-field label.error { position: relative; z-index: 1; } @media (min-width: 992px) { .hero__vitrine-box { width: min(100%, 440px); margin-left: auto; } .hero:not(.hero--flow) .hero__vitrine-box[data-vitrine-panel="cpf"] { margin-right: 0; } } @media (max-width: 991px) { .hero__vitrine-box { margin: 0 auto; text-align: center; } .hero__vitrine-box::before, .hero__vitrine-box .page-eyebrow { margin-left: auto; margin-right: auto; text-align: center; } .vitrine-back { margin-left: auto; margin-right: auto; } .vitrine-progress__steps li { font-size: 1.0625rem; } .hero__cpf-hint { text-align: left; max-width: 25rem; margin-left: auto; margin-right: auto; } .hero__cpf-hint__list li { grid-template-columns: 1fr; gap: 0.15rem; } .hero__cpf-hint__label { justify-self: start; text-align: left; } } /* css/mobile-assets.css */ /** * Mobile assets (_m) — hero KV, seções index e backgrounds CSS. * Breakpoint alinhado ao DS: max-width 991px. */ @media (max-width: 991px) { /* * Hero home — metade superior amarela (selo); * KV na metade inferior, deslocada ~95% da altura do box de login * para o card não ficar tão em cima da foto. */ .hero:not(.hero--flow):not(.hero--hub-collapsed) { --hero-login-box-h: 18rem; --hero-kv-nudge: calc(var(--hero-login-box-h) * 0.95); min-height: max(100dvh, 112rem); padding-top: var(--hero-stack-h); overflow-x: clip; overflow-y: visible; max-width: 100%; background: var(--sumup-pink); } .hero:not(.hero--flow):not(.hero--hub-collapsed) .hero__media { position: absolute; top: calc(50% + var(--hero-stack-h) / 2 + var(--hero-kv-nudge)); left: 0; right: 0; bottom: 0; width: 100%; height: auto; overflow: hidden; background: transparent; } .hero:not(.hero--flow):not(.hero--hub-collapsed) .hero__image--home, .hero:not(.hero--flow):not(.hero--hub-collapsed) picture.hero__image--home { width: 100%; height: 100%; min-height: 100%; } .hero:not(.hero--flow):not(.hero--hub-collapsed) .hero__image--home img { display: block; width: 100%; height: 100%; min-height: 100%; max-height: none; object-fit: cover; object-position: center center; } .hero:not(.hero--flow):not(.hero--hub-collapsed) .hero__overlay { display: none; } .hero:not(.hero--flow):not(.hero--hub-collapsed) .hero__content { position: relative; top: auto; left: auto; right: auto; bottom: auto; width: 100%; max-width: none; height: auto; min-height: max(calc(100dvh - var(--hero-stack-h)), 100rem); padding-bottom: 12rem; box-sizing: border-box; overflow: visible; } /* Hub fechado — KV na metade inferior (mesmo nudge do box aberto) */ .hero.hero--hub-collapsed .hero__media { overflow: hidden; background: transparent; top: calc(50% + var(--hero-stack-h) / 2 + var(--hero-kv-nudge, calc(18rem * 0.95))); left: 0; right: 0; bottom: 0; width: 100%; height: auto; } .hero.hero--hub-collapsed .hero__image--home img, .hero.hero--hub-collapsed picture.hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } /* Fluxo cadastro — bkg no mobile */ .hero.hero--flow .hero__media { background: var(--sumup-pink); overflow: hidden; } .hero.hero--flow .hero__image--cadastro img, .hero.hero--flow picture.hero__image--cadastro img { object-fit: cover; object-position: center center; } .hero.hero--logged .hero__media { background: transparent; } .hero.hero--logged .hero__image--home img, .hero.hero--logged picture.hero__image img { object-fit: cover; object-position: center center; } .hero.hero--flow .hero__overlay { display: none; } /* Seções KV — imagem mobile full-width sem crop */ .index-kv-section { overflow: hidden; isolation: isolate; } .index-kv-section picture, .index-kv-section img { display: block; width: 100%; max-width: 100%; height: auto; object-fit: contain; object-position: center top; } } /* css/index-sumup.css */ .site-main--flush { background: var(--color-page-bg); } .hero__vitrine-box .btn, .hero__logged-box .btn { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease, transform 0.3s ease !important; } .hero { background: var(--sumup-kv-bg); } .hero__overlay { display: none; background: none; } /* Box Conta SumUp — login e área logada compartilham o mesmo card */ .hero__vitrine-box.page-card, .hero__logged-box.page-card { border: none !important; border-radius: 1.5rem !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important; background: #ffffff !important; padding: clamp(2.4rem, 3.2vw, 3.2rem) !important; backdrop-filter: none !important; } .hero__vitrine-box .page-eyebrow, .hero__logged-box .page-eyebrow { color: var(--sumup-ink) !important; letter-spacing: 0.04em !important; font-size: 1.2rem !important; font-weight: 700 !important; margin-bottom: 0.6rem !important; } .hero__vitrine-box .vitrine-title, .hero__vitrine-box .page-title, .hero__logged-box .vitrine-title { color: var(--sumup-ink) !important; font-family: var(--font-heading) !important; font-size: clamp(2rem, 2.4vw, 2.4rem) !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 1.25 !important; text-transform: none !important; margin: 0 0 0.6rem !important; } .hero__vitrine-box .vitrine-lead, .hero__logged-box .vitrine-lead { color: var(--sumup-ink-subtle) !important; font-size: 1.4rem !important; line-height: 1.45 !important; margin: 0 0 0 0 !important; } .hero__vitrine-box .vitrine-lead { margin-bottom: 1rem !important; } .hero__logged-actions { display: flex !important; flex-direction: column !important; gap: 1.2rem !important; margin-top: 0 !important; } .hero__logged-actions .btn { width: 100% !important; } .hero__vitrine-box .vitrine-lead + .hero__cpf-form { margin-top: 0; } .hero__vitrine-box p, .hero__vitrine-box label:not(.error) { color: var(--sumup-ink-subtle); } .hero__cpf-form, .hero__login-form { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 1.2rem !important; } .hero__cpf-form__field { flex: 0 0 auto !important; width: 100% !important; min-width: 0 !important; } .hero__cpf-form .form-control, .hero__vitrine-box[data-vitrine-panel="login"] .form-control { min-height: 48px !important; border: 1px solid var(--sumup-border) !important; border-radius: 1.2rem !important; background: #ffffff !important; color: var(--sumup-ink) !important; font-size: 1.5rem !important; box-shadow: none !important; } .hero__cpf-form .form-control::placeholder { color: var(--sumup-ink-placeholder) !important; } .hero__cpf-form .form-control:focus, .hero__vitrine-box[data-vitrine-panel="login"] .form-control:focus { border-color: var(--sumup-ink) !important; box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px var(--sumup-ink), 0 0 0 5px rgba(255, 97, 242, 0.4) !important; } .hero__cpf-form .form-control.error, .hero__vitrine-box[data-vitrine-panel="login"] .form-control.error { border-color: var(--sumup-danger) !important; background: #ffffff !important; box-shadow: none !important; } /* Esconde label vazia (jQuery Validate limpa o texto, mas mantém .error) */ .hero__cpf-form__field label.error:empty, .hero__vitrine-box[data-vitrine-panel="login"] label.error:empty { display: none !important; } .hero__cpf-form__field label.error:not(:empty), .hero__vitrine-box[data-vitrine-panel="login"] label.error:not(:empty) { display: inline-flex !important; align-items: center !important; gap: 0.6rem !important; margin: 0.6rem 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--sumup-danger) !important; font-size: 1.2rem !important; font-weight: 400 !important; line-height: 1.3 !important; } .hero__cpf-form__field label.error:not(:empty)::before, .hero__vitrine-box[data-vitrine-panel="login"] label.error:not(:empty)::before { content: "!" !important; box-sizing: border-box !important; flex: 0 0 1.6rem !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 1.6rem !important; height: 1.6rem !important; margin: 0 !important; padding: 0 !important; border-radius: 50% !important; background: var(--sumup-danger) !important; color: #ffffff !important; font-family: var(--font-body) !important; font-size: 1.1rem !important; font-weight: 700 !important; line-height: 1 !important; text-align: center !important; top: -2px; position: relative; } .hero__cpf-cta.btn { width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; animation: none !important; } /* Login — steps CPF/e-mail → verificação por código */ .login-step[hidden] { display: none !important; } .login-step { display: flex; flex-direction: column; gap: 1.2rem; } .login-verify__hint { margin: 0 !important; color: var(--sumup-ink-subtle) !important; font-size: 1.35rem !important; line-height: 1.45 !important; } .login-verify__hint strong { color: var(--sumup-ink) !important; font-weight: 700 !important; word-break: break-all; } .login-verify__code-wrap { position: relative; width: 100%; } .login-verify__code { position: relative; z-index: 1; width: 100% !important; height: 48px !important; min-height: 48px !important; max-height: 48px !important; padding-top: 0 !important; padding-bottom: 0 !important; letter-spacing: 0.35em !important; text-indent: 0.35em !important; text-transform: none !important; font-size: 1.8rem !important; font-weight: 700 !important; line-height: 48px !important; text-align: center !important; color: var(--sumup-ink) !important; background: #ffffff !important; } .login-verify__code::placeholder { color: transparent !important; opacity: 0 !important; } .login-verify__code-mask { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; pointer-events: none; color: #999999; font-size: 1.8rem; font-weight: 700; letter-spacing: 0.35em; line-height: 1; user-select: none; transition: opacity 0.12s ease; } .login-verify__code-wrap.is-filled .login-verify__code-mask { opacity: 0; } .login-verify__help { display: block; margin-top: 0.6rem; color: #999999; font-size: 1.2rem; line-height: 1.35; text-align: center; } .login-verify__support { margin: 0.5rem 0 0 !important; color: var(--sumup-ink-subtle) !important; font-size: 1.25rem !important; line-height: 1.4 !important; } .login-verify__support[hidden] { display: none !important; } .login-verify__support a { color: var(--sumup-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 0.15em; } .login-verify__support a:hover, .login-verify__support a:focus-visible { color: var(--sumup-ink-hover); } .login-verify__error:empty, .login-verify__error[hidden] { display: none !important; } .login-verify__resend { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem 1.2rem; } .login-verify__resend-btn { appearance: none; border: 0; padding: 0; background: transparent; color: var(--sumup-ink); font: inherit; font-size: 1.35rem; font-weight: 600; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; } .login-verify__resend-btn:disabled { color: #999999; text-decoration: none; cursor: not-allowed; } .login-verify__timer { color: var(--sumup-ink-subtle); font-size: 1.25rem; line-height: 1.35; } .login-verify__actions { display: flex; gap: 1.2rem; align-items: stretch; width: 100%; min-width: 0; box-sizing: border-box; } .login-verify__actions .btn-secondary { flex: 0 0 auto; width: auto; min-width: 9.5rem; max-width: 40%; } .login-verify__actions .btn:not(.btn-secondary) { flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; } @media (max-width: 420px) { .login-verify__actions { flex-direction: column; } .login-verify__actions .btn { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } } @media (max-width: 991px) { .hero__vitrine-box.page-card, .hero__logged-box.page-card, .hero__vitrine-box .page-eyebrow, .hero__vitrine-box .vitrine-title, .hero__vitrine-box .vitrine-lead, .hero__logged-box .vitrine-title, .hero__logged-box .vitrine-lead { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; } .hero__vitrine-box .vitrine-lead { margin-bottom: 1rem !important; } } .sumup-section { padding-top: clamp(4.8rem, 7vw, 7.2rem); padding-bottom: clamp(4.8rem, 7vw, 7.2rem); } .sumup-section__eyebrow { color: var(--color-primary-dark); } .sumup-section__title { color: var(--color-primary-dark); font-family: var(--font-heading); font-weight: 800; } .sumup-section__subtitle { color: var(--color-text-muted); } .sumup-duvidas, .sumup-regulamento { background: var(--sumup-surface) !important; } .sumup-como:not(.sumup-reach) { background: var(--sumup-surface) !important; } .sumup-como.sumup-reach { background: #ffffff !important; } .sumup-ttp { background: var(--sumup-pink) !important; } .sumup-premios { background: var(--sumup-pink) !important; } .sumup-premios { background: linear-gradient(140deg, #242424 0%, var(--sumup-ink) 100%) !important; } .sumup-grid .sumup-card, .sumup-card { border: 1px solid rgba(30, 28, 28, 0.16); box-shadow: 0 12px 28px rgba(30, 28, 28, 0.08); } .sumup-card__step { background: var(--sumup-ink) !important; color: #fff !important; } .sumup-cartoes__eyebrow { background: var(--color-primary-dark); } .sumup-calendario__item, .sumup-faq__item, .sumup-regulamento__card { border: 1px solid rgba(30, 28, 28, 0.16); border-radius: var(--radius-card); box-shadow: 0 10px 24px rgba(30, 28, 28, 0.08); background: #ffffff; } .site-footer, wc-footer { background: var(--sumup-surface-neutral); } @media (max-width: 991px) { .hero__overlay { display: none; background: none; } } /* Sessão Prêmios */ .sumup-premiacao { background: var(--sumup-kv-bg); padding: clamp(5.6rem, 8vw, 9rem) 0; text-align: center; overflow: hidden; } .sumup-premiacao__container { display: flex; flex-direction: column; align-items: center; gap: 1.6rem; max-width: 120rem; margin: 0 auto; padding: 0 2rem; } .sumup-premiacao__title { margin: 0 auto; max-width: 80rem; font-family: var(--font-heading); font-size: clamp(3rem, 4vw, 5.6rem); font-weight: 900; line-height: 1; letter-spacing: -0.02em; text-align: center; color: var(--sumup-ink); } .sumup-premiacao__lead { max-width: 50rem; margin: 0 auto; color: var(--sumup-ink-subtle); font-size: clamp(1.6rem, 1.3vw, 1.9rem); line-height: 1.2; } .sumup-premiacao__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(24rem, 44rem) minmax(0, 1fr); align-items: center; gap: clamp(1.6rem, 3vw, 4rem); position: relative; width: 100%; margin-top: 2.4rem; } .sumup-premiacao__visual { position: relative; z-index: 2; } /* --sumup-prize-p (0 = atrás da imagem, 1 = no lugar) e --sumup-prize-from-x/y * vêm de home-scroll-animations.js; sem JS o box fica no lugar final. */ .sumup-prize { --sumup-prize-dir: -1; --sumup-prize-glow: rgba(246, 203, 50, 0.85); position: relative; z-index: 1; isolation: isolate; overflow: hidden; container-type: inline-size; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem; min-width: 0; padding: 3.2rem 2.4rem; border-radius: 2.4rem; color: var(--sumup-ink); text-align: center; translate: calc(var(--sumup-prize-from-x, 0px) * (1 - var(--sumup-prize-p, 1))) calc(var(--sumup-prize-from-y, 0px) * (1 - var(--sumup-prize-p, 1))); scale: calc(0.55 + 0.45 * var(--sumup-prize-p, 1)); opacity: min(1, calc(var(--sumup-prize-p, 1) * 4)); rotate: calc(var(--sumup-prize-dir) * 3deg * var(--sumup-prize-p, 1)); transform-origin: center bottom; animation: sumup-prize-tilt-in 1s cubic-bezier(0.34, 1.56, 0.64, 1) both, sumup-prize-sway 4.8s ease-in-out 1s infinite, sumup-prize-glow 4s ease-in-out 1s infinite; } /* Reflexo diagonal que atravessa o box junto com o pico do brilho. */ .sumup-prize::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.6) 50%, transparent 70%); translate: -120% 0; pointer-events: none; animation: sumup-prize-shine 4s ease-in-out 1s infinite; } .sumup-prize--ouro { background: var(--sumup-yellow); } .sumup-prize--iphone { --sumup-prize-dir: 1; --sumup-prize-glow: rgba(255, 97, 242, 0.85); background: var(--sumup-pink); animation-delay: 0.12s, 1.12s, 3s; } .sumup-prize--iphone::after { animation-delay: 3s; } .sumup-prize p { margin: 0; } /* Tamanhos em cqi (largura do box) para caber em qualquer breakpoint. */ .sumup-prize__qtd { position: relative; font-family: var(--font-heading); font-size: clamp(3.6rem, 34cqi, 9.6rem); line-height: 0.9; } .sumup-prize__moeda { position: absolute; right: 100%; top: 0.3em; margin-right: 0.15em; font-size: 0.32em; line-height: 1; white-space: nowrap; } .sumup-prize__unidade { font-family: var(--font-heading); font-size: clamp(1.6rem, 11cqi, 3.2rem); line-height: 1; } .sumup-prize__nome { font-family: var(--font-heading); font-size: clamp(1.4rem, 9cqi, 2.4rem); line-height: 1.1; } .sumup-prize__nome--sm { margin-top: 0.4rem !important; font-size: clamp(1.2rem, 6cqi, 1.6rem); line-height: 1.2; } .sumup-premiacao__visual img { display: block; width: 100%; max-width: 46rem; height: auto; margin: 0 auto; animation: sumup-premiacao-grow 1.1s cubic-bezier(0.34, 1.56, 0.64, 1) both, sumup-premiacao-pulse 3.2s ease-in-out 1.1s infinite; } /* Animações reiniciam a cada entrada da grade na tela (is-in-view vem de home-scroll-animations.js). * Os efeitos dos boxes só rodam depois que eles saem de trás da imagem (is-prize-out). */ .sumup-scroll-ready .sumup-premiacao__grid:not(.is-in-view) .sumup-premiacao__visual img, .sumup-scroll-ready .sumup-premiacao__grid:not(.is-prize-out) .sumup-prize, .sumup-scroll-ready .sumup-premiacao__grid:not(.is-prize-out) .sumup-prize::after { animation: none; } .sumup-scroll-ready .sumup-premiacao__grid:not(.is-prize-out) .sumup-prize { will-change: translate, scale, opacity, rotate; } .sumup-premiacao__nota { margin: 1.2rem 0 0; color: var(--sumup-ink-subtle); font-size: 1.3rem; } @keyframes sumup-prize-tilt-in { 0% { rotate: calc(var(--sumup-prize-dir) * 3deg); } 55% { rotate: calc(var(--sumup-prize-dir) * 9deg); } 100% { rotate: calc(var(--sumup-prize-dir) * 3deg); } } @keyframes sumup-prize-sway { 0%, 100% { rotate: calc(var(--sumup-prize-dir) * 3deg); } 50% { rotate: calc(var(--sumup-prize-dir) * 6deg); } } /* Brilho no primeiro meio ciclo; o box rosa usa +2s de atraso para alternar com o amarelo. */ @keyframes sumup-prize-glow { 0%, 50%, 100% { box-shadow: 0 0 0 0 transparent; } 22% { box-shadow: 0 0 3.2rem 0.6rem var(--sumup-prize-glow); } } @keyframes sumup-prize-shine { 0% { translate: -120% 0; } 40%, 100% { translate: 120% 0; } } @keyframes sumup-premiacao-grow { 0% { scale: 0.6; opacity: 0; } 60% { opacity: 1; } 100% { scale: 1.08; opacity: 1; } } @keyframes sumup-premiacao-pulse { 0%, 100% { scale: 1.08; } 50% { scale: 1.04; } } @media (max-width: 991px) { .sumup-premiacao__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-width: 64rem; margin-inline: auto; } .sumup-premiacao__visual { grid-column: 1 / -1; grid-row: 1; width: min(100%, 40rem); margin: 0 auto; } .sumup-prize { align-self: stretch; } } @media (max-width: 767px) { .sumup-prize { padding: 2.4rem 1.2rem; border-radius: 2rem; } } @media (prefers-reduced-motion: reduce) { .sumup-prize, .sumup-prize::after, .sumup-premiacao__visual img { animation: none; } } /* css/sumup-auth.css */ /* Autenticação SumUp — olho de senha, CTA "Quero participar" e página cadastro.html */ /* ---------- Campo de senha com olho ---------- */ .sumup-senha-wrap { position: relative; width: 100%; } .sumup-senha-wrap .form-control { width: 100%; padding-right: 5rem !important; } .sumup-senha-toggle { position: absolute; top: 0; right: 0; z-index: 3; display: flex; align-items: center; justify-content: center; width: 4.8rem; height: 48px; padding: 0; border: 0; background: transparent; color: var(--sumup-ink-subtle); font-size: 1.7rem; cursor: pointer; } .sumup-senha-toggle:hover, .sumup-senha-toggle:focus-visible { color: var(--sumup-ink); } .sumup-senha-toggle:focus-visible { outline: 2px solid var(--sumup-ink); outline-offset: -2px; border-radius: 6px; } /* ---------- Box "Quero participar" (home) ---------- */ .sumup-login-cta { margin-top: 1.6rem; padding-top: 1.6rem; border-top: 1px solid rgba(30, 28, 28, 0.12); display: flex; flex-direction: column; align-items: stretch; gap: 1rem; text-align: center; } .sumup-login-cta__text { margin: 0 !important; font-size: 1.35rem; color: var(--sumup-ink-subtle); } .sumup-login-forgot { margin: 0 !important; text-align: center; font-size: 1.35rem; color: var(--sumup-ink-subtle); } .sumup-login-forgot a { color: var(--sumup-ink-subtle); text-decoration: underline; } .sumup-login-forgot a:hover, .sumup-login-forgot a:focus-visible { color: var(--sumup-ink); } /* ---------- Página cadastro.html ---------- */ .sumup-cadastro-page { /* Preserva o padding-top de .site-main (header + faixa de countdown) */ padding-top: calc(var(--header-h) + var(--promo-encerrada-h, 0px) + clamp(2.4rem, 4vw, 4.8rem)); padding-inline: 1.6rem; padding-bottom: 6.4rem; } body.page-cadastro { background: var(--sumup-pink-strong); background-image: none; } /* cadastro.html: fundo cinza do KV + círculo Tap to Pay à direita (mesma cena da hero) */ body.page-cadastro.page-cadastro-kv { background: var(--sumup-kv-bg); overflow-x: clip; } .page-cadastro-kv .sumup-cadastro-page { position: relative; } .page-cadastro-kv .sumup-cadastro-shell { position: relative; z-index: 1; } .sumup-cadastro-cena { position: absolute; top: 0; right: 0; width: 50vw; height: clamp(72rem, 100dvh, 85rem); line-height: 0; pointer-events: none; z-index: 0; } .sumup-cadastro-cena img { position: absolute; top: -0.84%; left: 0; display: block; width: auto; height: 124%; max-width: none; aspect-ratio: 1; transform-origin: 50% 50%; } @media (min-width: 992px) and (prefers-reduced-motion: no-preference) { .sumup-cadastro-cena img { animation: sumup-cadastro-tap-in 1.2s cubic-bezier(0.22, 1, 0.36, 1) both, sumup-cadastro-tap-tilt 1.8s ease-in-out 1s 1; } } @keyframes sumup-cadastro-tap-in { from { opacity: 0; translate: 3% 5%; } to { opacity: 1; translate: 0 0; } } @keyframes sumup-cadastro-tap-tilt { 0%, 100% { rotate: 0deg; translate: 0 0; } 35% { rotate: -3deg; translate: 0 -2%; } 70% { rotate: 1.5deg; translate: 0 1%; } } @media (max-width: 991px) { .sumup-cadastro-cena { display: none; } } .sumup-cadastro-shell { width: min(100%, 96rem); margin: 0 auto; } .sumup-cadastro-card { padding: clamp(2rem, 4vw, 3.6rem); border-radius: 2.4rem; background: #ffffff; box-shadow: 0 16px 40px rgba(30, 28, 28, 0.14); color: var(--sumup-ink); } .sumup-cadastro-card__title { margin: 0 0 0.6rem; font-family: var(--font-heading, inherit); font-size: clamp(2.8rem, 4vw, 3.8rem); line-height: 1.05; color: var(--sumup-ink); } .sumup-cadastro-card__lead { margin: 0 0 2.4rem; font-size: 1.5rem; line-height: 1.5; color: var(--sumup-ink-subtle); } .sumup-cadastro-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.8rem 2.4rem; align-items: start; } .sumup-cadastro-form > .sumup-cadastro-fieldset, .sumup-cadastro-form > .sumup-cadastro-aceites, .sumup-cadastro-form > .sumup-cadastro-actions { grid-column: 1 / -1; } .sumup-cadastro-form > .sumup-cadastro-actions { max-width: 44rem; width: 100%; margin-inline: auto; } .sumup-cadastro-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; } .sumup-cadastro-fieldset legend { float: none; width: auto; margin: 0 0 1rem; padding: 0; font-size: 1.4rem; font-weight: 700; color: var(--sumup-ink); } .sumup-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } .sumup-tipo__opt { position: relative; } .sumup-tipo__opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; } .sumup-tipo__opt span { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 1.2rem; border: 2px solid rgba(0, 0, 0, 0.18); border-radius: 1.6rem; background: #ffffff; font-size: 1.45rem; font-weight: 600; color: var(--sumup-ink); text-align: center; transition: background-color 0.2s ease, border-color 0.2s ease; } .sumup-tipo__opt input:checked + span { border-color: var(--sumup-ink); background: var(--sumup-yellow); } .sumup-tipo__opt input:focus-visible + span { outline: 2px solid var(--sumup-ink); outline-offset: 2px; } .sumup-cadastro-field { display: flex; flex-direction: column; gap: 0.5rem; } .sumup-cadastro-field > label:not(.error), .sumup-cadastro-field .sumup-cadastro-label { font-size: 1.3rem; font-weight: 600; color: var(--sumup-ink); } /* Label fixa já identifica o campo: sem float-placeholder do fenix.js */ .sumup-cadastro-form .float-placeholder { display: none !important; } .sumup-cadastro-field .req, .sumup-cadastro-aceites .req { color: #c62828; } .sumup-cadastro-field[hidden] { display: none !important; } .sumup-cadastro-aceites { display: flex; flex-direction: column; gap: 1.2rem; } .sumup-cadastro-aceites .form-check label:not(.error) { color: var(--sumup-ink); } .sumup-cadastro-aceites .form-check { align-items: center; column-gap: 1.2rem; margin: 0; } .sumup-cadastro-aceites .form-check-input[type="checkbox"] { width: 2.2rem; height: 2.2rem; min-width: 2.2rem; margin: 0; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 6px; background: #ffffff; box-shadow: none; } .sumup-cadastro-aceites .form-check-input[type="checkbox"]:hover { border-color: rgba(0, 0, 0, 0.25); box-shadow: 0 0 0 3px rgba(255, 97, 242, 0.55); } .sumup-cadastro-aceites .form-check-input[type="checkbox"]:checked { background: var(--sumup-ink); border-color: var(--sumup-ink); box-shadow: none; } .sumup-cadastro-aceites .form-check-input[type="checkbox"]:checked::after { border-color: var(--sumup-yellow); } .sumup-cadastro-aceites .form-check-input[type="checkbox"]:focus-visible { outline: 2px solid var(--sumup-ink); outline-offset: 3px; } .sumup-cadastro-aceites .form-check label:not(.error) { margin: 0; line-height: 1.4; } .sumup-cadastro-aceites .form-check > label.error { margin: 0.2rem 0 0; font-size: 1.2rem; line-height: normal; color: var(--color-error-soft); cursor: default; } .sumup-cadastro-aceites a { color: var(--sumup-ink); font-weight: 700; text-decoration: underline; } .sumup-cadastro-actions { display: flex; flex-direction: column; gap: 1rem; margin-top: 0.6rem; } .sumup-cadastro-form--3col { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 720px) { .sumup-cadastro-form--3col { grid-template-columns: minmax(0, 1fr); } } .sumup-cadastro-form > .sumup-cadastro-actions--row { flex-direction: row; max-width: 64rem; } .sumup-cadastro-actions--row .btn { flex: 1 1 0; } @media (max-width: 480px) { .sumup-cadastro-form > .sumup-cadastro-actions--row { flex-direction: column-reverse; } } .sumup-cadastro-login { margin: 0; text-align: center; font-size: 1.35rem; color: var(--sumup-ink-subtle); } .sumup-cadastro-login a { color: var(--sumup-ink); font-weight: 700; } /* ---------- Página meus-dados.html (somente leitura) ---------- */ .sumup-cadastro-card__lead a { color: var(--sumup-ink); font-weight: 700; text-decoration: underline; } .sumup-meus-dados-aviso { grid-column: 1 / -1; display: flex; align-items: center; gap: 0.8rem; margin: 0; padding: 1rem 1.4rem; border-radius: 1.2rem; background: #f2f2f2; font-size: 1.35rem; color: #4d4d4d; } .sumup-meus-dados-aviso i { color: var(--sumup-ink); } .sumup-meus-dados-form .form-control:disabled { background: #f2f2f2 !important; border-color: rgba(0, 0, 0, 0.12) !important; color: #4d4d4d !important; -webkit-text-fill-color: #4d4d4d; opacity: 1; cursor: not-allowed; } .sumup-meus-dados-form .sumup-tipo__opt input { cursor: not-allowed; } .sumup-meus-dados-form .sumup-tipo__opt input:not(:checked) + span { opacity: 0.55; } @media (max-width: 720px) { .sumup-cadastro-form { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 480px) { .sumup-tipo { grid-template-columns: 1fr; } } /* ---------- Esqueci minha senha (box da home) ---------- */ .sumup-esqueci-back { display: inline-flex; align-items: center; gap: 0.6rem; margin: 0 0 1.2rem; padding: 0; border: 0; background: transparent; color: var(--sumup-ink-subtle); font-size: 1.35rem; font-weight: 600; cursor: pointer; } .sumup-esqueci-back:hover, .sumup-esqueci-back:focus-visible { color: var(--sumup-ink); } .sumup-esqueci-icon { display: flex; align-items: center; justify-content: center; width: 5.6rem; height: 5.6rem; margin: 0 0 1.2rem; border-radius: 50%; background: var(--sumup-pink); color: var(--sumup-ink); font-size: 2.4rem; } .sumup-esqueci-text { margin: 0 0 1.2rem; font-size: 1.35rem; line-height: 1.45; color: var(--sumup-ink-subtle); } [data-esqueci-step="sucesso"] .btn { margin-top: 0.4rem; } [data-esqueci-step="sucesso"] .sumup-login-forgot { margin-top: 1.2rem !important; } .sumup-esqueci-erro { display: flex; align-items: center; margin: 0.6rem 0 0 !important; font-size: 1.2rem; line-height: 1.3; color: var(--sumup-danger) !important; } .sumup-esqueci-erro[hidden] { display: none !important; } .sumup-esqueci-icon + .vitrine-title { margin-top: 0; } .login-step[data-esqueci-step="codigo"] .login-verify__resend, .login-step[data-esqueci-step="codigo"] .login-verify__support { justify-content: center; text-align: center; } .login-step[data-esqueci-step="codigo"] .login-verify__resend { flex-direction: column; gap: 0.4rem; } .login-step[data-esqueci-step="codigo"] .login-verify__timer:empty { display: none; } /* Máscara do código fica presa à altura do campo (mensagem de erro do validator entra dentro do wrap). */ .login-step[data-esqueci-step="codigo"] .login-verify__code-mask { inset: 0 0 auto 0; height: 48px; } /* Regras de senha — popover branco delicado abaixo do campo (home e cadastro) */ .login-step[data-esqueci-step="senha"] .hero__cpf-form__field { position: relative; } .sumup-senha-regras { position: absolute; top: calc(100% + 0.6rem); left: 0; z-index: 10; width: 100%; margin: 0 !important; padding: 1rem 1.3rem 1.1rem !important; border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 1.2rem !important; background: #ffffff !important; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); text-align: left; } .sumup-senha-regras[hidden] { display: none !important; } .sumup-senha-regras::before { content: ""; position: absolute; top: -0.5rem; left: 1.8rem; width: 0.9rem; height: 0.9rem; border-top: 1px solid rgba(0, 0, 0, 0.08); border-left: 1px solid rgba(0, 0, 0, 0.08); background: #ffffff; transform: rotate(45deg); } .sumup-senha-regras__title { margin: 0 0 0.5rem !important; font-size: 1.15rem !important; font-weight: 600; line-height: 1.3 !important; color: var(--sumup-ink) !important; } .sumup-senha-regras .senha-regra { display: flex; align-items: center; gap: 0.7rem; margin: 0.3rem 0 0; font-size: 1.2rem; font-weight: 400; line-height: 1.35; color: var(--sumup-ink-subtle); } .sumup-senha-regras .senha-regra__icon { flex: 0 0 1.4rem; width: 1.4rem; display: inline-flex; align-items: center; justify-content: center; } .sumup-senha-regras .senha-regra__icon i { font-size: 1.2rem; color: #b3b3b3; } .sumup-senha-regras .senha-regra.is-ok { color: var(--sumup-ink); font-weight: 500; } .sumup-senha-regras .senha-regra.is-ok .senha-regra__icon i { color: var(--sumup-success); } /* ---------- Página cadastro-realizado.html ---------- */ .sumup-cadastro-shell--sucesso { width: min(100%, 64rem); } .sumup-cadastro-sucesso { text-align: center; } body.page-cadastro.page-cadastro-realizado, body.page-cadastro.page-meusnumeros { background: var(--sumup-ink); background-image: none; } .sumup-cadastro-sucesso__icon { margin: 0 auto 1.6rem; background: var(--sumup-yellow); } .sumup-cadastro-sucesso__texto { margin: 1.6rem 0 2.4rem; } .sumup-cadastro-sucesso__texto p { margin: 0 0 1.2rem; font-size: 1.5rem; line-height: 1.55; color: #4d4d4d; } .sumup-cadastro-sucesso__texto p:last-child { margin-bottom: 0; } .sumup-cadastro-sucesso__texto strong { color: var(--sumup-ink); } .sumup-cadastro-sucesso__texto a { color: var(--sumup-ink); font-weight: 700; text-decoration: underline; } .sumup-cadastro-sucesso__actions { max-width: 36rem; margin: 0 auto; } /* components/wc-promo-encerrada/wc-promo-encerrada.css */ /** * Faixa promo encerrada — reutiliza tokens visuais do countdown. */ wc-promo-encerrada { display: block; } wc-promo-encerrada:not(.is-visible) { display: none; } /* Faixa absoluta, centralizada, logo abaixo da barra de menu */ wc-promo-encerrada.is-after-header .sumup-countdown--encerrada { position: absolute; top: calc(var(--header-h) + var(--countdown-h, 0px)); left: 0; right: 0; width: 100%; margin: 0 auto; z-index: 198; } wc-promo-encerrada.is-after-menu .sumup-countdown--encerrada { position: absolute; top: calc(var(--wc-menu-h, 67px) + var(--countdown-h, 0px)); left: 0; right: 0; width: 100%; margin: 0 auto; z-index: 997; } /* Fundo tinta (mesmo do countdown) */ .sumup-countdown--encerrada { border-bottom-color: rgba(255, 255, 255, 0.14); background: radial-gradient(ellipse 80% 120% at 50% -40%, rgba(30, 28, 28, 0.16) 0%, transparent 55%), linear-gradient(180deg, var(--sumup-ink) 0%, var(--sumup-ink-hover) 100%); color: #fff; } .sumup-countdown--encerrada::before { display: none; } /* Altura acompanha o menu */ .sumup-countdown--encerrada { box-sizing: border-box; min-height: var(--header-h); } wc-promo-encerrada.is-after-menu .sumup-countdown--encerrada { min-height: var(--wc-menu-h, 67px); } .sumup-countdown__inner--encerrada { display: flex; align-items: center; justify-content: center; margin: 0 auto; box-sizing: border-box; padding: 0.4rem var(--space-3); min-height: inherit; text-align: center; } .sumup-countdown__info--encerrada { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; min-width: 0; text-align: center; } .sumup-countdown__info--encerrada .sumup-countdown__eyebrow { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; color: var(--sumup-pink); font-family: var(--font-heading); font-weight: 700; font-size: 1.2rem; letter-spacing: 0.06em; text-transform: uppercase; } .sumup-countdown__linha-unica { margin: 0; font-family: var(--font-body); font-size: 1.4rem; line-height: 1.35; text-align: center; color: rgba(255, 255, 255, 0.9); } .sumup-countdown__linha-unica strong { color: #fff; font-weight: 700; } @media (max-width: 640px) { .sumup-countdown__info--encerrada .sumup-countdown__eyebrow { font-size: 1.1rem; } .sumup-countdown__linha-unica { font-size: 1.25rem; } } .sumup-countdown__linha-unica a { color: var(--sumup-pink); font-weight: 700; text-decoration: underline; text-underline-offset: 0.2em; } .sumup-countdown__linha-unica a:hover, .sumup-countdown__linha-unica a:focus-visible { color: #fff; }