/*
Theme Name:  Nordic Moments Lapland
Theme URI:   https://nordicmoments.se
Author:      Nordic Moments Lapland
Author URI:  https://nordicmoments.se
Description: A premium dual-season child theme for GeneratePress — built for Nordic Moments Lapland, a tourism and holiday accommodation business in Mausjaur, Swedish Lapland. Features a Summer/Winter seasonal toggle with full CSS custom-property colour switching, custom post types for Activities and Rooms, and a block-friendly template structure.
Version:     1.0.0
Template:    generatepress
Requires at least: 6.3
Tested up to: 6.7
Requires PHP: 8.1
License:     GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nordic-moments
Tags:        tourism, seasonal, custom-colors, full-width-template, custom-menu, featured-images, footer-widgets, custom-logo
*/

/* ============================================================
   0. GOOGLE FONTS IMPORT
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Inter:wght@300;400;500;600&family=Montserrat:wght@300;400;500;600;700&display=swap');

/* ============================================================
   1. CSS CUSTOM PROPERTIES — DUAL-SEASON ARCHITECTURE
   The body carries either .theme-summer or .theme-winter.
   Switching the class is all that's needed to flip the palette.
   ============================================================ */

/* --- Shared structural tokens (never change with season) --- */
:root {
  /* Typography */
  --nm-font-display:  'Playfair Display', Georgia, serif;
  --nm-font-heading:  'Montserrat', sans-serif;
  --nm-font-body:     'Inter', system-ui, sans-serif;

  /* Spacing scale */
  --nm-space-xs:   0.5rem;
  --nm-space-sm:   1rem;
  --nm-space-md:   2rem;
  --nm-space-lg:   4rem;
  --nm-space-xl:   6rem;
  --nm-space-xxl:  10rem;

  /* Border radius */
  --nm-radius-sm:  4px;
  --nm-radius-md:  8px;
  --nm-radius-lg:  16px;
  --nm-radius-xl:  24px;

  /* Transitions */
  --nm-transition-fast:   0.18s ease;
  --nm-transition:        0.35s ease;
  --nm-transition-slow:   0.6s cubic-bezier(0.4, 0, 0.2, 1);

  /* Shadows */
  --nm-shadow-sm:  0 2px 8px rgba(0,0,0,0.08);
  --nm-shadow-md:  0 8px 32px rgba(0,0,0,0.14);
  --nm-shadow-lg:  0 20px 60px rgba(0,0,0,0.22);
  --nm-shadow-card: 0 4px 20px rgba(0,0,0,0.12);

  /* Z-index layers */
  --nm-z-base:     1;
  --nm-z-card:     10;
  --nm-z-nav:      100;
  --nm-z-overlay:  200;
  --nm-z-modal:    300;
}

/* ------------------------------------------------------------ */
/* SUMMER THEME  (warm golden-hour: amber, forest green, cream) */
/* ------------------------------------------------------------ */
.theme-summer,
html:not(.theme-winter) body:not(.theme-winter) {
  /* Backgrounds */
  --nm-bg-page:        #F5F1EB;
  --nm-bg-section-alt: #EDEAE3;
  --nm-bg-card:        #FFFFFF;
  --nm-bg-dark:        #2A2420;
  --nm-bg-darkest:     #1A1410;

  /* Text */
  --nm-text-primary:   #1A1410;
  --nm-text-secondary: #4A4038;
  --nm-text-muted:     #7A7068;
  --nm-text-on-dark:   #F5F1EB;
  --nm-text-on-accent: #FFFFFF;

  /* Accent / brand */
  --nm-accent:         #B8742A;
  --nm-accent-light:   #D4924A;
  --nm-accent-dark:    #8A5418;
  --nm-accent-subtle:  rgba(184, 116, 42, 0.12);

  /* Navigation */
  --nm-nav-bg:         rgba(245, 241, 235, 0.96);
  --nm-nav-text:       #1A1410;
  --nm-nav-border:     rgba(26, 20, 16, 0.08);

  /* Hero */
  --nm-hero-overlay:   linear-gradient(
                         to bottom,
                         rgba(15, 10, 5, 0.20) 0%,
                         rgba(15, 10, 5, 0.45) 100%
                       );
  --nm-hero-text:      #FFFFFF;

  /* Cards / grids */
  --nm-card-overlay:   linear-gradient(
                         to top,
                         rgba(15, 10, 5, 0.80) 0%,
                         rgba(15, 10, 5, 0.10) 60%,
                         transparent 100%
                       );
  --nm-card-border:    rgba(26, 20, 16, 0.08);

  /* Divider */
  --nm-divider:        rgba(26, 20, 16, 0.12);

  /* Buttons */
  --nm-btn-primary-bg:   #B8742A;
  --nm-btn-primary-text: #FFFFFF;
  --nm-btn-outline-border: #B8742A;
  --nm-btn-outline-text:   #B8742A;

  /* Footer */
  --nm-footer-bg:      #2A2420;
  --nm-footer-text:    rgba(245, 241, 235, 0.75);
  --nm-footer-heading: #F5F1EB;
  --nm-footer-border:  rgba(245, 241, 235, 0.10);

  /* Season selector */
  --nm-splash-bg:      #0D0A07;
  --nm-splash-text:    #F5F1EB;

  /* Section heading underline */
  --nm-heading-rule:   #B8742A;
}

