/*
Theme Name: Climate Nobel Prize WordPress Edition
Description: HTML-Übernahme mit SCF-Feldern für alle sichtbaren Seitentexte.
Version: 0.9.6
Requires PHP: 7.4
*/

.climate-rich-paragraph { margin-bottom: 1rem; }
.climate-rich-paragraph > p:last-child { margin-bottom: 0; }

/* Optional SCF colors; original sections retain their existing styles. */
.section.climate-background-white { background-color: #fff !important; }
.section.climate-background-beige { background-color: #F0F0EB !important; }
.sec-ecosia.climate-background-white .bg-white { background-color: #fff !important; }
.sec-ecosia.climate-background-beige .bg-white { background-color: #F0F0EB !important; }
.sec-key-principles.climate-cards-white .key-principles-block--img { background-color: #fff; }
.sec-key-principles.climate-cards-beige .key-principles-block--img { background-color: #F0F0EB; }

.home-hero.climate-hero-white { background-color: #fff; }
.home-hero.climate-hero-beige { background-color: #F0F0EB; }

/* Ecosia uses an outer wrapper instead of the shared section class. */
.sec-ecosia.climate-background-white,
.sec-ecosia.climate-background-white .section { background-color: #fff !important; }
.sec-ecosia.climate-background-beige,
.sec-ecosia.climate-background-beige .section { background-color: #F0F0EB !important; }

/* Vario reuses .section, .container, .heading, .lead and original button styles. */
.sec-vario.climate-background-green { background-color: #A4D24F !important; }
.sec-vario.climate-vario-color-green { color: #275243; }
.sec-vario.climate-vario-color-gray { color: #333; }
.sec-vario.climate-vario-color-white { color: #fff; }
.climate-vario-grid { display: grid; gap: 3rem; align-items: center; }
.climate-vario-layout-text .climate-vario-grid,
.climate-vario-layout-above .climate-vario-grid,
.climate-vario-layout-below .climate-vario-grid { width: 100%; max-width: 66.666667%; margin-inline: auto; }
.climate-vario-align-center { text-align: center; }
.climate-vario-align-left { text-align: left; }
.climate-vario-outline { -webkit-text-stroke: 1px currentColor; -webkit-text-fill-color: transparent; }
.climate-vario-body { hyphens: auto; overflow-wrap: break-word; }
.climate-vario-media { min-width: 0; }
.climate-vario-media img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: 0.5rem 0.5rem 0.75rem 0 rgba(0,0,0,0.15); }
.climate-vario-video { aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1); }
.climate-vario-video iframe { display: block; width: 100%; height: 100%; border: 0; }
.climate-vario-layout-above .climate-vario-media { grid-row: 1; }
@media (min-width: 992px) {
    .climate-vario-layout-left .climate-vario-grid,
    .climate-vario-layout-right .climate-vario-grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .climate-vario-layout-left .climate-vario-media { grid-column: 1; grid-row: 1; }
    .climate-vario-layout-left .climate-vario-content { grid-column: 2; grid-row: 1; }
    .climate-vario-columns-two { column-count: 2; column-gap: 3rem; column-fill: balance; text-align: left; }
    .climate-vario-columns-two p { orphans: 3; widows: 3; }
    .climate-vario-columns-two li { break-inside: avoid; }
}
@media (max-width: 991px) {
    .climate-vario-layout-text .climate-vario-grid,
    .climate-vario-layout-above .climate-vario-grid,
    .climate-vario-layout-below .climate-vario-grid { max-width: 100%; }
    .climate-vario-layout-left .climate-vario-media { grid-row: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .sec-vario [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

.climate-vario-align-right { text-align: right; }
.sec-vario .climate-vario-body { text-align: inherit; }

/* Vario body matches the site's standard 16px text. */
.sec-vario .climate-vario-body { font-size: 16px; font-weight: 500; }
.climate-vario-media.climate-image-align-left { text-align: left; }
.climate-vario-media.climate-image-align-center { text-align: center; }
.climate-vario-media.climate-image-align-right { text-align: right; }
.climate-vario-media.climate-image-valign-top { align-self: start; }
.climate-vario-media.climate-image-valign-center { align-self: center; }
.climate-vario-media.climate-image-valign-bottom { align-self: end; }
.climate-vario-image { display: inline-block; max-width: 100%; vertical-align: top; overflow: hidden; border-radius: 16px; box-shadow: 0.5rem 0.5rem 0.75rem 0 rgba(0,0,0,0.15); }
.climate-image-size-small { width: 40%; }
.climate-image-size-medium { width: 70%; }
.climate-image-size-big { width: 100%; }
.climate-image-size-original { width: fit-content; }
.climate-vario-image img { max-width: 100%; width: 100%; height: auto; border-radius: 0; box-shadow: none; }
.climate-image-size-original img { width: auto; }
.climate-image-ratio-square { aspect-ratio: 1 / 1; }
.climate-image-ratio-landscape { aspect-ratio: 16 / 9; }
.climate-image-ratio-portrait { aspect-ratio: 3 / 4; }
.climate-vario-image:not(.climate-image-ratio-original) img { width: 100%; height: 100%; object-fit: cover; }
.climate-image-shape-round { border-radius: 50%; }
.climate-image-focus-center img { object-position: center; }
.climate-image-focus-top img { object-position: center top; }
.climate-image-focus-bottom img { object-position: center bottom; }
.climate-image-focus-left img { object-position: left center; }
.climate-image-focus-right img { object-position: right center; }

.footer.climate-footer-white { background-color: #fff; }
.footer.climate-footer-beige { background-color: #F0F0EB; }
.sec-faq.climate-faq-cards-white .accordion-item { background-color: #fff; }
.sec-faq.climate-faq-cards-beige .accordion-item { background-color: #F0F0EB; }

/* Standard navigation links turn gray only on hover. */
.navbar#mainNav .navbar-nav .nav-item:not(.nav-btn) .nav-link,
.navbar#mainNav .navbar-nav .nav-item:not(.nav-btn) .nav-link.active { color: #275243; }
.navbar#mainNav .navbar-nav .nav-item:not(.nav-btn) .nav-link:hover { color: #666; }

.sec-vario { --climate-section-padding: 7rem; }
@media (max-width: 767px) { .sec-vario { --climate-section-padding: 4rem; } }
.sec-vario.climate-vario-top-1 { padding-top: calc(var(--climate-section-padding) * 1); }
.sec-vario.climate-vario-top-2 { padding-top: calc(var(--climate-section-padding) * 2); }
.sec-vario.climate-vario-top-3 { padding-top: calc(var(--climate-section-padding) * 3); }
.sec-vario.climate-vario-top-4 { padding-top: calc(var(--climate-section-padding) * 4); }
.sec-vario.climate-vario-bottom-1 { padding-bottom: calc(var(--climate-section-padding) * 1); }
.sec-vario.climate-vario-bottom-2 { padding-bottom: calc(var(--climate-section-padding) * 2); }
.sec-vario.climate-vario-bottom-3 { padding-bottom: calc(var(--climate-section-padding) * 3); }
.sec-vario.climate-vario-bottom-4 { padding-bottom: calc(var(--climate-section-padding) * 4); }
