@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(../fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(../fonts/manrope-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: 'Nunito Sans';
  font-style: normal;
  font-weight: 700 900;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/nunito-sans-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 700 900;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/nunito-sans-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;
}
/* Base tokens and typography. Map these tokens to theme.json during WP migration. */
:root {
  --cream:#fff9f1;
  --purple:#34235b;
  --purple-light:#eee7f8;
  --coral:#f4813e;
  --yellow:#aecb18;
  --mint:#ddf1e6;
  --ink:#292635;
  --muted:#686273;
  --line:#e8dfd5;
  --white:#fff;
  --radius:28px;
  --container:1240px;
  --shadow:0 12px 36px #34235b0b;
  --font-body:'Manrope','Trebuchet MS',Arial,sans-serif;
  --font-display:'Nunito Sans','Trebuchet MS',Arial,sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:115px
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}
body.modal-open {
  overflow:hidden
}
img {
  max-width:100%;
  display:block
}
a {
  color:inherit;
  text-decoration:none
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled {
  cursor:default
}
button {
  color:inherit
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-family:var(--font-display);
  color:var(--purple);
  font-weight:850;
  line-height:1.08;
  letter-spacing:-.045em
}
h1 {
  font-size:clamp(2.6rem,5.1vw,4.8rem)
}
h2 {
  font-size:clamp(2rem,3.6vw,3.4rem)
}
h3 {
  font-size:1.4rem;
  letter-spacing:-.025em
}
p+p {
  margin-top:1rem
}
ul {
  padding-left:1.3rem
}
::selection {
  background:var(--yellow);
  color:var(--purple)
}
:focus-visible {
  outline:3px solid #7757b7;
  outline-offset:5px
}
button:focus-visible {
  outline-offset:4px
}
[hidden] {
  display:none!important
}
.container {
  width:min(var(--container),calc(100% - 80px));
  margin-inline:auto
}
.section {
  padding-block:88px
}
.section-white {
  background:var(--white)
}
.section-lilac {
  background:#f0eaf8
}
.eyebrow {
  display:block;
  text-transform:uppercase;
  font-size:12px;
  font-weight:800;
  letter-spacing:.16em;
  color:var(--purple);
  margin-bottom:18px
}
.eyebrow::before {
  content:'';
  display:inline-block;
  width:8px;
  height:8px;
  background:var(--coral);
  border-radius:50%;
  margin-right:10px
}
.lead {
  font-size:18px;
  color:var(--muted);
  max-width:600px;
  line-height:1.75
}
.small-copy {
  font-size:13px;
  color:var(--muted)
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:32px;
  margin-bottom:36px
}
.section-heading h2 {
  max-width:650px
}
.section-heading p {
  max-width:440px;
  color:var(--muted)
}
.center-heading {
  text-align:center;
  max-width:720px;
  margin:0 auto 42px
}
.center-heading p {
  margin-top:20px;
  color:var(--muted)
}
.accent-text {
  color:#b9511f
}
.demo-note {
  font-size:13px;
  color:#645773;
  line-height:1.6;
  margin:22px 0;
  background:#eee7f8;
  border-left:3px solid #9c81c1;
  padding:12px 16px;
  border-radius:0 10px 10px 0
}
.demo-note strong {
  font-weight:800
}
.skip-link {
  position:fixed;
  top:12px;
  left:12px;
  padding:12px 20px;
  background:var(--purple);
  color:white;
  z-index:1000;
  transform:translateY(-180%);
  border-radius:12px
}
.skip-link:focus {
  transform:none
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-height:54px;
  padding:15px 25px;
  background:var(--purple);
  color:white;
  border:1px solid var(--purple);
  border-radius:100px;
  font-size:14px;
  font-weight:800;
  line-height:1.4;
  transition:background .2s,transform .2s,box-shadow .2s
}
.button:hover {
  background:#4b337c;
  transform:translateY(-2px);
  box-shadow:0 6px 18px #34235b20
}
.button span[aria-hidden] {
  font-size:20px;
  line-height:1
}
.button-light {
  background:white;
  color:var(--purple);
  border-color:white
}
.button-light:hover {
  background:var(--cream)
}
.button-outline {
  background:transparent;
  color:var(--purple);
  border-color:#c8bbd5
}
.button-outline:hover {
  background:var(--purple-light)
}
.button-small {
  min-height:46px;
  padding:11px 20px;
  font-size:12px
}
.button-row {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  font-size:14px;
  color:var(--purple);
  border-bottom:1px solid #ccbcd9;
  padding-bottom:4px
}
.text-link:hover {
  color:#865aaf
}
.text-link span {
  font-size:20px
}
.icon-button {
  border:1px solid #d9cfe1;
  background:transparent;
  width:44px;
  height:44px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:22px
}
.icon-button:hover {
  background:var(--purple);
  color:white
}
.breadcrumbs {
  font-size:12px;
  color:var(--muted);
  display:flex;
  gap:12px;
  margin-bottom:34px
}
.breadcrumbs a:hover {
  text-decoration:underline
}
.pill {
  display:inline-block;
  border-radius:100px;
  padding:5px 12px;
  font-size:11px;
  line-height:1.5;
  font-weight:800;
  letter-spacing:.025em;
  background:var(--mint);
  color:#315648
}
.pill-demo {
  background:#fff4dd;
  color:#74511b
}
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
@media(min-width:1600px) {
  :root {
    --container:1360px
  }
}
@media(max-width:900px) {
  .container {
    width:calc(100% - 48px)
  }
  .section {
    padding-block:64px
  }
  .section-heading {
    align-items:start;
    flex-direction:column;
    gap:20px
  }
  .section-heading p {
    max-width:650px
  }
}
@media(max-width:600px) {
  .container {
    width:calc(100% - 36px)
  }
  .section {
    padding-block:52px
  }
  h1 {
    font-size:2.75rem
  }
  h2 {
    font-size:2.15rem
  }
  .lead {
    font-size:16px
  }
  .eyebrow {
    font-size:11px;
    margin-bottom:14px
  }
  .button {
    min-height:50px;
    padding:13px 22px
  }
  .button-row {
    gap:10px
  }
  .breadcrumbs {
    margin-bottom:24px
  }
  .section-heading {
    margin-bottom:26px
  }
  .center-heading {
    margin-bottom:28px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
}