/* ============================================================
   KEY App — Landing v2 (European-app style)
   Scoped to .public-landing ONLY. Safe & reversible.
   ============================================================ */

.public-landing {
  background: #ffffff !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 32px 60px !important;
  color: var(--text, #0f1f1c) !important;
}
[data-theme="dark"] .public-landing {
  background: #0a1411 !important;
}

/* Hide decorative / unused blocks */
.public-landing .landing-eyebrow,
.public-landing .landing-live-dot,
.public-landing .landing-search,
.public-landing .landing-hero-visual,
.public-landing .landing-how,
.public-landing .landing-orb,
.public-landing .landing-glass-card {
  display: none !important;
}

/* Header */
.public-landing .landing-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  height: 72px !important;
  padding: 0 !important;
  border-bottom: 1px solid rgba(15,31,28,.08) !important;
  margin: 0 0 72px 0 !important;
}
[data-theme="dark"] .public-landing .landing-nav {
  border-bottom-color: rgba(255,255,255,.08) !important;
}
.public-landing .landing-brand {
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: 3px !important;
  color: var(--text) !important;
}
.public-landing .landing-brand-mark {
  width: 32px !important; height: 32px !important;
  border-radius: 9px !important;
  background: var(--primary, #0EA67D) !important;
  color: #fff !important;
  box-shadow: none !important;
  font-weight: 800 !important;
  font-size: 15px !important;
}
.public-landing .landing-nav-actions { gap: 8px !important; }
.public-landing .landing-icon-btn {
  width: 40px !important; height: 40px !important;
  border-radius: 10px !important;
  background: transparent !important;
  border: 1px solid rgba(15,31,28,.08) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}
.public-landing .landing-login-btn {
  padding: 0 18px !important; height: 40px !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: var(--text) !important;
  font-weight: 700 !important; font-size: 14px !important;
  border: 1px solid rgba(15,31,28,.08) !important;
  box-shadow: none !important;
}
.public-landing .landing-signup-btn {
  padding: 0 20px !important; height: 40px !important;
  border-radius: 10px !important;
  background: var(--primary, #0EA67D) !important;
  color: #fff !important;
  font-weight: 700 !important; font-size: 14px !important;
  border: 0 !important; box-shadow: none !important;
}

/* Hero */
.public-landing .landing-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 80px !important;
  align-items: center !important;
  min-height: auto !important;
  padding: 0 0 90px !important;
  max-width: none !important;
}
.public-landing .landing-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  max-width: 560px !important;
}
.public-landing .landing-hero h1 {
  font-size: clamp(36px, 4.4vw, 56px) !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  letter-spacing: -1.5px !important;
  margin: 0 !important;
  color: var(--text) !important;
}
.public-landing .landing-hero h1 span {
  background: none !important;
  -webkit-text-fill-color: var(--primary, #0EA67D) !important;
  color: var(--primary, #0EA67D) !important;
}
.public-landing .landing-hero-copy > p {
  font-size: 17px !important;
  line-height: 1.9 !important;
  color: var(--muted) !important;
  margin: 0 !important;
  max-width: 520px !important;
}
.public-landing .landing-quick-links {
  display: flex !important;
  gap: 12px !important;
  margin: 8px 0 0 !important;
}
.public-landing .landing-quick-links button:first-child {
  background: var(--primary, #0EA67D) !important;
  color: #fff !important;
  border: 0 !important;
  padding: 15px 28px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  box-shadow: none !important;
  min-height: 52px !important;
}
.public-landing .landing-quick-links button:last-child {
  display: none !important;
}

/* Trust row */
.public-landing .landing-trust-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0 !important;
  border: 1px solid rgba(15,31,28,.08) !important;
  border-radius: 18px !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
  margin: 0 0 90px !important;
}
[data-theme="dark"] .public-landing .landing-trust-row {
  border-color: rgba(255,255,255,.08) !important;
}
.public-landing .landing-trust-row > div {
  padding: 26px 22px !important;
  border-right: 1px solid rgba(15,31,28,.08) !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
[data-theme="dark"] .public-landing .landing-trust-row > div {
  border-right-color: rgba(255,255,255,.08) !important;
}
.public-landing .landing-trust-row > div:last-child { border-right: 0 !important; }
.public-landing .landing-trust-row b { font-size: 14px !important; color: var(--text) !important; }
.public-landing .landing-trust-row small { font-size: 12px !important; color: var(--muted) !important; }
.public-landing .landing-trust-row > div > span {
  background: rgba(14,166,125,.1) !important;
  color: var(--primary) !important;
  border-radius: 10px !important;
  width: 36px !important; height: 36px !important;
}

/* Categories */
.public-landing .landing-section { padding: 0 0 90px !important; }
.public-landing .landing-section-heading { margin-bottom: 28px !important; }
.public-landing .landing-section-heading > div > span {
  color: var(--primary) !important;
  font-size: 13px !important; font-weight: 700 !important;
}
.public-landing .landing-section-heading h2 {
  font-size: 30px !important;
  letter-spacing: -.8px !important;
  font-weight: 800 !important;
}
.public-landing .landing-section-heading > button {
  color: var(--primary) !important;
  font-weight: 700 !important;
}
.public-landing .landing-category-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 12px !important;
}
.public-landing .landing-category-grid button {
  min-height: 128px !important;
  padding: 20px 18px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(15,31,28,.08) !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--text) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  text-align: right !important;
  transition: border-color .18s ease, transform .18s ease !important;
}
[data-theme="dark"] .public-landing .landing-category-grid button {
  background: rgba(20,33,29,.6) !important;
  border-color: rgba(255,255,255,.08) !important;
}
.public-landing .landing-category-grid button:hover {
  border-color: var(--primary) !important;
  transform: translateY(-2px) !important;
  box-shadow: none !important;
}
.public-landing .landing-category-grid button > span:first-child { font-size: 22px !important; }
.public-landing .landing-category-grid b { font-size: 15px !important; font-weight: 700 !important; }
.public-landing .landing-category-grid small { font-size: 12px !important; color: var(--muted) !important; }

/* Final CTA */
.public-landing .landing-final-cta {
  display: block !important;
  text-align: center !important;
  padding: 72px 32px !important;
  border-radius: 22px !important;
  background: rgba(14,166,125,.06) !important;
  border: 1px solid rgba(14,166,125,.14) !important;
  color: var(--text) !important;
  margin: 0 0 40px !important;
  box-shadow: none !important;
}
.public-landing .landing-final-cta h2 {
  color: var(--text) !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  letter-spacing: -.8px !important;
  margin: 0 auto 26px !important;
  max-width: 640px !important;
}
.public-landing .landing-final-cta button {
  background: var(--primary, #0EA67D) !important;
  color: #fff !important;
  border: 0 !important;
  padding: 16px 30px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  min-height: 52px !important;
  box-shadow: none !important;
}

/* Footer */
.public-landing .landing-footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 22px 0 !important;
  border-top: 1px solid rgba(15,31,28,.08) !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  margin: 0 !important;
}
[data-theme="dark"] .public-landing .landing-footer {
  border-top-color: rgba(255,255,255,.08) !important;
}
.public-landing .landing-footer span:first-child {
  color: var(--primary) !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
}

/* Responsive */
@media (max-width: 900px) {
  .public-landing { padding: 0 20px 40px !important; }
  .public-landing .landing-nav { margin-bottom: 44px !important; height: 64px !important; }
  .public-landing .landing-hero {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding-bottom: 56px !important;
  }
  .public-landing .landing-hero h1 { font-size: 38px !important; }
  .public-landing .landing-hero-copy > p { font-size: 15px !important; }
  .public-landing .landing-trust-row {
    grid-template-columns: 1fr !important;
    margin-bottom: 56px !important;
  }
  .public-landing .landing-trust-row > div {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(15,31,28,.08) !important;
  }
  .public-landing .landing-trust-row > div:last-child { border-bottom: 0 !important; }
  .public-landing .landing-category-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .public-landing .landing-final-cta { padding: 52px 22px !important; }
}
@media (max-width: 520px) {
  .public-landing { padding: 0 16px 32px !important; }
  .public-landing .landing-hero h1 { font-size: 32px !important; letter-spacing: -1px !important; }
  .public-landing .landing-section-heading h2 { font-size: 24px !important; }
}