/* ------------------------------------------------------------ */
/* WINTER THEME  (deep arctic night: navy, ice blue, cold white) */
/* ------------------------------------------------------------ */
.theme-winter {
  /* Backgrounds */
  --nm-bg-page:        #0D1B2A;
  --nm-bg-section-alt: #0A1520;
  --nm-bg-card:        #152236;
  --nm-bg-dark:        #060E18;
  --nm-bg-darkest:     #030810;

  /* Text */
  --nm-text-primary:   #E8F0F7;
  --nm-text-secondary: #A8BFD0;
  --nm-text-muted:     #6A8599;
  --nm-text-on-dark:   #E8F0F7;
  --nm-text-on-accent: #FFFFFF;

  /* Accent / brand */
  --nm-accent:         #5B9EC9;
  --nm-accent-light:   #7CB8DE;
  --nm-accent-dark:    #3A7EA8;
  --nm-accent-subtle:  rgba(91, 158, 201, 0.15);

  /* Navigation */
  --nm-nav-bg:         rgba(13, 27, 42, 0.97);
  --nm-nav-text:       #E8F0F7;
  --nm-nav-border:     rgba(232, 240, 247, 0.08);

  /* Hero */
  --nm-hero-overlay:   linear-gradient(
                         to bottom,
                         rgba(3, 8, 16, 0.25) 0%,
                         rgba(3, 8, 16, 0.55) 100%
                       );
  --nm-hero-text:      #FFFFFF;

  /* Cards / grids */
  --nm-card-overlay:   linear-gradient(
                         to top,
                         rgba(3, 8, 16, 0.90) 0%,
                         rgba(3, 8, 16, 0.20) 60%,
                         transparent 100%
                       );
  --nm-card-border:    rgba(91, 158, 201, 0.15);

  /* Divider */
  --nm-divider:        rgba(232, 240, 247, 0.10);

  /* Buttons */
  --nm-btn-primary-bg:   #5B9EC9;
  --nm-btn-primary-text: #FFFFFF;
  --nm-btn-outline-border: #5B9EC9;
  --nm-btn-outline-text:   #5B9EC9;

  /* Footer */
  --nm-footer-bg:      #060E18;
  --nm-footer-text:    rgba(168, 191, 208, 0.80);
  --nm-footer-heading: #E8F0F7;
  --nm-footer-border:  rgba(91, 158, 201, 0.12);

  /* Season selector */
  --nm-splash-bg:      #060E18;
  --nm-splash-text:    #E8F0F7;

  /* Section heading underline */
  --nm-heading-rule:   #5B9EC9;

  /* Shadow override (colder tone) */
  --nm-shadow-sm:  0 2px 8px rgba(0,0,0,0.25);
  --nm-shadow-md:  0 8px 32px rgba(0,0,0,0.40);
  --nm-shadow-lg:  0 20px 60px rgba(0,0,0,0.55);
  --nm-shadow-card: 0 4px 20px rgba(0,0,0,0.35);
}

/* ============================================================
   2. GLOBAL RESET & BASE
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--nm-font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--nm-text-primary);
  background-color: var(--nm-bg-page);
  transition:
    background-color var(--nm-transition-slow),
    color var(--nm-transition-slow);
  overflow-x: hidden;
}

/* Hide all season-specific blocks by default; JS reveals them */
.nm-season-summer,
.nm-season-winter {
  display: none !important;
}
.theme-summer .nm-season-summer {
  display: revert !important;
}
.theme-winter .nm-season-winter {
  display: revert !important;
}

