
:root{
  --ink:#050706;
  --paper:#f6f8f2;
  --white:#ffffff;
  --green:#b8ff5c;
  --green-soft:#dfffab;
  --green-deep:#82cf38;
  --orange:#ff6a00;
  --orange-soft:#ff9851;
  --gray:#6d746b;
  --line:#dbe2d5;
  --darkline:#283024;
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:var(--ink);background:var(--paper);line-height:1.8;letter-spacing:.01em}
a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 44px));margin:auto}
.global-header{height:72px;position:sticky;top:0;z-index:80;display:flex;align-items:center;gap:30px;padding:0 clamp(20px,4vw,54px);background:rgba(246,248,242,.86);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.logo img{width:150px}.global-header nav{display:flex;gap:22px;margin-left:auto}.global-header nav a{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:850;color:#343a32}.nav-cta{background:var(--ink);color:#fff;border:1px solid rgba(184,255,92,.42);border-radius:999px;padding:10px 18px;font-weight:900;font-size:13px;box-shadow:0 12px 34px rgba(10,15,8,.16)}
.hero{min-height:calc(100vh - 72px);background:#060706;color:#fff;position:relative;overflow:hidden;isolation:isolate}.grid-bg{position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(184,255,92,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(184,255,92,.07) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(180deg,#000 0%,transparent 96%);opacity:.52;pointer-events:none}
.hero-aurora{position:absolute;inset:-26%;z-index:0;filter:blur(44px) saturate(1.18);opacity:.9;transform:translateZ(0);background:#050706;pointer-events:none;animation:auroraField 36s linear infinite}.hero-aurora:before{content:"";position:absolute;inset:8%;background:conic-gradient(from 90deg at 50% 50%,rgba(184,255,92,.66),rgba(224,255,172,.44),rgba(255,106,0,.26),rgba(184,255,92,.56),rgba(255,150,75,.2),rgba(184,255,92,.66));border-radius:42%;mix-blend-mode:screen;animation:auroraSpin 44s linear infinite}.hero-aurora:after{content:"";position:absolute;inset:18%;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.05),transparent 62%);mix-blend-mode:screen}.blob{position:absolute;border-radius:999px;will-change:transform;mix-blend-mode:screen;display:block}.blob-a{width:72vmax;height:72vmax;left:-22%;top:-28%;background:radial-gradient(circle,rgba(184,255,92,.88),rgba(184,255,92,.28) 46%,transparent 70%);animation:auroraA 14s ease-in-out infinite alternate}.blob-b{width:62vmax;height:62vmax;right:-22%;top:-3%;background:radial-gradient(circle,rgba(213,255,151,.8),rgba(184,255,92,.22) 45%,transparent 72%);animation:auroraB 16s ease-in-out infinite alternate}.blob-c{width:46vmax;height:46vmax;left:26%;bottom:-30%;background:radial-gradient(circle,rgba(179,255,91,.64),rgba(184,255,92,.20) 44%,transparent 72%);animation:auroraC 17s ease-in-out infinite alternate}.blob-d{width:42vmax;height:42vmax;right:8%;bottom:0%;background:radial-gradient(circle,rgba(255,106,0,.42),rgba(255,132,45,.18) 48%,transparent 72%);animation:auroraD 18s ease-in-out infinite alternate}@keyframes auroraField{0%{transform:translate3d(-2%,0,0) rotate(0deg) scale(1)}50%{transform:translate3d(2%,-1%,0) rotate(6deg) scale(1.04)}100%{transform:translate3d(-2%,0,0) rotate(0deg) scale(1)}}@keyframes auroraSpin{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(1.08)}100%{transform:rotate(360deg) scale(1)}}@keyframes auroraA{0%{transform:translate3d(-4%,0,0) scale(1)}50%{transform:translate3d(16%,12%,0) scale(1.12)}100%{transform:translate3d(5%,22%,0) scale(.98)}}@keyframes auroraB{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-20%,8%,0) scale(1.08)}100%{transform:translate3d(-10%,20%,0) scale(1.15)}}@keyframes auroraC{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-18%,-24%,0) scale(1.2)}}@keyframes auroraD{0%{transform:translate3d(0,0,0) scale(.92)}50%{transform:translate3d(-26%,-12%,0) scale(1.12)}100%{transform:translate3d(10%,-25%,0) scale(1.2)}}
.hero-layout{position:relative;z-index:2;width:min(1180px,calc(100% - 44px));margin:auto;display:grid;grid-template-columns:1.18fr .82fr;gap:46px;align-items:center;min-height:calc(100vh - 72px);padding:72px 0}.sup,.label{font-size:12px;letter-spacing:.2em;font-weight:900;text-transform:uppercase;margin:0 0 18px;color:var(--green)}.brand-sup{color:rgba(255,255,255,.68)}.label{color:#50574c}.green{color:var(--green)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(42px,4.1vw,56px);line-height:.94;letter-spacing:-.065em;margin-bottom:28px}.hero h1 .title-line{display:block;white-space:nowrap;color:#fff}.hero h1 .title-accent{color:var(--green)}h1 span{color:inherit}.hero h2{font-size:clamp(28px,4vw,44px);line-height:1.22;letter-spacing:-.045em;margin-bottom:20px}.hero p{color:rgba(255,255,255,.75);font-size:17px}.hero strong{color:#fff}.question-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(184,255,92,.38);border:1px solid rgba(184,255,92,.24);margin:28px 0;box-shadow:0 14px 50px rgba(184,255,92,.10)}.question-strip span{background:rgba(8,10,7,.82);backdrop-filter:blur(10px);padding:16px 12px;text-align:center;font-weight:900}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.actions.center{justify-content:center}.button{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;min-height:56px;padding:0 24px;font-weight:950;letter-spacing:.01em;transition:.2s ease}.button:hover{transform:translateY(-2px)}.button.primary{background:var(--green);color:#071006;box-shadow:0 18px 42px rgba(184,255,92,.22)}.button.ghost{border:1px solid rgba(255,255,255,.28);color:#fff;background:rgba(255,255,255,.03)}.button.ghost.dark{border-color:rgba(255,255,255,.28);color:#fff}.brand-proof-strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.brand-proof-strip span{border:1px solid rgba(184,255,92,.32);background:rgba(184,255,92,.09);color:#fff;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;letter-spacing:.04em}.system-map{height:560px;position:relative;border:1px solid rgba(184,255,92,.22);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border-radius:34px;overflow:hidden;box-shadow:inset 0 0 80px rgba(184,255,92,.08)}.system-map svg{position:absolute;inset:0;width:100%;height:100%;stroke:rgba(184,255,92,.44);fill:none;stroke-width:1.4}.system-map svg circle{fill:var(--green);stroke:none}.node{position:absolute;z-index:2;background:rgba(17,21,15,.82);backdrop-filter:blur(8px);border:1px solid rgba(184,255,92,.4);box-shadow:0 0 30px rgba(184,255,92,.12);border-radius:999px;padding:12px 18px;font-weight:950}.n1{left:46%;top:15%}.n2{left:18%;top:39%}.n3{right:13%;top:39%}.n4{left:31%;bottom:24%}.n5{right:25%;bottom:24%}.terminal{position:absolute;left:28px;right:28px;bottom:28px;background:rgba(4,5,4,.72);border:1px solid rgba(184,255,92,.25);border-radius:20px;padding:18px}.terminal span{font-size:11px;letter-spacing:.18em;color:var(--green);font-weight:900}.terminal b{display:block;font-size:22px}.section{padding:106px 0;border-bottom:1px solid var(--line)}.split{display:grid;grid-template-columns:170px 1fr;gap:64px}.side-index{position:sticky;top:106px;height:max-content;border-top:1px solid var(--ink);padding-top:14px}.side-index span{font-size:14px;font-weight:950}.side-index p{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--gray);margin:0}.content-wide h2{font-size:clamp(38px,5.2vw,72px);line-height:1.05;letter-spacing:-.06em;margin-bottom:26px}.lead{font-size:21px;color:#343832;max-width:880px}.issue-matrix,.recommend-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin:36px 0;background:var(--ink);border:1px solid var(--ink)}.issue-matrix div,.recommend-grid span{background:var(--paper);min-height:140px;padding:22px;font-weight:900;display:flex;align-items:flex-end}.statement{font-size:24px;font-weight:900;letter-spacing:-.02em}.black-block{background:var(--ink);color:#fff;border-color:var(--darkline)}.black-block .side-index{border-color:var(--green)}.black-block .side-index p,.black-block p{color:rgba(255,255,255,.66)}.logic-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:16px}.logic-grid article{border:1px solid var(--darkline);border-radius:var(--radius);padding:30px;background:#0d100c}.logic-grid article.accent{background:linear-gradient(135deg,var(--green),#e7ffbe);color:#071006;border-color:var(--green)}.logic-grid small{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:950;margin-bottom:22px}.logic-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}.logic-grid li{font-size:26px;font-weight:950;letter-spacing:-.04em}.light{color:#fff!important}.dh-method-section{background:#fff;position:relative;overflow:hidden}.dh-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ink);border:1px solid var(--ink);margin:38px 0}.dh-process-grid article{background:#fff;padding:26px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between}.dh-process-grid span{font-size:12px;letter-spacing:.18em;color:#61705b;font-weight:950}.dh-process-grid h3{font-size:34px;letter-spacing:-.06em;line-height:1;margin:0 0 18px}.dh-process-grid p{color:#555b52;margin:0;font-size:15px;line-height:1.8}.dh-photo-panel{display:grid;grid-template-columns:.86fr 1.14fr;gap:0;background:#080908;color:#fff;border-radius:30px;overflow:hidden;border:1px solid #161b14;box-shadow:0 26px 80px rgba(0,0,0,.18)}.dh-photo-panel img{height:100%;min-height:340px;width:100%;object-fit:cover;filter:saturate(.75) contrast(1.04)}.dh-photo-panel div{padding:clamp(28px,4vw,54px);display:flex;flex-direction:column;justify-content:center}.dh-photo-panel h3{font-size:clamp(28px,3.5vw,48px);line-height:1.08;letter-spacing:-.055em;margin-bottom:20px}.dh-photo-panel p:last-child{color:rgba(255,255,255,.7);margin-bottom:0;font-size:17px}.method-card{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ink);border:1px solid var(--ink);margin:30px 0}.method-card p{background:#fff;margin:0;padding:30px;font-size:18px;color:#333a32}.three-power{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.three-power article,.curriculum-list article,.option-grid article{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px}.three-power span,.curriculum-list span{font-size:12px;letter-spacing:.14em;font-weight:950;color:#61705b}.three-power h3{font-size:38px;line-height:1.1;letter-spacing:-.05em}.goals-section{background:#eef3e8}.goals-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}.goals-grid article{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius);min-height:170px;padding:28px;display:flex;flex-direction:column;justify-content:space-between}.goals-grid article:before{content:"";position:absolute;inset:auto -40px -70px auto;width:150px;height:150px;border-radius:50%;background:rgba(184,255,92,.15)}.goals-grid span{width:34px;height:34px;border-radius:999px;background:var(--ink);color:var(--green);display:grid;place-items:center;font-weight:950}.goals-grid p{position:relative;font-size:20px;font-weight:950;line-height:1.45;letter-spacing:-.03em;margin:22px 0 0}.curriculum-section{background:#fff}.curriculum-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.curriculum-list article{min-height:186px;display:flex;flex-direction:column;justify-content:space-between}.curriculum-list h3{font-size:25px;line-height:1.25}.curriculum-list p,.three-power p,.option-grid p{color:var(--gray);margin-bottom:0}.faculty-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.faculty-grid article{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px}.faculty-grid img,.faculty-grid .empty div{width:100%;aspect-ratio:1/1;border-radius:16px;object-fit:cover;background:#11150f;color:var(--green);display:grid;place-items:center;font-size:44px;font-weight:950}.faculty-grid h3{font-size:19px;margin:14px 0 6px}.faculty-grid p{font-size:12px;line-height:1.55;color:var(--gray);margin-bottom:7px}.faculty-grid small{font-weight:850;color:#3f4b3b}.recommend-grid{grid-template-columns:repeat(3,1fr)}.recommend-grid span{min-height:120px}.live-section{background:#eef1e8}.image-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.image-row img{height:280px;width:100%;object-fit:cover;border-radius:var(--radius)}.process,.feature-row{display:flex;gap:8px;flex-wrap:wrap}.process span{background:var(--ink);color:#fff;border-radius:999px;padding:11px 15px;font-weight:900}.process span:not(:last-child):after{content:" →";color:var(--green);margin-left:10px}.feature-row{margin-top:18px}.feature-row span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 14px;font-weight:800}.option-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.creative-tags small{display:inline-block;color:#61705b;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:950;margin-bottom:10px}.target-course{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px}.target-course dl{margin:0}.target-course dt{font-weight:950;margin-top:16px}.target-course dd{margin:4px 0 0;color:var(--gray)}.entry-section{background:#070807;border:none;color:#fff}.entry-card{border:1px solid rgba(184,255,92,.24);border-radius:34px;padding:54px;background:linear-gradient(135deg,rgba(184,255,92,.15),rgba(255,255,255,.02));text-align:center}.entry-card h2{font-size:clamp(38px,5.6vw,74px);line-height:1.05;letter-spacing:-.06em}.entry-card p{max-width:780px;margin-left:auto;margin-right:auto;color:rgba(255,255,255,.72)}.faq-section{background:#fff}.faq-section details{border-top:1px solid var(--line);padding:22px 0}.faq-section details:last-child{border-bottom:1px solid var(--line)}summary{font-weight:950;font-size:20px;cursor:pointer}.faq-section p{color:var(--gray);margin:10px 0 0}.final-section{padding:118px 0;background:radial-gradient(circle at 20% 16%,rgba(184,255,92,.28),transparent 36%),#070807;text-align:center;color:#fff}.final-section h2{font-size:clamp(46px,7vw,92px);line-height:.98;letter-spacing:-.075em;margin-bottom:24px}.final-section p{font-size:18px;max-width:760px;margin:0 auto;color:rgba(255,255,255,.72)}.footer{display:flex;justify-content:space-between;align-items:center;padding:34px 44px;background:#fff;border-top:1px solid var(--line);font-size:12px;color:var(--gray)}.footer img{width:150px}
@media (prefers-reduced-motion:reduce){.blob{animation:none!important}.button:hover{transform:none}}
@media (max-width:980px){.global-header nav{display:none}.hero-layout,.split{grid-template-columns:1fr}.hero-layout{min-height:auto}.system-map{height:420px}.side-index{position:static}.issue-matrix,.faculty-grid,.option-grid,.goals-grid{grid-template-columns:repeat(2,1fr)}.recommend-grid,.three-power,.method-card,.curriculum-list,.logic-grid,.dh-process-grid,.dh-photo-panel{grid-template-columns:1fr}.question-strip{grid-template-columns:1fr}.section{padding:78px 0}.image-row{grid-template-columns:1fr}.footer{display:block}.footer img{margin-bottom:12px}.dh-photo-panel img{min-height:260px}.brand-proof-strip{margin-bottom:8px}.hero-aurora{inset:-8%;filter:blur(42px)}}
@media (max-width:560px){.container,.hero-layout{width:min(100% - 28px,1180px)}.global-header{height:64px}.logo img{width:128px}.nav-cta{font-size:12px;padding:8px 11px}.hero h1{font-size:clamp(38px,12.1vw,48px)}.hero h1 .title-line{white-space:normal}.content-wide h2,.entry-card h2,.final-section h2{font-size:36px}.issue-matrix,.recommend-grid,.faculty-grid,.option-grid,.goals-grid{grid-template-columns:1fr}.issue-matrix div,.recommend-grid span{min-height:100px}.button{width:100%}.system-map{height:360px}.section{padding:64px 0}.entry-card{padding:30px}.footer{padding:28px}.brand-proof-strip span{width:100%;text-align:center}.dh-photo-panel div{padding:28px}.dh-photo-panel img{min-height:220px}.goals-grid article{min-height:140px}}

/* --- Update: vertical timeline curriculum / live copy / creative intro --- */
.curriculum-list.timeline-list{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  margin-top:34px;
  background:transparent;
}
.curriculum-list.timeline-list:before{
  content:"";
  position:absolute;
  top:24px;
  bottom:24px;
  left:76px;
  width:1px;
  background:linear-gradient(180deg,rgba(184,255,92,.08),rgba(184,255,92,.58),rgba(184,255,92,.08));
}
.curriculum-list.timeline-list article{
  position:relative;
  display:grid;
  grid-template-columns:136px 1fr;
  gap:26px;
  min-height:0;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
}
.timeline-number{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:flex-start;
  padding-top:24px;
}
.timeline-number span{
  width:104px;
  height:104px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--ink);
  color:var(--green);
  border:1px solid rgba(184,255,92,.42);
  box-shadow:0 22px 60px rgba(5,7,6,.18);
  font-size:15px;
  letter-spacing:.03em;
  font-weight:950;
}
.timeline-body{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:32px 34px;
  box-shadow:0 20px 60px rgba(5,7,6,.05);
}
.timeline-body .session-label{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border:1px solid rgba(184,255,92,.6);
  background:rgba(184,255,92,.12);
  border-radius:999px;
  color:#3e4b38;
  font-size:12px;
  letter-spacing:.09em;
  font-weight:950;
  margin:0 0 18px;
}
.curriculum-list.timeline-list h3{
  font-size:clamp(27px,3.3vw,42px);
  line-height:1.14;
  letter-spacing:-.055em;
  margin:0 0 18px;
}
.curriculum-list.timeline-list ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}
.curriculum-list.timeline-list li{
  position:relative;
  padding-left:22px;
  color:#525a4e;
  font-size:16px;
  line-height:1.85;
}
.curriculum-list.timeline-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:.86em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--green);
  box-shadow:0 0 0 4px rgba(184,255,92,.16);
}
.live-copy{
  display:grid;
  gap:18px;
  margin:30px 0 28px;
  padding:34px;
  border-radius:var(--radius);
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 20px 60px rgba(5,7,6,.05);
}
.live-copy p{
  margin:0;
  color:#343b31;
  font-size:17px;
  line-height:2;
}
.live-copy p:first-child{
  font-size:21px;
  line-height:1.75;
  font-weight:900;
  letter-spacing:-.025em;
  color:var(--ink);
}
.creative-intro{
  margin:28px 0 34px;
  display:grid;
  gap:8px;
  max-width:850px;
}
.creative-intro p{
  margin:0;
  font-size:18px;
  color:#4e564a;
}
.creative-intro p:nth-child(-n+3){
  font-size:clamp(26px,3.1vw,42px);
  line-height:1.08;
  letter-spacing:-.055em;
  font-weight:950;
  color:var(--ink);
}
.creative-intro p:nth-child(4){
  margin-top:12px;
  font-weight:900;
  color:#283023;
}
@media (max-width:980px){
  .curriculum-list.timeline-list:before{left:51px}
  .curriculum-list.timeline-list article{grid-template-columns:98px 1fr;gap:18px}
  .timeline-number span{width:82px;height:82px;font-size:13px}
  .timeline-body{padding:26px}
}
@media (max-width:560px){
  .curriculum-list.timeline-list:before{display:none}
  .curriculum-list.timeline-list article{grid-template-columns:1fr;gap:12px}
  .timeline-number{padding-top:0}
  .timeline-number span{width:auto;height:auto;display:inline-flex;padding:8px 14px}
  .timeline-body{padding:22px}
  .curriculum-list.timeline-list h3{font-size:27px}
  .live-copy{padding:24px}
  .live-copy p:first-child{font-size:18px}
}

/* --- Update: Digital Hollywood reason section --- */
.dh-reason-section{
  position:relative;
  overflow:hidden;
  background:#070807;
  color:#fff;
  border-bottom:1px solid var(--darkline);
}
.dh-reason-section:before{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-180px;
  top:8%;
  border-radius:999px;
  background:radial-gradient(circle,rgba(184,255,92,.16),rgba(184,255,92,0) 66%);
  pointer-events:none;
}
.dh-reason-section:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(184,255,92,.04) 1px,transparent 1px),linear-gradient(180deg,rgba(184,255,92,.035) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(180deg,transparent,black 18%,black 82%,transparent);
  pointer-events:none;
}
.dh-reason-section .container{
  position:relative;
  z-index:1;
}
.dh-reason-section .side-index{
  border-color:rgba(184,255,92,.55);
}
.dh-reason-section .side-index p,
.dh-reason-section p{
  color:rgba(255,255,255,.72);
}
.dh-reason-section .content-wide h2{
  color:#fff;
}
.reason-panel{
  max-width:940px;
  display:grid;
  gap:22px;
  padding:clamp(28px,4.5vw,54px);
  border:1px solid rgba(184,255,92,.22);
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  box-shadow:0 32px 100px rgba(0,0,0,.28), inset 0 0 80px rgba(184,255,92,.035);
  backdrop-filter:blur(14px);
}
.reason-panel p{
  margin:0;
  font-size:17px;
  line-height:2.05;
}
.reason-panel .reason-lead{
  color:#fff;
  font-size:clamp(24px,3.2vw,42px);
  line-height:1.35;
  letter-spacing:-.055em;
  font-weight:950;
}
.reason-questions{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:8px 0;
  background:rgba(184,255,92,.34);
  border:1px solid rgba(184,255,92,.24);
}
.reason-questions span{
  min-height:136px;
  display:flex;
  align-items:flex-end;
  padding:22px;
  background:rgba(7,8,7,.88);
  color:#fff;
  font-size:20px;
  line-height:1.45;
  letter-spacing:-.035em;
  font-weight:950;
}
.reason-panel .reason-closing{
  padding-top:8px;
  color:#fff;
  font-size:clamp(24px,3vw,38px);
  line-height:1.35;
  letter-spacing:-.055em;
  font-weight:950;
}
@media (max-width:980px){
  .reason-questions{grid-template-columns:1fr}
  .reason-questions span{min-height:92px}
}
@media (max-width:560px){
  .reason-panel{padding:24px;border-radius:24px}
  .reason-panel p{font-size:15px;line-height:1.9}
  .reason-questions span{font-size:18px;padding:18px;min-height:80px}
}


