/* FV: text and decorations remain editable; ten separate image assets. */
.fv { position:relative; isolation:isolate; overflow:hidden; margin-top:var(--header-h); background:#fff; color:#141414; font-family:var(--font-rounded); }
.fv::before,.fv::after { content:""; position:absolute; z-index:-1; width:26%; height:27%; border-radius:0 0 100% 0; background:#1955da; }
.fv::before { top:0; left:0; width:14%; height:16%; }
.fv::after { bottom:0; right:0; transform:rotate(180deg); }
.fv__inner { position:relative; isolation:isolate; width:min(100%,1600px); min-height:650px; aspect-ratio:2 / 1; margin:auto; padding:55px 4% 45px; display:grid; grid-template-columns:63% 30%; grid-template-rows:1fr auto; column-gap:7%; }
.fv__inner::before,.fv__inner::after { content:""; position:absolute; z-index:-1; width:22%; height:16%; background:#fbd54d; border-radius:0 0 0 100%; }
.fv__inner::before { top:0; right:0; }
.fv__inner::after { bottom:0; left:0; transform:rotate(180deg); width:30%; height:20%; }
.fv__copy { grid-column:1; grid-row:1; position:relative; z-index:2; align-self:start; }
.fv__age { display:table; position:relative; margin:0 0 24px 10%; padding:5px 26px; color:white; background:#1955da; border-radius:40px; font-size:clamp(18px,2.3vw,32px); font-weight:900; letter-spacing:.05em; }
.fv__age::after { content:""; position:absolute; bottom:-10px; left:50%; border:12px solid transparent; border-bottom:0; border-top-color:#1955da; }
.fv__title { font-size:clamp(26px,3.55vw,55px); line-height:1.65; font-weight:900; letter-spacing:-.055em; }
.fv__line { display:block; white-space:nowrap; }
.fv__title em { color:#1955da; font-size:1.15em; font-style:normal; text-decoration:underline; text-decoration-color:#fbd54d; text-decoration-thickness:8px; text-underline-offset:4px; }
.fv__title strong { color:#ee6857; font-size:1.2em; }
.fv__future { color:#48b8bc; font-size:1.15em; }
.fv__choice { display:table; margin:26px 0 0; padding:0 28px 5px; border-radius:70px; background:#1955da; box-shadow:5px 7px 0 #48b8bc; color:white; font-size:clamp(22px,3vw,44px); font-weight:900; white-space:nowrap; }
.fv__choice b { color:#fbd54d; font-size:1.8em; line-height:1.3; vertical-align:-.06em; }
.fv__photo { position:absolute; z-index:0; top:12%; bottom:0; left:39%; width:33%; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 20%,#000 90%,transparent); }
.fv__photo img { width:100%; height:100%; object-fit:cover; object-position:50% 35%; }
.fv__courses { grid-column:2; grid-row:1 / 3; align-self:center; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; list-style:none; position:relative; z-index:3; }
.fv-course { min-width:0; border:1px solid #1955da; border-radius:17px; background:#fff; overflow:hidden; display:flex; flex-direction:column; }
.fv-course:nth-child(3n+2) { border-color:#49b9bd; }
.fv-course:nth-child(3n) { border-color:#dda527; }
.fv-course img { width:100%; height:auto; aspect-ratio:1 / 1.12; object-fit:cover; }
.fv-course span { display:flex; align-items:center; justify-content:center; text-align:center; min-height:48px; padding:4px 1px; font-size:clamp(11px,1.2vw,18px); line-height:1.25; font-weight:900; }
.fv__action { grid-column:1; grid-row:2; position:relative; z-index:2; padding-top:30px; }
.fv__support { display:flex; align-items:center; gap:6px; font-size:clamp(12px,1.55vw,22px); font-weight:900; white-space:nowrap; }
.fv__support > span { background:#48b8bc; color:white; border-radius:50%; width:40px; height:40px; display:inline-grid; place-items:center; font-size:28px; flex:none; }
.fv__support strong { color:#1955da; }
.fv__cta { display:flex; align-items:center; justify-content:center; gap:20px; width:fit-content; margin:18px 0 5px 12px; padding:12px 28px; background:#f46a56; color:white; border:3px solid white; outline:3px solid #fbd54d; border-radius:30px; text-decoration:none; font-size:clamp(24px,3vw,42px); letter-spacing:.06em; font-weight:900; box-shadow:0 5px 0 #dc5846; }
.fv__cta > span { background:white; color:#f46a56; border-radius:50%; font-size:.7em; width:1.8em; height:1.8em; display:grid; place-items:center; }
.fv__cta:hover { background:#e55a47; }
@media(min-width:1600px) { .fv__inner { min-height:760px; } }
@media(max-width:900px) and (min-width:701px) { .fv__inner { min-height:530px; padding-top:35px; } .fv__title { font-size:3.7vw; } .fv__support { font-size:1.6vw; gap:3px; } .fv__support > span { width:28px; height:28px; font-size:22px; } .fv__courses { gap:7px; } .fv-course span { min-height:40px; } }
@media(max-width:700px) {
 .fv__inner { min-height:0; aspect-ratio:auto; padding:28px 18px 35px; grid-template-columns:39% 61%; grid-template-rows:auto auto auto; gap:24px 0; }
 .fv__copy { grid-column:1 / 3; grid-row:1; text-align:center; }
 .fv__age { margin:0 auto 20px; font-size:20px; padding:4px 22px; }
 .fv__title { font-size:clamp(20px,5.6vw,38px); line-height:1.8; }
 .fv__title em { text-decoration-thickness:5px; }
 .fv__choice { margin:18px auto 0; font-size:clamp(20px,5.9vw,36px); padding:0 20px 4px; }
 .fv__photo { position:relative; grid-column:1; grid-row:2; top:auto; bottom:auto; left:auto; width:auto; margin-left:-18px; margin-right:-18px; mask-image:linear-gradient(90deg,#000 80%,transparent); }
 .fv__photo img { object-position:50% 40%; }
 .fv__courses { grid-column:2; grid-row:2; gap:7px; width:100%; }
 .fv-course { border-radius:11px; }
 .fv-course span { font-size:clamp(9px,2.6vw,16px); min-height:34px; }
 .fv__action { grid-column:1 / 3; grid-row:3; padding-top:0; }
 .fv__support { justify-content:center; font-size:clamp(10px,2.7vw,16px); gap:3px; }
 .fv__support > span { width:27px; height:27px; font-size:22px; }
 .fv__cta { width:calc(100% - 12px); margin:16px auto 5px; padding:12px 10px; font-size:clamp(22px,6vw,34px); gap:12px; border-radius:25px; }
}
/* Keep each explicit label line together, including narrow phone cards. */
.fv-course span { white-space:nowrap; font-size:clamp(10px,1.05vw,16px); }
@media(max-width:700px) { .fv-course span { font-size:clamp(8px,2.2vw,14px); } }
/* Blend the portrait into the hero, including the edge under the header. */
.fv__photo { top:0; left:37%; width:35%; mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 85%,transparent 100%); }
.fv__photo img { object-position:50% 0%; }
@media(max-width:700px) {
 .fv__photo { top:auto; left:auto; width:auto; mask-image:linear-gradient(90deg,#000 80%,transparent); }
 .fv__photo img { object-position:50% 0%; }
}
.fv__photo img { mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 93%,transparent 100%); }
/* Compact mobile hero: all nine course cards fit above the fold on iPhone SE. */
@media(max-width:700px) {
 .fv__inner { padding-top:16px; gap:16px 0; }
 .fv__age { margin-bottom:12px; font-size:18px; }
 .fv__title { line-height:1.6; }
 .fv__choice { margin-top:12px; }
 .fv__courses { gap:6px; }
 .fv-course img { aspect-ratio:1 / 1; }
 .fv-course span { min-height:29px; padding-top:3px; padding-bottom:3px; }
}
@media(max-width:700px) and (max-height:740px) {
 .fv__inner { padding-top:12px; gap:12px 0; }
 .fv__age { font-size:16px; margin-bottom:10px; }
 .fv__title { font-size:clamp(19px,5.3vw,30px); line-height:1.55; }
 .fv__choice { font-size:clamp(19px,5.4vw,30px); margin-top:9px; }
 .fv-course img { aspect-ratio:1.12 / 1; }
 .fv-course span { min-height:27px; }
}
/* Extend the lower-left decoration beyond the centered content container. */
.fv__inner::after {
 left:calc((100vw - 100%) / -2);
 width:calc(30% + (100vw - 100%) / 2);
}
