.geo-page {
  margin: 0;
  min-width: 320px;
  color: var(--color-text);
  background: var(--color-bg-card);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

.geo-page *, .geo-page *::before, .geo-page *::after { box-sizing: border-box; }
.geo-page img { display: block; max-width: 100%; height: auto; }
.geo-page h1, .geo-page h2, .geo-page h3, .geo-page h4 { margin: 0; color: var(--color-forest); font-weight: 800; letter-spacing: -0.025em; line-height: 1.08; text-wrap: balance; }
.geo-page p { margin: 0; }
.geo-page p, .geo-page li { text-wrap: pretty; }
.geo-page a:not(.geo-button) { color: inherit; }
.geo-page :focus-visible { outline: none; box-shadow: var(--landing-focus-ring); }

.geo-shell { width: min(100% - 36px, var(--landing-content-max)); margin-inline: auto; }
.geo-section { position: relative; overflow: clip; padding-block: var(--landing-section-space); }
.geo-section--tint { background: var(--color-lime-tint); border-block: 1px solid var(--color-border); }
.geo-section--dark { color: var(--color-text-inverse); background: var(--color-forest); }
.geo-section--bright { background: var(--color-lime); }
.geo-section--panel { margin-inline: var(--space-2); border: 1px solid var(--color-border); border-radius: var(--landing-section-radius); background: var(--color-bg-card); box-shadow: var(--landing-panel-shadow); }
.geo-section--dark h2, .geo-section--dark h3 { color: var(--color-text-inverse); }
.geo-section--dark .geo-kicker { color: var(--color-lime); }
.geo-section--dark .geo-lead { color: var(--color-forest-muted); }
.geo-section--bright .geo-kicker, .geo-section--bright .geo-lead { color: var(--color-lime-ink); }
.geo-kicker { margin-bottom: var(--space-3); color: var(--color-brand-text); font-size: 12px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.geo-section h2 { max-width: 850px; margin-bottom: var(--space-4); font-size: var(--landing-title-size); }
.geo-lead { max-width: 680px; color: var(--color-text-secondary); font-size: var(--landing-lead-size); }
.geo-center { text-align: center; }
.geo-center h2, .geo-center .geo-lead { margin-inline: auto; }

.geo-nav { position: sticky; top: 0; z-index: 80; display: flex; min-height: var(--landing-header-height); align-items: center; gap: var(--space-5); padding: var(--space-3) max(18px, calc((100vw - var(--landing-content-max)) / 2)); color: var(--color-text-inverse); background: var(--landing-overlay-dark); backdrop-filter: blur(14px) saturate(1.25); }
.geo-logo { display: inline-flex; align-items: center; gap: var(--space-2); flex: 0 0 auto; color: var(--color-text-inverse); font-size: 19px; font-weight: 900; text-decoration: none; }
.geo-logo img { width: 34px; height: 34px; }
.geo-nav .commerce-nav__links { display: flex; align-items: center; justify-content: center; gap: var(--space-5); margin-inline: auto; }
.geo-nav .commerce-nav__links > a { color: var(--color-forest-muted); font-size: 14px; font-weight: 700; text-decoration: none; transition: color var(--motion-duration-fast); }
.geo-nav .commerce-nav__links > a:hover { color: var(--color-text-inverse); }
.geo-nav__price { flex: 0 0 auto; color: var(--color-accent-warm-light); font-size: 14px; font-weight: 800; text-decoration: none; }
.geo-nav .nav-burger svg { color: var(--color-text-inverse); }
.geo-nav .nav-burger:hover { background: var(--landing-surface-inverse); }

.geo-hero { position: relative; overflow: clip; padding: 0 0 var(--landing-section-space); color: var(--color-text-inverse); background: var(--landing-hero-gradient); }
.geo-hero__art { height: clamp(390px, 55vw, 560px); margin: 0 0 clamp(-128px, -12vw, -86px); }
.geo-hero__art img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%; mask-image: linear-gradient(to bottom, black 0%, black 52%, color-mix(in srgb, black 52%, transparent) 80%, transparent 100%); }
.geo-hero__copy { position: relative; z-index: 1; margin-top: -118px; }
.geo-badge { display: inline-flex; align-items: center; gap: var(--space-2); padding: 7px 13px; border: 1px solid var(--landing-border-inverse); border-radius: var(--radius-pill); color: var(--color-matcha-light); background: color-mix(in srgb, var(--color-forest) 66%, transparent); font-size: 13px; font-weight: 800; backdrop-filter: blur(10px); }
.geo-badge svg { width: 13px; height: 13px; }
.geo-hero h1 { max-width: 15ch; margin: var(--space-5) 0 var(--space-4); color: var(--color-text-inverse); font-size: var(--landing-hero-size); text-shadow: var(--landing-dark-shadow); }
.geo-hero h1 em { color: var(--color-lime); font-style: normal; }
.geo-hero__sub { max-width: 46ch; color: var(--color-forest-muted); font-size: var(--landing-lead-size); }
.geo-actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); max-width: 470px; margin-top: var(--space-6); }
.geo-actions__label { max-width: 470px; margin-top: var(--space-2); color: var(--color-forest-muted); font-size: 12px; font-weight: 700; letter-spacing: 0.05em; text-align: right; }
.geo-button { display: inline-flex; min-height: 54px; align-items: center; justify-content: center; gap: var(--space-2); padding: 0 var(--space-5); border: 2px solid transparent; border-radius: var(--radius-medium); color: var(--color-text-inverse); background: var(--landing-forest-gradient); box-shadow: var(--landing-button-shadow); font-size: 15px; font-weight: 800; text-align: center; text-decoration: none; transition: transform var(--motion-duration-fast), box-shadow var(--motion-duration-fast), background var(--motion-duration-fast); }
.geo-button:hover { transform: translateY(-1px); box-shadow: var(--shadow-card-hover); }
.geo-button:active { transform: translateY(1px); }
.geo-button svg { width: 19px; height: 19px; flex: 0 0 auto; }
.geo-button--lime { color: var(--color-forest); background: var(--landing-lime-gradient); }
.geo-button--outline { border-color: var(--landing-border-inverse); color: var(--color-text-inverse); background: var(--landing-surface-inverse); box-shadow: none; }
.geo-button--warm { border-color: transparent; color: var(--color-accent-warm-ink); background: var(--landing-warm-gradient); box-shadow: var(--landing-warm-shadow); }
.geo-hero .geo-button { min-height: 58px; border-radius: var(--radius-card); font-size: 16px; }

