/* =========================================================
   Auris — One page
   Estrutura: mobile-first, com breakpoints alinhados aos
   frames reais do Figma (390 / 768 / 1024 / 1440 / 1920).
   ========================================================= */

body {
  font-family: var(--font-body);
  color: var(--color-primary);
  background: var(--color-white);
  overflow-x: hidden;
}

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: 20px;
}

@media (min-width: 768px) {
  .container { padding-inline: 24px; }
}

section {
  padding-block: 64px;
}

@media (min-width: 1024px) {
  section { padding-block: 90px; }
}

@media (min-width: 1440px) {
  section { padding-block: 110px; }
}

.eyebrow {
  display: block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-13);
  letter-spacing: 1.82px;
  text-transform: uppercase;
  margin-bottom: var(--space-s);
}
.eyebrow--accent { color: var(--color-accent); }
.eyebrow--info { color: var(--color-info); }

.mobile-break { display: none; }
@media (max-width: 767px) {
  .mobile-break { display: inline; }
}

h1, h2, .heading {
  font-family: var(--font-heading);
  font-weight: 400;
  color: var(--color-primary);
  letter-spacing: -0.27px;
  line-height: 1.12;
}

h1 {
  font-size: clamp(2.25rem, 1.8rem + 1.2vw, 3.5rem);
  letter-spacing: -0.72px;
  color: var(--color-primary);
  margin-bottom: var(--space-2xl);
}
h1.on-dark, h2.on-dark { color: var(--color-white); }

h2 {
  font-size: clamp(1.9rem, 1.5rem + 1.6vw, var(--fs-54));
  margin-bottom: var(--space-s);
}

p.lede {
  font-size: clamp(0.95rem, 0.85rem + 0.4vw, var(--fs-17));
  line-height: var(--lh-27);
  color: var(--color-primary-70);
  max-width: 62ch;
}

/* =========================
   Botões
   ========================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-16);
  padding: 16px 30px;
  transition: background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
  text-align: center;
}

.btn:hover,
.btn:focus-visible {
  transform: translateY(-2px) scale(1.02);
}
.btn:active {
  transform: translateY(0) scale(0.99);
}

.btn--primary {
  background: var(--color-accent);
  color: var(--color-white);
  box-shadow: var(--shadow-cta);
}
.btn--primary:hover,
.btn--primary:focus-visible {
  background: var(--color-accent-hover);
}

.btn--secondary {
  background: var(--color-white);
  color: var(--color-primary);
  border: 1px solid var(--color-primary-22);
}
.btn--secondary:hover,
.btn--secondary:focus-visible {
  border-color: var(--color-primary-45);
}

.btn--block { width: 100%; }

/* =========================
   Header
   ========================= */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--color-white-88);
  backdrop-filter: blur(7px);
  border-bottom: 1px solid var(--color-primary-8);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-s);
  height: 72px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-md);
}
.brand__mark { height: 26px; width: auto; }
.brand__wordmark { height: 20px; width: auto; }

.main-nav {
  display: none;
  align-items: center;
  gap: var(--space-m);
}
.main-nav__link {
  font-weight: 500;
  font-size: var(--fs-15);
  color: var(--color-primary);
  transition: color var(--transition-base);
}
.main-nav__link:hover,
.main-nav__link:focus-visible { color: var(--color-accent); }

.header-cta { display: none; }

.nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-xs);
}
.nav-toggle span,
.nav-toggle::before,
.nav-toggle::after {
  content: '';
  display: block;
  width: 20px;
  height: 2px;
  background: var(--color-primary);
  position: relative;
  transition: transform var(--transition-base);
}
.nav-toggle::before { position: absolute; transform: translateY(-6px); }
.nav-toggle::after { position: absolute; transform: translateY(6px); }

@media (min-width: 1024px) {
  .main-nav { display: flex; }
  .header-cta { display: inline-flex; }
  .nav-toggle { display: none; }
}

.mobile-nav {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  padding: var(--space-s) 20px 24px;
  border-top: 1px solid var(--color-primary-8);
}
.mobile-nav[hidden] { display: none; }
.mobile-nav__link {
  font-weight: 500;
  font-size: var(--fs-15);
  color: var(--color-primary);
}

@media (min-width: 1024px) {
  .mobile-nav { display: none !important; }
}

/* =========================
   Hero (section#inicio)
   ========================= */
#inicio {
  display: flex;
  align-items: center;
  min-height: calc(100vh - 73px);
}

