/* KAILU Products — base compartida de la landing
   Tokens de compatibilidad (--kp-*) apuntando al sistema editorial · Botón · Precio · Barra de compra */

:root {
    --kp-paper: #F1ECE3;
    --kp-paper-2: #E7E0D3;
    --kp-ink: #141210;
    --kp-white: #FFFDF8;
    --kp-line: #D6CCBD;
    --kp-line-soft: #E3DACB;
    --kp-muted: #6E665C;
    --kp-body: #2B2723;
    --kp-coral: #FF5A36;
    --kp-coral-deep: #C8391A;
    --kp-coral-wash: rgba(255, 90, 54, .18);
    --kp-sans: 'Bricolage Grotesque', 'Helvetica Neue', Arial, sans-serif;
    --kp-mono: 'Space Mono', ui-monospace, Menlo, monospace;
    --kp-ease: cubic-bezier(.2, .7, .2, 1);
    --kp-state: 250ms;
    --kp-pad: max(clamp(20px, 5vw, max(32px, calc((100% - 1180px) / 2))), env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
}

.kp-page .site-header:not(.is-scrolled) { height: 80px; }
.kp-page .site-header.is-scrolled { background: rgba(241, 236, 227, .94); box-shadow: 0 1px 0 var(--kp-line); }
.kp-page .footer { background: var(--kp-paper-2); }
.kp-page .mobile-panel { background: var(--kp-paper); }
.kp-page ::selection { background: var(--kp-coral); color: var(--kp-ink); }
@media (max-width: 900px) { .kp-page .site-header:not(.is-scrolled) { height: 64px; } }

/* ─── Barra de compra ─────────────────────────────────── */
.kp-buybar {
    position: fixed; z-index: 90; left: 0; right: 0; bottom: 0; display: none;
    align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--kp-white); border-top: 1px solid var(--kp-ink); color: var(--kp-ink); font-family: var(--kp-sans);
    transform: translateY(110%); transition: transform var(--kp-state) var(--kp-ease);
}
.kp-buybar.is-visible { transform: none; }
.kp-buybar .ke-btn { min-height: 48px; font-size: 15px; background: var(--kp-coral); color: var(--kp-ink); }
.kp-buybar .ke-btn__arrow { background: var(--kp-ink); color: var(--kp-paper); }
.kp-buybar .ke-btn__label { padding: 0 16px; }
.kp-buybar .ke-btn__arrow { padding: 0 14px; }
.kp-buybar .ke-price b { font-size: 1.5rem; }
.kp-buybar .ke-price span { margin-top: 4px; font-size: 10px; }

/* ─── Móvil ───────────────────────────────────────────── */
@media (max-width: 899px), (hover: none) and (max-height: 600px) {
    .kp-page .site-header { padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
    .kp-buybar { display: flex; padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); }
    body.kp-page { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
}

@media (prefers-reduced-motion: reduce) {
    .kp-page *, .kp-page *::before, .kp-page *::after { transition-duration: 1ms !important; transition-delay: 0ms !important; }
}