/* EcoDNA Blomer — layout e componentes */

html {
  scroll-behavior: smooth;
  overflow-x: clip;
  background-color: var(--bg-page);
  background-image:
    linear-gradient(to bottom, #ffffff 0%, #ffffff 72px, rgba(255, 255, 255, 0) 240px),
    linear-gradient(to bottom, rgba(251, 249, 244, 0) 0%, rgba(251, 249, 244, 0) 62%, var(--bg-page) 100%),
    url("https://ecodna.com.br/wp-content/uploads/2026/10/ecodna-fundo-bege-limpo-scaled.webp");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100vw 280px, 100vw 58vw, 100vw auto;
}
body.eco-body {
  position: relative;
  margin: 0;
  background: transparent;
  color: var(--fg-1);
  font: 400 var(--text-base) / var(--lh-body) var(--font-body);
  -webkit-font-smoothing: antialiased;
}
body.eco-body--hero { background: var(--eco-forest-900); }
a { color: var(--fg-brand); text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font-family: inherit; }
:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }

.screen-reader-text,
.eco-skip {
  position: absolute;
  left: -9999px;
  top: 0;
}
.eco-skip:focus {
  left: 16px;
  top: 16px;
  z-index: 100;
  background: #fff;
  padding: 10px 16px;
  border-radius: var(--radius-pill);
}

.eco-wrap {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}

/* Botões */
.eco-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: var(--radius-pill);
  font-weight: 600;
  font-family: var(--font-body);
  cursor: pointer;
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  white-space: nowrap;
  box-sizing: border-box;
}
.eco-btn--sm { padding: 8px 16px; font-size: 14px; }
.eco-btn--md { padding: 12px 24px; font-size: 16px; }
.eco-btn--lg { padding: 16px 32px; font-size: 18px; }
.eco-btn--accent { background: var(--action-accent); color: var(--eco-ink-900); border: 1px solid var(--action-accent); }
.eco-btn--accent:hover { background: var(--action-accent-hover); }
.eco-btn--primary { background: var(--action-primary); color: var(--fg-on-dark); border: 1px solid var(--action-primary); }
.eco-btn--primary:hover { background: var(--action-primary-hover); }
.eco-btn--secondary { background: transparent; color: var(--fg-brand); border: 1.5px solid var(--eco-forest-700); }
.eco-btn--secondary:hover { background: var(--eco-leaf-100); }
.eco-btn:disabled { opacity: .45; cursor: not-allowed; }

.eco-icon { display: block; flex-shrink: 0; }

/* Header */
.eco-header {
  border-bottom: 1px solid var(--border-1);
  background: transparent;
}
.eco-header__bar {
  max-width: var(--container);
  margin: 0 auto;
  padding: 14px 32px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
}
.eco-logo { display: flex; flex-shrink: 0; text-decoration: none; }
.eco-logo img {
  height: 84px;
  width: auto;
}
.eco-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  font: 600 16px / 1 var(--font-display);
  letter-spacing: .04em;
  text-transform: uppercase;
}
.eco-nav__link {
  padding: 10px 16px;
  border-radius: 999px;
  color: var(--eco-forest-800);
  white-space: nowrap;
  transition: background 160ms, color 160ms;
}
.eco-nav__link:hover,
.eco-nav__link.is-active {
  background: var(--eco-forest-700);
  color: var(--eco-paper-50);
}
.eco-nav__link.is-active:not(:hover) {
  background: var(--eco-leaf-100);
  color: var(--eco-forest-700);
}
.eco-header__cta { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.eco-quote-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 999px;
  background: var(--eco-leaf-100);
  color: var(--eco-forest-700);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}
.eco-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 1.5px solid var(--eco-forest-700);
  border-radius: 999px;
  background: transparent;
  color: var(--eco-forest-700);
  cursor: pointer;
  align-items: center;
  justify-content: center;
}

/* Personas compactas (home) */
.eco-personas-mini {
  border-bottom: 1px solid var(--border-1);
}
.eco-personas-mini__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 6px 32px;
  display: flex;
  align-items: center;
  gap: 2px 4px;
  flex-wrap: wrap;
}
.eco-personas-mini__label {
  font: 700 10px / 1 var(--font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eco-title);
  padding-right: 10px;
}
.eco-personas-mini a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--eco-title);
  font: 700 11px / 1 var(--font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 160ms;
}
.eco-personas-mini a:hover,
.eco-personas-mini a.is-active {
  background: transparent;
  color: var(--eco-title);
}

