:root{
  --pink:#ff58b3;
  --pink2:#ff9ad4;
  --text:#2a2a33;
  --muted:#6f6570;
  --glass: rgba(255,255,255,.62);
  --stroke: rgba(255,88,179,.14);
  --shadow: 0 16px 42px rgba(20,20,30,.10);
  --shadow-soft: 0 10px 26px rgba(20,20,30,.08);
  --r: 22px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);overflow-x:hidden}
.container{width:min(1080px, calc(100% - 32px));margin-inline:auto}

/* ===== Background arsiran seni pink (NO gelombang besar) ===== */
.bg-art{
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background-image:
    url("assets/catpink.png"),
    radial-gradient(1000px 380px at 50% 30%, rgba(255,88,179,.10), transparent 70%),
    radial-gradient(900px 360px at 20% 10%, rgba(255,154,210,.14), transparent 70%),
    radial-gradient(900px 360px at 80% 15%, rgba(255,88,179,.10), transparent 75%);
  background-size:
    3000px auto,
    auto,
    auto,
    auto;
  background-repeat:
    repeat,
    no-repeat,
    no-repeat,
    no-repeat;
  background-position:
    center top,
    50% 30%,
    20% 10%,
    80% 15%;
  filter: blur(1.1px);
  opacity:.90;
}

.bg-art::after{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(0deg, rgba(255,255,255,.08), rgba(255,255,255,0) 40%),
    radial-gradient(1200px 520px at 50% 65%, rgba(255,255,255,.18), transparent 70%);
  mix-blend-mode: soft-light;
  opacity:.75;
  pointer-events:none;
}

/* ===== Navbar ===== */
.navWrap{
  position:sticky; top:0; z-index:50;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--stroke);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--text)}
