
:root {
  --color-green-brand: #7fcd60;
  --color-green-olive: #6e8a3b;
  --color-green-light: #99cc66;
  --color-brown-dark: #48291c;
  --color-brown-body: #5e3827;
  --color-cream: #f3f0e3;
  --color-peach: #f3e2ce;
  --color-orange: #f5a759;
  --color-white: #ffffff;
  --color-blue-bg: #a6c5dd;
  --color-blue-heading: #00659b;
  --color-yellow-placeholder: #fff6bf;
  --color-sage: #e1eada;

  --font-heading: "Comic Relief", cursive;
  --font-body: "Open Sans", sans-serif;
  --container-width: 1080px;
  --header-height: 110px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font-body); color: var(--color-brown-body); background: var(--color-cream); overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
.container { width: 100%; max-width: var(--container-width); margin: 0 auto; padding: 0 20px; position: relative; }

@media (max-width: 1100px) {
  .container{ width: 450px; }
}

.loader { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: var(--color-green-brand); transition: opacity 0.6s ease, visibility 0.6s ease; }
.loader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.loader__logo { display: flex; align-items: center; gap: 20px; animation: loader-pulse 1.6s ease-in-out infinite; }
.loader__sun { width: 100%; max-width: 410px; }
.loader__wordmark { font-family: var(--font-heading); font-size: 44px; color: var(--color-brown-dark); line-height: 1; }
.loader__tagline { font-family: var(--font-body); font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-brown-dark); margin-top: 6px; }

@keyframes loader-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.05); opacity: 0.85; }
}


.site-header { background: var(--color-green-brand); height: var(--header-height); display: flex; align-items: center; position: fixed; width: 100%; z-index: 100; box-shadow: 0 10px 10px #00000021; top: 0; }
.site-header .container { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.site-nav { display: flex; align-items: center; gap: 28px; }
.site-nav--left { flex: 1; }
.site-nav--right { flex: 1; justify-content: flex-end; }
.site-nav__icon { width: 34px; height: 34px; border: 2px solid var(--color-brown-dark); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.site-nav a { font-size: 20px; color: var(--color-brown-dark); transition: opacity 0.2s ease; }
.site-nav a:hover { color: var(--color-cream); } .site-nav a.is-active { color: var(--color-cream); }
.site-nav__cta { text-decoration: underline; } .site-logo { display: flex; align-items: center; gap: 10px; }
.site-logo__sun { width: 300px; flex-shrink: 0; } .site-logo__text { display: flex; flex-direction: column; }
.site-logo__wordmark { font-family: var(--font-heading); font-size: 26px; color: var(--color-brown-dark); line-height: 1; }
.site-logo__tagline { font-size: 10px; letter-spacing: 0.04em; color: var(--color-brown-dark); line-height: 1.3; margin-top: 2px; }

.nav-toggle { display: none; width: 32px; height: 24px; flex-direction: column; justify-content: space-between; background: none; border: none; cursor: pointer; padding: 0; }
.nav-toggle span { display: block; height: 3px; border-radius: 2px; background: var(--color-brown-dark); }


.sticky-quote { position: relative; background: var(--color-white); padding: 26px 24px 22px; max-width: 300px; transform: rotate(3deg); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12); font-family: var(--font-heading); font-style: italic; font-size: 15px; line-height: 1.5; color: var(--color-brown-dark); text-align: center; }
.sticky-quote::before { content: ""; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); width: 16px; height: 16px; background: var(--color-green-olive); border-radius: 50%; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); }
.sticky-quote__author { display: block; margin-top: 10px; font-style: italic; }

.section { position: relative; padding: 90px 0; background: var(--color-cream); overflow: hidden; } .section--white { background: var(--color-white); padding: 60px 0; }
.section__blob { position: absolute; top: -10%; left: 5%; width: 60%; height: 90%; background: var(--color-peach); filter: blur(60px); border-radius: 50%; opacity: 0.7; z-index: 0; }
.section > .container { position: relative; z-index: 1; } .eyebrow { font-family: var(--font-heading); font-size: 36px; color: var(--color-green-light); margin: 0; font-style: italic; letter-spacing: 4px; }
.heading-lg { font-family: var(--font-heading); font-size: 48px; color: var(--color-green-olive); margin: 0; letter-spacing: 10px; } .tagline { font-family: var(--font-body); font-weight: 700; font-style: italic; font-size: 30px; color: var(--color-green-light); margin: 0 0 24px; letter-spacing: 2px; }

@media (max-width: 1100px) {
  .site-header { height: auto; padding: 20px 0; }
  .site-header .container { flex-wrap: wrap; width: 500px; }
  .nav-toggle { display: flex; order: 2; }
  .site-logo { order: 1; }
  .site-nav--left, .site-nav--right { order: 3; flex-basis: 100%; flex-direction: column; align-items: flex-start; gap: 16px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease, margin 0.3s ease; margin-top: 0; }
  .site-header.is-open .site-nav--left, .site-header.is-open .site-nav--right { max-height: 300px; margin-top: 24px; }
  .heading-lg { font-size: 34px; }
}



.wave {display: block;width: 100%;height: 70px;margin-bottom: -1px;}

@media (max-width: 1100px) {
  .wave {height: 40px;}
}



.photo-blob { border-radius: 42% 58% 61% 39% / 45% 40% 60% 55%; overflow: hidden; aspect-ratio: 1; } .photo-blob img { width: 100%; height: 100%; object-fit: cover; }

/* Texto só para leitores de tela (usado pelo WordPress na paginação e navegação) */
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
