@media (max-width:1024px) {
    .topbar { display: none; }
    .m-nav { display: block; }
}

@media (max-width:1200px) {
    .hero-h1 .vt { font-size: 2.6rem; }
    .hero-h1 .sub { font-size: 1.9rem; }
    .hero-visual { width: 38%; }
}

@media (max-width:992px) {
    .s-title { font-size: 1.9rem; }
    .highlight-row { grid-template-columns: 1fr 1fr; }
}

@media (max-width:768px) {
    .hero-area { padding: 80px 0 50px; min-height: auto; }
    .hero-area .wrap { flex-direction: column; text-align: center; }
    .hero-left { width: 100%; }
    .hero-visual { width: 70%; max-width: 340px; margin: 0 auto 28px; }
    .hero-h1 .vt { font-size: 2.2rem; }
    .hero-h1 .sub { font-size: 1.65rem; }
    .hero-p { font-size: .97rem; margin-left: auto; margin-right: auto; }
    .hero-btns { justify-content: center; }
    .hero-badges { justify-content: center; }
    .hero-toc { text-align: left; margin-left: auto; margin-right: auto; }

    section { padding: 65px 0; }
    .article-area { padding: 55px 0; }
    .s-title { font-size: 1.6rem; }
    .s-lead { font-size: .95rem; margin-bottom: 36px; }

    .highlight-row { grid-template-columns: 1fr; }
    .ccard { flex: 0 0 250px; }
    .art-block h3 { font-size: 1.2rem; }

    .closing-title { font-size: 1.8rem; }
    .closing { padding: 75px 0; }

    .bottom-upper { flex-direction: column; gap: 20px; }
    .bottom-copy { flex-direction: column; gap: 14px; text-align: center; }
}

@media (max-width:576px) {
    .wrap { padding: 0 14px; }
    .hero-pill { font-size: .7rem; padding: 5px 10px; }
    .hero-h1 .vt { font-size: 1.85rem; }
    .hero-h1 .sub { font-size: 1.4rem; }
    .hero-btns { flex-direction: column; align-items: center; }
    .pill-btn { width: 100%; justify-content: center; }
    .hero-badges { flex-direction: column; align-items: center; gap: 8px; }
    .hero-visual { width: 90%; max-width: 100%; }
    .hero-toc li a { font-size: .8rem; }

    .s-title { font-size: 1.35rem; }
    .ccard { flex: 0 0 230px; }
    .ccard-thumb { height: 250px; }
    .hl-card { padding: 22px; }

    .art-block blockquote { padding: 16px 20px; font-size: .93rem; }
    .qa-head h3 { font-size: .94rem; }
    .closing-title { font-size: 1.4rem; }
    .closing p { font-size: .96rem; }
    .pill-btn--main.xl { padding: 13px 24px; font-size: .95rem; }
    .art-img { border-radius: 10px; margin-bottom: 26px; }

    .bottom-bar { padding: 36px 0 20px; }
    .bottom-nav { flex-direction: column; gap: 10px; text-align: center; }
}

@media (max-width:375px) {
    .hero-h1 .vt { font-size: 1.6rem; }
    .hero-h1 .sub { font-size: 1.2rem; }
    .s-title { font-size: 1.2rem; }
    .closing-title { font-size: 1.2rem; }
}

@media (prefers-reduced-motion:reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}