@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');
:root{--paper:#f8f9f6;--ink:#223634;--muted:#5e6e65;--blue:#257b94;--line:#dde2da}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}header,main,footer{max-width:1200px;margin:auto}header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:26px;font-weight:800;letter-spacing:-.8px}.brand-icon{margin-right:9px;font-size:29px}.brand-dot{color:var(--blue)}nav{display:flex;gap:34px;font-size:16px}nav a:hover,.text-link:hover,.inline-link:hover{color:var(--blue)}.nav-x{font-size:16px;border:1px solid #cdd6cd;border-radius:30px;padding:11px 17px}.hero{padding:76px 0 64px;display:grid;grid-template-columns:1.15fr 1fr;gap:50px;align-items:center}.eyebrow,.section-label{font-size:13px;letter-spacing:2px;font-weight:600;color:var(--muted)}.eyebrow{display:flex;align-items:center;gap:9px}.eyebrow i{width:7px;height:7px;border-radius:50%;background:#76a586}h1{font-size:53px;line-height:1.43;letter-spacing:-2px;margin:23px 0}.blue{color:var(--blue)}.intro{font-size:18px;color:#5e6e65;line-height:2.1}.intro strong{color:var(--ink);font-weight:600}.actions{display:flex;align-items:center;gap:27px;margin-top:29px}.button{display:inline-flex;gap:32px;align-items:center;padding:15px 23px;background:var(--ink);color:white;border-radius:6px;font-size:16px;transition:background .2s,transform .2s}.button:hover{background:var(--blue);transform:translateY(-2px)}.text-link{font-size:16px}.hero-bottom{display:flex;gap:23px;margin-top:35px;font-size:14px;color:var(--muted)}.ocean-art{height:440px;position:relative;background:#e5efec;border-radius:150px 150px 10px 10px;overflow:hidden;border:1px solid #d8e4df}.art-top,.art-bottom{position:absolute;left:28px;right:28px;font-size:12px;letter-spacing:1.5px;color:#658b8a;display:flex;justify-content:space-between}.art-top{top:70px;left:67px;right:67px}.art-top span{font-size:22px}.art-bottom{bottom:23px}.whale{position:absolute;width:103%;left:-2%;top:76px;transform:rotate(-9deg);filter:drop-shadow(0 16px 12px #376e7915)}.orbit{border:1px solid #b3cec76e;border-radius:50%;position:absolute;transform:rotate(-30deg);width:580px;height:240px;left:-30px;top:130px}.orbit-two{top:164px;left:-80px;width:600px}.spark{position:absolute;color:#669f9f}.spark-one{right:49px;top:135px;font-size:32px}.spark-two{left:47px;top:160px;font-size:24px}.floating-note{position:absolute;bottom:61px;right:31px;transform:rotate(-6deg);background:#f9fbf1;padding:12px 17px;font-size:14px;color:#4c726e;box-shadow:0 4px 18px #42675f0c;border-radius:3px}.about{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:49px 0;display:grid;grid-template-columns:1fr 2.2fr .8fr;gap:30px}.section-label span{display:block;letter-spacing:1px;font-size:14px;margin-top:13px}h2{font-size:30px;letter-spacing:-.7px;margin:0 0 20px}.about p{font-size:16px;color:var(--muted);line-height:2;margin:10px 0}.inline-link{font-size:14px;display:inline-block;margin-top:12px;border-bottom:1px solid #abbcb2;padding-bottom:5px}.year{display:flex;flex-direction:column;justify-content:center;padding-left:28px;border-left:1px solid var(--line)}.year strong{font-size:73px;font-weight:500;line-height:1.2;letter-spacing:-4px}.year strong span{font-size:18px;margin-left:10px;letter-spacing:0}.year>span{font-size:12px;letter-spacing:2px;margin-top:9px}.year small{font-size:13px;color:var(--muted);margin-top:17px}.explore{padding:62px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.section-heading h2{margin:12px 0 0}.section-heading p{font-size:14px;color:var(--muted)}.topics{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.topics article{border:1px solid var(--line);border-radius:8px;padding:27px 28px;background:#fcfcf8;transition:transform .2s}.topics article:hover{transform:translateY(-4px)}.topic-number{font-size:12px;color:var(--muted);letter-spacing:1.5px}.topic-icon{font-size:35px;color:var(--blue);margin-top:22px;height:48px}h3{font-size:22px;margin:12px 0}.topics p{font-size:16px;line-height:2;color:var(--muted);margin-bottom:24px}.topic-tags{font-size:13px;color:#5d766b;border-top:1px solid var(--line);display:block;padding-top:18px}.connect{background:#eaf0e8;border-radius:8px;display:flex;align-items:center;gap:25px;padding:37px 40px;margin:0 0 60px}.connect-symbol{font-size:48px}.connect h2{margin:9px 0;font-size:30px}.connect p{font-size:16px;color:var(--muted);margin:0}.connect .button{margin-left:auto}footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:27px 0 37px}footer .brand{font-size:20px}footer>span{font-size:14px;color:var(--muted)}footer>a:last-child{font-size:12px;letter-spacing:1px}@media(min-width:1500px){header,main,footer{max-width:1260px}.hero{gap:80px}}@media(max-width:1280px){header,main,footer{margin-left:6%;margin-right:6%}h1{font-size:44px}.hero{gap:35px}.ocean-art{height:410px}}@media(max-width:800px){header{height:85px}nav{gap:16px;font-size:14px}.nav-x{display:none}.hero{grid-template-columns:1fr;padding-top:45px;gap:35px}.hero-copy{max-width:560px}h1{font-size:42px}.ocean-art{height:380px;max-width:520px;width:100%;justify-self:center}.whale{height:310px;top:46px}.art-top{top:48px}.about{grid-template-columns:1fr 3fr}.year{display:none}.topics{grid-template-columns:1fr}.topics article{padding:25px}.topic-icon{float:right;margin-top:0}.section-heading{display:block}.connect{flex-wrap:wrap;padding:28px 24px}.connect .button{margin-left:0}.connect-symbol{display:none}.section-heading p{margin-top:16px}.hero-bottom{gap:16px}.brand{font-size:22px}.brand-icon{font-size:24px}.about{gap:20px}.about h2{font-size:26px}.about .section-label{font-size:12px;letter-spacing:1px}.desktop{display:none}footer>span{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Comfortable reading sizes and responsive spacing. */
body { font-size: 16px; line-height: 1.75; }
.hero-copy, .about > div, .topics article { min-width: 0; }
.intro { line-height: 1.95; }
.about p, .topics p, .connect p { line-height: 1.9; }
.actions, .hero-bottom, .section-heading { flex-wrap: wrap; }
.section-heading { gap: 12px 28px; }
.button { min-height: 48px; flex-shrink: 0; }
nav a { display: inline-flex; align-items: center; min-height: 44px; }
.about { grid-template-columns: 1fr 2.4fr .8fr; }
.about .desktop { display: none; }
.art-top, .art-bottom { letter-spacing: .7px; }
.connect { flex-wrap: wrap; }
@media (max-width: 1000px) {
  .hero { grid-template-columns: 1fr; }
  .hero-copy { max-width: 680px; }
  .ocean-art { width: 100%; max-width: 520px; justify-self: center; }
  .about { grid-template-columns: 1fr 3fr; }
  .year { display: none; }
  .topics { grid-template-columns: 1fr; }
}
@media (max-width: 800px) {
  header { height: auto; min-height: 100px; padding: 18px 0; flex-wrap: wrap; gap: 8px 20px; }
  nav { flex-wrap: wrap; gap: 8px 20px; }
  .about { grid-template-columns: 1fr; gap: 24px; }
  .about .section-label { font-size: 13px; }
  .actions { gap: 16px 24px; }
  .hero-bottom { gap: 10px 18px; }
  .intro { font-size: 18px; }
  h2, .about h2, .connect h2 { font-size: 28px; line-height: 1.5; }
  .connect .button { margin-left: 0; }
}
@media (max-width: 400px) {
  h1 { font-size: 36px; letter-spacing: -1px; }
  .art-top { left: 28px; right: 28px; }
  .art-bottom { gap: 12px; }
  .connect { padding: 26px 20px; }
}
