/* DostYazilim V8 — atmospheric home and edge advertising */
.route-home {
  background-color: #050710;
  background-image: url('../images/home-atmosphere-v8.webp');
  background-repeat: no-repeat;
  background-position: center 118px;
  background-size: max(1672px, 100vw) auto;
  background-attachment: fixed;
}

.route-home .update-bar {
  background: rgba(5, 9, 18, .96);
}

.route-home .site-header {
  background: rgba(5, 8, 16, .90);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .22);
}

.route-home main {
  position: relative;
  isolation: isolate;
}

.route-home .top-ad-zone {
  margin-top: 20px;
}

.route-home .top-ad-zone a {
  min-height: 86px;
  border-color: rgba(108, 125, 160, .56);
  background: rgba(5, 9, 17, .90);
  box-shadow: 0 20px 55px rgba(0, 0, 0, .34);
  backdrop-filter: blur(14px);
}

.route-home .top-ad-zone img {
  display: block;
  max-height: 126px;
  margin-inline: auto;
}

.route-home .top-ad-zone > a > span {
  left: 12px;
  top: 12px;
  padding: 4px 8px;
  border-color: #34425c;
  background: #0b111d;
  color: #b9c6dc;
}

.route-home .hero {
  margin-top: 20px;
  border-color: rgba(81, 101, 139, .68);
  background: rgba(7, 12, 22, .91);
  box-shadow: 0 34px 90px rgba(0, 0, 0, .54);
  backdrop-filter: blur(18px);
}

.route-home .hero::before {
  width: 5px;
  box-shadow: 0 0 24px rgba(34, 211, 238, .50);
}

.route-home .hero-copy h1 {
  text-shadow: 0 14px 40px rgba(0, 0, 0, .44);
}

.route-home .hero-panel {
  border-color: rgba(93, 109, 147, .72);
  background: rgba(4, 8, 16, .92);
  box-shadow: 0 26px 70px rgba(0, 0, 0, .48);
}

.route-home .hero-slides,
.route-home .hero-placeholder {
  background: rgba(4, 8, 15, .88);
}

.route-home .hero-slide img {
  max-height: none;
  padding: 0;
  background: transparent;
}

.route-home .hero-panel-foot {
  background: #0d1421;
}

.route-home .sponsor-rail-inner {
  border-color: rgba(72, 91, 128, .68);
  background: rgba(8, 14, 25, .91);
  box-shadow: 0 20px 54px rgba(0, 0, 0, .34);
  backdrop-filter: blur(16px);
}

.route-home .channel-strip {
  background: rgba(6, 11, 20, .92);
  backdrop-filter: blur(14px);
}

.route-home #sponsorlar {
  margin-top: 42px;
  margin-bottom: 34px;
  padding: 52px 34px;
  border: 1px solid rgba(65, 82, 116, .62);
  border-radius: 24px;
  background: rgba(7, 12, 22, .89);
  box-shadow: 0 36px 90px rgba(0, 0, 0, .40);
  backdrop-filter: blur(16px);
}

.route-home #sponsorlar .section-head {
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(65, 81, 112, .58);
}

.route-home .sponsor-card {
  border-color: rgba(61, 76, 108, .78);
  background: rgba(12, 18, 31, .96);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .26);
}

.route-home .sponsor-card:hover {
  border-color: #8062ba;
  box-shadow: 0 28px 70px rgba(0, 0, 0, .48);
}

.route-home .sponsor-media {
  background: #080d17;
}

.route-home .inline-ad-zone {
  border-color: rgba(71, 89, 125, .66);
  background: rgba(7, 12, 22, .91);
  box-shadow: 0 25px 65px rgba(0, 0, 0, .36);
  backdrop-filter: blur(14px);
}

.route-home .section.container:not(#sponsorlar) {
  margin-block: 34px;
  padding: 48px 34px;
  border: 1px solid rgba(49, 64, 92, .52);
  border-radius: 22px;
  background: rgba(6, 11, 20, .84);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .30);
  backdrop-filter: blur(14px);
}

.route-home .section.container + .section.container {
  border-top-color: rgba(49, 64, 92, .52);
}

.route-home .site-footer {
  background: rgba(5, 9, 17, .95);
  backdrop-filter: blur(18px);
}

/* Side ads stay near the viewport edge instead of drifting into the content. */
.side-ad {
  top: 154px;
  width: 146px;
  max-height: calc(100vh - 180px);
  border-color: #465675;
  border-radius: 15px;
  background: #080d17;
  box-shadow: 0 28px 74px rgba(0, 0, 0, .58);
  transform: none;
}

.side-ad::before {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0 0 auto;
  height: 3px;
  background: #8b5cf6;
  pointer-events: none;
}

.side-ad-left {
  left: 18px;
}

.side-ad-right {
  right: 18px;
}

.side-ad-head {
  height: 34px;
  padding-inline: 9px;
  background: #111827;
}

.side-ad-head span {
  color: #9cadd0;
  font-size: .60rem;
}

.side-ad-head button {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid transparent;
  border-radius: 6px;
}

.side-ad-head button:hover {
  border-color: #465675;
  background: #1b2435;
}

.side-ad img {
  display: block;
  max-height: calc(100vh - 214px);
  background: #070b13;
}

.side-ad:hover {
  border-color: #8062ba;
  transform: translateY(-3px);
  box-shadow: 0 34px 90px rgba(0, 0, 0, .68);
}

.side-ad.dismissed {
  transform: translateY(-10px) scale(.96);
}

@media (min-width: 1641px) and (max-width: 1750px) {
  .side-ad {
    width: 132px;
  }

  .side-ad-left {
    left: 12px;
  }

  .side-ad-right {
    right: 12px;
  }
}

@media (max-width: 820px) {
  .route-home {
    background-position: center 98px;
    background-size: auto 820px;
    background-attachment: scroll;
  }

  .route-home .hero {
    background: rgba(7, 12, 22, .95);
  }

  .route-home #sponsorlar,
  .route-home .section.container:not(#sponsorlar) {
    margin-block: 24px;
    padding: 36px 24px;
    border-radius: 18px;
  }
}

@media (max-width: 540px) {
  .route-home {
    background-position: center 86px;
    background-size: auto 700px;
  }

  .route-home #sponsorlar,
  .route-home .section.container:not(#sponsorlar) {
    padding: 28px 18px;
    border-radius: 15px;
  }

  .route-home .top-ad-zone img {
    max-height: 112px;
  }
}