:root {
                --ink: #183133;
                --muted: #6d7e7e;
                --water: #2f8291;
                --pale: #eef7f6;
                --line: #e7eeee;
                --sand: #f6f3ec;
            }
            body, input, select, textarea {
                font-family: "Source Sans Pro", sans-serif !important;
                color: var(--ink);
            }
            section, #header, hr, .major {
                border: none !important;
                box-shadow: none !important;
                padding: 0 !important;
            }
            
            #sidebar {
                position: fixed !important;
                top: 0;
                left: 0;
                height: 100vh !important;
                width: 18em !important;
                overflow: hidden !important;
                z-index: 10000;
                background: #fff;
                border-right: 1px solid #f2f2f2 !important;
            }
            #wrapper {
                padding-left: 18em !important;
            }
            .inner {
                padding: 2.2em 5em 0 !important;
                max-width: 1600px !important;
                margin: auto;
                width: 100%;
                box-sizing: border-box;
            }
            .eyebrow {
                font-size: 0.65em;
                font-weight: 900;
                text-transform: uppercase;
                letter-spacing: 4px;
                color: #9aabab;
                display: block;
                margin-bottom: 16px;
            }
            .hero {
                display: grid;
                grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
                gap: 5em;
                align-items: start;
                padding-bottom: 3.5em !important;
            }
            .hero h1 {
                font-size: 3.7em;
                letter-spacing: -2.5px;
                line-height: 1.02;
                margin: 0.15em 0 0.35em;
                color: #172d2f;
            }
            .lead {
                font-size: 1.17em;
                line-height: 1.75;
                color: var(--muted);
                max-width: 760px;
            }
            .water-orbit {
                width: 100%;
                max-width: 450px;
                aspect-ratio: 1;
                border-radius: 50%;
                position: relative;
                margin: 0;
                align-self: start;
                justify-self: center;
                overflow: hidden;
                box-sizing: border-box;
                background: #eef7f6 url("/images/agua-ciclo-vivo.webp") center/cover no-repeat;
                box-shadow: 0 30px 80px rgba(26, 89, 103, 0.2);
            }
            .section-block {
                border-top: 1px solid var(--line);
                padding: 3.2em 0 !important;
            }
            .section-head {
                display: grid;
                grid-template-columns: 180px minmax(0, 760px);
                gap: 2em;
                margin-bottom: 2em;
            }
            .section-head h2 {
                font-size: 2em;
                letter-spacing: -0.6px;
                margin: 0;
                color: var(--ink);
            }
            .section-head p {
                margin: 0;
                color: var(--muted);
                line-height: 1.7;
            }
            .metric-grid {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 1.2em;
            }
            .metric {
                padding: 1.6em;
                border-radius: 16px;
                background: var(--pale);
                min-height: 180px;
            }
            .metric:nth-child(2n) {
                background: var(--sand);
            }
            .metric strong {
                font-size: 2.25em;
                display: block;
                line-height: 1;
                color: var(--water);
                margin: 0.2em 0 0.45em;
            }
            .metric h3 {
                font-size: 0.72em;
                text-transform: uppercase;
                letter-spacing: 1.5px;
                margin: 0;
                color: #708586;
            }
            .metric p {
                font-size: 0.86em;
                line-height: 1.55;
                color: #657575;
                margin: 0;
            }
            .source {
                display: block;
                font-size: 0.66em;
                color: #9aa7a7;
                margin-top: 1.2em;
            }
            .journey {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 0;
            }
            .journey article {
                padding: 1.4em 1.6em 1.4em 0;
                border-top: 3px solid #bfdfe0;
                margin-right: 1.5em;
            }
            .journey b {
                display: block;
                color: var(--water);
                margin-bottom: 0.5em;
            }
            .journey p {
                font-size: 0.92em;
                line-height: 1.6;
                color: var(--muted);
            }
            .local-card {
                background: #183f45;
                color: #fff;
                border-radius: 20px;
                padding: 2.3em;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 2em;
            }
            .local-card h3 {
                color: #fff;
                margin: 0 0 0.35em;
                font-size: 1.7em;
            }
            .local-card p {
                color: #c9dcdc;
                line-height: 1.65;
            }
            .local-values {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 1px;
                background: rgba(255, 255, 255, 0.12);
            }
            .local-value {
                background: #183f45;
                padding: 1.1em;
            }
            .local-value small {
                display: block;
                text-transform: uppercase;
                letter-spacing: 1px;
                color: #9fc1c4;
            }
            .local-value b {
                color: #fff;
            }
            .honesty {
                font-size: 0.82em !important;
                border-left: 2px solid #75bfc5;
                padding-left: 1em;
            }
            .practice-grid, .reading-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1.2em;
            }
            .practice, .reading {
                border: 1px solid var(--line);
                border-radius: 14px;
                padding: 1.5em;
                background: #fff;
            }
            .practice h3, .reading h3 {
                font-size: 1.08em;
                margin: 0 0 0.6em;
                color: var(--ink);
            }
            .practice p, .reading p {
                font-size: 0.9em;
                line-height: 1.6;
                color: var(--muted);
                margin: 0;
            }
            .tag {
                display: inline-block;
                font-size: 0.62em;
                text-transform: uppercase;
                letter-spacing: 1.2px;
                color: var(--water);
                margin-bottom: 1em;
                font-weight: 800;
            }
            .news-list {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1.2em;
            }
            .news-item {
                padding: 1.5em;
                border: 1px solid var(--line);
                border-radius: 14px;
                color: inherit;
                text-decoration: none;
                transition: 0.25s;
            }
            .news-item:hover {
                transform: translateY(-3px);
                border-color: #a8cfd2;
            }
            .news-item h3 {
                font-size: 1.05em;
                line-height: 1.4;
                margin: 0.45em 0;
            }
            .news-item span {
                font-size: 0.7em;
                color: #99a5a5;
            }
            .empty {
                color: #91a0a0;
                font-style: italic;
            }
            details {
                margin-top: 0.9em;
            }
            summary {
                cursor: pointer;
                color: var(--water);
                font-size: 0.82em;
                font-weight: 700;
            }
            .steps {
                font-size: 0.86em;
                line-height: 1.55;
                color: var(--muted);
                padding-left: 1.1em;
            }
            .footer {
                padding: 4em 5em 2em;
                border-top: 1px solid var(--line);
                opacity: 0.4;
                text-align: right;
                box-sizing: border-box;
            }

            .footer-wordmark {
                display: flex;
                justify-content: flex-end;
            }

            .bio-wordmark {
                display: inline-block;
                text-align: center;
                line-height: 1;
                font-family: "Georgia", "Times New Roman", serif;
            }

            .bio-wordmark strong {
                display: block;
                font-size: 1.15em;
                font-weight: 400;
                letter-spacing: -0.4px;
                color: #81966e;
                line-height: 1;
                font-family: inherit;
            }

            .bio-wordmark small {
                display: block;
                margin-top: 2px;
                font-size: 0.43em;
                font-weight: 700;
                letter-spacing: 1.8px;
                text-transform: uppercase;
                color: #a66f50;
                line-height: 1;
                font-family: inherit;
            }

            .saap-container {
                display: grid;
                grid-template-columns: 1fr 1.2fr;
                gap: 2rem;
                background: #fff;
                border: 1px solid var(--line);
                border-radius: 20px;
                padding: 2rem;
            }

            .saap-form .field-group { margin-bottom: 1.2rem; }
            .saap-form label { display: block; font-weight: 900; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 1px; color: var(--forest); margin-bottom: 0.4rem; }
            .saap-form input, .saap-form select { width: 100%; padding: 0.8rem; border: 1px solid var(--line); border-radius: 10px; font-family: inherit; }
            .saap-form small { color: var(--muted); font-size: 0.75rem; display: block; margin-top: 0.3rem; }

            .saap-result {
                background: var(--pale);
                border-radius: 16px;
                padding: 1.5rem;
                border: 1px solid #d7e0d8;
            }

            .result-header { display: flex; gap: 2rem; margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid #d7e0d8; }
            .result-stat strong { display: block; font-size: 1.8rem; font-family: Georgia, serif; color: var(--ink); }
            .result-details h4 { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 1rem; }
            .result-details ul { list-style: none; padding: 0; font-size: 0.85rem; color: var(--ink); }
            .result-details li { margin-bottom: 0.5rem; padding-left: 1.2rem; position: relative; }
            .result-details li::before { content: "→"; position: absolute; left: 0; color: var(--forest); }

            .anqip-notice { margin-top: 1.5rem; padding: 1rem; background: #fff; border-radius: 8px; font-size: 0.75rem; border-left: 4px solid var(--clay); color: var(--muted); }

            @media (max-width: 760px) { .saap-container { grid-template-columns: 1fr; } }


            @media (max-width: 1100px) {
                #sidebar {
                    position: relative !important;
                    width: 100% !important;
                    height: auto !important;
                }
                #wrapper {
                    padding-left: 0 !important;
                }
                .hero {
                    grid-template-columns: 1fr;
                }
                .water-orbit {
                    width: 320px;
                }
                .metric-grid {
                    grid-template-columns: repeat(2, 1fr);
                }
            }
            @media (max-width: 760px) {
                .inner {
                    padding: 1.7em 1.4em 0 !important;
                }
                .hero h1 {
                    font-size: 2.55em;
                }
                .hero {
                    gap: 2.5em;
                }
                .water-orbit {
                    width: 240px;
                }
                .section-head {
                    grid-template-columns: 1fr;
                    gap: 0.7em;
                }
                .metric-grid, .journey, .practice-grid, .reading-grid, .news-list, .local-card {
                    grid-template-columns: 1fr;
                }
                .local-values {
                    grid-template-columns: 1fr 1fr;
                }
            }

           .technical-diagram-panoramic {
                width: 100%;
                margin: 1.5rem 0 3rem;
                border-radius: 20px;
                overflow: hidden;
                border: 1px solid var(--line);
                background: #fff;
                box-shadow: 0 10px 30px rgba(0,0,0,0.03);
            }

            .technical-diagram-panoramic img {
                width: 100%;
                height: auto;
                display: block;
                /* Garante que a imagem não fica desproporcional */
                aspect-ratio: 16 / 9;
                object-fit: cover;
            }

            /* Reajuste das legendas para 4 colunas em linha no desktop */
            .impact-grid-4-cols {
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 1.5rem;
                margin-top: 2rem;
            }

            @media (max-width: 1000px) {
                .impact-grid-4-cols { grid-template-columns: repeat(2, 1fr); }
            }

            @media (max-width: 600px) {
                .impact-grid-4-cols { grid-template-columns: 1fr; }
            }

            .project-reference {
                display:grid;
                grid-template-columns:170px minmax(0,1fr) auto;
                gap:2rem;
                align-items:center;
                margin:3.2rem 0;
                padding:1.5rem 1.7rem!important;
                border:1px solid var(--line)!important;
                border-radius:18px;
                background:var(--pale);
            }
            .project-reference h2{margin:0 0 .35rem;color:var(--ink);font-family:Georgia,serif;font-size:1.55rem}
            .project-reference p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.55}
            .project-reference>a{padding:.6rem .9rem;border:1px solid #cddddd!important;border-radius:999px;color:#286b76!important;font-size:.72rem;font-weight:900;text-decoration:none;white-space:nowrap}
            .project-reference>a:hover{border-color:#7fa7ad!important;background:#fff;color:#235e68!important}
            @media(max-width:760px){.project-reference{grid-template-columns:1fr;gap:.65rem}.project-reference>a{justify-self:start;white-space:normal}}
.project-reference-links { display: flex; flex-direction: column; gap: .5rem; align-items: flex-end; }
.project-reference-links a { padding: .6rem .9rem; border: 1px solid #cddddd !important; border-radius: 999px; color: #286b76 !important; font-size: .72rem; font-weight: 900; text-decoration: none; white-space: nowrap; }
.project-reference-links a:hover { border-color: #7fa7ad !important; background: #fff; color: #235e68 !important; }
@media (max-width: 760px) { .project-reference-links { align-items: flex-start; } .project-reference-links a { white-space: normal; } }