/* --- Requested update: GTM-ready / brand sup / issue haze / logic flow / program details --- */
.hero .sup{color:var(--orange)}

/* Keep GTM placeholder in head/body and dataLayer CTA hooks for future installation */

.intro-block .issue-matrix{
  background:transparent;
  border:none;
  gap:14px;
}
.intro-block .issue-matrix div{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(239,243,234,.98));
  border:1px solid rgba(219,226,213,.95);
  border-radius:22px;
  min-height:154px;
  box-shadow:0 20px 60px rgba(5,7,6,.06), inset 0 1px 0 rgba(255,255,255,.85);
  align-items:flex-start;
  padding-top:56px;
}
.intro-block .issue-matrix div:before,
.intro-block .issue-matrix div:after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
}
.intro-block .issue-matrix div:before{
  width:160px;
  height:160px;
  top:-56px;
  left:-28px;
  background:radial-gradient(circle,rgba(184,255,92,.16),rgba(184,255,92,0) 68%);
  filter:blur(10px);
}
.intro-block .issue-matrix div:after{
  width:130px;
  height:130px;
  right:-26px;
  bottom:-42px;
  background:radial-gradient(circle,rgba(5,7,6,.08),rgba(5,7,6,0) 70%);
  filter:blur(12px);
}
.intro-block .issue-matrix div:nth-child(2),
.intro-block .issue-matrix div:nth-child(4){
  background:linear-gradient(135deg,rgba(247,248,244,.88),rgba(233,237,229,.98));
}
.intro-block .issue-matrix div:nth-child(3){
  background:linear-gradient(135deg,rgba(245,247,241,.82),rgba(228,233,223,.96));
}
.intro-block .issue-matrix div span,
.intro-block .issue-matrix div{backdrop-filter:blur(6px)}

