/* Concept C: sunrise.
   The brand sun (yellow 7548 outermost, then 1375, then 158 nearest the
   peaks) rises once behind a ridge; a small plane then drifts across,
   drawing its contrail. */

.banner-c {
  background:
    radial-gradient(120% 90% at 78% 100%, #24493b 0%, rgba(36,73,59,0) 60%),
    var(--green-5535);
  color: var(--ink-inverse);
}
.banner-c .eyebrow { color: var(--yellow-7548); }
.banner-c .lede { color: #dfe6e2; }
@media (min-width: 761px) {
  .banner-c .hero-copy { max-width: min(600px, 50%); }
}

.c-scene {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 62%;
  height: 100%;
  pointer-events: none;
}

/* Motion */
.banner-c.play .c-glow   { animation: c-fade 3.2s ease-out .2s both; }
.banner-c.play .c-sun-1  { animation: c-rise 2.8s cubic-bezier(.2,.7,.2,1) .2s both; }
.banner-c.play .c-sun-2  { animation: c-rise 2.8s cubic-bezier(.2,.7,.2,1) .35s both; }
.banner-c.play .c-sun-3  { animation: c-rise 2.8s cubic-bezier(.2,.7,.2,1) .5s both; }
.banner-c.play .c-fly    { animation: c-fly 9s cubic-bezier(.3,.1,.3,1) 1.4s both; }
.banner-c.play .c-trail  { animation: c-trail 9s cubic-bezier(.3,.1,.3,1) 1.4s both; }

@keyframes c-rise  { from { transform: translateY(230px); } to { transform: translateY(0); } }
@keyframes c-fade  { from { opacity: 0; } to { opacity: 1; } }
@keyframes c-fly   { from { transform: translate(-313px, 46px); opacity: 0; }
                     8%   { opacity: 1; }
                     to   { transform: translate(0, 0); opacity: 1; } }
@keyframes c-trail { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* Inner-page version: shorter, the sun peeks in at the right */
.page-banner .c-scene { width: 46%; }
.page-banner.banner-c .hero-copy { max-width: 640px; }

@media (max-width: 760px) {
  .banner-c .hero-inner { padding-bottom: 250px; }
  .c-scene { width: 100%; height: 240px; }
  .page-banner.banner-c .hero-inner { padding-bottom: 150px; }
  .page-banner .c-scene { width: 100%; height: 140px; }
}

/* Logo straight on the green, no white plate (Tom's choice, 2026-10-16).
   The margin keeps clear space equal to the AERO line's height. */
.logo-bare {
  --logo-w: 220px;
  display: inline-block;
  margin: 0 0 var(--space-6);
  line-height: 0;
}
.logo-bare img { width: var(--logo-w); height: auto; }
@media (max-width: 600px) {
  .logo-bare { --logo-w: 170px; }
}

/* Let the ridges run past the scene's left edge to the banner edge */
.c-scene { overflow: visible; }