@media (max-width: 768px) {

  .hero-inner { grid-template-columns: 1fr; gap: 44px; }

  .hero-visual { max-width: 100%; }

  .hero-title { font-size: clamp(22px, 5.4vw, 34px); letter-spacing: -0.02em; line-height: 1.18; }

  .hero-sub { font-size: 15px; line-height: 1.55; }


  .trust-items { gap: 24px; }
}

@media (max-width: 480px) {

  .hero-title { font-size: 22px; line-height: 1.2; letter-spacing: -0.015em; }

  .hero-sub { font-size: 14.5px; margin-bottom: 26px; }

  .hero-btns { flex-direction: column; gap: 10px; width: 100%; margin-bottom: 12px; }

  .hero-btns .btn { width: 100%; justify-content: center; padding: 14px 20px; }
}

@media (max-width: 360px) {

  .hero-title { font-size: 19px; line-height: 1.22; letter-spacing: -0.01em; }

  .hero-sub { font-size: 13.5px; }
}

@media (max-width: 720px) {

  .qb-card { padding: 26px 22px; gap: 18px; }

  .qb-title { font-size: 22px; }

  .qb-sub { font-size: 14px; }

  .qb-btn { width: 100%; justify-content: center; }
}

@media (max-width: 1100px) {

  .hv-app { grid-template-columns: 148px 1fr; }

  .hv-kpis { grid-template-columns: repeat(2, 1fr); }

  .hv-cols { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {

  .cl-strip { grid-template-columns: repeat(2, 1fr); }

  .cl-item { padding: 18px 10px; }

  .cl-item b { font-size: 14px; }

  .cl-item svg { width: 22px; height: 22px; }
}

@media (max-width: 768px) {


  .hv-app { grid-template-columns: 1fr; min-height: 0; }

  .hv-side { display: none; }

  .hv-main { padding: 13px 13px 15px; }

  .hv-toast { position: static; margin-top: 9px; white-space: normal; }

  .hero-chips { gap: 12px; font-size: 12px; }
}

@media (max-width: 600px) {

  .cl-strip { display: flex; gap: 9px; border: none; border-radius: 0; background: none; overflow-x: auto; overflow-y: hidden; padding: 2px 18px 6px; margin-left: -18px; margin-right: -18px; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none; }

  .cl-strip::-webkit-scrollbar { display: none; }

  .cl-item { flex: 0 0 63%; border: 1px solid var(--line-soft); border-radius: 14px; padding: 20px 12px; box-shadow: 0 2px 10px -6px rgba(15,23,42,.14); }
}

@media (max-width: 1100px) {

  .hero-inner { grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 768px) {

  .hv-toast { position: absolute; margin-top: 0; left: 10px; right: 10px; bottom: 10px; top: auto; justify-content: flex-start; }

  .hv-app { padding-bottom: 0; }

  .hv-toast > div > span { white-space: normal; }
}

@media (max-width: 768px) {

  .hv-app { display: none; }

  .hv-mob { display: block; }

  .hero-chips { gap: 12px; font-size: 12px; }

  .hv-story { margin-top: 12px; }
}

@media (max-width: 1080px) {

  .iv-main { grid-template-columns: minmax(0, 1fr); }

  .iv-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .iv-fact + .iv-fact::before { display: none; }
}

@media (max-width: 768px) {

  .iv-wrap { padding: 0 16px; }

  .iv-head { margin-bottom: 16px; }

  .iv-head .sec-sub { font-size: 14.5px; }

  .iv-mode { margin-bottom: 13px; padding: 3px; gap: 3px; border-radius: 11px; }

  .iv-mode-b { padding: 5px 9px; font-size: 11.5px; gap: 5px; border-radius: 8px; }

  .iv-mode-b svg { width: 14px; height: 14px; }


  .iv-tabs-wrap { margin: 0 -16px; }

  .iv-tabs {
    flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; gap: 7px;
    padding: 2px 58px 10px 16px; margin: 0 0 14px;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }

  .iv-tabs::-webkit-scrollbar { display: none; }


  .iv-tab { flex: 0 0 auto; scroll-snap-align: center; font-size: 13px; padding: 8px 13px 8px 8px; }

  .iv-tab:hover { transform: none; }

  .iv-tabs-next {
    display: grid; place-items: center; position: absolute; right: 12px; top: 1px;
    width: 38px; height: 40px; border-radius: 11px; z-index: 2;
    background: var(--surface); border: 1px solid var(--line); color: var(--muted); cursor: pointer;
    box-shadow: -14px 0 16px 6px color-mix(in srgb, var(--page) 92%, transparent), var(--sh-xs);
  }

  .iv-tabs-next svg { width: 18px; height: 18px; stroke-width: 2.3; }


  .iv-main { grid-template-columns: minmax(0, 1fr); gap: 0; }

  .iv-stage::before, .iv-stage::after { display: none; }


  .iv-frame { padding: 4px 4px 0; border-radius: 14px 14px 0 0; }

  .iv-frame .iv-screen { aspect-ratio: 2.8; border-radius: 11px 11px 0 0; }

  .iv-frame .iv-shot { object-fit: cover; object-position: center top; }

  .iv-screen { border-radius: 11px; }

  .iv-stage:hover .iv-frame { transform: none; }


  .iv-phone {
    width: 100%; padding: 4px; border-radius: 14px;
    background: linear-gradient(140deg,
      color-mix(in srgb, var(--acc) 50%, transparent) 0%, color-mix(in srgb, var(--surface-3) 96%, transparent) 34%,
      color-mix(in srgb, var(--acc) 22%, transparent) 62%, color-mix(in srgb, var(--surface-3) 92%, transparent) 100%);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--acc) 14%, transparent), var(--sh-lg);
  }

  .iv-phone::before, .iv-phone::after, .iv-phone-island, .iv-phone-bar { display: none; }

  .iv-phone .iv-screen { border-radius: 11px; aspect-ratio: .72; }

  .iv-phone .iv-shot { object-fit: cover; object-position: center top; }


  .iv-rail {
    margin: -62px -16px 0; padding: 78px 20px 0; gap: 0; position: relative; z-index: 3;
    background: linear-gradient(180deg,
      color-mix(in srgb, var(--page) 0%, transparent) 0,
      color-mix(in srgb, var(--acc) 13%, var(--surface)) 62px,
      var(--page) 78%);
  }

  .iv-pane h3 { font-size: 21px; margin-bottom: 6px; }

  .iv-pane > p { font-size: 14.5px; margin-bottom: 15px; }

  .iv-list { gap: 12px; }

  .iv-list li { font-size: 14px; }

  .iv-list svg { width: 19px; height: 19px; }

  .iv-note { background: var(--surface); padding: 14px 15px; }

  .iv-note p { font-size: 13.5px; }


  .iv-nav {
    position: relative; overflow: hidden; justify-content: space-between; gap: 10px;
    margin-top: 20px; padding: 9px 10px; border-radius: 16px;
    background: var(--surface);
    border: 1px solid var(--line); box-shadow: var(--sh);
  }

  .iv-nav::after {
    content: ''; position: absolute; left: 0; bottom: 0; height: 3px; border-radius: 0 3px 3px 0;
    width: var(--iv-prog, 11%); background: var(--acc);
    transition: width .45s cubic-bezier(.22,.61,.36,1), background .5s;
  }

  .iv-nav-b {
    width: 38px; height: 38px; border-radius: 50%;
    background: color-mix(in srgb, var(--acc) 9%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--acc) 24%, transparent);
    color: color-mix(in srgb, var(--acc) 92%, #000);
  }

  .iv-nav-b:active { transform: scale(.92); }

  .iv-nav-b svg { width: 18px; height: 18px; }

  .iv-nav-mid { flex: 1; text-align: center; }

  .iv-nav-mid b { margin: 0; display: flex; align-items: baseline; justify-content: center; gap: 4px; }

  .iv-nav-mid b i {
    font-family: 'Manrope', sans-serif; font-size: 21px; font-weight: 800;
    letter-spacing: -.02em; color: var(--acc); transition: color .5s;
  }

  .iv-nav-mid b span { font-size: 13px; font-weight: 600; color: var(--muted); }

  .iv-nav-dots { display: none; }


  .iv-facts { display: none; }
}

@media (max-width: 760px) {

  .sv-anim .sv-phone { animation-duration: 13s; }
}

@media (max-width: 1180px) {

  .sv-grid { grid-template-columns: minmax(0, 1fr) 540px; }

  .sv-stage { transform: scale(.845); height: 472px; }

  .sv-title { font-size: clamp(27px, 3vw, 36px); }
}

@media (max-width: 1040px) {

  .sv-grid { grid-template-columns: minmax(0, 1fr); }

  .sv-stage { transform: scale(1); height: 560px; margin: 4px auto 0; }

  .sv-sub { max-width: 620px; }
}

@media (max-width: 760px) {

  .sv-dots { display: none; }


  .sv-head { text-align: left; margin-bottom: clamp(9px, 2.6vw, 14px); }

  .sv-label { padding: 5px 11px 5px 9px; font-size: clamp(11px, 3vw, 12.5px); }

  .sv-title {
    font-size: clamp(23px, 6.6vw, 34px); line-height: 1.16;
    margin-bottom: clamp(7px, 2.2vw, 11px);
  }

  .sv-sub {
    font-size: clamp(13.4px, 3.7vw, 16px); line-height: 1.5;
    max-width: none; margin-bottom: clamp(12px, 3.2vw, 17px);
  }


  .sv-grid { display: flex; flex-direction: column; gap: 0; }

  .sv-left { display: contents; }

  .sv-title { order: 1; }

  .sv-sub { order: 2; }

  .sv-stage { order: 3; }

  .sv-points { order: 4; }


  .sv-stage {
    position: relative; width: 100%; max-width: 440px;
    height: auto; aspect-ratio: 181 / 293;
    transform: none; margin: 0 auto;
  }

  .sv-halo {
    left: 4%; top: 4%; width: 92%; height: 58%;
    background: radial-gradient(closest-side, rgba(204,251,241,.68), rgba(240,253,250,0) 78%);
  }

  .sv-pedestal { left: 22%; top: 86%; width: 56%; height: 10%; }

  .sv-pedestal::after { top: 8%; width: 74%; height: 34%; }


  .sv-phone {
    left: 14%; top: 11%; width: 72%; height: 78%;
    border-radius: clamp(16px, 4.4vw, 22px);
  }

  .sv-ph-top { padding: clamp(10px, 2.8vw, 14px) clamp(11px, 3vw, 15px); gap: clamp(9px, 2.5vw, 12px); }

  .sv-ava { width: clamp(30px, 8.6vw, 38px); height: clamp(30px, 8.6vw, 38px); font-size: clamp(10.4px, 2.9vw, 12.6px); }

  .sv-ph-hd b { font-size: clamp(12.4px, 3.5vw, 15.4px); }

  .sv-ph-hd span { font-size: clamp(9.4px, 2.7vw, 11.6px); gap: 4px; }

  .sv-ph-hd span svg { width: clamp(11px, 3.1vw, 13.5px); height: clamp(11px, 3.1vw, 13.5px); }

  .sv-ph-dots { display: none; }

  .sv-mob-off { display: none; }


  .sv-chat {
    justify-content: flex-end;
    padding: clamp(10px, 2.8vw, 14px) clamp(9px, 2.5vw, 12px);
    gap: clamp(6px, 1.9vw, 9px);
  }

  .sv-bub {
    max-width: 88%;
    font-size: clamp(11px, 3.1vw, 13.6px); line-height: 1.45;
    padding: clamp(7px, 2vw, 10px) clamp(9px, 2.5vw, 12px);
    border-radius: clamp(11px, 3vw, 14px);
  }

  .sv-time { font-size: clamp(8.8px, 2.5vw, 11px); margin-left: 5px; }

  .sv-meta { font-size: clamp(8.8px, 2.5vw, 11px); gap: 4px; margin-top: 3px; }

  .sv-tick, .sv-tick svg { width: clamp(10px, 2.9vw, 13px); height: clamp(10px, 2.9vw, 13px); }

  .sv-typing { padding: clamp(6px, 1.9vw, 9px) clamp(7px, 2.2vw, 11px); gap: 3px; }

  .sv-typing i { width: clamp(3.6px, 1.1vw, 5px); height: clamp(3.6px, 1.1vw, 5px); }


  .sv-card { padding: clamp(9px, 2.5vw, 12px) clamp(10px, 2.8vw, 13px); border-radius: clamp(10px, 2.8vw, 13px); }

  .sv-card-hd { font-size: clamp(10.6px, 3vw, 13px); gap: 6px; margin-bottom: 3px; }

  .sv-card-hd svg { width: clamp(12px, 3.4vw, 15px); height: clamp(12px, 3.4vw, 15px); }

  .sv-card p { font-size: clamp(10px, 2.85vw, 12.4px); line-height: 1.42; }


  .sv-review {
    padding: clamp(11px, 3vw, 14px) clamp(9px, 2.5vw, 12px) clamp(9px, 2.6vw, 12px);
    border-radius: clamp(11px, 3vw, 14px);
  }

  .sv-stars { gap: 2px; margin-bottom: 4px; }

  .sv-stars svg { width: clamp(15px, 4.3vw, 19px); height: clamp(15px, 4.3vw, 19px); }

  .sv-review-txt { font-size: clamp(10.8px, 3vw, 13px); line-height: 1.38; }

  .sv-review-sub { font-size: clamp(9px, 2.6vw, 11.4px); }


  .sv-ph-input { padding: clamp(9px, 2.6vw, 13px) clamp(10px, 2.8vw, 14px); gap: 9px; }

  .sv-ph-input > svg { width: clamp(14px, 4vw, 17px); height: clamp(14px, 4vw, 17px); }

  .sv-ph-input span { font-size: clamp(10.4px, 2.9vw, 12.6px); }

  .sv-send { width: clamp(28px, 8vw, 34px); height: clamp(28px, 8vw, 34px); }

  .sv-send svg { width: clamp(13px, 3.7vw, 16px); height: clamp(13px, 3.7vw, 16px); }


  .sv-sat {
    padding: clamp(8px, 2.4vw, 12px) clamp(10px, 2.8vw, 14px);
    gap: clamp(8px, 2.4vw, 11px);
    border-radius: clamp(11px, 3.2vw, 15px);
    box-shadow: 0 14px 34px -10px rgba(15,23,42,.24), 0 4px 10px -4px rgba(15,23,42,.1);
  }

  .sv-sat-ic {
    width: clamp(28px, 8vw, 36px); height: clamp(28px, 8vw, 36px);
    border-radius: clamp(8px, 2.4vw, 11px);
  }

  .sv-sat-ic svg { width: clamp(15px, 4.4vw, 19px); height: clamp(15px, 4.4vw, 19px); }

  .sv-sat-b b { font-size: clamp(11.2px, 3.3vw, 15px); line-height: 1.26; letter-spacing: -0.02em; }

  .sv-sat-b i { font-size: clamp(9.8px, 2.9vw, 13px); margin-top: 2px; }

  .sv-sat-pin {
    left: auto; right: 8px; top: -10px;
    min-width: clamp(15px, 4.4vw, 20px); height: clamp(15px, 4.4vw, 20px);
    font-size: clamp(8px, 2.4vw, 11px); border-width: 1.5px;
  }


  .sat-in, .sat-del { left: auto; right: 0; top: 4%;  bottom: auto; width: 57%; }

  .sat-ans, .sat-star { left: 0; right: auto; top: 26%; bottom: auto; width: 57%; }

  .sat-low { left: auto; right: 0; top: 0; bottom: auto; width: 57%; }

  .sat-owner { left: auto; right: 0; top: auto; bottom: 0; width: 57%; }

  .sat-del, .sat-star { display: flex; }


  .sv-anim .sat-in, .sv-anim .sat-ans, .sv-anim .sat-del { transform: translateX(12px) scale(.95); }

  .sv-anim .sat-star, .sv-anim .sat-low, .sv-anim .sat-owner { transform: translateX(-12px) scale(.95); }


  .sv-points {
    display: flex; gap: clamp(7px, 2vw, 10px);
    margin-top: clamp(14px, 3.8vw, 20px); max-width: none;
  }

  .sv-pt {
    display: grid; grid-template-columns: auto minmax(0, 1fr);
    column-gap: clamp(10px, 2.8vw, 14px); align-items: center;
    background: var(--surface);
    border: 1px solid var(--line-soft); border-radius: clamp(13px, 3.6vw, 17px);
    box-shadow: var(--sh-sm);
    padding: clamp(9px, 2.5vw, 13px) clamp(11px, 3vw, 15px);
    opacity: 1;
  }

  .sv-pt.dim { opacity: 1; }

  .sv-pt > div { min-width: 0; }

  .sv-pt-hd {
    display: flex; justify-content: space-between; align-items: center;
    gap: clamp(8px, 2.4vw, 12px); margin-bottom: 0; cursor: pointer; flex-wrap: nowrap;
  }

  .sv-pt-ic {
    width: clamp(31px, 8.4vw, 38px); height: clamp(31px, 8.4vw, 38px);
    border-radius: clamp(9px, 2.4vw, 11px);
  }

  .sv-pt-ic svg { width: clamp(16px, 4.2vw, 19px); height: clamp(16px, 4.2vw, 19px); }

  .sv-pt-hd h3 { font-size: clamp(13.6px, 3.8vw, 16.4px); }

  .sv-tag { display: none; }

  .sv-pt-arrow {
    display: block; width: clamp(17px, 4.6vw, 21px); height: clamp(17px, 4.6vw, 21px);
    color: var(--muted-2); transition: transform .32s cubic-bezier(.22,1,.36,1), color .2s ease;
  }

  .sv-pt.open .sv-pt-arrow { transform: rotate(90deg); color: var(--teal); }

  .sv-pt-body {
    max-height: 0; overflow: hidden;
    transition: max-height .38s cubic-bezier(.22,1,.36,1), opacity .28s ease;
    opacity: 0;
  }

  .sv-pt.open .sv-pt-body { max-height: 220px; opacity: 1; }

  .sv-pt-body p {
    font-size: clamp(12.8px, 3.5vw, 15px); line-height: 1.5;
    padding-top: clamp(9px, 2.4vw, 12px);
  }

  .sv-pt.live .sv-pt-ic { transform: none; }


  .sv-bottom {
    display: flex; flex-direction: column;
    gap: clamp(14px, 3.6vw, 20px);
    margin-top: clamp(14px, 3.8vw, 20px);
  }

  .sv-panel { background: none; box-shadow: none; border: 0; padding: 0; border-radius: 0; }


  .sv-facts, .sv-chan {
    display: flex; flex-wrap: nowrap;
    overflow-x: auto; overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: clamp(9px, 2.6vw, 13px);
    padding: 3px var(--pad) 5px; margin: 0 calc(-1 * var(--pad));
    scroll-padding-left: var(--pad);
  }

  .sv-facts::-webkit-scrollbar, .sv-chan::-webkit-scrollbar { display: none; }


  .sv-fact, .sv-ch {
    flex: 0 0 auto;
    background: var(--surface); border: 1px solid var(--line-soft);
    border-radius: clamp(14px, 3.8vw, 18px);
    box-shadow: var(--sh);
    padding: clamp(11px, 3vw, 15px) clamp(12px, 3.2vw, 16px);
  }

  .sv-fact + .sv-fact::before, .sv-ch + .sv-ch::before { display: none; }


  .sv-fact { width: clamp(132px, 38vw, 190px); }

  .sv-fact-top { gap: 6px; margin-bottom: 3px; }

  .sv-fact-top svg { width: clamp(15px, 4.2vw, 19px); height: clamp(15px, 4.2vw, 19px); }

  .sv-fact-n { font-size: clamp(15.5px, 4.4vw, 20px); }

  .sv-fact p { font-size: clamp(10.2px, 2.8vw, 12px); line-height: 1.38; }


  .sw-hold { display: block; position: relative; min-width: 0; }

  .sw-nav { display: block; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); z-index: 3; }


  .sv-chan-hd {
    display: block; margin-bottom: clamp(8px, 2.2vw, 12px);
    font-size: clamp(12px, 3.2vw, 14px); font-weight: 700;
    color: var(--ink); letter-spacing: -0.015em;
  }

  .sv-ch {
    width: clamp(152px, 44vw, 210px);
    flex-direction: row; align-items: center; gap: clamp(9px, 2.6vw, 12px);
  }

  .sv-ch-ic { width: clamp(34px, 9.2vw, 42px); height: clamp(34px, 9.2vw, 42px); }

  .sv-ch-ic > svg { width: clamp(20px, 5.4vw, 25px); height: clamp(20px, 5.4vw, 25px); }

  .sv-ch-b b { font-size: clamp(11.4px, 3.1vw, 13.4px); white-space: normal; }

  .sv-ch-b i { font-size: clamp(9.6px, 2.6vw, 11.2px); }

  .sv-ch-bot {
    width: clamp(19px, 5.2vw, 24px); height: clamp(19px, 5.2vw, 24px);
    right: -4px; bottom: -4px;
  }

  .sv-ch-bot svg { width: clamp(12px, 3.2vw, 15px); height: clamp(12px, 3.2vw, 15px); }
}

