:root {
  --teal:#0f4e55;
  --ink:#203d3c;
  --cream:#f7f3eb;
  --paper:#fffcf7;
  --orange:#d86f41;
  --line:#d9ddd2;
  --muted:#52645f
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:24px
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.6
}
a {
  color:inherit;
  text-underline-offset:5px
}
img {
  max-width:100%;
  height:auto
}
a:focus-visible,summary:focus-visible {
  outline:3px solid var(--orange);
  outline-offset:6px;
  border-radius:3px
}
.wrap {
  width:min(1180px,calc(100% - 64px));
  margin-inline:auto
}
.skip {
  position:absolute;
  top:-100px;
  left:20px;
  z-index:10;
  background:var(--teal);
  color:white;
  padding:12px
}
.skip:focus {
  top:10px
}
.header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:25px 0;
  border-bottom:1px solid var(--line)
}
.brand {
  display:flex;
  gap:10px;
  align-items:center;
  text-decoration:none;
  font-family:Georgia,serif;
  font-size:33px;
  letter-spacing:-1px
}
.brand img {
  border-radius:12px;
  width:44px
}
.nav {
  display:flex;
  align-items:center;
  gap:30px;
  font-size:14px;
  font-weight:600
}
.nav>a:not(.nav-app) {
  text-decoration:none
}
.nav-app {
  border:1px solid var(--teal);
  border-radius:30px;
  padding:10px 20px;
  text-decoration:none
}
.hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:35px;
  align-items:center;
  min-height:650px;
  padding-block:65px
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:11px;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:10px
}
.status-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--orange)
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  line-height:1.07;
  letter-spacing:-2px
}
h1 {
  font-size:clamp(44px,5.6vw,73px);
  margin-block:26px
}
h1 em {
  color:var(--teal);
  font-weight:400
}
h2 {
  font-size:clamp(34px,4vw,51px);
  margin-bottom:22px
}
h3 {
  font-size:21px;
  line-height:1.3;
  letter-spacing:-.4px
}
.lead {
  font-size:18px;
  color:var(--muted);
  max-width:475px;
  line-height:1.75
}
.actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:24px;
  margin:30px 0 20px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  background:var(--teal);
  color:white;
  border-radius:30px;
  padding:15px 25px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  min-height:48px
}
.button:hover,.nav-app:hover {
  background:#183e41;
  color:white
}
.text-link {
  font-size:13px;
  font-weight:700
}
.fine {
  font-size:12px;
  color:var(--muted)
}
.community-art {
  height:495px;
  position:relative;
  background:#e8ebdf;
  border-radius:48% 48% 12px 12px;
  margin-left:15px;
  isolation:isolate
}
.art-orbit {
  position:absolute;
  width:320px;
  height:320px;
  border:1px dashed #859c8f;
  border-radius:50%;
  top:75px;
  left:50%;
  transform:translateX(-50%);
  z-index:-1
}
.art-center {
  position:absolute;
  top:135px;
  left:50%;
  transform:translateX(-50%);
  text-align:center
}
.art-center img {
  display:block;
  width:125px;
  border-radius:29px;
  margin:auto;
  box-shadow:0 14px 24px #0f4e5515
}
.art-center>span {
  display:block;
  font-size:12px;
  margin-top:12px;
  font-weight:700
}
.art-note {
  position:absolute;
  background:var(--paper);
  box-shadow:0 10px 25px #263c3510;
  border:1px solid #ffffff;
  border-radius:13px;
  padding:17px 19px 17px 54px;
  font-size:11px;
  line-height:1.7
}
.art-note strong,.art-note>span:not(.note-icon) {
  display:block
}
.art-note strong {
  font-size:12px
}
.note-icon {
  position:absolute;
  left:16px;
  top:17px;
  color:var(--teal);
  font-size:24px
}
.note-one {
  right:-8px;
  top:39px;
  transform:rotate(5deg)
}
.note-two {
  left:-16px;
  top:294px;
  transform:rotate(-5deg)
}
.note-three {
  right:-6px;
  top:368px;
  transform:rotate(3deg)
}
.art-caption {
  position:absolute;
  bottom:9px;
  width:100%;
  text-align:center;
  font-size:10px;
  color:var(--muted)
}
.intro-band {
  background:var(--teal);
  color:var(--cream)
}
.band-inner {
  display:flex;
  justify-content:space-between;
  padding-block:23px;
  gap:20px
}
.band-inner p {
  margin:0;
  font-size:14px
}
.band-inner p:first-child {
  font-family:Georgia,serif;
  font-size:22px
}
.section {
  padding-block:85px
}
.section-heading {
  max-width:560px;
  margin-bottom:40px
}
.section-heading>p:last-child {
  max-width:420px;
  color:var(--muted)
}
.cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px
}
.card {
  background:var(--paper);
  padding:32px;
  border-radius:14px;
  border:1px solid var(--line);
  display:flex;
  flex-direction:column
}
.card-number {
  font-size:10px;
  letter-spacing:1.5px;
  color:var(--muted);
  margin-bottom:36px
}
.card h3 {
  max-width:220px;
  font-family:Georgia,serif;
  font-weight:400;
  font-size:29px
}
.card p {
  font-size:14px;
  color:var(--muted);
  margin-bottom:30px
}
.card a {
  font-size:12px;
  font-weight:700;
  margin-top:auto
}
.how {
  border-block:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px
}
.how>div>p:last-child {
  color:var(--muted)
}
.steps {
  list-style:none;
  counter-reset:steps;
  margin:0;
  padding:0
}
.steps li {
  counter-increment:steps;
  position:relative;
  padding-left:56px;
  margin-bottom:27px
}
.steps li::before {
  content:'0' counter(steps);
  position:absolute;
  left:0;
  top:0;
  font-size:12px;
  color:var(--teal);
  background:#e7ebdf;
  border-radius:50%;
  width:35px;
  height:35px;
  display:grid;
  place-items:center
}
.steps h3 {
  font-size:17px;
  margin-bottom:5px
}
.steps p {
  font-size:14px;
  color:var(--muted);
  margin-bottom:0
}
.faq {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:65px
}
details {
  border-bottom:1px solid var(--line);
  padding:20px 0
}
summary {
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  padding-right:18px
}
details p {
  padding-top:15px;
  font-size:14px;
  color:var(--muted);
  margin:0
}
.closing {
  background:var(--teal);
  color:var(--cream);
  border-radius:18px;
  padding:55px;
  text-align:center;
  margin-bottom:70px
}
.closing .eyebrow {
  justify-content:center;
  color:#dce2d7
}
.closing h2 {
  font-size:clamp(38px,5vw,58px)
}
.button-light {
  background:var(--cream);
  color:var(--teal)
}
.footer {
  padding:30px 0 35px;
  border-top:1px solid var(--line)
}
.footer-top {
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center
}
.footer-links {
  display:flex;
  gap:25px;
  flex-wrap:wrap;
  font-size:12px
}
.footer-note {
  font-size:11px;
  color:var(--muted);
  margin:22px 0 0
}
.document {
  max-width:850px;
  padding-block:65px 90px;
  min-height:65vh
}
.document h1 {
  font-size:56px
}
.document h2 {
  font-family:Arial,sans-serif;
  font-weight:600;
  font-size:23px;
  letter-spacing:-.5px;
  line-height:1.3;
  margin-top:35px
}
.document section {
  padding-bottom:15px;
  border-bottom:1px solid var(--line)
}
.document li {
  margin-bottom:9px
}
.document .lead {
  max-width:700px
}
.support-panel {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:15px;
  padding:25px;
  margin:35px 0
}
.support-panel h2 {
  margin-top:0
}
.not-found {
  padding-block:100px
}
@media(max-width:900px) {
  .hero {
    gap:15px
  }
  .community-art {
    height:420px
  }
  .art-note {
    padding:13px 14px 13px 45px
  }
  .note-one {
    right:0
  }
  .note-two {
    left:-12px;
    top:280px
  }
  .note-three {
    right:0;
    top:345px
  }
  .art-caption {
    display:none
  }
  .art-center {
    top:130px
  }
  .art-orbit {
    width:250px;
    height:250px
  }
  .cards {
    gap:12px
  }
  .card {
    padding:23px
  }
  .how {
    gap:40px
  }
  .nav {
    gap:20px
  }
}
@media(max-width:680px) {
  .wrap {
    width:calc(100% - 36px)
  }
  .header {
    padding-block:18px;
    gap:12px
  }
  .brand {
    font-size:28px
  }
  .brand img {
    width:36px
  }
  .nav {
    gap:13px;
    font-size:12px
  }
  .nav-app {
    padding:9px 13px
  }
  .nav-discover {
    display:none
  }
  .hero {
    grid-template-columns:1fr;
    padding-top:35px;
    padding-bottom:40px;
    gap:28px
  }
  .hero h1 {
    font-size:49px;
    letter-spacing:-1.8px
  }
  .lead {
    font-size:16px
  }
  .community-art {
    width:min(360px,calc(100% - 20px));
    height:405px;
    margin:0 auto
  }
  .art-center {
    top:120px
  }
  .art-center img {
    width:108px
  }
  .note-one {
    top:30px
  }
  .note-two {
    top:259px
  }
  .note-three {
    top:325px
  }
  .band-inner {
    flex-direction:column;
    gap:3px
  }
  .band-inner p {
    font-size:12px
  }
  .section {
    padding-block:50px
  }
  .cards {
    grid-template-columns:1fr;
    gap:15px
  }
  .card-number {
    margin-bottom:22px
  }
  .card h3 {
    max-width:100%
  }
  .card p {
    margin-bottom:15px
  }
  .how,.faq {
    grid-template-columns:1fr;
    gap:22px
  }
  .closing {
    padding:35px 20px;
    margin-bottom:45px
  }
  .footer-top {
    align-items:flex-start;
    flex-direction:column
  }
  .footer-links {
    gap:19px
  }
  .document {
    padding-block:40px 60px
  }
  .document h1 {
    font-size:43px
  }
  .actions {
    gap:19px
  }
  .text-link {
    font-size:12px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
}

/* Homepage enhancement: shared pages continue to use the original styles. */
.home-page .hero { gap:60px; min-height:610px; }
.home-page .home-art {
  position:relative; margin:0; padding:32px 24px 30px 55px;
  background:linear-gradient(145deg,var(--teal),var(--ink));
  color:var(--cream); border-radius:160px 160px 18px 18px;
  text-align:center; overflow:hidden;
}
.home-page .home-border { position:absolute; left:0; top:0; height:100%; width:24px; object-fit:cover; }
.home-page .home-art .eyebrow { justify-content:center; margin:18px 0 24px; font-size:10px; letter-spacing:1.4px; }
.home-page .home-cheetah { display:block; width:351px; max-width:100%; margin:auto; border-radius:100px 100px 8px 8px; }
.home-page .home-art figcaption { font-family:Georgia,serif; font-size:29px; line-height:1.2; margin:25px 0 14px; }
.home-page .home-art figcaption em { font-weight:400; }
.home-page .home-art-note { font-size:11px; letter-spacing:1px; }
.home-page .intro-band { background:var(--paper); color:var(--ink); border-block:1px solid var(--line); }
.home-page .home-values { display:grid; grid-template-columns:repeat(3,1fr); padding-block:28px; gap:28px; }
.home-page .home-values>div { display:flex; align-items:center; gap:17px; }
.home-page .home-values img { width:48px; height:50px; object-fit:contain; flex-shrink:0; }
.home-page .home-values p { margin:0; font-size:13px; }
.home-page .home-values strong { display:block; font-size:16px; color:var(--teal); }
.home-page .home-values span { color:var(--muted); }
.home-page .home-listening { border-bottom:1px solid var(--line); }
.home-page .home-listening .section-heading { margin-inline:auto; text-align:center; max-width:640px; }
.home-page .home-listening .eyebrow { justify-content:center; }
.home-page .home-listening .section-heading>p:last-child { max-width:520px; margin-inline:auto; }
.home-page .home-principles { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; padding:0; margin:0; list-style:none; text-align:center; }
.home-page .home-principles img { width:76px; height:78px; object-fit:contain; margin-bottom:18px; }
.home-page .home-principles h3 { font-family:Georgia,serif; font-weight:400; font-size:26px; margin-bottom:10px; }
.home-page .home-principles p { font-size:14px; color:var(--muted); margin:0 auto; max-width:225px; }
.home-page .card { border-top:3px solid var(--orange); }
.home-page .card-number { margin-bottom:20px; }
.home-page .home-card-art { height:118px; display:flex; align-items:center; margin-bottom:24px; }
.home-page .home-card-art img { max-height:118px; width:auto; max-width:100%; border-radius:8px; }
.home-page .how { padding:48px; border-radius:18px; background:var(--teal); color:var(--cream); gap:60px; }
.home-page .how>div>p:last-child,.home-page .steps p { color:var(--cream); }
.home-page .steps li::before { background:var(--cream); color:var(--teal); border:2px solid var(--orange); }
.home-page .steps li:last-child { margin-bottom:0; }
.home-page .questions { background:var(--paper); padding:8px 26px; border:1px solid var(--line); border-radius:14px; }
.home-page .questions details:last-child { border-bottom:0; }
.home-page .closing { position:relative; overflow:hidden; }
.home-page .home-closing-art { display:block; width:210px; margin:0 auto 26px; border-radius:12px; }
@media(max-width:1000px) {
  .home-page .hero { gap:28px; }
  .home-page .home-values { gap:18px; }
  .home-page .home-values>div { gap:12px; }
  .home-page .home-principles { gap:18px; }
}
@media(max-width:680px) {
  .home-page .hero { min-height:0; }
  .home-page .home-art { width:min(410px,100%); margin-inline:auto; padding:24px 20px 28px 42px; }
  .home-page .home-art figcaption { font-size:27px; }
  .home-page .home-values { grid-template-columns:1fr; gap:22px; }
  .home-page .home-principles { grid-template-columns:repeat(2,1fr); gap:30px 18px; }
  .home-page .home-principles h3 { font-size:23px; }
  .home-page .how { padding:30px 22px; gap:24px; }
  .home-page .questions { padding:4px 18px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }