/*
 * Índice: Shell (.frontstage-body, .frontstage-shell*, .frontstage-screen*) .. líneas 18-26
 * Intro y login (.frontstage-intro* y .frontstage-login*) .. líneas 28-43
 * Headers, ruta y datos (.gbc-section-header*, .gbc-route-row*, .gbc-data-card*) .. líneas 44-59
 * Páginas y tarjetas (.frontstage-page/.frontstage-card*) ... líneas 61-80
 * Home (.frontstage-home*) .................................. líneas 82-97
 * Huella (.frontstage-huella-page* y .huella-presentacion*) .. líneas 98-110
 * Quiz (.frontstage-quiz-intro* y .frontstage-quiz*) ........ líneas 110-138
 * Prehome (.frontstage-prehome*)
 * Ranking y filas (.frontstage-ranking* y .frontstage-list-row*) .. líneas 187-209
 * Perfil (.frontstage-profile* y .frontstage-avatar*) ........ líneas 211-232
 * Reto oculto (.frontstage-challenge*) ...................... líneas 234-241
 * Modal de escaneo (.frontstage-scan-modal*) ................ líneas 243-255
 * Responsive tablet y escritorio (@media) .................. líneas 257-292
 */

.frontstage-body {
  background: var(--rep-app-bg);
  color: var(--rep-text-body);
  min-height: 100svh;
  overflow-x: hidden;
}
.frontstage-shell {
  box-sizing: border-box;
  min-height: 100svh;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.frontstage-shell--immersive {
  background: var(--rep-app-bg-immersive);
}
.frontstage-shell--content {
  background: var(--rep-app-bg);
}
.frontstage-shell--home {
  background: var(--rep-gradient-home);
}
.frontstage-shell--prehome {
  background-color: var(--rep-cream-100);
  background-image: url("../../img/bg_repsol_login.png");
  background-position: right bottom;
  background-repeat: no-repeat;
}
.frontstage-screen {
  box-sizing: border-box;
  min-height: 100svh;
  position: relative;
  width: 100%;
  z-index: 1;
}
.frontstage-screen--immersive {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--rep-screen-pad-wide);
}
.frontstage-screen--content {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
  padding: var(--rep-screen-pad-y) var(--rep-screen-pad-x)
    calc(var(--rep-screen-pad-y) + var(--rep-navbottom-height));
}
.frontstage-resource-line {
  height: var(--rep-wayfinding-height);
  pointer-events: none;
  position: absolute;
  top: var(--rep-wayfinding-top);
}

