:root {
  --bg: #050706;
  --panel: #0a0e0c;
  --panel-2: #101713;
  --line: rgba(199, 255, 62, 0.2);
  --green: #c7ff3e;
  --green-soft: #a8df35;
  --cyan: #50f8e8;
  --text: #f4f8ef;
  --muted: #a3aea4;
  --dim: #657067;
  --container: 1160px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.03em;
}
a { color: inherit; text-decoration: none; }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }

.site-header {
  position: fixed; inset: 0 0 auto; z-index: 20;
  border-bottom: 1px solid rgba(199, 255, 62, 0.1);
  background: rgba(5, 7, 6, 0.72); backdrop-filter: blur(16px);
}
.header-inner, .footer-inner { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 10px; font: 800 17px/1 "Inter"; letter-spacing: 0.16em; }
.brand b { color: var(--green); }
.brand-mark { display: flex; align-items: end; gap: 3px; height: 21px; }
.brand-mark i { width: 3px; background: var(--green); box-shadow: 0 0 8px var(--green); }
.brand-mark i:nth-child(1) { height: 11px; }.brand-mark i:nth-child(2) { height: 20px; }.brand-mark i:nth-child(3) { height: 15px; }
.header-nav { display:flex; align-items:center; gap:20px; margin-left:auto; }
.header-nav a { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.08em; white-space:nowrap; transition:color .2s; }
.header-nav a:hover, .header-nav a:focus-visible { color:var(--green); outline:none; }
.header-cta { display: flex; align-items: center; gap: 14px; color: var(--green); font-size: 13px; font-weight: 800; letter-spacing: 0.1em; }
.arrow { color: #081006; background: var(--green); display: grid; width: 28px; aspect-ratio: 1; place-items: center; border-radius: 50%; }

.hero { min-height: 790px; height: 100svh; position: relative; display: flex; align-items: center; overflow: hidden; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: saturate(0.92) contrast(1.06) brightness(0.78); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #050706 0%, rgba(5,7,6,.9) 30%, rgba(5,7,6,.2) 64%, rgba(5,7,6,.42)), linear-gradient(0deg, #050706 0%, transparent 25%); }
.hero-grid, .final-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(199,255,62,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(199,255,62,.055) 1px,transparent 1px); background-size: 72px 72px; opacity: .46; mask-image: linear-gradient(90deg,#000,transparent 64%); }
.hero-content { position: relative; z-index: 2; padding-top: 70px; }
.eyebrow, .section-label { color: var(--green); font: 800 11px/1.4 "Inter"; letter-spacing: .2em; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 40px; border-top: 1px solid var(--green); box-shadow: 0 0 6px var(--green); }
h1 { margin: 22px 0 15px; font-size: clamp(52px,6.2vw,84px); line-height: 1.13; letter-spacing: -.08em; font-weight: 900; text-shadow: 0 3px 24px #000; }
.neon-text, em { color: var(--green); font-style: normal; text-shadow: 0 0 22px rgba(199,255,62,.3); }
.neon-text { display: inline-block; }
.hero-copy { margin: 0 0 12px; color: #e3eae0; font-size: 20px; font-weight: 700; line-height: 1.8; }
.hero-sub { color: var(--muted); font-size: 14px; margin: 0 0 25px; }
.button { display: inline-flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 38px; min-width: 280px; padding: 7px 9px 7px 25px; font-weight: 800; font-size: 15px; letter-spacing: .06em; transition: transform .25s, box-shadow .25s; }
.button:hover, .button:focus-visible { transform: translateY(-3px); box-shadow: 0 0 34px rgba(199,255,62,.32); outline: none; }
.button-primary { background: var(--green); color: #081006; }
.button-icon { display: grid; place-items: center; width: 46px; aspect-ratio: 1; color: var(--green); background: #081006; font-size: 20px; }
.button-note { margin: 8px 0; color: var(--muted); font-size: 11px; letter-spacing: .08em; }
.hero-status { position: absolute; z-index: 3; right: 6vw; bottom: 62px; display: grid; gap: 5px; padding: 16px 18px; width: 200px; border-left: 1px solid var(--green); background: rgba(2,5,4,.56); font: 700 10px/1.4 "Inter"; letter-spacing: .13em; }
.hero-status span { color: var(--green); font-size: 8px; }
.equalizer { display: flex; align-items: center; gap: 3px; height: 22px; }
.equalizer i { width: 3px; height: 45%; background: var(--green); animation: equalize 1.8s ease-in-out infinite; }
.equalizer i:nth-child(2n){ animation-delay: -.4s }.equalizer i:nth-child(3n){ animation-delay: -.9s }
@keyframes equalize { 50% { height: 100%; } }
.scroll-cue { position: absolute; z-index: 3; bottom: 20px; left: 50%; display: flex; gap: 12px; align-items: center; color: var(--green); font: 700 9px "Inter"; letter-spacing: .15em; transform: translateX(-50%); }
.scroll-cue i { display:block; height: 35px; border-left: 1px solid var(--green); }

.section { padding: 120px 0; position: relative; }
.section-title { margin: 15px 0; font-size: clamp(32px,4vw,54px); font-weight: 900; line-height: 1.35; letter-spacing: -.06em; }
.intro { background: linear-gradient(180deg,#050706,#08100b); }
.intro-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: end; }
.intro-copy { color: var(--muted); font-weight: 500; }
.concern-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 70px; }
.concern-card { min-height: 190px; padding: 22px; border: 1px solid rgba(255,255,255,.1); background: #0c110e; position: relative; display:flex; flex-direction:column; justify-content:space-between; transition: .25s; }
.concern-card:hover, .concern-card.featured { border-color: rgba(199,255,62,.55); transform: translateY(-7px); background: #111a12; }
.card-number { color: var(--dim); font: 800 11px "Inter"; }
.concern-icon { color: var(--green); font: normal 28px/1 "Inter"; text-shadow: 0 0 12px var(--green); }
.concern-card p { margin: 16px 0 0; font-weight: 700; line-height: 1.8; }
.intro-answer { margin: 50px 0 0; text-align: center; color: var(--muted); font-size: 19px; }
.intro-answer strong { color: var(--green); }

.features { background: #071009; overflow: hidden; }
.feature-list { margin-top: 60px; display: grid; gap: 28px; }
.feature-card { display: grid; grid-template-columns: .95fr 1.05fr; min-height: 300px; border: 1px solid rgba(199,255,62,.15); background: #0b120e; }
.feature-card.reverse .feature-visual { order: 2; }
.feature-visual { position: relative; overflow: hidden; min-height: 260px; background: #101d13; }
.visual-grid { position:absolute; inset:0; background-image: linear-gradient(rgba(199,255,62,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(199,255,62,.09) 1px,transparent 1px); background-size:32px 32px; }
.visual-number { position:absolute; bottom:-30px; left:14px; color:rgba(199,255,62,.09); font:900 160px/1 "Inter"; }
.teacher-chat { position:absolute; z-index:2; padding:12px 17px; color:var(--green); border:1px solid var(--green); background:#101a12; font-size:13px; font-weight:700; box-shadow:0 0 22px rgba(199,255,62,.14); }
.chat-a { top:25%; left:12% }.chat-b { top:53%; left:38%; }
.daw-visual .track { position:absolute; left:13%; height:20px; border-left:3px solid var(--green); background:rgba(199,255,62,.28); }
.track-1 { top:23%; width:60% }.track-2 { top:37%; width:38% }.track-3 { top:51%; width:69% }.track-4 { top:65%; width:48% }
.playhead { position:absolute; top:16%; bottom:12%; left:56%; border-left:1px solid var(--cyan); box-shadow:0 0 12px var(--cyan); }
.path-visual i { position:absolute; z-index:2; top:48%; width:16px; aspect-ratio:1; border:2px solid var(--green); background:#111e13; border-radius:50%; box-shadow:0 0 18px var(--green); }
.path-visual i:nth-of-type(1) { left:12% }.path-visual i:nth-of-type(2){left:34%}.path-visual i:nth-of-type(3){left:58%}.path-visual i:nth-of-type(4){left:81%}
.path-line { position:absolute; top:calc(48% + 7px); left:12%; width:72%; border-top:1px solid var(--green); }
.feature-body { padding: 42px 48px; display:flex; flex-direction:column; justify-content:center; }
.feature-index { color:var(--green); font:800 11px "Inter"; letter-spacing:.2em; }
.feature-body h3 { margin:14px 0 10px; font-size:27px; line-height:1.5; letter-spacing:-.04em; }
.feature-emphasis { display:inline-block; margin:0 3px; color:var(--green); font-size:1.38em; line-height:1; text-shadow:0 0 22px rgba(199,255,62,.34); }
mark { color:var(--green); background:none; }
.feature-body p { max-width:540px; margin:0; color:var(--muted); font-size:14px; }

.instructors { background:#071009; }
.instructors-heading { display:flex; justify-content:space-between; align-items:end; gap:45px; }
.instructors-heading > p { max-width:440px; margin:0 0 18px; color:var(--muted); font-size:14px; }
.instructor-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:55px; }
.instructor-card { display:grid; grid-template-columns:44% 56%; min-height:320px; border:1px solid rgba(199,255,62,.2); background:#0c1510; overflow:hidden; }
.instructor-image { position:relative; min-height:320px; overflow:hidden; background:#111a14; }
.instructor-image::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(5,8,6,.55),transparent 55%); pointer-events:none; }
.instructor-image img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(.9) contrast(1.05); transition:transform .35s; }
.instructor-card:hover .instructor-image img { transform:scale(1.04); }
.instructor-image span { position:absolute; z-index:2; bottom:16px; left:16px; color:var(--green); font:800 10px "Inter"; letter-spacing:.18em; }
.instructor-body { padding:30px 26px; display:flex; flex-direction:column; justify-content:center; }
.instructor-role { margin:0 0 8px; color:var(--green); font:800 9px "Inter"; letter-spacing:.15em; }
.instructor-body h3 { margin:0 0 14px; font-size:24px; letter-spacing:-.03em; }
.instructor-body h3 small { display:block; margin-top:3px; color:var(--dim); font:700 10px "Inter"; letter-spacing:.18em; }
.instructor-body > p:not(.instructor-role) { margin:0; color:var(--muted); font-size:13px; }
.instructor-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:18px; }
.instructor-tags span { padding:5px 8px; border:1px solid rgba(199,255,62,.22); color:var(--green-soft); font-size:10px; font-weight:700; }
.instructor-daw { margin:14px 0 0 !important; color:var(--muted) !important; font-size:10px !important; }
.instructor-daw span { display:inline-block; margin-right:7px; padding:3px 6px; color:#071009; background:var(--green); font-size:9px; font-weight:800; }
.instructor-works { margin:17px 0 0 !important; padding-top:12px; border-top:1px solid rgba(199,255,62,.15); color:var(--dim) !important; font-size:10px !important; }
.instructor-works span { margin-right:7px; color:var(--green); font:800 9px "Inter"; letter-spacing:.14em; }

.availability { padding-top:0; background:#071009; }
.availability-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; padding-top:90px; border-top:1px solid rgba(199,255,62,.16); }
.availability-copy { padding-bottom:20px; }
.availability-copy p { margin:0 0 10px; color:var(--muted); font-size:13px; }
.availability-legend { display:flex; flex-wrap:wrap; gap:15px; color:var(--muted); font-size:12px; }
.calendar-wrap { margin-top:34px; overflow-x:auto; border:1px solid rgba(199,255,62,.18); background:#0b140f; }
.availability-table { width:100%; min-width:710px; border-collapse:collapse; table-layout:fixed; text-align:center; }
.availability-table caption { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.availability-table th, .availability-table td { padding:19px 10px; border-right:1px solid rgba(199,255,62,.1); border-bottom:1px solid rgba(199,255,62,.1); }
.availability-table tr:last-child th, .availability-table tr:last-child td { border-bottom:0; }
.availability-table th:last-child, .availability-table td:last-child { border-right:0; }
.availability-table thead th { color:var(--green); background:rgba(199,255,62,.045); font-size:12px; letter-spacing:.14em; }
.availability-table thead th:first-child { width:180px; text-align:left; padding-left:22px; }
.availability-table tbody th { padding-left:22px; text-align:left; background:rgba(199,255,62,.025); }
.availability-table tbody b { display:block; font-size:14px; }
.availability-table tbody small { display:block; color:var(--dim); font-size:10px; font-weight:500; }
.slot { font-family:"Inter"; font-style:normal; font-weight:800; }
.slot-open { color:var(--green); text-shadow:0 0 10px rgba(199,255,62,.6); }
.slot-limited { color:#f5dc65; }
.slot-full { color:#667168; }
.availability-note { margin:10px 0 0; color:var(--dim); font-size:11px; }

.steps { background:#071009; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:60px; }
.step-card { position:relative; min-height:330px; padding:30px; border:1px solid rgba(199,255,62,.2); background:linear-gradient(145deg,#101a13,#09100c); }
.step-number { color:rgba(199,255,62,.35); font:900 52px/1 "Inter"; }
.step-icon { display:grid; margin:35px 0 22px; width:46px; aspect-ratio:1; place-items:center; color:#071009; background:var(--green); font-weight:900; }
.step-card h3 { margin:0 0 12px; font-size:22px; line-height:1.45; }
.step-card p { margin:0; color:var(--muted); font-size:13px; }
.center-cta { margin-top:48px; text-align:center; }

.parents { background:#dfe5dc; color:#152018; }
.parents-layout { display:grid; grid-template-columns:.88fr 1.12fr; gap:75px; }
.parents .section-label { color:#47642c; }
.parents-heading p:last-child { color:#58665c; font-size:14px; }
.parents-panel { display:grid; gap:2px; }
.parents-panel article { display:flex; gap:22px; padding:23px 25px; background:#edf1ea; }
.parents-panel span { color:#63892d; font:800 13px "Inter"; }
.parents-panel h3 { margin:0 0 5px; font-size:17px; }
.parents-panel p { margin:0; color:#637066; font-size:13px; }

.pricing { padding-bottom:60px; background:#0a100c; }
.pricing-lead { margin:0; color:var(--muted); font-size:14px; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:38px; }
.price-card { position:relative; padding:31px 27px 27px; border:1px solid rgba(199,255,62,.2); background:#0d1510; }
.featured-price { border-color:rgba(199,255,62,.78); box-shadow:0 0 26px rgba(199,255,62,.09); }
.price-badge { position:absolute; top:-13px; right:15px; padding:5px 9px; color:#071009; background:var(--green); font:800 9px "Inter"; letter-spacing:.13em; }
.price-plan { margin:0; color:var(--green); font:800 10px "Inter"; letter-spacing:.18em; }
.price-card h3 { margin:10px 0 18px; font-size:22px; }
.price-frequency { margin:0; color:var(--muted); font-size:13px; }
.price { display:flex; align-items:baseline; gap:7px; margin:13px 0 0; color:var(--green); }
.price strong { font:900 38px/1 "Inter"; letter-spacing:-.04em; }
.price span { color:var(--muted); font-size:12px; font-weight:700; }
.pricing-benefits { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.pricing-benefits span { padding:11px 15px; border:1px solid rgba(199,255,62,.18); color:var(--muted); background:#0d1510; font-size:13px; }
.pricing-benefits strong { color:var(--green); }
.faq { padding-top:70px; background:#0a100c; }
.faq-layout { display:grid; grid-template-columns:.35fr .65fr; gap:60px; }
.faq-list { border-top:1px solid rgba(255,255,255,.15); }
details { border-bottom:1px solid rgba(255,255,255,.15); }
summary { cursor:pointer; padding:22px 42px 22px 4px; list-style:none; position:relative; font-size:14px; font-weight:700; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"＋"; position:absolute; right:7px; color:var(--green); font-size:20px; font-weight:400; top:16px; }
details[open] summary::after { content:"−"; }
details p { margin:-3px 0 22px; padding-right:35px; color:var(--muted); font-size:13px; }

.final-cta { position:relative; overflow:hidden; padding:130px 0; text-align:center; background:radial-gradient(circle at center,rgba(125,175,39,.2),transparent 54%),#071009; }
.final-grid { opacity:.55; mask-image:radial-gradient(circle,#000,transparent 75%); }
.final-cta-inner { position:relative; }
.final-cta h2 { margin:18px 0; font-size:clamp(39px,5vw,66px); line-height:1.3; letter-spacing:-.07em; }
.final-cta p:not(.section-label) { margin:0 0 25px; color:var(--muted); font-size:14px; }
.site-footer { padding:70px 0 22px; border-top:1px solid rgba(199,255,62,.14); background:#050706; }
.footer-top { display:grid; grid-template-columns:.85fr 1.15fr .9fr; gap:55px; }
.footer-brand p { margin:15px 0 20px; color:var(--dim); font-size:12px; }
.academy-link { display:inline-flex; gap:8px; align-items:center; color:var(--green); font-size:12px; font-weight:800; line-height:1.6; }
.company-info h2, .footer-sitemap h2 { margin:0 0 24px; color:var(--green); font-size:16px; letter-spacing:.08em; }
.company-info dl { display:grid; gap:13px; margin:0; }
.company-info dl div { display:grid; grid-template-columns:92px 1fr; gap:12px; }
.company-info dt { color:var(--green-soft); font-size:12px; font-weight:800; }
.company-info dd { margin:0; color:var(--muted); font-size:12px; line-height:1.75; }
.company-info dd a { color:inherit; transition:color .2s; }
.company-info dd a:hover, .company-info dd a:focus-visible { color:var(--green); outline:none; }
.footer-links { display:grid; grid-template-columns:repeat(2,1fr); gap:12px 20px; }
.footer-links a { color:var(--muted); font-size:12px; font-weight:700; transition:color .2s; }
.footer-links a:hover, .footer-links a:focus-visible { color:var(--green); outline:none; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:48px; padding-top:18px; border-top:1px solid rgba(199,255,62,.12); }
.footer-bottom a, .footer-bottom small { color:var(--dim); font:600 10px "Inter"; letter-spacing:.04em; }
.mobile-cta { display:none; }

@media (max-width: 760px) {
  body { padding-bottom:75px; font-size:14px; }
  .container { width:min(calc(100% - 34px),var(--container)); }
  .site-header .header-inner { min-height:0; padding-top:14px; flex-wrap:wrap; gap:11px; }
  .site-header .brand { padding-bottom:2px; }
  .header-nav { order:3; width:calc(100% + 34px); margin:0 -17px; padding:10px 17px; gap:18px; overflow-x:auto; border-top:1px solid rgba(199,255,62,.1); scrollbar-width:none; }
  .header-nav::-webkit-scrollbar { display:none; }
  .header-nav a { font-size:10px; }
  .header-cta { display:none; }
  .hero { min-height:790px; align-items:end; padding-bottom:72px; }
  .hero-image { object-position:63% center; }
  .hero-shade { background:linear-gradient(0deg,#050706 3%,rgba(5,7,6,.85) 38%,rgba(5,7,6,.2) 76%,rgba(5,7,6,.52)); }
  .hero-content { padding-top:0; }
  h1 { font-size:54px; }
  .hero-copy { font-size:17px; }
  .hero-status, .scroll-cue { display:none; }
  .button { width:100%; min-width:0; }
  .section { padding:85px 0; }
  .section-title { font-size:34px; }
  .intro-layout, .parents-layout, .faq-layout { grid-template-columns:1fr; gap:22px; }
  .concern-grid { grid-template-columns:1fr; margin-top:40px; }
  .concern-card { min-height:145px; }
  .concern-card:hover, .concern-card.featured { transform:none; }
  .feature-list { margin-top:38px; gap:16px; }
  .feature-card { display:flex; flex-direction:column; }
  .feature-card.reverse .feature-visual { order:0; }
  .feature-visual { min-height:180px; }
  .feature-body { padding:28px 22px; }
  .feature-body h3 { font-size:21px; }
  .instructors-heading, .availability-heading { display:block; }
  .instructors-heading > p { margin-top:18px; }
  .instructor-grid { grid-template-columns:1fr; gap:14px; margin-top:34px; }
  .instructor-card { grid-template-columns:42% 58%; min-height:230px; }
  .instructor-image { min-height:230px; }
  .instructor-body { padding:19px 15px; }
  .instructor-body h3 { font-size:19px; margin-bottom:9px; }
  .instructor-body > p:not(.instructor-role) { font-size:11px; line-height:1.75; }
  .instructor-tags { margin-top:11px; gap:4px; }
  .instructor-tags span { font-size:9px; padding:3px 5px; }
  .instructor-daw { margin-top:9px !important; }
  .instructor-works { margin-top:10px !important; padding-top:8px; }
  .availability-heading { padding-top:70px; }
  .availability-copy { padding-bottom:0; margin-top:18px; }
  .calendar-wrap { margin-right:-17px; }
  .availability-table { min-width:660px; }
  .availability-table th, .availability-table td { padding:15px 9px; }
  .step-grid { grid-template-columns:1fr; margin-top:38px; }
  .step-card { min-height:0; padding:23px; }
  .step-icon { margin:20px 0 15px; }
  .parents-layout { gap:32px; }
  .parents-panel article { padding:18px 16px; gap:14px; }
  .pricing-grid { grid-template-columns:1fr; margin-top:28px; }
  .price-card { padding:24px 21px; }
  .price-card h3 { margin:8px 0 12px; }
  .price strong { font-size:35px; }
  .faq-layout { gap:16px; }
  .final-cta { padding:95px 0; }
  .site-footer { padding:48px 0 18px; }
  .footer-top { grid-template-columns:1fr; gap:34px; }
  .company-info h2, .footer-sitemap h2 { margin-bottom:17px; }
  .footer-links { gap:10px 16px; }
  .footer-bottom { display:block; margin-top:35px; }
  .footer-bottom small { display:block; margin-top:7px; }
  .mobile-cta { position:fixed; z-index:25; display:block; inset:auto 10px 10px; padding:10px 16px; color:#081006; background:var(--green); box-shadow:0 0 25px rgba(199,255,62,.3); text-align:center; }
  .mobile-cta small { display:block; font-size:9px; font-weight:700; letter-spacing:.08em; }
  .mobile-cta strong { display:block; font-size:15px; letter-spacing:.08em; }
}

@media print {
  body { padding-bottom:0; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .site-header { position:absolute; }
  .mobile-cta { display:none !important; }
}