:root {
  --radius: 0.625rem;
  --background: oklch(0.14 0.005 120);
  --foreground: oklch(0.97 0.005 100);
  --primary: oklch(0.9 0.2 125);
  --primary-foreground: oklch(0.15 0.02 125);
  --muted-foreground: oklch(0.72 0.008 110);
  --border: oklch(0.97 0 0 / 18%);
  --flight-surface: oklch(0.21 0.008 120);
  --flight-edge: oklch(0.38 0.012 120);
  --font-sans: "DM Sans", sans-serif;
  --font-display: "Barlow Condensed", sans-serif;
}

* { box-sizing: border-box; border-color: var(--border); }
html, body { margin: 0; font-family: var(--font-sans); letter-spacing: 0; background: var(--background); color: var(--foreground); }
button { font: inherit; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
button:disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }
button, a { -webkit-tap-highlight-color: transparent; }
svg { flex-shrink: 0; }

.brand { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-weight: 700; font-size: 27px; }
.brand-icon { width: 29px; height: 32px; color: var(--primary); }
.brand span { color: var(--primary); }

.cinema-ghost { background: transparent; color: var(--foreground); border: none; border-radius: 0; height: auto; padding: 8px 0; font-size: 12px; gap: 8px; }
.cinema-ghost:hover { color: var(--primary); }
.cinema-ghost:focus-visible { outline: 1px solid var(--primary); }

@keyframes content-enter { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

.flight-scroll { height: 900svh; position: relative; }
.flight-stage { position: fixed; inset: 0; overflow: hidden; background: var(--background); }
.flight-canvas { position: absolute; inset: 0; }
.flight-canvas canvas { display: block; width: 100%; height: 100%; }
.flight-loading { display: grid; place-items: center; height: 100%; font: 700 42px var(--font-display); color: var(--primary); }
.flight-header { position: absolute; top: 0; left: 5%; right: 5%; height: 95px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); }
.flight-header-actions { display: flex; align-items: center; gap: 22px; }
.legal-link { color: var(--muted-foreground); font-size: 12px; text-decoration: none; padding: 10px 0; }
.legal-link:hover, .legal-link:focus-visible { color: var(--primary); }
.flight-header-label { font-size: 10px; color: var(--muted-foreground); }
.flight-copy { position: absolute; top: 32%; left: 8%; width: 38%; pointer-events: none; animation: content-enter .65s ease both; }
.flight-kicker { font-size: 10px; color: var(--muted-foreground); display: flex; align-items: center; gap: 12px; margin: 0 0 25px; }
.flight-kicker > span { width: 24px; height: 2px; background: var(--primary); }
.flight-kicker b { font-weight: 400; }
.flight-copy h1 { font-family: var(--font-display); font-size: 88px; line-height: 1; margin: 0; font-weight: 600; white-space: pre-line; }
.flight-copy h1 > span { display: block; }
.flight-copy h1 > span:first-child:not(:last-child) { margin-bottom: 8px; }
.flight-copy h1 .flight-accent, .flight-copy h1 > span:only-child { color: var(--primary); }
.flight-copy h1 > span:only-child { font-size: 76px; }
.flight-subtitle { font-size: 13px; line-height: 1.8; color: var(--muted-foreground); max-width: 280px; margin: 26px 0; }
.flight-enter { pointer-events: auto; gap: 25px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.flight-enter b { font-weight: 500; }
.flight-screen-label { position: absolute; right: 8%; bottom: 15%; font-size: 11px; color: var(--foreground); }
.flight-screen-label span { display: block; font-size: 8px; margin-top: 7px; color: var(--muted-foreground); }
.flight-footer { position: absolute; bottom: 0; left: 5%; right: 5%; height: 100px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--border); }
.flight-footer-brand { font-size: 9px; color: var(--muted-foreground); }
.flight-stops { display: flex; align-items: center; gap: 12px; }
.flight-stops .cinema-ghost { flex-direction: column; gap: 14px; padding: 12px 0; width: 52px; color: var(--muted-foreground); }
.flight-stop-line { width: 100%; height: 2px; background: var(--flight-edge); }
.flight-stops [aria-current="true"] { color: var(--primary); }
.flight-stops [aria-current="true"] .flight-stop-line { background: var(--primary); }
.flight-stops small { font-size: 9px; }
.flight-controls { display: flex; align-items: center; gap: 15px; font-size: 10px; color: var(--muted-foreground); }
.flight-controls .cinema-ghost { padding: 12px; }