@media (max-width: 1080px) {

  .geo-main { grid-template-columns: 1fr; }

  .geo-nums { order: 2; }
}

@media (max-width: 760px) {

  .geo-main { gap: 12px; margin-bottom: 12px; }

  .geo-svg-pc { display: none; }

  .geo-svg-mob { display: block; }

  .geo-map { border-radius: 20px; padding: 12px 12px 10px; }

  .geo-chip { left: var(--mx); top: var(--my); gap: 6px; padding: 5px 8px 5px 6px; border-radius: 9px; }

  .geo-chip img { width: 15px; height: 11px; }

  .geo-chip b { font-size: 10.5px; }

  .geo-sup { font-size: 8.5px; gap: 3px; }

  .geo-sup i { width: 3.5px; height: 3.5px; }

  .geo-chip-main { padding: 6px 9px 6px 7px; border-radius: 11px; }

  .geo-chip-main img { width: 19px; height: 13px; }

  .geo-chip-main b { font-size: 11.5px; }

  .geo-tag { font-size: 8.5px; padding: 2px 6px; }

  .geo-note-ic { width: 34px; height: 34px; border-radius: 11px; }

  .geo-note p { font-size: 11px; }

  .geo-nums { border-radius: 18px; padding: 11px; gap: 6px; }

  .geo-nums-h b { font-size: 15.5px; }

  .geo-num { padding: 7px 10px; gap: 10px; border-radius: 12px; }

  .geo-num-ic { width: 34px; height: 40px; border-radius: 11px; }

  .geo-num-ic svg { width: 28px; height: 30px; }

  .geo-num-v, .geo-num-sf { font-size: 20px; }

  .geo-num-u { font-size: 12px; }

  .geo-num-s { font-size: 11px; }

  .geo-local { padding: 8px 11px; border-radius: 12px; gap: 10px; }

  .geo-local > svg { width: 26px; height: 30px; }

  .geo-local b { font-size: 12.5px; }

  .geo-local span { font-size: 10.5px; }

  .geo-chev { right: 10px; }


  .geo-strip {
    border-radius: 18px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
  }

  .geo-track { display: flex; width: max-content; animation: geoRoll 20s linear infinite; }

  .geo-track.hold { animation-play-state: paused; }

  .geo-fx { flex: 0 0 112px; flex-direction: column; align-items: center; text-align: center;
    padding: 14px 8px; gap: 7px; border-left: 1px solid var(--line-soft); }

  .geo-fx-ic { width: 42px; height: 42px; border-radius: 50%; }

  .geo-fx-ic svg { width: 26px; height: 33px; }

  .geo-fx b { font-size: 11.5px; line-height: 1.3; white-space: normal; }

  .geo-fx span { font-size: 10px; line-height: 1.4; margin-top: 3px; }

  .geo-foot { margin-top: 14px; font-size: 12.5px; }
}