/* Personas cards (páginas de solução / LPs) */
.eco-personas {
  background: var(--eco-title);
  border-bottom: 1px solid var(--eco-title);
  color: #fff;
}
.eco-personas__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 20px 32px 24px;
}
.eco-personas__top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.eco-personas__eyebrow {
  font: 600 12px / 1 var(--font-body);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--eco-title-on-green);
}
.eco-personas__top a {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}
.eco-personas__top a:hover { color: var(--eco-title-on-green); }
.eco-personas__grid {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.eco-personas__grid::-webkit-scrollbar { display: none; }
.eco-personas__card {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  width: auto;
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  color: var(--eco-title);
  border: 1.5px solid transparent;
  white-space: nowrap;
  scroll-snap-align: start;
  font: 600 15px / 1.2 var(--font-body);
  transition: transform 160ms, box-shadow 160ms, border-color 160ms, background 160ms, color 160ms;
}
.eco-personas__icon {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--eco-leaf-100);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.eco-personas__card.is-active {
  background: var(--eco-lime-500);
  color: var(--eco-title);
  border-color: var(--eco-lime-500);
}
.eco-personas__card.is-active .eco-personas__icon {
  background: var(--eco-title);
  color: #fff;
}
.eco-personas__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -10px rgba(20, 35, 27, .25);
  border-color: var(--eco-lime-500);
}

@media (hover: hover) and (pointer: fine) {
  .eco-personas:is(:hover, :focus-within) .eco-personas__inner {
    padding-top: 20px;
    padding-bottom: 24px;
  }
  .eco-personas:is(:hover, :focus-within) .eco-personas__grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(128px, 1fr));
    gap: 12px;
    overflow: visible;
  }
  .eco-personas:is(:hover, :focus-within) .eco-personas__card {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 16px;
    border-radius: 16px;
    white-space: normal;
  }
  .eco-personas:is(:hover, :focus-within) .eco-personas__icon {
    width: 40px;
    height: 40px;
  }
}

/* Tipografia de página */
.eco-eyebrow {
  font: 600 12px / 1 var(--font-body);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--eco-leaf-500);
  margin-bottom: 20px;
}
.eco-h1 {
  margin: 0;
  font: 600 clamp(40px, 5.4vw, 68px) / 1.05 var(--font-display);
  letter-spacing: -.03em;
  color: var(--eco-title);
}
.eco-h2 {
  margin: 0;
  font: 600 clamp(32px, 4vw, 48px) / 1.1 var(--font-display);
  letter-spacing: -.025em;
  color: var(--eco-title);
}
.eco-h3 {
  margin: 0;
  font: 600 22px / 1.25 var(--font-display);
  color: var(--eco-title);
}
.eco-lead { margin: 24px 0 0; font-size: 18px; line-height: 1.6; color: var(--eco-title); max-width: 560px; }
p.eco-lead { color: var(--eco-title); }
.eco-lead--lg { font-size: 19px; }

/* Seções */
.eco-section { padding: 80px 0 96px; }
.eco-section--tight { padding: 96px 0; }
.eco-split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 56px;
  align-items: center;
}
.eco-media { border-radius: 32px; overflow: hidden; }
.eco-media--sq { aspect-ratio: 1 / 1; }
.eco-media--43 { aspect-ratio: 4 / 3; border-radius: 24px; }
.eco-media--45 { aspect-ratio: 4 / 5; }
.eco-media img { width: 100%; height: 100%; object-fit: cover; }

.eco-band { background: var(--eco-kraft-200); padding: 88px 0; }
.eco-band--arara {
  background-color: var(--eco-kraft-200);
  background-image: url("https://ecodna.com.br/wp-content/uploads/2026/10/ecodna-arara-scaled.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.eco-band--arara .eco-split {
  grid-template-columns: repeat(auto-fit, minmax(280px, 34%));
  justify-content: space-between;
  align-items: center;
  gap: 32px;
}
@media (max-width: 720px) {
  .eco-band--arara .eco-split {
    grid-template-columns: 1fr;
    background: rgba(244, 184, 88, 0.86);
    border-radius: 20px;
    padding: 8px 4px;
  }
}
.eco-band--dark { background: var(--eco-forest-800); color: var(--eco-paper-50); padding: 96px 0; }
.eco-band--dark .eco-h2 { color: var(--eco-title-on-green); }
.eco-band--lime { background: var(--eco-lime-500); padding: 88px 0; text-align: center; }
.eco-band--lime .eco-h2 { color: var(--eco-title); }
.eco-cta-art { display: block; width: min(220px, 70%); height: auto; margin: 0 auto 28px; }
.eco-cta-copy { margin: 0 0 32px; font-size: 19px; line-height: 1.55; color: var(--eco-title); }

.eco-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 36px; }

