/* Vivid preview 2026-10-18: her own artworks as a slideshow, golden glow behind the words */

/* ---------- Home slideshow ---------- */
.vivid-hero{position:relative;background:#f7efdf;line-height:normal;font-family:Georgia,"Times New Roman",serif}
.vh-bar{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px clamp(18px,5vw,72px) 34px;background:linear-gradient(180deg,rgba(255,250,238,.96) 0%,rgba(255,250,238,.82) 55%,rgba(255,250,238,0) 100%)}
.vh-brand{display:flex;align-items:baseline;gap:8px;text-decoration:none;color:#2a2014;white-space:nowrap}
.vh-mark{align-self:center;width:38px;height:34px;background:#a8772c;-webkit-mask:url(assets/jq-harp.png) center/contain no-repeat;mask:url(assets/jq-harp.png) center/contain no-repeat}
.vh-jq{font-style:italic;font-size:36px;color:#a8772c;line-height:1}
.vh-word{font-size:19px;letter-spacing:3px}
.vh-cn{font-size:19px;letter-spacing:3px;color:#3a2c1b}
.vh-nav{display:flex;gap:clamp(12px,2vw,30px)}
.vh-nav a{text-align:center;text-decoration:none;color:#2a2014;font-size:13px;letter-spacing:1px;padding-bottom:6px;border-bottom:2px solid transparent}
.vh-nav a span{display:block;font-size:12px;color:#6f4d1c;margin-top:3px;letter-spacing:2px}
.vh-nav a.active,.vh-nav a:hover{border-bottom-color:#a8772c}
.vh-menu{display:none}
.vh-stage{position:relative;width:100%;aspect-ratio:1672/941;max-height:92vh;overflow:hidden;background:#e9dcc2}
.vh-slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.2s ease}
.vh-slide.is-on{opacity:1}
.vh-slide img{width:100%;height:100%;object-fit:cover;display:block}
.vh-stage:after{content:"";position:absolute;inset:auto 0 0 0;height:38%;background:linear-gradient(0deg,rgba(247,239,223,.95),rgba(247,239,223,0));pointer-events:none}
.vh-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,250,238,.8);background:rgba(42,32,20,.28);color:#fffaf0;font-size:30px;line-height:40px;cursor:pointer;backdrop-filter:blur(4px)}
.vh-arrow.prev{left:18px}.vh-arrow.next{right:18px}
.vh-arrow:hover{background:rgba(168,119,44,.75)}
.vh-caption{position:relative;z-index:4;width:min(980px,calc(100% - 32px));margin:-120px auto 0;padding:30px clamp(20px,4vw,48px) 26px;text-align:center;background:radial-gradient(ellipse at 50% 0%,rgba(255,236,190,.55),rgba(255,236,190,0) 70%),linear-gradient(180deg,rgba(255,252,244,.97),rgba(250,242,226,.97));border:1px solid rgba(166,118,44,.5);box-shadow:inset 0 0 0 5px rgba(255,252,244,.95),inset 0 0 0 6px rgba(166,118,44,.28),0 18px 40px rgba(70,51,22,.16);border-radius:4px}
.vh-eyebrow{margin:0 0 10px;color:#8a5c1a;font-size:13px;letter-spacing:3px}
.vh-title{margin:0;font-weight:400;color:#2a2014}
.vh-zh{display:block;font-size:clamp(30px,4vw,46px);letter-spacing:8px}
.vh-en{display:block;font-style:italic;color:#6f4d1c;font-size:clamp(16px,1.6vw,20px);margin-top:6px}
.vh-tag{margin:12px 0 18px;color:#4a3b28;font-size:15px;letter-spacing:1px}
.vh-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.vh-btn{display:inline-block;padding:12px 22px;border-radius:999px;font:inherit;font-size:15px;text-decoration:none;cursor:pointer;line-height:1.2}
.vh-btn.gold{border:0;background:linear-gradient(180deg,#c4923f,#a1702a);color:#fffaf0;box-shadow:0 6px 16px rgba(120,80,20,.25)}
.vh-btn.ivory{border:1px solid rgba(166,118,44,.6);background:#fffdf8;color:#5a3f17}
.vh-dots{display:flex;justify-content:center;gap:10px;margin-top:18px}
.vh-dots button{width:10px;height:10px;padding:0;border-radius:50%;border:1px solid #a8772c;background:transparent;cursor:pointer}
.vh-dots button[aria-selected="true"]{background:#a8772c}
.homepage .hero-mobile{display:none!important}
@media(max-width:980px){.vh-nav{display:none}.vh-menu{display:block;position:relative}
  .vh-menu summary{list-style:none;cursor:pointer;padding:9px 16px;border:1px solid rgba(166,118,44,.55);border-radius:999px;background:#fffdf8;color:#2a2014;font-size:14px;letter-spacing:1px}
  .vh-menu summary::-webkit-details-marker{display:none}
  .vh-menu summary span{font-size:12px;color:#6f4d1c}
  .vh-menu nav{position:absolute;right:0;top:calc(100% + 8px);display:flex;flex-direction:column;min-width:210px;background:#fffdf8;border:1px solid rgba(166,118,44,.4);border-radius:14px;box-shadow:0 14px 30px rgba(70,51,22,.18);overflow:hidden}
  .vh-menu nav a{padding:13px 18px;color:#2a2014;text-decoration:none;font-size:15px;border-bottom:1px solid rgba(166,118,44,.15)}}
@media(max-width:700px){
  .vh-bar{position:relative;padding:12px 16px;background:#fffaf0;border-bottom:1px solid rgba(166,118,44,.2)}
  .vh-jq{font-size:30px}.vh-word,.vh-cn{font-size:15px;letter-spacing:2px}.vh-mark{width:30px;height:27px}
  .vh-stage:after{height:22%}
  .vh-arrow{width:38px;height:38px;font-size:24px;line-height:34px}
  .vh-arrow.prev{left:8px}.vh-arrow.next{right:8px}
  .vh-caption{margin-top:-28px;padding:24px 18px 20px}
  .vh-zh{letter-spacing:5px}
  .vh-btn{width:100%;max-width:300px}
}

/* ---------- Inner page headers: soft artwork + golden glow ---------- */
.music-hero:not(.violin-hero){background-size:cover!important;background-position:center 100%!important;padding:clamp(30px,5vw,60px) 16px}
.music-hero.about-hero{background-image:url(assets/vivid/vienna-soft.webp)!important}
.music-hero:not(.info-hero):not(.licensing-hero):not(.violin-hero){background-image:url(assets/vivid/lotus-soft.webp)!important}
.music-hero.contact-hero{background-image:url(assets/vivid/river-soft.webp)!important}
.music-hero.licensing-hero{background-image:url(assets/vivid/mountain-soft.webp)!important}
.music-hero:not(.violin-hero):before{inset:0;border:0;box-shadow:none;background:radial-gradient(ellipse 46% 74% at 50% 50%,rgba(255,249,234,.95) 0%,rgba(255,246,226,.88) 55%,rgba(255,240,212,.25) 85%,rgba(255,240,212,0) 100%)}
.music-hero:not(.violin-hero):after{display:none}
.music-hero:not(.violin-hero) .hero-copy{position:relative;z-index:2;width:min(760px,100%);padding:clamp(26px,4vw,48px) clamp(14px,3vw,40px);border-top:1px solid rgba(166,118,44,.55);border-bottom:1px solid rgba(166,118,44,.55)}
@media(max-width:700px){.music-hero:not(.violin-hero):before{background:radial-gradient(ellipse 95% 80% at 50% 50%,rgba(255,249,234,.95) 0%,rgba(255,246,226,.86) 60%,rgba(255,240,212,.35) 100%)}}
.vh-title,.vh-caption .vh-en{transition:opacity .5s ease}.vh-title.fading{opacity:0}

/* Artist portrait on the home caption card */
.vh-caption{display:grid;grid-template-columns:240px 1fr;gap:clamp(20px,3vw,40px);align-items:center;text-align:center}
.vh-artist img{display:block;width:210px;height:210px;margin:0 auto;border-radius:50%;object-fit:cover;border:4px solid #fffdf8;box-shadow:0 0 0 1px rgba(166,118,44,.65),0 0 0 7px rgba(255,248,232,.9),0 0 0 8px rgba(166,118,44,.35),0 12px 28px rgba(70,51,22,.18)}
.vh-sign{margin:16px 0 2px;font-family:"Snell Roundhand","Apple Chancery","Brush Script MT",cursive;font-size:30px;color:#6f4d1c;line-height:1.1}
.vh-role{margin:0;color:#5c4d39;font-size:13px;letter-spacing:1.5px;line-height:1.6}
.vh-tag span{display:block;margin-top:4px;letter-spacing:3px}
@media(max-width:700px){
  .vh-stage{aspect-ratio:4/3}
  .vh-caption{grid-template-columns:1fr;gap:6px;margin-top:-70px;padding-top:0}
  .vh-artist img{width:140px;height:140px;margin-top:-10px;position:relative;top:-14px}
  .vh-sign{margin-top:-4px;font-size:26px}
}