/* Lifted from the export's globals.css, with the removed sections' rules taken
   out and the two shadcn components replaced by plain elements. The colours,
   type and breakpoints are unchanged. */
:root{
  --background:#f8faff; --foreground:#173977; --primary:#225be1;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:35px}
body{margin:0;font-family:Arial,Helvetica,sans-serif;font-size:16px;
     background:var(--background);color:var(--foreground)}
a{text-decoration:none;color:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #ffdeaa;outline-offset:5px}
.wrap{width:min(1320px,88%);margin:auto}

.hero{position:relative;min-height:900px;height:100svh;max-height:1150px;
      color:white;overflow:hidden;background:#387ce6}
.hero-art,.hero-shade{position:absolute;inset:0;width:100%;height:100%;
      object-fit:cover;object-position:center bottom}
.hero-shade{background:linear-gradient(180deg,rgba(13,61,151,.5),rgba(11,69,170,.18) 48%,transparent 67%)}

.nav{position:relative;display:flex;align-items:center;justify-content:space-between;
     padding:30px 0;border-bottom:1px solid #ffffff45}
.brand{display:flex;align-items:baseline;gap:9px}
.brand>span{font-family:Georgia,serif;font-style:italic;font-weight:700;font-size:40px;letter-spacing:-2px}
.brand small{font-size:14px;letter-spacing:2px}
.nav-cta{padding:13px 23px;border:1px solid #ffffff75;border-radius:30px;font-size:14px}
.nav-cta:hover{background:#ffffff20}

.hero-content{position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:8%;padding-top:75px}
.eyebrow{font-size:12px;letter-spacing:2px;font-weight:600;margin:0 0 25px}
.light{color:#f2f5ff}
h1,p{margin-top:0}
h1{font-family:Georgia,serif;font-size:clamp(64px,6.8vw,104px);line-height:1.03;
   font-weight:400;letter-spacing:-4px;margin-bottom:20px}
h1 em{font-weight:400}
p{line-height:1.65}

.signup{padding-top:34px;max-width:470px;text-shadow:0 1px 10px #164bb233}
.signup>p{font-size:18px;max-width:390px;margin-bottom:25px}
.signup .intro{font-size:22px;margin-bottom:9px}
.signup form{margin-top:32px}
.signup label{display:block;font-size:14px;margin-bottom:12px;font-weight:600}
.email-row{display:flex;background:#fff;border-radius:12px;padding:5px;gap:5px;
           box-shadow:0 8px 30px #17489916}
/* The export leaned on shadcn for these two. Plain elements need the base the
   component library was providing, so it is spelled out here. */
.email-row input{flex:1;min-width:0;border:0;outline:0;background:transparent;
                 box-shadow:none;height:48px;padding:0 12px;font:inherit;
                 font-size:16px;color:#173977}
.email-row input::placeholder{color:#8aa0c4}
.email-row button{border:0;cursor:pointer;background:#184bbb;color:#fff;border-radius:8px;
                  height:48px;padding:0 23px;font:inherit;font-size:14px;font-weight:600}
.email-row button:hover{background:#10398e}
.email-row button:disabled{opacity:.7;cursor:default}
.signup small{display:block;font-size:12px;line-height:1.5;margin-top:10px;color:#f1f6ff}
.error:empty{display:none}
.error{font-size:14px;margin:12px 0 0}
.honeypot{position:absolute;left:-10000px}
.success{display:flex;gap:14px;background:#ffffffed;color:#173977;padding:24px;
         border-radius:14px;margin-top:25px;text-shadow:none}
.success[hidden]{display:none}
.success strong,.success span{display:block}
.success span{margin-top:7px;font-size:14px}

.hero-bottom{position:absolute;bottom:34px;left:6%;display:flex;justify-content:space-between;
             align-items:flex-end;color:#143b7b;font-size:14px;line-height:1.5}
.coming{font-family:Georgia,serif;font-style:italic;font-size:25px}

@media(min-width:1600px){.hero-bottom{left:calc((100% - 1320px)/2)}}
@media(max-width:900px){
  .hero{min-height:970px;height:auto}
  .hero-content{gap:5%;grid-template-columns:1.1fr 1fr;padding-top:65px}
  h1{font-size:66px;letter-spacing:-3px}
  .signup{padding-top:22px}
  .email-row{flex-direction:column;padding:6px}
  .email-row button{width:100%}
  .hero-art{object-position:38% bottom}
}
@media(max-width:640px){
  .wrap{width:88%}
  .nav{padding:20px 0}
  .brand>span{font-size:34px}
  .brand small{font-size:11px}
  .nav-cta{font-size:12px;padding:11px 14px}
  .hero{min-height:1060px}
  .hero-art{object-fit:cover;object-position:32% bottom}
  .hero-shade{background:linear-gradient(180deg,#1756bfa6,#1557bc6b 50%,transparent 76%)}
  .hero-content{display:block;padding-top:43px}
  .eyebrow{font-size:10px;letter-spacing:1.5px;margin-bottom:22px}
  h1{font-size:64px;letter-spacing:-2.7px;line-height:1.05}
  .signup{padding-top:10px;max-width:420px}
  .signup>p{font-size:16px;margin-bottom:16px;max-width:335px}
  .signup .intro{font-size:19px}
  .signup form{margin-top:22px}
  .email-row{flex-direction:row}
  .email-row input{padding-left:9px}
  .email-row button{width:auto;padding:0 16px}
  .signup small{font-size:11px;max-width:300px}
  .hero-bottom{bottom:25px;font-size:12px}
  .coming{font-size:21px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
