@font-face{font-family: "Caveat"; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fonts/public/caveat-latin-ext.f626b95c1efa95cf.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Caveat"; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fonts/public/caveat-latin.891951df5e8b5b0f.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Caveat"; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fonts/public/caveat-latin-ext.f626b95c1efa95cf.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Caveat"; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fonts/public/caveat-latin.891951df5e8b5b0f.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Instrument Sans"; font-style: italic; font-weight: 500; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin-ext.38e1be3a74d38005.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Instrument Sans"; font-style: italic; font-weight: 500; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin.02007805cd77359a.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 400; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin-ext.c4fcfea41f2c1cfe.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 400; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin.2ee17598a98d8a59.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 500; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin-ext.c4fcfea41f2c1cfe.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 500; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin.2ee17598a98d8a59.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 600; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin-ext.c4fcfea41f2c1cfe.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 600; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin.2ee17598a98d8a59.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 700; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin-ext.c4fcfea41f2c1cfe.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Instrument Sans"; font-style: normal; font-weight: 700; font-stretch: 100%; font-display: swap; src: url(/static/fonts/public/instrument-sans-latin.2ee17598a98d8a59.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fonts/public/manrope-latin-ext.3911b66d9f2e005a.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fonts/public/manrope-latin.a30ddcd349703aff.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 500; font-display: swap; src: url(/static/fonts/public/manrope-latin-ext.3911b66d9f2e005a.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 500; font-display: swap; src: url(/static/fonts/public/manrope-latin.a30ddcd349703aff.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fonts/public/manrope-latin-ext.3911b66d9f2e005a.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fonts/public/manrope-latin.a30ddcd349703aff.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fonts/public/manrope-latin-ext.3911b66d9f2e005a.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fonts/public/manrope-latin.a30ddcd349703aff.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 800; font-display: swap; src: url(/static/fonts/public/manrope-latin-ext.3911b66d9f2e005a.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family: "Manrope"; font-style: normal; font-weight: 800; font-display: swap; src: url(/static/fonts/public/manrope-latin.a30ddcd349703aff.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} :root{--space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem; --space-8: 3rem; --space-10: 4rem; --space-12: 6rem; --claude-primary: #cc785c; --claude-primary-active: #a9583e; --claude-primary-disabled: #e6dfd8; --claude-ink: #141413; --claude-body: #3d3d3a; --claude-body-strong: #252523; --claude-muted: #6c6a64; --claude-muted-soft: #8e8b82; --claude-hairline: #e6dfd8; --claude-hairline-soft: #ebe6df; --claude-canvas: #faf9f5; --claude-surface-soft: #f5f0e8; --claude-surface-card: #efe9de; --claude-surface-cream-strong: #e8e0d2; --claude-surface-dark: #181715; --claude-surface-dark-elevated: #252320; --claude-surface-dark-soft: #1f1e1b; --claude-on-primary: #ffffff; --claude-on-dark: #faf9f5; --claude-on-dark-soft: #a09d96; --claude-accent-teal: #5db8a6; --claude-accent-amber: #e8a55a; --claude-success: #5db872; --claude-warning: #d4a017; --claude-error: #c64545; --catadores-blue: #258fc8; --catadores-teal: #03a398; --catadores-orange: #ff8b17; --catadores-yellow: #ffc40d; --catadores-purple: #844f9d; --catadores-pink: #d464a1; --font-display-claude: "Source Serif 4", Georgia, "Times New Roman", serif; --font-ui-claude: Manrope, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --font-mono-claude: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace; --radius-claude-md: 8px; --radius-claude-lg: 12px; --radius-claude-xl: 16px; --radius-claude-2xl: 24px; --shadow-claude-soft: 0 1px 3px rgba(20, 20, 19, 0.08); --shadow-claude-float: 0 18px 50px rgba(24, 23, 21, 0.10); --max-editorial: 1200px; --max-dashboard: 1360px; --max-public-page: 1760px; --portal-blue: #2f6faf; --portal-blue-dark: #075b98; --portal-pink: #e5007e; --portal-yellow: #ffc400; --portal-green: #8fbd3e; --portal-text: #123853; --portal-muted: #3d5a73; --portal-canvas: #eef4f9; --portal-surface: #ffffff; --portal-on-dark: #f4f8fc; --portal-on-dark-soft: rgba(244, 248, 252, 0.82); --font-portal: "Instrument Sans", "Segoe UI", sans-serif; --font-portal-em: Caveat, "Segoe Print", cursive; --ease-portal: cubic-bezier(0.16, 1, 0.3, 1); --z-hero: 1; --z-rail: 20; --z-modal: 40; --z-skip: 50;} :root{--primary-50: #f0fdf4; --primary-500: #22c55e; --primary-600: #16a34a; --primary-700: #15803d; --secondary-500: #3b82f6; --secondary-600: #2563eb; --gray-50: #f8fafc; --gray-100: #f1f5f9; --gray-600: #475569; --gray-900: #0f172a; --accent-500: #f97316; --accent-600: #ea580c; --carnaval-cyan: #50D5DE; --carnaval-purple: #844F9D; --carnaval-pink: #D464A1; --carnaval-teal: #03A398; --carnaval-blue: #258FC8; --carnaval-orange: #FF8B17; --carnaval-purple-dark: #642581; --carnaval-yellow: #FFC40D; --carnaval-orange-dark: #F6811E; --olinda-blue: #258FC8; --olinda-blue-dark: #03A398; --olinda-orange: #FF8B17; --olinda-orange-dark: #F6811E; --olinda-yellow: #FFC40D; --olinda-yellow-dark: #F6811E; --olinda-magenta: #D464A1; --olinda-magenta-dark: #844F9D; --olinda-green: #03A398; --olinda-green-dark: #03A398; --olinda-darkgreen: #03A398; --olinda-bg: #F5F5F5; --olinda-white: #FFFFFF; --olinda-text: #333333; --olinda-muted: #666666; --olinda-border: #E0E0E0; --olinda-success: #4CAF50; --olinda-error: #F44336; --olinda-warning: #FF9800; --shadow-soft: 0 6px 20px rgba(0, 0, 0, 0.2); --shadow-hover: 0 12px 32px rgba(0, 0, 0, 0.3); --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.35); --breakpoint-mobile: 768px; --breakpoint-tablet: 1024px; --breakpoint-desktop: 1200px; --spacing-xs: 0.25rem; --spacing-sm: 0.5rem; --spacing-md: 1rem; --spacing-lg: 1.5rem; --spacing-xl: 2rem; --spacing-2xl: 3rem; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-base: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; --font-size-2xl: 1.5rem; --font-size-3xl: 1.875rem; --touch-target-min: 2.75rem;} *{margin: 0; padding: 0; box-sizing: border-box;} body{font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background-color: var(--olinda-bg); color: var(--olinda-text); line-height: 1.6; min-height: 100vh; display: flex; flex-direction: column; -webkit-font-smoothing: antialiased;} .container{max-width: var(--breakpoint-desktop); margin: 0 auto; padding: 0 clamp(1rem, 2vw, 2.5rem); width: 100%;} .fade-in{animation: fadeIn 0.4s ease-out;} .slide-up{animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1);} @keyframes fadeIn{from{opacity: 0;} to{opacity: 1;}} @keyframes slideUp{from{transform: translateY(30px); opacity: 0;} to{transform: translateY(0); opacity: 1;}} .header{background: rgba(255, 255, 255, 0.95); box-shadow: var(--shadow-soft); padding: 0; position: sticky; top: 0; z-index: 40; min-height: 6rem; display: flex; align-items: center; backdrop-filter: blur(6px);} .header-content{display: flex; align-items: center; width: 100%; height: 100%; gap: 1rem;} .header-left{display: flex; align-items: center; gap: 1rem; flex-shrink: 0;} .header-right{display: flex; align-items: center; gap: 1rem; flex-shrink: 0;} .header-center{display: flex; justify-content: center; align-items: center; gap: 0.5rem; flex: 1; min-width: 0; position: relative;} .logo-area{display: flex; align-items: center; gap: 0.5rem; cursor: pointer;} .logo-image{height: 48px; width: auto; object-fit: contain;} .logo-icon{background: var(--olinda-green); width: 48px; height: 48px; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: white; box-shadow: var(--shadow-soft);} .nav{display: flex; align-items: center; gap: 0.35rem; background: var(--olinda-bg); padding: 0.45rem; border-radius: 9999px; border: 1px solid var(--olinda-border); overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; scroll-snap-type: x proximity;} .nav::-webkit-scrollbar{display: none;} .nav-link{padding: var(--spacing-sm) var(--spacing-sm); border-radius: 9999px; font-size: var(--font-size-sm); font-weight: 700; text-decoration: none; color: var(--olinda-muted); transition: all 0.2s; display: flex; align-items: center; gap: var(--spacing-xs); white-space: nowrap; min-height: var(--touch-target-min); scroll-snap-align: start;} .nav-link span{font-size: var(--font-size-sm); font-weight: 700; color: inherit; line-height: 1.5;} .nav-link svg{width: 16px; height: 16px; flex-shrink: 0;} .nav-link:hover{background: var(--olinda-white); color: var(--carnaval-blue);} .nav-link.active{background: var(--carnaval-blue); color: white; box-shadow: var(--shadow-soft);} .nav-link:focus-visible{outline: 3px solid rgba(37, 143, 200, 0.35); outline-offset: 2px;} .nav-link.active span{color: white;} .nav-user{text-align: right; margin-right: 1rem;} .nav-user-name{font-size: var(--font-size-sm); font-weight: 700; color: var(--olinda-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 8rem;} .nav-user-status{font-size: var(--font-size-xs); font-weight: 700; color: var(--olinda-green);} .btn-logout{width: 40px; height: 40px; border-radius: 9999px; background: var(--olinda-magenta); color: white; border: none; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; box-shadow: var(--shadow-soft);} .btn-logout:hover{background: var(--olinda-magenta-dark); box-shadow: var(--shadow-hover);} .main{flex: 1; padding: clamp(1.5rem, 3vw, 2.5rem) 0; background: radial-gradient(circle at 20% 20%, rgba(37, 143, 200, 0.08), transparent 45%), radial-gradient(circle at 80% 0%, rgba(255, 139, 23, 0.08), transparent 45%);} .main-auth{padding: 0; background: none;} .footer{background: var(--olinda-white); border-top: 1px solid var(--olinda-border); padding: 1.5rem 0; margin-top: auto; text-align: center;} .footer-text{font-size: 0.875rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase;} .hero-banner{background: linear-gradient(135deg, var(--carnaval-blue) 0%, var(--carnaval-cyan) 100%); border-radius: 1rem; padding: 1.5rem; color: white; box-shadow: var(--shadow-lg); position: relative; overflow: hidden; margin-bottom: 1.5rem; border: 1px solid rgba(255, 255, 255, 0.18); display: grid; gap: 0.75rem;} .hero-banner::after{content: ""; position: absolute; right: -20px; bottom: -40px; width: 192px; height: 192px; opacity: 0.2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; transform: rotate(12deg); z-index: 0;} .hero-banner h1{font-size: clamp(1.25rem, 2vw, 1.875rem); font-weight: 800; text-transform: uppercase; margin-bottom: 0.5rem; position: relative; z-index: 10; line-height: 1.2;} .hero-banner p{opacity: 0.9; font-weight: 500; position: relative; z-index: 10; max-width: 44rem;} .hero-subtitle{font-size: 1rem; line-height: 1.45; letter-spacing: 0.2px;} .hero-badge{display: inline-block; font-weight: 700; color: var(--olinda-yellow);} .card{background: var(--olinda-white); border-radius: 0.75rem; padding: 1.5rem; box-shadow: var(--shadow-soft); border-left: 6px solid; border: 1px solid rgba(0, 0, 0, 0.04); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);} .card:hover{box-shadow: var(--shadow-hover); transform: translateY(-3px);} a.card{color: inherit; text-decoration: none;} a.card:focus-visible{outline: 3px solid rgba(37, 143, 200, 0.35); outline-offset: 4px;} .card-border-blue{border-left-color: var(--carnaval-blue);} .card-border-orange{border-left-color: var(--carnaval-orange);} .card-border-yellow{border-left-color: var(--carnaval-yellow);} .card-border-magenta{border-left-color: var(--carnaval-pink);} .card-border-green{border-left-color: var(--carnaval-teal);} .card-bg-blue{background: #E3F2FD;} .card-bg-orange{background: #FFF3E0;} .card-bg-yellow{background: #FFF9C4;} .card-bg-green{background: #E8F5E9;} .card-bg-magenta{background: #FCE4EC;} .card-icon{width: 56px; height: 56px; border-radius: 9999px; background: var(--olinda-white); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); margin-bottom: 1rem;} .card-icon.blue{color: var(--carnaval-blue);} .card-icon.orange{color: var(--carnaval-orange);} .card-icon.yellow{color: var(--carnaval-yellow);} .card-icon.green{color: var(--carnaval-teal);} .card-label{font-size: 0.75rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase; margin-bottom: 0.25rem;} .card-value{font-size: 1.5rem; font-weight: 800; color: var(--olinda-text);} .btn{display: inline-flex; align-items: center; justify-content: center; gap: var(--spacing-sm); padding: var(--spacing-sm) var(--spacing-lg); min-height: var(--touch-target-min); border: none; border-radius: 9999px; font-family: inherit; font-size: var(--font-size-sm); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; text-decoration: none; cursor: pointer; transition: all 0.2s; box-shadow: var(--shadow-soft); transform: scale(1);} .btn:active{transform: scale(0.95);} .btn:focus-visible{outline: 3px solid rgba(37, 143, 200, 0.4); outline-offset: 3px;} .btn-primary{background: var(--carnaval-blue); color: white;} .btn-primary:hover{background: var(--carnaval-teal); box-shadow: var(--shadow-hover);} .btn-action{background: var(--olinda-orange); color: white;} .btn-action:hover{background: var(--olinda-orange-dark); box-shadow: var(--shadow-hover);} .btn-yellow{background: var(--olinda-yellow); color: white;} .btn-yellow:hover{background: var(--olinda-yellow-dark);} .btn-magenta{background: var(--olinda-magenta); color: white;} .btn-magenta:hover{background: var(--olinda-magenta-dark);} .btn-green{background: var(--olinda-green); color: white;} .btn-green:hover{background: var(--olinda-green-dark);} .btn-outline{background: transparent; color: var(--carnaval-blue); border: 2px solid var(--carnaval-blue); box-shadow: none;} .btn-outline:hover{background: var(--carnaval-blue); color: white;} .btn-danger{background: var(--olinda-error); color: white;} .btn-danger:hover{background: #D32F2F;} .btn-ghost{background: transparent; color: var(--olinda-muted); box-shadow: none; text-transform: none;} .btn-ghost:hover{background: #F5F5F5;} .btn-sm{padding: var(--spacing-sm) var(--spacing-md); font-size: var(--font-size-xs); min-height: 2.5rem;} .btn-block{display: block; width: 100%;} .btn:disabled{opacity: 0.5; cursor: not-allowed; transform: none;} .section-title{display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem;} .section-title-dots{display: flex; flex-direction: column; gap: 0.25rem;} .section-title-dot{width: 4px; height: 4px; border-radius: 9999px;} .section-title-dot.blue{background: var(--carnaval-blue);} .section-title-dot.yellow{background: var(--carnaval-yellow);} .section-title-dot.magenta{background: var(--carnaval-pink);} .section-title h2{font-size: 1.5rem; font-weight: 800; text-transform: uppercase; color: var(--olinda-text);} .section-title .first{color: var(--carnaval-yellow); margin-right: 0.5rem;} .section-title .second{background: var(--carnaval-blue); color: white; padding: 0.25rem 0.5rem; border-radius: 4px;} .form-card{background: var(--olinda-white); border-radius: 0.75rem; padding: 2rem; box-shadow: var(--shadow-soft); border-left: 6px solid var(--carnaval-teal);} .form-group{margin-bottom: 1rem;} .form-group label{display: block; margin-bottom: 0.5rem; font-size: 0.875rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase; letter-spacing: 0.05em;} .form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group input[type="number"], .form-group input[type="date"], .form-group input[type="file"], .form-group select, .form-group textarea{width: 100%; padding: var(--spacing-sm) var(--spacing-md); min-height: var(--touch-target-min); background: var(--olinda-white); border: 1px solid var(--olinda-border); border-radius: 0.5rem; font-family: inherit; font-size: var(--font-size-base); font-weight: 500; color: var(--olinda-text); transition: all 0.2s; -webkit-appearance: none; appearance: none;} .form-group input:focus, .form-group select:focus, .form-group textarea:focus{outline: none; border-color: var(--carnaval-blue); box-shadow: 0 0 0 3px rgba(37, 143, 200, 0.1);} .form-group input::placeholder, .form-group textarea::placeholder{color: #999;} .form-help{display: block; margin-top: 0.25rem; font-size: 0.8125rem; color: var(--olinda-muted);} .form-section{margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--olinda-border);} .form-section-title{font-size: 1rem; font-weight: 800; color: var(--carnaval-blue); text-transform: uppercase; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem;} .required{color: var(--olinda-error);} .form-actions{display: flex; gap: 1rem; margin-top: 2rem;} .alert{padding: 1rem; border-radius: 0.5rem; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.5rem;} .alert-error{background-color: #FFEBEE; color: #C62828; border-left: 4px solid var(--olinda-error);} .alert-warning{background-color: #FFF3E0; color: #E65100; border-left: 4px solid var(--olinda-warning);} .alert-success{background-color: #E8F5E9; color: #2E7D32; border-left: 4px solid var(--olinda-success);} .table-container{background: var(--olinda-white); border-radius: 0.75rem; overflow: hidden; box-shadow: var(--shadow-soft); border: 1px solid var(--olinda-border); transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1); margin-bottom: var(--spacing-lg); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--olinda-border) transparent;} .table-container::-webkit-scrollbar{height: 8px;} .table-container::-webkit-scrollbar-track{background: var(--olinda-bg);} .table-container::-webkit-scrollbar-thumb{background: var(--olinda-border); border-radius: 4px;} .table-container::-webkit-scrollbar-thumb:hover{background: var(--olinda-muted);} .data-table{width: 100%; border-collapse: collapse; min-width: 45rem;} .data-table thead{background: var(--olinda-bg); border-bottom: 1px solid var(--olinda-border);} .data-table th{padding: 1rem; text-align: left; font-size: 0.75rem; font-weight: 800; color: var(--olinda-muted); text-transform: uppercase; letter-spacing: 0.05em;} .data-table td{padding: 1rem; border-bottom: 1px solid #F0F0F0;} .data-table tbody tr:hover{background-color: #E3F2FD; transition: background-color 0.2s;} .numero-cell{font-family: "Courier New", monospace; font-size: 1.1rem; font-weight: 700; color: var(--carnaval-blue);} .actions-cell{white-space: nowrap;} .actions-cell .btn{margin-right: 0.5rem;} .search-bar{margin-bottom: 1.5rem;} .search-form{display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;} .search-input{flex: 1; padding: 0.75rem 1rem; border: 1px solid var(--olinda-border); border-radius: 0.5rem; font-size: 1rem; font-weight: 500;} .search-input-wrapper{position: relative; flex: 1;} .search-icon{position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: #999;} .search-input-with-icon{padding-left: 3rem; width: 100%; padding: 0.75rem 1rem 0.75rem 3rem; border: 2px solid var(--olinda-border); border-radius: 9999px; font-size: 1.125rem; font-weight: 700; background: var(--olinda-bg);} .search-input-with-icon:focus{border-color: var(--carnaval-orange); outline: none;} .search-results{margin-top: 1rem; max-height: 400px; overflow-y: auto; border: 1px solid var(--olinda-border); border-radius: 0.5rem; background: var(--olinda-white); position: relative; z-index: 1;} .search-results-list{display: flex; flex-direction: column; position: relative; z-index: 2;} .search-result-item{display: flex; align-items: center; gap: 1rem; padding: 1rem; border-bottom: 1px solid #F0F0F0; transition: background-color 0.2s; cursor: pointer; position: relative; z-index: 1; pointer-events: auto;} .search-result-item:hover{background-color: #FFF3E0;} .search-result-item:last-child{border-bottom: none;} .result-thumb{width: 60px; height: 80px; flex-shrink: 0; border-radius: 4px; overflow: hidden; background: var(--olinda-bg); display: flex; align-items: center; justify-content: center;} .result-thumb img{width: 100%; height: 100%; object-fit: cover;} .placeholder-thumb{font-size: 2rem; color: var(--olinda-muted);} .result-info{flex: 1;} .result-number{color: var(--carnaval-blue); font-size: 1.1rem; font-weight: 700; margin-bottom: 0.25rem; font-family: "Courier New", monospace;} .result-name{font-weight: 700; margin-bottom: 0.25rem; color: var(--olinda-text);} .result-details{font-size: 0.875rem; color: var(--olinda-muted);} .search-results-empty{padding: 2rem; text-align: center; color: var(--olinda-muted);} .catador-confirm-card{background: linear-gradient(135deg, var(--carnaval-blue) 0%, var(--carnaval-teal) 100%); color: white; border-radius: 0.75rem; padding: 1.5rem; margin-bottom: 1.5rem; box-shadow: var(--shadow-hover); position: relative; overflow: hidden;} .confirm-card-content{display: flex; align-items: center; gap: 1.5rem; position: relative; z-index: 10;} .confirm-thumb{width: 120px; height: 160px; flex-shrink: 0; border-radius: 0.5rem; overflow: hidden; background: rgba(255, 255, 255, 0.2); display: flex; align-items: center; justify-content: center; border: 2px solid rgba(255, 255, 255, 0.3);} .confirm-thumb img{width: 100%; height: 100%; object-fit: cover;} .placeholder-thumb-large{font-size: 3rem; opacity: 0.7;} .confirm-info{flex: 1;} .confirm-label{font-size: 0.75rem; font-weight: 700; opacity: 0.8; margin-bottom: 0.5rem; text-transform: uppercase;} .confirm-number{font-size: 1.2rem; font-weight: 600; margin-bottom: 0.5rem; opacity: 0.9; font-family: "Courier New", monospace;} .confirm-name{font-size: 1.5rem; font-weight: 800; margin-bottom: 0.75rem; text-transform: uppercase;} .confirm-detail{font-size: 1rem; margin-bottom: 0.5rem; opacity: 0.9;} .quick-access-grid{display: grid; grid-template-columns: 1fr; gap: var(--spacing-md); margin-bottom: var(--spacing-xl); align-items: stretch; grid-auto-rows: 1fr;} @media (min-width: 768px){.quick-access-grid{grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg);}} @media (min-width: 1024px){.quick-access-grid{grid-template-columns: repeat(auto-fit, minmax(17.5rem, 1fr));}} .quick-access-card{border-radius: 0.75rem; padding: 1.5rem; color: white; text-align: left; transition: all 0.2s; box-shadow: var(--shadow-soft); cursor: pointer; height: 100%; display: flex; flex-direction: column; gap: 0.35rem;} .quick-access-card:hover{transform: translateY(-2px); box-shadow: var(--shadow-hover);} .quick-access-card:focus-visible{outline: 3px solid rgba(255, 255, 255, 0.6); outline-offset: 3px;} .quick-access-card.blue{background: var(--carnaval-blue);} .quick-access-card.blue:hover{background: var(--carnaval-teal);} .quick-access-card.green{background: var(--carnaval-teal);} .quick-access-card.green:hover{background: var(--carnaval-cyan);} .quick-access-card.magenta{background: var(--carnaval-pink);} .quick-access-card.magenta:hover{background: var(--carnaval-purple);} .quick-access-card.yellow{background: var(--olinda-yellow); color: #1a1a1a;} .quick-access-card.yellow:hover{background: var(--olinda-yellow-dark); color: #000;} .quick-access-card.yellow .quick-access-icon{background: rgba(0, 0, 0, 0.1);} .quick-access-card.orange{background: var(--carnaval-orange);} .quick-access-card.orange:hover{background: var(--carnaval-orange-dark);} .quick-access-card.darkgreen{background: var(--olinda-darkgreen);} .quick-access-card.darkgreen:hover{background: #1B5E20;} .quick-access-icon{background: rgba(255, 255, 255, 0.2); width: fit-content; padding: 0.75rem; border-radius: 0.5rem; margin-bottom: 1rem;} .quick-access-card h3{font-size: 1.25rem; font-weight: 800; text-transform: uppercase; margin-bottom: 0.25rem;} .quick-access-card p{font-size: 0.875rem; opacity: 0.9; margin-top: 0.25rem;} .dashboard-grid{display: grid; grid-template-columns: 1fr; gap: var(--spacing-md); margin-bottom: var(--spacing-xl); align-items: stretch; grid-auto-rows: 1fr;} @media (min-width: 768px){.dashboard-grid{grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg);}} @media (min-width: 1024px){.dashboard-grid{grid-template-columns: repeat(3, 1fr);}} @media (min-width: 1200px){.dashboard-grid{grid-template-columns: repeat(4, 1fr);}} .stats-card{display: flex; align-items: center; gap: 1rem; min-height: 120px; padding: 1.25rem; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); height: 100%;} .stats-card-link{text-decoration: none; color: inherit; display: flex; align-items: center; gap: 1rem; width: 100%; min-height: 120px; padding: 1.25rem; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); height: 100%;} .stats-card-link:hover{transform: translateY(-4px); box-shadow: var(--shadow-hover);} .stats-card-link:active{transform: translateY(-2px);} .stats-card-link:focus-visible{outline: 3px solid rgba(37, 143, 200, 0.4); outline-offset: 3px;} .chart-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; align-items: stretch; grid-auto-rows: 1fr;} .chart-card{background: var(--olinda-white); border-radius: 0.75rem; padding: 1.5rem; box-shadow: var(--shadow-soft); border: 1px solid var(--olinda-border); position: relative; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); cursor: default; height: 100%; display: flex; flex-direction: column;} .chart-card:hover{box-shadow: var(--shadow-hover); transform: translateY(-4px); border-color: var(--carnaval-blue);} .chart-card > div[style*="position: relative"]{width: 100%; position: relative;} .chart-card canvas{display: block; max-width: 100%;} .chart-card .donut-chart{margin: 0 auto;} .filter-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; align-items: end;} .public-page{background: var(--gray-50); color: var(--gray-900);} .public-header{position: relative; padding: 2.5rem 0; background: linear-gradient(135deg, #d4f4dd 0%, #d1e7f5 100%); overflow: hidden; border-bottom: 1px solid var(--gray-100);} .public-header-bg{position: absolute; inset: 0; background: radial-gradient(circle at 20% 30%, rgba(34, 197, 94, 0.12), transparent 55%), radial-gradient(circle at 80% 10%, rgba(59, 130, 246, 0.12), transparent 50%);} .public-header-content{position: relative; display: flex; justify-content: space-between; gap: 2rem; align-items: center; flex-wrap: wrap;} .public-brand{display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;} .hero-logo{max-width: 180px; margin: 0 auto 1.5rem;} @media (min-width: 768px){.hero-logo{max-width: 280px;}} .public-header h1{font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size: clamp(2rem, 5vw, 3.5rem); letter-spacing: -0.02em; line-height: 1.1; margin-bottom: 0.5rem; color: var(--gray-900);} .hero-subtitle{font-family: "Inter", "Open Sans", sans-serif; font-weight: 400; font-size: clamp(1rem, 2.5vw, 1.25rem); opacity: 0.85; line-height: 1.5; color: rgba(0, 0, 0, 0.65); max-width: 600px;} .public-header-right{display: flex; flex-direction: column; gap: 1rem; align-items: flex-end; flex-shrink: 0;} .badge-tempo-real{display: inline-flex; align-items: center; gap: 0.5rem; background: #FFFFFF; border: 1px solid var(--gray-100); padding: 0.5rem 1rem; border-radius: 999px; font-size: 0.875rem; font-weight: 500; color: var(--gray-900); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); animation: pulseGlow 2s ease-in-out infinite; white-space: nowrap;} .pulse-dot{width: 8px; height: 8px; background: #10b981; border-radius: 50%; animation: pulse 2s infinite;} @keyframes pulse{0%, 100%{opacity: 1; transform: scale(1);} 50%{opacity: 0.5; transform: scale(1.1);}} @keyframes pulseGlow{0%, 100%{box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4);} 50%{box-shadow: 0 0 0 8px rgba(16, 185, 129, 0);}} .btn-primary{background: linear-gradient(135deg, #FF6B35, #FF8C42); color: #FFFFFF; padding: 0.875rem 1.75rem; border-radius: 8px; font-weight: 600; font-size: 1rem; letter-spacing: 0.02em; border: none; box-shadow: 0 4px 12px rgba(255, 107, 53, 0.3); transition: all 0.2s ease; text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer;} .btn-primary:hover{transform: translateY(-2px); box-shadow: 0 6px 16px rgba(255, 107, 53, 0.4);} .btn-primary:active{transform: translateY(0);} .btn-link{color: var(--primary-600); font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem;} .hero-impact{padding: 2rem 0;} .hero-impact-card{background: linear-gradient(135deg, var(--primary-700), #4a9945); border-radius: 16px; padding: 3rem; color: #FFFFFF; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); display: flex; justify-content: space-between; align-items: center; gap: 2rem; flex-wrap: wrap;} .hero-impact-label{font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; opacity: 0.9;} .hero-impact-number{font-family: "Inter", -apple-system, sans-serif; font-size: clamp(2.5rem, 8vw, 4.5rem); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.03em; margin: 0.5rem 0 0.25rem; animation: countUp 0.3s ease-out;} .hero-impact-sub{font-size: clamp(1rem, 2vw, 1.125rem); opacity: 0.9; font-weight: 500;} .hero-impact-meta{margin-top: 0.75rem; font-size: 1rem; opacity: 0.9;} .hero-impact-icon{font-size: 3rem; opacity: 0.7;} .hero-impact-icon svg{width: 48px; height: 48px;} .kpi-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin: 3rem 0; align-items: stretch; grid-auto-rows: 1fr;} .kpi-card{background: #FFFFFF; border-radius: 16px; padding: 1.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 10px 20px rgba(0,0,0,0.03); border: 1px solid rgba(0,0,0,0.05); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); animation: fadeInUp 0.6s ease-out; animation-fill-mode: both; height: 100%; display: flex; flex-direction: column;} .kpi-card:nth-child(1){animation-delay: 0.1s;} .kpi-card:nth-child(2){animation-delay: 0.2s;} .kpi-card:nth-child(3){animation-delay: 0.3s;} .kpi-card:nth-child(4){animation-delay: 0.4s;} .kpi-value.updated, .hero-impact-number.updated{animation: countUp 0.3s ease-out;} .kpi-card:hover{transform: translateY(-4px); box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 20px 40px rgba(0,0,0,0.06);} .kpi-icon{width: 56px; height: 56px; background: linear-gradient(135deg, var(--primary-500), var(--primary-600)); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #FFFFFF; font-size: 1.25rem; box-shadow: 0 2px 8px rgba(0,0,0,0.08);} .kpi-icon svg{width: 28px; height: 28px; stroke-width: 2px;} .kpi-label{font-size: 0.75rem; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.7; margin-bottom: 0.5rem;} .kpi-value{font-family: "Inter", -apple-system, sans-serif; font-weight: 600; font-size: clamp(2.5rem, 6vw, 4.5rem); font-variant-numeric: tabular-nums; letter-spacing: -0.03em; line-height: 1; color: var(--gray-900); margin-bottom: 0.5rem; animation: countUp 0.3s ease-out;} .kpi-value small{font-size: 0.5em; font-weight: 500; opacity: 0.8;} .kpi-meta{font-size: 0.875rem; font-weight: 400; color: var(--gray-600); opacity: 0.75;} .kpi-total{background: #FFF9F0; border-left: 4px solid #FF6B35;} .kpi-coleta{background: #F0F9FF; border-left: 4px solid #4A9BE8;} .kpi-eventos{background: #FEF3C7; border-left: 4px solid #d4a228;} .kpi-catadores{background: #D1FAE5; border-left: 4px solid #10b981;} .public-section-header{text-align: center; margin-bottom: 1.5rem;} .public-section-header h2{font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 600; margin-bottom: 0.5rem; letter-spacing: -0.01em; line-height: 1.2;} .public-section-header p{font-size: clamp(0.875rem, 2vw, 1rem); color: var(--gray-600); opacity: 0.8; line-height: 1.5;} .public-chart-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; align-items: stretch; grid-auto-rows: 1fr;} .public-chart-card{background: #FFFFFF; border-radius: 12px; padding: 1.5rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); text-align: center; height: 100%; display: flex; flex-direction: column;} .chart-title{font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gray-600); margin-bottom: 0.75rem; opacity: 0.7;} .chart-total{font-family: "Inter", -apple-system, sans-serif; font-size: clamp(1.25rem, 3vw, 1.5rem); font-weight: 600; font-variant-numeric: tabular-nums; margin-top: 0.5rem; color: var(--gray-900);} .chart-legend{margin-top: 0.75rem; display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.875rem;} .chart-legend-item{display: flex; gap: 0.5rem; align-items: center; justify-content: space-between;} .chart-legend .color-dot{width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;} .chart-legend .material{flex: 1; font-size: 0.875rem; font-weight: 500; color: var(--gray-600);} .chart-legend .value{font-weight: 600; font-size: 0.875rem; font-variant-numeric: tabular-nums; color: rgba(0,0,0,0.65);} .chart-legend span{display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem;} .chart-legend i{width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0;} .public-events{margin-top: 2.5rem;} .public-events-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; align-items: stretch; grid-auto-rows: 1fr;} .event-card{background: #FFFFFF; border-radius: 12px; padding: 1.25rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); height: 100%; display: flex; flex-direction: column;} .event-card-header{display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.5rem;} .event-badge{font-size: 0.6875rem; font-weight: 600; padding: 0.375rem 0.75rem; border-radius: 6px; text-transform: uppercase; letter-spacing: 0.1em;} .event-badge.ativo{background: #E8F5E9; color: #2E7D32;} .event-badge.aguardando{background: #FFF3E0; color: #E65100;} .event-total{font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem;} .event-bars{display: grid; gap: 0.5rem; font-size: 0.75rem;} .event-bar{display: flex; gap: 0.5rem; align-items: center;} .event-bar span{width: 70px; color: var(--gray-600);} .event-bar .bar{flex: 1; background: var(--gray-100); border-radius: 999px; height: 6px; overflow: hidden;} .event-bar .bar div{height: 100%; background: var(--secondary-500);} .event-empty{color: var(--gray-600); font-size: 0.85rem;} .event-empty-state{color: var(--gray-600); text-align: center; grid-column: 1 / -1;} .public-sponsors{background: linear-gradient(180deg, #f9fafb 0%, #ffffff 100%); margin-top: 3rem; padding: 4rem 0; border-top: 2px solid #e5e7eb;} .sponsor-header{text-align: center; max-width: 800px; margin: 0 auto 3rem;} .sponsor-icon{font-size: 2.5rem; margin-bottom: 1rem;} .sponsor-header h2{font-size: 2rem; font-weight: 700; margin-bottom: 1rem;} .sponsor-header p{font-size: 1.1rem; font-style: italic; color: var(--gray-600);} .sponsor-divider{width: 80px; height: 4px; background: linear-gradient(90deg, #2d7a3e, #4A9BE8); margin: 1.5rem auto 0; border-radius: 2px;} .sponsor-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1.5rem; max-width: 1000px; margin: 0 auto 3rem;} .sponsor-card{background: #FFFFFF; border-radius: 12px; padding: 1.5rem 1rem; min-height: 100px; max-height: 120px; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); filter: grayscale(100%) opacity(0.6); transition: all 0.3s ease; border: 2px solid transparent; font-weight: 600; color: var(--gray-600); text-decoration: none; overflow: hidden;} .sponsor-card:hover{filter: grayscale(0%) opacity(1); transform: translateY(-8px) scale(1.02); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.15); border-color: var(--secondary-500);} .sponsor-card img{max-width: 100%; max-height: 60px; width: auto; height: auto; object-fit: contain;} .partner-logo{filter: grayscale(100%) opacity(0.6); transition: all 0.3s;} .partner-logo:hover{filter: grayscale(0%) opacity(1);} .sponsor-support{text-align: center; border-top: 1px solid #e5e7eb; padding-top: 2rem;} .sponsor-support h3{font-size: 1rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--gray-600); margin-bottom: 1rem;} .sponsor-support-grid{display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; max-width: 800px; margin: 0 auto;} .sponsor-support-card{background: #FFFFFF; border-radius: 8px; padding: 0.75rem 1rem; min-width: 100px; max-width: 200px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); filter: grayscale(80%); opacity: 0.8; transition: all 0.3s ease; color: var(--gray-600); font-weight: 600; text-decoration: none; display: flex; align-items: center; justify-content: center; overflow: hidden;} .sponsor-support-card:hover{filter: grayscale(0%); opacity: 1; transform: translateY(-4px);} .sponsor-support-card img{max-width: 100%; max-height: 40px; width: auto; height: auto; object-fit: contain;} .footer.public-footer{background: #111827; color: #F9FAFB; padding: 3rem 0;} .footer.public-footer a{color: #60A5FA; text-decoration: none; display: block; margin-top: 0.35rem;} .footer-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2rem; margin-bottom: 2rem;} .footer-bottom{display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem; color: #D1D5DB;} @keyframes fadeInUp{from{opacity: 0; transform: translateY(20px);} to{opacity: 1; transform: translateY(0);}} @keyframes countUp{from{opacity: 0; transform: translateY(4px);} to{opacity: 1; transform: translateY(0);}} @keyframes pulse{0%, 100%{opacity: 1; transform: scale(1);} 50%{opacity: 0.6; transform: scale(1.05);}} .update-indicator{animation: pulse 2s ease-in-out infinite;} @media (max-width: 1024px){.hero-impact-number{font-size: clamp(2rem, 6vw, 3rem);} .kpi-value{font-size: clamp(2rem, 5vw, 3rem);}} @media (max-width: 768px){.public-header-content{flex-direction: column; align-items: flex-start;} .public-header-right{align-items: flex-start;} .hero-impact-card{padding: 2rem;} .public-header h1{font-size: clamp(1.75rem, 4vw, 2rem); text-align: center;} .kpi-grid{grid-template-columns: repeat(2, 1fr); gap: 1rem;} .public-chart-grid{grid-template-columns: 1fr; gap: 1.5rem;}} @media (max-width: 640px){.kpi-grid{grid-template-columns: 1fr;} .public-header h1{font-size: 1.75rem;} .hero-subtitle{font-size: 1rem;}} .stats-icon{width: 56px; height: 56px; min-width: 56px; border-radius: 9999px; background: var(--olinda-white); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);} .stats-card-link:hover .stats-icon{transform: scale(1.1);} .stats-icon.orange{color: var(--carnaval-orange);} .stats-icon.blue{color: var(--carnaval-blue);} .stats-icon.yellow{color: var(--carnaval-yellow);} .stats-icon.green{color: var(--carnaval-teal);} .stats-icon.magenta{color: var(--carnaval-pink);} .stats-info{flex: 1;} .stats-label{font-size: 0.75rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase; margin-bottom: 0.25rem;} .stats-value{font-size: 1.5rem; font-weight: 800; color: var(--olinda-text); line-height: 1.2; word-break: break-word;} .stats-value small{font-size: 0.875rem; font-weight: 600; opacity: 0.8;} .page-header{display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; flex-wrap: wrap; gap: 1rem;} .page-header > *{min-width: 0;} .page-header h2{color: var(--carnaval-blue); font-size: 2rem; font-weight: 800;} .detail-header{display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 2rem; flex-wrap: wrap; gap: 1rem;} .detail-title h2{color: var(--carnaval-blue); font-size: 2rem; font-weight: 800; margin-bottom: 0.5rem;} .subtitle{color: var(--olinda-muted); font-size: 1.1rem; font-weight: 500;} .detail-actions{display: flex; gap: 1rem; flex-wrap: wrap;} .detail-content{display: flex; flex-direction: column; gap: 2rem;} .detail-card{background: var(--olinda-white); border-radius: 0.75rem; padding: 2rem; box-shadow: var(--shadow-soft); display: flex; gap: 2rem; flex-wrap: wrap; border: 1px solid rgba(0, 0, 0, 0.04);} .catador-photo{flex-shrink: 0;} .catador-photo img{width: 200px; height: 267px; object-fit: cover; border-radius: 0.5rem; box-shadow: var(--shadow-lg);} .detail-info{flex: 1; min-width: 300px;} .info-row{display: flex; padding: 0.75rem 0; border-bottom: 1px solid var(--olinda-border); gap: 1rem;} .info-row:last-child{border-bottom: none;} .info-label{font-weight: 700; width: 150px; color: var(--olinda-muted); font-size: 0.875rem; text-transform: uppercase;} .info-value{flex: 1; color: var(--olinda-text); font-weight: 500;} .login-container{min-height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; background: #1a1a1a; overflow: hidden; padding: 2rem 1rem;} .login-background{position: absolute; inset: 0; z-index: 0; opacity: 0.4;} .login-background::before{content: ""; position: absolute; inset: 0; background: var(--carnaval-blue); mix-blend-mode: multiply;} .login-background img{width: 100%; height: 100%; object-fit: cover;} .login-wave{position: absolute; bottom: 0; width: 100%; height: 128px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%238DC641' fill-opacity='0.2' d='M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,112C672,96,768,96,864,112C960,128,1056,160,1152,160C1248,160,1344,128,1392,112L1440,96L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: bottom; background-size: cover; z-index: 10;} .login-card{background: var(--olinda-white); padding: 2.5rem; border-radius: 0.75rem; box-shadow: var(--shadow-lg); width: 100%; max-width: 400px; position: relative; z-index: 20; border-top: 8px solid var(--carnaval-teal);} @media (max-width: 640px){.login-card{padding: 1.5rem; border-radius: 0.75rem;} .login-title{font-size: 1.5rem;} .login-footer{flex-direction: column; gap: 0.25rem;}} .login-header{text-align: center; margin-bottom: 1.5rem;} .login-logo{height: 60px; width: auto; margin: 0 auto 1rem; object-fit: contain; display: block;} .login-icon{width: 40px; height: 40px; margin: 0 auto 0.5rem; color: var(--carnaval-teal);} .login-subtitle{font-size: 0.75rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase; letter-spacing: 0.1em;} .login-title{font-size: 1.875rem; font-weight: 800; color: var(--carnaval-blue); text-transform: uppercase; line-height: 1.2; margin-top: 0.25rem;} .login-title .sustentavel{color: var(--carnaval-orange);} .login-divider{width: 64px; height: 4px; background: var(--carnaval-yellow); margin: 0.75rem auto 0; border-radius: 9999px;} .login-form{margin-top: 1.5rem;} .login-footer{margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--olinda-border); display: flex; justify-content: center; gap: 1rem; font-size: 0.75rem; font-weight: 700; color: var(--olinda-muted); text-transform: uppercase; letter-spacing: 0.05em;} .pagination{display: flex; justify-content: space-between; align-items: center; margin-top: 2rem; flex-wrap: wrap; gap: 1rem;} .pagination-info{color: var(--olinda-muted); font-weight: 500;} .badge{display: inline-block; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;} .badge-admin{background-color: var(--olinda-error); color: white;} .badge-supervisor{background-color: var(--olinda-warning); color: white;} .badge-usuario_local{background-color: var(--olinda-muted); color: white;} .badge-operador_local_balanca{background-color: var(--olinda-blue); color: white;} .badge-operador_local_tesouraria{background-color: var(--olinda-green); color: white;} .badge-supervisor_balanca{background-color: var(--olinda-orange); color: white;} .badge-supervisor_tesouraria{background-color: var(--olinda-magenta); color: white;} .badge-paid{background-color: var(--olinda-green); color: white;} .empty-state{text-align: center; padding: 4rem 2rem; background: var(--olinda-white); border-radius: 0.75rem; box-shadow: var(--shadow-soft);} .empty-state p{color: var(--olinda-muted); font-size: 1.1rem; margin-bottom: 1.5rem;} @media (max-width: 767px){.container{padding: 0 var(--spacing-sm);} .main{padding: var(--spacing-md) 0;} .header{min-height: 4rem; padding: var(--spacing-sm) 0;} .header-content{gap: var(--spacing-sm);} .logo-image{height: 2.25rem;} .logo-icon{width: 2.25rem; height: 2.25rem;} .header-center{flex: 1; min-width: 0; max-width: 100%;} .nav-user{display: none;} .btn-logout{width: 2.25rem; height: 2.25rem;} .nav-link{padding: var(--spacing-sm); font-size: var(--font-size-xs); min-height: 2.5rem;} .nav-link svg{width: 1rem; height: 1rem;} .page-header, .detail-header{flex-direction: column; align-items: flex-start; gap: var(--spacing-md);} .stats-card, .stats-card-link{min-height: 6.25rem; padding: var(--spacing-md); flex-direction: column; text-align: center; gap: var(--spacing-sm);} .stats-icon{width: 3rem; height: 3rem; min-width: 3rem;} .stats-value{font-size: var(--font-size-xl);} .detail-card{flex-direction: column; gap: var(--spacing-md);} .confirm-card-content{flex-direction: column; text-align: center; gap: var(--spacing-md);} .form-actions{flex-direction: column; gap: var(--spacing-sm);} .form-actions .btn{width: 100%;} .hero-banner{padding: var(--spacing-lg);} .hero-banner h1{font-size: var(--font-size-2xl);} .card{padding: var(--spacing-md);} .table-container{margin-left: calc(-1 * var(--spacing-sm)); margin-right: calc(-1 * var(--spacing-sm)); border-radius: 0; border-left: none; border-right: none;} .form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group input[type="number"], .form-group input[type="date"], .form-group select, .form-group textarea{font-size: var(--font-size-base);} .form-section > div[style*="grid"]{grid-template-columns: 1fr !important;} .form-section > div[style*="grid-column: span"]{grid-column: span 1 !important;}} @media (max-width: 900px){.detail-header{align-items: flex-start;} .info-row{flex-direction: column; gap: 0.25rem;} .info-label{width: auto;}} @media (max-width: 1024px){.header-center{position: relative; overflow: hidden;} .header-center::before, .header-center::after{content: ""; position: absolute; top: 0; bottom: 0; width: 20px; pointer-events: none; z-index: 10; transition: opacity 0.3s;} .header-center::before{left: 0; background: linear-gradient(to right, var(--olinda-white), transparent);} .header-center::after{right: 0; background: linear-gradient(to left, var(--olinda-white), transparent);} .header-center.scroll-start::before{opacity: 0;} .header-center.scroll-end::after{opacity: 0;}} @media (max-width: 480px){.header-right{gap: 0.25rem;} .logo-image{height: 34px;} .logo-icon{width: 34px; height: 34px;} .btn{padding: 0.65rem 1rem; font-size: 0.8125rem;} .stats-value{font-size: 1.25rem;} .page-header h2, .detail-title h2{font-size: 1.5rem;} .form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group input[type="number"], .form-group input[type="date"], .form-group input[type="file"], .form-group select, .form-group textarea{font-size: 0.95rem;} .form-section > div[style*="grid"]{grid-template-columns: 1fr !important;} .form-section > div[style*="grid-column: span"]{grid-column: span 1 !important;} .form-card{padding: 1rem;} .form-section{margin-top: 1.5rem; padding-top: 1rem;} .form-section-title{font-size: 0.875rem;}} @media (max-width: 640px){.search-form{flex-direction: column; align-items: stretch;} .search-form .btn{width: 100%;}} .opacity-50{opacity: 0.5;} .pointer-events-none{pointer-events: none;} .transition-all{transition: all 0.2s;} .responsive-grid, [style*="grid-template-columns"]{display: grid;} @media (max-width: 767px){.responsive-grid, [style*="grid-template-columns"]{grid-template-columns: 1fr !important;} [style*="grid-column: span"]{grid-column: span 1 !important;}} .current-photo{margin-bottom: 1rem;} .current-photo label{display: flex; align-items: center; gap: 0.5rem; margin-top: 0.5rem; font-weight: normal; text-transform: none;} .opacity-50{opacity: 0.5;} .pointer-events-none{pointer-events: none;} .transition-all{transition: all 0.2s;} .htmx-indicator{display: none; opacity: 0; transition: opacity 0.3s ease-in-out;} .htmx-request .htmx-indicator, .htmx-request.htmx-indicator{display: flex; opacity: 1;} .search-spinner{position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); align-items: center; gap: var(--spacing-sm); color: var(--olinda-orange); font-size: var(--font-size-sm); font-weight: 600; pointer-events: none;} .spinner{width: 1rem; height: 1rem; border: 2px solid var(--olinda-border); border-top-color: var(--olinda-orange); border-radius: 50%; animation: spin 0.6s linear infinite; flex-shrink: 0;} .spinner-small{width: 1rem; height: 1rem; border: 2px solid rgba(255, 255, 255, 0.3); border-top-color: white; border-radius: 50%; animation: spin 0.6s linear infinite; display: inline-block; margin-right: var(--spacing-sm);} .spinner-large{width: 3rem; height: 3rem; border: 4px solid var(--olinda-bg); border-top-color: var(--olinda-orange); border-radius: 50%; animation: spin 0.8s linear infinite; margin: 0 auto var(--spacing-md);} @keyframes spin{to{transform: rotate(360deg);}} .spinner-text{font-size: var(--font-size-sm); color: var(--olinda-muted);} .search-input-wrapper{position: relative;} .search-results-header{padding: var(--spacing-sm) var(--spacing-md); background: var(--olinda-bg); border-bottom: 1px solid var(--olinda-border); font-size: var(--font-size-sm); font-weight: 600; color: var(--olinda-muted);} .results-count{color: var(--olinda-blue); font-weight: 700;} .search-results-empty{padding: var(--spacing-xl) var(--spacing-md); text-align: center; color: var(--olinda-muted);} .search-results-empty svg{color: var(--olinda-border); margin-bottom: var(--spacing-md); opacity: 0.6;} .empty-title{font-size: var(--font-size-lg); font-weight: 700; color: var(--olinda-text); margin-bottom: var(--spacing-sm);} .empty-message{font-size: var(--font-size-sm); margin-bottom: var(--spacing-sm);} .empty-message strong{color: var(--olinda-text); font-weight: 700;} .empty-hint{font-size: var(--font-size-xs); color: var(--olinda-muted); margin-top: var(--spacing-sm);} .search-results-placeholder{padding: var(--spacing-xl) var(--spacing-md); text-align: center; color: var(--olinda-muted);} .search-results-placeholder svg{color: var(--olinda-border); margin-bottom: var(--spacing-md); opacity: 0.5;} .search-skeleton{padding: var(--spacing-md);} .skeleton-item{padding: var(--spacing-md); border-bottom: 1px solid var(--olinda-border); display: flex; justify-content: space-between; align-items: center; gap: var(--spacing-md);} .skeleton-line{height: 1rem; background: linear-gradient(90deg, var(--olinda-bg) 0%, #E8E8E8 50%, var(--olinda-bg) 100%); background-size: 200% 100%; animation: skeleton-loading 1.5s ease-in-out infinite; border-radius: 0.25rem;} .skeleton-title{width: 60%; height: 1.25rem;} .skeleton-subtitle{width: 40%; height: 0.875rem; margin-top: var(--spacing-sm);} .skeleton-badge{width: 3rem; height: 1.5rem; border-radius: 0.25rem;} .skeleton-thumb{width: 120px; height: 160px; border-radius: 0.5rem; background: linear-gradient(90deg, var(--olinda-bg) 0%, #E8E8E8 50%, var(--olinda-bg) 100%); background-size: 200% 100%; animation: skeleton-loading 1.5s ease-in-out infinite;} .skeleton-content{flex: 1; display: flex; flex-direction: column; gap: var(--spacing-sm);} .skeleton-text{width: 80%; height: 0.875rem;} @keyframes skeleton-loading{0%{background-position: 200% 0;} 100%{background-position: -200% 0;}} [data-tooltip]{position: relative;} [data-tooltip]:hover::after, [data-tooltip]:focus::after{content: attr(data-tooltip); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: var(--spacing-sm); padding: var(--spacing-sm) var(--spacing-md); background: var(--olinda-text); color: white; font-size: var(--font-size-sm); font-weight: 600; white-space: nowrap; border-radius: 0.25rem; box-shadow: var(--shadow-lg); z-index: 1000; pointer-events: none; animation: tooltipFadeIn 0.2s ease-out;} [data-tooltip]:hover::before, [data-tooltip]:focus::before{content: ""; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 0.125rem; border: 6px solid transparent; border-top-color: var(--olinda-text); z-index: 1000; pointer-events: none;} @keyframes tooltipFadeIn{from{opacity: 0; transform: translateX(-50%) translateY(4px);} to{opacity: 1; transform: translateX(-50%) translateY(0);}} .field-error{border-color: var(--olinda-error) !important; box-shadow: 0 0 0 3px rgba(244, 67, 54, 0.1) !important;} .field-error-message{display: block; margin-top: var(--spacing-xs); font-size: var(--font-size-sm); color: var(--olinda-error); font-weight: 600; display: flex; align-items: center; gap: var(--spacing-xs);} .field-error-message::before{content: "⚠"; font-size: var(--font-size-base);} .field-success{border-color: var(--olinda-success) !important;} .select-spinner{position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.9); display: none; align-items: center; justify-content: center; z-index: 9999; backdrop-filter: blur(2px); pointer-events: none;} .htmx-request #select-spinner{display: flex; pointer-events: auto;} .spinner-overlay{text-align: center;} .spinner-overlay p{color: var(--olinda-muted); font-weight: 600; font-size: var(--font-size-base);} .btn:disabled{opacity: 0.5; cursor: not-allowed; position: relative;} .btn:disabled:hover{transform: none; box-shadow: var(--shadow-soft);} .financeiro-total-card{background: linear-gradient(135deg, var(--olinda-green) 0%, var(--olinda-green-dark) 100%) !important; border-left-color: var(--olinda-green-dark) !important;} .financeiro-total-card .financeiro-label{color: rgba(255, 255, 255, 0.95) !important; font-weight: 700; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);} .financeiro-total-card .financeiro-value{color: #FFFFFF !important; font-weight: 900; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); font-size: 2rem;} .financeiro-total-card .financeiro-link{margin-top: 0.5rem; font-size: 0.75rem; display: flex; align-items: center; gap: 0.25rem; color: rgba(255, 255, 255, 0.95) !important; font-weight: 600; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);} .financeiro-total-card:hover{transform: translateY(-2px); box-shadow: 0 8px 20px rgba(46, 125, 50, 0.3);} .financeiro-total-card:hover .financeiro-value{transform: scale(1.02); transition: transform 0.2s ease;} .financeiro-periodo-card{background: linear-gradient(135deg, var(--olinda-green) 0%, var(--olinda-green-dark) 100%) !important; border-left-color: var(--olinda-green-dark) !important;} .financeiro-periodo-title{color: rgba(255, 255, 255, 0.95) !important; font-weight: 700; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); margin-bottom: 0.5rem;} .financeiro-periodo-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; margin-top: 0.5rem;} .financeiro-periodo-item{display: flex; flex-direction: column;} .financeiro-periodo-label{font-size: 0.75rem; font-weight: 600; color: rgba(255, 255, 255, 0.9) !important; text-transform: uppercase; margin-bottom: 0.25rem; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);} .financeiro-periodo-value{font-size: 1.75rem; font-weight: 900; color: #FFFFFF !important; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); line-height: 1.2;} .financeiro-periodo-value small{font-size: 1rem; font-weight: 700; opacity: 0.95; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);} .financeiro-periodo-card:hover{transform: translateY(-2px); box-shadow: 0 8px 20px rgba(46, 125, 50, 0.3); transition: all 0.3s ease;} .materiais-total-card{background: linear-gradient(135deg, var(--olinda-orange) 0%, var(--olinda-orange-dark) 100%) !important; border-left-color: var(--olinda-orange-dark) !important;} .materiais-total-label{color: rgba(255, 255, 255, 0.95) !important; font-weight: 700; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);} .materiais-total-value{color: #FFFFFF !important; font-weight: 900; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); font-size: 2rem;} .materiais-total-value small{font-size: 1rem; font-weight: 700; opacity: 0.95; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);} .materiais-total-link{margin-top: 0.5rem; font-size: 0.75rem; display: flex; align-items: center; gap: 0.25rem; color: rgba(255, 255, 255, 0.95) !important; font-weight: 600; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);} .materiais-total-card:hover{transform: translateY(-2px); box-shadow: 0 8px 20px rgba(255, 120, 67, 0.3); transition: all 0.3s ease;} .materiais-total-card:hover .materiais-total-value{transform: scale(1.02); transition: transform 0.2s ease;} .page-watermark{n+ display: none !important;n}} .main{position: relative; z-index: 1;} .public-sponsors-bar{width: 100%; max-width: 100%; margin: 0 auto; padding: 1rem 0; background: #FFFFFF; border-top: 2px solid var(--carnaval-pink); overflow: hidden;} .public-sponsors-bar img{width: 100%; height: auto; max-height: 120px; object-fit: contain; display: block;} .carnaval-brand{position: fixed; bottom: 1rem; right: 1rem; width: 120px; height: 120px; opacity: 0.12; z-index: 10; pointer-events: none; transition: opacity 0.3s ease; background-size: contain; background-repeat: no-repeat; background-position: bottom right;} .carnaval-brand:hover{opacity: 0.2;} @media (max-width: 768px){.carnaval-brand{width: 80px; height: 80px; bottom: 0.5rem; right: 0.5rem;}} @keyframes pageTransition{from{opacity: 0; transform: translateY(10px);} to{opacity: 1; transform: translateY(0);}} @keyframes watermarkFade{from{opacity: 0;} to{opacity: 0.03;}} .fade-in{animation: pageTransition 0.4s ease-out;} .page-watermark{animation: watermarkFade 0.8s ease-out;} .ods-card{position: relative; padding-left: 3.5rem;} .ods-card::before{content: ""; position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; border-radius: 4px; background-size: contain; background-repeat: no-repeat; background-position: center; opacity: 0.8;} .ods-card.ods-6::before{background-color: #258FC8; background-image: url("/static/images/ods_cluster_tr_x4.png"); background-size: 300%; background-position: 20% 30%;} .ods-card.ods-7::before{background-color: #FFC40D; background-image: url("/static/images/ods_cluster_tr_x4.png"); background-size: 300%; background-position: 50% 30%;} .ods-card.ods-11::before{background-color: #FF8B17; background-image: url("/static/images/ods_cluster_bl_x4.png"); background-size: 300%; background-position: 20% 70%;} .ods-card.ods-12::before{background-color: #03A398; background-image: url("/static/images/ods_cluster_bl_x4.png"); background-size: 300%; background-position: 50% 70%;} .ods-card.ods-13::before{background-color: #03A398; background-image: url("/static/images/ods_cluster_br_x4.png"); background-size: 300%; background-position: 20% 50%;} .ods-card.ods-15::before{background-color: #03A398; background-image: url("/static/images/ods_cluster_br_x4.png"); background-size: 300%; background-position: 50% 70%;} .page-watermark{display: none !important;} .carnaval-brand{background-image: none !important;} .ticket-toolbar{border-left-width: 6px;} .ticket-toolbar-content{display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap;} .ticket-toolbar-actions{display: inline-flex; align-items: center; gap: 0.5rem; flex-wrap: wrap;} .pagar-toolbar-meta{display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap;} .pagar-pendentes-tag{display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.2rem 0.65rem; border-radius: 999px; background: #eaf4ff; color: #2f557c; font-size: 0.8rem; font-weight: 700;} .btn-select-pendentes, .btn-clear-selecao{text-transform: none; letter-spacing: 0; min-height: 40px; border-radius: 12px; box-shadow: none;} .btn-select-pendentes{border: 1px solid #bdd4ef; background: #f5faff; color: #24507a;} .btn-select-pendentes:hover{background: #e8f2ff;} .btn-select-pendentes.is-active{border-color: #9ac9b2; background: #e9f6ef; color: #1f5d41;} .btn-clear-selecao{border: 1px solid #d7dee8; background: #f8f9fc; color: #42566d;} .btn-clear-selecao:hover{background: #edf1f6;} .btn-select-pendentes:disabled, .btn-clear-selecao:disabled, #pagar-btn:disabled{opacity: 0.55; cursor: not-allowed; box-shadow: none;} .ticket-menu{position: relative; display: inline-block;} .ticket-menu-dropdown{position: absolute; right: 0; top: calc(100% + 0.35rem); min-width: 240px; background: #ffffff; border: 1px solid #d9e3ef; border-radius: 10px; box-shadow: 0 10px 24px rgba(17, 50, 84, 0.15); padding: 0.35rem; z-index: 20;} .ticket-menu-item{width: 100%; border: none; background: transparent; text-align: left; padding: 0.55rem 0.65rem; border-radius: 8px; font-size: 0.84rem; font-weight: 700; color: #26415e; cursor: pointer;} .ticket-menu-item:hover{background: #eef5ff;} .group-master-cell{text-align: center; vertical-align: middle; background: #edf4ff; border-right: 1px solid #dfe8f4; position: relative; min-width: 62px;} .group-master-cell::after{content: ""; position: absolute; right: -1px; top: 12%; bottom: 12%; border-right: 2px solid #cfd9e8;} .group-master-check{width: 24px; height: 24px; cursor: pointer; accent-color: #0d78d1;} .group-master-cell-main .group-master-check{transform: scale(1.08);} .group-master-placeholder{display: none;} .select-cell{text-align: center;} .select-cell input[type="checkbox"]{width: 16px; height: 16px; cursor: pointer; accent-color: #d22f57;} .data-table tbody tr.group-alt-a{background-color: #f7fbff;} .data-table tbody tr.group-alt-b{background-color: #ffffff;} .data-table tbody tr.group-alt-a:hover, .data-table tbody tr.group-alt-b:hover{background-color: #e6f2ff;} .ticket-row-disabled{opacity: 0.45;} .actions-cell-inline{white-space: nowrap;} .actions-cell-inline .btn{margin-right: 0.4rem;} .btn-soft-edit{background: #eef6ff; color: #1e5aa7; border: 1px solid #c6ddf8; box-shadow: none; text-transform: none; letter-spacing: 0;} .btn-soft-edit:hover{background: #dfedff; box-shadow: none;} .btn-soft-delete{background: #fff2f2; color: #b63636; border: 1px solid #f1c8c8; box-shadow: none; text-transform: none; letter-spacing: 0;} .btn-soft-delete:hover{background: #ffe9e9; box-shadow: none;} .landing-hero-shell, .landing-story-card, .landing-points-card, .landing-participation-card{position: relative; overflow: hidden; border-radius: 1.5rem; border: 1px solid rgba(16, 40, 63, 0.08); background: linear-gradient(180deg, rgba(255, 250, 244, 0.96), rgba(255, 246, 238, 0.88)); box-shadow: 0 22px 44px rgba(15, 32, 49, 0.08);} .landing-hero-shell{margin-bottom: 1.5rem; padding: 1.6rem; background: radial-gradient(circle at top right, rgba(255, 196, 13, 0.24), transparent 24%), linear-gradient(140deg, #10283f 0%, #11263d 50%, #0d625b 100%); border-color: rgba(255, 255, 255, 0.1); box-shadow: 0 28px 48px rgba(15, 32, 49, 0.2);} .landing-hero-grid{display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr); gap: 1.5rem; align-items: center;} .landing-hero-copy{max-width: 60rem;} .landing-hero-brand{display: inline-flex; align-items: center; gap: 0.65rem; margin-bottom: 0.75rem; padding: 0; border-radius: 0.35rem; background: transparent; border: 0; backdrop-filter: none;} .landing-hero-logo{display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;} .landing-hero-logo img{display: block; width: clamp(86px, 10vw, 138px); height: auto; object-fit: contain; filter: drop-shadow(0 10px 24px rgba(6, 25, 18, 0.26));} .landing-hero-brand-copy{display: grid; gap: 0.12rem;} .landing-hero-brand-copy span{font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(241, 255, 245, 0.72);} .landing-hero-brand-copy strong{font-family: "Inter", -apple-system, sans-serif; font-size: 1rem; line-height: 1.1; color: #ffffff;} .landing-hero-copy h1{margin: 0.35rem 0 0.9rem; font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(1.8rem, 3.1vw, 3.1rem); line-height: 1.08; letter-spacing: -0.03em; color: #fff; text-align: left; text-wrap: normal;} .landing-hero-copy .hero-subtitle{text-align: left; max-width: 46rem;} .landing-hero-badge, .landing-hero-impact-kicker, .landing-highlight-label, .landing-mini-title, .landing-story-meta{display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;} .landing-hero-badge{padding: 0.42rem 0.8rem; border-radius: 999px; background: rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.88);} .landing-hero-impact{display: grid; gap: 0.45rem; margin: 1.25rem 0 1.5rem; padding: 1rem 1.1rem; border-radius: 1.1rem; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.12); backdrop-filter: blur(10px);} .landing-hero-impact-kicker{color: rgba(255, 255, 255, 0.88);} .landing-hero-impact-main{display: flex; align-items: baseline; gap: 0.45rem; color: #fff;} .landing-hero-impact-main strong{font-family: "Inter", -apple-system, sans-serif; font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1; letter-spacing: -0.06em;} .landing-hero-impact-main span, .landing-hero-impact p{color: rgba(240, 248, 255, 0.82);} .landing-hero-impact p{margin: 0; line-height: 1.6;} .landing-hero-visual{position: relative; min-height: 300px; border-radius: 1.4rem; overflow: hidden; background: linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)); border: 1px solid rgba(255, 255, 255, 0.12);} .landing-hero-carousel, .landing-hero-slides{position: relative; width: 100%; height: 100%;} .landing-hero-slide{position: absolute; inset: 0; opacity: 0; transform: scale(1.02); transition: opacity 0.55s ease, transform 0.75s ease;} .landing-hero-slide.is-active{opacity: 1; transform: scale(1);} .landing-hero-carousel-dots{position: absolute; left: 50%; bottom: 1rem; z-index: 2; display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.45rem 0.6rem; border-radius: 999px; background: rgba(9, 31, 22, 0.32); backdrop-filter: blur(10px); transform: translateX(-50%);} .landing-hero-dot{width: 0.72rem; height: 0.72rem; border: none; border-radius: 999px; background: rgba(255, 255, 255, 0.42); cursor: pointer; transition: transform 0.2s ease, background-color 0.2s ease;} .landing-hero-dot.is-active{background: #ffffff; transform: scale(1.08);} .landing-hero-image, .landing-story-photo, .landing-gallery-photo{width: 100%; height: 100%; object-fit: cover; display: block;} .landing-hero-placeholder, .landing-story-photo-placeholder, .landing-gallery-photo-placeholder{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.6rem; min-height: 100%; padding: 1.2rem; text-align: center; background: radial-gradient(circle at top left, rgba(255, 196, 13, 0.3), transparent 28%), linear-gradient(145deg, rgba(11, 122, 117, 0.7), rgba(16, 40, 63, 0.88)); color: #fff;} .landing-hero-placeholder strong, .landing-gallery-photo-placeholder span, .landing-story-photo-placeholder span{width: 100%; font-family: "Inter", -apple-system, sans-serif; font-size: 1.2rem;} .landing-hero-placeholder p{margin: 0; color: rgba(255, 255, 255, 0.82); line-height: 1.6;} .landing-hero-placeholder-chip{padding: 0.4rem 0.7rem; border-radius: 999px; background: rgba(255, 255, 255, 0.14); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;} .landing-ods-section{position: relative; overflow: hidden; border-radius: 1.5rem; border: 1px solid rgba(19, 71, 46, 0.1); background: radial-gradient(circle at top right, rgba(185, 216, 111, 0.12), transparent 28%), linear-gradient(180deg, rgba(250, 254, 249, 0.98), rgba(241, 248, 239, 0.94)); box-shadow: 0 18px 34px rgba(26, 72, 46, 0.08);} .landing-ods-body{display: grid; gap: 0.95rem; margin-top: 1rem; padding: 1rem; border-radius: 1.2rem; border: 1px solid rgba(19, 71, 46, 0.08); background: rgba(255, 255, 255, 0.56); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);} .landing-ods-stage{display: grid; grid-template-columns: minmax(0, 1.2fr) auto; align-items: start; gap: 0.9rem 1.2rem; margin-bottom: 0.2rem;} .landing-ods-copy{max-width: 42rem;} .landing-ods-copy .landing-section-copy{margin-bottom: 0;} .landing-ods-mosaic{display: grid; grid-template-columns: repeat(3, 3.25rem); grid-auto-rows: 3.25rem; gap: 0.5rem; justify-content: start; align-content: start; min-width: 0; padding: 0;} .landing-ods-mosaic-tile{position: relative; display: flex; align-items: center; justify-content: center; width: 3.25rem; height: 3.25rem; border-radius: 0.9rem; background: rgba(255, 255, 255, 0.92); box-shadow: 0 14px 30px rgba(26, 72, 46, 0.1); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease;} .landing-ods-mosaic-tile img{width: 100%; height: 100%; object-fit: cover; display: block;} .landing-ods-mosaic-tile:hover{transform: translateY(-2px) scale(1.02); box-shadow: 0 18px 34px rgba(26, 72, 46, 0.14);} .landing-ods-grid{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.85rem; margin-top: 1rem;} .landing-ods-card{position: relative; display: grid; gap: 0.7rem; min-height: 100%; padding: 1.05rem; border-radius: 1.05rem; border: 1px solid rgba(19, 71, 46, 0.08); background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(247, 251, 245, 0.88)); box-shadow: 0 14px 28px rgba(26, 72, 46, 0.07); overflow: hidden;} .landing-ods-card::before{content: ""; position: absolute; inset: 0 auto auto 0; width: 100%; height: 6px; background: var(--ods-accent, #4f9b63);} .landing-ods-card::after{content: ""; position: absolute; right: -28px; top: -28px; width: 110px; height: 110px; border-radius: 50%; background: color-mix(in srgb, var(--ods-accent, #4f9b63) 14%, transparent); pointer-events: none;} .landing-ods-head{display: grid; gap: 0.45rem; position: relative; z-index: 1;} .landing-ods-topline{display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap;} .landing-ods-icon{width: 2.65rem; height: 2.65rem; flex: 0 0 2.65rem; border-radius: 0.8rem; object-fit: cover; background: rgba(255, 255, 255, 0.96); box-shadow: 0 12px 24px color-mix(in srgb, var(--ods-accent, #4f9b63) 24%, transparent);} .landing-ods-number{display: inline-flex; align-items: center; justify-content: center; width: fit-content; min-width: 4rem; padding: 0.38rem 0.68rem; border-radius: 999px; background: var(--ods-accent, #4f9b63); color: #fff; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; box-shadow: 0 10px 22px color-mix(in srgb, var(--ods-accent, #4f9b63) 28%, transparent);} .landing-ods-head strong{font-family: "Cormorant Garamond", Georgia, serif; font-size: 0.96rem; line-height: 1.18; color: #102033;} .landing-ods-card p{position: relative; z-index: 1; margin: 0; font-size: 0.93rem; line-height: 1.55; color: #5e6b7e;} .landing-ods-card.ods-4{--ods-accent: #c5192d;} .landing-ods-card.ods-6{--ods-accent: #26bde2;} .landing-ods-card.ods-8{--ods-accent: #8f1838;} .landing-ods-card.ods-10{--ods-accent: #dd1367;} .landing-ods-card.ods-11{--ods-accent: #f59d23;} .landing-ods-card.ods-12{--ods-accent: #bf8b2e;} .landing-ods-card.ods-13{--ods-accent: #3f7e44;} .landing-ods-card.ods-14{--ods-accent: #0a97d9;} .landing-ods-card.ods-17{--ods-accent: #19486a;} .landing-utility-row{display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-top: 0;} .public-actions-hero{align-items: center;} .public-actions-hero .badge-tempo-real{min-height: 48px; display: inline-flex; align-items: center; justify-content: center;} .landing-dashboard-toolbar{display: flex; align-items: center; justify-content: space-between; gap: 0.9rem; flex-wrap: wrap; margin-top: 1rem;} .landing-utility-actions{display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;} .landing-scroll-link{color: rgba(255, 255, 255, 0.92); font-weight: 700; text-decoration: none;} .btn-public-refresh{display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0.72rem 1rem; border-radius: 999px; border: 1px solid rgba(19, 71, 46, 0.16); background: rgba(255, 255, 255, 0.72); color: #124e34; font-weight: 700; font-size: 0.95rem; cursor: pointer; box-shadow: 0 12px 24px rgba(23, 90, 55, 0.12); transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;} .btn-public-refresh:hover, .btn-public-refresh:focus-visible{transform: translateY(-1px); box-shadow: 0 16px 28px rgba(23, 90, 55, 0.16); outline: none;} .btn-public-refresh[disabled]{opacity: 0.72; cursor: wait;} .landing-section{margin-bottom: 1.3rem;} .landing-section-copy{margin: 0 0 1rem; color: #5e6b7e; line-height: 1.62; max-width: 72ch;} .landing-highlight-grid, .landing-gallery-grid, .landing-stories-grid, .landing-participation-grid, .landing-two-column, .landing-visual-grid{display: grid; gap: 1rem;} .landing-highlight-grid{grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));} .landing-highlight-card{padding: 1rem; border-radius: 1.2rem; border: 1px solid rgba(16, 40, 63, 0.08); background: rgba(255, 255, 255, 0.72); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);} .landing-highlight-card strong{display: block; margin: 0.4rem 0 0.35rem; font-family: "Inter", -apple-system, sans-serif; font-size: clamp(1.55rem, 2.5vw, 2.1rem); letter-spacing: -0.05em; color: #102033;} .landing-highlight-card p{margin: 0; color: #5e6b7e; line-height: 1.55;} .landing-highlight-icon{display: inline-flex; width: 2.2rem; height: 2.2rem; align-items: center; justify-content: center; border-radius: 0.85rem; background: rgba(11, 122, 117, 0.1); color: #0d625b; font-size: 1.1rem;} .landing-visual-grid, .landing-two-column, .landing-participation-grid{grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: stretch;} .landing-story-card, .landing-points-card, .landing-participation-card{display: grid; align-content: start; padding: 1.2rem; height: 100%;} .landing-point-list, .landing-faq-list, .landing-bullet-list{display: grid; gap: 0.8rem; align-items: stretch;} .landing-faq-list, .landing-bullet-list{grid-auto-rows: 1fr;} .landing-point-item, .landing-faq-item, .landing-bullet-item, .landing-explainer-card, .landing-club-card, .landing-daily-chart-card, .landing-participation-column{padding: 0.95rem 1rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(16, 40, 63, 0.08);} .landing-faq-item, .landing-bullet-item{min-height: 84px; display: flex; flex-direction: column; justify-content: center;} .landing-participation-column{display: grid; align-content: start; gap: 0.8rem; height: 100%;} .landing-point-item strong, .landing-faq-item strong, .landing-gallery-copy strong, .landing-story-item h3{color: #102033;} .landing-point-item p, .landing-faq-item p, .landing-explainer-card p, .landing-gallery-copy p, .landing-story-item p, .landing-club-card p, .landing-points-card > p{margin: 0.35rem 0 0; color: #5e6b7e; line-height: 1.65;} .landing-daily-chart-card{min-height: 0; display: grid; gap: 0.85rem;} .landing-chart-meta{margin: -0.2rem 0 0; font-size: 0.88rem; color: #5e6b7e;} .landing-daily-chart-frame{position: relative; height: 320px; min-height: 320px;} .landing-daily-chart-frame canvas{display: block; width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important;} .landing-stories-grid{grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 1rem; align-items: stretch;} .landing-story-item{display: grid; align-content: start; gap: 0.75rem; padding: 1rem; border-radius: 1.15rem; background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(16, 40, 63, 0.08); height: 100%;} .landing-story-photo-wrap{aspect-ratio: 4 / 3; border-radius: 1rem; overflow: hidden;} .landing-story-meta{color: #0d625b;} .landing-gallery-grid{grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: stretch;} .landing-gallery-item{display: grid; align-content: start; overflow: hidden; border-radius: 1.15rem; background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(16, 40, 63, 0.08); height: 100%;} .landing-gallery-photo{aspect-ratio: 4 / 3;} .landing-gallery-copy{padding: 0.95rem 1rem 1.05rem;} .landing-participation-cta{margin-top: 1rem; display: flex; justify-content: flex-start;} .footer-grid.landing-footer-grid{margin-bottom: 1rem !important;} @media (max-width: 960px){.landing-hero-grid, .landing-visual-grid, .landing-two-column, .landing-participation-grid{grid-template-columns: 1fr;} .landing-hero-shell, .landing-story-card, .landing-points-card, .landing-participation-card{padding: 1.15rem;} .landing-hero-brand{width: 100%; justify-content: flex-start;} .landing-hero-visual{min-height: 280px;} .landing-utility-row, .landing-dashboard-toolbar, .landing-participation-cta{align-items: stretch;} .landing-utility-actions{width: 100%;}} @media (max-width: 640px){.landing-highlight-grid, .landing-gallery-grid, .landing-stories-grid{grid-template-columns: 1fr;} .landing-ods-stage{grid-template-columns: 1fr; justify-items: start;} .landing-ods-mosaic{min-width: 0; margin: 0 auto; grid-template-columns: repeat(3, minmax(3rem, 3.1rem)); grid-auto-rows: minmax(3rem, 3.1rem); gap: 0.45rem;} .landing-ods-mosaic-tile{width: 3.1rem; height: 3.1rem; border-radius: 0.9rem;} .landing-ods-grid{grid-template-columns: repeat(2, minmax(0, 1fr));} .landing-hero-copy h1{font-size: clamp(1.65rem, 8vw, 2.35rem); line-height: 1.12;} .btn-public-refresh{width: 100%;} .landing-daily-chart-frame{height: 260px; min-height: 260px;}} .public-kpi-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin: 2rem 0; align-items: stretch;} .public-actions{display: flex; gap: 0.75rem; flex-wrap: wrap;} .btn-public-calc{display: inline-flex; align-items: center; justify-content: center; padding: 0.75rem 1.15rem; border-radius: 999px; text-decoration: none; font-weight: 700; letter-spacing: 0.01em; border: 1px solid rgba(255, 255, 255, 0.25); color: #fff; background: linear-gradient(135deg, #0b7a75 0%, #17a39a 100%); box-shadow: 0 8px 20px rgba(11, 122, 117, 0.28); transition: transform .2s ease, box-shadow .2s ease;} .btn-public-calc:hover{transform: translateY(-1px); box-shadow: 0 12px 24px rgba(11, 122, 117, 0.32);} .edu-simulator{background: linear-gradient(145deg, #0a3a66 0%, #075b98 55%, #2f6faf 100%); border-radius: 1rem; margin: 0.5rem 0 2.25rem; padding: 1.5rem; color: #fff; border: 1px solid rgba(255, 255, 255, 0.14); box-shadow: 0 16px 30px rgba(15, 23, 42, 0.35);} .edu-simulator-header h3{margin: 0 0 0.5rem; font-size: clamp(1.2rem, 3vw, 1.8rem); line-height: 1.2;} .edu-eyebrow{margin: 0 0 0.45rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(186, 230, 253, 0.95);} .edu-description{margin: 0; color: rgba(240, 253, 244, 0.92); max-width: 820px;} .edu-simulator-grid{margin-top: 1.25rem; display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem;} .edu-inputs{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem;} .edu-field{display: flex; flex-direction: column; gap: 0.4rem; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 0.75rem; padding: 0.75rem;} .edu-field span{font-size: 0.85rem; font-weight: 600; color: rgba(255, 255, 255, 0.9);} .edu-field input{width: 100%; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 0.55rem; background: rgba(2, 6, 23, 0.35); color: #fff; padding: 0.6rem 0.7rem; font-size: 1rem;} .edu-field input:focus{outline: 2px solid rgba(125, 211, 252, 0.45); outline-offset: 2px;} .edu-results{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem;} .edu-result-card{background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 0.75rem; padding: 0.85rem;} .edu-result-card p{margin: 0 0 0.45rem; font-size: 0.82rem; font-weight: 600; color: rgba(226, 232, 240, 0.94);} .edu-result-card strong{font-size: clamp(1rem, 2.4vw, 1.45rem); line-height: 1.15;} .edu-simulator-note{grid-column: 1 / -1; margin-top: 0.2rem; font-size: 0.82rem; color: rgba(226, 232, 240, 0.9);} .stats-sub{font-size: 0.8125rem; color: var(--olinda-muted); margin-top: 0.25rem; font-weight: 600;} .eventos-consolidacao-msg{font-size: 0.9375rem; line-height: 1.5; color: var(--olinda-muted); background: var(--gray-50); border: 1px dashed var(--olinda-border); border-radius: 0.75rem; padding: 1rem; margin: 1.25rem 0;} .impacto-card{background: var(--olinda-white); border-radius: 1rem; padding: 2rem; box-shadow: var(--shadow-soft); transition: all 0.3s ease; border: 2px solid var(--olinda-border); text-align: center; height: 100%; display: flex; flex-direction: column; justify-content: space-between; min-height: 280px;} .impacto-card-link{text-decoration: none; color: inherit; display: block; width: 100%; text-align: left; background: none; border: none; padding: 0; cursor: pointer; height: 100%;} .impacto-card:hover{box-shadow: var(--shadow-hover); transform: translateY(-2px);} .impacto-card.blue, .impacto-card.green, .impacto-card.orange, .impacto-card.cyan, .impacto-card.purple{border-color: #075b98; background: linear-gradient(135deg, #2f6faf 0%, #075b98 100%); color: white;} .impacto-icon{font-size: 3rem; margin-bottom: 1rem; display: block;} .impacto-label{font-size: 0.875rem; opacity: 0.9; margin-bottom: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;} .impacto-value{font-size: 2.5rem; font-weight: 800; margin-bottom: 0.5rem; line-height: 1.2;} .impacto-unit{font-size: 1.25rem; opacity: 0.9; font-weight: 600;} .impacto-secondary{font-size: 1rem; opacity: 0.8; margin-top: 0.5rem;} .impacto-modal-backdrop{position: fixed; inset: 0; background: rgba(0, 0, 0, 0.55); display: none; align-items: center; justify-content: center; z-index: 2000; padding: 1.5rem;} .impacto-modal{background: #fff; border-radius: 1rem; max-width: 600px; width: 100%; padding: 2rem; box-shadow: var(--shadow-lg); position: relative; max-height: 85vh; overflow-y: auto;} .impacto-modal h4{font-size: 1.25rem; font-weight: 800; margin-bottom: 0.75rem;} .impacto-modal p{font-size: 1rem; color: var(--olinda-text); line-height: 1.7; margin-bottom: 1rem; text-align: justify;} .impacto-modal p:last-child{margin-bottom: 0;} .impacto-modal p strong{color: var(--olinda-blue); font-weight: 700;} .impacto-modal-close{position: absolute; top: 0.75rem; right: 0.75rem; background: transparent; border: none; font-size: 1.25rem; cursor: pointer; color: var(--olinda-muted);} @media (max-width: 768px){.public-actions{width: 100%;} .public-actions .btn-primary, .public-actions .btn-public-calc{flex: 1 1 100%; text-align: center;} .edu-simulator{padding: 1rem;} .edu-simulator-grid{grid-template-columns: 1fr;} .edu-inputs, .edu-results{grid-template-columns: 1fr;} .impacto-card{padding: 1.5rem;} .impacto-value{font-size: 2rem;} .impacto-icon{font-size: 2.5rem;}} .sr-only{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;} .public-page{--public-bg: #edf8ee; --public-surface: rgba(248, 253, 248, 0.96); --public-panel: #0f4a35; --public-text: #17362a; --public-muted: #5f776a; --public-blue: #2c8b57; --public-teal: #4db56c; --public-orange: #8ecf4d; --public-yellow: #d9f08b; --public-pink: #6fbe7a; --public-purple: #235f43; --mat-papelao: #3d7e55; --mat-plastico: #5f9b5a; --mat-latinha: #a9bc5a; --mat-pet: #4ea66b; --mat-oleo: #859749; --mat-vidro: #246a4a; background: radial-gradient(circle at top left, rgba(104, 195, 120, 0.16), transparent 34%), radial-gradient(circle at top right, rgba(182, 224, 110, 0.14), transparent 28%), linear-gradient(180deg, #f5fbf4 0%, #eaf4e8 100%) !important;} .public-page .hero-banner{background: radial-gradient(circle at top right, rgba(224, 245, 132, 0.18), transparent 22%), linear-gradient(140deg, #0f4a35 0%, #186548 52%, #3b9660 100%) !important;} .public-page .hero-banner h1{font-size: clamp(1.95rem, 3.4vw, 3.1rem) !important; letter-spacing: -0.04em !important;} .public-page .hero-subtitle{max-width: 60ch !important; font-size: clamp(0.96rem, 1.25vw, 1.05rem) !important; line-height: 1.6 !important;} .public-page .section-title{align-items: center !important; gap: 0.65rem !important; margin-bottom: 0.95rem !important;} .public-page .section-title h2{font-size: clamp(1.35rem, 2.3vw, 2rem) !important; letter-spacing: -0.03em !important;} .public-page .section-title .second{background: linear-gradient(135deg, #1f7c4f, #3da56a) !important; padding: 0.16rem 0.58rem !important;} .section-title-dot.blue{background: #2d7c53 !important;} .section-title-dot.yellow{background: #6fb264 !important;} .section-title-dot.magenta{background: #b6d66b !important;} .badge-tempo-real{background: rgba(14, 61, 43, 0.92) !important;} .public-actions .btn-primary, .btn-public-calc{min-height: 44px !important; padding: 0.78rem 1.1rem !important; font-size: 0.92rem !important;} .btn-public-calc{background: linear-gradient(135deg, #3fae64, #79c252) !important;} .public-actions .btn-primary{background: #0d4731 !important;} .public-kpi-grid{grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0.9rem !important;} .public-kpi-grid .stats-card, .chart-card, .event-card{background: linear-gradient(180deg, rgba(250, 254, 249, 0.98), rgba(241, 248, 239, 0.92)) !important; box-shadow: 0 16px 34px rgba(26, 72, 46, 0.09) !important;} .public-kpi-grid .stats-card{padding: 1.05rem !important; border-radius: 1.15rem !important; min-height: 196px !important;} .public-kpi-grid .card-border-orange{border-top-color: #8ebe62 !important;} .public-kpi-grid .card-border-blue{border-top-color: #2e7c53 !important;} .public-kpi-grid .card-border-green{border-top-color: #4ea66b !important;} .public-kpi-grid .card-border-yellow{border-top-color: #b6d66b !important;} .public-kpi-grid .stats-icon{width: 2.55rem !important; height: 2.55rem !important; min-width: 2.55rem !important; border-radius: 0.85rem !important;} .public-kpi-grid .stats-label{font-size: 0.72rem !important; letter-spacing: 0.1em !important;} .public-kpi-grid .stats-value{font-size: clamp(1.55rem, 2vw, 2.05rem) !important;} .public-kpi-grid .stats-value small{font-size: 0.74rem !important; padding-bottom: 0.2rem !important;} .stats-sub{margin-top: 0.25rem !important; font-size: 0.82rem !important; line-height: 1.45 !important;} #public-impacto-cards{grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0.9rem !important; align-items: stretch !important;} #public-impacto-cards > .impacto-card-link{display: block !important; width: 100% !important; min-width: 0 !important; height: 100% !important; margin: 0 !important;} #public-impacto-cards > .impacto-card-link > .impacto-card{display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; grid-template-areas: "icon label" "value value" "support support" "meta meta" !important; align-content: start !important; gap: 0.55rem 0.72rem !important; width: 100% !important; min-width: 0 !important; height: 100% !important; min-height: 226px !important; padding: 1.08rem !important; border-radius: 1.2rem !important; background: linear-gradient(180deg, #2f6faf, #075b98) !important; border: 1px solid rgba(255, 255, 255, 0.08) !important; box-shadow: 0 16px 34px rgba(7, 91, 152, 0.18) !important;} .impacto-card::before{background: radial-gradient(circle at top right, var(--card-glow, rgba(255, 196, 0, 0.22)), transparent 42%), linear-gradient(150deg, rgba(255, 255, 255, 0.08), transparent 58%) !important;} .impacto-card.blue, .impacto-card.green, .impacto-card.orange, .impacto-card.cyan, .impacto-card.purple, #card-pet-oceano{--card-glow: rgba(255, 196, 0, 0.22);} .impacto-card:hover{transform: translateY(-2px) !important; box-shadow: 0 20px 40px rgba(7, 91, 152, 0.2) !important;} .impacto-icon{grid-area: icon !important; width: 2.35rem !important; height: 2.35rem !important; border-radius: 0.82rem !important; font-size: 1.05rem !important;} .impacto-label{grid-area: label !important; align-self: center !important; font-size: 0.73rem !important; line-height: 1.35 !important; letter-spacing: 0.08em !important;} .impacto-value{grid-area: value !important; font-size: clamp(1.55rem, 2.1vw, 2.08rem) !important; line-height: 1.02 !important;} .impacto-unit{grid-area: meta !important; font-size: 0.68rem !important; letter-spacing: 0.12em !important; color: rgba(255, 255, 255, 0.7) !important;} .impacto-secondary{grid-area: support !important; font-size: 0.8rem !important; line-height: 1.4 !important; color: rgba(242, 250, 244, 0.84) !important;} .impacto-card .impacto-secondary + .impacto-secondary{display: none !important;} #card-pet-oceano .impacto-value{font-size: clamp(1.42rem, 1.95vw, 1.88rem) !important;} .chart-grid{grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0.9rem !important;} .chart-card{padding: 1.1rem !important; border-radius: 1.15rem !important;} .chart-card::before{background: linear-gradient(90deg, #2e7c53, #63ae63) !important;} .chart-grid > .chart-card:nth-child(1)::before{background: linear-gradient(90deg, #4b9760, #a9bc5a) !important;} .chart-grid > .chart-card:nth-child(3)::before{background: linear-gradient(90deg, #285f44, #5f9b5a) !important;} .chart-card .stats-label{font-size: 0.72rem !important;} .chart-card .stats-value{font-size: 1.6rem !important;} .chart-card .stats-value small{font-size: 0.72rem !important;} .chart-card canvas{max-width: 188px !important; max-height: 188px !important;} .chart-legend-item{padding: 0.48rem 0.64rem !important; border-radius: 0.82rem !important;} .chart-legend .material{font-size: 0.84rem !important;} .chart-legend .value{font-size: 0.79rem !important;} .public-events-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0.9rem !important;} .event-card{padding: 1.08rem !important; border-radius: 1.15rem !important;} .event-card-header strong{font-size: 0.98rem !important;} .event-badge{min-height: 24px !important; padding: 0.28rem 0.7rem !important; font-size: 0.67rem !important;} .event-badge.ativo{background: rgba(78, 166, 107, 0.16) !important; color: #245a3f !important; border: 1px solid rgba(78, 166, 107, 0.26) !important;} .event-badge.aguardando{background: rgba(169, 188, 90, 0.18) !important; color: #506333 !important; border: 1px solid rgba(169, 188, 90, 0.26) !important;} .event-total{font-size: 1.52rem !important; margin-bottom: 0.68rem !important;} .event-bar-head span{font-size: 0.82rem !important;} .event-bar-head strong{font-size: 0.76rem !important;} .bar{height: 0.48rem !important;} .edu-simulator{position: relative; overflow: hidden; padding: 1.35rem !important; border-radius: 1.25rem !important; background: radial-gradient(circle at top right, rgba(255, 196, 0, 0.18), transparent 30%), linear-gradient(145deg, #0a3a66 0%, #075b98 48%, #2f6faf 100%) !important;} .edu-simulator::before{content: ""; position: absolute; inset: -30% auto auto -6%; width: 220px; height: 220px; border-radius: 50%; background: rgba(255, 255, 255, 0.05);} .edu-simulator::after{content: ""; position: absolute; right: -40px; bottom: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255, 196, 0, 0.12);} .edu-simulator > *{position: relative; z-index: 1;} .edu-simulator-header h3{font-size: clamp(1.18rem, 2vw, 1.52rem) !important; line-height: 1.15 !important;} .edu-description{font-size: 0.94rem !important; line-height: 1.6 !important;} .edu-simulator-grid{display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr); gap: 0.9rem !important; align-items: start;} .edu-inputs{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.74rem !important;} .edu-field, .edu-result-card, .edu-simulator-note{border-radius: 0.95rem !important;} .edu-field{padding: 0.78rem !important;} .edu-field span{font-size: 0.78rem !important;} .edu-field input{min-height: 42px !important; font-size: 0.95rem !important;} .edu-field small{display: block; margin-top: 0.15rem; font-size: 0.74rem; line-height: 1.45; color: rgba(236, 255, 242, 0.72);} .edu-results{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.74rem !important;} .edu-result-card{min-height: 124px; display: flex !important; flex-direction: column !important; justify-content: space-between !important; padding: 0.9rem !important; background: rgba(248, 255, 248, 0.12) !important;} .edu-result-card p{font-size: 0.73rem !important; letter-spacing: 0.04em !important; color: rgba(241, 255, 246, 0.78) !important;} .edu-result-card strong{font-size: clamp(1.02rem, 1.7vw, 1.34rem) !important; line-height: 1.15 !important;} .edu-result-card span{font-size: 0.78rem !important; line-height: 1.4 !important; color: rgba(236, 255, 242, 0.82) !important;} .edu-simulator-note{margin-top: 0.1rem; padding: 0.84rem !important; font-size: 0.81rem !important; line-height: 1.55 !important; background: rgba(8, 31, 22, 0.36) !important;} @media (max-width: 1180px){.public-kpi-grid, #public-impacto-cards, .chart-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .public-events-grid, .edu-simulator-grid{grid-template-columns: 1fr !important;} .edu-results{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}} @media (max-width: 768px){.public-page .hero-banner h1{font-size: clamp(1.7rem, 7vw, 2.35rem) !important;} .public-kpi-grid, #public-impacto-cards, .chart-grid, .public-events-grid, .edu-inputs, .edu-results{grid-template-columns: 1fr !important;} #public-impacto-cards > .impacto-card-link > .impacto-card{min-height: 0 !important;} .edu-simulator{padding: 1.12rem !important;}} .landing-tabs-shell{display: grid; gap: 1rem; padding: 1.2rem 1.3rem; border-radius: 1.35rem; border: 1px solid rgba(19, 71, 46, 0.1); background: linear-gradient(180deg, rgba(250, 254, 249, 0.98), rgba(241, 248, 239, 0.92)); box-shadow: 0 16px 34px rgba(26, 72, 46, 0.09);} .landing-tab-list{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem;} .landing-tab-button{min-height: 52px; padding: 0.85rem 1rem; border-radius: 1rem; border: 1px solid rgba(31, 102, 64, 0.12); background: rgba(255, 255, 255, 0.7); color: var(--public-text); font-family: inherit; font-size: 0.92rem; font-weight: 700; line-height: 1.3; box-shadow: 0 10px 24px rgba(26, 72, 46, 0.05); cursor: pointer; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease, color 0.22s ease;} .landing-tab-button:hover, .landing-tab-button:focus-visible{transform: translateY(-2px); border-color: rgba(46, 124, 83, 0.3); box-shadow: 0 14px 28px rgba(26, 72, 46, 0.1); outline: none;} .landing-tab-button.is-active{color: #f7fff7; border-color: rgba(255, 255, 255, 0.16); background: linear-gradient(135deg, #1f7c4f, #53ab65); box-shadow: 0 16px 30px rgba(31, 124, 79, 0.22);} .landing-tab-button, .landing-dashboard-button{position: relative; overflow: hidden;} .landing-tab-button::after, .landing-dashboard-button::after{content: ""; position: absolute; bottom: 6px; left: 50%; width: 0; height: 3px; background: var(--claude-primary, #cc785c); border-radius: 999px; transform: translateX(-50%); transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none;} .landing-tab-button.is-active::after, .landing-dashboard-button.is-active::after{width: 55%;} .tab-section{animation: landingTabEnter 0.32s ease both;} .public-page[data-active-tab="dashboard"] .tab-section[data-tab-panel]:not([data-tab-panel="dashboard"]), .public-page[data-active-tab="educacao"] .tab-section[data-tab-panel]:not([data-tab-panel="educacao"]), .public-page[data-active-tab="historias"] .tab-section[data-tab-panel]:not([data-tab-panel="historias"]), .public-page[data-active-tab="participacao"] .tab-section[data-tab-panel]:not([data-tab-panel="participacao"]){display: none !important;} .landing-resource-list{display: grid; gap: 0.75rem;} .landing-resource-list a{display: inline-flex; align-items: center; min-height: 44px; padding: 0.8rem 0.95rem; border-radius: 0.95rem; text-decoration: none; font-weight: 600; color: var(--public-text); background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(19, 71, 46, 0.08); transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;} .landing-resource-list a:hover, .landing-resource-list a:focus-visible{transform: translateY(-2px); border-color: rgba(46, 124, 83, 0.22); box-shadow: 0 12px 24px rgba(26, 72, 46, 0.08); outline: none;} @keyframes landingTabEnter{from{opacity: 0; transform: translateY(10px);} to{opacity: 1; transform: translateY(0);}} @media (max-width: 960px){.landing-tab-list{grid-template-columns: repeat(2, minmax(0, 1fr));}} @media (max-width: 640px){.landing-tabs-shell{padding: 1rem;} .landing-tab-list{grid-template-columns: 1fr;}} .public-page{--public-bg: #eef7ee; --public-surface: rgba(247, 252, 247, 0.97); --public-panel: #113b2c; --public-text: #18382a; --public-muted: #607668; --public-blue: #2f7d58; --public-teal: #58a56d; --public-orange: #7eb85b; --public-yellow: #b9d86f; --public-pink: #3f8e5e; --public-purple: #255e42; --mat-papelao: #3a7450; --mat-plastico: #5b9759; --mat-latinha: #a7ba5a; --mat-pet: #4b9c64; --mat-oleo: #7d9447; --mat-vidro: #255f43; background: radial-gradient(circle at top left, rgba(96, 165, 84, 0.14), transparent 34%), radial-gradient(circle at top right, rgba(185, 216, 111, 0.14), transparent 28%), linear-gradient(180deg, #f5fbf4 0%, #eaf4e8 100%) !important; color: var(--public-text);} .landing-hero-shell{background: radial-gradient(circle at top right, rgba(185, 216, 111, 0.16), transparent 28%), radial-gradient(circle at bottom left, rgba(88, 165, 109, 0.14), transparent 30%), linear-gradient(180deg, rgba(15, 60, 42, 0.98), rgba(18, 78, 53, 0.95)) !important; border-color: rgba(255, 255, 255, 0.08) !important; box-shadow: 0 24px 44px rgba(17, 59, 44, 0.2) !important;} .public-sponsors-bar img, .partner-logo{opacity: 1 !important; filter: none !important; mix-blend-mode: normal !important;} .landing-hero-badge{background: rgba(185, 216, 111, 0.14) !important; border: 1px solid rgba(185, 216, 111, 0.2); color: rgba(246, 255, 247, 0.92) !important;} .landing-hero-impact{background: rgba(255, 255, 255, 0.08) !important; border-color: rgba(255, 255, 255, 0.1) !important;} .landing-hero-copy h1, .landing-hero-impact-main strong{color: #ffffff !important;} .hero-subtitle, .landing-hero-impact-main span, .landing-hero-impact p, .landing-scroll-link{color: rgba(241, 255, 245, 0.86) !important;} .landing-hero-visual{background: linear-gradient(180deg, rgba(17, 59, 44, 0.26), rgba(18, 78, 53, 0.16)) !important; border-color: rgba(255, 255, 255, 0.08) !important;} .landing-hero-placeholder{background: radial-gradient(circle at top left, rgba(185, 216, 111, 0.18), transparent 32%), linear-gradient(180deg, rgba(15, 60, 42, 0.78), rgba(18, 78, 53, 0.58)) !important;} .landing-hero-placeholder-chip{background: rgba(255, 255, 255, 0.12) !important; border: 1px solid rgba(255, 255, 255, 0.1);} .landing-hero-grid{grid-template-columns: minmax(0, 0.98fr) minmax(380px, 0.88fr) !important; gap: clamp(1rem, 2vw, 1.6rem) !important; align-items: stretch !important;} .landing-hero-copy{display: grid !important; align-content: start !important; gap: 0.7rem !important; max-width: 44rem !important; min-height: 100%;} .landing-hero-shell{padding: 1.3rem !important;} .landing-hero-brand{width: fit-content; max-width: 100%; margin-bottom: 0.1rem !important; padding: 0.4rem 0.65rem !important; border-radius: 1rem !important;} .landing-hero-brand-copy{gap: 0.2rem !important;} .landing-hero-brand-copy span{letter-spacing: 0.08em !important;} .landing-hero-brand-copy strong{font-size: 0.98rem !important;} .landing-hero-badge{width: fit-content; margin-top: 0.15rem; font-size: 0.72rem !important; letter-spacing: 0.08em !important;} .landing-hero-copy h1{margin: 0 !important; max-width: 17ch; font-size: clamp(1.9rem, 3vw, 2.85rem) !important; line-height: 0.96 !important; letter-spacing: -0.045em !important; text-align: left !important; text-wrap: balance;} .landing-hero-copy .hero-subtitle{margin: 0 !important; max-width: 58ch !important; font-size: clamp(0.96rem, 1.15vw, 1.03rem) !important; line-height: 1.52 !important; text-align: left !important; text-wrap: pretty;} .landing-hero-impact{max-width: 35rem; margin: 0.2rem 0 0.1rem !important; padding: 0.82rem 0.92rem !important; gap: 0.28rem !important;} .landing-hero-impact-main{gap: 0.28rem !important;} .landing-hero-impact-main strong{font-size: clamp(1.8rem, 2.6vw, 2.55rem) !important;} .landing-hero-impact p{max-width: 42ch; line-height: 1.48 !important;} .public-actions-hero{gap: 0.55rem !important; margin-top: auto; padding-top: 0.5rem;} .landing-hero-visual{width: 100%; max-width: none; min-height: clamp(360px, 38vw, 540px) !important; height: 100%; align-self: stretch !important; justify-self: stretch !important;} .landing-hero-placeholder{align-content: flex-start !important; justify-content: flex-start !important; text-align: left !important; gap: 0.6rem !important; min-height: clamp(360px, 38vw, 540px) !important; padding: 0.95rem !important; padding-bottom: 0.95rem !important;} .landing-hero-image{object-position: center center;} .landing-hero-placeholder strong{margin-top: 0.15rem; font-size: 0.96rem !important; line-height: 1.22 !important;} .landing-hero-placeholder p{max-width: 30ch; font-size: 0.88rem; line-height: 1.45 !important;} @media (max-width: 960px){.landing-hero-grid{grid-template-columns: 1fr !important; gap: 1rem !important;} .landing-hero-copy{max-width: none !important;} .landing-hero-copy h1{max-width: 13.5ch; font-size: clamp(1.8rem, 7vw, 2.55rem) !important;} .landing-hero-impact, .landing-hero-placeholder p{max-width: none;} .landing-hero-visual{width: 100%; min-height: 260px !important; height: auto; justify-self: stretch !important;} .landing-ods-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}} @media (max-width: 640px){.landing-hero-shell{padding: 0.95rem !important;} .landing-hero-brand{width: 100%;} .landing-hero-copy h1{max-width: 12.4ch; line-height: 0.98 !important;} .landing-hero-visual{min-height: 220px !important;} .public-actions-hero{width: 100%;} .public-actions-hero .btn-primary, .public-actions-hero .btn-public-calc, .public-actions-hero .badge-tempo-real{width: 100%; justify-content: center;} .landing-ods-grid{grid-template-columns: 1fr;}} .public-page-shell{padding-top: 2rem;} .section-title-top{margin-top: 2rem !important;} .section-title-spaced{margin: 2rem 0 1.5rem !important;} .public-impact-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-bottom: 2rem; align-items: stretch;} .chart-grid-public{grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important; margin-bottom: 2rem !important;} .chart-card-public{text-align: center;} .chart-card-label{margin-bottom: 0.75rem !important; font-size: 0.875rem !important;} .chart-card-value{margin-top: 0.5rem !important; font-size: 1.25rem !important;} .chart-card-unit{font-size: 0.75rem !important;} .chart-card-legend{margin-top: 0.75rem !important;} .public-events-grid-spaced{margin-top: 1.5rem !important;} .public-sponsor-image{display: block; width: 100%; height: auto; object-fit: contain;} .landing-story-card, .landing-points-card, .landing-participation-card, .landing-highlight-card, .landing-point-item, .landing-faq-item, .landing-bullet-item, .landing-explainer-card, .landing-club-card, .landing-daily-chart-card, .landing-participation-column, .landing-story-item, .landing-gallery-item, .landing-tabs-shell, .public-kpi-grid .stats-card, .chart-card, .event-card{background: linear-gradient(180deg, rgba(250, 254, 249, 0.98), rgba(241, 248, 239, 0.92)) !important; border-color: rgba(19, 71, 46, 0.1) !important; box-shadow: 0 16px 34px rgba(26, 72, 46, 0.09) !important;} .public-kpi-grid{gap: 1.1rem !important; margin: 1.35rem 0 1.15rem !important;} .public-kpi-grid .stats-card, .chart-card, .event-card, .landing-tabs-shell, .landing-story-card, .landing-points-card, .landing-participation-card, .landing-highlight-card, .landing-point-item, .landing-faq-item, .landing-bullet-item, .landing-explainer-card, .landing-club-card, .landing-daily-chart-card, .landing-participation-column, .landing-story-item{padding: 1.05rem !important;} .landing-faq-list, .landing-bullet-list{grid-auto-rows: 1fr !important;} .landing-faq-item, .landing-bullet-item{min-height: 84px !important; display: flex !important; flex-direction: column !important; justify-content: center !important;} .landing-participation-column, .landing-story-card, .landing-points-card, .landing-participation-card, .landing-story-item, .landing-gallery-item{display: grid !important; align-content: start !important; height: 100%;} .landing-participation-column{gap: 0.8rem !important;} .landing-highlight-icon{background: rgba(47, 125, 88, 0.1) !important; color: #1f6947 !important;} .landing-mini-title, .landing-story-meta{color: #246345 !important;} .public-page .section-title .second{background: linear-gradient(135deg, #215f43, #4f9b63) !important; color: #ffffff !important;} .section-title-dot.blue{background: #2f7d58 !important;} .section-title-dot.yellow{background: #6faa60 !important;} .section-title-dot.magenta{background: #b9d86f !important;} .badge-tempo-real{background: rgba(16, 61, 43, 0.95) !important;} .btn-public-refresh{background: rgba(247, 255, 247, 0.9) !important; border-color: rgba(255, 255, 255, 0.16) !important; color: #154d35 !important;} .btn-public-refresh.is-loading{opacity: 0.82 !important;} .btn-public-refresh.is-success{background: linear-gradient(135deg, #1f6a47, #3f9b63) !important; border-color: rgba(20, 77, 53, 0.28) !important; color: #f7fff7 !important; box-shadow: 0 14px 28px rgba(23, 90, 55, 0.22) !important;} .btn-public-calc{background: #ffc400 !important; color: #123853 !important; border-color: #ffc400 !important; box-shadow: 0 12px 24px rgba(7, 91, 152, 0.2) !important;} .public-actions .btn-primary{background: #123c2c !important;} .public-kpi-grid .stats-icon{background: rgba(47, 125, 88, 0.09) !important; color: #1c5b3e !important;} .public-kpi-grid .card-border-orange{border-top-color: #7eb85b !important;} .public-kpi-grid .card-border-blue{border-top-color: #2f7d58 !important;} .public-kpi-grid .card-border-green{border-top-color: #58a56d !important;} .public-kpi-grid .card-border-yellow{border-top-color: #b9d86f !important;} #public-impacto-cards > .impacto-card-link > .impacto-card{background: linear-gradient(180deg, #2f6faf, #075b98) !important; box-shadow: 0 18px 36px rgba(7, 91, 152, 0.2) !important;} .impacto-card.blue, .impacto-card.green, .impacto-card.orange, .impacto-card.cyan, .impacto-card.purple, #card-pet-oceano{--card-glow: rgba(255, 196, 0, 0.22);} .chart-card::before{background: linear-gradient(90deg, #075b98, #ffc400) !important;} .chart-grid > .chart-card:nth-child(1)::before{background: linear-gradient(90deg, #075b98, #2f6faf) !important;} .chart-grid > .chart-card:nth-child(3)::before{background: linear-gradient(90deg, #123853, #075b98) !important;} .event-badge.ativo{background: rgba(78, 166, 107, 0.16) !important; color: #255a3f !important; border-color: rgba(78, 166, 107, 0.26) !important;} .event-badge.aguardando{background: rgba(169, 188, 90, 0.18) !important; color: #536633 !important; border-color: rgba(169, 188, 90, 0.26) !important;} .edu-simulator{background: radial-gradient(circle at top right, rgba(255, 196, 0, 0.2), transparent 30%), linear-gradient(145deg, #0a3a66 0%, #075b98 48%, #2f6faf 100%) !important; box-shadow: 0 24px 48px rgba(7, 91, 152, 0.2) !important;} .edu-eyebrow{color: rgba(255, 196, 0, 0.95) !important;} .edu-field input:focus{outline: 2px solid rgba(255, 196, 0, 0.55) !important; border-color: rgba(255, 196, 0, 0.4) !important;} .impacto-modal p strong{color: #075b98 !important;} .public-sponsors-bar{padding: 0.35rem !important; background: linear-gradient(180deg, #ffffff, #f6fbf4) !important; border: 1px solid rgba(19, 71, 46, 0.1) !important; box-shadow: 0 14px 28px rgba(26, 72, 46, 0.08) !important;} .footer.public-footer{background: transparent !important; border-top: 1px solid rgba(255, 255, 255, 0.16); border-left: none; border-right: none; border-bottom: none; padding: 0;} .footer.public-footer.minimal-footer{padding: 0.25rem 0 !important;} .footer.public-footer.minimal-footer .minimal-footer-line{margin: 0; padding: 0; text-align: center; font-size: 0.9rem; font-weight: 500; color: rgba(255, 255, 255, 0.78); letter-spacing: 0.08em;} .footer.public-footer.minimal-footer .container{padding: 0;} .public-page-shell{padding-top: 0 !important;} .landing-highlight-grid, .landing-ods-grid, .landing-gallery-grid, .landing-stories-grid, .landing-participation-grid{align-items: stretch; grid-auto-rows: 1fr;} .landing-highlight-card, .landing-ods-card, .landing-story-item, .landing-gallery-item, .landing-participation-column, .landing-story-card, .landing-points-card, .landing-participation-card, .landing-faq-item, .landing-bullet-item{height: 100%;} .landing-highlight-card{display: grid; align-content: start;} .landing-ods-card{height: 100%;} .landing-ods-section{padding: 1.4rem !important; display: grid; gap: 0 !important;} .landing-ods-body{margin-top: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; gap: 1rem !important;} .landing-ods-stage{grid-template-columns: minmax(0, 1.35fr) auto !important; gap: 1rem 1.4rem !important; align-items: center !important; padding: 1rem 1.1rem !important; border-radius: 1.2rem; border: 1px solid rgba(19, 71, 46, 0.08); background: linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(247, 251, 245, 0.78));} .landing-ods-copy{max-width: 100% !important; display: grid; align-content: center; gap: 0.35rem; padding: 0.95rem 1.05rem !important; border-radius: 1rem; background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(244, 250, 241, 0.9)); border: 1px solid rgba(19, 71, 46, 0.08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);} .landing-ods-copy .landing-mini-title{margin-bottom: 0.2rem;} .landing-ods-copy .landing-section-copy{max-width: none !important; margin-bottom: 0 !important; font-size: clamp(1rem, 1.02vw, 1.08rem) !important; line-height: 1.72 !important; text-align: left !important; text-wrap: normal !important; text-align-last: left; text-justify: inter-word;} .landing-ods-mosaic{justify-self: end;} .landing-ods-grid{margin-top: 0 !important; gap: 0.95rem !important;} .landing-ods-card{padding: 0.95rem !important; gap: 0.55rem !important; min-height: 0 !important;} .landing-ods-head{gap: 0.35rem !important;} .landing-ods-topline{align-items: center;} .landing-ods-icon{width: 2.15rem; height: 2.15rem; border-radius: 0.7rem;} .landing-ods-number{font-size: 0.74rem; letter-spacing: 0.1em;} .landing-ods-head strong{font-size: 0.98rem; line-height: 1.22;} .landing-ods-card p{margin: 0; font-size: 0.9rem; line-height: 1.55;} .landing-realtime-intro{display: grid; gap: 1.1rem;} .landing-dashboard-nav-shell{display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 1.25rem; align-items: end; padding: 1rem 1.15rem; border-radius: 1.2rem; border: 1px solid rgba(19, 71, 46, 0.08); background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(247, 251, 245, 0.76));} .landing-dashboard-nav-copy{margin: 0.3rem 0 0; color: #4f6457; line-height: 1.55; max-width: 54ch;} .landing-dashboard-nav{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.7rem; width: min(100%, 28rem);} .landing-dashboard-button{min-height: 48px; padding: 0.8rem 0.95rem; border-radius: 0.95rem; border: 1px solid rgba(31, 102, 64, 0.12); background: rgba(255, 255, 255, 0.76); color: var(--public-text); font: inherit; font-size: 0.9rem; font-weight: 700; line-height: 1.2; box-shadow: 0 10px 22px rgba(26, 72, 46, 0.05); cursor: pointer; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease, color 0.22s ease;} .landing-dashboard-button:hover, .landing-dashboard-button:focus-visible{transform: translateY(-2px); border-color: rgba(46, 124, 83, 0.28); box-shadow: 0 14px 28px rgba(26, 72, 46, 0.1); outline: none;} .landing-dashboard-button.is-active{color: #f7fff7; border-color: rgba(255, 255, 255, 0.12); background: linear-gradient(135deg, #1f7c4f, #53ab65); box-shadow: 0 16px 30px rgba(31, 124, 79, 0.2);} .landing-dashboard-shell{display: grid; gap: 1rem; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;} .landing-dashboard-panel[hidden]{display: none !important;} .landing-dashboard-panel.is-active{display: grid;} .landing-dashboard-stack{display: grid; gap: 1rem;} .landing-dashboard-grid{display: grid; gap: 1rem;} .landing-dashboard-grid-resumo{grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr); align-items: stretch;} .landing-dashboard-block{display: grid; gap: 0.95rem; padding: 1.2rem; border-radius: 1.3rem; border: 1px solid rgba(19, 71, 46, 0.1); background: linear-gradient(180deg, rgba(250, 254, 249, 0.98), rgba(241, 248, 239, 0.92)); box-shadow: 0 16px 34px rgba(26, 72, 46, 0.09);} .landing-dashboard-block-emphasis{padding: 0.9rem; background: linear-gradient(180deg, rgba(18, 68, 48, 0.1), rgba(18, 68, 48, 0.04));} .landing-dashboard-heading{display: grid; gap: 0.35rem;} .landing-dashboard-copy{margin: 0; color: #4f6457; line-height: 1.58; max-width: 64ch;} .landing-dashboard-block .public-kpi-grid, .landing-dashboard-block .chart-grid-public, .landing-dashboard-block .public-events-grid-spaced{margin: 0 !important;} .landing-dashboard-block #public-impacto-cards{margin: 0 !important;} .landing-dashboard-block .chart-grid-public{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .landing-dashboard-block .chart-grid-public .chart-card-public:last-child{grid-column: 1 / -1;} .landing-dashboard-block .chart-card-public{min-width: 0; overflow: clip;} .landing-dashboard-block .chart-card-public canvas{width: min(100%, 166px) !important; max-width: min(100%, 166px) !important; height: auto !important; margin-inline: auto;} .landing-dashboard-block .chart-card-label{line-height: 1.25;} .landing-dashboard-block .chart-card-value{font-size: clamp(1.02rem, 1.2vw, 1.18rem) !important; line-height: 1.18; overflow-wrap: anywhere;} .landing-dashboard-block .chart-card-unit{font-size: 0.7rem !important;} .landing-dashboard-block .chart-card-legend{display: grid !important; grid-template-columns: 1fr !important; gap: 0.45rem !important; width: 100%; min-width: 0; margin-top: 0.7rem !important;} .landing-dashboard-block .chart-legend-item{display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; gap: 0.18rem 0.45rem !important; align-items: start; width: 100%; min-width: 0; padding: 0.44rem 0.5rem !important; text-align: left;} .landing-dashboard-block .chart-legend-item .color-dot{margin-top: 0.26rem;} .landing-dashboard-block .chart-legend-item .material{min-width: 0; font-size: 0.76rem !important; line-height: 1.28; overflow-wrap: anywhere;} .landing-dashboard-block .chart-legend-item .value{grid-column: 2; min-width: 0; font-size: 0.72rem !important; line-height: 1.2; color: #5d7265; overflow-wrap: anywhere;} .badge-tempo-real{color: #f2fbf4 !important; border-color: rgba(255, 255, 255, 0.18) !important; font-weight: 600 !important;} .landing-dashboard-block .public-kpi-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0.95rem !important;} .landing-dashboard-block .public-events-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .landing-visual-grid-dashboard{grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.92fr) !important; gap: 1rem !important;} .landing-visual-grid-dashboard .landing-story-card, .landing-visual-grid-dashboard .landing-points-card{padding: 1.15rem !important;} .landing-dashboard-block .landing-daily-chart-frame{min-height: 300px;} .landing-dashboard-block .edu-simulator{margin: 0 !important;} .landing-dashboard-block .event-empty-state{display: grid; place-items: center; min-height: 180px; border-radius: 1rem; border: 1px dashed rgba(19, 71, 46, 0.16); color: var(--public-muted); background: rgba(255, 255, 255, 0.55);} @media (max-width: 1180px){.landing-dashboard-nav-shell, .landing-dashboard-grid-resumo, .landing-visual-grid-dashboard{grid-template-columns: 1fr !important;} .landing-dashboard-nav{width: 100%;}} @media (max-width: 960px){.landing-ods-stage{grid-template-columns: 1fr !important; align-items: start !important;} .landing-ods-mosaic{justify-self: start;} .landing-dashboard-block .chart-grid-public{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}} @media (max-width: 768px){.landing-ods-section{padding: 1rem !important;} .landing-ods-stage{padding: 0.95rem !important;} .landing-dashboard-nav-shell, .landing-dashboard-block{padding: 1rem !important;} .landing-dashboard-nav{grid-template-columns: repeat(3, minmax(0, 1fr));} .landing-dashboard-button{min-height: 46px; padding-inline: 0.75rem; font-size: 0.85rem;} .landing-dashboard-block .public-kpi-grid, .landing-dashboard-block .chart-grid-public, .landing-dashboard-block .public-events-grid{grid-template-columns: 1fr !important;} .landing-dashboard-block .chart-grid-public .chart-card-public:last-child{grid-column: auto;} .landing-dashboard-block .landing-daily-chart-frame{min-height: 260px;}} @media (max-width: 640px){.landing-ods-copy .landing-section-copy, .landing-dashboard-copy, .landing-dashboard-nav-copy{max-width: none;} .landing-tab-list{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .landing-ods-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .landing-dashboard-nav{grid-template-columns: repeat(3, minmax(0, 1fr)) !important;} .landing-dashboard-button{width: auto;} #public-impacto-cards, .landing-dashboard-block .public-kpi-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}} @media (max-width: 360px){.landing-ods-grid{grid-template-columns: 1fr !important;} #public-impacto-cards, .landing-dashboard-block .public-kpi-grid{grid-template-columns: 1fr !important;}} .landing-hero-shell{position: relative !important; display: block !important; overflow: hidden !important; min-height: clamp(236px, 24vw, 300px) !important; padding: clamp(0.9rem, 1.6vw, 1.1rem) !important; border-radius: 1.6rem !important;} .landing-hero-shell.has-hero-media::before{content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(100deg, rgba(8, 30, 22, 0.88) 0%, rgba(10, 44, 31, 0.76) 38%, rgba(11, 54, 37, 0.38) 68%, rgba(11, 54, 37, 0.18) 100%), linear-gradient(180deg, rgba(11, 54, 37, 0.24), rgba(11, 54, 37, 0.42));} .landing-hero-grid{position: relative !important; z-index: 2; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; min-height: clamp(210px, 20vw, 258px) !important;} .landing-hero-copy{max-width: min(1100px, 100%) !important; min-height: 100%; color: #f5fff7 !important; display: grid !important; align-content: center !important; gap: 0.45rem !important; --hero-copy-line: min(38rem, 100%);} .landing-admin-link{backdrop-filter: blur(12px);} .landing-admin-link{display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0.45rem 0.82rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.16); background: rgba(255, 255, 255, 0.12); color: #f4fff6; font-weight: 700; font-size: 0.78rem; letter-spacing: 0.04em; text-decoration: none; box-shadow: 0 10px 24px rgba(6, 28, 19, 0.16);} .landing-admin-link:hover, .landing-admin-link:focus-visible{transform: translateY(-1px); outline: none;} .landing-admin-link-hero{position: absolute; top: 0.95rem; right: 0.95rem; z-index: 3;} .landing-hero-brand{background: transparent !important; border: none !important; width: auto !important; max-width: 100% !important; display: inline-flex !important; grid-template-columns: none !important; align-items: center; gap: 0.65rem !important; padding: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;} .landing-hero-brand-copy span, .landing-hero-brand-copy strong, .landing-hero-copy .hero-subtitle{color: rgba(244, 255, 246, 0.92) !important;} .landing-hero-copy h1{width: var(--hero-copy-line); max-width: 100% !important; font-size: clamp(1.75rem, 2.7vw, 2.55rem) !important; line-height: 0.95 !important; letter-spacing: -0.052em !important; text-align: left !important; text-align-last: left; text-wrap: normal !important; text-justify: auto;} .landing-hero-copy .hero-subtitle{width: var(--hero-copy-line); max-width: 100% !important; font-size: clamp(0.88rem, 0.92vw, 0.96rem) !important; line-height: 1.42 !important; text-align: left !important; text-align-last: left; text-wrap: normal !important; text-justify: auto;} .landing-hero-copy-lead{display: grid; align-content: center; gap: 0.4rem; min-width: 0; width: var(--hero-copy-line); max-width: 100%;} .landing-hero-visual{position: absolute !important; inset: 0 !important; z-index: 0 !important; min-height: 100% !important; max-width: none !important; width: 100% !important; height: 100% !important;} .landing-hero-carousel, .landing-hero-slides, .landing-hero-slide, .landing-hero-image, .landing-hero-placeholder{width: 100% !important; height: 100% !important;} .landing-hero-carousel, .landing-hero-slides{position: absolute !important; inset: 0 !important;} .landing-hero-slide{position: absolute !important; inset: 0 !important;} .landing-hero-image{object-fit: cover !important; object-position: center 48% !important; filter: saturate(0.92) contrast(1.03) brightness(0.88) !important;} .landing-hero-placeholder{justify-content: flex-end !important; padding: 1.25rem !important; background: radial-gradient(circle at 18% 18%, rgba(185, 216, 111, 0.28), transparent 28%), linear-gradient(135deg, #133f2e, #20583d 54%, #2d7a52) !important;} .landing-hero-carousel-dots{right: 1rem !important; bottom: 1rem !important; z-index: 3 !important;} .landing-dashboard-grid-resumo{grid-template-columns: 1fr !important; gap: 1rem !important; align-items: start !important;} .landing-dashboard-block .public-kpi-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1rem !important; align-items: stretch !important;} .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1rem !important; align-items: stretch !important;} .landing-dashboard-block-graficos .chart-grid-public .chart-card-public:last-child{grid-column: auto !important;} .landing-dashboard-block-graficos .chart-card-public{min-height: 100% !important;} .landing-dashboard-block-graficos .chart-card-public canvas{max-width: min(100%, 154px) !important;} .landing-dashboard-block-graficos .chart-card-legend{grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0.5rem !important;} .landing-dashboard-block-graficos #eventos-chart-content{display: grid; gap: 0.7rem; align-content: start;} .public-page-shell, .public-page .tab-section, .public-page .public-footer .container, .public-page .public-sponsors-bar .container{width: min(1180px, calc(100vw - 2rem)); max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important;} .public-page .tab-section[data-tab-panel]:not([data-tab-panel="dashboard"]){width: 100% !important; max-width: 100% !important;} .public-page .tab-section[data-tab-panel="dashboard"]{width: 100% !important; max-width: 100% !important;} .public-page .landing-hero-copy h1, .public-page .landing-hero-copy .hero-subtitle{text-align: left !important; text-wrap: normal !important;} .public-page .container.tab-section[data-tab-panel]:not([data-tab-panel="dashboard"]){padding-left: 0 !important; padding-right: 0 !important;} .landing-dashboard-block .public-kpi-grid .stats-card{display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-content: start !important; gap: 0.55rem 0.9rem !important; min-height: 208px !important; height: 100% !important; padding: 1.2rem !important; border-top-width: 5px !important;} .landing-dashboard-block .public-kpi-grid .stats-icon{grid-column: 2 !important; grid-row: 1 / span 2 !important; width: 3rem !important; height: 3rem !important; border-radius: 1rem !important;} .landing-dashboard-block .public-kpi-grid .stats-info{display: grid !important; align-content: start !important; gap: 0.55rem !important; min-width: 0;} .landing-dashboard-block .public-kpi-grid .stats-label{font-size: 0.74rem !important; line-height: 1.25 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;} .landing-dashboard-block .public-kpi-grid .stats-value{font-size: clamp(1.55rem, 2.2vw, 2.35rem) !important; line-height: 0.96 !important; letter-spacing: -0.045em !important; overflow-wrap: anywhere !important;} .landing-dashboard-block .public-kpi-grid .stats-value small{display: block !important; margin-top: 0.35rem !important; font-size: 0.76rem !important; letter-spacing: 0.06em !important; text-transform: uppercase !important;} .landing-dashboard-block .public-kpi-grid .stats-sub{margin-top: auto !important; font-size: 0.83rem !important; line-height: 1.42 !important; color: #587063 !important; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;} @media (max-width: 960px){.landing-hero-shell{min-height: 272px !important;} .landing-hero-shell.has-hero-media::before{background: linear-gradient(180deg, rgba(8, 30, 22, 0.82) 0%, rgba(9, 37, 27, 0.72) 44%, rgba(10, 46, 32, 0.52) 100%), linear-gradient(180deg, rgba(11, 54, 37, 0.2), rgba(11, 54, 37, 0.38));} .landing-hero-copy{max-width: none !important; --hero-copy-line: min(100%, 34rem);} .landing-hero-copy h1{font-size: clamp(1.7rem, 6vw, 2.35rem) !important;} .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .landing-dashboard-block-graficos .chart-grid-public .chart-card-public:last-child{grid-column: 1 / -1 !important;} .landing-ods-copy{padding: 0.9rem 0.95rem !important;}} @media (max-width: 768px){.landing-hero-shell{min-height: 244px !important; padding: 0.9rem !important;} .landing-dashboard-grid-resumo, .landing-dashboard-block .public-kpi-grid{grid-template-columns: 1fr !important;} .landing-hero-copy{--hero-copy-line: 100%;} .landing-hero-copy-lead, .landing-hero-copy h1, .landing-hero-copy .hero-subtitle{width: 100% !important;} .landing-hero-brand{width: auto !important;} .landing-hero-copy h1, .landing-hero-copy .hero-subtitle{text-align: left !important;} .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: 1fr !important;} .landing-dashboard-block-graficos .chart-card-legend{grid-template-columns: 1fr !important;} .landing-dashboard-block-graficos .chart-grid-public .chart-card-public:last-child{grid-column: auto !important;} .public-page-shell, .public-page .tab-section, .public-page .public-footer .container, .public-page .public-sponsors-bar .container{width: calc(100vw - 1.5rem);} .landing-admin-link-hero{top: 0.8rem; right: 0.8rem;} .landing-ods-copy .landing-section-copy{font-size: 0.96rem !important; line-height: 1.64 !important;} .landing-dashboard-block .public-kpi-grid .stats-card{min-height: 178px !important;}} html{background: var(--claude-canvas);} body{background: var(--claude-canvas); color: var(--claude-body); font-family: var(--font-ui-claude);} body:has(.public-page) .main-auth{background: var(--claude-canvas);} .container{max-width: var(--max-dashboard);} .public-page h1, .public-page h2, .landing-hero-copy h1, .section-title h2, .hero-banner h1, .page-header h2, .detail-title h2{color: var(--claude-ink); font-family: var(--font-display-claude); font-weight: 500; letter-spacing: 0; text-transform: none;} .public-page p, .landing-section-copy, .landing-dashboard-copy, .form-help, .empty-state p{color: var(--claude-muted);} .btn, .btn-public-calc, .landing-tab-button, .landing-dashboard-button{border-radius: var(--radius-claude-md) !important; font-family: var(--font-ui-claude); font-weight: 600; letter-spacing: 0; text-transform: none;} .btn-primary, .btn-action, .btn-public-calc, .login-submit{background: var(--claude-primary) !important; color: var(--claude-on-primary) !important; border-color: var(--claude-primary) !important;} .btn-primary:hover, .btn-action:hover, .btn-public-calc:hover, .login-submit:hover{background: var(--claude-primary-active) !important;} .btn-secondary, .btn-outline, .btn-ghost{background: var(--claude-canvas) !important; color: var(--claude-ink) !important; border: 1px solid var(--claude-hairline) !important; box-shadow: none !important;} .card, .form-card, .chart-card, .table-container, .empty-state, .detail-card, .confirm-card, .page-header, .detail-header{background: #fff !important; border: 1px solid var(--claude-border-aa) !important; border-left-width: 1px !important; border-radius: var(--radius-claude-xl) !important; box-shadow: var(--shadow-claude-card) !important;} .card:hover, a.card:hover{box-shadow: var(--shadow-claude-float) !important;} .header{min-height: 64px !important; background: rgba(250, 249, 245, 0.94) !important; border-bottom: 1px solid var(--claude-hairline); box-shadow: none !important;} .header .container{max-width: 1480px;} .logo-image--header{height: clamp(34px, 3.2vw, 44px) !important;} .nav{background: var(--claude-surface-soft) !important; border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-lg) !important; padding: 0.35rem !important;} .nav-link{border-radius: var(--radius-claude-md) !important; color: var(--claude-muted) !important; font-weight: 600 !important;} .nav-link:hover{background: var(--claude-surface-card) !important; color: var(--claude-ink) !important;} .nav-link.active{background: var(--claude-primary) !important; color: var(--claude-on-primary) !important; box-shadow: none !important;} .nav-user{border: 1px solid var(--claude-hairline); border-radius: 999px; background: var(--claude-canvas); padding: 0.3rem 0.65rem;} .btn-logout{background: var(--claude-surface-dark) !important; box-shadow: none !important;} .main:not(.main-auth){background: radial-gradient(circle at 18% 0%, rgba(204, 120, 92, 0.12), transparent 34%), radial-gradient(circle at 84% 10%, rgba(93, 184, 166, 0.10), transparent 30%), var(--claude-canvas) !important;} .footer{background: var(--claude-surface-dark) !important; border: 0 !important;} .footer-text{color: var(--claude-on-dark-soft) !important;} .hero-banner{background: var(--claude-surface-dark) !important; border: 0 !important; color: var(--claude-on-dark) !important; padding: clamp(1.5rem, 4vw, 3rem) !important;} .hero-banner h1{color: var(--claude-on-dark) !important; font-size: clamp(2rem, 4vw, 4rem) !important; line-height: 1.04;} .hero-banner p{color: var(--claude-on-dark-soft) !important;} .dashboard-grid, .quick-access-grid{gap: clamp(0.9rem, 2vw, 1.5rem) !important;} .stats-card, .stats-card-link{min-height: 116px; background: var(--claude-surface-card) !important;} .stats-icon{background: var(--claude-canvas) !important; box-shadow: none !important;} .stats-value{color: var(--claude-ink) !important; letter-spacing: 0;} .quick-access-card{min-height: 176px; border-radius: var(--radius-claude-xl) !important; box-shadow: none !important; text-decoration: none !important;} .quick-access-card.blue, .quick-access-card.green, .quick-access-card.magenta, .quick-access-card.orange, .quick-access-card.darkgreen{background: var(--claude-surface-dark) !important; color: var(--claude-on-dark) !important;} .quick-access-card.yellow{background: var(--claude-primary) !important; color: var(--claude-on-primary) !important;} .quick-access-card p{color: currentColor; opacity: 0.72;} .form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group input[type="number"], .form-group input[type="date"], .form-group input[type="file"], .form-group select, .form-group textarea, .search-input, .search-input-with-icon{background: var(--claude-canvas) !important; border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-md) !important; color: var(--claude-ink) !important;} .form-group input:focus, .form-group select:focus, .form-group textarea:focus, .search-input:focus, .search-input-with-icon:focus{border-color: var(--claude-primary) !important; box-shadow: 0 0 0 3px rgba(204, 120, 92, 0.16) !important;} .data-table th{background: var(--claude-surface-soft) !important; color: var(--claude-muted) !important;} .data-table tbody tr:hover{background: var(--claude-surface-soft) !important;} .public-page-shell{max-width: var(--max-dashboard) !important;} .landing-hero-shell, .landing-story-card, .landing-points-card, .landing-participation-card, .landing-section, .landing-dashboard-block, .landing-dashboard-nav-shell, .landing-highlight-card, .landing-impact-card, .landing-visual-card, .landing-event-card, .landing-faq-item, .landing-explainer-card{border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-xl) !important; box-shadow: none !important;} .landing-hero-shell{background: radial-gradient(circle at 88% 8%, rgba(204, 120, 92, 0.26), transparent 28%), var(--claude-canvas) !important; border-color: var(--claude-hairline) !important; color: var(--claude-ink) !important;} .landing-hero-copy h1{color: var(--claude-ink) !important; max-width: 820px;} .landing-hero-brand-copy span, .landing-hero-impact-kicker, .landing-hero-impact p, .landing-hero-impact-main span, .landing-hero-copy .hero-subtitle{color: var(--claude-muted) !important;} .landing-hero-brand-copy strong, .landing-hero-impact-main strong{color: var(--claude-ink) !important;} .landing-hero-badge, .landing-highlight-label, .landing-mini-title, .landing-story-meta{color: var(--claude-primary) !important; letter-spacing: 0.08em !important;} .landing-hero-impact, .landing-hero-visual{background: var(--claude-surface-card) !important; border-color: var(--claude-hairline) !important;} .landing-admin-link-hero{background: var(--claude-primary) !important; color: var(--claude-on-primary) !important;} .section-title .first{color: var(--claude-ink) !important;} .section-title .second{background: var(--claude-surface-card) !important; color: var(--claude-ink) !important; border-radius: var(--radius-claude-md) !important;} .section-title-dot.blue, .section-title-dot.yellow, .section-title-dot.magenta{background: var(--claude-primary) !important;} .landing-highlight-grid{display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important; gap: clamp(0.85rem, 2vw, 1.25rem) !important;} .landing-highlight-card{background: var(--claude-surface-card) !important; min-height: 230px; display: flex !important; flex-direction: column; justify-content: space-between; padding: clamp(1.1rem, 2.2vw, 1.6rem) !important;} .landing-highlight-icon{width: 48px; height: 48px; display: inline-grid !important; place-items: center; border-radius: 50%; background: var(--claude-canvas) !important; color: var(--claude-primary) !important; font-size: 1.35rem !important;} .landing-highlight-card strong{color: var(--claude-ink) !important; font-family: var(--font-display-claude); font-weight: 500 !important; letter-spacing: 0; line-height: 1;} .landing-ods-section{background: var(--claude-surface-soft) !important; border-radius: var(--radius-claude-2xl) !important; padding: clamp(1rem, 3vw, 2rem) !important;} .landing-ods-body{gap: clamp(1rem, 2vw, 1.5rem) !important;} .landing-ods-stage{background: var(--claude-canvas) !important; border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-xl) !important; box-shadow: none !important;} .landing-ods-mosaic{display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: clamp(0.45rem, 1.2vw, 0.8rem) !important; max-width: 360px; margin-inline: auto;} .landing-ods-mosaic-tile{aspect-ratio: 1 / 1; width: 100%; min-width: 0; border-radius: 14px !important; overflow: hidden; background: #fff !important; border: 1px solid rgba(20, 20, 19, 0.08) !important; padding: 0 !important; display: grid !important; place-items: center; box-shadow: none !important;} .landing-ods-mosaic-tile img, .landing-ods-icon{display: block; width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; aspect-ratio: 1 / 1; max-width: 100%; max-height: 100%;} .landing-ods-grid{display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important; gap: clamp(0.85rem, 1.8vw, 1.15rem) !important; align-items: stretch;} .landing-ods-card{--ods-accent: var(--claude-primary); min-height: 235px; display: flex !important; flex-direction: column; gap: 0.85rem; background: var(--claude-canvas) !important; border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-xl) !important; padding: clamp(1rem, 2vw, 1.35rem) !important; position: relative; overflow: hidden;} .landing-ods-card::before{content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--ods-accent);} .landing-ods-card::after{display: none !important;} .landing-ods-head{display: grid !important; gap: 0.8rem;} .landing-ods-topline{display: flex !important; align-items: center; gap: 0.75rem;} .landing-ods-icon{flex: 0 0 58px; width: 58px !important; height: 58px !important; border-radius: 10px !important; background: #fff !important; box-shadow: none !important;} .landing-ods-number{background: color-mix(in srgb, var(--ods-accent) 14%, white) !important; color: var(--claude-ink) !important; border: 1px solid color-mix(in srgb, var(--ods-accent) 24%, white) !important; border-radius: 999px !important; box-shadow: none !important; font-weight: 700 !important;} .landing-ods-head strong{color: var(--claude-ink) !important; font-family: var(--font-display-claude); font-size: clamp(1.2rem, 2vw, 1.55rem) !important; font-weight: 500 !important; letter-spacing: 0; line-height: 1.08 !important;} .landing-ods-card p{color: var(--claude-muted) !important; line-height: 1.55 !important; margin-top: auto !important;} .landing-ods-card.ods-4{--ods-accent: #c5192d;} .landing-ods-card.ods-6{--ods-accent: #26bde2;} .landing-ods-card.ods-8{--ods-accent: #8f1838;} .landing-ods-card.ods-10{--ods-accent: #dd1367;} .landing-ods-card.ods-11{--ods-accent: #f59d23;} .landing-ods-card.ods-12{--ods-accent: #bf8b2e;} .landing-ods-card.ods-13{--ods-accent: #3f7e44;} .landing-ods-card.ods-14{--ods-accent: #0a97d9;} .landing-ods-card.ods-17{--ods-accent: #19486a;} .landing-story-card, .landing-points-card, .landing-participation-card, .landing-dashboard-block{background: var(--claude-canvas) !important;} .landing-dashboard-block-emphasis, .landing-participation-cta{background: var(--claude-surface-card) !important;} .landing-tab-button.is-active, .landing-dashboard-button.is-active{background: var(--claude-primary) !important; color: var(--claude-on-primary) !important;} .landing-tab-button:not(.is-active), .landing-dashboard-button:not(.is-active){background: var(--claude-surface-card) !important; color: var(--claude-muted) !important;} .login-background{background: radial-gradient(circle at top left, rgba(204, 120, 92, 0.28), transparent 30%), radial-gradient(circle at bottom right, rgba(93, 184, 166, 0.20), transparent 34%), var(--claude-surface-dark) !important;} .login-card{background: var(--claude-canvas) !important; border: 1px solid var(--claude-hairline) !important; border-radius: var(--radius-claude-2xl) !important; box-shadow: 0 24px 80px rgba(20, 20, 19, 0.18) !important;} .login-title{color: var(--claude-ink) !important; font-family: var(--font-display-claude); font-weight: 500;} .login-title .sustentavel{color: var(--claude-primary) !important;} .login-divider{background: var(--claude-primary) !important;} @media (max-width: 1180px){.header-content{flex-wrap: wrap; padding-block: 0.55rem;} .header-left{order: 1;} .header-right{order: 2; margin-left: auto;} .header-center{order: 3; flex-basis: 100%; justify-content: flex-start;} .nav{width: 100%; overflow-x: auto;}} @media (max-width: 900px){.landing-hero-grid, .landing-ods-stage, .landing-overview-grid, .landing-dashboard-grid, .landing-visual-grid, .landing-story-grid, .landing-participation-grid{grid-template-columns: 1fr !important;} .landing-hero-visual{min-height: 240px !important;} .landing-ods-mosaic{max-width: 300px;}} @media (max-width: 767px){.container, .public-page-shell{padding-inline: 0.85rem !important;} .layout-brand-bar{display: none !important;} .nav-link{min-height: 40px; padding: 0.48rem 0.65rem;} .nav-link span{max-width: 9rem; overflow: hidden; text-overflow: ellipsis;} .hero-banner h1, .landing-hero-copy h1{font-size: clamp(2.1rem, 11vw, 3rem) !important;} .dashboard-grid, .quick-access-grid, .chart-grid, .landing-highlight-grid, .landing-ods-grid{grid-template-columns: 1fr !important;} .stats-card, .stats-card-link{flex-direction: row !important; text-align: left !important; min-height: 96px;} .quick-access-card{min-height: unset;} .landing-highlight-card, .landing-ods-card{min-height: unset;} .landing-ods-icon{flex-basis: 52px; width: 52px !important; height: 52px !important;} .landing-ods-mosaic{grid-template-columns: repeat(3, 1fr) !important; max-width: 260px;} .form-actions .btn, .search-form .btn, .page-header .btn, .detail-header .btn{width: 100%;} .table-container{margin-inline: 0 !important; border-radius: var(--radius-claude-xl) !important;}} @media (max-width: 420px){.container, .public-page-shell{padding-inline: 0.65rem !important;} .landing-ods-mosaic{max-width: 230px; gap: 0.42rem !important;} .landing-ods-topline{align-items: flex-start;} .landing-ods-head strong{font-size: 1.22rem !important;}} @media (prefers-reduced-motion: reduce){*, *::before, *::after{animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important;}} :root{--claude-primary-aa: #8f4a35; --claude-label-aa: #704433; --claude-border-aa: #cdc0ad; --shadow-claude-card: 0 4px 16px rgba(20, 20, 19, 0.10);} .btn-primary, .btn-action, .btn-public-calc, .login-submit, .nav-link.active, .landing-tab-button.is-active, .landing-dashboard-button.is-active, .landing-admin-link-hero{background: var(--claude-primary-aa) !important; border-color: var(--claude-primary-aa) !important; color: #fff !important;} .btn-primary:hover, .btn-action:hover, .btn-public-calc:hover, .login-submit:hover, .nav-link.active:hover{background: #753925 !important;} .landing-highlight-label, .landing-mini-title, .landing-story-meta, .landing-hero-badge, .landing-hero-impact-kicker{color: var(--claude-label-aa) !important;} .stats-label, .nav-user-status, .material-row h4, .material-row .label, .form-group label, .peso-help{color: var(--claude-muted) !important;} .quick-access-card p, .quick-access-card.blue p, .quick-access-card.green p, .quick-access-card.magenta p, .quick-access-card.orange p, .quick-access-card.darkgreen p{color: var(--claude-on-dark) !important; opacity: 0.88 !important;} .quick-access-card.yellow p{color: #fff !important; opacity: 0.96 !important;} .landing-hero-shell.has-hero-media{background: var(--claude-surface-dark) !important; border-color: rgba(250, 249, 245, 0.14) !important;} .landing-hero-shell.has-hero-media .landing-hero-copy h1, .landing-hero-shell.has-hero-media .landing-hero-brand-copy strong, .landing-hero-shell.has-hero-media .landing-hero-impact-main strong{color: var(--claude-on-dark) !important;} .landing-hero-shell.has-hero-media .landing-hero-brand-copy span, .landing-hero-shell.has-hero-media .landing-hero-copy .hero-subtitle, .landing-hero-shell.has-hero-media .landing-hero-impact-main span, .landing-hero-shell.has-hero-media .landing-hero-impact p{color: rgba(250, 249, 245, 0.86) !important;} .public-page, .public-page-shell, .public-page .container, .public-page .tab-section, .public-page .landing-section, .public-page .landing-dashboard-toolbar, .public-page .landing-dashboard-nav-shell, .public-page .landing-utility-actions, .public-page .btn-public-refresh{max-width: 100% !important; box-sizing: border-box !important;} .public-page-shell > .container.tab-section, .public-page .container.tab-section{width: 100% !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important;} .public-page .landing-dashboard-toolbar, .public-page .landing-utility-actions, .public-page .btn-public-refresh{min-width: 0 !important;} html, body{overflow-x: clip;} @media (max-width: 767px){.public-page-shell{width: calc(100vw - 1.3rem) !important;} .public-page .landing-dashboard-toolbar, .public-page .landing-utility-actions, .public-page .btn-public-refresh{width: 100% !important;}} :root{--claude-muted-aa: #55524b;} .public-page p, .landing-section-copy, .landing-dashboard-copy, .landing-highlight-card p, .landing-ods-card p, .form-help, .empty-state p, .stats-label, .nav-user-status, .form-group label, .material-row h4, .material-row .label, .peso-help, [style*="olinda-muted"]{color: var(--claude-muted-aa) !important;} .btn-danger{background: #b3261e !important; color: #fff !important;} .btn-danger:hover{background: #8f1d18 !important;} .quick-access-card.yellow, .quick-access-card.magenta, .quick-access-card.orange, .quick-access-card.green, .quick-access-card.blue, .quick-access-card.darkgreen{background: var(--claude-surface-dark) !important; color: var(--claude-on-dark) !important;} .quick-access-card p, .quick-access-card.yellow p, .quick-access-card.magenta p, .quick-access-card.orange p, .quick-access-card.green p, .quick-access-card.blue p, .quick-access-card.darkgreen p{color: #fdfaf8 !important; opacity: 1 !important;} :root{--olinda-muted: #55524b; --olinda-text: #141413;} .landing-highlight-icon{color: var(--claude-primary-aa) !important;} .landing-tab-button:not(.is-active), .landing-dashboard-button:not(.is-active){color: var(--claude-muted-aa) !important;} .stats-label, .form-group label, .material-row h4, .material-row .label, .material-row small, .peso-help{color: var(--claude-muted-aa) !important; opacity: 1 !important;} .material-row select, .material-row input, select[name="material_tipo[]"], select[name="peso_unidade[]"], input[name="peso_kg[]"]{color: var(--claude-ink) !important;} .material-row select:invalid, select[name="material_tipo[]"]:invalid{color: var(--claude-muted-aa) !important;} .material-row option{color: var(--claude-ink) !important;} .header{border-bottom: 1px solid var(--claude-border-aa) !important;} .nav{border: 1px solid var(--claude-border-aa) !important;} .card-border-yellow{border: 1px solid var(--claude-border-aa) !important;} .data-table th{border-bottom: 1px solid var(--claude-border-aa) !important;} .landing-hero-shell, .landing-story-card, .landing-points-card, .landing-participation-card, .landing-section, .landing-dashboard-block, .landing-dashboard-nav-shell, .landing-highlight-card, .landing-impact-card, .landing-visual-card, .landing-event-card, .landing-faq-item, .landing-explainer-card{border-color: var(--claude-border-aa) !important;} .card-impacto-hoje{background: linear-gradient(135deg, #2E7D32 0%, #1B5E20 100%) !important; border: 3px solid #1B5E20 !important; border-radius: var(--radius-claude-xl) !important;}}]} disabled state is indicated by pointer-events and helper copy, not opacity. */ .card-border-yellow.opacity-50, .card-border-yellow[style*="pointer-events: none"]{opacity: 1 !important; filter: grayscale(0.08);} .landing-ods-grid{grid-template-columns: repeat(auto-fit, minmax(min(100%, 238px), 1fr)) !important;} .landing-ods-card{appearance: none; -webkit-appearance: none; width: 100%; border: 1px solid var(--claude-hairline) !important; text-align: left; cursor: pointer; font: inherit; color: inherit;} .landing-ods-card:hover{transform: translateY(-2px); border-color: color-mix(in srgb, var(--ods-accent) 42%, var(--claude-hairline)) !important; box-shadow: 0 18px 44px rgba(20, 20, 19, 0.09) !important;} .landing-ods-card:focus-visible{outline: 3px solid color-mix(in srgb, var(--ods-accent) 38%, transparent); outline-offset: 3px;} .landing-ods-open-hint{display: inline-flex; width: fit-content; margin-top: 0.2rem; padding: 0.32rem 0.55rem; border-radius: 999px; background: color-mix(in srgb, var(--ods-accent) 13%, white); color: var(--claude-ink); font-size: 0.76rem; font-weight: 700;} .ods-canvas[hidden]{display: none !important;} .ods-canvas{position: fixed; inset: 0; z-index: 9999; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 520px);} .ods-canvas-backdrop{grid-column: 1 / -1; grid-row: 1; border: 0; background: rgba(20, 20, 19, 0.46); cursor: pointer;} .ods-canvas-panel{grid-column: 2; grid-row: 1; align-self: stretch; min-width: 0; overflow-y: auto; padding: clamp(1.15rem, 3vw, 2rem); background: var(--claude-canvas); border-left: 1px solid var(--claude-hairline); box-shadow: -28px 0 70px rgba(20, 20, 19, 0.16); outline: none;} .ods-canvas-close{float: right; width: 42px; height: 42px; border-radius: 999px; border: 1px solid var(--claude-hairline); background: var(--claude-surface-card); color: var(--claude-ink); font-size: 1.5rem; line-height: 1; cursor: pointer;} .ods-canvas-kicker{width: fit-content; margin-bottom: 1rem; padding: 0.35rem 0.7rem; border-radius: 999px; background: var(--claude-primary-aa); color: #fff; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;} .ods-canvas-head{clear: both; display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 1rem; align-items: center; margin-bottom: 1.25rem;} .ods-canvas-icon{width: 92px; height: 92px; aspect-ratio: 1 / 1; object-fit: contain; border-radius: 14px;} .ods-canvas-head h3{margin: 0 0 0.35rem; color: var(--claude-ink); font-family: var(--font-display-claude); font-size: clamp(1.9rem, 4vw, 2.7rem); font-weight: 500; line-height: 1.02; letter-spacing: 0;} .ods-canvas-head p, .ods-canvas-section p{color: var(--claude-muted-aa); line-height: 1.62;} .ods-canvas-section{padding: 1rem 0; border-top: 1px solid var(--claude-hairline);} .ods-canvas-section span{display: block; margin-bottom: 0.35rem; color: var(--claude-label-aa); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;} .ods-canvas-source{display: inline-flex; margin-top: 1rem; color: var(--claude-primary-aa); font-weight: 800;} body.ods-canvas-open{overflow: hidden;} @media (max-width: 720px){.ods-canvas{grid-template-columns: 1fr;} .ods-canvas-panel{grid-column: 1; align-self: end; max-height: 88svh; border-left: 0; border-top: 1px solid var(--claude-hairline); border-radius: 22px 22px 0 0;} .ods-canvas-head{grid-template-columns: 70px minmax(0, 1fr);} .ods-canvas-icon{width: 70px; height: 70px;}} .landing-ods-stage{grid-template-columns: minmax(0, 1fr) max-content !important; align-items: start !important; gap: clamp(0.85rem, 2vw, 1.25rem) !important; padding: clamp(0.8rem, 1.8vw, 1.05rem) !important;} .landing-ods-copy{align-content: start !important; padding: clamp(0.78rem, 1.6vw, 0.95rem) !important;} .landing-ods-mosaic{grid-template-columns: repeat(4, clamp(68px, 6.4vw, 92px)) !important; gap: clamp(0.35rem, 1vw, 0.55rem) !important; width: max-content !important; max-width: 100% !important; margin-inline: 0 !important; justify-self: end !important; align-self: start !important;} .landing-ods-mosaic-tile{width: clamp(68px, 6.4vw, 92px) !important; border-radius: 12px !important;} @media (max-width: 780px){.landing-ods-stage{grid-template-columns: 1fr !important;} .landing-ods-mosaic{grid-template-columns: repeat(4, clamp(58px, 16vw, 76px)) !important; justify-self: center !important; margin-top: 0.1rem !important;} .landing-ods-mosaic-tile{width: clamp(58px, 16vw, 76px) !important; border-radius: 10px !important;}} @media (max-width: 360px){.landing-ods-mosaic{grid-template-columns: repeat(4, 56px) !important; gap: 0.3rem !important;} .landing-ods-mosaic-tile{width: 56px !important; border-radius: 8px !important;}} .landing-ods-mosaic{grid-auto-rows: clamp(34px, 3.2vw, 46px) !important;} .landing-ods-mosaic-tile{height: clamp(68px, 6.4vw, 92px) !important;} @media (max-width: 780px){.landing-ods-mosaic{grid-auto-rows: clamp(58px, 16vw, 76px) !important;} .landing-ods-mosaic-tile{height: clamp(58px, 16vw, 76px) !important;}} @media (max-width: 360px){.landing-ods-mosaic{grid-auto-rows: 56px !important;} .landing-ods-mosaic-tile{height: 56px !important;}} .public-page, .public-page button, .public-page input, .public-page select, .public-page textarea{font-family: var(--font-ui-claude) !important;} .public-page h1, .public-page h2, .landing-hero-copy h1, .section-title h2, .landing-highlight-card strong, .stats-value{letter-spacing: 0 !important;} .landing-ods-section{background: #f4f0e8 !important;} .landing-ods-stage{grid-template-columns: minmax(0, 1fr) max-content !important; align-items: center !important;} .landing-ods-copy{background: #fffdf8 !important;} .landing-ods-mosaic{grid-template-columns: repeat(8, clamp(44px, 4.8vw, 64px)) !important; grid-auto-rows: clamp(44px, 4.8vw, 64px) !important; gap: clamp(0.35rem, 0.7vw, 0.5rem) !important; width: max-content !important;} .landing-ods-mosaic-tile{width: clamp(44px, 4.8vw, 64px) !important; height: clamp(44px, 4.8vw, 64px) !important; border-radius: 8px !important; border: 1px solid rgba(20, 20, 19, 0.08) !important;} .landing-ods-mosaic-tile img{border-radius: inherit;} .landing-ods-grid{grid-template-columns: repeat(auto-fit, minmax(min(100%, 286px), 1fr)) !important; gap: clamp(0.85rem, 1.5vw, 1rem) !important;} .landing-ods-card{min-height: 0 !important; display: grid !important; grid-template-rows: auto 1fr auto; gap: 0.85rem !important; padding: 1rem 1.05rem 1rem 1.15rem !important; background: #fffdf8 !important; border-radius: 14px !important; transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;} .landing-ods-card::before{width: 4px !important;} .landing-ods-head{display: grid !important; grid-template-columns: 62px minmax(0, 1fr); grid-template-areas: "icon number" "icon title"; column-gap: 0.85rem; row-gap: 0.35rem !important; align-items: start;} .landing-ods-topline{display: contents !important;} .landing-ods-icon{grid-area: icon; width: 62px !important; height: 62px !important; flex-basis: 62px !important; border-radius: 10px !important;} .landing-ods-number{grid-area: number; min-width: 0 !important; padding: 0.3rem 0.55rem !important; font-size: 0.72rem !important; line-height: 1 !important; letter-spacing: 0 !important;} .landing-ods-head strong{grid-area: title; align-self: start; font-family: var(--font-ui-claude) !important; font-size: clamp(1rem, 1.1vw, 1.12rem) !important; font-weight: 800 !important; line-height: 1.22 !important; letter-spacing: 0 !important;} .landing-ods-card p{margin-top: 0 !important; font-size: 0.94rem !important; line-height: 1.55 !important;} .landing-ods-open-hint{margin-top: 0 !important; border-radius: 8px !important; letter-spacing: 0 !important;} @media (max-width: 900px){.landing-ods-stage{grid-template-columns: 1fr !important;} .landing-ods-mosaic{justify-self: start !important;}} @media (max-width: 620px){.landing-ods-mosaic{grid-template-columns: repeat(4, clamp(48px, 14vw, 62px)) !important; grid-auto-rows: clamp(48px, 14vw, 62px) !important; justify-self: center !important;} .landing-ods-mosaic-tile{width: clamp(48px, 14vw, 62px) !important; height: clamp(48px, 14vw, 62px) !important;} .landing-ods-head{grid-template-columns: 56px minmax(0, 1fr); column-gap: 0.75rem;} .landing-ods-icon{width: 56px !important; height: 56px !important; flex-basis: 56px !important;}} .public-page{--public-page-width: var(--max-public-page, 1760px); --public-page-gutter: clamp(1rem, 4vw, 5rem);} .public-page-shell, .public-page .tab-section, .public-page .public-footer .container, .public-page .public-sponsors-bar .container{width: min(var(--public-page-width), calc(100vw - var(--public-page-gutter))) !important; max-width: var(--public-page-width) !important; margin-left: auto !important; margin-right: auto !important;} .public-page-shell{padding-left: 0 !important; padding-right: 0 !important;} .public-page .landing-section, .public-page .landing-hero-shell{width: 100% !important;} .public-page .landing-section-copy, .public-page .landing-dashboard-copy, .public-page .landing-dashboard-nav-copy{max-width: 72rem;} .public-page .landing-highlight-grid{grid-template-columns: repeat(4, minmax(0, 1fr)) !important;} .public-page .landing-ods-grid{grid-template-columns: repeat(4, minmax(0, 1fr)) !important;} .public-page #public-impacto-cards{grid-template-columns: repeat(3, minmax(0, 1fr)) !important;} .public-page .landing-dashboard-block .public-kpi-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .public-page .landing-dashboard-grid-resumo{grid-template-columns: 1fr !important;} .public-page .landing-dashboard-grid-resumo > .landing-dashboard-block{width: 100% !important;} .public-page .landing-dashboard-grid-resumo .public-kpi-grid{grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: clamp(0.9rem, 1.2vw, 1.15rem) !important;} .public-page .landing-dashboard-grid-resumo .stats-card{min-height: clamp(190px, 11vw, 226px) !important; padding: clamp(1.05rem, 1.25vw, 1.35rem) !important;} .public-page .landing-dashboard-grid-resumo .stats-value{font-size: clamp(1.85rem, 2.1vw, 2.5rem) !important; letter-spacing: 0 !important;} .public-page .landing-dashboard-grid-resumo .stats-sub{-webkit-line-clamp: 3 !important;} .public-page .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: repeat(3, minmax(0, 1fr)) !important;} .public-page .landing-dashboard-block-graficos .chart-grid-public .chart-card-public:last-child{grid-column: auto !important;} @media (min-width: 1600px){.public-page .landing-visual-grid-dashboard{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}} @media (max-width: 1180px){.public-page .landing-highlight-grid, .public-page #public-impacto-cards, .public-page .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .public-page .landing-ods-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;} .public-page .landing-dashboard-grid-resumo .public-kpi-grid{grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}} @media (max-width: 767px){.public-page{--public-page-gutter: 1.3rem;} .public-page-shell, .public-page .tab-section, .public-page .public-footer .container, .public-page .public-sponsors-bar .container{width: calc(100vw - var(--public-page-gutter)) !important; max-width: calc(100vw - var(--public-page-gutter)) !important;} .public-page .landing-highlight-grid, .public-page .landing-ods-grid, .public-page #public-impacto-cards, .public-page .landing-dashboard-block .public-kpi-grid, .public-page .landing-dashboard-block-graficos .chart-grid-public{grid-template-columns: 1fr !important;}} .public-page{--fx-accent: var(--claude-primary-aa, #2f7d4f);} .public-scroll-progress{position: fixed; top: 0; left: 0; z-index: 60; width: 100vw; height: 3px; transform: scaleX(var(--progress-scale, 0)); transform-origin: 0 50%; background: linear-gradient(90deg, #2e7d54, #70a65b, #c2b356); box-shadow: 0 1px 10px rgba(47, 125, 79, 0.28); pointer-events: none;} .public-page.fx-ready .fx-reveal{opacity: 0; transform: translate3d(0, 14px, 0);} .public-page.fx-ready .fx-reveal.fx-visible{opacity: 1; transform: translate3d(0, 0, 0); transition: opacity 420ms ease-out var(--fx-delay, 0ms), transform 420ms ease-out var(--fx-delay, 0ms);} .public-page .fx-pointer-card{position: relative; isolation: isolate; overflow: hidden; transform-style: preserve-3d; transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;} .public-page .fx-pointer-card::after{content: ""; position: absolute; inset: 0; z-index: 0; display: block !important; border-radius: inherit; opacity: 0; background: radial-gradient(360px circle at var(--fx-x, 50%) var(--fx-y, 50%), color-mix(in srgb, var(--ods-accent, var(--fx-accent)) 18%, transparent), transparent 54%); pointer-events: none; transition: opacity 160ms ease;} .public-page .fx-pointer-card:hover::after, .public-page .fx-pointer-card:focus-within::after{opacity: 1;} .public-page .fx-pointer-card > *{position: relative; z-index: 1;} .public-page .landing-ods-card.fx-pointer-card{box-shadow: 0 18px 36px rgba(38, 35, 28, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.36);} .public-page .landing-ods-card.fx-pointer-card:hover{border-color: color-mix(in srgb, var(--ods-accent, var(--fx-accent)) 52%, transparent) !important; box-shadow: 0 24px 52px rgba(38, 35, 28, 0.14), 0 0 0 1px color-mix(in srgb, var(--ods-accent, var(--fx-accent)) 24%, transparent);} .public-page .landing-highlight-card.fx-pointer-card:hover, .public-page .impacto-card.fx-pointer-card:hover, .public-page .stats-card.fx-pointer-card:hover, .public-page .chart-card-public.fx-pointer-card:hover{box-shadow: 0 24px 58px rgba(30, 42, 34, 0.14), 0 0 0 1px rgba(47, 125, 79, 0.12);} @media (prefers-reduced-motion: reduce){.public-scroll-progress{display: none;} .public-page.fx-ready .fx-reveal, .public-page.fx-ready .fx-reveal.fx-visible, .public-page .fx-pointer-card{opacity: 1 !important; transform: none !important; transition: none !important;} .public-page .fx-pointer-card::after{display: none !important;}} .skip-link{position: absolute; left: 0.75rem; top: 0.75rem; z-index: var(--z-skip, 50); padding: 0.65rem 1rem; background: var(--portal-yellow, #ffc400); color: var(--portal-text, #123853); font-weight: 700; text-decoration: none; border-radius: 0.35rem; transform: translateY(-160%);} .skip-link:focus{transform: translateY(0);} html:has(.portal-page), body:has(.portal-page), body:has(.portal-page) .main-auth{background: var(--portal-canvas, #eef4f9) !important; color: var(--portal-text, #123853) !important;} .portal-page, .portal-page *{font-family: var(--font-portal, "Instrument Sans", "Segoe UI", sans-serif);} html:has(.portal-page){overflow-x: clip;} body:has(.portal-page), .portal-page, .portal-page.public-page{overflow-x: visible;} .portal-page{--public-text: var(--portal-text); --portal-shell: min(1680px, calc(100vw - 3rem)); color: var(--portal-text);} .portal-page h1, .portal-page h2, .portal-page h3, .portal-page .landing-hero-copy h1, .portal-page .section-title h2{font-family: var(--font-portal, "Instrument Sans", "Segoe UI", sans-serif) !important; color: var(--portal-text) !important; letter-spacing: -0.03em; text-wrap: balance;} .portal-page p, .portal-page .landing-section-copy, .portal-page .landing-dashboard-copy{color: var(--portal-muted) !important; text-wrap: pretty; max-width: 72ch;} [data-chart-retry][hidden]{display: none !important;} @media (max-width: 640px){.portal-hero-light{display: none !important;}} .portal-hero{position: relative; isolation: isolate; min-height: 0; display: grid; grid-template-rows: auto auto; align-content: start; padding-bottom: 2.1rem; color: var(--portal-on-dark); background: var(--portal-blue-dark); overflow: hidden;} .portal-hero-media, .portal-hero-media .landing-hero-carousel, .portal-hero-media .landing-hero-slides, .portal-hero-media .landing-hero-slide{position: absolute; inset: 0; width: 100%; height: 100%;} .portal-hero-media{z-index: 0; pointer-events: none;} .portal-page .portal-hero-media .landing-hero-carousel, .portal-page .portal-hero-media .landing-hero-slides, .portal-page .portal-hero-media .landing-hero-slide{overflow: hidden !important;} .portal-page .portal-hero-media .landing-hero-image{position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center 48% !important; transform: none !important; filter: saturate(0.98) contrast(1.08) brightness(0.82) !important;} .portal-hero-media .landing-hero-slide{opacity: 0; transition: opacity 900ms var(--ease-portal, cubic-bezier(0.16, 1, 0.3, 1));} .portal-hero-media .landing-hero-slide.is-active{opacity: 1;} .portal-hero-placeholder{position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 80% 10%, rgba(255, 196, 0, 0.28), transparent 55%), radial-gradient(ellipse 50% 40% at 10% 90%, rgba(229, 0, 126, 0.18), transparent 50%), linear-gradient(165deg, #0a4e82 0%, #075b98 48%, #1a7ab8 100%);} .portal-hero-light{position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; mix-blend-mode: screen; opacity: 0.55;} .portal-hero-veil{position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(5, 28, 48, 0.78) 0%, rgba(7, 41, 72, 0.52) 34%, rgba(7, 41, 72, 0.28) 68%, rgba(5, 28, 48, 0.58) 100%), linear-gradient(90deg, rgba(5, 28, 48, 0.82) 0%, rgba(7, 41, 72, 0.58) 26%, rgba(7, 41, 72, 0.22) 48%, transparent 70%); pointer-events: none;} @supports (animation-timeline: scroll()){.portal-hero-veil{animation: portal-hero-veil 1s linear both; animation-timeline: scroll(); animation-range: 0vh 80vh;}} @keyframes portal-hero-zoom{from{transform: scale(1);} to{transform: scale(1.05);}} @keyframes portal-hero-veil{from{opacity: 1;} to{opacity: 0.55;}} .portal-topbar{position: relative; z-index: 2; display: flex; align-items: center; gap: 1.15rem; width: var(--portal-shell, min(1680px, calc(100vw - 3rem))); max-width: 100%; margin: 0 auto; padding: 1rem 0 0.4rem;} .portal-pref-brand{display: grid; gap: 0.28rem; text-decoration: none; min-width: 0;} .portal-pref-brand img, .portal-brand img{display: block; height: clamp(64px, 8vw, 96px); width: auto; max-width: min(280px, 42vw); object-fit: contain; object-position: left center; filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.35));} .portal-kicker{display: inline-flex; align-items: center; gap: 0.45rem; color: var(--portal-yellow); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;} .portal-kicker::before{content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--portal-yellow); box-shadow: 0 0 0 6px rgba(255, 196, 0, 0.18);} .portal-brand{display: flex; align-items: center; min-width: 0; padding-left: 0.85rem; border-left: 1px solid rgba(255, 255, 255, 0.28);} .portal-login{margin-left: auto; color: var(--portal-on-dark); font-size: 0.88rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.35); padding-bottom: 0.1rem; background: none !important; backdrop-filter: none !important; border-radius: 0 !important; box-shadow: none !important;} .portal-login:hover, .portal-login:focus-visible{color: var(--portal-yellow); border-bottom-color: var(--portal-yellow);} .portal-hero-copy{position: relative; z-index: 2; align-self: start; width: var(--portal-shell, min(1680px, calc(100vw - 3rem))); margin: 0 auto; padding: clamp(0.9rem, 3vh, 1.8rem) 0 0.15rem;} .portal-hero-copy h1, .portal-hero-copy .hero-subtitle, .portal-hero-copy .portal-hero-actions{max-width: 46rem;} .portal-hero-copy h1{margin: 0 0 0.85rem; color: #fff !important; font-size: clamp(2.4rem, 6vw, 5.2rem); font-weight: 700; line-height: 1.04; letter-spacing: -0.035em; text-wrap: balance; text-shadow: 0 1px 1px rgba(5, 28, 48, 0.9), 0 10px 28px rgba(5, 28, 48, 0.55);} .portal-hero-copy h1 em{display: block; margin-top: 0.12em; font-family: var(--font-portal-em, Caveat, cursive); font-style: normal; font-weight: 700; font-size: 0.72em; letter-spacing: 0; color: #ffd84a; line-height: 1.12; text-shadow: 0 1px 1px rgba(5, 28, 48, 0.92), 0 8px 22px rgba(5, 28, 48, 0.6);} .portal-hero-copy .hero-subtitle{margin: 0 0 1.4rem; color: #f4f8fc !important; font-size: clamp(1.05rem, 1.7vw, 1.28rem); font-weight: 500; line-height: 1.55; max-width: 38rem; text-shadow: 0 1px 1px rgba(5, 28, 48, 0.92), 0 8px 22px rgba(5, 28, 48, 0.5);} .portal-hero-actions{display: flex; flex-wrap: wrap; gap: 0.75rem;} .portal-cta{display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0.75rem 1.25rem; border-radius: 0.45rem; background: var(--portal-yellow) !important; color: var(--portal-text) !important; border: 0 !important; font-weight: 700 !important; text-decoration: none; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);} .portal-cta:hover, .portal-cta:focus-visible{filter: brightness(1.05);} .portal-cta-ghost{display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0.75rem 1.15rem; border-radius: 0.45rem; background: transparent !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, 0.45) !important; font-weight: 650 !important; text-decoration: none;} .portal-cta-ghost:hover, .portal-cta-ghost:focus-visible{border-color: var(--portal-yellow) !important; color: var(--portal-yellow) !important;} .portal-hero .landing-hero-carousel-dots{position: absolute; right: 1.4rem; bottom: 1.4rem; left: auto; transform: none; z-index: 2; background: rgba(7, 41, 72, 0.35); border-radius: 999px; pointer-events: auto;} .portal-hero .landing-admin-link{display: none !important;} .portal-rail{position: sticky; top: 0; z-index: var(--z-rail, 20); overflow: visible; background: rgba(238, 244, 249, 0.96); border-bottom: 1px solid rgba(18, 56, 83, 0.08); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);} body:has(.header) .portal-rail{top: 6rem;} .portal-rail .portal-shell{display: flex; gap: 0.15rem; width: var(--portal-shell, min(1680px, calc(100vw - 3rem))); margin: 0 auto; padding: 0.55rem 0; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;} .portal-rail .portal-shell::-webkit-scrollbar{display: none;} .portal-rail a{flex: 0 0 auto; padding: 0.55rem 0.7rem; color: var(--portal-text); font-size: 0.84rem; font-weight: 650; text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap;} .portal-rail a:hover, .portal-rail a.is-active{color: var(--portal-blue-dark); border-bottom-color: var(--portal-yellow);} .portal-page .container, .portal-page .public-page-shell, .portal-page .landing-section, .portal-page .tab-section, .portal-page .tab-section[data-tab-panel], .portal-page .tab-section[data-tab-panel="dashboard"], .portal-page .portal-footer-grid, .portal-page .portal-footer-meta{width: var(--portal-shell, min(1680px, calc(100vw - 3rem))) !important; max-width: var(--portal-shell, 1680px) !important; margin-left: auto !important; margin-right: auto !important;} .portal-page .landing-highlight-grid, .portal-page .public-kpi-grid, .portal-page .landing-ods-grid, .portal-page .landing-dashboard-grid, .portal-page .chart-grid-public, .portal-page .public-impact-grid, .portal-page .landing-stories-grid, .portal-page .landing-gallery-grid{width: 100%;} .portal-page .tab-section, .portal-page.public-page[data-active-tab] .tab-section[data-tab-panel], .portal-page.public-page[data-active-tab="dashboard"] .tab-section[data-tab-panel]:not([data-tab-panel="dashboard"]), .portal-page.public-page[data-active-tab="educacao"] .tab-section[data-tab-panel]:not([data-tab-panel="educacao"]), .portal-page.public-page[data-active-tab="historias"] .tab-section[data-tab-panel]:not([data-tab-panel="historias"]), .portal-page.public-page[data-active-tab="participacao"] .tab-section[data-tab-panel]:not([data-tab-panel="participacao"]){display: block !important; animation: none !important;} .portal-page .landing-section, .portal-page .tab-section{scroll-margin-top: 4.75rem; margin-top: 2.4rem;} .portal-page .landing-section, .portal-page .landing-realtime-intro{background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; padding-left: 0 !important; padding-right: 0 !important;} .portal-page .landing-ods-section{padding: clamp(1.4rem, 3.2vw, 2.1rem) clamp(1.25rem, 3.2vw, 2.1rem) !important;} .portal-page .landing-ods-section .section-title{margin-bottom: 1.15rem !important;} .portal-page .landing-realtime-intro{gap: 1.5rem;} .portal-page .landing-dashboard-toolbar{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; margin: 0.35rem 0 1.75rem; padding: 0.35rem 0 0.5rem;} .portal-page .badge-tempo-real{padding: 0.72rem 1.2rem !important; white-space: normal; line-height: 1.35; animation: none !important;} .portal-page .btn-public-refresh{padding: 0.75rem 1.3rem !important;} .portal-page .landing-story-card, .portal-page .landing-points-card, .portal-page .landing-participation-card, .portal-page .landing-ods-section{border-radius: 1.1rem !important; background: var(--portal-surface) !important; border: 1px solid rgba(18, 56, 83, 0.08) !important; box-shadow: 0 18px 40px rgba(7, 91, 152, 0.08) !important;} .portal-page .section-title-dots{display: none !important;} .portal-page .section-title h2{display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.55rem; font-size: clamp(1.7rem, 3vw, 2.4rem) !important;} .portal-page .section-title .second{font-family: var(--font-portal-em, Caveat, cursive) !important; font-weight: 700 !important; color: var(--portal-blue-dark) !important; background: none !important; padding: 0 !important; border-radius: 0 !important; font-size: 1.15em;} .portal-page .landing-mini-title{text-transform: none !important; letter-spacing: 0 !important; font-weight: 700 !important; font-size: 1.05rem !important; color: var(--portal-blue-dark) !important;} .portal-page .landing-highlight-grid{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; overflow: hidden; border-radius: 1.1rem; background: var(--portal-blue-dark); box-shadow: 0 22px 48px rgba(7, 91, 152, 0.22);} .portal-page .landing-highlight-card{padding: 1.4rem 1.2rem 1.5rem; background: transparent !important; border: 0 !important; border-right: 1px solid rgba(255, 255, 255, 0.12) !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important;} .portal-page .landing-highlight-card:last-child{border-right: 0 !important;} .portal-page .landing-highlight-icon{display: none !important;} .portal-page .landing-highlight-label{text-transform: none !important; letter-spacing: 0 !important; font-weight: 650 !important; font-size: 0.86rem !important; color: rgba(244, 248, 252, 0.78) !important;} .portal-page .landing-highlight-card strong{font-family: var(--font-portal) !important; font-size: clamp(1.55rem, 2.4vw, 2.15rem) !important; letter-spacing: -0.03em !important; color: #fff !important;} .portal-page .landing-highlight-card p{color: rgba(244, 248, 252, 0.7) !important; font-size: 0.86rem;} .portal-page .landing-ods-card{background: var(--ods-accent, var(--portal-blue)) !important; border: 0 !important; color: #fff !important; box-shadow: 0 16px 32px color-mix(in srgb, var(--ods-accent) 28%, transparent) !important; transform: none; transition: transform 280ms var(--ease-portal), filter 280ms var(--ease-portal);} .portal-page .landing-ods-card::before, .portal-page .landing-ods-card::after{display: none !important;} .portal-page .landing-ods-card strong, .portal-page .landing-ods-card p{color: #fff !important;} .portal-page .landing-ods-open-hint, .portal-page .landing-ods-card .landing-ods-open-hint, .portal-page .landing-ods-card.ods-7 .landing-ods-open-hint{background: #ffffff !important; color: #0a1828 !important; border: 2px solid #0a1828 !important; box-shadow: none !important; font-weight: 800 !important; font-size: 0.8rem !important; letter-spacing: 0 !important; padding: 0.4rem 0.85rem !important; min-height: 36px; align-items: center; border-radius: 999px !important;} .portal-page .landing-ods-number{background: rgba(0, 0, 0, 0.22) !important; box-shadow: none !important;} .portal-page .landing-ods-card:hover, .portal-page .landing-ods-card:focus-visible{transform: translateY(-4px) scale(1.015); filter: saturate(1.08);} .portal-page .landing-ods-mosaic-tile{border-radius: 0.55rem;} .portal-page .btn-public-refresh, .portal-page .btn-public-calc, .portal-page .landing-dashboard-button.is-active, .portal-page .landing-tab-button.is-active{background: var(--portal-blue-dark) !important; border-color: var(--portal-blue-dark) !important; color: #fff !important;} .portal-page .landing-dashboard-button, .portal-page .landing-tab-button{background: #fff !important; color: var(--portal-text) !important; border: 1px solid rgba(18, 56, 83, 0.14) !important;} .portal-page .landing-tab-button::after, .portal-page .landing-dashboard-button::after{background: var(--portal-yellow) !important;} .portal-page .landing-tabs-shell{display: none !important;} .portal-page .impacto-card{background: var(--portal-blue-dark) !important; border-color: transparent !important;} .portal-page .fx-pointer-card, .portal-page .fx-tilt{transform: none !important;} .portal-page .fx-pointer-card::after{display: none !important;} .portal-page .public-scroll-progress{background: linear-gradient(90deg, var(--portal-blue-dark), var(--portal-yellow)) !important; box-shadow: none !important;} .portal-footer{margin-top: 3.5rem; padding: 2.4rem 1.2rem 1.6rem; background: var(--portal-blue-dark); color: var(--portal-on-dark);} .portal-footer-brand{display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;} .portal-footer-logo img, .portal-footer-carnaval{display: block; height: 72px; width: auto; max-width: min(220px, 46vw); object-fit: contain; object-position: left center; filter: none;} .portal-footer-carnaval{padding-left: 1rem; border-left: 1px solid rgba(255, 255, 255, 0.28);} .portal-footer-grid{margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, 0.9fr)); gap: 1.6rem; align-items: start;} .portal-footer a{color: var(--portal-yellow); text-decoration: none;} .portal-footer a:hover{text-decoration: underline;} .portal-footer h2{margin: 0 0 0.6rem; color: #fff !important; font-size: 1.05rem;} .portal-footer p, .portal-footer li{color: var(--portal-on-dark-soft);} .portal-footer ul{margin: 0; padding: 0; list-style: none; display: grid; gap: 0.4rem;} .portal-footer-meta{margin: 1.6rem auto 0; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, 0.12); color: var(--portal-on-dark-soft); font-size: 0.86rem;} @media (max-width: 900px){.portal-page .landing-highlight-grid{grid-template-columns: 1fr 1fr;} .portal-page .landing-highlight-card:nth-child(2){border-right: 0 !important;} .portal-footer-grid{grid-template-columns: 1fr;} .portal-hero{padding-bottom: 1.6rem;}} @media (max-width: 640px){.portal-page .landing-highlight-grid{grid-template-columns: 1fr;} .portal-page .landing-highlight-card{border-right: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;} .portal-hero-copy h1{font-size: clamp(2.1rem, 11vw, 3.1rem);} .portal-pref-brand img, .portal-brand img{height: 56px; max-width: 44vw;} .portal-brand{padding-left: 0.55rem;} body:has(.header) .portal-rail{top: 4rem;} .portal-page .landing-dashboard-toolbar{flex-direction: column; align-items: stretch; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 0.5rem;} .portal-page .btn-public-refresh{width: 100%;}} @media (prefers-reduced-motion: reduce){.portal-hero-media .landing-hero-image, .portal-hero-veil{animation: none !important;} .portal-page .portal-hero-media .landing-hero-image{transform: none !important;} .portal-hero-light{display: none !important;} .portal-page .landing-ods-card:hover{transform: none;}} html:has(.portal-page), body:has(.portal-page), body:has(.portal-page) .main-auth, .portal-page.public-page, .portal-page{--public-bg: var(--portal-canvas); --public-surface: #ffffff; --public-panel: var(--portal-blue-dark); --public-text: var(--portal-text); --public-muted: var(--portal-muted); --public-blue: var(--portal-blue); --public-teal: var(--portal-blue); --public-orange: var(--portal-yellow); --public-yellow: var(--portal-yellow); --public-pink: var(--portal-pink); --public-purple: var(--portal-blue-dark); --mat-papelao: #075b98; --mat-plastico: #2f6faf; --mat-latinha: #ffc400; --mat-pet: #5aa0d4; --mat-oleo: #e5007e; --mat-vidro: #123853; --claude-primary: var(--portal-blue-dark); --claude-primary-aa: var(--portal-blue-dark); --claude-canvas: var(--portal-canvas); --fx-accent: var(--portal-yellow); background: var(--portal-canvas) !important; color: var(--portal-text) !important;} .portal-page.public-page .section-title h2, .portal-page.public-page .section-title .first, .portal-page .section-title h2, .portal-page .section-title .first{text-transform: none !important; color: var(--portal-text) !important; font-weight: 700 !important; letter-spacing: -0.03em !important;} .portal-page.public-page .section-title .second, .portal-page .section-title .second{background: none !important; color: var(--portal-blue-dark) !important; text-transform: none !important; padding: 0 !important;} .portal-page .landing-ods-section{background: #fff !important; border-color: rgba(18, 56, 83, 0.08) !important; box-shadow: 0 18px 40px rgba(7, 91, 152, 0.08) !important; padding: clamp(1.4rem, 3.2vw, 2.1rem) clamp(1.25rem, 3.2vw, 2.1rem) !important;} .portal-page .badge-tempo-real{background: var(--portal-blue-dark) !important; color: #fff !important; padding: 0.72rem 1.2rem !important; animation: none !important;} .portal-page .edu-simulator{background: var(--portal-blue-dark) !important; border-color: rgba(255, 255, 255, 0.14) !important; box-shadow: 0 18px 40px rgba(7, 91, 152, 0.22) !important;} .portal-page .btn-public-calc{background: var(--portal-yellow) !important; color: var(--portal-text) !important; border-color: var(--portal-yellow) !important; box-shadow: 0 10px 22px rgba(7, 91, 152, 0.16) !important;} .portal-page .impacto-card, .portal-page .impacto-card.blue, .portal-page .impacto-card.green, .portal-page .impacto-card.orange, .portal-page .impacto-card.cyan, .portal-page .impacto-card.purple, .portal-page #card-pet-oceano, .portal-page #public-impacto-cards > .impacto-card-link > .impacto-card{background: linear-gradient(180deg, #2f6faf, #075b98) !important; border-color: transparent !important; color: #fff !important; --card-glow: rgba(255, 196, 0, 0.22); box-shadow: 0 16px 34px rgba(7, 91, 152, 0.18) !important;} .portal-page .impacto-card::before{background: radial-gradient(circle at top right, rgba(255, 196, 0, 0.22), transparent 42%), linear-gradient(150deg, rgba(255, 255, 255, 0.08), transparent 58%) !important;} .portal-page .edu-simulator, .portal-page .landing-dashboard-block .edu-simulator{background: radial-gradient(circle at top right, rgba(255, 196, 0, 0.18), transparent 30%), linear-gradient(145deg, #0a3a66 0%, #075b98 48%, #2f6faf 100%) !important; box-shadow: 0 24px 48px rgba(7, 91, 152, 0.2) !important;} .portal-page .edu-simulator::after{background: rgba(255, 196, 0, 0.12) !important;} .portal-page .public-kpi-grid .stats-card, .portal-page .stats-card, .portal-page .chart-card-public, .portal-page .landing-dashboard-block, .portal-page .landing-dashboard-nav-shell, .portal-page .landing-faq-item, .portal-page .landing-explainer-card, .portal-page .landing-club-card, .portal-page .event-card{background: #fff !important; border: 1px solid rgba(18, 56, 83, 0.1) !important; box-shadow: 0 10px 24px rgba(7, 91, 152, 0.06) !important; color: var(--portal-text) !important;} .portal-page .stats-value, .portal-page .chart-card-value, .portal-page .chart-card-label{color: var(--portal-blue-dark) !important;} .portal-page .card-border-orange, .portal-page .card-border-green, .portal-page .card-border-blue, .portal-page .card-border-yellow, .portal-page .public-kpi-grid .card-border-orange, .portal-page .public-kpi-grid .card-border-green{border-left-color: var(--portal-yellow) !important; border-left-width: 1px !important;} .portal-rail{background: rgba(238, 244, 249, 0.94) !important;} .portal-page .public-scroll-progress{background: linear-gradient(90deg, var(--portal-blue-dark), var(--portal-yellow)) !important;} .portal-page .landing-section, .portal-page .tab-section{scroll-margin-top: 4.75rem;} .portal-login{min-height: 44px; display: inline-flex; align-items: center;} .portal-page .landing-mini-title, .portal-page .stats-label, .portal-page .edu-eyebrow, .portal-page .landing-story-meta, .portal-page .impacto-label{text-transform: none !important; letter-spacing: 0 !important; font-weight: 650 !important;} .portal-page .landing-bullet-item, .portal-page .landing-explainer-card, .portal-page .landing-participation-cta, .portal-page .landing-participation-column{background: #fff !important; border: 1px solid rgba(18, 56, 83, 0.1) !important; color: var(--portal-text) !important; box-shadow: none !important;} .portal-page .landing-participation-cta{padding: 1.1rem 1.2rem !important; border-radius: 0.75rem !important;} .portal-page #public-impacto-cards, .portal-page .public-impact-grid{display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0.85rem !important;} .portal-page #public-impacto-cards > .impacto-card-link > .impacto-card{display: grid !important; grid-template-areas: "icon label" "value value" "unit unit" "meta meta" !important; grid-template-columns: auto 1fr !important; gap: 0.28rem 0.55rem !important; min-height: 168px !important; padding: 1.15rem 1.2rem 1.2rem !important; border-radius: 0.75rem !important; text-align: left !important;} .portal-page .impacto-icon{grid-area: icon !important; width: 1.5rem !important; height: 1.5rem !important; font-size: 1rem !important; margin: 0 !important;} .portal-page .impacto-label{grid-area: label !important; color: rgba(244, 248, 252, 0.78) !important; font-size: 0.88rem !important;} .portal-page .impacto-value{grid-area: value !important; color: #fff !important; font-size: clamp(1.45rem, 2vw, 1.9rem) !important; font-weight: 700 !important; letter-spacing: -0.03em !important; line-height: 1.1 !important;} .portal-page .impacto-unit{grid-area: unit !important; color: var(--portal-yellow) !important; font-size: 0.82rem !important; font-weight: 650 !important;} .portal-page .impacto-secondary{grid-area: meta !important; color: rgba(244, 248, 252, 0.72) !important; font-size: 0.8rem !important;} .portal-page .landing-ods-card.ods-3, .portal-page .landing-ods-card.ods-5, .portal-page .landing-ods-card.ods-6, .portal-page .landing-ods-card.ods-7, .portal-page .landing-ods-card.ods-9, .portal-page .landing-ods-card.ods-11, .portal-page .landing-ods-card.ods-12, .portal-page .landing-ods-card.ods-14, .portal-page .landing-ods-card.ods-15, .portal-page .landing-ods-card.ods-3 p, .portal-page .landing-ods-card.ods-3 strong, .portal-page .landing-ods-card.ods-5 p, .portal-page .landing-ods-card.ods-5 strong, .portal-page .landing-ods-card.ods-6 p, .portal-page .landing-ods-card.ods-6 strong, .portal-page .landing-ods-card.ods-7 p, .portal-page .landing-ods-card.ods-7 strong, .portal-page .landing-ods-card.ods-9 p, .portal-page .landing-ods-card.ods-9 strong, .portal-page .landing-ods-card.ods-11 p, .portal-page .landing-ods-card.ods-11 strong, .portal-page .landing-ods-card.ods-12 p, .portal-page .landing-ods-card.ods-12 strong, .portal-page .landing-ods-card.ods-14 p, .portal-page .landing-ods-card.ods-14 strong, .portal-page .landing-ods-card.ods-15 p, .portal-page .landing-ods-card.ods-15 strong{color: #0a1828 !important;} .portal-page .landing-dashboard-nav-shell{display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 1rem !important; padding: 1rem 1.15rem !important;} @media (max-width: 960px){.portal-page #public-impacto-cards, .portal-page .public-impact-grid{grid-template-columns: 1fr 1fr !important;}} @media (max-width: 640px){.portal-page #public-impacto-cards, .portal-page .public-impact-grid{grid-template-columns: 1fr !important;} .portal-page .landing-dashboard-nav-shell{flex-direction: column !important; align-items: stretch !important;}} .portal-page .edu-simulator, .portal-page .landing-dashboard-block .edu-simulator{color: #f4f8fc !important;} .portal-page .edu-simulator h3, .portal-page .edu-simulator strong, .portal-page .edu-result-card strong{color: #ffffff !important;} .portal-page .edu-simulator p, .portal-page .edu-simulator span, .portal-page .edu-simulator small, .portal-page .edu-simulator label, .portal-page .edu-description, .portal-page .edu-field span, .portal-page .edu-field small, .portal-page .edu-result-card p, .portal-page .edu-result-card span, .portal-page .edu-simulator-note{color: #e8f1f8 !important;} .portal-page .edu-simulator .edu-eyebrow{color: #ffd84a !important;} .portal-page .edu-field{background: rgba(7, 41, 72, 0.38) !important; border-color: rgba(255, 255, 255, 0.28) !important;} .portal-page .edu-field input{color: #ffffff !important; background: rgba(7, 41, 72, 0.55) !important; border-color: rgba(255, 255, 255, 0.35) !important;} .portal-page .edu-result-card{background: rgba(7, 41, 72, 0.32) !important; border: 1px solid rgba(255, 255, 255, 0.22) !important;} .portal-page .edu-simulator-note{background: rgba(7, 41, 72, 0.4) !important;} .portal-page .portal-footer p, .portal-page .portal-footer li, .portal-page .portal-footer-meta{color: #e8f1f8 !important;} .portal-page .portal-footer a, .portal-page .portal-kicker, .portal-page .impacto-unit{color: #ffd84a !important;} .portal-page .landing-highlight-label, .portal-page .impacto-label, .portal-page .impacto-secondary, .portal-page .landing-highlight-card p{color: #e8f1f8 !important;} .portal-page .landing-ods-number{background: #ffffff !important; color: #0a1828 !important; border: 1px solid #0a1828 !important;} @keyframes portal-rise{from{opacity: 0; transform: translate3d(0, 28px, 0);} to{opacity: 1; transform: none;}} .portal-page.fx-ready:not(.fx-static) .fx-block:not(.fx-visible){opacity: 0;} .portal-page.fx-ready:not(.fx-static) .fx-block.fx-visible{opacity: 1; transition: opacity 520ms var(--ease-portal, cubic-bezier(0.16, 1, 0.3, 1));} .portal-page.fx-ready:not(.fx-static) .fx-stagger{animation: portal-rise 680ms var(--ease-portal, cubic-bezier(0.16, 1, 0.3, 1)) both; animation-delay: var(--fx-delay, 0ms);} @media (prefers-reduced-motion: reduce){.portal-page.fx-ready .fx-block, .portal-page.fx-ready .fx-stagger{opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; filter: none !important;}}