.frontstage-intro {
  align-self: stretch;
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  min-height: 0;
  width: 100%;
}
.frontstage-intro__logo {
  display: block;
  height: auto;
  width: auto;
  max-width: 200px;
}
.frontstage-intro__body,
.frontstage-intro__heading,
.frontstage-intro__actions,
.frontstage-login__form {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
  min-width: 0;
}
.frontstage-intro__heading {
  gap: var(--rep-stack-gap);
}
.frontstage-intro__eyebrow,
.frontstage-login__lead,
.gbc-data-card__eyebrow {
  color: var(--rep-text-eyebrow);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  margin: 0;
  text-transform: uppercase;
}
.frontstage-intro__headline {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-headline);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-headline);
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-intro__copy {
  color: var(--rep-text-on-dark-soft);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  font-weight: var(--rep-font-weight-normal);
  line-height: var(--rep-lh-body);
  margin: 0 0 var(--rep-block-gap) 0;
  width: var(--rep-intro-copy-width);
}
.frontstage-intro__actions {
  gap: var(--rep-stack-gap);
}
.frontstage-intro__actions--centered {
  align-items: center;
}
.frontstage-intro__actions form {
  align-self: stretch;
  margin: 0;
  width: 100%;
}
.frontstage-intro__icon {
  height: var(--rep-onboarding-icon-height);
  width: var(--rep-onboarding-icon-width);
}
.frontstage-login__event {
  color: var(--rep-white);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-meta);
  margin: 0;
}
.frontstage-login__lead {
  text-transform: none;
}
.frontstage-login {
  color: var(--rep-text-body);
  gap: var(--rep-block-gap);
  justify-content: flex-start;
}
.frontstage-login__branding {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-5);
}
.frontstage-login__logo {
  max-width: 92px;
}
.frontstage-login__title {
  align-self: center;
  display: block;
  height: auto;
  max-width: 263px;
  width: 100%;
}
.frontstage-login .frontstage-intro__body {
  gap: var(--rep-block-gap);
}
.frontstage-login__card {
  gap: var(--rep-block-gap);
  width: 100%;
}
.frontstage-login__heading {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-2);
}
.frontstage-login__heading h1 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-login__instruction {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-login__card .frontstage-intro__copy {
  color: var(--rep-text-body);
  width: 100%;
}
.frontstage-login__label {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
}
.frontstage-login__form {
  gap: var(--rep-row-gap);
}
.frontstage-login__form .gbc-button {
  margin-top: var(--rep-stack-gap);
}
.frontstage-login__recovery-link {
  align-self: center;
  color: var(--rep-text-heading);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  text-decoration: underline;
}

.gbc-section-header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--rep-component-gap);
  width: 100%;
}
.gbc-section-header__logo {
  height: auto;
  max-width: var(--rep-logo-width);
  width: 100%;
}
.gbc-section-header__eyebrow,
.gbc-data-card__eyebrow {
  margin: 0;
}
.gbc-section-header__eyebrow--cyan {
  color: var(--rep-text-eyebrow);
}
.gbc-section-header__eyebrow--muted {
  color: var(--rep-text-muted);
}
.gbc-section-header__title,
.gbc-data-card__value {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
  overflow-wrap: anywhere;
}
.gbc-route-row {
  align-items: center;
  display: flex;
  gap: var(--rep-dot-gap);
  min-width: 0;
  width: 100%;
}
.gbc-route-row__dot {
  border-radius: var(--rep-radius-button);
  flex: 0 0 var(--rep-component-gap);
  height: var(--rep-component-gap);
}
.gbc-route-row__dot--completed {
  background: var(--station-color, var(--rep-dot-completed-fallback));
}
.gbc-route-row__dot--current {
  background: var(--rep-dot-current);
}
.gbc-route-row__dot--pending {
  background: var(--rep-dot-pending);
}
.gbc-route-row__left,
.gbc-route-row__right,
.gbc-data-card__foot {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  font-weight: var(--rep-font-weight-normal);
  line-height: var(--rep-lh-body);
}
.gbc-route-row__left {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.gbc-route-row__right--current {
  color: var(--rep-dot-current);
  font-weight: var(--rep-font-weight-semibold);
}
.gbc-data-card {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
  justify-content: center;
}
.gbc-data-card__foot {
  color: var(--rep-text-muted);
  margin: 0;
}

.frontstage-page {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
  min-width: 0;
  padding-top: 0;
  width: 100%;
}
.frontstage-page-heading {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
  margin-bottom: 0;
  width: 100%;
}
.frontstage-page-heading > div {
  min-width: 0;
  width: 100%;
}
.frontstage-page h1,
.frontstage-page h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-weight: var(--rep-font-weight-medium);
  overflow-wrap: anywhere;
}
.frontstage-page h1 {
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-page h2 {
  font-size: var(--rep-type-section);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-eyebrow,
.frontstage-card__label {
  color: var(--rep-text-eyebrow);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  margin: 0;
  text-transform: uppercase;
}
.frontstage-card {
  background: var(--rep-surface-card);
  border: none;
  border-radius: var(--rep-radius-card);
  box-shadow: var(--rep-hairline);
  min-width: 0;
  padding: var(--rep-space-5);
}
.frontstage-stat {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-actions {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
}
.frontstage-route,
.frontstage-history {
  display: grid;
  gap: var(--rep-row-gap);
  min-width: 0;
}
.frontstage-route__item,
.frontstage-history__item {
  border-radius: var(--rep-radius-row);
  box-shadow: var(--rep-hairline);
  min-width: 0;
  overflow-wrap: anywhere;
  padding: var(--rep-space-3) var(--rep-space-5);
}
.frontstage-route__item.is-current {
  box-shadow: var(--rep-hairline-selected);
}
.frontstage-card .table {
  margin-bottom: 0;
}
.frontstage-screen--immersive .frontstage-page h1,
.frontstage-screen--immersive .frontstage-page h2 {
  color: var(--rep-text-on-dark);
}
.quiz-timer {
  background: var(--rep-badge-warning-bg);
  border-radius: var(--rep-radius-button);
  color: var(--rep-badge-warning-text);
  font-variant-numeric: tabular-nums;
  font-weight: var(--rep-font-weight-semibold);
  padding: var(--rep-space-2) var(--rep-space-3);
}
.quiz-timer.is-expired {
  background: var(--rep-badge-info-bg);
  color: var(--rep-badge-info-text);
}
.huella-presentacion {
  background: var(--rep-surface-card);
  border-radius: var(--rep-radius-card);
  display: grid;
  min-height: 70svh;
  padding: var(--rep-space-6);
  place-content: center;
  text-align: center;
}
.huella-presentacion__value {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-headline);
  font-weight: var(--rep-font-weight-medium);
}
.huella-presentacion__disclaimer {
  color: var(--rep-text-muted);
  margin: var(--rep-space-5) auto 0;
}

.frontstage-shell--home .gbc-section-header__title,
.frontstage-shell--home .frontstage-home__event,
.frontstage-shell--home .frontstage-home__route-heading,
.frontstage-shell--home .frontstage-home__route-heading h2 {
  color: var(--rep-text-on-dark);
}
.frontstage-premios-page {
  gap: var(--rep-stack-gap);
}
.frontstage-premios__intro {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-premios__categories {
  display: grid;
  gap: var(--rep-block-gap);
}
.frontstage-premios__category {
  gap: var(--rep-block-gap);
}
.frontstage-premios__category-heading {
  align-items: center;
  display: flex;
  gap: var(--rep-stack-gap);
  justify-content: space-between;
  width: 100%;
}
.frontstage-premios__category-heading h2 {
  color: var(--rep-text-heading);
  flex: 1;
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-premios__category-heading img {
  flex: 0 0 var(--rep-onboarding-icon-width);
  height: var(--rep-onboarding-icon-height);
  object-fit: contain;
  width: var(--rep-onboarding-icon-width);
}
.frontstage-premios__projects,
.frontstage-premios__project-main {
  align-items: start;
  display: grid;
  gap: var(--rep-block-gap);
  min-width: 0;
  width: 100%;
}
.frontstage-premios__project {
  gap: 0;
  padding: 0;
}
.frontstage-premios__project--voted {
  box-shadow: var(--rep-hairline-selected);
}
.frontstage-premios__project-main {
  grid-template-columns: minmax(0, 5rem) minmax(0, 1fr);
  padding: var(--rep-space-5);
}
.frontstage-premios__image {
  align-items: center;
  aspect-ratio: 1;
  background: var(--rep-grey-300);
  border-radius: var(--rep-radius-row);
  color: var(--rep-text-muted);
  display: flex;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-meta);
  justify-content: center;
  overflow: hidden;
  text-align: center;
}
.frontstage-premios__image img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}
.frontstage-premios__project-copy {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
  min-width: 0;
}
.frontstage-premios__project h3,
.frontstage-premios__project p {
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-premios__project h3 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  line-height: var(--rep-lh-section);
}
.frontstage-premios__project p,
.frontstage-premios__empty {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
}
.frontstage-premios__empty {
  margin: 0;
}
.frontstage-premios__actions {
  border-top: 1px solid var(--rep-border-subtle);
  display: flex;
  gap: var(--rep-row-gap);
  padding: var(--rep-space-5);
  width: 100%;
}
.frontstage-premios__actions .gbc-button {
  flex: 1 1 0;
  height: calc(var(--rep-button-height) - var(--rep-space-2));
  min-width: 0;
  padding: var(--rep-space-2) var(--rep-space-3);
  width: auto;
}
.frontstage-premios__link {
  background: transparent;
  border: 1px solid var(--rep-magenta-500);
  color: var(--rep-magenta-500);
  text-decoration: none;
}
.frontstage-premios__vote--current {
  background: var(--rep-grey-300);
  color: var(--rep-blue-900);
}
.frontstage-premios__vote.gbc-button--disabled {
  cursor: not-allowed;
  opacity: var(--rep-opacity-disabled);
}
.frontstage-home__event,
.frontstage-home__foot,
.frontstage-home__next {
  color: var(--rep-text-muted);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-home__current {
  align-items: stretch;
  gap: var(--rep-row-gap);
}
.frontstage-home__current h2 {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-home__current-station,
.frontstage-home__current-stand {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-2);
}
.frontstage-home__current-stand {
  border-bottom: 1px solid var(--rep-text-on-dark-soft);
  border-top: 1px solid var(--rep-text-on-dark-soft);
  padding: var(--rep-space-3) 0;
}
.frontstage-home__stand-list {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
  padding-left: var(--rep-space-5);
}
.frontstage-home__stand-list li {
  padding-left: var(--rep-space-2);
}
.frontstage-home__current .gbc-button--claro {
  width: 100%;
}
.frontstage-home__directions-link {
  align-self: flex-start;
  background: transparent;
  border: 0;
  color: var(--rep-cyan-400);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  padding: 0;
  text-align: left;
}
.frontstage-home__current-meta {
  align-items: center;
  display: flex;
  gap: var(--rep-dot-gap);
}
.frontstage-home__current-meta p,
.frontstage-home__current .frontstage-home__next {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-home__data {
  display: grid;
  gap: var(--rep-stack-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.frontstage-home__data .gbc-card {
  gap: var(--rep-row-gap);
  padding: var(--rep-block-gap);
}
.frontstage-home__team {
  box-shadow: var(--rep-hairline-black);
}
.frontstage-home__data h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-home__route {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
}
.frontstage-home__route-heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.frontstage-home__route-heading h2 {
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-home__route-heading p {
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-home__route-list {
  display: grid;
  gap: var(--rep-row-gap);
}
.frontstage-home__route-row {
  padding: var(--rep-row-gap) var(--rep-space-5);
}
.frontstage-home__live {
  display: contents;
}
.frontstage-home__pre-event {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
}
.frontstage-home__pre-event-image {
  align-self: stretch;
  height: auto;
  object-fit: contain;
  width: 100%;
}
.frontstage-home__event-cards {
  display: grid;
  gap: var(--rep-stack-gap);
  grid-template-columns: minmax(0, 1fr);
}
.frontstage-home__event-card-slot {
  min-width: 0;
}
.frontstage-home__event-cards .gbc-card,
.frontstage-home__carbon-link-card,
.frontstage-home__finalist-card {
  gap: var(--rep-row-gap);
}
.frontstage-home__event-cards .gbc-card {
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  min-height: 6.875rem;
  padding: var(--rep-space-5);
}
.frontstage-home__event-card-content {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
  min-width: 0;
}
.frontstage-home__carbon-link-card,
.frontstage-home__carbon-calculator-heading {
  align-items: center;
  display: flex;
  gap: var(--rep-block-gap);
  justify-content: space-between;
}
.frontstage-home__event-card-icon {
  flex: 0 0 auto;
  height: 5rem;
  object-fit: contain;
  width: 5rem;
}
.frontstage-home__carbon-link-card > img,
.frontstage-home__carbon-calculator-heading img {
  height: var(--rep-onboarding-icon-height);
  object-fit: contain;
  width: var(--rep-onboarding-icon-width);
}
.frontstage-home__carbon-link-card h2,
.frontstage-home__finalists h2,
.frontstage-home__carbon-calculator h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-home__event-card-value {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-section);
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-home__carbon-link-card a,
.frontstage-home__carbon-calculator a {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-home__event-card-link {
  color: var(--rep-text-eyebrow);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  line-height: var(--rep-lh-body);
  text-decoration: none;
}
.frontstage-home__carbon-link-card a,
.frontstage-home__carbon-calculator a {
  color: var(--rep-text-eyebrow);
}
.frontstage-home__finalists,
.frontstage-home__carbon-calculator,
.frontstage-home__puestos {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
}
.frontstage-home__finalists-list {
  display: grid;
  gap: var(--rep-row-gap);
}
.frontstage-home__finalist-card {
  align-items: center;
  color: var(--rep-text-heading);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  text-decoration: none;
}
.frontstage-home__finalist-card img {
  height: var(--rep-onboarding-icon-height);
  object-fit: contain;
  width: var(--rep-onboarding-icon-width);
}
.frontstage-home__carbon-link-card {
  align-items: stretch;
  background: var(--rep-surface-card-invert);
  color: var(--rep-text-on-dark);
  flex-direction: column;
  gap: var(--rep-row-gap);
  padding: var(--rep-space-6);
}
.frontstage-home__carbon-link-card h2 {
  color: var(--rep-text-on-dark);
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
}
.frontstage-home__carbon-link-card-description {
  color: var(--rep-text-on-dark-soft);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-home__carbon-link-card .gbc-button {
  margin-top: var(--rep-space-2);
  width: 100%;
}
.frontstage-home__carbon-link-card .gbc-button--claro {
  color: var(--rep-btn-claro-text);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-button-primary);
}
.frontstage-home__finalists {
  gap: var(--rep-space-3);
}
.frontstage-home__finalists-list {
  background: var(--rep-surface-cta-bg);
  border-radius: var(--rep-radius-card);
  padding: var(--rep-space-5);
}
.frontstage-home__finalist-card {
  background: var(--rep-surface-card);
  display: flex;
  flex-direction: row;
  gap: var(--rep-space-3);
  justify-content: space-between;
  min-height: 4.75rem;
  padding: var(--rep-space-3) var(--rep-space-5);
}
.frontstage-home__finalist-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: var(--rep-space-1);
  justify-content: center;
  min-width: 0;
}
.frontstage-home__finalist-name {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-section);
  overflow-wrap: anywhere;
}
.frontstage-home__finalist-link {
  color: var(--rep-magenta-500);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
}
.frontstage-home__finalist-card img {
  flex: 0 0 4rem;
  height: 4rem;
  width: 4rem;
}
.frontstage-home__team--full {
  grid-column: 1 / -1;
}
.frontstage-home__points {
  grid-column: 1 / -1;
}
.frontstage-home__carbon-stats {
  display: grid;
  gap: var(--rep-row-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.frontstage-home__carbon-stats div {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-1);
  min-width: 0;
}
.frontstage-home__carbon-stats span {
  color: var(--rep-text-muted);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
}
.frontstage-home__carbon-stats strong {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  overflow-wrap: anywhere;
}
.frontstage-home__carbon-calculator {
  background: var(--rep-surface-cta-bg);
  box-shadow: none;
  gap: var(--rep-stack-gap);
  width: 100%;
}
.frontstage-home__carbon-calculator-heading {
  align-items: flex-start;
  border-bottom: 1px solid var(--rep-border-subtle);
  padding-bottom: var(--rep-space-3);
  width: 100%;
}
.frontstage-home__carbon-calculator-heading h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  text-transform: uppercase;
}
.frontstage-home__carbon-calculator-heading img {
  flex: 0 0 auto;
  height: 3.5rem;
  width: 3.5rem;
}
.frontstage-home__carbon-stats {
  border-bottom: 1px solid var(--rep-border-subtle);
  gap: var(--rep-space-3);
  padding-bottom: var(--rep-space-4);
  width: 100%;
}
.frontstage-home__carbon-stats div {
  align-items: flex-start;
  gap: 0;
}
.frontstage-home__carbon-stat-label {
  align-items: center;
  background: var(--rep-white);
  border-radius: var(--rep-radius-row);
  color: var(--rep-text-muted);
  display: inline-flex;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-meta);
  font-weight: var(--rep-font-weight-normal);
  line-height: var(--rep-lh-meta);
  padding: var(--rep-space-1) var(--rep-space-2);
  white-space: nowrap;
}
.frontstage-home__carbon-stats strong {
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
  margin-top: var(--rep-space-2);
}
.frontstage-home__carbon-stats small {
  color: var(--rep-text-muted);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-meta);
  line-height: var(--rep-lh-meta);
}
.frontstage-home__carbon-calculator > a {
  color: var(--rep-magenta-500);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  width: 100%;
}
.frontstage-home__puestos {
  border-top: 1px solid var(--rep-border-subtle);
  padding-top: var(--rep-row-gap);
}
.frontstage-home__puestos h3 {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  margin: 0;
}
.frontstage-home__puestos ol {
  color: var(--rep-text-on-dark);
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-2);
  margin: 0;
  padding-left: var(--rep-space-5);
}
.frontstage-home__puestos p {
  color: var(--rep-text-on-dark-soft);
  margin: var(--rep-space-1) 0 0;
}
.frontstage-directions-modal .modal-content {
  border: 0;
  border-radius: var(--rep-radius-card);
}
.frontstage-directions-modal .modal-header {
  border-color: var(--rep-border-subtle);
}
.frontstage-directions-modal .modal-title {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
}
.frontstage-directions-modal .modal-body {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
}
.frontstage-directions-modal__image {
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: cover;
  width: 100%;
}
.frontstage-directions-modal ol {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
  margin: 0;
  padding-left: var(--rep-space-5);
}
.frontstage-huella-page__intro {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  font-weight: var(--rep-font-weight-normal);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-huella-page #huellaWelcome,
.frontstage-huella-page #huellaWelcomeForm {
  width: 100%;
}
.frontstage-huella-page #huellaWelcomeForm {
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
}
.frontstage-huella-page__fields {
  gap: var(--rep-row-gap);
}
.frontstage-huella-page__label {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
}
.frontstage-huella-page__route {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
}
.frontstage-huella-page__route h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-huella-page__suggestion {
  align-items: flex-start;
  background: var(--rep-cream-100);
  border-radius: var(--rep-radius-row);
  box-shadow: none;
  flex-direction: row;
  gap: var(--rep-dot-gap);
  padding: var(--rep-row-gap) var(--rep-space-5);
}
.frontstage-huella-page__suggestion-dot {
  background: var(--rep-text-eyebrow);
  border-radius: var(--rep-radius-button);
  flex: 0 0 var(--rep-progress-dot-size);
  height: var(--rep-progress-dot-size);
  margin-top: var(--rep-space-1);
}
.frontstage-huella-page__suggestion p {
  color: var(--rep-text-muted);
  flex: 1;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-huella-page__disclaimer {
  color: var(--rep-text-muted);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-meta);
  line-height: var(--rep-lh-meta);
}

.frontstage-quiz-intro,
.frontstage-quiz {
  align-self: stretch;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: var(--rep-block-gap);
  min-width: 0;
  width: 100%;
}
.frontstage-quiz-intro {
  justify-content: space-between;
}
.frontstage-quiz-intro__top,
.frontstage-quiz__top {
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
}
.frontstage-quiz-intro__top img,
.frontstage-quiz__top img {
  height: auto;
  width: var(--rep-logo-width);
}
.frontstage-quiz-intro__top div,
.frontstage-quiz__heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
  min-width: 0;
}
.frontstage-quiz-intro__close,
.frontstage-quiz__close {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  text-decoration: none;
}
.frontstage-quiz-intro__body {
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
  min-width: 0;
  width: 100%;
}
.frontstage-quiz-intro__body .frontstage-intro__copy {
  width: 100%;
}
.frontstage-quiz-intro__image {
  aspect-ratio: 161 / 173;
  border-radius: var(--rep-radius-card);
  overflow: hidden;
  position: relative;
  width: 100%;
}
.frontstage-quiz-intro__image::after {
  background: var(--rep-gradient-image-scrim);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}
.frontstage-quiz-intro__image img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}
.frontstage-quiz__module,
.frontstage-quiz__station {
  align-items: center;
  color: var(--rep-text-muted);
  display: flex;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
  gap: var(--rep-dot-gap);
  line-height: var(--rep-lh-eyebrow);
  margin: 0;
}
.frontstage-quiz__station-dot {
  background: var(--station-color, var(--rep-dot-completed-fallback));
}
.frontstage-quiz__heading h1 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-quiz__close,
.frontstage-quiz__station {
  color: var(--rep-orange-500);
}
.frontstage-quiz__progress {
  background: var(--rep-progress-track);
  border-radius: var(--rep-radius-track);
  height: var(--rep-quiz-progress-height);
  overflow: hidden;
}
.frontstage-quiz__progress span {
  background: var(--rep-progress-fill);
  border-radius: inherit;
  display: block;
  height: 100%;
  transition: width var(--rep-duration) var(--rep-ease);
  width: 35%;
}
.frontstage-quiz__question {
  min-width: 0;
}
.frontstage-quiz__question form {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
}
.frontstage-quiz__question-title {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-quiz #quiz-container {
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
  min-width: 0;
}
.frontstage-quiz__options {
  display: grid;
  gap: var(--rep-row-gap);
}
.frontstage-quiz__option {
  position: relative;
}
.frontstage-quiz__option-input {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}
.frontstage-quiz__option:focus-within {
  box-shadow: inset 0 0 0 1px var(--rep-orange-500);
}
.frontstage-quiz__result-badge {
  border-radius: var(--rep-radius-pill);
  display: inline-flex;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  margin: 0;
  padding: var(--rep-space-2) var(--rep-space-4);
  width: fit-content;
}
.frontstage-quiz__result-badge--correct {
  background: var(--rep-badge-success-bg);
  color: var(--rep-badge-success-text);
}
.frontstage-quiz__result-badge--incorrect {
  background: var(--rep-color-danger);
  color: var(--rep-white);
}
.frontstage-quiz__explanation {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-quiz__cta {
  align-items: center;
  border: none;
  border-radius: var(--rep-radius-button);
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  height: var(--rep-button-height);
  justify-content: center;
  line-height: var(--rep-lh-eyebrow);
  padding: var(--rep-space-4);
  text-decoration: none;
  transition: background var(--rep-duration) var(--rep-ease),
    color var(--rep-duration) var(--rep-ease);
  width: 100%;
}
.frontstage-quiz__cta--light {
  background: var(--rep-white);
  color: var(--rep-orange-500);
}
.frontstage-quiz__cta--filled {
  background: var(--rep-orange-500);
  color: var(--rep-white);
}
.frontstage-quiz__cta:disabled {
  cursor: not-allowed;
  opacity: var(--rep-opacity-disabled);
}
.frontstage-quiz__cta:focus-visible {
  box-shadow: inset 0 0 0 1px var(--rep-orange-500);
}

.frontstage-prehome {
  color: var(--rep-text-body);
  gap: var(--rep-block-gap);
  justify-content: flex-start;
}
.frontstage-prehome__branding {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-5);
}
.frontstage-prehome__logo {
  max-width: 92px;
}
.frontstage-prehome__title {
  align-self: center;
  display: block;
  height: auto;
  max-width: 263px;
  width: 100%;
}
.frontstage-prehome .frontstage-intro__body {
  gap: var(--rep-block-gap);
}
.frontstage-prehome__cards {
  display: grid;
  gap: var(--rep-stack-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
}
.frontstage-prehome__card-slot--carbon {
  grid-column: 1 / -1;
}
.frontstage-prehome__card-slot {
  padding: 0;
}
.frontstage-prehome__card-slot > .gbc-card {
  align-items: stretch;
  width: 100%;
}
.frontstage-prehome__card-content {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-3);
  width: 100%;
}
.frontstage-prehome__card-heading {
  align-items: center;
  align-self: flex-start;
  background: var(--rep-grey-050);
  border-radius: var(--rep-radius-row);
  display: inline-flex;
  gap: var(--rep-space-2);
  padding: var(--rep-space-1) var(--rep-space-2);
}
.frontstage-prehome__card-heading img {
  height: 18px;
  object-fit: contain;
  width: 18px;
}
.frontstage-prehome__card-heading h2 {
  color: var(--rep-text-muted);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-meta);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-meta);
  margin: 0;
  text-transform: uppercase;
}
.frontstage-prehome__card-content > p {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-section);
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-prehome__card-slot--carbon > .gbc-card {
  background: var(--rep-surface-cta-bg);
  box-shadow: none;
}
.frontstage-prehome__carbon-content {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-3);
  width: 100%;
}
.frontstage-prehome__carbon-heading {
  align-items: flex-start;
  display: flex;
  gap: var(--rep-space-3);
  justify-content: space-between;
  width: 100%;
}
.frontstage-prehome__carbon-heading h2 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-prehome__carbon-heading img {
  flex: 0 0 auto;
  height: 23px;
  object-fit: contain;
  width: 33px;
}
.frontstage-prehome__carbon-content p {
  color: var(--rep-text-body);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-prehome__actions {
  gap: var(--rep-row-gap);
  margin-top: auto;
}
.frontstage-prehome--empty .frontstage-intro__headline {
  color: var(--rep-text-heading);
}
.frontstage-prehome--empty .frontstage-intro__copy {
  color: var(--rep-text-muted);
  width: 100%;
}

@media (max-width: 47.99rem) {
  .frontstage-prehome__branding {
    margin-bottom: calc(var(--rep-block-gap) * -1);
  }
}

.frontstage-ranking__lists {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
  min-width: 0;
}
.frontstage-ranking__list-section,
.frontstage-ranking__list,
.frontstage-ranking__own {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
  min-width: 0;
}
.frontstage-ranking__section-title {
  margin-bottom: var(--rep-space-2) !important;
}
.frontstage-ranking__podium {
  padding: var(--rep-space-5);
}
.frontstage-ranking__podium-columns {
  align-items: end;
  display: grid;
  gap: var(--rep-space-2);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: var(--rep-podium-height);
  width: 100%;
}
.frontstage-ranking__podium-entry {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-1);
  min-width: 0;
}
.frontstage-ranking__podium-avatar {
  flex: 0 0 var(--rep-podium-avatar-size);
  height: var(--rep-podium-avatar-size);
  width: var(--rep-podium-avatar-size);
}
.frontstage-ranking__podium-name,
.frontstage-ranking__podium-points {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: center;
}
.frontstage-ranking__podium-name {
  color: var(--rep-text-heading);
  font-size: var(--rep-type-meta);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-meta);
}
.frontstage-ranking__podium-points {
  color: var(--rep-text-muted);
  font-size: var(--rep-type-meta);
  line-height: var(--rep-lh-meta);
}
.frontstage-ranking__podium-bar {
  align-items: flex-start;
  border-radius: var(--rep-radius-podium);
  box-sizing: border-box;
  color: var(--rep-text-heading);
  display: flex;
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  justify-content: center;
  padding-top: var(--rep-space-2);
  width: 100%;
}
.frontstage-ranking__podium-bar--1 {
  background: var(--rep-amber-500);
  height: calc(var(--rep-space-8) * 4);
}
.frontstage-ranking__podium-bar--2 {
  background: var(--rep-grey-300);
  height: calc(var(--rep-space-8) * 3);
}
.frontstage-ranking__podium-bar--3 {
  background: var(--rep-orange-500);
  height: calc(var(--rep-field-option-height) + var(--rep-space-3));
}
.frontstage-ranking__own {
  gap: var(--rep-row-gap);
}
.frontstage-list-row {
  align-items: center;
  display: grid;
  gap: var(--rep-block-gap);
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: var(--rep-list-row-min-height);
  padding: var(--rep-space-3) var(--rep-space-5);
}
.frontstage-list-row--highlighted {
  background: var(--rep-surface-card-highlighted);
}
.frontstage-list-row__position,
.frontstage-list-row__points {
  color: var(--rep-text-heading);
  font-weight: var(--rep-font-weight-semibold);
}
.frontstage-list-row__position {
  min-width: var(--rep-space-6);
  text-align: center;
}
.frontstage-list-row__details {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-1);
  min-width: 0;
}
.frontstage-list-row__name,
.frontstage-list-row__secondary {
  overflow-wrap: anywhere;
}
.frontstage-list-row__name {
  color: var(--rep-text-heading);
  font-weight: var(--rep-font-weight-semibold);
}
.frontstage-list-row__secondary {
  color: var(--rep-text-muted);
  font-size: var(--rep-type-meta);
  line-height: var(--rep-lh-meta);
}

