/* ===== DESIGN TOKENS — provisional; confirm exact brand hex once guidelines are finalized ===== */
  :root {
    --navy-900: #141B2E;
    --navy-800: #1A2234;
    --royal: #1E40C4;
    --royal-dark: #16309A;
    --periwinkle: #7B96C9;
    --gallery-bg: #5B6472;
    --cream: #F5F0E6;
    --ink: #1A1A1A;
    --muted: #6B7280;
    --surface: #FFFFFF;
    --hairline: #E5E7EB;

    --radius-pill: 999px;
    --radius-card: 20px;

    --space-section: clamp(4rem, 8vw, 8rem);

    --shadow-card: 0 8px 24px -8px rgba(30, 64, 196, 0.22), 0 2px 8px -2px rgba(20, 27, 46, 0.14);
    --shadow-card-hover: 0 16px 40px -12px rgba(30, 64, 196, 0.32), 0 4px 12px -2px rgba(20, 27, 46, 0.18);
    --shadow-floating: 0 24px 64px -16px rgba(20, 27, 46, 0.45), 0 8px 24px -4px rgba(30, 64, 196, 0.25);

    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);
  }

  * { -webkit-tap-highlight-color: transparent; }

  html { scroll-behavior: smooth; }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }

  body {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
    color: var(--ink);
    background: var(--surface);
    line-height: 1.7;
  }

  .font-display { font-family: 'Sora', ui-sans-serif, system-ui, sans-serif; }
  .font-serif { font-family: '"Playfair Display"', Georgia, serif; }

  h1, h2, h3, .heading-tight { letter-spacing: -0.03em; }

  /* ===== GLOBAL FOCUS STATE — every interactive element inherits this, including JS-rendered ones ===== */
  a, button, [tabindex] { outline: none; }
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
  textarea:focus-visible, [tabindex]:focus-visible {
    outline: 2px solid var(--royal);
    outline-offset: 3px;
    border-radius: 4px;
  }

  /* ===== GRAIN TEXTURE — applied only to dark/moody sections (hero, testimonials, final-cta) ===== */
  .grain { position: relative; isolation: isolate; }
  .grain::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: 0.05;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ===== BUTTONS — single source of truth for hover/focus/active on every pill CTA ===== */
  .btn-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: var(--radius-pill);
    padding: 0.9rem 1.85rem;
    font-family: 'Sora', sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    transition: transform 220ms var(--ease-spring), box-shadow 220ms var(--ease-spring), background-color 200ms var(--ease-smooth), color 200ms var(--ease-smooth);
  }
  .btn-pill:hover { transform: translateY(-2px) scale(1.015); }
  .btn-pill:active { transform: translateY(0) scale(0.98); }
  .btn-pill:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

  .btn-pill--primary {
    background: var(--royal);
    color: var(--cream);
    box-shadow: var(--shadow-card);
  }
  .btn-pill--primary:hover { background: var(--royal-dark); box-shadow: var(--shadow-card-hover); }

  .btn-pill--secondary {
    background: var(--periwinkle);
    color: var(--navy-900);
    box-shadow: 0 6px 18px -6px rgba(123, 150, 201, 0.5);
  }
  .btn-pill--secondary:hover { background: #6a86bd; }

  .btn-pill--ghost {
    background: transparent;
    color: var(--cream);
    border-color: rgba(245, 240, 230, 0.4);
  }
  .btn-pill--ghost:hover { background: rgba(245, 240, 230, 0.12); border-color: rgba(245, 240, 230, 0.7); }

  .btn-pill--outline-ink {
    background: transparent;
    color: var(--ink);
    border-color: var(--hairline);
  }
  .btn-pill--outline-ink:hover { border-color: var(--royal); color: var(--royal); }

  /* ===== GLOW — reserved for the recurring page-level CTAs (nav/hero/section CTAs), not the tour-card buttons ===== */
  .btn-pill--primary.btn-pill--glow {
    box-shadow: 0 0 22px -2px rgba(30, 64, 196, 0.5), 0 10px 24px -8px rgba(30, 64, 196, 0.4), 0 2px 8px -2px rgba(20, 27, 46, 0.16);
  }
  .btn-pill--primary.btn-pill--glow:hover {
    box-shadow: 0 0 30px 0px rgba(30, 64, 196, 0.65), 0 14px 32px -8px rgba(30, 64, 196, 0.5), 0 4px 12px -2px rgba(20, 27, 46, 0.2);
  }
  .btn-pill--secondary.btn-pill--glow {
    box-shadow: 0 0 20px -2px rgba(123, 150, 201, 0.55), 0 8px 20px -6px rgba(123, 150, 201, 0.4);
  }
  .btn-pill--secondary.btn-pill--glow:hover {
    box-shadow: 0 0 26px 0px rgba(123, 150, 201, 0.7), 0 10px 24px -6px rgba(123, 150, 201, 0.5);
  }

  /* ===== IMAGE TREATMENT — gradient overlay + color-tinted multiply, applied via one utility ===== */
  .media { position: relative; overflow: hidden; background: var(--navy-800); }
  .media img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .media::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    mix-blend-mode: multiply;
    background: linear-gradient(to top, rgba(20, 27, 46, 0.85), rgba(20, 27, 46, 0.1) 55%);
  }
  .media-overlay { position: absolute; inset: 0; z-index: 2; }
  .media.final-cta-media::after {
    background: linear-gradient(to top, rgba(20, 27, 46, 0.43), rgba(20, 27, 46, 0.05) 55%);
  }

  /* ===== ABOUT DUO PORTRAIT — two individual guide photos staggered in place of one joint photo ===== */
  .duo-portrait { position: relative; }
  .duo-portrait::before {
    content: '';
    position: absolute;
    inset: -8%;
    z-index: 0;
    background: radial-gradient(ellipse 60% 60% at 30% 25%, rgba(123, 150, 201, 0.28), transparent 70%);
  }
  .duo-portrait__photo {
    position: absolute;
    width: 62%;
    aspect-ratio: 4 / 5;
    border-radius: var(--radius-card);
    border: 0;
    padding: 0;
    appearance: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: box-shadow 320ms var(--ease-spring), transform 320ms var(--ease-spring);
  }
  .duo-portrait__slot-back { top: 0; left: 0; }
  .duo-portrait__slot-front { bottom: 0; right: 0; }
  .duo-portrait__photo.is-back { z-index: 1; box-shadow: var(--shadow-card); }
  .duo-portrait__photo.is-front { z-index: 2; box-shadow: 0 0 0 4px var(--surface), var(--shadow-floating); }
  .duo-portrait__photo:hover { transform: translateY(-4px); }
  .duo-portrait__photo:focus-visible { outline: 2px solid var(--royal); outline-offset: 4px; }
  @media (prefers-reduced-motion: reduce) {
    .duo-portrait__photo { transition: none; }
  }
  .duo-portrait__label {
    position: absolute;
    z-index: 3;
    left: 0.9rem;
    bottom: 0.9rem;
    padding: 0.4rem 0.9rem;
    border-radius: var(--radius-pill);
    background: rgba(20, 27, 46, 0.55);
    backdrop-filter: blur(6px);
    color: var(--cream);
    font-family: 'Sora', sans-serif;
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.01em;
  }

  /* ===== DEPTH LAYERS ===== */
  .surface-base { box-shadow: none; }
  .surface-elevated { box-shadow: var(--shadow-card); transition: transform 240ms var(--ease-spring), box-shadow 240ms var(--ease-spring); }
  .surface-elevated:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
  .surface-floating { box-shadow: var(--shadow-floating); }

  .hairline { border-color: var(--hairline); }
  section[id] { scroll-margin-top: 5rem; }

  /* ===== HEADER ===== */
  #site-header { transition: background-color 260ms var(--ease-smooth), box-shadow 260ms var(--ease-smooth), border-color 260ms var(--ease-smooth); }
  #site-header.is-scrolled { background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(10px); box-shadow: 0 4px 24px -8px rgba(20, 27, 46, 0.12); border-bottom: 1px solid var(--hairline); }
  #site-header .nav-link { color: var(--cream); transition: color 200ms var(--ease-smooth), opacity 200ms; opacity: 0.9; }
  #site-header.is-scrolled .nav-link { color: var(--ink); }
  #site-header .nav-link:hover { opacity: 1; color: var(--royal); }
  #site-header .logo-text { color: var(--cream); transition: color 260ms var(--ease-smooth); }
  #site-header.is-scrolled .logo-text { color: var(--navy-900); }
  #site-header .hamburger-line { color: var(--cream); transition: color 260ms var(--ease-smooth); }
  #site-header.is-scrolled .hamburger-line { color: var(--navy-900); }
  #site-header .nav-phone-link { color: var(--cream); opacity: 0.9; transition: color 200ms var(--ease-smooth), opacity 200ms; }
  #site-header.is-scrolled .nav-phone-link { color: var(--navy-900); }
  #site-header .nav-phone-link:hover { opacity: 1; color: var(--royal); }

  /* ===== LANGUAGE SWITCHER (SK | PL) — filled by renderLangSwitcher() ===== */
  .lang-switcher { gap: 6px; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; }
  .lang-switcher__item { padding: 4px 2px; transition: color 200ms var(--ease-smooth), opacity 200ms; }
  .lang-switcher__sep { opacity: 0.35; }
  #site-header .lang-switcher { color: var(--cream); }
  #site-header.is-scrolled .lang-switcher { color: var(--navy-900); }
  .lang-switcher a.lang-switcher__item { opacity: 0.65; text-decoration: none; }
  .lang-switcher a.lang-switcher__item:hover { opacity: 1; color: var(--royal); }
  .lang-switcher a.lang-switcher__item:focus-visible { outline: 2px solid var(--royal); outline-offset: 2px; border-radius: 4px; opacity: 1; }
  .lang-switcher a.lang-switcher__item:active { opacity: 1; }
  .lang-switcher__item--active { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
  #mobile-menu .lang-switcher { color: var(--navy-900); font-size: 1rem; }

  #mobile-menu { transform: translateX(100%); transition: transform 320ms var(--ease-smooth); }
  #mobile-menu.is-open { transform: translateX(0); }
  #mobile-menu-backdrop { opacity: 0; pointer-events: none; transition: opacity 260ms var(--ease-smooth); }
  #mobile-menu-backdrop.is-open { opacity: 1; pointer-events: auto; }

  /* ===== HERO ===== */
  #hero { min-height: 100svh; }
  .hero-copy-shadow { text-shadow: 0 4px 28px rgba(10, 14, 24, 0.7), 0 2px 8px rgba(10, 14, 24, 0.6), 0 1px 2px rgba(10, 14, 24, 0.5); }
  /* The seal artwork runs edge-to-edge in the source file, so the round mask would
     shave its outer ring. Padding keeps the ring inside the disc; the white ground
     matches the artwork's own background, so the two read as one chip. */
  .trust-badge {
    width: 147px; height: 147px; border-radius: 999px;
    overflow: hidden;
    background: #fff;
    padding: 11px;
    animation: badge-float 4.5s var(--ease-smooth) infinite;
  }
  @keyframes badge-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
  }
  @media (prefers-reduced-motion: reduce) {
    .trust-badge { animation: none; }
  }

  /* ===== PROCESS TIMELINE ===== */
  #process-steps { position: relative; padding-top: 1.5rem; }
  .process-track {
    position: absolute;
    top: 50%;
    left: 12.5%;
    right: 12.5%;
    height: 2px;
    transform: translateY(-50%);
    background-image: repeating-linear-gradient(90deg, var(--cream) 0 10px, transparent 10px 22px);
    opacity: 0.4;
    z-index: 0;
    animation: process-track-flow 3.2s ease-in-out infinite alternate;
  }
  @keyframes process-track-flow {
    from { background-position-x: 0; }
    to { background-position-x: 22px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .process-track { animation: none; }
  }
  .process-card { position: relative; z-index: 1; padding-top: 2rem; }
  .process-badge {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: var(--shadow-card);
  }

  /* ===== PROCESS BACKGROUND — faint topographic contours + glow, keyed to the dark navy panel ===== */
  .process-pattern::before {
    content: '';
    position: absolute;
    inset: 0;
    background-size: 360px 360px;
    opacity: 0.09;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360'%3E%3Cg fill='none' stroke='%237B96C9' stroke-width='1.2'%3E%3Cpath d='M-40 50 Q 50 10, 140 50 T 320 50 T 500 50'/%3E%3Cpath d='M-40 120 Q 50 80, 140 120 T 320 120 T 500 120'/%3E%3Cpath d='M-40 190 Q 50 150, 140 190 T 320 190 T 500 190'/%3E%3Cpath d='M-40 260 Q 50 220, 140 260 T 320 260 T 500 260'/%3E%3Cpath d='M-40 330 Q 50 290, 140 330 T 320 330 T 500 330'/%3E%3C/g%3E%3C/svg%3E");
  }
  .process-pattern::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 55% 40% at 22% 15%, rgba(30, 64, 196, 0.35), transparent 70%),
      radial-gradient(ellipse 45% 35% at 82% 85%, rgba(123, 150, 201, 0.18), transparent 70%);
  }

  /* ===== TOUR CARDS ===== */
  .tour-card { background: var(--surface); border-radius: var(--radius-card); overflow: hidden; }
  .tour-card .tour-media { aspect-ratio: 4 / 3; }
  .tour-card .tour-media::after { background: linear-gradient(to top, rgba(20, 27, 46, 0.32), rgba(20, 27, 46, 0) 32%); }
  .tour-card .info-strip { transform: translateY(50%); box-shadow: var(--shadow-card); z-index: 2; }
  /* The card photo is a link to the detail page (see renderTourCard in main.js). The overlay
     sits above .media::after; .info-strip shares z-index 2 but comes later in the DOM, so it
     stays painted on top and the pill itself is not a click target. */
  .tour-card .tour-media-link { position: absolute; inset: 0; z-index: 2; }
  .tour-card .tour-media img { transition: transform 320ms var(--ease-spring); }
  .tour-card .tour-media:hover img { transform: scale(1.04); }
  .tour-card .tour-media:active img { transform: scale(1.01); }
  @media (prefers-reduced-motion: reduce) {
    .tour-card .tour-media img { transition: none; }
    .tour-card .tour-media:hover img,
    .tour-card .tour-media:active img { transform: none; }
  }
  .star { color: var(--royal); }
  .star--empty { color: var(--hairline); }

  /* ===== SEASON TOGGLE ===== */
  .season-pill {
    font-family: 'Sora', sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.75rem 1.75rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--hairline);
    background: var(--surface);
    color: var(--muted);
    cursor: pointer;
    transition: background-color 200ms var(--ease-smooth), color 200ms var(--ease-smooth), border-color 200ms var(--ease-smooth), box-shadow 220ms var(--ease-spring), transform 220ms var(--ease-spring);
  }
  .season-pill:hover { color: var(--ink); border-color: var(--royal); }
  .season-pill:active { transform: scale(0.97); }
  .season-pill[aria-pressed="true"] { background: var(--royal); border-color: var(--royal); color: var(--cream); box-shadow: var(--shadow-card); }
  .season-pill[aria-pressed="true"]:hover { color: var(--cream); }

  .season-group { opacity: 1; transform: translateY(0); transition: opacity 220ms var(--ease-smooth), transform 220ms var(--ease-smooth); }
  .season-group.is-entering { opacity: 0; transform: translateY(6px); }
  @media (prefers-reduced-motion: reduce) { .season-group { transition: none; } }

  .tour-more-note-link { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--hairline); transition: color 200ms var(--ease-smooth), text-decoration-color 200ms var(--ease-smooth); }
  .tour-more-note-link:hover { color: var(--royal); text-decoration-color: var(--royal); }

  /* ===== TESTIMONIALS ===== */
  .testimonial-card wistia-player { display: block; width: 100%; }
  .testimonial-card wistia-player:not(:defined) { background: center / contain no-repeat var(--wistia-swatch); filter: blur(5px); padding-top: 177.78%; }

  /* ===== TESTIMONIALS BACKGROUND — layered radial gradients + fine grain for depth on the light surface, same base color ===== */
  .testimonials-bg { position: relative; isolation: isolate; }
  .testimonials-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
      radial-gradient(640px 480px at 8% 0%, rgba(30, 64, 196, 0.06), transparent 70%),
      radial-gradient(720px 560px at 100% 100%, rgba(123, 150, 201, 0.10), transparent 70%);
  }
  .testimonials-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.035;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ===== GALLERY ===== */
  .gallery-item { overflow: hidden; border-radius: 14px; cursor: zoom-in; }
  .gallery-item img { transition: transform 420ms var(--ease-smooth); }
  .gallery-item:hover img { transform: scale(1.06); }
  .gallery-bg-photo { filter: grayscale(0.4) brightness(0.7) blur(2px); transform: scale(1.05); }
  .gallery-bg-scrim { background: linear-gradient(180deg, rgba(20, 27, 46, 0.8), rgba(20, 27, 46, 0.88)); }

  /* ===== LIGHTBOX ===== */
  #lightbox { background: rgba(20, 27, 46, 0.92); }

  /* ===== FAQ TOPOGRAPHIC TEXTURE — subtle contour-line motif behind the accordion cards ===== */
  .topo { position: relative; isolation: isolate; }
  .topo::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.06;
    background-size: 220px 220px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cg fill='none' stroke='%231E40C4' stroke-width='1.2'%3E%3Cpath d='M-20 24 Q 35 2, 90 24 T 200 24 T 310 24'/%3E%3Cpath d='M-20 68 Q 35 46, 90 68 T 200 68 T 310 68'/%3E%3Cpath d='M-20 112 Q 35 90, 90 112 T 200 112 T 310 112'/%3E%3Cpath d='M-20 156 Q 35 134, 90 156 T 200 156 T 310 156'/%3E%3Cpath d='M-20 200 Q 35 178, 90 200 T 200 200 T 310 200'/%3E%3C/g%3E%3C/svg%3E");
  }
  .topo > * { position: relative; z-index: 1; }

  /* ===== FAQ ACCORDION (CSS grid-rows trick — no JS height measuring) ===== */
  .faq-panel-wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 320ms var(--ease-smooth); }
  .faq-item.is-open .faq-panel-wrap { grid-template-rows: 1fr; }
  .faq-panel-inner { overflow: hidden; }
  .faq-chevron { transition: transform 280ms var(--ease-spring); }
  .faq-item.is-open .faq-chevron { transform: rotate(180deg); }

  /* ===== MODAL / LIGHTBOX SHARED OVERLAY ===== */
  .overlay-backdrop { background: rgba(20, 27, 46, 0.6); backdrop-filter: blur(3px); }
  .modal-panel, .lightbox-panel { animation: pop-in 260ms var(--ease-spring); }
  @keyframes pop-in { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @media (prefers-reduced-motion: reduce) { .modal-panel, .lightbox-panel { animation: none; } }

  .field-error { color: #B3261E; font-size: 0.8rem; margin-top: 0.35rem; }
  .field-input.is-invalid { border-color: #B3261E !important; }
  .required-mark { color: #B3261E; }

  .spinner { width: 1rem; height: 1rem; border-radius: 999px; border: 2px solid rgba(245,240,230,0.4); border-top-color: var(--cream); animation: spin 700ms linear infinite; }
  @keyframes spin { to { transform: rotate(360deg); } }

  /* ===== WHATSAPP FAB ===== */
  #whatsapp-fab { opacity: 0; transform: translateY(16px) scale(0.9); transition: opacity 420ms var(--ease-spring) 400ms, transform 420ms var(--ease-spring) 400ms; }
  #whatsapp-fab.is-visible { opacity: 1; transform: translateY(0) scale(1); }
  #whatsapp-fab:hover { transform: translateY(-3px) scale(1.05); }

  /* ===== SECTION REVEAL ON SCROLL ===== */
  .reveal { opacity: 0; transform: translateY(24px); transition: opacity 640ms var(--ease-smooth), transform 640ms var(--ease-smooth); }
  .reveal.is-visible { opacity: 1; transform: translateY(0); }
  @media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
  }

  [hidden] { display: none !important; }