img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--nm-accent); text-decoration: none; transition: color var(--nm-transition-fast); }
a:hover { color: var(--nm-accent-light); }
ul, ol { list-style: none; }

/* ============================================================
   3. TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--nm-font-heading);
  font-weight: 600;
  line-height: 1.2;
  color: var(--nm-text-primary);
  transition: color var(--nm-transition-slow);
}

.nm-display {
  font-family: var(--nm-font-display);
  font-size: clamp(3rem, 8vw, 7rem);
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nm-hero-text);
}

.nm-section-title {
  font-family: var(--nm-font-heading);
  font-size: clamp(0.7rem, 1.5vw, 0.85rem);
  font-weight: 500;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--nm-text-primary);
  text-align: center;
  margin-bottom: var(--nm-space-md);
  transition: color var(--nm-transition-slow);
}

.nm-section-title::after {
  content: '';
  display: block;
  width: 40px;
  height: 2px;
  background: var(--nm-heading-rule);
  margin: 0.6rem auto 0;
  transition: background var(--nm-transition-slow);
}

p { color: var(--nm-text-secondary); transition: color var(--nm-transition-slow); }
.nm-lead { font-size: 1.125rem; line-height: 1.8; }

/* ============================================================
   4. LAYOUT UTILITIES
   ============================================================ */
.nm-container {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 3rem);
}

.nm-container--narrow {
  max-width: 780px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 3rem);
}

.nm-section {
  padding-block: var(--nm-space-lg);
  transition: background-color var(--nm-transition-slow);
}

.nm-section--alt {
  background-color: var(--nm-bg-section-alt);
}

.nm-section--dark {
  background-color: var(--nm-bg-dark);
}

/* ============================================================
   5. BUTTONS
   ============================================================ */
.nm-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--nm-font-heading);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.85rem 2rem;
  border-radius: var(--nm-radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  transition: all var(--nm-transition-fast);
  text-decoration: none;
  line-height: 1;
}

.nm-btn--primary {
  background-color: var(--nm-btn-primary-bg);
  color: var(--nm-btn-primary-text);
  border-color: var(--nm-btn-primary-bg);
}
.nm-btn--primary:hover {
  background-color: var(--nm-accent-dark);
  border-color: var(--nm-accent-dark);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--nm-shadow-md);
}

.nm-btn--outline {
  background-color: transparent;
  color: var(--nm-btn-outline-text);
  border-color: var(--nm-btn-outline-border);
}
.nm-btn--outline:hover {
  background-color: var(--nm-accent);
  color: #fff;
  border-color: var(--nm-accent);
}

.nm-btn--ghost {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,0.6);
}
.nm-btn--ghost:hover {
  background: rgba(255,255,255,0.15);
  border-color: #fff;
  color: #fff;
}

.nm-arrow-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--nm-font-heading);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
  transition: gap var(--nm-transition-fast);
}
.nm-arrow-link::after { content: '→'; }
.nm-arrow-link:hover { gap: 0.8rem; color: #fff; }

/* ============================================================
   6. NAVIGATION
   ============================================================ */
#nm-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--nm-z-nav);
  background: var(--nm-nav-bg);
  border-bottom: 1px solid var(--nm-nav-border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition:
    background var(--nm-transition-slow),
    border-color var(--nm-transition-slow),
    box-shadow var(--nm-transition-fast);
}

#nm-header.scrolled {
  box-shadow: var(--nm-shadow-md);
}

.nm-nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
  gap: var(--nm-space-sm);
}

