/* ======================================================================
   BIOEMERGE V3 — Enhanced Styles
   Topographic BG · Dark Mode Fixes · Hero FX · Popup · Cobertura
   ====================================================================== */

/* ---------- CARTOGRAPHIC BACKGROUND ---------- */
.topo-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url('assets/topo-pattern.svg');
  background-size: 600px 600px;
  background-repeat: repeat;
  opacity: 0.04;
}
[data-theme="dark"] .topo-bg {
  opacity: 0.055;
  filter: invert(1) hue-rotate(180deg) brightness(0.5);
}

/* ---------- LEAF PARTICLE CANVAS ---------- */
#leafParticles {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  width: 100vw;
  height: 100vh;
}

/* ======================================================================
   DARK MODE — Contrast & Legibility Fixes
   ====================================================================== */
[data-theme="dark"] {
  --muted: #9da589;
  --line: #334430;
  --line-soft: #283826;
}

/* Card borders — more visible separation */
[data-theme="dark"] .stat,
[data-theme="dark"] .mvv__card,
[data-theme="dark"] .publico,
[data-theme="dark"] .servico,
[data-theme="dark"] .faq__item,
[data-theme="dark"] .chart-card,
[data-theme="dark"] .map-card,
[data-theme="dark"] .etapa,
[data-theme="dark"] .pilar,
[data-theme="dark"] .ods-real__card,
[data-theme="dark"] .meta,
[data-theme="dark"] .blog-card,
[data-theme="dark"] .contato__card,
[data-theme="dark"] .modal__item,
[data-theme="dark"] .timeline-chart,
[data-theme="dark"] .cobertura__dist-chart {
  border-color: rgba(143, 181, 133, 0.14);
}

/* Secondary text — boost contrast */
[data-theme="dark"] .sobre__lead,
[data-theme="dark"] .hero__lead,
[data-theme="dark"] .publico__desc,
[data-theme="dark"] .servico__desc,
[data-theme="dark"] .etapa p,
[data-theme="dark"] .pilar p,
[data-theme="dark"] .blog-card__excerpt,
[data-theme="dark"] .mvv__card p,
[data-theme="dark"] .modal__intro,
[data-theme="dark"] .modal__item p,
[data-theme="dark"] .contato__lead,
[data-theme="dark"] .popup__body p,
[data-theme="dark"] .faq__head p,
[data-theme="dark"] .esg__head p,
[data-theme="dark"] .servicos__head p,
[data-theme="dark"] .blog__head p,
[data-theme="dark"] .meta__label {
  color: #ccc7a8;
}

[data-theme="dark"] .faq__answer {
  color: #bbb6a0;
}

[data-theme="dark"] .publico__list li {
  border-top-color: rgba(143, 181, 133, 0.1);
  color: #b8b3a0;
}

/* Chips and tags */
[data-theme="dark"] .org-chip,
[data-theme="dark"] .mvv__value-chip,
[data-theme="dark"] .servico__tag {
  border-color: rgba(143, 181, 133, 0.15);
  color: #a5ad92;
}

/* Form fields */
[data-theme="dark"] .field input,
[data-theme="dark"] .field select,
[data-theme="dark"] .field textarea {
  border-color: rgba(143, 181, 133, 0.16);
  background: rgba(17, 23, 15, 0.5);
}