@media (max-width: 480px) {

  .geo-tag { font-size: 9px; padding: 2px 7px; }
}

@media (max-width: 760px) {

  .geo-wv { animation-duration: 4.4s; }

  .geo-foot svg { animation-duration: 3.4s; }

  .geo-track { animation-duration: 34s; }
}

@media (max-width: 1080px) {

  .pf-board, .pf-saas, .pf-strip { max-width: 560px; margin-left: auto; margin-right: auto; }


  .pf-board { display: flex; flex-direction: column; gap: 0; margin-bottom: 0; }

  .pf-logo { order: -1; display: block; padding: 0; }

  .pf-logo img { width: 168px; filter: drop-shadow(0 12px 26px rgba(15,23,42,.14)); }

  .pf-logo::before, .pf-logo::after, .pf-dot, .pf-down, .pf-run { display: none; }

  .pf-wire { display: block; width: 296px; max-width: 100%; height: 64px; margin: -2px auto -6px; }

  .pf-wire path { fill: none; stroke-width: 1.7; stroke-dasharray: 5 7; stroke-linecap: round; }

  .pf-wire .a { stroke: color-mix(in srgb, var(--crm) 60%, transparent); }

  .pf-wire .b { stroke: color-mix(in srgb, var(--erp) 60%, transparent); }

  .pf-wire .c { stroke: color-mix(in srgb, var(--saas) 60%, transparent); }

  .pf-wire circle.a { fill: var(--crm); stroke: none; }

  .pf-wire circle.b { fill: var(--erp); stroke: none; }

  .pf-wire circle.c { fill: var(--saas); stroke: none; }

  .pf-spark { r: 4; opacity: 0; }

  .pf-spark.a { animation: pfWireA 1.2s cubic-bezier(.4,0,.35,1) infinite; }

  .pf-spark.b { animation: pfWireB 1.2s cubic-bezier(.4,0,.35,1) infinite .4s; }

  .pf-spark.c { animation: pfWireC 1.2s cubic-bezier(.4,0,.35,1) infinite .8s; }


  .pf-col {
    padding: 0; margin-bottom: 9px; border-radius: 16px;
    border: 1px solid rgba(15,23,42,.07); border-top: 0; border-left: 3px solid var(--c);
    box-shadow: 0 12px 28px -20px rgba(15,23,42,.3);
  }

  .pf-col.hot {
    transform: translateY(-2px);
    box-shadow: 0 18px 34px -18px color-mix(in srgb, var(--c) 45%, transparent);
  }

  .pf-head {
    display: flex; align-items: flex-start; gap: 11px; padding: 12px 12px 12px 11px;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }

  .pf-txt {
    display: block; flex: 1; min-width: 0;
    font-size: 14px; font-weight: 700; color: var(--ink); letter-spacing: -.01em;
  }

  .pf-ic { width: 42px; height: 42px; border-radius: 13px; flex-shrink: 0; }

  .pf-ic svg { width: 26px; height: 26px; }

  .pf-head b { font-size: 14px; font-weight: 700; }

  .pf-head b::after { content: ' · '; color: var(--muted-2); }

  .pf-head h3 { display: inline; font-size: 14px; font-weight: 700; margin: 0; }

  .pf-head p {
    margin: 3px 0 0; font-size: 12.5px; font-weight: 400; line-height: 1.45;
  }

  .pf-chev {
    display: block; flex-shrink: 0; margin-top: 10px; color: var(--muted-2);
    transition: transform .3s cubic-bezier(.22,.61,.36,1), color .3s ease;
  }

  .pf-chev svg { display: block; width: 15px; height: 15px; }

  .pf-col.open .pf-chev { transform: rotate(90deg); color: var(--c); }


  .pf-body {
    display: grid; grid-template-rows: 0fr;
    transition: grid-template-rows .34s cubic-bezier(.22,.61,.36,1);
  }

  .pf-col.open .pf-body { grid-template-rows: 1fr; }

  .pf-body > .pf-list { overflow: hidden; }

  .pf-list { gap: 0; }

  .pf-list li { gap: 9px; font-size: 13px; padding: 0 14px 0 64px; }

  .pf-col.open .pf-list { gap: 8px; padding-bottom: 13px; }

  .pf-tick { width: 19px; height: 19px; }

  .pf-tick svg { width: 11px; height: 11px; }


  .pf-saas {
    display: block; padding: 0; margin-bottom: 9px;
    grid-template-columns: none; gap: 0;
  }

  .pf-saas .pf-head h3 { margin-top: 0; }

  .pf-saas .pf-list { display: flex; }


  .pf-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; border-radius: 18px; }

  .pf-fx { padding: 13px 6px; gap: 6px; }

  .pf-fx + .pf-fx { border-left: 0; }

  .pf-fx:not(:nth-child(3n+1)) { border-left: 1px solid var(--line-soft); }

  .pf-fx:nth-child(n+4) { border-top: 1px solid var(--line-soft); }

  .pf-fx-ic { width: 42px; height: 42px; }

  .pf-fx-ic svg { width: 26px; height: 34px; }

  .pf-fx b { font-size: 11.5px; line-height: 1.3; }

  .pf-fx-d { display: none; }
}

