.quest-page {
  color:var(--purple);
  background:#faf9f6
}

.quest-wrap {
  padding-left:var(--edge);
  padding-right:var(--edge)
}

.quest-page h2 {
  font-size:clamp(34px,4vw,55px);
  line-height:1.12
}

.quest-page h2 em {
  color:#956abe
}

.quest-page .eyebrow {
  margin-bottom:18px
}

.quest-hero {
  padding:var(--hero-top) var(--edge) 55px;
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:7%;
  align-items:center
}

.quest-hero h1 {
  font-size:clamp(40px,4.3vw,65px);
  line-height:1.1;
  margin:0 0 22px
}

.quest-hero h1 em {
  color:#956abe
}

.quest-hero p {
  max-width:600px;
  font-size:18px;
  line-height:1.65;
  color:#70677e
}

.quest-anchor {
  display:inline-flex;
  gap:20px;
  font-weight:800;
  font-size:14px;
  margin-top:22px
}

.quest-hero figure {
  height:285px;
  position:relative;
  overflow:hidden;
  border-radius:90px 22px 22px 22px;
  margin:0
}

.quest-hero figure>img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 58%
}

.quest-hero figure:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(transparent,#35127abf)
}

.quest-hero figcaption {
  position:absolute;
  bottom:22px;
  left:28px;
  z-index:1;
  color:white
}

.quest-hero figcaption>span {
  font-size:12px
}

.quest-hero figcaption>strong {
  display:block;
  font:700 35px Quicksand,sans-serif
}

.quest-dot {
  color:var(--coral)
}

.quest-strip {
  background:var(--purple);
  color:white;
  display:flex;
  justify-content:center;
  gap:12%;
  padding:25px var(--edge);
  font-weight:700;
  font-size:15px
}

.quest-intro {
  padding-top:85px;
  padding-bottom:85px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}

.quest-intro p,.quest-partner p {
  font-size:17px;
  line-height:1.8;
  color:#70677e;
  margin-bottom:18px
}

.quest-intro .quest-lead {
  font-size:24px;
  line-height:1.5;
  color:var(--purple)
}

.quest-demo-section {
  background:#eee6f7;
  padding:65px 0
}

.quest-demo-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center
}

.quest-demo-grid>div>p {
  max-width:390px;
  font-size:18px;
  line-height:1.75;
  color:#70677e;
  margin-top:25px
}

.quest-demo-grid .quest-demo-note {
  font-size:12px;
  line-height:1.7;
  max-width:350px
}

.quest-demo {
  background:white;
  border:1px solid #e0d4ec;
  border-radius:25px;
  overflow:hidden;
  max-width:510px;
  box-shadow:0 20px 45px #35127a0b
}

.quest-demo-top {
  display:flex;
  justify-content:space-between;
  padding:18px 24px;
  font-size:11px;
  letter-spacing:.08em;
  font-weight:800
}

.quest-demo>img {
  height:180px;
  width:100%;
  object-fit:cover;
  object-position:50% 20%;
  display:block
}

.quest-demo-body {
  padding:25px
}

.quest-demo-body .eyebrow {
  font-size:10px;
  margin-bottom:12px
}

.quest-demo-body h3 {
  font-size:25px;
  margin-bottom:12px
}

.quest-demo-body>p {
  font-size:14px;
  line-height:1.6
}

.quest-answers {
  display:grid;
  gap:9px;
  margin-top:20px
}

.quest-answers button {
  padding:13px 15px;
  border:1px solid #ded1eb;
  border-radius:10px;
  background:#faf8fd;
  color:var(--purple);
  text-align:left;
  cursor:pointer;
  font-size:14px;
  line-height:1.4
}

.quest-answers button:hover {
  border-color:var(--purple)
}

.quest-answers button[data-result=correct] {
  border-color:#39745d;
  background:#edf8f1
}

.quest-answers button[data-result=retry] {
  border-color:var(--coral);
  background:#fff0ed
}

#quest-feedback:not(:empty) {
  margin-top:18px;
  font-weight:700
}

.quest-reset {
  border:0;
  background:none;
  padding:16px 0 0;
  color:var(--purple);
  text-decoration:underline;
  cursor:pointer
}

