@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/poppins-500.woff') format('woff')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/poppins-700.woff') format('woff')}
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/caveat.woff2') format('woff2'),url('fonts/caveat.ttf') format('truetype')}
:root{
  color-scheme: light;
  --navy:#0b2a6b;
  --red:#d6102b;
  --ink:#0d2f78;
  --paper:#f7f9fc;
  --sans:'Poppins','Segoe UI',Helvetica,Arial,sans-serif;
  --script:'Caveat','Segoe Print','Comic Sans MS',cursive;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--paper);color:var(--navy);font-family:var(--sans);-webkit-font-smoothing:antialiased}
.page{background:var(--paper);overflow:hidden}

/* HERO */
.hero{
  position:relative;text-align:center;--hs:max(300px,56.5vw);padding:clamp(20px,4vw,40px) 20px max(0px,calc(var(--hs)*.8 - 76px));
  background:
    radial-gradient(ellipse 28% 5% at 12% 12%,#fff 0,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 30% 6% at 88% 20%,#fff 0,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 35% 5% at 8% 44%,rgba(255,255,255,.9) 0,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 40% 7% at 85% 52%,rgba(255,236,214,.95) 0,rgba(255,236,214,0) 100%),
    radial-gradient(ellipse 45% 6% at 40% 60%,rgba(255,226,196,.8) 0,rgba(255,226,196,0) 100%),
    linear-gradient(180deg,#4a95e6 0%,#7db6f0 35%,#a9cdf3 70%,#8db8ea 100%);
}
.brand{display:flex;justify-content:flex-start;max-width:520px;margin:0 auto 0}
.logo{display:flex;align-items:center;gap:clamp(8px,2vw,14px);text-align:left;margin:0 auto}
.logo img{height:auto;overflow:visible;width:clamp(58px,14vw,92px);flex:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))}
.wordmark{font-weight:800;font-size:clamp(34px,8.2vw,56px);line-height:.92;letter-spacing:.5px;text-transform:uppercase}
.wordmark .a{color:var(--navy);display:block}
.wordmark .b{color:var(--red);display:block}
.strap{display:flex;align-items:center;justify-content:center;gap:10px;margin:8px auto 0;font-weight:500;color:var(--navy);font-size:clamp(12px,2.7vw,19px)}
.strap::before,.strap::after{content:"";height:2px;width:clamp(18px,5vw,40px);background:var(--navy)}
h1{
  margin:clamp(26px,6vw,52px) auto 0;max-width:820px;
  font-size:clamp(30px,7.6vw,62px);line-height:1.15;font-weight:700;letter-spacing:-.5px;color:var(--navy);
  text-shadow:0 1px 10px rgba(255,255,255,.35);
}
.lede{margin:clamp(14px,3vw,22px) auto 0;max-width:720px;font-weight:500;font-size:clamp(15px,3.1vw,22px);line-height:1.5;color:var(--ink)}
.cta{
  display:inline-flex;align-items:center;gap:10px;margin-top:clamp(22px,4vw,34px);
  background:var(--red);color:#fff;text-decoration:none;font-weight:600;
  font-size:clamp(18px,3.6vw,26px);padding:.55em 1.6em;border-radius:999px;
  box-shadow:0 8px 20px rgba(214,16,43,.3);transition:transform .15s,box-shadow .15s;
}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(214,16,43,.38)}
.cta:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.read{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;font-weight:500;font-size:clamp(14px,2.6vw,19px);color:var(--ink)}
.read svg{width:1.4em;height:1.4em}
.hero>*{position:relative;z-index:1}
.hero>.scene{position:absolute;z-index:0;left:0;right:0;bottom:0;height:var(--hs);background:url('images/westminster.jpg') 60% 100%/cover no-repeat;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 30%);mask-image:linear-gradient(to bottom,transparent 0,#000 30%)}

/* TAGLINE */
.tag{position:relative;text-align:center;padding:clamp(28px,6vw,56px) 20px 0}
.tag p{display:inline-block;margin:0;font-family:var(--script);font-weight:700;font-size:clamp(38px,9vw,74px);line-height:1;color:var(--navy);transform:rotate(-6deg);position:relative;padding-bottom:.25em}
.tag p span{display:block}
.tag p span+span{margin-left:.9em}
.tag svg.u{position:absolute;left:8%;right:4%;bottom:-2px;width:88%;height:18px}
.waves{display:block;width:100%;height:auto;margin-top:clamp(-8px,-1vw,0px)}
@media (prefers-reduced-motion:reduce){.cta{transition:none}}