@media (max-width: 900px) {

  .feat-big { grid-template-columns: 1fr; }

  .feat-compact { grid-template-columns: repeat(3, 1fr); }

  .feat-comp-item:nth-last-child(-n+3) { border-bottom: none; }
}

@media (max-width: 768px) {

  .feat-big {
    display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden;
    padding: 2px 18px 4px; margin: 0 -18px 4px;
    -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none;
  }

  .feat-big::-webkit-scrollbar { display: none; }

  .feat-big-card { flex: 0 0 86%; }

  .feat-dots { display: flex; justify-content: center; align-items: center; gap: 6px; margin-bottom: 20px; }

  .feat-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line); transition: background .25s, width .25s; flex-shrink: 0; }

  .feat-dot.on { background: var(--teal); width: 16px; border-radius: 3px; }


  .feat-compact-wrap { padding: 24px 18px; }

  .feat-compact { grid-template-columns: repeat(3, 1fr); gap: 0 18px; }

  .feat-comp-item { gap: 8px; padding: 12px 0; }

  .feat-comp-icon { width: 30px; height: 30px; border-radius: 8px; }

  .feat-comp-icon svg { width: 15px; height: 15px; }

  .feat-comp-text h4 { font-size: 13px; }

  .feat-comp-text p { font-size: 12px; line-height: 1.5; }

  .feat-big-card { padding: 24px 22px 0; }

  .feat-big-visual { margin: 0 -22px; }
}