/* Cards */
.eco-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
}
.eco-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 28px;
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 20px;
  box-shadow: var(--shadow-sm);
  color: inherit;
  transition: box-shadow 160ms, border-color 160ms, transform 200ms;
}
.eco-card:hover { box-shadow: var(--shadow-md); border-color: var(--eco-leaf-400); }
.eco-card p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--fg-2); flex: 1; }
.eco-card__cta { font-size: 14px; font-weight: 600; color: var(--fg-brand); }

.eco-card--photo {
  padding: 0;
  overflow: hidden;
  border-radius: 24px;
  gap: 0;
}
.eco-card--photo .eco-card__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.eco-card--photo .eco-card__media img { width: 100%; height: 100%; object-fit: cover; }
.eco-card--photo .eco-card__badge {
  position: absolute;
  left: 16px;
  bottom: 16px;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--eco-lime-500);
  display: grid;
  place-items: center;
}
.eco-card--photo .eco-card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}
.eco-card--photo:hover { transform: translateY(-4px); }

.eco-product-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  color: inherit;
  text-decoration: none;
}
.eco-product-card:hover { box-shadow: var(--shadow-md); }
.eco-product-card__img { aspect-ratio: 4 / 5; overflow: hidden; position: relative; }
.eco-product-card__img img { width: 100%; height: 100%; object-fit: cover; }
.eco-product-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--eco-lime-500);
  color: var(--eco-forest-900);
  font-size: 12px;
  font-weight: 600;
}
.eco-product-card__body { padding: 20px; }
.eco-product-card__body h3 { margin: 0 0 4px; font: 600 20px / 1.25 var(--font-display); color: var(--eco-title); }
.eco-product-card__note { font-size: 14px; color: var(--fg-3); margin-bottom: 12px; }

.eco-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 24px;
}

/* Carrossel */
.eco-carousel__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}
.eco-carousel__nav { display: flex; gap: 8px; }
.eco-icon-btn {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  border: 1.5px solid var(--eco-forest-700);
  background: transparent;
  color: var(--eco-forest-700);
  font-size: 20px;
  cursor: pointer;
}
.eco-icon-btn--solid { background: var(--eco-forest-700); color: #fff; }
.eco-icon-btn:hover { background: var(--eco-leaf-100); }
.eco-icon-btn--solid:hover { background: var(--eco-forest-800); }
.eco-carousel__track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: 4px;
}
.eco-carousel__track::-webkit-scrollbar { display: none; }
.eco-carousel__track .eco-product-card {
  flex: 0 0 clamp(220px, 26%, 280px);
  scroll-snap-align: start;
}

/* Passos */
.eco-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 40px;
}
.eco-step { border-top: 2px solid var(--eco-forest-700); padding-top: 20px; }
.eco-step__n { font: 600 48px / 1 var(--font-display); color: var(--eco-leaf-500); margin-bottom: 16px; }
.eco-step p { margin: 8px 0 0; font-size: 16px; line-height: 1.6; color: var(--fg-2); }

.eco-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.eco-list li {
  display: flex;
  gap: 16px;
  align-items: baseline;
  padding: 16px 0;
  border-top: 1px solid var(--border-2);
  font-size: 18px; line-height: 1.45;
}
.eco-list li:last-child { border-bottom: 1px solid var(--border-2); }
.eco-dot {
  width: 10px; height: 10px; border-radius: 999px;
  background: var(--eco-leaf-500); flex-shrink: 0;
}

.eco-panel {
  background: var(--eco-leaf-100);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 48px);
}
.eco-dark-box {
  background: var(--eco-forest-800);
  color: var(--eco-paper-50);
  border-radius: 32px;
  padding: clamp(32px, 5vw, 64px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 48px;
}
.eco-dark-box .eco-h2 { color: var(--eco-title-on-green); }
.eco-muted { color: var(--eco-leaf-200); font-size: 18px; line-height: 1.6; }

.eco-process {
  background: var(--eco-forest-800);
  color: var(--eco-paper-50);
  padding: 80px 0;
}
.eco-process__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 32px;
}
.eco-process__item { display: flex; flex-direction: column; gap: 14px; }
.eco-process__icon {
  width: 52px; height: 52px; border-radius: 999px;
  background: var(--eco-lime-500); display: grid; place-items: center;
}
.eco-process__item p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--eco-leaf-200); }
.eco-process__item .eco-h3 { color: var(--eco-title-on-green); font-size: 22px; }