/* Service hover fix */
[data-theme="dark"] .servico:hover {
  background: linear-gradient(135deg, #b9d3b0 0%, #8fb585 100%);
  color: #11170f;
}
[data-theme="dark"] .servico:hover .servico__num,
[data-theme="dark"] .servico:hover .servico__desc {
  color: rgba(17, 23, 15, 0.65);
}
[data-theme="dark"] .servico:hover .servico__tag {
  background: rgba(17, 23, 15, 0.12);
  border-color: rgba(17, 23, 15, 0.25);
  color: #11170f;
}
[data-theme="dark"] .servico:hover h3 { color: #11170f; }

/* Popup dark mode */
[data-theme="dark"] .popup {
  border-color: rgba(143, 181, 133, 0.16);
}
[data-theme="dark"] .popup__body h4 { color: var(--ink); }
[data-theme="dark"] .popup__close {
  background: var(--surface-2);
  border: 1px solid var(--line);
}

/* Quote block */
[data-theme="dark"] .mvv__quote {
  background: linear-gradient(135deg, #4a6d48 0%, #3b5a3a 100%);
  color: #ebe7c5;
}

/* Tagline */
[data-theme="dark"] .hero__tagline {
  border-color: rgba(143, 181, 133, 0.16);
}

/* Blog card images */
[data-theme="dark"] .blog-card__media--img img {
  opacity: 0.85;
}

/* ODS lead text on dark gradient */
[data-theme="dark"] .ods__lead { color: rgba(235, 231, 197, 0.85); }
[data-theme="dark"] .ods {
  background: linear-gradient(135deg, #1d3a1c 0%, #2d4a2c 100%);
  color: #ebe7c5;
}
[data-theme="dark"] .ods__title { color: #ebe7c5; }
[data-theme="dark"] .ods .eyebrow { color: rgba(235, 231, 197, 0.6); }
[data-theme="dark"] .ods__cell {
  background: rgba(235, 231, 197, 0.12);
  border-color: rgba(235, 231, 197, 0.2);
  color: #ebe7c5;
}

/* Article CTA box — dark mode fix */
[data-theme="dark"] .article__cta-box {
  background: linear-gradient(135deg, #1d3a1c 0%, #2d4a2c 100%);
  color: #ebe7c5;
}
[data-theme="dark"] .article__cta-box h3 { color: #ebe7c5; }
[data-theme="dark"] .article__cta-box p { color: rgba(235, 231, 197, 0.8); }
[data-theme="dark"] .article__cta-box .btn {
  background: #ebe7c5;
  color: #1d3a1c;
}

/* Contato WhatsApp card — dark mode fix */
[data-theme="dark"] .contato__card--whatsapp {
  background: linear-gradient(135deg, #2d4a2c 0%, #3b5a3a 100%);
  color: #ebe7c5;
  border-color: rgba(143, 181, 133, 0.2);
}
[data-theme="dark"] .contato__card--whatsapp .contato__card-label { color: rgba(235, 231, 197, 0.65); }
[data-theme="dark"] .contato__card--whatsapp .contato__card-value { color: #ebe7c5; }
[data-theme="dark"] .contato__card--whatsapp .contato__card-action { color: #ebe7c5; }
[data-theme="dark"] .contato__card--whatsapp .contato__card-icon {
  background: rgba(235, 231, 197, 0.12);
  border-color: rgba(235, 231, 197, 0.2);
  color: #ebe7c5;
}

/* Contato section heading in dark mode */
[data-theme="dark"] .contato h2 { color: var(--ink); }
[data-theme="dark"] .contato__lead { color: #ccc7a8; }
[data-theme="dark"] .contato__card-value { color: #ebe7c5; }
[data-theme="dark"] .contato__card-action { color: rgba(185, 211, 176, 0.9); }
[data-theme="dark"] .cobertura__dist-fill {
  background: linear-gradient(90deg, var(--brand-deep) 0%, var(--brand) 100%);
}

/* Contato card */
[data-theme="dark"] .contato__card-value { color: var(--ink); }

/* Footer in dark mode */
[data-theme="dark"] .footer__top { border-bottom-color: rgba(143, 181, 133, 0.1); }

/* ======================================================================
   HERO — Visual Enhancements
   ====================================================================== */
.hero__topo-accent {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: url('assets/topo-pattern.svg');
  background-size: 900px 900px;
  background-position: 72% 35%;
  opacity: 0.06;
  z-index: 0;
  mask-image: radial-gradient(ellipse 80% 85% at 70% 45%, black 12%, transparent 68%);
  -webkit-mask-image: radial-gradient(ellipse 80% 85% at 70% 45%, black 12%, transparent 68%);
}
[data-theme="dark"] .hero__topo-accent {
  opacity: 0.09;
  filter: invert(1) hue-rotate(180deg) brightness(0.5);
}

.hero__gradient-orbs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.hero__gradient-orbs span {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
}
.hero__gradient-orbs span:nth-child(1) {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(59, 90, 58, 0.3), transparent 70%);
  top: -15%; right: 5%;
  animation: orbF1 14s ease-in-out infinite;
}
.hero__gradient-orbs span:nth-child(2) {
  width: 350px; height: 350px;
  background: radial-gradient(circle, rgba(184, 105, 61, 0.16), transparent 70%);
  bottom: 5%; left: 0;
  animation: orbF2 18s ease-in-out infinite;
}
.hero__gradient-orbs span:nth-child(3) {
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(200, 190, 110, 0.18), transparent 70%);
  top: 25%; right: -8%;
  animation: orbF3 16s ease-in-out infinite;
}
@keyframes orbF1 {
  0%, 100% { transform: translate(0,0) scale(1); }
  33% { transform: translate(40px,-25px) scale(1.08); }
  66% { transform: translate(-20px,35px) scale(0.94); }
}
@keyframes orbF2 {
  0%, 100% { transform: translate(0,0) scale(1); }
  33% { transform: translate(-30px,-20px) scale(1.05); }
  66% { transform: translate(25px,15px) scale(0.96); }
}
@keyframes orbF3 {
  0%, 100% { transform: translate(0,0) scale(1); }
  33% { transform: translate(20px,30px) scale(0.95); }
  66% { transform: translate(-35px,-15px) scale(1.07); }
}
[data-theme="dark"] .hero__gradient-orbs span:nth-child(1) {
  background: radial-gradient(circle, rgba(143,181,133,0.2), transparent 70%);
}
[data-theme="dark"] .hero__gradient-orbs span:nth-child(2) {
  background: radial-gradient(circle, rgba(214,133,89,0.1), transparent 70%);
}
[data-theme="dark"] .hero__gradient-orbs span:nth-child(3) {
  background: radial-gradient(circle, rgba(235,231,197,0.1), transparent 70%);
}

/* Leaf cursor in hero */
.hero {
  cursor: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M22 5C14 7 8 12 5 20C5 20 9 18 13 15C17 12 20 8 22 5Z' fill='%233b5a3a' fill-opacity='0.55' stroke='%233b5a3a' stroke-width='0.6'/%3E%3Cpath d='M22 5C14 11 8 16 5 20' fill='none' stroke='%233b5a3a' stroke-width='0.4' opacity='0.4'/%3E%3C/svg%3E") 14 14, auto;
}
[data-theme="dark"] .hero {
  cursor: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M22 5C14 7 8 12 5 20C5 20 9 18 13 15C17 12 20 8 22 5Z' fill='%238fb585' fill-opacity='0.55' stroke='%238fb585' stroke-width='0.6'/%3E%3Cpath d='M22 5C14 11 8 16 5 20' fill='none' stroke='%238fb585' stroke-width='0.4' opacity='0.4'/%3E%3C/svg%3E") 14 14, auto;
}

/* Hero background photo */
.hero__bg-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url('assets/hero-tree.jpg');
  background-size: cover;
  background-position: center 45%;
  opacity: 0.34;
  pointer-events: none;
}
/* Overlay escuro para preservar legibilidade dos textos */
.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    105deg,
    rgba(245,242,230,.62) 0%,
    rgba(245,242,230,.38) 45%,
    transparent 75%
  );
  pointer-events: none;
}
[data-theme="dark"] .hero::after {
  background: linear-gradient(
    105deg,
    rgba(11,17,10,.72) 0%,
    rgba(11,17,10,.42) 45%,
    transparent 75%
  );
}
[data-theme="dark"] .hero__bg-photo {
  opacity: 0.18;
  filter: brightness(0.45) saturate(0.6);
}

/* Ensure hero children get relative z for content above orbs */
.hero__inner { position: relative; z-index: 1; }
.hero__tagline { position: relative; z-index: 1; }

/* ======================================================================
   STAT ICONS (Section 01)
   ====================================================================== */
.stat__icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--bg);
  border: 1px solid var(--line-soft);
  display: grid;
  place-items: center;
  color: var(--brand);
  margin-bottom: 18px;
  transition: background 0.3s, color 0.3s, transform 0.3s, border-color 0.3s;
}
.stat:hover .stat__icon {
  background: var(--brand);
  color: var(--beige);
  transform: scale(1.08) rotate(-5deg);
  border-color: var(--brand);
}
[data-theme="dark"] .stat__icon {
  color: var(--brand-deep);
  border-color: rgba(143,181,133,0.15);
}
[data-theme="dark"] .stat:hover .stat__icon {
  color: var(--bg);
}
.stat__icon svg {
  width: 22px;
  height: 22px;
}

/* ======================================================================
   COBERTURA — Distribution Chart
   ====================================================================== */
.cobertura__dist-chart {
  margin-top: 28px;
  padding: 36px;
  background: var(--surface);
  border-radius: var(--r-lg);
  border: 1px solid var(--line-soft);
}
.cobertura__dist-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
}
.cobertura__dist-head h3 { font-size: 1.15rem; }
.cobertura__dist-bars {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.cobertura__dist-row__head {
  display: flex;
  justify-content: space-between;
  font-size: 0.88rem;
  margin-bottom: 8px;
  transition: color 0.2s;
}
.cobertura__dist-row:hover .cobertura__dist-row__head { color: var(--brand); }
[data-theme="dark"] .cobertura__dist-row:hover .cobertura__dist-row__head { color: var(--brand-deep); }
.cobertura__dist-row__label { font-weight: 600; }
.cobertura__dist-row__value {
  font-family: 'Geist Mono', monospace;
  color: var(--muted);
  font-size: 0.8rem;
}
.cobertura__dist-track {
  height: 12px;
  background: var(--bg);
  border-radius: var(--r-pill);
  overflow: hidden;
  border: 1px solid var(--line-soft);
}
.cobertura__dist-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--brand) 0%, var(--brand-soft) 100%);
  border-radius: var(--r-pill);
  width: 0;
  transition: width 1.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* Map stage — real SVG */
.map-stage { position: relative; }
[data-theme="dark"] .map-stage img { --map-filter: invert(0.85) hue-rotate(180deg) brightness(0.7); filter: var(--map-filter); }
.state-highlight { transition: opacity 0.3s, transform 0.15s; cursor: pointer; }
.state-highlight:hover { opacity: 0.95 !important; filter: brightness(1.15); }
.map-pin-g { transition: transform 0.2s; }
.map-pin-g:hover { transform-origin: center center; }

/* ======================================================================
   SERVICOS — New section label + wide grid (4 cols)
   ====================================================================== */
.servicos__new-label {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 56px 0 28px;
  font-size: .74rem;
  font-family: 'Geist Mono', monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}
.servicos__new-label::before,
.servicos__new-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--line-soft);
}
.servicos__grid--wide {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (max-width: 1100px) {
  .servicos__grid--wide { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px) {
  .servicos__grid--wide { grid-template-columns: 1fr !important; }
}

/* ======================================================================
   CONTATO — Split layout (info left, form right)
   ====================================================================== */
.contato__split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
}
.contato__info .eyebrow { display: block; }
.contato__info h2 { font-size: clamp(1.7rem, 2.5vw, 2.4rem); }

.contato__form-wrap {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-lg);
  padding: 40px 40px 40px;
}
.contato__form-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--ink);
}
.contato__form-sub {
  font-size: .88rem;
  color: var(--muted);
  margin: 0 0 28px;
}
.contato__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.contato__form-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.contato__form-btn {
  flex: 1;
  min-width: 160px;
  justify-content: center;
}
.contato__wa-btn {
  display: flex;
  align-items: center;
  gap: 8px;
}
.contato__wa-btn svg { width: 16px; height: 16px; flex-shrink: 0; }

