*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --bg:        #FAF8F3;
      --surface:   #FFFFFF;
      --surface2:  #F2EEE6;
      --surface3:  #ECE5D7;
      --fg:        #1F1B16;
      --muted:     #6B6457;
      --muted2:    #A39A8B;
      --accent:    #f8761f;
      --accent2:   #d86218;
      --accent-soft: rgba(248,118,31,0.12);
      --border:    #E8E2D5;
      --border2:   #D2CABA;
      --shadow-sm: 0 1px 2px rgba(120,90,40,.05), 0 4px 14px rgba(120,90,40,.05);
      --shadow-md: 0 2px 6px rgba(120,90,40,.06), 0 14px 32px rgba(120,90,40,.08);
      --shadow-lg: 0 4px 12px rgba(120,90,40,.07), 0 24px 48px rgba(248,118,31,.10);

      --font-d: 'Barlow Condensed', system-ui, sans-serif;
      --font-b: 'Barlow', system-ui, -apple-system, sans-serif;
      --nav-h:  64px;
    }

    html { scroll-behavior: smooth; font-size: 16px; }
    body {
      font-family: var(--font-b);
      background: var(--bg);
      color: var(--fg);
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    }

    /* ─── NAV ────────────────────────────────────────────── */
    .nav {
      position: fixed;
      inset-block-start: 0;
      inset-inline: 0;
      height: var(--nav-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-inline-start: clamp(10px, 1.4vw, 18px);
      padding-inline-end: clamp(14px, 1.8vw, 22px);
      z-index: 200;
      transition: background .35s, border-color .35s, box-shadow .35s;
      border-block-end: 1px solid transparent;
    }
    .nav.solid {
      background: rgba(250,248,243,.92);
      backdrop-filter: blur(14px);
      border-block-end-color: var(--border);
      box-shadow: 0 1px 0 rgba(120,90,40,.04);
    }
    .nav-logo {
      display: flex;
      align-items: center;
      flex-shrink: 0;
      text-decoration: none;
      transition: filter .35s;
    }
    .nav-logo img {
      display: block;
      height: 25px;
      width: auto;
      transition: filter .35s;
    }
    .nav-links {
      display: flex;
      align-items: center;
      gap: clamp(14px, 1.8vw, 28px);
      list-style: none;
    }
    .nav-links > li { flex-shrink: 0; }
    .nav-links a {
      color: var(--muted);
      text-decoration: none;
      font-size: 15px;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      transition: color .2s;
      white-space: nowrap;
    }
    .nav-links a:hover { color: var(--fg); }
    .nav-book {
      background: var(--accent);
      color: #fff !important;
      padding: 8px 20px;
      border-radius: 8px;
      font-weight: 700 !important;
      letter-spacing: .08em !important;
      transition: background .2s, transform .1s !important;
      white-space: nowrap;
    }
    .nav-book:hover { background: var(--accent2) !important; transform: translateY(-1px); }

    .nav-right {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0;
    }
    .nav-langs {
      display: flex;
      align-items: center;
      gap: 1px;
      padding: 2px;
      background: rgba(248,118,31,.06);
      border: 1px solid rgba(248,118,31,.14);
      border-radius: 999px;
    }
    .lang-pill {
      font-family: var(--font-d);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .02em;
      padding: 3px 7px;
      border-radius: 999px;
      color: var(--muted);
      text-decoration: none;
      cursor: pointer;
      transition: background .2s, color .2s;
      line-height: 1;
      white-space: nowrap;
    }
    .lang-pill:hover { color: var(--fg); }
    .lang-pill.active {
      background: var(--accent);
      color: #fff;
      box-shadow: 0 2px 6px rgba(248,118,31,.25);
    }
    .lang-pill.active:hover { color: #fff; }

    .toast {
      position: fixed;
      inset-block-end: 32px;
      inset-inline-start: 50%;
      transform: translateX(-50%) translateY(20px);
      background: var(--fg);
      color: var(--bg);
      padding: 14px 22px;
      border-radius: 999px;
      font-size: 14px;
      font-weight: 500;
      box-shadow: 0 8px 32px rgba(31,27,22,.28);
      opacity: 0;
      pointer-events: none;
      transition: opacity .25s, transform .25s;
      z-index: 300;
      max-width: calc(100vw - 32px);
    }
    .toast.show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 6px 4px;
      background: none;
      border: none;
    }
    .hamburger span { display: block; width: 22px; height: 2px; background: var(--fg); border-radius: 1px; transition: .3s; }
    .hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity: 0; }
    .hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    .nav-drawer {
      display: none;
      position: fixed;
      inset-block-start: var(--nav-h);
      inset-inline: 0;
      background: rgba(250,248,243,.98);
      backdrop-filter: blur(20px);
      padding: 20px 24px 32px;
      z-index: 190;
      flex-direction: column;
      border-block-end: 1px solid var(--border);
    }
    .nav-drawer.open { display: flex; }
    .nav-drawer a {
      color: var(--muted);
      text-decoration: none;
      font-size: 20px;
      font-weight: 700;
      font-family: var(--font-d);
      letter-spacing: .08em;
      text-transform: uppercase;
      padding: 13px 0;
      border-block-end: 1px solid var(--border);
      transition: color .2s;
    }
    .nav-drawer a:last-child { border-block-end: none; color: var(--accent); margin-block-start: 8px; }
    .nav-drawer a:hover { color: var(--fg); }

    /* ─── HERO ───────────────────────────────────────────── */
    .hero {
      min-height: 100svh;
      background: var(--bg);
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding-block-end: clamp(48px, 7vw, 80px);
      padding-inline: clamp(16px, 5vw, 64px);
      padding-block-start: calc(var(--nav-h) + 40px);
      position: relative;
      overflow: hidden;
    }
    .hero { background: #1a1a1f; }
    .hero-slides {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
    }
    .hero-slide {
      position: absolute;
      inset: 0;
      opacity: 0;
      transition: opacity 1.4s ease-in-out;
    }
    .hero-slide.active { opacity: 1; }
    .hero-slide-bg { position: absolute; inset: 0; }
    .hero-slide svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
    .hero-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
    .hero-scrim {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background:
        linear-gradient(105deg, rgba(15,12,10,0.62) 0%, rgba(15,12,10,0.42) 38%, rgba(15,12,10,0.08) 62%, transparent 75%),
        linear-gradient(to top, rgba(15,12,10,0.45) 0%, rgba(15,12,10,0.10) 30%, transparent 55%);
    }
    #snow { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
    .hero-content { position: relative; z-index: 3; max-width: 1100px; }
    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #fff;
      font-family: var(--font-b);
      font-size: clamp(12px, 1.3vw, 14px);
      font-weight: 500;
      letter-spacing: .04em;
      margin-block-end: 22px;
      text-shadow: 0 1px 6px rgba(0,0,0,0.45);
    }
    .hero-badge-emoji { font-size: 16px; line-height: 1; }
    .hero-eyebrow {
      font-family: var(--font-d);
      font-size: clamp(11px, 1.4vw, 13px);
      font-weight: 700;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: #F7B274;
      margin-block-end: 18px;
      text-shadow: 0 1px 4px rgba(0,0,0,0.4);
    }
    .hero-title {
      font-family: var(--font-d);
      font-weight: 900;
      font-size: clamp(52px, 8.5vw, 112px);
      line-height: .9;
      letter-spacing: -.01em;
      text-transform: uppercase;
      color: #fff;
      margin-block-end: 18px;
      text-shadow: 0 2px 12px rgba(0,0,0,0.35);
    }
    .hero-title em { font-style: normal; color: #f8761f; }
    .hero-tagline {
      font-family: var(--font-b);
      font-size: clamp(16px, 2vw, 22px);
      font-weight: 500;
      color: rgba(255,248,236,0.92);
      line-height: 1.5;
      margin-block-end: 20px;
      text-shadow: 0 1px 6px rgba(0,0,0,0.4);
    }
    .hero-tagline em { color: #f8761f; font-style: normal; font-weight: 600; }
    .hero-sub {
      font-size: clamp(15px, 1.8vw, 18px);
      color: #fff;
      font-weight: 600;
      line-height: 1.5;
      max-width: 600px;
      margin-block-end: 8px;
      text-shadow: 0 1px 6px rgba(0,0,0,0.4);
    }
    .hero-sub2 {
      font-size: clamp(13px, 1.4vw, 15px);
      color: rgba(255,248,236,0.82);
      line-height: 1.6;
      max-width: 600px;
      margin-block-end: 36px;
      text-shadow: 0 1px 6px rgba(0,0,0,0.35);
    }
    .hero-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-block-end: 28px;
    }
    .hero-pill {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      background: rgba(255,255,255,0.12);
      backdrop-filter: blur(8px);
      border: 1px solid rgba(255,255,255,0.22);
      color: #fff;
      font-size: 13px;
      font-weight: 500;
      padding: 7px 14px;
      border-radius: 999px;
      letter-spacing: .02em;
    }
    .hero-pill svg { color: #F7A856; flex-shrink: 0; }
    .hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-block-end: 36px; }
    .hero-stats {
      display: flex;
      gap: clamp(20px, 4vw, 56px);
      padding-block-start: 24px;
      border-block-start: 1px solid rgba(255,255,255,0.18);
      max-width: 560px;
    }
    .hero-stat-n {
      font-family: var(--font-d);
      font-size: clamp(28px, 4vw, 42px);
      font-weight: 900;
      line-height: 1;
      color: #fff;
      text-shadow: 0 2px 8px rgba(0,0,0,0.35);
    }
    .hero-stat-n em { color: #F7A856; font-style: normal; }
    .hero-stat-l {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.72);
      margin-block-start: 5px;
      text-shadow: 0 1px 4px rgba(0,0,0,0.35);
    }
    .hero .btn-outline { color: #fff; border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.08); backdrop-filter: blur(4px); }
    .hero .btn-outline:hover { background: rgba(255,255,255,.18); border-color: #fff; }
    .hero-dots {
      position: absolute;
      inset-block-end: 32px;
      inset-inline-start: clamp(16px, 5vw, 64px);
      display: flex;
      gap: 8px;
      z-index: 3;
    }
    .hero-dot {
      width: 26px;
      height: 3px;
      background: rgba(255,255,255,0.32);
      border: none;
      cursor: pointer;
      padding: 0;
      border-radius: 2px;
      transition: background .3s, width .3s;
    }
    .hero-dot.active { background: #F7A856; width: 46px; }
    .hero-dot:hover { background: rgba(255,255,255,0.6); }
    .hero-dot.active:hover { background: #F7A856; }
    .hero-dot:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
    .btn {
      display: inline-block;
      text-decoration: none;
      font-family: var(--font-d);
      font-weight: 700;
      font-size: 15px;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 14px 34px;
      border-radius: 8px;
      transition: background .2s, border-color .2s, transform .1s, box-shadow .2s;
    }
    .btn-solid {
      background: var(--accent);
      color: #fff;
      box-shadow: 0 4px 14px rgba(248,118,31,.25);
    }
    .btn-solid:hover { background: var(--accent2); transform: translateY(-1px); box-shadow: 0 6px 18px rgba(248,118,31,.35); }
    .btn-outline {
      background: transparent;
      color: var(--fg);
      border: 1.5px solid var(--border2);
    }
    .btn-outline:hover { border-color: var(--fg); background: rgba(31,27,22,.04); }
    .hero-scroll {
      position: absolute;
      inset-block-end: 32px;
      inset-inline-end: clamp(16px, 5vw, 64px);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      font-family: var(--font-d);
      font-size: 10px;
      letter-spacing: .25em;
      text-transform: uppercase;
      color: rgba(255,248,236,0.78);
      z-index: 3;
      text-shadow: 0 1px 4px rgba(0,0,0,0.4);
    }
    .hero-scroll::after {
      content: '';
      width: 1px;
      height: 40px;
      background: linear-gradient(to bottom, rgba(255,255,255,.6), transparent);
      animation: scrollPulse 2s ease-in-out infinite;
    }
    .nav:not(.solid) .nav-logo img { filter: drop-shadow(0 1px 4px rgba(0,0,0,0.4)); }
    .nav:not(.solid) .nav-links a { color: var(--accent); text-shadow: 0 1px 4px rgba(0,0,0,0.25); }
    .nav:not(.solid) .nav-links a:hover { color: #1a1208; text-shadow: none; }
    .nav:not(.solid) .nav-book { background: var(--accent); color: #fff !important; }
    .nav:not(.solid) .hamburger span { background: #fff; }
    .nav:not(.solid) .nav-langs { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.22); }
    .nav:not(.solid) .lang-pill { color: rgba(255,248,236,.78); text-shadow: 0 1px 3px rgba(0,0,0,.25); }
    .nav:not(.solid) .lang-pill:hover { color: #fff; }
    .nav:not(.solid) .lang-pill.active { background: var(--accent); color: #fff; text-shadow: none; }
    @keyframes scrollPulse {
      0%, 100% { opacity: .4; }
      50% { opacity: 1; }
    }

    /* ─── PRICE STRIP ────────────────────────────────────── */
    .price-strip {
      background: var(--surface);
      border-block: 1px solid var(--border);
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 0;
    }
    .price-pill {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 18px clamp(20px, 4vw, 48px);
      border-inline-end: 1px solid var(--border);
      cursor: pointer;
      text-decoration: none;
      color: var(--fg);
      transition: background .2s;
    }
    .price-pill:last-child { border-inline-end: none; }
    .price-pill:hover { background: rgba(248,118,31,.05); }
    .price-pill-tag {
      font-family: var(--font-d);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--muted);
    }
    .price-pill-amt {
      font-family: var(--font-d);
      font-size: clamp(20px, 3vw, 26px);
      font-weight: 800;
      color: var(--fg);
    }
    .price-pill-amt span { font-size: 12px; font-weight: 500; color: var(--muted); }
    .price-pill-label { font-size: 12px; color: var(--muted); letter-spacing: .04em; }

    /* ─── TICKER ────────────────────────────────────────── */
    .ticker {
      background: var(--accent);
      overflow: hidden;
      white-space: nowrap;
      padding-block: 11px;
    }
    .ticker-track {
      display: inline-flex;
      animation: marquee 38s linear infinite;
    }
    .ticker-item {
      display: inline-flex;
      align-items: center;
      gap: 20px;
      padding-inline: 28px;
      font-family: var(--font-d);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: rgba(255,255,255,.95);
    }
    .ticker-sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.55); flex-shrink: 0; }
    @keyframes marquee {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    /* ─── ABOUT ─────────────────────────────────────────── */
    .about {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 48px;
      padding: clamp(56px, 8vw, 100px) clamp(16px, 5vw, 64px);
      align-items: center;
      background: var(--bg);
    }
    .about-title {
      font-family: var(--font-d);
      font-size: clamp(40px, 6vw, 76px);
      font-weight: 900;
      line-height: .9;
      text-transform: uppercase;
      letter-spacing: -.01em;
      color: var(--fg);
    }
    .about-title .hi { color: var(--accent); }
    .about-tagline {
      font-family: var(--font-b);
      font-size: clamp(15px, 1.8vw, 20px);
      font-weight: 500;
      line-height: 1.5;
      color: var(--muted);
      margin-block-start: 18px;
    }
    .about-tagline em { color: var(--accent); font-style: normal; font-weight: 600; }
    .about-body {
      color: var(--muted);
      font-size: clamp(14px, 1.5vw, 16px);
      line-height: 1.72;
    }
    .about-body strong { color: var(--fg); }
    .about-sub { margin-block-start: 12px; font-size: 13px; color: var(--muted2); line-height: 1.6; }
    .about-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-block-start: 20px;
    }
    .about-pill {
      display: flex;
      align-items: center;
      gap: 7px;
      background: var(--accent-soft);
      border: 1px solid rgba(248,118,31,.22);
      border-radius: 24px;
      padding: 6px 14px;
      font-size: 13px;
      color: var(--fg);
      font-weight: 500;
    }
    .about-pill svg { color: var(--accent); flex-shrink: 0; }
    .about-addr {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin-block-start: 28px;
      color: var(--muted);
      font-size: 14px;
    }
    .addr-icon { flex-shrink: 0; width: 20px; height: 20px; color: var(--accent); margin-block-start: 2px; }
    .addr-main { color: var(--fg); font-weight: 600; font-size: 15px; display: block; }

    /* ─── STATS ─────────────────────────────────────────── */
    .stats {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      background: var(--surface2);
      border-block: 1px solid var(--border);
    }
    .stat {
      padding: clamp(24px, 3.5vw, 44px) 20px;
      text-align: center;
      border-inline-end: 1px solid var(--border);
    }
    .stat:last-child { border-inline-end: none; }
    .stat-n {
      font-family: var(--font-d);
      font-size: clamp(38px, 5vw, 60px);
      font-weight: 900;
      line-height: 1;
      letter-spacing: -.02em;
      color: var(--fg);
    }
    .stat-n em { color: var(--accent); font-style: normal; }
    .stat-l {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--muted);
      margin-block-start: 6px;
    }

    /* ─── SECTIONS ──────────────────────────────────────── */
    .section { padding: clamp(64px, 9vw, 110px) clamp(16px, 5vw, 64px); }
    .section-light  { background: var(--bg); }
    .section-soft   { background: var(--surface2); }
    .sec-eyebrow {
      font-family: var(--font-d);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: var(--accent);
      margin-block-end: 12px;
    }
    .sec-title {
      font-family: var(--font-d);
      font-size: clamp(36px, 6vw, 72px);
      font-weight: 900;
      line-height: 1.1;
      text-transform: uppercase;
      letter-spacing: -.01em;
      margin-block-end: 16px;
      color: var(--fg);
    }
    .sec-sub {
      font-size: clamp(14px, 1.5vw, 16px);
      color: var(--muted);
      line-height: 1.65;
      max-width: 540px;
      margin-block-end: 48px;
    }

    /* ─── EQUIPMENT PACKAGES ────────────────────────────── */
    .pkg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .pkg {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 16px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      transition: transform .25s, border-color .25s, box-shadow .25s;
      position: relative;
      box-shadow: var(--shadow-sm);
    }
    .pkg:hover { transform: translateY(-5px); border-color: var(--accent); box-shadow: var(--shadow-lg); }
    .pkg.feat { border-color: var(--accent); box-shadow: var(--shadow-md); }
    .pkg-badge {
      position: absolute;
      inset-block-start: 14px;
      inset-inline-end: 14px;
      background: var(--accent);
      color: #fff;
      font-family: var(--font-d);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      padding: 5px 12px;
      border-radius: 24px;
      z-index: 1;
    }
    .pkg-vis {
      aspect-ratio: 16/9;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      position: relative;
    }
    .pkg-vis.beginner { background: linear-gradient(135deg, #FBE7CB 0%, #F8D29D 100%); }
    .pkg-vis.rider    { background: linear-gradient(135deg, #FAD9B0 0%, #F2A765 60%, #E07A2A 120%); }
    .pkg-vis.flow-pro { background: linear-gradient(135deg, #E9DCC4 0%, #C99868 60%, #9A6630 130%); }
    .pkg-vis-board { width: 70%; max-width: 140px; opacity: .85; }
    .pkg-body { padding: 24px; flex: 1; display: flex; flex-direction: column; }
    .pkg-tier {
      font-family: var(--font-d);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--accent);
      margin-block-end: 7px;
    }
    .pkg-name {
      font-family: var(--font-d);
      font-size: clamp(22px, 2.8vw, 30px);
      font-weight: 900;
      text-transform: uppercase;
      line-height: 1;
      margin-block-end: 10px;
      color: var(--fg);
    }
    .pkg-desc { font-size: 14px; color: var(--muted); line-height: 1.62; flex: 1; }
    .pkg-divider { height: 1px; background: var(--border); margin-block: 18px; }
    .pkg-inc-label {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--muted);
      margin-block-end: 10px;
    }
    .pkg-items { list-style: none; display: flex; flex-direction: column; gap: 7px; }
    .pkg-items li {
      font-size: 13px;
      color: var(--muted);
      display: flex;
      align-items: center;
      gap: 9px;
    }
    .pkg-items li::before {
      content: '';
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: var(--accent);
      flex-shrink: 0;
    }
    .pkg-price { margin-block-start: 18px; font-family: var(--font-d); font-size: clamp(26px, 3vw, 34px); font-weight: 900; color: var(--fg); }
    .pkg-price sub { font-size: 13px; font-weight: 500; color: var(--muted); vertical-align: baseline; }
    .pkg-cta {
      display: block;
      text-align: center;
      margin-block-start: 14px;
      padding: 12px;
      border-radius: 8px;
      font-family: var(--font-d);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      text-decoration: none;
      color: var(--fg);
      background: transparent;
      border: 1.5px solid var(--border2);
      transition: background .2s, border-color .2s, color .2s;
    }
    .pkg-cta:hover, .pkg.feat .pkg-cta { background: var(--accent); border-color: var(--accent); color: #fff; }
    .pkg.feat .pkg-cta:hover { background: var(--accent2); }

    /* ─── BRANDS ────────────────────────────────────────── */
    .brands {
      background: var(--surface3);
      border-block: 1px solid var(--border);
      padding: clamp(32px, 4vw, 52px) clamp(16px, 5vw, 64px);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 28px;
    }
    .brands-label { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
    .brands-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(28px, 6vw, 72px);
      flex-wrap: wrap;
    }
    .brand-name {
      font-family: var(--font-d);
      font-size: clamp(18px, 3vw, 26px);
      font-weight: 900;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: rgba(31,27,22,.32);
      transition: color .3s;
    }
    .brand-name:hover { color: var(--fg); }

    /* ─── RESORTS ───────────────────────────────────────── */
    .resorts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
    .resort {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 24px 20px;
      transition: transform .2s, border-color .2s, box-shadow .2s;
      box-shadow: var(--shadow-sm);
    }
    .resort:hover { transform: translateY(-3px); border-color: var(--accent); box-shadow: var(--shadow-md); }
    .resort-num { font-family: var(--font-d); font-size: 10px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-block-end: 12px; }
    .resort-name { font-family: var(--font-d); font-size: clamp(18px, 2.4vw, 24px); font-weight: 900; text-transform: uppercase; line-height: 1.05; margin-block-end: 4px; color: var(--fg); }
    .resort-sub { font-size: 12px; color: var(--muted); margin-block-end: 18px; }
    .resort-time { display: flex; align-items: baseline; gap: 4px; }
    .resort-mins { font-family: var(--font-d); font-size: 36px; font-weight: 900; line-height: 1; color: var(--fg); }
    .resort-unit { font-size: 12px; color: var(--muted); }
    .resort-note { font-size: 12px; color: var(--muted2); margin-block-start: 4px; }

    /* ─── BOOKING STEPS ─────────────────────────────────── */
    .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-block-end: 48px; }
    .step {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 28px 24px;
      position: relative;
      overflow: hidden;
      box-shadow: var(--shadow-sm);
    }
    .step-bg-num {
      position: absolute;
      inset-inline-end: 16px;
      inset-block-start: 8px;
      font-family: var(--font-d);
      font-size: 80px;
      font-weight: 900;
      color: rgba(248,118,31,.12);
      line-height: 1;
      pointer-events: none;
    }
    .step-icon {
      width: 44px;
      height: 44px;
      background: var(--accent-soft);
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--accent);
      margin-block-end: 18px;
    }
    .step-title { font-family: var(--font-d); font-size: 22px; font-weight: 800; text-transform: uppercase; margin-block-end: 8px; color: var(--fg); }
    .step-desc { font-size: 14px; color: var(--muted); line-height: 1.62; }
    .book-cta {
      background: linear-gradient(135deg, rgba(248,118,31,.12) 0%, rgba(247,168,86,.06) 100%);
      border: 1px solid rgba(248,118,31,.28);
      border-radius: 18px;
      padding: clamp(36px, 5vw, 60px);
      text-align: center;
    }
    .book-cta-title { font-family: var(--font-d); font-size: clamp(30px, 5vw, 54px); font-weight: 900; text-transform: uppercase; line-height: .95; margin-block-end: 12px; color: var(--fg); }
    .book-cta-sub { font-size: 15px; color: var(--muted); margin-block-end: 32px; }
    .btn-lg {
      display: inline-block;
      background: var(--accent);
      color: #fff;
      text-decoration: none;
      font-family: var(--font-d);
      font-size: 18px;
      font-weight: 800;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 18px 52px;
      border-radius: 10px;
      transition: background .2s, transform .1s, box-shadow .2s;
      box-shadow: 0 6px 20px rgba(248,118,31,.32);
    }
    .btn-lg:hover { background: var(--accent2); transform: translateY(-2px); box-shadow: 0 10px 28px rgba(248,118,31,.42); }
    .book-note { margin-block-start: 16px; font-size: 13px; color: var(--muted2); }

    /* ─── CONTACT ───────────────────────────────────────── */
    .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
    .contact-title { font-family: var(--font-d); font-size: clamp(32px, 5vw, 56px); font-weight: 900; text-transform: uppercase; line-height: .9; margin-block-end: 28px; color: var(--fg); }
    .contact-intro { font-size: 15px; color: var(--muted); line-height: 1.65; margin-block-end: 32px; max-width: 420px; }
    .contact-links { display: flex; flex-direction: column; gap: 12px; }
    .contact-link { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--muted); font-size: 15px; transition: color .2s; }
    .contact-link:hover { color: var(--fg); }
    .contact-icon { width: 42px; height: 42px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .ci-email { background: var(--accent-soft); color: var(--accent); }
    .ci-ig    { background: rgba(225,48,108,.12); color: #E1306C; }
    .ci-line  { background: rgba(0,195,88,.12);   color: #00C358; }
    .ci-wa    { background: rgba(37,211,102,.12);  color: #25D366; }
    .contact-link-label { color: var(--fg); font-weight: 600; font-size: 15px; }
    .contact-link-handle { font-size: 13px; color: var(--muted); }
    .contact-panel { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-sm); }
    .map-wrap {
      aspect-ratio: 4/3;
      background:
        repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(31,27,22,.05) 39px, rgba(31,27,22,.05) 40px),
        repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(31,27,22,.05) 39px, rgba(31,27,22,.05) 40px),
        var(--surface2);
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }
    .map-dot {
      width: 14px;
      height: 14px;
      background: var(--accent);
      border-radius: 50%;
      box-shadow: 0 0 0 10px rgba(248,118,31,.20), 0 0 0 22px rgba(248,118,31,.10);
      animation: pls 2.2s ease-in-out infinite;
    }
    @keyframes pls {
      0%,100% { box-shadow: 0 0 0 10px rgba(248,118,31,.20), 0 0 0 22px rgba(248,118,31,.10); }
      50%      { box-shadow: 0 0 0 16px rgba(248,118,31,.14), 0 0 0 32px rgba(248,118,31,.05); }
    }
    .map-label {
      position: absolute;
      inset-block-start: 50%;
      inset-inline-start: 50%;
      transform: translate(-50%, -120%);
      background: var(--surface);
      border: 1px solid var(--border2);
      border-radius: 8px;
      padding: 6px 12px;
      font-size: 12px;
      font-weight: 600;
      color: var(--fg);
      white-space: nowrap;
      letter-spacing: .04em;
      box-shadow: 0 4px 12px rgba(120,90,40,.08);
    }
    .map-label::after {
      content: '';
      position: absolute;
      inset-block-start: 100%;
      inset-inline-start: 50%;
      transform: translateX(-50%);
      border: 5px solid transparent;
      border-block-start-color: var(--surface);
    }
    .hours-panel { padding: 20px 24px; border-block-start: 1px solid var(--border); }
    .hours-title { font-family: var(--font-d); font-size: 10px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-block-end: 14px; }
    .hours-row { display: flex; justify-content: space-between; align-items: center; font-size: 14px; color: var(--muted); padding-block: 5px; }
    .hours-row:not(:last-child) { border-block-end: 1px solid var(--border); }
    .hours-row strong { color: var(--fg); }

    /* ─── FOOTER ────────────────────────────────────────── */
    .footer {
      background: var(--surface2);
      border-block-start: 1px solid var(--border);
      padding: 28px clamp(16px, 5vw, 64px) 32px;
      display: flex;
      flex-direction: column;
      gap: 22px;
    }
    .footer-langs {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px 4px;
      padding-block-end: 22px;
      border-block-end: 1px solid var(--border);
    }
    .footer-langs-label {
      font-family: var(--font-d);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--muted2);
      margin-inline-end: 14px;
    }
    .footer-langs a {
      display: inline-block;
      padding: 6px 12px;
      font-size: 13px;
      font-weight: 500;
      color: var(--muted);
      text-decoration: none;
      border-radius: 20px;
      transition: background .2s, color .2s;
    }
    .footer-langs a:hover { background: rgba(248,118,31,.08); color: var(--fg); }
    .footer-langs a.active { background: var(--accent); color: #fff; font-weight: 600; }
    .footer-langs a.active:hover { background: var(--accent2); color: #fff; }
    .footer-langs .sep { color: var(--muted2); font-size: 12px; user-select: none; }

    .footer-bottom {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 16px;
    }
    .footer-logo { font-family: var(--font-d); font-size: 18px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
    .footer-logo .dot { color: var(--accent); }
    .footer-copy { font-size: 13px; color: var(--muted2); }
    .footer-links { display: flex; gap: 20px; }
    .footer-links a { font-size: 13px; color: var(--muted); text-decoration: none; transition: color .2s; }
    .footer-links a:hover { color: var(--fg); }

    /* ─── MOBILE STICKY CTA ─────────────────────────────── */
    .sticky-cta {
      display: none;
      position: fixed;
      inset-block-end: 0;
      inset-inline: 0;
      padding: 12px 16px;
      background: rgba(250,248,243,.96);
      backdrop-filter: blur(12px);
      border-block-start: 1px solid var(--border);
      box-shadow: 0 -4px 20px rgba(120,90,40,.08);
      z-index: 150;
    }
    .sticky-cta a {
      display: block;
      width: 100%;
      text-align: center;
      background: var(--accent);
      color: #fff;
      text-decoration: none;
      font-family: var(--font-d);
      font-size: 16px;
      font-weight: 800;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 16px;
      border-radius: 10px;
      transition: background .2s;
      box-shadow: 0 4px 14px rgba(248,118,31,.3);
    }
    .sticky-cta a:hover { background: var(--accent2); }

    .drawer-langs {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      padding: 16px 0 6px;
      border-block-end: 1px solid var(--border);
      margin-block-end: 8px;
    }
    .drawer-langs .lang-pill {
      flex: 1 1 auto;
      text-align: center;
      padding: 10px 14px;
      font-size: 13px;
      border: 1px solid var(--border);
    }

    @media (max-width: 900px) {
      .nav-right .nav-langs { display: none; }
      .nav-links { display: none; }
      .hamburger { display: flex; flex-shrink: 0; }
      .nav-logo { flex-shrink: 1; min-width: 0; overflow: hidden; }
      .nav-logo img { height: 20px; max-width: 100%; object-fit: contain; object-position: left center; }
      .nav-right { flex-shrink: 0; }
      .about { grid-template-columns: 1fr; }
      .stats { grid-template-columns: repeat(2, 1fr); }
      .stat:nth-child(2) { border-inline-end: none; }
      .stat:nth-child(3) { border-block-start: 1px solid var(--border); }
      .pkg-grid { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
      .steps { grid-template-columns: 1fr; }
      .contact-grid { grid-template-columns: 1fr; }
      .footer-bottom { flex-direction: column; text-align: center; }
      .footer-langs { justify-content: center; }
      .footer-langs-label { width: 100%; text-align: center; margin-inline-end: 0; margin-block-end: 6px; }
      .sticky-cta { display: block; }
      .hero-dots { inset-block-end: 96px; }
    }
    @media (max-width: 600px) {
      .nav-book { padding: 7px 12px; font-size: 13px; }
      .nav-logo img { max-width: min(46vw, 200px); }
      .price-strip { flex-direction: column; }
      .price-pill { border-inline-end: none; border-block-end: 1px solid var(--border); justify-content: space-between; }
      .price-pill:last-child { border-block-end: none; }
      .resorts-grid { grid-template-columns: 1fr 1fr; }
    }
    section { scroll-margin-block-start: var(--nav-h); }