.logic-grid{display:none}
.logic-flow{
  display:grid;
  grid-template-columns:minmax(0,.9fr) 116px minmax(0,1.1fr);
  gap:18px;
  align-items:stretch;
}
.logic-card{
  border:1px solid var(--darkline);
  border-radius:var(--radius);
  padding:30px;
}
.logic-before{background:#0d100c}
.logic-after{
  background:linear-gradient(135deg,var(--green),#e7ffbe);
  color:#071006;
  border-color:var(--green);
}
.logic-card small{
  display:block;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:950;
  margin-bottom:22px;
}
.logic-card ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.logic-card li{font-size:26px;font-weight:950;letter-spacing:-.04em}
.logic-arrow{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:12px;
  text-align:center;
  color:var(--green);
}
.logic-arrow span,
.logic-arrow small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(184,255,92,.28);
  background:rgba(184,255,92,.06);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.logic-arrow b{
  font-size:54px;
  line-height:1;
  font-weight:700;
}

.three-power article{
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.three-power h3{margin-bottom:10px}
.three-power .power-lead{
  font-size:20px;
  line-height:1.55;
  letter-spacing:-.02em;
  color:#253121;
  font-weight:900;
  margin-bottom:14px;
}
.three-power .power-detail{
  color:#586254;
  font-size:15px;
  line-height:1.9;
  margin-top:auto;
}

@media (max-width:980px){
  .intro-block .issue-matrix{grid-template-columns:repeat(2,1fr)}
  .logic-flow{grid-template-columns:1fr;gap:14px}
  .logic-arrow{min-height:92px}
  .logic-arrow b{transform:rotate(90deg)}
}
@media (max-width:560px){
  .intro-block .issue-matrix{grid-template-columns:1fr}
  .intro-block .issue-matrix div{min-height:120px;padding-top:42px}
  .logic-card li{font-size:22px}
  .three-power .power-lead{font-size:18px}
}

/* --- Requested update: keep v8 design / program body / recommended list / live flow / school proof --- */
.program-lead{
  max-width:880px;
  margin:0 0 34px;
}

.recommend-list{
  list-style:none;
  margin:34px 0 0;
  padding:0;
  border-top:1px solid var(--ink);
}
.recommend-list li{
  display:grid;
  grid-template-columns:76px 1fr;
  gap:22px;
  align-items:center;
  min-height:84px;
  border-bottom:1px solid var(--ink);
  font-size:clamp(20px,2.4vw,32px);
  line-height:1.35;
  letter-spacing:-.04em;
  font-weight:950;
}
.recommend-list span{
  color:#61705b;
  font-size:12px;
  letter-spacing:.18em;
  font-weight:950;
}

.process-flow{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin:26px 0 0;
}
.process-flow span{
  position:relative;
  min-width:0;
  min-height:96px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  border-radius:20px;
  background:var(--ink);
  color:#fff;
  padding:14px 8px;
  font-weight:950;
  line-height:1.25;
  letter-spacing:-.03em;
}
.process-flow span:not(:last-child):after{
  content:"";
  position:absolute;
  top:50%;
  right:-10px;
  width:12px;
  height:12px;
  border-top:2px solid var(--green);
  border-right:2px solid var(--green);
  transform:translateY(-50%) rotate(45deg);
  z-index:2;
}
.process-flow small{
  display:block;
  margin-bottom:8px;
  color:var(--green);
  font-size:10px;
  letter-spacing:.18em;
}

.reason-facts{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:8px 0;
  background:rgba(184,255,92,.34);
  border:1px solid rgba(184,255,92,.24);
}
.reason-facts span{
  min-height:156px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:22px;
  background:rgba(7,8,7,.88);
  color:#fff;
  font-size:20px;
  line-height:1.45;
  letter-spacing:-.035em;
  font-weight:950;
}
.reason-facts small{
  display:block;
  margin-bottom:12px;
  color:var(--green);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

@media (max-width:980px){
  .reason-facts{grid-template-columns:1fr}
  .reason-facts span{min-height:108px}
}
@media (max-width:560px){
  .recommend-list li{
    grid-template-columns:46px 1fr;
    gap:14px;
    min-height:76px;
    font-size:20px;
  }
  .process-flow{
    gap:5px;
  }
  .process-flow span{
    min-height:78px;
    border-radius:14px;
    padding:10px 3px;
    font-size:10px;
    line-height:1.15;
    word-break:keep-all;
  }
  .process-flow span:not(:last-child):after{
    right:-6px;
    width:7px;
    height:7px;
    border-width:1.5px;
  }
  .process-flow small{
    margin-bottom:5px;
    font-size:8px;
  }
  .reason-facts span{
    font-size:18px;
    padding:18px;
    min-height:92px;
  }
}

/* --- Requested update: FV mobile visual order / light reason section --- */
.hero-visual-mobile{
  display:none;
}

.dh-reason-section{
  background:#fff;
  color:var(--ink);
  border-bottom:1px solid var(--line);
}
.dh-reason-section:before,
.dh-reason-section:after{
  display:none;
}
.dh-reason-section .side-index{
  border-color:var(--ink);
}
.dh-reason-section .side-index p{
  color:var(--gray);
}
.dh-reason-section p{
  color:#4c5448;
}
.dh-reason-section .content-wide h2{
  color:var(--ink);
}
.dh-reason-section .label{
  color:#50574c;
}
.reason-panel{
  max-width:none;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:none;
  backdrop-filter:none;
}
.reason-panel .reason-lead{
  color:var(--ink);
}
.reason-facts{
  grid-template-columns:repeat(2,1fr);
  background:var(--ink);
  border:1px solid var(--ink);
}
.reason-facts span{
  background:#fff;
  color:var(--ink);
}
.reason-facts small{
  color:#61705b;
}

@media (max-width:560px){
  .hero-visual-desktop{
    display:none;
  }
  .hero-visual-mobile{
    display:block;
    height:330px;
    margin:20px 0 24px;
    border-radius:26px;
  }
  .hero-visual-mobile .terminal{
    left:18px;
    right:18px;
    bottom:18px;
  }
  .reason-facts{
    grid-template-columns:1fr;
  }
}

/* --- Requested update: mobile header / curriculum accordion / faculty columns / live plain copy / reason photo --- */
.curriculum-detail summary{
  display:none;
}

.reason-image{
  width:100%;
  aspect-ratio:828/560;
  object-fit:cover;
  border-radius:20px;
  border:1px solid var(--line);
}
.reason-button{
  width:max-content;
  margin-top:6px;
}
.live-copy{
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.live-copy p:first-child{
  font-size:21px;
  line-height:1.9;
}
.live-target-course{
  margin-top:24px;
}

@media (max-width:560px){
  .global-header{
    justify-content:space-between;
    gap:12px;
    padding:0 14px;
  }
  .logo img{
    width:150px;
  }
  .nav-cta{
    margin-left:auto;
    padding:10px 16px;
    font-size:12px;
    white-space:nowrap;
  }
  .curriculum-list.timeline-list{
    gap:18px;
  }
  .curriculum-list.timeline-list:before{
    display:block;
    left:34px;
    top:18px;
    bottom:18px;
  }
  .curriculum-list.timeline-list article{
    grid-template-columns:minmax(64px,22%) 1fr;
    gap:12px;
  }
  .timeline-number{
    justify-content:center;
    padding-top:28px;
  }
  .timeline-number span{
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    padding:0;
    font-size:12px;
  }
  .timeline-body{
    padding:20px;
    border-radius:22px;
  }
  .timeline-body .session-label{
    font-size:10px;
    min-height:26px;
    padding:0 10px;
    margin-bottom:14px;
  }
  .curriculum-list.timeline-list h3{
    font-size:24px;
    margin-bottom:12px;
  }
  .curriculum-detail summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:40px;
    margin-top:14px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(184,255,92,.16);
    color:#273321;
    font-size:12px;
    font-weight:950;
    cursor:pointer;
    list-style:none;
  }
  .curriculum-detail summary::-webkit-details-marker{
    display:none;
  }
  .curriculum-detail summary:after{
    content:"+";
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:var(--ink);
    color:var(--green);
    line-height:1;
  }
  .curriculum-detail[open] summary:after{
    content:"-";
  }
  .curriculum-detail ul{
    padding-top:14px;
  }
  .curriculum-list.timeline-list li{
    font-size:14px;
    line-height:1.8;
  }
  .faculty-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .faculty-grid article{
    padding:10px;
  }
  .faculty-grid h3{
    font-size:16px;
    line-height:1.35;
  }
  .faculty-grid p{
    font-size:11px;
  }
  .live-copy{
    margin:24px 0;
    padding:0;
  }
  .live-copy p:first-child{
    font-size:16px;
    line-height:1.9;
  }
  .reason-image{
    border-radius:18px;
  }
  .reason-button{
    width:100%;
    min-height:50px;
    text-align:center;
  }
}


/* --- Animation layer inspired by AI event LP motion: glow, reveal, flow --- */
.hero .sup,
.hero h1 .title-line,
.hero h2,
.hero .hero-text > p:not(.sup),
.hero .question-strip,
.hero .actions{
  opacity:0;
  transform:translate3d(0,22px,0);
  animation:heroTextIn .88s cubic-bezier(.2,.8,.2,1) forwards;
}
.hero .sup{animation-delay:.08s}
.hero h1 .title-main{animation-delay:.18s}
.hero h1 .title-accent{animation-delay:.28s}
.hero h2{animation-delay:.42s}
.hero .hero-visual-mobile{animation-delay:.50s}
.hero .hero-text > p:nth-of-type(2){animation-delay:.54s}
.hero .question-strip{animation-delay:.64s}
.hero .hero-text > p:nth-of-type(3){animation-delay:.74s}
.hero .actions{animation-delay:.84s}
@keyframes heroTextIn{to{opacity:1;transform:translate3d(0,0,0)}}

.system-map{
  animation:mapFloat 6.5s ease-in-out infinite;
}
.system-map:before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:34px;
  background:linear-gradient(120deg,transparent 10%,rgba(184,255,92,.22),rgba(255,106,0,.10),transparent 56%);
  transform:translateX(-120%);
  animation:mapSweep 6s cubic-bezier(.6,0,.2,1) infinite;
  pointer-events:none;
  z-index:1;
}
.system-map svg path{
  stroke-dasharray:900;
  stroke-dashoffset:900;
  animation:lineDraw 2.2s ease forwards .6s, lineGlow 5s ease-in-out infinite 2.8s;
}
.system-map svg circle,
.node{
  animation:nodePulse 3.2s ease-in-out infinite;
}
.system-map .n2{animation-delay:.3s}.system-map .n3{animation-delay:.6s}.system-map .n4{animation-delay:.9s}.system-map .n5{animation-delay:1.2s}
@keyframes mapFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes mapSweep{0%,42%{transform:translateX(-120%)}72%,100%{transform:translateX(120%)}}
@keyframes lineDraw{to{stroke-dashoffset:0}}
@keyframes lineGlow{0%,100%{opacity:.72}50%{opacity:1}}
@keyframes nodePulse{0%,100%{box-shadow:0 0 22px rgba(184,255,92,.12)}50%{box-shadow:0 0 38px rgba(184,255,92,.24)}}

.button.primary{
  position:relative;
  overflow:hidden;
}
.button.primary:after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-120%;
  width:48%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.52),transparent);
  transform:skewX(-18deg);
  animation:ctaShine 4.4s ease-in-out infinite;
}
@keyframes ctaShine{0%,55%{left:-120%}76%,100%{left:130%}}

