/* AdaWang gold/black compact theme layer. Loaded last to override older theme passes. */
:root {
  --aw-gold: #f0b90b;
  --aw-gold-2: #ffd86b;
  --aw-gold-soft: #fff7df;
  --aw-black: #05070a;
  --aw-ink: #111827;
  --aw-panel: #ffffff;
  --aw-line: #e8edf5;
  --aw-muted: #687386;
  --aw-rgb-a: #18e0ff;
  --aw-rgb-b: #a855f7;
  --aw-rgb-c: #22c55e;
  --aw-shadow: 0 14px 36px rgba(10, 12, 16, .08);
  --aw-shadow-strong: 0 24px 64px rgba(10, 12, 16, .18);
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
  color: var(--aw-ink);
  background:
    radial-gradient(circle at 8% 0%, rgba(240, 185, 11, .16), transparent 30%),
    radial-gradient(circle at 88% 7%, rgba(24, 224, 255, .10), transparent 28%),
    linear-gradient(180deg, #fffdf7 0%, #f7f8fb 46%, #ffffff 100%) !important;
}

body::before {
  background:
    linear-gradient(rgba(17, 24, 39, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 24, 39, .035) 1px, transparent 1px) !important;
  background-size: 42px 42px !important;
  opacity: .7 !important;
}

body::after {
  display: none !important;
}

a,
button,
.btn,
.nav-link,
.side-link,
.dash-action,
.mobile-action-link {
  -webkit-tap-highlight-color: transparent;
}

/* Homepage */
.navbar {
  background: rgba(5, 7, 10, .88) !important;
  border-bottom: 1px solid rgba(240, 185, 11, .22) !important;
  box-shadow: 0 12px 34px rgba(5, 7, 10, .16) !important;
  backdrop-filter: blur(18px) saturate(1.25) !important;
}

.navbar.scrolled {
  background: rgba(5, 7, 10, .94) !important;
}

.nav-logo,
.brand,
.sidebar-brand {
  min-width: 0;
}

.nav-logo-img,
.brand-logo,
.footer-logo-img {
  object-fit: contain;
}

.nav-btn-secondary,
.nav-cta,
.btn-primary,
.btn-secondary,
.btn-submit,
.btn-accent,
.btn-success-close,
.chatbot-launcher,
.chatbot-send {
  border-radius: 14px !important;
  min-height: 42px !important;
  box-shadow: none !important;
  animation: none !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

.nav-btn-secondary,
.btn-secondary {
  background: rgba(255, 255, 255, .96) !important;
  color: var(--aw-ink) !important;
  border: 1px solid rgba(240, 185, 11, .22) !important;
}

.nav-cta,
.btn-primary,
.btn-submit,
.btn-accent,
.btn-success-close,
.chatbot-launcher,
.chatbot-send,
.lang-btn.active,
.language-switch button.active,
.mobile-menu-toggle,
.mobile-action-toggle,
.btn.primary,
.nav-link.primary {
  background: linear-gradient(135deg, var(--aw-gold), var(--aw-gold-2)) !important;
  color: #101114 !important;
  border-color: transparent !important;
  box-shadow: 0 14px 32px rgba(240, 185, 11, .25) !important;
}

.nav-btn-secondary:hover,
.nav-cta:hover,
.btn-primary:hover,
.btn-secondary:hover,
.btn-submit:hover,
.btn-accent:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(5, 7, 10, .14) !important;
}

.hero {
  background:
    radial-gradient(circle at 18% 8%, rgba(240, 185, 11, .20), transparent 30%),
    radial-gradient(circle at 84% 10%, rgba(168, 85, 247, .12), transparent 28%),
    linear-gradient(180deg, #0a0d12 0%, #141821 48%, #fff9e8 49%, #ffffff 100%) !important;
  border-bottom: 1px solid rgba(240, 185, 11, .18) !important;
  padding-top: 108px !important;
}

.hero::before {
  display: block !important;
  inset: 0 !important;
  height: auto !important;
  background:
    linear-gradient(rgba(240, 185, 11, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24, 224, 255, .055) 1px, transparent 1px) !important;
  background-size: 48px 48px !important;
  mask-image: linear-gradient(180deg, #000, transparent 76%) !important;
  opacity: .55 !important;
  transform: none !important;
  animation: none !important;
}

.hero::after {
  display: block !important;
  top: 92px !important;
  height: 420px !important;
  border-radius: 26px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .04)),
    linear-gradient(120deg, rgba(240, 185, 11, .15), rgba(24, 224, 255, .07), rgba(168, 85, 247, .09)) !important;
  border: 1px solid rgba(240, 185, 11, .22) !important;
  box-shadow: 0 34px 110px rgba(0, 0, 0, .26) !important;
}

.hero-badge {
  background: rgba(240, 185, 11, .12) !important;
  color: var(--aw-gold-2) !important;
  border: 1px solid rgba(240, 185, 11, .32) !important;
  box-shadow: none !important;
  animation: awFloatGold 5.5s ease-in-out infinite !important;
}

.hero-tagline,
.hero-title,
.hero-subtitle {
  color: #fff !important;
  text-shadow: 0 14px 40px rgba(0, 0, 0, .28);
}

.hero-title {
  max-width: 920px !important;
  letter-spacing: 0 !important;
}

.hero-title .highlight {
  color: var(--aw-gold-2) !important;
  text-shadow: 0 0 28px rgba(240, 185, 11, .22) !important;
}

.hero-subtitle {
  color: rgba(255, 255, 255, .76) !important;
}

.hero-virtual-card-line,
.hero-duitnow-card,
.hero-stat,
.platform-trust-item,
.quick-action-card,
.simulator-card,
.calc-card,
.apply-card,
.feature-card,
.faq-item {
  background: rgba(255, 255, 255, .96) !important;
  border: 1px solid var(--aw-line) !important;
  border-radius: 18px !important;
  box-shadow: var(--aw-shadow) !important;
  backdrop-filter: blur(12px);
}

.hero-stat-icon,
.qa-icon-wrapper,
.feature-stat,
.process-stat,
.hero-flow-step .material-icons-outlined,
.platform-trust-item .material-icons-outlined {
  background: #101114 !important;
  color: var(--aw-gold-2) !important;
}

.quick-action-card::before,
.hero-flow-card::before,
.hero-preview-card::before {
  background: linear-gradient(135deg, rgba(240, 185, 11, .14), transparent 45%, rgba(24, 224, 255, .08)) !important;
}

.calculator-section,
.quick-actions-section,
.process-section,
.features-section,
.faq-section {
  background: transparent !important;
}

.footer,
.usecases-section,
.chatbot-header {
  background:
    radial-gradient(circle at 14% 10%, rgba(240, 185, 11, .20), transparent 28%),
    linear-gradient(135deg, #05070a 0%, #111827 60%, #05070a 100%) !important;
}

/* Portal and dashboard */
.portal-layout {
  background:
    radial-gradient(circle at 92% 0%, rgba(240, 185, 11, .14), transparent 28%),
    radial-gradient(circle at 10% 92%, rgba(24, 224, 255, .08), transparent 28%),
    #f8fafc !important;
}

.portal-sidebar {
  background:
    radial-gradient(circle at 20% 0%, rgba(240, 185, 11, .20), transparent 28%),
    radial-gradient(circle at 96% 16%, rgba(24, 224, 255, .12), transparent 26%),
    linear-gradient(180deg, #05070a 0%, #10151f 58%, #06080d 100%) !important;
  border-right: 1px solid rgba(240, 185, 11, .18) !important;
  box-shadow: 14px 0 36px rgba(5, 7, 10, .18) !important;
}

.portal-sidebar::before,
.portal-sidebar::after {
  display: none !important;
}

.sidebar-brand .brand-logo {
  background: #fff !important;
  border: 1px solid rgba(240, 185, 11, .26);
  border-radius: 12px !important;
}

.sidebar-profile,
.sidebar-wallet {
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid rgba(240, 185, 11, .16) !important;
  border-radius: 16px !important;
}

.side-menu {
  gap: 5px !important;
}

.side-link {
  min-height: 40px !important;
  padding: 9px 11px !important;
  border-radius: 13px !important;
  color: rgba(255, 255, 255, .82) !important;
  border: 1px solid transparent !important;
  transition: background .18s ease, color .18s ease, border-color .18s ease !important;
}

.side-link::after {
  display: none !important;
}

.side-link:hover,
.side-link.active {
  transform: none !important;
  color: #101114 !important;
  background: linear-gradient(135deg, var(--aw-gold), var(--aw-gold-2)) !important;
  border-color: rgba(240, 185, 11, .28) !important;
}

.side-link .material-icons-outlined {
  background: rgba(255, 255, 255, .08) !important;
  color: currentColor !important;
}

.side-section-label {
  color: rgba(240, 185, 11, .72) !important;
  letter-spacing: .06em !important;
}

.portal-main,
.shell {
  max-width: 1280px !important;
}

.card,
.panel-surface,
.overview-card,
.wallet-row,
.action-tile,
.transaction-card,
.loan-card,
.meta-box,
.trust-check,
.readonly-grid > div,
.bank-snapshot,
.dash-card,
.dash-action,
.dash-wallet,
.dash-profile,
.support-chat-panel,
.support-tip {
  border-radius: 18px !important;
  border-color: var(--aw-line) !important;
  box-shadow: var(--aw-shadow) !important;
}

.card:hover,
.panel-surface:hover,
.overview-card:hover,
.wallet-row:hover,
.action-tile:hover,
.transaction-card:hover,
.loan-card:hover,
.meta-box:hover,
.trust-check:hover,
.dash-card:hover,
.dash-action:hover {
  transform: none !important;
  box-shadow: 0 18px 44px rgba(5, 7, 10, .11) !important;
  border-color: rgba(240, 185, 11, .30) !important;
}

.dashboard-command,
.p2p-wallet-hero,
.wallet-balance-card,
.dash-profile,
.dash-wallet {
  color: #fff !important;
  background:
    radial-gradient(circle at 12% 12%, rgba(240, 185, 11, .22), transparent 32%),
    radial-gradient(circle at 90% 18%, rgba(24, 224, 255, .10), transparent 28%),
    linear-gradient(135deg, #05070a 0%, #121925 60%, #05070a 100%) !important;
  border: 1px solid rgba(240, 185, 11, .18) !important;
  box-shadow: var(--aw-shadow-strong) !important;
}

.dashboard-command::after,
.p2p-wallet-hero::after,
.wallet-balance-card::after,
.dash-profile::after,
.dash-wallet::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .12), transparent);
  transform: translateX(-120%);
  animation: awGoldSweep 8.5s ease-in-out infinite;
}

.dashboard-command .muted,
.p2p-wallet-hero .muted,
.wallet-balance-card p,
.dash-profile p,
.dash-wallet .sub {
  color: rgba(255, 255, 255, .76) !important;
}

.dashboard-command h1,
.p2p-wallet-hero h1,
.dash-profile h1,
.dash-wallet .balance {
  color: #fff !important;
}

.dashboard-command .eyebrow,
.p2p-wallet-hero .eyebrow,
.dash-wallet .label {
  color: var(--aw-gold-2) !important;
}

.dash {
  width: min(100%, 1240px) !important;
  padding: 0 12px 34px !important;
}

.dash-card-header,
.dash-card-body {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.dash-grid {
  gap: 14px !important;
}

.dash-btn,
.dash-action,
.btn {
  border-radius: 14px !important;
}

.dash-btn-primary,
.dash-btn:not(.dash-btn-outline),
.dash-action-primary {
  background: linear-gradient(135deg, var(--aw-gold), var(--aw-gold-2)) !important;
  color: #101114 !important;
}

.dash-wallet-actions {
  gap: 9px !important;
}

.dash-profile-actions {
  gap: 10px !important;
}

.language-switch,
.lang-switch {
  background: rgba(255, 255, 255, .95) !important;
  border: 1px solid rgba(240, 185, 11, .24) !important;
  box-shadow: none !important;
}

/* RGB accents without heavy effects */
.card::before,
.dash-card::before,
.panel-surface::before,
.overview-card::before {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(90deg, var(--aw-gold), var(--aw-rgb-a), var(--aw-rgb-b), var(--aw-gold));
  background-size: 220% 100%;
  animation: awRgbLine 9s linear infinite;
}

.support-bubble.visitor {
  background: #fff7df !important;
  border-color: rgba(240, 185, 11, .28) !important;
  color: #241a02 !important;
}

.support-bubble.support {
  background: #ffffff !important;
  color: var(--aw-ink) !important;
}

/* Mobile compact fixes */
.mobile-menu-toggle {
  position: fixed !important;
  right: 14px !important;
  top: calc(12px + env(safe-area-inset-top)) !important;
  z-index: 1210 !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 16px !important;
}

.mobile-menu-icon span {
  background: #101114 !important;
}

.mobile-bottom-nav {
  bottom: calc(12px + env(safe-area-inset-bottom)) !important;
}

.mobile-action-toggle {
  width: 64px !important;
  height: 64px !important;
  border-radius: 22px !important;
}

.mobile-action-menu {
  width: min(90vw, 340px) !important;
  border-radius: 20px !important;
  border: 1px solid rgba(240, 185, 11, .24) !important;
}

.mobile-action-link {
  min-height: 58px !important;
  border-radius: 15px !important;
}

@keyframes awRgbLine {
  0% { background-position: 0% 50%; }
  100% { background-position: 220% 50%; }
}

@keyframes awGoldSweep {
  0%, 42% { transform: translateX(-120%); opacity: 0; }
  52% { opacity: .8; }
  70%, 100% { transform: translateX(120%); opacity: 0; }
}

@keyframes awFloatGold {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

@media (min-width: 1180px) {
  .portal-layout {
    grid-template-columns: 252px minmax(0, 1fr) !important;
  }

  .portal-main {
    max-width: min(1380px, calc(100vw - 306px)) !important;
    padding: 28px 28px 68px !important;
  }

  .dashboard-command,
  .p2p-wallet-hero {
    padding: 28px !important;
  }
}

@media (max-width: 900px) {
  body {
    background: linear-gradient(180deg, #fffdf5 0%, #f7f8fb 58%, #fff 100%) !important;
  }

  .navbar {
    background: rgba(255, 255, 255, .96) !important;
    border-bottom-color: var(--aw-line) !important;
  }

  .nav-right {
    gap: 6px !important;
  }

  .nav-logo-img {
    max-width: 132px !important;
  }

  .hero {
    padding: 92px 16px 36px !important;
    background:
      radial-gradient(circle at 50% 0%, rgba(240, 185, 11, .18), transparent 38%),
      linear-gradient(180deg, #0a0d12 0%, #141821 42%, #fffdf5 42%, #ffffff 100%) !important;
  }

  .hero::after {
    top: 78px !important;
    left: 14px !important;
    right: 14px !important;
    width: auto !important;
    height: 470px !important;
    border-radius: 22px !important;
  }

  .hero-title {
    font-size: clamp(2rem, 10vw, 3rem) !important;
    line-height: 1.08 !important;
  }

  .hero-subtitle {
    font-size: .94rem !important;
  }

  .hero-stats,
  .platform-trust-rail,
  .quick-actions-grid,
  .hero-bnpl-strip,
  .hero-actions {
    grid-template-columns: 1fr !important;
  }

  .portal-main {
    padding: 72px 12px 108px !important;
  }

  .portal-sidebar {
    width: min(84vw, 292px) !important;
  }

  .dashboard-command,
  .p2p-wallet-hero,
  .dash-profile,
  .dash-wallet {
    border-radius: 20px !important;
    padding: 20px !important;
  }

  .dashboard-command,
  .dashboard-layout,
  .dashboard-main,
  .dashboard-aside,
  .wallet-panel,
  .dash-main-grid,
  .dash-overview-grid,
  .dash-grid-2,
  .dash-grid-3,
  .dash-grid-4 {
    grid-template-columns: 1fr !important;
  }

  .dash {
    padding: 0 8px 28px !important;
  }

  .dash-profile {
    display: grid !important;
    gap: 12px !important;
  }

  .dash-profile-actions,
  .dash-wallet-actions,
  .hero-actions,
  .p2p-actions,
  .command-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .dash-profile-actions a,
  .dash-wallet-actions a,
  .hero-actions a,
  .p2p-actions a,
  .command-actions a,
  .dash-btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .card::before,
  .dash-card::before,
  .panel-surface::before,
  .overview-card::before {
    animation: none !important;
  }
}

@media (max-width: 560px) {
  .hero {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .hero-title {
    font-size: clamp(1.85rem, 10vw, 2.5rem) !important;
  }

  .card,
  .panel-surface,
  .overview-card,
  .wallet-row,
  .action-tile,
  .transaction-card,
  .loan-card,
  .meta-box,
  .dash-card,
  .dash-action {
    border-radius: 16px !important;
  }

  .card-pad,
  .dash-card-body,
  .dash-card-header {
    padding: 14px !important;
  }

  .dash-wallet .balance,
  .wallet-balance-card strong {
    font-size: clamp(2rem, 12vw, 2.8rem) !important;
    line-height: 1.08 !important;
  }

  .mobile-action-menu {
    grid-template-columns: 1fr !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Homepage clarity hotfix: keep text readable on the dark gold hero across desktop and mobile. */
.hero,
.hero * {
  text-rendering: optimizeLegibility !important;
}

.hero .hero-container {
  position: relative !important;
  z-index: 2 !important;
}

.hero::after {
  background:
    radial-gradient(circle at 14% 10%, rgba(240, 185, 11, .24), transparent 30%),
    radial-gradient(circle at 86% 12%, rgba(16, 185, 129, .15), transparent 28%),
    linear-gradient(135deg, rgba(5, 7, 10, .96) 0%, rgba(17, 24, 39, .92) 56%, rgba(8, 13, 22, .88) 100%) !important;
  border-color: rgba(240, 185, 11, .38) !important;
  box-shadow: 0 28px 90px rgba(5, 7, 10, .38), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.hero #heroTitle,
.hero .hero-title,
.hero-container #heroTitle {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 6px 24px rgba(0, 0, 0, .72), 0 0 26px rgba(240, 185, 11, .14) !important;
}

.hero #heroTitle .highlight,
.hero .hero-title .highlight,
.hero-title span.highlight {
  color: var(--aw-gold-2) !important;
  -webkit-text-fill-color: var(--aw-gold-2) !important;
  text-shadow: 0 0 26px rgba(240, 185, 11, .42) !important;
}

.hero #heroSubtitle,
.hero .hero-subtitle {
  color: rgba(255, 255, 255, .9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .9) !important;
  opacity: 1 !important;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .64) !important;
}

.hero #heroTagline,
.hero .hero-tagline {
  color: rgba(255, 216, 107, .96) !important;
  -webkit-text-fill-color: rgba(255, 216, 107, .96) !important;
  letter-spacing: .16em !important;
  text-shadow: 0 3px 14px rgba(0, 0, 0, .68) !important;
}

.hero .hero-badge {
  background: rgba(5, 7, 10, .88) !important;
  border-color: rgba(240, 185, 11, .52) !important;
  color: var(--aw-gold-2) !important;
}

.hero-virtual-card-line {
  background: #ffffff !important;
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
  box-shadow: 0 16px 42px rgba(5, 7, 10, .16) !important;
}

.hero-duitnow-card,
.hero-stat,
.platform-trust-item {
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
}

.hero-bnpl-card.featured,
.hero-bnpl-card.featured strong,
.hero-bnpl-card.featured small {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 900px) {
  .navbar {
    min-height: 72px !important;
  }

  .nav-container {
    gap: 10px !important;
    padding: 10px 14px !important;
  }

  .nav-right {
    max-width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    justify-content: flex-start !important;
  }

  .nav-right::-webkit-scrollbar {
    display: none !important;
  }

  .nav-link,
  .language-toggle {
    min-height: 42px !important;
    white-space: nowrap !important;
  }

  .hero {
    padding-top: 98px !important;
    padding-bottom: 36px !important;
  }

  .hero::after {
    top: 76px !important;
    left: 12px !important;
    right: 12px !important;
    height: 610px !important;
    border-radius: 28px !important;
  }

  .hero-container {
    padding-inline: 0 !important;
  }

  .hero-badge {
    max-width: calc(100vw - 48px) !important;
    white-space: normal !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .hero-title {
    font-size: clamp(1.95rem, 9vw, 2.75rem) !important;
    line-height: 1.12 !important;
    max-width: 100% !important;
  }

  .hero-subtitle {
    font-size: .94rem !important;
    line-height: 1.62 !important;
    max-width: 34rem !important;
  }

  .hero-virtual-card-line,
  .hero-duitnow-card,
  .hero-bnpl-card.featured {
    width: min(100%, 620px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero-virtual-card-line {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    text-align: left !important;
    border-radius: 18px !important;
    line-height: 1.45 !important;
  }

  .hero-duitnow-card {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    margin-top: 12px !important;
  }

  .hero-duitnow-copy strong {
    justify-content: center !important;
  }

  .hero-stats,
  .platform-trust-row {
    gap: 10px !important;
  }

  .hero-stat,
  .platform-trust-item {
    min-height: 70px !important;
  }
}

@media (max-width: 560px) {
  .hero {
    padding-top: 92px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .hero::after {
    height: 700px !important;
    border-radius: 22px !important;
  }

  .hero-title {
    font-size: clamp(1.78rem, 10.4vw, 2.38rem) !important;
  }

  .hero-subtitle {
    font-size: .9rem !important;
  }

  .hero-virtual-card-line,
  .hero-duitnow-card,
  .hero-bnpl-card.featured,
  .hero-stat,
  .platform-trust-item {
    border-radius: 16px !important;
  }
}

/* Use-case cards: older inline rules turned the cards white on a dark section. */
.usecases-section .usecases-grid {
  align-items: stretch !important;
}

.usecases-section .usecase-card {
  display: grid !important;
  place-items: center !important;
  gap: 12px !important;
  min-height: 122px !important;
  background: rgba(255, 255, 255, .10) !important;
  border: 1px solid rgba(255, 216, 107, .26) !important;
  color: #ffffff !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
  backdrop-filter: blur(14px) !important;
}

.usecases-section .usecase-card,
.usecases-section .usecase-card * {
  opacity: 1 !important;
  visibility: visible !important;
}

.usecases-section .usecase-icon {
  width: 54px !important;
  height: 54px !important;
  margin: 0 auto !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 18px !important;
  background: rgba(240, 185, 11, .18) !important;
  color: var(--aw-gold-2) !important;
}

.usecases-section .usecase-icon .material-icons-outlined {
  display: inline-flex !important;
  font-size: 2rem !important;
  color: var(--aw-gold-2) !important;
  -webkit-text-fill-color: var(--aw-gold-2) !important;
}

.usecases-section .usecase-title {
  display: block !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

.usecases-section .usecases-cta .btn-accent {
  background: linear-gradient(135deg, var(--aw-gold), var(--aw-gold-2)) !important;
  color: #101114 !important;
}

@media (max-width: 560px) {
  .usecases-section .usecase-card {
    grid-template-columns: auto minmax(0, 1fr) !important;
    justify-items: start !important;
    min-height: 78px !important;
    text-align: left !important;
  }

  .usecases-section .usecase-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
  }

  .usecases-section .usecase-title {
    text-align: left !important;
  }
}

/* Mobile bottom action: prevent the open menu from rendering as a clipped white strip. */
@media (max-width: 900px) {
  .mobile-bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
    pointer-events: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    z-index: 1100 !important;
  }

  .mobile-action-toggle {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 3 !important;
  }

  .mobile-action-menu {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 82px !important;
    width: min(90vw, 340px) !important;
    max-height: min(68vh, 460px) !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
    transform: translateX(-50%) translateY(14px) scale(.96) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: rgba(255, 255, 255, .98) !important;
    border-radius: 24px !important;
    border: 1px solid rgba(240, 185, 11, .28) !important;
    box-shadow: 0 24px 70px rgba(5, 7, 10, .22) !important;
    scrollbar-width: none !important;
  }

  .mobile-action-menu::-webkit-scrollbar {
    display: none !important;
  }

  .mobile-bottom-nav.open .mobile-action-menu {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) scale(1) !important;
  }

  .mobile-bottom-nav:not(.open) .mobile-action-menu {
    visibility: hidden !important;
  }

  .mobile-action-scrim {
    position: fixed !important;
    inset: 0 !important;
    display: none !important;
    background: transparent !important;
    border: 0 !important;
    pointer-events: none !important;
  }

  .mobile-bottom-nav.open .mobile-action-scrim {
    display: block !important;
    pointer-events: auto !important;
  }
}

/* Homepage trust cards: make the four benefit cards readable and balanced. */
.platform-trust-rail {
  width: min(100%, 1120px) !important;
  max-width: 1120px !important;
  margin: 26px auto 28px !important;
  padding: 0 10px !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

.platform-trust-item {
  min-height: 96px !important;
  padding: 18px 18px !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  column-gap: 14px !important;
  row-gap: 5px !important;
  align-items: center !important;
  border-radius: 18px !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(255, 252, 243, .94)) !important;
  border: 1px solid rgba(240, 185, 11, .20) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, .09) !important;
  overflow: hidden !important;
}

.platform-trust-item .material-icons-outlined {
  grid-row: 1 / 3 !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 15px !important;
  display: inline-grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #0f172a, #182235) !important;
  color: #facc15 !important;
  -webkit-text-fill-color: #facc15 !important;
  font-size: 1.28rem !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .18) !important;
}

.platform-trust-item strong {
  display: block !important;
  min-width: 0 !important;
  color: #101827 !important;
  -webkit-text-fill-color: #101827 !important;
  font-size: .95rem !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

.platform-trust-item span:not(.material-icons-outlined) {
  display: block !important;
  min-width: 0 !important;
  color: #475569 !important;
  -webkit-text-fill-color: #475569 !important;
  font-size: .78rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}

@media (max-width: 920px) {
  .platform-trust-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-top: 22px !important;
  }
}

@media (max-width: 560px) {
  .platform-trust-rail {
    grid-template-columns: 1fr !important;
    padding: 0 !important;
    margin: 18px auto 22px !important;
  }

  .platform-trust-item {
    min-height: 82px !important;
    padding: 15px !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    border-radius: 16px !important;
  }

  .platform-trust-item .material-icons-outlined {
    width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    font-size: 1.18rem !important;
  }
}

/* Mobile action dock hard-fix: stop the menu from collapsing into a right-side vertical strip. */
@media (max-width: 900px) {
  html,
  body,
  .portal-layout,
  .portal-main {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .mobile-bottom-nav {
    left: 0 !important;
    right: 0 !important;
    bottom: calc(14px + env(safe-area-inset-bottom)) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  .mobile-action-toggle {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 0 !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    width: 66px !important;
    height: 66px !important;
    border-radius: 24px !important;
    pointer-events: auto !important;
  }

  .mobile-bottom-nav.open .mobile-action-toggle {
    transform: translateX(-50%) !important;
  }

  .mobile-action-menu {
    box-sizing: border-box !important;
    left: 50% !important;
    right: auto !important;
    bottom: 82px !important;
    width: min(calc(100vw - 28px), 360px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 28px) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 12px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    overflow: visible !important;
    transform: translate3d(-50%, 14px, 0) scale(.98) !important;
    border-radius: 22px !important;
    white-space: normal !important;
  }

  .mobile-bottom-nav.open .mobile-action-menu {
    transform: translate3d(-50%, 0, 0) scale(1) !important;
  }

  .mobile-action-link {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 58px !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 11px 12px !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: hidden !important;
  }

  .mobile-action-link > span:not(.material-icons-outlined),
  .mobile-action-link small {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    text-align: left !important;
  }
}

@media (max-width: 420px) {
  .mobile-action-menu {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }
}

/* User request: remove the bottom mobile action menu completely. */
@media (max-width: 900px) {
  .mobile-bottom-nav,
  .mobile-action-menu,
  .mobile-action-toggle,
  .mobile-action-scrim {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .portal-main {
    padding-bottom: 34px !important;
  }
}

/* Homepage stat icons: keep glyphs visible on the gold/black theme. */
.public-site .hero-stat .hero-stat-icon {
  background: linear-gradient(135deg, #0f172a, #182235) !important;
  border: 1px solid rgba(250, 204, 21, .32) !important;
  color: #facc15 !important;
  -webkit-text-fill-color: #facc15 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 10px 22px rgba(15, 23, 42, .18) !important;
  overflow: hidden !important;
}

.public-site .hero-stat .hero-stat-icon .material-icons-outlined {
  display: block !important;
  width: 1em !important;
  height: 1em !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-family: 'Material Icons Outlined' !important;
  font-size: 1.22rem !important;
  font-style: normal !important;
  font-weight: normal !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  direction: ltr !important;
  opacity: 1 !important;
  -webkit-font-feature-settings: 'liga' !important;
  -webkit-font-smoothing: antialiased !important;
}

.public-site .hero-stat.hero-stat-live .hero-stat-icon {
  background: linear-gradient(135deg, #052e24, #064e3b) !important;
  border-color: rgba(16, 185, 129, .34) !important;
  color: #34d399 !important;
  -webkit-text-fill-color: #34d399 !important;
}

@media (max-width: 480px) {
  .public-site .hero-stat .hero-stat-icon .material-icons-outlined {
    font-size: 1.08rem !important;
  }
}
