:root{color-scheme:light;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;background:#f7f2df;color:#193e33;font:1rem/1.6 system-ui,sans-serif}header{background:#193e33;color:#fff9e9}nav,main,footer{max-width:72rem;margin:auto;padding:1.25rem}nav{display:flex;justify-content:space-between;gap:1rem}nav span{display:flex;gap:1rem}a{color:inherit}.hero{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:clamp(2rem,7vw,7rem);padding:3rem 0;background:radial-gradient(ellipse at right,#e2e8c6,transparent 65%)}h1,h2{font-family:Georgia,serif;line-height:1.06}h1{font-size:clamp(3rem,8vw,6.5rem);margin:.2em 0}h2{font-size:clamp(2rem,4vw,3rem)}.logo{width:5rem;border-radius:1rem}.game{width:min(100%,18rem);justify-self:center;border:6px solid #193e33;border-radius:1.8rem;box-shadow:0 1rem 2rem #193e3333}.eyebrow{letter-spacing:.16em;font-weight:700;font-size:.75rem}.button{display:inline-block;background:#193e33;color:#fff9e9;padding:.7rem 1rem;border-radius:.5rem;text-decoration:none}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.cards article{padding:1rem;background:#fffcf2;border-radius:1rem}footer{margin-top:2rem;border-top:1px solid #193e3333}@media(max-width:40rem){.hero,.cards{grid-template-columns:1fr}.hero{padding:2rem 0}}

/* Flying club poster */
header{border-bottom:4px solid #d9a84f}
nav>a{font-family:Georgia,serif;font-weight:bold;text-decoration:none}
.hero{position:relative;padding-inline:clamp(1rem,4vw,3rem);border:1px solid #d2c8a8;border-radius:1.5rem;margin-top:1.5rem;background:repeating-linear-gradient(0deg,transparent 0 47px,#193e330b 48px 49px),radial-gradient(ellipse at right,#d4dfaa,#faf1d9 75%)}
.eyebrow{color:#68511c}.hero h1{max-width:9ch}.hero p:not(.eyebrow){max-width:38ch}.button{box-shadow:0 4px 0 #d9a84f}.button:hover{background:#2c5543}.game{transform:rotate(3deg);margin-block:1rem}.cards{counter-reset:stands}.cards article{border:1px solid #d2c8a8;counter-increment:stands}.cards article::before{content:'STAND 0' counter(stands);font-size:.7rem;font-weight:800;letter-spacing:.16em;color:#68511c}a:focus-visible{outline:3px solid #b67b17;outline-offset:4px}
@media(max-width:40rem){.hero{padding-inline:1rem}.game{transform:none}}

.flight-preview{position:relative;margin:0;display:grid;justify-items:center;isolation:isolate}
.flight-preview::before{content:"";position:absolute;inset:6% 5% 10%;z-index:-1;border:2px dashed #49664080;border-radius:50%;transform:rotate(-18deg)}
.flight-preview figcaption{margin-top:1rem;font-size:.7rem;font-weight:800;letter-spacing:.15em;color:#4c5936;text-align:center}
.hero{background:repeating-linear-gradient(0deg,transparent 0 47px,#f9edce14 48px 49px),radial-gradient(ellipse at right,#42694d,#193e33 75%);color:#fff9e9}
.hero .eyebrow{color:#f0c773}
.hero .button{background:#f0c773;color:#193e33;box-shadow:0 4px 0 #a36d23}
.hero .button:hover{background:#ffe0a1}
.flight-preview figcaption{color:#f0c773}
.flight-preview::before{border-color:#f0c77380}

.response {
  display: grid;
  grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 6vw, 5rem);
  margin-top: 3rem;
  padding: clamp(1rem, 5vw, 3.5rem);
  background: #e9dfbe;
  border: 1px solid #d2c8a8;
  border-radius: 1.5rem;
}
.response img {
  width: 100%;
  max-width: 16rem;
  border: 5px solid #193e33;
  border-radius: 1.3rem;
}
.response p { max-width: 36ch; }
.flight-preview figcaption { text-transform: none; letter-spacing: .04em; }
@media (max-width: 40rem) {
  .response { grid-template-columns: 1fr; }
  .response img { grid-row: 2; justify-self: center; }
}

a { text-decoration: none; }
a:hover { opacity: .82; }
main a:not(.button), footer a { font-weight: 700; }
nav { align-items: center; }
.brand { display: inline-flex; align-items: center; gap: .55rem; }
.brand img { width: 2.25rem; height: 2.25rem; object-fit: contain; border-radius: .45rem; }
.hero h1 { max-width: 15ch; font-size: clamp(2rem, 5vw, 4rem); }

.brand img { width: clamp(3rem, 8vw, 5rem); height: auto; }
.brand { font-size: clamp(1rem, 2.4vw, 1.6rem); }
nav { flex-wrap: wrap; }
.reading { max-width: 52rem; padding-block: clamp(2rem, 6vw, 4rem); }
.reading article { background: #fffcf2; border: 1px solid #d2c8a8; border-radius: 1.25rem; padding: clamp(1.2rem, 5vw, 3.5rem); box-shadow: 0 1rem 2rem #193e3310; }
.reading h1 { font-size: clamp(2.2rem, 6vw, 3.8rem); }
.reading h2 { font-size: clamp(1.35rem, 3vw, 1.75rem); border-top: 1px solid #ded6b8; padding-top: 1.15rem; margin-top: 1.6rem; }
.reading p { max-width: 65ch; }
.cards article { border-top: 4px solid #c99a45; }
.hero { box-shadow: 0 1rem 2rem #193e3324; }
