@font-face{font-family:"Newsreader";src:url(assets/fonts/Newsreader.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(assets/fonts/IBMPlexSans.woff2) format("woff2");font-weight:100 700;font-display:swap}
:root{--paper:#EDE8DF;--teal:#0E4F5C;--mist:#DDE6E3;--ink:#161616;--magenta:#C2185B;--slow:cubic-bezier(.45,0,.2,1)}
*{box-sizing:border-box}
html{background:var(--teal)}
body{margin:0;color:var(--ink);font:400 18px/1.6 "IBM Plex Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.hero{background:var(--paper);position:relative;min-height:88vh;display:flex;align-items:center;justify-content:center;padding:136px 32px 152px;text-align:center}
.inner{width:100%;max-width:1200px;margin:0 auto}
.logo-wrap{margin:0 auto 56px;width:clamp(280px,50vw,860px);font-size:0}
.logo{display:block;width:100%;height:auto}
.bar{position:relative;display:block;width:clamp(140px,25vw,430px);height:7px;margin:0 auto 64px;--s:.33}
.bar .line{position:absolute;inset:0;background:var(--teal);transform-origin:50% 50%;animation:stretch .9s var(--slow) 4.5s both}
.bar .word{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;font:500 16px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.42em;padding-left:.42em;color:var(--teal);opacity:0;animation:squash .75s var(--slow) 4.5s both}
.bar .word span{animation:type .06s linear both;animation-delay:calc(3.1s + var(--i) * .12s)}
@keyframes type{from{opacity:0}to{opacity:1}}
@keyframes squash{from{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-50%) scaleX(1.9) scaleY(.15)}}
@keyframes stretch{0%{opacity:0;transform:scaleX(var(--s)) scaleY(2.2)}35%{opacity:1}100%{opacity:1;transform:none}}
.lg-body{animation:fade 1.1s ease-out both}
.tick{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.8s var(--slow) 1.2s forwards}
.launch{display:flex;align-items:center;justify-content:center;gap:.34em;font-size:clamp(46px,7vw,108px)}
.headline{font:700 1em/1.15 "Newsreader",Georgia,serif;letter-spacing:.005em;margin:0;color:var(--ink);opacity:0;animation:up 1.4s ease-out 2.4s forwards}
.rule{display:block;width:72px;height:2px;background:var(--magenta);margin:52px auto 36px;opacity:0;animation:fade 1s ease-out 3.4s forwards}
.promise{font:400 italic clamp(24px,2.6vw,38px)/1.3 "Newsreader",Georgia,serif;color:var(--teal);margin:0;opacity:0;animation:up 1.3s ease-out 3.5s forwards}
.base{background:var(--teal);color:#fff;text-align:center;padding:96px 32px 0}
.quiet{margin:0 auto;max-width:34em;font-size:clamp(18px,1.6vw,22px);line-height:1.6;color:#fff;text-wrap:balance}
footer{max-width:1200px;margin:96px auto 0;border-top:1px solid rgba(221,230,227,.25);padding:24px 0 32px;font-size:14px;color:var(--mist)}
footer p{margin:0}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:640px){
 .hero{min-height:auto;padding:96px 20px 112px}
 .logo-wrap{width:78vw;margin-bottom:36px}
 .bar{width:39vw;margin-bottom:40px;--s:.62}
 .bar .word{font-size:13px;letter-spacing:.36em;padding-left:.36em}
 .launch{flex-direction:column;gap:24px;font-size:48px}
  .rule{margin:32px auto 24px}
 .base{padding:64px 24px 0}footer{margin-top:64px}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important}
 .tick{stroke-dashoffset:0}.headline,.rule,.promise{opacity:1;transform:none}
}