@media (max-width: 480px) {


  .feat-compact { grid-template-columns: repeat(3, 1fr); gap: 0 10px; }

  .feat-compact-wrap { padding: 20px 14px; }

  .feat-comp-item { flex-direction: column; gap: 6px; padding: 10px 0; border-bottom: 1px solid var(--line-soft) !important; }

  .feat-comp-item:nth-last-child(-n+3) { border-bottom: none !important; }

  .feat-comp-icon { width: 26px; height: 26px; border-radius: 7px; flex-shrink: 0; }

  .feat-comp-icon svg { width: 13px; height: 13px; }

  .feat-comp-text h4 { font-size: 11.5px; line-height: 1.35; }

  .feat-comp-text p { font-size: 10.5px; line-height: 1.4; }
}

@media (max-width: 1080px) {

  .saas-sub { margin-bottom: 14px; }

  .saas-hub { display: flex; flex-direction: column; gap: 8px; }

  .saas-side { display: contents; }

  .saas-core { order: 0; padding: 0 0 12px; }

  .saas-card[data-c="1"] { order: 1; }

  .saas-card[data-c="4"] { order: 2; }

  .saas-card[data-c="2"] { order: 3; }

  .saas-card[data-c="5"] { order: 4; }

  .saas-card[data-c="3"] { order: 5; }

  .saas-card[data-c="6"] { order: 6; }

  .saas-status, .saas-guard, .saas-dots { display: none; }

  .saas-cloud-ring { width: clamp(196px, 54vw, 290px); }

  .saas-cloud-name { font-size: 19px; }

  .saas-card { padding: 12px 14px; border-radius: 16px; }

  .saas-card h3 { font-size: 15px; }

  .saas-card p { font-size: 12.5px; }

  .saas-ver { flex-wrap: wrap; }

  .saas-ver-cur, .saas-ver-new { flex: 1 1 140px; }


  .w-bl, .w-br { display: none; }

  .saas-wire { width: 50px; }

  .w-tl, .w-tr {
    top: calc(40% - 74px); height: 74px;
    border-width: 0 0 2px 2px; border-radius: 0 0 0 22px;
  }

  .w-tl { right: 91.5%; }

  .w-tr { left: 91.5%; border-width: 0 2px 2px 0; border-radius: 0 0 22px 0; }

  .w-tl::before { left: -5px; top: -4px; bottom: auto; }

  .w-tr::before { right: -5px; top: -4px; bottom: auto; }

  .w-tl::after { offset-path: path('M1,0 L1,51 Q1,73 23,73 H50'); }

  .w-tr::after { offset-path: path('M49,0 L49,51 Q49,73 27,73 H0'); }

  .w-ml::after { offset-path: path('M1,0 H50'); }

  .w-mr::after { offset-path: path('M49,0 H0'); }


  .saas-strip {
    flex-wrap: wrap; gap: 0; margin-top: 10px; padding: 6px 8px 10px;
  }

  .saas-strip-fx { flex: 1 1 0; min-width: 0; padding: 9px 8px; }

  .saas-strip-fx b { font-size: 12px; }

  .saas-strip-fx span { font-size: 10px; }

  .saas-strip-cta {
    flex: 1 0 100%; align-items: stretch; gap: 4px;
    padding: 10px 6px 0; border-left: none; border-top: 1px solid var(--s-line); margin-top: 6px;
  }

  .saas-strip-cta .btn { width: 100%; justify-content: center; }

  .saas-strip-cta > span { text-align: center; }
}


