/* Reference geometry: desktop 2880:1460, smartphone 780:1684.
   Editable HTML copy and original generated salon photograph. */
:root{--mbd-blue:#004567;--mbd-pink:#b92259;--mbd-sans:"Noto Sans JP",sans-serif}
html{scroll-padding-top:90px}
.hero-section{padding-top:72px;background:#eaf5f8}
.mbd-header{position:fixed;inset:0 0 auto;z-index:50;background:#fffffffa;border-bottom:1px solid #0045670f;color:var(--mbd-blue)}
.mbd-header-inner{max-width:1200px;margin:auto;padding:16px 32px;height:72px;display:flex;justify-content:space-between;align-items:center}
.mbd-brand{font-family:var(--mbd-sans);line-height:1.15;display:flex;flex-direction:column;gap:3px;letter-spacing:0}
.mbd-brand>span:first-child{font-size:28px;font-weight:700;letter-spacing:-.04em}
.mbd-brand small{font-size:12px;font-weight:500;letter-spacing:0;margin-left:3px}
.mbd-brand>span:last-child{font-size:8px;font-weight:400;letter-spacing:.06em}
.mbd-header-right{display:flex;gap:16px;align-items:center}
.mbd-header-cta{font:700 12px/1.3 var(--mbd-sans);background:var(--mbd-pink);color:white;padding:12px 24px;box-shadow:0 4px 20px #b9225930}
.mbd-menu{position:relative}
.mbd-menu summary{width:32px;height:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;list-style:none}
.mbd-menu summary::-webkit-details-marker{display:none}
.mbd-menu summary>span{display:block;width:22px;height:2px;background:var(--mbd-blue)}
.mbd-menu[open] summary>span:first-child{transform:translateY(8px) rotate(45deg)}
.mbd-menu[open] summary>span:nth-child(2){opacity:0}
.mbd-menu[open] summary>span:last-child{transform:translateY(-8px) rotate(-45deg)}
.mbd-menu nav{position:absolute;right:0;top:calc(100% + 15px);width:240px;padding:12px 22px;background:white;box-shadow:0 5px 24px #00456720;font:500 14px/1.8 var(--mbd-sans)}
.mbd-menu nav a{display:block;padding:12px 0;border-bottom:1px solid #e0edf2}
.mbd-menu nav a:last-child{border:0}
.mbd-board{width:100%;aspect-ratio:2880/1460;position:relative;isolation:isolate;container-type:inline-size;overflow:clip;color:var(--mbd-blue);font-family:"Shippori Mincho",serif;background:radial-gradient(ellipse at 20% 52%,#cee9eaaa,transparent 55%),radial-gradient(ellipse at 5% 12%,#d2ede69c,transparent 28%),linear-gradient(105deg,#f5fbfb,#e6f2fa 68%,#eff9fb)}
.mbd-board:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.55;background:radial-gradient(ellipse at 6% 80%,#fff 0,transparent 12%),radial-gradient(ellipse at 23% 4%,#fff 0,transparent 16%),radial-gradient(ellipse at 1% 50%,#d4e7da99 0,transparent 23%),linear-gradient(115deg,transparent 14%,#ffffff80 18%,transparent 28%,#ffffff5c 46%,transparent 54%);pointer-events:none}
.mbd-photo{position:absolute;right:0;top:0;width:44%;height:100%;z-index:-1;overflow:clip;mask-image:linear-gradient(90deg,transparent,#000 30%)}
.mbd-photo img{width:100%;height:100%;object-fit:cover;object-position:center top}
.mbd-sp{display:none}
.mbd-copy{position:absolute;left:9%;top:7.6%;width:80%;font-weight:600;letter-spacing:.025em}
.mbd-copy h1{font:700 2.95cqw/1.6 "Shippori Mincho",serif;letter-spacing:.035em;color:#9c2855;margin:0;text-shadow:0 1px 0 #fff}
.mbd-copy h1>span{white-space:nowrap;display:inline-block;background:linear-gradient(0deg,#efd7e1 0 .1em,#ffffffde .1em 100%);box-shadow:.16em 0 0 #ffffffde,-.16em 0 0 #ffffffde}
.mbd-copy h1>span+span{margin-left:.45em}
.mbd-subtitle{font:700 2.06cqw/1.6 "Shippori Mincho",serif;margin-top:.65cqw;letter-spacing:.015em}
.mbd-lead{font:600 1.05cqw/1.85 "Shippori Mincho",serif;width:45%;margin-top:.9cqw;letter-spacing:.01em}
.mbd-lead>span{display:inline}
.mbd-lead>span:nth-child(2):after{content:"";display:block}
.mbd-benefits{position:absolute;left:9%;top:39%;width:40%;display:grid;grid-template-columns:1fr 1fr;gap:2.3cqw 1.2cqw}
.mbd-benefits>div{position:relative;min-height:4.25cqw;background:#ffffffef;border-top:.15cqw solid var(--mbd-pink);border-bottom:.15cqw solid var(--mbd-pink);display:flex;align-items:center;justify-content:center;text-align:center}
.mbd-benefits p{font:700 1.13cqw/1.45 "Shippori Mincho",serif;letter-spacing:.025em;color:#182c42}
.mbd-benefits strong{font-weight:700;color:var(--mbd-pink)}
.mbd-crown{position:absolute;bottom:calc(100% + .6cqw);left:calc(50% - .8cqw);width:1.6cqw;height:1.1cqw;background:var(--mbd-pink);clip-path:polygon(0 18%,31% 45%,50% 0,69% 45%,100% 18%,85% 100%,15% 100%)}
/* Approved option B: a pale-rose offer, with the primary CTA below. */
.mbd-offer{position:absolute;top:66.85%;left:9%;width:40%;height:10.7%;background:#f8eef1;border:1px solid #e1c2ce;border-radius:4px;color:#8d4760;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:none}
.mbd-offer-label{display:flex;align-items:center;justify-content:center;gap:1cqw;font:600 .8cqw/1.4 "Shippori Mincho",serif;letter-spacing:.16em}
.mbd-offer-label:before,.mbd-offer-label:after{content:"";width:1.7cqw;height:1px;background:#c49aaa}
.mbd-offer p{font:500 1.18cqw/1.2 "Shippori Mincho",serif;letter-spacing:.045em;display:flex;align-items:baseline;justify-content:center;gap:.65cqw;margin:.3cqw 0 .2cqw}
.mbd-offer p strong{font-size:1.85cqw;line-height:1.15;font-weight:500}
.mbd-offer-detail{font:500 .82cqw/1.4 "Shippori Mincho",serif;letter-spacing:.02em}
.mbd-actions{position:absolute;left:9%;bottom:8%;width:40%;display:flex;gap:12px;align-items:flex-end}
.mbd-action{position:relative;display:block;flex:1;min-width:0;height:4.05cqw;text-align:center;color:white;font-family:"Shippori Mincho",serif;white-space:nowrap;transition:filter .2s}
.mbd-action:before{content:"";position:absolute;inset:.7cqw 0 0;border-radius:100px;background:var(--mbd-pink);box-shadow:0 0 22px #b9225930}
.mbd-action>span{position:absolute;left:25%;top:0;min-width:50%;height:1.4cqw;display:flex;align-items:center;justify-content:center;padding:0 .8cqw;border:1px solid #bd6484;border-radius:50px;background:white;color:var(--mbd-pink);font:600 .8cqw/1 "Shippori Mincho",serif;z-index:1}
.mbd-action>strong{position:absolute;left:0;right:0;top:.7cqw;bottom:0;display:flex;align-items:center;justify-content:center;font:600 1.08cqw/1.3 "Shippori Mincho",serif;letter-spacing:.015em}
.mbd-action-secondary:before{background:#3c8ec3;box-shadow:none}
.mbd-action-secondary>span{color:#2a7eac;border-color:#6aa4be}
.mbd-action:hover{filter:brightness(1.08)}
.mbd-fineprint{position:absolute;left:9%;bottom:2%;width:40%;text-align:center;font:500 .82cqw/1.5 "Shippori Mincho",serif;letter-spacing:.01em;color:#31566a}
@media(max-width:767px){
  html{scroll-padding-top:70px}
  .hero-section{padding-top:57px}
  .mbd-header-inner{height:56px;padding:12px 16px}
  .mbd-brand>span:first-child{font-size:23px}
  .mbd-brand small{font-size:10px}
  .mbd-brand>span:last-child{font-size:6.5px}
  .mbd-header-cta{display:none}
  .mbd-board{aspect-ratio:780/1684}
  .mbd-sp{display:block}
  .mbd-photo{right:-2%;top:1.5%;width:65%;height:57%;mask-image:linear-gradient(90deg,transparent,#000 31%),linear-gradient(180deg,transparent,#000 6%,#000 93%,transparent);mask-composite:intersect}
  .mbd-photo img{object-fit:cover;object-position:62% center}
  /* Keep the desktop reading order: copy, learning cards, offer, actions. */
  .mbd-benefits{left:4.2%;top:42.8%;width:91.6%;gap:7.7cqw 3.1cqw}
  .mbd-benefits>div{min-height:12.8cqw;border-width:.45cqw}
  .mbd-benefits p{font-size:3.45cqw;line-height:1.45}
  .mbd-crown{width:5.4cqw;height:3.9cqw;left:calc(50% - 2.7cqw);bottom:calc(100% + 1.65cqw)}
  .mbd-copy{top:3.6%;left:3.1%;width:93.8%}
  .mbd-copy h1{font-size:6.4cqw;line-height:1.6;letter-spacing:0}
  .mbd-copy h1>span{display:block}
  .mbd-copy h1>span+span{margin:0}
  .mbd-subtitle{font-size:5.05cqw;line-height:1.75;letter-spacing:0;margin-top:2.5cqw}
  .mbd-lead{font-size:3.05cqw;line-height:1.85;width:53.5%;margin-top:3.15cqw;letter-spacing:0}
  .mbd-lead>span{display:block;white-space:nowrap}
  .mbd-lead>span:nth-child(2):after{display:none}
  .mbd-offer{top:63.45%;left:3.1%;width:93.8%;height:9.1%;border-radius:4px}
  .mbd-offer-label{font-size:2.6cqw;gap:2.6cqw;line-height:1.5}
  .mbd-offer-label:before,.mbd-offer-label:after{width:5cqw}
  .mbd-offer p{font-size:4.1cqw;gap:1.5cqw;margin:.55cqw 0 .4cqw}
  .mbd-offer p strong{font-size:5.75cqw;line-height:1.15}
  .mbd-offer-detail{font-size:2.65cqw;line-height:1.5}
  .mbd-actions{top:76.7%;bottom:auto;left:8%;width:84%;flex-direction:column;gap:2.56cqw;align-items:stretch}
  .mbd-action{height:17.4cqw;flex:none}
  .mbd-action:before{inset:3.15cqw 0 0}
  .mbd-action>span{left:25%;min-width:50%;height:5.1cqw;padding:0 1cqw;font-size:3.0cqw}
  .mbd-action>strong{top:3.15cqw;font-size:4.15cqw;line-height:1.4}
  .mbd-fineprint{left:3.1%;bottom:1%;width:93.8%;font-size:2.3cqw;line-height:1.6}
}
@media(prefers-reduced-motion:reduce){.mbd-action{transition:none}}

/* Consultation CTA refinement and additional generated editorial photographs. */
.section-photo{max-width:820px;margin:0 auto 32px;overflow:hidden;border-radius:2px}
.section-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:380px;object-fit:cover;object-position:center 38%}
.reason-emphasis{text-align:center;color:#705565;font-weight:600;font-size:22px;line-height:1.85;margin-top:24px}
.reason-emphasis strong{font-weight:700}
.curriculum-photo{padding-top:45px}
.curriculum-photo .section-photo{margin-bottom:0}
.tuition-study-photo{margin-top:30px;margin-bottom:0;max-width:760px}
.tuition-study-photo img{aspect-ratio:2.5;max-height:260px;object-position:center 52%}
.consultation-photo{margin-top:30px}
.tuition-panel .tuition-value{padding-top:0;margin-top:12px;gap:10px}
.tuition-panel .tuition-value strong{font-size:clamp(62px,7.5vw,96px);font-weight:500;line-height:1.25;letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums}
.tuition-panel .tuition-value span{font-size:32px;line-height:1.25}
.tuition-cta-call{font-size:22px;margin-top:24px;margin-bottom:22px}
.tuition-cta-call:before,.tuition-cta-call:after{height:32px}
.cta-button{overflow:hidden;isolation:isolate;padding-block:24px;animation:consult-glow 3.8s ease-in-out infinite;transition:transform .22s,filter .22s}
.cta-button:after{content:"";position:absolute;top:-60%;left:-40%;width:30%;height:220%;background:linear-gradient(90deg,transparent,#ffffff80,transparent);transform:skewX(-22deg);pointer-events:none;animation:consult-shine 4.5s ease-in-out infinite;z-index:2}
.cta-button:hover,.cta-button:focus-visible{transform:translateY(-3px);filter:brightness(1.09);animation-play-state:paused}
.cta-button:active{transform:translateY(1px) scale(.985)}
.mbd-action{--cta-fill:var(--mbd-pink);transition:transform .22s,filter .22s}
.mbd-action-secondary{--cta-fill:#3c8ec3}
.mbd-action:before{background:linear-gradient(110deg,transparent 36%,#ffffff73 49%,transparent 62%) 150% 0 / 250% 100% no-repeat,var(--cta-fill);animation:fv-cta-shine 4.5s ease-in-out infinite}
.mbd-action-primary:before{animation:fv-cta-shine 4.5s ease-in-out infinite,fv-cta-glow 3.8s ease-in-out infinite}
.mbd-action:hover,.mbd-action:focus-visible{transform:translateY(-3px);filter:brightness(1.08)}
.mbd-action:active{transform:translateY(1px) scale(.985)}
.mbd-action-secondary>strong{font-size:1cqw}
@keyframes consult-shine{0%,48%{transform:translateX(0) skewX(-22deg);opacity:0}52%{opacity:1}78%,100%{transform:translateX(510%) skewX(-22deg);opacity:0}}
@keyframes consult-glow{0%,100%{box-shadow:2px 5px 7px #0004,inset 0 1px 4px #b7df90,0 0 0 0 #4f972c38}55%{box-shadow:2px 5px 9px #0003,inset 0 1px 4px #b7df90,0 0 0 9px #4f972c00}}
@keyframes fv-cta-shine{0%,45%{background-position:150% 0,0 0}80%,100%{background-position:-150% 0,0 0}}
@keyframes fv-cta-glow{0%,100%{box-shadow:0 0 18px #b9225933,0 0 0 0 #b9225930}55%{box-shadow:0 0 24px #b9225944,0 0 0 8px #b9225900}}
@media(max-width:767px){
  .section-photo{margin-bottom:24px}
  .section-photo img{aspect-ratio:4/3;max-height:280px}
  .reason-emphasis{font-size:17px;line-height:1.9;margin-top:20px}
  .curriculum-photo{padding-top:35px}
  .tuition-study-photo{margin-top:24px;margin-bottom:0}
  .tuition-study-photo img{aspect-ratio:1.8;object-position:center 42%}
  .consultation-photo{margin-top:24px}
  .tuition-panel .tuition-value strong{font-size:clamp(48px,15.2vw,64px)}
  .tuition-panel .tuition-value span{font-size:26px}
  .tuition-panel .tuition-value{padding-top:0;gap:7px}
  .cta-button{padding-top:20px;padding-bottom:21px}
  .cta-call,.compact .cta-call,.final-cta .cta-call,.tuition-cta-call{font-size:19px;gap:12px}
  .tuition-cta-call:before,.tuition-cta-call:after{height:30px}
  .mbd-action-secondary>strong{font-size:3.9cqw}
}
@media(max-width:359px){.cta-call,.compact .cta-call,.final-cta .cta-call,.tuition-cta-call{font-size:16px;gap:9px}}
@media(prefers-reduced-motion:reduce){.cta-button,.cta-button:after,.mbd-action:before,.mbd-action-primary:before{animation:none!important}.cta-button,.mbd-action{transition:none!important}.cta-button:hover,.mbd-action:hover{transform:none}}

/* A curved white transition and a separate frame for the next scene. */
.hero-section{position:relative}
.hero-section:after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:clamp(20px,3vw,44px);background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0;z-index:1;pointer-events:none}
.hero-section+.problem-section{padding-top:clamp(44px,5vw,72px);background:#fff}
.problem-section .question-banner{border:1px solid #e0eaf0;border-radius:18px;background:linear-gradient(110deg,#fff,#f5f9fb);box-shadow:0 10px 28px #00456709}
@media(max-width:767px){.hero-section:after{height:24px}.hero-section+.problem-section{padding-top:32px}.problem-section .question-banner{border-radius:14px;box-shadow:0 6px 18px #00456708}}

/* Preserve the existing brand. Motion explains the sequence of each chapter. */
main .jp-phrase,footer .jp-phrase,.dialog-inner .jp-phrase{display:inline-block;white-space:nowrap;word-break:keep-all;overflow-wrap:normal;vertical-align:baseline;text-indent:0;font:inherit;letter-spacing:inherit}
main :is(p,h2,h3,h4,li,dt,dd,summary),footer p{line-break:strict;overflow-wrap:normal;word-break:normal}
.body-copy,.teacher-letter p,.reason>p{text-wrap:pretty}
.faq-list summary>.faq-question{display:block;flex:1;min-width:0;font:inherit;color:inherit;line-height:inherit}
.profile-facts strong>.fact-particle{display:inline;font-size:.55em;line-height:inherit;margin-left:.12em;white-space:nowrap}
.motion-armed{opacity:0;animation-duration:.7s;animation-delay:var(--entry-delay,0ms);animation-timing-function:cubic-bezier(.16,1,.3,1);animation-fill-mode:both}
.motion-armed.is-revealed{animation-name:chapter-rise}
.motion-armed[data-motion=hero-copy].is-revealed{animation-name:hero-copy-in;animation-duration:.85s}
.motion-armed[data-motion=hero-photo].is-revealed{animation-name:photo-curtain;animation-duration:1s}
.motion-armed[data-motion=hero-tag].is-revealed{animation-name:tag-in;animation-duration:.5s}
.motion-armed[data-motion=soft-zoom].is-revealed{animation-name:soft-zoom-in;animation-duration:.8s}
.motion-armed[data-motion=slide-left].is-revealed{animation-name:chapter-left;animation-duration:.55s}
.motion-armed[data-motion=slide-right].is-revealed{animation-name:chapter-right;animation-duration:.55s}
.motion-armed[data-motion=picture-rise].is-revealed{animation-name:picture-rise-in;animation-duration:.85s}
.motion-armed[data-motion=card-rise].is-revealed{animation-name:card-in;animation-duration:.75s}
.motion-armed[data-motion=curtain].is-revealed{animation-name:photo-curtain;animation-duration:.85s}
.motion-armed[data-motion=tile].is-revealed{animation-name:tile-in;animation-duration:.65s}
.motion-armed[data-motion=focus].is-revealed{animation-name:focus-in;animation-duration:.8s}
.motion-armed[data-motion=fact].is-revealed{animation-name:fact-in;animation-duration:.65s}
.motion-armed[data-motion=letter].is-revealed{animation-name:letter-in;animation-duration:.8s}
.motion-armed[data-motion=quote].is-revealed{animation-name:quote-in;animation-duration:.8s}
.motion-armed[data-motion=panel].is-revealed{animation-name:panel-in;animation-duration:.75s}
.motion-armed[data-motion=number].is-revealed{animation-name:number-in;animation-duration:.7s}
.motion-armed[data-motion=round-reveal].is-revealed{animation-name:round-in;animation-duration:.8s}
.motion-armed[data-motion=conversation].is-revealed{animation-name:conversation-in;animation-duration:.8s}
.motion-armed[data-motion=table].is-revealed{animation-name:table-in;animation-duration:.6s}
.motion-armed[data-motion=flow-step].is-revealed{animation-name:flow-in;animation-duration:.65s}
.motion-armed[data-motion=closing].is-revealed{animation-name:closing-in;animation-duration:.75s}
.faq-list details[open]>div{animation:faq-answer-in .32s ease-out both}
@keyframes chapter-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes hero-copy-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes photo-curtain{from{opacity:.2;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes tag-in{from{opacity:0;transform:translateY(9px) scale(.96)}to{opacity:1;transform:none}}
@keyframes soft-zoom-in{from{opacity:0;transform:scale(.965)}to{opacity:1;transform:none}}
@keyframes chapter-left{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
@keyframes chapter-right{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
@keyframes picture-rise-in{from{opacity:0;clip-path:inset(18% 0 0);transform:translateY(14px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes card-in{from{opacity:0;transform:translateY(26px) scale(.985)}to{opacity:1;transform:none}}
@keyframes tile-in{from{opacity:0;transform:perspective(800px) rotateX(7deg) translateY(14px)}to{opacity:1;transform:none}}
@keyframes focus-in{from{opacity:0;filter:blur(3px);transform:scale(1.015)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes fact-in{from{opacity:0;transform:perspective(800px) rotateY(12deg)}to{opacity:1;transform:none}}
@keyframes letter-in{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes quote-in{from{opacity:0;transform:scale(.95) rotate(-.35deg)}to{opacity:1;transform:none}}
@keyframes panel-in{from{opacity:0;clip-path:inset(0 5% 0 5% round 12px)}to{opacity:1;clip-path:inset(0)}}
@keyframes number-in{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:none}}
@keyframes round-in{from{opacity:0;clip-path:inset(12% 0 round 40px)}to{opacity:1;clip-path:inset(0 round 2px)}}
@keyframes conversation-in{from{opacity:0;transform:translateY(8px) scale(1.015)}to{opacity:1;transform:none}}
@keyframes table-in{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes flow-in{from{opacity:0;transform:translateX(-10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes closing-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes faq-answer-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@supports(animation-timeline:scroll()){
  .mbd-header:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,#5291b1,#b92259);transform-origin:left;animation:reading-progress linear both;animation-timeline:scroll(root block)}
  @keyframes reading-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
}
@media(prefers-reduced-motion:reduce){.motion-armed{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;animation:none!important}.mbd-header:after{display:none}.faq-list details[open]>div{animation:none}}

/* Center the supporting explanation and emphasize the consultation callout. */
.barrier-group p{text-align:center;text-wrap:pretty}
.cta-call,.compact .cta-call,.final-cta .cta-call,.tuition-cta-call{color:#b92259}
.cta-call:before,.cta-call:after{background:currentColor}
