/* Reusable full-screen, same-page quiz takeover. */
.quiz-overlay-page .hormone-hero .hero-grid,
.quiz-overlay-page .digestive-hero .hero-grid{
  grid-template-columns:1fr;
}
.quiz-takeover{
  position:fixed;
  inset:0;
  width:100vw;
  max-width:none;
  height:100dvh;
  max-height:none;
  margin:0;
  padding:0;
  border:0;
  background:var(--floral);
  color:var(--ink);
  overflow:hidden;
}
.quiz-takeover:not([open]){
  display:none;
}
.quiz-takeover[open]{
  display:block;
  animation:quizTakeoverIn .16s ease-out;
}
.quiz-takeover::backdrop{
  background:var(--floral);
}
@keyframes quizTakeoverIn{
  from{opacity:0}
  to{opacity:1}
}
html.quiz-takeover-open,
body.quiz-takeover-open{
  overflow:hidden;
  overscroll-behavior:none;
}
.quiz-takeover-shell{
  display:flex;
  width:100%;
  min-height:100svh;
  height:100dvh;
  flex-direction:column;
  background:var(--floral);
}
.quiz-takeover-toolbar{
  position:relative;
  z-index:2;
  display:flex;
  min-height:72px;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:max(12px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 12px max(24px,env(safe-area-inset-left));
  border-bottom:1px solid rgba(255,255,255,.16);
  background:#3f5130;
}
.quiz-takeover-brand{
  min-width:0;
  pointer-events:none;
}
.quiz-takeover-brand.health-brand{
  color:var(--floral);
}
.quiz-takeover-brand .health-brand-mark{
  background:var(--floral);
  color:var(--olive-leaf);
}
.quiz-takeover-close{
  display:grid;
  width:44px;
  min-width:44px;
  height:44px;
  place-items:center;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  background:rgba(255,255,255,.1);
  color:#fff;
  cursor:pointer;
}
.quiz-takeover-close:hover{
  border-color:#fff;
  background:rgba(255,255,255,.18);
}
.quiz-takeover-close:focus-visible{
  outline:3px solid rgba(232,149,111,.5);
  outline-offset:2px;
}
.quiz-takeover-close svg{
  width:20px;
  height:20px;
}
.quiz-takeover-content{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.quiz-overlay-page .quiz-takeover .quiz,
.quiz-overlay-page .quiz-takeover .quiz.digestive-contact-card{
  width:min(100%,760px);
  min-height:calc(100dvh - 73px);
  margin:0 auto;
  padding:32px 24px max(28px,env(safe-area-inset-bottom));
  border:0;
  border-radius:0;
  background:var(--floral);
  box-shadow:none;
}

@media (max-width:620px){
  .quiz-takeover-toolbar{
    min-height:54px;
    padding:max(5px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 5px max(14px,env(safe-area-inset-left));
  }
  .quiz-takeover-close{
    width:44px;
    min-width:44px;
    height:44px;
  }
  .quiz-overlay-page .quiz-takeover .quiz,
  .quiz-overlay-page .quiz-takeover .quiz.digestive-contact-card{
    min-height:100%;
    padding:12px max(16px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  }
  .quiz-overlay-page .quiz-takeover .quiz-body{
    margin-top:12px;
    animation-fill-mode:none;
  }
  .quiz-overlay-page .quiz-takeover .quiz-q{
    margin-bottom:12px;
    font-size:clamp(22px,5.4vw,24px);
    line-height:1.15;
  }
  .quiz-overlay-page .quiz-takeover .hhq-instruction{
    margin:-5px 0 8px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-options{
    gap:7px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-opt{
    min-height:0;
    gap:11px;
    padding:8px 10px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-opt-ico{
    width:36px;
    height:36px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-opt-txt b{
    font-size:15.5px;
    line-height:1.2;
  }
  .quiz-overlay-page .quiz-takeover .quiz-opt-txt span{
    margin-top:2px;
    font-size:12.5px;
    line-height:1.25;
  }
  .quiz-overlay-page .quiz-takeover .hhq-validation{
    min-height:16px;
    margin-top:6px;
    font-size:12px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-foot{
    position:sticky;
    bottom:0;
    z-index:1;
    padding-top:8px;
    padding-bottom:max(4px,env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(248,242,231,0),var(--floral) 18px);
  }
  .quiz-overlay-page .quiz-takeover .quiz-next{
    min-height:48px;
  }
  .quiz-overlay-page .quiz-takeover .bk-confirm{
    position:fixed;
    z-index:5;
    right:max(16px,env(safe-area-inset-right));
    bottom:max(12px,env(safe-area-inset-bottom));
    left:max(16px,env(safe-area-inset-left));
    width:auto;
    max-width:588px;
    margin:0 auto;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(100% + 20px));
    transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;
    box-shadow:0 12px 30px rgba(47,56,38,.28);
  }
  .quiz-overlay-page .quiz-takeover .bk-confirm:not(:disabled),
  .quiz-overlay-page .quiz-takeover .bk-confirm.is-busy{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
    transition-delay:0s;
  }
}

@media (max-width:620px) and (max-height:700px){
  .quiz-takeover-toolbar{
    min-height:50px;
    padding:max(3px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 3px max(14px,env(safe-area-inset-left));
  }
  .quiz-overlay-page .quiz-takeover .quiz,
  .quiz-overlay-page .quiz-takeover .quiz.digestive-contact-card{
    padding-top:8px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-progress{
    margin-top:6px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-body{
    margin-top:8px;
  }
  .quiz-overlay-page .quiz-takeover .quiz-foot{
    padding-top:5px;
  }
}

@media (prefers-reduced-motion:reduce){
  .quiz-takeover[open]{
    animation:none;
  }
}
