/* Identidad visual de la Dra. Andrea Polanía */
:root {
  --andrea-ice: #e0f7fa;
  --andrea-lilac: #d3b0e3;
  --andrea-rose: #e6a3b0;
  --andrea-gold: #ac8231;
  --andrea-ink: #201d1b;
  --andrea-muted: #625d59;
}

body {
  background: linear-gradient(145deg, #fff 0%, #f8eff9 55%, #fdf3f5 100%);
  color: var(--andrea-ink);
  font-family: "Open Sans", Arial, sans-serif;
}

.brand-heading,
h1,
h2,
legend,
#submitButton,
#returnToCost {
  font-family: "Crimson Text", Georgia, serif;
}

header { border-bottom-color: #e4d5ea; }
header > div { border-left-color: var(--andrea-lilac); color: var(--andrea-muted); }
header > div p:first-child,
h1,
legend,
#success h2,
#informationOnly h2,
main > section[aria-label] h2 { color: #6f5274; }

main > section:first-of-type > p:last-child,
fieldset > p,
#success p,
#informationOnly p,
main > section[aria-label] p,
footer { color: var(--andrea-muted); }

#quizCard,
main > section[aria-label] article {
  border-color: #e4d5ea;
  box-shadow: 0 12px 35px rgba(211, 176, 227, .20);
}

#quizCard > div:first-child { border-bottom-color: #f2e8f5; }
#quizCard > div:first-child > div:last-child { background: #f4edf7; }
#progress { background: var(--andrea-rose); }

.choice {
  border-color: #e9dde7;
  color: var(--andrea-ink);
}
.choice:hover { border-color: var(--andrea-rose); }
.choice:has(input:checked) {
  border-color: var(--andrea-rose);
  background: #fdf4f6;
  box-shadow: 0 0 0 3px rgba(230, 163, 176, .22);
}
.dot { border-color: var(--andrea-lilac); }
.choice:has(input:checked) .dot {
  border-color: var(--andrea-rose);
  background: var(--andrea-rose);
}

.valuation-details div { border-bottom-color: #eadff0; }
.valuation-details dd strong { color: var(--andrea-ink); }

input:not(.sr-only):focus {
  border-color: #a57ab0;
  box-shadow: 0 0 0 3px rgba(211, 176, 227, .35);
}

#submitButton,
#returnToCost {
  background: var(--andrea-lilac);
  color: #fff;
  font-family: "Open Sans", Arial, sans-serif;
  letter-spacing: .01em;
}
#submitButton:hover,
#returnToCost:hover { background: #bea0d0; }

#success > div:first-child {
  background: #fbe9ed;
  color: #9e6070;
}
.back { color: #8d5464; }
footer { border-top-color: #eadff0; }