[hidden] {
  display:none!important
}

.quest-process {
  padding-top:85px;
  padding-bottom:85px
}

.quest-steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
  margin-top:45px
}

.quest-steps article {
  border-top:1px solid #ded1eb;
  padding-top:25px
}

.quest-number {
  font:500 45px Quicksand,sans-serif;
  color:#bca2d6
}

.quest-steps h3 {
  font-size:25px;
  line-height:1.2;
  margin:25px 0 16px
}

.quest-steps p,.quest-benefit-grid p {
  font-size:15px;
  line-height:1.75;
  color:#70677e
}

.quest-benefits {
  background:var(--purple);
  color:white;
  padding:65px 0
}

.quest-benefit-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
  margin-top:40px
}

.quest-benefit-grid h3 {
  font-size:25px;
  margin-bottom:15px
}

.quest-benefit-grid p {
  color:#e1d5f0
}

.quest-benefits .eyebrow {
  color:#ccb5e6
}

.quest-partner {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
  padding-top:90px;
  padding-bottom:85px;
  align-items:center
}

.quest-partner h2 {
  margin-bottom:25px
}

.quest-partner .button {
  margin-top:10px
}

.quest-partner-mark {
  background:#efe7f6;
  border-radius:80px 20px 80px 20px;
  text-align:center;
  padding:50px 25px
}

.quest-partner-mark>span {
  display:block;
  font-size:11px;
  letter-spacing:.12em;
  font-weight:800
}

.quest-partner-mark strong {
  font:700 clamp(35px,4vw,56px) Quicksand,sans-serif;
  display:block
}

.quest-partner-mark strong span {
  color:var(--coral)
}

.quest-partner-mark b {
  display:block;
  color:#9a77b9;
  font-size:32px;
  font-weight:400;
  margin:18px
}

.quest-faq {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:70px;
  padding-bottom:85px
}

.quest-faq details {
  border-bottom:1px solid #ded1eb;
  padding:20px 0
}

.quest-faq details:first-child {
  border-top:1px solid #ded1eb
}

.quest-faq summary {
  font-weight:800;
  cursor:pointer;
  line-height:1.5
}

.quest-faq details p {
  padding-top:14px;
  color:#70677e;
  font-size:15px;
  line-height:1.8
}

.quest-cta {
  background:#eee6f7;
  text-align:center;
  padding:65px var(--edge)
}

.quest-cta>img {
  margin-bottom:25px
}

.quest-cta p {
  margin:22px auto 26px;
  max-width:540px;
  color:#70677e;
  line-height:1.7
}

.quest-link {
  display:block;
  width:fit-content;
  margin:22px auto 0;
  font-size:14px;
  font-weight:800
}

@media(max-width:1050px) {
  .quest-hero {
    gap:5%
  }

  .quest-hero h1 {
    font-size:48px
  }

  .quest-demo-grid,.quest-partner {
    gap:45px
  }

  .quest-steps,.quest-benefit-grid {
    grid-template-columns:repeat(2,1fr);
    gap:32px
  }

  .quest-intro {
    gap:40px
  }

}

@media(max-width:760px) {
  .quest-hero {
    grid-template-columns:1fr;
    padding:var(--hero-top) var(--edge) 35px
  }

  .quest-hero h1 {
    font-size:40px
  }

  .quest-hero p {
    font-size:17px
  }

  .quest-hero figure {
    display:none
  }

  .quest-strip {
    gap:18px;
    font-size:12px;
    text-align:center;
    align-items:center
  }

  .quest-intro,.quest-demo-grid,.quest-partner,.quest-faq {
    grid-template-columns:1fr;
    gap:30px
  }

  .quest-intro,.quest-process,.quest-partner {
    padding-top:55px;
    padding-bottom:55px
  }

  .quest-demo-grid>div>p {
    max-width:none
  }

  .quest-demo {
    max-width:none
  }

  .quest-demo-section {
    padding:45px 0
  }

  .quest-steps h3 {
    font-size:22px
  }

  .quest-steps {
    gap:25px 20px
  }

  .quest-benefits {
    padding:50px 0
  }

  .quest-faq {
    padding-bottom:55px
  }

  .quest-partner-mark {
    padding:30px
  }

  .quest-partner-mark strong {
    font-size:40px
  }

  .quest-partner-mark b {
    margin:8px
  }

  .quest-cta {
    padding:50px var(--edge)
  }

}