.frontstage-profile__identity {
  align-items: center;
  display: flex;
  gap: var(--rep-block-gap);
  min-width: 0;
}
.frontstage-avatar {
  align-items: center;
  background: var(--rep-blue-900);
  border-radius: var(--rep-radius-button);
  color: var(--rep-text-on-dark);
  display: flex;
  flex: 0 0 var(--rep-profile-avatar-size);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-section);
  font-weight: var(--rep-font-weight-semibold);
  height: var(--rep-profile-avatar-size);
  justify-content: center;
  width: var(--rep-profile-avatar-size);
}
.frontstage-profile__identity-copy {
  display: flex;
  flex-direction: column;
  gap: var(--rep-space-1);
  min-width: 0;
}
.frontstage-profile__name,
.frontstage-profile__team,
.frontstage-profile__email {
  margin: 0;
  overflow-wrap: anywhere;
}
.frontstage-profile__name {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  line-height: var(--rep-lh-title);
}
.frontstage-profile__team,
.frontstage-profile__email {
  color: var(--rep-text-muted);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
}
.frontstage-profile__footprint {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex-direction: row;
  gap: var(--rep-block-gap);
  justify-content: space-between;
  min-height: calc(var(--rep-ring-size) + var(--rep-space-6));
  width: 100%;
}
.frontstage-profile__footprint-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: var(--rep-row-gap);
  min-width: 0;
}
.frontstage-profile__footprint-link {
  color: var(--rep-text-eyebrow);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
}
.frontstage-profile__ring {
  align-items: center;
  display: flex;
  flex: 0 0 var(--rep-ring-size);
  height: var(--rep-ring-size);
  justify-content: center;
  position: relative;
  width: var(--rep-ring-size);
}
.frontstage-profile__ring-percentage {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  position: absolute;
  z-index: 1;
}
.frontstage-profile__ring-svg {
  display: block;
  height: 100%;
  transform: rotate(-90deg);
  width: 100%;
}
.frontstage-profile__ring-track,
.frontstage-profile__ring-progress {
  fill: none;
  stroke-width: 6;
}
.frontstage-profile__ring-track {
  stroke: var(--rep-border-subtle);
}
.frontstage-profile__ring-progress {
  stroke: var(--rep-text-eyebrow);
  stroke-dasharray: 0 100;
  stroke-linecap: round;
}
.frontstage-profile__progress-section {
  display: flex;
  flex-direction: column;
  gap: var(--rep-row-gap);
}
.frontstage-profile__progress {
  display: flex;
  flex-direction: column;
  gap: var(--rep-block-gap);
}
.frontstage-profile__progress-summary {
  align-items: baseline;
  display: flex;
  gap: var(--rep-row-gap);
  justify-content: space-between;
}
.frontstage-profile__progress-summary span:first-child {
  color: var(--rep-text-heading);
  font-weight: var(--rep-font-weight-semibold);
}
.frontstage-profile__progress-summary span:last-child {
  color: var(--rep-text-muted);
}
.frontstage-profile__progress-dots {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rep-space-2);
}
.frontstage-profile__progress-dot {
  background: var(--rep-dot-pending);
  border-radius: var(--rep-radius-button);
  flex: 0 0 var(--rep-progress-dot-size);
  height: var(--rep-progress-dot-size);
  width: var(--rep-progress-dot-size);
}
.frontstage-profile__progress-dot.is-completed {
  background: var(--rep-dot-completed-fallback);
}

