/* ==========================================================================
   Buceo.CO — Design System (Organic Ocean Identity)
   Backbone reutilizable: tokens + clases bz-* traducidas de las specs del
   handoff (claude.ai/design). Se enlaza DESPUÉS de custom-theme.css.
   Las páginas usan estas clases; no duplicar reglas en las vistas.
   ========================================================================== */

/* ── Tokens ─────────────────────────────────────────────────────────── */
:root {
    /* Ocean (primary brand scale) */
    --ocean-50:#f0f9ff; --ocean-100:#e0f2fe; --ocean-200:#b9e6fe; --ocean-300:#7cd4fd;
    --ocean-400:#36bffa; --ocean-500:#0ba5ec; --ocean-600:#0086c9; --ocean-700:#026aa2;
    --ocean-800:#065986; --ocean-900:#0b4a6f; --ocean-950:#062c41;
    /* Accent (sunshine — CTAs) */
    --accent-400:#facc15; --accent-500:#eab308; --accent-600:#ca8a04;
    /* Slate (neutral ink & surfaces) */
    --slate-50:#f8fafc; --slate-100:#f1f5f9; --slate-200:#e2e8f0; --slate-300:#cbd5e1;
    --slate-400:#94a3b8; --slate-500:#64748b; --slate-600:#475569; --slate-700:#334155;
    --slate-800:#1e293b; --slate-900:#0f172a;
    /* Functional */
    --whatsapp:#25d366; --whatsapp-600:#1ebe5a; --success:#10b981; --warning:#f59e0b;
    --danger:#ef4444; --instagram:#e1306c;
    /* Semantic aliases */
    --brand:var(--ocean-500); --brand-strong:var(--ocean-700); --brand-deep:var(--ocean-900);
    --text-strong:var(--slate-900); --text-body:var(--slate-700); --text-muted:var(--slate-500);
    --text-faint:var(--slate-400); --text-on-dark:#fff; --text-on-dark-dim:var(--slate-300);
    --surface-page:var(--slate-50); --surface-card:#fff; --surface-sunken:var(--slate-100);
    --surface-ink:var(--slate-900); --surface-ink-2:var(--slate-800);
    --border-subtle:var(--slate-200); --border-ocean:rgba(14,165,233,0.08); --border-on-dark:var(--slate-800);
    --link:var(--ocean-600); --link-hover:var(--ocean-800);
    --cta-bg:var(--accent-400); --cta-bg-hover:var(--accent-500); --cta-fg:var(--slate-900);
    /* Type */
    --font-display:'Montserrat','Outfit',system-ui,sans-serif;
    --font-sans:'DM Sans','Inter',system-ui,sans-serif;
    /* Spacing / layout */
    --card-pad:2rem; --section-pad:5rem; --container:80rem;
    /* Radii — standard */
    --radius-sm:.5rem; --radius-md:.75rem; --radius-lg:1rem; --radius-xl:1.5rem;
    --radius-2xl:2rem; --radius-full:9999px;
    /* Radii — organic */
    --radius-organic:8px 32px 8px 20px; --radius-wave:24px 8px 24px 8px;
    --radius-pebble:32px 16px 32px 8px; --radius-coral:40px 8px 24px 8px;
    --radius-hero:4px 48px 4px 32px; --radius-badge:4px 16px 4px 12px;
    /* Ocean-tinted shadows */
    --shadow-ocean:0 8px 30px -8px rgba(14,165,233,.18);
    --shadow-ocean-lg:0 16px 50px -12px rgba(14,165,233,.22);
    --shadow-ocean-xl:0 24px 60px -15px rgba(14,165,233,.28);
    --shadow-deep:0 12px 40px -10px rgba(6,44,65,.25);
    --shadow-abyss:0 20px 50px -15px rgba(6,44,65,.35);
    --shadow-cta:0 6px 25px -5px rgba(250,204,21,.40);
    --shadow-sm:0 1px 2px rgba(15,23,42,.06);
    /* Motion */
    --ease-out:cubic-bezier(.4,0,.2,1); --ease-spring:cubic-bezier(.34,1.56,.64,1);
    --dur-fast:.2s; --dur-base:.3s; --dur-slow:.6s; --lift:translateY(-8px);
}

