/* ============================================================================
   cloud.css — THE ONE cloud-mount spec, shared by EVERY 3D weather mark in the
   estate: the home hero, every stage-hero page, the private line gate and the
   wallet landing. BOTH repos import this one file (the app via shell.css, the
   private line via its own <link> to a byte-identical synced copy), so the mount
   can never drift again — it replaced the twin .hero-symbol / .gate-3d copies
   that had silently diverged on the short-viewport ladder (2026-08-10).

   Every mount is  <div id="weatherMark3d" class="hero-symbol" ...>.  A surface
   adds ONLY its own layout class on top for grid placement (the app's
   .stage-hero--center .hero-symbol, the private line's .gate-3d, the wallet's
   .ob--landing .hero-symbol) — never the seat, size or ladder, which live here.
   Values are tokens (tokens.css), so seat + size stay single-sourced too.
   SYNC LAW: this file is byte-shared with line.rainyseason.cr/web/cloud.css
   — edit both together and bump each side's ?v.
   ============================================================================ */

.hero-symbol {
  /* Seat + size + ride — identical on every surface. The mark hugs --wx3d-seat
     under the hero's top edge (pad 24 + 48 = 72 = bar 64 + 8), stands --wx3d-h
     tall (THE ONE size knob), and rides the shared lift MINUS its own drop (a
     transform, so nothing else moves). */
  flex: none;
  width: 100%;
  height: var(--wx3d-h, min(38vh, 320px));
  margin-top: var(--wx3d-seat, 48px);
  transform: translateY(calc(-1 * var(--hero-lift, 55px) + var(--wx3d-drop, 44px)));
  z-index: 0;
  pointer-events: none;
}

/* GATE profile — the DEFAULT short-viewport ladder. A full-screen gate (the
   private line, the wallet landing) keeps a big cloud with one gentle step, so it
   never shrinks early. This is the base behaviour; marketing heroes override it
   below. */
@media (max-height: 700px) {
  .hero-symbol { height: min(33vh, 320px); }
}

/* MARKETING-HERO profile — stage heroes shrink the cloud EARLIER and harder,
   because their ladder is bound to the hero grid re-template (hero.css) so the
   floor row (CTA + curl) never loads past a short screen. Scoped to
   .stage-hero, so gates never inherit it; it out-specifies the gate default. */
@media (max-height: 740px) {
  .stage-hero .hero-symbol { height: min(30vh, 253px); }
}
@media (max-height: 600px) {
  .stage-hero .hero-symbol { height: min(26vh, 220px); }
}