.contato__form-success {
  text-align: center;
  padding: 48px 24px 32px;
}
.contato__form-success-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--brand-soft, rgba(59,90,58,.12));
  border: 1.5px solid var(--brand);
  display: grid;
  place-items: center;
  margin: 0 auto 16px;
  color: var(--brand);
}
.contato__form-success h4 {
  font-size: 1.2rem;
  margin: 0 0 8px;
}
.contato__form-success p {
  font-size: .9rem;
  color: var(--muted);
  margin: 0 0 24px;
}

[data-theme="dark"] .contato__form-wrap {
  border-color: rgba(143, 181, 133, 0.14);
  background: var(--surface);
}
[data-theme="dark"] .contato__form-success-icon {
  background: rgba(143,181,133,.14);
  border-color: rgba(143,181,133,.35);
  color: var(--brand-deep, #8fb585);
}

@media (max-width: 960px) {
  .contato__split {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .field-row {
    grid-template-columns: 1fr;
  }
  .contato__form-wrap {
    padding: 32px 28px;
  }
}

@media (max-width: 560px) {
  .contato__split .contato__card {
    grid-template-columns: 44px 1fr;
    grid-template-rows: auto auto auto;
    column-gap: 12px;
  }
  .contato__split .contato__card-icon {
    grid-row: 1 / 3;
  }
  .contato__split .contato__card-action {
    grid-column: 2;
    grid-row: 3;
    white-space: normal;
    margin-top: 2px;
  }
  .contato__form-wrap {
    padding: 24px 20px;
  }
  .contato__form-actions {
    flex-direction: column;
  }
  .contato__form-btn {
    width: 100%;
  }
  .contato__wa-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ======================================================================
   CONTATO — Cards horizontais empilhados (dentro do split)
   ====================================================================== */
.contato__split .contato__cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 36px;
}

/* Layout horizontal: ícone | label+value | ação */
.contato__split .contato__card {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 16px;
  row-gap: 2px;
  align-items: center;
  padding: 18px 22px;
  text-align: left;
  border-radius: 14px;
  transition: transform 0.18s, box-shadow 0.18s;
}
.contato__split .contato__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0,0,0,.07);
}

.contato__split .contato__card-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  margin: 0;
  display: grid;
  place-items: center;
}
.contato__split .contato__card-icon svg {
  width: 19px;
  height: 19px;
}

.contato__split .contato__card-label {
  grid-column: 2;
  grid-row: 1;
  font-size: .69rem;
  margin: 0;
  line-height: 1.3;
}

