@charset "UTF-8";
/**
* @file
* Page Header
*/
/**
* @file
* Common dependencies for all theme stylesheets (both global and component specific)
*/
/**
* @file
* Functions
*
* Defines reusable Sass functions that perform calculations or transformations (e.g.,
* color manipulation, scaling values).
*/
/**
 * @file
 * Color functions
 */
/**
* @file
* Tier 1 - Primitive Color Variables
*
* Contains the color design tokens assigned to our aliases.
* These variables are the raw, unchanging values used to define the core visual language of the project.
*/
/**
* @file
* Convert values into rem units.
* Only `px` values are converted to rem.
* ! Use CSS variables whenever possible
* defines the base font size in a way that is understandable by Sass functions
*/
/**
* @file
* Mixins
*
* Contains imports for reusable Sass mixins that encapsulate common patterns or logic, such as
* responsive styles, vendor prefixes, or utility functions.
*/
/**
* @file
* Breakpoints
*
* Defines CSS variables for responsive design breakpoints used throughout the project.
*/
/**
* @file
* Container Mixins
*
* Contains mixins for containers that can be applied on a component level when their associated utility class is applied
*/
/**
* @file
* Container Variables
*/
/**
 * @file
 * Global typography for site
*/
/**
* @file
* Typography
*
* Defines CSS variables and styles related to typography, including font families,
* sizes, weights, line heights, and letter spacing.
*/
/**
* @file
* Type SCSS variables for spacing system
*/
/* === Font Stacks === */
/* === Font Weights === */
/* === Letter Spacing === */
/* === Line Heights === */
/* A single line value will be used for type. The largest value was selected based on comparing between mobile and desktop. */
/* === Font Sizes === */
/* Min / Mobile */
/* Max / Desktop */
/* Font Size / Fluid Units
* Resource: Utopia Clamp Calculator
* @link https://utopia.fyi/clamp/calculator?a=320,1440,92—104|64—88|52—64|48—60|32—40|16—20
*
* viewport values from utopia clamp calculator
* values without clamp are the same for mobile and desktop
*/
/*
 Preset typography
*/
/**
* @file
* Utility Mixins
*/
/**
* @file
* Container Mixins
*
* Contains mixins for containers that can be applied on a component level when their associated utility class is applied
*/
/**
* @file
* Variables
*/
/**
* @file
* Type SCSS variables for transition durations.
*/
/**
* @file
* Typography
*
* Defines CSS variables and styles related to typography, including font families,
* sizes, weights, line heights, and letter spacing.
*/
/**
* @file
* SCSS variables for radii
*/
/**
* @file
* Typography
*
* Defines CSS variables and styles related to typography, including font families,
* sizes, weights, line heights, and letter spacing.
*/
/**
 * @file
 * Global typography for site
*/
/**
* @file
* Z-Index
*
* Source of truth for z-index values used throughout the theme.
*/
/**
* @file
* SCSS variables for miscellaneous items
*/
/**
* @file
* Common dependencies for all theme stylesheets (both global and component specific)
*/
/**
 * Tabs/tab as seen on the search page.
 * Pattern reference: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/tab_role#example
 */
/**
 * Styles for "No Results" message to be displayed when 0 results are returned initiating 
 * a search from the Nav, or when 0 results are returned using filters
 */
/**
* @file
* Utility Mixins
*/
:root {
  --header-background-color: var(--surface-primary);
  --header-text: var(--text-action);
  --header-block-size: 6.357rem;
  --header-spotlight-inline-size: 100%;
  --header-spotlight-block-size: 10.9375rem;
  --navigation-background-color: var(--surface-action);
  --navigation-secondary-background-color: var(--surface-action-hover);
  --navigation-text: var(--text-on-action);
  --navigation-column-gap: clamp(1.25rem, 2vw, 2.25rem);
  --header-promo-background-color: var(--surface-tertiary);
  --header-item-padding: 0.75rem;
  --page-header-fly-point: var(--header-block-size);
  --header-offset: var(--header-block-size);
  --header-search-button-width: 3.125rem;
  --header-search-button-color: var(--neutral-color-900);
}
@media (min-width: 768px) {
  :root {
    --header-search-button-color: var(--icon-primary);
  }
}

body:has(.page-header__mobile-toggle[aria-expanded=true],
.search-button[aria-expanded=true],
.page-header .page-header__navigation .main-menu > li > :is(button, :-moz-any-link, [aria-controls^=submenu])[aria-expanded=true]) {
  overflow-y: clip;
}

body:has(.page-header__mobile-toggle[aria-expanded=true],
.search-button[aria-expanded=true],
.page-header .page-header__navigation .main-menu > li > :is(button, :any-link, [aria-controls^=submenu])[aria-expanded=true]) {
  overflow-y: clip;
}
@media (min-width: 768px) {
  body:has(.page-header__mobile-toggle[aria-expanded=true],
  .search-button[aria-expanded=true],
  .page-header .page-header__navigation .main-menu > li > :is(button, :-moz-any-link, [aria-controls^=submenu])[aria-expanded=true]) {
    overflow-y: auto;
  }
  body:has(.page-header__mobile-toggle[aria-expanded=true],
  .search-button[aria-expanded=true],
  .page-header .page-header__navigation .main-menu > li > :is(button, :any-link, [aria-controls^=submenu])[aria-expanded=true]) {
    overflow-y: auto;
  }
}

