:root {
  --download-ink: #080507;
  --download-panel: #160a0d;
  --download-panel-2: #211014;
  --download-gold: #f0c066;
  --download-gold-2: #c98732;
  --download-red: #9c241d;
  --download-red-dark: #4b090d;
  --download-copy: #cbbab0;
}

.downloads-body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% 20%, rgba(144, 31, 25, .18), transparent 35%),
    radial-gradient(circle at 85% 45%, rgba(208, 136, 42, .10), transparent 32%),
    #080507;
}

.download-nav {
  background: rgba(8, 4, 6, .96);
  backdrop-filter: blur(14px);
}

.download-hero {
  min-height: 455px;
  padding: 72px max(28px, calc((100% - 1120px) / 2));
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  align-items: center;
  gap: 38px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(229, 166, 62, .20);
  background:
    linear-gradient(90deg, rgba(7, 3, 5, .98), rgba(22, 7, 9, .86) 56%, rgba(34, 10, 11, .62)),
    url("/ClientRes/Images/LokyTheme/hero-bg.jpg") center / cover no-repeat;
}

.download-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 37%, rgba(244, 197, 94, .08) 50%, transparent 62%);
}

.download-hero-copy,
.download-hero-mark {
  position: relative;
  z-index: 1;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--download-gold);
  font: 800 12px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.hero-kicker i,
.available i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #67dc8d;
  box-shadow: 0 0 14px rgba(103, 220, 141, .82);
}

.download-hero h1 {
  margin: 16px 0 18px;
  color: #fff6e6;
  font: 700 clamp(42px, 5.4vw, 70px)/.98 Georgia, "Times New Roman", serif;
  letter-spacing: -.035em;
}

.download-hero h1 strong {
  display: block;
  color: var(--download-gold);
  font-weight: 700;
}

.download-hero p {
  max-width: 650px;
  margin: 0;
  color: #cdbdb2;
  font: 400 17px/1.75 "Segoe UI", Arial, sans-serif;
}

