/* Ana vitrin: ilk ekranda net, okunur ve gerçekçi spor atmosferi */
.dashboard-hero {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 520px) !important;
  gap: clamp(22px, 4vw, 54px) !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: auto !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(42px, 5vw, 68px) clamp(18px, 6vw, 92px) clamp(34px, 4.6vw, 58px) !important;
  background: #050b18 !important;
}

.dashboard-hero .hero-media {
  display: none !important;
  background: none !important;
}

.dashboard-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background:
    linear-gradient(90deg, rgba(4, 9, 22, .72) 0%, rgba(4, 9, 22, .44) 48%, rgba(4, 9, 22, .64) 100%),
    url("https://unsplash.com/photos/pitDMdAjynU/download?force=true&w=2200") center center / cover no-repeat !important;
  filter: saturate(.96) contrast(1.08) brightness(.92) !important;
  transform: scale(1.015) !important;
  transform-origin: center center !important;
}

.dashboard-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  background:
    linear-gradient(90deg, rgba(3,8,23,.66) 0%, rgba(3,8,23,.18) 46%, rgba(3,8,23,.50) 100%),
    radial-gradient(circle at 78% 20%, rgba(57,255,136,.09), transparent 28%),
    radial-gradient(circle at 18% 82%, rgba(255,159,28,.08), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 22%, rgba(0,0,0,.16)) !important;
  opacity: 1 !important;
  display: block !important;
  pointer-events: none !important;
}

.hero-content {
  max-width: 720px !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

.hero-brand-lockup {
  width: max-content !important;
  max-width: 100% !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, .10) !important;
  border-radius: 999px !important;
  background: rgba(3, 8, 23, .56) !important;
  backdrop-filter: blur(10px) !important;
}

.dashboard-hero .eyebrow {
  color: #ffe08a !important;
  letter-spacing: .075em !important;
  margin: 0 !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.55) !important;
}

.dashboard-hero h1 {
  max-width: 690px !important;
  margin: 0 !important;
  font-size: clamp(40px, 4.6vw, 62px) !important;
  line-height: 1.03 !important;
  letter-spacing: -.038em !important;
  text-wrap: balance !important;
  text-shadow: 0 3px 26px rgba(0,0,0,.72) !important;
}

.dashboard-hero .hero-content > p:not(.eyebrow) {
  max-width: 640px !important;
  color: #e1ebf8 !important;
  font-size: clamp(15px, 1.22vw, 18px) !important;
  line-height: 1.62 !important;
  margin: 0 !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.62) !important;
}

.hero-proof {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 2px !important;
}

.hero-proof span {
  border: 1px solid rgba(255, 255, 255, .14) !important;
  background: rgba(3, 8, 23, .50) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 10px 24px rgba(0,0,0,.20) !important;
  backdrop-filter: blur(8px) !important;
}

.hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

.hero-button {
  box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important;
}

.platform-summary {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-self: center !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.platform-summary::before {
  content: "Günün Maç Panosu" !important;
  grid-column: 1 / -1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(57, 255, 136, .22) !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(57, 255, 136, .16), rgba(3, 8, 23, .54)) !important;
  color: #c8ffdd !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  backdrop-filter: blur(12px) !important;
}

.platform-summary > div {
  position: relative !important;
  display: grid !important;
  align-content: start !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 136px !important;
  padding: 16px !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 18px !important;
  background: rgba(3, 8, 23, .62) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 18px 52px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .07) !important;
}

.platform-summary > div:nth-child(4) {
  grid-column: 1 / -1 !important;
  min-height: 118px !important;
}

.platform-summary > div::after {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 0 !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, rgba(255,159,28,.95), rgba(57,255,136,.95)) !important;
  opacity: .72 !important;
}

.platform-summary span {
  background: linear-gradient(115deg, #fff8dc 0%, #e7c56b 26%, #fff3b0 48%, #b8872e 72%, #fff4c7 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: #f2df9b !important;
  -webkit-text-fill-color: transparent !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 12px rgba(255,224,138,.18), 0 2px 12px rgba(0,0,0,.48) !important;
}

.platform-summary strong {
  background: linear-gradient(115deg, #fffbe8 0%, #f6d77e 20%, #fff1a8 42%, #c79639 68%, #fff7d1 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: #ffe08a !important;
  -webkit-text-fill-color: transparent !important;
  font-size: clamp(19px, 1.7vw, 26px) !important;
  line-height: 1.10 !important;
  letter-spacing: -.025em !important;
  overflow-wrap: anywhere !important;
  filter: drop-shadow(0 0 12px rgba(255,224,138,.28)) drop-shadow(0 3px 14px rgba(0,0,0,.58)) !important;
}

.platform-summary small {
  color: #f3ead0 !important;
  font-size: 12px !important;
  line-height: 1.48 !important;
  font-weight: 780 !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.55) !important;
}

.fl-hero-credibility {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
}

.fl-hero-credibility span {
  display: grid;
  gap: 4px;
  padding: 10px 11px;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 14px;
  background: rgba(3, 8, 23, .46);
  color: #e1ebf8;
  font-size: 12px;
  line-height: 1.35;
  backdrop-filter: blur(8px);
}
