/* Simple home 2026-10-19: one picture + Listen, four featured works, her photo + short intro, footer.
   Fewer frames, darker text, Chinese first and English second. */
.homepage{--ink:#21180f;--ink2:#4a3a27;--gold:#9a6a22}

/* 1. Main picture + Listen */
.homepage .vh-stage{max-height:76vh}
.homepage .vh-stage:after{height:18%}
.simple-hero-text{padding:30px 18px 44px;text-align:center;background:#f3ecdf}
.simple-hero-text h1{margin:0;font-weight:400;color:var(--ink);font-size:clamp(24px,3vw,36px);letter-spacing:4px;line-height:1.4}
.simple-hero-text h1 span{display:block;margin-top:6px;font-size:clamp(14px,1.3vw,17px);font-style:italic;letter-spacing:1px;color:var(--ink2)}
.simple-listen{margin-top:24px;display:inline-flex;align-items:baseline;gap:10px;padding:15px 38px;border:0;border-radius:999px;background:#9a6a22;color:#fffaf0;font:inherit;font-size:20px;letter-spacing:2px;cursor:pointer;box-shadow:0 6px 16px rgba(110,72,18,.25)}
.simple-listen span{font-size:14px;letter-spacing:1px;opacity:.85}
.simple-listen:hover{background:#86591a}

/* 2. Four featured works + browse all */
.homepage .featured-section{padding:48px 5.2% 56px;background:#faf6ee}
.homepage .featured-section h2#featuredHeading{margin:0 0 24px;font-weight:400;color:var(--ink);font-size:clamp(24px,2vw,30px);letter-spacing:3px;text-align:center}
#featuredHeading span,.home-about h2 span,.browse-all span{margin-left:10px;font-size:.55em;letter-spacing:1px;color:var(--ink2);font-style:italic}
.homepage .featured-card h2{color:var(--ink);font-size:clamp(16px,1.15vw,19px)}
.browse-all{margin:32px 0 0;text-align:center}
.browse-all a{display:inline-block;padding:12px 28px;border:1px solid #9a6a22;border-radius:999px;color:#6b4512;text-decoration:none;font-size:17px;letter-spacing:1px}
.browse-all a:hover{background:#f3e7cf}
.browse-all span{font-size:13px}

/* 3. Her photo + short intro */
.home-about{display:flex;align-items:center;justify-content:center;gap:clamp(24px,4vw,52px);max-width:960px;margin:0 auto;padding:56px clamp(18px,5vw,40px) 64px;font-family:Georgia,"Times New Roman",serif}
.home-about img{flex:none;width:200px;height:200px;border-radius:50%;object-fit:cover;border:2px solid #c9a464}
.home-about h2{margin:0 0 12px;font-weight:400;color:var(--ink);font-size:clamp(22px,2.2vw,28px);letter-spacing:2px}
.home-about p{margin:0 0 18px;font-size:17px;line-height:1.9;color:var(--ink)}
.home-about-text>a{color:#6b4512;font-size:17px;text-decoration:underline;text-underline-offset:5px}

/* Player: shows only after Listen, compact, leaves room at the bottom */
.now-playing{width:min(500px,calc(100vw - 24px));padding:8px 12px;gap:10px;bottom:12px}
.now-playing button{width:34px;height:34px;font-size:14px}
.now-playing strong{font-size:15px}
body.player-open .home-footer{padding-bottom:110px}
.now-playing:not(.show){visibility:hidden}
.home-footer{padding-bottom:40px}
.footer-social{flex-wrap:wrap}

@media(max-width:700px){
  .homepage .vh-stage{aspect-ratio:16/10}
  .simple-hero-text{padding:24px 16px 34px}
  .simple-hero-text h1{letter-spacing:2px}
  .simple-listen{width:100%;max-width:300px;justify-content:center}
  .homepage .featured-section{padding:36px 16px 44px}
  .home-about{flex-direction:column;text-align:center;padding:40px 20px 48px}
  .home-about img{width:150px;height:150px}
  #featuredHeading span,.home-about h2 span{display:block;margin:6px 0 0}
  .now-playing .progress{display:none}
}
html,body{overflow-x:hidden}

/* 2026-10-19 her choice: the original portrait + European lake picture as the main image */
.homepage .vh-bar{position:relative;background:#3a2b1c!important;padding-bottom:16px}
.europe-hero{position:relative;line-height:0}
.europe-hero img{display:block;width:100%;height:auto}
.eh-hot{position:absolute;display:block;border:0;padding:0;background:transparent;cursor:pointer;border-radius:999px}
.eh-hot.listen{left:23.4%;top:60.5%;width:15.3%;height:15%}
.eh-hot.license{left:39.8%;top:60.5%;width:18.6%;height:15%}
.eh-hot:hover{box-shadow:0 0 0 3px rgba(226,188,110,.75)}
.eh-hot:focus-visible{outline:3px solid #9a6a22;outline-offset:2px}
.europe-mobile-text{display:none}
.home-about{display:block;max-width:820px;text-align:center}
@media(max-width:700px){
  .eh-hot.listen{left:5%;top:56%;width:26.5%;height:24%}
  .eh-hot.license{left:33.5%;top:56%;width:34%;height:24%}
}