.reveal-item{
  opacity:0;
  transform:translate3d(0,28px,0);
  filter:blur(8px);
  transition:opacity .76s cubic-bezier(.2,.8,.2,1),transform .76s cubic-bezier(.2,.8,.2,1),filter .76s cubic-bezier(.2,.8,.2,1);
  transition-delay:calc(var(--reveal-index,0) * 70ms);
}
.reveal-item.is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:blur(0);
}
.reveal-left{transform:translate3d(-24px,0,0)}
.reveal-left.is-visible{transform:translate3d(0,0,0)}
.reveal-scale{transform:translate3d(0,24px,0) scale(.985)}
.reveal-scale.is-visible{transform:translate3d(0,0,0) scale(1)}

.issue-matrix div,
.goals-grid article,
.three-power article,
.faculty-grid article,
.timeline-body,
.reason-panel,
.target-course{
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.issue-matrix div:hover,
.goals-grid article:hover,
.three-power article:hover,
.faculty-grid article:hover,
.timeline-body:hover,
.reason-panel:hover,
.target-course:hover{
  transform:translateY(-4px);
  border-color:rgba(184,255,92,.56);
  box-shadow:0 24px 70px rgba(5,7,6,.08);
}
.black-block .logic-card:hover{
  transform:translateY(-4px);
  border-color:rgba(184,255,92,.44);
}
.logic-arrow b{
  animation:arrowNudge 1.8s ease-in-out infinite;
}
@keyframes arrowNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(8px)}}