.geo-demo { width: min(100%, 580px); margin-top: var(--space-8); padding: var(--space-4); border: 1px solid var(--landing-border-inverse); border-radius: var(--landing-card-radius); background: var(--landing-overlay-light); box-shadow: var(--landing-dark-shadow); color: var(--color-text); }
.geo-demo__head { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); color: var(--color-text-muted); font-size: 12px; font-weight: 700; }
.geo-demo__dots { display: flex; gap: 5px; }
.geo-demo__dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--color-border); }
.geo-demo__stage { position: relative; min-height: 164px; overflow: hidden; padding: var(--space-2); border-radius: var(--radius-medium); background: var(--color-bg-card); }
.geo-demo__scene { transform-origin: 20% 66%; transition: transform 1.1s var(--motion-ease-out); }
.geo-demo__message { margin-bottom: var(--space-2); padding: 10px 12px; border-radius: var(--radius-medium); font-size: 13px; opacity: 0; transform: translateY(5px); transition: opacity var(--motion-duration-medium), transform var(--motion-duration-medium); }
.geo-demo__message.is-visible { opacity: 1; transform: none; }
.geo-demo__message--question { background: var(--color-bg-dark); }
.geo-demo__message--answer { border: 1px solid var(--color-border); background: var(--color-lime-tint); }
.geo-demo__message--answer b { color: var(--color-brand-text); }
.geo-demo__typing { display: inline-flex; gap: 4px; }
.geo-demo__typing i { width: 5px; height: 5px; border-radius: 50%; background: var(--color-text-muted); animation: geo-pulse 900ms infinite alternate; }
.geo-demo__typing i:nth-child(2) { animation-delay: 150ms; }
.geo-demo__typing i:nth-child(3) { animation-delay: 300ms; }
.geo-demo__tag { position: absolute; right: var(--space-3); bottom: var(--space-3); padding: 5px 10px; border-radius: var(--radius-pill); color: var(--color-accent-warm-ink); background: var(--landing-warm-gradient); font-size: 11px; font-weight: 900; opacity: 0; transform: translateY(6px); transition: opacity var(--motion-duration-medium), transform var(--motion-duration-medium); }
.geo-demo__stage.is-zoomed .geo-demo__scene { transform: scale(1.18); }
.geo-demo__stage.is-zoomed .geo-demo__tag { opacity: 1; transform: none; }
.geo-demo__progress { height: 3px; margin-top: var(--space-2); overflow: hidden; border-radius: var(--radius-pill); background: var(--color-border); }
.geo-demo__progress i { display: block; width: 0; height: 100%; background: var(--color-lime); }
.geo-demo.is-playing .geo-demo__progress i { animation: geo-progress 11s linear both; }
.geo-demo__metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-2); margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--color-border); text-align: center; }
.geo-demo__metrics b { display: block; color: var(--color-forest); font-size: 16px; }
.geo-demo__metrics span { color: var(--color-text-muted); font-size: 11px; }
.geo-hero__tail { margin-top: var(--space-8); }
.geo-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.geo-chips span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 1px solid var(--landing-border-inverse); border-radius: var(--radius-pill); color: var(--color-forest-muted); background: var(--landing-surface-inverse); font-size: 13px; font-weight: 700; }
.geo-chips svg { width: 14px; height: 14px; color: var(--color-lime); }
.geo-hero__lead { max-width: 700px; margin-top: var(--space-4); color: var(--color-forest-muted); font-size: 16px; }