/* Logo */
.nm-nav__logo {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.nm-nav__logo img {
  height: 44px;
  width: auto;
}
.nm-nav__logo-text {
  font-family: var(--nm-font-display);
  font-size: 1.05rem;
  color: var(--nm-nav-text);
  line-height: 1.2;
  transition: color var(--nm-transition-slow);
}
.nm-nav__logo-text span {
  display: block;
  font-family: var(--nm-font-heading);
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.6;
}

/* Primary menu */
.nm-nav__menu {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.nm-nav__menu a {
  font-family: var(--nm-font-heading);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--nm-nav-text);
  padding: 0.5rem 0.75rem;
  border-radius: var(--nm-radius-sm);
  transition: all var(--nm-transition-fast);
  opacity: 0.85;
}
.nm-nav__menu a:hover,
.nm-nav__menu .current-menu-item > a {
  opacity: 1;
  background: var(--nm-accent-subtle);
  color: var(--nm-accent);
}

/* Right controls */
.nm-nav__controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

/* Season toggle pill */
.nm-season-toggle {
  display: inline-flex;
  align-items: center;
  background: var(--nm-accent-subtle);
  border: 1px solid var(--nm-card-border);
  border-radius: 999px;
  overflow: hidden;
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.nm-season-toggle button {
  background: none;
  border: none;
  padding: 0.45rem 1rem;
  color: var(--nm-text-muted);
  cursor: pointer;
  transition: all var(--nm-transition-fast);
  line-height: 1;
}
.nm-season-toggle button.active {
  background: var(--nm-accent);
  color: #fff;
  border-radius: 999px;
}
.nm-season-toggle button:hover:not(.active) {
  color: var(--nm-text-primary);
}

/* "Back to start" button */
.nm-nav__back {
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nm-nav-text);
  border: 1px solid var(--nm-divider);
  padding: 0.5rem 1rem;
  border-radius: var(--nm-radius-sm);
  white-space: nowrap;
  transition: all var(--nm-transition-fast);
  opacity: 0.75;
}
.nm-nav__back:hover {
  opacity: 1;
  color: var(--nm-accent);
  border-color: var(--nm-accent);
}

/* Hamburger */
.nm-nav__hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}
.nm-nav__hamburger span {
  display: block;
  width: 100%;
  height: 1.5px;
  background: var(--nm-nav-text);
  transition: all var(--nm-transition-fast);
  transform-origin: center;
}
.nm-nav__hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nm-nav__hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nm-nav__hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Mobile drawer */
.nm-nav__mobile {
  display: none;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1rem var(--nm-space-md) 1.5rem;
  border-top: 1px solid var(--nm-divider);
  background: var(--nm-nav-bg);
}
.nm-nav__mobile.open { display: flex; }
.nm-nav__mobile a {
  font-family: var(--nm-font-heading);
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nm-nav-text);
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--nm-divider);
  transition: color var(--nm-transition-fast);
}
.nm-nav__mobile a:hover { color: var(--nm-accent); }

/* ============================================================
   7. SEASON SPLASH OVERLAY (Startseite)
   ============================================================ */
#nm-splash {
  position: fixed;
  inset: 0;
  z-index: var(--nm-z-overlay);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #ffffff; /* white shows while images load */
  transition: opacity var(--nm-transition-slow), visibility var(--nm-transition-slow);
}
#nm-splash.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.nm-splash__logo {
  margin-bottom: 2rem;
  animation: nmFadeUp 0.8s ease both;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Target both the WP custom-logo <img> and the SVG fallback */
.nm-splash__logo img,
.nm-splash__logo svg {
  width: clamp(200px, 26vw, 300px);
  height: auto;
  max-width: 100%;
}
/* The <a> wrapper WordPress generates around the logo */
.nm-splash__logo a.custom-logo-link {
  display: flex;
  justify-content: center;
}

.nm-splash__tagline {
  font-family: var(--nm-font-heading);
  font-size: clamp(0.65rem, 1.5vw, 0.8rem);
  font-weight: 500;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: #2A2420; /* dark text on the now-light splash background */
  opacity: 0.75;
  margin-bottom: 2.5rem;
  text-align: center;
  animation: nmFadeUp 0.8s 0.15s ease both;
}
.nm-splash__tagline::after {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  background: currentColor;
  margin: 0.75rem auto 0;
}

.nm-splash__cards {
  display: flex;
  gap: clamp(1rem, 3vw, 2rem);
  animation: nmFadeUp 0.8s 0.3s ease both;
}

.nm-splash__card {
  position: relative;
  width: clamp(240px, 30vw, 380px);  /* landscape — wider than tall */
  aspect-ratio: 3/2;                 /* landscape orientation */
  border-radius: var(--nm-radius-xl);
  overflow: hidden;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  box-shadow: 0 8px 40px rgba(0,0,0,0.18);
  transition: transform var(--nm-transition), box-shadow var(--nm-transition);
}
.nm-splash__card:hover {
  transform: scale(1.04) translateY(-5px);
  box-shadow: 0 24px 64px rgba(0,0,0,0.28);
}

.nm-splash__card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.6s ease;
}
.nm-splash__card:hover img { transform: scale(1.06); }

