@charset "UTF-8";
*{box-sizing:border-box} html,body{height:100%} html{scroll-behavior:smooth}
body{margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:#fff7e6; background:#2d241e}

.hero{position:relative; min-height:100vh; display:grid; place-items:center; overflow:hidden}
/* Responsive parallax background */
.hero::before{
  content:""; position:absolute; inset:0;
  background-image: image-set(
    url('assets/bg-autumn-768.jpg') type('image/jpeg') 1x,
    url('assets/bg-autumn-1024.jpg') type('image/jpeg') 1.3x,
    url('assets/bg-autumn-1280.jpg') type('image/jpeg') 1.7x,
    url('assets/bg-autumn-1920.jpg') type('image/jpeg') 2x,
    url('assets/bg-autumn-2560.jpg') type('image/jpeg') 3x
  );
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  filter: saturate(1.05) contrast(1.02);
}
/* iOS/mobile fallback: disable fixed attachment for performance */
@supports (-webkit-touch-callout: none) {
  .hero::before{ background-attachment: scroll; }
}

/* Dark overlay to keep text readable */
.overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.20), rgba(0,0,0,.55))}

.content{position:relative; text-align:center; padding:2rem; z-index:2; max-width:960px}
.emblem{width:min(42vw, 300px); height:auto; border-radius:50%; box-shadow:0 10px 30px rgba(0,0,0,.45)}
h1{margin:1rem 0 .25rem; font-size:clamp(28px, 5vw, 60px); letter-spacing:.02em; text-shadow:0 4px 18px rgba(0,0,0,.55)}
.tagline{margin:.25rem 0 1rem; font-size:clamp(16px,2.2vw,22px);opacity:.95}
.badge{display:inline-block; margin-top:.5rem; padding:.45rem .85rem; background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.18); border-radius:999px; font-size:.95rem; backdrop-filter:blur(4px)}
footer{text-align:center; padding:24px 12px 40px; color:#ffe0b2; background:radial-gradient(60% 120% at 50% -20%, rgba(0,0,0,.35), transparent); border-top:1px solid rgba(255,255,255,.08); font-size:.95rem}
a{color:#ffd54f; text-decoration:none} a:hover{text-decoration:underline}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce){ .hero::before{ background-attachment:scroll } }