/* =============================================================
   NaviZone — V7 Landing (navi.zone)
   1-to-1 port of the V7 mock. Dedicated stylesheet — loaded only
   on the new landing + section pages, does not touch legacy CSS.
   Brand: #1BBC9B -> #148D74
   ============================================================= */

/* ── TOKENS ─────────────────────────────────────────────────── */
:root {
  --v7-mint:      #1BBC9B;
  --v7-mint-d:    #148D74;
  --v7-mint-l:    #9FE8D2;
  --v7-mint-2:    #2DD0A0;
  --v7-mint-soft: #E7F9F3;
  --v7-grad:      linear-gradient(135deg, #1BBC9B, #148D74);
  --v7-grad-l:    linear-gradient(135deg, #2DD0A0, #9FE8D2);

  --v7-ink:       #070D14;   /* deep dark (hero/header/footer/dark cards) */
  --v7-ink-2:     #0B131B;
  --v7-ink-3:     #0A141C;   /* map bg */
  --v7-page:      #F4F5F6;   /* light page bg */
  --v7-text:      #0F1117;   /* main text on light */
  --v7-muted:     #5A6070;   /* secondary text on light */
  --v7-muted-2:   #9BA3B2;   /* tertiary text on light */
  --v7-on-dark:   #A9BCCB;   /* body text on dark */
  --v7-on-dark-2: #7E93AA;   /* dim text on dark */
  --v7-on-dark-3: #D6E2EA;   /* bright text on dark */

  --v7-ff:   -apple-system, 'SF Pro Display', 'Inter', system-ui, sans-serif;
  --v7-mono: ui-monospace, 'SF Mono', Menlo, monospace;

  --v7-shadow-card: 0 1px 3px rgba(15,17,23,.04), 0 8px 24px rgba(15,17,23,.04);
  --v7-shadow-float: 0 12px 30px rgba(0,0,0,.3);
}

/* ── BASE ───────────────────────────────────────────────────── */
.v7-body {
  margin: 0;
  background: var(--v7-page);
  color: var(--v7-text);
  font-family: var(--v7-ff);
  letter-spacing: -.15px;
  -webkit-font-smoothing: antialiased;
}
.v7-body * { box-sizing: border-box; }
.v7-body a { text-decoration: none; }
.v7-wrap { min-height: 100vh; display: flex; flex-direction: column; }

@keyframes nvBlink { 50% { opacity: .25; } }
@keyframes nvDrive1 { to { offset-distance: 100%; } }
@keyframes nvPulse { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(3); opacity: 0; } }
@keyframes nvFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* shared section wrapper */
.v7-sec { max-width: 1200px; margin: 0 auto; width: 100%; box-sizing: border-box; }
.v7-kicker { font-size: 12px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; color: var(--v7-mint-d); }

/* ── HEADER ─────────────────────────────────────────────────── */
.v7-header {
  position: sticky; top: 0; z-index: 60;
  background: rgba(7,13,20,.86);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.v7-header__bar {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: 20px;
  height: 66px; padding: 0 24px;
}
.v7-logo { display: flex; align-items: center; }
.v7-logo img, .v7-logo svg { height: 24px; display: block; }
.v7-nav { display: flex; align-items: center; gap: 19px; margin-left: 14px; }
.v7-nav__link { color: var(--v7-on-dark); font-size: 13.5px; font-weight: 700; transition: color .15s; }
.v7-nav__link:hover { color: var(--v7-mint-l); }
.v7-spacer { flex: 1; }

.v7-lang { display: flex; border: 1.5px solid rgba(255,255,255,.18); border-radius: 30px; overflow: hidden; }
.v7-lang__btn {
  border: none; cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 800;
  padding: 8px 13px; background: transparent; color: var(--v7-on-dark);
}
.v7-lang__btn.is-active { background: var(--v7-grad); color: #fff; }

.v7-login {
  color: var(--v7-on-dark-3); font-size: 13px; font-weight: 700; padding: 9px 16px;
  border: 1.5px solid rgba(255,255,255,.2); border-radius: 30px; transition: all .15s; white-space: nowrap;
}
.v7-login:hover { border-color: var(--v7-mint); color: var(--v7-mint-l); }

.v7-btn-grad {
  background: var(--v7-grad); color: #fff; font-weight: 800; letter-spacing: .4px;
  text-transform: uppercase; border-radius: 30px; box-shadow: 0 4px 14px rgba(31,200,155,.3);
  transition: all .15s; white-space: nowrap; border: none; cursor: pointer; display: inline-block;
  text-align: center; font-family: inherit;
}
.v7-btn-grad:hover { transform: translateY(-1px); color: #fff; }
.v7-header .v7-btn-grad { font-size: 12px; padding: 11px 18px; }

.v7-burger {
  background: transparent; border: 1.5px solid rgba(255,255,255,.22); border-radius: 11px;
  width: 42px; height: 42px; cursor: pointer; display: none; align-items: center; justify-content: center; flex-shrink: 0;
}
.v7-mobmenu { border-top: 1px solid rgba(255,255,255,.1); padding: 14px 18px 18px; display: none; flex-direction: column; gap: 4px; }
.v7-mobmenu.is-open { display: flex; }
.v7-mobmenu__link { color: var(--v7-on-dark-3); font-size: 15px; font-weight: 700; padding: 11px 6px; border-bottom: 1px solid rgba(255,255,255,.06); }
.v7-mobmenu__foot { display: flex; align-items: center; gap: 12px; margin-top: 12px; }

/* ── HERO ───────────────────────────────────────────────────── */
.v7-hero {
  background:
    radial-gradient(ellipse 110% 55% at 72% 0%, rgba(31,200,155,.26), transparent 55%),
    radial-gradient(ellipse 120% 55% at 50% 120%, rgba(31,200,155,.3), transparent 60%),
    var(--v7-ink);
  position: relative; overflow: hidden;
}
.v7-hero__dots {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    radial-gradient(circle 1px at 12% 22%, rgba(255,255,255,.55) 1px, transparent 1.5px),
    radial-gradient(circle 1px at 34% 10%, rgba(255,255,255,.3) 1px, transparent 1.5px),
    radial-gradient(circle 1.5px at 60% 16%, rgba(27,188,155,.7) 1.5px, transparent 2px),
    radial-gradient(circle 1px at 82% 9%, rgba(255,255,255,.4) 1px, transparent 1.5px),
    radial-gradient(circle 1px at 92% 30%, rgba(255,255,255,.28) 1px, transparent 1.5px);
}
.v7-hero__grid {
  max-width: 1200px; margin: 0 auto; padding: 72px 24px 80px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; position: relative;
}
.v7-hero__col { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.v7-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(159,232,210,.3); background: rgba(27,188,155,.1); color: var(--v7-mint-l);
  font-size: 11.5px; font-weight: 700; letter-spacing: .4px; padding: 6px 13px; border-radius: 30px;
}
.v7-h1 {
  margin: 0; color: #fff; font-size: 46px; line-height: 1.09; font-weight: 800;
  letter-spacing: -1.6px; max-width: 560px; text-wrap: balance;
}
.v7-h1 .grad {
  background: var(--v7-grad-l); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.v7-hero__sub { margin: 0; color: var(--v7-on-dark); font-size: 16.5px; line-height: 1.62; max-width: 500px; text-wrap: pretty; }
.v7-hero__cta { display: flex; gap: 12px; margin-top: 4px; flex-wrap: wrap; align-items: center; }
.v7-cta-primary {
  background: var(--v7-grad); color: #fff; font-size: 13.5px; font-weight: 800; letter-spacing: .5px;
  text-transform: uppercase; padding: 15px 28px; border-radius: 30px; box-shadow: 0 4px 14px rgba(31,200,155,.3); transition: all .15s;
}
.v7-cta-primary:hover { transform: translateY(-1px); color: #fff; }
.v7-cta-ghost {
  background: transparent; color: var(--v7-mint-l); font-size: 13.5px; font-weight: 800; letter-spacing: .5px;
  text-transform: uppercase; padding: 15px 28px; border-radius: 30px; border: 1.5px solid rgba(255,255,255,.25); transition: all .15s;
}
.v7-cta-ghost:hover { border-color: var(--v7-mint); color: var(--v7-mint-l); }
.v7-cta-text { color: var(--v7-on-dark-2); font-size: 13px; font-weight: 600; border-bottom: 1px dashed rgba(126,147,170,.5); padding-bottom: 1px; }
.v7-cta-text:hover { color: var(--v7-mint-l); }

/* hero product visual */
.v7-visual { position: relative; min-height: 430px; }
.v7-dash { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.14); border-radius: 18px; overflow: hidden; box-shadow: 0 30px 70px rgba(0,0,0,.45); }
.v7-dash__top { display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-bottom: 1px solid rgba(255,255,255,.1); }
.v7-dash__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--v7-mint); animation: nvBlink 1.6s infinite; }
.v7-dash__label { font-size: 12px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: #fff; }
.v7-dash__url { font-family: var(--v7-mono); font-size: 11.5px; color: var(--v7-on-dark-2); }
.v7-dash__body { display: grid; grid-template-columns: 118px 1fr; }
.v7-dash__nav { border-right: 1px solid rgba(255,255,255,.08); padding: 14px 12px; display: flex; flex-direction: column; gap: 7px; }
.v7-dash__navitem { font-size: 12px; font-weight: 700; padding: 8px 10px; border-radius: 8px; color: var(--v7-on-dark-2); }
.v7-dash__navitem.is-active { color: #fff; background: rgba(27,188,155,.16); }

.v7-map { position: relative; height: 196px; background: var(--v7-ink-3); }
.v7-map svg.roads { position: absolute; inset: 0; width: 100%; height: 100%; }
.v7-map__mover { position: absolute; width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--v7-ink); }
.v7-map__pin { position: absolute; left: 61%; top: 44%; width: 11px; height: 11px; border-radius: 50%; background: var(--v7-mint); border: 3px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,.5); }
.v7-map__pulse { position: absolute; left: 61%; top: 44%; width: 11px; height: 11px; border-radius: 50%; border: 2px solid rgba(27,188,155,.6); animation: nvPulse 2.4s infinite; }

.v7-phone { position: absolute; right: -6px; bottom: -26px; width: 126px; border-radius: 22px; overflow: hidden; border: 5px solid var(--v7-ink-2); box-shadow: 0 24px 50px rgba(0,0,0,.5); animation: nvFloat 5s ease-in-out infinite; }
.v7-phone img { width: 100%; display: block; }

.v7-float { position: absolute; background: #fff; border-radius: 12px; box-shadow: var(--v7-shadow-float); }
.v7-float--objects { left: -14px; top: 14px; padding: 10px 14px; display: flex; flex-direction: column; gap: 1px; animation: nvFloat 6s ease-in-out infinite; }
.v7-float--api { left: -22px; bottom: 96px; padding: 9px 13px; display: flex; align-items: center; gap: 9px; animation: nvFloat 7s ease-in-out infinite; }
.v7-float--migrate { left: 8px; bottom: 24px; padding: 9px 13px; display: flex; align-items: center; gap: 9px; background: var(--v7-ink); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 12px 30px rgba(0,0,0,.4); animation: nvFloat 8s ease-in-out infinite; }
.v7-float--models { right: 16px; top: -16px; padding: 9px 13px; display: flex; align-items: center; gap: 9px; animation: nvFloat 6.5s ease-in-out infinite; }
.v7-float__num { font-family: var(--v7-mono); font-weight: 700; color: var(--v7-text); }
.v7-float__num--lg { font-size: 17px; }
.v7-float__num--md { font-size: 15px; }
.v7-float__cap { font-size: 10.5px; color: var(--v7-muted); font-weight: 600; }
.v7-float__cap--dark { color: var(--v7-on-dark-3); font-size: 11px; font-weight: 700; }
.v7-float__cap--ink { color: var(--v7-text); font-size: 11px; font-weight: 700; }
.v7-dot-mint { width: 9px; height: 9px; border-radius: 50%; background: var(--v7-mint); flex-shrink: 0; }

/* trust strip */
.v7-trust { border-top: 1px solid rgba(255,255,255,.08); position: relative; }
.v7-trust__row { max-width: 1200px; margin: 0 auto; padding: 16px 24px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: center; }
.v7-trust__item { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 600; color: var(--v7-on-dark); }
.v7-trust__item .d { width: 5px; height: 5px; border-radius: 50%; background: var(--v7-mint); display: inline-block; }

/* ── PAGE HERO (SEO sub-pages, light bg) ────────────────────── */
.v7-page-hero { max-width: 1200px; margin: 0 auto; padding: 64px 24px 8px; }
.v7-page-hero__h1 { margin: 8px 0 0; font-size: 38px; font-weight: 800; letter-spacing: -1.2px; line-height: 1.1; text-wrap: balance; max-width: 720px; }
.v7-page-hero__sub { margin: 12px 0 0; color: var(--v7-muted); font-size: 16px; line-height: 1.6; max-width: 620px; text-wrap: pretty; }
.v7-page-hero__cta { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; align-items: center; }
.v7-cta-ghost--ink { color: var(--v7-mint-d); border-color: var(--v7-mint); }
.v7-cta-ghost--ink:hover { border-color: var(--v7-mint-d); color: var(--v7-mint-d); }
@media (max-width: 720px) {
  .v7-page-hero { padding-left: 18px; padding-right: 18px; }
  .v7-page-hero__h1 { font-size: 30px; }
}

/* ── SEO CONTENT PROSE (light pages) ────────────────────────── */
.v7-content { max-width: 820px; margin: 0 auto; padding: 24px 24px 8px; }
.v7-content > p:first-child { font-size: 17px; color: var(--v7-text); }
.v7-content h2 { font-size: 24px; font-weight: 800; letter-spacing: -.6px; line-height: 1.2; margin: 34px 0 10px; color: var(--v7-text); }
.v7-content p { font-size: 15.5px; line-height: 1.72; color: var(--v7-muted); margin: 0 0 14px; }
.v7-content ul { margin: 0 0 16px; padding-left: 20px; }
.v7-content li { font-size: 15.5px; line-height: 1.7; color: var(--v7-muted); margin-bottom: 7px; }
.v7-content a { color: var(--v7-mint-d); font-weight: 600; }
.v7-content a:hover { color: #0D6B59; }
.v7-content strong { color: var(--v7-text); font-weight: 700; }
@media (max-width: 720px) {
  .v7-content { padding-left: 18px; padding-right: 18px; }
  .v7-content h2 { font-size: 21px; }
}

/* ── HOW IT WORKS ───────────────────────────────────────────── */
.v7-how { max-width: 1200px; margin: 0 auto; padding: 80px 24px 30px; }
.v7-head-left { display: flex; flex-direction: column; gap: 10px; max-width: 580px; }
.v7-h2 { margin: 0; font-size: 33px; font-weight: 800; letter-spacing: -1px; text-wrap: balance; }
.v7-sec-note { margin: 0; color: var(--v7-muted); font-size: 15px; line-height: 1.6; }
.v7-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 34px; }
.v7-step { background: #fff; border: 1.5px solid rgba(0,0,0,.07); border-radius: 18px; padding: 24px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--v7-shadow-card); }
.v7-step__n { width: 30px; height: 30px; border-radius: 10px; background: var(--v7-grad); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; }
.v7-step__t { margin: 4px 0 0; font-size: 15.5px; font-weight: 800; letter-spacing: -.3px; }
.v7-step__p { margin: 0; color: var(--v7-muted); font-size: 13px; line-height: 1.55; }

/* ── PRICING ────────────────────────────────────────────────── */
.v7-pricing { max-width: 1200px; margin: 0 auto; padding: 64px 24px 30px; }
.v7-head-center { display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; }
.v7-sec-sub { margin: 0; color: var(--v7-muted); font-size: 14.5px; max-width: 520px; text-wrap: pretty; }
.v7-toggles { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 22px; flex-wrap: wrap; }
.v7-seg { display: flex; border: 1.5px solid rgba(0,0,0,.1); border-radius: 30px; overflow: hidden; background: #fff; }
.v7-seg__btn { border: none; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 800; padding: 10px 18px; background: transparent; color: var(--v7-muted); transition: all .15s; }
.v7-seg__btn.is-active { background: var(--v7-grad); color: #fff; }

.v7-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 30px; align-items: stretch; }
.v7-plan { background: #fff; border-radius: 18px; padding: 26px; position: relative; display: flex; flex-direction: column; border: 1.5px solid rgba(0,0,0,.07); box-shadow: var(--v7-shadow-card); }
.v7-plan--primary { border: 1.5px solid var(--v7-mint); box-shadow: 0 14px 40px rgba(27,188,155,.15); transform: scale(1.02); }
.v7-plan__badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--v7-grad); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; padding: 5px 14px; border-radius: 20px; white-space: nowrap; }
.v7-plan__name { font-size: 17px; font-weight: 800; letter-spacing: -.3px; }
.v7-plan__for { font-size: 12.5px; color: var(--v7-muted-2); margin-top: 3px; min-height: 34px; line-height: 1.4; }
.v7-plan__price-row { margin-top: 12px; display: flex; align-items: baseline; gap: 6px; }
.v7-plan__price { font-size: 30px; font-weight: 800; letter-spacing: -1px; white-space: nowrap; }
.v7-plan__unit { font-size: 12px; color: var(--v7-muted-2); font-weight: 600; }
.v7-plan__alt { font-size: 12px; color: var(--v7-muted-2); margin-top: 3px; min-height: 16px; }
.v7-plan__feats { display: flex; flex-direction: column; gap: 8px; margin: 16px 0 18px; flex: 1; }
.v7-feat-row { display: flex; align-items: flex-start; gap: 8px; }
.v7-feat-row svg { flex-shrink: 0; margin-top: 3px; }
.v7-feat-row span { font-size: 13px; color: var(--v7-muted); line-height: 1.5; }
.v7-plan__cta { display: block; text-align: center; font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 13px 20px; border-radius: 30px; transition: all .15s; background: transparent; color: var(--v7-mint-d); border: 1.5px solid var(--v7-mint); }
.v7-plan__cta:hover { transform: translateY(-1px); }
.v7-plan--primary .v7-plan__cta { background: var(--v7-grad); color: #fff; border: none; box-shadow: 0 4px 14px rgba(31,200,155,.3); }
.v7-pricing__foot { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 24px; }
.v7-pricing__trial { margin: 0; text-align: center; font-size: 13px; color: var(--v7-muted); font-weight: 600; max-width: 600px; line-height: 1.6; }
.v7-pricing__addons { font-size: 12.5px; color: var(--v7-mint-d); font-weight: 700; }
.v7-pricing__addons:hover { color: #0D6B59; }

/* ── MIGRATION ──────────────────────────────────────────────── */
.v7-migrate { max-width: 1200px; margin: 0 auto; padding: 40px 24px; }
.v7-migrate__card { background: radial-gradient(ellipse 120% 80% at 100% 0%, rgba(31,200,155,.16), transparent 60%), #fff; border: 1.5px solid var(--v7-mint); border-radius: 20px; padding: 38px 40px; display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.v7-migrate__left { flex: 1; min-width: 300px; display: flex; flex-direction: column; gap: 10px; }
.v7-migrate__h { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.7px; text-wrap: balance; }
.v7-migrate__p { margin: 0; color: var(--v7-muted); font-size: 15px; line-height: 1.6; max-width: 560px; text-wrap: pretty; }
.v7-migrate__right { flex: 1; min-width: 280px; display: flex; flex-direction: column; gap: 10px; }
.v7-check-row { display: flex; gap: 10px; flex-wrap: wrap; }
.v7-check-input { flex: 1; min-width: 200px; border: 1.5px solid rgba(0,0,0,.14); border-radius: 30px; padding: 13px 18px; font-family: inherit; font-size: 14px; outline: none; }
.v7-check-input:focus { border-color: var(--v7-mint); }
.v7-check-btn { background: var(--v7-ink); color: #fff; border: none; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 14px 24px; border-radius: 30px; white-space: nowrap; transition: all .15s; }
.v7-check-btn:hover { transform: translateY(-1px); }
.v7-check-result { font-size: 13px; color: var(--v7-mint-d); font-weight: 700; line-height: 1.5; }
.v7-check-hint { font-size: 12px; color: var(--v7-muted-2); line-height: 1.5; }
.is-hidden { display: none !important; }

/* ── PLATFORM FEATURES ──────────────────────────────────────── */
.v7-platform { max-width: 1200px; margin: 0 auto; padding: 40px 24px 30px; }
.v7-feat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px; }
.v7-feat { background: #fff; border: 1.5px solid rgba(0,0,0,.07); border-radius: 14px; padding: 18px 20px; display: flex; align-items: center; gap: 12px; box-shadow: 0 1px 3px rgba(15,17,23,.04); }
.v7-feat__ico { width: 34px; height: 34px; border-radius: 10px; background: var(--v7-mint-soft); flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; }
.v7-feat__t { margin: 0; font-size: 14px; font-weight: 800; letter-spacing: -.2px; }
.v7-feat__p { margin: 0; color: var(--v7-muted-2); font-size: 12px; line-height: 1.4; }

/* ── PARTNER TEASER ─────────────────────────────────────────── */
.v7-partner { max-width: 1200px; margin: 0 auto; padding: 40px 24px; }
.v7-partner__card { background: radial-gradient(ellipse 120% 80% at 15% 0%, rgba(31,200,155,.3), transparent 58%), var(--v7-ink); border-radius: 20px; padding: 44px; display: flex; align-items: center; gap: 30px; flex-wrap: wrap; overflow: hidden; }
.v7-partner__left { flex: 1; min-width: 300px; display: flex; flex-direction: column; gap: 12px; }
.v7-kicker--light { color: var(--v7-mint-l); }
.v7-partner__h { margin: 0; color: #fff; font-size: 28px; font-weight: 800; letter-spacing: -.7px; max-width: 520px; text-wrap: balance; }
.v7-partner__p { margin: 0; color: var(--v7-on-dark); font-size: 15px; line-height: 1.6; max-width: 560px; text-wrap: pretty; }

/* ── UKRAINE / GLOBAL ───────────────────────────────────────── */
.v7-global { max-width: 1200px; margin: 0 auto; padding: 40px 24px 30px; }
.v7-global__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; align-items: center; }
.v7-global__col { display: flex; flex-direction: column; gap: 12px; }
.v7-global__h { margin: 0; font-size: 30px; font-weight: 800; letter-spacing: -1px; text-wrap: balance; }
.v7-global__p { margin: 0; color: var(--v7-muted); font-size: 15px; line-height: 1.65; text-wrap: pretty; }
.v7-points { display: flex; flex-direction: column; gap: 10px; }
.v7-point { background: #fff; border: 1.5px solid rgba(0,0,0,.07); border-radius: 14px; padding: 16px 20px; display: flex; align-items: center; gap: 12px; box-shadow: 0 1px 3px rgba(15,17,23,.04); }
.v7-point span { font-size: 14px; color: var(--v7-text); font-weight: 600; }
.v7-point svg { flex-shrink: 0; }

/* ── SECURITY ───────────────────────────────────────────────── */
.v7-security { max-width: 1200px; margin: 0 auto; padding: 40px 24px 30px; }
.v7-badges { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 4px; }
.v7-badge { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; color: var(--v7-mint-d); background: var(--v7-mint-soft); border: 1px solid rgba(20,141,116,.2); padding: 7px 14px; border-radius: 30px; }
.v7-seccards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px; }
.v7-seccard { background: #fff; border: 1.5px solid rgba(0,0,0,.07); border-radius: 16px; padding: 24px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--v7-shadow-card); }
.v7-seccard__ico { width: 38px; height: 38px; border-radius: 11px; background: var(--v7-mint-soft); display: inline-flex; align-items: center; justify-content: center; }
.v7-seccard__t { margin: 2px 0 0; font-size: 16px; font-weight: 800; letter-spacing: -.3px; }
.v7-seccard__p { margin: 0; color: var(--v7-muted); font-size: 13px; line-height: 1.55; }

/* ── NGO ────────────────────────────────────────────────────── */
.v7-ngo { max-width: 1200px; margin: 0 auto; padding: 40px 24px 8px; }
.v7-ngo__card { background: radial-gradient(ellipse 120% 80% at 100% 0%, rgba(31,200,155,.14), transparent 60%), #fff; border: 1.5px solid rgba(20,141,116,.35); border-radius: 20px; padding: 30px 36px; display: flex; align-items: center; gap: 26px; flex-wrap: wrap; box-shadow: var(--v7-shadow-card); }
.v7-ngo__left { flex: 1; min-width: 280px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.v7-ngo__tag { font-size: 11px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; color: var(--v7-mint-d); background: var(--v7-mint-soft); padding: 5px 12px; border-radius: 20px; }
.v7-ngo__h { margin: 4px 0 0; font-size: 20px; font-weight: 800; letter-spacing: -.4px; text-wrap: balance; }
.v7-ngo__p { margin: 0; font-size: 13.5px; color: var(--v7-muted); line-height: 1.55; max-width: 620px; text-wrap: pretty; }
.v7-btn-ink { background: var(--v7-ink); color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 15px 28px; border-radius: 30px; white-space: nowrap; transition: all .15s; display: inline-block; }
.v7-btn-ink:hover { transform: translateY(-1px); color: #fff; }

/* ── FAQ ────────────────────────────────────────────────────── */
.v7-faq { max-width: 840px; margin: 0 auto; padding: 48px 24px 30px; }
.v7-faq__head { display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; margin-bottom: 26px; }
.v7-faq__list { display: flex; flex-direction: column; gap: 10px; }
.v7-faq__item { text-align: left; background: #fff; border: 1.5px solid rgba(0,0,0,.08); border-radius: 14px; padding: 18px 22px; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; gap: 8px; width: 100%; }
.v7-faq__q { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.v7-faq__q-text { font-size: 14.5px; font-weight: 800; color: var(--v7-text); letter-spacing: -.2px; }
.v7-faq__sign { font-size: 20px; font-weight: 700; color: var(--v7-mint-d); flex-shrink: 0; line-height: 1; }
.v7-faq__a { font-size: 13.5px; color: var(--v7-muted); line-height: 1.6; }

/* ── CLOSING CTA ────────────────────────────────────────────── */
.v7-close { max-width: 1200px; margin: 0 auto; padding: 40px 24px 72px; }
.v7-close__card { background: radial-gradient(ellipse 120% 80% at 50% 120%, rgba(31,200,155,.4), transparent 60%), var(--v7-ink); border-radius: 22px; padding: 54px 40px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; position: relative; overflow: hidden; }
.v7-close__dots { position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(circle 1px at 16% 30%, rgba(255,255,255,.5) 1px, transparent 1.5px), radial-gradient(circle 1.5px at 70% 24%, rgba(27,188,155,.8) 1.5px, transparent 2px), radial-gradient(circle 1px at 86% 50%, rgba(255,255,255,.4) 1px, transparent 1.5px); }
.v7-close__h { position: relative; margin: 0; color: #fff; font-size: 30px; font-weight: 800; letter-spacing: -.8px; max-width: 520px; text-wrap: balance; }
.v7-close__p { position: relative; margin: 0; color: var(--v7-on-dark); font-size: 15px; line-height: 1.6; max-width: 480px; text-wrap: pretty; }
.v7-close__cta { position: relative; display: flex; gap: 12px; margin-top: 6px; flex-wrap: wrap; justify-content: center; }
.v7-close__note { position: relative; margin: 6px 0 0; font-size: 12px; color: var(--v7-on-dark-2); max-width: 440px; line-height: 1.5; }

/* ── FOOTER ─────────────────────────────────────────────────── */
.v7-footer { background: var(--v7-ink); margin-top: auto; }
.v7-footer__row { max-width: 1200px; margin: 0 auto; padding: 34px 24px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.v7-footer__line { font-size: 12.5px; color: var(--v7-on-dark-2); max-width: 380px; line-height: 1.5; }
.v7-footer__link { font-size: 12.5px; color: var(--v7-mint-l); font-weight: 700; }

/* ── LEAD FORMS ─────────────────────────────────────────────── */
.v7-formsec { max-width: 1200px; margin: 0 auto; padding: 40px 24px; }
.v7-form-card {
  max-width: 760px; margin: 0 auto; background: #fff; border: 1.5px solid rgba(0,0,0,.08);
  border-radius: 20px; padding: 32px 34px; box-shadow: var(--v7-shadow-card);
}
.v7-form-card__head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.v7-form-card__h { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.5px; }
.v7-form-card__sub { margin: 0; color: var(--v7-muted); font-size: 14px; line-height: 1.55; }
.v7-form { display: flex; flex-direction: column; gap: 14px; }
.v7-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.v7-field { display: flex; flex-direction: column; gap: 6px; }
.v7-field--full { grid-column: 1 / -1; }
.v7-field label { font-size: 12.5px; font-weight: 700; color: var(--v7-text); }
.v7-field label .req { color: #C8472F; }
.v7-input, .v7-select, .v7-textarea {
  width: 100%; border: 1.5px solid rgba(0,0,0,.14); border-radius: 12px; padding: 12px 14px;
  font-family: inherit; font-size: 14px; color: var(--v7-text); background: #fff; outline: none;
  transition: border-color .15s; box-sizing: border-box;
}
.v7-input:focus, .v7-select:focus, .v7-textarea:focus { border-color: var(--v7-mint); }
.v7-textarea { resize: vertical; min-height: 96px; }
.v7-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235A6070' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
.v7-consent { display: flex; align-items: flex-start; gap: 9px; }
.v7-consent input { margin-top: 3px; width: 16px; height: 16px; flex-shrink: 0; accent-color: var(--v7-mint); }
.v7-consent label { font-size: 12px; color: var(--v7-muted); font-weight: 500; line-height: 1.5; }
.v7-consent a { color: var(--v7-mint-d); font-weight: 600; }
.v7-form__foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 4px; }
.v7-form__submit {
  background: var(--v7-grad); color: #fff; border: none; cursor: pointer; font-family: inherit;
  font-size: 13px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
  padding: 14px 30px; border-radius: 30px; box-shadow: 0 4px 14px rgba(31,200,155,.3); transition: transform .15s;
}
.v7-form__submit:hover { transform: translateY(-1px); }
.v7-form__note { font-size: 12px; color: var(--v7-muted-2); }
.v7-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.v7-form-flash { margin: 0 0 14px; padding: 12px 16px; border-radius: 12px; font-size: 13.5px; font-weight: 600; background: #FCEBEB; color: #A32D2D; border: 1px solid rgba(163,45,45,.2); }
@media (max-width: 720px) {
  .v7-formsec { padding-left: 18px; padding-right: 18px; }
  .v7-form-card { padding: 24px 20px; }
  .v7-form__grid { grid-template-columns: 1fr; }
}

/* ── MOBILE STICKY CTA ──────────────────────────────────────── */
.v7-mcta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; padding: 10px 16px; background: rgba(7,13,20,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid rgba(255,255,255,.1); gap: 10px; align-items: center; display: none; }
.v7-mcta__login { flex: 0 0 auto; color: var(--v7-mint-l); font-size: 12.5px; font-weight: 800; padding: 13px 18px; border: 1.5px solid rgba(255,255,255,.2); border-radius: 30px; }
.v7-mcta__cta { flex: 1; text-align: center; background: var(--v7-grad); color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 14px 18px; border-radius: 30px; }

/* ── RESPONSIVE (mock breakpoints: 980 / 720) ───────────────── */
@media (max-width: 980px) {
  .v7-hero__grid { grid-template-columns: 1fr; gap: 40px; }
  .v7-plans { grid-template-columns: 1fr; }
  .v7-feat-grid { grid-template-columns: 1fr 1fr; }
  .v7-seccards { grid-template-columns: 1fr; }
  .v7-global__grid { grid-template-columns: 1fr; }
  .v7-steps { grid-template-columns: 1fr 1fr; }
  .v7-h1 { font-size: 38px; }
  .v7-plan--primary { transform: none; }
}
@media (max-width: 720px) {
  .v7-header__bar .v7-nav,
  .v7-header__bar .v7-lang,
  .v7-header__bar .v7-login,
  .v7-header__bar .v7-btn-grad,
  .v7-visual { display: none !important; }
  .v7-feat-grid { grid-template-columns: 1fr; }
  .v7-steps { grid-template-columns: 1fr; }
  .v7-mcta { display: flex !important; }
  .v7-burger { display: inline-flex !important; }
  .v7-wrap.v7-pad { padding-bottom: 84px; }
  .v7-h1 { font-size: 32px; }
  .v7-sec, .v7-how, .v7-pricing, .v7-migrate, .v7-platform, .v7-partner, .v7-global, .v7-security, .v7-ngo, .v7-faq, .v7-close, .v7-hero__grid, .v7-header__bar, .v7-trust__row, .v7-footer__row { padding-left: 18px; padding-right: 18px; }
}