/*
 * Lead Gen by MakeItScale: styles only this page needs (the globe, the "Built for" chips, package cards, the
 * calculator's result tiles). Loaded after the shared assets/styles.css and uses its tokens only; nothing here
 * touches styles.css. No glow: strokes and flat fills only, no blur filters, no radial colour washes.
 */

/* ---------- hero globe ---------- */
.hero-globe { width: 320px; max-width: 100%; margin: 52px auto 0; }
.hero-globe svg { display: block; width: 100%; height: auto; }
.globe-outline { fill: none; stroke: var(--sky); stroke-opacity: .55; stroke-width: 1.3; }
.globe-par { fill: none; stroke: var(--sky); stroke-opacity: .28; stroke-width: 1; }
.globe-mer { fill: none; stroke: var(--sky); stroke-opacity: .4; stroke-width: 1.1; transform-origin: 160px 160px; animation: globeSpin 8s linear infinite; }
.globe-dot-s { fill: var(--white); fill-opacity: .5; }
.globe-orbit-path { fill: none; stroke: var(--white); stroke-opacity: .22; stroke-width: 1; }
.globe-dot { fill: var(--sky); animation: globeOrbit 9s linear infinite; }
.globe-leader { stroke: var(--white); stroke-opacity: .45; stroke-width: 1; }
.globe-leader-pt { fill: var(--white); fill-opacity: .7; }
.globe-tag { font-size: 12.5px; font-weight: 600; fill: var(--white); }
.globe-caption { margin-top: 16px; text-align: center; font-size: 13px; color: var(--muted); }
@media (max-width: 640px) { .hero-globe { width: 240px; } }

@keyframes globeSpin {
  0% { transform: scaleX(1); }
  25% { transform: scaleX(0); }
  50% { transform: scaleX(-1); }
  75% { transform: scaleX(0); }
  100% { transform: scaleX(1); }
}
@keyframes globeOrbit {
  0% { transform: translate(142.7px, 46.4px); }
  8.33% { transform: translate(115.1px, 66.3px); }
  16.67% { transform: translate(56.6px, 68.5px); }
  25% { transform: translate(-17px, 52.3px); }
  33.33% { transform: translate(-86.1px, 22.1px); }
  41.67% { transform: translate(-132.1px, -14px); }
  50% { transform: translate(-142.7px, -46.4px); }
  58.33% { transform: translate(-115.1px, -66.3px); }
  66.67% { transform: translate(-56.6px, -68.5px); }
  75% { transform: translate(17px, -52.3px); }
  83.33% { transform: translate(86.1px, -22.1px); }
  91.67% { transform: translate(132.1px, 14px); }
  100% { transform: translate(142.7px, 46.4px); }
}

/* ---------- "Built for" chips ---------- */
.builtfor { margin-top: 36px; text-align: center; }
.builtfor-label { display: block; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 13px; }
.builtfor-list { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; max-width: 740px; margin: 0 auto; padding: 0; }
.svc-chip { display: inline-flex; align-items: center; font-size: 13px; font-weight: 500; color: var(--text); background: var(--glass); border: 1px solid var(--line); border-radius: 999px; padding: 7px 14px; }

/* ---------- package cards (#packages) ---------- */
.pkg-card .pkg-price { font-size: clamp(30px, 3.6vw, 40px); font-weight: 800; letter-spacing: -.03em; color: var(--white); font-variant-numeric: tabular-nums; line-height: 1.1; margin: 14px 0 6px; }
.pkg-card .pkg-price small { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--muted); white-space: nowrap; }
.pkg-card .pkg-hint { font-size: 14px; color: var(--muted); font-weight: 300; }
.includes-wrap { margin-top: 52px; text-align: center; }
.includes-wrap h3 { margin-bottom: 24px; }
.includes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px 30px; max-width: 760px; margin: 0 auto; text-align: left; }
.includes li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, .78); font-weight: 300; }
.includes li i { color: var(--sky); font-size: 18px; flex: none; margin-top: 2px; }
.includes-wrap .btn { margin-top: 40px; }
@media (max-width: 680px) { .includes { grid-template-columns: 1fr; } }

/* ---------- calculator results (#calculator .calc-out) ---------- */
.result-verdict { margin-top: 16px; font-size: 15.5px; line-height: 1.65; color: rgba(255, 255, 255, .86); }
.result-disclaimer { margin-top: 14px; font-size: 12.5px; color: var(--muted); }