/*
 * 2.1: internal pages only. The approved homepage and shared navigation retain
 * their original styles. Keep the existing body font from the theme options.
 * Roles: Sisteron 400 = display headings; Aleo = cards, subheadings and UI.
 * #page scopes overrides above legacy per-template rules without touching icons.
 */
body:not(.home) {
  --v21-font-display: 'Sisteron', Georgia, serif;
  --v21-font-ui: 'Aleo', Georgia, serif;
}

body:not(.home) #page :is(h1, h2, .h1, .h2) {
  font-family: var(--v21-font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .1rem !important;
}

body:not(.home) #page :is(h3, h4, h5, h6, .h3, .h4, .h5, .h6, .title-abril, .widget-title, .day-title) {
  font-family: var(--v21-font-ui) !important;
}

/* Same card typeface and scale as the homepage's .titolo-post. */
body:not(.home) #page :is(.titolo-post, .card-title, .wp-block-post-title),
body:not(.home) #page :is(.titolo-post, .card-title, .wp-block-post-title) a {
  font-family: var(--v21-font-ui) !important;
  font-size: clamp(1rem, 1.3vw, 1.35rem) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .025em !important;
}

/* Functional text: remove the old compressed face from filters and timetables. */
body:not(.home) #page :is(.interstate-compressed, .info-sidebar, .info-sidebar a,
  .title-filter, .title-normal, .date-range, .datetime, .categoria-tag,
  .attraction-gallery__more, .attraction-opening-calendar__weekday,
  .attraction-opening-calendar__day, .attraction-opening-calendar__hours,
  .attraction-opening-calendar__price, .attraction-opening-calendar__book,
  .attraction-day__status, .event-day__status, [data-calendar-date],
  .section-label, .events-eyebrow, .markets-eyebrow, .contact-page__eyebrow) {
  font-family: var(--v21-font-ui) !important;
}

body:not(.home) #page :is(button, input, select, textarea, label,
  .btn, .wp-block-button__link, .nav-link) {
  font-family: var(--v21-font-ui) !important;
}

body:not(.home) #page .card-event .card-body .col-xxl-3 > .row > div:first-child,
body:not(.home) #page .contact-page__contact-line strong,
body:not(.home) #page .tirol-arrival__grid > li > strong {
  font-family: var(--v21-font-ui) !important;
}

/* Preserve the homepage's Aleo contact/footer treatment on internal pages. */
body:not(.home) #page #contact-form,
body:not(.home) #page #contact-form .wrapper-contact,
body:not(.home) #page #contact-form :is(p, label, a, strong, li, input, textarea),
body:not(.home) #page :is(.prefooter, .pre-footer, .sopra-footer, #wrapper-footer-full) :is(h3, h4, h5, h6, p, a, strong, li, small) {
  font-family: var(--v21-font-ui) !important;
}

/* Popups can be mounted outside #page. Do not override icon elements. */
body:not(.home) #modale-punto h3,
body:not(.home) .mpfy-p-popup .mpfy-title h1 {
  font-family: var(--v21-font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .1rem !important;
}
body:not(.home) .mpfy-container :is(button, input, select, label),
body:not(.home) .mpfy-selecter-wrap .selecter .selecter-selected {
  font-family: var(--v21-font-ui) !important;
}

/* Keep card titles readable on phones throughout the internal pages. */
@media (max-width: 767px) {
  body:not(.home) #page :is(.titolo-post, .card-title, .wp-block-post-template .wp-block-post-title, .blog-card__title, .contact-infopoint-card h4),
  body:not(.home) #page :is(.titolo-post, .card-title, .wp-block-post-template .wp-block-post-title, .blog-card__title) a {
    font-size: 1.4rem !important;
    zoom: 1 !important;
  }
}

/* Mobile information panel below event, attraction and location headers. */
@media (max-width: 767px) {
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar {
    margin: 0 0 24px !important;
    padding: 8px 20px !important;
    border: 0 !important;
    border-radius: 12px;
    background: #f8f3ee;
    box-shadow: 0 6px 20px rgb(41 20 10 / 5%);
    line-height: 1.4;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar > div {
    padding: 13px 0 !important;
    border-bottom: 1px solid #e7ded9;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar > div:last-child {
    border-bottom: 0;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar > div > .d-flex {
    gap: 8px;
    min-width: 0;
    font-weight: 700;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar .text-end {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar :is(.text-end, .text-end *) {
    font-family: var(--v21-font-ui) !important;
    font-size: 1.1rem !important;
    font-weight: 400 !important;
    line-height: 1.45;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar .sidebar-info__address {
    flex-direction: column;
    align-items: stretch !important;
    gap: 5px;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar .sidebar-info__address > .text-end,
  body:is(.single-eventi, .single-attrazioni) #main > .d-block.d-md-none .info-sidebar .sidebar-info__schedule .text-end {
    width: 100%;
    text-align: left !important;
  }
  body:is(.single-eventi, .single-attrazioni, .single-localita) #main > .d-block.d-md-none .info-sidebar .sidebar-info__address > .text-end > a {
    display: block;
    margin-top: 6px;
  }
  body:is(.single-eventi, .single-attrazioni) #main > .d-block.d-md-none .info-sidebar .sidebar-info__schedule > .d-flex {
    flex-direction: column;
    align-items: stretch !important;
    gap: 5px;
  }
  body:is(.single-eventi, .single-attrazioni) #main > .d-block.d-md-none .info-sidebar .sidebar-info__schedule > .text-end {
    margin-top: 5px;
  }
  body:is(.single-eventi, .single-attrazioni) #main > .d-block.d-md-none + .page-content {
    margin-top: 32px !important;
  }
}