:root {
  --brand-green: #1E4D2B;
  --brand-accent: #b8d8bf;
  --green: var(--brand-green);
  --green-dark: #173d22;
  --green-soft: #e8f0ea;
  --forest: var(--brand-green);
  --lime: var(--brand-accent);
}

/* Se presenta el PNG original, conservando su proporción y su fondo. */
.brand-logo {
  position: relative;
  display: inline-block;
  flex: none;
  width: 160px;
  height: 50px;
  overflow: hidden;
  border-radius: 6px;
  background: var(--brand-green);
  vertical-align: middle;
}
.brand-logo img {
  position: absolute;
  top: 50%;
  left: -15%;
  width: 130%;
  max-width: none;
  height: auto;
  transform: translateY(-50%);
}
.btn-green { color: #fff; box-shadow: 0 10px 26px #1e4d2b26; }
.btn-green:hover { background: var(--green-dark); }
.steps b, .shop-logo, .float-sale .ico, .faq details[open] summary::after { color: #fff; }
.hero h1 em, .hero-checks li::before, .kicker-light, .big-number,
.closing h2 em, .footer nav a:hover, .side-title em, .side-points li::before,
.badge { color: var(--brand-accent) !important; }
.dot { background: var(--brand-accent); box-shadow: 0 0 0 5px #b8d8bf33; }
.auth-story { background: linear-gradient(145deg, #173d22, var(--brand-green)); }
.auth-story-kicker { margin-top: 48px; color: var(--brand-accent); }
/* El encabezado comparte el fondo del logo original. */
.nav, .topbar, .signup-top { background: var(--brand-green); color: #fff; }
.nav .logo, .nav-links a, .nav-login, .topbar nav a,
.topbar nav a[aria-current=page], .signup-top a, .signup-top > span { color: #fff; }
.nav-links a:hover, .nav-login:hover, .signup-top a:hover { color: var(--brand-accent); }
.nav .btn-green { background: #fff; color: var(--brand-green); box-shadow: none; }
.nav .btn-green:hover { background: var(--green-soft); }
.topbar { padding: 14px 18px; border-radius: 16px; }
.topbar .quiet, .topbar .store-chip { background: var(--green-soft); color: var(--brand-green); }
.signup-top { padding: 12px 20px; border-radius: 16px; }
.options button:disabled { opacity: .6; cursor: default; }
.legal-document { max-width: 820px; margin: 40px auto; padding: clamp(22px, 4vw, 48px); background: #fff; border-radius: 20px; line-height: 1.75; }
.legal-document h1 { font-size: clamp(30px, 5vw, 46px); line-height: 1.15; }
.legal-document h2 { margin-top: 32px; font-size: 22px; line-height: 1.35; }
.legal-document a { color: var(--brand-green); text-decoration: underline; }
.legal-date { color: #5f6661; font-size: 14px; }
@media (max-width: 800px) {
  .auth-story { padding-top: 90px; }
  .auth-story-kicker { margin-top: 0; }
}
@media (max-width: 480px) {
  .brand-logo { width: 140px; height: 44px; }
}
