html { scroll-behavior: smooth; }
body { background: #F7FAF5; overflow-x: hidden; }
body,
main,
section {
  color: #071B14;
}
.mobile-centered {
  width: calc(100vw - 32px) !important;
  max-width: 430px;
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative;
  left: auto;
  transform: none;
}
.hero-center-wrap {
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  padding: 16px 0;
  background: #F7FAF5;
}
.hero-card-centered {
  width: calc(100% - 32px);
  max-width: 430px;
  box-sizing: border-box;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .mobile-centered {
    width: min(100% - 32px, 80rem) !important;
    max-width: 80rem;
    margin-left: auto;
    margin-right: auto;
    left: auto;
    transform: none;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .hero-center-wrap {
    padding: 32px 0;
  }
  .hero-card-centered {
    width: min(100% - 32px, 80rem);
    max-width: 80rem;
  }
}
.glass { background: rgba(255,255,255,.9); backdrop-filter: blur(18px); }
.soft-shadow { box-shadow: 0 22px 70px rgba(3, 36, 27, .16); }
.lift-shadow { box-shadow: 0 18px 50px rgba(3, 36, 27, .12); }
.gold-line { background: linear-gradient(90deg, #D6B25E, #0B513D); height: 3px; width: 72px; border-radius: 99px; }
.hero-bg {
  background:
    linear-gradient(135deg, rgba(4, 38, 28, .97), rgba(7, 75, 55, .9) 52%, rgba(2, 20, 15, .92)),
    url('https://images.unsplash.com/photo-1591604129939-f1efa4d9f7fa?auto=format&fit=crop&w=1800&q=80') center/cover;
}
.safe-card {
  border: 1px solid rgba(11, 81, 61, .12);
  border-radius: 8px;
}
.premium-card {
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FBF6 100%);
  border: 1px solid rgba(11, 81, 61, .1);
  border-radius: 8px;
}
.dark-panel {
  background: linear-gradient(145deg, #04261C 0%, #0B513D 100%);
}
.gold-panel {
  background: linear-gradient(135deg, #F9E7AE 0%, #D6B25E 45%, #9C7421 100%);
}
.premium-surface {
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,246,.94)),
    radial-gradient(circle at 80% 0%, rgba(214,178,94,.18), transparent 32%);
}
.subtle-grid {
  background-image:
    linear-gradient(rgba(214,178,94,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(214,178,94,.08) 1px, transparent 1px);
  background-size: 34px 34px;
}
.app-shell {
  min-height: 100svh;
  padding-bottom: 76px;
}
.app-topbar {
  box-shadow: 0 10px 30px rgba(3, 36, 27, .18);
}
.bottom-nav {
  box-shadow: 0 -18px 45px rgba(3, 36, 27, .14);
}
.bottom-nav a {
  min-width: 58px;
}
.nav-icon {
  display: grid;
  height: 24px;
  place-items: center;
  font-size: 17px;
  line-height: 1;
}
.fab-whatsapp {
  box-shadow: 0 18px 48px rgba(11, 81, 61, .35);
}
.mobile-app-card {
  border-radius: 18px;
}
.app-pill {
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
}
.text-muted-on-dark { color: rgba(255,255,255,.86); }
.text-soft-on-dark { color: rgba(255,255,255,.74); }
.text-muted-on-light { color: #475569; }
.contrast-text { color: #0B1F18; }
.hero-bg {
  color: #FFFFFF;
}
.dark-panel,
.dark-panel p,
.dark-panel h1,
.dark-panel h2,
.dark-panel h3,
.dark-panel b {
  color: #FFFFFF;
}
.dark-panel .text-gold {
  color: #FFE29A !important;
}
.premium-card,
.premium-card p,
.premium-card h1,
.premium-card h2,
.premium-card h3,
.premium-card b,
.premium-surface,
.premium-surface p,
.premium-surface b {
  color: #071B14;
}
.premium-card .text-emeraldx,
.premium-surface .text-emeraldx {
  color: #064333 !important;
}
.premium-card .text-gold,
.premium-surface .text-gold {
  color: #8A5F08 !important;
}
.gold-panel,
.gold-panel p,
.gold-panel h2,
.gold-panel b {
  color: #071B14 !important;
}
.bottom-nav,
.bottom-nav a,
.bottom-nav span {
  color: #071B14;
}
.bottom-nav a.text-emeraldx {
  color: #064333 !important;
}
.hero-bg .bg-white\/10,
.dark-panel .bg-white\/10,
.hero-bg .bg-white\/5,
.dark-panel .bg-white\/5 {
  background-color: rgba(255,255,255,.18);
}
.light-panel,
.light-panel p,
.light-panel span,
.light-panel b,
.light-panel div {
  color: #071B14 !important;
}
.light-panel a,
.light-panel button {
  color: #FFFFFF !important;
}
.light-panel .text-emeraldx {
  color: #064333 !important;
}
.light-panel .text-gold {
  color: #8A5F08 !important;
}
.hero-bg .bg-white,
.hero-bg .bg-white *,
.hero-bg .premium-surface,
.hero-bg .premium-surface *,
.hero-bg .light-panel,
.hero-bg .light-panel * {
  color: #071B14 !important;
}
.bg-emeraldx,
.bg-emeraldx *,
a.bg-emeraldx,
button.bg-emeraldx {
  color: #FFFFFF !important;
}
.bg-gold,
.bg-gold *,
a.bg-gold,
button.bg-gold {
  color: #FFFFFF !important;
}
.bg-deep,
.bg-deep *,
.dark-panel .bg-deep,
.dark-panel .bg-deep * {
  color: #FFFFFF !important;
}
.bg-white,
.bg-white *,
.premium-card,
.premium-card *,
.premium-surface,
.premium-surface *,
.light-panel,
.light-panel *,
.bg-emerald-50,
.bg-emerald-50 *,
.bg-slate-50,
.bg-slate-50 * {
  color: #071B14 !important;
}
.bg-white a:not(.bg-emeraldx):not(.bg-deep):not(.bg-gold),
.premium-card a:not(.bg-emeraldx):not(.bg-deep):not(.bg-gold),
.light-panel a:not(.bg-emeraldx):not(.bg-deep):not(.bg-gold) {
  color: #064333 !important;
}
.bg-emeraldx,
.bg-emeraldx *,
a.bg-emeraldx,
a.bg-emeraldx *,
button.bg-emeraldx,
button.bg-emeraldx * {
  color: #FFFFFF !important;
}
.dark-panel,
.dark-panel *,
.hero-bg > div > div:first-child,
.hero-bg > div > div:first-child * {
  color: #FFFFFF !important;
}
.dark-panel .text-gold,
.hero-bg .text-gold,
.bg-deep .text-gold {
  color: #FFE29A !important;
}
.bg-emeraldx,
.bg-emeraldx *,
a.bg-emeraldx,
a.bg-emeraldx *,
button.bg-emeraldx,
button.bg-emeraldx * {
  color: #FFFFFF !important;
}
.bg-gold,
.bg-gold *,
a.bg-gold,
a.bg-gold *,
button.bg-gold,
button.bg-gold * {
  color: #FFFFFF !important;
}
button,
a.bg-emeraldx,
a.bg-gold,
a.rounded-full,
button.rounded-full,
.fab-whatsapp {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
.bg-white .text-white,
.premium-card .text-white,
.premium-surface .text-white,
.light-panel .text-white,
.bg-emerald-50 .text-white {
  color: #071B14 !important;
}
.light-panel [data-countdown],
.premium-surface [data-countdown] {
  color: #064333 !important;
  -webkit-text-fill-color: #064333 !important;
}
.premium-surface .light-panel,
.premium-surface .light-panel *,
.phone-screen .premium-surface,
.phone-screen .premium-surface * {
  color: #061711 !important;
  -webkit-text-fill-color: #061711 !important;
}
.phone-screen .premium-surface [style*="064333"],
.phone-screen .premium-surface [data-countdown] {
  color: #064333 !important;
  -webkit-text-fill-color: #064333 !important;
}
.search-input,
.search-input:focus,
input.search-input,
input.search-input:focus {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  caret-color: #064333;
}
.search-input::placeholder {
  color: #111827 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #111827 !important;
}
input,
select,
textarea {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background-color: #FFFFFF;
}
input::placeholder,
textarea::placeholder {
  color: currentColor !important;
  opacity: 1 !important;
  -webkit-text-fill-color: currentColor !important;
}
@media (min-width: 768px) {
  .app-shell { padding-bottom: 0; }
  .mobile-app-card { border-radius: 8px; }
}
.phone-frame {
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 34px;
  background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.06));
  padding: 10px;
}
.phone-screen {
  border-radius: 26px;
  overflow: hidden;
  background: #F7FAF5;
}
.shine {
  position: relative;
  overflow: hidden;
}
.shine::after {
  content: "";
  position: absolute;
  inset: -80% auto auto -30%;
  width: 46%;
  height: 220%;
  transform: rotate(24deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  animation: shine 5.5s ease-in-out infinite;
}
.float-slow { animation: float-slow 6s ease-in-out infinite; }
.fade-up { animation: fade-up .7s ease both; }
@keyframes shine {
  0%, 55% { left: -45%; }
  100% { left: 130%; }
}
@keyframes float-slow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .shine::after, .float-slow, .fade-up { animation: none; }
}

/* Final contrast guard: keep light surfaces readable even inside dark/hero sections. */
html body .bg-white,
html body .bg-white *,
html body .premium-card,
html body .premium-card *,
html body .premium-surface,
html body .premium-surface *,
html body .light-panel,
html body .light-panel *,
html body .bg-emerald-50,
html body .bg-emerald-50 * {
  color: #061711 !important;
}

html body .bg-emeraldx,
html body .bg-emeraldx *,
html body a.bg-emeraldx,
html body button.bg-emeraldx {
  color: #FFFFFF !important;
}

html body .bg-gold,
html body .bg-gold *,
html body a.bg-gold,
html body button.bg-gold {
  color: #061711 !important;
}

html body .dark-panel > *:not(.bg-white):not(.premium-card):not(.premium-surface):not(.light-panel),
html body .hero-bg > div > div:first-child > * {
  color: #FFFFFF !important;
}