.nm-splash__card-overlay {
  position: absolute;
  inset: 0;
  /* Gradient slightly darker at bottom for label legibility */
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.08) 0%,
    rgba(0,0,0,0.18) 45%,
    rgba(0,0,0,0.60) 100%
  );
  display: flex;
  flex-direction: column;
  align-items: center;
  /* Icon + label sit centered, arrow at the bottom */
  justify-content: center;
  padding: 1.25rem;
  gap: 0.45rem;
}

.nm-splash__card-icon {
  font-size: 1.4rem;
  color: #fff;
  margin-bottom: 0.15rem;
}

.nm-splash__card-label {
  font-family: var(--nm-font-heading);
  font-size: clamp(0.65rem, 1.2vw, 0.78rem);
  font-weight: 600;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: #fff;
}

.nm-splash__card-arrow {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.75);
  margin-top: auto; /* push arrow to the bottom of the card */
}

/* ============================================================
   8. HERO SECTION
   ============================================================ */
.nm-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-top: 72px; /* header height */
}

.nm-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  transition: opacity var(--nm-transition-slow);
}
.nm-hero__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--nm-hero-overlay);
}

.nm-hero__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: var(--nm-space-md);
  animation: nmFadeUp 1s 0.2s ease both;
}

.nm-hero__subtitle {
  font-family: var(--nm-font-body);
  font-size: 1.1rem;
  color: rgba(255,255,255,0.85);
  max-width: 480px;
  margin: 1.25rem auto 0;
  line-height: 1.8;
}

.nm-hero__scroll {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  color: rgba(255,255,255,0.6);
  font-family: var(--nm-font-heading);
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  animation: nmBounce 2s 1.5s ease infinite;
}
.nm-hero__scroll::before {
  content: '';
  display: block;
  width: 1px;
  height: 40px;
  background: rgba(255,255,255,0.4);
}

/* ============================================================
   9. ACTIVITY & EXCURSION CARDS (grid)
   ============================================================ */
.nm-card-grid {
  display: grid;
  gap: 1.5rem;
}
.nm-card-grid--3 { grid-template-columns: repeat(3, 1fr); }
.nm-card-grid--5 { grid-template-columns: repeat(5, 1fr); }

.nm-activity-card {
  position: relative;
  border-radius: var(--nm-radius-md);
  overflow: hidden;
  aspect-ratio: 4/5;
  cursor: pointer;
  background: var(--nm-bg-card);
  box-shadow: var(--nm-shadow-card);
  transition: transform var(--nm-transition), box-shadow var(--nm-transition);
}
.nm-activity-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--nm-shadow-lg);
}

.nm-activity-card--wide { aspect-ratio: 16/9; }

.nm-activity-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.nm-activity-card:hover .nm-activity-card__img { transform: scale(1.06); }

.nm-activity-card__overlay {
  position: absolute;
  inset: 0;
  background: var(--nm-card-overlay);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.25rem 1rem;
  gap: 0.4rem;
  transition: background var(--nm-transition-slow);
}

.nm-activity-card__title {
  font-family: var(--nm-font-heading);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.3;
}

/* ============================================================
   10. ACCOMMODATION CARDS
   ============================================================ */
.nm-room-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.nm-room-card {
  position: relative;
  border-radius: var(--nm-radius-md);
  overflow: hidden;
  min-height: 380px;
  cursor: pointer;
  box-shadow: var(--nm-shadow-card);
  transition: transform var(--nm-transition), box-shadow var(--nm-transition);
}
.nm-room-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--nm-shadow-lg);
}

.nm-room-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.nm-room-card:hover .nm-room-card__img { transform: scale(1.04); }

.nm-room-card__content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem 1.75rem 1.75rem;
  background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, transparent 100%);
  transition: background var(--nm-transition-slow);
}

.nm-room-card__title {
  font-family: var(--nm-font-heading);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 0.4rem;
}

.nm-room-card__desc {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
  margin-bottom: 0.75rem;
}

/* ============================================================
   11. NEWS / BLOG SECTION
   ============================================================ */
.nm-news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.nm-news-card {
  background: var(--nm-bg-card);
  border-radius: var(--nm-radius-md);
  overflow: hidden;
  border: 1px solid var(--nm-card-border);
  box-shadow: var(--nm-shadow-sm);
  transition:
    background var(--nm-transition-slow),
    border-color var(--nm-transition-slow),
    transform var(--nm-transition),
    box-shadow var(--nm-transition);
}
.nm-news-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--nm-shadow-md);
}