/* Breadcrumbs */
.eco-crumbs { font-size: 14px; color: var(--fg-3); margin-bottom: 28px; }
.eco-crumbs a { color: var(--fg-3); }
.eco-crumbs span { color: var(--fg-1); }

.eco-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 40px; }
.eco-tabs a,
.eco-tabs button {
  padding: 8px 16px;
  border-radius: 999px;
  border: 1.5px solid var(--border-2);
  background: transparent;
  color: var(--fg-1);
  font: 500 14px var(--font-body);
  cursor: pointer;
  text-decoration: none;
}
.eco-tabs a.is-active,
.eco-tabs button.is-active {
  border-color: var(--eco-forest-700);
  background: var(--eco-forest-700);
  color: var(--eco-paper-50);
}

/* Depoimentos */
.eco-testimonials {
  background-color: var(--bg-dark);
  background-image: url("https://ecodna.com.br/wp-content/uploads/2026/10/ecodna-fundo-verde-scaled.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: var(--fg-on-dark);
  padding: 88px 0;
}
.eco-testimonials__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}
.eco-testimonials .eco-h2 { color: var(--eco-title-on-green); text-align: center; }
.eco-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  width: 100%;
}
.eco-quote {
  margin: 0;
  border: 1px solid var(--eco-forest-600);
  border-radius: var(--radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 28px;
  text-align: center;
}
.eco-quote blockquote { margin: 0; font-size: 18px; line-height: 1.65; }
.eco-quote figcaption { display: flex; align-items: center; justify-content: center; gap: 14px; }
.eco-quote img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.eco-quote span { font: 500 20px var(--font-display); }

/* Lead capture — medidas do componente original */
section.eco-lead {
  max-width: none;
  width: 100%;
  margin: 0;
  box-sizing: border-box;
  background: var(--eco-leaf-100);
  color: var(--fg-1);
  border-radius: var(--radius-xl);
  padding: clamp(28px, 5vw, 56px);
  font-size: 16px;
  line-height: 1.5;
}
section.eco-lead.eco-lead--footer,
section.eco-lead.eco-lead--popup {
  background: transparent;
  padding: 0;
  border-radius: 0;
}
section.eco-lead.eco-lead--footer { color: var(--eco-paper-50); }
section.eco-lead h2 {
  margin: 0;
  font: 600 clamp(28px, 3.4vw, 40px) / 1.1 var(--font-display);
  letter-spacing: -.02em;
  color: var(--eco-title);
}
.eco-lead--footer h2 { font-size: 24px; color: var(--eco-paper-50); }
.eco-lead p.eco-lead__text { margin: 10px 0 0; font-size: 17px; line-height: 1.55; opacity: .85; max-width: 600px; }
.eco-lead__step { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; font-size: 13px; font-weight: 600; color: var(--eco-forest-700); }
.eco-lead__bar { flex: 1; height: 4px; border-radius: 99px; background: var(--eco-leaf-200); overflow: hidden; }
.eco-lead__bar > span { display: block; height: 100%; background: var(--eco-forest-700); }
.eco-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.eco-chips--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.eco-chip {
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  border: 1.5px solid var(--border-2);
  background: #fff;
  color: var(--fg-1);
  cursor: pointer;
  font-family: var(--font-body);
}
.eco-chip.is-on { border-color: var(--eco-forest-700); background: var(--eco-forest-700); color: var(--fg-on-dark); }
.eco-chip__n { font: 600 12px var(--font-body); letter-spacing: .1em; opacity: .65; display: flex; justify-content: space-between; align-items: center; }
.eco-chip__icon {
  width: 40px; height: 40px; border-radius: 12px;
  background: var(--eco-leaf-100); display: grid; place-items: center;
}
.eco-chip.is-on .eco-chip__icon { background: var(--eco-lime-500); }
.eco-chip strong { font: 600 17px / 1.2 var(--font-display); }
.eco-chip small { font-size: 13px; line-height: 1.4; opacity: .8; }

.eco-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 16px;
  align-items: start;
  width: 100%;
}
.eco-form-grid--compact { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
.eco-form-grid--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.eco-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; max-width: 100%; }
.eco-field span { font-size: 14px; font-weight: 600; color: var(--fg-1); }
.eco-field input,
.eco-field select,
.eco-field textarea {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  height: 48px;
  padding: 12px 16px;
  border: 1.5px solid var(--border-2);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--fg-1);
  font-size: 16px;
  line-height: 1.25;
}
.eco-field select { padding-right: 44px; }
.eco-field textarea { height: auto; min-height: 120px; resize: vertical; }
.eco-field .eco-error { color: var(--eco-danger); font-size: 12px; }
.eco-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.eco-form-actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; justify-content: space-between; grid-column: 1 / -1; }