@media(max-width:400px) {
  .quest-hero h1 {
    font-size:36px
  }

  .quest-steps,.quest-benefit-grid {
    grid-template-columns:1fr
  }

  .quest-strip {
    font-size:11px;
    gap:12px
  }

  .quest-demo-body {
    padding:20px
  }

}

.quest-formats {
  padding-bottom:80px
}

.quest-formats-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin-top:35px
}

.quest-formats-grid article {
  background:#f0e9f7;
  border-radius:26px;
  padding:35px
}

.quest-formats-grid article:nth-child(2) {
  background:#fff0eb
}

.quest-formats-grid .quest-number {
  display:block;
  margin-bottom:24px
}

.quest-formats-grid h3 {
  font-size:30px;
  line-height:1.2;
  margin-bottom:20px
}

.quest-formats-grid p {
  font-size:17px;
  line-height:1.8;
  color:#70677e
}

.quest-format-tag {
  display:block;
  font-size:12px;
  font-weight:800;
  margin-top:25px
}

.quest-prizes {
  background:#f0e9f7;
  padding:65px 0
}

.quest-prizes-grid {
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:75px;
  align-items:center
}

.quest-prizes h2 {
  margin-bottom:25px
}

.quest-prizes p {
  font-size:18px;
  line-height:1.75;
  color:#70677e
}

.quest-prizes .quest-prize-note {
  font-size:12px;
  margin-top:20px;
  max-width:530px
}

.quest-prizes aside {
  background:var(--purple);
  color:white;
  padding:38px;
  border-radius:70px 22px 22px 22px
}

.quest-prizes aside>span:first-child {
  font-size:10px;
  letter-spacing:.1em
}

.quest-prizes aside>strong {
  display:block;
  font:700 48px/1.1 Quicksand,sans-serif;
  margin:22px 0
}

.quest-prizes aside p {
  color:#e1d5f0;
  font-size:16px
}

.quest-prize-label {
  display:block;
  border-top:1px solid #ffffff30;
  padding-top:20px;
  margin-top:25px;
  color:#e1d5f0;
  font-size:11px
}

@media(max-width:760px) {
  .quest-formats {
    padding-bottom:50px
  }

  .quest-formats-grid,.quest-prizes-grid {
    grid-template-columns:1fr;
    gap:25px
  }

  .quest-formats-grid article {
    padding:28px
  }

  .quest-formats-grid h3 {
    font-size:27px
  }

  .quest-prizes {
    padding:50px 0
  }

  .quest-prizes aside>strong {
    font-size:40px
  }

}

.quest-prizes aside.quest-walibi-card {
  padding:0;
  overflow:hidden;
  border-radius:60px 22px 22px 22px
}

.quest-walibi-visual {
  position:relative
}

img.quest-walibi-photo {
  display:block;
  width:100%;
  height:250px;
  object-fit:cover;
  object-position:center
}

.quest-walibi-logo {
  position:absolute;
  bottom:16px;
  left:20px;
  display:block;
  background:white;
  border-radius:12px;
  padding:12px 17px;
  box-shadow:0 4px 15px #00000015
}

.quest-walibi-logo img {
  display:block;
  width:130px;
  height:auto
}

.quest-walibi-copy {
  padding:28px 32px 30px
}

.quest-walibi-copy>span:first-child {
  font-size:10px;
  letter-spacing:.1em
}

.quest-walibi-copy>strong {
  display:block;
  font:700 42px/1.1 Quicksand,sans-serif;
  margin:18px 0
}

.quest-walibi-copy .quest-prize-label {
  margin-top:20px
}

@media(max-width:760px) {
  img.quest-walibi-photo {
    height:230px
  }

  .quest-walibi-copy {
    padding:25px
  }

  .quest-walibi-copy>strong {
    font-size:37px
  }

}