.nm-news-card__img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
}

.nm-news-card__body {
  padding: 1.5rem;
}

.nm-news-card__date {
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--nm-accent);
  margin-bottom: 0.5rem;
  transition: color var(--nm-transition-slow);
}

.nm-news-card__title {
  font-family: var(--nm-font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--nm-text-primary);
  margin-bottom: 0.6rem;
  line-height: 1.4;
  transition: color var(--nm-transition-slow);
}

.nm-news-card__excerpt {
  font-size: 0.875rem;
  color: var(--nm-text-muted);
  line-height: 1.6;
  transition: color var(--nm-transition-slow);
}

/* ============================================================
   12. GALLERY / CTA SPLIT SECTION
   ============================================================ */
.nm-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 340px;
}

.nm-split__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--nm-space-lg) var(--nm-space-md);
  overflow: hidden;
}

.nm-split__panel--bg {
  background-size: cover;
  background-position: center;
}
.nm-split__panel--bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.42);
}
.nm-split__panel--bg > * { position: relative; z-index: 1; }

.nm-split__panel--plain {
  background: var(--nm-bg-section-alt);
  transition: background var(--nm-transition-slow);
}

.nm-split__label {
  font-family: var(--nm-font-heading);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.nm-split__title {
  font-family: var(--nm-font-heading);
  font-size: clamp(1rem, 2vw, 1.35rem);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

/* ============================================================
   13. CONTACT PAGE
   ============================================================ */
.nm-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: var(--nm-space-lg);
  align-items: start;
}

.nm-contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.nm-contact-info__icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--nm-accent-subtle);
  border-radius: var(--nm-radius-md);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: background var(--nm-transition-slow);
}
.nm-contact-info__label {
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--nm-accent);
  margin-bottom: 0.2rem;
  transition: color var(--nm-transition-slow);
}
.nm-contact-info__value {
  font-size: 0.95rem;
  color: var(--nm-text-primary);
  transition: color var(--nm-transition-slow);
}

/* Form */
.nm-form { display: flex; flex-direction: column; gap: 1.25rem; }

.nm-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }

.nm-form__group {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.nm-form__label {
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--nm-text-secondary);
  transition: color var(--nm-transition-slow);
}

.nm-form__input,
.nm-form__textarea,
.nm-form__select {
  font-family: var(--nm-font-body);
  font-size: 0.95rem;
  color: var(--nm-text-primary);
  background: var(--nm-bg-card);
  border: 1px solid var(--nm-card-border);
  border-radius: var(--nm-radius-md);
  padding: 0.85rem 1rem;
  outline: none;
  transition: all var(--nm-transition-fast);
  width: 100%;
  -webkit-appearance: none;
}
.nm-form__input:focus,
.nm-form__textarea:focus,
.nm-form__select:focus {
  border-color: var(--nm-accent);
  box-shadow: 0 0 0 3px var(--nm-accent-subtle);
}
.nm-form__textarea { min-height: 150px; resize: vertical; }

/* Map placeholder */
.nm-map-placeholder {
  width: 100%;
  height: 320px;
  background: var(--nm-bg-section-alt);
  border-radius: var(--nm-radius-lg);
  border: 1px solid var(--nm-card-border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: var(--nm-space-md);
  overflow: hidden;
  transition: background var(--nm-transition-slow), border-color var(--nm-transition-slow);
}
.nm-map-placeholder iframe {
  width: 100%;
  height: 100%;
  border: none;
}

/* ============================================================
   14. SINGLE ACTIVITY / ROOM
   ============================================================ */
.nm-single-hero {
  position: relative;
  height: clamp(300px, 55vh, 600px);
  margin-top: 72px;
  overflow: hidden;
}
.nm-single-hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nm-single-hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--nm-hero-overlay);
  display: flex;
  align-items: flex-end;
  padding: var(--nm-space-md) var(--nm-space-md) var(--nm-space-md);
}

.nm-single-content {
  padding-block: var(--nm-space-lg);
}

.nm-single-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: var(--nm-space-md);
}
.nm-single-meta__tag {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: var(--nm-accent-subtle);
  color: var(--nm-accent);
  padding: 0.4rem 0.9rem;
  border-radius: 999px;
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition: background var(--nm-transition-slow), color var(--nm-transition-slow);
}

/* ============================================================
   15. FOOTER
   ============================================================ */