.flight-header, .flight-footer, .flight-copy, .flight-screen-label { z-index: 2; }
.soon-overlay { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; text-align: center; opacity: 0; pointer-events: none; background: radial-gradient(ellipse at center, oklch(0.2 0.02 125), var(--background) 70%); }
.soon-kicker { display: flex; align-items: center; justify-content: center; gap: 12px; font-size: 11px; color: var(--muted-foreground); margin: 0 0 18px; letter-spacing: .15em; }
.soon-kicker > span { width: 24px; height: 2px; background: var(--primary); }
.soon-overlay h2 { font-family: var(--font-display); font-size: clamp(64px, 16vw, 220px); line-height: .95; margin: 0; font-weight: 700; color: var(--primary); }
.soon-text { font-size: 14px; line-height: 1.8; color: var(--muted-foreground); max-width: 360px; margin: 24px auto 0; padding: 0 20px; }
.soon-overlay { grid-template-rows: 1fr auto; grid-template-columns: minmax(0, 1fr); }
.soon-overlay > div { align-self: center; }
.soon-legal { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; padding: 0 20px 120px; font-size: 12px; }
.soon-legal a { color: var(--muted-foreground); text-decoration: none; padding: 6px 0; }
.soon-legal a:hover, .soon-legal a:focus-visible { color: var(--primary); }
.soon-cta { display: inline-block; box-sizing: border-box; max-width: calc(100% - 40px); margin-top: 26px; padding: 14px 26px; border-radius: 12px; background: var(--primary); color: var(--background); font-weight: 700; letter-spacing: .06em; text-decoration: none; }
.soon-cta:focus-visible { outline: 2px solid var(--foreground); outline-offset: 3px; }
@media (min-width: 1600px) { .flight-copy h1 { font-size: 108px; } .flight-copy h1 > span:only-child { font-size: 96px; } }
@media (max-width: 900px) { .flight-copy { left: 5%; } .flight-copy h1 { font-size: 68px; } .flight-footer-brand { display: none; } }
@media (max-width: 600px) {
  .brand { font-size: 23px; gap: 6px; }
  .brand-icon { width: 23px; }
  .flight-header { height: 72px; }
  .flight-header-label { display: none; }
  .flight-header-actions { gap: 10px; }
  .legal-link { font-size: 11px; }
  .flight-copy { top: 88px; left: 6%; width: 88%; }
  .flight-kicker { font-size: 8px; margin-bottom: 12px; }
  .flight-copy h1 { font-size: 42px; }
  .flight-copy h1 > span { display: inline; }
  .flight-copy h1 > span:first-child:not(:last-child) { margin-right: 8px; }
  .flight-copy h1 > span:only-child { display: block; font-size: 36px; margin-top: 5px; }
  .flight-copy h1 br { display: inline; }
  .flight-copy h1 br::after { content: " "; }
  .flight-subtitle { font-size: 10px; max-width: 260px; margin: 10px 0; }
  .flight-enter { display: none; }
  .flight-screen-label { display: none; }
  .flight-footer { height: 80px; gap: 12px; }
  .flight-stops { gap: 8px; flex: 1; }
  .flight-stops .cinema-ghost { width: 25px; gap: 10px; }
  .flight-controls { gap: 2px; }
  .flight-controls .cinema-ghost { padding: 8px; }
}
/* Telemóveis baixos (ex.: iPhone SE) ou com a barra do browser aberta: menos texto em cima, mais ecrã. */
@media (max-width: 600px) and (max-height: 720px) {
  .flight-copy { top: 80px; }
  .flight-copy h1 { font-size: 34px; }
  .flight-copy h1 > span:only-child { font-size: 30px; }
  .flight-footer { height: 68px; }
}
/* Telemóvel deitado: o texto fica à esquerda e o ecrã à direita (como no computador). */
@media (max-height: 500px) and (orientation: landscape) {
  .flight-header { height: 60px; }
  .flight-footer { height: 60px; }
  .flight-copy { top: 76px; width: 44%; }
  .flight-kicker { margin-bottom: 10px; }
  .flight-copy h1 { font-size: 34px; }
  .flight-copy h1 > span:only-child { font-size: 30px; }
  .flight-subtitle, .flight-enter { display: none; }
}
@media (prefers-reduced-motion: reduce) { .flight-copy { animation: none; } }