.frontstage-challenge__heading {
  display: flex;
  flex-direction: column;
  gap: var(--rep-stack-gap);
}
.frontstage-challenge__heading h1 {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-challenge__back {
  text-decoration: none;
}
.frontstage-challenge__result {
  align-items: center;
  text-align: center;
  width: 100%;
}
.frontstage-challenge__icon {
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-headline);
  line-height: 1;
  margin: 0;
}
.frontstage-challenge__result h2 {
  font-size: var(--rep-type-section);
  line-height: var(--rep-lh-section);
  margin: 0;
}
.frontstage-challenge__message,
.frontstage-challenge__points {
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-challenge__points {
  color: var(--rep-text-heading);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
}

.frontstage-scan-modal {
  inset: 0;
  overflow: hidden;
  padding: 0;
  z-index: 1055;
}
.frontstage-scan-modal .modal-dialog {
  height: 100%;
  margin: 0;
  width: 100%;
}
.frontstage-scan-modal .modal-content {
  background: var(--rep-blue-900);
  border: 0;
  border-radius: 0;
  color: var(--rep-text-on-dark);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.frontstage-scan-modal__header,
.frontstage-scan-modal__footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: var(--rep-screen-pad-x);
}
.frontstage-scan-modal__header {
  padding-top: var(--rep-screen-pad-y);
}
.frontstage-scan-modal__header h2 {
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-display);
  font-size: var(--rep-type-title);
  font-weight: var(--rep-font-weight-medium);
  line-height: var(--rep-lh-title);
  margin: 0;
}
.frontstage-scan-modal__close {
  background: none;
  border: 0;
  color: var(--rep-text-on-dark);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-eyebrow);
  font-weight: var(--rep-font-weight-semibold);
  line-height: var(--rep-lh-eyebrow);
  padding: 0;
}
.frontstage-scan-modal__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: var(--rep-stack-gap);
  justify-content: center;
  min-height: 0;
  padding: var(--rep-screen-pad-x);
}
.frontstage-scan-modal__camera {
  background: var(--rep-black);
  border-radius: var(--rep-radius-card);
  overflow: hidden;
  width: 100%;
}
.frontstage-scan-modal__camera video {
  aspect-ratio: 4 / 3;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}