@media (max-width: 760px) {

  .saas-card[data-c="3"] { grid-template-columns: 34px 1fr auto; }

  .saas-card[data-c="3"] .saas-passkey { grid-column: 3; grid-row: 1 / span 2; align-self: center; margin-left: 10px; }

  .saas-card[data-c="3"] p { margin-bottom: 0; }

  .saas-card[data-c="6"] { grid-template-columns: 34px 1fr auto; }

  .saas-card[data-c="6"] .saas-map {
    grid-column: 3; grid-row: 1 / span 2; align-self: center;
    width: clamp(120px, 34vw, 190px); margin: 0 0 0 10px;
  }

  .saas-card[data-c="6"] p { margin-bottom: 0; }
}


@media (max-width: 760px) {

  .saas-card[data-c="3"] .saas-pk-ic { width: 27px; height: 27px; border-radius: 8px; }

  .saas-card[data-c="3"] .saas-pk-ic svg { width: 15px; height: 15px; }

  .saas-card[data-c="3"] .saas-passkey { gap: 5px; }

  .saas-card[data-c="3"] .saas-pk-dots { gap: 4px; padding: 5px 8px; }

  .saas-card[data-c="3"] .saas-pk-dots i { width: 4px; height: 4px; }

  .saas-card[data-c="3"] .saas-pk-dots i.ok { width: 13px; height: 13px; }

  .saas-strip-fx { flex: 1 1 0; padding: 8px 9px; }

  .saas-strip-fx b { font-size: 10.5px; line-height: 1.25; hyphens: auto; }

  .saas-strip-fx span { font-size: 8.8px; line-height: 1.3; hyphens: auto; }

  .saas-strip-ic { width: 20px; height: 20px; }
}