/* ── Typography ─────────────────────────────────────────────────────── */
.bz-h1{font-family:var(--font-display);font-weight:900;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.05;letter-spacing:-.03em;color:var(--text-strong);}
.bz-h2{font-family:var(--font-display);font-weight:800;font-size:clamp(1.875rem,3.5vw,3rem);line-height:1.15;letter-spacing:-.02em;color:var(--text-strong);}
.bz-h3{font-family:var(--font-display);font-weight:700;font-size:1.5rem;line-height:1.15;letter-spacing:-.02em;color:var(--text-strong);}
.bz-lead{font-family:var(--font-sans);font-weight:400;font-size:1.125rem;line-height:1.7;color:var(--text-body);}
.bz-body{font-family:var(--font-sans);font-weight:400;font-size:1rem;line-height:1.7;color:var(--text-body);}

/* ── Section label (eyebrow) ────────────────────────────────────────── */
.bz-label{font-family:var(--font-display);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--ocean-500);display:inline-flex;align-items:center;gap:.5rem;}
.bz-label::before{content:'';width:24px;height:2px;background:currentColor;border-radius:1px;}
.bz-label--center{justify-content:center;}

/* eyebrow chip (tinted pill) */
.bz-eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .875rem;font-family:var(--font-sans);font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;line-height:1;border-radius:var(--radius-full);background:#e0f2fe;color:#026aa2;}
.bz-eyebrow--orange{background:#ffedd5;color:#c2410c;} .bz-eyebrow--teal{background:#ccfbf1;color:#0f766e;}
.bz-eyebrow--emerald{background:#d1fae5;color:#047857;} .bz-eyebrow--amber{background:#fef3c7;color:#b45309;}
.bz-eyebrow--cyan{background:#cffafe;color:#0e7490;} .bz-eyebrow--blue{background:#dbeafe;color:#1d4ed8;}

/* ── Surfaces ───────────────────────────────────────────────────────── */
.bz-surface-page{background:var(--surface-page);}
.bz-surface-card{background:var(--surface-card);}
.bz-surface-ink{background:var(--surface-ink);color:var(--text-on-dark);}
.bz-surface-mesh{background:radial-gradient(ellipse at 20% 80%,rgba(14,165,233,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(6,44,65,.10) 0%,transparent 50%),linear-gradient(180deg,#f0f9ff 0%,#f8fafc 100%);}
.bz-surface-abyss{background:linear-gradient(180deg,#0f172a 0%,#062c41 40%,#0b4a6f 100%);color:var(--text-on-dark);}
.bz-surface-deep{background:linear-gradient(180deg,#0b4a6f 0%,#065986 50%,#026aa2 100%);color:var(--text-on-dark);}

/* glass + grain */
.bz-glass{background:rgba(255,255,255,.08);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-organic);}
.bz-grain{position:relative;}
.bz-grain>*{position:relative;z-index:1;}
.bz-grain::before{content:'';position:absolute;inset:0;opacity:.03;pointer-events:none;z-index:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ── Layout helpers ─────────────────────────────────────────────────── */
.bz-container{max-width:var(--container);margin-inline:auto;padding-inline:1.5rem;}
.bz-section{padding-block:var(--section-pad);}

/* ── Button ─────────────────────────────────────────────────────────── */
.bz-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;font-family:var(--font-display);font-weight:700;font-size:.9375rem;letter-spacing:-.01em;line-height:1;border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background var(--dur-base) var(--ease-out),transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);}
.bz-btn:hover{transform:translateY(-2px);}
.bz-btn:active{transform:scale(.98);}
.bz-btn svg{flex-shrink:0;}
/* sizes */
.bz-btn--sm{padding:.5rem 1rem;font-size:.8125rem;gap:.375rem;}
.bz-btn--lg{padding:1rem 2rem;font-size:1.0625rem;}
.bz-btn--xl{padding:1.25rem 2.5rem;font-size:1.25rem;gap:.625rem;}
.bz-btn--block{display:flex;width:100%;}
/* variants */
.bz-btn--primary{background:var(--accent-400);color:var(--slate-900);box-shadow:var(--shadow-cta);font-weight:900;}
.bz-btn--primary:hover{background:var(--accent-500);}
.bz-btn--ocean{background:var(--ocean-600);color:#fff;box-shadow:0 6px 25px -5px rgba(14,165,233,.35);}
.bz-btn--ocean:hover{background:var(--ocean-700);}
.bz-btn--dark{background:var(--slate-900);color:#fff;box-shadow:0 6px 20px -6px rgba(15,23,42,.4);}
.bz-btn--dark:hover{background:var(--slate-800);}
.bz-btn--whatsapp{background:var(--whatsapp);color:#fff;box-shadow:0 6px 25px -5px rgba(37,211,102,.35);}
.bz-btn--whatsapp:hover{background:var(--whatsapp-600);}
.bz-btn--secondary{background:#fff;color:var(--slate-900);box-shadow:var(--shadow-sm);border-color:var(--slate-200);}
.bz-btn--secondary:hover{background:var(--slate-50);}
.bz-btn--ghost{background:transparent;color:var(--ocean-700);}
.bz-btn--ghost:hover{transform:none;color:var(--ocean-800);}
.bz-btn--glass{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
.bz-btn--glass:hover{background:rgba(255,255,255,.2);}

/* ── Badge ──────────────────────────────────────────────────────────── */
.bz-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.35rem .7rem;font-family:var(--font-sans);font-size:.8125rem;font-weight:700;line-height:1;border-radius:var(--radius-full);background:#e0f2fe;color:#026aa2;}
.bz-badge svg{flex-shrink:0;}
.bz-badge--upper{font-family:var(--font-display);font-size:.6875rem;text-transform:uppercase;letter-spacing:.1em;padding:.35rem .75rem;}
.bz-badge--solid{border-radius:var(--radius-badge);color:#fff;background:var(--ocean-600);}
.bz-badge--glass{border-radius:var(--radius-badge);background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);}
/* tones (tint) */
.bz-badge--ocean{background:#e0f2fe;color:#026aa2;} .bz-badge--blue{background:#dbeafe;color:#1d4ed8;}
.bz-badge--orange{background:#ffedd5;color:#c2410c;} .bz-badge--cyan{background:#cffafe;color:#0e7490;}
.bz-badge--teal{background:#ccfbf1;color:#0f766e;} .bz-badge--emerald{background:#d1fae5;color:#047857;}
.bz-badge--amber{background:#fef3c7;color:#b45309;} .bz-badge--red{background:#fee2e2;color:#b91c1c;}
.bz-badge--slate{background:#f1f5f9;color:#334155;}
/* solid tones */
.bz-badge--solid.bz-badge--red{background:#dc2626;color:#fff;} .bz-badge--solid.bz-badge--amber{background:var(--accent-500);}
.bz-badge--solid.bz-badge--emerald{background:#059669;} .bz-badge--solid.bz-badge--orange{background:#ea580c;}

/* ── Card (generic organic surface) ─────────────────────────────────── */
.bz-card{background:var(--surface-card);border-radius:var(--radius-organic);border:1px solid var(--border-ocean);box-shadow:var(--shadow-ocean);padding:var(--card-pad);overflow:hidden;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);}
.bz-card--wave{border-radius:var(--radius-wave);} .bz-card--pebble{border-radius:var(--radius-pebble);}
.bz-card--coral{border-radius:var(--radius-coral);} .bz-card--rounded{border-radius:var(--radius-2xl);}
.bz-card--flush{padding:0;}
.bz-card--interactive:hover{transform:var(--lift);box-shadow:var(--shadow-ocean-xl);}

/* ── TripCard (flagship product card: viajes/cursos/salidas) ────────── */
.bz-trip{display:block;position:relative;background:#fff;border-radius:8px 36px 8px 24px;overflow:hidden;box-shadow:var(--shadow-ocean-lg);border:1px solid rgba(14,165,233,.08);text-decoration:none;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out);}
a.bz-trip:hover{transform:translateY(-6px);box-shadow:var(--shadow-ocean-xl);}
.bz-trip__media{position:relative;aspect-ratio:4/3;overflow:hidden;}
.bz-trip__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out);}
a.bz-trip:hover .bz-trip__media img{transform:scale(1.08);}
.bz-trip__media--ph{width:100%;height:100%;background:linear-gradient(135deg,var(--ocean-400),var(--ocean-800));display:flex;align-items:center;justify-content:center;}
.bz-trip__vignette{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 40%,rgba(6,44,65,.5) 100%);pointer-events:none;}
.bz-trip__badge{position:absolute;top:1rem;left:1rem;z-index:2;}
.bz-trip__datebar{position:relative;margin:-1.25rem 1.25rem 0;z-index:5;background:linear-gradient(135deg,var(--ocean-900),var(--ocean-800));color:#fff;font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.5rem 1rem;border-radius:var(--radius-badge);box-shadow:0 4px 15px -4px rgba(6,44,65,.4);display:inline-flex;align-items:center;gap:.4rem;width:fit-content;}
.bz-trip__body{padding:1.25rem 1.5rem 1.5rem;}
.bz-trip__title{font-family:var(--font-display);font-size:1.25rem;font-weight:800;color:var(--slate-900);line-height:1.2;margin:0 0 .5rem;letter-spacing:-.01em;transition:color var(--dur-base);}
a.bz-trip:hover .bz-trip__title{color:var(--ocean-700);}
.bz-trip__sub{font-size:.875rem;color:var(--slate-500);line-height:1.5;margin:0 0 1rem;}
.bz-trip__foot{display:flex;align-items:flex-end;justify-content:space-between;padding-top:1rem;border-top:1px solid rgba(14,165,233,.1);}
.bz-trip__pricelabel{font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;color:var(--slate-400);font-weight:600;display:block;}
.bz-trip__price{font-family:var(--font-display);font-size:1.65rem;font-weight:900;color:var(--slate-900);line-height:1;letter-spacing:-.02em;}
.bz-trip__cta{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--font-display);font-size:.8rem;font-weight:700;color:var(--ocean-700);transition:gap var(--dur-base),color var(--dur-base);}
a.bz-trip:hover .bz-trip__cta{gap:.6rem;color:var(--ocean-500);}

/* ── StatPill ───────────────────────────────────────────────────────── */
.bz-stat{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--font-sans);font-size:.75rem;font-weight:600;color:var(--slate-500);}
.bz-stat--ocean{color:var(--ocean-600);}
.bz-stat svg{flex-shrink:0;}

/* ── Input ──────────────────────────────────────────────────────────── */
.bz-input{width:100%;padding:.75rem 1rem;font-family:var(--font-sans);font-size:.9375rem;color:var(--slate-900);background:#fff;border:1.5px solid var(--slate-200);border-radius:var(--radius-md);outline:none;transition:border-color var(--dur-base),box-shadow var(--dur-base);}
.bz-input:focus{border-color:var(--ocean-500);box-shadow:0 0 0 3px rgba(11,165,236,.15);}

/* ── Cert strip ─────────────────────────────────────────────────────── */
.bz-certstrip{background:var(--slate-800);border-top:1px solid var(--slate-700);padding:40px 24px;}
.bz-certstrip__inner{max-width:var(--container);margin-inline:auto;text-align:center;}
.bz-certstrip__label{font-size:12px;font-weight:700;color:var(--slate-300);text-transform:uppercase;letter-spacing:.2em;margin-bottom:28px;}
.bz-certstrip__row{display:flex;flex-wrap:wrap;justify-content:center;gap:48px;align-items:center;}
.bz-certstrip__item{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.85;}
.bz-certstrip__badge{width:64px;height:64px;background:var(--slate-700);border-radius:14px;border:1px solid var(--slate-600);display:flex;align-items:center;justify-content:center;padding:10px;}
.bz-certstrip__badge img{max-width:100%;max-height:100%;filter:brightness(0) invert(1);}
.bz-certstrip__name{font-size:10px;color:var(--slate-300);font-weight:600;}

/* ── WhatsApp FAB ───────────────────────────────────────────────────── */
.bz-wa-fab{position:fixed;bottom:24px;right:24px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--whatsapp);display:inline-flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 6px 20px rgba(37,211,102,.4);transition:all var(--dur-base) var(--ease-out);}
.bz-wa-fab:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 10px 30px rgba(37,211,102,.5);}
.bz-wa-fab::before{content:'';position:absolute;inset:-4px;border-radius:50%;background:rgba(37,211,102,.3);animation:bzWaPulse 2s ease-in-out infinite;}
.bz-wa-fab svg{position:relative;z-index:1;}

/* ── Motion keyframes ───────────────────────────────────────────────── */
@keyframes bzPulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);}70%{box-shadow:0 0 0 8px rgba(37,211,102,0);}100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}}
@keyframes bzWaPulse{0%,100%{transform:scale(.95);opacity:.7;}50%{transform:scale(1.15);opacity:0;}}
@keyframes bzFadeInUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
.bz-fade-up{animation:bzFadeInUp var(--dur-slow) var(--ease-out) both;}
.bz-pulse-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--whatsapp);animation:bzPulse 2s infinite;}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;}}

/* ── Fix: z-index arbitrarios que Tailwind no compiló (nav, popups, FAB) ── */
.z-\[40\]{z-index:40;}
.z-\[50\]{z-index:50;}
.z-\[9998\]{z-index:9998;}
.z-\[9999\]{z-index:9999;}
.z-\[10000\]{z-index:10000;}
.z-\[99999\]{z-index:99999;}
.z-\[100000\]{z-index:100000;}
.z-\[100001\]{z-index:100001;}

/* ── Modal newsletter exit-intent: nunca desbordar la pantalla ── */
#nl-exit-popup .nl-popup-content{max-height:90vh;overflow-y:auto;overflow-x:hidden;}