.frontstage-scan-modal__status {
  color: var(--rep-text-on-dark-soft);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-body);
  line-height: var(--rep-lh-body);
  margin: 0;
}
.frontstage-scan-modal__footer {
  justify-content: stretch;
  padding-bottom: var(--rep-screen-pad-y);
}
.frontstage-scan-modal__footer button {
  background: var(--rep-btn-claro-bg);
  border: 0;
  border-radius: var(--rep-radius-button);
  color: var(--rep-btn-claro-text);
  font-family: var(--rep-font-text);
  font-size: var(--rep-type-label);
  font-weight: var(--rep-font-weight-semibold);
  height: var(--rep-button-height);
  width: 100%;
}

@media (min-width: 48rem) {
  .frontstage-resource-line {
    top: 60vh;
    height: auto;
    inset-inline-start: 0;
    width: 100%;
  }
  .frontstage-home__pre-event-image {
    max-height: 12rem;
  }
  .frontstage-screen--immersive {
    padding: clamp(3rem, 7vw, 4.5rem) clamp(2.5rem, 8vw, 6rem);
  }
  .frontstage-screen--content {
    padding: clamp(3rem, 6vw, 4rem) clamp(2rem, 6vw, 4rem)
      calc(clamp(3rem, 6vw, 4rem) + var(--rep-navbottom-height));
  }
  .frontstage-intro,
  .frontstage-quiz-intro,
  .frontstage-quiz {
    align-self: center;
    width: min(100%, 45rem);
  }
  .frontstage-intro__copy {
    width: min(100%, 36rem);
  }
  .frontstage-page {
    align-self: center;
    width: min(100%, 70rem);
  }
  .frontstage-premios__projects {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .frontstage-ranking__lists {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .frontstage-home {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .frontstage-home--pre-event {
    grid-template-areas: "header header" "event event" "error error" "pre pre";
  }
  .frontstage-home:not(.frontstage-home--pre-event) {
    grid-template-areas: "header header" "event event" "error error" "current data" "carbon carbon" "route route" "expert expert";
  }
  .frontstage-home > .gbc-section-header {
    grid-area: header;
  }
  .frontstage-home > .frontstage-home__event {
    grid-area: event;
  }
  .frontstage-home > #home-error {
    grid-area: error;
  }
  .frontstage-home > #home-pre-event {
    grid-area: pre;
  }
  .frontstage-home > #home-live > .frontstage-home__current {
    grid-area: current;
  }
  .frontstage-home > #home-live > .frontstage-home__data {
    grid-area: data;
  }
  .frontstage-home > #home-live > .frontstage-home__carbon-calculator {
    grid-area: carbon;
  }
  .frontstage-home > #home-live > .frontstage-home__route {
    grid-area: route;
  }
  .frontstage-home > #home-live > .frontstage-home__expert {
    grid-area: expert;
  }
  .frontstage-huella-page {
    display: grid;
    grid-template-areas: "heading heading" "intro intro" "form form";
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  }
  .frontstage-huella-page > .gbc-section-header {
    grid-area: heading;
  }
  .frontstage-huella-page > .frontstage-huella-page__intro {
    grid-area: intro;
  }
  .frontstage-huella-page > #huellaWelcome {
    grid-area: form;
  }
}