@media (max-width: 430px) {

  .saas-card[data-c="3"], .saas-card[data-c="6"] { grid-template-columns: 34px 1fr; }

  .saas-card[data-c="3"] .saas-passkey,
  .saas-card[data-c="6"] .saas-map { grid-column: 1 / -1; grid-row: auto; margin: 0; width: auto; }

  .saas-card[data-c="3"] p, .saas-card[data-c="6"] p { margin-bottom: 9px; }

  .saas-os { column-gap: 6px; }

  .saas-os span { padding: 4px 7px; font-size: 10px; }

  .saas-backup-row { font-size: 10px; gap: 6px; }

  .saas-strip-fx { padding: 7px 5px; }
}

@media (max-width: 900px) {

  .pri-grid { grid-template-columns: 1fr; gap: 14px; }

  .pri-popular { transform: none; }

  .pri-popular:hover { transform: translateY(-4px); }
}

@media (max-width: 480px) {


  .pri-card { padding: 28px 22px 22px; }

  .pri-name { font-size: 22px; }

  .pri-list li { font-size: 13px; }
}

@media (max-width: 480px) {

  .pri-amt { font-size: 34px; }

  .pri-skel { width: 78px; height: 34px; }

  .pri-geo { flex-direction: column; gap: 8px; }

  .pri-geo-row { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; scrollbar-width: none; padding: 2px 2px 4px; width: 100%; }

  .pri-geo-row::-webkit-scrollbar { display: none; }
}