body.header-sticky {
  padding-block-start: var(--header-offset);
}

.header-hidden .page-header {
  transform: translateY(-100%);
}

.header-sticky .page-header {
  position: fixed;
  transform: translateY(0);
}

.page-header {
  background-color: var(--header-background-color);
  block-size: var(--header-block-size);
  color: var(--header-text);
  color-scheme: only light;
  contain: layout;
  inset: var(--drupal-displace-offset-top, 0) 0 auto;
  overflow: hidden;
  position: sticky;
  transition: transform 300ms ease-in-out;
  will-change: transform;
  z-index: 10;
}
[data-mode=dark] .page-header, .page-header[data-mode=dark], .page-header.page-header--dark {
  color-scheme: only dark;
}
.page-header:has(.submenu--expanded) {
  overflow-y: visible;
}
.page-header:has(.search-button[aria-expanded=true]) {
  overflow: visible;
}
@media (min-width: 768px) {
  .page-header {
    overflow: visible;
  }
}
.page-header .page-header__mobile-toggle {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  border: none;
  color: var(--text-action);
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  cursor: pointer;
  display: inline-flex;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  letter-spacing: 0.1125rem;
  margin: 0;
  padding: 0;
  text-decoration: none;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
  text-decoration-style: solid;
  text-decoration-thickness: 12%;
  text-underline-offset: 40%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-transform: uppercase;
  font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.75rem;
  line-height: 1;
  /* stylelint-disable no-duplicate-selectors */
  /* stylelint-enable no-duplicate-selectors */
}
:where(:has(.font-loaded)) .page-header .page-header__mobile-toggle {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-loaded) .page-header .page-header__mobile-toggle {
  line-height: 1;
}
.page-header .page-header__mobile-toggle:hover, .page-header .page-header__mobile-toggle:focus {
  text-decoration: underline;
}
.page-header .page-header__mobile-toggle {
  align-items: center;
  block-size: 1.5rem;
  margin-block: auto 0.875rem;
  margin-inline-start: 1rem;
  order: -1;
  z-index: 1;
}
@media (min-width: 768px) {
  .page-header .page-header__mobile-toggle {
    display: none;
  }
}
.page-header .page-header__mobile-toggle svg {
  flex-shrink: 0;
}
.page-header .page-header__mobile-toggle svg + svg {
  display: none;
}
.page-header .page-header__mobile-toggle[aria-expanded=true] svg {
  display: none;
}
.page-header .page-header__mobile-toggle[aria-expanded=true] svg + svg {
  display: inline-block;
  inline-size: 1.5rem;
}
.page-header .page-header__mobile-toggle[aria-expanded=true] + .page-header__navigation {
  max-width: unset;
}
.page-header .page-header__mobile-toggle[aria-expanded=true] ~ .header-search-form {
  display: none;
}
.page-header .page-header__container {
  block-size: var(--header-block-size);
  contain: size;
  display: grid;
  grid-auto-flow: row;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 1fr min-content;
  inline-size: 100%;
  place-content: space-between;
  position: relative;
}
@media (max-width: 767px) {
  .page-header .page-header__container {
    contain-intrinsic-size: auto max(var(--header-spotlight-block-size), var(--header-block-size));
  }
  .page-header .page-header__container:has(> .page-header__mobile-toggle[aria-expanded=true]) {
    block-size: 100dvb;
    grid-template-rows: var(--header-block-size) 1fr min-content;
    inline-size: 100dvi;
  }
}
@media (min-width: 768px) {
  .page-header .page-header__container {
    contain-intrinsic-size: auto var(--header-block-size);
    grid-auto-columns: min-content;
    grid-auto-flow: column;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr min-content;
  }
}
.page-header .page-header__navigation {
  background-color: var(--navigation-background-color);
  color: var(--navigation-text);
  display: none;
  max-width: calc(100% - var(--header-search-button-width) + 1rem);
}
.page-header .page-header__navigation > .visually-hidden {
  display: none;
}
.page-header .page-header__navigation :where(ul) {
  margin: 0;
  padding: 0;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation {
    align-items: flex-end;
    background-color: var(--header-background-color);
    color: var(--header-text);
    display: flex;
    grid-auto-columns: min-content;
    grid-column: 1/9;
    grid-row: 2;
  }
}
.page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
  background-color: transparent;
  border: none;
  color: var(--navigation-text);
  cursor: pointer;
  display: inline-block;
  padding-inline: 0;
  text-align: start;
  text-decoration: none;
  text-transform: uppercase;
  -moz-user-select: none;
       user-select: none;
  white-space: nowrap;
  text-transform: uppercase;
  font-family: Knockout71, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size-adjust: cap-height 0.722;
  font-stretch: condensed;
  font-weight: 900;
  font-size: clamp(2rem, 1.8571rem + 0.7143vw, 2.5rem);
  line-height: 1.125;
}
.page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
  background-color: transparent;
  border: none;
  color: var(--navigation-text);
  cursor: pointer;
  display: inline-block;
  padding-inline: 0;
  text-align: start;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
  text-transform: uppercase;
  font-family: Knockout71, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size-adjust: cap-height 0.722;
  font-stretch: condensed;
  font-weight: 900;
  font-size: clamp(2rem, 1.8571rem + 0.7143vw, 2.5rem);
  line-height: 1.125;
}
:where(:has(.font-loaded)) .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:where(:has(.font-loaded)) .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-timed-out) .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
:has(.font-timed-out) .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
:has(.font-loaded) .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
  line-height: 1.125;
}
:has(.font-loaded) .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
  line-height: 1.125;
}
.page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]):hover, .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]):focus, .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]).is-active, .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]):is(.is-active > *) {
  background: url("/themes/custom/tnvacation/img/menu-underline.svg") no-repeat bottom center;
  text-decoration: none;
}
.page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]):hover, .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]):focus, .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]).is-active, .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]):is(.is-active > *) {
  background: url("/themes/custom/tnvacation/img/menu-underline.svg") no-repeat bottom center;
  text-decoration: none;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
    padding: 0 0 1rem 1rem;
  }
  .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
    padding: 0 0 1rem 1rem;
  }
}
.submenu--expanded .page-header .page-header__navigation :is(button, :-moz-any-link, [aria-controls^=submenu]) {
  color-scheme: only dark;
}
.submenu--expanded .page-header .page-header__navigation :is(button, :any-link, [aria-controls^=submenu]) {
  color-scheme: only dark;
}
.page-header .page-header__navigation nav {
  display: block;
  flex: 1;
  position: relative;
}
.page-header .page-header__navigation li {
  display: flex;
  flex-direction: column;
  font-size: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
.page-header .page-header__navigation li > button {
  white-space: nowrap;
}
.page-header .page-header__navigation .main-menu {
  background-color: var(--navigation-background-color);
  -moz-column-gap: var(--navigation-column-gap);
       column-gap: var(--navigation-column-gap);
  flex: 1 0 100%;
  flex-direction: column;
  grid-column: 1/-1;
  padding-inline: 0;
}
.page-header .page-header__navigation .main-menu > li {
  align-items: center;
  align-self: center;
  display: flex;
  flex: 0 1 auto;
  flex-flow: row nowrap;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 0.1125rem;
  line-height: 1.333rlh;
  list-style: none;
  min-inline-size: 0;
  padding: 1.125rem 1rem;
  text-align: start;
  text-transform: uppercase;
  white-space: nowrap;
  text-transform: uppercase;
  font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.75rem;
  line-height: 1;
}
:where(:has(.font-loaded)) .page-header .page-header__navigation .main-menu > li {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-loaded) .page-header .page-header__navigation .main-menu > li {
  line-height: 1;
}
.page-header .page-header__navigation .main-menu > li:has([aria-expanded=true]) :is(button, :-moz-any-link):is(:hover, :focus) {
  background: none;
}
.page-header .page-header__navigation .main-menu > li:has([aria-expanded=true]) :is(button, :any-link):is(:hover, :focus) {
  background: none;
}
.page-header .page-header__navigation .main-menu > li:has([aria-expanded=true])::before {
  background: url("/themes/custom/tnvacation/img/icons/tnds/back.svg") no-repeat center left;
  background-size: contain;
  block-size: 1.25rem;
  content: "";
  display: inline-block;
  filter: invert(1);
  inline-size: 1.25rem;
  margin-inline-end: 0.5em;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation .main-menu {
    background-color: unset;
  }
}
.page-header .page-header__navigation .main-menu svg {
  margin-inline-start: 0.5rem;
  min-inline-size: 1rem;
  transform: rotate(-90deg) scale(1.5) translateY(0.5rem);
  transform-origin: center;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation .main-menu svg {
    margin-inline-start: 0.25rem;
    transform: rotate(0deg) scale(1);
  }
}
@media (min-width: 900px) {
  .page-header .page-header__navigation .main-menu svg {
    margin-inline-start: 0.5rem;
  }
}
.page-header .page-header__navigation .main-menu :is(button, :-moz-any-link, [aria-controls^=submenu]):where([aria-expanded=true]) {
  background-color: var(--navigation-background-color);
  font-size: 0.75rem;
  line-height: 1rem;
  padding: 1.5rem 0;
}
.page-header .page-header__navigation .main-menu :is(button, :any-link, [aria-controls^=submenu]):where([aria-expanded=true]) {
  background-color: var(--navigation-background-color);
  font-size: 0.75rem;
  line-height: 1rem;
  padding: 1.5rem 0;
}
.page-header .page-header__navigation .main-menu :is(button, :-moz-any-link, [aria-controls^=submenu]):where([aria-expanded=true]) + svg {
  display: none;
}
.page-header .page-header__navigation .main-menu :is(button, :any-link, [aria-controls^=submenu]):where([aria-expanded=true]) + svg {
  display: none;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation .main-menu :is(button, :-moz-any-link, [aria-controls^=submenu]):where([aria-expanded=true]) + svg {
    display: inline-block;
    transform: rotate(180deg);
  }
  .page-header .page-header__navigation .main-menu :is(button, :any-link, [aria-controls^=submenu]):where([aria-expanded=true]) + svg {
    display: inline-block;
    transform: rotate(180deg);
  }
}
.page-header .page-header__navigation .main-menu:not(:has([aria-expanded=true])) {
  block-size: 100%;
  max-block-size: calc(100dvb - var(--header-offset) - var(--header-spotlight-block-size));
  padding: 0 1rem;
}
.page-header .page-header__navigation .main-menu__submenus {
  background-color: var(--navigation-secondary-background-color);
  color-scheme: only light;
}
.page-header .page-header__navigation .main-menu__submenus .submenu {
  background-color: var(--navigation-secondary-background-color);
  display: none;
  inline-size: -moz-max-content;
  inline-size: max-content;
  overflow: auto;
  position: relative;
}
@media (min-width: 768px) {
  .page-header .page-header__navigation .main-menu__submenus .submenu {
    background-color: var(--navigation-background-color);
    block-size: calc(100dvb - var(--header-block-size) - var(--header-spotlight-block-size));
    color: var(--navigation-text);
    margin-inline: 0;
    padding-inline: 0;
  }
}
.page-header .page-header__navigation .main-menu__submenus .submenu li {
  padding: 1.125rem 1.5rem;
}
.page-header .page-header__navigation .main-menu__submenus .submenu :-moz-any-link {
  color: var(--navigation-text);
  font-size: var(--type-size-lg);
  font-weight: bold;
  inline-size: -moz-max-content;
  inline-size: max-content;
  padding: 0.75rem 0;
  text-decoration: none;
  text-transform: uppercase;
}
.page-header .page-header__navigation .main-menu__submenus .submenu :any-link {
  color: var(--navigation-text);
  font-size: var(--type-size-lg);
  font-weight: bold;
  inline-size: -moz-max-content;
  inline-size: max-content;
  padding: 0.75rem 0;
  text-decoration: none;
  text-transform: uppercase;
}
.page-header .page-header__navigation .main-menu__submenus .submenu.submenu--expanded {
  inline-size: 100%;
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  contain: layout inline-size;
  display: flex;
  flex-direction: column;
  grid-column: 1/-1;
  inset-inline: 0 -1rem;
  position: relative;
  visibility: visible;
  z-index: 10;
}
.page-header .page-header__branding {
  align-items: flex-end;
  aspect-ratio: 129.91/23;
  display: flex;
  min-block-size: 1.4375rem;
  min-inline-size: 8.119rem;
}
.page-header .page-header__branding img {
  aspect-ratio: 15.1797/2.6875;
  block-size: 100%;
  flex: 1 0 0;
  inline-size: 100%;
  max-block-size: 2.6875rem;
  max-inline-size: 15.1797rem;
  filter: invert(1) brightness(0);
  height: auto;
  margin: 0 auto;
  max-block-size: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: clamp(4rem, 40vw, 8.119rem);
}
@media (min-width: 768px) {
  .page-header .page-header__branding img {
    width: unset;
  }
}
@media (max-width: 392px) {
  .page-header .page-header__branding {
    margin-inline-start: 1rem;
  }
}
@media (max-width: 767px) {
  .page-header .page-header__branding {
    inset: var(--header-block-size) 0 0;
    justify-content: center;
    position: absolute;
    transform: translateY(-100%);
  }
}
[data-mode=dark] .page-header .page-header__branding img, .page-header:is([data-mode=dark], .page-header--dark) .page-header__branding img {
  filter: none;
}

.toolbar-fixed .page-header ~ .region--breadcrumbs:first-of-type {
  margin-block-start: calc(var(--header-block-size) + var(--drupal-displace-offset-top, 0) + 1lh + 1rem);
}

.page-header__spotlight {
  align-items: flex-end;
  background-color: var(--header-promo-background-color);
  block-size: var(--header-spotlight-block-size);
  contain: strict;
  contain-intrinsic-size: var(--header-spotlight-inline-size) var(--header-spotlight-block-size);
  container-name: header-spotlight;
  display: none;
  grid-column: 1/12;
  grid-template-columns: 1fr 1fr;
  inline-size: var(--header-spotlight-inline-size);
  justify-content: space-around;
}
.page-header__spotlight .cta-button {
  cursor: pointer;
  inset: auto 50% 1.5rem auto;
  padding: 0.5rem 1rem;
  position: absolute;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.page-header__spotlight .tnds-handdrawn-arrow {
  inset: auto 50% 3.5rem auto;
  position: absolute;
}
.page-header__spotlight :-moz-any-link {
  align-items: end;
  block-size: 100%;
  box-sizing: content-box;
  color: var(--text-action);
  display: flex;
  flex-flow: column nowrap;
  inline-size: 8.875rem;
  inset: -45% 0 0 auto;
  justify-content: center;
  max-inline-size: var(--header-spotlight-inline-size);
  padding: 6.125rem 50% 4.6875rem 1rem;
  position: absolute;
  row-gap: 0.5rem;
  text-align: center;
  text-decoration: none;
  transform: rotate(-3deg) translateY(-14%);
  -moz-user-select: none;
       user-select: none;
  white-space: wrap;
  z-index: 1;
  font-family: "TNSansPerfect", Monaco, monospace;
  font-style: italic;
  text-transform: uppercase;
  font-size: 1.125rem;
  line-height: 1.1;
}
.page-header__spotlight :any-link {
  align-items: end;
  block-size: 100%;
  box-sizing: content-box;
  color: var(--text-action);
  display: flex;
  flex-flow: column nowrap;
  inline-size: 8.875rem;
  inset: -45% 0 0 auto;
  justify-content: center;
  max-inline-size: var(--header-spotlight-inline-size);
  padding: 6.125rem 50% 4.6875rem 1rem;
  position: absolute;
  row-gap: 0.5rem;
  text-align: center;
  text-decoration: none;
  transform: rotate(-3deg) translateY(-14%);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: wrap;
  z-index: 1;
  font-family: "TNSansPerfect", Monaco, monospace;
  font-style: italic;
  text-transform: uppercase;
  font-size: 1.125rem;
  line-height: 1.1;
}
:has(.font-loaded) .page-header__spotlight :-moz-any-link {
  line-height: 1.1;
}
:has(.font-loaded) .page-header__spotlight :any-link {
  line-height: 1.1;
}
.page-header__spotlight :-moz-any-link:hover ~ .cta-button--primary, .page-header__spotlight :-moz-any-link:focus ~ .cta-button--primary, .page-header__spotlight :-moz-any-link:active ~ .cta-button--primary {
  background-color: var(--cta-button-primary-background-color--hover);
  border-color: var(--cta-button-primary-border-color--hover);
  color: var(--cta-button-primary-text-color--hover);
}
.page-header__spotlight :any-link:hover ~ .cta-button--primary, .page-header__spotlight :any-link:focus ~ .cta-button--primary, .page-header__spotlight :any-link:active ~ .cta-button--primary {
  background-color: var(--cta-button-primary-background-color--hover);
  border-color: var(--cta-button-primary-border-color--hover);
  color: var(--cta-button-primary-text-color--hover);
}
.page-header__spotlight img {
  block-size: 100%;
  inline-size: auto;
  inset: auto 0.5rem -2rem 50%;
  max-block-size: 100%;
  pointer-events: none;
  position: absolute;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

@media (max-width: 767px) {
  .page-header__branding,
  .page-header__mobile-toggle,
  .page-header form {
    padding-block-end: 1rem;
  }
  .main-menu:has([aria-expanded=true]) > li:not(:has([aria-expanded=true])),
  :has(.page-header__mobile-toggle[aria-expanded=false]) + .page-header__navigation .main-menu {
    display: none;
  }
  .main-menu__submenus {
    contain: layout inline-size;
    inline-size: 100%;
    max-block-size: calc(100dvb - var(--header-block-size) - var(--header-spotlight-block-size) - var(--drupal-displace-offset-top, 0));
    max-inline-size: 100dvi;
  }
  .submenus__container {
    background-color: var(--navigation-secondary-background-color);
    contain: size;
    contain-intrinsic-size: auto calc(100dvb - var(--header-block-size) - var(--header-spotlight-block-size));
    overflow: auto;
  }
  .page-header:has(.page-header__mobile-toggle[aria-expanded=true]) {
    block-size: 100dvb;
    overflow: hidden;
  }
  .page-header__mobile-toggle[aria-expanded=true] + .page-header__navigation {
    display: flex;
    flex-flow: column nowrap;
    grid-column: 1/-1;
  }
  :has(.page-header__mobile-toggle[aria-expanded=true]) .page-header__spotlight {
    display: flex;
  }
  .page-header__navigation:has(.submenu--expanded) {
    background-color: var(--navigation-secondary-background-color);
  }
  .page-header__navigation:has(.submenu--expanded) + .page-header__spotlight {
    display: none;
  }
  .page-header:has(.page-header__mobile-toggle[aria-expanded=true]):not(:has(.page-header__navigation [aria-expanded=true])) .page-header__spotlight {
    inset-block-end: 0;
    inset-inline: 0;
    position: fixed;
  }
  .page-header form {
    inset-inline-end: -1rem;
    position: relative;
  }
}
@media (min-width: 768px) {
  :root {
    --header-block-size: 8.9375rem;
    --header-spotlight-inline-size: auto;
    --header-spotlight-block-size: var(--header-block-size);
  }
  :where(ul.submenu, .submenu) {
    display: none;
  }
  .submenu--expanded {
    display: grid;
  }
  .main-menu:has([aria-expanded=true]) + .main-menu__submenus {
    inset: var(--header-block-size) 0 0;
    position: fixed;
  }
  .main-menu__submenus {
    background-color: var(--navigation-background-color);
  }
  .page-header .page-header__navigation .main-menu {
    align-items: start;
    block-size: 100%;
    display: flex;
    flex-flow: row nowrap;
    margin: 0 auto 0 0;
    padding: 0;
    position: relative;
  }
  .page-header .page-header__navigation .main-menu > li {
    padding: var(--header-item-padding) 0;
  }
  .page-header .page-header__navigation .main-menu > li:has([aria-expanded=true])::before {
    content: none;
  }
  .page-header .page-header__navigation .main-menu > li :is(button, :-moz-any-link, [aria-controls^=submenu]) {
    -moz-appearance: none;
         appearance: none;
    background-color: transparent;
    border: none;
    color: var(--text-action);
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    cursor: pointer;
    display: inline-flex;
    inline-size: -moz-fit-content;
    inline-size: fit-content;
    letter-spacing: 0.1125rem;
    margin: 0;
    padding: 0;
    text-decoration: none;
    text-decoration-skip-ink: none;
    text-decoration-style: solid;
    text-decoration-thickness: 12%;
    text-underline-offset: 40%;
    -moz-user-select: none;
         user-select: none;
    text-transform: uppercase;
    font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 0.75rem;
    line-height: 1;
  }
  .page-header .page-header__navigation .main-menu > li :is(button, :any-link, [aria-controls^=submenu]) {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background-color: transparent;
    border: none;
    color: var(--text-action);
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    cursor: pointer;
    display: inline-flex;
    inline-size: -moz-fit-content;
    inline-size: fit-content;
    letter-spacing: 0.1125rem;
    margin: 0;
    padding: 0;
    text-decoration: none;
    -webkit-text-decoration-skip-ink: none;
            text-decoration-skip-ink: none;
    text-decoration-style: solid;
    text-decoration-thickness: 12%;
    text-underline-offset: 40%;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    text-transform: uppercase;
    font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 0.75rem;
    line-height: 1;
  }
  :where(:has(.font-loaded)) .page-header .page-header__navigation .main-menu > li :is(button, :-moz-any-link, [aria-controls^=submenu]) {
    font-size-adjust: unset;
    font-stretch: unset;
    font-weight: unset;
    transform: none;
  }
  :where(:has(.font-loaded)) .page-header .page-header__navigation .main-menu > li :is(button, :any-link, [aria-controls^=submenu]) {
    font-size-adjust: unset;
    font-stretch: unset;
    font-weight: unset;
    transform: none;
  }
  :has(.font-loaded) .page-header .page-header__navigation .main-menu > li :is(button, :-moz-any-link, [aria-controls^=submenu]) {
    line-height: 1;
  }
  :has(.font-loaded) .page-header .page-header__navigation .main-menu > li :is(button, :any-link, [aria-controls^=submenu]) {
    line-height: 1;
  }
  .page-header .page-header__navigation .main-menu > li :is(button, :-moz-any-link, [aria-controls^=submenu]):hover, .page-header .page-header__navigation .main-menu > li :is(button, :-moz-any-link, [aria-controls^=submenu]):focus {
    text-decoration: underline;
  }
  .page-header .page-header__navigation .main-menu > li :is(button, :any-link, [aria-controls^=submenu]):hover, .page-header .page-header__navigation .main-menu > li :is(button, :any-link, [aria-controls^=submenu]):focus {
    text-decoration: underline;
  }
  .page-header .page-header__navigation .main-menu > .is-active :is(button, :-moz-any-link, [aria-controls^=submenu]) {
    text-decoration: underline;
  }
  .page-header .page-header__navigation .main-menu > .is-active :is(button, :any-link, [aria-controls^=submenu]) {
    text-decoration: underline;
  }
  .page-header .page-header__navigation .main-menu:not(:has([aria-expanded=true])) {
    margin: 0 auto 0 0;
    padding-inline: 0;
  }
  .page-header .page-header__navigation ul:has(button[aria-expanded=true]) > li:not(:has(button[aria-expanded=true])) {
    display: inline-flex;
  }
  .page-header .page-header__branding {
    block-size: 2.6875rem;
    grid-column: 1/3;
    grid-row: 1;
    inline-size: 15.1797rem;
    place-self: flex-end center;
    position: static;
  }
  .page-header .page-header__spotlight {
    block-size: 10.875rem;
    grid-column: 9/12;
    grid-row: 1/-1;
    inline-size: var(--header-spotlight-inline-size);
    justify-content: center;
    position: relative;
  }
  .page-header .page-header__spotlight :-moz-any-link {
    block-size: auto;
    inset: -25% 0 0 auto;
    position: absolute;
    text-align: center;
  }
  .page-header .page-header__spotlight :any-link {
    block-size: auto;
    inset: -25% 0 0 auto;
    position: absolute;
    text-align: center;
  }
  .page-header .page-header__spotlight img {
    block-size: auto;
    inline-size: auto;
    max-block-size: 100%;
    max-inline-size: 100%;
    min-block-size: inherit;
    min-inline-size: inherit;
  }
  .page-header .page-header__spotlight .tnds-handdrawn-arrow {
    inset: 5.25rem 50% 0 auto;
    position: absolute;
  }
  .page-header .page-header__navigation {
    grid-column: 1/-1;
  }
  .page-header .page-header__navigation nav {
    inline-size: 100%;
    inline-size: -webkit-fill-available;
    inline-size: -moz-available;
    inline-size: stretch;
  }
  .page-header__navigation:has(.main-menu__submenus:focus-within, .main-menu [aria-expanded=true]) .submenu--expanded {
    padding-block-end: var(--header-spotlight-block-size);
  }
  .page-header__navigation:has(.main-menu [aria-expanded=true]) ~ .page-header__spotlight,
  .page-header__navigation:has(.main-menu__submenus:focus-within) ~ .page-header__spotlight {
    display: grid;
    inline-size: 100%;
    inset: calc(100dvb - var(--header-block-size) - 2rem) 0 0;
    position: fixed;
  }
  .page-header form {
    block-size: auto;
    grid-column: 12;
    grid-row: 1;
    inset-inline-end: -1rem;
    position: relative;
  }
}
@media (min-width: 900px) {
  .page-header .page-header__navigation .main-menu {
    grid-column: 1/9;
    inline-size: 100%;
    margin-inline-end: auto;
    padding: 0 var(--navigation-column-gap) 0 0;
  }
  .page-header .page-header__navigation .main-menu:not(:has([aria-expanded=true])) {
    padding-inline-end: var(--navigation-column-gap);
  }
}
@media (min-width: 1280px) {
  :root {
    --header-block-size: 8.625rem;
  }
  .page-header .page-header__spotlight {
    block-size: max(var(--header-block-size), var(--header-spotlight-block-size));
    contain-intrinsic-size: var(--header-spotlight-inline-size) var(--header-block-size);
    display: grid;
  }
  .page-header .page-header__spotlight :-moz-any-link {
    inset: 0;
  }
  .page-header .page-header__spotlight :any-link {
    inset: 0;
  }
  .page-header .page-header__spotlight .tnds-handdrawn-arrow {
    inset-block-start: 66%;
    inset-inline-start: 7.6875rem;
  }
  .page-header .page-header__spotlight .cta-button {
    visibility: hidden;
  }
  .page-header__navigation:has(.main-menu__submenus:focus-within, .main-menu [aria-expanded=true]) .submenu--expanded {
    padding-block-end: unset;
  }
  .page-header__navigation:has(.main-menu [aria-expanded=true]) ~ .page-header__spotlight,
  .page-header__navigation:has(.main-menu__submenus:focus-within) ~ .page-header__spotlight {
    position: static;
  }
  .main-menu {
    padding: 0 var(--navigation-column-gap) 0 0;
  }
  .page-header .page-header__navigation {
    grid-column: 1/9;
  }
  .page-header .page-header__navigation .main-menu__submenus {
    background-color: var(--navigation-background-color);
    block-size: -moz-min-content;
    block-size: min-content;
    max-block-size: -moz-min-content;
    max-block-size: min-content;
  }
  .page-header .page-header__navigation .main-menu__submenus .submenu {
    block-size: -moz-min-content;
    block-size: min-content;
    grid-template-columns: repeat(3, 1fr);
  }
  .page-header .page-header__navigation .main-menu__submenus .submenu li:nth-child(3n+1) {
    padding-inline-start: 0;
  }
  .page-header .page-header__navigation .main-menu__submenus .submenu.submenu--expanded {
    display: grid;
    grid-column: 2;
    inset-block-start: auto;
    inset-inline-start: unset;
  }
  .page-header .page-header__navigation nav {
    align-items: flex-end;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(5, 1fr);
    inline-size: 100%;
    justify-content: space-between;
  }
}
.views-exposed-form.bef-exposed-form.header-search-form {
  display: flex;
  grid-column: 12/span 1;
  grid-row: 1/-1;
  justify-content: flex-end;
  z-index: 1;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  border: none;
  color: var(--text-action);
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  cursor: pointer;
  display: inline-flex;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  letter-spacing: 0.1125rem;
  margin: 0;
  padding: 0;
  text-decoration: none;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
  text-decoration-style: solid;
  text-decoration-thickness: 12%;
  text-underline-offset: 40%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-transform: uppercase;
  font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.75rem;
  line-height: 1;
  /* stylelint-disable no-duplicate-selectors */
  /* stylelint-enable no-duplicate-selectors */
}
:where(:has(.font-loaded)) .views-exposed-form.bef-exposed-form.header-search-form button.search-button {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-loaded) .views-exposed-form.bef-exposed-form.header-search-form button.search-button {
  line-height: 1;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button:hover, .views-exposed-form.bef-exposed-form.header-search-form button.search-button:focus {
  text-decoration: underline;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button {
  align-items: end;
  background-color: var(--surface-page);
  block-size: var(--header-block-size);
  inline-size: var(--header-search-button-width);
  padding-block-end: 1rem;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button > span {
  display: none;
}
@media (min-width: 768px) {
  .views-exposed-form.bef-exposed-form.header-search-form button.search-button {
    align-self: end;
    background-color: transparent;
    inset-inline-end: -1rem;
    padding-block-end: 0.5rem;
    position: relative;
  }
}
@media (min-width: 1280px) {
  .views-exposed-form.bef-exposed-form.header-search-form button.search-button {
    inline-size: auto;
    padding: 0 1rem 0.5rem;
    position: static;
  }
  .views-exposed-form.bef-exposed-form.header-search-form button.search-button > span {
    display: inline-block;
    line-height: 1.75;
  }
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button .tnds {
  color: var(--header-search-button-color, currentColor);
  flex: 1 0 1em;
}
@media (min-width: 768px) {
  .views-exposed-form.bef-exposed-form.header-search-form button.search-button .tnds {
    flex-basis: 1.5em;
    margin-inline-start: 0;
  }
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=true] .tnds-close, .views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=false] .tnds-search {
  display: block;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=false] .tnds-close, .views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=true] .tnds-search {
  display: none;
}
.views-exposed-form.bef-exposed-form.header-search-form .search-form-container {
  background: var(--text-primary);
  block-size: calc(100vh - var(--header-block-size));
  grid-template-rows: min-content;
  inline-size: 100%;
  inset-inline-start: 0;
  margin-block-start: var(--header-block-size);
  position: fixed;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  display: grid;
  grid-template-columns: 1fr min(78rem, 100% - 1rem * 2) 1fr;
}
.views-exposed-form.bef-exposed-form.header-search-form .search-form-container > * {
  grid-column: 2;
}
.views-exposed-form.bef-exposed-form.header-search-form .search-form-container > form {
  display: flex;
  justify-content: center;
  margin-block-start: 4.75rem;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button + .search-form-container {
  display: grid;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=false] + .search-form-container {
  visibility: hidden;
}
.views-exposed-form.bef-exposed-form.header-search-form button.search-button[aria-expanded=true] + .search-form-container {
  visibility: visible;
}

form[action="/search"] {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
  max-inline-size: calc(100vw - 4rem);
}
@media (min-width: 768px) {
  form[action="/search"] {
    align-items: flex-end;
    flex-direction: row;
  }
}
form[action="/search"] label {
  color-scheme: dark;
  margin-block-end: 0.5rem;
  margin-inline-start: 0.75rem;
}
form[action="/search"] .js-form-item-keywords {
  max-inline-size: unset;
  position: relative;
}
form[action="/search"] input[type=text] {
  align-items: center;
  background: var(--surface-page) url("/themes/custom/tnvacation/img/icons/tnds/search.svg");
  background-position: center right 1.5rem;
  background-repeat: no-repeat;
  background-size: 1rem;
  border: 0 none;
  border-radius: 2.25rem;
  letter-spacing: 0.1125em;
  max-inline-size: calc(100vw - 4rem);
  min-inline-size: calc(100vw - 4rem);
  padding: 1rem 4rem 1rem 1.5rem;
  position: relative;
  text-overflow: ellipsis;
  text-transform: uppercase;
  text-transform: uppercase;
  font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.75rem;
  line-height: 1;
}
:where(:has(.font-loaded)) form[action="/search"] input[type=text] {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-loaded) form[action="/search"] input[type=text] {
  line-height: 1;
}
@media (min-width: 768px) {
  form[action="/search"] input[type=text] {
    max-inline-size: unset;
    min-inline-size: 35.5rem;
  }
}
@media (min-width: 1440px) {
  form[action="/search"] input[type=text] {
    min-inline-size: 38.25rem;
  }
}
form[action="/search"] input[type=text][data-empty=false] {
  background-image: none;
}
form[action="/search"] .input-clear-button {
  background: var(--surface-page) url("/themes/custom/tnvacation/img/icons/tnds/close.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1rem;
  block-size: 2.75rem;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  inline-size: 2.75rem;
  inset-block-start: 1.625rem;
  inset-inline-end: 0.625rem;
  position: absolute;
}
form[action="/search"] input[type=text][data-empty=true] + .input-clear-button {
  display: none;
}
form[action="/search"] .form-actions {
  display: flex;
  gap: 1.25rem;
}
form[action="/search"] .form-actions input {
  background: var(--surface-primary);
  color: var(--text-primary);
  display: block;
  line-height: 1;
  margin: unset;
  position: relative;
  z-index: unset;
  text-transform: uppercase;
  font-family: Knockout53, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.875rem;
  line-height: 1.57;
}
:where(:has(.font-loaded)) form[action="/search"] .form-actions input {
  font-size-adjust: unset;
  font-stretch: unset;
  font-weight: unset;
  transform: none;
}
:has(.font-loaded) form[action="/search"] .form-actions input {
  line-height: 1.57;
}
form[action="/search"] .form-actions input[name=reset] {
  border-radius: 1.5rem;
  padding: 1rem 1.75rem;
}
:has(.font-loaded) form[action="/search"] .form-actions input {
  line-height: 1;
}
form[action="/search"]:not(:has(> details[open])) .form-submit {
  display: block;
}

.ui-widget.ui-widget-content.search-api-autocomplete-search {
  background: transparent;
  border: 0;
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item {
  background: var(--surface-primary);
  max-inline-size: calc(100% - 2rem);
  padding: 0 1.25rem;
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item:first-child {
  border-start-end-radius: 0.75rem;
  border-start-start-radius: 0.75rem;
  margin-block-start: 0.5rem;
  padding-block-start: 0.625rem;
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item:last-child {
  border-end-end-radius: 0.75rem;
  border-end-start-radius: 0.75rem;
  padding-block-end: 0.625rem;
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item > a {
  display: block;
  font-weight: 700;
  padding-block: 0.75rem;
  font-family: "DM Sans", "Trebuchet MS", Geneva, system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}
:has(.font-loaded) .ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item > a {
  line-height: 1.5;
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item > a:hover {
  background: var(--surface-secondary);
}
.ui-widget.ui-widget-content.search-api-autocomplete-search .ui-menu-item > a:hover .search-api-autocomplete-suggestion {
  background: transparent;
  color: var(--text-primary);
}
/*# sourceMappingURL=../maps/page-header/page-header.css.map */