.timeline-number span{
  animation:timelinePulse 3.6s ease-in-out infinite;
}
.curriculum-list.timeline-list article:nth-child(2) .timeline-number span{animation-delay:.2s}
.curriculum-list.timeline-list article:nth-child(3) .timeline-number span{animation-delay:.4s}
.curriculum-list.timeline-list article:nth-child(4) .timeline-number span{animation-delay:.6s}
.curriculum-list.timeline-list article:nth-child(5) .timeline-number span{animation-delay:.8s}
.curriculum-list.timeline-list article:nth-child(6) .timeline-number span{animation-delay:1s}
@keyframes timelinePulse{0%,100%{box-shadow:0 22px 60px rgba(5,7,6,.18),0 0 0 0 rgba(184,255,92,.24)}50%{box-shadow:0 22px 60px rgba(5,7,6,.18),0 0 0 10px rgba(184,255,92,0)}}
.curriculum-list.timeline-list:before{
  background:linear-gradient(180deg,rgba(184,255,92,.08),rgba(184,255,92,.72),rgba(255,106,0,.18),rgba(184,255,92,.08));
  background-size:100% 220%;
  animation:timelineFlow 8s linear infinite;
}
@keyframes timelineFlow{to{background-position:0 220%}}

.process-flow span{
  transform-origin:center;
}
.process-flow.is-active span{
  animation:flowStep 2.8s ease-in-out infinite;
  animation-delay:calc(var(--flow-index,0) * 190ms);
}
.process-flow.is-active span:after{
  animation:flowArrow 2.8s ease-in-out infinite;
}
@keyframes flowStep{0%,100%{transform:translateY(0);box-shadow:none}42%{transform:translateY(-5px);box-shadow:0 18px 38px rgba(5,7,6,.16)}}
@keyframes flowArrow{0%,100%{opacity:.45;transform:translateY(-50%) rotate(45deg) translateX(0)}50%{opacity:1;transform:translateY(-50%) rotate(45deg) translateX(4px)}}

.reason-image{
  transform-origin:center;
  transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .9s cubic-bezier(.2,.8,.2,1);
}
.reason-panel.is-visible .reason-image,
.reason-image.is-visible{
  animation:photoReveal 1.05s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes photoReveal{0%{clip-path:inset(0 0 100% 0);filter:saturate(.5);transform:scale(1.04)}100%{clip-path:inset(0);filter:saturate(1);transform:scale(1)}}

@media (max-width:560px){
  .system-map{animation:none}
  .system-map:before{animation:mapSweep 7.6s cubic-bezier(.6,0,.2,1) infinite}
  .logic-arrow b{animation:arrowDownNudge 1.8s ease-in-out infinite}
  @keyframes arrowDownNudge{0%,100%{transform:rotate(90deg) translateX(0)}50%{transform:rotate(90deg) translateX(8px)}}
  .process-flow.is-active span{animation:flowStepMobile 2.8s ease-in-out infinite;animation-delay:calc(var(--flow-index,0) * 150ms)}
  @keyframes flowStepMobile{0%,100%{transform:translateY(0)}42%{transform:translateY(-3px)}}
}
@media (prefers-reduced-motion:reduce){
  .hero .sup,.hero h1 .title-line,.hero h2,.hero .hero-text > p:not(.sup),.hero .question-strip,.hero .actions,.system-map,.system-map:before,.system-map svg path,.system-map svg circle,.node,.button.primary:after,.logic-arrow b,.timeline-number span,.curriculum-list.timeline-list:before,.process-flow.is-active span,.process-flow.is-active span:after,.reason-panel.is-visible .reason-image,.reason-image.is-visible{
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }
  .reveal-item{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
}
/* @media (prefers-reduced-motion:reduce){
  .hero .sup,.hero h1 .title-line,.hero h2,.hero .hero-text > p:not(.sup),.hero .question-strip,.hero .actions,.system-map,.system-map:before,.system-map svg path,.system-map svg circle,.node,.button.primary:after,.logic-arrow b,.timeline-number span,.curriculum-list.timeline-list:before,.process-flow.is-active span,.process-flow.is-active span:after,.reason-panel.is-visible .reason-image,.reason-image.is-visible{animation:none!important}
  .reveal-item{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
} */

/* --- Requested final adjustments 2026-07 --- */
/* Curriculum detail trigger: green -> gray */
.curriculum-list.timeline-list summary,
.curriculum-list.timeline-list .curriculum-detail-trigger,
.curriculum-list.timeline-list .details-trigger,
.timeline-body summary{
  background:#f1f3ef !important;
  border-color:#d9ded4 !important;
  color:#202520 !important;
}
.curriculum-list.timeline-list summary::after,
.curriculum-list.timeline-list .curriculum-detail-trigger::after,
.curriculum-list.timeline-list .details-trigger::after,
.timeline-body summary::after{
  background:#10130f !important;
  color:#ffffff !important;
}

/* Live Class feature row should sit directly under the section heading */
.live-section .feature-row{
  margin:0 0 28px;
}
.live-section .content-wide > h2 + .feature-row{
  margin-top:6px;
}


/* --- Final requested adjustments: gray curriculum detail + gray DH school button --- */
.curriculum-detail summary,
.curriculum-list.timeline-list summary,
.timeline-body summary{
  background:#f1f3ef !important;
  border:1px solid #d9ded4 !important;
  color:#202520 !important;
}
.curriculum-detail summary:after,
.curriculum-list.timeline-list summary:after,
.timeline-body summary:after{
  background:#10130f !important;
  color:#ffffff !important;
}
.reason-button{
  background:#f1f3ef !important;
  color:#202520 !important;
  border:1px solid #d4d9cf !important;
  box-shadow:none !important;
  min-height:54px;
  padding:0 22px;
}
.reason-button:hover{
  background:#e4e8df !important;
  transform:translateY(-2px);
}
.live-section .content-wide > h2 + .feature-row{
  margin-top:6px;
  margin-bottom:28px;
}


/* --- Final minor update: Reason facts / Goals one-line --- */
.reason-facts-line{
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
  margin:30px 0;
  background:transparent!important;
  border:0!important;
}
.reason-fact-line{
  position:relative;
  padding-left:22px;
}
.reason-fact-line:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:6px;
  border-radius:999px;
  background:#d9d9d9;
}
.reason-fact-line span{
  display:block;
  color:#202520;
  font-size:22px;
  line-height:1.35;
  font-weight:950;
  letter-spacing:-.02em;
  margin-bottom:12px;
}
.reason-fact-line strong{
  display:block;
  color:#202520;
  font-size:22px;
  line-height:1.55;
  font-weight:950;
  letter-spacing:-.025em;
}
.reason-button,
.reason-link,
.dh-school-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.goals-grid article{
  min-height:auto!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:14px!important;
  padding:22px 24px!important;
}
.goals-grid article:before{
  display:none!important;
}
.goals-grid span{
  flex:0 0 auto;
  margin:0!important;
}
.goals-grid p{
  margin:0!important;
  font-size:18px!important;
  line-height:1.5!important;
}

@media (max-width:560px){
  .reason-facts-line{gap:22px;margin:24px 0}
  .reason-fact-line{padding-left:18px}
  .reason-fact-line:before{width:5px}
  .reason-fact-line span,
  .reason-fact-line strong{font-size:18px}
  .goals-grid article{padding:18px 20px!important;gap:12px!important}
  .goals-grid p{font-size:16px!important}
}


/* --- Update: vertical section labels / compact Reason facts --- */
.side-index{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  border-top:0!important;
  padding-top:0!important;
  min-height:360px;
}
.side-index span{
  writing-mode:vertical-rl;
  text-orientation:mixed;
  font-size:clamp(26px,2.6vw,40px)!important;
  line-height:1!important;
  letter-spacing:.08em!important;
  font-weight:500!important;
  color:var(--ink)!important;
  white-space:nowrap;
}
.black-block .side-index span,
.dh-reason-section .side-index span{
  color:inherit!important;
}
.side-index p{display:none!important}
.side-index-empty{min-height:0}
.side-index-empty span{display:none!important}

.reason-facts-line{
  gap:16px!important;
  margin:18px 0 20px!important;
}
.reason-fact-line{
  padding-left:16px!important;
}
.reason-fact-line:before{
  width:5px!important;
  background:#d6d6d6!important;
}
.reason-fact-line span{
  font-size:17px!important;
  margin-bottom:4px!important;
  line-height:1.35!important;
}
.reason-fact-line strong{
  font-size:18px!important;
  line-height:1.45!important;
}
.reason-panel{
  gap:18px!important;
}
.reason-panel .reason-lead{
  margin-bottom:0!important;
}

@media (max-width:980px){
  .side-index{
    min-height:0;
    justify-content:flex-start;
    margin-bottom:20px;
  }
  .side-index span{
    writing-mode:horizontal-tb;
    font-size:14px!important;
    letter-spacing:.16em!important;
    font-weight:950!important;
  }
  .side-index-empty{display:none!important}
}


/* --- Update: align vertical section label font with existing English label style --- */
.side-index span{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}


/* --- Update: Digital Hollywood section compact facts --- */
.dh-reason-section .reason-facts-line{
  gap:8px!important;
  margin:10px 0 12px!important;
}
.dh-reason-section .reason-fact-line{
  padding-left:12px!important;
}
.dh-reason-section .reason-fact-line:before{
  width:4px!important;
}
.dh-reason-section .reason-fact-line span{
  margin-bottom:0!important;
  font-size:15px!important;
  line-height:1.2!important;
}
.dh-reason-section .reason-fact-line strong{
  font-size:17px!important;
  line-height:1.35!important;
}
.dh-reason-section .reason-panel{
  gap:12px!important;
}
@media (max-width:560px){
  .dh-reason-section .reason-facts-line{
    gap:8px!important;
    margin:8px 0 10px!important;
  }
  .dh-reason-section .reason-fact-line span{
    font-size:14px!important;
  }
  .dh-reason-section .reason-fact-line strong{
    font-size:16px!important;
  }
}


/* --- Update: refined vertical labels / FAQ cleanup / Final CTA copy balance --- */
.side-index span{
  color:rgba(5,7,6,.58)!important;
  -webkit-text-stroke:.35px rgba(5,7,6,.28);
  text-shadow:0 1px 0 rgba(255,255,255,.34);
}
.black-block .side-index span,
.final-section .side-index span{
  color:rgba(255,255,255,.66)!important;
  -webkit-text-stroke:.35px rgba(255,255,255,.22);
  text-shadow:none;
}

.faq-section .content-wide{
  padding-top:0;
}

.final-section .final-heading{
  max-width:980px;
  margin:0 auto 32px;
  font-size:clamp(42px,6vw,86px);
  line-height:1.04;
  letter-spacing:-.07em;
}
.final-section .final-heading span{
  display:block;
}
.final-section .final-copy{
  max-width:860px;
  margin:0 auto 34px;
  display:grid;
  gap:18px;
}
.final-section .final-copy p{
  margin:0;
  color:rgba(255,255,255,.78);
  font-size:clamp(16px,1.55vw,20px);
  line-height:1.95;
  letter-spacing:.01em;
}
.final-section .final-copy p:first-child{
  color:#fff;
  font-weight:900;
  font-size:clamp(20px,2vw,28px);
  line-height:1.65;
  letter-spacing:-.025em;
}

@media (max-width:980px){
  .side-index span{
    color:rgba(5,7,6,.72)!important;
    -webkit-text-stroke:0;
  }
  .black-block .side-index span{
    color:rgba(255,255,255,.75)!important;
  }
}
@media (max-width:560px){
  .final-section .final-heading{
    font-size:clamp(34px,10.2vw,46px);
    line-height:1.12;
    letter-spacing:-.055em;
    margin-bottom:24px;
  }
  .final-section .final-copy{
    gap:14px;
    margin-bottom:28px;
  }
  .final-section .final-copy p{
    font-size:15px;
    line-height:1.85;
  }
  .final-section .final-copy p:first-child{
    font-size:20px;
    line-height:1.65;
  }
}


/* --- Update: keep Final CTA headline lines balanced --- */
.final-section .final-heading{
  max-width:min(1180px, calc(100% - 28px))!important;
  font-size:clamp(38px,5.2vw,76px)!important;
  line-height:1.08!important;
  letter-spacing:-.06em!important;
}
.final-section .final-heading span{
  display:block!important;
  white-space:nowrap!important;
}
@media (max-width:560px){
  .final-section .final-heading{
    font-size:clamp(24px,5.8vw,34px)!important;
    line-height:1.18!important;
    letter-spacing:-.035em!important;
    max-width:calc(100% - 18px)!important;
  }
}


/* --- Fix: compact spacing for Founded / Field in DIGITAL HOLLYWOOD section --- */
.dh-reason-section .reason-facts.reason-facts-compact{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  margin:12px 0 14px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}
.dh-reason-section .reason-fact-compact{
  position:relative!important;
  display:grid!important;
  gap:2px!important;
  padding:0 0 0 14px!important;
  margin:0!important;
  min-height:0!important;
}
.dh-reason-section .reason-fact-compact:before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:2px!important;
  bottom:2px!important;
  width:4px!important;
  border-radius:999px!important;
  background:#d7d7d7!important;
}
.dh-reason-section .reason-fact-label,
.dh-reason-section .reason-fact-value{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#202520!important;
  font-weight:950!important;
}
.dh-reason-section .reason-fact-label{
  font-size:16px!important;
  line-height:1.15!important;
  letter-spacing:-.01em!important;
}
.dh-reason-section .reason-fact-value{
  font-size:18px!important;
  line-height:1.25!important;
  letter-spacing:-.025em!important;
}
@media (max-width:560px){
  .dh-reason-section .reason-facts.reason-facts-compact{
    gap:8px!important;
    margin:10px 0 12px!important;
  }
  .dh-reason-section .reason-fact-compact{
    gap:1px!important;
    padding-left:12px!important;
  }
  .dh-reason-section .reason-fact-label{
    font-size:14px!important;
    line-height:1.1!important;
  }
  .dh-reason-section .reason-fact-value{
    font-size:16px!important;
    line-height:1.22!important;
  }
}