#inicio .container {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: var(--space-m);
}

@media (min-width: 1024px) {
  #inicio .container {
    grid-template-columns: minmax(0, 620px) minmax(0, 504px);
    justify-content: center;
    gap: var(--space-4xl);
  }
}

.hero__content { max-width: 620px; }

.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  background: var(--color-surface-1);
  border-radius: var(--radius-pill);
  padding: 7px 16px 7px 10px;
  margin-bottom: var(--space-2xl);
}
.hero__badge img { height: 13px; width: auto; }
.hero__badge span {
  font-weight: 600;
  font-size: var(--fs-12_5);
  letter-spacing: 0.75px;
  text-transform: uppercase;
  color: var(--color-primary);
}

.hero__lede { margin-bottom: var(--space-2xl); }

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xl);
}

.hero__media {
  position: relative;
  width: 100%;
  max-width: 504px;
}
.hero__media-frame {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-card-light);
  background: var(--color-surface-2);
  aspect-ratio: 504 / 523;
}
.hero__media-frame img { width: 100%; height: 100%; object-fit: cover; }

.hero__tag {
  position: absolute;
  display: flex;
  align-items: center;
  gap: var(--space-md);
  background: var(--color-white);
  border-radius: 14px;
  padding: 12px 18px;
  box-shadow: var(--shadow-badge);
  top: -18px;
  left: -16px;
  font-weight: 600;
  font-size: var(--fs-13_5);
}
.hero__tag-dot {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-xs);
  background: var(--color-success);
}

.hero__sla {
  position: absolute;
  background: var(--color-primary);
  color: var(--color-white);
  border-radius: 14px;
  padding: 13px 18px;
  box-shadow: var(--shadow-panel);
  bottom: 30px;
  right: -14px;
}
.hero__sla-label {
  display: block;
  font-weight: 600;
  font-size: var(--fs-11);
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: var(--color-info);
  margin-bottom: var(--space-xxxs);
}
.hero__sla-value {
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-17);
}

/* =========================
   Problema (fundo azul)
   ========================= */
#problema { background: var(--color-primary); }
#problema h2 { max-width: 760px; }
#problema .lede { color: var(--color-surface-2-75); margin-bottom: var(--space-m); }

.problema-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-s);
}
@media (min-width: 640px) {
  .problema-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .problema-grid { grid-template-columns: repeat(5, 1fr); }
}

.problema-card {
  background: var(--color-white-5);
  border: 1px solid var(--color-info-22);
  border-radius: var(--radius-md);
  padding: 27px 25px;
  transition: background-color var(--transition-base);
}
.problema-card:hover { background: var(--color-white-10); }
.problema-card__number {
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-13);
  letter-spacing: 1.04px;
  color: var(--color-danger);
  margin-bottom: var(--space-lg);
}
.problema-card__title {
  font-weight: 600;
  font-size: var(--fs-17);
  color: var(--color-white);
  line-height: var(--lh-22_95);
  margin-bottom: var(--space-xs);
}
.problema-card__text {
  font-size: var(--fs-14);
  line-height: var(--lh-21_7);
  color: var(--color-surface-2-68);
}

/* =========================
   Solução
   ========================= */
#solucao .container {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-m);
  align-items: center;
}

@media (min-width: 1024px) {
  #solucao .container {
    grid-template-columns: minmax(0, 560px) minmax(0, 544px);
    justify-content: center;
    gap: var(--space-4xl);
  }
}
.solucao__content { max-width: 560px; }
#solucao .eyebrow { color: var(--color-accent); }

.solucao-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
  margin-top: var(--space-2xl);
}
.solucao-list li {
  display: flex;
  align-items: center;
  gap: var(--space-s);
}
.solucao-list__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-sm);
  background: var(--color-surface-2);
  flex-shrink: 0;
}
.solucao-list__icon img { width: 14px; height: auto; }
.solucao-list span:last-child {
  font-weight: 600;
  font-size: var(--fs-17);
  color: var(--color-primary);
}

.solucao__media {
  position: relative;
  width: 100%;
  max-width: 544px;
  margin-inline: auto;
}
.solucao__media-frame {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  background: var(--color-surface-2);
  aspect-ratio: 544 / 600;
}
.solucao__media-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }

