/* Local, nonfunctional download-interface demonstration. */
.demo-hero { position: relative; isolation: isolate; overflow: hidden; color: #fff5de; background: #25070e; border-bottom: 1px solid #c5924b; }
.demo-hero-art, .demo-hero-shade { position: absolute; inset: 0; z-index: -1; }
.demo-hero-art { display: block; }
.demo-hero-art img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 65% center; }
.demo-hero-shade { background: linear-gradient(90deg, rgba(25,3,9,.88), rgba(25,3,9,.57) 36%, rgba(25,3,9,0) 67%); }
.demo-hero-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; min-height: 650px; padding-block: 66px; gap: 50px; }
.demo-hero-copy { max-width: 560px; }
.demo-hero-badge { display: inline-block; margin: 0 0 24px; padding: 7px 12px; border: 1px solid rgba(244,207,137,.5); border-radius: 999px; color: #ffdf9e; background: rgba(35,3,10,.65); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.demo-hero h1 { max-width: none; margin: 0 0 22px; font-size: clamp(2.65rem, 4.6vw, 4.8rem); line-height: 1.08; color: #fff5de; text-shadow: 0 3px 22px #230007; }
.demo-hero h1 span { display: block; margin-top: 13px; color: #deb36f; font-family: inherit; font-size: .47em; font-weight: 400; letter-spacing: .01em; }
.demo-hero-description { max-width: 44ch; color: #f0dfd3; font-size: 1rem; line-height: 1.65; margin: 0 0 26px; }
.demo-download-panel { padding: 20px; border: 1px solid rgba(255,222,150,.62); border-radius: 22px; background: linear-gradient(135deg, rgba(94,22,27,.92), rgba(31,4,10,.94)); box-shadow: 0 20px 55px #10000666, inset 0 1px 0 #ffe2a322; }
.demo-download-label { margin: 0 0 12px; color: #fff0cc; font-size: .8rem; font-weight: 800; }
.demo-download-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.demo-download-button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 84px; padding: 14px; text-align: left; border: 1px solid #f3cd87; border-radius: 14px; font: inherit; line-height: 1.25; opacity: 1; cursor: pointer; text-decoration: none; }
.demo-download-button img { flex: 0 0 32px; }
.demo-download-button small { display: block; font-size: .58rem; letter-spacing: .08em; font-weight: 800; margin-bottom: 5px; }
.demo-download-button strong { display: block; font-size: 1rem; white-space: nowrap; }
.demo-google { color: #fff8ea; background: #15171b; }
.demo-google small { color: #e2c48d; }
.demo-apk { color: #361109; background: linear-gradient(125deg, #ffecad, #e8b852); box-shadow: 0 5px 22px #e4a94033; }
.demo-button-arrow { margin-left: auto; font-size: 1.4rem; }
.demo-download-note { color: #eed9bd; margin: 12px 0 0; font-size: .75rem; }
.demo-reading-link { display: inline-flex; align-items: center; gap: 16px; margin-top: 22px; color: #ffe3a9; font-size: .85rem; font-weight: 700; text-underline-offset: 5px; }
.demo-art-caption { align-self: end; justify-self: end; color: #f5d499; font-size: 1.4rem; letter-spacing: .15em; margin: 0; text-shadow: 0 2px 15px #000; }
@media (min-width: 721px) and (max-width: 1100px) {
  .demo-hero-layout { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 20px; }
  .demo-download-buttons { grid-template-columns: 1fr; }
  .demo-download-button { min-height: 72px; }
}
@media (max-width: 720px) {
  .demo-hero-layout { width: min(100% - 28px, 560px); display: block; min-height: 620px; padding-block: 34px 32px; }
  .demo-hero-art img { object-position: 100% center; }
  .demo-hero-shade { background: linear-gradient(180deg, rgba(24,3,9,.60), rgba(24,3,9,.30) 24%, rgba(24,3,9,.82) 58%, rgba(24,3,9,.95)); }
  .demo-hero-copy { max-width: none; }
  .demo-hero-badge { margin-bottom: 19px; padding: 7px 10px; font-size: .60rem; letter-spacing: .08em; }
  .demo-hero h1 { font-size: clamp(2.4rem, 10vw, 3.6rem); margin-bottom: 18px; }
  .demo-hero h1 span { font-size: .49em; margin-top: 9px; }
  .demo-hero-description { max-width: 34ch; font-size: .86rem; line-height: 1.55; margin-bottom: 26px; text-shadow: 0 2px 8px #000; }
  .demo-download-panel { padding: 16px; border-radius: 20px; border-color: #f0c36d; box-shadow: 0 12px 45px #12000999, 0 0 0 3px #e6b45019; }
  .demo-download-buttons { grid-template-columns: 1fr; gap: 11px; }
  .demo-download-button { min-height: 78px; padding: 13px 18px; }
  .demo-download-button strong { font-size: 1.25rem; }
  .demo-download-button small { font-size: .63rem; }
  .demo-download-note { font-size: .72rem; }
  .demo-reading-link { margin-top: 22px; }
  .demo-art-caption { display: none; }
}
@media (max-width: 360px) {
  .demo-hero-layout { padding-top: 25px; }
  .demo-hero h1 { font-size: 2.25rem; }
  .demo-download-panel { padding: 12px; }
}