:root{
    --bg:        oklch(0.965 0.012 88);   /* warm sand */
    --bg-deep:   oklch(0.935 0.018 92);
    --bg-card:   oklch(0.992 0.006 90);
    --ocean:     oklch(0.285 0.058 245);  /* deep ocean navy */
    --ocean-2:   oklch(0.225 0.052 248);  /* darker */
    --ink:       oklch(0.300 0.050 246);
    --ink-soft:  oklch(0.455 0.038 246);
    --muted:     oklch(0.585 0.025 248);
    --line:      oklch(0.300 0.050 246 / 0.14);
    --line-soft: oklch(0.300 0.050 246 / 0.07);
    --aqua:      oklch(0.715 0.118 205);  /* Caribbean aqua — primary */
    --aqua-deep: oklch(0.585 0.110 214);
    --sand:      oklch(0.795 0.072 72);    /* warm sand — secondary */
    --coral:     oklch(0.640 0.140 32);    /* advanced/alert */

    --disp: "Archivo", system-ui, sans-serif;
    --sans: "Manrope", system-ui, -apple-system, sans-serif;

    --maxw: 1280px;
    --gutter: clamp(20px, 5vw, 90px);
    --ease: cubic-bezier(.22,.61,.36,1);
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
  body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.62; font-weight:400; overflow-x:hidden; }
  @media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
  ::selection{ background:var(--aqua); color:var(--ocean-2); }
  a{ color:inherit; text-decoration:none; }
  img{ display:block; max-width:100%; }
  h1,h2,h3,h4{ margin:0; font-weight:400; }
  p{ margin:0; }
  button{ font-family:inherit; cursor:pointer; }
  .wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter); }
  .disp{ font-family:var(--disp); font-weight:800; letter-spacing:-0.02em; }
  .eyebrow{ font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.24em; color:var(--aqua-deep); display:inline-flex; align-items:center; gap:.7em; }
  .eyebrow::before{ content:""; width:22px; height:2px; border-radius:2px; background:var(--aqua); display:inline-block; }

  html.reveal-on .reveal{ opacity:0; transform:translateY(22px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
  html.reveal-on .reveal.in{ opacity:1; transform:none; }
  html.reveal-on .reveal.d1{ transition-delay:.08s; }
  html.reveal-on .reveal.d2{ transition-delay:.16s; }
  html.reveal-on .reveal.d3{ transition-delay:.24s; }

  /* ============ NAV ============ */
  header.nav{ position:fixed; inset:0 0 auto 0; z-index:50; border-bottom:1px solid transparent; transition:background .5s var(--ease), border-color .5s, backdrop-filter .5s; }
  header.nav.scrolled{ background:oklch(0.965 0.012 88 / 0.86); backdrop-filter:blur(16px) saturate(1.1); border-bottom:1px solid var(--line-soft); }
  .nav-inner{ max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); height:78px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
  .brand{ display:flex; align-items:center; gap:12px; color:#fff; transition:color .5s; }
  header.nav.scrolled .brand{ color:var(--ink); }
  .brand .mark{ width:38px; height:38px; border-radius:11px; background:var(--aqua); display:grid; place-items:center; color:var(--ocean-2); font-family:var(--disp); font-weight:900; font-size:18px; transition:transform .5s var(--ease); }
  .brand:hover .mark{ transform:rotate(-6deg); }
  .brand .wm{ font-family:var(--disp); font-weight:800; font-size:18px; letter-spacing:-0.01em; }
  .brand .wm small{ display:block; font-family:var(--sans); font-weight:600; font-size:9px; letter-spacing:.2em; text-transform:uppercase; opacity:.7; margin-top:2px; }
  nav.links{ display:flex; align-items:center; gap:28px; }
  nav.links a{ font-size:13px; font-weight:600; letter-spacing:.02em; color:oklch(1 0 0 / 0.86); position:relative; padding:6px 0; transition:color .3s; }
  header.nav.scrolled nav.links a{ color:var(--ink-soft); }
  nav.links a::after{ content:""; position:absolute; left:0; bottom:2px; height:2px; border-radius:2px; width:0; background:var(--aqua); transition:width .4s var(--ease); }
  nav.links a:hover{ color:#fff; }
  header.nav.scrolled nav.links a:hover{ color:var(--ink); }
  nav.links a:hover::after{ width:100%; }
  .nav-right{ display:flex; align-items:center; gap:16px; }
  .lang{ display:inline-flex; align-items:center; border:1px solid oklch(1 0 0 / 0.3); border-radius:100px; overflow:hidden; font-size:11px; font-weight:700; }
  header.nav.scrolled .lang{ border-color:var(--line); }
  .lang button{ background:none; border:none; padding:7px 11px; color:oklch(1 0 0 / 0.7); letter-spacing:.06em; transition:color .3s, background .3s; }
  header.nav.scrolled .lang button{ color:var(--muted); }
  .lang button.on{ background:var(--aqua); color:var(--ocean-2); }
  .btn-cta{ font-family:var(--disp); font-weight:700; font-size:13px; letter-spacing:.02em; padding:11px 22px; border-radius:100px; background:var(--aqua); color:var(--ocean-2); border:1px solid var(--aqua); transition:background .4s, transform .4s var(--ease); }
  .btn-cta:hover{ transform:translateY(-1px); box-shadow:0 10px 28px oklch(0.715 0.118 205 / 0.4); }

  /* ============ FLASH (validation messages) ============ */
  .flashes{ position:fixed; left:50%; top:90px; transform:translateX(-50%); z-index:60; width:min(92vw, 560px); display:grid; gap:10px; }
  .flash{ font-size:14px; font-weight:600; padding:13px 18px; border-radius:12px; box-shadow:0 14px 38px oklch(0.225 0.052 248 / 0.22); }
  .flash-error{ background:var(--coral); color:#fff; }
  .flash-success{ background:var(--aqua); color:var(--ocean-2); }
  .flash-info{ background:var(--bg-card); color:var(--ink); border:1px solid var(--line); }

  /* ============ HERO ============ */
  .hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; padding-top:120px; padding-bottom:64px; overflow:hidden; background:var(--ocean-2); }
  .hero-bg{ position:absolute; inset:0; z-index:0; }
  .hero-bg .ph{ width:100%; height:100%; border:none; background:var(--ocean); }
  .hero-bg img{ width:100%; height:100%; object-fit:cover; }
  .hero-bg::after{ content:""; position:absolute; inset:0; background:
    radial-gradient(110% 80% at 75% 0%, oklch(0.715 0.118 205 / 0.22), transparent 55%),
    linear-gradient(180deg, oklch(0.225 0.052 248 / 0.5) 0%, oklch(0.225 0.052 248 / 0.2) 36%, oklch(0.225 0.052 248 / 0.95) 100%); }
  .hero-inner{ position:relative; z-index:2; width:100%; color:#fff; }
  .hero .eyebrow{ color:var(--aqua); }
  .hero h1{ font-family:var(--disp); font-weight:900; text-transform:uppercase; font-size:clamp(54px,11vw,168px); line-height:0.84; letter-spacing:-0.035em; }
  .hero h1 .sub{ display:block; font-size:clamp(20px,3vw,40px); font-weight:600; text-transform:none; letter-spacing:-0.01em; margin-top:18px; color:oklch(1 0 0 / 0.92); max-width:24ch; line-height:1.1; }
  .hero-sub{ margin-top:22px; max-width:46ch; color:oklch(1 0 0 / 0.82); font-size:18px; }
  .hero-actions{ margin-top:34px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
  .filled{ font-family:var(--disp); font-weight:700; background:var(--aqua); color:var(--ocean-2); padding:16px 32px; border-radius:100px; font-size:15px; transition:transform .4s var(--ease), box-shadow .4s; }
  .filled:hover{ transform:translateY(-2px); box-shadow:0 16px 40px oklch(0.715 0.118 205 / 0.4); }
  .ghost{ font-family:var(--disp); font-weight:600; color:#fff; padding:16px 28px; border:1px solid oklch(1 0 0 / 0.35); border-radius:100px; font-size:15px; transition:background .4s, border-color .4s; }
  .ghost:hover{ background:oklch(1 0 0 / 0.1); border-color:#fff; }
  .hero-stats{ position:relative; z-index:2; margin-top:48px; display:flex; gap:clamp(24px,5vw,64px); flex-wrap:wrap; padding-top:30px; border-top:1px solid oklch(1 0 0 / 0.18); }
  .hero-stats .s .n{ font-family:var(--disp); font-weight:800; font-size:clamp(26px,3vw,40px); color:#fff; line-height:1; }
  .hero-stats .s .l{ font-size:12.5px; color:oklch(1 0 0 / 0.66); margin-top:6px; letter-spacing:.02em; }

  /* placeholder */
  .ph{ position:relative; width:100%; background:var(--bg-deep); border:1px solid var(--line-soft); overflow:hidden; }
  .ph::before{ content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(-45deg, transparent 0 15px, oklch(0.300 0.050 246 / 0.05) 15px 16px); }
  .ph.dark::before{ background-image:repeating-linear-gradient(-45deg, transparent 0 18px, oklch(0.715 0.118 205 / 0.10) 18px 19px); }
  .ph .ph-label{ position:absolute; inset:0; margin:auto; height:fit-content; width:fit-content; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); background:var(--bg); padding:5px 11px; border:1px solid var(--line-soft); border-radius:100px; display:flex; align-items:center; gap:7px; }
  .ph.dark .ph-label{ color:oklch(1 0 0 / 0.7); background:oklch(0.225 0.052 248 / 0.7); border-color:oklch(1 0 0 / 0.16); }
  .ph .ph-label::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--aqua); }

  /* ============ OFFER ============ */
  .offer-band{ background:var(--aqua); }
  .offer-card{ display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap; }
  .offer-card .l{ display:flex; align-items:center; gap:24px; }
  .offer-card .ic{ font-family:var(--disp); font-weight:900; font-size:clamp(40px,5vw,68px); color:var(--ocean-2); line-height:0.85; white-space:nowrap; }
  .offer-card h3{ font-family:var(--disp); font-weight:800; font-size:clamp(20px,2.4vw,30px); color:var(--ocean-2); }
  .offer-card p{ margin-top:5px; color:oklch(0.225 0.052 248 / 0.78); max-width:48ch; font-size:14.5px; }
  .offer-card .valid{ font-size:12.5px; font-weight:700; color:oklch(0.225 0.052 248 / 0.7); white-space:nowrap; }

  /* ============ TOURS ============ */
  section{ padding-block:clamp(72px,10vw,124px); }
  .sec-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:50px; }
  .sec-head h2{ font-family:var(--disp); font-weight:900; text-transform:uppercase; font-size:clamp(38px,6.5vw,98px); line-height:0.86; letter-spacing:-0.03em; }
  .sec-head .meta{ font-size:13px; color:var(--muted); max-width:34ch; text-align:right; }

  .tcat{ margin-top:56px; }
  .tcat:first-of-type{ margin-top:0; }
  .tcat-head{ display:flex; align-items:center; gap:14px; margin-bottom:26px; }
  .tcat-head h3{ font-family:var(--disp); font-weight:800; text-transform:uppercase; font-size:18px; letter-spacing:.04em; }
  .tcat-head .rule{ flex:1; height:2px; background:var(--line-soft); border-radius:2px; }
  .tcat-head .pin{ font-size:11px; font-weight:700; color:var(--aqua-deep); }

  /* badges */
  .badges{ display:flex; gap:8px; flex-wrap:wrap; }
  .bdg{ font-size:11px; font-weight:700; letter-spacing:.02em; padding:5px 11px; border-radius:100px; display:inline-flex; align-items:center; gap:6px; }
  .bdg.diff{ color:var(--ocean-2); }
  .bdg.diff.easy{ background:oklch(0.715 0.118 205 / 0.18); color:var(--aqua-deep); }
  .bdg.diff.mid{ background:oklch(0.795 0.072 72 / 0.26); color:oklch(0.50 0.07 62); }
  .bdg.diff.adv{ background:oklch(0.640 0.140 32 / 0.16); color:var(--coral); }
  .bdg.cert{ background:var(--bg-deep); color:var(--ink-soft); }
  .bdg.dur{ background:var(--ocean); color:#fff; }

  /* feature tour (wide) */
  .tour-feature{ display:grid; grid-template-columns:1fr 1fr; gap:0; background:var(--bg-card); border:1px solid var(--line-soft); border-radius:22px; overflow:hidden; }
  .tour-feature.rev .tf-media{ order:2; }
  .tf-media{ position:relative; min-height:300px; }
  .tf-media .ph{ position:absolute; inset:0; width:100%; height:100%; border:none; }
  .tf-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .tf-body{ padding:clamp(26px,3.4vw,46px); display:flex; flex-direction:column; }
  .tf-body h4{ font-family:var(--disp); font-weight:800; font-size:clamp(26px,3vw,38px); line-height:1.0; margin-top:16px; letter-spacing:-0.02em; }
  .tf-body p{ margin-top:14px; color:var(--ink-soft); max-width:46ch; }
  .includes{ margin-top:20px; }
  .includes .k{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
  .chips{ display:flex; gap:8px; flex-wrap:wrap; }
  .chips .c{ font-size:12px; font-weight:600; color:var(--ink-soft); background:var(--bg-deep); border:1px solid var(--line-soft); padding:6px 13px; border-radius:100px; }
  .tf-foot{ margin-top:auto; padding-top:24px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
  .price{ font-family:var(--disp); font-weight:800; font-size:30px; letter-spacing:-0.02em; }
  .price small{ font-family:var(--sans); font-size:12.5px; font-weight:600; color:var(--muted); }
  .book{ font-family:var(--disp); font-weight:700; background:var(--ocean); color:#fff; border:none; border-radius:100px; padding:13px 28px; font-size:14px; transition:background .35s, transform .35s var(--ease); }
  .book:hover{ background:var(--aqua-deep); transform:translateY(-2px); }

  /* compact tour cards */
  .tour-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,2.6vw,30px); }
  .tour-card{ background:var(--bg-card); border:1px solid var(--line-soft); border-radius:20px; overflow:hidden; display:flex; flex-direction:column; transition:transform .4s var(--ease), box-shadow .4s; }
  .tour-card:hover{ transform:translateY(-4px); box-shadow:0 22px 46px oklch(0.300 0.050 246 / 0.12); }
  .tc-media{ position:relative; }
  .tc-media .ph{ aspect-ratio:1.7; border:none; }
  .tc-media img{ aspect-ratio:1.7; width:100%; object-fit:cover; display:block; }
  .tc-media .badges{ position:absolute; left:14px; bottom:14px; }
  .tc-body{ padding:24px clamp(20px,2.4vw,28px) 26px; display:flex; flex-direction:column; flex:1; }
  .tc-body h4{ font-family:var(--disp); font-weight:800; font-size:23px; line-height:1.05; letter-spacing:-0.01em; }
  .tc-body p{ margin-top:10px; color:var(--ink-soft); font-size:14px; flex:1; }
  .tc-meta{ margin-top:16px; display:flex; gap:8px; flex-wrap:wrap; }
  .tc-foot{ margin-top:20px; padding-top:18px; border-top:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }

  /* ============ RESERVE ============ */
  .reserve{ background:var(--ocean); color:#fff; }
  .reserve ::selection{ background:var(--aqua); color:var(--ocean-2); }
  .reserve-grid{ display:grid; grid-template-columns:0.82fr 1.18fr; gap:clamp(32px,6vw,84px); align-items:start; }
  .reserve-aside .eyebrow{ color:var(--aqua); }
  .reserve-aside h2{ font-family:var(--disp); font-weight:900; text-transform:uppercase; font-size:clamp(38px,5vw,72px); line-height:0.86; letter-spacing:-0.03em; margin-top:18px; }
  .reserve-aside p{ margin-top:20px; color:oklch(1 0 0 / 0.78); max-width:32ch; }
  .reserve-aside .note{ margin-top:26px; padding:16px 18px; background:oklch(1 0 0 / 0.06); border:1px solid oklch(1 0 0 / 0.14); border-radius:14px; font-size:13.5px; color:oklch(1 0 0 / 0.82); display:flex; gap:12px; }
  .reserve-aside .note .ic{ color:var(--aqua); font-weight:800; }
  form{ display:grid; gap:20px; }
  .f-row2{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .field label{ display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:oklch(1 0 0 / 0.7); font-weight:700; margin-bottom:9px; }
  .field label .req{ color:var(--aqua); }
  .field input, .field select, .field textarea{ width:100%; background:oklch(1 0 0 / 0.06); border:1px solid oklch(1 0 0 / 0.16); border-radius:12px; padding:14px 15px; font-family:var(--sans); font-size:15.5px; color:#fff; transition:border-color .35s, background .35s; }
  .field textarea{ resize:vertical; min-height:84px; }
  .field input::placeholder, .field textarea::placeholder{ color:oklch(1 0 0 / 0.45); }
  .field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--aqua); background:oklch(1 0 0 / 0.1); }
  .field select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--aqua) 50%),linear-gradient(135deg,var(--aqua) 50%,transparent 50%); background-position:calc(100% - 20px) 21px,calc(100% - 15px) 21px; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
  .field select option{ color:var(--ink); }
  .field .hint{ font-size:12px; color:oklch(1 0 0 / 0.55); margin-top:8px; }
  .form-foot{ display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; }
  .form-note{ font-size:12.5px; color:oklch(1 0 0 / 0.6); max-width:30ch; }
  button.submit{ font-family:var(--disp); font-weight:700; background:var(--aqua); color:var(--ocean-2); border:none; border-radius:100px; padding:16px 36px; font-size:16px; display:inline-flex; align-items:center; gap:10px; transition:transform .4s var(--ease), box-shadow .4s; }
  button.submit:hover{ transform:translateY(-2px); box-shadow:0 16px 40px oklch(0.715 0.118 205 / 0.34); }
  .form-done{ display:none; font-family:var(--disp); font-weight:700; font-size:16px; color:var(--aqua); }
  form.sent .form-done{ display:block; }
  form.sent .form-foot button.submit{ opacity:.4; pointer-events:none; }

  /* ============ SAFETY ============ */
  .safety-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(32px,6vw,80px); align-items:center; }
  .safety-fig .ph{ aspect-ratio:1.05; border-radius:20px; }
  .safety-body h2{ font-family:var(--disp); font-weight:900; text-transform:uppercase; font-size:clamp(30px,4vw,56px); line-height:0.9; letter-spacing:-0.03em; margin-top:16px; }
  .safety-body p{ margin-top:20px; color:var(--ink-soft); font-size:16.5px; max-width:48ch; }
  .safety-points{ margin-top:28px; display:grid; gap:14px; }
  .sp{ display:flex; gap:14px; align-items:flex-start; }
  .sp .ic{ width:32px; height:32px; border-radius:9px; background:var(--aqua); color:var(--ocean-2); display:grid; place-items:center; font-family:var(--disp); font-weight:900; flex-shrink:0; }
  .sp .tx{ font-size:14.5px; color:var(--ink-soft); }
  .sp .tx b{ color:var(--ink); font-weight:700; }
  .contact-actions{ margin-top:30px; display:flex; gap:13px; flex-wrap:wrap; }
  .pill2{ display:inline-flex; align-items:center; gap:9px; padding:13px 22px; border-radius:100px; font-weight:700; font-size:14px; transition:transform .4s var(--ease); }
  .pill2:hover{ transform:translateY(-2px); }
  .pill2.wa{ background:oklch(0.74 0.10 150); color:#fff; }
  .pill2.call{ border:1px solid var(--line); color:var(--ink); }
  .pill2.map{ border:1px solid var(--aqua); color:var(--aqua-deep); }

  /* ============ FOOTER ============ */
  footer{ background:var(--ocean-2); color:oklch(0.965 0.012 88); padding-block:clamp(58px,8vw,92px); }
  footer ::selection{ background:var(--aqua); color:var(--ocean-2); }
  .foot-top{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:40px; padding-bottom:50px; border-bottom:1px solid oklch(1 0 0 / 0.14); }
  .foot-brand .big{ font-family:var(--disp); font-weight:900; text-transform:uppercase; font-size:clamp(38px,5.4vw,76px); line-height:0.86; letter-spacing:-0.03em; }
  .foot-brand .big span{ color:var(--aqua); }
  .foot-brand p{ margin-top:18px; color:oklch(1 0 0 / 0.6); max-width:32ch; font-size:14px; }
  .foot-col h5{ font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:oklch(1 0 0 / 0.5); margin-bottom:15px; }
  .foot-col a, .foot-col p{ display:block; color:oklch(1 0 0 / 0.82); font-size:14.5px; margin-bottom:10px; transition:color .3s; }
  .foot-col a:hover{ color:var(--aqua); }
  .foot-bot{ display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:28px; flex-wrap:wrap; }
  .foot-bot .small{ font-size:12px; color:oklch(1 0 0 / 0.5); }

  @media (max-width:980px){
    nav.links{ display:none; }
    .tour-feature{ grid-template-columns:1fr; }
    .tour-feature.rev .tf-media{ order:0; }
    .tf-media{ min-height:230px; }
    .tour-grid{ grid-template-columns:1fr; }
    .reserve-grid, .safety-grid{ grid-template-columns:1fr; }
    .safety-fig{ display:none; }
    .offer-card{ gap:18px; }
    .foot-top{ grid-template-columns:1fr; gap:38px; }
  }
  @media (max-width:560px){
    .nav-right .btn-cta{ display:none; }
    .f-row2{ grid-template-columns:1fr; }
    .sec-head{ flex-direction:column; align-items:flex-start; }
    .sec-head .meta{ text-align:left; }
    .offer-card .l{ flex-direction:column; align-items:flex-start; gap:14px; }
  }