.dashboard-card {
  display: none;
  position: absolute;
  left: -24px;
  top: 50%;
  transform: translateY(-50%);
  width: min(442px, calc(100% + 48px));
  background: var(--color-white);
  border: 1px solid var(--color-primary-7);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card-elevated);
  overflow: hidden;
}
@media (min-width: 768px) {
  .dashboard-card { display: block; }
}
.dashboard-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px 15px;
  border-bottom: 1px solid var(--color-primary-8);
}
.dashboard-card__header-title {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-weight: 600;
  font-size: var(--fs-13);
}
.dashboard-card__header-title img { width: 14px; height: auto; }
.dashboard-card__live {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  background: var(--color-success-bg);
  color: var(--color-success-dark);
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  font-weight: 600;
  font-size: var(--fs-11);
}
.dashboard-card__live-dot {
  width: 6px; height: 6px; border-radius: 3px; background: var(--color-success);
}
.dashboard-card__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: var(--color-primary-8);
  gap: 1px;
}
.dashboard-card__stat {
  background: var(--color-white);
  padding: 16px 14px 14px 20px;
}
.dashboard-card__stat-label {
  display: block;
  font-weight: 500;
  font-size: var(--fs-11);
  letter-spacing: 0.66px;
  text-transform: uppercase;
  color: var(--color-primary-55);
  margin-bottom: var(--space-xxs);
}
.dashboard-card__stat-value {
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-24);
  color: var(--color-primary);
}
.dashboard-card__bars {
  padding: 19px 20px 20px;
  border-top: 1px solid var(--color-primary-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}
.dashboard-card__bars-title {
  font-weight: 600;
  font-size: var(--fs-12);
  letter-spacing: 0.72px;
  text-transform: uppercase;
  color: var(--color-primary-55);
  margin-bottom: var(--space-xxs);
}
.dashboard-bar {
  display: flex;
  align-items: center;
  gap: var(--space-lg);
}
.dashboard-bar__label {
  width: 110px;
  flex-shrink: 0;
  font-weight: 500;
  font-size: var(--fs-13);
  color: var(--color-primary);
}
.dashboard-bar__track {
  flex: 1;
  height: 8px;
  background: var(--color-surface-3);
  border-radius: var(--radius-pill);
  overflow: hidden;
}
.dashboard-bar__fill {
  display: block;
  width: 0;
  height: 100%;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  transition: width 0.8s cubic-bezier(0.65, 0, 0.35, 1);
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-bar__fill { transition: none; }
}
.dashboard-bar__value {
  width: 30px;
  flex-shrink: 0;
  text-align: right;
  font-weight: 600;
  font-size: var(--fs-12_5);
  color: var(--color-primary-60);
}

/* =========================
   AuriCoins
   ========================= */
#auricoins { background: var(--color-surface-2); }
#auricoins .container { display: flex; flex-direction: column; gap: var(--space-3xl); }
.auricoins-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-m);
  align-items: center;
}

@media (min-width: 1024px) {
  .auricoins-row {
    grid-template-columns: minmax(0, 624px) minmax(0, 484px);
    justify-content: center;
    gap: var(--space-4xl);
  }
}

.auricoins__content { max-width: 624px; }

.auricoins-steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
  margin-top: var(--space-2xl);
}
.auricoins-step {
  display: flex;
  gap: var(--space-2xl);
  background: var(--color-white);
  border-radius: var(--radius-lg);
  padding: 22px 26px;
  box-shadow: 0px 12px 16px rgba(0, 35, 119, 0.08);
}
.auricoins-step__number {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: var(--space-lg);
  background: var(--color-surface-2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-14);
  color: var(--color-accent);
}
.auricoins-step__title {
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-19);
  letter-spacing: -0.19px;
  color: var(--color-primary);
  margin-bottom: var(--space-xxs);
}
.auricoins-step__text {
  font-size: var(--fs-15);
  line-height: var(--lh-23_25);
  color: var(--color-primary-68);
}

.auricoins__media {
  width: 100%;
  max-width: 484px;
}
.auricoins__media-frame {
  aspect-ratio: 440 / 506;
  background: var(--color-info-bg);
  border-radius: var(--radius-2xl);
  box-shadow: 0px 24px 60px rgba(0, 35, 119, 0.12);
  overflow: hidden;
  display: flex;
}
.auricoins__media-frame img { width: 100%; height: 100%; object-fit: cover; }

.auricoins-highlights {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-xl);
  text-align: center;
}
.auricoins-highlights strong {
  font-family: var(--font-emphasis);
  font-weight: 700;
  font-size: var(--fs-21);
  color: var(--color-primary);
}
.auricoins-highlights .dot {
  width: 7px; height: 7px; border-radius: 3.5px; background: var(--color-accent);
}

