:root{
  --aw-hero-sky:#C6ECFF;
  --aw-hero-purple:var(--purple,#5522b0);
  --aw-hero-black:#07090c;
  --aw-hero-cycle:60s;
  --aw-motion-cycle:60s;
  --aw-plane-final-x:clamp(150px,12.5vw,240px);
  --aw-plane-final-y:clamp(-108px,-5vw,-78px);
}

/* =========================================================
   HERO SHELL
========================================================= */
.aw-journey-hero{
  position:relative;
  width:100vw;
  max-width:none;
  min-height:100svh !important;
  margin:0 calc(50% - 50vw);
  padding:0 !important;
  display:block !important;
  overflow:hidden !important;
  isolation:isolate;
  background:var(--aw-hero-sky) !important;
  color:#000;
  text-align:center;
}

.aw-journey-stage{
  --hero-ground-line:0px;
  --left-passenger-travel:clamp(228px,18vw,312px);
  --right-passenger-start:clamp(-118px,-7.2vw,-82px);
  --right-passenger-end:clamp(2px,0.25vw,6px);
  position:relative;
  width:100%;
  height:clamp(560px,calc(100svh - 68px),760px);
  min-height:560px;
  display:grid;
  grid-template-columns:30% 40% 30%;
  overflow:visible !important;
  background:var(--aw-hero-sky);
  cursor:default;
  outline:none;
}

.aw-journey-stage:focus-visible{
  outline:3px solid var(--yellow,#f4c542);
  outline-offset:-4px;
}

/* Full-width 1px baseline directly under the graphics. */
.aw-journey-stage::after{
  content:"";
  position:absolute;
  z-index:100;
  left:0;
  right:0;
  bottom:0;
  border-top:1px solid #000;
  pointer-events:none;
}

.aw-journey-stage img{
  display:block;
  max-width:none;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
}

/* =========================================================
   SOUND BUTTON
========================================================= */
.aw-sound-toggle{
  position:absolute;
  z-index:1200;
  top:clamp(16px,2.4vw,24px);
  right:clamp(16px,2.2vw,28px);
  min-height:40px;
  padding:8px 13px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(8,41,71,.22);
  border-radius:999px;
  background:rgba(255,255,255,.82);
  color:#66727b;
  font:600 13px/1 "Montserrat",Arial,Helvetica,sans-serif;
  box-shadow:0 7px 18px rgba(8,41,71,.10);
  backdrop-filter:blur(4px);
  cursor:pointer;
}
.aw-sound-toggle:hover{background:#fff}
.aw-sound-toggle[aria-pressed="true"]{color:#777f86;background:rgba(255,255,255,.74)}
.aw-sound-toggle__icon{font-size:13px;letter-spacing:-2px}

/* =========================================================
   HERO GRAPHICS
========================================================= */
.aw-hero-group{
  position:relative;
  min-width:0;
  height:100%;
  overflow:visible;
  pointer-events:none;
  visibility:visible !important;
}
.aw-hero-group--left{grid-column:1;z-index:5}
.aw-hero-group--center{grid-column:2;z-index:7}
.aw-hero-group--right{grid-column:3;z-index:5}

.aw-airport-cluster{
  position:absolute;
  z-index:6;
  inset:0;
  pointer-events:none;
  opacity:1 !important;
  visibility:visible !important;
}

.aw-terminal-wrap,
.aw-tower-wrap,
.aw-plane-wrap,
.aw-passenger-wrap{
  position:absolute;
  transform-box:border-box;
  transform-origin:center bottom;
}

.aw-terminal-wrap{z-index:4;width:clamp(88px,6.2vw,114px)}
.aw-terminal{width:100%;height:auto;opacity:1 !important;visibility:visible !important}
.aw-tower-wrap{z-index:5;width:clamp(18px,1.42vw,26px)}
.aw-tower{width:100%;height:auto;opacity:1 !important;visibility:visible !important}
.aw-plane-wrap{z-index:2;width:clamp(40px,3vw,58px);transform-origin:center}
.aw-plane{width:100%;height:auto}
.aw-passenger-wrap{z-index:6;width:clamp(24px,1.9vw,34px)}
.aw-passenger{width:100%;height:auto}
.aw-passenger--toward-terminal{transform:scaleX(1);transform-origin:center}

/* Left airport. Negative bottom values intentionally let the artwork meet the line. */
.aw-airport-cluster--left .aw-tower-wrap{
  left:auto;
  right:64%;
  bottom:-11px;
}
.aw-airport-cluster--left .aw-terminal-wrap{
  left:auto;
  right:39%;
  bottom:-4px;
}
.aw-airport-cluster--left .aw-passenger-wrap{
  left:auto;
  right:37%;
  bottom:-5px;
  z-index:3;
}
.aw-airport-cluster--left .aw-plane-wrap{
  left:auto;
  right:calc(39% + 28px);
  bottom:14px;
}
.aw-airport-cluster--left .aw-plane{
  transform:rotate(20deg);
  transform-origin:center;
}

/* Right airport. */
.aw-airport-cluster--right .aw-passenger-wrap{
  left:20%;
  bottom:-5px;
  z-index:3;
}
.aw-airport-cluster--right .aw-terminal-wrap{
  left:39%;
  bottom:-4px;
}
.aw-airport-cluster--right .aw-tower-wrap{
  left:64%;
  bottom:-11px;
}
.aw-airport-cluster--right .aw-plane-wrap{
  left:calc(39% + 28px);
  bottom:14px;
}

.aw-city-center{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:-1px;
  width:clamp(540px,42.15vw,780px);
  overflow:visible;
  background:var(--aw-hero-sky);
  transform:translateX(-50%);
  opacity:1 !important;
  visibility:visible !important;
}
.aw-city-skyline{
  position:relative;
  z-index:1;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center bottom;
  opacity:1 !important;
  visibility:visible !important;
}

.aw-cloud,.aw-hero-clouds{display:none !important}

/* =========================================================
   DISCOVER / BETWEEN FLIGHTS FLIPBOARDS
========================================================= */
.aw-journey-copy{
  position:absolute;
  z-index:8;
  inset:0;
  width:100%;
  pointer-events:none;
  white-space:normal;
}

.aw-journey-title-stack{
  position:absolute;
  top:clamp(58px,9.2svh,82px);
  left:50%;
  display:grid;
  justify-items:center;
  gap:2px;
  transform:translateX(-50%);
}

.aw-journey-title{
  position:static;
  width:auto;
  margin:0;
  line-height:1;
  transform:none;
}

.aw-title-board{
  display:block;
  width:min(59vw,950px);
  max-width:92vw;
  height:auto;
  margin:0 auto;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  transform-origin:center;
  backface-visibility:hidden;
  filter:none;
}

/* Small deliberate gap under DISCOVER THE WORLD. */
.aw-journey-title-secondary{
  margin-top:8px;
  opacity:0;
  visibility:hidden;
  transition:opacity .85s ease;
}
.aw-journey-title-secondary.is-visible{
  opacity:1;
  visibility:visible;
}
.aw-title-board--between{
  display:block;
  width:min(59vw,950px);
  max-width:92vw;
  height:auto;
}
.aw-journey-subtitle{display:none !important}

/* =========================================================
   STABLE CENTERED TYPEWRITER
========================================================= */

.aw-type-prompt{
  position:absolute;
  top:55%;
  left:50%;
  width:min(1100px,94vw);
  height:150px;
  min-height:150px;
  margin:0;
  transform:translate(-50%,-50%);
  text-align:center;
  pointer-events:none;
}

.aw-type-line,
.aw-type-line--one,
.aw-type-line--two,
.aw-type-line--three{
  position:absolute;
  left:0;
  right:0;
  top:50%;

  width:100%;
  height:140px;

  margin:0;
  padding:0;

  display:flex;
  align-items:center;
  justify-content:center;

  transform:translateY(-50%);

  color:#fff;

  font-family:"Allura","Segoe Script","Brush Script MT",cursive;
  font-size:clamp(88px,7.4vw,132px);
  font-style:normal;
  font-weight:400;
  line-height:1;

  letter-spacing:0;
  text-align:center;
  white-space:nowrap;

  opacity:1;

  transition:
    opacity 1.2s ease,
    filter 1.2s ease;

  text-shadow:0 1px 2px rgba(8,41,71,.14);
}

/* Smooth disappearance */
.aw-type-line.is-hiding{
  opacity:0;
  filter:blur(2px);
}

/* Preserve exactly the same layout while typing */
.aw-typed-copy{
  display:inline-block;
  line-height:1;
}

.aw-brand-aero,
.aw-brand-wander{
  color:#fff !important;
  font-family:"Allura","Segoe Script","Brush Script MT",cursive !important;
  font-size:inherit !important;
  font-style:normal !important;
  font-weight:400 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  animation:none !important;
}

/* Cursor stays in the DOM so text does not jump when typing finishes */
.aw-type-cursor{
  display:inline-block;
  flex:0 0 2px;

  width:2px;
  height:.72em;

  margin-left:.07em;

  background:#fff;
  vertical-align:middle;

  animation:aw-cursor 1.45s steps(1,end) infinite;
}

/* Don't use display:none here — that was contributing to the jump */
.aw-type-line.is-complete .aw-type-cursor{
  opacity:0;
  animation:none;
}

@keyframes aw-cursor{
  0%,49%{opacity:1}
  50%,100%{opacity:0}
}

/* =========================================================
   STATUS FLIPBOARDS
========================================================= */
.aw-status-strip{
  --aw-status-left-midpoint:13.8%;
  --aw-status-right-midpoint:86%;
  position:relative;
  z-index:10;
  width:100%;
  height:48px;
  margin:0;
  padding:0;
  background:var(--aw-hero-sky);
  pointer-events:none;
}
.aw-status-slot{
  position:absolute;
  top:1px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  transform:translateX(-50%);
}
.aw-status-slot--left{left:var(--aw-status-left-midpoint)}
.aw-status-slot--center{left:50%}
.aw-status-slot--right{left:var(--aw-status-right-midpoint)}
.aw-status-board{
  display:block;
  width:auto;
  height:42px;
  max-width:29vw;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  backface-visibility:hidden;
  filter:none;
}

/* =========================================================
   MOTION TIMING
========================================================= */
.aw-journey-stage.is-playing .aw-airport-cluster--left .aw-plane-wrap{
  animation:aw-left-plane var(--aw-motion-cycle) linear 1 both;
}
.aw-journey-stage.is-playing .aw-airport-cluster--left .aw-passenger-wrap{
  animation:aw-left-passenger var(--aw-motion-cycle) linear 1 both;
}
.aw-journey-stage.is-playing .aw-airport-cluster--right .aw-passenger-wrap{
  animation:aw-right-passenger var(--aw-motion-cycle) linear 1 both;
}
.aw-journey-stage.is-playing .aw-airport-cluster--right .aw-plane-wrap{
  animation:aw-right-plane var(--aw-motion-cycle) linear 1 both;
}

@keyframes aw-left-plane{
  0%{opacity:0;transform:translate(-390px,-118px) rotate(18deg) scale(.98)}
  .8%{opacity:1;transform:translate(-360px,-110px) rotate(18deg) scale(.98)}
  10.6%{opacity:1;transform:translate(0,0) rotate(18deg) scale(.98)}
  11.4%,100%{opacity:0;transform:translate(0,0) rotate(18deg) scale(.98)}
}

@keyframes aw-left-passenger{
  0%,11.65%{opacity:0;transform:translateX(8px)}
  11.67%{opacity:1;transform:translateX(8px)}
  19.15%{opacity:1;transform:translateX(var(--left-passenger-travel))}
  19.55%,100%{opacity:0;transform:translateX(var(--left-passenger-travel))}
}

@keyframes aw-right-passenger{
  0%,39.98%{opacity:0;transform:translateX(var(--right-passenger-start))}
  40%{opacity:1;transform:translateX(var(--right-passenger-start))}
  52.4%{opacity:1;transform:translateX(var(--right-passenger-end))}
  52.75%,100%{opacity:0;transform:translateX(var(--right-passenger-end))}
}

@keyframes aw-right-plane{

  /* hidden until departure begins */
  0%,53.32%{
    opacity:0;
    transform:
      translate(0,0)
      rotate(-18deg)
      scale(.98);
  }

  /* plane appears at terminal */
  53.34%{
    opacity:1;
    transform:
      translate(0,0)
      rotate(-18deg)
      scale(.98);
  }

  /* continue flying completely off right side */
  66.30%{
    opacity:1;
    transform:
      translate(65vw,-180px)
      rotate(-18deg)
      scale(.98);
  }

  /* disappear once outside viewport */
  66.67%,100%{
    opacity:0;
    transform:
      translate(65vw,-180px)
      rotate(-18deg)
      scale(.98);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */
@media(max-width:1100px){
  .aw-journey-stage{grid-template-columns:28% 44% 28%}
  .aw-city-center{width:clamp(470px,50vw,620px)}
  .aw-title-board{width:min(72vw,920px)}
  .aw-status-strip{--aw-status-left-midpoint:13.3%;--aw-status-right-midpoint:86.7%}
}

@media(max-width:760px){
  .aw-journey-hero{min-height:620px !important}
  .aw-journey-stage{
    --left-passenger-travel:clamp(108px,34vw,164px);
    --right-passenger-start:clamp(-86px,-18vw,-60px);
    --right-passenger-end:clamp(0px,0.2vw,4px);
    --aw-plane-final-x:clamp(72px,20vw,120px);
    --aw-plane-final-y:clamp(-72px,-11vw,-48px);
    height:560px;
    min-height:560px;
    display:block;
  }

  .aw-hero-group--center{position:absolute;z-index:4;inset:0;width:100%;height:100%}
  .aw-hero-group--left,.aw-hero-group--right{position:absolute;z-index:6;bottom:0;width:50%;height:118px}
  .aw-hero-group--left{left:0}
  .aw-hero-group--right{right:0}
  .aw-city-center{width:min(74vw,390px)}

  .aw-journey-title-stack{top:70px;gap:2px}
  .aw-title-board--discover,
  .aw-title-board--between{width:min(92vw,720px)}
  .aw-journey-title-secondary{margin-top:6px}

  .aw-type-prompt{
    width:min(96vw,660px);
    height:135px;
    min-height:135px;
  }
  .aw-type-line,
  .aw-type-line--one,
  .aw-type-line--two,
  .aw-type-line--three{
    font-size:clamp(56px,12vw,82px);
  }

  .aw-terminal-wrap{width:clamp(68px,22vw,96px)}
  .aw-tower-wrap{width:clamp(16px,4.8vw,22px)}
  .aw-plane-wrap{width:clamp(34px,10vw,48px)}
  .aw-passenger-wrap{width:clamp(22px,6vw,30px)}

  .aw-airport-cluster--left .aw-tower-wrap{left:auto;right:65%;bottom:-8px}
  .aw-airport-cluster--left .aw-terminal-wrap{left:auto;right:33%;bottom:-2px}
  .aw-airport-cluster--left .aw-passenger-wrap{left:auto;right:31%;bottom:-5px;z-index:3}
  .aw-airport-cluster--left .aw-plane-wrap{right:calc(33% + 18px)}

  .aw-airport-cluster--right .aw-passenger-wrap{left:12%;bottom:-5px}
  .aw-airport-cluster--right .aw-terminal-wrap{left:33%;bottom:-4px}
  .aw-airport-cluster--right .aw-tower-wrap{left:65%;bottom:-11px}
  .aw-airport-cluster--right .aw-plane-wrap{left:calc(33% + 18px)}

  .aw-status-strip{
    --aw-status-left-midpoint:22%;
    --aw-status-right-midpoint:78%;
    height:42px;
  }
  .aw-status-board{height:35px;max-width:30vw}
  .aw-sound-toggle{top:10px;right:10px;min-height:34px;padding:6px 9px}
  .aw-sound-toggle__label{display:none}
}

@media(prefers-reduced-motion:reduce){
  .aw-journey-stage *{animation:none !important;transition:none !important}
  .aw-city-center,
  .aw-terminal-wrap,
  .aw-tower-wrap{opacity:1 !important;visibility:visible !important}
  .aw-passenger-wrap,
  .aw-plane-wrap{opacity:0 !important}
  .aw-journey-title-secondary{opacity:1 !important;visibility:visible !important}
}

/* =========================================================
   AUGUST 2026 FINAL HERO FRAME + ZOOM COHERENCE
   All hero artwork now shares one bounded coordinate frame.
========================================================= */
:root{
  --aw-layout-max:1420px;
  --aw-layout-gutter:clamp(18px,4vw,64px);
}

.aw-journey-hero{
  width:100% !important;
  max-width:none !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
}

.aw-journey-stage,
.aw-status-strip{
  width:min(calc(100% - (2 * var(--aw-layout-gutter))), var(--aw-layout-max)) !important;
  max-width:var(--aw-layout-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

@media(min-width:761px){
  .aw-journey-stage{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:16 / 6.65;
  }

  /* Size these against the shared center column, not the viewport. */
  .aw-journey-title-stack{
    width:min(900px,225%) !important;
  }
  .aw-journey-title{
    width:100% !important;
  }
  .aw-title-board,
  .aw-title-board--discover,
  .aw-title-board--between{
    width:100% !important;
    max-width:100% !important;
  }
  .aw-city-center{
    width:min(780px,190%) !important;
  }
  .aw-type-prompt{
    width:min(1100px,250%) !important;
  }
}

/* Sound control aligns with the right edge of the same content frame. */
.aw-sound-toggle{
  right:max(var(--aw-layout-gutter), calc((100% - var(--aw-layout-max)) / 2)) !important;
}

@media(max-width:760px){
  :root{--aw-layout-gutter:16px;}
  .aw-journey-stage,
  .aw-status-strip{
    width:calc(100% - 32px) !important;
  }
}

@media(min-width:761px){
  .aw-journey-title-stack{top:9% !important;}
}

/* =========================================================
   AUGUST 2026 — TRUE EDGE-TO-EDGE HERO BASELINE
   The artwork remains in the shared layout frame, but the black
   ground rule spans the entire viewport from edge to edge.
========================================================= */
.aw-journey-stage::after{
  left:50% !important;
  right:auto !important;
  width:100vw !important;
  bottom:0 !important;
  transform:translateX(-50%) !important;
  border:0 !important;
  border-top:1px solid #000 !important;
}


/* =========================================================
   AUGUST 2026 — FINAL HERO SPACING / EDGE GROUP REVISION
   PIC 5: +80% ticker-to-first-board breathing room
   PIC 6: larger board-to-wordmark gap; type stays vertically centered
   PIC 7: airport graphic groups pushed toward page edges
   Pale-blue hero background
========================================================= */

:root{
  --aw-hero-sky:#DDF4FF;
}

/* Let the hero artwork use the same near-edge page limits as the
   latest global layout instead of the older 1420px constrained frame. */
.aw-journey-stage,
.aw-status-strip{
  width:calc(100% - clamp(2.5px,.25vw,4.5px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* A slightly taller shared stage preserves the composition after adding
   more vertical breathing room. */
@media(min-width:761px){
  .aw-journey-stage{
    aspect-ratio:16 / 7.6 !important;
  }

  /* PIC 5 — approximately 80% more absolute breathing room than
     the former 9% setting once the slightly taller stage is included. */
  .aw-journey-title-stack{
    top:14.5% !important;
  }

  /* PIC 6 — move the typed line lower and keep its content centered
     vertically inside a stable box so it does not jump. */
  .aw-type-prompt{
    top:62% !important;
    height:180px !important;
    min-height:180px !important;
    display:grid !important;
    place-items:center !important;
  }

  .aw-type-line,
  .aw-type-line--one,
  .aw-type-line--two,
  .aw-type-line--three{
    top:50% !important;
    height:180px !important;
    align-items:center !important;
    justify-content:center !important;
  }
}

/* PIC 7 — move the ARRIVING airport group toward the far-left edge. */
.aw-airport-cluster--left .aw-tower-wrap{
  left:0 !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-terminal-wrap{
  left:clamp(30px,3.5vw,66px) !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-passenger-wrap{
  left:clamp(30px,3.5vw,66px) !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-plane-wrap{
  left:clamp(54px,5vw,94px) !important;
  right:auto !important;
}

/* Mirror the same treatment for the DEPARTING airport group. */
.aw-airport-cluster--right .aw-tower-wrap{
  left:auto !important;
  right:0 !important;
}
.aw-airport-cluster--right .aw-terminal-wrap{
  left:auto !important;
  right:clamp(30px,3.5vw,66px) !important;
}
.aw-airport-cluster--right .aw-passenger-wrap{
  left:auto !important;
  right:clamp(30px,3.5vw,66px) !important;
}
.aw-airport-cluster--right .aw-plane-wrap{
  left:auto !important;
  right:clamp(54px,5vw,94px) !important;
}

/* Bring the matching outer status boards toward those edge groups too. */
@media(min-width:761px){
  .aw-status-strip{
    --aw-status-left-midpoint:6.5% !important;
    --aw-status-right-midpoint:93.5% !important;
  }
}

/* Keep every hero surface on the same new pale blue. */
.aw-journey-hero,
.aw-journey-stage,
.aw-city-center{
  background:#DDF4FF !important;
  background-color:#DDF4FF !important;
}


/* =========================================================
   AUGUST 2026 — FINAL HERO ALIGNMENT / BOARD MATCH
========================================================= */

:root{
  --aw-hero-sky:#DDF4FF;
  --aw-hero-content-edge:clamp(38px,2.2vw,48px);
}

/* PIC 1 — every visible hero band uses exactly the same pale blue. */
.aw-journey-hero,
.aw-journey-stage,
.aw-status-strip,
.aw-city-center,
.aw-hero-group{
  background:#DDF4FF !important;
  background-color:#DDF4FF !important;
}

/* PIC 2 — pull the left/right airport groups inward so the OUTER edge
   aligns with the section-title edge rather than the viewport edge. */
.aw-airport-cluster--left .aw-tower-wrap{
  left:var(--aw-hero-content-edge) !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-terminal-wrap{
  left:calc(var(--aw-hero-content-edge) + clamp(30px,3.5vw,66px)) !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-passenger-wrap{
  left:calc(var(--aw-hero-content-edge) + clamp(30px,3.5vw,66px)) !important;
  right:auto !important;
}
.aw-airport-cluster--left .aw-plane-wrap{
  left:calc(var(--aw-hero-content-edge) + clamp(54px,5vw,94px)) !important;
  right:auto !important;
}

.aw-airport-cluster--right .aw-tower-wrap{
  left:auto !important;
  right:var(--aw-hero-content-edge) !important;
}
.aw-airport-cluster--right .aw-terminal-wrap{
  left:auto !important;
  right:calc(var(--aw-hero-content-edge) + clamp(30px,3.5vw,66px)) !important;
}
.aw-airport-cluster--right .aw-passenger-wrap{
  left:auto !important;
  right:calc(var(--aw-hero-content-edge) + clamp(30px,3.5vw,66px)) !important;
}
.aw-airport-cluster--right .aw-plane-wrap{
  left:auto !important;
  right:calc(var(--aw-hero-content-edge) + clamp(54px,5vw,94px)) !important;
}

/* Match ARRIVING / DEPARTING board placement to the inset airport groups. */
@media(min-width:761px){
  .aw-status-strip{
    --aw-status-left-midpoint:8.2% !important;
    --aw-status-right-midpoint:91.8% !important;
  }
}

/* PIC 3 — move the typed wordmark/message upward and keep it perfectly
   vertically centered in its reserved space. */
@media(min-width:761px){
  .aw-type-prompt{
    top:49% !important;
    height:180px !important;
    min-height:180px !important;
    display:grid !important;
    place-items:center !important;
  }

  .aw-type-line,
  .aw-type-line--one,
  .aw-type-line--two,
  .aw-type-line--three{
    top:50% !important;
    height:180px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
}

/* PIC 3 — force BOTH title rows to use the same exact board dimensions.
   Both SVGs use the same 612.4 × 52 intrinsic canvas. */
.aw-journey-title-stack{
  width:min(59vw,950px) !important;
}

.aw-journey-title,
.aw-journey-title-secondary{
  width:100% !important;
}

.aw-title-board,
.aw-title-board--discover,
.aw-title-board--between{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  aspect-ratio:612.4 / 52 !important;
  height:auto !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}

/* Keep just a small deliberate separation between the equal-size rows. */
.aw-journey-title-secondary{
  margin-top:8px !important;
}

@media(max-width:760px){
  .aw-journey-title-stack{
    width:min(92vw,720px) !important;
  }
}


/* =========================================================
   AUGUST 2026 — SMALL FOLLOW-UP ADJUSTMENTS ONLY
========================================================= */

:root{
  --aw-hero-sky:#DDF4FF;
}

/* Move towers a bit closer to the buildings and enlarge them by 30%. */
.aw-tower-wrap{
  width:clamp(23px,1.85vw,34px) !important;
}

.aw-airport-cluster--left .aw-tower-wrap{
  left:calc(var(--aw-hero-content-edge) + 18px) !important;
}
.aw-airport-cluster--right .aw-tower-wrap{
  right:calc(var(--aw-hero-content-edge) + 18px) !important;
}

/* Lower the Aerowander typed area slightly so it sits centered in the hero. */
@media(min-width:761px){
  .aw-type-prompt{
    top:54% !important;
    height:180px !important;
    min-height:180px !important;
  }
  .aw-type-line,
  .aw-type-line--one,
  .aw-type-line--two,
  .aw-type-line--three{
    top:50% !important;
    height:180px !important;
    align-items:center !important;
    justify-content:center !important;
  }
}


/* =========================================================
   AUGUST 2026 — HERO SCRIPT COLOR MATCH
   Match typed hero copy to the gray Aerowander wordmark in the header.
========================================================= */

.aw-type-line,
.aw-type-line--one,
.aw-type-line--two,
.aw-type-line--three,
.aw-brand-aero,
.aw-brand-wander{
  color:#9a9a9a !important;
}

/* Keep the typing cursor visually matched to the same gray. */
.aw-type-cursor{
  background:#9a9a9a !important;
}


/* =========================================================
   AUGUST 2026 — USER REQUESTED DEPARTURE FLIGHT PATH
   Mirror the arriving plane's ~17° approach angle and slow the exit.
========================================================= */
@keyframes aw-right-plane{
  0%,53.32%{
    opacity:0;
    transform:translate(0,0) rotate(-18deg) scale(.98);
  }
  53.34%{
    opacity:1;
    transform:translate(0,0) rotate(-18deg) scale(.98);
  }
  /* 65vw across / 20vw up ~= 17° climb, mirroring the left-side approach. */
  72%{
    opacity:1;
    transform:translate(65vw,-20vw) rotate(-18deg) scale(.98);
  }
  72.4%,100%{
    opacity:0;
    transform:translate(65vw,-20vw) rotate(-18deg) scale(.98);
  }
}


/* =========================================================
   AUGUST 9 2026 — FINAL CENTER PASSENGER REVEAL
   Appears only after the Aerowander wordmark finishes typing.
========================================================= */
.aw-typed-passenger{
  position:absolute;
  z-index:12;
  left:50%;
  top:calc(50% + 64px);
  width:clamp(76px,6.2vw,104px);
  height:auto;
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,12px) scale(.92);
  transform-origin:center bottom;
  transition:opacity .7s ease, transform .7s ease, visibility 0s linear .7s;
  pointer-events:none;
}

.aw-typed-passenger.is-visible{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0) scale(1);
  transition:opacity .7s ease, transform .7s ease, visibility 0s;
}

@media(max-width:760px){
  .aw-typed-passenger{
    top:calc(50% + 54px);
    width:76px;
  }
}


/* =========================================================
   AUGUST 9 2026 — FOLLOW-UP MOTION / COLOR FIXES
========================================================= */

/* Right-side traveler: start hidden behind the skyline and end hidden
   behind the terminal/building without walking past it. */
.aw-airport-cluster--right .aw-passenger-wrap{
  right:calc(var(--aw-hero-content-edge) + clamp(30px,3.5vw,66px)) !important;
  left:auto !important;
}

@keyframes aw-right-passenger{
  0%,39.98%{opacity:0;transform:translateX(-168px)}
  40%{opacity:1;transform:translateX(-168px)}
  55.6%{opacity:1;transform:translateX(0)}
  55.95%,100%{opacity:0;transform:translateX(0)}
}

/* Departing plane: match the orange fill and a gentler -15deg climb.
   Also slow the exit so it feels comparable to the left-side arrival. */
.aw-journey-stage.is-playing .aw-airport-cluster--right .aw-plane-wrap{
  animation:aw-right-plane var(--aw-motion-cycle) linear 1 both;
}

@keyframes aw-right-plane{
  0%,53.32%{
    opacity:0;
    transform:translate(0,0) rotate(-15deg) scale(.98);
  }
  53.34%{
    opacity:1;
    transform:translate(0,0) rotate(-15deg) scale(.98);
  }
  76.2%{
    opacity:1;
    transform:translate(65vw,-20vw) rotate(-15deg) scale(.98);
  }
  76.6%,100%{
    opacity:0;
    transform:translate(65vw,-20vw) rotate(-15deg) scale(.98);
  }
}


/* =========================================================
   AUGUST 9 2026 — PASSENGER PATH + FLIPCARD SPACING TWEAKS
========================================================= */

/* Left-side traveler: keep entering from the far left, then continue
   farther right so he disappears behind the skyline. */
@keyframes aw-left-passenger{
  0%,11.65%{opacity:0;transform:translateX(28px)}
  11.67%{opacity:1;transform:translateX(28px)}
  27.77%{opacity:1;transform:translateX(calc(var(--left-passenger-travel) + 120px))}
  28.12%,100%{opacity:0;transform:translateX(calc(var(--left-passenger-travel) + 120px))}
}

/* Right-side traveler: begin much farther left so he emerges from behind
   the skyline/building cluster, then stop behind the terminal building. */
@keyframes aw-right-passenger{
  0%,39.98%{opacity:0;transform:translateX(-280px)}
  40%{opacity:1;transform:translateX(-280px)}
  56.1%{opacity:1;transform:translateX(-10px)}
  56.45%,100%{opacity:0;transform:translateX(-10px)}
}

/* Tighten the flipcard stack vertically. */
@media(min-width:761px){
  .aw-journey-title-stack{
    top:8% !important;
    gap:1px !important;
  }

  .aw-journey-title-secondary{
    margin-top:4px !important;
  }

  .aw-type-prompt{
    top:45% !important;
  }
}

@media(max-width:760px){
  .aw-journey-title-stack{
    gap:1px !important;
  }

  .aw-journey-title-secondary{
    margin-top:3px !important;
  }
}

/* MANUAL HERO HEIGHT CONTROL */
@media (min-width:761px){

  .aw-journey-hero{
    min-height:0 !important;
  }

  .aw-journey-stage{
    height:560px !important;
    min-height:560px !important;
    aspect-ratio:auto !important;
  }

}

/* MANUAL HERO HEIGHT CONTROL */
@media (min-width:761px){

  .aw-journey-hero{
    min-height:0 !important;
  }

  .aw-journey-stage{
    height:730px !important;
    min-height:730px !important;
    aspect-ratio:auto !important;
  }

}

/* =========================================================
   AUGUST 9 2026 — FINAL NUMBERED HERO SEQUENCE
   This block intentionally overrides the older 60-second sequence rules.
========================================================= */

/* Hide motion pieces until their numbered sequence step is triggered. */
.aw-airport-cluster--left .aw-plane-wrap,
.aw-airport-cluster--left .aw-passenger-wrap,
.aw-airport-cluster--right .aw-plane-wrap,
.aw-airport-cluster--right .aw-passenger-wrap{
  opacity:0;
}

/* Hide all flipboards until JS reveals the correct step. */
.aw-status-board,
.aw-title-board--discover,
.aw-title-board--between,
.aw-journey-title-secondary{
  opacity:0 !important;
  visibility:hidden !important;
}

.aw-status-board.is-seq-visible,
.aw-title-board--discover.is-seq-visible,
.aw-title-board--between.is-seq-visible,
.aw-journey-title-secondary.is-seq-visible{
  opacity:1 !important;
  visibility:visible !important;
}

/* 1 — arriving aircraft. */
.aw-journey-stage.is-seq-arriving .aw-airport-cluster--left .aw-plane-wrap{
  animation:aw-seq-left-plane 6s linear 1 both !important;
}
@keyframes aw-seq-left-plane{
  0%{opacity:0;transform:translate(-390px,-118px) rotate(18deg) scale(.98)}
  4%{opacity:1;transform:translate(-375px,-114px) rotate(18deg) scale(.98)}
  96%{opacity:1;transform:translate(0,0) rotate(18deg) scale(.98)}
  100%{opacity:0;transform:translate(0,0) rotate(18deg) scale(.98)}
}

/* 3 — left passenger from building to skyline. */
.aw-journey-stage.is-seq-left-passenger .aw-airport-cluster--left .aw-passenger-wrap{
  animation:aw-seq-left-passenger 7s linear 1 both !important;
}
@keyframes aw-seq-left-passenger{
  0%{opacity:0;transform:translateX(28px)}
  4%{opacity:1;transform:translateX(28px)}
  96%{opacity:1;transform:translateX(calc(var(--left-passenger-travel) + 120px))}
  100%{opacity:0;transform:translateX(calc(var(--left-passenger-travel) + 120px))}
}

/* 5 — requested wordmark colors: wander white, Aero purple. */
.aw-brand-wander{
  color:#ffffff !important;
  fill:#ffffff !important;
}
.aw-brand-aero{
  color:#5522B0 !important;
  fill:#5522B0 !important;
}

/* 6 — right passenger, same seven-second movement speed as #3. */
.aw-journey-stage.is-seq-right-passenger .aw-airport-cluster--right .aw-passenger-wrap{
  animation:aw-seq-right-passenger 7s linear 1 both !important;
}
@keyframes aw-seq-right-passenger{
  0%{opacity:0;transform:translateX(-280px)}
  4%{opacity:1;transform:translateX(-280px)}
  96%{opacity:1;transform:translateX(-10px)}
  100%{opacity:0;transform:translateX(-10px)}
}

/* 8 — departing aircraft; same six-second duration as the arriving aircraft. */
.aw-journey-stage.is-seq-departing .aw-airport-cluster--right .aw-plane-wrap{
  animation:aw-seq-right-plane 6s linear 1 both !important;
}
@keyframes aw-seq-right-plane{
  0%{opacity:0;transform:translate(0,0) rotate(-15deg) scale(.98)}
  4%{opacity:1;transform:translate(0,0) rotate(-15deg) scale(.98)}
  96%{opacity:1;transform:translate(390px,-118px) rotate(-15deg) scale(.98)}
  100%{opacity:0;transform:translate(390px,-118px) rotate(-15deg) scale(.98)}
}

/* 9 — slow fade into the center space. */
.aw-typed-passenger{
  transition:opacity 1.8s ease, transform 1.8s ease, visibility 0s linear 1.8s !important;
}
.aw-typed-passenger.is-visible{
  transition:opacity 1.8s ease, transform 1.8s ease, visibility 0s !important;
}

/* =========================================================
   AUGUST 11 2026 — HERO FINAL REFINEMENTS
   - purple typewriter cursor
   - center the typed Aerowander wordmark lower in the hero
   - explicit replay control instead of click-anywhere replay
========================================================= */
.aw-type-cursor{
  background:#5522B0 !important;
}

@media(min-width:761px){
  .aw-type-prompt{
    top:54% !important;
  }
}

.aw-hero-replay{
  position:absolute;
  z-index:140;
  top:auto;
  right:18px;
  bottom:18px;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#5522B0;
  color:#ffffff;
  box-shadow:0 3px 10px rgba(8,41,71,.18);
  cursor:pointer;
  opacity:0;
  transform:scale(.9);
  transition:opacity .28s ease, transform .28s ease, box-shadow .18s ease;
}
.aw-hero-replay[hidden]{
  display:none !important;
}
.aw-hero-replay.is-visible{
  opacity:1;
  transform:scale(1);
}
.aw-hero-replay:hover,
.aw-hero-replay:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(255,255,255,.9),0 3px 12px rgba(8,41,71,.24);
}
.aw-hero-replay svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@media(max-width:760px){
  .aw-type-prompt{top:52% !important;}
  .aw-hero-replay{
    top:auto;
    right:12px;
    bottom:12px;
    width:42px;
    height:42px;
  }
}


/* 2026-08-11 — replay control final vertical placement */
.aw-hero-replay{
  bottom:5px !important;
}
@media(max-width:760px){
  .aw-hero-replay{bottom:5px !important;}
}