/* --- Revert: Founded / Field back to boxed cards --- */
.dh-reason-section .reason-facts.reason-facts-boxed{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  margin:24px 0 26px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed article{
  display:block!important;
  min-height:128px!important;
  padding:26px 28px!important;
  border:1px solid var(--line)!important;
  border-radius:var(--radius)!important;
  background:#fff!important;
  box-shadow:0 18px 50px rgba(5,7,6,.045)!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed article:before{
  display:none!important;
  content:none!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed span{
  display:block!important;
  margin:0 0 12px!important;
  padding:0!important;
  color:#697166!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed strong{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#202520!important;
  font-size:clamp(19px,2vw,26px)!important;
  line-height:1.45!important;
  font-weight:950!important;
  letter-spacing:-.035em!important;
}
@media (max-width:700px){
  .dh-reason-section .reason-facts.reason-facts-boxed{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin:20px 0 22px!important;
  }
  .dh-reason-section .reason-facts.reason-facts-boxed article{
    min-height:auto!important;
    padding:22px 24px!important;
  }
}


/* --- Tighten Founded/Field cards to match compact reference --- */
.dh-reason-section .reason-facts.reason-facts-boxed{
  gap:10px!important;
  margin:16px 0 18px!important;
  align-items:start!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed article{
  min-height:auto!important;
  padding:14px 18px!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed span{
  margin:0 0 4px!important;
  font-size:11px!important;
  line-height:1.05!important;
  letter-spacing:.14em!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed strong{
  font-size:20px!important;
  line-height:1.12!important;
  letter-spacing:-.03em!important;
}
@media (max-width:700px){
  .dh-reason-section .reason-facts.reason-facts-boxed{
    gap:10px!important;
    margin:14px 0 16px!important;
  }
  .dh-reason-section .reason-facts.reason-facts-boxed article{
    padding:14px 16px!important;
  }
  .dh-reason-section .reason-facts.reason-facts-boxed strong{
    font-size:18px!important;
  }
}


/* --- Update: set Founded / Field cards around 150px height --- */
.dh-reason-section .reason-facts.reason-facts-boxed{
  align-items:start!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed article{
  height:150px!important;
  min-height:150px!important;
  max-height:150px!important;
  padding:18px 22px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed span{
  margin:0!important;
}
.dh-reason-section .reason-facts.reason-facts-boxed strong{
  margin:0!important;
}
@media (max-width:700px){
  .dh-reason-section .reason-facts.reason-facts-boxed article{
    height:auto!important;
    min-height:118px!important;
    max-height:none!important;
    padding:16px 18px!important;
  }
}


/* --- Update: DIGITAL HOLLYWOOD section as normal section, not card --- */
.dh-reason-section{
  background:var(--paper)!important;
  color:var(--ink)!important;
  border-bottom:1px solid var(--line)!important;
}
.dh-reason-section:before,
.dh-reason-section:after{
  display:none!important;
}
.dh-reason-section .side-index span{
  color:rgba(5,7,6,.08)!important;
  -webkit-text-stroke:1px rgba(5,7,6,.2)!important;
}
.dh-reason-section .side-index p,
.dh-reason-section p{
  color:#343832!important;
}
.dh-reason-section .content-wide h2{
  color:var(--ink)!important;
}
.reason-normal{
  display:grid!important;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;
  gap:34px!important;
  align-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  max-width:none!important;
}
.reason-normal .reason-image{
  width:100%!important;
  height:420px!important;
  object-fit:cover!important;
  border-radius:var(--radius)!important;
  border:1px solid var(--line)!important;
  box-shadow:0 22px 70px rgba(5,7,6,.08)!important;
}
.reason-normal .reason-lead{
  color:var(--ink)!important;
  font-size:clamp(28px,3.6vw,52px)!important;
  line-height:1.18!important;
  letter-spacing:-.06em!important;
  font-weight:950!important;
  margin:0 0 24px!important;
}
.reason-normal p:not(.reason-lead){
  color:#4f574c!important;
  font-size:17px!important;
  line-height:2!important;
  margin:0 0 28px!important;
}
.reason-normal .reason-button{
  border:1px solid #cfd5ca!important;
  background:#eef1e9!important;
  color:#202520!important;
  box-shadow:none!important;
}
@media (max-width:980px){
  .reason-normal{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  .reason-normal .reason-image{
    height:300px!important;
  }
  .reason-normal .reason-lead{
    font-size:clamp(28px,7vw,42px)!important;
  }
}
@media (max-width:560px){
  .reason-normal .reason-image{
    height:230px!important;
    border-radius:20px!important;
  }
  .reason-normal .reason-lead{
    font-size:28px!important;
    line-height:1.25!important;
    margin-bottom:18px!important;
  }
  .reason-normal p:not(.reason-lead){
    font-size:15px!important;
    line-height:1.9!important;
  }
}


/* --- Confirmed: Vertical heading design C / bold outline typography --- */
.side-index{
  border-top:0!important;
  padding-top:0!important;
}
.side-index span{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif!important;
  writing-mode:vertical-rl!important;
  text-orientation:mixed!important;
  font-size:clamp(34px,4.1vw,68px)!important;
  line-height:.86!important;
  letter-spacing:.06em!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  color:rgba(5,7,6,.08)!important;
  -webkit-text-stroke:1px rgba(5,7,6,.2)!important;
  text-shadow:none!important;
}
.side-index{
  align-items:flex-start!important;
  justify-content:center!important;
}
.black-block .side-index span,
.final-section .side-index span{
  color:rgba(255,255,255,.06)!important;
  -webkit-text-stroke:1px rgba(255,255,255,.28)!important;
}
.dh-reason-section .side-index span{
  color:rgba(5,7,6,.08)!important;
  -webkit-text-stroke:1px rgba(5,7,6,.2)!important;
}
@media (max-width:980px){
  .side-index span{
    writing-mode:horizontal-tb!important;
    font-size:16px!important;
    line-height:1.2!important;
    letter-spacing:.16em!important;
    font-weight:950!important;
    color:rgba(5,7,6,.28)!important;
    -webkit-text-stroke:.35px rgba(5,7,6,.18)!important;
  }
  .black-block .side-index span,
  .final-section .side-index span{
    color:rgba(255,255,255,.44)!important;
    -webkit-text-stroke:0!important;
  }
  .dh-reason-section .side-index span{
    color:rgba(5,7,6,.28)!important;
    -webkit-text-stroke:.35px rgba(5,7,6,.18)!important;
  }
}


/* --- Update: DIGITAL HOLLYWOOD section order = heading / image / body / link --- */
.reason-normal{
  display:block!important;
  max-width:920px!important;
}
.reason-normal .reason-lead{
  max-width:980px!important;
  margin:0 0 26px!important;
}
.reason-normal .reason-image{
  display:block!important;
  width:100%!important;
  max-width:760px!important;
  height:420px!important;
  object-fit:cover!important;
  border-radius:var(--radius)!important;
  border:1px solid var(--line)!important;
  box-shadow:0 22px 70px rgba(5,7,6,.08)!important;
  margin:0 0 26px!important;
}
.reason-normal p{
  max-width:920px!important;
  margin:0 0 26px!important;
}
.reason-normal .reason-button{
  display:inline-flex!important;
}

@media (max-width:980px){
  .reason-normal .reason-image{
    max-width:100%!important;
    height:300px!important;
  }
}
@media (max-width:560px){
  .reason-normal .reason-lead{
    margin-bottom:18px!important;
  }
  .reason-normal .reason-image{
    height:230px!important;
    margin-bottom:18px!important;
  }
  .reason-normal p{
    margin-bottom:18px!important;
  }
}

/* ==========================================================================
   スマホ・タブレット向けレスポンシブ調整（画面幅1024px以下）
   ========================================================================== */
@media screen and (max-width: 1024px) {
  /* ファーストビュー全体のレイアウトを縦並びに変更 */
  .fv-container, .hero-section { /* 実際のクラス名に合わせて調整しています */
    flex-direction: column !important;
    align-items: center !important;
    padding: 40px 20px !important;
    height: auto !important;
  }

  /* 左側のテキストエリアの調整 */
  .fv-text-area, .hero-left {
    width: 100% !important;
    max-width: 600px !important;
    text-align: center !important;
    margin-bottom: 40px !important;
  }

  /* 右側のグラフィック全体を囲むコンテナの調整 */
  .animation-area, .network-container { 
    width: 100% !important;
    max-width: 500px !important; /* PCサイズからスマホ向けに最大幅を制限 */
    height: 500px !important; /* 高さを固定せず領域を確保 */
    position: relative !important;
    margin: 0 auto !important;
    /* ★ここがポイント：
       中の要素の px 配置を崩さないまま、外枠に合わせて全体を 80% に縮小します
    */
    transform: scale(0.8) !important; 
    transform-origin: center center !important;
  }
}

/* さらに画面幅が狭いスマホ向け（画面幅480px以下） */
@media screen and (max-width: 480px) {
  .animation-area, .network-container {
    max-width: 360px !important;
    height: 400px !important;
    /* 画面がかなり狭いので、全体を 60% まで縮小して画面内に収めます */
    transform: scale(0.6) !important; 
    margin-top: -40px !important; /* 縮小してできた上下の不要な隙間を詰める */
    margin-bottom: -40px !important;
  }

  /* 「Human role」のテキストボックスがはみ出さないように調整 */
  .human-role-box, .human-role-card {
    width: 90% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-size: 14px !important;
  }
}

/* --- Update: prevent selected copy from wrapping on smartphone --- */
.hero-method-nowrap,
.final-heading-nowrap,
.final-copy-nowrap{
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}

@media (max-width:560px){
  .hero-method-nowrap{
    display:inline-block!important;
    white-space:nowrap!important;
    font-size:clamp(10px,2.55vw,13px)!important;
    letter-spacing:.12em!important;
  }

  .final-heading .final-heading-nowrap{
    display:block!important;
    white-space:nowrap!important;
    font-size:clamp(22px,5.4vw,30px)!important;
    letter-spacing:-.055em!important;
    line-height:1.15!important;
  }

  .final-copy .final-copy-nowrap{
    max-width:none!important;
    white-space:nowrap!important;
    font-size:clamp(11px,2.95vw,15px)!important;
    line-height:1.7!important;
    letter-spacing:-.04em!important;
  }
}

@media (max-width:390px){
  .hero-method-nowrap{
    font-size:10px!important;
    letter-spacing:.08em!important;
  }

  .final-heading .final-heading-nowrap{
    font-size:21px!important;
    letter-spacing:-.07em!important;
  }

  .final-copy .final-copy-nowrap{
    font-size:10.5px!important;
    letter-spacing:-.055em!important;
  }
}


/* --- Update: FV mobile visual image replacement --- */
.hero-visual-mobile-image{
  display:none;
  margin:20px 0 24px;
}
.hero-visual-mobile-image img{
  display:block;
  width:100%;
  height:auto;
  border-radius:26px;
  border:1px solid rgba(184,255,92,.22);
  box-shadow:0 18px 60px rgba(184,255,92,.12);
}
@media (max-width:560px){
  .hero-visual-mobile-image{
    display:block;
  }
}

/* --- Update: independent included courses section --- */
.included-course-section{
  background:#eef1e8!important;
}
.included-course-section .section-kicker{
  margin:0 0 18px!important;
  color:#61705b!important;
  font-size:12px!important;
  letter-spacing:.18em!important;
  font-weight:950!important;
  text-transform:uppercase!important;
}
.included-course-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:36px;
}
.included-course-grid article{
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:30px 28px;
  box-shadow:0 20px 58px rgba(5,7,6,.045);
}
.included-course-grid article:before{
  content:"";
  position:absolute;
  inset:auto -70px -90px auto;
  width:170px;
  height:170px;
  border-radius:50%;
  background:rgba(184,255,92,.16);
}
.included-course-grid .course-category{
  position:relative;
  display:block;
  margin-bottom:22px;
  color:#202520;
  font-size:20px;
  line-height:1.35;
  letter-spacing:-.035em;
  font-weight:950;
}
.included-course-grid ul{
  position:relative;
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.included-course-grid li{
  position:relative;
  padding-left:18px;
  color:#4f574c;
  font-size:15px;
  line-height:1.7;
  font-weight:800;
}
.included-course-grid li:before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--green);
  box-shadow:0 0 0 4px rgba(184,255,92,.16);
}
@media (max-width:980px){
  .included-course-grid{
    grid-template-columns:1fr;
    gap:12px;
  }
}
@media (max-width:560px){
  .included-course-section .section-kicker{
    font-size:10px!important;
    letter-spacing:.13em!important;
  }
  .included-course-grid{
    margin-top:26px;
  }
  .included-course-grid article{
    padding:24px 22px;
    border-radius:22px;
  }
  .included-course-grid .course-category{
    font-size:18px;
    margin-bottom:18px;
  }
  .included-course-grid li{
    font-size:14px;
    line-height:1.65;
  }
}


/* --- Update: COURSES section redesign --- */
.included-course-section{
  background:#f3f1ec!important;
}
.courses-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  margin-top:38px;
}
.course-card{
  background:#fff;
  border:1px solid #e7e1d8;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 12px 36px rgba(16,16,16,.04);
}
.course-card-visual{
  position:relative;
  height:170px;
  background:
    repeating-linear-gradient(
      -45deg,
      #e9e4db 0px,
      #e9e4db 12px,
      #f0ece4 12px,
      #f0ece4 24px
    );
}
.course-card-visual span{
  position:absolute;
  left:18px;
  bottom:16px;
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:10px;
  background:#fff;
  color:#8f877d;
  font-size:12px;
  letter-spacing:.02em;
}
.course-card-body{
  padding:22px 20px 20px;
}
.course-card-num{
  margin-bottom:10px;
  color:#9a9389;
  font-size:12px;
  letter-spacing:.14em;
  font-weight:950;
}
.course-card h3{
  margin:0 0 18px;
  color:#0d0f0d;
  font-size:22px;
  line-height:1.25;
  letter-spacing:-.04em;
  font-weight:950;
}
.course-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px 8px;
  margin-bottom:24px;
  min-height:126px;
  align-content:flex-start;
}
.course-tags span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 14px;
  border-radius:12px;
  background:#efebe4;
  color:#6d665d;
  font-size:14px;
  line-height:1.35;
  font-weight:800;
}
.course-card-button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  min-height:62px;
  padding:0 22px;
  border-radius:16px;
  background:#111;
  color:#fff;
  font-size:16px;
  font-weight:950;
  text-decoration:none;
  letter-spacing:.01em;
}
.course-card-button small{
  font-size:24px;
  line-height:1;
}
@media (max-width:1200px){
  .courses-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:560px){
  .courses-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:28px;
  }
  .course-card{
    border-radius:20px;
  }
  .course-card-visual{
    height:104px;
  }
  .course-card-visual span{
    left:12px;
    bottom:12px;
    min-height:26px;
    padding:0 10px;
    border-radius:8px;
    font-size:10px;
  }
  .course-card-body{
    padding:14px 14px 14px;
  }
  .course-card-num{
    margin-bottom:6px;
    font-size:10px;
  }
  .course-card h3{
    margin:0 0 12px;
    font-size:16px;
    line-height:1.28;
  }
  .course-tags{
    gap:8px 6px;
    margin-bottom:14px;
    min-height:118px;
  }
  .course-tags span{
    min-height:30px;
    padding:6px 10px;
    border-radius:10px;
    font-size:11px;
    line-height:1.3;
  }
  .course-card-button{
    min-height:46px;
    padding:0 14px;
    border-radius:12px;
    font-size:13px;
  }
  .course-card-button small{
    font-size:18px;
  }
}


/* --- Update: courses cards with real images --- */
.included-course-section{
  background:#f3f1ec!important;
}
.courses-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  margin-top:38px;
}
.course-card{
  background:#fff;
  border:1px solid #e7e1d8;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 12px 36px rgba(16,16,16,.04);
}
.course-card-visual{
  position:relative;
  height:170px;
  background:#e9e4db;
}
.course-card-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.course-card-visual span{
  position:absolute;
  left:18px;
  bottom:16px;
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:10px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(6px);
  color:#8f877d;
  font-size:12px;
  letter-spacing:.02em;
}
.course-card-body{
  padding:22px 20px 20px;
}
.course-card-num{
  margin-bottom:10px;
  color:#9a9389;
  font-size:12px;
  letter-spacing:.14em;
  font-weight:950;
}
.course-card h3{
  margin:0 0 18px;
  color:#0d0f0d;
  font-size:22px;
  line-height:1.25;
  letter-spacing:-.04em;
  font-weight:950;
}
.course-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px 8px;
  margin-bottom:24px;
  min-height:126px;
  align-content:flex-start;
}
.course-tags span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 14px;
  border-radius:12px;
  background:#efebe4;
  color:#6d665d;
  font-size:14px;
  line-height:1.35;
  font-weight:800;
}
.course-card-button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  min-height:62px;
  padding:0 22px;
  border:0;
  border-radius:16px;
  background:#111;
  color:#fff;
  font-size:16px;
  font-weight:950;
  text-decoration:none;
  letter-spacing:.01em;
  cursor:pointer;
}
.course-card-button small{
  font-size:24px;
  line-height:1;
}
@media (max-width:1200px){
  .courses-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:560px){
  .courses-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:28px;
  }
  .course-card{
    border-radius:20px;
  }
  .course-card-visual{
    height:104px;
  }
  .course-card-visual span{
    left:12px;
    bottom:12px;
    min-height:26px;
    padding:0 10px;
    border-radius:8px;
    font-size:10px;
  }
  .course-card-body{
    padding:14px 14px 14px;
  }
  .course-card-num{
    margin-bottom:6px;
    font-size:10px;
  }
  .course-card h3{
    margin:0 0 12px;
    font-size:16px;
    line-height:1.28;
  }
  .course-tags{
    gap:8px 6px;
    margin-bottom:14px;
    min-height:118px;
  }
  .course-tags span{
    min-height:30px;
    padding:6px 10px;
    border-radius:10px;
    font-size:11px;
    line-height:1.3;
  }
  .course-card-button{
    min-height:46px;
    padding:0 14px;
    border-radius:12px;
    font-size:13px;
  }
  .course-card-button small{
    font-size:18px;
  }
}