.auricoins-cta { display: flex; justify-content: center; }
.auricoins-cta .btn { width: 100%; max-width: 420px; }

/* =========================
   Serviços
   ========================= */
.servicos-header h2 { max-width: 640px; }
.servicos-header p.lede { max-width: 60ch; margin-bottom: var(--space-m); }

.servicos-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-s);
}
@media (min-width: 640px) {
  .servicos-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .servicos-grid { grid-template-columns: repeat(4, 1fr); }
}

.servico-card {
  height: 200px;
  background: var(--color-white);
  border: 1px solid var(--color-primary-12);
  border-radius: var(--radius-md);
  padding: 25px;
  box-shadow: 0px 12px 16px rgba(0, 35, 119, 0.08);
  transition: border-color var(--transition-base), box-shadow var(--transition-base);
}
.servico-card:hover {
  border-color: var(--color-info);
  box-shadow: 0px 14px 17px rgba(0, 35, 119, 0.1);
}
.servico-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-s);
  margin-bottom: var(--space-md);
}
.servico-card__title {
  font-weight: 600;
  font-size: var(--fs-17);
  color: var(--color-primary);
}
.servico-card__head img { width: 13px; height: auto; opacity: 0.85; }
.servico-card__text {
  font-size: var(--fs-14_5);
  line-height: var(--lh-22_48);
  color: var(--color-primary-66);
  margin-bottom: var(--space-lg);
}
.servico-card__tag {
  font-weight: 600;
  font-size: var(--fs-12);
  letter-spacing: 0.72px;
  text-transform: uppercase;
}
.servico-card__tag--async { color: var(--color-accent); }
.servico-card__tag--sync { color: var(--color-primary); }
.servico-card__tag--coverage { color: var(--color-danger); }

.servico-card--illustration {
  height: 200px;
  background: var(--color-info-bg);
  border: none;
  box-shadow: none;
  display: flex;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
}
.servico-card--illustration img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* =========================
   Contato / formulário
   ========================= */
#contato { background: var(--color-primary); }
#contato .container {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-m);
  align-items: start;
}

@media (min-width: 1024px) {
  #contato .container {
    grid-template-columns: minmax(0, 544px) minmax(0, 564px);
    justify-content: center;
    gap: var(--space-4xl);
  }
}

.contato__content { max-width: 544px; }
#contato .eyebrow { color: var(--color-info); }
#contato .lede { color: var(--color-surface-2-78); margin-bottom: var(--space-s); }

.contato-highlights {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
  margin-top: var(--space-s);
}
.contato-highlights li {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  font-weight: 500;
  font-size: var(--fs-15);
  color: var(--color-surface-2-85);
}
.contato-highlights .dot {
  width: 6px; height: 6px; border-radius: 3px; background: var(--color-danger); flex-shrink: 0;
}

.contact-form {
  width: 100%;
  max-width: 564px;
  background: var(--color-white);
  border-radius: var(--radius-xl);
  padding: 28px 22px;
  box-shadow: var(--shadow-form);
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}
@media (min-width: 640px) {
  .contact-form { padding: 38px; }
}

.contact-form__title {
  font-family: var(--font-heading);
  font-size: var(--fs-27);
  color: var(--color-primary);
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-xl);
}
@media (min-width: 640px) {
  .form-grid { grid-template-columns: 1fr 1fr; }
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.form-field label {
  font-weight: 600;
  font-size: var(--fs-13);
  color: var(--color-primary-75, rgba(0, 35, 119, 0.75));
}
.form-field input,
.form-field textarea {
  background: var(--color-white);
  border: 1px solid var(--color-primary-18);
  border-radius: var(--space-lg);
  padding: 14px 17px;
  font-size: var(--fs-15);
  color: var(--color-primary);
  transition: border-color var(--transition-base);
}
.form-field input::placeholder,
.form-field textarea::placeholder {
  color: var(--color-primary-38);
}
.form-field input:focus,
.form-field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
}
.form-field textarea {
  resize: vertical;
  min-height: 110px;
}

.form-error {
  font-size: var(--fs-12);
  color: var(--color-danger);
  min-height: 1em;
}