.brandLogo{width:99px;height:60px;border-radius:16px;background:#ffffff2b;object-fit:contain}
.brandName{font-weight:950;letter-spacing:.06em}
.brandTag{font-size:12px;color:var(--muted)}

.navMenu{display:flex;gap:14px;align-items:center}
.navMenu a{text-decoration:none;color:var(--text);font-weight:900;opacity:.92}
.navMenu a:hover{opacity:1}

.burger{
  display:none;width:44px;height:44px;border-radius:14px;
  border:1px solid var(--stroke);background: rgba(255,88,179,.08);cursor:pointer;
}
.burger span{display:block;width:18px;height:2px;background:#b30063;margin:4px auto;border-radius:2px}
@media (max-width:980px){.navMenu{display:none}.burger{display:block}}

.mobileMenu{display:none;background: rgba(255,255,255,.86);border-top:1px solid var(--stroke)}
.mobileMenu.open{display:block}
.mobilePanel{padding:14px 0 18px;display:grid;gap:10px}
.mLink{
  text-decoration:none;color:var(--text);font-weight:950;
  padding:10px 12px;border-radius:14px;background: rgba(255,88,179,.06);border:1px solid var(--stroke)
}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:950;
}
.btnSmall{padding:10px 14px}
.btnFull{width:100%}

.btnWA{color:#fff;background: linear-gradient(135deg,#1fcf6b,#18a957);box-shadow: 0 14px 30px rgba(31,207,107,.22)}
.btnPink{color:#fff;background: linear-gradient(135deg,var(--pink),var(--pink2));box-shadow: 0 16px 34px rgba(255,88,179,.22)}
.btn:hover{transform: translateY(-1px);filter:saturate(1.05)}

/* ===== Hero ===== */
.hero{position:relative;min-height:820px;overflow:hidden}
.heroBg{position:absolute;inset:0;background-size:cover;background-position:center}
.heroVideoBg{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .8s ease;
  will-change:opacity;
}
.heroVideoBg.is-active{opacity:1}
.heroTint{position:absolute;inset:0;background: linear-gradient(90deg, rgba(255,88,179,.35), rgba(0,0,0,.35))}
.heroInner{position:relative;padding:58px 0;margin-top: 70px;color:#fff}
.hero h1{margin:0 0 6px;font-size:clamp(34px,4.6vw,54px);letter-spacing:.06em;font-weight:950}
.heroSub{margin:0 0 16px;font-size:clamp(16px,2vw,22px);font-weight:750;opacity:.96}
.heroMeta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  margin-top:10px;
  font-weight:850;
  font-size:15px;
  opacity:.92;
}
.heroMeta span{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:16px;
}

/* ===== Tentang ===== */
.aboutSection{
  padding:0;
  margin-top:-56px;
}
.aboutImage{
  width:100%;
  background:#f6e3ee;
  position:relative;
  z-index:1;
  overflow:hidden;
}
.aboutImage img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}
.aboutBody{
  background:#fff7ef;
  padding:26px 0 16px;
  text-align:center;
}
.aboutInner{
  max-width:860px;
}
.aboutBody h2{
  margin:0 0 10px;
  font-size:clamp(28px, 4.6vw, 44px);
  font-weight:950;
  color:#111;
}
.aboutBody p{
  margin:0 auto 12px;
  color:#2f2a30;
  font-weight:650;
  line-height:1.85;
  font-size:clamp(15px, 2.3vw, 18px);
}
.aboutNote{
  margin-top:6px;
}
.aboutWave{
  background:#fff7ef;
  line-height:0;
}
.aboutWave svg{
  display:block;
  width:100%;
  height:90px;
}
.aboutWave path{
  fill:#f58ecb;
}
.heroMeta svg{
  width:24px;
  height:24px;
  flex:0 0 24px;
}
.dot{opacity:.7}
@media (max-width:900px){.hero{min-height:420px;padding-bottom:30px}.heroInner{padding-bottom:30px}}
@media (min-width:1024px){
  .heroInner{
    max-width:1080px;
    margin-left:12vw;
  }
  .hero h1{font-size:clamp(44px,5.8vw,74px)}
  .heroSub{font-size:clamp(18px,2.4vw,26px)}
  .heroMeta{font-size:15px}
}

/* Gelombang separator besar (cuma antar konten) */
.waveSep{position:absolute;left:0;right:0;bottom:-1px;height:140px}
.waveSep svg{width:100%;height:100%}
.waveSep path{fill: rgba(255,255,255,.55)}
.waveTop{top:0;bottom:auto;height:120px}
.waveTop path{fill: rgba(255,255,255,.35)}

/* ===== Sections ===== */
.section{padding: 34px 0}
.sectionHero{
  position:relative;
  overflow:hidden;
  padding:60px 0 70px;
  color:#fff;
}
.sectionBgVideo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}
.sectionTint{
  position:absolute;
  inset:0;
  background: rgba(255,88,179,.45);
  mix-blend-mode: multiply;
  z-index:1;
}
.sectionHeroInner{
  position:relative;
  z-index:2;
  background: rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.18);
}
.sectionHero .titleCenter{color:#fff}
.sectionHero .centerQuote{color:#fff}
.sectionHero .glass{
  background: rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(4px);
}

/* ===== Bergabung Mitra ===== */
.sectionPartner{
  position:relative;
  overflow:hidden;
  padding:60px 0 70px;
  color:#fff;
}
.sectionPartnerBg{
  position:absolute;
  inset:0;
  background: url("assets/Picture12.jpg") center/cover no-repeat;
  z-index:0;
}
.sectionPartnerTint{
  position:absolute;
  inset:0;
  background: rgba(255,88,179,.35);
  mix-blend-mode: multiply;
  z-index:1;
}
.sectionPartnerInner{
  position:relative;
  z-index:2;
  background: rgba(0,0,0,.38);
  border:1px solid rgba(255,255,255,.2);
}
.sectionPartner .glass{
  background: rgba(0,0,0,.38);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(4px);
}
.sectionPartner .titleCenter{color:#fff}
.sectionPartner .centerQuote{color:#fff}
.glass{
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.62));
  border: 1px solid rgba(255,88,179,.12);
  border-radius: 28px;
  padding: 24px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(6px);
}
.titleCenter{
  text-align:center;margin: 8px 0 18px;
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 950; color:#3a2d33;
  letter-spacing:.02em;
}
.center{text-align:center}

/* Gelombang tipis lembut (opsional pemisah halus) */
.waveThin{
  height: 120px;
  background:
    url("assets/layernew.png")
    center/cover no-repeat;
      background-size: cover;
}


/* ===== Content grid ===== */
.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center}
.twoColRev{grid-template-columns:1fr 1fr}
@media (max-width:900px){.twoCol{grid-template-columns:1fr}}

.imgCard{border-radius:18px;overflow:hidden;background:#fff;box-shadow: var(--shadow-soft)}
.imgCard img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.imgCardSmall img{aspect-ratio:4/3}
.imgCardFull img{aspect-ratio:auto;height:auto;object-fit:contain}
.imgCardTop img{object-position:top}

.text h2{margin:0 0 8px;font-size:32px;font-weight:950;letter-spacing:.01em}
.text p{margin:0 0 12px;line-height:1.75;color:#3b3b45;font-size:15px}
.miniTitle{margin:0 0 10px;font-size:16px;font-weight:950}

.note{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:16px;background: rgba(255,88,179,.08);border:1px solid var(--stroke);box-shadow: var(--shadow-soft)}
.noteIcon{margin-top:2px}

/* Numbered list circles */
.numList{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:10px;counter-reset:item}
.numList li{position:relative;padding-left:36px;line-height:1.6;color:#3b3b45;font-size:15px}
.numList li::before{
  content: counter(item); counter-increment:item;
  position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:999px;
  display:grid;place-items:center;background: rgba(255,88,179,.95);color:#fff;font-weight:950;font-size:12px
}

/* checklist */
.checkList{
  margin:14px auto 6px;
  padding:0;
  list-style:none;
  max-width:860px;
  display:grid;
  gap:14px;
}
.checkList li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  line-height:1.75;
  color:#3b3b45;
  font-size:15px;
}
.ck{
  width:22px;
  height:22px;
  border-radius:999px;
  background: rgba(255,88,179,.75);
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:950;
  margin-top:2px;
  flex:0 0 22px;
}

/* Keunggulan styling + left-in animation */
.fancyList li{
  background: rgba(255,255,255,.7);
  border:1px solid rgba(255,88,179,.15);
  border-radius:16px;
  padding:12px 14px;
  box-shadow: 0 10px 24px rgba(20,20,30,.06);
}
.fancyList li b{color:#2a1f2b}
.fancyList .ck{background: linear-gradient(135deg,#ff7fc6,#ff58b3)}

.fancyList li.reveal{
  transform: translateX(-26px);
  filter: blur(4px);
}
.fancyList li.reveal.in{
  transform: translateX(0);
  filter: blur(0);
}

@media (max-width:640px){
  .checkList{max-width:100%;gap:12px}
  .checkList li{font-size:15px;line-height:1.7}
  .ck{width:20px;height:20px;flex-basis:20px}
}

/* Media layout */
.mediaTop{display:grid;grid-template-columns:1fr 1fr 1.8fr;gap:14px;margin-top:12px}
.mediaTop{align-items:stretch}
.mediaTop .tile{height:auto;aspect-ratio:3/4}
.mediaTop .tile.square{aspect-ratio:1/1}
.mediaTop .tile.wide{aspect-ratio:16/9}
.mediaTop .tile img,
.mediaTop .tile video{
  height:100%;
}
@media (max-width:900px){.mediaTop{grid-template-columns:1fr}}
.tile{border-radius:16px;overflow:hidden;background:#fff;box-shadow: var(--shadow-soft);position:relative}
.tile img,
.tile video{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.tile::after{
  content:"";
  position:absolute;inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,0) 40%, rgba(0,0,0,.08) 100%);
  pointer-events:none;
}
.mediaGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:14px;
  margin:16px 0 6px;
}

.mediaNote{
  margin:16px auto 4px;
  max-width:780px;
  text-align:center;
  color:#3b3b45;
  font-weight:700;
  line-height:1.7;
}
.mediaNote p{margin:0 0 6px}
@media (max-width:900px){
  .mediaNote{max-width:100%}
}
@media (max-width:900px){.mediaGrid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.mediaGrid{grid-template-columns:1fr}}
.play{
  position:absolute;inset:0;display:grid;place-items:center;
  font-size:34px;font-weight:950;color:#fff;
  text-shadow: 0 14px 30px rgba(0,0,0,.55);
  background: radial-gradient(circle at 50% 50%, rgba(0,0,0,.25), rgba(0,0,0,0) 55%);
  pointer-events:none;
}
.playBig{font-size:44px}

/* Contact */
.contactGrid{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:16px;margin-top:12px}
@media (max-width:1100px){.contactGrid{grid-template-columns:1fr 1.2fr}}
@media (max-width:900px){.contactGrid{grid-template-columns:1fr}}
.contactCard{background: rgba(255,255,255,.78);border-radius:18px;padding:18px;box-shadow: var(--shadow-soft)}
.cRow{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.cIc{width:34px;height:34px;border-radius:12px;background: rgba(255,88,179,.14);display:grid;place-items:center}
.cText{font-weight:950;color:#3b3b45}
.socialRow{display:flex;gap:10px;margin-top:10px}
.soc{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background: rgba(255,88,179,.14);color:#b30063;text-decoration:none;font-weight:950}

.waIcon{
  display:inline-grid;
  place-items:center;
  width:24px;height:24px;
  border-radius:999px;
  margin-right:8px;
  font-size:11px;
  font-weight:950;
  color:#0b4e2f;
  background: rgba(255,255,255,.85);
}

.mapCard{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  box-shadow: var(--shadow-soft);
  min-height:440px;
}
.mapCard iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  filter: saturate(1.05);
}
.mapBadge{
  position:absolute;
  left:12px;bottom:12px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.85);
  font-weight:900;
  font-size:12px;
  color:#5a2b44;
  box-shadow: var(--shadow-soft);
}

.videoCard{border-radius:18px;overflow:hidden;background:#fff;box-shadow: var(--shadow-soft);position:relative}
.videoCard img,
.videoCard video{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}

.mediaVideo{background:#000}
.videoUi{position:absolute;left:14px;right:14px;bottom:14px;height:6px;border-radius:99px;background: rgba(255,255,255,.55)}

.quote{text-align:center;margin:18px 0 0;font-weight:950;color:#b30063;font-size:18px;letter-spacing:.01em}
.centerQuote{
  text-align:center;
  max-width:840px;
  margin:12px auto 0;
  font-weight:800;
  color:#3b3b45;
  line-height:1.8;
  font-size:clamp(15px, 2.2vw, 20px);
}
.centerQuote p{margin:0 0 10px}

/* Berita */
.newsGrid{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:16px;
}
.newsCard{
  background: rgba(255,255,255,.9);
  border:1px solid var(--stroke);
  border-radius:18px;
  padding:18px;
  box-shadow: var(--shadow-soft);
  box-sizing:border-box;
  overflow:hidden;
}
.newsThumb{
  border-radius:14px;
  overflow:hidden;
  margin-bottom:10px;
  box-shadow: var(--shadow-soft);
  width:100%;
  box-sizing:border-box;
}
.newsThumb img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
  max-width:100%;
  height:auto;
}
@media (max-width:640px){
  .newsCard{
    padding:12px;
  }
  .newsThumb{
    margin:0 0 10px;
    border-radius:12px;
    overflow:hidden;
  }
  .newsThumb img{
    aspect-ratio:auto;
    height:auto;
    object-fit:contain;
  }
}
.newsMeta{
  font-weight:800;
  color:#8b5a7a;
  font-size:13px;
  letter-spacing:.02em;
}
.newsTitle{
  margin:6px 0 8px;
  font-size:clamp(18px, 3vw, 22px);
}
.newsExcerpt{
  margin:0 0 12px;
  line-height:1.7;
  color:#3b3b45;
}
.newsFigure{
  margin:16px 0;
  padding:0;
}
.newsFigure img{
  width:100%;
  height:auto;
  display:block;
  border-radius:14px;
  box-shadow: var(--shadow-soft);
}
.newsFigure figcaption{
  margin-top:8px;
  font-size:clamp(12px, 2.2vw, 14px);
  color:#6f6270;
  text-align:left;
}
@media (max-width:900px){
  .newsGrid{grid-template-columns:1fr}
}

/* Floating WA */
.waFloat{
  position:fixed;right:16px;bottom:16px;width:54px;height:54px;border-radius:18px;
  display:grid;place-items:center;text-decoration:none;font-weight:950;color:#fff;
  background: linear-gradient(135deg,#22c55e,#16a34a);
  box-shadow: 0 16px 40px rgba(34,197,94,.35);
  z-index:60;
}

/* ===== Footer ===== */
.footer{
  margin-top:24px;
  background:transparent;
}
.footerTop{
  background: linear-gradient(180deg, #fff7ef 0%, #ffeaf4 100%);
  padding:60px 0 44px;
  border-top:none;
}
.footerWrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:10px;
}
.footerLogo{
  width:min(260px, 80vw);
  height:auto;
  filter: drop-shadow(0 6px 16px rgba(255,88,179,.18));
}
.footerTagline{
  margin:0;
  color:#fc9fcf;
  font-weight:700;
  letter-spacing:.02em;
}
.footerTitle{
  margin:8px 0 0;
  font-size:clamp(28px, 6vw, 60px);
  font-weight:950;
  letter-spacing:.02em;
  color:#111;
}
.footerBy{
  margin:0;
  font-size:clamp(16px, 3vw, 26px);
  font-weight:800;
  color:#111;
}
.footerThanks{
  margin:10px 0 0;
  max-width:820px;
  font-size:clamp(14px, 2.4vw, 18px);
  line-height:1.7;
  color:#2d2a2f;
}
.footerWave{
  background:#ffeaf4;
  line-height:0;
}
.footerWave svg{
  display:block;
  width:100%;
  height:90px;
}
.footerWave path{
  fill:#f19acb;
}
.footerBottom{
  background: linear-gradient(180deg, #f19acb 0%, #e77fbb 55%, #d96aa9 100%);
  color:#fff;
  padding:42px 0 56px;
  position:relative;
}
.footerBottomInner{
  text-align: center;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:20px;
}
.footerContactTitle{
  margin-top:6px;
  font-weight:900;
  font-size:clamp(19px, 2.6vw, 22px);
  color:#fff;
  letter-spacing:.02em;
}
.footerContactGrid{

  margin-top:6px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  width:min(860px, 100%);
  padding:0 8px;
  text-align:left;
  justify-items:stretch;
  align-items:stretch;
}
.footerContactItem{
  display:block;
  min-width:220px;
  padding:14px 16px;
  border-radius:14px;
  background: rgba(255,255,255,.16);
  box-shadow: 0 12px 30px rgba(0,0,0,.14);
  backdrop-filter: blur(6px);
  text-align:left;
  text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.footerContactItem,
.footerContactItem *{
  text-decoration:none;
  color:inherit;
}
.footerContactItem:hover,
.footerContactItem:focus-visible{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0,0,0,.2);
  background: rgba(255,255,255,.22);
  outline: none;
}

.footerLabel{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  letter-spacing:.01em;
  color:#fff;
  font-size:clamp(14px, 2.4vw, 18px);
  opacity:.92;
  justify-content:flex-start;
}
.footerValue{
  margin-top:6px;
  font-weight:750;
  color:#fff;
  opacity:.98;
  font-size:clamp(15px, 2.7vw, 20px);
}
.fIc{
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.fIc svg{
  width:26px;
  height:26px;
  display:block;
}
.fIcTiktok{
  margin-left:4px;
}
.footerLabelWavy{
  text-decoration: underline wavy #cc1f1f;
  text-underline-offset: 6px;
}
.footerSlogan{
  margin-top:8px;
  font-size:clamp(17px, 2.8vw, 26px);
  font-weight:900;
  letter-spacing:.04em;
  text-transform: uppercase;
}
.footerCopy{
  margin-top:2px;
  font-size:clamp(12px, 2vw, 14px);
  opacity:.85;
}
@media (max-width:540px){
  .footerContactGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
    width:min(520px, 100%);
  }
  .footerContactItem{
    min-width:0;
    padding:10px 12px;
    border-radius:12px;
  }
  .footerLabel{
    font-size:12px;
    gap:8px;
  }
  .footerValue{
    font-size:9px;
    margin-top:4px;
  }
  .fIc{
    width:20px;
    height:20px;
  }
  .fIc svg{
    width:20px;
    height:20px;
  }
}
@media (max-width:360px){
  .footerContactGrid{
    grid-template-columns:1fr;
  }
}

/* ===== Scroll animation (reveal) ===== */
.reveal{
  opacity:0;
  transform: translateY(22px) scale(.985);
  filter: blur(6px);
  transition: opacity .85s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1), filter .9s cubic-bezier(.22,1,.36,1);
  transition-delay: var(--delay, 0s);
  will-change: transform, opacity;
}
.reveal.in{
  opacity:1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

.section.reveal{transform: translateY(26px)}
.glass.reveal{transform: translateY(18px) scale(.99)}
.checkList li.reveal{transform: translateY(12px) translateX(6px)}

.reveal-text{overflow:hidden}
.reveal-text .rt-word{
  display:inline-block;
  opacity:0;
  transform: translateY(1.2em);
  filter: blur(4px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1), filter .9s cubic-bezier(.22,1,.36,1);
  transition-delay: calc(var(--delay, 0s) + var(--word-delay, 0s));
}
.reveal-text.in .rt-word{
  opacity:1;
  transform: translateY(0);
  filter: blur(0);
}

/* Respect reduce motion */
@media (prefers-reduced-motion: reduce){
  .reveal{transition:none;transform:none;opacity:1}
  .reveal-text .rt-word{transition:none;transform:none;opacity:1;filter:none}
}