.eco-dialog {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: rgba(16, 41, 31, .6);
  display: none;
  place-items: center;
  padding: 24px;
}
.eco-dialog.is-open { display: grid; }
.eco-dialog__box {
  position: relative;
  width: 100%;
  max-width: 860px;
  background: var(--bg-page);
  color: var(--fg-1);
  border-radius: var(--radius-xl);
  padding: 40px;
  box-shadow: var(--shadow-lg);
  max-height: 90vh;
  overflow: auto;
}
.eco-dialog__close {
  position: absolute;
  top: 16px; right: 16px;
  width: 40px; height: 40px;
  border-radius: 999px;
  border: 1px solid var(--border-2);
  background: #fff;
  font-size: 18px;
  cursor: pointer;
}

.eco-launcher {
  position: fixed;
  right: 24px; bottom: 24px;
  z-index: 40;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 22px 14px 16px;
  border-radius: 999px;
  border: 0;
  background: var(--action-accent);
  color: var(--eco-ink-900);
  font: 600 15px var(--font-body);
  cursor: pointer;
  box-shadow: var(--shadow-lg);
  white-space: nowrap;
}
.eco-launcher:hover { background: var(--action-accent-hover); }
.eco-launcher__icon {
  width: 36px; height: 36px; border-radius: 999px;
  background: var(--eco-forest-800);
  display: grid; place-items: center;
}

/* Footer */
.eco-footer {
  background-color: var(--eco-forest-900);
  background-image: url("https://ecodna.com.br/wp-content/uploads/2026/10/ecodna-fundo-verde-scaled.webp");
  background-repeat: no-repeat;
  background-position: center 92%;
  background-size: 155% auto;
  color: var(--eco-leaf-200);
  padding: 56px 0 40px;
}
.eco-footer__grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 40px;
}
.eco-footer__brand { font: 600 24px var(--font-display); color: var(--eco-title-on-green); letter-spacing: -.02em; margin-bottom: 12px; }
.eco-footer__mark { display: block; width: 120px; height: auto; margin-top: 20px; }
.eco-footer__label {
  font: 600 12px / 1 var(--font-body);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--eco-lime-500);
  margin-bottom: 16px;
}
.eco-footer__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.eco-footer__list a { color: #fff; }
.eco-footer__list a:hover { color: #fff; }
.eco-footer__credit {
  max-width: var(--container);
  margin: 32px auto 0;
  padding: 22px 16px 0;
  border-top: 1px solid var(--eco-forest-600);
  display: flex;
  justify-content: center;
}
.eco-footer__credit a {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  color: #fff;
  font: 500 16px / 1 var(--font-body);
}
.eco-nextmodal {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  background: #1B7A34;
  color: #fff;
  font: 700 11px / 1 var(--font-body);
  letter-spacing: .04em;
}

/* Clientes */
.eco-clients {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-top: 32px;
}
.eco-client {
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 16px;
  min-height: 88px;
  display: grid;
  place-items: center;
  padding: 16px;
  text-align: center;
}
.eco-client img {
  width: auto;
  max-width: 140px;
  max-height: 48px;
  height: auto;
  object-fit: contain;
}

.eco-cases {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  margin-top: 32px;
}

/* Produto */
.eco-product { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 56px; align-items: start; }
.eco-gallery__main { aspect-ratio: 1 / 1; border-radius: 24px; overflow: hidden; background: var(--eco-paper-100); }
.eco-gallery__main img { width: 100%; height: 100%; object-fit: cover; }
.eco-gallery__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 16px; }
.eco-gallery__thumbs button {
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  border: 2px solid transparent;
  overflow: hidden;
  background: var(--eco-paper-100);
  cursor: pointer;
  padding: 0;
}
.eco-gallery__thumbs button.is-on { border-color: var(--eco-forest-700); }
.eco-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.eco-spec { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 0 24px; font-size: 15px; }
.eco-spec dt, .eco-spec dd { margin: 0; padding: 12px 0; border-top: 1px solid var(--border-2); }
.eco-spec dt { color: var(--fg-3); }
.eco-qty {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--border-2);
  border-radius: 999px;
  overflow: hidden;
}
.eco-qty button { width: 44px; height: 52px; border: 0; background: transparent; font-size: 18px; cursor: pointer; }
.eco-qty span { min-width: 64px; text-align: center; font-weight: 600; }
.eco-tag {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--eco-leaf-100);
  color: var(--eco-forest-700);
  font-size: 12px;
  font-weight: 600;
}