.form-footnote {
  text-align: center;
  font-size: var(--fs-13);
  color: var(--color-primary-55);
}
.form-footnote a {
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: underline;
}
.form-legal {
  text-align: center;
  font-size: var(--fs-12);
  color: var(--color-primary-45);
}

.form-status {
  font-size: var(--fs-14);
  text-align: center;
  min-height: 1.2em;
}
.form-status--success { color: var(--color-success-dark); }
.form-status--error { color: var(--color-danger); }

/* =========================
   Footer
   ========================= */
.site-footer {
  background: var(--color-primary-dark);
  border-top: 1px solid var(--color-info-18);
  color: var(--color-white);
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-m);
  padding-block: 48px 36px;
}
@media (min-width: 768px) {
  .site-footer__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
}
.footer-brand__logo { height: 30px; width: auto; margin-bottom: var(--space-lg); }
.footer-brand p {
  font-size: var(--fs-14_5);
  line-height: var(--lh-23_9);
  color: var(--color-surface-2-70);
  max-width: 380px;
  margin-bottom: var(--space-lg);
}
.footer-brand__tagline {
  font-weight: 600;
  font-size: var(--fs-13);
  letter-spacing: 0.65px;
  color: var(--color-info);
}
.footer-col__title {
  font-weight: 600;
  font-size: var(--fs-12);
  letter-spacing: 1.44px;
  text-transform: uppercase;
  color: var(--color-info-80);
  margin-bottom: var(--space-lg);
}
.footer-col ul {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}
.footer-col a,
.footer-col span {
  font-size: var(--fs-14_5);
  color: var(--color-surface-2-80);
  transition: color var(--transition-base);
}
.footer-col a:hover { color: var(--color-white); }

.site-footer__bottom {
  border-top: 1px solid var(--color-info-14);
}
.site-footer__bottom-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-s);
  padding-block: 20px;
  font-size: var(--fs-13);
  color: var(--color-surface-2-55);
}
.site-footer__legal {
  display: flex;
  gap: 24px;
}
.site-footer__legal a,
.site-footer__cookie-link {
  color: var(--color-surface-2-70);
  transition: color var(--transition-base);
}
.site-footer__legal a:hover,
.site-footer__cookie-link:hover { color: var(--color-white); }

.site-footer__cookie-link {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
}

/* =========================
   Páginas legais (Política de Privacidade / LGPD)
   ========================= */
.legal { padding-block: 64px 96px; }
.legal__container { max-width: 760px; }

.legal__title {
  font-size: clamp(2rem, 1.6rem + 1.2vw, 2.75rem);
  margin-bottom: var(--space-xs);
}

.legal__updated {
  font-size: var(--fs-14);
  color: var(--color-primary-55);
  margin-bottom: var(--space-m);
}

.legal p {
  font-size: var(--fs-16);
  line-height: 1.7;
  color: var(--color-primary-72);
  margin-bottom: var(--space-s);
}

.legal h2 {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-21);
  color: var(--color-primary);
  margin-top: var(--space-3xl);
  margin-bottom: var(--space-md);
}

.legal ul {
  margin: 0 0 var(--space-s) 0;
  padding-left: 1.25em;
  list-style: disc;
}
.legal ul li {
  font-size: var(--fs-16);
  line-height: 1.7;
  color: var(--color-primary-72);
  margin-bottom: var(--space-xs);
}

.legal a {
  color: var(--color-primary);
  text-decoration: underline;
}

/* =========================
   Cookie banner
   ========================= */
.cookie-banner {
  position: fixed;
  left: 20px;
  right: 20px;
  bottom: 20px;
  z-index: 100;
  max-width: 720px;
  margin-inline: auto;
  background: var(--color-white);
  border: 1px solid var(--color-primary-18);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card-elevated);
  padding: var(--space-2xl);
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
}
.cookie-banner__text {
  font-size: var(--fs-14);
  line-height: 1.6;
  color: var(--color-primary-72);
}
.cookie-banner__text a {
  color: var(--color-primary);
  text-decoration: underline;
}
.cookie-banner__actions {
  display: flex;
  gap: var(--space-s);
  justify-content: flex-end;
}
.cookie-banner__actions .btn {
  padding: 10px 20px;
  font-size: var(--fs-14);
}
@media (min-width: 640px) {
  .cookie-banner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-m);
  }
  .cookie-banner__actions { flex-shrink: 0; }
}

/* =========================
   Utilitário: reveal (GSAP hook)
   ========================= */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
}
.no-js [data-reveal] {
  opacity: 1;
  transform: none;
}