:root {
  color-scheme: light;
  --navy: #142747;
  --navy-2: #263f62;
  --red: #d52e28;
  --red-dark: #ae211d;
  --sky: #eaf6ff;
  --sky-2: #d8efff;
  --pink: #fde8ec;
  --pink-2: #f7cdd5;
  --cream: #fff2d9;
  --yellow: #ffd64a;
  --ink: #172b4a;
  --muted: #53647d;
  --white: #fff;
  --line: #d9e4ef;
  --shadow: 0 15px 34px rgba(28, 54, 86, .12);
  --font: "Nunito", "Trebuchet MS", Arial, sans-serif;
  font-family: var(--font);
  color: var(--ink);
  background: #f5f9fd;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
  scroll-padding-top: 98px;
}

*, *::before, *::after { box-sizing: border-box; }
body { width: 100%; min-width: 320px; max-width: 100vw; margin: 0; overflow-x: clip; background: #f5f9fd; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a, input, select, summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
[hidden] { display: none !important; }
.page-width { width: min(1240px, calc(100% - 48px)); margin-inline: auto; }
.svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.skip-link { position: fixed; z-index: 100; top: 10px; left: 10px; padding: 10px 14px; color: white; background: var(--navy); border-radius: 10px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; z-index: 20; top: 0; padding: 8px 0; background: linear-gradient(#f5f9fd 78%, rgba(245,249,253,0)); }
.header-inner { display: flex; align-items: center; justify-content: space-between; width: min(1320px, calc(100% - 38px)); min-height: 66px; margin: auto; padding: 0 22px; background: rgba(255,255,255,.97); border: 1px solid #e0eaf3; border-radius: 22px; box-shadow: 0 7px 22px rgba(33,57,87,.1); }
.brand { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; width: 205px; }
.brand-mascot { width: 75px; height: 50px; object-fit: contain; filter: url(#remove-logo-black); }
.brand-type { display: flex; flex-direction: column; color: var(--navy); line-height: .9; }
.brand-type strong { font-size: 23px; font-weight: 1000; letter-spacing: -.045em; }
.brand-type small { margin-top: 4px; color: var(--red); font-size: 13px; font-weight: 1000; letter-spacing: -.02em; }
.primary-nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 29px); color: var(--navy); font-size: 13px; font-weight: 850; }
.primary-nav > a:not(.nav-cta) { position: relative; padding: 11px 0; white-space: nowrap; }
.primary-nav > a:not(.nav-cta)::after { position: absolute; right: 0; bottom: 3px; left: 0; height: 2px; background: var(--red); border-radius: 2px; content: ""; transform: scaleX(0); transform-origin: left; transition: transform .18s ease; }
.primary-nav > a:not(.nav-cta):hover::after, .primary-nav > a.is-current::after { transform: scaleX(1); }
.nav-cta { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 18px; color: #fff; background: var(--red); border-radius: 999px; box-shadow: 0 4px 10px rgba(213,46,40,.2); white-space: nowrap; transition: transform .18s, background .18s; }
.nav-cta:hover, .button-primary:hover { background: var(--red-dark); transform: translateY(-2px); }
.menu-toggle { display: none; }

.hero { position: relative; display: grid; min-height: 530px; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 12px; margin-top: 4px; overflow: hidden; background: linear-gradient(112deg, #e8f6ff 0%, #f2faff 50%, #ffeef1 100%); border: 1px solid #dce9f5; border-radius: 30px; box-shadow: var(--shadow); }
.hero-copy { position: relative; z-index: 4; padding: 54px 0 52px clamp(34px, 5.2vw, 70px); }
.hero-kicker, .section-kicker { display: inline-flex; align-items: center; gap: 9px; color: var(--navy-2); font-size: 12px; font-weight: 900; letter-spacing: .045em; }
.kicker-dot { width: 9px; height: 9px; background: var(--red); border-radius: 50%; box-shadow: 0 0 0 4px #f9dce0; }
.hero h1 { margin: 20px 0 16px; color: var(--navy); font-size: clamp(54px, 6.1vw, 82px); font-weight: 1000; line-height: .93; letter-spacing: -.055em; }
.title-japanese { color: var(--red); }
.title-spark { display: inline-block; margin-left: 7px; color: var(--yellow); font-size: .56em; vertical-align: top; transform: rotate(12deg); }
.hero-description { max-width: 405px; margin: 0 0 24px; color: #213a5e; font-size: 18px; font-weight: 700; line-height: 1.55; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 23px; border: 0; border-radius: 999px; font-size: 15px; font-weight: 950; cursor: pointer; transition: transform .18s, background .18s, box-shadow .18s; }
.button-primary { color: #fff; background: var(--red); box-shadow: 0 6px 12px rgba(213,46,40,.2); }
.hero-note { display: flex; align-items: center; gap: 9px; margin-top: 22px; color: var(--navy-2); font-size: 12px; font-weight: 800; }
.hero-note-icon { display: grid; width: 22px; height: 22px; place-items: center; color: var(--red); background: #fff; border: 1px solid #f4c8ce; border-radius: 50%; font-size: 14px; }
.hero-art { position: relative; align-self: stretch; min-height: 490px; overflow: hidden; }
.hero-art::before { position: absolute; z-index: 0; right: 2%; bottom: -20%; width: 89%; height: 82%; background: linear-gradient(150deg, #d6efff, #fff0d9); border: 1px solid rgba(63,107,147,.12); border-radius: 50% 50% 8% 8% / 42% 42% 8% 8%; content: ""; }
.hero-art::after { position: absolute; z-index: 0; right: 0; bottom: 0; left: 0; height: 18%; background: linear-gradient(0deg, rgba(255,255,255,.96), rgba(255,255,255,0)); content: ""; }
.window-grid { position: absolute; z-index: 1; top: 0; right: 0; width: 25%; height: 70%; opacity: .78; background: linear-gradient(90deg, transparent 47%, #d38d70 48% 53%, transparent 54%), linear-gradient(0deg, transparent 47%, #d38d70 48% 53%, transparent 54%); background-size: 50% 50%; border-left: 10px solid #e4a17c; border-bottom: 10px solid #e4a17c; }
.teacher-illustration { position: absolute; z-index: 2; right: -2%; bottom: -2%; width: 100%; height: 100%; object-fit: contain; object-position: right bottom; }
.hero-daruma { position: absolute; z-index: 3; bottom: 8%; left: 3%; width: clamp(108px, 15vw, 177px); height: clamp(108px, 15vw, 177px); object-fit: contain; filter: url(#remove-logo-black) drop-shadow(0 9px 7px rgba(20,39,71,.16)); }
.sakura { position: absolute; z-index: 4; color: #ff9aa8; font-size: 46px; line-height: 1; text-shadow: 0 3px 0 rgba(255,255,255,.55); }
.sakura-one { top: 8%; left: 4%; transform: rotate(-13deg); }
.sakura-two { top: 20%; left: 20%; font-size: 25px; transform: rotate(18deg); }
.sakura-three { top: 10%; right: 33%; font-size: 20px; transform: rotate(37deg); }
.sunburst { position: absolute; z-index: 3; top: 18%; left: 36%; color: #ffbb0e; font-size: 62px; transform: rotate(-10deg); }
.hero-art-caption { position: absolute; z-index: 5; right: 5%; bottom: 5%; padding: 10px 15px; color: var(--navy); background: #fff; border: 1px solid #e5edf5; border-radius: 15px; box-shadow: 0 5px 16px rgba(20,39,71,.12); font-size: 12px; font-weight: 950; }
.hero-art-caption span { color: var(--red); }

.feature-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 14px; padding: 16px 10px; background: #fff; border: 1px solid #e4ebf2; border-radius: 22px; box-shadow: 0 8px 23px rgba(30,54,83,.06); }
.feature-item { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 74px; color: var(--navy); font-size: 14px; font-weight: 900; line-height: 1.25; text-align: center; }
.feature-item + .feature-item { border-left: 1px solid #edcbd1; }
.feature-icon { display: grid; width: 51px; height: 51px; flex: 0 0 auto; place-items: center; border-radius: 16px; }
.feature-icon svg { width: 35px; height: 35px; fill: none; stroke: var(--navy); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.4; }
.icon-blue { background: #e2f4ff; }.icon-pink { background: #fde9ed; }.icon-cream { background: #fff3d8; }.icon-yellow { background: #fff5cb; }

.goals-banner { position: relative; display: grid; min-height: 176px; grid-template-columns: .78fr .48fr 1.34fr; align-items: center; gap: 10px; margin-top: 20px; padding: 20px 28px; overflow: hidden; background: linear-gradient(100deg, #fff3da, #ffefd3 72%, #fff5e3); border: 1px solid #ffebc5; border-radius: 24px; }
.goals-title { position: relative; z-index: 2; padding-left: 15px; }
.goals-title .section-kicker { font-size: 10px; color: #7b5925; text-transform: uppercase; }
.goals-title h2 { position: relative; width: fit-content; margin: 8px 0 0; color: var(--navy); font-size: clamp(31px, 3.7vw, 45px); font-weight: 1000; line-height: .98; letter-spacing: -.04em; }
.red-swoosh { position: absolute; right: 12%; bottom: -10px; width: 70px; height: 9px; border-top: 4px solid var(--red); border-radius: 50%; transform: rotate(-7deg); }
.goals-daruma { position: relative; z-index: 2; align-self: end; justify-self: center; width: min(100%, 200px); max-height: 160px; object-fit: contain; object-position: center bottom; }
.goals-list { position: relative; z-index: 2; display: grid; gap: 7px; margin: 0; padding: 13px 17px; list-style: none; background: rgba(255,255,255,.87); border: 2px solid #7192b1; border-radius: 15px; box-shadow: 0 5px 12px rgba(47,77,108,.1); color: var(--navy); font-size: 14px; font-weight: 850; }
.goals-list li { display: flex; align-items: flex-start; gap: 9px; }
.goals-list li > span:first-child { display: grid; width: 20px; height: 20px; flex: 0 0 auto; place-items: center; color: var(--red); background: #ffe5e5; border-radius: 50%; font-weight: 1000; }

.courses-section { padding: 82px 0 70px; }
.section-heading { margin-bottom: 27px; }
.centered-heading { text-align: center; }
.section-kicker { color: var(--red); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.section-heading h2, .about-copy h2, .faq-heading h2, .contact-intro h2 { margin: 8px 0 7px; color: var(--navy); font-size: clamp(34px, 4vw, 48px); font-weight: 1000; line-height: 1.08; letter-spacing: -.045em; }
.section-heading p { margin: 0; color: var(--muted); font-size: 15px; font-weight: 700; }
.course-carousel { position: relative; }
.course-grid { display: grid; grid-auto-columns: calc((100% - 32px) / 3); grid-auto-flow: column; gap: 16px; overflow-x: auto; padding: 10px 3px 20px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.course-grid::-webkit-scrollbar, .testimonial-track::-webkit-scrollbar { display: none; }
.plan-card { min-width: 0; overflow: hidden; background: #fff; border: 1px solid #e2e9f1; border-radius: 21px; box-shadow: 0 8px 22px rgba(34,61,91,.09); scroll-snap-align: start; }
.plan-art { position: relative; display: grid; height: 157px; place-items: center; overflow: hidden; background: linear-gradient(145deg, #dff3ff, #f4faff); }
.plan-card:nth-child(3n + 2) .plan-art { background: linear-gradient(145deg, #ffe6eb, #fff4f5); }
.plan-card:nth-child(3n) .plan-art { background: linear-gradient(145deg, #fff0cb, #fff8e7); }
.plan-art::before { position: absolute; width: 126px; height: 126px; border: 1px solid rgba(20,39,71,.13); border-radius: 50%; box-shadow: 0 0 0 15px rgba(20,39,71,.03), 0 0 0 30px rgba(20,39,71,.025); content: ""; }
.plan-art img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.plan-tag { position: absolute; z-index: 2; top: 11px; left: 12px; padding: 5px 10px; color: var(--navy); background: rgba(255,255,255,.88); border-radius: 999px; font-size: 10px; font-weight: 950; }
.plan-body { padding: 17px 18px 18px; }
.plan-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; }
.plan-title-row h3 { margin: 0 0 11px; color: var(--navy); font-size: 19px; font-weight: 1000; line-height: 1.1; }
.plan-title-icon { display: grid; width: 33px; height: 33px; flex: 0 0 auto; place-items: center; color: var(--navy); background: #e8f6ff; border-radius: 10px; }
.plan-title-icon svg, .plan-detail svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.plan-details { display: grid; gap: 6px; min-height: 52px; color: #334967; font-size: 12px; font-weight: 800; }
.plan-detail { display: flex; align-items: center; gap: 7px; }
.plan-detail svg { width: 16px; height: 16px; color: var(--red); }
.plan-description { min-height: 42px; margin: 10px 0 12px; color: var(--muted); font-size: 12px; font-weight: 650; line-height: 1.45; }
.plan-price-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 9px 12px; background: #fff0f1; border-radius: 999px; }
.plan-price { color: var(--red-dark); font-size: 16px; font-weight: 1000; line-height: 1.1; }
.plan-price-note { color: #6c5260; font-size: 10px; font-weight: 850; text-align: right; }
.plan-cta { display: flex; width: 100%; align-items: center; justify-content: center; gap: 7px; margin-top: 12px; padding: 0; color: var(--red); background: transparent; border: 0; font-size: 13px; font-weight: 1000; cursor: pointer; }
.plan-cta:hover { color: var(--red-dark); }
.carousel-controls { display: flex; align-items: center; justify-content: center; gap: 13px; margin: 3px 0 0; }
.carousel-control, .testimonial-control { display: grid; width: 38px; height: 38px; place-items: center; color: var(--navy); background: #fff; border: 1px solid #d8e3ed; border-radius: 50%; box-shadow: 0 3px 9px rgba(20,39,71,.07); font-size: 19px; cursor: pointer; }
.carousel-control:disabled { opacity: .4; cursor: default; }
.carousel-hint { min-width: 100px; color: var(--muted); font-size: 11px; font-weight: 850; text-align: center; }
.all-plans-link { display: flex; width: fit-content; margin: 18px auto 0; }

.about-section { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(32px, 6vw, 82px); padding: 40px clamp(24px, 6vw, 75px); background: #fff; border: 1px solid #e2eaf2; border-radius: 27px; box-shadow: var(--shadow); }
.about-art { position: relative; min-height: 360px; overflow: hidden; background: linear-gradient(140deg, #ffe7eb, #e4f4ff 75%); border-radius: 48% 48% 24px 24px; }
.about-art img { position: absolute; right: -11%; bottom: -10%; width: 122%; height: 112%; object-fit: contain; object-position: center bottom; }
.about-orbit { position: absolute; top: 20px; left: 20px; width: 110px; height: 110px; border: 1px solid rgba(20,39,71,.15); border-radius: 50%; box-shadow: 0 0 0 14px rgba(255,255,255,.16); }
.about-sakura { top: 25px; right: 25px; font-size: 41px; }
.about-sticker { position: absolute; z-index: 2; right: 15px; bottom: 15px; padding: 10px 15px; color: var(--navy); background: #fff; border-radius: 13px; box-shadow: 0 5px 15px rgba(20,39,71,.12); font-size: 12px; font-weight: 950; }
.about-copy h2 { max-width: 530px; margin-bottom: 15px; font-size: clamp(33px, 4vw, 48px); }
.about-copy p { color: #455b75; font-size: 15px; font-weight: 650; line-height: 1.75; }
.about-copy .button { margin-top: 10px; }

.resources-section { padding: 78px 0; }
.resource-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; }
.resource-card { min-height: 218px; padding: 23px; background: #fff; border: 1px solid #e2eaf2; border-radius: 21px; box-shadow: 0 8px 20px rgba(34,61,91,.065); }
.resource-blue { background: linear-gradient(155deg, #e5f5ff, #fff); }.resource-pink { background: linear-gradient(155deg, #ffedf0, #fff); }.resource-cream { background: linear-gradient(155deg, #fff4db, #fff); }
.resource-icon { display: grid; width: 61px; height: 61px; place-items: center; color: var(--red); background: rgba(255,255,255,.86); border: 1px solid rgba(213,46,40,.18); border-radius: 16px; }
.resource-icon svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.resource-card h3 { margin: 16px 0 5px; color: var(--navy); font-size: 18px; font-weight: 1000; }
.resource-card p { max-width: 300px; margin: 0; color: #52657c; font-size: 13px; font-weight: 700; line-height: 1.55; }

.testimonials-section { padding: 48px 0 68px; border-top: 1px solid #e5edf4; }
.testimonial-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.testimonial-heading h2 { max-width: 560px; margin-bottom: 0; font-size: 36px; }
.testimonial-controls { display: flex; gap: 8px; }
.testimonials-viewport { overflow: hidden; }
.testimonial-track { display: flex; gap: 15px; overflow-x: auto; padding: 8px 2px 18px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.testimonial-card { display: flex; min-width: calc((100% - 30px) / 3); min-height: 220px; flex-direction: column; padding: 21px; background: #fff; border: 1px solid #e3eaf1; border-radius: 19px; box-shadow: 0 6px 17px rgba(20,39,71,.06); scroll-snap-align: start; }
.testimonial-stars { color: #e9ad20; font-size: 17px; letter-spacing: .11em; }
.testimonial-card blockquote { flex: 1; margin: 12px 0 15px; color: #3d506a; font-size: 13px; font-weight: 700; line-height: 1.6; }
.testimonial-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--navy); font-size: 12px; }
.testimonial-card footer span, .testimonial-source { color: #76869a; font-size: 10px; font-weight: 750; }
.testimonial-source { margin: 4px 0 0; text-align: right; }

.faq-section { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(35px, 7vw, 95px); padding: 55px clamp(25px, 6vw, 75px); background: #fff; border: 1px solid #e4ebf2; border-radius: 27px; box-shadow: 0 9px 24px rgba(34,61,91,.06); }
.faq-heading h2 { font-size: clamp(32px, 3.8vw, 43px); }
.faq-heading p { max-width: 320px; margin: 12px 0 18px; color: var(--muted); font-size: 14px; font-weight: 700; line-height: 1.6; }
.text-link { color: var(--red); font-size: 13px; font-weight: 950; }
.faq-list { display: grid; align-content: start; }
.faq-item { border-bottom: 1px solid #e0e8ef; }
.faq-item:first-child { border-top: 1px solid #e0e8ef; }
.faq-item summary { position: relative; display: flex; min-height: 57px; align-items: center; justify-content: space-between; gap: 15px; color: var(--navy); font-size: 14px; font-weight: 900; list-style: none; cursor: pointer; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-plus { position: relative; width: 23px; height: 23px; flex: 0 0 auto; background: #fde8ec; border-radius: 50%; }
.faq-plus::before, .faq-plus::after { position: absolute; top: 11px; left: 6px; width: 11px; height: 2px; background: var(--red); border-radius: 2px; content: ""; }
.faq-plus::after { transform: rotate(90deg); transition: transform .15s ease; }
.faq-item[open] .faq-plus::after { transform: rotate(0); }
.faq-item p { margin: -2px 32px 17px 0; color: #52657b; font-size: 13px; font-weight: 650; line-height: 1.6; }

.contact-section { display: grid; grid-template-columns: 1fr .9fr; gap: 30px; margin-top: 48px; margin-bottom: 40px; padding: 36px; overflow: hidden; background: linear-gradient(110deg, #eaf6ff, #fff0f2); border: 1px solid #dce8f1; border-radius: 27px; }
.contact-intro { position: relative; min-height: 310px; padding: 20px 20px 25px; overflow: hidden; }
.contact-intro h2 { position: relative; z-index: 1; max-width: 450px; font-size: clamp(36px, 4vw, 52px); }
.contact-intro p { position: relative; z-index: 1; max-width: 430px; color: #455b75; font-size: 15px; font-weight: 700; line-height: 1.65; }
.contact-email { position: relative; z-index: 1; display: inline-block; margin-top: 7px; color: var(--red-dark); font-size: 13px; font-weight: 900; }
.contact-intro > img { position: absolute; right: -15px; bottom: -45px; width: 190px; height: 190px; object-fit: contain; filter: url(#remove-logo-black); opacity: .92; }
.contact-form { display: grid; gap: 9px; align-content: center; padding: 24px; background: #fff; border: 1px solid rgba(20,39,71,.08); border-radius: 20px; box-shadow: 0 8px 20px rgba(34,61,91,.08); }
.contact-form label { margin-top: 5px; color: var(--navy); font-size: 12px; font-weight: 900; }
.contact-form input, .contact-form select { width: 100%; min-height: 43px; padding: 0 13px; color: var(--navy); background: #fbfdff; border: 1px solid #d9e4ed; border-radius: 10px; font-size: 13px; }
.contact-form input::placeholder { color: #8c9aae; }
.form-submit { width: 100%; margin-top: 9px; }
.form-status { min-height: 0; margin: 0; color: var(--red); font-size: 12px; font-weight: 800; }
.form-disclaimer { margin: 0; color: #77879a; font-size: 10px; line-height: 1.4; }
.site-footer { background: #fff; border-top: 1px solid #e2eaf1; }
.footer-inner { display: grid; min-height: 100px; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px 25px; padding-block: 16px; }
.footer-brand { width: 165px; }.footer-brand .brand-mascot { width: 58px; height: 39px; }
.footer-inner > p { margin: 0; color: #53647d; font-size: 11px; font-weight: 800; }
.footer-links { display: flex; flex-wrap: wrap; gap: 18px; color: var(--navy); font-size: 11px; font-weight: 850; }
.footer-links a:hover { color: var(--red); }
.footer-copy { grid-column: 1 / -1; justify-self: end; color: #8492a1; font-size: 10px; }

@media (max-width: 990px) {
  .brand { width: 190px; }
  .header-inner { padding-inline: 15px; }
  .primary-nav { gap: 14px; font-size: 12px; }
  .hero { min-height: 470px; grid-template-columns: .95fr 1.05fr; }
  .hero-art { min-height: 450px; }
  .hero h1 { font-size: clamp(52px, 7vw, 70px); }
  .feature-item { gap: 8px; font-size: 12px; }
  .feature-icon { width: 44px; height: 44px; }
  .feature-icon svg { width: 30px; height: 30px; }
  .goals-banner { grid-template-columns: .8fr .4fr 1.4fr; padding-inline: 20px; }
  .goals-list { font-size: 12px; }
}

@media (max-width: 760px) {
  :root { scroll-padding-top: 78px; }
  .page-width { width: calc(100vw - 40px); max-width: 580px; }
  .site-header { padding: 6px 0; }
  .header-inner { position: relative; width: calc(100vw - 20px); max-width: 580px; min-height: 58px; padding: 0 11px; border-radius: 17px; }
  .brand { width: 158px; gap: 6px; }
  .brand-mascot { width: 61px; height: 40px; }
  .brand-type strong { font-size: 19px; }
  .brand-type small { font-size: 11px; }
  .menu-toggle { position: absolute; top: 9px; right: 10px; display: flex !important; width: 40px; height: 40px; flex: 0 0 40px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; margin-left: auto; background: #fde8ec; border: 0; border-radius: 50%; }
  .menu-toggle svg { display: block; width: 22px; height: 22px; fill: none; stroke: var(--navy); stroke-linecap: round; stroke-width: 2.4; }
  .primary-nav { position: absolute; top: 62px; right: 10px; left: 10px; display: none; align-items: stretch; gap: 0; padding: 10px 16px 18px; background: #fff; border: 1px solid #e1eaf2; border-radius: 0 0 18px 18px; box-shadow: 0 12px 25px rgba(20,39,71,.12); }
  .primary-nav.is-open { display: flex; flex-direction: column; }
  .primary-nav > a:not(.nav-cta) { padding: 12px 4px; border-bottom: 1px solid #edf1f5; }
  .primary-nav > a:not(.nav-cta)::after { display: none; }
  .nav-cta { justify-content: center; margin-top: 12px; }
  .hero { display: flex; min-height: 0; flex-direction: column; align-items: stretch; gap: 0; margin-top: 2px; border-radius: 24px; }
  .hero-copy { min-width: 0; padding: 28px 22px 3px; }
  .hero-kicker { font-size: 10px; }
  .hero h1 { margin: 15px 0 12px; font-size: clamp(38px, 11.8vw, 54px); }
  .hero-description { max-width: 360px; font-size: 15px; }
  .button { min-height: 45px; padding-inline: 19px; font-size: 13px; }
  .hero-note { margin-top: 14px; font-size: 11px; }
  .hero-art { min-height: 310px; margin-top: 2px; }
  .hero-art::before { right: 0; width: 94%; height: 88%; }
  .window-grid { width: 24%; height: 64%; }
  .teacher-illustration { right: 4%; width: 86%; height: 100%; }
  .hero-daruma { bottom: 7%; left: 1%; width: 112px; height: 112px; }
  .sakura { font-size: 34px; }
  .sunburst { top: 14%; left: 28%; font-size: 45px; }
  .hero-art-caption { right: 4%; bottom: 4%; padding: 8px 11px; font-size: 10px; }
  .feature-strip { grid-template-columns: repeat(2, 1fr); margin-top: 10px; padding: 5px; border-radius: 18px; }
  .feature-item { min-height: 71px; gap: 8px; font-size: 11px; }
  .feature-item:nth-child(3) { border-left: 0; }
  .feature-item:nth-child(n + 3) { border-top: 1px solid #edcbd1; }
  .feature-icon { width: 39px; height: 39px; border-radius: 12px; }
  .feature-icon svg { width: 27px; height: 27px; }
  .goals-banner { width: calc(100vw - 40px); min-width: 0; min-height: 0; grid-template-columns: minmax(0, 1fr) 100px; gap: 4px; margin-top: 13px; padding: 18px 14px; border-radius: 19px; }
  .goals-banner > * { min-width: 0; }
  .goals-title { padding-left: 4px; }
  .goals-title .section-kicker { font-size: 8px; }
  .goals-title h2 { font-size: clamp(27px, 8vw, 38px); }
  .goals-daruma { width: 100%; max-height: 100px; }
  .goals-list { grid-column: 1 / -1; gap: 6px; padding: 11px; font-size: 11px; }
  .goals-list li > span:first-child { width: 18px; height: 18px; }
  .courses-section { padding: 56px 0 46px; }
  .section-heading { margin-bottom: 18px; }
  .section-kicker { font-size: 9px; }
  .section-heading h2, .about-copy h2, .faq-heading h2, .contact-intro h2 { font-size: clamp(31px, 9vw, 42px); }
  .section-heading p { font-size: 13px; }
  .course-grid { grid-auto-columns: min(82%, 340px); gap: 12px; margin-right: -14px; padding-right: 14px; }
  .plan-art { height: 145px; }
  .plan-body { padding: 14px; }
  .plan-title-row h3 { font-size: 17px; }
  .plan-description { min-height: auto; }
  .carousel-controls { margin-top: 4px; }
  .carousel-control, .testimonial-control { width: 35px; height: 35px; }
  .about-section { grid-template-columns: 1fr; gap: 24px; padding: 17px; border-radius: 22px; }
  .about-art { min-height: 270px; }
  .about-art img { right: -8%; width: 116%; }
  .about-copy { padding: 0 5px 8px; }
  .about-copy h2 { margin-top: 7px; }
  .about-copy p { font-size: 13px; }
  .resources-section { padding: 55px 0; }
  .resource-grid { grid-template-columns: 1fr; gap: 10px; }
  .resource-card { display: grid; min-height: 0; grid-template-columns: 55px 1fr; column-gap: 13px; padding: 15px; border-radius: 17px; }
  .resource-icon { width: 52px; height: 52px; grid-row: span 2; border-radius: 13px; }
  .resource-icon svg { width: 36px; height: 36px; }
  .resource-card h3 { align-self: end; margin: 0 0 3px; font-size: 15px; }
  .resource-card p { align-self: start; font-size: 11px; }
  .testimonials-section { padding: 37px 0 46px; }
  .testimonial-heading { align-items: center; }
  .testimonial-heading h2 { max-width: 280px; font-size: 27px; }
  .testimonial-controls { display: none; }
  .testimonial-card { min-width: 82%; min-height: 200px; padding: 17px; }
  .testimonial-source { text-align: left; }
  .faq-section { grid-template-columns: 1fr; gap: 16px; padding: 27px 20px; border-radius: 21px; }
  .faq-heading p { margin: 9px 0 12px; font-size: 12px; }
  .faq-item summary { min-height: 53px; font-size: 12px; }
  .faq-item p { font-size: 11px; }
  .contact-section { grid-template-columns: 1fr; gap: 12px; margin-block: 27px; padding: 14px; border-radius: 22px; }
  .contact-intro { min-height: 224px; padding: 15px 8px 18px; }
  .contact-intro p { max-width: 300px; font-size: 13px; }
  .contact-intro > img { right: -20px; bottom: -50px; width: 145px; height: 145px; }
  .contact-form { padding: 17px; }
  .footer-inner { grid-template-columns: 1fr auto; gap: 9px; padding-block: 16px; }
  .footer-brand { width: 155px; }
  .footer-inner > p { grid-column: 1 / -1; grid-row: 2; }
  .footer-links { grid-column: 1 / -1; gap: 12px; grid-row: 3; font-size: 10px; }
  .footer-copy { grid-column: 1 / -1; justify-self: start; grid-row: 4; }
}

@media (max-width: 390px) {
  .hero-copy { padding-inline: 17px; }
  .hero h1 { font-size: 47px; }
  .hero-art { min-height: 276px; }
  .hero-daruma { width: 93px; height: 93px; }
  .feature-item { gap: 5px; font-size: 10px; }
  .feature-icon { width: 35px; height: 35px; }
  .goals-title h2 { font-size: 28px; }
  .goals-list { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (max-width: 760px) {
  .page-width { width: min(100% - 32px, 580px); }
  .header-inner { width: min(100% - 20px, 580px); }
  .menu-toggle { z-index: 3; }
  .feature-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); width: min(100% - 32px, 580px); padding: 8px 4px; }
  .feature-item { min-width: 0; min-height: 76px; flex-direction: column; gap: 4px; padding: 3px 1px; font-size: 9px; line-height: 1.15; }
  .feature-item + .feature-item { border-left: 1px solid #edcbd1; }
  .feature-item:nth-child(n + 3) { border-top: 0; }
  .feature-icon { width: 37px; height: 37px; border-radius: 12px; }
  .feature-icon svg { width: 25px; height: 25px; }
  .goals-banner { width: min(100% - 32px, 580px); grid-template-columns: minmax(0, 1fr) 82px; gap: 2px; padding: 16px 12px; }
  .goals-title h2 { max-width: 100%; font-size: clamp(25px, 7.2vw, 32px); }
  .goals-daruma { width: 82px; max-height: 86px; }
  .goals-list { width: 100%; min-width: 0; font-size: 10px; }
  .course-grid { grid-auto-columns: min(80%, 340px); }
}
@media (max-width: 390px) {
  .feature-item { font-size: 8px; }
  .feature-icon { width: 33px; height: 33px; }
  .goals-banner { grid-template-columns: minmax(0, 1fr) 70px; }
  .goals-daruma { width: 70px; }
}

@media (max-width: 760px) {
  .page-width { width: calc(100vw - 32px) !important; max-width: 580px; }
  .header-inner { width: calc(100vw - 20px) !important; max-width: 580px; }
  .menu-toggle { display: block !important; position: absolute !important; top: 9px; right: 10px; z-index: 5; width: 40px; height: 40px; padding: 0; }
  .menu-toggle svg { display: none !important; }
  .menu-toggle::before { position: absolute; top: 13px; left: 11px; width: 18px; height: 2px; background: var(--navy); border-radius: 2px; box-shadow: 0 6px 0 var(--navy), 0 12px 0 var(--navy); content: ""; }
  .goals-banner { position: relative; width: calc(100vw - 32px) !important; grid-template-columns: minmax(0, 1fr); padding-right: 12px; }
  .goals-title { max-width: calc(100% - 72px); }
  .goals-title h2 { font-size: clamp(26px, 7.4vw, 34px); }
  .goals-daruma { position: absolute; top: 20px; right: 12px; width: 72px; height: 78px; }
  .goals-list { grid-column: 1; }
  .feature-strip { width: calc(100vw - 32px) !important; }
}

/* User supplied brand assets and aligned header width */
.header-inner { width: min(1240px, calc(100% - 48px)); }
.brand { width: 205px; }
.brand-logo { display: block; width: 195px; height: 62px; object-fit: contain; }
.hero-art::before, .hero-art::after { content: none; }
.hero-art .window-grid, .hero-art .sakura, .hero-art .sunburst, .hero-art-caption { display: none; }
.teacher-illustration { right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.about-art img { object-fit: cover; object-position: center; }
@media (max-width: 760px) {
  .header-inner { width: calc(100vw - 32px) !important; }
  .brand { width: auto; max-width: calc(100% - 56px); }
  .brand-logo { width: min(160px, 100%); height: 51px; }
  .hero-art::before, .hero-art::after { content: none; }
  .teacher-illustration { right: 0; width: 100%; }
  .hero-art .window-grid, .hero-art .sakura, .hero-art .sunburst, .hero-art-caption { display: none; }
  .about-art img { right: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
}

/* Full-width hero artwork behind the copy */
.hero { display: block; isolation: isolate; background: #eaf6ff; }
.hero-copy { width: min(52%, 640px); }
.hero-art { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; min-height: 0; overflow: hidden; }
.teacher-illustration { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-art::before { display: none; }
.hero-art::after { position: absolute; z-index: 1; inset: 0; height: auto; background: linear-gradient(90deg, rgba(234,246,255,.99) 0%, rgba(234,246,255,.96) 31%, rgba(234,246,255,.78) 45%, rgba(234,246,255,.2) 67%, rgba(234,246,255,.02) 100%); content: ""; }
@media (max-width: 760px) {
  .hero { display: block; min-height: 0; }
  .hero-copy { width: 100%; padding: 28px 22px 205px; }
  .hero-art { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; }
  .teacher-illustration { position: absolute; inset: auto 0 0; width: 100%; height: auto; object-fit: contain; object-position: center bottom; }
  .hero-art::after { background: linear-gradient(180deg, rgba(234,246,255,.98) 0%, rgba(234,246,255,.95) 51%, rgba(234,246,255,.68) 64%, rgba(234,246,255,.02) 84%, transparent 100%); }
}
@media (max-width: 390px) {
  .hero-copy { padding-bottom: 190px; }
}

/* Keep the image behind the entire hero while preserving a readable text area */
.hero-art { z-index: 0; }
.hero-copy { z-index: 2; }
.teacher-illustration { top: 0; right: 0; bottom: 0; left: auto; width: 92%; height: 100%; object-fit: cover; object-position: center; }
.hero-art::after { z-index: 1; background: linear-gradient(90deg, rgba(234,246,255,.99) 0%, rgba(234,246,255,.97) 29%, rgba(234,246,255,.88) 42%, rgba(234,246,255,.62) 53%, rgba(234,246,255,.15) 70%, rgba(234,246,255,.02) 100%); }
@media (max-width: 760px) {
  .hero-copy { padding-bottom: 220px; }
  .teacher-illustration { top: auto; right: 0; bottom: 0; left: 0; width: 100%; height: auto; object-fit: contain; object-position: center bottom; }
  .hero-art::after { background: linear-gradient(180deg, rgba(234,246,255,.98) 0%, rgba(234,246,255,.97) 48%, rgba(234,246,255,.87) 61%, rgba(234,246,255,.35) 75%, rgba(234,246,255,0) 94%); }
}
@media (max-width: 390px) {
  .hero-copy { padding-bottom: 220px; }
}

.hero-art .teacher-illustration { z-index: 0; right: 0; left: 0; width: 100%; }
.hero-art::after { z-index: 1; }
.hero-art::after { background: linear-gradient(90deg, rgba(234,246,255,.96) 0%, rgba(234,246,255,.92) 30%, rgba(234,246,255,.75) 40%, rgba(234,246,255,.45) 50%, rgba(234,246,255,.06) 63%, rgba(234,246,255,0) 100%); }

.about-art img { right: 0; bottom: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
@media (max-width: 760px) { .about-art img { right: 0; bottom: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; } }

/* Flat page surfaces and a full-width, footer-aligned header */
.site-header { width: 100%; padding: 0; background: #fff; border-bottom: 1px solid #e2eaf1; }
.header-inner { width: min(1240px, calc(100% - 48px)); min-height: 78px; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.site-footer { background: transparent; border-top: 1px solid #e2eaf1; }
.footer-inner { width: min(1240px, calc(100% - 48px)); }
.hero, .feature-strip, .goals-banner, .goals-list, .plan-card, .plan-art::before, .carousel-control, .testimonial-control, .about-section, .about-orbit, .about-sticker, .resource-card, .testimonial-card, .faq-section, .contact-section, .contact-form { box-shadow: none !important; }
.feature-strip { background: transparent; border-color: #e2eaf1; }
.about-section, .faq-section { background: transparent; border: 0; }
.contact-section { border: 0; }
@media (max-width: 760px) {
  .site-header { padding: 0; }
  .header-inner { width: calc(100vw - 32px) !important; min-height: 66px; padding: 0 11px; }
  .menu-toggle { top: 9px; }
  .footer-inner { width: calc(100vw - 32px); }
}

/* Centered page color field aligned with the header and footer content */
body { position: relative; isolation: isolate; min-height: 100vh; background: #f5f9fd; }
body::before { position: absolute; z-index: -1; inset: 0 auto 0 50%; width: min(1240px, calc(100% - 48px)); background: #fff; content: ""; transform: translateX(-50%); }
.site-header { background: transparent; border-bottom: 0; }
.site-footer { background: transparent; }
@media (max-width: 760px) {
  body::before { width: calc(100vw - 32px); }
}

/* Independent header and footer surfaces, matching the centered page backdrop */
.site-header { background-color: #fff; border-bottom: 1px solid #e2eaf1; }
.site-footer { background-color: #fff; border-top: 1px solid #e2eaf1; }

/* Square section surfaces and a soft shadow around the centered page panel */
body::before { box-shadow: 0 12px 32px rgba(20,39,71,.14); }
.hero, .feature-strip, .goals-banner, .goals-list, .plan-card, .about-section, .about-art, .resource-card, .testimonial-card, .faq-section, .contact-section, .contact-form { border-radius: 0 !important; }

/* Give section content consistent breathing room from the page edges */
.feature-strip { padding-inline: 28px; }
.goals-banner { padding-inline: 36px; }
.courses-section, .resources-section, .testimonials-section { padding-inline: clamp(20px, 2.5vw, 32px); }
.footer-inner { padding-inline: 24px; }
@media (max-width: 760px) {
  .feature-strip { padding-inline: 14px; }
  .goals-banner { padding-inline: 16px; }
  .courses-section, .resources-section, .testimonials-section { padding-inline: 16px; }
  .footer-inner { padding-inline: 12px; }
}

/* Bring the mobile hero illustration up alongside the headline */
@media (max-width: 760px) {
  .teacher-illustration {
    right: 0;
    bottom: 0;
    left: auto;
    width: min(120%, 420px);
    height: auto;
    transform: translateY(-44px);
  }
}

/* Keep the mobile hero compact when its illustration is hidden */
@media (max-width: 760px) {
  .hero-art { display: none; }
  .hero-copy { padding-bottom: 28px; }
}

/* Show the About portrait as a transparent cutout */
.about-art { background: transparent; }
.about-art .about-orbit, .about-art .about-sakura, .about-art .about-sticker { display: none; }

/* Testimonial carousel pagination */
.testimonials-viewport { position: relative; }
.carousel-pagination { display: flex; width: 100%; align-items: center; justify-content: center; gap: 9px; margin: 13px auto 4px; }
.carousel-pagination[hidden] { display: none !important; }
[data-carousel-navigation-block] { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 13px 0 4px; }
[data-carousel-navigation-block] .carousel-pagination { margin: 0; }
[data-carousel-navigation-block] .carousel-dot { width: var(--nav-dot-size, 9px); height: var(--nav-dot-size, 9px); background: var(--nav-dot-color, #cbd7e3); }
[data-carousel-navigation-block][data-active-dot-shape="circle"] .carousel-dot[aria-current="true"] { width: var(--nav-dot-size, 9px); border-radius: 50%; background: var(--nav-dot-active-color, var(--red)); }
[data-carousel-navigation-block][data-active-dot-shape="pill"] .carousel-dot[aria-current="true"] { width: var(--nav-dot-active-width, 24px); border-radius: 99px; background: var(--nav-dot-active-color, var(--red)); }
[data-dots-align="left"] .carousel-pagination { justify-content: flex-start; }
[data-dots-align="center"] .carousel-pagination { justify-content: center; }
[data-dots-align="right"] .carousel-pagination { justify-content: flex-end; }
.carousel-dot { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #cbd7e3; cursor: pointer; transition: width 160ms ease, background-color 160ms ease; }
.carousel-dot[aria-current="true"] { width: 24px; border-radius: 99px; background: var(--red); }
.carousel-dot:focus-visible { outline: 3px solid color-mix(in srgb, var(--red) 35%, transparent); outline-offset: 3px; }
.testimonial-pagination { margin: 13px auto 4px; }
#testimonios[data-dots-position="top"] .testimonial-pagination { margin: 0 auto 13px; }
#testimonios[data-dots-position="left"] .testimonial-pagination,
#testimonios[data-dots-position="right"] .testimonial-pagination { position: absolute; z-index: 2; top: 50%; flex-direction: column; margin: 0; transform: translateY(-50%); }
#testimonios[data-dots-position="left"] .testimonial-pagination { left: 8px; }
#testimonios[data-dots-position="right"] .testimonial-pagination { right: 8px; }
#testimonios[data-dots-position="left"] .testimonial-pagination,
#testimonios[data-dots-position="right"] .testimonial-pagination,
.course-carousel[data-dots-position="left"] .course-pagination,
.course-carousel[data-dots-position="right"] .course-pagination,
.has-builder-carousel[data-dots-position="left"] .builder-carousel-pagination,
.has-builder-carousel[data-dots-position="right"] .builder-carousel-pagination { width: auto; }
#testimonios[data-dots-position="left"] .testimonial-track { padding-left: 32px; }
#testimonios[data-dots-position="right"] .testimonial-track { padding-right: 32px; }
.course-carousel[data-dots-position="left"], .course-carousel[data-dots-position="right"], .has-builder-carousel { position: relative; }
.course-carousel[data-dots-position="left"] .course-grid { padding-left: 32px; }
.course-carousel[data-dots-position="right"] .course-grid { padding-right: 32px; }
.course-carousel[data-dots-position="left"] .course-pagination,
.course-carousel[data-dots-position="right"] .course-pagination,
.has-builder-carousel[data-dots-position="left"] .builder-carousel-pagination,
.has-builder-carousel[data-dots-position="right"] .builder-carousel-pagination { position: absolute; z-index: 2; top: 50%; flex-direction: column; margin: 0; transform: translateY(-50%); }
.course-carousel[data-dots-position="left"] .course-pagination, .has-builder-carousel[data-dots-position="left"] .builder-carousel-pagination { left: 6px; }
.course-carousel[data-dots-position="right"] .course-pagination, .has-builder-carousel[data-dots-position="right"] .builder-carousel-pagination { right: 6px; }
.course-carousel[data-dots-position="top"] .course-pagination { margin: 0 auto 10px; }
.builder-carousel-track { display: flex !important; overflow-x: auto; gap: 16px; padding: 8px 2px 14px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.builder-carousel-track::-webkit-scrollbar { display: none; }
.builder-gallery.builder-carousel-track > img { flex: 0 0 min(82%, 320px); width: auto; aspect-ratio: 4 / 3; object-fit: cover; scroll-snap-align: start; }
.builder-columns.builder-carousel-track > .builder-column, .builder-carousel-track > .builder-card, .builder-carousel-track > .builder-testimonial { flex: 0 0 min(82%, 360px); min-width: min(82%, 360px); scroll-snap-align: start; }
.has-builder-carousel[data-dots-position="left"] .builder-carousel-track { padding-left: 30px; }
.has-builder-carousel[data-dots-position="right"] .builder-carousel-track { padding-right: 30px; }

/* Teaching approach, progress tracking and booking steps */
.teaching-section { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr); gap: clamp(26px, 4vw, 54px); align-items: center; margin-top: 30px; padding: 30px clamp(8px, 2vw, 24px); background: #fff; }
.teaching-intro { padding-right: clamp(22px, 3vw, 42px); border-right: 1px solid #d6dce5; }
.teaching-intro .section-kicker, .booking-heading .section-kicker { text-transform: uppercase; font-size: 11px; }
.teaching-intro h2, .booking-heading h2 { margin: 13px 0 12px; color: var(--navy); font-size: clamp(29px, 3.4vw, 43px); font-weight: 1000; line-height: 1.02; letter-spacing: -.04em; }
.teaching-intro h2 em, .booking-heading h2 em { color: var(--red); font-style: normal; }
.teaching-intro > p { margin: 0 0 20px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.button-outline { min-height: 42px; padding-inline: 18px; color: var(--red); background: #fff; border: 1.5px solid var(--red); }
.button-outline:hover { color: #fff; background: var(--red); }
.teaching-points { display: grid; gap: 13px; }
.teaching-point { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 16px; align-items: center; }
.teaching-icon { display: grid; width: 72px; height: 72px; place-items: center; background: #fde9ed; border-radius: 50%; }
.teaching-icon svg { width: 51px; height: 51px; fill: none; stroke: var(--navy); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.teaching-icon .accent-stroke, .followup-icon .accent-stroke, .booking-icon .accent-stroke { stroke: var(--red); }
.teaching-point h3 { margin: 0 0 4px; color: var(--navy); font-size: 16px; font-weight: 950; line-height: 1.25; }
.teaching-point p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.followup-section { position: relative; isolation: isolate; margin-top: 23.8px; padding: 56.1px clamp(20.4px, 3.4vw, 45.9px) 49.3px; overflow: hidden; color: #fff; background: transparent; }
.followup-section::before { position: absolute; z-index: -1; inset: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 620' preserveAspectRatio='none'%3E%3Cpath fill='%23fde4e9' d='M0 52C100 16 140 75 242 46 340 17 408 3 500 24c105 24 150 54 256 28 102-25 164-42 244-15v29c-80-29-142-10-244 16-106 26-151-5-256-28-92-21-160-7-258 22C140 105 100 46 0 81Z'/%3E%3Cpath fill='%23263f62' d='M0 81c100-35 140 24 242-5 98-29 166-43 258-22 105 23 150 54 256 28 102-26 164-45 244-16v526c-80-26-142-16-244 7-106 23-151 5-256-15-92-20-160-7-258 8-102 22-142-23-242 2Z'/%3E%3Cpath fill='%23fde4e9' d='M0 594c100-35 140 24 242-2 98-21 166-28 258-8 105 15 150 30 256 15 102-23 164-33 244-7v28H0Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; content: ""; }
.followup-section::after { display: none; }
.followup-inner { max-width: 952px; margin-inline: auto; text-align: center; }
.followup-kicker { position: relative; top: 7px; display: inline-flex; padding: 9px 26px; color: var(--red); background: #ffe2e8; border: 3px solid #263f62; border-radius: 99px; font-size: clamp(13.5px, 1.35vw, 17.5px); font-weight: 1000; letter-spacing: .025em; text-transform: uppercase; }
.followup-inner > h2 { margin: 11.9px 0 6.8px; color: #fff; font-size: clamp(28.9px, 3.4vw, 39.1px); font-weight: 1000; line-height: 1.08; }
.followup-inner > h2 em { color: #ffc0ca; font-style: normal; }
.followup-lead { margin: 0 auto 25.5px; color: #f4f6fb; font-size: clamp(12.75px, 1.275vw, 16.15px); }
.followup-steps { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(17px, 2.295vw, 28.9px); text-align: left; }
.followup-card { position: relative; z-index: 1; min-height: 248px; padding: 21.25px 22.1px 22.1px; color: var(--navy); background: #fffaf2; border-radius: 45% 43% 41% 46% / 35% 37% 40% 42%; }
.followup-card:not(:last-child)::after { position: absolute; z-index: 3; top: 53%; right: -35.7px; width: 56.1px; height: 45.9px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 66 54'%3E%3Cpath d='M8 43 57 10' fill='none' stroke='white' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='43' r='8' fill='%23e7292f' stroke='white' stroke-width='4'/%3E%3Ccircle cx='57' cy='10' r='8' fill='%23e7292f' stroke='white' stroke-width='4'/%3E%3C/svg%3E") center / contain no-repeat; content: ""; pointer-events: none; }
.followup-number { position: absolute; z-index: 2; top: 9px; left: 10px; display: grid; width: 58px; height: 58px; place-items: center; color: #fff; background: var(--red); border: 4px solid #fff; border-radius: 50%; font-size: 22px; font-weight: 1000; }
.followup-icon { display: block; width: 61.2px; height: 61.2px; margin: 5.1px auto 6.8px; fill: none; stroke: var(--navy); stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; background-size: contain; background-repeat: no-repeat; background-position: center; }
.followup-card:nth-child(1) .followup-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='13' y='13' width='38' height='45' rx='4' fill='white' stroke='%23142747' stroke-width='3'/%3E%3Cpath d='M23 8h18v12H23z' fill='%23ffd642' stroke='%23142747' stroke-width='3'/%3E%3Cpath d='m20 31 4 4 7-8m-11 17 4 4 7-8m7-10h11m-11 14h11' fill='none' stroke='%23e7292f' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M37 31h10M37 45h10' stroke='%239baabe' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.followup-card:nth-child(2) .followup-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M7 17c9-5 17-4 25 2v37c-8-6-16-7-25-2zM57 17c-9-5-17-4-25 2v37c8-6 16-7 25-2z' fill='white' stroke='%23142747' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M14 28h11m-11 8h11m14-8h11m-11 8h11m-25-24h18' stroke='%239bd2f2' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='m40 25 16-17 5 5-16 17-7 2z' fill='%23ffa4b5' stroke='%23142747' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.followup-card:nth-child(3) .followup-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M8 55h49M14 51V38h11v13' fill='%23ffd642' stroke='%23142747' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M30 51V29h11v22' fill='%239bd2f2' stroke='%23142747' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M46 51V20h11v31' fill='%23ffa4b5' stroke='%23142747' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='m12 24 14-7 12 3 16-12m-8 0h8v8' fill='none' stroke='%23e7292f' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.followup-icon > * { visibility: hidden; }
.followup-card h3 { margin: 0 0 10.2px; color: var(--navy); font-size: clamp(15.3px, 1.4875vw, 19.55px); font-weight: 1000; text-align: center; }
.followup-card ul { display: grid; gap: 5.95px; margin: 0; padding: 0 10.2px 0 28.9px; list-style: none; }
.followup-card li { position: relative; padding-left: 18.7px; color: #142747; font-size: clamp(11.05px, .9775vw, 13.6px); line-height: 1.32; }
.followup-card li::before { position: absolute; left: 0; color: var(--red); font-size: 17px; font-weight: 1000; line-height: 1; content: "✓"; }
.booking-section { margin-top: 30px; padding: 25px clamp(8px, 2vw, 24px) 34px; background: #fff; }
.booking-heading { display: grid; grid-template-columns: minmax(260px, .75fr) minmax(0, 1.25fr); gap: 28px; align-items: center; margin-bottom: 27px; }
.booking-heading h2 { max-width: 360px; margin: 7px 0 0; }
.booking-heading > p { max-width: 610px; margin: 0; padding-left: 24px; color: var(--muted); border-left: 1px solid #8aa0bd; font-size: 14px; line-height: 1.5; }
.booking-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 17px; }
.booking-step { position: relative; min-width: 0; text-align: center; }
.booking-step:not(:last-child)::after { position: absolute; top: 43px; left: calc(50% + 48px); width: calc(100% - 76px); border-top: 2px dashed #f04b52; content: ""; }
.booking-number { position: absolute; z-index: 1; top: 4px; left: calc(50% - 44px); display: grid; width: 27px; height: 27px; place-items: center; color: #fff; background: var(--navy); border-radius: 50%; font-size: 11px; font-weight: 1000; }
.booking-icon { display: grid; width: 78px; height: 78px; margin: 8px auto 10px; place-items: center; background: #fde9ed; border-radius: 50%; }
.booking-icon svg { width: 54px; height: 54px; fill: none; stroke: var(--navy); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.booking-icon .accent-fill { fill: #fff; stroke: var(--red); }
.booking-step h3 { max-width: 180px; margin: 0 auto 6px; color: var(--navy); font-size: 14px; font-weight: 1000; line-height: 1.22; }
.booking-step p { max-width: 190px; margin: 0 auto; color: var(--muted); font-size: 11px; line-height: 1.4; }
@media (max-width: 900px) {
  .teaching-section { grid-template-columns: minmax(210px, .7fr) minmax(0, 1.3fr); gap: 24px; }
  .followup-section { padding-inline: 17px; }
  .followup-card { padding-inline: 13.6px; border-radius: 28.9px; }
  .booking-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 26px; }
  .booking-step:nth-child(3)::after { display: none; }
}
@media (max-width: 620px) {
  .teaching-section { grid-template-columns: 1fr; gap: 20px; margin-top: 20px; padding: 22px 14px; }
  .teaching-intro { padding: 0 0 18px; border-right: 0; border-bottom: 1px solid #d6dce5; }
  .teaching-intro h2 { max-width: 360px; font-size: 35px; }
  .teaching-intro > p { max-width: 420px; }
  .teaching-points { gap: 15px; }
  .teaching-point { grid-template-columns: 60px minmax(0, 1fr); gap: 12px; }
  .teaching-icon { width: 58px; height: 58px; }
  .teaching-icon svg { width: 42px; height: 42px; }
  .teaching-point h3 { font-size: 14px; }
  .teaching-point p { font-size: 12px; }
  .followup-section { width: calc(100% - 24px); padding: 25.5px 12.75px; }
  .followup-inner > h2 { font-size: 22.95px; }
  .followup-lead { max-width: 280.5px; font-size: 10.2px; line-height: 1.45; }
  .followup-steps { grid-template-columns: 1fr; gap: 11.05px; }
  .followup-card { min-height: 0; padding: 14.45px 18.7px; border-radius: 25.5px; }
  .followup-card::after { display: none; }
  .followup-card ul { max-width: 246.5px; margin-inline: auto; }
  .booking-section { margin-top: 20px; padding: 22px 12px; }
  .booking-heading { grid-template-columns: 1fr; gap: 12px; margin-bottom: 22px; }
  .booking-heading h2 { max-width: 320px; font-size: 34px; }
  .booking-heading > p { padding: 0; border: 0; font-size: 13px; }
  .booking-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 13px; }
  .booking-step:nth-child(3)::after { display: block; }
  .booking-step:nth-child(even)::after, .booking-step:last-child::after { display: none; }
  .booking-step:not(:last-child)::after { top: 36px; left: calc(50% + 39px); width: calc(100% - 61px); }
  .booking-icon { width: 66px; height: 66px; margin-block: 8px 9px; }
  .booking-icon svg { width: 46px; height: 46px; }
  .booking-number { left: calc(50% - 38px); width: 24px; height: 24px; font-size: 10px; }
  .booking-step h3 { font-size: 13px; }
  .booking-step p { font-size: 10px; }
}

/* Full-width footer with the broad, soft wave from the visual reference. */
.site-footer { width: min(1240px, calc(100% - 48px)); margin: 0 auto; overflow: hidden; color: var(--navy); background: transparent; border: 0; }
.site-footer .footer-inner.page-width { position: relative; isolation: isolate; display: grid; width: 100%; max-width: none; min-height: 395px; grid-template-columns: 1.05fr 1.05fr 1.45fr .95fr; grid-template-rows: 1fr auto; align-items: start; gap: 19.125px 20.4px; padding: 94px clamp(17.85px, 2.741vw, 61.2px) 56.1px; }
.footer-inner::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(120deg, #ffe4eb 0%, #fbd9e5 52%, #ffe3eb 100%);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 620' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 148 C72 170 120 192 200 185 C315 175 376 135 470 116 C560 98 620 124 704 150 C790 177 852 183 914 162 C951 150 978 139 1000 130 L1000 620 L0 620 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 620' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 148 C72 170 120 192 200 185 C315 175 376 135 470 116 C560 98 620 124 704 150 C790 177 852 183 914 162 C951 150 978 139 1000 130 L1000 620 L0 620 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  content: "";
}
.footer-column { min-width: 0; min-height: 135.5px; align-self: start; transform: translateY(20px); }
.footer-social-column { transform: translateY(41px); }
.footer-social-column, .footer-study-column { border-right: 1px solid rgba(23, 43, 73, .18); }
.footer-column h2 { margin: 0 0 14.62px; color: var(--navy); font-size: clamp(13px, .9754vw, 17.34px); font-weight: 950; line-height: 1.16; white-space: nowrap; }
.site-footer .footer-legal-column h2 { margin-bottom: 14.62px; }
.footer-legal-column [data-rich-field="reference-layout-field-159"] { display: none; }
.footer-social-column h2 { margin-bottom: 28.18px; }
.footer-socials { display: flex; align-items: center; gap: clamp(6.5px, .8398vw, 18.96px); }
.footer-socials a { display: grid; width: clamp(30.35px, 2.4114vw, 52.02px); height: clamp(30.35px, 2.1946vw, 47.69px); place-items: center; color: #fff; background: #e7192b; border: 0; border-radius: 13px; transition: transform .16s ease, background-color .16s ease; }
.footer-socials a:hover, .footer-socials a:focus-visible { color: #fff; background: #c81022; transform: translateY(-2px); }
.footer-socials a:focus-visible, .footer-text-links a:focus-visible { outline: 1.7px solid var(--navy); outline-offset: 2.55px; }
.footer-socials svg { width: 58%; height: 58%; fill: currentColor; }
.footer-socials svg rect, .footer-socials svg circle:not(.social-icon-dot) { fill: none; stroke: currentColor; stroke-width: 2.3; }
.footer-socials svg .social-icon-dot { fill: currentColor; }
.footer-text-links { display: grid; justify-items: start; gap: 6.5px; }
.footer-text-links a { color: var(--navy); font-size: clamp(9.75px, .7586vw, 15.17px); font-weight: 650; line-height: 1.28; text-decoration: none; }
.footer-text-links a:hover { color: #d8202d; text-decoration: underline; }
.footer-legal-column { align-self: start; }
.footer-mountain {
  width: min(100%, 230px);
  aspect-ratio: 2.5;
  max-height: 97.75px;
  justify-self: center;
  align-self: center;
  transform: translateY(20px);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 120'%3E%3Cpath fill='%23287dbb' d='M24 104 128 24C138 14 150 10 163 12c14-3 25 2 35 13l98 79Z'/%3E%3Cpath fill='white' d='M83 65 128 24C138 14 150 10 163 12c14-3 25 2 35 13l54 40-30-13-17 8-16-20-16 20-14-17-16 20-17-17-20 19Z'/%3E%3Cpath fill='white' d='M24 104c18-27 50-31 76-15 17 10 29 18 48 15H24Zm151 0c19 3 32-5 49-15 26-15 57-10 72 15h-121Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.footer-mountain path { display: none; }
.footer-copy { grid-column: 1 / 4; grid-row: 2; justify-self: start !important; align-self: end; margin: 0; color: #172b49; font-size: 0; line-height: 1.35; visibility: hidden; }
.footer-copy::before { content: "© 2026 Japonés con sentido. Todos los derechos reservados."; font-size: clamp(10.285px, .867vw, 18.424px); visibility: visible; }
.footer-socials[hidden] { display: flex !important; }
@media (max-width: 760px) {
  .site-footer { width: calc(100vw - 32px) !important; }
  .site-footer .footer-inner.page-width { width: 100% !important; max-width: none; min-height: 408px; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto auto; gap: 19.125px 14px; padding: 75.2px 17.85px 24.2px; }
  .footer-column { min-height: 0; }
  .footer-column h2 { margin-bottom: 10.84px; font-size: clamp(10.84px, 2.1675vw, 15.17px); white-space: normal; }
  .footer-social-column { grid-column: 1; grid-row: 1; }
  .footer-social-column h2 { margin-bottom: 13.55px; }
  .footer-study-column { grid-column: 2; grid-row: 1; border-right: 0; }
  .footer-legal-column { grid-column: 1; grid-row: 2; }
  .footer-text-links { gap: 4.88px; }
  .footer-text-links a { font-size: clamp(8.67px, 1.6256vw, 11.38px); }
  .footer-mountain { grid-column: 2; grid-row: 2; width: min(100%, 150px); }
  .footer-copy { grid-column: 1 / -1; grid-row: 3; }
  .footer-copy::before { font-size: clamp(8.13px, 1.6256vw, 10.84px); }
}
@media (max-width: 460px) {
  .site-footer .footer-inner.page-width { min-height: 414.4px; grid-template-columns: minmax(0, 1fr) auto; gap: 17.85px 7.65px; padding: 66.3px 11.5px 17.85px; }
  .footer-column h2 { font-size: 10.285px; }
  .footer-social-column { grid-column: 1 / -1; grid-row: 1; min-height: 0; border-right: 0; }
  .footer-social-column h2 { margin-bottom: 10.84px; }
  .footer-socials { gap: 7.57px; }
  .footer-socials a { width: 29.24px; height: 29.24px; border-radius: 8.13px; }
  .footer-study-column { grid-column: 1; grid-row: 2; }
  .footer-legal-column { grid-column: 1; grid-row: 3; }
  .footer-mountain { grid-column: 2; grid-row: 3; width: min(20vw, 80px); }
  .footer-text-links a { font-size: 8.13px; }
  .footer-copy { grid-column: 1 / -1; grid-row: 4; }
  .footer-copy::before { font-size: 7.59px; }
}