.home-learning-page{
    --home-warm:#fff8ea;
    --home-warm-deep:#f3c654;
    --home-blue:#eef7fb;
}
.home-learning-hero{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) 245px;
    gap:28px;
    overflow:hidden;
}
.home-learning-hero-copy{position:relative;z-index:2}
.home-learning-nowrap{white-space:nowrap}
.home-learning-hero-visual{
    position:relative;
    min-height:315px;
}
.home-learning-pair{
    position:absolute;
    inset:56px 0 0 10px;
}
.home-learning-avatar{
    position:absolute;
    width:145px;
    height:258px;
    left:10px;
    bottom:0;
    object-fit:contain;
    filter:drop-shadow(0 10px 14px rgba(32,51,44,.10));
}
.home-learning-pet{
    position:absolute;
    width:92px;
    height:92px;
    left:142px;
    bottom:4px;
    object-fit:contain;
    filter:drop-shadow(0 10px 14px rgba(32,51,44,.10));
}
.home-learning-medal{
    position:absolute;
    width:72px;
    height:72px;
    right:14px;
    top:12px;
    object-fit:contain;
    filter:drop-shadow(0 8px 12px rgba(32,51,44,.09));
}
.home-learning-choice{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px,.78fr);
    gap:30px;
    align-items:start;
}
.home-learning-subjects{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}
.home-learning-subjects a{
    display:flex;
    min-height:98px;
    flex-direction:column;
    justify-content:center;
    padding:16px;
    border:1px solid var(--web-line);
    border-radius:18px;
    background:#fff;
    color:inherit;
    text-decoration:none;
}
.home-learning-subjects a:hover{
    border-color:#a9cec0;
    box-shadow:0 8px 24px rgba(32,51,44,.07);
}
.home-learning-subjects strong{
    color:var(--web-accent);
    font-size:17px;
}
.home-learning-subjects span{
    margin-top:4px;
    color:var(--web-muted);
    font-size:13px;
}
.home-learning-origin{
    display:grid;
    grid-template-columns:minmax(0,1fr) 310px;
    gap:34px;
    align-items:center;
    padding:30px;
    border-radius:28px;
    background:var(--home-warm);
}
.home-learning-origin h2{margin-top:0}
.home-learning-reward{
    position:relative;
    min-height:340px;
}
.home-learning-reward-avatar{
    position:absolute;
    width:150px;
    height:267px;
    left:64px;
    bottom:14px;
    object-fit:contain;
}
.home-learning-reward-pet{
    position:absolute;
    width:96px;
    height:96px;
    left:184px;
    bottom:8px;
    object-fit:contain;
}
.home-learning-reward-medal{
    position:absolute;
    width:82px;
    height:82px;
    left:0;
    top:82px;
    object-fit:contain;
}
.home-learning-place{
    display:block;
    padding:30px;
    border:1px solid var(--web-line);
    border-radius:28px;
    background:linear-gradient(135deg,#f8fcfa 0%,var(--home-blue) 100%);
}
.home-learning-place-copy{
    max-width:860px;
    margin:0 auto 26px;
}
.home-learning-school-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:13px 17px;
    border-radius:14px;
    background:var(--web-ink);
    color:#fff;
    font-weight:900;
    text-decoration:none;
    white-space:nowrap;
}
.home-learning-school-link:hover{background:#111f1a}
.home-learning-place-photo{
    overflow:hidden;
    width:min(100%,980px);
    margin:0 auto;
    border-radius:24px;
    background:#fff;
    box-shadow:0 10px 30px rgba(32,51,44,.08);
}
.home-learning-place-photo img{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:3/2;
    object-fit:cover;
    object-position:center;
}
.home-learning-place-photo figcaption{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:16px 18px 18px;
}
.home-learning-place-photo figcaption>div{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}
.home-learning-place-photo figcaption span{
    margin-bottom:7px;
    padding:4px 9px;
    border-radius:999px;
    background:#eaf5f1;
    color:var(--web-accent);
    font-size:11px;
    font-weight:900;
}
.home-learning-place-photo figcaption strong{font-size:19px;line-height:1.4}
.home-learning-place-photo figcaption small{margin-top:3px;color:var(--web-muted);line-height:1.6}
.home-learning-final .web-eyebrow{
    color:#fff;
    background:rgba(255,255,255,.12);
    border-color:rgba(255,255,255,.25);
}
@media(max-width:820px){
    .home-learning-hero{grid-template-columns:1fr}
    .home-learning-hero-visual{
        min-height:270px;
        max-width:280px;
        width:100%;
        margin:0 auto;
    }
    .home-learning-avatar{
        width:125px;
        height:222px;
        left:30px;
    }
    .home-learning-pet{
        width:80px;
        height:80px;
        left:142px;
    }
    .home-learning-medal{
        width:64px;
        height:64px;
        right:32px;
    }
    .home-learning-choice,
    .home-learning-origin{
        grid-template-columns:1fr;
    }
    .home-learning-origin,
    .home-learning-place{
        padding:24px 20px;
    }
    .home-learning-reward{
        min-height:310px;
        max-width:290px;
        width:100%;
        margin:0 auto;
    }
    .home-learning-place-photo{
        max-width:520px;
        width:100%;
        margin:0 auto;
    }
}
@media(max-width:560px){
    .home-learning-place-photo figcaption{
        flex-direction:column;
        align-items:flex-start;
    }
    .home-learning-school-link{
        width:100%;
        white-space:normal;
    }
    .home-learning-nowrap{white-space:normal}
    .home-learning-subjects{grid-template-columns:1fr}
}


/* 2026-08-21: learning-place layout reset
   Keep the copy above a genuinely wide classroom photograph. */
.home-learning-page section.home-learning-place{
    display:block !important;
    grid-template-columns:none !important;
    gap:0 !important;
}
.home-learning-page .home-learning-place-copy{
    width:100% !important;
    max-width:980px !important;
    margin:0 auto 28px !important;
}
.home-learning-page .home-learning-place-copy h2{
    max-width:100% !important;
    text-wrap:balance;
}
.home-learning-page .home-learning-place-photo{
    display:block !important;
    width:min(100%, 980px) !important;
    max-width:980px !important;
    margin:0 auto !important;
}
.home-learning-page .home-learning-place-photo img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:3 / 2 !important;
    object-fit:cover !important;
    object-position:center center !important;
}
.home-learning-page .home-learning-place-photo figcaption{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:20px !important;
}
@media(max-width:560px){
    .home-learning-page .home-learning-place-photo figcaption{
        flex-direction:column !important;
        align-items:flex-start !important;
    }
}


