/* 29 Oct 2026: streamlined landing page. Hero, app, Christmas, weekly programme, location. */
@media (min-width: 801px) {
  .hero {
    background-image: linear-gradient(270deg,rgba(4,27,36,.86) 0%,rgba(4,27,36,.76) 29%,rgba(4,27,36,.40) 48%,rgba(4,27,36,.06) 73%),url('/assets/images/front-sunset.webp');
    background-position: center 48%;
    min-height: 470px;
  }
  .hero .container {display:flex;flex-direction:column;align-items:flex-end;text-align:right;}
  .hero .container > .eyebrow, .hero .container > h1, .hero .container > p,
  .hero .container > .hero-actions,.hero .container > .hero-note {width:min(100%,555px);}
  .hero .hero-actions {justify-content:flex-end;}
  .hero .hero-note {justify-content:flex-end;}
}
/* Keep the photo readable on small screens, with text in the lower right instead of over faces. */
@media (max-width: 800px) {
  .hero {
    min-height: 520px;height:auto;
    align-items:flex-end;
    background-image: linear-gradient(0deg,rgba(4,27,36,.95) 0%,rgba(4,27,36,.87) 25%,rgba(4,27,36,.27) 60%,rgba(4,27,36,.0) 100%),url('/assets/images/front-sunset.webp');
    background-position:39% 42%;
  }
  .hero .container {padding-top:190px;padding-bottom:30px;text-align:right;}
  .hero .container > h1 {margin-left:auto;max-width:430px;}
  .hero .container > p {margin-left:auto;max-width:420px;}
  .hero .hero-actions {justify-content:flex-end;}
  .hero .hero-note {justify-content:flex-end;}
}
/* Put the three main promotional moments in one clear vertical narrative. */
.app-promo {margin:0;}
section.season{margin-top:30px;margin-bottom:30px;}
.home-week{padding-top:44px;}
@media (max-width:560px){
  .hero {min-height:530px; background-position:38% 36%;}
  .hero .container {padding-top:204px;padding-bottom:27px;}
  .hero h1 {font-size:clamp(35px,9.6vw,48px);}
  .hero p {font-size:14px;}
  .hero .hero-actions {justify-content:flex-end;gap:8px;}
  .hero .hero-actions .btn {font-size:12px;padding:10px 13px;min-height:40px;}
  .hero .hero-note {font-size:10px;line-height:1.5;margin-top:13px;}
  .container > .season {margin-top:20px;margin-bottom:20px;}
  .home-week{padding-top:33px;}
}