@font-face {
  font-family: 'Atkinson Hyperlegible Next';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(/fonts/atkinson-hyperlegible-next-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/bricolage-grotesque-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root{
  --canopy:#0E3B2E;
  --canopy-2:#164A3A;
  --leaf:#2F7D4F;
  --sprout:#9FD3A8;
  --toucan:#F4B92A;
  --ink:#10221A;
  --ink-soft:#43574C;
  --paper:#F5F7F2;
  --mist:#D9E2D8;
  --display:"Bricolage Grotesque",system-ui,sans-serif;
  --body:"Atkinson Hyperlegible Next",system-ui,sans-serif;
  --gutter:clamp(20px,5vw,72px);
  --max:1180px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--toucan);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-999px;top:8px;background:var(--toucan);color:var(--ink);padding:8px 14px;border-radius:6px;z-index:10}
.skip:focus{left:8px}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--canopy);color:var(--paper);isolation:isolate}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:28px;padding-bottom:28px}
.brand{display:flex;align-items:center;gap:10px;font:700 1.15rem/1 var(--display);letter-spacing:-.01em;text-decoration:none}
.brand svg{width:28px;height:28px}
.topnav{display:flex;align-items:center;gap:24px}
.lang{font:600 .95rem/1 var(--body);text-decoration:none;padding:8px 12px;border:1px solid rgba(245,247,242,.35);border-radius:999px}
.lang:hover{border-color:var(--toucan);color:var(--toucan)}
.toplink{font-weight:600;text-decoration:none;border-bottom:1px solid rgba(245,247,242,.35);padding-bottom:2px}
.toplink:hover{border-color:var(--toucan)}
.hero-body{padding-top:clamp(48px,10vw,120px);padding-bottom:clamp(72px,12vw,150px);position:relative;z-index:1}
.hero h1{font:800 clamp(2.6rem,7.4vw,6.2rem)/.95 var(--display);letter-spacing:-.035em;margin:0;max-width:11.5ch;font-variation-settings:"opsz" 96}
.hero .lede{max-width:34rem;margin:clamp(24px,3vw,36px) 0 0;font-size:clamp(1.05rem,1.4vw,1.2rem);color:#CFE0D3}
.actions{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:36px}
.btn{display:inline-block;background:var(--toucan);color:var(--ink);font:700 1rem/1 var(--display);padding:16px 26px;border-radius:999px;text-decoration:none;transition:transform .15s ease,background .15s ease}
.btn:hover{background:#FFC93F;transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.textlink{font-weight:600;text-decoration:none;color:var(--paper);border-bottom:1px solid rgba(245,247,242,.35);padding-bottom:2px}
.textlink:hover{border-color:var(--toucan)}

.canopy{position:absolute;right:-6%;bottom:-14%;width:min(70vw,900px);height:auto;z-index:0;pointer-events:none}
.canopy .lf{fill:none;stroke:var(--sprout);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.canopy .solid{fill:var(--canopy-2);stroke:none}
.canopy .lf.y{stroke:var(--toucan)}
@media (prefers-reduced-motion:no-preference){
  .canopy .lf{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.8s cubic-bezier(.6,.05,.25,1) forwards;animation-delay:calc(var(--i,0) * 110ms + 150ms)}
  .canopy .solid{opacity:0;animation:fade 1.4s ease forwards;animation-delay:calc(var(--i,0) * 110ms + 500ms)}
  @keyframes draw{to{stroke-dashoffset:0}}
  @keyframes fade{to{opacity:1}}
}
@media (max-width:760px){
  .canopy{width:120vw;right:-45%;bottom:-10%;opacity:.55}
}

/* ---------- areas ---------- */
.areas{padding-top:clamp(72px,10vw,128px);padding-bottom:clamp(56px,8vw,96px)}
.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:24px 64px;align-items:end;margin-bottom:clamp(40px,6vw,72px)}
.intro h2{font:700 clamp(2rem,4.2vw,3.25rem)/1.02 var(--display);letter-spacing:-.03em;margin:0}
.intro p{margin:0;color:var(--ink-soft);max-width:36rem}
.area{display:grid;align-items:start;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1.1fr);gap:20px 48px;padding:clamp(28px,4vw,44px) 0;border-top:1px solid var(--mist)}
.area:last-child{border-bottom:1px solid var(--mist)}
.area h3{display:flex;align-items:center;gap:14px;font:700 clamp(1.5rem,2.2vw,1.85rem)/1.05 var(--display);letter-spacing:-.02em;margin:0}
.area h3 svg{flex:none;width:34px;height:34px;color:var(--leaf)}
.area > p{margin:0;font-size:1.1rem;max-width:30rem}
.area ul{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.area li strong{display:block;font:600 1.02rem/1.3 var(--body)}
.area li span{color:var(--ink-soft);font-size:.98rem}

/* ---------- contact ---------- */
.contact{background:var(--canopy);color:var(--paper);padding:clamp(72px,10vw,120px) 0 40px}
.contact p{margin:0 0 14px;color:#CFE0D3;font-size:1.15rem;max-width:32rem}
.mail{display:inline-block;font:800 clamp(1.6rem,4vw,3rem)/1.1 var(--display);letter-spacing:-.03em;color:var(--paper);text-decoration:none;word-break:break-word;border-bottom:3px solid var(--toucan);padding-bottom:4px}
.mail:hover{color:var(--toucan)}
footer a{color:inherit;text-underline-offset:3px}
footer a:hover{color:var(--toucan)}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(64px,9vw,112px);padding-top:24px;border-top:1px solid rgba(245,247,242,.15);font-size:.92rem;color:#9DB5A6}

/* ---------- legal pages ---------- */
.hero.compact .hero-body{padding-top:clamp(32px,6vw,72px);padding-bottom:clamp(48px,7vw,88px)}
.hero.compact h1{font-size:clamp(2.3rem,5.4vw,4rem);max-width:none}
.hero.compact .lede{margin-top:16px;font-size:1rem}
.prose{padding-top:clamp(48px,7vw,88px);padding-bottom:clamp(56px,8vw,96px)}
.prose > *{max-width:44rem}
.prose h2{font:700 clamp(1.35rem,2vw,1.6rem)/1.2 var(--display);letter-spacing:-.015em;margin:2.2em 0 .5em}
.prose h2:first-child{margin-top:0}
.prose p,.prose ul{margin:0 0 1em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.4em}
.prose li::marker{color:var(--leaf)}
.prose a{color:var(--leaf);text-underline-offset:3px}
.prose a:hover{color:var(--ink)}
.prose address{font-style:normal}

@media (max-width:900px){
  .intro{grid-template-columns:1fr}
  .area{grid-template-columns:1fr 1fr}
  .area h3{grid-column:1/-1}
}
@media (max-width:600px){
  .area{grid-template-columns:1fr}
  .toplink{display:none}
}