/* 2026-08-21 v3:
   Keep manabis as the main subject. MOANAVI is a supporting option,
   so restore the compact right-column photo while preserving 3:2. */
.home-learning-page section.home-learning-place{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) 360px !important;
    gap:34px !important;
    align-items:center !important;
}
.home-learning-page .home-learning-place-copy{
    width:auto !important;
    max-width:none !important;
    margin:0 !important;
}
.home-learning-page .home-learning-place-copy h2{
    max-width:760px !important;
}
.home-learning-page .home-learning-place-photo{
    width:360px !important;
    max-width:100% !important;
    margin:0 !important;
    align-self:center !important;
}
.home-learning-page .home-learning-place-photo img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:3 / 2 !important;
    object-fit:cover !important;
    object-position:center center !important;
}
.home-learning-page .home-learning-place-photo figcaption{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
    padding:14px 15px 16px !important;
}
.home-learning-page .home-learning-place-photo figcaption>div{
    width:100% !important;
}
.home-learning-page .home-learning-place-photo .home-learning-school-link{
    width:100% !important;
    white-space:normal !important;
}
@media(max-width:900px){
    .home-learning-page section.home-learning-place{
        grid-template-columns:1fr !important;
    }
    .home-learning-page .home-learning-place-photo{
        width:min(100%, 520px) !important;
        margin:0 auto !important;
    }
}
