/* ===== Responsive: tablet (≤1199) and phone (≤809), following the template's stacked layouts ===== */
@media (max-width: 1199px) {
  /* hero: title first, no overlap */
  .hero { padding-top: 130px; }
  .hero-top { flex-direction: column-reverse; }
  .hero-left { flex-direction: column; align-items: flex-start; gap: 24px; }
  .hero-card { margin-top: 48px; padding-top: 32px; }
  .hero-phone { display: none; }
  .pb-head { flex-direction: column; gap: 24px; }
  .pb-head h2 { width: auto; max-width: 640px; }
  .pb-card { gap: 40px; }
  .so-head, .so-head .t-body, .kf-head, .fits-head, .alt-head, .fe-head, .mission-head, .vals-head { width: auto; max-width: 640px; }
  .so-list { grid-template-columns: 1fr; max-width: 445px; margin-left: auto; margin-right: auto; }
  .how-in { flex-direction: column; gap: 48px; }
  .how-left { position: static; width: auto; }
  .how-list { width: 100%; }
  .ft-row { grid-template-columns: 1fr; }
  .ft-head { width: auto; }
  .ft-dark { height: auto; padding: 64px 48px 0; display: flex; flex-direction: column; gap: 48px; }
  .ftd-left { position: static; width: auto; }
  .ftd-left .btn { margin-top: 40px; }
  .ftd-phone, .kf-phone { position: relative; left: auto; top: auto; align-self: center; height: 480px; overflow: hidden; }
  .ft-glow { left: 40%; }
  .pr-body { margin-left: 0; flex-direction: column; align-items: center; gap: 48px; }
  .pr-head h2 { width: auto; }
  .rs-top { height: auto; }
  .rs-head { position: static; width: auto; }
  .rs-chart { position: relative; height: 420px; margin-top: 40px; }
  .rs-chart svg { height: 380px; }
  .rs-pt { top: calc(var(--y) * 380 / 420); }
  .rs-cards { grid-template-columns: 1fr; }
  .ex-row { flex-direction: column; height: auto; gap: 16px; }
  .ex-img { width: 100%; height: 320px; }
  .ex-card { margin: 0; min-height: 360px; }
  .bn-head { flex-direction: column; align-items: flex-start; gap: 32px; }
  .bn-head > div { width: auto; }
  .fe-list { width: auto; }
  .fcard { flex-direction: column; height: auto; align-items: stretch; }
  .fc-left { width: auto; height: auto; }
  .fc-bot { margin-top: 32px; }
  .fc-right { width: auto; }
  .faq { flex-direction: column; gap: 48px; padding: 0; }
  .faq-head, .faq-list { width: auto; }
  .gd-head { flex-direction: column; align-items: flex-start; gap: 32px; }
  .gd-list { grid-template-columns: 1fr 1fr; }
  .cta { height: auto; padding-bottom: 120px; }
  .cta-card { flex-direction: column; height: auto; gap: 48px; padding: 40px; }
  .cta-left, .cta-right { width: auto; }
  .cta-phone { position: relative; left: auto; top: auto; transform: none !important; display: flex; justify-content: center; margin-top: 48px; }
  /* inner pages */
  .phero { height: auto; padding-bottom: 0; }
  .phero.sm { padding-bottom: 100px; }
  .phero-in h1, .phero .t-hero, .phero-in .t-body, .int-head .t-hero { width: auto; max-width: 720px; }
  .phero-phone { height: 420px; overflow: hidden; }
  .kf-card { flex-direction: column; align-items: stretch; gap: 40px; }
  .kf-l, .kf-dark .kf-l { width: auto; min-height: 0; }
  .kf-l .t-body { margin-top: 32px; width: auto; }
  .kf-l .btn { margin-top: 8px; }
  .kf-r { width: auto; }
  .fits-cols { grid-template-columns: 1fr; gap: 40px; }
  .fits-cols > div { padding: 0 0 0 24px; border-left: 1px solid #e3e7eb; }
  .fits-cols > div:first-child { padding-left: 24px; border-left: 1px solid #e3e7eb; }
  .alt-row, .alt-row.rev { flex-direction: column; align-items: stretch; gap: 40px; }
  .alt-t, .alt-row.rev .alt-t { width: auto; padding: 0; }
  .alt-t .t-body { width: auto; }
  .alt-m { width: 100%; height: 520px; }
  .alt-w, .alt-row.rev .alt-w { left: 20px; right: auto; bottom: 20px; max-width: calc(100% - 40px); }
  .pt-cards, .pt-row { grid-template-columns: 200px 1fr 1fr; }
  .calc-card { width: auto; flex-direction: column; }
  .calc-r { width: auto; }
  .vals-card { flex-direction: column; padding: 40px; }
  .vals-l { width: auto; }
  .vals-img { width: 100%; height: 420px; }
  .why-head { flex-direction: column; gap: 24px; }
  .why-cards { grid-template-columns: 1fr; }
  .stats-head { flex-direction: column; gap: 24px; }
  .stats-head h2, .stats-head p { width: auto; margin-top: 0; }
  .stats-orb { height: auto; display: flex; flex-direction: column; gap: 56px; padding: 40px 0 40px 48px; }
  .st { position: relative; left: auto !important; top: auto !important; width: auto; }
  .st::before, .st::after { display: none; }
  .orb { left: -420px; top: 0; }
  .orb-ring { display: none; }
  .story > div { width: auto; padding: 0 32px; }
  .team-head { flex-direction: column; gap: 24px; }
  .team-head p { width: auto; margin-top: 0; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .mission-cols { width: auto; grid-template-columns: 1fr; }
  .mission-cols > div { padding: 40px 0 0; border-left: 0; border-top: 1px solid #d9dde2; }
  .int-grid { grid-template-columns: 1fr 1fr; }
  .prose, .post .prose { width: auto; }
  .util-head { flex-direction: column; align-items: flex-start; gap: 24px; }
  .util-head p { width: auto; }
  .blog-top { flex-direction: column; align-items: flex-start; gap: 24px; }
  .blog-top > div:last-child { width: auto; }
  .feat { flex-direction: column-reverse; height: auto; }
  .feat-img { width: 100%; height: 320px; }
  .feat-l h2, .feat-l p { width: auto; }
  .feat-l h2 { margin-top: 48px; }
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .post-top { flex-direction: column; align-items: flex-start; gap: 20px; }
  .post-top h1, .post-top p { width: auto; }
  .post-body { grid-template-columns: 1fr; gap: 40px; }
  .toc { position: static; }
  .find { flex-direction: column; gap: 40px; }
  .find-l, .find-l > p, .find-card { width: auto; }
  .lic-sec { grid-template-columns: 1fr; gap: 20px; }
  .lic-sec > div { border-left: 0; padding: 0; }
  .clog-i { grid-template-columns: 1fr; gap: 16px; }
  .clog-d { border-right: 0; height: auto; }
  .clog-b { padding-left: 0; }
}

@media (max-width: 809px) {
  .hero { padding-top: 110px; padding-bottom: 24px; }
  .hero-title h1 { font-size: 56px; }
  .hero-card { flex-direction: column; align-items: stretch; height: auto; padding: 20px; border-radius: 24px; margin-top: 40px; }
  .hc-left { height: auto; gap: 40px; padding: 12px; }
  .hc-icon { align-items: center; }
  .hc-icon .mark { width: 54px; height: 56px; }
  .hc-icon p { margin-left: 24px; width: auto; font-size: 20px; }
  .hc-img { width: 100%; height: 200px; }
  .problem { padding-top: 96px; }
  .pb-head h2 { font-size: 32px; }
  .pb-card { flex-direction: column; height: auto; padding: 16px; gap: 24px; align-items: stretch; }
  .pb-img { width: 100%; height: 200px; }
  .pb-body { flex-direction: column; height: auto; padding: 0 8px 8px; gap: 24px; }
  .pb-slides { width: auto; min-height: 290px; }
  .pb-lead { width: auto; font-size: 20px; }
  .pb-s .t-hero { font-size: 72px; }
  .pb-side { flex-direction: row-reverse; justify-content: space-between; align-items: center; padding: 0; }
  .so-list { margin-top: 48px; }
  .so-vis { height: 404px; }
  .so-vis > * { zoom: .8; }
  .so-chat::after, .so-bg { zoom: 1 !important; }
  .how-list { margin-top: 0; }
  .step { height: auto; min-height: 210px; }
  .ft-card { height: auto; padding: 24px; gap: 32px; }
  .ft-wid { height: 330px; flex: none; }
  .ft-wid > * { zoom: .78; }
  .ft-img .ft-head { margin-top: 0; }
  .ft-dark { padding: 40px 24px 0; }
  .ftd-left .t-body { width: auto; }
  .ftd-code { font-size: 15px; }
  .ftd-phone, .kf-phone { height: 420px; }
  .product { padding-bottom: 80px; }
  .pr-bg { border-radius: 64px; }
  .pr-steps { width: 100%; }
  .rs-chart { height: 300px; }
  .rs-chart svg { height: 260px; }
  .rs-pt { top: calc(var(--y) * 260 / 300); width: 18px; height: 18px; margin: -9px 0 0 -9px; }
  .rs-pt::after { inset: 5px; }
  .rs-time { font-size: 12px; }
  .rs-cards, .ex { margin-top: 64px; }
  .rcard { height: auto; min-height: 240px; }
  .rc-num { font-size: 56px; }
  .ex-row { margin-top: 40px; }
  .ex-img { height: 260px; }
  .ex-card { padding: 24px; min-height: 420px; }
  .ex-s { font-size: 22px; }
  .ex-nav { flex-wrap: wrap; gap: 12px; }
  .benefits { padding-top: 96px; padding-bottom: 120px; }
  .bn-card { width: 300px; }
  .bn-media { height: 300px; }
  .bn-media > img { width: 300px; height: 190px; }
  .bw { left: 20px; top: 70px; zoom: .62; }
  .bn-txt { width: auto; margin-top: 16px; }
  .fees { padding-top: 96px; border-radius: 40px 40px 0 0; }
  .fe-list { margin-top: 48px; }
  .fcard { padding: 12px; }
  .fc-left { padding: 12px; }
  .fc-toggle button { font-size: 12px; }
  .fc-pl > span:first-child { font-size: 13px; }
  .fc-live { font-size: 13px; }
  .fc-pr { flex-direction: column; align-items: flex-start; gap: 10px; }
  .fc-note { text-align: left; }
  .fc-pr p b { font-size: 40px; }
  .fc-feats { grid-template-columns: 1fr; margin-top: 28px; }
  .fc-bot > div { flex-direction: column; align-items: flex-start; gap: 16px; }
  .fc-card { height: 220px; padding: 24px; }
  .fc-ct b { font-size: 18px; }
  .fc-cb p { width: auto; font-size: 14px; }
  .fc-cb .mark { height: 44px; }
  .fc-trust { flex-wrap: wrap; font-size: 11px; gap: 8px; }
  .faq-sec { padding-top: 80px; }
  .faq-q { font-size: 17px; }
  .faq-a p { padding-left: 0; }
  .gd-list { grid-template-columns: 1fr; margin-top: 40px; }
  .cta { margin-top: 64px; padding-bottom: 100px; border-radius: 0 0 40px 40px; }
  .cta-in { padding-top: 80px; }
  .cta-card { padding: 28px 20px; }
  .cta-lb .mark { margin-bottom: 16px; }
  .cta-phone .phone { transform: scale(.9); transform-origin: top center; }
  /* inner pages */
  .phero { padding-top: 110px; border-radius: 0 0 40px 40px; }
  .phero-in .t-body { width: auto; }
  .phero .t-hero { font-size: 52px; }
  .phero-phone { height: 360px; }
  .kf { padding-top: 96px; }
  .kf-card { padding: 24px; }
  .kf-r { zoom: .8; }
  .ticks li { font-size: 14px; align-items: flex-start; }
  .fits, .alt { padding-top: 96px; }
  .fits-cols { margin-top: 48px; }
  .alt-m { height: 380px; }
  .alt-w, .alt-row.rev .alt-w { zoom: .75; }
  .ptable .wrap { overflow-x: auto; }
  .pt-cards, .pt-row { grid-template-columns: 130px 1fr 1fr; font-size: 13px; }
  .pt-cards > span { display: none; }
  .pt-cards { grid-template-columns: 1fr 1fr; }
  .pt-row.price { font-size: 20px; }
  .pt-cards .fc-card { height: 180px; padding: 16px; }
  .pt-cards .fc-ct b { font-size: 13px; }
  .pt-cards .fc-ct img { height: 14px; }
  .pt-cards .fc-cb p { font-size: 11px; }
  .pt-cards .fc-cb .mark { display: none; }
  .calc { padding-top: 96px; }
  .calc-l { padding: 12px; }
  .calc-big { font-size: 44px; }
  .calc-split { grid-template-columns: 1fr; }
  .vals-card { padding: 28px 20px; }
  .vals-img { height: 300px; }
  .acc-q { font-size: 17px; }
  .why, .stats, .team, .mission { padding-top: 96px; }
  .st b.st-n { font-size: 64px; }
  .stats-orb { padding-left: 20px; }
  .story { height: 560px; border-radius: 40px; margin-top: 80px; }
  .team-grid { grid-template-columns: 1fr; }
  .tm-img { height: 240px; }
  .int-grid { grid-template-columns: 1fr; }
  .int-card { height: auto; gap: 40px; padding: 28px; }
  .idet { padding-top: 100px; }
  .idet-x { gap: 14px; }
  .idet-x .mark { height: 52px; }
  .prose { margin-top: 48px; }
  .prose > h2 { font-size: 30px; }
  .util-head { padding: 28px 20px; margin-top: 100px; }
  .util-head .t-hero, .find-l .t-hero, .blog-top .t-hero, .ex-top .t-hero, .app-top .t-hero { font-size: 48px !important; }
  .clog-b h3 { font-size: 32px; }
  .blog-grid { grid-template-columns: 1fr; }
  .filters { flex-direction: column; align-items: flex-start; gap: 14px; margin-top: 56px; }
  .filters button { height: 34px; padding: 0 14px; font-size: 13px; }
  .feat-l { padding: 20px; }
  .feat-l h2 { font-size: 34px; }
  .post-top h1 { font-size: 40px; }
  .post-hero { height: 260px; }
  .find { padding-top: 100px; }
  .find-card { padding: 24px; }
  .kv b { font-size: 20px; }
  .nf-card { width: calc(100% - 40px); }
}
@media (max-width: 809px) {
  .t-body, .t-1, .t-2, .t-3, .t-4, .t-5, h1, h2, h3, p { max-width: 100%; }
  .rs-head .t-body, .faq-head .t-body, .how-left .t-body, .rc-c .t-body, .gd-head .t-body, .fe-head .t-body, .fits-head .t-body, .mission-head .t-body, .story .t-body { width: auto; }
  .pb-head h2 { font-size: 36px; }
  .w-pay { left: 70px; top: 190px; }
  .w-split { left: 0; top: 0; }
}
@media (max-width: 1199px) {
  .gd-head > div { width: auto; }
  .faq-a p { width: auto; }
}
@media (max-width: 1099px) {
  .launch, .tk-grid { grid-template-columns: minmax(0, 1fr); }
  .tk-grid > *, .launch > * { min-width: 0; }
}
@media (max-width: 809px) {
  .cta .t-2, .cta-right .t-2 { font-size: 36px; }
  .trend-row { grid-template-columns: 1fr; }
  .pay-ht { flex-direction: column; align-items: flex-start; gap: 14px; }
  .pay-hero { padding: 24px; margin-top: 100px; }
  .tk-stats { gap: 16px; flex-wrap: wrap; }
  .tk-ct .mc { font-size: 32px; }
  .tk-chart, .tk-tabs { padding: 18px; }
  .chart { height: 200px; }
}
@media (max-width: 1099px) {
  .tk-l { display: contents; }
  .tk-chart { order: 1; } .tk-grid > aside { order: 2; } .tk-tabs { order: 3; }
}