.contato__split .contato__card-value {
  grid-column: 2;
  grid-row: 2;
  font-size: .97rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.35;
  word-break: break-word;
}

.contato__split .contato__card-action {
  grid-column: 3;
  grid-row: 1 / 3;
  font-size: .8rem;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 5px;
  opacity: .75;
}
.contato__split .contato__card:hover .contato__card-action {
  opacity: 1;
}

/* WhatsApp card — dark green, mantém estilo mas horizontal */
.contato__split .contato__card--whatsapp .contato__card-icon {
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.2);
  color: #fff;
}
.contato__split .contato__card--whatsapp .contato__card-action {
  color: rgba(255,255,255,.9);
  opacity: 1;
}

/* Form card — refinamentos */
.contato__form-wrap {
  box-shadow: 0 4px 32px rgba(0,0,0,.06);
  border-top: 3px solid var(--brand);
}
[data-theme="dark"] .contato__form-wrap {
  border-top-color: var(--brand-deep, #8fb585);
  box-shadow: 0 4px 32px rgba(0,0,0,.22);
}
.contato__form-title {
  font-size: 1.3rem;
}
.contato__form textarea {
  min-height: 110px;
  resize: vertical;
}
.contato__form label {
  font-size: .72rem;
  font-family: 'Geist Mono', monospace;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
  margin-bottom: 6px;
}
/* Remove duplicate label margin from .field default */
.contato__form .field label { margin-bottom: 6px; }

/* ======================================================================
   FILE UPLOAD — campo de anexo de PDF
   ====================================================================== */
.field__optional {
  font-size: .68rem;
  font-family: 'Geist Mono', monospace;
  letter-spacing: .06em;
  color: var(--muted);
  margin-left: 6px;
  font-weight: 400;
  text-transform: none;
}

.file-upload {
  position: relative;
  border: 1.5px dashed var(--line-soft);
  border-radius: 10px;
  background: var(--bg);
  transition: border-color .2s, background .2s;
  cursor: pointer;
  overflow: hidden;
}
.file-upload:hover,
.file-upload.drag-over {
  border-color: var(--brand);
  background: color-mix(in oklab, var(--brand) 5%, var(--bg));
}
.file-upload.drag-over { border-style: solid; }

.file-upload input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 2;
}

.file-upload__ui {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  color: var(--muted);
}
.file-upload__ui svg { flex-shrink: 0; color: var(--brand); }
.file-upload__text {
  display: block;
  font-size: .88rem;
  font-weight: 500;
  color: var(--ink);
  line-height: 1.3;
}
.file-upload__hint {
  display: block;
  font-size: .75rem;
  color: var(--muted);
  font-family: 'Geist Mono', monospace;
  letter-spacing: .05em;
  margin-top: 2px;
}

.file-upload__selected {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  color: var(--brand);
  font-size: .88rem;
  font-weight: 500;
}
.file-upload__selected svg { flex-shrink: 0; }
.file-upload__selected span { flex: 1; word-break: break-all; }

.file-upload__remove {
  background: none;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  cursor: pointer;
  color: var(--muted);
  transition: background .15s, color .15s;
  z-index: 3;
  position: relative;
  flex-shrink: 0;
}
.file-upload__remove:hover { background: var(--bg-2); color: var(--ink); }

