@font-face{font-family:"Uni Neue";font-weight:900;font-display:swap;src:local("Uni Neue Black"),url(fonts/UniNeue-Black.woff2) format("woff2")}
@font-face{font-family:"Uni Neue";font-weight:700;font-display:swap;src:local("Uni Neue Bold"),url(fonts/UniNeue-Bold.woff2) format("woff2")}
@font-face{font-family:"Uni Neue";font-weight:400;font-display:swap;src:local("Uni Neue Regular"),url(fonts/UniNeue-Regular.woff2) format("woff2")}
@font-face{font-family:"Uni Neue";font-weight:300;font-display:swap;src:local("Uni Neue Light"),url(fonts/UniNeue-Light.woff2) format("woff2")}
:root{--lg:#acd8a8;--teal:#00b194;--deep:#007f6b;--grey:#4d4d4f;--dark:#232122;--grad:linear-gradient(90deg,#acd8a8,#00b194);--wrap:66rem}
*{box-sizing:border-box;margin:0}
body{font:400 1.0625rem/1.7 "Uni Neue","Avenir Next","Segoe UI",system-ui,sans-serif;color:var(--grey);background:#fff}
h1,h2,h3,blockquote{font-weight:900;line-height:1.15;color:var(--grey)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.25rem}
p{max-width:62ch}
p+p{margin-top:1rem}
a{color:var(--deep)}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
header{border-bottom:3px solid;border-image:var(--grad) 1}
header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2rem;padding-block:1.4rem}
.logo img{display:block;width:11rem;height:auto}
nav{display:flex;flex-wrap:wrap;gap:.25rem 1.6rem}
nav a{color:var(--grey);font-weight:700;text-decoration:none;padding:.3rem 0;border-bottom:3px solid transparent}
nav a:hover,nav a[aria-current]{border-image:var(--grad) 1}
.title{padding-top:3.5rem}
h1{font-size:clamp(2.4rem,6vw,3.6rem)}
h1 .dot{height:.3em;width:auto;margin-left:.07em}
.title p{margin-top:.9rem;font-size:1.2rem;font-weight:300}
.hero{display:grid;gap:2.5rem;align-items:center;padding-block:3.5rem 2.5rem}
.hero h1{font-size:clamp(2rem,4.4vw,3.1rem)}
.hero img{width:min(20rem,70vw);height:auto;justify-self:center}
@media(min-width:48rem){.hero{grid-template-columns:1.5fr 1fr}}
.section{padding-block:2.5rem 4rem}
h2{font-size:1.9rem;margin:2.5rem 0 1rem}
h3{font-size:1.25rem;margin-bottom:.4rem}
blockquote{font-size:1.7rem;line-height:1.25;padding-left:1.25rem;margin:1.75rem 0;max-width:30rem;border-left:.35rem solid;border-image:linear-gradient(180deg,#acd8a8,#00b194) 1}
.btn{display:inline-block;margin-top:1.75rem;padding:.8rem 1.7rem;background:var(--grad);color:#1d1d1e;font-weight:700;text-decoration:none;border-radius:.3rem}
.btn:hover{background:var(--teal)}
.list{display:grid;gap:2rem;margin-top:1.5rem}
.list>div{border-top:3px solid;border-image:var(--grad) 1;padding-top:.9rem}
@media(min-width:48rem){.list{grid-template-columns:1fr 1fr;gap:2.25rem 3rem}.list>div:last-child:nth-child(odd){grid-column:1/-1}}
.list .big{font-size:1.5rem;font-weight:900;color:var(--grey);text-decoration:underline var(--teal) 3px;text-underline-offset:.2em}
footer{background:var(--dark);color:#e8e8e8;border-top:4px solid;border-image:var(--grad) 1}
footer .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;padding-block:2rem}
footer img{display:block;width:9.5rem;height:auto}
footer a{color:var(--lg)}
