/* ============================================================
   fun-run.co.uk — Sponsored event finder page
   Scoped to body.fr-public-event-finder where overriding
   public-home.css; new class names need no additional scope.
   ============================================================ */

/* --- Hero --------------------------------------------------- */

body.fr-public-event-finder .fr-finder-hero {
  text-align: center;
  padding-top: var(--fr-space-6);
  padding-bottom: var(--fr-space-7);
}

body.fr-public-event-finder .fr-finder-hero .fr-home-section__title {
  max-width: none;
  text-wrap: pretty;
}

body.fr-public-event-finder .fr-finder-hero .fr-home-section__lede {
  max-width: none;
  margin-bottom: var(--fr-space-3);
}

.fr-finder-hero__reassurance {
  font-size: var(--fr-text-sm);
  color: var(--fr-color-ink-subtle);
  margin: 0;
}

/* --- Form card --------------------------------------------- */

.fr-finder-form-card {
  background: var(--fr-color-surface);
  border: 1.5px solid var(--fr-color-border);
  border-radius: var(--fr-radius-xl);
  padding: var(--fr-space-7) var(--fr-space-8);
  max-width: 44rem;
  margin: 0 auto;
  box-shadow: var(--fr-shadow-sm);
}

@media (max-width: 640px) {
  .fr-finder-form-card {
    padding: var(--fr-space-5);
  }
}

/* Custom select chevron (appearance:none already set by .fr-form-field__input) */
.fr-finder-select-wrap {
  position: relative;
}

.fr-finder-select-wrap::after {
  content: '';
  position: absolute;
  right: 0.875rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.1rem;
  height: 1.1rem;
  background: var(--fr-color-ink-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='black' stroke-width='1.75' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='black' stroke-width='1.75' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  pointer-events: none;
}

.fr-finder-select {
  padding-right: 2.5rem;
  cursor: pointer;
}

.fr-finder-submit {
  margin-top: var(--fr-space-6);
}

.fr-finder-helper {
  font-size: var(--fr-text-sm);
  color: var(--fr-color-ink-muted);
  margin: var(--fr-space-3) 0 0;
  text-align: center;
}

.fr-finder-error {
  background: var(--fr-color-danger-soft);
  color: var(--fr-color-danger);
  border: 1px solid rgba(195, 57, 44, 0.2);
  border-radius: var(--fr-radius-sm);
  padding: var(--fr-space-3) var(--fr-space-4);
  font-size: var(--fr-text-sm);
  font-weight: var(--fr-weight-medium);
  margin-bottom: var(--fr-space-5);
}

/* --- Results section --------------------------------------- */

body.fr-public-event-finder .fr-finder-results-section {
  padding-top: var(--fr-space-7);
}

.fr-finder-results__heading {
  font-size: clamp(var(--fr-text-xl), 2.5vw + 0.5rem, var(--fr-text-2xl));
  font-weight: var(--fr-weight-bold);
  letter-spacing: -0.02em;
  line-height: var(--fr-leading-tight);
  color: var(--fr-color-heading);
  margin: 0 0 var(--fr-space-2);
}

.fr-finder-results__lede {
  font-size: var(--fr-text-md);
  color: var(--fr-color-ink-muted);
  margin: 0 0 var(--fr-space-6);
}

/* --- Cards ------------------------------------------------- */

.fr-finder-card {
  background: var(--fr-color-surface);
  border: 1.5px solid var(--fr-color-border);
  border-radius: var(--fr-radius-lg);
  padding: var(--fr-space-5) var(--fr-space-6);
  display: flex;
  flex-direction: column;
  gap: var(--fr-space-3);
}

.fr-finder-card--best {
  border-color: var(--fr-color-primary);
  border-width: 2px;
  margin-bottom: var(--fr-space-5);
}

.fr-finder-card__tag {
  display: inline-block;
  font-size: var(--fr-text-xs);
  font-weight: var(--fr-weight-semibold);
  letter-spacing: var(--fr-tracking-wide);
  text-transform: uppercase;
  padding: 0.2rem 0.65rem;
  border-radius: var(--fr-radius-pill);
  align-self: flex-start;
}

.fr-finder-card__tag--best {
  background: var(--fr-color-primary);
  color: #fff;
}

.fr-finder-card__tag--great {
  background: var(--fr-color-bg-strong);
  color: var(--fr-color-ink-muted);
}

.fr-finder-card__tag--considering {
  background: transparent;
  border: 1px solid var(--fr-color-border-strong);
  color: var(--fr-color-ink-subtle);
}

.fr-finder-card__title {
  font-size: var(--fr-text-xl);
  font-weight: var(--fr-weight-bold);
  letter-spacing: -0.02em;
  line-height: var(--fr-leading-tight);
  color: var(--fr-color-heading);
  margin: 0;
}

.fr-finder-card--considering .fr-finder-card__title {
  font-size: var(--fr-text-lg);
}

.fr-finder-card__copy {
  font-size: var(--fr-text-base);
  color: var(--fr-color-ink-muted);
  line-height: var(--fr-leading-relaxed);
  margin: 0;
  flex: 1;
}

.fr-finder-card--considering .fr-finder-card__copy {
  font-size: var(--fr-text-sm);
}

.fr-finder-card__link {
  color: var(--fr-color-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  font-size: var(--fr-text-sm);
  font-weight: var(--fr-weight-medium);
  align-self: flex-start;
}

.fr-finder-card__link:hover {
  color: var(--fr-color-link-hover);
  text-decoration-thickness: 2px;
}

/* Card grid containers */
.fr-finder-cards__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--fr-space-5);
  margin-bottom: var(--fr-space-5);
}

