:root{
  --bg:#080a18; --panel:#10142b; --panel2:#171c38; --ink:#f8f7ff; --muted:#aeb4cf;
  --pink:#ff4fd8; --violet:#8b5cff; --cyan:#52e7ff; --line:rgba(255,255,255,.10);
  --shadow:0 24px 70px rgba(0,0,0,.38);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:
radial-gradient(circle at 85% 10%,rgba(139,92,255,.18),transparent 24rem),
radial-gradient(circle at 10% 25%,rgba(255,79,216,.11),transparent 22rem),var(--bg);color:var(--ink);line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{width:min(1180px,92vw);margin:auto}
.nav{position:sticky;top:0;z-index:30;background:rgba(8,10,24,.78);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav-inner{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-weight:900;letter-spacing:-.04em;font-size:1.45rem;display:flex;align-items:center;gap:10px}
.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--pink),var(--violet),var(--cyan));display:grid;place-items:center;box-shadow:0 0 28px rgba(139,92,255,.4)}
.navlinks{display:flex;gap:24px;align-items:center;color:#d9dcf0;font-size:.95rem}
.navlinks a:hover,.navlinks a.active{color:white}
.menu{display:none;border:1px solid var(--line);background:transparent;color:white;border-radius:12px;padding:8px 11px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border-radius:14px;font-weight:800;border:1px solid transparent;transition:.2s transform,.2s box-shadow}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--pink),var(--violet));box-shadow:0 10px 30px rgba(139,92,255,.3)}
.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.04)}
.hero{padding:86px 0 52px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.eyebrow{display:inline-flex;gap:8px;align-items:center;color:#e8dfff;background:rgba(139,92,255,.12);border:1px solid rgba(139,92,255,.3);padding:7px 11px;border-radius:999px;font-size:.84rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
h1,h2,h3{line-height:1.05;letter-spacing:-.045em;margin:0}
h1{font-size:clamp(3.2rem,8vw,6.6rem);max-width:9ch;margin-top:18px}
.gradient-text{background:linear-gradient(95deg,#fff 8%,#ff78df 42%,#9b78ff 70%,#64e9ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.14rem;color:var(--muted);max-width:62ch;margin:22px 0 28px}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-art{min-height:470px;border:1px solid var(--line);border-radius:34px;position:relative;overflow:hidden;background:
linear-gradient(160deg,rgba(255,79,216,.18),rgba(82,231,255,.08)),
radial-gradient(circle at 70% 30%,rgba(82,231,255,.35),transparent 30%),
radial-gradient(circle at 30% 70%,rgba(255,79,216,.30),transparent 28%),#11152f;box-shadow:var(--shadow)}
.hero-art:before,.hero-art:after{content:"";position:absolute;border-radius:50%;filter:blur(1px)}
.hero-art:before{width:240px;height:240px;right:40px;top:55px;border:2px solid rgba(82,231,255,.55);box-shadow:0 0 40px rgba(82,231,255,.15)}
.hero-art:after{width:320px;height:320px;left:-90px;bottom:-80px;border:2px solid rgba(255,79,216,.35)}
.dancer{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:180px;height:280px}
.dancer .head{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#f4d3dc,#caa7ff);position:absolute;left:58px;top:14px;box-shadow:0 0 30px rgba(255,255,255,.15)}
.dancer .body{width:70px;height:125px;background:linear-gradient(180deg,#ff4fd8,#714cff);border-radius:28px 28px 18px 18px;position:absolute;left:55px;top:82px;transform:rotate(-7deg)}
.dancer .arm,.dancer .leg{position:absolute;height:20px;border-radius:20px;background:linear-gradient(90deg,#a584ff,#52e7ff);transform-origin:10px 10px}
.dancer .arm.a1{width:112px;left:-25px;top:100px;transform:rotate(-35deg)}
.dancer .arm.a2{width:128px;left:111px;top:105px;transform:rotate(-52deg)}
.dancer .leg.l1{width:130px;left:46px;top:210px;transform:rotate(70deg)}
.dancer .leg.l2{width:138px;left:74px;top:205px;transform:rotate(112deg)}
.float-card{position:absolute;background:rgba(10,12,30,.76);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow)}
.fc1{left:24px;top:28px}.fc2{right:20px;bottom:22px}.fc3{right:28px;top:120px}
.kicker{color:var(--cyan);font-weight:900;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}
.section{padding:72px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}
.section h2{font-size:clamp(2.2rem,5vw,4rem)}
.section-copy{color:var(--muted);max-width:58ch}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 14px 40px rgba(0,0,0,.16)}
.card h3{font-size:1.35rem;margin:10px 0}
.card p{color:var(--muted);margin:0 0 16px}
.thumb{aspect-ratio:16/10;border-radius:18px;background:
linear-gradient(135deg,rgba(255,79,216,.65),rgba(139,92,255,.35) 45%,rgba(82,231,255,.55));display:flex;align-items:end;padding:16px;overflow:hidden;position:relative}
.thumb:after{content:"";position:absolute;inset:auto -20% -60% 20%;height:180px;border:2px solid rgba(255,255,255,.35);border-radius:50%}
.pill{display:inline-block;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.1);font-size:.75rem;font-weight:800}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.video{aspect-ratio:16/9;border:0;width:100%;border-radius:20px;background:#000}
.split{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.callout{padding:30px;border-radius:28px;background:linear-gradient(135deg,rgba(255,79,216,.14),rgba(82,231,255,.08));border:1px solid var(--line)}
.steps{counter-reset:step;display:grid;gap:14px}
.step{counter-increment:step;display:grid;grid-template-columns:auto 1fr;gap:14px;padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}
.step:before{content:counter(step);width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--pink),var(--violet));display:grid;place-items:center;font-weight:900}
.notice{font-size:.92rem;color:#c8cce2;padding:14px 16px;border-left:3px solid var(--cyan);background:rgba(82,231,255,.06);border-radius:0 12px 12px 0}
.footer{border-top:1px solid var(--line);padding:34px 0 48px;color:var(--muted);margin-top:40px}
.footer-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.footer a:hover{color:white}
.page-hero{padding:70px 0 34px}
.page-hero h1{font-size:clamp(3rem,7vw,5.8rem);max-width:11ch}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.filter{border:1px solid var(--line);background:rgba(255,255,255,.03);color:white;padding:9px 12px;border-radius:999px;cursor:pointer}
.filter.active{background:white;color:#111}
.hidden{display:none!important}
.form{display:grid;gap:14px}
label{font-weight:800}
input,textarea,select{width:100%;padding:13px 14px;border-radius:13px;border:1px solid var(--line);background:#0e1229;color:white;font:inherit}
textarea{min-height:140px;resize:vertical}
.small{font-size:.86rem;color:var(--muted)}
@media(max-width:850px){
 .hero-grid,.split,.grid{grid-template-columns:1fr}
 .hero{padding-top:54px}.hero-art{min-height:390px}.navlinks{display:none;position:absolute;left:4vw;right:4vw;top:68px;background:#0d1025;border:1px solid var(--line);border-radius:18px;padding:16px;flex-direction:column;align-items:flex-start}
 .navlinks.open{display:flex}.menu{display:block}.section-head{align-items:flex-start;flex-direction:column}
}
@media(max-width:520px){
 .wrap{width:min(92vw,1180px)}.hero-art{min-height:330px}.fc3{display:none}.dancer{transform:translate(-50%,-50%) scale(.82)}
 .btn{width:100%}.actions{display:grid}.section{padding:52px 0}.card{padding:18px}
}


/* --- V2 visual upgrade --- */
.hero{padding:72px 0 56px}
.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:46px;align-items:center}
.hero h1{font-size:clamp(3rem,6.5vw,5.7rem);max-width:8.7ch}
.hero-art{min-height:500px;border:1px solid var(--line);border-radius:34px;position:relative;overflow:hidden;background:radial-gradient(circle at 15% 16%,rgba(255,79,216,.38),transparent 20rem),radial-gradient(circle at 82% 20%,rgba(82,231,255,.32),transparent 18rem),linear-gradient(180deg,#171532 0%,#12152f 50%,#0a0d1c 100%);box-shadow:var(--shadow)}
.hero-stage{position:absolute;inset:0;background:linear-gradient(115deg,transparent 48%,rgba(255,255,255,.07) 49%,transparent 50%),linear-gradient(65deg,transparent 48%,rgba(255,255,255,.05) 49%,transparent 50%);background-size:120px 120px;opacity:.7}
.hero-glow{position:absolute;border-radius:50%;filter:blur(6px);opacity:.95}.hero-glow.g1{width:260px;height:260px;left:-70px;bottom:40px;background:rgba(255,79,216,.22)}.hero-glow.g2{width:300px;height:300px;right:-80px;top:40px;background:rgba(82,231,255,.18)}
.stage-line{position:absolute;left:8%;right:8%;bottom:72px;height:2px;background:linear-gradient(90deg,transparent,var(--pink),var(--cyan),transparent);box-shadow:0 0 28px rgba(82,231,255,.5)}
.anime-dancers{position:absolute;inset:34px 22px 70px;display:flex;justify-content:center;align-items:flex-end;gap:2px}.figure{position:relative;width:155px;height:350px;filter:drop-shadow(0 20px 20px rgba(0,0,0,.35))}.figure.center{transform:scale(1.12) translateY(-5px);z-index:3}.figure.side{transform:scale(.9) translateY(16px);opacity:.92}
.figure .hair{position:absolute;left:43px;top:18px;width:76px;height:82px;background:linear-gradient(145deg,#251345,#883cff 55%,#ff4fd8);border-radius:48% 52% 44% 56% / 44% 42% 58% 56%;box-shadow:0 0 26px rgba(139,92,255,.25)}.figure .hair:before,.figure .hair:after{content:"";position:absolute;background:inherit;border-radius:70% 20% 70% 30%}.figure .hair:before{width:42px;height:24px;left:-20px;top:12px;transform:rotate(-28deg)}.figure .hair:after{width:44px;height:22px;right:-18px;top:15px;transform:rotate(26deg)}
.figure .face{position:absolute;left:56px;top:42px;width:54px;height:58px;background:linear-gradient(180deg,#ffd8df,#f0b9ca);border-radius:50% 50% 46% 46%}.figure .neck{position:absolute;left:75px;top:91px;width:18px;height:20px;background:#efb6c6}.figure .torso{position:absolute;left:48px;top:104px;width:72px;height:118px;border-radius:24px 24px 18px 18px;background:linear-gradient(180deg,#16182f 0%,#2c2147 55%,#ff4fd8 130%);border:1px solid rgba(255,255,255,.15)}.figure .jacket{position:absolute;left:36px;top:110px;width:96px;height:92px;border-radius:20px;background:linear-gradient(135deg,rgba(139,92,255,.95),rgba(255,79,216,.45));clip-path:polygon(0 0,100% 8%,88% 100%,12% 88%)}.figure .waist{position:absolute;left:54px;top:210px;width:64px;height:26px;background:#0c0f23;border-radius:12px}
.figure .arm,.figure .leg{position:absolute;height:22px;border-radius:18px;transform-origin:11px 11px}.figure .arm{background:linear-gradient(90deg,#7d5cff,#ff4fd8)}.figure .leg{background:linear-gradient(90deg,#16172a,#6d4cff 80%)}.figure .a1{width:118px;left:-18px;top:123px;transform:rotate(-32deg)}.figure .a2{width:126px;left:102px;top:126px;transform:rotate(-58deg)}.figure .l1{width:142px;left:44px;top:230px;transform:rotate(72deg)}.figure .l2{width:145px;left:78px;top:230px;transform:rotate(108deg)}.figure.alt .jacket{background:linear-gradient(135deg,#52e7ff,#6d4cff)}.figure.alt .hair{background:linear-gradient(145deg,#0b2141,#1d8fd0 55%,#52e7ff)}.figure.pink .jacket{background:linear-gradient(135deg,#ff4fd8,#8b5cff)}.figure.pink .hair{background:linear-gradient(145deg,#4b173d,#ff4fd8 70%,#ff9cea)}
.float-card{position:absolute;background:rgba(10,12,30,.72);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow);z-index:5}.fc1{left:22px;top:24px}.fc2{right:20px;bottom:18px}.fc3{right:18px;top:108px}
.visual-card{position:relative;overflow:hidden;isolation:isolate}.visual-card .thumb{min-height:205px;align-items:flex-end}.visual-card .thumb:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 28%,rgba(82,231,255,.42),transparent 7rem),radial-gradient(circle at 22% 72%,rgba(255,79,216,.44),transparent 8rem),linear-gradient(145deg,#26153f,#1d2b54 55%,#173e59)}.visual-card .thumb:after{content:"";position:absolute;width:160px;height:160px;border:2px solid rgba(255,255,255,.18);border-radius:50%;right:-30px;bottom:-70px}.visual-card .thumb strong{position:relative;z-index:2;font-size:1.15rem;letter-spacing:.06em}.visual-card .mini-person{position:absolute;right:22px;bottom:18px;width:72px;height:124px;z-index:2}.visual-card .mini-person:before{content:"";position:absolute;width:34px;height:34px;border-radius:50%;background:#f5bfd0;left:18px;top:0;box-shadow:0 0 0 7px rgba(139,92,255,.28)}.visual-card .mini-person:after{content:"";position:absolute;width:42px;height:72px;border-radius:20px;background:linear-gradient(180deg,var(--pink),var(--violet));left:15px;top:39px;transform:rotate(-7deg)}.visual-card.learn .mini-person:after{background:linear-gradient(180deg,var(--cyan),var(--violet))}.visual-card.community .mini-person:after{background:linear-gradient(180deg,#ff9adf,#ff4fd8)}
.feature-frame{position:relative}.feature-frame:before{content:"";position:absolute;inset:-1px;border-radius:22px;background:linear-gradient(135deg,rgba(255,79,216,.65),rgba(82,231,255,.4));z-index:-1;filter:blur(10px);opacity:.25}.video-fallback{aspect-ratio:16/9;border-radius:20px;display:grid;place-items:center;text-align:center;padding:30px;background:radial-gradient(circle at 50% 35%,rgba(255,79,216,.16),transparent 14rem),linear-gradient(135deg,#17152e,#101428);border:1px solid var(--line)}.video-fallback .play{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:0 auto 16px;background:linear-gradient(135deg,var(--pink),var(--violet));font-size:1.4rem;box-shadow:0 0 32px rgba(139,92,255,.28)}
@media(max-width:850px){.hero-grid{grid-template-columns:1fr}.hero h1{max-width:9ch}.hero-art{min-height:430px}.anime-dancers{transform:scale(.88);transform-origin:center bottom}}
@media(max-width:520px){.hero-art{min-height:360px}.anime-dancers{transform:scale(.68);inset:26px -35px 48px}.fc3{display:none}.fc1,.fc2{font-size:.78rem}.hero h1{font-size:clamp(3rem,17vw,4.4rem)}}



/* ===== AnimeDance V3 homepage ===== */
.v3-hero{padding:54px 0 22px}
.v3-hero-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:28px;align-items:stretch}
.v3-copy{display:flex;flex-direction:column;justify-content:center;padding:22px 0}
.v3-copy h1{font-size:clamp(3.15rem,5.7vw,5.9rem);max-width:8.4ch;margin-top:15px}
.v3-copy .lead{font-size:1.03rem;margin:18px 0 22px;max-width:48ch}
.v3-visual{min-height:500px;position:relative;overflow:hidden;border-radius:30px;border:1px solid rgba(255,255,255,.12);background:#11142d;box-shadow:var(--shadow)}
.v3-visual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.v3-visual-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,10,24,.06),transparent 35%),linear-gradient(0deg,rgba(8,10,24,.38),transparent 45%)}
.v3-badge{position:absolute;z-index:2;background:rgba(8,10,24,.80);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:12px 14px;box-shadow:0 16px 36px rgba(0,0,0,.28)}
.v3-badge strong{display:block;font-size:.95rem;margin-top:2px}
.v3-badge-top{left:20px;top:20px}.v3-badge-side{right:18px;top:128px}.v3-badge-bottom{right:18px;bottom:18px}
.v3-ways{padding:22px 0 20px}
.mini-heading{font-size:.79rem;font-weight:900;letter-spacing:.12em;color:#e7ddff;margin-bottom:12px}
.v3-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.v3-route-card{min-height:210px;padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.025));display:grid;grid-template-columns:40% 60%;gap:14px;overflow:hidden;transition:.22s transform,.22s border-color}
.v3-route-card:hover{transform:translateY(-3px);border-color:rgba(82,231,255,.35)}
.v3-route-card h3{font-size:1.3rem;margin:7px 0 8px}.v3-route-card p{font-size:.89rem;color:var(--muted);margin:0 0 15px}.v3-route-card strong{font-size:.88rem}
.route-art{position:relative;border-radius:17px;overflow:hidden;background:radial-gradient(circle at 70% 24%,rgba(82,231,255,.6),transparent 6rem),radial-gradient(circle at 25% 70%,rgba(255,79,216,.6),transparent 7rem),linear-gradient(150deg,#2a1748,#17375e)}
.route-art:before{content:"";position:absolute;width:120px;height:120px;border:2px solid rgba(255,255,255,.18);border-radius:50%;right:-50px;bottom:-46px}
.route-figure{position:absolute;width:58px;height:112px;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-7deg)}
.route-figure:before{content:"";position:absolute;width:36px;height:36px;border-radius:50%;left:11px;top:0;background:#f4bdd1;box-shadow:0 0 0 7px rgba(139,92,255,.32)}
.route-figure:after{content:"";position:absolute;width:46px;height:68px;border-radius:22px 22px 16px 16px;left:6px;top:42px;background:linear-gradient(180deg,#ff4fd8,#7d55ff)}
.learn-card .route-figure:after{background:linear-gradient(180deg,#52e7ff,#7658ff)}.community-card .route-figure:after{background:linear-gradient(180deg,#ff89dc,#ff4fd8)}
.v3-feature{padding:22px 0 56px}
.v3-feature-grid{display:grid;grid-template-columns:.84fr 1.12fr .8fr;gap:14px;border:1px solid rgba(255,255,255,.10);border-radius:24px;padding:14px;background:rgba(255,255,255,.025)}
.v3-video-card{min-height:260px;border-radius:18px;overflow:hidden;position:relative;background:#11142d}
.v3-video-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;filter:saturate(1.2) brightness(.68)}
.v3-video-overlay{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:10px;text-align:center;background:linear-gradient(0deg,rgba(8,10,24,.38),transparent)}
.play{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--pink),var(--violet));box-shadow:0 0 30px rgba(139,92,255,.32)}
.v3-feature-copy{padding:18px}.v3-feature-copy h2{font-size:clamp(1.8rem,3vw,2.6rem);margin:8px 0 12px}.v3-feature-copy p{color:var(--muted);font-size:.96rem;margin:0 0 14px}
.v3-latest{border-left:1px solid rgba(255,255,255,.09);padding:12px 0 12px 14px}.latest-head{display:flex;justify-content:space-between;gap:10px;padding:4px 4px 12px}
.v3-latest>a{display:block;padding:13px 10px;border-top:1px solid rgba(255,255,255,.08)}.v3-latest strong,.v3-latest span{display:block}.v3-latest span{font-size:.79rem;color:var(--muted);margin-top:3px}
@media(max-width:1050px){.v3-hero-grid{grid-template-columns:1fr}.v3-copy h1{max-width:11ch}.v3-visual{min-height:480px}.v3-card-grid{grid-template-columns:1fr}.v3-route-card{grid-template-columns:220px 1fr}.v3-feature-grid{grid-template-columns:1fr 1fr}.v3-latest{grid-column:1/-1;border-left:0;border-top:1px solid rgba(255,255,255,.09);padding-left:0}}
@media(max-width:650px){.v3-hero{padding-top:34px}.v3-copy h1{font-size:clamp(3rem,15vw,4.5rem)}.v3-visual{min-height:360px}.v3-badge-side{display:none}.v3-badge{font-size:.8rem}.v3-route-card{grid-template-columns:1fr}.route-art{min-height:150px}.v3-feature-grid{grid-template-columns:1fr}.v3-latest{grid-column:auto}}


/* =========================
   AnimeDance V4 homepage
   ========================= */
.v4-home{overflow:hidden}
.v4-nav{background:rgba(5,7,18,.92)}
.v4-nav .nav-inner{min-height:68px}
.v4-brand{gap:12px}
.ad-mark{display:flex;align-items:center;font-weight:950;font-style:italic;letter-spacing:-.18em;font-size:1.6rem;line-height:1}
.ad-mark span:first-child{color:var(--pink)}
.ad-mark span:last-child{color:var(--cyan);margin-left:-2px}
.nav-cta{padding:10px 15px;border-radius:10px;font-size:.86rem}

.v4-hero{position:relative;min-height:510px;border-bottom:1px solid var(--line);isolation:isolate}
.v4-hero-bg{position:absolute;inset:0;z-index:-2;background:#090b18}
.v4-hero-bg img{position:absolute;right:0;top:0;width:78%;height:100%;object-fit:cover;object-position:center}
.v4-hero-overlay{position:absolute;inset:0;background:
linear-gradient(90deg,#080a18 0%,#080a18 23%,rgba(8,10,24,.93) 33%,rgba(8,10,24,.38) 55%,rgba(8,10,24,.10) 78%),
linear-gradient(0deg,rgba(8,10,24,.18),transparent 40%)}
.v4-hero-inner{min-height:510px;display:flex;align-items:center}
.v4-hero-copy{width:min(460px,44vw);padding:30px 0}
.v4-hero-copy h1{font-size:clamp(3.15rem,5.45vw,5.75rem);line-height:.93;max-width:none;margin:16px 0 18px}
.v4-hero-copy p{font-size:1rem;color:#d2d6e8;max-width:43ch;margin:0 0 22px}
.v4-hero-copy .actions{gap:10px}
.v4-hero-copy .btn{min-width:165px}

.v4-routes{padding:0 0 10px;margin-top:-1px}
.v4-routes .wrap{padding-top:10px}
.v4-route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.v4-route{min-height:202px;border:1px solid rgba(255,255,255,.12);border-radius:17px;overflow:hidden;background:linear-gradient(145deg,#11152a,#0c1022);display:grid;grid-template-columns:40% 60%;transition:.2s transform,.2s border-color}
.v4-route:hover{transform:translateY(-3px);border-color:rgba(82,231,255,.38)}
.v4-route>img{width:100%;height:100%;object-fit:cover}
.v4-route-body{padding:18px 18px 16px;display:flex;flex-direction:column;justify-content:center}
.v4-route-body h3{font-size:1.35rem;margin:7px 0 8px}
.v4-route-body p{font-size:.87rem;color:var(--muted);margin:0 0 12px}
.v4-route-body strong{font-size:.85rem}

.v4-bottom{padding:8px 0 38px}
.v4-bottom-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:12px}
.v4-feature-card,.v4-latest{border:1px solid rgba(255,255,255,.12);border-radius:17px;background:linear-gradient(145deg,#101429,#0b0f20);overflow:hidden}
.v4-section-title{font-size:.78rem;font-weight:900;letter-spacing:.11em;color:#ff78df}
.v4-feature-card>.v4-section-title{padding:13px 15px 0}
.v4-feature-content{display:grid;grid-template-columns:44% 56%;gap:0;padding:10px}
.v4-feature-image{position:relative;min-height:205px;border-radius:13px;overflow:hidden}
.v4-feature-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.2) brightness(.78)}
.v4-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--pink),var(--violet));box-shadow:0 0 28px rgba(255,79,216,.35)}
.v4-feature-text{padding:16px 14px}
.v4-feature-text h2{font-size:1.55rem;margin:7px 0 8px}
.v4-feature-text p{font-size:.89rem;color:var(--muted);margin:0 0 9px}
.v4-feature-text .btn{padding:10px 13px;font-size:.82rem}

.v4-latest{padding:12px}
.v4-latest-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.v4-latest-head .v4-section-title{color:var(--cyan)}
.v4-latest-head>a{font-size:.8rem;color:var(--cyan)}
.v4-latest-item{display:grid;grid-template-columns:82px 1fr auto;align-items:center;gap:10px;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:12px;margin-top:8px;background:rgba(255,255,255,.02)}
.latest-thumb{height:50px;border-radius:9px;background:radial-gradient(circle at 70% 30%,rgba(82,231,255,.7),transparent 3rem),linear-gradient(135deg,#3b1761,#142849)}
.latest-thumb.two{background:radial-gradient(circle at 30% 60%,rgba(255,79,216,.8),transparent 3rem),linear-gradient(135deg,#281244,#17375f)}
.latest-thumb.three{background:radial-gradient(circle at 60% 35%,rgba(139,92,255,.8),transparent 3rem),linear-gradient(135deg,#1f1644,#183c52)}
.v4-latest-item span strong{display:block;font-size:.86rem}
.v4-latest-item span small{display:block;color:var(--muted);font-size:.72rem;margin-top:2px}
.v4-latest-item em{font-style:normal;font-size:.69rem;padding:4px 7px;border-radius:999px;background:rgba(139,92,255,.16);color:#d9d0ff}
.v4-footer{margin-top:0;padding:22px 0 30px}

@media(max-width:1000px){
  .nav-cta{display:none}
  .v4-hero-bg img{width:100%;opacity:.72}
  .v4-hero-overlay{background:linear-gradient(90deg,rgba(8,10,24,.96),rgba(8,10,24,.72) 50%,rgba(8,10,24,.32))}
  .v4-hero-copy{width:min(520px,70vw)}
  .v4-route-grid{grid-template-columns:1fr}
  .v4-route{grid-template-columns:190px 1fr}
  .v4-bottom-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .v4-hero,.v4-hero-inner{min-height:560px}
  .v4-hero-bg img{width:100%;height:100%;object-position:60% center}
  .v4-hero-overlay{background:linear-gradient(0deg,rgba(8,10,24,.96) 0%,rgba(8,10,24,.82) 48%,rgba(8,10,24,.42) 100%)}
  .v4-hero-inner{align-items:flex-end}
  .v4-hero-copy{width:100%;padding:36px 0}
  .v4-hero-copy h1{font-size:clamp(3.2rem,16vw,4.8rem)}
  .v4-route{grid-template-columns:120px 1fr}
  .v4-route-body{padding:14px}
  .v4-feature-content{grid-template-columns:1fr}
  .v4-feature-image{min-height:220px}
}


/* V4 hero crop + stats badge fix */
.v4-hero-bg img{
  width:76%;
  object-position:46% center;
}

.v4-stats-badge{
  position:absolute;
  right:max(24px, calc((100vw - 1180px)/2));
  bottom:26px;
  z-index:4;
  display:flex;
  align-items:center;
  gap:12px;
  min-width:176px;
  padding:13px 16px;
  border-radius:16px;
  border:1px solid rgba(255,79,216,.55);
  background:rgba(12,10,31,.88);
  backdrop-filter:blur(14px);
  box-shadow:0 16px 40px rgba(0,0,0,.34),0 0 24px rgba(255,79,216,.12);
}
.v4-stats-badge .v4-stats-icon{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  font-size:1.5rem;font-weight:900;
  color:#ff76df;
  border:1px solid rgba(255,79,216,.28);
  background:rgba(255,79,216,.08);
}
.v4-stats-badge strong{
  display:block;
  font-size:1.35rem;
  line-height:1;
  color:#fff;
}
.v4-stats-badge small{
  display:block;
  margin-top:4px;
  font-size:.72rem;
  line-height:1.18;
  color:#d7d9e8;
}

@media(max-width:1000px){
  .v4-hero-bg img{width:100%;object-position:54% center}
  .v4-stats-badge{right:18px;bottom:18px}
}
@media(max-width:650px){
  .v4-stats-badge{
    right:14px;
    bottom:14px;
    min-width:150px;
    padding:10px 12px;
  }
  .v4-stats-badge .v4-stats-icon{width:36px;height:36px}
  .v4-stats-badge strong{font-size:1.12rem}
}


/* ==================================================
   Inner pages premium refresh — scoped to .inner-v5
   Homepage intentionally untouched.
   ================================================== */
.inner-v5 .v4-nav{background:rgba(5,7,18,.94)}
.inner-v5 .navlinks a.active{color:#fff;position:relative}
.inner-v5 .navlinks a.active:after{content:"";position:absolute;left:15%;right:15%;bottom:-9px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--pink),var(--cyan))}
.inner-v5 .inner-hero{position:relative;min-height:410px;overflow:hidden;border-bottom:1px solid var(--line);isolation:isolate}
.inner-v5 .inner-hero-art{position:absolute;inset:0;z-index:-2;background:#080a18}
.inner-v5 .inner-hero-art img{position:absolute;right:0;top:0;width:68%;height:100%;object-fit:cover;object-position:center}
.inner-v5 .inner-hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080a18 0%,#080a18 28%,rgba(8,10,24,.91) 41%,rgba(8,10,24,.25) 72%,rgba(8,10,24,.08))}
.inner-v5 .inner-hero-content{min-height:410px;display:flex;align-items:center}
.inner-v5 .inner-hero-content>div{width:min(610px,52vw)}
.inner-v5 .inner-hero h1{font-size:clamp(3rem,5.8vw,5.8rem);max-width:10ch;margin:16px 0 17px;line-height:.96}
.inner-v5 .inner-hero p{font-size:1.02rem;color:#cdd2e6;max-width:47ch;margin:0 0 22px}
.inner-v5 .inner-section{padding:34px 0}
.inner-v5 .inner-section.compact{padding-top:16px}
.inner-v5 .inner-section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:20px}
.inner-v5 .inner-section-head h2{font-size:clamp(2rem,4vw,3.3rem);margin-top:7px}
.inner-v5 .inner-section-head p{max-width:46ch;color:var(--muted);margin:0}
.inner-v5 .inner-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px}
.inner-v5 .dance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.inner-v5 .dance-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(145deg,#101429,#0b0f20);transition:.2s transform,.2s border-color}
.inner-v5 .dance-card:hover{transform:translateY(-3px);border-color:rgba(82,231,255,.32)}
.inner-v5 .dance-image{height:205px;position:relative;overflow:hidden;background:linear-gradient(135deg,#30144e,#173e5c)}
.inner-v5 .dance-image img{width:100%;height:100%;object-fit:cover}
.inner-v5 .dance-image>.pill{position:absolute;left:14px;bottom:12px}
.inner-v5 .dance-image.alt-one,.inner-v5 .dance-image.alt-two{display:grid;place-items:center;background:radial-gradient(circle at 65% 30%,rgba(82,231,255,.34),transparent 7rem),radial-gradient(circle at 25% 75%,rgba(255,79,216,.4),transparent 8rem),linear-gradient(145deg,#27153f,#153653)}
.inner-v5 .dance-image.alt-two{background:radial-gradient(circle at 35% 35%,rgba(255,79,216,.45),transparent 8rem),linear-gradient(145deg,#2d1545,#173e5b)}
.inner-v5 .card-icon{font-size:3.4rem;color:#fff;opacity:.85}
.inner-v5 .dance-body{padding:18px}
.inner-v5 .dance-body h3{font-size:1.3rem;margin:7px 0 8px}
.inner-v5 .dance-body p{color:var(--muted);font-size:.9rem;margin:0 0 13px}
.inner-v5 .dance-body a{font-weight:800;font-size:.88rem}
.inner-v5 .inner-note{margin-top:18px;border-left:3px solid var(--cyan);background:rgba(82,231,255,.06);padding:13px 15px;border-radius:0 12px 12px 0;color:#cfd4e9}
.inner-v5 .path-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.inner-v5 .path-card,.inner-v5 .community-card,.inner-v5 .value-card{border:1px solid var(--line);border-radius:19px;padding:20px;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.02))}
.inner-v5 .path-card h3,.inner-v5 .community-card h3,.inner-v5 .value-card h3{font-size:1.25rem;margin:12px 0 8px}
.inner-v5 .path-card p,.inner-v5 .community-card p,.inner-v5 .value-card p{color:var(--muted);font-size:.9rem;margin:0 0 10px}
.inner-v5 .path-icon,.inner-v5 .community-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,79,216,.22),rgba(82,231,255,.16));border:1px solid rgba(255,255,255,.11);font-weight:900;color:#fff}
.inner-v5 .split-feature{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:center}
.inner-v5 .skill-visual{min-height:370px;border-radius:22px;overflow:hidden;border:1px solid var(--line)}
.inner-v5 .skill-visual img{width:100%;height:100%;object-fit:cover}
.inner-v5 .skill-list{display:grid;gap:10px;margin-top:18px}
.inner-v5 .skill-list>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.inner-v5 .skill-list span{color:var(--muted);text-align:right}
.inner-v5 .safety-copy{margin-top:16px}
.inner-v5 .community-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.inner-v5 .community-banner{margin-top:16px;padding:16px 20px;border-radius:17px;border:1px solid rgba(139,92,255,.28);background:linear-gradient(90deg,rgba(255,79,216,.09),rgba(82,231,255,.07));display:flex;justify-content:space-between;gap:20px}
.inner-v5 .community-banner span{color:var(--muted)}
.inner-v5 .values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.inner-v5 .about-contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:32px;align-items:start}
.inner-v5 .contact-card{border:1px solid var(--line);border-radius:22px;padding:22px;background:linear-gradient(145deg,#11152a,#0b0f20)}
.inner-v5 .inner-footer{margin-top:0}

@media(max-width:1000px){
  .inner-v5 .nav-cta{display:none}
  .inner-v5 .inner-hero-art img{width:100%;opacity:.62}
  .inner-v5 .inner-hero-shade{background:linear-gradient(90deg,rgba(8,10,24,.96),rgba(8,10,24,.74) 56%,rgba(8,10,24,.38))}
  .inner-v5 .inner-hero-content>div{width:min(620px,74vw)}
  .inner-v5 .dance-grid{grid-template-columns:repeat(2,1fr)}
  .inner-v5 .path-grid,.inner-v5 .community-grid{grid-template-columns:repeat(2,1fr)}
  .inner-v5 .values-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .inner-v5 .inner-hero{min-height:520px}
  .inner-v5 .inner-hero-content{min-height:520px;align-items:flex-end}
  .inner-v5 .inner-hero-content>div{width:100%;padding-bottom:34px}
  .inner-v5 .inner-hero-art img{width:100%;height:100%;object-position:58% center}
  .inner-v5 .inner-hero-shade{background:linear-gradient(0deg,#080a18 4%,rgba(8,10,24,.88) 47%,rgba(8,10,24,.35))}
  .inner-v5 .inner-hero h1{font-size:clamp(3rem,15vw,4.6rem)}
  .inner-v5 .inner-toolbar,.inner-v5 .inner-section-head,.inner-v5 .community-banner{align-items:flex-start;flex-direction:column}
  .inner-v5 .dance-grid,.inner-v5 .path-grid,.inner-v5 .community-grid,.inner-v5 .split-feature,.inner-v5 .about-contact-grid{grid-template-columns:1fr}
  .inner-v5 .skill-visual{min-height:280px}
}


/* Inner-page image quality / framing fix */
.inner-v5 .inner-hero-art img{
  width:72%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  image-rendering:auto;
}
.inner-v5.discover-page .inner-hero-art img{object-position:46% center}
.inner-v5.learn-page .inner-hero-art img{object-position:52% center}
.inner-v5.community-page .inner-hero-art img{object-position:58% center}
.inner-v5.about-page .inner-hero-art img{object-position:52% center}

.inner-v5 .dance-image img{
  object-fit:cover;
  object-position:center 35%;
}
.inner-v5 .dance-card:nth-child(2) .dance-image img{object-position:center 28%}
.inner-v5 .dance-card:nth-child(5) .dance-image img{object-position:center 30%}
.inner-v5 .dance-card:nth-child(6) .dance-image img{object-position:center 28%}

.inner-v5 .skill-visual img{
  object-fit:cover;
  object-position:center 26%;
}

@media(max-width:1000px){
  .inner-v5 .inner-hero-art img{
    width:100%;
    object-position:center center;
  }
}


/* FINAL unique inner hero treatment — homepage untouched */
.inner-v5 .inner-hero-art img{
  width:70%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
}
.inner-v5.discover-page .inner-hero-art img{object-position:48% 40%}
.inner-v5.learn-page .inner-hero-art img{object-position:52% 35%}
.inner-v5.community-page .inner-hero-art img{object-position:58% 28%}
.inner-v5.about-page .inner-hero-art img{object-position:52% 34%}

@media(max-width:1000px){
  .inner-v5 .inner-hero-art img{width:100%}
}


/* ===== Final visual cleanup pass ===== */

/* Remove any inline-image baseline/gap artefacts and clip hero edges exactly. */
.v4-hero,
.inner-v5 .inner-hero,
.v4-hero-bg,
.inner-v5 .inner-hero-art{
  overflow:hidden !important;
}

.v4-hero-bg img,
.inner-v5 .inner-hero-art img,
.inner-v5 .skill-visual img,
.inner-v5 .dance-image img{
  display:block !important;
}

/* Prevent the little repeated/sliver effect below hero images. */
.v4-hero-bg,
.inner-v5 .inner-hero-art{
  bottom:0 !important;
}
.v4-hero-bg img,
.inner-v5 .inner-hero-art img{
  inset:0 0 0 auto !important;
  margin:0 !important;
  max-width:none !important;
}

/* Inner hero bottom edge: cover any baked-in source artefact/stat badge area. */
/* Keep inner hero art above its background but below real content/gradient. */
.inner-v5 .inner-hero-art{z-index:-3 !important}
.inner-v5 .inner-hero-shade{z-index:-2 !important}

/* Learn lower-page character panel: show the whole character cleanly instead of zoom/crop. */
.inner-v5.learn-page .skill-visual{
  background:#0b0f20;
  display:flex;
  align-items:center;
  justify-content:center;
}
.inner-v5.learn-page .skill-visual img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#0b0f20;
}

/* Smooth hero-to-content transition without a phantom image strip. */
.v4-hero{border-bottom:1px solid var(--line) !important}
.inner-v5 .inner-hero{border-bottom:1px solid var(--line) !important}
.v4-routes,
.inner-v5 .inner-section{
  position:relative;
  z-index:1;
  background:var(--bg);
}

/* Slightly pull About/Community art upward so the old baked-in stats badge is out of frame. */

/* Remove thin seam under hero images */
.v4-hero,
.inner-v5 .inner-hero {
  overflow: hidden !important;
  border-bottom: 0 !important;
}

.v4-hero-bg img,
.inner-v5 .inner-hero-art img {
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
}

.v4-hero-bg,
.inner-v5 .inner-hero-art {
  bottom: 0 !important;
}
/* Conceal faint left-side mockup text baked into these two source images. */
.inner-v5.community-page .inner-hero-shade,
.inner-v5.about-page .inner-hero-shade{
  background:linear-gradient(90deg,#080a18 0%,#080a18 40%,rgba(8,10,24,.94) 48%,rgba(8,10,24,.25) 72%,rgba(8,10,24,.08));
}

@media(max-width:700px){
  .inner-v5.community-page .inner-hero-shade,
  .inner-v5.about-page .inner-hero-shade{
    background:linear-gradient(0deg,#080a18 4%,rgba(8,10,24,.88) 47%,rgba(8,10,24,.35));
  }
}

/* Keep every inner-page hero at one consistent rendered size. */
.inner-v5 .inner-hero,
.inner-v5 .inner-hero-content{
  height:550px;
  min-height:550px;
}



/* ===== Pass 1: launch-blocker content/legal additions ===== */
.footer-middle{display:flex;flex-direction:column;gap:5px}
.footer-legal a{color:#d9dcf0}
.footer-legal a:hover{color:#fff}

.contact-route h3{font-size:1.55rem;margin:8px 0 10px;word-break:break-word}
.contact-route>p{color:var(--muted);margin:0 0 18px}
.rights-route{margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.10)}
.rights-route p{color:var(--muted);font-size:.9rem}
.rights-route .btn{margin-top:4px}

.legal-hero{padding:70px 0 28px;border-bottom:1px solid var(--line)}
.legal-hero h1{font-size:clamp(3rem,7vw,5.7rem);max-width:10ch;margin-top:16px}
.legal-content{padding:34px 0 60px}
.legal-wrap{max-width:860px}
.legal-wrap h2{font-size:1.5rem;margin:34px 0 9px;letter-spacing:-.025em}
.legal-wrap p{color:#cdd2e6;margin:0;line-height:1.75}
.legal-wrap a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}
.legal-wrap code{color:#fff;background:rgba(255,255,255,.08);padding:2px 6px;border-radius:6px}
.legal-alert{padding:15px 17px;border:1px solid rgba(255,79,216,.22);border-radius:14px;background:linear-gradient(90deg,rgba(255,79,216,.07),rgba(82,231,255,.05));color:#dce0f2;margin-bottom:26px}

@media(max-width:700px){
  .legal-hero{padding-top:44px}
}


/* ===== Pass 2: accessibility / SEO / launch polish ===== */

/* Accessible keyboard focus for the dark UI */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid #52e7ff;
  outline-offset:3px;
  border-radius:8px;
}

/* Screen-reader-only semantic headings */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Keep mini-heading H2 visually identical to the former div. */
h2.mini-heading{
  font-size:.79rem;
  line-height:1.2;
  margin:0 0 12px;
}

/* Slightly reduce inner hero headlines on desktop/tablet only. */
@media(min-width:701px){
  .inner-v5 .inner-hero h1{
    font-size:clamp(2.85rem,5.45vw,5.45rem);
  }
}

/* Improve white-text contrast while preserving AnimeDance pink/purple identity. */
.btn-primary{
  background:linear-gradient(135deg,#d829b4,#6d3fd6) !important;
}
.btn-primary:hover{
  background:linear-gradient(135deg,#c51da4,#5d32c7) !important;
}

/* More comfortable touch targets for menu and Discover filters. */
.menu,
.filter{
  min-height:44px;
}

/* Keep hidden filtered cards out of layout reliably. */
.dance-card[hidden]{
  display:none !important;
}

/* Error page */
.error-hero{
  min-height:520px;
  display:flex;
  align-items:center;
}