:root {
  --ink:#101b2b;
  --ink-2:#17273a;
  --muted:#647080;
  --mint:#a6f2d7;
  --mint-dark:#3e9c7c;
  --paper:#f7f9f8;
  --white:#fff;
  --line:#e2e8e7;
  --radius:24px;
  --shadow:0 24px 70px rgba(13,36,51,.11)
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Aptos',Arial,sans-serif;
  -webkit-font-smoothing:antialiased
}
button,a {
  font:inherit
}
button {
  cursor:pointer
}
a {
  color:inherit;
  text-decoration:none
}
img {
  max-width:100%
}
::selection {
  background:var(--mint);
  color:var(--ink)
}
.shell {
  width:min(100% - 64px,1280px);
  margin-inline:auto
}
.section-pad {
  padding:130px 0
}
.skip-link {
  position:absolute;
  z-index:1000;
  left:16px;
  top:-60px;
  padding:12px 18px;
  background:#fff;
  border-radius:10px
}
.skip-link:focus {
  top:16px
}
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:11px;
  line-height:1.5;
  font-weight:800;
  letter-spacing:.17em
}
.eyebrow-line {
  width:23px;
  height:1px;
  background:currentColor
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:35px;
  min-height:54px;
  padding:0 22px;
  border-radius:100px;
  font-size:13px;
  font-weight:800;
  transition:transform .25s,background .25s,box-shadow .25s
}
.button:hover {
  transform:translateY(-3px)
}
.button:focus-visible,.text-link:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid #69cfaa;
  outline-offset:4px
}
.button span {
  font-size:19px;
  font-weight:400
}
.button-dark {
  background:var(--ink);
  color:#fff
}
.button-dark:hover {
  background:#30455a;
  box-shadow:0 12px 25px rgba(11,28,40,.17)
}
.button-mint {
  background:var(--mint);
  color:var(--ink)
}
.button-mint:hover {
  background:#c4ffe8;
  box-shadow:0 12px 35px rgba(166,242,215,.22)
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:20px;
  font-size:13px;
  font-weight:800;
  color:#fff;
  padding:15px 0
}
.text-link span {
  font-size:20px;
  font-weight:400;
  transition:transform .25s
}
.text-link:hover span {
  transform:translate(3px,-3px)
}
.dark-link {
  color:var(--ink)
}
.announcement {
  height:36px;
  background:#a6f2d7;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  color:#10263a;
  font-size:11px;
  font-weight:600
}
.announcement-pill {
  border:1px solid #344e4b;
  border-radius:20px;
  padding:2px 7px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em
}
.announcement a {
  font-weight:800;
  border-bottom:1px solid currentColor
}
.site-header {
  position:absolute;
  top:52px;
  left:0;
  width:100%;
  z-index:30
}
.nav {
  height:72px;
  padding:7px 9px 7px 27px;
  background:#fff;
  border:1px solid rgba(255,255,255,.7);
  border-radius:100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  box-shadow:0 18px 45px rgba(1,13,28,.12)
}
.brand {
  display:inline-flex;
  align-items:center;
  white-space:nowrap
}
.brand-logo {
  display:block;
  width:190px;
  height:40px;
  overflow:hidden
}
.brand-logo img {
  display:block;
  width:auto;
  max-width:none;
  height:40px
}
.nav-links {
  display:flex;
  align-items:center;
  gap:30px;
  margin-left:auto;
  margin-right:30px
}
.nav-links>a {
  font-size:12px;
  font-weight:700;
  color:#354353;
  transition:color .2s
}
.nav-links>a:hover {
  color:#268f6d
}
.nav-mobile-cta {
  display:none!important
}
.nav-cta {
  min-height:52px;
  padding:0 23px
}
.menu-toggle {
  display:none;
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  border-radius:50%;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px
}
.menu-toggle span {
  width:20px;
  height:2px;
  border-radius:2px;
  background:var(--ink);
  transition:transform .25s
}
.menu-toggle[aria-expanded=true] span:first-child {
  transform:translateY(3.5px) rotate(45deg)
}
.menu-toggle[aria-expanded=true] span:last-child {
  transform:translateY(-3.5px) rotate(-45deg)
}
.hero {
  position:relative;
  overflow:hidden;
  background:radial-gradient(ellipse 70% 42% at 70% 69%,#315d63 0%,transparent 72%),radial-gradient(ellipse 48% 45% at 3% 80%,#1d5b65 0%,transparent 72%),linear-gradient(145deg,#0d1625 10%,#17273a 65%,#102c39);
  color:#fff;
  padding:202px 0 0;
  isolation:isolate
}
.hero:before {
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(255,255,255,.12) .6px,transparent .6px);
  background-size:20px 20px;
  opacity:.09;
  pointer-events:none
}
.hero-glow {
  position:absolute;
  width:650px;
  height:650px;
  border:1px solid rgba(140,240,205,.12);
  border-radius:50%;
  right:-240px;
  top:200px;
  box-shadow:0 0 0 90px rgba(140,240,205,.025),0 0 0 190px rgba(140,240,205,.018)
}
.hero-inner {
  position:relative;
  z-index:2;
  text-align:center
}
.hero-eyebrow {
  color:var(--mint);
  justify-content:center
}
.hero h1 {
  font:800 clamp(52px,7.3vw,105px)/1.06 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.075em;
  margin:27px auto 25px;
  max-width:1100px
}
.hero h1>span:first-child {
  color:var(--mint)
}
.word-window {
  display:inline-block;
  color:var(--mint);
  min-width:5.6em;
  text-align:left
}
.word-window span {
  display:inline-block;
  transition:opacity .28s,transform .28s
}
.word-window span.out {
  opacity:0;
  transform:translateY(-14px)
}
.word-window span.in {
  animation:word-in .4s ease both
}
@keyframes word-in {
  from {
    opacity:0;
    transform:translateY(14px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
.hero-copy {
  font-size:17px;
  line-height:1.6;
  color:#d3dfe2;
  max-width:580px;
  margin:0 auto
}
.hero-actions {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:28px;
  margin-top:31px
}
.hero-proof {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  text-align:left;
  margin-top:45px;
  color:#b9ccce;
  font-size:11px;
  line-height:1.5
}
.proof-avatars {
  display:flex;
  padding-left:10px
}
.proof-avatars b {
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  border:2px solid #294252;
  border-radius:50%;
  margin-left:-10px;
  background:#df9b82;
  color:#321b22;
  font-size:9px
}
.proof-avatars b:nth-child(2) {
  background:#9fd9c0
}
.proof-avatars b:nth-child(3) {
  background:#abc9df
}
.hero-product {
  position:relative;
  margin-top:78px;
  height:640px;
  z-index:2
}
.product-glow {
  position:absolute;
  inset:0 3% auto;
  height:600px;
  background:linear-gradient(130deg,rgba(161,241,214,.22),rgba(116,162,202,.14));
  border:1px solid rgba(255,255,255,.28);
  border-radius:37px 37px 0 0;
  transform:perspective(1000px) rotateX(7deg) scale(1.03);
  box-shadow:0 0 100px rgba(155,237,215,.17)
}
.desktop-app {
  position:relative;
  display:grid;
  grid-template-columns:220px 1fr;
  overflow:hidden;
  width:89%;
  height:600px;
  margin:0 auto;
  background:#f7f9fa;
  color:#1f2c3d;
  border:5px solid #c4d5d6;
  border-bottom:0;
  border-radius:28px 28px 0 0;
  box-shadow:0 20px 80px rgba(0,0,0,.28);
  transform:perspective(1100px) rotateX(4deg);
  transform-origin:bottom
}
.app-sidebar {
  background:#f0f4f5;
  border-right:1px solid #e3e9eb;
  padding:26px 14px 15px;
  display:flex;
  flex-direction:column
}
.app-mini-brand {
  font:800 21px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.08em;
  margin:0 10px 32px
}
.app-mini-brand span:last-child {
  color:#5bc4a3
}
.mini-mark {
  font-size:19px;
  letter-spacing:0;
  color:#3bb68c
}
.workspace-label {
  font-size:8px;
  letter-spacing:.12em;
  font-weight:800;
  color:#9aa7b0;
  margin:0 10px 12px
}
.workspace-switch {
  display:flex;
  align-items:center;
  gap:8px;
  background:#fff;
  border:1px solid #e4eaed;
  border-radius:9px;
  padding:8px;
  font-size:10px;
  font-weight:800;
  box-shadow:0 4px 12px rgba(12,47,63,.04)
}
.workspace-switch>span:last-child {
  margin-left:auto;
  color:#9ba8b0
}
.workspace-logo {
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:#20384c;
  color:#fff;
  font-size:11px
}
.app-nav {
  padding-top:24px;
  display:grid;
  gap:5px
}
.app-nav div {
  padding:10px;
  border-radius:8px;
  font-size:10px;
  font-weight:700;
  color:#72818d
}
.app-nav div.active {
  background:#dff3eb;
  color:#1c755b
}
.nav-icon {
  display:inline-block;
  width:22px;
  font-size:15px;
  vertical-align:-1px
}
.sidebar-bottom {
  border-top:1px solid #dce5e8;
  margin-top:auto;
  padding:14px 4px 0;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  font-weight:800
}
.sidebar-bottom small,.post-author small {
  display:block;
  color:#9da9b1;
  font-size:8px;
  font-weight:600;
  margin-top:2px
}
.sidebar-bottom>span:last-child {
  margin-left:auto
}
.avatar {
  display:inline-grid;
  place-items:center;
  flex:none;
  width:28px;
  height:28px;
  border-radius:50%;
  font-size:8px;
  font-weight:800
}
.avatar-blue {
  background:#b6d6e6;
  color:#25506b
}
.avatar-peach {
  background:#efc4af;
  color:#754533
}
.app-main {
  padding:0 32px 30px;
  overflow:hidden
}
.app-top {
  height:59px;
  border-bottom:1px solid #edf0f0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#94a0a9;
  font-size:9px;
  font-weight:700
}
.app-top-icons {
  display:flex;
  align-items:center;
  font-size:15px;
  color:#5a6c77
}
.app-top-icons .avatar {
  width:23px;
  height:23px
}
.app-greeting {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:32px 0 24px
}
.app-kicker {
  font-size:8px;
  color:#44b18b;
  letter-spacing:.13em;
  font-weight:800
}
.app-greeting h2 {
  font:800 25px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.055em;
  margin:5px 0 5px
}
.app-greeting h2 span {
  color:#52bd99
}
.app-greeting p {
  font-size:10px;
  color:#9aa6af;
  margin:0
}
.weather {
  background:#fff;
  border:1px solid #e8edee;
  border-radius:9px;
  padding:9px 13px;
  font-weight:800;
  font-size:11px
}
.weather small {
  display:block;
  font-size:8px;
  color:#aab5bb;
  margin-left:25px
}
.app-grid {
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(170px,.9fr);
  gap:16px
}
.compose {
  height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  background:#fff;
  border:1px solid #e9eeef;
  border-radius:12px;
  padding:8px 12px;
  font-size:9px;
  color:#a4b0b8
}
.compose b {
  margin-left:auto;
  color:#43b38b;
  font-size:17px
}
.feed-post {
  margin-top:13px;
  background:#fff;
  border:1px solid #e9eeef;
  border-radius:12px;
  padding:16px;
  font-size:10px;
  box-shadow:0 6px 15px rgba(22,53,68,.03)
}
.post-author {
  display:flex;
  align-items:center;
  gap:8px
}
.post-author b {
  margin-left:auto;
  font-size:17px;
  color:#aeb8bb
}
.feed-post p {
  line-height:1.5;
  color:#50606d;
  margin:13px 0
}
.feed-post p span {
  color:#46bb92
}
.post-image {
  height:165px;
  border-radius:8px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(circle at 80% 20%,#80d7bf 0%,transparent 26%),linear-gradient(135deg,#1d6376,#1a394d 58%,#142738);
  color:#d5ffe8;
  text-align:center;
  font:800 24px/1.1 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.05em
}
.image-spark {
  font-size:30px;
  margin-left:10px;
  color:#9ef1d3
}
.post-reactions {
  padding-top:13px;
  color:#8799a2;
  font-size:9px
}
.app-aside {
  display:grid;
  gap:13px;
  align-content:start
}
.aside-card {
  background:#fff;
  border:1px solid #e9eeef;
  border-radius:12px;
  padding:15px
}
.aside-head,.insight-top {
  display:flex;
  justify-content:space-between;
  font-size:10px;
  font-weight:800
}
.aside-head span:last-child {
  font-size:14px;
  color:#79a494
}
.calendar-days {
  display:flex;
  justify-content:space-between;
  margin-top:18px
}
.calendar-days b {
  display:grid;
  place-items:center;
  gap:5px;
  width:27px;
  height:40px;
  border-radius:14px;
  font-size:8px;
  color:#9daab0
}
.calendar-days small {
  font-size:10px;
  color:#384a55
}
.calendar-days .today {
  background:#c8f1e2;
  color:#25795d
}
.event {
  display:flex;
  gap:7px;
  align-items:flex-start;
  background:#f0f8f4;
  border-radius:8px;
  padding:10px;
  margin-top:14px;
  font-size:8px
}
.event-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#4cb38e;
  margin-top:4px
}
.event small {
  display:block;
  color:#84959c;
  margin-top:3px
}
.celebration>span {
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  background:#fef0dd;
  color:#f0a151;
  font-size:18px;
  margin-bottom:10px
}
.celebration strong {
  font-size:11px
}
.celebration p {
  font-size:9px;
  color:#87969e;
  line-height:1.5
}
.celebration a {
  font-size:9px;
  font-weight:800;
  color:#3ba985
}
.floating-note {
  position:absolute;
  z-index:4;
  left:0;
  top:250px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:12px 16px;
  border-radius:13px;
  background:#fff;
  color:#183b34;
  box-shadow:0 16px 36px rgba(0,0,0,.23);
  transform:rotate(-5deg);
  font-size:10px
}
.floating-note small {
  display:block;
  margin-top:3px;
  color:#7f9590
}
.note-icon {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:50%;
  background:#bcf4db;
  color:#1f8b66
}
.mobile-app {
  position:absolute;
  z-index:5;
  right:0;
  top:235px;
  width:195px;
  height:405px;
  padding:8px;
  background:#1e2d39;
  border:2px solid #aabac0;
  border-radius:31px 31px 0 0;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
  transform:rotate(6deg);
  overflow:hidden
}
.phone-notch {
  position:absolute;
  z-index:2;
  top:8px;
  left:50%;
  transform:translateX(-50%);
  width:56px;
  height:13px;
  background:#162431;
  border-radius:0 0 11px 11px
}
.phone-inner {
  height:100%;
  background:#f7faf9;
  border-radius:23px 23px 0 0;
  padding:24px 12px 0;
  color:#213546
}
.phone-top {
  display:flex;
  justify-content:space-between;
  font:800 15px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.07em;
  margin-bottom:25px
}
.phone-top span span,.phone-ui-top>span:first-child {
  color:#4cc092
}
.phone-top>span:last-child {
  font-size:14px;
  color:#879ba3
}
.phone-inner>small {
  font-size:9px;
  color:#718990
}
.phone-inner h3 {
  font:800 18px/1.1 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.06em;
  margin:6px 0 13px
}
.phone-feature {
  height:124px;
  border-radius:10px;
  padding:12px;
  background:radial-gradient(circle at 90% 30%,#77d9ad,transparent 40%),linear-gradient(130deg,#20455c,#4ba482);
  color:#fff
}
.phone-feature>span {
  font-size:19px
}
.phone-feature strong {
  display:block;
  font:800 14px/1.1 Aptos Display,Segoe UI,Arial,sans-serif;
  margin:6px 0
}
.phone-feature small {
  font-size:7px;
  color:#e7fff0
}
.phone-shortcuts {
  display:flex;
  justify-content:space-around;
  margin-top:16px
}
.phone-shortcuts span {
  text-align:center;
  font-size:15px;
  color:#46b58f
}
.phone-shortcuts small {
  display:block;
  font-size:7px;
  color:#80929a
}
.phone-bottom {
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  padding:10px;
  text-align:center;
  background:#fff;
  border-top:1px solid #e8eeed;
  color:#627c82;
  font-size:15px
}
.trust {
  background:#fff
}
.trust-heading {
  text-align:center;
  max-width:750px;
  margin:auto
}
.trust-heading .eyebrow,.section-head .eyebrow,.impact-heading .eyebrow,.experience-copy .eyebrow,.faq-intro .eyebrow {
  color:#418b72
}
.trust h2,.section-head h2,.impact-heading h2,.experience-copy h2,.faq h2 {
  font:800 clamp(37px,4.6vw,64px)/1.15 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.07em;
  margin:18px 0 20px
}
.trust h2 span,.section-head h2 span,.impact-heading h2 span,.experience-copy h2 span {
  color:#98a8a8
}
.trust p {
  color:var(--muted);
  max-width:540px;
  margin:auto;
  font-size:16px;
  line-height:1.65
}
.logo-row {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin-top:75px;
  padding:30px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  color:#93a2a4;
  white-space:nowrap
}
.logo-row>span {
  font:700 22px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.06em
}
.logo-row .logo-bold {
  font-weight:800
}
.logo-row .logo-outline {
  font-size:16px;
  letter-spacing:.03em
}
.logo-row .logo-serif {
  font-family:Georgia,serif;
  font-style:italic;
  font-weight:400;
  font-size:27px
}
.features {
  background:#f5f8f7
}
.section-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:60px;
  margin-bottom:40px
}
.section-head h2 {
  margin-bottom:0
}
.section-head p {
  max-width:330px;
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
  margin:0 0 5px
}
.feature-grid {
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr;
  gap:16px
}
.feature-card {
  background:#fff;
  border:1px solid #e8eeec;
  border-radius:var(--radius);
  overflow:hidden;
  min-width:0;
  transition:transform .3s,box-shadow .3s
}
.feature-card:hover {
  transform:translateY(-6px);
  box-shadow:var(--shadow)
}
.feature-art {
  height:265px;
  position:relative;
  overflow:hidden
}
.feature-text {
  padding:26px 27px 30px
}
.card-number {
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
  color:#398e70
}
.feature-text h3 {
  font:800 clamp(24px,2.5vw,35px)/1.15 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.06em;
  margin:14px 0 11px
}
.feature-text p {
  font-size:13px;
  line-height:1.55;
  color:var(--muted);
  margin:0
}
.art-flow {
  background:#e9f3ee;
  padding:33px 23px
}
.art-flow:after {
  content:'';
  position:absolute;
  width:280px;
  height:280px;
  border-radius:50%;
  background:#c1e6d5;
  right:-160px;
  top:-150px
}
.flow-header,.flow-row,.flow-toast {
  position:relative;
  z-index:1
}
.flow-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:85%;
  margin:0 auto 16px;
  padding:12px 13px;
  background:#fff;
  border:1px solid #d6e6df;
  border-radius:10px;
  font-size:10px;
  font-weight:800;
  box-shadow:0 8px 20px rgba(37,90,70,.07)
}
.flow-spark {
  color:#35a477;
  font-size:15px
}
.flow-row {
  display:flex;
  align-items:center;
  gap:9px;
  background:#fff;
  border:1px solid #e0eae6;
  border-radius:10px;
  padding:10px;
  width:90%;
  margin:auto;
  box-shadow:0 8px 20px rgba(37,90,70,.07)
}
.flow-row strong,.flow-row small {
  display:block;
  font-size:9px
}
.flow-row small {
  font-size:8px;
  color:#97a7a0;
  margin-top:3px
}
.flow-avatar {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:50%;
  background:#c4d6e1;
  color:#2f5265;
  font-size:7px;
  font-weight:800
}
.flow-avatar.coral {
  background:#f4d3c6;
  color:#97583f
}
.flow-check {
  margin-left:auto;
  display:grid;
  place-items:center;
  width:19px;
  height:19px;
  background:#b7efd2;
  border-radius:50%;
  font-size:10px;
  color:#25835e
}
.flow-connector {
  height:18px;
  width:1px;
  border-left:2px dashed #9dcbba;
  margin-left:17%
}
.flow-row.second {
  width:80%;
  margin-left:17%
}
.flow-pending {
  font-size:7px;
  color:#aa8551;
  margin-left:auto;
  background:#fff1d9;
  padding:5px;
  border-radius:20px
}
.flow-toast {
  position:absolute;
  bottom:15px;
  left:9%;
  background:#245c4d;
  color:#dffdec;
  padding:9px 12px;
  border-radius:7px;
  font-size:9px;
  font-weight:800;
  box-shadow:0 12px 20px rgba(20,66,53,.17)
}
.art-community {
  background:#dce7e9
}
.art-community:before {
  content:'';
  position:absolute;
  inset:30px;
  border:1px solid rgba(36,79,86,.18);
  border-radius:50%
}
.community-orbit {
  position:absolute;
  width:60px;
  height:60px;
  border-radius:50%;
  background:#fff;
  display:grid;
  place-items:center;
  color:#329b78;
  font-size:25px;
  box-shadow:0 10px 25px rgba(38,83,88,.1)
}
.orbit-one {
  left:11%;
  top:18%
}
.orbit-two {
  right:8%;
  bottom:16%;
  background:#f5d5ca;
  color:#ae6a52
}
.community-center {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:190px;
  height:150px;
  background:#fff;
  border-radius:18px;
  box-shadow:0 15px 35px rgba(30,75,80,.15);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center
}
.community-center strong {
  font:800 19px/1.16 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.05em
}
.mini-people {
  display:flex;
  margin-bottom:12px;
  padding-left:10px
}
.mini-people b {
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:50%;
  background:#a7d7c1;
  border:2px solid #fff;
  margin-left:-10px;
  font-size:7px
}
.mini-people b:nth-child(2) {
  background:#ecc5b8
}
.mini-people b:nth-child(3) {
  background:#c0d7e2
}
.community-chat {
  position:absolute;
  right:5%;
  top:12%;
  padding:9px 11px;
  border-radius:9px;
  background:#fff;
  font-size:9px;
  font-weight:800;
  box-shadow:0 9px 20px rgba(30,75,80,.08);
  transform:rotate(7deg)
}
.community-chat span {
  color:#e58682
}
.art-insights {
  background:#e6ecea;
  padding:29px 23px
}
.insight-panel {
  width:85%;
  height:225px;
  margin:auto;
  background:#fff;
  border-radius:14px;
  padding:20px;
  box-shadow:0 15px 32px rgba(28,66,65,.11)
}
.insight-top {
  font-size:10px
}
.insight-top span:last-child {
  color:#3fad86
}
.insight-panel>strong {
  display:block;
  font:800 46px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.07em;
  margin-top:14px
}
.insight-panel>strong span {
  font-size:24px
}
.insight-panel>small {
  font-size:8px;
  color:#8da0a1
}
.insight-panel em {
  font-style:normal;
  color:#279e70;
  font-weight:800;
  margin-left:5px
}
.bars {
  height:73px;
  display:flex;
  align-items:end;
  gap:9px;
  margin-top:13px;
  border-bottom:1px solid #edf0ee
}
.bars i {
  flex:1;
  height:var(--h);
  background:#b4e5d0;
  border-radius:4px 4px 0 0
}
.bars i:nth-last-child(-n+2) {
  background:#56ba94
}
.mobile-section {
  background:#142838;
  color:#fff;
  overflow:hidden
}
.mobile-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:630px;
  gap:70px;
  align-items:center
}
.mobile-copy {
  max-width:510px
}
.mobile-copy .eyebrow {
  color:#a6f2d7
}
.mobile-copy h2 {
  font:800 clamp(52px,6vw,81px)/1.08 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.075em;
  margin:23px 0
}
.mobile-copy h2 span {
  color:var(--mint)
}
.mobile-copy>p {
  font-size:16px;
  line-height:1.7;
  color:#bbced0;
  max-width:460px
}
.check-list {
  list-style:none;
  padding:0;
  margin:28px 0 33px;
  display:grid;
  gap:15px
}
.check-list li {
  display:flex;
  gap:12px;
  align-items:center;
  color:#dae8e7;
  font-size:13px
}
.check-list span {
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#326b5c;
  color:#aff6d8;
  font-size:11px
}
.mobile-visual {
  height:650px;
  position:relative
}
.mobile-visual:before {
  content:'';
  position:absolute;
  left:12%;
  top:10%;
  width:470px;
  height:470px;
  border-radius:50%;
  background:radial-gradient(circle,#377d6b,transparent 68%);
  filter:blur(8px);
  opacity:.65
}
.visual-ring {
  position:absolute;
  border:1px solid rgba(165,241,215,.16);
  border-radius:50%;
  width:570px;
  height:570px;
  top:35px;
  left:-20px
}
.ring-two {
  width:420px;
  height:420px;
  top:110px;
  left:55px
}
.phone {
  position:absolute;
  width:245px;
  height:510px;
  background:#15232e;
  border:3px solid #86989f;
  border-radius:34px;
  padding:9px;
  box-shadow:0 40px 75px rgba(0,0,0,.35)
}
.phone-front {
  left:25%;
  top:48px;
  z-index:2;
  transform:rotate(7deg)
}
.phone-back {
  left:1%;
  top:120px;
  z-index:1;
  transform:rotate(-10deg)
}
.phone-screen {
  height:100%;
  border-radius:24px;
  overflow:hidden;
  background:#f6f9f7;
  color:#253b42;
  padding:27px 16px 10px
}
.phone-ui-top {
  display:flex;
  justify-content:space-between;
  font:800 19px Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.08em;
  margin-bottom:33px
}
.phone-ui-top span:last-child {
  font:500 13px 'Aptos',sans-serif;
  letter-spacing:0;
  color:#6c858c
}
.phone-label {
  font-size:8px;
  font-weight:800;
  color:#42a77f;
  letter-spacing:.14em
}
.phone-screen h3 {
  font:800 23px/1.13 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.065em;
  margin:8px 0 13px
}
.phone-screen p {
  font-size:10px;
  line-height:1.5;
  color:#72868b
}
.photo-illustration {
  height:180px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(150deg,#89b7b0,#d5e5b4);
  border-radius:11px;
  margin-top:16px
}
.photo-sun {
  position:absolute;
  width:80px;
  height:80px;
  border-radius:50%;
  background:#f9dfaa;
  right:19px;
  top:16px
}
.photo-hill {
  position:absolute;
  width:200px;
  height:140px;
  border-radius:50% 50% 0 0;
  bottom:-65px;
  left:-45px;
  background:#628c7d;
  transform:rotate(-13deg)
}
.photo-hill.h2 {
  left:75px;
  bottom:-70px;
  width:240px;
  background:#3d6d65;
  transform:rotate(15deg)
}
.photo-illustration>span {
  position:absolute;
  z-index:1;
  left:18px;
  top:20px;
  color:#1e4444;
  font:800 15px/1.05 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.05em
}
.phone-post {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:13px;
  font-size:9px
}
.phone-post small {
  display:block;
  color:#9aabac;
  font-size:7px;
  margin-top:2px
}
.phone-screen .phone-post+p {
  margin:9px 0
}
.phone-reactions {
  font-size:9px;
  color:#9caeb0;
  border-top:1px solid #e7edeb;
  padding-top:10px
}
.phone-back .phone-screen {
  padding-top:60px
}
.phone-back h3 {
  margin-bottom:4px
}
.time-circle {
  width:170px;
  height:170px;
  border:18px solid #aee9cf;
  border-left-color:#e5eeeb;
  border-radius:50%;
  display:grid;
  place-items:center;
  text-align:center;
  margin:38px auto 23px
}
.time-circle strong {
  display:block;
  font:800 40px Aptos Display,Segoe UI,Arial,sans-serif
}
.time-circle span {
  display:block;
  font-size:9px;
  color:#8ca5a2
}
.time-request {
  background:#fff;
  border:1px solid #e5ebe9;
  border-radius:10px;
  padding:12px;
  font-size:9px;
  font-weight:800
}
.time-request span {
  float:right;
  color:#39a279
}
.time-request small {
  display:block;
  color:#8ca19e;
  margin-top:6px
}
.impact {
  background:#fff
}
.impact-heading {
  text-align:center;
  max-width:670px;
  margin:0 auto 68px
}
.impact-heading p {
  color:var(--muted);
  font-size:15px;
  line-height:1.65;
  max-width:480px;
  margin:auto
}
.metric-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.metric {
  min-height:230px;
  padding:55px 40px;
  display:flex;
  flex-direction:column;
  justify-content:space-between
}
.metric+.metric {
  border-left:1px solid var(--line)
}
.metric strong {
  font:800 clamp(55px,6vw,85px)/1 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.08em;
  color:#244a43
}
.metric span {
  font-size:13px;
  color:#627476;
  max-width:180px;
  line-height:1.5
}
.metric-note {
  font-size:10px;
  color:#a4b0ae;
  text-align:right;
  margin:14px 0 0
}
.experience {
  background:#edf3f0
}
.experience-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center
}
.experience-copy p {
  max-width:430px;
  color:#60736f;
  font-size:16px;
  line-height:1.7
}
.module-panel {
  background:#fff;
  border:1px solid #dee8e3;
  border-radius:24px;
  padding:12px;
  box-shadow:0 26px 65px rgba(39,79,69,.08)
}
.module-tabs {
  display:flex;
  gap:4px;
  padding:5px;
  background:#f0f5f2;
  border-radius:15px
}
.module-tab {
  flex:1;
  border:0;
  background:transparent;
  border-radius:11px;
  padding:13px 7px;
  color:#899c94;
  font-size:11px;
  font-weight:800;
  transition:background .2s,color .2s
}
.module-tab.active {
  background:#fff;
  color:#1b6a4e;
  box-shadow:0 4px 15px rgba(39,79,69,.08)
}
.module-content {
  min-height:325px;
  padding:31px 30px 25px;
  position:relative
}
.module-icon {
  display:grid;
  place-items:center;
  width:50px;
  height:50px;
  border-radius:14px;
  background:#ddf5e9;
  color:#339d74;
  font-size:28px;
  margin-bottom:20px
}
.module-index {
  position:absolute;
  right:28px;
  top:35px;
  color:#a5b5ad;
  font-size:10px;
  font-weight:800;
  letter-spacing:.1em
}
.module-content h3 {
  font:800 31px/1.15 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.06em;
  margin:0 0 12px
}
.module-content p {
  color:#6d8078;
  font-size:13px;
  line-height:1.6;
  max-width:350px;
  margin:0
}
.module-pills {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:22px
}
.module-pills span {
  background:#edf5ef;
  border-radius:30px;
  padding:8px 11px;
  color:#398267;
  font-size:9px;
  font-weight:800
}
.quote-section {
  background:#d3ebdf;
  padding:90px 0
}
.quote-layout {
  position:relative;
  max-width:950px
}
.quote-mark {
  font:800 80px/1 Georgia,serif;
  color:#55ae87
}
.quote-section blockquote {
  font:800 clamp(34px,4.5vw,61px)/1.18 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.065em;
  margin:0 0 40px
}
.quote-credit {
  display:flex;
  align-items:center;
  gap:15px;
  font-size:11px;
  font-weight:800;
  color:#4c7e66
}
.quote-line {
  width:30px;
  height:1px;
  background:currentColor
}
.faq {
  background:#fff
}
.faq-layout {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:100px
}
.faq-intro p {
  max-width:330px;
  color:#70817f;
  line-height:1.65
}
.faq-list {
  border-top:1px solid var(--line)
}
.faq-list details {
  border-bottom:1px solid var(--line);
  padding:0 0
}
.faq-list summary {
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:23px 0;
  font-size:15px;
  font-weight:800;
  cursor:pointer
}
.faq-list summary::-webkit-details-marker {
  display:none
}
.faq-list summary span {
  display:grid;
  place-items:center;
  flex:none;
  width:29px;
  height:29px;
  border:1px solid #cdded5;
  border-radius:50%;
  color:#378765;
  font-size:19px;
  font-weight:400;
  transition:transform .25s,background .25s
}
.faq-list details[open] summary span {
  transform:rotate(45deg);
  background:#dff4e8
}
.faq-list details p {
  color:#70817d;
  font-size:13px;
  line-height:1.7;
  max-width:490px;
  margin:-5px 40px 24px 0
}
.contact {
  background:#fff;
  padding:0 0 35px
}
.contact-inner {
  position:relative;
  overflow:hidden;
  text-align:center;
  background:#a6f2d7;
  border-radius:29px;
  padding:95px 20px 105px;
  isolation:isolate
}
.contact-star {
  color:#218d68;
  font-size:37px;
  margin-bottom:18px
}
.contact .eyebrow {
  color:#35775f
}
.contact h2 {
  font:800 clamp(52px,6.6vw,90px)/1.07 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.08em;
  margin:20px 0
}
.contact h2 span {
  color:#388e6e
}
.contact p {
  font-size:15px;
  color:#456d5f;
  line-height:1.6;
  max-width:400px;
  margin:0 auto 28px
}
.contact .button {
  position:relative;
  z-index:2
}
.contact-orbit {
  position:absolute;
  width:550px;
  height:550px;
  border:1px solid rgba(35,115,78,.16);
  border-radius:50%;
  left:-350px;
  top:-190px;
  z-index:-1
}
.contact-orbit.orbit-b {
  left:auto;
  right:-330px;
  top:90px
}
.footer {
  background:#101b2b;
  color:#fff;
  padding:70px 0 25px
}
.footer .brand-logo img {
  filter:grayscale(1) invert(1) contrast(1.8);
  mix-blend-mode:screen
}
.footer-main {
  display:flex;
  justify-content:space-between;
  gap:70px;
  padding-bottom:80px
}
.footer-main p {
  color:#92a5aa;
  line-height:1.6;
  font-size:13px;
  margin-top:22px
}
.footer-links {
  display:flex;
  gap:100px;
  margin-right:60px
}
.footer-links>div {
  display:grid;
  align-content:start;
  gap:14px
}
.footer-links strong {
  font-size:12px;
  margin-bottom:9px
}
.footer-links a {
  font-size:12px;
  color:#9eafb2
}
.footer-links a:hover {
  color:var(--mint)
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  border-top:1px solid #2b3b48;
  padding-top:22px;
  color:#6d8389;
  font-size:11px
}
.js-ready .reveal {
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)
}
.js-ready .reveal.visible {
  opacity:1;
  transform:translateY(0)
}
.feature-card:nth-child(2),.metric:nth-child(2) {
  transition-delay:.08s
}
.feature-card:nth-child(3),.metric:nth-child(3) {
  transition-delay:.16s
}
.capabilities {
  background:#fff
}
.capabilities-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:60px;
  margin-bottom:42px
}
.capabilities-head .eyebrow {
  color:#418b72
}
.capabilities-head h2 {
  font:800 clamp(37px,4.6vw,64px)/1.15 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.07em;
  margin:18px 0 0
}
.capabilities-head h2 span {
  color:#98a8a8
}
.capabilities-head p {
  max-width:350px;
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
  margin:0 0 5px
}
.capability-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 48px
}
.capability {
  display:grid;
  grid-template-columns:35px 1fr;
  gap:16px;
  align-items:start;
  min-height:132px;
  padding:28px 0;
  border-top:1px solid var(--line)
}
.capability:nth-last-child(-n+2) {
  border-bottom:1px solid var(--line)
}
.capability>span {
  color:#418b72;
  font-size:11px;
  font-weight:800;
  padding-top:5px
}
.capability h3 {
  font:800 22px/1.2 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.04em;
  margin:0 0 9px
}
.capability p {
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
  margin:0;
  max-width:340px
}
.areas {
  position:relative;
  overflow:hidden;
  background:#f5f8f7;
  color:var(--ink)
}
.areas-head {
  max-width:920px;
  margin-bottom:48px
}
.areas-head h2 {
  font:700 clamp(43px,5vw,68px)/1.09 Aptos Display,Segoe UI,Arial,sans-serif;
  letter-spacing:-.065em;
  margin:0
}
.areas-head h2 span { color:#3f9c82 }
.areas-head p { color:#536575; font-size:18px; line-height:1.6; margin:20px 0 0; max-width:660px }
.areas-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); grid-template-rows:repeat(3,minmax(0,1fr)); gap:14px; min-height:620px }
.area-link {
  position:relative;
  display:flex;
  align-items:center;
  gap:25px;
  overflow:hidden;
  min-width:0;
  min-height:190px;
  padding:28px 34px;
  border-radius:24px;
  transition:transform .28s ease,box-shadow .28s ease
}
.js-ready .area-link.reveal.visible:hover,.area-link:hover { transform:translateY(-4px); box-shadow:0 18px 42px rgba(21,49,61,.09) }
.area-feature { grid-row:1/4; flex-direction:column; align-items:stretch; gap:0; padding:36px; background:#d9f0e9 }
.area-retencion { background:#efebfa }
.area-comunicacion { background:#e3f3f4 }
.area-cultura { background:#f9e9ee }
.area-icon-wrap { flex:0 0 auto; display:grid; place-items:center; width:78px; height:78px; border-radius:23px; background:rgba(255,255,255,.75); color:#236f5d; transition:transform .3s ease }
.area-retencion .area-icon-wrap { color:#7e69ad }
.area-comunicacion .area-icon-wrap { color:#29888e }
.area-cultura .area-icon-wrap { color:#b66f8b }
.area-link:hover .area-icon-wrap { transform:rotate(-6deg) scale(1.04) }
.area-icon { display:block; width:38px; height:38px; background:currentColor; mask:var(--area-icon) center/contain no-repeat; -webkit-mask:var(--area-icon) center/contain no-repeat }
.area-icon-briefcase { --area-icon:url('assets/briefcase.svg') }
.area-icon-heart { --area-icon:url('assets/heart.svg') }
.area-icon-chat { --area-icon:url('assets/chat-circle-dots.svg') }
.area-icon-confetti { --area-icon:url('assets/confetti.svg') }
.area-arrow { position:absolute; top:28px; right:30px; display:grid; place-items:center; width:35px; height:35px; border-radius:50%; background:rgba(255,255,255,.7); color:var(--ink); font-size:20px; transition:transform .25s,background .25s }
.area-link:hover .area-arrow { transform:translate(3px,-3px); background:#fff }
.area-copy { display:block; min-width:0; padding-right:20px }
.area-copy h3 { font:700 clamp(29px,2.5vw,38px)/1.13 Aptos Display,Segoe UI,Arial,sans-serif; letter-spacing:-.055em; margin:0 0 9px }
.area-description { display:block; max-width:390px; color:#52646c; font-size:14px; line-height:1.5 }
.area-category { display:block; color:#28735f; font-size:13px; font-weight:700; margin-bottom:10px }
.area-feature .area-copy { margin-top:auto }
.area-feature .area-copy h3 { font-size:clamp(42px,4.2vw,59px); line-height:1.06; margin-bottom:14px }
.area-feature .area-description { font-size:16px; max-width:420px }
.area-feature-visual { display:flex; flex-direction:column; align-self:center; width:min(100%,390px); min-height:205px; margin:45px 0 38px; padding:22px 25px; border:1px solid #dbe9e8; border-radius:20px; background:#fff; box-shadow:0 20px 50px rgba(38,94,80,.12); transform:rotate(-3deg); transition:transform .35s ease }
.area-feature:hover .area-feature-visual { transform:rotate(0deg) translateY(-4px) }
.area-visual-head { color:#5f7478; font-size:12px; font-weight:700 }
.area-visual-mark { color:#319d7e; font-size:19px; vertical-align:-2px; margin-right:5px }
.area-visual-title { color:#193146; font-size:21px; font-weight:700; letter-spacing:-.03em; margin:20px 0 18px }
.area-visual-progress { display:grid; grid-template-columns:repeat(4,1fr); gap:5px }
.area-visual-progress i { height:7px; border-radius:7px; background:#b1ded0 }
.area-visual-progress i:nth-child(3) { background:#379f80 }
.area-visual-progress i:nth-child(4) { background:#e8efed }
.area-visual-foot { display:flex; align-items:center; gap:10px; color:#60737a; font-size:11px; margin-top:21px }
.area-visual-avatars { display:flex; padding-left:5px }
.area-visual-avatars b { display:grid; place-items:center; width:29px; height:29px; border:2px solid #fff; border-radius:50%; margin-left:-5px; background:#f3bcb1; color:#41556a; font-size:9px }
.area-visual-avatars b:nth-child(2) { background:#c9bce7 }
.area-visual-avatars b:nth-child(3) { background:#b3dbe7 }
@media(max-width:900px) {
  .areas-grid { grid-template-columns:1fr; grid-template-rows:auto; min-height:0 }
  .area-feature { grid-row:auto; min-height:590px }
  .area-link:not(.area-feature) { min-height:160px }
}
@media(max-width:1050px) {
  .nav-links {
    gap:17px;
    margin-right:18px
  }
  .hero h1 {
    font-size:clamp(51px,7.5vw,79px)
  }
  .hero-product {
    height:570px
  }
  .desktop-app {
    height:550px;
    width:92%
  }
  .mobile-app {
    right:-12px;
    top:240px
  }
  .floating-note {
    left:-4px
  }
  .feature-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .feature-card-large {
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1.1fr .9fr
  }
  .feature-card-large .feature-art {
    height:300px
  }
  .feature-card-large .feature-text {
    align-self:center;
    padding:40px
  }
  .mobile-layout {
    gap:15px
  }
  .phone-front {
    left:31%
  }
  .phone-back {
    left:0
  }
  .experience-grid {
    gap:45px
  }
  .faq-layout {
    gap:55px
  }
}
@media(max-width:900px) {
  .nav-links {
    position:absolute;
    top:79px;
    left:32px;
    right:32px;
    margin:0;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:#fff;
    border-radius:18px;
    padding:12px 18px;
    box-shadow:0 20px 40px rgba(0,0,0,.2)
  }
  .nav-links.open { display:flex }
  .nav-links a {
    padding:13px 5px;
    font-size:14px;
    border-bottom:1px solid #edf0ef
  }
  .nav-links a:last-child { border:0 }
  .nav-mobile-cta { display:block!important; color:#2e9a70!important }
  .menu-toggle { display:flex; margin-left:8px }
  .nav-cta { margin-left:auto }
}
@media(max-width:760px) {
  .areas-head h2 { font-size:clamp(40px,7vw,55px) }
  .areas-head p { font-size:16px }
  .area-feature { min-height:560px }
  .area-link:not(.area-feature) { padding:22px 28px }
  .area-copy h3 { font-size:30px }
  .capabilities-head {
    display:block
  }
  .capabilities-head p {
    margin-top:20px
  }
  .capability-grid {
    grid-template-columns:1fr
  }
  .capability {
    border-bottom:1px solid var(--line);
    border-top:0;
    min-height:110px
  }
  .capability:first-child {
    border-top:1px solid var(--line)
  }
  .shell {
    width:min(100% - 36px,1280px)
  }
  .section-pad {
    padding:85px 0
  }
  .announcement {
    padding:0 12px;
    font-size:9px
  }
  .announcement span:nth-child(2) {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
  }
  .announcement a {
    white-space:nowrap
  }
  .site-header {
    top:50px
  }
  .nav {
    height:62px;
    padding:6px 7px 6px 17px
  }
  .brand-logo {
    width:160px;
    height:34px
  }
  .brand-logo img {
    height:34px
  }
  .nav-cta {
    margin-left:auto;
    min-height:44px;
    padding:0 16px;
    font-size:11px;
    gap:8px
  }
  .menu-toggle {
    display:flex;
    margin-left:3px
  }
  .nav-links {
    position:absolute;
    top:69px;
    left:18px;
    right:18px;
    margin:0;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:#fff;
    border-radius:18px;
    padding:12px 18px;
    box-shadow:0 20px 40px rgba(0,0,0,.2)
  }
  .nav-links.open {
    display:flex
  }
  .nav-links a {
    padding:13px 5px;
    font-size:14px;
    border-bottom:1px solid #edf0ef
  }
  .nav-links a:last-child {
    border:0
  }
  .nav-mobile-cta {
    display:block!important;
    color:#2e9a70!important
  }
  .hero {
    padding-top:167px
  }
  .hero h1 {
    font-size:clamp(43px,9vw,69px);
    margin:22px auto
  }
  .word-window {
    min-width:5.4em
  }
  .hero-copy {
    font-size:14px;
    max-width:470px
  }
  .hero-actions {
    gap:15px;
    margin-top:25px
  }
  .hero-actions .button {
    min-height:49px;
    font-size:11px;
    gap:12px
  }
  .text-link {
    font-size:11px;
    gap:7px
  }
  .hero-proof {
    margin-top:27px
  }
  .hero-product {
    height:400px;
    margin-top:55px
  }
  .product-glow {
    height:450px
  }
  .desktop-app {
    width:105%;
    height:445px;
    margin-left:-2.5%;
    grid-template-columns:150px 1fr
  }
  .app-sidebar {
    padding:19px 8px
  }
  .app-mini-brand {
    font-size:16px;
    margin-bottom:20px
  }
  .workspace-label {
    font-size:6px
  }
  .workspace-switch {
    font-size:7px;
    padding:5px
  }
  .workspace-logo {
    width:18px;
    height:18px
  }
  .app-nav {
    padding-top:15px
  }
  .app-nav div {
    font-size:8px;
    padding:8px
  }
  .nav-icon {
    font-size:12px;
    width:17px
  }
  .sidebar-bottom {
    font-size:7px
  }
  .app-main {
    padding:0 17px
  }
  .app-greeting {
    padding:19px 0 17px
  }
  .app-greeting h2 {
    font-size:19px
  }
  .app-greeting p {
    font-size:8px
  }
  .app-grid {
    grid-template-columns:1fr .8fr;
    gap:9px
  }
  .compose {
    height:42px;
    font-size:7px
  }
  .feed-post {
    padding:10px
  }
  .feed-post p {
    font-size:8px
  }
  .post-image {
    height:115px;
    font-size:16px
  }
  .aside-card {
    padding:9px
  }
  .calendar-days {
    margin-top:10px
  }
  .calendar-days b {
    width:20px;
    font-size:7px
  }
  .calendar-days small {
    font-size:8px
  }
  .event {
    padding:6px
  }
  .celebration {
    display:none
  }
  .mobile-app {
    width:125px;
    height:280px;
    top:155px;
    right:-12px;
    border-radius:23px 23px 0 0;
    padding:5px
  }
  .mobile-app .phone-notch {
    top:5px;
    width:38px;
    height:9px
  }
  .phone-inner {
    padding:19px 7px 0;
    border-radius:16px 16px 0 0
  }
  .phone-top {
    font-size:10px;
    margin-bottom:15px
  }
  .phone-top>span:last-child {
    font-size:9px
  }
  .phone-inner>small {
    font-size:6px
  }
  .phone-inner h3 {
    font-size:11px
  }
  .phone-feature {
    height:90px;
    padding:8px
  }
  .phone-feature strong {
    font-size:9px
  }
  .phone-feature small {
    font-size:5px
  }
  .phone-shortcuts {
    margin-top:11px
  }
  .phone-shortcuts span {
    font-size:11px
  }
  .phone-shortcuts small {
    font-size:5px
  }
  .phone-bottom {
    font-size:9px
  }
  .floating-note {
    top:165px;
    padding:8px;
    font-size:7px
  }
  .floating-note small {
    font-size:6px
  }
  .note-icon {
    width:19px;
    height:19px
  }
  .trust h2,.section-head h2,.impact-heading h2,.experience-copy h2,.faq h2 {
    font-size:clamp(37px,7.5vw,55px)
  }
  .logo-row {
    overflow:hidden;
    gap:38px;
    justify-content:flex-start;
    margin-top:48px
  }
  .section-head {
    display:block
  }
  .section-head p {
    margin-top:20px
  }
  .feature-grid {
    grid-template-columns:1fr 1fr
  }
  .feature-card-large {
    grid-column:1/-1
  }
  .feature-art {
    height:215px
  }
  .feature-text {
    padding:21px
  }
  .feature-text h3 {
    font-size:24px
  }
  .feature-card-large .feature-art {
    height:255px
  }
  .feature-card-large .feature-text {
    padding:25px
  }
  .mobile-layout {
    grid-template-columns:1fr;
    gap:25px
  }
  .mobile-copy {
    max-width:600px
  }
  .mobile-copy h2 {
    font-size:clamp(54px,9vw,75px)
  }
  .mobile-visual {
    height:560px;
    max-width:530px;
    width:100%;
    margin:auto
  }
  .phone-front {
    left:38%;
    top:20px
  }
  .phone-back {
    left:5%;
    top:85px
  }
  .impact-heading {
    margin-bottom:40px
  }
  .metric {
    padding:35px 18px;
    min-height:175px
  }
  .metric strong {
    font-size:clamp(37px,7vw,65px)
  }
  .metric span {
    font-size:11px
  }
  .experience-grid {
    grid-template-columns:1fr;
    gap:35px
  }
  .module-panel {
    max-width:560px;
    width:100%;
    margin:auto
  }
  .faq-layout {
    grid-template-columns:1fr;
    gap:25px
  }
  .faq-intro p {
    max-width:540px
  }
  .footer-links {
    gap:50px;
    margin:0
  }
}
@media(max-width:520px) {
  .areas-head h2 br { display:none }
  .areas-head h2 { font-size:clamp(40px,10vw,50px) }
  .areas-grid { gap:10px }
  .area-feature { min-height:520px; padding:26px }
  .area-feature-visual { min-height:180px; margin:24px 0; padding:18px }
  .area-feature .area-copy h3 { font-size:42px }
  .area-link:not(.area-feature) { min-height:155px; gap:16px; padding:20px }
  .area-icon-wrap { width:60px; height:60px; border-radius:18px }
  .area-icon { width:31px; height:31px }
  .area-copy { padding-right:20px }
  .area-copy h3 { font-size:25px }
  .area-description { font-size:12px }
  .area-arrow { top:18px; right:18px; width:29px; height:29px; font-size:16px }
  .announcement {
    gap:5px
  }
  .announcement a {
    display:none
  }
  .hero {
    padding-top:150px
  }
  .hero-eyebrow {
    font-size:9px
  }
  .hero h1 {
    font-size:clamp(39px,10.3vw,53px);
    letter-spacing:-.075em
  }
  .hero-copy {
    font-size:13px
  }
  .hero-actions {
    flex-direction:column;
    gap:5px
  }
  .hero-actions .button {
    width:100%;
    max-width:255px
  }
  .hero-proof {
    font-size:9px
  }
  .hero-product {
    height:320px;
    margin-top:45px
  }
  .product-glow {
    height:350px
  }
  .desktop-app {
    height:350px;
    width:135%;
    margin-left:-18%;
    grid-template-columns:123px 1fr
  }
  .app-main {
    padding:0 11px
  }
  .app-top {
    height:40px
  }
  .app-greeting {
    padding:14px 0
  }
  .app-greeting h2 {
    font-size:15px
  }
  .weather {
    display:none
  }
  .app-grid {
    grid-template-columns:1fr
  }
  .app-aside {
    display:none
  }
  .post-image {
    height:105px
  }
  .mobile-app {
    right:-15px;
    top:120px
  }
  .floating-note {
    left:-8px;
    top:142px
  }
  .trust p {
    font-size:14px
  }
  .section-head p {
    font-size:14px
  }
  .feature-grid {
    grid-template-columns:1fr
  }
  .feature-card-large {
    display:block
  }
  .feature-art,.feature-card-large .feature-art {
    height:255px
  }
  .feature-text,.feature-card-large .feature-text {
    padding:25px
  }
  .feature-text h3 {
    font-size:29px
  }
  .mobile-copy h2 {
    font-size:clamp(52px,13vw,69px)
  }
  .mobile-copy>p {
    font-size:14px
  }
  .check-list li {
    font-size:12px
  }
  .mobile-visual {
    height:480px
  }
  .phone {
    width:205px;
    height:435px
  }
  .phone-front {
    left:37%;
    top:5px
  }
  .phone-back {
    left:0;
    top:60px
  }
  .phone-screen h3 {
    font-size:20px
  }
  .photo-illustration {
    height:150px
  }
  .time-circle {
    width:140px;
    height:140px;
    margin-top:30px
  }
  .visual-ring {
    left:-100px
  }
  .ring-two {
    left:-24px
  }
  .metric-grid {
    grid-template-columns:1fr
  }
  .metric {
    min-height:125px;
    padding:25px 10px;
    flex-direction:row;
    align-items:center
  }
  .metric+.metric {
    border-left:0;
    border-top:1px solid var(--line)
  }
  .metric strong {
    font-size:58px
  }
  .metric span {
    font-size:12px;
    max-width:135px
  }
  .metric-note {
    text-align:left
  }
  .quote-section {
    padding:70px 0
  }
  .quote-section blockquote {
    font-size:39px
  }
  .contact-inner {
    padding:70px 20px
  }
  .contact h2 {
    font-size:clamp(51px,12vw,65px)
  }
  .footer-main {
    display:block;
    padding-bottom:50px
  }
  .footer-links {
    margin-top:42px;
    gap:55px
  }
  .footer-bottom {
    display:grid;
    gap:8px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation-duration:.01ms!important;
    transition-duration:.01ms!important
  }
  .js-ready .reveal {
    opacity:1;
    transform:none
  }
}