.fr-finder-cards__grid--muted .fr-finder-card {
  background: var(--fr-color-surface-sunken);
}

@media (max-width: 640px) {
  .fr-finder-cards__grid {
    grid-template-columns: 1fr;
  }
}

/* --- Calculator callout ------------------------------------ */

.fr-finder-calc-callout {
  background: var(--fr-color-primary-soft);
  border-radius: var(--fr-radius-lg);
  padding: var(--fr-space-6) var(--fr-space-7);
  margin-top: var(--fr-space-3);
}

@media (max-width: 640px) {
  .fr-finder-calc-callout {
    padding: var(--fr-space-5);
  }
}

.fr-finder-calc-callout__heading {
  font-size: var(--fr-text-lg);
  font-weight: var(--fr-weight-bold);
  letter-spacing: -0.02em;
  color: var(--fr-color-heading);
  margin: 0 0 var(--fr-space-2);
}

.fr-finder-calc-callout__body {
  font-size: var(--fr-text-base);
  color: var(--fr-color-ink-muted);
  line-height: var(--fr-leading-relaxed);
  margin: 0 0 var(--fr-space-4);
}

.fr-finder-calc-callout__link {
  color: var(--fr-color-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  font-size: var(--fr-text-base);
  font-weight: var(--fr-weight-medium);
}

.fr-finder-calc-callout__link:hover {
  color: var(--fr-color-link-hover);
  text-decoration-thickness: 2px;
}

/* --- Card header image (best-fit card only) ---------------- */

.fr-finder-card--has-img {
  padding: 0;
  overflow: hidden;
  gap: 0;
}

.fr-finder-card__img-wrap {
  display: block;
}

.fr-finder-card__img-wrap img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 1;
  object-fit: cover;
}

.fr-finder-card__body {
  padding: var(--fr-space-5) var(--fr-space-6);
  display: flex;
  flex-direction: column;
  gap: var(--fr-space-3);
}

/* --- Start again ------------------------------------------ */

.fr-finder-restart {
  text-align: center;
  padding: var(--fr-space-4) 0 var(--fr-space-7);
}

.fr-finder-restart .fr-btn {
  font-size: var(--fr-text-sm);
}