.geo-art { margin: var(--space-7) auto 0; }
.geo-art img { width: auto; max-height: 420px; margin-inline: auto; object-fit: contain; }
.geo-art--wide img { width: 100%; max-height: none; }
.geo-art--photo { overflow: hidden; border-radius: var(--landing-card-radius); }
.geo-art--photo img { width: 100%; max-height: 520px; object-fit: cover; }

.geo-stakes, .geo-values { display: grid; grid-auto-columns: minmax(250px, 78%); grid-auto-flow: column; gap: var(--space-3); margin: var(--space-7) -18px 0; padding: 0 18px var(--space-2); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.geo-stakes::-webkit-scrollbar, .geo-values::-webkit-scrollbar { display: none; }
.geo-stake, .geo-value { scroll-snap-align: start; }
.geo-stake { padding: var(--space-5); border: 1px solid var(--landing-border-inverse); border-radius: var(--radius-card); background: var(--landing-surface-inverse); }
.geo-stake__icon { display: block; margin-bottom: var(--space-3); font-size: 25px; pointer-events: none; }
.geo-stake h3 { margin-bottom: var(--space-2); font-size: 17px; }
.geo-stake p { color: var(--color-forest-subtle); font-size: 14px; }
.geo-stakes__summary { max-width: 62ch; margin: var(--space-7) auto 0; padding: var(--space-5); border: 1px solid color-mix(in srgb, var(--color-lime) 42%, transparent); border-radius: var(--radius-card); color: var(--color-text-inverse); background: var(--landing-overlay-dark); box-shadow: var(--landing-dark-shadow); font-size: 16px; }
.geo-stakes__summary strong { color: var(--color-accent-warm-light); }

.geo-value { padding: var(--space-5); border: 1px solid color-mix(in srgb, var(--color-forest) 12%, transparent); border-radius: var(--radius-card); background: var(--landing-surface-bright); box-shadow: var(--shadow-card); }
.geo-value__icon { display: grid; width: 46px; height: 46px; place-items: center; margin-bottom: var(--space-3); border-radius: var(--radius-element); color: var(--color-forest); background: var(--color-lime); }
.geo-value__icon svg { width: 23px; height: 23px; }
.geo-value h3 { margin-bottom: var(--space-2); font-size: 17px; }
.geo-value p { color: var(--color-lime-ink); font-size: 14px; }

@keyframes geo-pulse { to { opacity: 0.25; transform: translateY(-2px); } }
@keyframes geo-progress { to { width: 100%; } }

@media (min-width: 760px) {
  .geo-section--panel { margin-inline: var(--space-6); }
  .geo-hero__art { height: 560px; }
  .geo-hero__copy { margin-top: clamp(-260px, -20vw, -170px); }
  .geo-demo { margin-left: 0; }
  .geo-hero__tail { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--space-9); align-items: start; }
  .geo-hero__lead { margin-top: 0; }
  .geo-stakes, .geo-values { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-inline: 0; padding-inline: 0; overflow: visible; }
}

@media (min-width: 900px) {
  .geo-hero__tail { grid-template-columns: minmax(0, 1fr); }
  .geo-hero__lead { max-width: 62ch; margin-top: var(--space-4); }
}

@media (max-width: 980px) {
  .geo-nav { gap: var(--space-3); padding-inline: 18px; }
  .geo-nav__price { margin-left: auto; }
  .geo-nav .commerce-nav__links { margin-inline: 0; }
}

@media (max-width: 520px) {
  .geo-page { padding-bottom: calc(var(--landing-mobile-bar-height) + env(safe-area-inset-bottom, 0px)); }
  .geo-nav__price { display: none; }
  .geo-actions { grid-template-columns: 1fr; }
  .geo-actions__label { text-align: center; }
  .geo-hero__art { height: 390px; }
  .geo-hero__copy { margin-top: -170px; }
  .geo-hero h1 { font-size: 44px; }
  .geo-demo__stage { min-height: 184px; }
}

@media (prefers-reduced-motion: reduce) {
  .geo-page *, .geo-page *::before, .geo-page *::after { scroll-behavior: auto !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
}