@media (max-width: 860px) {

  .pri-grid-2 { grid-template-columns: 1fr; max-width: 460px; }

  .pri-list-2col { columns: 1; }
}

@media (max-width: 380px) {

  .pri-card { padding: 22px 16px 18px; }
}

@media (max-width: 560px) {

  .comp-more { flex-direction: column; align-items: stretch; gap: 12px; padding: 15px 16px; text-align: center; }

  .comp-more-link { justify-content: center; min-height: 44px; }
}

@media (max-width: 768px) {

  .comp-vs { display: flex; flex-direction: column; align-items: center; gap: 9px; margin: 0 0 20px; }

  .comp-wrap { overflow-x: visible; }

  .comp-table { min-width: 0; }

  .comp-table [data-vs] { display: none; }

  .comp-table[data-vs="1c"] [data-vs="1c"],
  .comp-table[data-vs="32desk"] [data-vs="32desk"],
  .comp-table[data-vs="cc"] [data-vs="cc"] { display: table-cell; }

  .comp-table th[data-vs], .comp-table td[data-vs] { text-align: center; }
}

@media (max-width: 768px) {


  .comp-table th, .comp-table td { padding: 13px 14px; font-size: 13px; }
}

@media (max-width: 380px) {

  .comp-table th, .comp-table td { padding: 11px 8px; font-size: 12px; }

  .comp-more { padding: 14px 12px; }
}

@media (max-width: 900px) {

  .mig-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {


  .mig-grid { grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 1024px) {

  .hub-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {

  .hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}

@media (max-width: 480px) {

  .hub-grid { gap: 10px; }

  .hub-col { padding: 14px 12px; }

  .hub-h { font-size: 12.5px; }

  .hub-list a { padding: 7px 0; font-size: 13px; }
}

@media (max-width: 480px) {

  .foot-grid { grid-template-columns: 1fr 1fr !important; gap: 22px 18px; }
}

@media (max-width: 768px) {


  .foot-grid { grid-template-columns: 1fr 1fr; gap: 28px; margin-bottom: 36px; }

  .foot-bottom { flex-direction: column; align-items: flex-start; gap: 10px; }
}