#nm-footer {
  background: var(--nm-footer-bg);
  color: var(--nm-footer-text);
  padding-top: var(--nm-space-lg);
  transition: background var(--nm-transition-slow);
}

.nm-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: var(--nm-space-md);
  padding-bottom: var(--nm-space-md);
  border-bottom: 1px solid var(--nm-footer-border);
}

.nm-footer__logo img { height: 52px; margin-bottom: 1rem; filter: brightness(0) invert(1); opacity: 0.9; }
.nm-footer__tagline { font-size: 0.875rem; line-height: 1.7; max-width: 260px; }
.nm-footer__tagline span { display: block; opacity: 0.55; font-size: 0.8rem; margin-top: 0.35rem; }

.nm-footer__heading {
  font-family: var(--nm-font-heading);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--nm-footer-heading);
  margin-bottom: 1.1rem;
  transition: color var(--nm-transition-slow);
}

.nm-footer__links { display: flex; flex-direction: column; gap: 0.6rem; }
.nm-footer__links a {
  font-size: 0.85rem;
  color: var(--nm-footer-text);
  transition: color var(--nm-transition-fast);
}
.nm-footer__links a:hover { color: var(--nm-accent-light); }

.nm-footer__contact p {
  font-size: 0.85rem;
  color: var(--nm-footer-text);
  line-height: 1.8;
}
.nm-footer__contact a {
  color: var(--nm-footer-text);
}
.nm-footer__contact a:hover { color: var(--nm-accent-light); }

.nm-footer__social {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
}
.nm-footer__social a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--nm-footer-border);
  border-radius: 50%;
  color: var(--nm-footer-text);
  font-size: 0.9rem;
  transition: all var(--nm-transition-fast);
}
.nm-footer__social a:hover {
  border-color: var(--nm-accent-light);
  color: var(--nm-accent-light);
  background: var(--nm-accent-subtle);
}

.nm-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 1.5rem;
  font-size: 0.75rem;
  opacity: 0.55;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* ============================================================
   16. ANIMATIONS
   ============================================================ */
@keyframes nmFadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes nmBounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(-8px); }
}
@keyframes nmFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.nm-animate {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.nm-animate.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   17. RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .nm-card-grid--5 { grid-template-columns: repeat(3, 1fr); }
  .nm-footer__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

@media (max-width: 768px) {
  .nm-nav__menu { display: none; }
  .nm-nav__back { display: none; }
  .nm-nav__hamburger { display: flex; }

  .nm-card-grid--3 { grid-template-columns: 1fr 1fr; }
  .nm-card-grid--5 { grid-template-columns: 1fr 1fr; }
  .nm-room-grid { grid-template-columns: 1fr; }
  .nm-news-grid { grid-template-columns: 1fr; }
  .nm-split { grid-template-columns: 1fr; }
  .nm-contact-grid { grid-template-columns: 1fr; }
  .nm-form__row { grid-template-columns: 1fr; }
  .nm-footer__grid { grid-template-columns: 1fr; }
  .nm-footer__bottom { flex-direction: column; align-items: flex-start; }
  .nm-splash__cards { flex-direction: column; align-items: center; gap: 1rem; }
  .nm-splash__card { width: clamp(260px, 80vw, 360px); aspect-ratio: 3/2; }
}

@media (max-width: 480px) {
  .nm-card-grid--3 { grid-template-columns: 1fr; }
  .nm-card-grid--5 { grid-template-columns: 1fr 1fr; }
  .nm-season-toggle { display: none; }
}

/* ============================================================
   18. WORDPRESS CORE COMPATIBILITY
   ============================================================ */
.wp-block-image img { border-radius: var(--nm-radius-md); }
.alignwide { max-width: calc(100% + 4rem); margin-inline: -2rem; }
.alignfull { max-width: 100vw; margin-inline: calc(50% - 50vw); }
.wp-caption { max-width: 100%; }
.sticky { /* WP sticky post */ }
.screen-reader-text { clip: rect(1px,1px,1px,1px); height: 1px; overflow: hidden; position: absolute; width: 1px; word-wrap: normal; }

/* ============================================================
   19. ADMIN BAR OFFSET
   ============================================================ */
.admin-bar #nm-header { top: 32px; }
.admin-bar .nm-hero { margin-top: calc(72px + 32px); }
.admin-bar .nm-single-hero { margin-top: calc(72px + 32px); }
@media (max-width: 782px) {
  .admin-bar #nm-header { top: 46px; }
}