.elementor-kit-8{--e-global-color-primary:#2486DF;--e-global-color-secondary:#F7F1E7;--e-global-color-text:#111111;--e-global-color-accent:#F5F5F5;--e-global-color-6b48733:#0F3044;--e-global-color-8c28992:#4E4E4E;--e-global-color-482c928:#FFC737;--e-global-color-8900053:#FFFFFF;--e-global-color-64fd312:#606833;--e-global-color-fd0c4c8:#333232;--e-global-color-166ddd7:#516A7A;--e-global-color-35b7afe:#E64545;--e-global-color-acabf48:#394E44;--e-global-typography-primary-font-family:"Funnel Display";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Funnel Display";--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"DM Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"DM Sans";--e-global-typography-accent-font-weight:500;--e-global-typography-d384049-font-family:"Funnel Display";--e-global-typography-d384049-font-weight:500;--e-global-typography-f62857b-font-family:"DM Sans";--e-global-typography-f62857b-font-weight:600;--e-global-typography-01d4da0-font-family:"DM Sans";--e-global-typography-01d4da0-font-weight:300;--e-global-typography-f3df339-font-family:"DM Sans";--e-global-typography-f3df339-font-size:1.25rem;--e-global-typography-f3df339-font-weight:600;--e-global-typography-f3df339-font-style:normal;--e-global-typography-f3df339-text-decoration:none;--e-global-typography-f3df339-line-height:1.2em;--e-global-typography-a7a6221-font-family:"Funnel Display";--e-global-typography-a7a6221-font-size:5.625rem;--e-global-typography-a7a6221-font-weight:700;--e-global-typography-a7a6221-line-height:1.2em;--e-global-typography-e420bc2-font-family:"Funnel Display";--e-global-typography-e420bc2-font-size:4.375rem;--e-global-typography-e420bc2-font-weight:700;--e-global-typography-e420bc2-line-height:1.2em;--e-global-typography-14a8863-font-family:"DM Sans";--e-global-typography-14a8863-font-size:1.125rem;--e-global-typography-14a8863-font-weight:300;--e-global-typography-14a8863-line-height:1.2em;--e-global-typography-b5214bf-font-family:"DM Sans";--e-global-typography-b5214bf-font-size:1.875rem;--e-global-typography-b5214bf-font-weight:500;--e-global-typography-b5214bf-line-height:1.2em;--e-global-typography-73da314-font-family:"Funnel Display";--e-global-typography-73da314-font-size:3.3125rem;--e-global-typography-73da314-font-weight:400;--e-global-typography-73da314-line-height:1.2em;--e-global-typography-f25f094-font-family:"DM Sans";--e-global-typography-f25f094-font-size:0.875rem;--e-global-typography-f25f094-font-weight:300;--e-global-typography-f25f094-line-height:1.2em;background-color:#F7F1E7;color:var( --e-global-color-6b48733 );}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-f3df339-font-family ), Sans-serif;font-size:var( --e-global-typography-f3df339-font-size );font-weight:var( --e-global-typography-f3df339-font-weight );font-style:var( --e-global-typography-f3df339-font-style );text-decoration:var( --e-global-typography-f3df339-text-decoration );line-height:var( --e-global-typography-f3df339-line-height );color:var( --e-global-color-accent );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-primary );border-radius:0.3125rem 0.3125rem 0.3125rem 0.3125rem;padding:0.9375rem 1.5625rem 0.9375rem 1.5625rem;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-kit-8 a{color:var( --e-global-color-6b48733 );text-decoration:underline;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-8{--e-global-typography-a7a6221-font-size:3.75rem;--e-global-typography-e420bc2-font-size:3.75rem;--e-global-typography-b5214bf-font-size:1.5rem;--e-global-typography-73da314-font-size:2.875rem;}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{font-size:var( --e-global-typography-f3df339-font-size );line-height:var( --e-global-typography-f3df339-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-8{--e-global-typography-a7a6221-font-size:1.875rem;--e-global-typography-e420bc2-font-size:3.125rem;--e-global-typography-73da314-font-size:2.1875rem;}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{font-size:var( --e-global-typography-f3df339-font-size );line-height:var( --e-global-typography-f3df339-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================================
   NAC GLOBAL VARS
   ========================================================= */

:root {
  --nac-navy: rgb(15, 48, 68);
  --nac-navy-hex: #0F3044;
  --nac-sun: #FFC737;
  --nac-sky: rgb(36, 134, 223);
}

/* Keep font base predictable */
html {
  font-size: 16px;
  scrollbar-gutter: stable; /* prevents layout shift when scrollbars appear */
}

/* =========================================================
   FLUID TYPE SYSTEM
   Apply a size class to any wrapper/section, and all text inside scales.
   ========================================================= */

/* Size class definitions */
.xxxlarge { --fluid-size: clamp(3.00rem, 2.48276rem + 2.20690vw, 4.00rem); }
.xxlarge  { --fluid-size: clamp(2.50rem, 1.98276rem + 2.20690vw, 3.50rem); }
.xlarge   { --fluid-size: clamp(2.00rem, 1.48276rem + 2.20690vw, 3.00rem); }
.large    { --fluid-size: clamp(1.50rem, 0.98276rem + 2.20690vw, 2.50rem); }
.xmedium  { --fluid-size: clamp(1.25rem, 0.86207rem + 1.65517vw, 2.00rem); }
.medium   { --fluid-size: clamp(1.19rem, 1.02586rem + 0.68966vw, 1.50rem); }
.small    { --fluid-size: clamp(1.13rem, 1.06034rem + 0.27586vw, 1.25rem); }
.normal   { --fluid-size: clamp(1.00rem, 0.93276rem + 0.28690vw, 1.13rem); }
.xsmall   { --fluid-size: clamp(0.94rem, 0.90517rem + 0.13793vw, 1.00rem); }
.xxsmall  { --fluid-size: clamp(0.82rem, 0.76681rem + 0.24828vw, 0.94rem); }

/* Set line-height for all size classes */
:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall) {
  --fluid-line-height: 1.4;
}

/* =========================================================
   STANDARD ELEMENTOR ELEMENTS (General use)
   ========================================================= */

:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall)
  :is(h1, h2, h3, h4, h5, h6, p, a, li, span, button) {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* Elementor widget containers and buttons */
:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall)
  :is(.elementor-widget-container, .elementor-heading-title, .elementor-button, .elementor-button-link, .elementor-button-text) {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* Elementor N-Menu specific targeting */
:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall)
  .e-n-menu :is(.e-n-menu-title-text, .e-n-menu-title, .e-n-menu-item, .e-n-menu-toggle) {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* =========================================================
   JETENGINE LISTING GRID - DYNAMIC CONTENT
   Target text editor widgets containing JetEngine dynamic fields
   ========================================================= */

/* Target text editor widgets inside JetEngine listing grids */
.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-text-editor {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* Target the widget container when size class is on the widget wrapper */
.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-text-editor
  .elementor-widget-container {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Target actual text elements inside text editor widgets (inherits from parent) */
.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-text-editor
  :is(p, span, a, li, strong, em, div) {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* JetEngine dynamic field output - direct content */
.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall)
  :is(.jet-listing-dynamic-field__content, .jet-engine-dynamic-field__content) {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* Heading widgets in listing grids */
.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-heading {
  font-size: var(--fluid-size) !important;
  line-height: 1.2 !important;
}

.jet-listing-grid__items
  :is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-heading
  .elementor-heading-title {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* =========================================================
   FALLBACK - Size class directly on widget wrapper
   (Works for both regular pages and listing grids)
   ========================================================= */

:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-text-editor,
:is(.xxxlarge, .xxlarge, .xlarge, .large, .xmedium, .medium, .small, .normal, .xsmall, .xxsmall).elementor-widget-heading {
  font-size: var(--fluid-size) !important;
  line-height: var(--fluid-line-height) !important;
}

/* =========================================================
   2) BUTTON ICON MICRO-ANIMATION
   ========================================================= */

.btn-arrow-move .elementor-button-icon{
  transition: transform 0.25s cubic-bezier(.4,0,.2,1);
}
.btn-arrow-move:hover .elementor-button-icon{
  transform: translateX(4px);
}

/* =========================================================
   3) MAIN HEADER (PRIMARY) BACKGROUND ON MEGA OPEN
   Scoped to .nac-header only.
   ========================================================= */

.nac-header{
  transition: background-color 0.2s ease;
}
.nac-header:has(.e-n-menu-dropdown-icon[aria-expanded="true"]){
  background-color: var(--nac-navy);
}

/* =========================================================
   4) MEGA MENU DROPDOWN LAYOUT SAFETY
   Prevent horizontal overflow when menus stretch.
   Keep dropdown content boxed to 1200px.
   ========================================================= */

/* Only when a mega menu is open: prevent horizontal scrollbar */
body:has(.nac-header .e-n-menu-dropdown-icon[aria-expanded="true"]),
body:has(.nac-header-secondary .e-n-menu-dropdown-icon[aria-expanded="true"]){
  overflow-x: clip;
}
@supports not (overflow: clip){
  body:has(.nac-header .e-n-menu-dropdown-icon[aria-expanded="true"]),
  body:has(.nac-header-secondary .e-n-menu-dropdown-icon[aria-expanded="true"]){
    overflow-x: hidden;
  }
}

/* Box the dropdown content (works for boxed containers and inner wrapper) */
.nac-header .e-n-menu-content > .e-con,
.nac-header-secondary .e-n-menu-content > .e-con,
.nac-header .e-n-menu-content > .e-con > .e-con-inner,
.nac-header-secondary .e-n-menu-content > .e-con > .e-con-inner{
  width: min(1200px, 100%);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* Ensure nothing inside can force overflow */
.nac-header .e-n-menu-content,
.nac-header-secondary .e-n-menu-content,
.nac-header .e-n-menu-content *,
.nac-header-secondary .e-n-menu-content *{
  box-sizing: border-box;
}

/* =========================================================
   5) MEGA MENU CARDS (IMAGE + ARROW + LABEL)
   Applies only to your cards via .nac-mega-card.
   ========================================================= */

/* Base card layout */
.e-n-menu-content a.nac-mega-card{
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr; /* icon left, text right */
  grid-template-rows: auto auto;   /* image row, label row */
  row-gap: 0.5rem;                 /* image -> label rhythm */
  overflow: hidden;
  text-decoration: none;
  align-items: start;
}

/* Normalise spacing inside cards so Elementor per-widget padding can’t break one card but not another */
.e-n-menu-content a.nac-mega-card .elementor-widget{
  margin: 0 !important;
}
.e-n-menu-content a.nac-mega-card :is(.elementor-widget-icon,.elementor-widget-heading,.elementor-widget-image){
  padding: 0 !important;
}
.e-n-menu-content a.nac-mega-card .elementor-icon-wrapper{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* Image spans full width */
.e-n-menu-content a.nac-mega-card .elementor-widget-image{
  grid-column: 1 / -1;
  grid-row: 1;
}
.e-n-menu-content a.nac-mega-card .elementor-widget-image img{
  display: block;
  width: 100%;
  height: auto;
  transform: scale(1);
  transition: transform 0.35s ease;
  will-change: transform;
}
.e-n-menu-content a.nac-mega-card:hover .elementor-widget-image img{
  transform: scale(1.08);
}

/* Heading */
.e-n-menu-content a.nac-mega-card .elementor-widget-heading{
  grid-column: 2;
  grid-row: 2;
  align-self: center;
}
.e-n-menu-content a.nac-mega-card .elementor-heading-title{
  display: inline-block;
  transform: translateX(0);
  transition: transform 0.25s ease, color 0.25s ease;
}

/* Icon (arrow) */
.e-n-menu-content a.nac-mega-card .elementor-widget-icon{
  grid-column: 1;
  grid-row: 2;
  align-self: center;
  opacity: 0;
  width: 0;
  overflow: hidden;
  transform: translateX(-24px);
  transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
  pointer-events: none;
}

/* Make SVG inherit colour cleanly */
.e-n-menu-content a.nac-mega-card .elementor-icon{ color: inherit; }
.e-n-menu-content a.nac-mega-card svg{
  fill: currentColor;
  stroke: currentColor;
}

/* Card hover behaviour */
.e-n-menu-content a.nac-mega-card:hover .elementor-widget-icon{
  opacity: 1;
  width: auto;
  transform: translateX(0);
  color: var(--nac-sky);
}
.e-n-menu-content a.nac-mega-card:hover .elementor-heading-title{
  transform: translateX(24px);
  color: var(--nac-sky);
}

/* =========================================================
   6) SECONDARY HEADER (menu_secondary_template)
   Everything here is scoped to .nac-header-secondary only.
   ========================================================= */

.nac-header-secondary{
  --nac-navy-local: var(--nac-navy-hex);
}

/* Smooth transitions on key parts */
.nac-header-secondary,
.nac-header-secondary img,
.nac-header-secondary .elementor-button,
.nac-header-secondary .elementor-widget-icon,
.nac-header-secondary .e-n-menu-title-text,
.nac-header-secondary .e-n-menu-dropdown-icon svg,
.nac-header-secondary .e-n-menu-toggle-icon svg{
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    fill 0.2s ease,
    filter 0.2s ease,
    border-color 0.2s ease;
}

/* ---------- 6A) CLOSED (NORMAL) STATE COLOURS ---------- */

/* Menu items */
.nac-header-secondary :is(.e-n-menu-title-text,.e-n-menu-title,.e-n-menu-title a){
  color: var(--nac-navy-local);
}

/* WhatsApp icon */
.nac-header-secondary .nac-header-whatsapp .elementor-icon{ color: var(--nac-navy-local); }
.nac-header-secondary .nac-header-whatsapp .elementor-icon svg{ fill: var(--nac-navy-local); }

/* Bars icon */
.nac-header-secondary .nac-header-bars .elementor-icon svg{ fill: var(--nac-navy-local); }

/* ---------- 6B) OPEN STATE TRIGGER (ANY DROPDOWN EXPANDED) ---------- */

.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"]){
  background-color: var(--nac-navy);
}

/* Logo to white (only logo widget) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-logo img{
  filter: brightness(0) invert(1);
}

/* Never invert mega card images */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-mega-card img{
  filter: none;
}

/* Menu items to white (including hover/focus/current) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
:is(.e-n-menu-title,.e-n-menu-title a,.e-n-menu-title-text){
  color: #fff;
}

/* Keep top-level colours via Elementor vars (fixes stubborn items) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
:is(.elementor-widget-n-menu,.elementor-widget-mega-menu,.e-n-menu){
  --e-nav-menu-text-color: #fff;
  --e-nav-menu-text-hover-color: #fff;
  --e-nav-menu-text-active-color: #fff;
  --n-menu-title-color: #fff;
  --n-menu-title-hover-color: #fff;
  --n-menu-title-active-color: #fff;

  --e-nav-menu-divider-color: #fff;
  --e-nav-menu-border-color: #fff;
  --e-nav-menu-hover-border-color: #fff;
  --e-nav-menu-active-border-color: #fff;
  --n-menu-underline-color: #fff;
  --n-menu-hover-underline-color: #fff;
  --n-menu-active-underline-color: #fff;
}

/* Hard fallback if Elementor still outputs a strong .elementor-kit-8 */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.e-n-menu-heading > .e-n-menu-item :is(.e-n-menu-title,.e-n-menu-title a,.e-n-menu-title-text){
  color: #fff !important;
}

/* Icons to white in open state */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-whatsapp .elementor-icon{ color: #fff; }
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-whatsapp .elementor-icon svg{ fill: #fff; }
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-bars .elementor-icon svg{ fill: #fff; }

/* CTA button styles in open state */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-cta .elementor-button{
  background-color: var(--nac-sun);
  border-color: var(--nac-sun);
}
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-cta :is(.elementor-button-text,.elementor-button-icon){
  color: var(--nac-navy);
}
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-header-cta .elementor-button-icon svg{
  fill: var(--nac-navy);
}

/* Mega card arrows stay sky in open state (not white) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-mega-card .elementor-widget-icon .elementor-icon{
  color: var(--nac-sky);
}
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.nac-mega-card .elementor-widget-icon .elementor-icon svg{
  fill: var(--nac-sky);
}

/* ---------- 6C) DROPDOWN CHEVRON COLOUR (HOVER + OPEN) ---------- */

/* Hover any menu item: chevron turns white */
.nac-header-secondary .e-n-menu-item:hover :is(
  .e-n-menu-dropdown-icon,
  .e-n-menu-dropdown-icon-opened,
  .e-n-menu-dropdown-icon-closed,
  .e-n-menu-dropdown-icon svg
){
  color: #fff;
  fill: #fff;
}
.nac-header-secondary .e-n-menu-item:hover .e-n-menu-dropdown-icon svg path{
  fill: currentColor;
}

/* Open state: chevron stays white */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
:is(
  .e-n-menu-dropdown-icon,
  .e-n-menu-dropdown-icon-opened,
  .e-n-menu-dropdown-icon-closed,
  .e-n-menu-dropdown-icon svg
){
  color: #fff;
  fill: #fff;
}
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.e-n-menu-dropdown-icon svg path{
  fill: currentColor;
}

/* ---------- 6D) UNDERLINE SYSTEM (SINGLE METHOD, TEXT-ONLY) ---------- */

/*
  Goal:
  - No “flash” underline under text + arrow
  - Only underline the text span (.e-n-menu-title-text)
  - Closed: Navy underline
  - Open: White underline
  - Closed + non-dropdown items: 2px underline (Surf Hire / Training)
*/

/* Kill underline on wrappers (prevents the full-length flash) */
.nac-header-secondary :is(.e-n-menu-title,.e-n-menu-title-container){
  border-bottom: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.nac-header-secondary :is(.e-n-menu-title::after,.e-n-menu-title-container::after){
  content: none !important;
  background: none !important;
}

/* Base reset on text span */
.nac-header-secondary .e-n-menu-title-text{
  border-bottom: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Also disable common Elementor underline pseudo-elements (secondary “extra line”) */
.nac-header-secondary .e-n-menu-title-text::after,
.nac-header-secondary .e-n-menu-title-container::after{
  content: none !important;
}

/* CLOSED state: text-only underline (default 1px Navy) */
.nac-header-secondary:not(:has(.e-n-menu-dropdown-icon[aria-expanded="true"]))
.e-n-menu-title:is(:hover,:focus-within) .e-n-menu-title-text{
  box-shadow: inset 0 -1px 0 0 var(--nac-navy-local) !important;
}

/* CLOSED state: non-dropdown items get 2px underline (Surf Hire / Training) */
.nac-header-secondary:not(:has(.e-n-menu-dropdown-icon[aria-expanded="true"]))
.e-n-menu-heading > .e-n-menu-item:not(:has(.e-n-menu-dropdown-icon))
.e-n-menu-title:is(:hover,:focus-within) .e-n-menu-title-text{
  box-shadow: inset 0 -2px 0 0 var(--nac-navy-local) !important;
}

/* OPEN state: text-only underline (White, 1px) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.e-n-menu-title:is(:hover,:focus-within) .e-n-menu-title-text{
  box-shadow: inset 0 -1px 0 0 #fff !important;
}

/* OPEN state: keep current/active underline white (optional but usually desired) */
.nac-header-secondary:has(.e-n-menu-dropdown-icon[aria-expanded="true"])
.e-n-menu-heading > .e-n-menu-item:is(.current-menu-item,.current-menu-ancestor)
.e-n-menu-title-text{
  box-shadow: inset 0 -1px 0 0 #fff !important;
}


/* Header Arrow Effect */

/* =========================================================
   NAC INLINE HEADING + ARROW HOVER (FINAL – SKY ONLY)
   ---------------------------------------------------------
   Apply PER ITEM (not on the whole menu):

   Pair container (wrap ONLY arrow + heading):
     nac-hover-arrow__pair
     nac-hover-arrow--sky

   Arrow icon widget:
     nac-hover-arrow__icon

   Heading widget:
     nac-hover-arrow__text
   ========================================================= */

:root{
  --nac-sky-hex: #2486DF;

  --nac-hover-icon-offset: -16px; /* slide-in distance */
  --nac-hover-icon-width: 24px;   /* visual arrow width */
  --nac-hover-gap: 0.4rem;          /* gap between arrow + text */
}

/* ---------------------------------------------------------
   PAIR WRAPPER (interaction boundary)
   --------------------------------------------------------- */
.nac-hover-arrow__pair{
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
}

/* ---------------------------------------------------------
   TEXT (flush in normal state)
   --------------------------------------------------------- */
.nac-hover-arrow__pair .nac-hover-arrow__text{
  margin: 0 !important;
}

.nac-hover-arrow__pair .nac-hover-arrow__text .elementor-heading-title{
  display: inline-block;
  transform: translateX(0);
  transition: transform 0.25s ease, color 0.25s ease;
}

/* ---------------------------------------------------------
   ICON (removed from layout flow)
   --------------------------------------------------------- */
.nac-hover-arrow__pair .nac-hover-arrow__icon{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(var(--nac-hover-icon-offset));
  opacity: 0;
  transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
  pointer-events: none;
}

/* Tidy Elementor icon internals */
.nac-hover-arrow__pair .nac-hover-arrow__icon .elementor-icon-wrapper{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  display: flex;
  align-items: center;
}

/* SVG inherits colour */
.nac-hover-arrow__pair .nac-hover-arrow__icon .elementor-icon{
  color: inherit;
}
.nac-hover-arrow__pair .nac-hover-arrow__icon svg{
  fill: currentColor;
  stroke: currentColor;
}

/* ---------------------------------------------------------
   INTERACTION (per item only)
   --------------------------------------------------------- */
.nac-hover-arrow__pair:hover .nac-hover-arrow__icon,
.nac-hover-arrow__pair:focus-within .nac-hover-arrow__icon{
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.nac-hover-arrow__pair:hover .nac-hover-arrow__text .elementor-heading-title,
.nac-hover-arrow__pair:focus-within .nac-hover-arrow__text .elementor-heading-title{
  transform: translateX(calc(var(--nac-hover-icon-width) + var(--nac-hover-gap)));
}

/* ---------------------------------------------------------
   SKY VARIANT (single source of truth)
   --------------------------------------------------------- */
.nac-hover-arrow__pair.nac-hover-arrow--sky:hover .nac-hover-arrow__icon,
.nac-hover-arrow__pair.nac-hover-arrow--sky:focus-within .nac-hover-arrow__icon,
.nac-hover-arrow__pair.nac-hover-arrow--sky:hover .nac-hover-arrow__text .elementor-heading-title,
.nac-hover-arrow__pair.nac-hover-arrow--sky:focus-within .nac-hover-arrow__text .elementor-heading-title{
  color: var(--nac-sky-hex);
}

/* =========================================================
   NAC FOOTER TEXT LINKS
   ---------------------------------------------------------
   - Normal state: white text, no underline
   - Hover/focus: white text, underline appears
   - Scoped to footer only via .nac-footer
   ========================================================= */

.nac-footer .elementor-widget-text-editor a{
  color: #ffffff;
  text-decoration: none;
  transition: text-decoration-color 0.2s ease;
}

/* Hover + keyboard accessibility */
.nac-footer .elementor-widget-text-editor a:hover,
.nac-footer .elementor-widget-text-editor a:focus-visible{
  color: #ffffff;
  text-decoration: underline;
}

/* Prevent Elementor hover colour overrides */
.nac-footer .elementor-widget-text-editor a:hover,
.nac-footer .elementor-widget-text-editor a:focus-visible{
  background: none;
}

/* Optional: keep underline clean (no thickness jump) */
.nac-footer .elementor-widget-text-editor a{
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
}

/* =========================================================
   NAC FOOTER NEWSLETTER SIGNUP (Fluent Forms #3)
   ---------------------------------------------------------
   - Submit button sits INSIDE the email input
   - Icon-only submit (no chrome)
   - Visually centred with a small optical offset
   Scoped to footer via .nac-footer
   ========================================================= */

:root{
  --nac-footer-input-right-pad: 5.25rem; /* space inside input for button */
  --nac-footer-button-inset: 0.375rem;   /* right inset from input edge */
  --nac-footer-icon-size: 2.5rem;        /* arrow size */
  --nac-footer-optical-y: 9px;           /* optical centring tweak */
}

/* Email input: full width, with room for the overlaid button */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 input[type="email"].ff-el-form-control{
  width: 100%;
  box-sizing: border-box;
  padding-right: var(--nac-footer-input-right-pad);
}

/* Anchor + height context for the overlay */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .ff-el-input--content{
  position: relative;
  display: flex;
  align-items: center;
}

/* Submit wrapper: overlaid inside the input, vertically centred */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .footer__email_submit--container{
  position: absolute;
  right: var(--nac-footer-button-inset);
  top: 50%;
  transform: translateY(calc(-50% + var(--nac-footer-optical-y)));
  z-index: 5;

  margin: 0;
  padding: 0;
  background: transparent;
}

/* Submit button: round, icon-only, fills available height */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .footer__email_submit--container button.ff-btn-submit{
  height: calc(100% - (var(--nac-footer-button-inset) * 2));
  aspect-ratio: 1 / 1;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0;
  margin: 0;

  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  outline: 0;

  cursor: pointer;
  appearance: none;
}

/* Keep hover/focus clean (no chrome) */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .footer__email_submit--container button.ff-btn-submit:hover,
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .footer__email_submit--container button.ff-btn-submit:focus-visible{
  background: transparent;
  box-shadow: none;
  outline: none;
}

/* Arrow sizing */
.nac-footer .fluentform_wrapper_3 form.fluent_form_3 .footer__email_submit--container button.ff-btn-submit img{
  width: var(--nac-footer-icon-size);
  height: var(--nac-footer-icon-size);
  max-width: none;
  display: block;
}

/* =========================================================
   Container Dual Gradients
   ========================================================= */
/* 1. Define the variables for easy tweaking */
.dual-gradient-overlay {
    position: relative;
    --gradient-start: 77%;
    --gradient-end: 100%;
    --overlay-opacity: 0.5;
}

/* 2. Common styles for both gradients */
.dual-gradient-overlay::before,
.dual-gradient-overlay::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%; /* Adjust height if you don't want them to cover the full container */
    pointer-events: none; /* Allows clicks to pass through to content */
    opacity: var(--overlay-opacity);
    z-index: -1;
}

/* 3. Top Gradient (#0F304480) */
.dual-gradient-overlay::before {
    top: 0;
    background: linear-gradient(0deg, transparent var(--gradient-end), #0F304480 var(--gradient-start));
}

/* 4. Bottom Gradient (Black) */
.dual-gradient-overlay::after {
    bottom: 0;
    background: linear-gradient(180deg, transparent var(--gradient-start), #000000 var(--gradient-end));
}

/* =========================================================
   HERO INFO – Tablet & Mobile overrides
   ---------------------------------------------------------
   - Background switches to white
   - All text + icons switch to rgba(17,17,17,1)
   - Includes JetEngine Dynamic Fields
   - Text Editor widgets remain transparent
   ========================================================= */

@media (max-width: 1024px){

  /* Container background */
  .hero-info{
    background-color: #fff;
    border-radius: 12px;
  }

  /* Base text colour */
  .hero-info,
  .hero-info *{
    color: rgba(17, 17, 17, 1);
  }

  /* Ensure Elementor Text Editor widgets stay transparent */
  .hero-info .elementor-widget-text-editor{
    background: transparent !important;
  }

  /* SVG / icon inheritance fix */
  .hero-info svg,
  .hero-info svg *{
    fill: currentColor;
    stroke: currentColor;
  }

  /* JetEngine Dynamic Field overrides */
  .hero-info :is(
    .jet-engine-dynamic-field,
    .jet-listing-dynamic-field,
    .jet-engine-dynamic-field__content,
    .jet-listing-dynamic-field__content,
    .jet-engine-dynamic-field__label,
    .jet-listing-dynamic-field__label,
    .jet-engine-dynamic-field__value,
    .jet-listing-dynamic-field__value,
    .jet-engine-dynamic-field__link,
    .jet-listing-dynamic-field__link
  ){
    color: rgba(17, 17, 17, 1) !important;
  }

  /* JetEngine SVGs */
  .hero-info :is(
    .jet-engine-dynamic-field,
    .jet-listing-dynamic-field
  ) svg,
  .hero-info :is(
    .jet-engine-dynamic-field,
    .jet-listing-dynamic-field
  ) svg *{
    fill: currentColor !important;
    stroke: currentColor !important;
  }
}

/* =========================================================
   ELEMENTOR TEXT EDITOR – Global spacing reset
   ---------------------------------------------------------
   Normalises default <p> spacing in Text Editor widgets.
   Can still be overridden via Elementor widget settings.
   ========================================================= */

.elementor-widget-text-editor,
.elementor-widget-text-editor p{
  margin: 0;
  padding: 0;
}

/* Animate the 3 message dots on Elementor button hover */
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(5),
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(4),
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(3){
  opacity: .25;
  transform-box: fill-box;
  transform-origin: center;
  animation: nacDotPulse 1.0s infinite;
}

/* Left dot (3rd path in the SVG) */
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(5){
  animation-delay: 0s;
}

/* Middle dot (4th path) */
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(4){
  animation-delay: .2s;
}

/* Right dot (5th path) */
.elementor-widget-button .elementor-button:hover svg path:nth-of-type(3){
  animation-delay: .4s;
}

@keyframes nacDotPulse{
  0%, 80%, 100% { opacity: .25; transform: scale(1); }
  20% { opacity: 1; transform: scale(1.25); }
}
/* ==================================
   Arrow bullet list (SVG bullets)
   ================================== */

.nac-arrow-list{
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}

.nac-arrow-list li{
  position: relative;
  padding-left: 1.75rem; /* space for arrow */
  margin-bottom: 0.5rem;
}

.nac-arrow-list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em; /* aligns with text nicely */
  width: 1rem;
  height: 1rem;
  background-image: url("https://jfoq6t3y19.onrocket.site/wp-content/uploads/bullet-arrow-right.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

/* JetTabs accordion titles: force xmedium fluid size */
.jet-accordion .jet-toggle__label-text{
  --fluid-size: clamp(1.25rem, 0.86207rem + 1.65517vw, 2.00rem); /* xmedium */
  font-size: var(--fluid-size) !important;
  line-height: 1.4 !important;
  font-weight: 500;
  margin: 0; /* reset native h3 margin */
}

/* =========================================================
   NAC INLINE HEADING + ARROW HOVER (RIGHT ARROW, NAVY, NO COLOUR CHANGE)
   ---------------------------------------------------------
   Use this when you want the arrow to appear on the RIGHT of the text.

   Pair container (wrap ONLY heading + arrow):
     nac-hover-arrow-r__pair

   Heading widget:
     nac-hover-arrow-r__text

   Arrow icon widget:
     nac-hover-arrow-r__icon

   Notes:
   - Arrow is hidden in normal state, appears on hover/focus-within
   - No colour change (inherits whatever navy styling you already apply)
   - Keeps layout stable by reserving arrow space
   ========================================================= */

:root{
  --nac-hover-r-icon-offset: -10px; /* slide-in distance from the right */
  --nac-hover-r-icon-width: 24px;   /* visual arrow width */
  --nac-hover-r-gap: 1rem;          /* gap between text and arrow */
}

/* ---------------------------------------------------------
   PAIR WRAPPER
   --------------------------------------------------------- */
.nac-hover-arrow-r__pair{
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
}

/* ---------------------------------------------------------
   TEXT (stays put, no colour changes)
   --------------------------------------------------------- */
.nac-hover-arrow-r__pair .nac-hover-arrow-r__text{
  margin: 0 !important;
}

.nac-hover-arrow-r__pair .nac-hover-arrow-r__text .elementor-heading-title{
  display: inline-block;
  transition: none;
}

/* ---------------------------------------------------------
   ICON (keeps space reserved so text doesn't jump)
   Hidden via opacity + slight translate
   --------------------------------------------------------- */
.nac-hover-arrow-r__pair .nac-hover-arrow-r__icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: var(--nac-hover-r-icon-width);
  margin-left: var(--nac-hover-r-gap);

  opacity: 0;
  transform: translateX(var(--nac-hover-r-icon-offset));
  transition: transform 0.25s ease, opacity 0.25s ease;

  pointer-events: none;
}

/* Tidy Elementor icon internals */
.nac-hover-arrow-r__pair .nac-hover-arrow-r__icon .elementor-icon-wrapper{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  display: flex;
  align-items: center;
}

/* SVG inherits colour (navy comes from your existing styling) */
.nac-hover-arrow-r__pair .nac-hover-arrow-r__icon .elementor-icon{
  color: inherit;
}
.nac-hover-arrow-r__pair .nac-hover-arrow-r__icon svg{
  fill: currentColor;
  stroke: currentColor;
}

/* ---------------------------------------------------------
   INTERACTION
   --------------------------------------------------------- */
.nac-hover-arrow-r__pair:hover .nac-hover-arrow-r__icon,
.nac-hover-arrow-r__pair:focus-within .nac-hover-arrow-r__icon{
  opacity: 1;
  transform: translateX(0);
}

/* =========================================================
   NAC BUTTON – RIGHT ARROW (ALWAYS VISIBLE, NUDGE ON HOVER)
   ---------------------------------------------------------
   Elementor Button widget
   - Arrow always visible
   - Arrow nudges right on hover
   - Text never moves
   - No colour change
   ========================================================= */

:root{
  --nac-btn-arrow-nudge: 6px;   /* how far arrow moves on hover */
  --nac-btn-arrow-gap: 0rem; /* space between text and arrow */
}

/* Button layout */
.nac-btn-arrow-right .elementor-button-content-wrapper{
  display: inline-flex;
  align-items: center;
}

/* Text stays static */
.nac-btn-arrow-right .elementor-button-text{
  display: inline-block;
}

/* Arrow icon (visible by default) */
.nac-btn-arrow-right .elementor-button-icon{
  display: inline-flex;
  align-items: center;

  margin-left: var(--nac-btn-arrow-gap);

  transform: translateX(0);
  transition: transform 0.25s ease;

  pointer-events: none;
}

/* SVG inherits button colour */
.nac-btn-arrow-right .elementor-button-icon svg{
  fill: currentColor;
  stroke: currentColor;
}

/* Hover / focus */
.nac-btn-arrow-right:hover .elementor-button-icon,
.nac-btn-arrow-right:focus-within .elementor-button-icon{
  transform: translateX(var(--nac-btn-arrow-nudge));
}

/* =========================================================
   NAC SPLIT HERO – ANGLED CENTRE DIVIDER ONLY
   ---------------------------------------------------------
   - Outer edges stay straight + rounded via Elementor
   - Only the centre divider is angled
   - No transform on the actual columns
   ========================================================= */

:root{
  --nac-split-angle: -6deg;     /* diagonal tilt */
  --nac-split-width: 80px;      /* thickness of diagonal wedge */
}

/* Outer wrapper just crops overflow */
.nac-split-hero{
  position: relative;
  overflow: hidden;
}

/* Ensure columns stretch full height */
.nac-split-hero,
.nac-split-hero .e-con-inner{
  align-items: stretch;
}

/* LEFT PANEL */
.nac-split-hero__left{
  position: relative;
  z-index: 1;
}

/* Diagonal wedge (creates the angled centre edge) */
.nac-split-hero__left::after{
  content: "";
  position: absolute;
  top: -20%;
  right: calc(-1 * (var(--nac-split-width) / 2));
  width: var(--nac-split-width);
  height: 140%;

  background: inherit;

  transform: skewX(var(--nac-split-angle));
  transform-origin: center;

  pointer-events: none;
  z-index: 2;
}

/* RIGHT PANEL sits behind the wedge */
.nac-split-hero__right{
  position: relative;
  z-index: 0;
}

/* If using an Image widget inside the right panel */
.nac-split-hero__right img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Mobile: remove diagonal, stack cleanly */
@media (max-width: 767px){
  .nac-split-hero__left::after{
    content: none;
  }
}

/* =========================================================
   MOBILE-ONLY SHAPE DIVIDER (SCOPED)
   ========================================================= */

.nac-split-hero__right .elementor-shape.elementor-shape-top{
  display: none;
}

@media (max-width: 767px){
  .nac-split-hero__right .elementor-shape.elementor-shape-top{
    display: block;
  }
}

/* =========================================================
   NAC – OFFER PILL WIDTH
   ========================================================= */

.pill{
  width: fit-content;
  display: inline-flex;
  flex: 0 0 auto;
  max-width: 100%;
}

/* =========================================================
   NAC – LINKED CONTAINER WITH NO TEXT HOVER EFFECTS
   ========================================================= */

.nac-no-link-hover,
.nac-no-link-hover *{
  text-decoration: none !important;
}

/* Kill Elementor heading/text underline tricks */
.nac-no-link-hover :is(
  a,
  a:hover,
  a:focus,
  a:active,
  .elementor-heading-title,
  .elementor-widget-text-editor
){
  text-decoration: none !important;
  box-shadow: none !important;
}

/* Prevent hover underline from container link */
.nac-no-link-hover:hover *{
  text-decoration: none !important;
  box-shadow: none !important;
}

/* =========================================================
   JETENGINE LISTING GRID – STAGGER COLUMN 2 UP
   Add class: staggered-grid
   ========================================================= */

.staggered-grid{
  --stagger-offset: 3rem;
}

/* Desktop 3-col pattern: items 2,5,8... are column 2 */
.staggered-grid .jet-listing-grid__items > .jet-listing-grid__item:nth-child(3n+2){
  transform: translateY(calc(-1 * var(--stagger-offset)));
}

/* Optional: helps avoid any “tight” overlaps if your row-gap is small */
.staggered-grid .jet-listing-grid__items{
  row-gap: calc(var(--stagger-offset) + var(--jet-row-gap, 0px));
}

/* =========================================================
   RESPONSIVE
   If your tablet is 2 columns: items 2,4,6... are column 2
   ========================================================= */

@media (max-width: 1024px){
  .staggered-grid .jet-listing-grid__items > .jet-listing-grid__item{
    transform: none;
  }

  /* Only enable this if your tablet layout is actually 2 columns */
  .staggered-grid.grid-col-tablet-2 .jet-listing-grid__items > .jet-listing-grid__item:nth-child(2n){
    transform: translateY(calc(-0.66 * var(--stagger-offset)));
  }
}

/* Mobile: 1 column, no stagger */
@media (max-width: 768px){
  .staggered-grid .jet-listing-grid__items > .jet-listing-grid__item{
    transform: none !important;
  }
}


/* =========================================================
   NAC – JetSmartFilters: INLINE label + options
   Add class to the widget: nac-filter-inline
   ========================================================= */

/* Put label + list on one row */
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter{
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
}

/* Stop the label dropping / wrapping oddly */
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter .jet-filter-label{
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Make the checkbox list sit inline (Jet outputs fieldset/rows) */
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter .jet-checkboxes-list{
  display: flex !important;
  align-items: center !important;
}

/* Fieldset wrapper is the usual culprit (block layout) */
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter .jet-checkboxes-list-wrapper{
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;

  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  min-inline-size: 0 !important;
}

/* Each option row inline */
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter .jet-checkboxes-list__row{
  margin: 0 !important;
}
.nac-filter-inline .jet-smart-filters-checkboxes.jet-filter .jet-checkboxes-list-wrapper{
  flex-wrap: nowrap !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* =========================================================
   NAC – Yellow skew word highlight
   ========================================================= */
.highlight-bg{
  position: relative;
  display: inline-block;
  z-index: 0;

  /* creates a guaranteed safe zone between glyphs and the background */
  padding: 0.10em 0.22em 0.10em 0.22em;

  /* optional: keeps your slight overlap effect with the previous word */
  margin-left: 0.1em;
}

.highlight-bg::before{
  content: "";
  position: absolute;
  inset: 0;                 /* background matches padded box */
  background: #FFC83D;
  transform: skew(8deg);
  z-index: -1;
  border-radius: 2px;

  /* rendering stability */
  backface-visibility: hidden;
  will-change: transform;
}
.highlight-bg--blue{
  color: #ffffff;
}

.highlight-bg--blue::before{
  background: #2486DF;
}

/* =========================================================
   REMOVE UNDERLINES FROM ALL LISTING GRID LINKS
   ========================================================= */

.jet-listing-grid a,
.jet-listing-grid a:link,
.jet-listing-grid a:visited,
.jet-listing-grid a:hover,
.jet-listing-grid a:active,
.jet-listing-grid a:focus{
  text-decoration: none !important;
}

/* Also prevent nested elements inheriting underline */
.jet-listing-grid a *{
  text-decoration: none !important;
}

/* =========================================================
   LISTING CARD – BACKGROUND IMAGE GROW ON HOVER (ROBUST)
   Add class: hover-grow-bg to the container that has the BG
   ========================================================= */

.hover-grow-bg{
  position: relative;
  overflow: hidden;
}

/* Create a layer that inherits the parent's background-image */
.hover-grow-bg::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: inherit;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1);
  transition: transform .7s ease;
  will-change: transform;
  z-index: 0;
}

/* Ensure the card content sits above the zooming background */
.hover-grow-bg > *{
  position: relative;
  z-index: 1;
}

/* Trigger zoom */
.hover-grow-bg:hover::before,
.hover-grow-bg:focus-visible::before{
  transform: scale(1.08);
}

/* NAC card background zoom (Elementor container background on the element itself) */
a.nac-card-bgzoom{
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important; /* baseline */
  transition: background-size .7s ease, background-position .7s ease;
  overflow: hidden; /* safe if you have overlays etc */
}

/* Hover/focus zoom */
a.nac-card-bgzoom:hover,
a.nac-card-bgzoom:focus-visible{
  background-size: 108% 108% !important;
  background-position: center !important;
}
/* =========================================================
   NAC CARD – SVG OVERLAY ON HOVER
   ========================================================= */

a.nac-card-bgzoom{
  position: relative;
  overflow: hidden;
}

/* SVG overlay */
a.nac-card-bgzoom::after{
  content: "";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;

  background-image: url("https://jfoq6t3y19.onrocket.site/wp-content/uploads/learn-more-icon.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 120px;

  opacity: 0;
  transform: scale(.85);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
  z-index: 2;
}

/* Show on hover */
a.nac-card-bgzoom:hover::after,
a.nac-card-bgzoom:focus-visible::after{
  opacity: 1;
  transform: scale(1);
}

/* Himan - Start */
.remove-underline a, a.remove-underline {
    text-decoration: none !important;
}

.display-items .jet-listing-grid__item {
    display: block !important;
}

.active[data-faq-target] {
    background-color: var(--e-global-color-6b48733) !important;
    color: var(--e-global-color-8900053) !important;
    border-color: var(--e-global-color-6b48733) !important;
}

.btn-arrow-animation .elementor-button-icon {
    transition: transform 300ms ease;
}

.btn-arrow-animation:hover .elementor-button-icon {
    transform: translateX(0.2em);
}

.btn-small-icon .elementor-button-icon {
    font-size: 0.5em;
}

strong {
    font-weight: 600 !important;
}

.card-activity-small .card-activity-small--title {
    transition: color 400ms ease;
}

.card-activity-small .card-activity-small--img img {
    transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.card-activity-small:hover .card-activity-small--title {
    color: var( --e-global-color-primary );
}

.card-activity-small:hover .card-activity-small--img img {
    transform: scale(1.15);
}

/* Highlight */
.z-10 {
    position: relative;
    z-index: 10;
}

.highlight-lessons{
  position: relative;
  display: inline-block;
  z-index: 0;
}

.highlight-lessons::before{
  content: "";
  position: absolute;
  inset: 0;
  background: #FFC83D;
  transform: skew(25deg) translateY(-50%) rotate(-1deg);
  z-index: -1;
  border-radius: 2px;
  backface-visibility: hidden;
  will-change: transform;
  width: 110%;
  left: 0%;
  top: 50%;
  height: 100%;
}

.highlight-lessons.blue {
    color: #ffffff;
}

.highlight-lessons.blue::before {
    background: #2486DF;
}

.highlight-lessons--sky {
  color: #ffffff;
}

.highlight-lessons--sky::before {
  background: #2486DF;
   will-change: transform;
  width: 120%;
  left: 0%;
  top: 50%;
  height: 100%;/* NAC Sky */
}

/* Top Activity Section */
.card-top-activity .card-top-activity--img img {
    transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.card-top-activity .card-top-activity--learn-more img {
    opacity: 0;
    transform: scale(0);
    transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 400ms ease;
}

.card-top-activity:hover .card-top-activity--img img {
    transform: scale(1.15);
}

.card-top-activity:hover .card-top-activity--learn-more img {
    opacity: 1;
    transform: scale(1);
}

/* Activity Section */
.card-activity .card-activity--title {
    margin-left: -30px;
    transition: margin 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.card-activity .card-activity--img img {
    transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

[data-elementor-device-mode="tablet"] .card-activity--title {
    margin-left: -30px;
}

[data-elementor-device-mode="mobile"] .card-activity--title {
    margin-left: -28px;
}

.card-activity:hover .card-activity--title {
    margin-left: 0px;
}

.card-activity:hover .card-activity--title .elementor-icon svg {
    fill: var(--e-global-color-primary) !important;
    color: var(--e-global-color-primary) !important;
}

.card-activity:hover .card-activity--title .jet-listing-dynamic-field__content {
    color: var(--e-global-color-primary) !important;
}

.card-activity:hover .card-activity--img img {
    transform: scale(1.15);
}

/* Logo Section */
@keyframes moving-logo {
    from {
        transform: translate(0);
    }
    to {
    transform: translateX(calc(-100% - 40px));
    }
}

.logo-wrap {
    will-change: transform;
}

.logo-wrap {
    max-width: none;
    min-width: max-content;
    animation: moving-logo 10s linear infinite;
}

.logo-container {
    display: flex;
    flex-direction: row;
    width: max-content;
    max-width: none;
    flex-wrap: nowrap;
}

.logo-wrap:not(.logo-wrap-3) {
    margin-right: 40px;
}

.transparent-header:has(.e-n-menu-content.e-active) {
    background-color: var( --e-global-color-6b48733 ) !important;
}

.solid-header:has(.e-n-menu-content.e-active) {
    background-color: var( --e-global-color-6b48733 ) !important;
}

.solid-header:has(.e-n-menu-content.e-active) .logo img {
    filter: saturate(0) brightness(0) invert(1);
}

.solid-header:has(.e-n-menu-content.e-active) .e-n-menu-title,
.solid-header:has(.e-n-menu-content.e-active) .e-n-menu-title-text {
    color: #ffffff !important;
}

.solid-header:has(.e-n-menu-content.e-active) .change-color .elementor-icon {
    color: #ffffff !important;
}

.solid-header:has(.e-n-menu-content.e-active) .change-color .elementor-icon svg {
    fill: #ffffff !important;
}

.half-trapezium-clip::before {
    content: '';
    height: 50px;
    width: 100%;
    top: 0;
    bottom: 0;
    clip-path: polygon(0 0, 100% 0, 0% 100%, 0% 100%);
    background: var(--e-global-color-primary);
}

.half-trapezium-clip.yellow::before {
    background: #FFC737;
}

.half-trapezium-clip.dark-green::before {
    background: #394E44;
}

.half-trapezium-clip.yellow::before {
    background: #FFC737;
}

[data-elementor-device-mode="desktop"] .half-trapezium-clip::before {
    height: 100%;
    width: 100px;
}

/* Himan - END */

#the-content {
    font-weight: 400;
}

#the-content p,
#the-content h1,
#the-content h2,
#the-content h3,
#the-content h4,
#the-content h5,
#the-content h6,
#the-content ol,
#the-content ul,
#the-content .wp-block-image {
    margin-bottom: 1rem;
}

#the-content blockquote,
#the-content .wp-block-image {
    margin-top: 3.125rem;
    margin-bottom: 3.125rem;
}

#the-content ul {
    padding-left: 1rem;
}

#the-content h1,
#the-content h2 {
    font-size: 1.875rem;
}

#the-content h3 {
    font-size: 1.5rem;
}

#the-content h4,
#the-content h5,
#the-content h6 {
    font-size: 1.25rem;
}

#the-content ul li,
#the-content ol li {
    margin-bottom: .125rem;
}

#the-content h1,
#the-content h2,
#the-content h3,
#the-content h4,
#the-content h5,
#the-content h6{
    font-weight: 700;
}

#the-content blockquote {
    padding: 50px 0px 50px 50px;
    border-top: solid 1px #0F3044;
    border-bottom: solid 1px #0F3044;
    margin-left: 0;
}

#the-content blockquote p:last-child {
    margin-bottom: 0;
}

#the-content > *:last-child {
    margin-bottom: 0rem !important;
}

[data-elementor-device-mode="mobile"] #the-content blockquote {
    padding: 20px 0px 20px 20px;
}

[data-elementor-device-mode="mobile"] #the-content h1,
[data-elementor-device-mode="mobile"] #the-content h2 {
    font-size: 1.5rem;
}

[data-elementor-device-mode="mobile"] #the-content h3 {
    font-size: 1.125rem;
}

[data-elementor-device-mode="mobile"] #the-content h4,
[data-elementor-device-mode="mobile"] #the-content h5,
[data-elementor-device-mode="mobile"] #the-content h6 {
    font-size: 1.125rem;
}

[data-elementor-device-mode="mobile"] #the-content blockquote,
[data-elementor-device-mode="mobile"] #the-content .wp-block-image {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

/* ==========================================
   NAC Accordion – Medium Subhead Styling
   Block: nac-accordion
   ========================================== */

/* Ensure normal paragraphs are not bold */
.nac-accordion .jet-toggle__content p {
  font-weight: 400;
}

/* Style standalone bold paragraphs as subheadings — excluding opted-out inline bold */
.nac-accordion .jet-toggle__content
p:not([style*="padding-left"]):not(.nac-inline) > strong:first-child:last-child {
  display: block;
  font-size: clamp(1.19rem, 1.02586rem + 0.68966vw, 1.50rem);
  line-height: 1.4;
  font-weight: 600;
  margin-top: 1.75rem;
  margin-bottom: 0.5rem;
}

/* Remove extra top spacing if first element */
.nac-accordion .jet-toggle__content
p:not(.nac-inline):first-child > strong:first-child:last-child {
  margin-top: 0;
}

.nac-pills .jet-listing-dynamic-field__content{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}

.nac-pills__pill{
  display:inline-flex;
  align-items:center;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--nac-sun);
  background:var(--nac-sun);
  color:#0F3044;
  font-size:14px;
  line-height:1;
  white-space:nowrap;
}

.underline-slide-hover .elementor-icon-list-item a {
    position: relative;
}

.underline-slide-hover .elementor-icon-list-item a::before {
    content: "" !important;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
    height: 1px;
    background: #0F3044;
    pointer-events: none;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 320ms cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.underline-slide-hover .elementor-icon-list-item a:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.underline-slide-hover .elementor-icon-list-item a:hover::before {
    background: #FFFFFF;
}


/* Offer Popup */
.offer-style-1,
.offer-style-2{
  position: relative;
  display: inline-block;
  z-index: 0;
  color: #FFFFFF;
}

.offer-style-1::before{
  content: "";
  position: absolute;
  inset: 0;
  background: #E64545;
  transform: skew(10deg) translateY(-50%) rotate(-1deg);
  z-index: -1;
  border-radius: 2px;
  backface-visibility: hidden;
  will-change: transform;
  width: 117%;
  left: -2%;
  top: 50%;
  height: 100%;
}

.offer-style-2::before{
  content: "";
  position: absolute;
  inset: 0;
  background: #E64545;
  transform: skew(5deg) translateY(-50%) rotate(-1deg);
  z-index: -1;
  border-radius: 2px;
  backface-visibility: hidden;
  will-change: transform;
  width: 130%;
  left: -10%;
  top: 50%;
  height: 100%;
}

.decorative-image img {
  -webkit-user-drag: none;
  user-drag: none;
  user-select: none;
  pointer-events: none;
}

/* ==========================================
   Seasonal Display/Hide
   ========================================== */

/* Default hidden states */
.show-at-christmas,
.hide-at-christmas,
.show-at-christmas-container,
.hide-at-christmas-container {
  display: none;
}

/* Christmas period */
.nac-season-christmas .show-at-christmas {
  display: block;
}

.nac-season-christmas .show-at-christmas-container {
  display: flex;
}

.nac-season-christmas .hide-at-christmas,
.nac-season-christmas .hide-at-christmas-container {
  display: none;
}

/* Standard period */
.nac-season-standard .hide-at-christmas {
  display: block;
}

.nac-season-standard .hide-at-christmas-container {
  display: flex;
}

.nac-season-standard .show-at-christmas,
.nac-season-standard .show-at-christmas-container {
  display: none;
}

/* ==========================================
   Course Dates
   ========================================== */

.nac-course-dates__year {
  --fluid-size: clamp(1.19rem, 1.02586rem + 0.68966vw, 1.50rem);
  font-size: var(--fluid-size);
}

.nac-course-dates__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nac-course-dates__item {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.nac-course-dates__item + .nac-course-dates__item {
  margin-top: 0.35rem;
}

.nac-course-dates__item--sold-out .nac-course-dates__date-text{
  text-decoration: line-through;
  opacity: 0.7;
}

.nac-course-dates__sold-out-pill{
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid #E64545;
  background: #E64545;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
}

/* ==========================================
   Beach Sidebar
   ========================================== */

.jet-listing-grid--8317,
.jet-listing-grid--8317 .jet-listing-grid__items,
.jet-listing-grid--8317 .jet-listing-grid__item,
.jet-listing-grid--8317 .elementor,
.jet-listing-grid--8317 .e-con,
.jet-listing-grid--8317 .e-con-inner,
.jet-listing-grid--8317 .elementor-widget,
.jet-listing-grid--8317 .elementor-widget-container,
.jet-listing-grid--8317 .jet-listing,
.jet-listing-grid--8317 .jet-listing-dynamic-field,
.jet-listing-grid--8317 .jet-listing-dynamic-field__inline-wrap {
	overflow: visible !important;
}

.jet-listing-grid--8317 .nac-quick-guide-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	z-index: 20;
}

.nac-quick-guide-icon {
	color: #0F3044;
}

.nac-quick-guide-icon svg {
	fill: currentColor;
}

.jet-listing-grid--8317 .nac-quick-guide-icon__tooltip {
	position: absolute;
	left: 50%;
	bottom: calc(100% + 8px);
	transform: translateX(-50%);
	
	width: max-content;
	min-width: max-content;
	max-width: 220px;
	white-space: nowrap;

	background: #0F3044;
	color: #F5F5F5;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.2;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: 9999;
}

.jet-listing-grid--8317 .nac-quick-guide-icon:hover .nac-quick-guide-icon__tooltip,
.jet-listing-grid--8317 .nac-quick-guide-icon:focus-within .nac-quick-guide-icon__tooltip {
	opacity: 1;
	visibility: visible;
}

.jet-listing-grid--8317 .jet-listing-grid__items {
	display: flex;
	flex-wrap: wrap;
	gap: 10px; /* control spacing here */
}

.jet-listing-grid--8317 .jet-listing-grid__item {
	width: auto !important;
	flex: 0 0 auto;
}

.nac-webcam-icon {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 6px;
	vertical-align: middle;
	background: url('/wp-content/uploads/webcam-icon.svg') no-repeat center;
	background-size: contain;
}

.nac-webcam-list a {
	text-decoration: none;
}

.nac-webcam-list a:hover {
	text-decoration: underline;
}

/* =========================================================
   Fluent Forms - Phone Field Country Selector Cleanup
   Purpose:
   - Restore sensible spacing inside the intl-tel-input .elementor-kit-8
   - Remove Fluent/default browser button styling
   - Prevent unwanted blue/red hover, focus, and active states
   ========================================================= */

/* Country .elementor-kit-8 button area */
.ff-el-group .iti__selected-country {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 14px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Remove unwanted interaction styles from the .elementor-kit-8 */
.ff-el-group .iti__selected-country:hover,
.ff-el-group .iti__selected-country:focus,
.ff-el-group .iti__selected-country:active {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Reset native button styling inside the country container */
.ff-el-group .iti__country-container button {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Keep flag and arrow vertically aligned */
.ff-el-group .iti__selected-country-primary {
    display: flex;
    align-items: center;
    gap: 6px;
}


/* =========================================================
   Fluent Forms - Upload Field Styling
   Scope:
   - Form ID 8 only
   Purpose:
   - Make upload label text white
   - Make upload button text white by default
   - Set dropzone border to a soft white
   - Turn the clickable upload area white on hover/dragover
   - Switch button text to NAC navy when background turns white
   ========================================================= */

/* Upload field label text - exact target for Accommodation Image */
.fluentform_wrapper_8 .fwcsm_upload_container .ff-el-input--label label#label_ff_8_file-upload_1,
.fluentform_wrapper_8 .fwcsm_upload_container .ff-el-input--label label[for="ff_8_file-upload_1"] {
    color: #ffffff !important;
}

/* Upload button text in default state */
.fluentform_wrapper_8 .fwcsm_upload_container .ff_upload_btn,
.fluentform_wrapper_8 .fwcsm_upload_container .ff_upload_btn.ff-btn,
.fluentform_wrapper_8 .fwcsm_upload_container .ff_file_upload_holder .ff_upload_btn {
    color: #ffffff !important;
}

/* Base dropzone border */
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone {
    border-color: rgba(255, 255, 255, 0.45) !important;
}

/* Strengthen border on hover, focus, dragover, or upload state */
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone:hover,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone:focus-within,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone.dragover,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone.ff_uploading {
    border-color: #ffffff !important;
    background: transparent !important;
}

/* Actual clickable upload area:
   force white background when hovered/focused/active */
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone .ff_file_upload_holder:hover,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone .ff_file_upload_holder:focus,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone .ff_file_upload_holder:active {
    background: #ffffff !important;
}

/* Keep the same white background when a file is dragged over the dropzone */
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone.dragover .ff_file_upload_holder {
    background: #ffffff !important;
}
/* Force Accommodation Image label to white (Fluent override fix) */
.fluentform_wrapper_8 .fwcsm_upload_container .ff-el-input--label label {
    color: #ffffff !important;
}

/* When the upload holder turns white, switch button text to NAC navy */
.fluentform_wrapper_8 .fwcsm_upload_container .ff_file_upload_holder:hover .ff_upload_btn,
.fluentform_wrapper_8 .fwcsm_upload_container.ff-dropzone.dragover .ff_upload_btn {
    color: #0F3044 !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Funnel Display';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/FunnelDisplay-Bold.woff2') format('woff2');
}
@font-face {
	font-family: 'Funnel Display';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/FunnelDisplay-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'Funnel Display';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/FunnelDisplay-Medium.woff2') format('woff2');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/DMSans_18pt-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/DMSans_18pt-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/DMSans_18pt-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://newquayactivitycentre.co.uk/wp-content/uploads/DMSans_18pt-Light.woff2') format('woff2');
}
/* End Custom Fonts CSS */