/* --- Update: course modal popup --- */
.course-modal{
  position:fixed;
  inset:0;
  z-index:1200;
  display:none;
}
.course-modal.is-open{
  display:block;
}
.course-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(8,10,8,.62);
  backdrop-filter:blur(4px);
}
.course-modal__dialog{
  position:relative;
  width:min(920px, calc(100% - 32px));
  max-height:calc(100vh - 48px);
  margin:24px auto;
  overflow:auto;
  background:#faf9f5;
  border:1px solid #ded8ce;
  border-radius:28px;
  box-shadow:0 24px 80px rgba(0,0,0,.2);
}
.course-modal__close{
  position:sticky;
  top:16px;
  left:100%;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  margin:16px 16px 0 auto;
  border:0;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.course-modal__content{
  padding:8px 28px 34px;
}
.course-modal__header{
  margin:0 0 22px;
}
.course-modal__eyebrow{
  display:inline-block;
  margin-bottom:10px;
  color:#7e766d;
  font-size:12px;
  letter-spacing:.16em;
  font-weight:900;
}
.course-modal__title{
  margin:0;
  color:#0d0f0d;
  font-size:34px;
  line-height:1.18;
  letter-spacing:-.04em;
  font-weight:950;
}
.course-modal__lead{
  margin:14px 0 0;
  color:#5d655a;
  font-size:16px;
  line-height:1.8;
}
.course-detail-list{
  display:grid;
  gap:16px;
}
.course-detail-item{
  background:#fff;
  border:1px solid #e5dfd5;
  border-radius:22px;
  padding:22px 22px 20px;
}
.course-detail-item h4{
  margin:0 0 10px;
  color:#101210;
  font-size:22px;
  line-height:1.35;
  letter-spacing:-.03em;
  font-weight:950;
}
.course-detail-item p{
  margin:0 0 12px;
  color:#4f574c;
  font-size:15px;
  line-height:1.85;
}
.course-detail-meta{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.course-detail-meta div{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:baseline;
}
.course-detail-meta dt{
  min-width:54px;
  color:#7c7369;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
}
.course-detail-meta dd{
  margin:0;
  color:#161816;
  font-size:15px;
  font-weight:900;
}
@media (max-width:560px){
  .course-modal__dialog{
    width:min(100% - 18px, 100%);
    max-height:calc(100vh - 18px);
    margin:9px auto;
    border-radius:22px;
  }
  .course-modal__close{
    top:10px;
    width:38px;
    height:38px;
    margin:10px 10px 0 auto;
    font-size:22px;
  }
  .course-modal__content{
    padding:6px 16px 20px;
  }
  .course-modal__title{
    font-size:26px;
  }
  .course-modal__lead{
    font-size:14px;
    line-height:1.75;
  }
  .course-detail-item{
    border-radius:18px;
    padding:18px 16px 16px;
  }
  .course-detail-item h4{
    font-size:18px;
  }
  .course-detail-item p,
  .course-detail-meta dd{
    font-size:14px;
    line-height:1.75;
  }
  .course-detail-meta dt{
    font-size:12px;
  }
}


/* --- Update: courses cards copy and layout refinement --- */
.courses-card-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  margin-top:38px;
}
.course-card{
  display:grid;
  grid-template-columns:320px minmax(0,1fr);
  align-items:stretch;
  background:#fff;
  border:1px solid #e7e1d8;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 12px 36px rgba(16,16,16,.04);
}
.course-card-visual{
  position:relative;
  height:100%;
  min-height:240px;
  background:#e9e4db;
}
.course-card-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.course-card-visual span{
  display:none!important;
}
.course-card-body{
  display:flex;
  flex-direction:column;
  padding:26px 24px 24px;
}
.course-card-num{
  display:none!important;
}
.course-card h3{
  margin:0 0 18px;
  color:#0d0f0d;
  font-size:22px;
  line-height:1.25;
  letter-spacing:-.04em;
  font-weight:950;
}
.course-inline-num{
  display:inline-block;
  margin-right:10px;
  color:#9a9389;
  font-size:18px;
  letter-spacing:.08em;
  font-weight:950;
}
.course-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px 8px;
  margin-bottom:24px;
  min-height:auto;
  align-content:flex-start;
}
.course-tags span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 14px;
  border-radius:12px;
  background:#efebe4;
  color:#6d665d;
  font-size:14px;
  line-height:1.45;
  font-weight:800;
}
.course-card-button{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  min-height:62px;
  padding:0 22px;
  border:0;
  border-radius:16px;
  background:#111;
  color:#fff;
  font-size:16px;
  font-weight:950;
  letter-spacing:.01em;
  cursor:pointer;
}
.course-card-button small{
  font-size:24px;
  line-height:1;
}
@media (max-width:980px){
  .course-card{
    grid-template-columns:260px minmax(0,1fr);
  }
}
@media (max-width:560px){
  .courses-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:28px;
  }
  .course-card{
    display:block;
    border-radius:20px;
  }
  .course-card-visual{
    min-height:0;
    height:104px;
  }
  .course-card-body{
    padding:14px 14px 14px;
  }
  .course-card h3{
    margin:0 0 12px;
    font-size:16px;
    line-height:1.28;
  }
  .course-inline-num{
    margin-right:8px;
    font-size:13px;
  }
  .course-tags{
    gap:8px 6px;
    margin-bottom:14px;
  }
  .course-tags span{
    min-height:30px;
    padding:6px 10px;
    border-radius:10px;
    font-size:11px;
    line-height:1.3;
  }
  .course-card-button{
    min-height:46px;
    padding:0 14px;
    border-radius:12px;
    font-size:13px;
  }
  .course-card-button small{
    font-size:18px;
  }
}