/* Cotação */
.eco-quote-steps { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; font-size: 14px; font-weight: 600; }
.eco-quote-steps span {
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--eco-leaf-100);
  color: var(--eco-forest-700);
}
.eco-quote-steps span.is-on { background: var(--eco-forest-700); color: var(--eco-paper-50); }
.eco-cart-line {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px;
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 20px;
  box-shadow: var(--shadow-sm);
}
.eco-cart-line img { width: 96px; height: 96px; object-fit: cover; border-radius: 12px; }
.eco-aside {
  background: var(--eco-kraft-200);
  border-radius: 20px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.woocommerce-Price-amount,
.price,
.amount { display: none !important; }

/* Blog */
.eco-blog-hero { max-width: var(--container); margin: 0 auto; padding: 72px 32px 32px; }
.eco-posts { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.eco-post-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 24px;
  overflow: hidden;
  color: inherit;
}
.eco-post-card:hover { box-shadow: var(--shadow-md); border-color: var(--eco-leaf-400); }
.eco-post-card img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.eco-post-card__body { display: flex; flex-direction: column; gap: 10px; padding: 24px; flex: 1; }
.eco-single { max-width: 1100px; margin: 0 auto; padding: 56px 32px 96px; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px 48px; align-items: start; }
.eco-single--solo { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.eco-single article img.eco-featured { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 24px; margin-top: 28px; }
.eco-prose p { margin: 22px 0 0; font-size: 18px; line-height: 1.7; color: var(--fg-2); max-width: 68ch; }
.eco-aside-products { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 12px; }
.eco-mini {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 16px;
  color: inherit;
}
.eco-mini img { width: 72px; height: 72px; object-fit: cover; border-radius: 12px; }

/* Hero 1 */
.eco-hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  background: var(--eco-forest-900);
  color: var(--eco-paper-50);
  display: flex;
  flex-direction: column;
}
.eco-hero__top {
  position: relative;
  z-index: 3;
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 24px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.eco-hero__logo {
  display: inline-flex;
  background: var(--eco-paper-50);
  border-radius: 999px;
  padding: 8px 22px;
}
.eco-hero__logo img { height: 64px; width: auto; display: block; }
.eco-hero__nav { display: flex; align-items: center; gap: 28px; font-size: 15px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.eco-hero__nav a { color: var(--eco-leaf-200); white-space: nowrap; }
.eco-hero__nav a:hover { color: var(--eco-paper-50); }
.eco-hero__home {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px 8px 10px;
  border-radius: 999px;
  border: 1.5px solid var(--eco-forest-600);
  color: var(--eco-paper-50) !important;
}
.eco-hero__grid {
  position: relative;
  z-index: 2;
  flex: 1;
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 16px 40px 96px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 40px 56px;
  align-items: center;
}
.eco-hero h1 {
  margin: 22px 0 0;
  font: 600 clamp(44px, 5.8vw, 92px) / 1 var(--font-display);
  letter-spacing: -.035em;
  color: var(--eco-title-on-green);
}
.eco-hero__slot {
  margin-top: 18px;
  font: 600 clamp(28px, 3.4vw, 52px) / 1.15 var(--font-display);
  letter-spacing: -.02em;
  display: flex;
  color: var(--eco-leaf-200);
}
.eco-hero__words { display: inline-grid; overflow: hidden; color: var(--eco-lime-500); }
.eco-hero__words span { grid-area: 1 / 1; }
.eco-hero__sub { margin: 6px 0 0; font: 400 clamp(20px, 2vw, 28px) / 1.3 var(--font-body); color: var(--eco-leaf-200); }
.eco-hero__cta { margin-top: 36px; }
.eco-hero__cta-label {
  font: 600 12px / 1 var(--font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eco-leaf-200);
  margin-bottom: 14px;
}
.eco-hero__profiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  max-width: 680px;
}
.eco-hero__profiles a {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  border: 1.5px solid var(--eco-forest-600);
  background: rgba(255, 255, 255, .03);
  color: var(--eco-paper-50);
}
.eco-hero__profiles a:hover { background: var(--eco-forest-700); border-color: var(--eco-lime-500); }
.eco-hero__profiles span.eco-hicon {
  width: 40px; height: 40px; border-radius: 999px;
  background: var(--eco-lime-500); display: grid; place-items: center;
}
.eco-hero-stage { position: relative; min-width: 0; display: grid; place-items: center; padding: 24px 0; }
.eco-hero-card {
  position: relative;
  width: min(100%, 430px);
  aspect-ratio: 4 / 5;
}
.eco-hero-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eco-hero-layer {
  position: absolute;
  inset: 0;
  border-radius: 28px;
  overflow: hidden;
  background: var(--eco-forest-800);
}
.eco-hero-chip {
  position: absolute;
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--eco-paper-50);
  color: var(--eco-forest-900);
  font: 600 14px var(--font-body);
  white-space: nowrap;
  box-shadow: var(--shadow-md);
}
.eco-hero-marquee {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 2;
  border-top: 1px solid var(--eco-forest-600);
  background: var(--eco-forest-900);
  overflow: hidden;
  padding: 18px 0;
}
.eco-hero-marquee__inner {
  display: flex;
  width: 200%;
}
.eco-hero-marquee__inner span.row {
  display: flex;
  width: 50%;
  justify-content: space-around;
  font: 600 15px var(--font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--eco-leaf-200);
  white-space: nowrap;
}

/* Hero 2 */
.eco-hero2 { align-items: center; justify-content: center; text-align: center; }
.eco-hero2__copy {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 24px 56px;
}
.eco-hero2__line {
  font: 600 clamp(28px, 4.4vw, 70px) / 1.05 var(--font-display);
  letter-spacing: -.03em;
  color: var(--eco-title-on-green);
}
.eco-hero2__word {
  position: relative;
  display: grid;
  margin: 0 0 4px;
}
.eco-hero2__word span {
  grid-area: 1 / 1;
  font: 600 clamp(120px, 27vw, 440px) / .92 var(--font-display);
  letter-spacing: -.055em;
  color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  background-size: cover;
  padding: 0 .04em .06em;
}
.eco-hero2__outline {
  -webkit-text-stroke: 2px #C8E26B;
  background: none;
}
.eco-hero2__bar {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: var(--eco-forest-700);
  z-index: 3;
}
.eco-hero2__bar > span { display: block; height: 100%; background: var(--eco-lime-500); }
.eco-hero2__meta {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  padding: 0 40px 22px;
  font: 500 13px var(--font-mono);
  color: var(--eco-leaf-200);
}

.woocommerce-pagination { display: flex; gap: 8px; justify-content: center; margin: 40px 0; list-style: none; padding: 0; }
.woocommerce-pagination .page-numbers {
  min-width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: 999px;
  border: 1px solid var(--border-2);
  color: var(--fg-1);
}
.woocommerce-pagination .page-numbers.current { background: var(--eco-forest-700); color: #fff; border-color: var(--eco-forest-700); }
.eco-pag { display: flex; gap: 8px; justify-content: center; margin: 40px 0; }
.eco-pag a, .eco-pag span {
  min-width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: 999px;
  border: 1px solid var(--border-2);
  color: var(--fg-1);
}
.eco-pag .current { background: var(--eco-forest-700); color: #fff; border-color: var(--eco-forest-700); }

.eco-empty {
  padding: 48px;
  text-align: center;
  background: #fff;
  border: 1px dashed var(--border-2);
  border-radius: 20px;
  color: var(--fg-3);
}

.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
  background: var(--eco-leaf-100);
  border: 0;
  border-radius: 16px;
  padding: 16px 20px;
  color: var(--eco-forest-800);
}

/* Checkout WooCommerce restyle */
.woocommerce form .form-row { margin: 0 0 16px; }
.woocommerce form .form-row label { font-size: 13px; font-weight: 600; color: var(--fg-2); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
  padding: 12px 14px;
  border: 1.5px solid var(--border-2);
  border-radius: 12px;
}
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods { display: none; }
#add_payment_method #payment div.form-row, .woocommerce-cart #payment div.form-row, .woocommerce-checkout #payment div.form-row { padding: 0; }

.eco-qty input.qty {
  width: 64px;
  min-width: 64px;
  border: 0;
  background: transparent;
  text-align: center;
  font-weight: 600;
  font-size: 16px;
  -moz-appearance: textfield;
  appearance: textfield;
}
.eco-qty input.qty::-webkit-outer-spin-button,
.eco-qty input.qty::-webkit-inner-spin-button { appearance: none; margin: 0; }
form.cart.eco-actions { margin-top: 24px; }
.single_add_to_cart_button.button { display: none; }
.eco-btn.single_add_to_cart_button { display: inline-flex; }

.eco-cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
  gap: 32px;
  align-items: start;
}
.eco-cart-line__info { flex: 1; min-width: 180px; }
.eco-cart-line__info h2 { margin: 0; font: 600 20px / 1.25 var(--font-display); color: var(--eco-title); }
.eco-cart-line__meta { font-size: 14px; color: var(--fg-3); margin-top: 4px; }
.eco-cart-line__note { font-size: 13px; color: var(--fg-2); margin-top: 8px; }
.eco-cart-line__remove {
  border: 0;
  background: none;
  color: var(--fg-3);
  font: 500 14px var(--font-body);
  text-decoration: underline;
}
.eco-cart-back { display: inline-block; margin-top: 16px; font-size: 15px; font-weight: 600; }
.eco-aside__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  border-top: 1px solid rgba(20, 35, 27, .15);
  padding-top: 12px;
}
.eco-aside p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--eco-ink-700); }
.eco-aside .eco-btn { width: 100%; }
.eco-box {
  background: #fff;
  border: 1px solid var(--border-1);
  border-radius: 20px;
  padding: 28px;
  margin-bottom: 24px;
}
.eco-box h2 { margin: 0 0 20px; font: 600 22px / 1.25 var(--font-display); color: var(--eco-title); }
.eco-done { max-width: 640px; margin: 48px auto; text-align: center; }
.eco-done__ok {
  width: 72px;
  height: 72px;
  margin: 0 auto 24px;
  border-radius: 999px;
  background: var(--eco-lime-500);
  display: grid;
  place-items: center;
}
.eco-persona-chips {
  display: grid;
  grid-template-columns: repeat(8, minmax(128px, 1fr));
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.eco-persona-chip {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  background: #fff;
  color: var(--fg-1);
  border: 1.5px solid var(--border-1);
  min-width: 128px;
}
.eco-persona-chip:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -10px rgba(20, 35, 27, .25);
  border-color: var(--eco-leaf-400);
}
.eco-persona-chip__icon {
  width: 40px; height: 40px; border-radius: 999px;
  background: var(--eco-leaf-100); display: grid; place-items: center;
}
.eco-persona-chip span:last-child { font: 600 15px / 1.2 var(--font-body); }