.hero-trust {
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hero-trust span {
  padding: 9px 12px;
  border: 1px solid rgba(238, 183, 84, .22);
  background: rgba(14, 7, 8, .68);
  color: #e9d8c4;
  font: 700 11px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.download-hero-mark {
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.download-hero-mark:before {
  content: "";
  width: 360px;
  height: 260px;
  position: absolute;
  border: 1px solid rgba(241, 185, 80, .20);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(174, 44, 29, .28), transparent 67%);
  box-shadow: 0 0 80px rgba(175, 53, 23, .20), inset 0 0 48px rgba(241, 172, 63, .07);
}

.download-hero-mark img {
  width: min(480px, 100%);
  max-height: 310px;
  object-fit: contain;
  position: relative;
  filter: drop-shadow(0 24px 30px rgba(0, 0, 0, .72)) drop-shadow(0 0 18px rgba(225, 132, 49, .22));
}

.download-shell {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding: 70px 0 36px;
}

.section-heading {
  max-width: 720px;
  margin-bottom: 34px;
}

.section-heading > span,
.download-news-cta span {
  color: var(--download-gold-2);
  font: 900 11px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.section-heading h2,
.download-news-cta h2 {
  margin: 9px 0 10px;
  color: #f5dfb1;
  font: 700 clamp(31px, 4vw, 47px)/1.08 Georgia, "Times New Roman", serif;
}

.section-heading p,
.download-news-cta p {
  margin: 0;
  color: var(--download-copy);
  font: 400 16px/1.65 "Segoe UI", Arial, sans-serif;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.product-card {
  min-height: 620px;
  padding: 34px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(236, 171, 67, .24);
  background: linear-gradient(145deg, rgba(34, 14, 17, .97), rgba(10, 5, 7, .98));
  box-shadow: 0 26px 68px rgba(0, 0, 0, .38);
}

.product-card:before {
  content: "";
  height: 3px;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  background: linear-gradient(90deg, transparent, var(--download-gold), #fff1af, var(--download-red), transparent);
}

.product-card:after {
  content: "";
  width: 230px;
  height: 230px;
  position: absolute;
  top: -110px;
  right: -80px;
  border-radius: 50%;
  background: rgba(169, 43, 27, .14);
  filter: blur(2px);
  pointer-events: none;
}

.android-card:after { background: rgba(213, 146, 48, .11); }

.card-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

.available {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #83e7a3;
  font: 800 11px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.version {
  padding: 7px 10px;
  border: 1px solid rgba(236, 179, 79, .22);
  color: #eecb87;
  font: 800 11px/1 "Segoe UI", Arial, sans-serif;
}

.platform-icon {
  width: 72px;
  height: 72px;
  margin-top: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(238, 178, 72, .28);
  background: linear-gradient(145deg, rgba(184, 43, 29, .30), rgba(95, 13, 16, .18));
  box-shadow: inset 0 0 25px rgba(239, 174, 59, .07);
}

.platform-icon svg { width: 36px; height: 36px; fill: var(--download-gold); }

.platform-label {
  margin-top: 23px;
  color: #bd8f49;
  font: 900 10px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.product-card h3 {
  margin: 8px 0 13px;
  color: #fff2d5;
  font: 700 31px/1.12 Georgia, "Times New Roman", serif;
}

.product-card > p {
  min-height: 76px;
  margin: 0;
  color: #bfada4;
  font: 400 15px/1.65 "Segoe UI", Arial, sans-serif;
}

.product-specs {
  margin: 24px 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid rgba(226, 167, 70, .12);
}

.product-specs li {
  padding: 11px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(226, 167, 70, .12);
  color: #9b8980;
  font: 600 12px/1.35 "Segoe UI", Arial, sans-serif;
}

.product-specs b { color: #ead7bc; text-align: right; }

.download-button {
  min-height: 66px;
  margin-top: auto;
  padding: 12px 56px 12px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  border: 1px solid #dd9c3f;
  background: linear-gradient(135deg, #b73425, #741318 58%, #49080c);
  box-shadow: 0 14px 30px rgba(91, 10, 13, .36), inset 0 1px rgba(255, 232, 170, .28);
  color: #fff6df;
  font-family: "Segoe UI", Arial, sans-serif;
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}

.download-button:after {
  content: "↓";
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  position: absolute;
  top: 14px;
  right: 14px;
  border: 1px solid rgba(255, 229, 159, .34);
  font-size: 23px;
}

.download-button:hover {
  transform: translateY(-2px);
  filter: brightness(1.12);
  box-shadow: 0 18px 36px rgba(91, 10, 13, .48), inset 0 1px rgba(255, 232, 170, .34);
}

.download-button span { font-size: 16px; font-weight: 900; letter-spacing: .035em; text-transform: uppercase; }
.download-button small { margin-top: 3px; color: #efcfae; font-size: 11px; }

.hash-box { margin-top: 14px; color: #8f7b72; font: 600 11px/1.5 "Segoe UI", Arial, sans-serif; }
.hash-box summary { cursor: pointer; }
.hash-box code {
  margin-top: 8px;
  padding: 10px;
  display: block;
  overflow-wrap: anywhere;
  border: 1px solid rgba(221, 164, 67, .12);
  background: #080405;
  color: #baa58f;
  font-size: 10px;
}

.install-notes {
  width: min(1120px, calc(100% - 32px));
  margin: 16px auto 70px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid rgba(232, 169, 69, .17);
  background: rgba(20, 9, 11, .72);
}

.install-notes article { min-height: 140px; padding: 26px; display: flex; align-items: flex-start; gap: 16px; }
.install-notes article + article { border-left: 1px solid rgba(232, 169, 69, .17); }
.install-notes b { color: var(--download-gold-2); font: 700 24px/1 Georgia, serif; }
.install-notes h3 { margin: 0 0 7px; color: #ecd9b7; font: 700 16px/1.2 "Segoe UI", Arial, sans-serif; }
.install-notes p { margin: 0; color: #a8968d; font: 400 13px/1.55 "Segoe UI", Arial, sans-serif; }

.download-news-cta {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto 78px;
  padding: 40px 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border: 1px solid rgba(233, 174, 77, .24);
  background: linear-gradient(100deg, rgba(35, 11, 14, .96), rgba(69, 15, 15, .80)), url("/ClientRes/Images/News/abertura_beta.jpg") center / cover no-repeat;
  box-shadow: 0 22px 58px rgba(0, 0, 0, .32);
}

.download-news-cta h2 { font-size: 33px; }
.download-news-cta a {
  min-width: 168px;
  min-height: 50px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--download-gold);
  background: rgba(16, 7, 8, .72);
  color: #f8d99a;
  font: 900 12px/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
}

@media (max-width: 880px) {
  .download-hero { grid-template-columns: 1fr; padding-top: 54px; }
  .download-hero-mark { display: none; }
  .product-grid { grid-template-columns: 1fr; }
  .product-card { min-height: 0; }
  .product-card > p { min-height: 0; }
  .install-notes { grid-template-columns: 1fr; }
  .install-notes article + article { border-top: 1px solid rgba(232, 169, 69, .17); border-left: 0; }
  .download-news-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) {
  .download-nav { min-height: 116px; padding-bottom: 10px; align-items: center; flex-direction: column; }
  .download-nav .legal-menu { justify-content: center; flex-wrap: wrap; gap: 4px 16px; }
  .download-nav .legal-menu a { font-size: 10px; }
  .download-hero { min-height: 430px; padding: 60px 20px 44px; }
  .download-hero h1 { font-size: 41px; }
  .download-hero p { font-size: 15px; }
  .hero-trust { align-items: flex-start; flex-direction: column; }
  .download-shell { padding-top: 50px; }
  .product-card { padding: 26px 22px; }
  .product-card h3 { font-size: 27px; }
  .install-notes article { min-height: 0; }
  .download-news-cta { padding: 30px 24px; }
  .download-news-cta h2 { font-size: 29px; }
}
