/* AGI CAMPの映像と紫を入口に使い、申込操作は読みやすい白い面へ。 */
:root{--purple:#6b4fc0;--purple-dark:#513495;--purple-soft:#f1ecfb;--bg:#f7f5fb;--radius:20px;--shadow:0 12px 36px rgba(56,31,101,.055)}
body{background:radial-gradient(ellipse at 90% 0,#e8ddfa 0,transparent 38%),var(--bg)}
main{max-width:1320px}
.site-header{height:86px;padding-inline:max(32px,calc((100vw - 1256px)/2));background:rgba(255,255,255,.96)}
.preview-banner{font-size:11px;background:#eee8fa;color:#4d367b}
.intro-hero{position:relative;isolation:isolate;min-height:430px;margin:30px 0 34px;overflow:hidden;border-radius:26px;background:linear-gradient(135deg,#8970ca 0%,#6249a7 54%,#3a2d69 100%);box-shadow:0 20px 55px rgba(59,37,106,.12)}
/* The diagonal meets the film at 3% halfway down; its visible center is 51.5%. */
.hero-film{position:absolute;inset:0 0 0 40%;overflow:hidden;background:#ac88d5;clip-path:polygon(6% 0,100% 0,100% 100%,0 100%)}
.hero-poster,.hero-film video{position:absolute;inset:0;width:103%;height:100%;object-fit:cover;object-position:center}
.hero-film video{opacity:0;transition:opacity .3s}
.hero-film.has-video video{opacity:1}
.hero-film:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(70,44,117,.14),transparent 55%);pointer-events:none}
.hero-copy{position:relative;z-index:1;width:43%;min-height:430px;padding:43px 42px 39px 42px;color:white;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.hero-copy:after{content:"";position:absolute;z-index:-1;inset:0 10% 0 0;opacity:.14;background:linear-gradient(142deg,transparent 39%,#c3a8f1 39%,transparent 72%);clip-path:polygon(0 0,100% 0,80% 100%,0 100%)}
.hero-eyebrow{font-size:15px;letter-spacing:.04em;font-weight:700;display:flex;gap:12px;align-items:center;margin-bottom:22px}
.hero-eyebrow span{font-size:10px;font-weight:500;border-left:1px solid #b9a2e3;padding-left:12px;letter-spacing:.07em}
.hero-copy h1{font-size:clamp(28px,3vw,43px);line-height:1.48;letter-spacing:-.05em;margin:0 0 20px;font-weight:800}
.hero-copy h1 span{background:#342448;padding:0 .17em .07em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero-copy h1 span:last-child{color:#ebd5ff}
.hero-description{font-size:13px;line-height:1.9;color:#fbf8ff;font-weight:500;margin-bottom:25px}
.hero-start{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:50px;padding:12px 22px;border-radius:9px;background:white;color:#513495;text-decoration:none;font-size:13px;font-weight:700;box-shadow:0 6px 18px #35205224;transition:transform .16s,box-shadow .16s}
.hero-start:hover{transform:translateY(-2px);box-shadow:0 9px 24px #2e193a35}
.hero-start span{font-size:18px;font-weight:400}
.hero-assurance{font-size:10px;margin-top:13px;color:#e9dff8;letter-spacing:.015em}
.hero-motion{position:absolute;z-index:3;right:16px;bottom:16px;display:flex;gap:7px;align-items:center;background:rgba(32,22,49,.82);color:white;border:1px solid #ffffff55;border-radius:30px;padding:9px 13px;font-size:10px;min-height:36px}
.hero-motion:hover{background:#30203e}
.hero-motion:focus-visible{outline-color:white}
.steps{max-width:none;padding:19px 24px;margin:0 0 35px;background:rgba(255,255,255,.9);border:1px solid #e9e2f4;border-radius:14px;gap:28px}
.steps li{font-size:12px}
.step-dot{width:29px;height:29px}
body[data-catalog-view="courses"][data-checkout-step="catalog"] .checkout-layout{display:block}
body[data-catalog-view="courses"][data-checkout-step="catalog"] .order-summary{display:none}
.course-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.section-heading{margin-bottom:24px;align-items:flex-start}
.section-heading h2{font-size:24px}
.section-heading p:not(.section-kicker){font-size:13px}
.section-kicker{font-size:11px}
.count-badge{display:inline-block;background:#e9e1f6;color:#57417f;font-size:12px;margin-top:10px}
.course-card{padding:0;overflow:hidden;border-color:#e5deed;box-shadow:0 5px 20px rgba(42,20,77,.025);min-height:0}
.course-card:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 15px 35px rgba(49,26,85,.10)}
.course-card>.course-logo{width:100%;margin:0 0 23px;border:0;border-bottom:1px solid #f1edf5;border-radius:0}
.course-logo img{padding:0}
.course-card>.course-label,.course-card>.course-name,.course-card>.course-copy,.course-card>.course-action{margin-left:24px;margin-right:24px}
.course-card>.course-name{font-size:20px;margin-top:10px;margin-bottom:10px}
.course-card>.course-copy{font-size:12px;line-height:1.85;margin-bottom:23px}
.course-card>.course-action{width:calc(100% - 48px);margin-top:auto;margin-bottom:22px;padding-top:17px;font-size:12px}
.course-label{font-size:10px}
.course-card[data-camp="x"] .course-logo{background:linear-gradient(135deg,#eeedf2,#faf9fc)}
.course-card[data-camp="x"] .course-logo-fallback{font-size:26px;letter-spacing:.02em}
body:not([data-catalog-view="courses"]) .steps,body[data-checkout-step="identity"] .steps,body[data-checkout-step="review"] .steps{margin-top:30px}
.selected-course{background:white;border-color:#ded5ee;grid-template-columns:minmax(0,210px) minmax(0,1fr);padding:23px;column-gap:24px;box-shadow:var(--shadow)}
.selected-course>.course-logo{border:1px solid #eee8f5;border-radius:9px}
.selected-course>p{font-size:23px}
.selected-course>span:last-child{font-size:12px}
.product-card{border-color:#e2dbea;box-shadow:0 3px 15px rgba(40,20,70,.025)}
.product-card.is-selected{background:#fcfaff;box-shadow:inset 0 0 0 1px var(--purple),0 8px 24px rgba(90,56,140,.08)}
.card-summary,.card-features{font-size:12px}
.card-notice,.card-period{font-size:11px}
.primary{background:linear-gradient(110deg,#7756c7,#6242b0);box-shadow:0 5px 12px rgba(92,60,151,.10)}
.primary:disabled{box-shadow:none}
.order-summary{border-color:#dfd5ee;box-shadow:0 12px 34px rgba(54,28,98,.065)}
.summary-top{border-color:#e9e0f4}
.summary-empty{padding:14px 0 24px}
.how-it-works{margin-top:48px;border-top-color:#e1d9ed}
.how-it-works>div{padding:26px;border:1px solid #e5ddef;border-radius:18px;background:#fff}
.how-it-works article>span{color:#8967c7}
.how-it-works p{font-size:12px}
.back-link{min-height:42px!important}
.hero-start,.back-link{scroll-margin-top:20px}
#catalog-title{scroll-margin-top:28px}
@media(min-width:1440px){.course-grid{gap:24px}.course-card{padding:0}}
@media(max-width:1100px){.hero-copy{padding-inline:28px}.hero-copy h1{font-size:clamp(28px,3vw,32px)}.course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.selected-course{grid-template-columns:130px minmax(0,1fr);gap:18px}.selected-course>p{font-size:20px}}
@media(max-width:960px){.intro-hero{margin:20px 0 24px;border-radius:20px;display:flex;flex-direction:column;min-height:0}.hero-copy{order:0;width:100%;min-height:0;padding:30px 27px 28px}.hero-copy:after{clip-path:none;inset:0}.hero-copy h1{font-size:clamp(27px,5.5vw,36px);margin-bottom:16px}.hero-eyebrow{font-size:14px;margin-bottom:19px}.hero-description{font-size:12px;margin-bottom:20px}.hero-start{min-height:48px;font-size:12px;padding:10px 19px;gap:25px}.hero-assurance{font-size:10px}.hero-film{position:relative;inset:auto;order:1;width:100%;aspect-ratio:16/9;clip-path:none}.hero-poster,.hero-film video{width:100%}.hero-film:after{background:linear-gradient(180deg,#4a2a781a,transparent 35%)}.hero-motion{right:12px;bottom:12px;padding:7px 11px}}
@media(max-width:760px){main{padding:0 20px}.site-header{height:76px;padding-inline:20px}.steps{padding:15px 17px;gap:13px;margin-bottom:28px}.steps li{font-size:10px}.steps li:not(:last-child):after{left:39px;top:14px}.section-heading h2{font-size:21px}.section-heading p:not(.section-kicker){font-size:12px}.count-badge{font-size:10px;padding:3px 8px}.course-grid{gap:16px}.course-card{padding:0}.course-card>.course-label,.course-card>.course-name,.course-card>.course-copy,.course-card>.course-action{margin-left:20px;margin-right:20px}.course-card>.course-action{width:calc(100% - 40px)}.selected-course{grid-template-columns:170px minmax(0,1fr)}.selected-course>p{font-size:21px}.how-it-works>div{padding:23px}.card-summary,.card-features{font-size:12px}.order-summary{scroll-margin-bottom:105px}}
@media(max-width:520px){.course-grid{grid-template-columns:1fr}.course-card>.course-logo{margin-bottom:20px}.course-card>.course-name{font-size:22px}.course-card>.course-copy{font-size:13px}.course-card>.course-action{font-size:12px}.selected-course{grid-template-columns:1fr;padding:19px}.selected-course>.course-logo{grid-column:1;grid-row:auto;width:100%;max-width:240px;margin-bottom:18px}.selected-course>.section-kicker,.selected-course>p,.selected-course>span:last-child{grid-column:1}.hero-copy{padding:27px 22px 25px}.hero-copy h1{font-size:clamp(23px,6.4vw,30px)}.hero-description{font-size:12px}.section-heading h2{font-size:20px}.how-it-works>div{padding:23px 20px}}
@media(prefers-reduced-motion:reduce){.hero-film video{transition:none}.hero-start:hover,.course-card:hover:not(:disabled){transform:none}}