[data-theme="dark"] .file-upload {
  border-color: rgba(143,181,133,.18);
  background: rgba(17,23,15,.3);
}
[data-theme="dark"] .file-upload:hover,
[data-theme="dark"] .file-upload.drag-over {
  border-color: var(--brand-deep, #8fb585);
  background: rgba(143,181,133,.07);
}

/* ======================================================================
   HERO CARD v2 — Métricas com barras + sparkline
   ====================================================================== */
.hero__card--v2 {
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.hero__card-status {
  display: flex;
  align-items: center;
  gap: 7px;
}

/* Metric grid v2 */
.hero__metric-v2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 14px 0 10px;
}
.hero__metric-item-v2 {
  position: relative;
  background: var(--bg);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: 14px 14px 18px;
  overflow: hidden;
  cursor: default;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.hero__metric-item-v2:hover {
  transform: translateY(-3px) scale(1.025);
  box-shadow: 0 8px 28px rgba(59,90,58,.13);
  border-color: var(--brand);
}
.hero__metric-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: var(--bar-color);
  border-radius: 0 2px 0 0;
  transition: width 1.2s cubic-bezier(.2,.8,.2,1);
}
.hero__metric-bar.in { width: var(--bar-w); }
.hero__metric-num-v2 {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.05;
  letter-spacing: -.02em;
}
.hero__metric-num-v2 sup { font-size: .65em; vertical-align: super; line-height: 0; }
.hero__metric-pct { font-size: 1.1rem; font-weight: 700; }
.hero__metric-label-v2 {
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-family: 'Geist Mono', monospace;
  color: var(--muted);
  margin-top: 5px;
  line-height: 1.3;
}

/* Metric cards — plain background (sem gradiente) */
.hero__metric-item-v2:nth-child(1),
.hero__metric-item-v2:nth-child(2),
.hero__metric-item-v2:nth-child(3),
.hero__metric-item-v2:nth-child(4) {
  background: var(--bg);
}
[data-theme="dark"] .hero__metric-item-v2:nth-child(1),
[data-theme="dark"] .hero__metric-item-v2:nth-child(2),
[data-theme="dark"] .hero__metric-item-v2:nth-child(3),
[data-theme="dark"] .hero__metric-item-v2:nth-child(4) {
  background: var(--surface);
}

/* KPI extra row */
.hero__kpi-row {
  display: flex;
  align-items: center;
  gap: 0;
  border-top: 1px solid var(--line-soft);
  padding-top: 12px;
  margin: 6px 0 12px;
}
.hero__kpi-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 4px 6px;
}
.hero__kpi-val {
  font-size: 1rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.1;
  letter-spacing: -.01em;
}
.hero__kpi-val sup { font-size: .65em; vertical-align: super; }
.hero__kpi-val--up { color: var(--brand); }
.hero__kpi-lbl {
  font-size: .6rem;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-family: 'Geist Mono', monospace;
  color: var(--muted);
  text-align: center;
  line-height: 1.2;
}
.hero__kpi-sep {
  width: 1px;
  height: 32px;
  background: var(--line-soft);
  flex-shrink: 0;
}
.hero__sparkline svg {
  width: 100%;
  height: 38px;
  display: block;
  margin-bottom: 6px;
}
.spark-line {
  fill: none;
  stroke: var(--brand);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.spark-fill { fill: url(#spkGrad); }
.spark-dot {
  fill: var(--brand);
  filter: drop-shadow(0 0 3px var(--brand));
}
.hero__sparkline-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hero__sparkline-trend {
  font-size: .75rem;
  font-weight: 700;
  color: var(--brand);
  font-family: 'Geist Mono', monospace;
  letter-spacing: .05em;
}
[data-theme="dark"] .hero__metric-item-v2 {
  border-color: rgba(143,181,133,.12);
}
[data-theme="dark"] .hero__metric-item-v2:hover {
  border-color: rgba(143,181,133,.35);
  box-shadow: 0 8px 28px rgba(0,0,0,.3);
}

/* ======================================================================
   MODAL CLOSE — Botão vermelho com gradiente
   ====================================================================== */
.modal__close {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  background: linear-gradient(135deg, oklch(38% 0.17 20), oklch(50% 0.20 25));
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background .18s, transform .15s, box-shadow .18s;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10;
}
.modal__close:hover {
  background: linear-gradient(135deg, oklch(33% 0.18 20), oklch(44% 0.22 25));
  transform: scale(1.04);
  box-shadow: 0 4px 18px rgba(180,40,30,.35);
}
.modal__close:active { transform: scale(.97); }
.modal__close svg { flex-shrink: 0; }

/* ======================================================================
   POPUP — Enhanced Design
   ====================================================================== */
.popup {
  width: min(620px, 95vw) !important;
  box-shadow: 0 40px 100px rgba(0,0,0,0.35), 0 0 0 1px rgba(59,90,58,0.1) !important;
}
.popup__visual {
  padding: 36px 28px !important;
  background: linear-gradient(155deg, #1d3a1c 0%, #3b5a3a 45%, #5a7d54 100%) !important;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.popup__visual::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('assets/topo-pattern.svg') !important;
  background-size: 280px 280px !important;
  opacity: 0.09 !important;
  pointer-events: none !important;
}
.popup__visual-content { position: relative; z-index: 1; }
.popup__visual-tag { position: relative; z-index: 1; }
.popup__visual-pages { position: relative; z-index: 1; }
.popup__visual h3 {
  font-size: 1.6rem !important;
  line-height: 1.12 !important;
}
.popup__visual-icon {
  position: relative; z-index: 1;
  width: 72px !important;
  height: 72px !important;
  border-radius: var(--r-lg) !important;
  background: rgba(235,231,197,0.12) !important;
  border: 1px solid rgba(235,231,197,0.22) !important;
  backdrop-filter: blur(8px);
}
.popup__visual-icon svg { width: 32px !important; height: 32px !important; }

.popup__body {
  padding: 32px 28px 28px !important;
}
.popup__body h4 { font-size: 1.3rem !important; }
.popup__body p { line-height: 1.5; }

.popup .field input,
.popup .field select {
  padding: 13px 16px !important;
  font-size: 0.92rem !important;
  border-radius: var(--r-sm) !important;
}
.popup .field input:focus,
.popup .field select:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(59,90,58,0.1) !important;
}

.popup__submit {
  padding: 14px 20px !important;
  font-size: 0.98rem !important;
  background: var(--grad-cta) !important;
  color: #fffcf0 !important;
  box-shadow: var(--shadow-glow) !important;
  border-radius: var(--r-pill) !important;
  border: none !important;
  transition: transform 0.15s, box-shadow 0.25s !important;
}
[data-theme="dark"] .popup__submit { color: #11170f !important; }
.popup__submit:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 0 0 1px var(--brand), 0 16px 50px rgba(59,90,58,0.3) !important;
}

.popup__success-icon {
  width: 72px !important;
  height: 72px !important;
  animation: popSucc 0.45s cubic-bezier(0.2,0.9,0.3,1.15);
}
@keyframes popSucc {
  0% { transform: scale(0) rotate(-30deg); }
  100% { transform: scale(1) rotate(0deg); }
}

/* ======================================================================
   BLOG — New Category Colors
   ====================================================================== */
.blog-card__cat--flora { color: #3b7d3a; }
.blog-card__cat--fauna { color: #b8693d; }
.blog-card__cat--esg-corp { color: #3b5a7a; }
.blog-card__cat--topografia { color: #7a6b3b; }
.blog-card__cat--georref { color: #5a3b7a; }
[data-theme="dark"] .blog-card__cat--flora { color: #8fb585; }
[data-theme="dark"] .blog-card__cat--fauna { color: #d68559; }
[data-theme="dark"] .blog-card__cat--esg-corp { color: #85b5c5; }
[data-theme="dark"] .blog-card__cat--topografia { color: #c5b585; }
[data-theme="dark"] .blog-card__cat--georref { color: #b585c5; }
.blog-card__cat--outorgas { color: #3b627a; }
[data-theme="dark"] .blog-card__cat--outorgas { color: #7ab5d6; }
.blog-card__cat--graprohab { color: #7a3b52; }
[data-theme="dark"] .blog-card__cat--graprohab { color: #d685a3; }
.blog-card__cat--febre-maculosa { color: #a04b2a; }
[data-theme="dark"] .blog-card__cat--febre-maculosa { color: #e28a5f; }

/* ======================================================================
   SECTION ILLUSTRATIONS — Flat design environmental images
   ====================================================================== */
.section-illust {
  position: relative;
  width: clamp(160px, 18vw, 240px);
  aspect-ratio: 3 / 2;
  border-radius: var(--r-lg);
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid var(--line-soft);
  box-shadow: 0 8px 32px rgba(59, 90, 58, 0.08);
}
.section-illust img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85);
  transition: transform 0.5s ease, filter 0.5s ease;
}
.section-illust:hover img {
  transform: scale(1.05);
  filter: saturate(1);
}
[data-theme="dark"] .section-illust {
  border-color: rgba(143, 181, 133, 0.12);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}
[data-theme="dark"] .section-illust img {
  filter: saturate(0.7) brightness(0.8);
}
[data-theme="dark"] .section-illust:hover img {
  filter: saturate(0.85) brightness(0.9);
}

/* Ensure sobre__head and servicos__head can hold illustration */
.sobre__head, .servicos__head, .blog__head {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}

@media (max-width: 700px) {
  .section-illust { display: none; }
}

/* ======================================================================
   RESPONSIVE — Comprehensive Mobile/Tablet/Desktop
   ====================================================================== */

/* ── Hamburger button ── */
.nav__hamburger {
  display: none;
  width: 44px; height: 44px;
  border: none; background: none; cursor: pointer;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px;
  padding: 10px;
  z-index: 1001;
}
.nav__hamburger span {
  display: block; width: 22px; height: 2px;
  background: var(--ink); border-radius: 2px;
  transition: transform 0.3s, opacity 0.2s;
}
.nav__hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav__hamburger.is-open span:nth-child(2) { opacity: 0; }
.nav__hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Mobile menu overlay ── */
.nav__mobile {
  display: flex;
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 999;
  padding: 100px 28px 40px;
  flex-direction: column;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
  overflow-y: auto;
  visibility: hidden;
  pointer-events: none;
}
.nav__mobile.is-open {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}
.nav__mobile-links {
  display: flex; flex-direction: column; gap: 4px;
}
.nav__mobile-link {
  display: block;
  padding: 16px 8px;
  font-family: var(--f-heading);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--line-soft);
  transition: color 0.2s;
}
.nav__mobile-link:hover { color: var(--brand); }
[data-theme="dark"] .nav__mobile-link:hover { color: var(--brand-deep); }

.nav__mobile-group { border-bottom: 1px solid var(--line-soft); }
.nav__mobile-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-bottom: none; cursor: pointer; list-style: none;
}
.nav__mobile-summary::-webkit-details-marker { display: none; }
.nav__mobile-summary::marker { content: ''; font-size: 0; }
.nav__mobile-chevron { width: 20px !important; height: 20px !important; max-width: 20px; max-height: 20px; flex-shrink: 0; transition: transform .25s ease; color: var(--muted); }
.nav__mobile-group[open] .nav__mobile-chevron { transform: rotate(180deg); }
.nav__mobile-group .nav__mobile-sub { border-bottom: none; padding-bottom: 10px; }

/* ── Touch targets — minimum 44px ── */
.theme-toggle { min-width: 44px; min-height: 44px; }
.modal__close { min-width: 44px; min-height: 44px; }
.popup__close { min-width: 44px; min-height: 44px; }
.social a { min-width: 44px; min-height: 44px; width: 44px; height: 44px; }
.faq__toggle { min-width: 44px; min-height: 44px; }

/* ── Tablet (≤980px) ── */
@media (max-width: 980px) {
  .nav__hamburger { display: flex; }
  .nav__cta-desktop { display: none; }
  
  .hero__gradient-orbs span { filter: blur(60px); }
  .hero__bg-photo { opacity: 0.08; }
  
  .esg__head p { max-width: none; }
  
  .blog__grid > :nth-child(n+7) { display: none; }
  
  .ods { padding: 32px 24px; }
  .ods__grid { gap: 8px; }
}

/* ── Mobile (≤560px) ── */
@media (max-width: 560px) {
  html { font-size: 15px; }
  
  .section { padding: clamp(48px, 10vw, 80px) 0; }
  
  .hero { min-height: 85vh; }
  .hero__title { font-size: clamp(2.2rem, 10vw, 3.2rem); }
  .hero__lead { font-size: 0.95rem; }
  .hero__tagline { flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
  .hero__tagline span { font-size: 0.7rem; }
  
  .sobre__title, .section h2 { font-size: clamp(1.6rem, 6vw, 2.4rem); }
  
  .mvv { gap: 12px; }
  .mvv__card { padding: 24px 20px; }
  
  .publico { padding: 28px 24px; }
  .publico__list li { font-size: 0.88rem; padding: 10px 0; }
  
  .servico { padding: 28px 24px; }
  
  .pilar { padding: 28px 24px; }
  .pilar__letra { font-size: 3rem; }
  
  .ods { padding: 28px 20px; border-radius: var(--r-lg); }
  .ods__title { font-size: 1.4rem; }
  .ods__cell { padding: 10px; font-size: 1rem; }
  
  .ods-real__card { padding: 6px; }
  .ods-real__num { font-size: 0.65rem; }
  .ods-real__name { font-size: 0.6rem; }
  
  .etapa { padding: 24px 20px; }
  
  .blog-card__body { padding: 20px; }
  .blog-card__body h3 { font-size: 1.05rem; }
  .blog-card__excerpt { font-size: 0.85rem; }
  .blog__grid > :nth-child(n+5) { display: none; }
  
  .contato__cards { gap: 12px; }
  .contato__card { padding: 24px 20px; }
  .contato h2 { font-size: clamp(1.6rem, 7vw, 2.2rem); }
  
  .form { padding: 20px; }
  
  .faq__item { padding: 20px; }
  
  .footer__top { gap: 28px; padding-bottom: 28px; }
  .footer__brand { max-width: 100%; }
  
  .popup { width: 96vw !important; }
  .popup__visual h3 { font-size: 1.2rem !important; }
  .popup__body { padding: 24px 20px !important; }
  
  .modal { max-height: 92vh; }
  .modal__head { padding: 28px 20px 20px; }
  .modal__body { padding: 0 20px 28px; }
  
  .nav__mobile { padding: 90px 24px 32px; }
  .nav__mobile-link { font-size: 1.1rem; padding: 14px 8px; }
  
  /* Hide leaf particles on small screens for performance */
  #leafParticles { display: none; }
}

/* ── Very small screens (≤380px) ── */
@media (max-width: 380px) {
  .hero__title { font-size: 2rem; }
  .stats { gap: 12px; }
  .stat { padding: 20px 16px; }
  .stat__num { font-size: 2rem; }
  .btn { padding: 10px 14px; font-size: 0.85rem; }
  .nav__logo { width: 100px; }
}

/* ── Large desktop (≥1600px) ── */
@media (min-width: 1600px) {
  .container { max-width: 1400px; }
  .hero__title { font-size: clamp(4rem, 6vw, 6.5rem); }
}

/* ── Footer redesign — 4-column grid ── */
.footer__top {
  grid-template-columns: 1.6fr repeat(3, 1fr) !important;
  gap: 48px 40px !important;
  align-items: start !important;
}

.footer h4 { margin-bottom: 16px !important; }

/* ── Rodapé: grupos de links colapsáveis (abertos por padrão) ── */
.footer__group-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  cursor: pointer; list-style: none;
}
.footer__group-summary::-webkit-details-marker { display: none; }
.footer__group-summary::marker { content: ''; }
.footer__group-summary h4 { margin-bottom: 0 !important; }
.footer__group-chevron { flex-shrink: 0; opacity: .6; transition: transform .25s ease; }
.footer__group[open] .footer__group-chevron { transform: rotate(180deg); }

.footer__bottom {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 8px 24px !important;
}
.footer__bottom-left {
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}
.footer__coverage {
  font-family: 'Geist Mono', monospace;
  font-size: .74rem;
  letter-spacing: .02em;
  color: var(--muted);
  opacity: .85;
}

@media (max-width: 980px) {
  .footer__top {
    grid-template-columns: 1fr 1fr !important;
    gap: 36px 32px !important;
  }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .footer__top { grid-template-columns: 1fr !important; }
  .footer__brand { grid-column: auto; }
  .footer__bottom { flex-direction: column; align-items: flex-start !important; }
  .footer__bottom-left { flex-direction: column; gap: 4px; }
}
@media print {
  .topo-bg, #leafParticles, .hero__gradient-orbs, .hero__bg-photo,
  .hero__topo-accent, .nav, .popup-overlay, .modal-overlay,
  .nav__mobile, .nav__hamburger { display: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
  .section { page-break-inside: avoid; }
}

/* ======================================================================
   PROGRAMA SELO VERDE (seção 04)
   ====================================================================== */
.selo__pts {
  font-family: 'Geist Mono', monospace;
  font-size: .7rem; font-weight: 700; letter-spacing: .04em;
  color: var(--brand); background: color-mix(in oklab, var(--brand) 12%, transparent);
  padding: 5px 10px; border-radius: var(--r-pill); white-space: nowrap;
}
[data-theme="dark"] .selo__pts { color: var(--brand-deep); }

.selo__hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(24px, 4vw, 48px);
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 22px;
  padding: clamp(24px, 3.5vw, 40px);
  margin-bottom: 36px;
}
.selo__badge {
  display: grid; place-items: center;
  width: clamp(150px, 20vw, 210px);
}
.selo__badge img {
  width: 100%; height: auto; display: block;
  filter: drop-shadow(0 10px 26px rgba(60,90,40,.22));
  animation: seloFloat 5s ease-in-out infinite;
}
@keyframes seloFloat { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-8px) rotate(1deg); } }
@media (prefers-reduced-motion: reduce) { .selo__badge img { animation: none; } }

.selo__stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
  margin-bottom: 20px;
}
.selo__stat {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 16px;
  background: var(--bg-2);
  border-radius: 14px;
  border: 1px solid var(--line-soft);
}
.selo__stat-num {
  font-family: var(--f-heading), sans-serif;
  font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 600; line-height: 1;
  color: var(--brand); letter-spacing: -.02em;
}
[data-theme="dark"] .selo__stat-num { color: var(--brand-deep); }
.selo__stat-sub { font-size: .95rem; opacity: .6; font-weight: 600; }
.selo__stat-lbl { font-size: .76rem; color: var(--ink-2); line-height: 1.3; }
.selo__hero-note { font-size: .92rem; color: var(--ink-2); margin-bottom: 22px; line-height: 1.55; }
.selo__actions { display: flex; flex-wrap: wrap; gap: 12px; }

.selo__grid { margin-bottom: 36px; }
.selo__grid .servico__head { align-items: center; }

.selo__links {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 40px);
  padding-top: 32px;
  border-top: 1px dashed var(--line);
}
.selo__links-label {
  display: block;
  font-family: 'Geist Mono', monospace;
  font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--brand); font-weight: 600; margin-bottom: 14px;
}
[data-theme="dark"] .selo__links-label { color: var(--brand-deep); }
.selo__links-grid { display: flex; flex-direction: column; gap: 2px; }
.selo__links-grid a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border-radius: 10px;
  font-size: .92rem; font-weight: 500; color: var(--ink);
  text-decoration: none;
  transition: background .2s, color .2s, padding-left .2s;
}
.selo__links-grid a:hover {
  background: var(--bg-2); color: var(--brand); padding-left: 18px;
}
[data-theme="dark"] .selo__links-grid a:hover { color: var(--brand-deep); }

@media (max-width: 760px) {
  .selo__hero { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .selo__badge { width: 160px; }
  .selo__stats { grid-template-columns: 1fr 1fr; }
  .selo__hero-note { text-align: left; }
  .selo__actions { justify-content: center; }
  .selo__links { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
  .selo__stats { grid-template-columns: 1fr 1fr; }
}

/* ======================================================================
   INSTAGRAM — carrossel de posts (seção 07)
   ====================================================================== */
.ig {
  margin-top: clamp(48px, 6vw, 80px);
  padding-top: clamp(36px, 4vw, 52px);
  border-top: 1px dashed var(--line);
}
.ig__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.ig__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Geist Mono', monospace;
  font-size: .74rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--brand);
  font-weight: 600;
}
[data-theme="dark"] .ig__eyebrow { color: var(--brand-deep); }
.ig__eyebrow svg { width: 17px; height: 17px; }
.ig__head-text h3 {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  margin: 12px 0 8px;
  line-height: 1.1;
}
.ig__head-text p { color: var(--ink-2); max-width: 46ch; font-size: .96rem; }
.ig__head-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ig__visit {
  background: linear-gradient(120deg, #F58529 0%, #DD2A7B 45%, #8134AF 78%, #515BD4 100%) !important;
  border: none !important;
  color: #fff !important;
}
.ig__visit:hover { box-shadow: 0 12px 34px rgba(221,42,123,.34) !important; }
.ig__visit svg { width: 17px; height: 17px; }
.ig__nav { display: flex; gap: 8px; }
.ig__arrow {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
  display: grid; place-items: center;
  cursor: pointer;
  transition: border-color .2s, background .2s, transform .15s, opacity .2s;
}
.ig__arrow:hover:not(:disabled) { border-color: var(--brand); background: var(--surface-2); }
.ig__arrow:active:not(:disabled) { transform: scale(.92); }
.ig__arrow:disabled { opacity: .32; cursor: default; }
.ig__arrow svg { width: 18px; height: 18px; }

.ig__stage { position: relative; }
.ig__stage--behold { min-height: 260px; }
.ig__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.ig__grid .ig-post { opacity: 0; transform: translateY(22px) scale(.97); }
.ig__grid.is-in .ig-post {
  animation: igIn .55s cubic-bezier(.22,.61,.36,1) forwards;
  animation-delay: calc(var(--d) * .12s);
}
@keyframes igIn { to { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: reduce) { .ig__grid .ig-post { opacity: 1; transform: none; } .ig__grid.is-in .ig-post { animation: none; } }
.ig__dots { display: flex; justify-content: center; gap: 9px; margin-top: 26px; }
.ig__dot {
  width: 9px; height: 9px; border-radius: 999px; padding: 0;
  border: none; background: var(--line); cursor: pointer;
  transition: background .25s, transform .25s, width .25s;
}
.ig__dot[aria-selected="true"] { background: var(--brand); width: 26px; }
[data-theme="dark"] .ig__dot[aria-selected="true"] { background: var(--brand-deep); }

.ig-post {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-md, 16px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .3s ease, box-shadow .3s, border-color .3s;
}
.ig-post:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lift, 0 18px 44px rgba(0,0,0,.12));
  border-color: var(--brand);
}
.ig-post__media { position: relative; aspect-ratio: 4 / 5; overflow: hidden; }
.ig-post__media img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .5s ease;
}
.ig-post:hover .ig-post__media img { transform: scale(1.06); }
.ig-post__tag {
  position: absolute; top: 12px; left: 12px;
  font-family: 'Geist Mono', monospace;
  font-size: .62rem; letter-spacing: .06em; text-transform: uppercase;
  background: rgba(17,23,15,.62);
  color: #fff;
  padding: 5px 10px; border-radius: 999px;
  backdrop-filter: blur(6px);
}
.ig-post__overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background: linear-gradient(180deg, rgba(221,42,123,.18), rgba(81,91,212,.42));
  color: #fff; font-weight: 600; font-size: .9rem;
  opacity: 0; transition: opacity .3s ease;
}
.ig-post:hover .ig-post__overlay { opacity: 1; }
.ig-post__overlay svg { width: 34px; height: 34px; }
.ig-post__body { padding: 16px 16px 18px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.ig-post__cap {
  font-size: .9rem; line-height: 1.45; color: var(--ink-2);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ig-post__foot {
  display: flex; align-items: center; justify-content: space-between;
  font-family: 'Geist Mono', monospace; font-size: .68rem; letter-spacing: .04em;
  color: var(--muted); margin-top: auto;
}
.ig-post__cta { color: var(--brand); font-weight: 600; }
[data-theme="dark"] .ig-post__cta { color: var(--brand-deep); }
.ig__note {
  margin-top: 16px;
  font-family: 'Geist Mono', monospace;
  font-size: .72rem; letter-spacing: .02em;
  color: var(--muted);
}
.ig__note a { color: var(--brand); text-decoration: underline; text-underline-offset: 2px; }
[data-theme="dark"] .ig__note a { color: var(--brand-deep); }
@media (max-width: 860px) {
  .ig__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ig__head { align-items: flex-start; }
}


/* ===== Nav dropdown — serviços especializados ===== */
.nav__dd{position:relative;display:inline-flex;align-items:center}
.nav__dd-toggle{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.nav__dd-toggle svg{width:12px;height:12px;transition:transform .2s}
.nav__dd:hover .nav__dd-toggle svg{transform:rotate(180deg)}
.nav__dd-menu{position:absolute;top:100%;left:50%;transform:translate(-50%,8px);min-width:264px;background:var(--surface,#fff);border:1px solid var(--line-soft,rgba(0,0,0,.1));border-radius:16px;padding:8px;display:grid;gap:2px;opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s;box-shadow:0 24px 50px -28px rgba(0,0,0,.55);z-index:120}
.nav__dd:hover .nav__dd-menu,.nav__dd:focus-within .nav__dd-menu{opacity:1;visibility:visible;transform:translate(-50%,4px)}
.nav__dd-menu a{padding:11px 15px;border-radius:11px;font-size:.9rem;font-weight:500;color:var(--ink);white-space:nowrap;transition:background .16s,color .16s}
.nav__dd-menu a:hover{background:color-mix(in oklab,var(--brand) 12%,transparent);color:var(--brand)}
.nav__dd-menu .nav__dd-sep{height:1px;background:var(--line-soft,rgba(0,0,0,.08));margin:5px 8px}
.nav__mobile-sub{display:grid;gap:2px;margin:2px 0 6px;padding-left:14px;border-left:2px solid color-mix(in oklab,var(--brand) 30%,transparent)}
.nav__mobile-sub a{font-size:.95rem;color:var(--muted);padding:8px 0}

/* mega dropdown */
.nav__dd-menu--mega{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;min-width:560px;left:auto;right:0;transform:translate(0,8px)}
.nav__dd:hover .nav__dd-menu--mega,.nav__dd:focus-within .nav__dd-menu--mega{transform:translate(0,4px)}
.nav__dd-col{display:grid;gap:1px;align-content:start}
.nav__dd-h{font:700 .66rem/1 'Geist Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:6px 15px}
.nav__dd-menu--mega a{font-size:.86rem;padding:9px 15px}
