@font-face {
  font-family:Brand;
  src:url(assets/brand.woff2);
  font-display:swap;
}
:root {
  --ink:#07525a;
  --pink:#e90059;
  --mint:#d9f0ec;
  --cream:#fcf5e9;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px;
}
body {
  margin:0;
  color:var(--ink);
  background:#fff;
  font:19px/1.65 Arial,sans-serif;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3,.btn,.tiles,.steps p {
  font-family:Brand,Arial,sans-serif;
}
h1 {
  font-size:clamp(56px,6vw,88px);
  line-height:1.05;
  margin-bottom:24px;
}
h2 {
  font-size:42px;
  line-height:1.15;
  margin-bottom:24px;
}
h1 span,h2 span {
  color:#ffc300;
}
a {
  color:inherit;
}
button,input,textarea {
  font:inherit;
}
button,summary {
  cursor:pointer;
}
button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:3px solid #e90059;
  outline-offset:5px;
}
.wrap,.bar {
  width:min(1100px,90%);
  margin-inline:auto;
}
header {
  position:sticky;
  top:0;
  background:#fffffff5;
  z-index:20;
  border-bottom:1px solid #e5f0ed;
}
.bar {
  min-height:91px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.logo img {
  width:93px;
  display:block;
}
nav {
  display:flex;
  gap:20px;
}
nav a {
  text-decoration:none;
  font-size:15px;
  font-weight:bold;
}
.btn {
  border:0;
  border-radius:14px;
  background:var(--pink);
  color:#fff;
  padding:9px 23px;
  display:inline-block;
  text-decoration:none;
  white-space:nowrap;
  font-size:21px;
}
.menu {
  display:none;
}
.stats {
  padding-top:26px;
}
.tiles {
  background:linear-gradient(115deg,#e8f7f4,#cdebe7);
  border-radius:26px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  padding:20px 0;
}
.tiles article {
  text-align:center;
  padding:8px 15px;
}
.tiles article+article {
  border-right:1px solid #8cbabb;
}
.tiles b {
  font-size:48px;
  line-height:1.2;
  display:block;
  direction:ltr;
}
.tiles span {
  display:block;
  font-size:23px;
}
.demo {
  display:block;
  font-size:11px;
  text-align:left;
  color:#607f7b;
  margin:5px 12px;
}
section {
  padding-block:65px;
}
.hero {
  display:grid;
  grid-template-columns:1fr 320px;
  gap:10%;
  align-items:center;
  padding-top:28px;
}
.lead {
  font-size:25px;
  line-height:1.55;
  max-width:590px;
}
.second {
  margin-top:17px;
}
video {
  width:100%;
  aspect-ratio:9/16;
  object-fit:contain;
  border-radius:24px;
  background:#ecf6f3;
  box-shadow:0 8px 24px #0b636412;
}
.character {
  aspect-ratio:1;
  background-repeat:no-repeat;
  background-size:300% 100%;
  background-image:url(assets/characters-clear.png);
}
.girl {
  background-position:0% 50%;
}
.teacher {
  background-position:50% 50%;
}
.boy {
  background-position:100% 50%;
}
p+p {
  margin-top:18px;
}
.expander {
  position:relative;
  --fade-bg:#fff;
}
.excerpt {
  max-height:180px;
  overflow:hidden;
  position:relative;
}
.excerpt:after {
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  height:70px;
  background:linear-gradient(transparent,var(--fade-bg));
}
.expander.open .excerpt {
  max-height:none;
}
.expander.open .excerpt:after {
  display:none;
}
.expand {
  border:0;
  color:var(--pink);
  background:transparent;
  width:100%;
  height:35px;
  display:grid;
  place-items:center;
}
.expand span {
  display:block;
  line-height:1;
  font-size:35px;
}
.expander.open .expand span {
  transform:rotate(180deg);
}
.steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:23px;
}
.steps article {
  position:relative;
  border-radius:25px;
  background:var(--cream);
  padding:22px 13px 24px;
  text-align:center;
}
.steps article+article:before {
  content:'‹';
  position:absolute;
  right:-19px;
  top:50%;
  color:var(--pink);
  font-size:37px;
}
.steps .character,.steps svg {
  width:100%;
  height:160px;
}
.number {
  position:absolute;
  right:14px;
  top:13px;
  background:var(--pink);
  color:white;
  width:29px;
  height:29px;
  border-radius:50%;
  z-index:1;
  line-height:29px;
}
.steps p {
  font-size:23px;
  line-height:1.2;
  margin-top:13px;
}
.green {
  background:linear-gradient(135deg,#edf9f6,#e0f2ec);
  border-radius:65px 0 65px 0;
  margin-block:25px;
}
.testimonials {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  padding:15px 3px;
}
.bubble {
  background:#e9fbd3;
  border:1px solid #b9dab2;
  border-radius:14px 3px 14px 14px;
  padding:22px;
  box-shadow:0 4px 0 #bdd8bd25;
  position:relative;
  min-height:175px;
}
.bubble:before {
  content:'';
  position:absolute;
  right:-8px;
  top:0;
  border:8px solid transparent;
  border-top-color:#b9dab2;
}
.bubble b {
  font-size:16px;
}
.bubble p {
  margin:12px 0;
}
.bubble small {
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:#5b7760;
}
.bubble em {
  color:#1b9aba;
  font-style:normal;
  font-size:19px;
}
.swipe {
  display:none;
}
.press {
  display:flex;
  flex-direction:column;
  gap:36px;
  margin-top:65px;
}
.pressCard {
  display:grid;
  grid-template-columns:160px 1fr;
  gap:18px 35px;
  background:#fff;
  border-radius:24px;
  padding:30px;
}
.profile {
  text-align:center;
}
.profile img {
  width:70px;
  height:70px;
  border-radius:50%;
  object-fit:cover;
}
.profile h3 {
  font-size:22px;
  line-height:1.25;
  margin:7px 0;
}
.profile small {
  font-size:12px;
  line-height:1.5;
  display:block;
}
.pressCard .excerpt {
  max-height:105px;
}
.pressCard .open .excerpt {
  max-height:none;
}
.source {
  grid-column:2;
  font-size:13px;
  color:#24757b;
}
.remembrance {
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:8%;
  align-items:center;
  background:var(--cream);
  padding:45px;
  border-radius:45px 16px 55px 16px;
  margin-block:65px;
}
.remembrance img {
  width:100%;
  max-height:370px;
  object-fit:cover;
  border-radius:49% 51% 35% 65% / 37% 31% 69% 63%;
  transform:rotate(-3deg);
}
.remembrance .expander {
  --fade-bg:var(--cream);
}
.faqSection {
  max-width:900px;
}
.faqHeader {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:22px;
}
.faqHeader h2 {
  margin:0;
}
.support {
  font-size:15px;
  background:#e4f5ec;
  padding:9px 16px;
  border-radius:25px;
  text-decoration:none;
}
.faq {
  border:1px solid #a6ced0;
  border-radius:11px;
  margin-bottom:13px;
  background:white;
}
.faq summary {
  list-style:none;
  padding:14px 18px;
  font-weight:bold;
  display:flex;
  justify-content:space-between;
}
.faq summary:after {
  content:'⌄';
  color:var(--pink);
}
.faq[open] summary:after {
  content:'⌃';
}
.faq p {
  padding:0 18px 18px;
}
.moreFaq>summary {
  list-style:none;
  text-align:center;
  color:var(--pink);
  padding:15px;
  border-radius:12px;
  border:1px dashed #d4a6b5;
  margin-top:20px;
}
.moreFaq[open]>summary {
  margin-bottom:20px;
}
#join {
  background:#d0edeb;
  border-radius:70px 70px 0 0;
  overflow:hidden;
}
.contact {
  position:relative;
  padding:25px 160px;
  isolation:isolate;
}
.contact:before {
  content:'';
  position:absolute;
  inset:0 -30%;
  background:white;
  border-radius:45% 12% 55% 28%;
  z-index:-2;
  transform:rotate(-4deg);
}
.formPanel {
  background:#fffffff5;
  border:1px solid #96d2d5;
  border-radius:24px;
  padding:28px;
  position:relative;
  z-index:2;
}
.formLogo {
  width:110px;
  margin-bottom:18px;
}
.formPanel h2 {
  font-size:35px;
  margin-bottom:9px;
}
.formPanel>p {
  font-size:22px;
}
form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 22px;
  margin-top:30px;
}
label {
  font-size:18px;
  font-weight:bold;
  color:#10267b;
}
label span {
  color:var(--pink);
}
input,textarea {
  width:100%;
  display:block;
  border:1.5px solid #17afcb;
  border-radius:8px;
  padding:10px;
  margin-top:6px;
  background:#fff;
  min-width:0;
}
.wide {
  grid-column:1/-1;
}
form .btn {
  border-radius:12px;
  font-size:30px;
}
form small {
  font-size:12px;
  text-align:center;
  color:#567b7d;
}
button:disabled {
  cursor:default;
  opacity:.75;
}
.contactTeacher,.contactBoy,.contactGirl {
  position:absolute;
  width:230px;
  z-index:3;
  pointer-events:none;
}
.contactTeacher {
  right:-27px;
  top:12%;
}
.contactBoy {
  left:-25px;
  bottom:6%;
}
.contactGirl {
  right:-45px;
  bottom:3%;
  width:210px;
}
.mobileArt {
  display:none;
}
@media(max-width:950px) {
  nav {
    gap:12px;
  }
  .bar {
    gap:12px;
  }
  .hero {
    gap:5%;
    grid-template-columns:1fr 270px;
  }
  .contact {
    padding-inline:100px;
  }
  .contactTeacher,.contactBoy {
    width:160px;
  }
  .contactGirl {
    width:145px;
  }
}
@media(max-width:760px) {
  html {
    scroll-padding-top:90px;
  }
  body {
    font-size:18px;
  }
  .bar {
    min-height:77px;
    gap:14px;
    position:relative;
  }
  .logo {
    margin-left:auto;
  }
  .logo img {
    width:72px;
  }
  .bar>.btn {
    font-size:18px;
    padding:8px 15px;
  }
  .menu {
    display:flex;
    flex-direction:column;
    gap:5px;
    background:#e1f1ec;
    border:0;
    border-radius:12px;
    width:40px;
    height:40px;
    justify-content:center;
    align-items:center;
  }
  .menu i {
    height:2px;
    width:20px;
    background:var(--ink);
    border-radius:2px;
  }
  nav {
    display:none;
    position:absolute;
    top:77px;
    right:0;
    left:0;
    background:white;
    border:1px solid #c6e5df;
    padding:20px;
    border-radius:0 0 20px 20px;
    box-shadow:0 15px 25px #084c4915;
  }
  nav.open {
    display:flex;
    flex-direction:column;
    gap:0;
  }
  nav a {
    padding:10px;
  }
  section {
    padding-block:40px;
  }
  .stats {
    padding-top:16px;
  }
  .tiles {
    padding:12px 0;
    border-radius:20px;
  }
  .tiles article {
    padding:7px;
  }
  .tiles b {
    font-size:clamp(26px,6vw,39px);
  }
  .tiles span {
    font-size:16px;
    line-height:1.15;
    margin-top:4px;
  }
  .hero {
    display:flex;
    flex-direction:column;
    gap:30px;
    padding-top:25px;
  }
  h1 {
    font-size:58px;
    margin-bottom:21px;
  }
  .lead {
    font-size:22px;
  }
  .second {
    margin-top:15px;
  }
  .hero video {
    width:100%;
    max-width:420px;
    max-height:85svh;
    object-fit:contain;
  }
  .excerpt {
    max-height:205px;
  }
  .steps {
    grid-template-columns:repeat(2,1fr);
    gap:18px;
  }
  .steps article {
    padding:18px 10px;
  }
  .steps .character,.steps svg {
    height:150px;
  }
  .steps article+article:before {
    display:none;
  }
  .steps p {
    font-size:21px;
  }
  .green {
    border-radius:35px 0 35px 0;
  }
  .testimonials {
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:16px;
    padding:10px 0 20px;
  }
  .bubble {
    flex:0 0 85%;
    scroll-snap-align:start;
  }
  .carouselShell {
    position:relative;
  }
  .carouselShell:after {
    content:'';
    pointer-events:none;
    position:absolute;
    left:-1px;
    top:0;
    bottom:0;
    width:28px;
    background:linear-gradient(90deg,#e5f5ef,transparent);
  }
  .swipe {
    display:block;
    font-size:13px;
    color:#41797a;
  }
  .press {
    margin-top:40px;
    gap:24px;
  }
  .pressCard {
    grid-template-columns:1fr;
    padding:23px;
    gap:18px;
  }
  .profile img {
    width:68px;
    height:68px;
  }
  .profile h3 {
    font-size:24px;
  }
  .source {
    grid-column:1;
  }
  .pressCard .excerpt {
    max-height:130px;
  }
  .remembrance {
    display:flex;
    flex-direction:column-reverse;
    padding:26px;
    gap:28px;
    margin-block:40px;
  }
  .remembrance img {
    width:210px;
    max-height:250px;
  }
  .remembrance h2 {
    font-size:36px;
  }
  .faqHeader {
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
  }
  .faqHeader h2 {
    font-size:36px;
  }
  .faq summary {
    font-size:17px;
  }
  #join {
    border-radius:35px 35px 0 0;
  }
  .contact {
    padding:0;
  }
  .formPanel {
    padding:20px;
    border:none;
  }
  .formPanel h2 {
    font-size:38px;
  }
  .formPanel>p {
    font-size:22px;
  }
  .formLogo {
    width:95px;
  }
  .contactTeacher,.contactBoy,.contactGirl {
    display:none;
  }
  .mobileArt {
    display:flex;
    margin:15px -20px;
    align-items:center;
  }
  .mobileArt .character {
    width:55%;
  }
  .mobileArt .boy {
    width:45%;
  }
  form {
    grid-template-columns:1fr;
    gap:17px;
    margin-top:12px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
}
.logo img {
  width:auto;
  height:74px;
  max-width:100px;
  object-fit:contain;
}
.steps .character {
  background-size:auto 100%;
  width:160px;
  max-width:100%;
  margin:auto;
}
@media(max-width:760px) {
  .logo img {
    height:59px;
    width:auto;
  }
  .formLogo {
    max-height:100px;
    width:auto;
  }
}
h1,h2,h3 {
  font-weight:400;
  font-kerning:none;
  font-variant-ligatures:none;
  letter-spacing:.025em;
}
.tiles b {
  font-family:Arial,sans-serif;
  font-variant-numeric:lining-nums tabular-nums;
  font-weight:700;
  letter-spacing:0;
}
h1 {
  font-size:clamp(45px,4.8vw,70px);
}
.lead {
  font-size:19px;
  line-height:1.65;
}
.lead+.lead {
  margin-top:20px;
}
.logo img {
  height:auto;
  width:145px;
  max-width:none;
}
.bubble {
  background:#fff;
  border:0;
  border-radius:8px 0 8px 8px;
  box-shadow:0 1px 2px #114b3526;
  padding:16px 18px;
  align-self:start;
}
.bubble:before {
  right:-9px;
  border:10px solid transparent;
  border-top-color:#fff;
  border-left-color:#fff;
}
.bubble b {
  color:#b25083;
  font-family:Arial,sans-serif;
  font-size:16px;
}
.bubble:nth-child(2) b {
  color:#3c857f;
}
.bubble:nth-child(3) b {
  color:#9c7232;
}
.bubble p {
  font-size:17px;
  line-height:1.65;
  margin-top:6px;
}
.bubble small {
  justify-content:flex-end;
}
.expand {
  color:#79a5a3;
  height:42px;
}
.expand span {
  height:18px;
  width:40px;
}
.expand svg {
  display:block;
  width:40px;
  height:18px;
}
.source {
  text-align:center;
}
.steps p {
  font-family:Arial,sans-serif;
  font-size:18px;
  line-height:1.6;
  font-weight:400;
}
.remembrance {
  display:block;
  background:white;
  padding:0;
  border-radius:0;
}
.remembrance>h2 {
  margin-bottom:65px;
}
.remembranceBody {
  display:grid;
  grid-template-columns:1.7fr 1fr;
  gap:6%;
  background:var(--cream);
  border-radius:35px;
  padding:35px;
}
.remembranceBody>img {
  margin-top:-105px;
  align-self:start;
}
.faqHeader {
  flex-direction:row;
  align-items:center;
}
.support {
  display:flex;
  align-items:center;
  gap:7px;
  white-space:nowrap;
}
.support svg {
  width:22px;
  height:22px;
}
.faqExpander .excerpt {
  max-height:325px;
}
.faqExpander .excerpt:after {
  height:45px;
}
.faqExpander.open .excerpt {
  max-height:none;
}
@media(max-width:760px) {
  h1 {
    font-size:46px;
  }
  .lead {
    font-size:18px;
  }
  .logo img {
    height:auto;
    width:116px;
  }
  .bar {
    gap:9px;
  }
  .bar>.btn {
    font-size:17px;
    padding:8px 12px;
  }
  .tiles b {
    font-size:clamp(23px,5.8vw,34px);
  }
  .remembrance>h2 {
    margin-bottom:105px;
  }
  .remembranceBody {
    display:flex;
    flex-direction:column-reverse;
    gap:20px;
    padding:24px;
  }
  .remembranceBody>img {
    margin-top:-100px;
    align-self:center;
    width:190px;
    height:200px;
  }
  .faqHeader {
    gap:10px;
  }
  .faqHeader h2 {
    font-size:28px;
  }
  .support {
    font-size:12px;
    padding:8px 10px;
  }
  .steps {
    grid-template-columns:1fr;
  }
  .steps article {
    padding:22px;
  }
  .steps p {
    font-size:18px;
  }
  .steps .character,.steps svg {
    height:160px;
    width:160px;
  }
}
h1,h2,h3 {
  letter-spacing:.045em;
}
/* Desktop opening composition; mobile retains its original layout. */
.heroMedia {
  display:contents;
}
.heroArtwork,.heroDesktopCta {
  display:none;
}
@media(min-width:761px) {
  .hero.wrap {
    width:min(1400px,100%);
    display:grid;
    grid-template-columns:44% 56%;
    gap:0;
    align-items:center;
    padding:24px 0 40px;
  }
  .heroCopy {
    padding:15px 7% 15px 0;
  }
  .hero h1 {
    font-size:clamp(40px,4.2vw,58px);
    line-height:1.12;
    margin:0 0 30px;
    letter-spacing:.045em;
  }
  .hero .lead {
    font-size:clamp(15px,1.35vw,19px);
    line-height:1.6;
    margin:0;
  }
  .hero .lead+.lead {
    margin-top:24px;
  }
  .heroDesktopCta {
    display:inline-flex;
    margin-top:28px;
    font-size:28px;
    padding:10px 25px;
    line-height:1.3;
  }
  .heroMedia {
    display:block;
    position:relative;
    aspect-ratio:3/2;
    width:100%;
    align-self:center;
  }
  .heroArtwork {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    pointer-events:none;
  }
  .heroMedia video {
    position:absolute;
    width:34%;
    height:auto;
    max-height:none;
    aspect-ratio:9/16;
    left:32.2%;
    top:5%;
    border:5px solid white;
    border-radius:26px;
    box-shadow:0 0 12px #eebda66b;
    background:#f8e7de;
    object-fit:cover;
  }
}
/* Decorative mobile backdrop: absolute positioning preserves all layout geometry. */
@media(max-width:760px) {
  .hero.wrap {
    position:relative;
    isolation:isolate;
  }
  .hero.wrap::before {
    content:"";
    position:absolute;
    z-index:-1;
    pointer-events:none;
    top:0;
    bottom:0;
    left:-5.555556%;
    width:111.111112%;
    background:url("assets/hero-mobile-peach.svg") center/100% 100% no-repeat;
  }
}
/* Navigation, activity icons and readable RTL step flow. */
nav a,.tiles span {
  font-family:Brand,Arial,sans-serif;
  font-weight:400;
}
nav a {
  font-size:19px;
}
.statIcon {
  display:block;
  width:32px;
  height:32px;
  margin:0 auto 9px;
  color:#287c80;
}
.steps article+article:before {
  content:"";
  width:12px;
  height:12px;
  border-left:3px solid #e90059;
  border-bottom:3px solid #e90059;
  transform:rotate(45deg);
  right:-19px;
  top:50%;
}
.press {
  margin-top:0;
  margin-bottom:48px;
}
.testimonials {
  gap:40px;
  padding:22px 23px;
}
.bubble {
  border-radius:12px 0 12px 12px;
}
.bubble:before {
  right:-21px;
  top:0;
  width:23px;
  height:28px;
  border:0;
  background:white;
  clip-path:polygon(0 0,100% 0,0 100%);
  filter:drop-shadow(0 1px 1px #114b3526);
}
/* Reference form: white center, mint side waves, warm right inset. */
#join {
  background:#fff url("assets/form-waves.svg") center/100% 100% no-repeat;
  border-radius:0;
  padding-block:60px;
}
.contact {
  width:min(1600px,100%);
  padding:0 23%;
}
.contact:before {
  display:none;
}
.formPanel {
  background:#ffffffed;
  border:1px solid #82d5df;
  padding:28px 32px;
  border-radius:22px;
}
.formPanel h2 {
  font-size:clamp(28px,2.6vw,42px);
  letter-spacing:0;
  line-height:1.2;
}
.formPanel>p {
  font-size:23px;
}
.contactTeacher {
  right:1%;
  top:0;
  width:21%;
}
.contactBoy {
  left:0;
  bottom:8%;
  width:23%;
}
.contactGirl {
  right:1%;
  bottom:8%;
  width:20%;
}
.contact .character {
  background-size:300% 100%;
}
@media(max-width:950px) and (min-width:761px) {
  .contact {
    padding-inline:20%;
  }
  .formPanel {
    padding:24px;
  }
  .contactTeacher,.contactGirl {
    width:19%;
  }
  .contactBoy {
    width:20%;
  }
}
@media(max-width:760px) {
  nav a {
    font-size:20px;
  }
  .statIcon {
    width:25px;
    height:25px;
    margin-bottom:7px;
  }
  .tiles span {
    font-size:17px;
  }
  .testimonials {
    gap:38px;
    padding:18px 24px 22px;
  }
  .bubble {
    flex-basis:87%;
  }
  .bubble:before {
    right:-21px;
    width:23px;
    height:28px;
  }
  .press {
    margin-top:0;
    margin-bottom:30px;
  }
  .steps {
    gap:30px;
  }
  .steps article+article:before {
    display:block;
    right:calc(50% - 6px);
    top:-23px;
    transform:rotate(-45deg);
    width:11px;
    height:11px;
  }
  #join {
    padding:40px 0 0;
    background-size:auto 100%;
    background-position:center;
  }
  .contact {
    width:100%;
    padding:0 6% 220px;
  }
  .formPanel {
    border:0;
    border-radius:0;
    background:transparent;
    padding:0;
  }
  .formPanel h2 {
    font-size:37px;
    line-height:1.15;
  }
  .formPanel>p {
    font-size:21px;
    color:#00aaca;
  }
  .mobileArt {
    display:flex;
    margin:20px -6vw 0;
    align-items:flex-end;
    position:relative;
    isolation:isolate;
  }
  .mobileArt:before {
    content:"";
    position:absolute;
    right:0;
    top:0;
    width:55%;
    height:95%;
    background:#fff4e4;
    border-radius:65% 30% 40% 25%;
    z-index:-1;
  }
  .mobileArt .teacher {
    width:57%;
  }
  .mobileArt .boy {
    width:43%;
  }
  .contactTeacher,.contactBoy {
    display:none;
  }
  .contactGirl {
    display:block;
    right:0;
    bottom:0;
    width:200px;
  }
  form {
    margin-top:0;
  }
  input,textarea {
    background:#ffffffed;
  }
}
@media(max-width:760px) {
  #join {
    background-image:url("assets/form-waves-mobile.svg");
    background-size:100% 100%;
  }
}
/* Balanced navigation and compact illustrated activity values. */
@media(min-width:761px) {
  nav {
    flex:1;
    justify-content:space-evenly;
    gap:12px;
  }
  .bar {
    gap:25px;
  }
}
.statValue {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  direction:rtl;
}
.statFigure {
  width:38px;
  height:40px;
  flex-shrink:0;
}
.tiles b {
  font-family:Brand,Arial,sans-serif;
  font-weight:400;
  font-variant-numeric:normal;
}
.hero {
  position:relative;
  isolation:isolate;
}
@media(min-width:761px) {
  .hero:after {
    content:"";
    position:absolute;
    z-index:-1;
    left:min(0px,calc((1400px - 100vw)/2));
    right:46%;
    bottom:45px;
    height:60px;
    background:#ffdfd1;
    border-radius:0 70% 45% 0;
  }
}
.steps {
  gap:38px;
}
.steps article+article:before {
  width:42px;
  height:32px;
  right:-40px;
  top:45%;
  border:0;
  transform:none;
  background:url("assets/free-arrow.svg") center/contain no-repeat;
}
#voices {
  padding-bottom:0;
}
#voices>h2 {
  margin-bottom:26px;
}
.pressBackground {
  padding:50px 0;
  margin:0;
}
.press {
  margin:0;
}
.pressCard {
  background:transparent;
  padding:0;
  grid-template-columns:175px 1fr;
  gap:0 30px;
}
.pressCard>.expander {
  background:white;
  border-radius:24px 24px 0 0;
  padding:26px 30px 0;
}
.pressCard>.source {
  background:white;
  border-radius:0 0 24px 24px;
  padding:0 30px 22px;
}
.profile {
  grid-row:1/3;
  align-self:center;
}
.portrait {
  width:108px;
  height:108px;
  border-radius:50%;
  overflow:hidden;
  margin:auto;
}
.profile .portrait img {
  width:100%;
  height:100%;
  border-radius:0;
  object-fit:cover;
  transform:scale(1.45);
  transform-origin:50% 35%;
}
.profile small {
  font-family:Brand,Arial,sans-serif;
  font-size:17px;
  line-height:1.4;
}
.profile h3 {
  font-size:24px;
}
#field {
  background:white;
}
.bubble,.bubble:before {
  background:#e0f2ec;
}
.bubble {
  box-shadow:0 2px 4px #07525a15;
}
.carouselShell:after {
  background:linear-gradient(90deg,white,transparent);
}
.remembrance>h2 {
  margin-bottom:15px;
}
.remembranceBody>img {
  margin-top:-55px;
}
.closingSections {
  background:white url("assets/closing-waves.svg") center/100% 100% no-repeat;
  isolation:isolate;
  padding-top:30px;
}
.closingSections #join {
  background:none;
  overflow:visible;
}
.closingSections #faq {
  position:relative;
}
.faqHeader,.faqExpander {
  position:relative;
}
@media(max-width:760px) {
  .bar {
    display:grid;
    grid-template-columns:1fr auto 1fr;
    gap:8px;
  }
  .logo {
    margin:0;
    justify-self:start;
  }
  .bar>.btn {
    grid-column:2;
    justify-self:center;
  }
  .menu {
    grid-column:3;
    justify-self:end;
  }
  .statValue {
    gap:4px;
  }
  .statFigure {
    width:23px;
    height:26px;
  }
  .tiles b {
    font-size:clamp(23px,5.8vw,34px);
  }
  .hero.wrap:before {
    bottom:-16px;
  }
  .steps {
    gap:40px;
  }
  .steps article+article:before {
    right:calc(50% - 20px);
    top:-38px;
    width:40px;
    height:32px;
    transform:rotate(-90deg);
  }
  .pressBackground {
    padding:35px 0;
  }
  .pressCard {
    grid-template-columns:1fr;
    gap:0;
  }
  .profile {
    grid-row:auto;
    margin-bottom:18px;
  }
  .portrait {
    width:105px;
    height:105px;
  }
  .pressCard>.expander {
    padding:22px 22px 0;
  }
  .pressCard>.source {
    padding:0 22px 20px;
  }
  .remembrance>h2 {
    margin-bottom:16px;
  }
  .remembranceBody {
    display:flex;
    flex-direction:column-reverse;
  }
  .remembranceBody>img {
    margin-top:0;
    width:190px;
    height:200px;
  }
  .closingSections {
    background-size:auto 100%;
    background-position:center;
  }
  .closingSections #join {
    background:none;
  }
}
@media(max-width:760px) {
  .bar {
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  }
  .bar .logo img {
    width:clamp(74px,23vw,96px);
  }
  .bar>.btn {
    font-size:16px;
    padding:8px 9px;
  }
}
.closingSections {
  overflow:clip;
}
/* Clear Anomalia numerals without synthetic weight or glyph crowding. */
.tiles b {
  font-weight:400;
  font-synthesis:none;
  font-kerning:none;
  font-variant-ligatures:none;
  font-feature-settings:"kern" 0,"liga" 0,"clig" 0;
  letter-spacing:.025em;
  white-space:nowrap;
  unicode-bidi:isolate;
  line-height:1.3;
}
.statValue {
  gap:10px;
}
.videoPlayer {
  position:relative;
  width:100%;
  aspect-ratio:9/16;
  max-width:420px;
  border-radius:24px;
  overflow:hidden;
  background:#f8e7de;
}
.videoPlayer video {
  display:block;
  width:100%;
  height:100%;
  max-height:none;
  box-shadow:none;
  border-radius:inherit;
  object-fit:contain;
}
.videoControls {
  position:absolute;
  bottom:10px;
  left:10px;
  right:10px;
  display:flex;
  direction:ltr;
  gap:6px;
  align-items:center;
  padding:5px 7px;
  border-radius:14px;
  background:#fffffff0;
  color:#07525a;
}
.videoControls[hidden] {
  display:none;
}
.videoControls button {
  border:0;
  background:transparent;
  color:inherit;
  font-size:19px;
  width:30px;
  height:34px;
  padding:0;
  flex-shrink:0;
}
.videoControls .videoSeek {
  margin:0;
  padding:0;
  min-width:0;
  width:100%;
  height:22px;
  border:0;
  accent-color:#e90059;
  background:transparent;
}
.videoTime {
  font:11px Arial;
  white-space:nowrap;
}
.videoPlayer:fullscreen {
  max-width:none;
  width:100%;
  height:100%;
  border-radius:0;
  background:#fff;
}
.videoPlayer:fullscreen video {
  object-fit:contain;
}
@media(min-width:761px) {
  .heroMedia .videoPlayer {
    position:absolute;
    width:34%;
    left:32.2%;
    top:5%;
    border:5px solid white;
    border-radius:26px;
    box-shadow:0 0 12px #eebda66b;
  }
  .heroMedia .videoPlayer video {
    position:static;
    width:100%;
    height:100%;
    border:0;
    box-shadow:none;
    max-height:none;
  }
  .videoControls {
    gap:2px;
    left:4px;
    right:4px;
    padding:3px;
  }
  .videoControls button {
    width:24px;
  }
}
.bubble small {
  justify-content:flex-start;
  direction:rtl;
}
.readTicks {
  width:27px;
  height:18px;
  color:#53bdeb;
  display:block;
}
.testimonials {
  padding-inline:30px;
}
.bubble:before {
  right:-20px;
  width:22px;
}
.carouselShell {
  overflow:visible;
}
.faqHeader h2 {
  font-size:42px;
}
.faqExpander .excerpt:after {
  height:140px;
  background:linear-gradient(180deg,transparent 0%,#ffffffb8 50%,#fff 100%);
}
#how,#field,#yossi {
  position:relative;
  isolation:isolate;
}
#how:after,#field:after,#yossi:after {
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  background:url("assets/transition-blob.svg") center/100% 100% no-repeat;
}
#how:after {
  width:45%;
  height:220px;
  left:-5%;
  top:-50px;
  opacity:.65;
  transform:rotate(8deg);
}
#field:after {
  width:43%;
  height:240px;
  right:0;
  top:-45px;
  opacity:.65;
  transform:rotate(175deg);
}
#yossi:after {
  width:38%;
  height:220px;
  left:0;
  bottom:-75px;
  opacity:.6;
  transform:rotate(-15deg);
}
@media(max-width:760px) {
  .hero.wrap:before {
    top:105px;
    bottom:0;
    width:86%;
    left:-5.555556%;
    opacity:.85;
  }
  .hero .videoPlayer {
    width:100%;
    max-width:420px;
    max-height:85svh;
  }
  .hero .videoPlayer video {
    max-height:none;
    height:100%;
  }
  .statValue {
    gap:4px;
  }
  .tiles b {
    font-size:clamp(20px,5.4vw,31px);
  }
  .statFigure {
    width:21px;
  }
  .faqHeader {
    flex-wrap:wrap;
    gap:12px;
  }
  .faqHeader h2 {
    font-size:42px;
  }
  .faqHeader .support {
    margin-right:auto;
  }
  #how:after {
    width:70%;
    height:180px;
    left:0;
    top:-40px;
  }
  #field:after {
    width:72%;
    height:190px;
    right:0;
    top:-25px;
  }
  #yossi:after {
    width:70%;
    height:190px;
    bottom:-65px;
  }
  .testimonials {
    padding-inline:30px;
  }
  .bubble {
    flex-basis:86%;
  }
}
body {
  overflow-x:clip;
}
.testimonials {
  scroll-padding-inline:30px;
}
.bubble {
  scroll-margin-inline:0;
}
#avinoam-text p,#yossi-text p {
  white-space:pre-line;
}
@media (min-width:761px) {
  #voices > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > article:nth-child(1) > div:nth-child(1) > small:nth-child(3) > span:nth-child(1) {
    translate:-3px -3px;
    display:inline-block;
  }
  #top > div:nth-child(1) > div:nth-child(1) > article:nth-child(1) > span:nth-child(2) {
    scale:0.85;
  }
  #top > div:nth-child(1) > div:nth-child(1) > article:nth-child(2) > span:nth-child(2) {
    scale:0.85;
  }
  #top > div:nth-child(1) > div:nth-child(1) > article:nth-child(3) > span:nth-child(2) {
    scale:0.85;
  }
  #top > div:nth-child(1) > small:nth-child(2) {
    visibility:hidden;
    display:inline-block;
  }
}
@media (max-width:760px) {
  .closingSections {
    background-image:url("assets/closing-layer-2.svg"),url("assets/closing-layer-1.svg"),url("assets/closing-layer-0.svg");
    background-position:center,calc(50% + 2px) calc(50% - 81px),calc(50% - 10px) calc(50% - 2px);
  }
}
.profile small {
  font-size:14px;
}
.pressCard .expander:not(.open) .excerpt {
  max-height:calc(105px + 2lh);
}
.remembrance .expander:not(.open) .excerpt {
  max-height:calc(180px + 4lh);
}
@media (max-width:760px) {
  .pressCard .expander:not(.open) .excerpt {
    max-height:calc(130px + 2lh);
  }
  .remembrance .expander:not(.open) .excerpt {
    max-height:calc(205px + 4lh);
  }
}
.videoStart {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:64px;
  height:64px;
  padding:0;
  border-radius:50%;
  border:2px solid #ffffffdc;
  color:white;
  background:rgb(7 82 90 / 45%);
  cursor:pointer;
  font-size:28px;
}
#copyJoin {
  display:block;
  margin:.6em 0;
  font-size:1em;
  padding:.5em 1em;
}
#copyResult {
  overflow-wrap:anywhere;
}
@media (min-width:761px) {
}
@media (max-width:760px) {
  .hero::before {
    translate:-19px 97px;
  }
}
/* All transition shapes share the page backdrop. Colored panels paint above it. */
#top {
  isolation:isolate;
  overflow-x:clip;
  background:white;
}
#how,#field,#yossi,.hero.wrap {
  isolation:auto;
}
#field,#yossi,.closingSections {
  background-color:transparent;
}
#how::after,#field::after,#yossi::after {
  z-index:-2;
}
.videoControls {
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:white;
  left:10px;
  right:10px;
  bottom:4px;
  padding:0;
  text-shadow:0 1px 3px #253839;
}
.videoControls button {
  text-shadow:inherit;
}
.videoControls .videoSeek {
  appearance:none;
  cursor:pointer;
  background:transparent;
  --elapsed:0%;
}
.videoSeek::-webkit-slider-runnable-track {
  height:3px;
  border-radius:3px;
  box-shadow:0 0 2px #415657;
  background:linear-gradient(to right,white var(--elapsed),#ffffff80 var(--elapsed));
}
.videoSeek::-webkit-slider-thumb {
  appearance:none;
  width:7px;
  height:7px;
  margin-top:-2px;
  background:white;
  border-radius:50%;
}
.videoSeek::-moz-range-track {
  height:3px;
  background:#ffffff80;
  border-radius:3px;
}
.videoSeek::-moz-range-progress {
  height:3px;
  background:white;
}
.videoSeek::-moz-range-thumb {
  width:7px;
  height:7px;
  border:0;
  background:white;
}
#joinForm .joinTrap {
  display:none;
}
.headerLogin,.formLogin {
  color:var(--ink);
  font-family:Brand,Arial,sans-serif;
}
.headerLogin {
  text-decoration:none;
  white-space:nowrap;
  font-size:18px;
}
.headerLogin:hover,.headerLogin:focus-visible {
  text-decoration:underline;
}
.faq a.faqLogin {
  display:table;
  width:fit-content;
  margin-top:.65em;
  color:white;
  text-decoration:none;
  font-size:1em;
}
.formPanel .existingUser {
  text-align:center;
  font-size:1rem;
  margin:1em auto 0;
}
@media (min-width:761px) and (max-width:1050px) {
  .bar {
    width:96%;
    gap:8px;
  }
  .bar .logo img {
    width:100px;
  }
  .bar nav {
    gap:7px;
  }
  .bar nav a,.headerLogin {
    font-size:16px;
  }
}
@media (max-width:760px) {
  .bar {
    width:94%;
    display:flex;
    justify-content:space-between;
    gap:0;
  }
  .bar .logo {
    margin:0;
    order:0;
  }
  .bar .logo img {
    width:clamp(61px,18vw,94px);
  }
  .bar .headerLogin {
    order:1;
    font-size:clamp(14px,4vw,18px);
  }
  .bar>.btn {
    order:2;
    white-space:nowrap;
  }
  .bar>.menu {
    order:3;
    flex-shrink:0;
  }
}
.pressLinks {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(16px,5vw,52px);
  margin-top:30px;
}
.pressLinks .source {
  display:inline-block;
  width:auto;
  margin:0;
  font-family:Brand,Arial,sans-serif;
  white-space:nowrap;
}
.faq .installAnswer {
  display:flex;
  align-items:center;
  gap:12px;
}
.faq .installAnswer .faqLogin {
  display:inline-flex;
  flex:none;
  margin:0;
  font-family:Brand,Arial,sans-serif;
  white-space:nowrap;
}
@media (max-width:760px) {
  .bar .headerLogin {
    width:3.65em;
    white-space:normal;
    text-align:center;
    line-height:1.05;
  }
}
@media (min-width:761px) {
  #how::after {
    translate:49px 787px;
    scale:3;
  }
  #field::after {
    translate:73px 158px;
    scale:1.8;
  }
  #yossi::after {
    translate:335px -381px;
    scale:1;
  }
}
@media (max-width:760px) {
  #how::after {
    translate:-87px 1605px;
    scale:2.15;
  }
  #field::after {
    translate:7px 140px;
    scale:1;
  }
  #yossi::after {
    translate:-90px -635px;
    scale:1.5;
  }
}
@media (min-width:761px) {
  .bar {
    justify-content:space-between;
    column-gap:0;
  }
  .bar nav {
    display:contents;
  }
  .pressLinks {
    gap:clamp(32px,10vw,104px);
  }
  .pressLinks .source {
    font-size:26px;
  }
}