.woocommerce-form-coupon-toggle,
.woocommerce-form-login-toggle,
.cart-subtotal,
.order-total,
.tax-rate,
.product-price,
.product-subtotal { display: none !important; }

@media (max-width: 820px) {
  html, body { overflow-x: hidden; }
  .eco-wrap,
  .eco-header__bar,
  .eco-personas-mini__inner,
  .eco-personas__inner,
  .eco-testimonials__inner,
  .eco-footer__grid,
  .eco-blog-hero { padding-left: 16px; padding-right: 16px; }
  .eco-logo img { height: 52px; }
  .eco-menu-toggle { display: inline-flex; margin-left: auto; }
  .eco-nav {
    display: none;
    order: 3;
    flex: 1 0 100%;
    justify-content: space-between;
  }
  .eco-nav.is-open { display: flex; }
  .eco-nav__link { padding: 8px 4px; font-size: 15px; }
  .eco-h1 { font-size: clamp(32px, 9vw, 44px); }
  .eco-split,
  .eco-product { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .eco-hero__profiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .eco-carousel__track .eco-product-card { flex: 0 0 78vw; }
  .eco-hero { overflow-x: hidden; }
  .eco-hero__top { padding: 12px 16px; }
  .eco-hero__logo img { height: 52px; }
  .eco-hero__nav { flex: 1 0 100%; flex-wrap: wrap; gap: 8px 14px; }
  .eco-hero h1 { font-size: clamp(40px, 11vw, 64px); }
  .eco-hero__grid { padding-left: 16px; padding-right: 16px; grid-template-columns: minmax(0, 1fr); }
  .eco-single { grid-template-columns: minmax(0, 1fr); padding-left: 16px; padding-right: 16px; }
  .eco-aside-products { position: static; }
  .eco-launcher { right: 12px; bottom: 12px; max-width: calc(100vw - 24px); }
  .eco-dialog { padding: 12px; align-items: end; }
  .eco-dialog__box { padding: 48px 16px 20px; border-radius: 20px; }
  .eco-footer {
    padding-bottom: 120px;
    background-position: center 90%;
    background-size: auto 150%;
  }
  .eco-btn--lg { width: 100%; white-space: normal; height: auto; }
  .eco-hero2__word span { font-size: min(24vw, 104px); }
  .eco-cart-layout { grid-template-columns: minmax(0, 1fr); }
  .eco-persona-chips { grid-template-columns: repeat(4, minmax(128px, 1fr)); }
}