/* Confirmed copy is fixed; every text container grows with its content.
   Existing JICU palette, typefaces, square cards, logo and photographs retained. */
:root{--black:#000;--lime:#aeff00;--orange:#ff6b08;--text:#191919;--muted:#525252;--line:#d9d9d9;--off:#f4f4f4;--jp:'Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;--en:'Lato',Arial,sans-serif;--header-height:80px;--mobile-bar-height:11rem}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 1rem)}
body{margin:0;background:#fff;color:var(--text);font:400 1rem/1.95 var(--jp);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p,figure{margin:0}
h1,h2,h3,h4{line-height:1.55;font-weight:800;overflow-wrap:anywhere}
h2{font-size:clamp(1.75rem,3.2vw,2.75rem);letter-spacing:.01em}
h3{font-size:clamp(1.35rem,2.1vw,1.8rem)}
h4{font-size:1.125rem}
p{overflow-wrap:anywhere}
p+p{margin-top:1rem}
h2+p,h3+p,h4+p{margin-top:1.5rem}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a,summary{touch-action:manipulation}
a:hover{text-decoration:underline;text-underline-offset:.3em}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #a33400;outline-offset:5px}
.hero :focus-visible,.made-with-ai :focus-visible,.site-footer :focus-visible{outline-color:var(--lime)}
.wrap{width:min(1200px,calc(100% - 6rem));margin-inline:auto}
.section{padding-block:6rem}
.reading-column{max-width:900px;margin-inline:auto}
.section-intro{max-width:950px;margin-bottom:3rem}
.section-intro h2{max-width:27em}
.section-intro>p{max-width:48em}
.section-note{font-size:1rem;color:var(--muted);margin-top:2rem;max-width:62em}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:1.5rem;max-width:100%;min-height:3.75rem;padding:1.15rem 1.5rem;background:var(--orange);color:#000;font-weight:800;line-height:1.7;font-size:1.125rem;text-align:left}
.button .cta-label{min-width:0;overflow-wrap:anywhere}
.button svg{width:1.5rem;height:1.5rem;flex:0 0 1.5rem;fill:none;stroke:currentColor;stroke-width:1.8}
.button:hover{background:#ff8534;text-decoration:none}
.button[aria-disabled=true]{cursor:not-allowed;opacity:.7}
.cta-group{margin-top:2rem}
.cta-note{font-size:1rem;margin-top:.75rem;line-height:1.85}
.cta-note+.cta-note{margin-top:.3rem}
.skip-link{position:fixed;top:.5rem;left:.5rem;z-index:100;background:var(--lime);padding:.75rem;transform:translateY(-200%)}
.skip-link:focus{transform:none}
.site-header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #e6e6e6}
.header-inner{min-height:80px;display:flex;align-items:center;gap:2rem;padding-block:.75rem}
.brand{flex-shrink:0}
.brand img{width:54px;height:52px;object-fit:contain}
.header-inner nav{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:center;margin-left:auto;font-size:1rem;font-weight:600}
.mobile-nav-link{display:none}
.hero{background:#000;color:#fff;padding-block:4.5rem 5rem}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr);gap:3rem;align-items:start}
.eyebrow{color:var(--lime);font-size:1.125rem;font-weight:700;margin-bottom:1.5rem}
h1{font-size:clamp(2.15rem,3.65vw,3.65rem);line-height:1.6;letter-spacing:.015em}
h1 span{display:block}
.hero-tool-line{color:var(--lime);font-size:.74em;margin-bottom:.25em}
.hero-lead{margin-top:1.75rem;font-size:1.125rem}
.hero-facts{margin-top:1.75rem;padding-block:1rem;border-block:1px solid #555;font-weight:700}
.survey-summary{color:var(--lime);margin-top:1rem}
.hero-intro{margin-top:1.75rem;border-left:3px solid var(--lime);padding-left:1.1rem}
.hero-intro p+p{margin-top:.45rem}
.instructor-mini{font-weight:700}
.hero-photo{border-bottom:8px solid var(--lime);margin-top:.4rem}
.hero-photo img{width:100%;aspect-ratio:4/5.7;object-fit:cover;object-position:50% 35%}
.examples{background:var(--off)}
.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;align-items:start}
.work-card{padding:2.25rem;background:#fff;border-top:4px solid #000;min-width:0}
.work-card h3{margin-bottom:1.25rem}
.work-card h4{margin-block:1.8rem .8rem;border-left:4px solid var(--lime);padding-left:.85rem}
.work-card h4+p{margin-top:0}
.example-lines{background:var(--off);border-left:4px solid var(--lime);padding:1.25rem;margin-top:1.75rem;font-weight:600}
.example-lines p+p{margin-top:.7rem}
.made-with-ai{background:#000;color:#fff;border-left:10px solid var(--lime);padding-block:4.5rem}
.made-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:3rem;align-items:start}
.made-grid h2{font-size:clamp(1.6rem,2.7vw,2.25rem)}
.made-grid>p{margin-top:0}
.outcomes{background:var(--off)}
.outcomes .section-intro h2 span{display:block}
.outcomes .section-intro h2 .phrase{display:inline-block}
.outcomes-heading{margin-bottom:1.5rem}
.outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.outcome-grid article{padding:1.5rem;background:#fff;border-top:3px solid #000;min-width:0}
.outcome-grid h4{font-size:1.2rem}
.program-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;align-items:start}
.program-card{padding:2.3rem;border:1px solid #000;border-top:8px solid var(--lime)}
.program-card h2{font-size:clamp(1.5rem,2.2vw,2rem)}
.program-card-dark{background:#000;color:#fff}
.instructor-section{background:var(--off)}
.instructor-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:4rem;align-items:start}
.instructor-copy>p{margin-top:1.5rem}
.instructor-copy .instructor-name{font-size:1.5rem;font-weight:800;margin-top:2rem}
.instructor-copy .instructor-role{margin-top:.5rem}
.instructor-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 35%}
.voice{margin-top:3rem;padding:2.25rem;background:#fff;border-left:5px solid var(--lime);max-width:1000px}
.price-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:3rem;align-items:start}
.price-layout h2{font-size:clamp(2rem,3.5vw,3rem)}
.tool-policy{padding:1.5rem;background:var(--off);border-left:4px solid var(--lime)}
.price-section .cta-group{padding-top:2rem;border-top:1px solid #000;margin-top:2.5rem}
.faq{background:#fff}
.faq-list{max-width:1000px;margin-inline:auto;border-top:1px solid #000}
.faq-list details{border-bottom:1px solid #bbb}
.faq-list summary{cursor:pointer;list-style:none;display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;padding:1.75rem 1rem;font-weight:700;font-size:1.125rem;line-height:1.85}
summary::-webkit-details-marker{display:none}
.faq-icon{width:1rem;height:1rem;flex:0 0 1rem;background:linear-gradient(#000,#000) center/100% 2px no-repeat,linear-gradient(#000,#000) center/2px 100% no-repeat}
details[open] .faq-icon{background:linear-gradient(#000,#000) center/100% 2px no-repeat}
.faq-answer{padding:0 1rem 2rem;max-width:58rem}
.interest{background:var(--lime)}
.interest h2{max-width:24em}
.interest .reading-column>p{margin-top:1.5rem}
.survey-fields{padding-block:1.25rem;border-block:1px solid #6c9c00}
.interest .button{background:#000;color:#fff}
.interest .button:hover{background:#292929}
.interest .button:focus-visible{outline-color:#000}
.site-footer{background:#000;color:#fff;padding-block:3rem}
.footer-inner{display:flex;gap:1.5rem 2.5rem;flex-wrap:wrap;align-items:center}
.footer-brand{display:flex;align-items:center;gap:1rem}
.footer-brand img{width:45px;height:auto}
.footer-inner small{font-size:1rem}
.mobile-bar{display:none}
@media(max-width:1000px){
.wrap{width:calc(100% - 4rem)}
.header-inner nav{gap:1rem}
.hero-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,.8fr);gap:2rem}
.outcome-grid{grid-template-columns:1fr}
.instructor-grid{gap:2.5rem}
}
@media(max-width:800px){
.header-inner nav{display:none}
.mobile-nav-link{display:flex;align-items:center;min-height:44px;padding-inline:.5rem;margin-left:auto;font-weight:700}
.work-grid,.program-grid,.made-grid,.price-layout{grid-template-columns:1fr}
.hero-grid{grid-template-columns:1fr}
.hero-photo{max-width:360px;margin-top:1rem}
.hero-photo img{aspect-ratio:4/4.5}
.instructor-grid{grid-template-columns:1fr}
.instructor-photo{max-width:360px}
.section{padding-block:4rem}
.hero{padding-top:3rem}
.made-grid{gap:1.75rem}
}
@media(max-width:768px){
body{padding-bottom:var(--mobile-bar-height)}
.mobile-bar{display:block;position:fixed;bottom:0;left:0;right:0;z-index:30;background:#fff;border-top:1px solid #000;padding:.75rem 1rem calc(.6rem + env(safe-area-inset-bottom))}
.mobile-bar .button{width:100%;padding:.75rem 1rem;min-height:3.4rem;font-size:1rem;gap:.75rem}
.mobile-bar p{font-size:1rem;margin-top:.4rem;line-height:1.65}
}
@media(max-width:520px){
.wrap{width:calc(100% - 2.5rem)}
.header-inner{min-height:72px}
.section{padding-block:3.5rem}
h1{font-size:2.15rem;line-height:1.6}
h2{font-size:1.75rem}
h3{font-size:1.4rem}
.hero-lead{font-size:1rem}
.hero-facts{font-weight:600}
.work-card,.program-card{padding:1.5rem}
.example-lines{padding:1rem}
.voice{padding:1.5rem}
.button{font-size:1rem;gap:.75rem;padding:1rem 1.15rem}
.faq-list summary{padding:1.4rem 0;gap:1rem;font-size:1rem}
.faq-answer{padding:0 0 1.6rem}
.footer-inner{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* Keep short heading phrases together without forcing desktop line breaks. */
.phrase{display:inline-block;max-width:100%;vertical-align:baseline}
.hero-question .phrase{display:inline-block}
@media(max-width:520px){h1{font-size:1.875rem}}

/* Paid enrollment: long dates and recording terms grow naturally. */
.course-summary{color:var(--lime);margin-top:1rem;font-weight:700}
.course-overview{margin:2rem 0 0}
.course-overview>div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:.8rem;border-bottom:1px solid var(--line);padding:1rem 0}
.course-overview dt{font-weight:700}
.course-overview dd{margin:0;overflow-wrap:anywhere}
.recording-policy{border-left:4px solid var(--lime);padding:1.25rem;margin-block:1.5rem;background:var(--off)}
.session-date{font-weight:700;margin-top:1.25rem}
.application-dates{margin-top:1.75rem}
.application-deadline{padding-block:1.25rem;border-block:1px solid #6c9c00;font-weight:700}
@media(max-width:520px){.course-overview>div{grid-template-columns:1fr;gap:.3rem}.recording-policy{padding:1rem}}

.price-layout h2 .price-tax-label{font-size:.55em}

/* 2026-09-09 conversion pass: hero value line and badges, audience fit, course scope,
   price inclusions, application steps and the申込フロー. Palette, type and card language unchanged. */
.hero-value{margin-top:1.5rem;font-size:clamp(1.35rem,2.3vw,1.9rem);font-weight:800;line-height:1.6;color:var(--lime)}
.hero-value .phrase{display:inline-block}
.hero-lead{margin-top:1.25rem}
.badge-list{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.75rem 0 0;padding:0;list-style:none}
.badge-list li{border:1px solid var(--lime);color:var(--lime);font-size:.9375rem;font-weight:700;line-height:1.5;padding:.5rem .9rem}

.flow-band{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:1rem;align-items:stretch;margin-bottom:2.5rem}
.flow-step{background:#fff;border-top:4px solid #000;padding:1.25rem;min-width:0}
.flow-step-core{background:#000;color:#fff;border-top-color:var(--lime)}
.flow-label{display:block;font-family:var(--en);font-weight:900;font-size:.9375rem;letter-spacing:.06em;color:var(--muted)}
.flow-step-core .flow-label{color:var(--lime);font-family:var(--jp)}
.flow-body{display:block;margin-top:.5rem;font-weight:700;line-height:1.75}
.flow-arrow{align-self:center;font-weight:800;font-size:1.5rem;color:var(--muted)}

.card-cat{font-size:.9375rem;font-weight:800;color:var(--muted);margin-bottom:.6rem}
.more-uses{margin-top:2.5rem;background:#fff;border-left:5px solid var(--lime);padding:2rem}
.more-uses h3{font-size:1.35rem}
.more-uses ul{margin:1.25rem 0 0;padding-left:1.35rem}
.more-uses li+li{margin-top:.5rem}
.more-uses .section-note{margin-top:1.25rem}

.audience-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:3rem;align-items:start}
.check-list{list-style:none;margin:2rem 0 0;padding:0}
.check-list li{position:relative;padding-left:2.1rem;line-height:1.85}
.check-list li+li{margin-top:.9rem}
.check-list li::before{content:"";position:absolute;left:.2rem;top:.6em;width:1rem;height:.55rem;border-left:3px solid #000;border-bottom:3px solid #000;transform:rotate(-45deg)}
.audience-not{background:var(--off);border-left:5px solid var(--muted);padding:1.75rem}
.audience-not h3{font-size:1.25rem}
.audience-not ul{margin:1.25rem 0 0;padding-left:1.35rem;color:var(--muted)}
.audience-not li+li{margin-top:.5rem}
.audience-not>p{margin-top:1.25rem;font-size:1rem;color:var(--muted)}

.term-note{margin-top:1.75rem;background:#fff;border-left:4px solid var(--lime);padding:1.35rem;font-size:1rem;max-width:48em}
.term-note strong{display:block;font-weight:800;margin-bottom:.35rem}

.scope-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin-top:2.5rem;align-items:start}
.scope-card{padding:2rem;min-width:0}
.scope-in{background:var(--off);border-top:4px solid #000}
.scope-out{background:#fff;border:1px solid var(--line);border-top:4px solid var(--line)}
.scope-card h3{font-size:1.3rem}
.scope-card ul{margin:1.5rem 0 0;padding-left:1.35rem}
.scope-card li+li{margin-top:.55rem}

.usage-block{margin-top:3rem;background:#fff;padding:2.25rem;border-top:4px solid #000}
.usage-block h3{font-size:1.4rem}
.usage-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem 2rem;list-style:none;margin:1.75rem 0 0;padding:0}
.usage-list li{position:relative;padding-left:1.5rem;font-weight:600;line-height:1.8}
.usage-list li::before{content:"";position:absolute;left:0;top:.72em;width:.6rem;height:.6rem;background:var(--lime)}
.usage-block .section-note{margin-top:1.5rem}

.voice h3{font-size:1.4rem}
.voice>p{margin-top:1.25rem}
.voice-quote{margin:1.5rem 0 0;padding:1.35rem 1.5rem;background:var(--off);border-left:4px solid #000}
.voice-quote p{font-size:1.15rem;font-weight:800;line-height:1.8}
.voice-quote p+p{margin-top:.5rem}
.voice-attr{display:block;font-size:.9375rem;font-weight:400;color:var(--muted);margin-top:.2rem}

.price-reason{max-width:900px;margin-bottom:3.5rem;padding-bottom:3rem;border-bottom:1px solid var(--line)}
.price-reason h2{font-size:clamp(1.75rem,3vw,2.5rem)}
.price-reason>p{margin-top:1.5rem}
.price-sub{margin-top:.75rem;font-weight:700;color:var(--muted)}
.price-context{margin-top:1.25rem;font-size:1rem;padding:1rem 1.15rem;background:var(--off);border-left:4px solid var(--lime)}
.price-includes{background:var(--off);border-top:4px solid #000;padding:2rem;margin-bottom:2rem}
.price-includes h3{font-size:1.35rem}
.price-includes .check-list{margin-top:1.5rem}
.price-includes .check-list li{font-weight:600}

.steps-section{background:var(--off)}
.step-list{list-style:none;margin:3rem 0 0;padding:0}
.step-list li{background:#fff;border-left:5px solid var(--lime);padding:1.75rem 2rem}
.step-list li+li{margin-top:1rem}
.step-num{display:block;font-family:var(--en);font-weight:900;font-size:.9375rem;letter-spacing:.08em;color:var(--muted);margin-bottom:.4rem}
.step-list h3{font-size:1.3rem}
.step-list p{margin-top:.9rem}

.faq-heading{max-width:1000px;margin:0 auto 2.5rem}
.apply-flow-block{margin-top:2.5rem;background:#000;color:#fff;padding:2rem}
.apply-flow-block h3{font-size:1.3rem}
.apply-flow{list-style:none;margin:1.5rem 0 0;padding:0}
.apply-flow li{display:flex;gap:1rem;align-items:flex-start;padding:.85rem 0}
.apply-flow li+li{border-top:1px solid #444}
.apply-num{flex:0 0 2.1rem;width:2.1rem;height:2.1rem;display:flex;align-items:center;justify-content:center;background:#fff;color:#000;font-weight:800;font-family:var(--en)}
.apply-body{min-width:0}
.apply-body b{font-weight:700;line-height:1.7}
.apply-now .apply-num{background:var(--lime)}
.apply-now em{display:inline-block;margin-left:.6rem;font-style:normal;font-size:.9375rem;font-weight:800;color:#000;background:var(--lime);padding:.1rem .5rem}
.apply-done .apply-num{background:var(--lime)}
.apply-done .apply-body b{color:var(--lime)}

@media(max-width:1000px){
.audience-grid{grid-template-columns:1fr;gap:2rem}
.usage-list{grid-template-columns:1fr}
}
@media(max-width:800px){
.flow-band{grid-template-columns:1fr;gap:.5rem}
.flow-arrow{transform:rotate(90deg);justify-self:center;font-size:1.25rem;margin:.15rem 0}
.scope-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
.hero-value{font-size:1.35rem}
.badge-list{gap:.5rem}
.badge-list li{padding:.4rem .7rem}
.more-uses,.usage-block,.price-includes,.apply-flow-block,.scope-card{padding:1.5rem}
.step-list li{padding:1.35rem 1.25rem}
.audience-not{padding:1.35rem}
.flow-step{padding:1rem}
.price-reason{padding-bottom:2.25rem;margin-bottom:2.5rem}
}