@media (min-width: 75rem) {
  .frontstage-body--content {
    padding-left: 18%;
  }
  .frontstage-screen--immersive {
    padding: clamp(4.5rem, 8vw, 7.5rem) clamp(4rem, 10vw, 9rem);
  }
  .frontstage-screen--content {
    padding-bottom: clamp(3rem, 6vw, 5rem);
  }
  .frontstage-intro,
  .frontstage-quiz-intro,
  .frontstage-quiz {
    width: min(100%, 50rem);
  }
  .frontstage-intro__headline {
    font-size: clamp(var(--rep-type-headline), 3.2vw, 3.25rem);
  }
  .frontstage-quiz-intro__body {
    width: 100%;
  }
  .frontstage-quiz__heading h1 {
    font-size: clamp(var(--rep-type-title), 2.4vw, 2.5rem);
  }
  .frontstage-page {
    width: min(100%, 70rem);
  }
  .frontstage-home:not(.frontstage-home--pre-event) {
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.85fr);
  }
  .frontstage-ranking__lists {
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.85fr);
  }
  .frontstage-huella-page {
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.85fr);
  }
  .gbc-nav-bottom {
    align-items: stretch;
    bottom: 0;
    flex-direction: column;
    height: 100svh;
    justify-content: flex-start;
    left: 0;
    padding: var(--rep-space-8) var(--rep-space-6);
    position: fixed;
    top: 0;
    transform: none;
    width: 18%;
  }
  .gbc-nav-bottom__item {
    flex-direction: row;
    gap: var(--rep-space-3);
    justify-content: flex-start;
    padding: 0 var(--rep-space-4);
    width: 100%;
  }
}