
:root{
  --bg:#fff7fa;
  --ink:#26121f;
  --plum:#341126;
  --wine:#672247;
  --pink:#e15790;
  --rose:#f39fbc;
  --gold:#e9c56c;
  --cream:#fffdf8;
  --soft:#f7e4ed;
  --card:#ffffff;
  --shadow:0 18px 48px rgba(110,43,79,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#fff7fa 0%,#fffcfd 100%);color:var(--ink)}
img{max-width:100%;display:block}
a{color:inherit}
.sparkle-layer{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.sparkle-layer:before,.sparkle-layer:after{
  content:"✦   ✧   ✦   ✧   ✦";
  position:absolute;
  color:rgba(255,255,255,.78);
  font-size:20px;
  letter-spacing:22px;
  animation:twinkle 3s infinite alternate;
}
.sparkle-layer:before{top:110px;left:4%}
.sparkle-layer:after{top:280px;right:6%;animation-delay:1.1s}
@keyframes twinkle{from{opacity:.25;transform:translateY(0) scale(.94)}to{opacity:.9;transform:translateY(-6px) scale(1.05)}}

.hero,.sub-hero{
  position:relative; z-index:1; overflow:hidden;
  background:
    radial-gradient(circle at 18% 15%, rgba(255,255,255,.16), transparent 22%),
    radial-gradient(circle at 80% 15%, rgba(255,215,230,.20), transparent 26%),
    linear-gradient(130deg,#250b1e 0%, #5b1c43 42%, #c64579 80%, #f2a6bf 100%);
  color:#fff;
}
.hero:after,.sub-hero:after{
  content:"♠  ♥  ♣  ♦";
  position:absolute; right:-20px; bottom:-25px;
  font-size:150px; opacity:.04; letter-spacing:14px;
}
.site-nav,.hero-grid,.sub-hero-inner,.footer-inner,.feature-row,.split-section,.program-highlights,.inquiry-section,.main-narrow,.contact-board{
  position:relative; z-index:2;
}
.site-nav{
  max-width:1200px; margin:auto; padding:22px 24px;
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.logo{font-family:Georgia,serif; font-size:24px; text-decoration:none; color:#fff; letter-spacing:.06em}
.logo span{color:#ffe7a0; text-shadow:0 0 12px rgba(255,255,255,.65)}
.logo b{display:block; font-family:Arial,sans-serif; font-size:11px; letter-spacing:.25em; margin-left:26px}
.menu{display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:flex-end}
.menu a{color:#fff; text-decoration:none; padding:9px 12px; border-radius:999px}
.menu a:hover{background:rgba(255,255,255,.10)}
.nav-btn,.phone-pill{
  border:1px solid rgba(255,255,255,.30);
  background:rgba(255,255,255,.10);
}
.menu select{
  border:1px solid rgba(255,255,255,.34);
  background:#fff; color:var(--wine);
  border-radius:999px; padding:9px 12px; font:inherit;
}
.hero-grid{
  max-width:1200px; margin:auto; padding:88px 24px 96px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:52px; align-items:center;
}
.hero-copy h1,.sub-hero-inner h1{
  font-family:Georgia,serif; font-weight:normal; line-height:1.02;
  margin:10px 0 14px;
}
.hero-copy h1{font-size:60px; max-width:760px}
.sub-hero-inner h1{font-size:48px; max-width:760px}
.eyebrow{font-size:12px; letter-spacing:.22em; text-transform:uppercase; font-weight:700}
.lead,.sub-hero-inner p{font-size:19px; line-height:1.7; color:#fff1f6; max-width:760px}
.hero-zh{font-size:26px; color:#ffe3ec; margin:0 0 18px; font-weight:700}
.cta-row{display:flex; flex-wrap:wrap; gap:14px; margin-top:26px}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:15px 24px; border-radius:999px; text-decoration:none; border:1px solid transparent;
  font-weight:700;
}
.btn-primary{background:linear-gradient(135deg,#ffecb0,#e9bf63); color:#4b1b32; box-shadow:0 10px 28px rgba(0,0,0,.12)}
.btn-glass{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28); color:#fff}
.mini-features{display:flex; flex-wrap:wrap; gap:18px; margin-top:24px; color:#ffeaf2; font-size:14px}
.hero-poster-card{
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.26);
  border-radius:28px; padding:20px; backdrop-filter:blur(10px);
  box-shadow:0 20px 60px rgba(15,0,12,.25)
}
.hero-poster-card img{border-radius:18px; box-shadow:0 10px 24px rgba(0,0,0,.18)}
.hero-poster-meta{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-top:14px}
.hero-poster-meta a{font-size:26px; font-family:Georgia,serif; text-decoration:none}
.hero-poster-meta span{font-size:13px; color:#ffe9f2}

.feature-row,.split-section,.program-highlights,.inquiry-section,.main-narrow{max-width:1160px; margin:auto; padding:0 24px}
.three-up{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:-38px; margin-bottom:76px}
.info-card,.detail-card,.topic-card,.contact-box{
  background:var(--card); border-radius:24px; padding:28px; box-shadow:var(--shadow);
  border:1px solid #f0dbe5;
}
.card-icon{font-size:28px; color:var(--pink)}
.info-card h3,.topic-card h3,.detail-card h3,.text-panel h2,.section-head h2,.vegas-panel h2,.career-banner h2{font-family:Georgia,serif}
.info-card h3{font-size:26px; margin:12px 0 8px}
.info-card p,.detail-card p,.text-panel p,.bullet-list li,.topic-card p,.section-head p,.vegas-panel p,.qr-card p,.contact-box p,.contact-box li{line-height:1.65; color:#6f5b67}

.split-section{
  display:grid; grid-template-columns:1.04fr .96fr; gap:32px;
  align-items:center; margin-bottom:82px;
}
.split-section.reverse{grid-template-columns:.96fr 1.04fr}
.text-panel{
  background:#fff; border:1px solid #efdde6; border-radius:28px; padding:36px; box-shadow:var(--shadow)
}
.text-panel h2{font-size:40px; margin:8px 0 14px}
.hot{color:#d44f84}
.bullet-list{padding-left:18px}
.image-stack{display:grid; gap:16px}
.image-stack img{
  border-radius:24px; box-shadow:var(--shadow); border:1px solid #f0dbe5; background:#fff
}

.program-highlights{margin-bottom:80px}
.section-head{max-width:760px; margin:0 auto 36px}
.center{text-align:center}
.section-head h2{font-size:46px; margin:8px 0 12px}
.topic-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.topic-card{padding:26px}
.topic-card b{
  width:54px; height:54px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; background:linear-gradient(135deg,#f7d88b,#efbcd2); color:#4a1933; font-size:22px; margin-bottom:10px
}
.topic-card h3{font-size:28px; margin:6px 0}
.topic-card p{margin:0}

.inquiry-section{margin-bottom:86px}
.inquiry-form{
  background:#fff; border:1px solid #efdae4; border-radius:30px; padding:34px; box-shadow:var(--shadow)
}
.form-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px}
.form-grid label span{display:block; margin-bottom:8px; font-size:13px; font-weight:700}
.form-grid input,.form-grid select,.form-grid textarea{
  width:100%; border:1px solid #dcc8d2; border-radius:14px; padding:13px 14px; font:inherit; background:#fff
}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{
  outline:none; border-color:#d8588d; box-shadow:0 0 0 3px rgba(226,94,147,.12)
}
.full{grid-column:1/-1}
.hp{position:absolute; left:-999em}
.consent{display:flex; align-items:flex-start; gap:10px; margin:18px 0 18px; color:#705c67}
.full-btn{width:100%}
.status{margin-top:16px; min-height:24px; font-weight:700; color:#7c224c}

.sub-hero-inner{
  max-width:1200px; margin:auto; padding:58px 24px 72px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:42px; align-items:center;
}
.sub-hero-img{
  border-radius:24px; box-shadow:0 18px 48px rgba(0,0,0,.20); border:1px solid rgba(255,255,255,.20)
}
.main-narrow{padding-top:42px; padding-bottom:86px}
.detail-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-bottom:40px}
.detail-card h3{font-size:29px; margin:0 0 10px}
.career-banner{
  margin:30px 0 78px; border-radius:28px; padding:34px; color:#fff;
  background:linear-gradient(125deg,#39132e,#6b2349,#be487a);
  box-shadow:var(--shadow)
}
.career-banner h2{font-size:40px; margin:6px 0 12px}
.career-banner p{color:#f8eaf0; line-height:1.65}
.career-chip-wrap{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
.career-chip-wrap span{
  padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18)
}

.gallery-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:48px
}
.gallery-card{
  background:#fff; border:1px solid #f0dbe5; border-radius:24px; padding:14px; box-shadow:var(--shadow)
}
.gallery-card img{border-radius:18px; width:100%; height:250px; object-fit:cover}
.gallery-card.tall{grid-row:span 2}
.gallery-card.tall img{height:100%}
.gallery-card.wide{grid-column:span 2}
.gallery-card.wide img{height:280px; object-fit:cover}
.gallery-card figcaption{padding:12px 6px 4px; color:#705d67; line-height:1.5}

.vegas-panel{
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
  background:linear-gradient(135deg,#fff3f7,#f9e1e9); border:1px solid #f1dbe3;
  border-radius:28px; padding:30px;
}
.vegas-panel h2{font-size:38px; margin:6px 0 12px}
.vegas-tag-cloud{display:flex; flex-wrap:wrap; gap:12px; align-content:flex-start}
.vegas-tag-cloud span{
  padding:12px 15px; border-radius:999px; background:#fff; border:1px solid #efd7e0; color:#80335a; box-shadow:0 8px 18px rgba(0,0,0,.05)
}

.qr-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:34px}
.qr-card{
  background:#fff; border:1px solid #efdbe4; border-radius:24px; padding:24px; box-shadow:var(--shadow); text-align:center
}
.qr-card img{width:100%; max-width:270px; margin:0 auto 16px; border-radius:18px; border:1px solid #f0dbe5; background:#fff}
.qr-card h3{font-family:Georgia,serif; font-size:28px; margin:8px 0}
.contact-board{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.contact-box h3{font-family:Georgia,serif; font-size:29px; margin:0 0 10px}
.contact-box code,.qr-card code{
  background:#f7ecf1; padding:2px 6px; border-radius:6px; font-family:Consolas,monospace; color:#6a2850
}

.site-footer{
  position:relative; z-index:2; background:#22121d; color:#f2e8ee; padding:46px 24px 28px
}
.footer-inner{
  max-width:1200px; margin:auto; display:grid; grid-template-columns:1.1fr .6fr .9fr; gap:28px
}
.footer-links,.footer-contact{display:flex; flex-direction:column; gap:10px}
.footer-links a,.footer-contact a{text-decoration:none; color:#f2e8ee}
.footer-logo{font-size:20px}
.fine-print{
  max-width:1200px; margin:20px auto 0; color:#bbaeb6; font-size:12px; line-height:1.6
}

@media (max-width:980px){
  .hero-grid,.sub-hero-inner,.split-section,.split-section.reverse,.vegas-panel,.contact-board,.footer-inner{grid-template-columns:1fr}
  .three-up,.topic-grid,.detail-grid,.qr-grid,.gallery-grid{grid-template-columns:1fr 1fr}
  .gallery-card.wide{grid-column:auto}
  .gallery-card.tall{grid-row:auto}
  .gallery-card.tall img,.gallery-card.wide img{height:250px}
  .menu{gap:8px}
}
@media (max-width:700px){
  .site-nav{align-items:flex-start}
  .menu{flex-direction:column; align-items:flex-end}
  .hero-copy h1,.sub-hero-inner h1{font-size:40px}
  .hero-zh{font-size:21px}
  .lead,.sub-hero-inner p{font-size:17px}
  .three-up,.topic-grid,.detail-grid,.qr-grid,.gallery-grid,.contact-board,.form-grid{grid-template-columns:1fr}
  .full{grid-column:auto}
  .section-head h2,.text-panel h2,.vegas-panel h2,.career-banner h2{font-size:33px}
  .hero-poster-meta{flex-direction:column; align-items:flex-start}
}

/* V4 Games & Media */
.dropdown{position:relative;display:inline-block}
.dropdown-content{display:none;position:absolute;top:38px;left:0;min-width:190px;background:#fff;border-radius:16px;padding:8px;box-shadow:0 16px 38px rgba(45,10,32,.2);z-index:20}
.dropdown-content a{display:block!important;color:#5e2344!important;border-radius:10px!important;padding:10px 12px!important}
.dropdown-content a:hover{background:#f8e7ef!important}
.dropdown:hover .dropdown-content{display:block}
.game-jump{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:0 0 48px}
.game-jump a{padding:12px 18px;border-radius:999px;text-decoration:none;background:#fff;border:1px solid #ead5df;color:#7b2b54;box-shadow:0 8px 20px rgba(90,35,65,.08)}
.game-media-card{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:start;background:#fff;border:1px solid #efdce5;border-radius:28px;padding:30px;margin:0 0 30px;box-shadow:var(--shadow)}
.game-media-card.alt{background:linear-gradient(135deg,#fff,#fff6fa)}
.game-copy h2{font-family:Georgia,serif;font-size:38px;margin:8px 0 12px}
.game-copy p,.game-copy li,.media-credit,.responsible-note p{line-height:1.65;color:#6d5965}
.game-copy ul{padding-left:20px}
.game-badge{display:inline-flex;min-width:54px;height:54px;padding:0 12px;border-radius:50%;align-items:center;justify-content:center;background:linear-gradient(135deg,#f7d688,#efb8d0);color:#4d1934;font-weight:700;font-size:22px}
.listen-btn{border:0;border-radius:999px;padding:12px 18px;background:linear-gradient(90deg,#76244f,#db5288);color:#fff;font-weight:700;cursor:pointer;margin-top:8px}
.media-stack{display:grid;gap:14px}
.media-stack>img{width:100%;max-height:320px;object-fit:cover;border-radius:20px}
.video-wrap{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:20px;background:#111;box-shadow:0 10px 28px rgba(0,0,0,.15)}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-link-card{display:block;position:relative;border-radius:20px;overflow:hidden;text-decoration:none;background:#111;color:#fff}
.video-link-card img{width:100%;aspect-ratio:16/9;object-fit:cover;opacity:.82}
.video-link-card span{position:absolute;left:18px;right:18px;bottom:18px;padding:12px 15px;border-radius:12px;background:rgba(0,0,0,.66);font-weight:700}
.media-credit{font-size:12px;margin:0}
.responsible-note{background:#f7edf2;border:1px solid #ead4df;border-radius:22px;padding:24px;margin-top:40px}
.responsible-note h3{font-family:Georgia,serif;font-size:27px;margin:0 0 8px}
@media(max-width:850px){
  .game-media-card{grid-template-columns:1fr}
  .dropdown-content{position:static;box-shadow:none;margin-top:5px}
}
