/* Responsive typography: keep Japanese phrases intact without fixed page widths. */
.headline-line{display:block}
.phrase{display:inline-block;white-space:nowrap;font-weight:inherit}
h2,h3,h4{word-break:normal;overflow-wrap:normal;text-wrap:balance;line-break:strict}
p,li,.text-link{line-break:strict;text-wrap:pretty}
.intro-bottom-copy{min-width:0}
.intro-bottom-copy h3{line-height:1.75}
.feature-copy,.course-panel,.course-guide,.heading-aside{min-width:0}
.feature-copy h3 em{display:inline-block;white-space:nowrap}
.faq-question{flex:1;min-width:0;font-weight:inherit;text-wrap:balance}
.final-photo-cta>.container>p:not([class]){text-wrap:balance}
.reading-progress{position:fixed;inset:0 0 auto;height:3px;z-index:80;background:var(--blue);transform:scaleX(0);transform-origin:left;pointer-events:none}

/* Progressive enhancement: no content is hidden while waiting for the observer. */
.reveal{opacity:1;transform:none}
.motion-enabled .reveal.visible{animation:contentArrive .9s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .feature-photo.reveal.visible{animation:none;clip-path:none}
.motion-enabled .feature-photo.visible>img{animation:photoUncover 1.25s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .feature-photo.visible:before{animation:photoFrame .95s .12s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .feature-photo.visible .message-visual{animation:contentArrive .85s .35s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .about-photo.visible>img{animation:photoUncover 1.3s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .editorial-title.visible{animation:none}
.motion-enabled .editorial-title.visible h2>span{display:inline-block;animation:headingUncover .85s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .editorial-title.visible h2>span:last-child{animation-delay:.14s}
.motion-enabled .illustrated-path.visible .illustrated-step{animation:contentArrive .8s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .illustrated-path.visible .illustrated-step:nth-child(2){animation-delay:.14s}
.motion-enabled .illustrated-path.visible .illustrated-step:nth-child(3){animation-delay:.28s}
.motion-enabled .illustrated-path.visible .illustrated-step:nth-child(4){animation-delay:.42s}
.button .arrow,.text-link>span{transition:transform .25s ease}
@media(hover:hover){.button:hover .arrow,.text-link:hover>span{transform:translate(3px,-3px)}}
@keyframes contentArrive{from{opacity:.12;transform:translateY(36px)}to{opacity:1;transform:none}}
@keyframes photoUncover{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes photoFrame{from{opacity:0;transform:translate(-18px,-18px)}to{opacity:1;transform:none}}
@keyframes headingUncover{from{clip-path:inset(0 100% 0 0);transform:translateX(-18px)}to{clip-path:inset(0);transform:none}}

@media(max-width:1000px) and (min-width:801px){
  .editorial .desktop-nav{gap:12px}
  .editorial .site-header{gap:16px;padding-inline:24px}
  .editorial .header-cta{padding:14px;gap:12px;font-size:12px}
  .editorial .brand-logo{width:130px}
  .editorial .brand-logo img{left:-40px}
  .intro-bottom{gap:30px;padding-left:0;grid-template-columns:.85fr 1.15fr}
  .feature-row,.feature-support{gap:36px}
  .feature-copy h3{font-size:26px}
  .writing-feature,.mock-feature{padding-inline:24px}
}
@media(max-width:800px){
  html{scroll-padding-top:100px}
  .editorial .site-header{background:#fff}
  .mobile-nav:not([hidden]){top:92px;max-height:calc(100dvh - 92px);overflow-y:auto}
  .site-header.is-scrolled+.mobile-nav:not([hidden]){top:80px}
  .editorial-title{gap:12px;flex-wrap:wrap}
  .editorial-title>p{max-width:none;white-space:nowrap;flex-basis:100%;order:-1;text-align:left;margin:0 0 2px}
  .editorial-title h2{font-size:clamp(21px,5.6vw,29px);line-height:1.75}
  .editorial-title h2>span{display:inline-block;padding:6px 12px}
  .editorial .intro-bottom{margin-top:40px}
  .intro-bottom-copy h3{font-size:clamp(22px,5.7vw,27px)}
  .feature-photo{height:auto;aspect-ratio:1.12}
  .support-photo{aspect-ratio:1.2}
  .feature-copy h3{font-size:clamp(25px,7vw,32px)}
  .editorial .course-panel h3{font-size:clamp(20px,6vw,25px);line-height:1.8}
  .course-panel h3 .headline-line{white-space:nowrap}
  .editorial .course-panel{min-height:0}
  .course-panel-cta{margin-top:28px}
  .editorial .start-card h3{font-size:clamp(21px,5.8vw,25px);white-space:normal}
  .faq-heading{grid-template-columns:minmax(0,1fr) 90px;gap:0 8px}
  .faq-heading h2{font-size:clamp(20px,5.8vw,27px);letter-spacing:-.04em}
  .faq-guide-portrait{width:90px;height:145px}
  .editorial .button-large{gap:14px;padding-inline:18px;font-size:clamp(16px,4.5vw,18px)}
  .hero-cta-group{max-width:none}
  .hero-lead-v2{font-size:clamp(15px,4.4vw,18px)}
  .editorial .hero-editorial{min-height:0}
  .editorial .final-photo-cta h2{font-size:clamp(37px,11vw,54px)}
  .final-actions{max-width:100%}
  .mobile-sticky{padding-bottom:max(12px,env(safe-area-inset-bottom))}
}
@media(min-width:601px) and (max-width:800px){
  .editorial .container{width:calc(100% - 64px)}
  .hero-content-v2{padding-top:120px}
  .hero-photo-main{width:72%;top:330px;height:410px}
  .hero-heading-wrap{max-width:640px}
  .hero-bottom-v2{margin-top:350px;display:flex;gap:24px;align-items:center}
  .hero-cta-group{width:320px}
  .hero-lead-v2{font-size:16px;margin:0;flex:1}
  .editorial .hero-scroll{margin-top:36px}
  .feature-photo{aspect-ratio:1.5;max-width:620px}
  .about-photo{height:430px}
  .editorial .story-card{flex-basis:70%}
  .editorial .story-track,.editorial .course-tabs{margin-right:-32px;padding-right:32px}
  .start-grid{max-width:560px;margin-inline:auto}
}
@media(max-width:365px){
  .editorial .container{width:calc(100% - 32px)}
  .editorial .site-header{padding-inline:16px}
  .editorial .story-track,.editorial .course-tabs{margin-right:-16px;padding-right:16px}
  .hero-photo-main{top:284px;height:310px}
  .hero-bottom-v2{margin-top:280px}
  .hero-category{font-size:11px}
  .hero-line-large>span{font-size:8.9vw}
  .editorial .hero-english{font-size:10px}
  .feature-copy h3{font-size:25px}
  .course-guide{gap:12px}
  .course-guide img{width:90px;height:140px}
  .course-guide .heading-aside{max-width:none;flex:1}
  .writing-feature,.mock-feature{padding-inline:18px}
  .writing-lab h3{font-size:25px}
  .feedback-diagram{gap:3px}
  .feedback-diagram strong{width:68px;height:68px}
  .feedback-diagram small{font-size:11px;max-width:70px}
  .feedback-diagram>i{font-size:14px}
  .feature-no,.writing-lab .feature-no{font-size:11px;gap:10px;letter-spacing:.3px}
  .mini-journey{gap:6px;font-size:12px}
  .mini-journey>span{padding:7px 9px}
  .editorial .start-card{padding:22px}
  .start-visual{margin:-22px -22px 23px}
  .start-badge{font-size:11px}
  .editorial .trial-copy h2{font-size:26px}
  .trial-dialog{padding-inline:20px}
  .trial-dialog h2{font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal *{animation:none!important;transition:none!important}
  .feature-photo,.feature-photo>img,.about-photo>img{clip-path:none!important;opacity:1!important;transform:none!important}
}

/* The supplied crown and wordmark share a single proportional viewport. */
.editorial .brand-logo{width:155px;height:auto;aspect-ratio:44/19;overflow:visible;flex-shrink:0}.brand-logo svg{display:block;width:100%;height:100%;overflow:hidden}
@media(max-width:800px){.editorial .brand-logo{width:136px;height:auto}}

.editorial .site-header{background:#fff}
