/* Assessment-only brand layer. Keep survey visibility and behavior in the original stylesheet. */
.assessment-page .frequency-slider { margin: 24px 0; padding: clamp(16px, 3vw, 28px); background: var(--pale); border-radius: 13px; }
.assessment-page .frequency-slider-status { margin: 0 0 12px; color: var(--navy); font-size: 22px; font-weight: 700; }
.assessment-page .frequency-slider input[type='range'] { display: block; width: 100%; height: 44px; margin: 0; padding: 0; border: 0; cursor: pointer; appearance: none; background: transparent; }
.assessment-page .frequency-slider input[type='range']::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(to right, var(--blue) var(--fill, 0%), #ccdce9 var(--fill, 0%)); }
.assessment-page .frequency-slider input[type='range']::-moz-range-track { height: 8px; border-radius: 8px; background: #ccdce9; }
.assessment-page .frequency-slider input[type='range']::-moz-range-progress { height: 8px; border-radius: 8px; background: var(--blue); }
.assessment-page .frequency-slider input[type='range']::-webkit-slider-thumb { appearance: none; width: 28px; height: 28px; margin-top: -10px; border: 3px solid #fff; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 2px var(--blue); }
.assessment-page .frequency-slider input[type='range']::-moz-range-thumb { width: 22px; height: 22px; border: 3px solid #fff; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 2px var(--blue); }
.assessment-page .frequency-slider-hint { margin: 8px 0 18px; color: #5c5c63; font-size: 16px; }
.assessment-page .frequency-slider-scroll { overflow-x: auto; padding: 6px 4px; }
.assessment-page .frequency-slider-scale { min-width: 540px; }
.assessment-page .frequency-slider-options { display: grid; grid-template-columns: repeat(var(--stops), minmax(0, 1fr)); gap: 0; align-items: stretch; }
.assessment-page .frequency-slider-options label,
.assessment-page .frequency-slider-clear { position: relative; display: flex; justify-content: center; align-items: center; text-align: center; gap: 0; margin: 0 4px; padding: 8px 4px; min-height: 52px; border: 1px solid #ccdce9; border-radius: 8px; background: #fff; color: var(--navy); cursor: pointer; font-size: 16px; line-height: 1.25; overflow-wrap: anywhere; }
.assessment-page .frequency-slider-options label::after { content: ''; position: absolute; width: 2px; height: 8px; background: var(--blue); bottom: -12px; left: calc(50% - 1px); }
.assessment-page .frequency-slider-clear { min-height: 44px; padding: 8px 14px; margin: 0; }
.assessment-page .frequency-slider-scale input[type='range'] { width: calc(100% - 100% / var(--stops) + 28px); margin: 6px calc(50% / var(--stops) - 14px) 0; }
.assessment-page .frequency-slider-options label:has(input:checked) { background: #dcecf9; border-color: var(--blue); }
.assessment-page .frequency-slider-options label:focus-within { outline: 3px solid var(--blue); outline-offset: 2px; }
.assessment-page .frequency-slider-options input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip-path: inset(50%); overflow: hidden; }
.assessment-page {
  --navy: #17145a;
  --blue: #20479f;
  --cyan: #55c7e8;
  --pale: #eef8fc;
  font-family: "neue-haas-grotesk-display", Arial, sans-serif;
  font-size: 20px;
  line-height: 1.55;
  letter-spacing: .15px;
  color: #252525;
  background: #fff;
}
.assessment-page *, .assessment-page *::before, .assessment-page *::after { box-sizing: border-box; }
.assessment-page button, .assessment-page input, .assessment-page select,
.assessment-page textarea, .assessment-page .likert-scale label b { font-family: inherit; }
.assessment-page h1, .assessment-page h2, .assessment-page h3 {
  color: var(--navy);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: .25px;
}
.assessment-page a { color: var(--blue); }
.assessment-page :focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.assessment-page .skip-link { position: absolute; top: -100px; left: 20px; z-index: 100; padding: 12px 20px; background: #fff; }
.assessment-page .skip-link:focus { top: 12px; }
.assessment-page #header {
  min-height: 120px;
  padding: 24px max(24px, calc((100% - 1340px) / 2));
  gap: 28px;
  border: 0;
  box-shadow: none;
  flex-wrap: wrap;
}
.assessment-page .logo { width: 230px; max-width: 100%; height: auto; }
.assessment-nav { display: flex; gap: 32px; margin-left: auto; }
.assessment-nav a { font-size: 15px; font-weight: 700; text-transform: uppercase; text-decoration: none; }
.assessment-nav a:hover { text-decoration: underline; text-underline-offset: 8px; }
.assessment-page .language-switcher { margin: 0; padding: 6px; background: var(--pale); border: 0; }
.assessment-page .language-option { min-height: 44px; min-width: 44px; color: var(--blue); }
.assessment-page .language-option.active { background: var(--blue); color: #fff; }
.assessment-page .intro-section { background: #fff; }
.assessment-page .flex-container {
  width: min(1340px, calc(100% - 64px));
  max-width: none;
  margin: 0 auto;
  padding: 64px 0 72px;
  gap: 64px;
  align-items: center;
}
.assessment-page .flex-item-right, .assessment-page .flex-item-left { flex: 1; min-width: 0; padding: 0; }
.assessment-page .flex-item-right h1 { font-size: clamp(40px, 5vw, 60px); margin: 0 0 28px; font-weight: 400; }
.assessment-page .flex-item-right p { font-size: 20px; line-height: 1.55; color: #5c5c63; }
.assessment-page .flex-item-left { padding: 32px; background: url('../images/C-CART assets/Images/Circle_background.png') center / contain no-repeat; }
.assessment-page .featuredimg { border-radius: 20px; }
.assessment-page .begin-button,
.assessment-page #showPreviousButton, .assessment-page #showNextButton,
.assessment-page #submitButton {
  min-height: 48px;
  padding: 13px 24px;
  border: 2px solid var(--blue);
  border-radius: 6px;
  background: var(--blue);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
}
.assessment-page .begin-button { font-weight: 400; }
.assessment-page #showPreviousButton { background: #fff; color: var(--blue); }
.assessment-page button:disabled { opacity: .5; cursor: not-allowed; }
.assessment-page .begin-button:hover, .assessment-page #showNextButton:hover,
.assessment-page #submitButton:hover { background: var(--navy); border-color: var(--navy); }
.assessment-page .video-section-container {
  width: 100%; max-width: none; margin: 0;
  padding: 64px max(32px, calc((100% - 1100px) / 2));
  background: var(--pale);
}
.assessment-page .video-section-title { font-size: clamp(30px, 4vw, 48px); text-align: center; margin: 0 0 32px; }
.assessment-page .video-iframe-wrapper video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; background: #000; }
.assessment-page .app-download {
  max-width: none; margin: 0; padding: 64px max(32px, calc((100% - 1340px) / 2));
  background: #20479f url('../images/C-CART assets/Images/caregivers-download-ccart-background.png') center / cover no-repeat;
  border: 0; border-radius: 0; box-shadow: none; color: #fff;
}
.assessment-page .app-text { flex: 1 1 380px; min-width: 0; }
.assessment-page .app-text h1 { color: #fff; font-size: clamp(32px, 4vw, 48px); }
.assessment-page .app-text h4 { color: #fff; font-size: 18px; letter-spacing: .25px; }
.assessment-page .app-text p { color: #fff; font-size: 20px; }
.assessment-page .app-download .app-buttons { flex: 0 1 760px; width: auto; gap: 0 !important; flex-wrap: nowrap !important; }
.assessment-page .app-download .app-buttons a { display: inline-flex; flex: 1 1 0; min-width: 0; max-width: 100%; }
.assessment-page .app-download .app-buttons img { display: block; width: 100%; height: 145px !important; max-width: 100%; object-fit: contain; }
@media (max-width: 600px) {
  .assessment-page .app-download .app-buttons { flex-wrap: wrap !important; }
  .assessment-page .app-download .app-buttons a { flex: 1 1 220px; }
  .assessment-page .app-download .app-buttons img { height: 85px !important; }
}
.assessment-page #surveyForm {
  width: min(1100px, calc(100% - 48px)); margin: 48px auto 64px;
  padding: clamp(16px, 3vw, 40px); background: var(--pale); border-radius: 20px;
}
.assessment-page fieldset { min-width: 0; background: #fff; border: 1px solid #d8e4ed; border-radius: 13px; padding: clamp(16px, 3vw, 32px); }
.assessment-page legend { max-width: 100%; color: var(--navy); font-size: clamp(24px, 3vw, 32px); font-weight: 400; line-height: 1.25; }
.assessment-page label { color: var(--navy); }
.assessment-page select { max-width: 100%; min-height: 48px; font-size: 18px; border-radius: 8px; }
.assessment-page input { accent-color: var(--blue); }
.assessment-page .input-tile { border: 2px solid #d8e4ed; border-radius: 10px; font-size: 18px; font-weight: 500; }
.assessment-page .input-tile:hover { background: var(--pale); border-color: var(--blue); }
.assessment-page input[type='checkbox']:checked + .input-tile { background: #dcecf9; border-color: var(--blue); color: var(--navy); box-shadow: none; }
/* Keep tile checkboxes reachable with the keyboard while their labels provide the visual control. */
.assessment-page .input-grid input[type='checkbox'] { display: block; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.assessment-page input[type='checkbox']:focus-visible + .input-tile { outline: 3px solid var(--blue); outline-offset: 3px; }
.assessment-page .progress-container { padding: 12px 0 24px; flex-wrap: wrap; gap: 6px; }
.assessment-page .circle-fill { background: var(--blue); }
.assessment-page .circle { background: #fff; border-color: var(--blue); }
.assessment-page .page-number { color: var(--navy); }
.assessment-page .progress-step { min-width: 44px; min-height: 60px; padding: 8px 4px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--navy); cursor: pointer; }
.assessment-page .progress-step:hover { background: #dcecf9; border-color: var(--blue); }
.assessment-page .progress-step[aria-current='step'] { background: #fff; border-color: var(--blue); }
.assessment-page .progress-step[aria-current='step'] .page-number { font-weight: 700; }
.assessment-page #cookieBanner { z-index: 30; background: var(--navy); font-size: 16px; }
.assessment-page #cookieBanner a { color: #fff; text-decoration: underline; }
.assessment-page footer { background: #fff; border-top: 1px solid #d8e4ed; padding: 40px 24px; }
.assessment-footer-logo img { width: 230px; max-width: 100%; height: auto; margin-bottom: 24px; }
.assessment-page .footer-content { max-width: 1000px; margin: auto; gap: 12px; }
.assessment-page .footer-content, .assessment-page .support-info,
.assessment-page .organization-name, .assessment-page .about-us, .assessment-page .terms-info { color: #5c5c63; }
.assessment-page .support-info { font-size: 18px; line-height: 1.55; }
.assessment-footer-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px; margin-top: 24px; font-size: 15px; font-weight: 700; }
@media (max-width: 900px) {
  .assessment-page #header { gap: 20px; }
  .assessment-nav { order: 3; width: 100%; margin: 0; flex-wrap: wrap; gap: 16px 28px; }
  .assessment-page #header .language-switcher { margin-left: auto; }
  .assessment-page .flex-container { flex-direction: column; gap: 24px; }
  .assessment-page .flex-item-left { width: 100%; max-width: 560px; }
}
@media (max-width: 600px) {
  .assessment-page { font-size: 18px; }
  .assessment-page #header { padding: 20px 16px; }
  .assessment-page .logo { width: 175px; }
  .assessment-nav a { font-size: 13px; }
  .assessment-page .flex-container { width: calc(100% - 32px); padding: 36px 0; }
  .assessment-page .flex-item-right p, .assessment-page .app-text p { font-size: 18px; }
  .assessment-page .video-section-container, .assessment-page .app-download { padding: 40px 16px; }
  .assessment-page #surveyForm { width: calc(100% - 24px); margin: 24px auto 40px; padding: 12px; }
  .assessment-page .likert-scale { flex-wrap: wrap; gap: 12px; }
  .assessment-page .progress-container { gap: 0; }
  .assessment-page .circle-wrapper { margin: 0 3px; }
  .assessment-page #showPreviousButton, .assessment-page #showNextButton, .assessment-page #submitButton { margin: 8px 4px; }
}
