/* ZonaTronik Import — tokens y componentes compartidos. */
body.zti-experience {
    --zti-yellow: #ffe000;
    --zti-ink: #181818;
    --zti-muted: #626872;
    --zti-line: #e5e7eb;
    --zti-canvas: #f5f5f3;
    --zti-radius: 16px;
    --zti-header-height: 120px;
    background: var(--zti-canvas) !important;
    color: var(--zti-ink);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    line-height: 1.5;
}
body.zti-experience *, body.zti-experience *::before, body.zti-experience *::after { box-sizing: border-box; }
body.zti-experience [hidden] { display: none !important; }
body.zti-experience :is(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid #1769e0 !important; outline-offset: 3px; }
body.zti-experience button { font-family: inherit; cursor: pointer; }
.zti-icon { display: inline-block; flex-shrink: 0; width: 22px; height: 22px; vertical-align: middle; }
body.zti-experience button:disabled { cursor: wait; opacity: .6; }
body.zti-experience :is(input,select,textarea) { max-width: 100%; }
.zti-page { width: min(1280px, calc(100% - 40px)); margin: 32px auto 56px; min-height: 45vh; }
.zti-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.zti-page-heading h1 { margin: 6px 0 10px; font-size: clamp(26px, 3.5vw, 42px); line-height: 1.12; font-weight: 800; letter-spacing: -.035em; color: var(--zti-ink); }
.zti-page-heading p { color: var(--zti-muted); margin: 0; max-width: 650px; }
.zti-eyebrow { font-size: 11px; font-weight: 800; letter-spacing: .12em; color: #655b14; }
body.zti-experience .zti-button { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 46px; border: 1px solid #dfc500; border-radius: 12px; background: var(--zti-yellow); padding: 12px 20px; font-size: 14px; line-height: 1.4; font-weight: 750; color: #171717; text-decoration: none; box-shadow: none; }
body.zti-experience .zti-button:hover { background: #f5d800; }
body.zti-experience .zti-button-light { background: #fff; border-color: var(--zti-line); }
body.zti-experience .zti-text-link { display: inline-flex; align-items: center; min-height: 44px; background: none; border: 0; padding: 6px 0; color: #383b40; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.zti-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; }
.zti-money-note { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; padding: 12px 14px; margin: 12px 0; border-radius: 10px; background: #fff9d6; border: 1px solid #ece2a8; font-size: 12px; color: #584e16; }
.zti-empty { text-align: center; padding: 60px 24px; background: #fff; border: 1px solid var(--zti-line); border-radius: 20px; }
.zti-empty > i { display: block; font-size: 48px; margin-bottom: 20px; color: #c1a900; }
.zti-empty h2 { font-size: 26px; margin: 0 0 10px; }
.zti-empty p { color: var(--zti-muted); margin-bottom: 25px; }
.zti-skip { position: fixed; left: 16px; top: -100px; z-index: 1000000; padding: 12px 20px; background: #fff; color: #111; }
.zti-skip:focus { top: 16px; }
body.zti-experience .zti-dialog { position: fixed; inset: 0; width: min(600px, calc(100% - 28px)); max-height: calc(100dvh - 32px); padding: 28px; margin: auto; border: 1px solid var(--zti-line); border-radius: 22px; color: var(--zti-ink); background: #fafaf8; box-shadow: 0 24px 100px #0005; overflow: auto; overscroll-behavior: contain; }
.zti-dialog:not([open]) { display: none; }
.zti-dialog::backdrop { background: #1119; backdrop-filter: blur(3px); }
.zti-dialog-head { display: flex; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 18px; }
.zti-dialog-head h2 { margin: 4px 0 0; font-size: clamp(22px, 3vw, 30px); line-height: 1.15; letter-spacing: -.02em; }
body.zti-experience .zti-dialog-head button { background: #fff; color: #222; border: 1px solid var(--zti-line); border-radius: 50%; width: 44px; height: 44px; flex-shrink: 0; font-size: 27px; line-height: 1; padding: 0; }
.zti-dialog label { display: block; font-weight: 650; font-size: 13px; margin: 12px 0 6px; }
.zti-dialog :is(input,select) { width: 100%; min-height: 48px; padding: 12px; border: 1px solid #bdc1c5; border-radius: 10px; background: #fff; color: #222; font-size: 16px; }
.zti-dialog small { display: block; font-size: 11px; color: #666; margin-top: 16px; }
.zti-search-row { display: flex; gap: 10px; }
.zti-search-row input { min-width: 0; }
#zti-cp-result .zti-button { width: 100%; margin-top: 16px; }
body.zti-experience .zti-feedback { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 100001; width: max-content; max-width: calc(100% - 28px); border-radius: 14px; background: #171717; color: #fff; padding: 15px 22px; box-shadow: 0 10px 30px #0003; font-size: 14px; }
.zti-feedback a { color: #ffe000; text-decoration: underline; margin-left: 12px; }
@media (max-width: 767px) {
    body.zti-experience { padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important; }
    .zti-page { width: calc(100% - 28px); margin: 22px auto 36px; }
    .zti-page-heading { align-items: flex-start; flex-direction: column; gap: 16px; margin-bottom: 22px; }
    .zti-page-heading p { font-size: 14px; }
    body.zti-experience .zti-feedback { bottom: calc(84px + env(safe-area-inset-bottom)); }
    body.zti-experience .zti-dialog { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    body.zti-experience *, body.zti-experience *::before, body.zti-experience *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Base 1.1: tipografía legible y medidas coherentes en los módulos nuevos. */
body.zti-experience{--zti-yellow:#ffe600;--zti-canvas:#f1f2f3;--zti-ink:#151515;--zti-line:#e4e5e7;margin:0;background:var(--zti-canvas)!important;font-weight:400}
body.zti-experience :is(.zti-page,.zti-home-intro,.zti-directory,.zti-header,.zti-footer,.zti-product-card) :is(button,input,select){font-family:inherit}
body.zti-experience .zti-page-heading{padding:24px 26px;border:1px solid #e8e2ae;border-radius:20px;background:linear-gradient(110deg,#fffbd8,#fff 70%);box-shadow:0 8px 25px #00000005}
.zti-page-heading h1{font-size:clamp(26px,3vw,38px);font-weight:850}
.zti-eyebrow{color:#776708;font-size:10px;letter-spacing:.09em}
body.zti-experience .zti-button{background:#ffe600;border-color:#e5cf00;border-radius:24px;font-weight:800}
body.zti-experience .zti-button-light{background:#fff;border-color:#deded4}
.zti-money-note{background:#fffdf0;border:1px solid #e8e2ae;color:#534b16}
body.zti-experience .zti-page-heading p{line-height:1.55}
@media(max-width:767px){body.zti-experience .zti-page-heading{padding:20px}.zti-page-heading .zti-button{width:100%}}

/* 1.2: anchos y familia tipográfica de la referencia. */
body.zti-experience{--zti-canvas:#eee;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
body.zti-experience :is(.zti-page-heading,.zti-categories-hero,.zt-shop-hero,.zti-home-intro,.zti-footer) :is(h1,h2,h3){font-family:inherit;font-weight:900;letter-spacing:-.03em}
.zti-categories-page{width:min(1600px,calc(100% - 28px));margin:20px auto 40px}
body.zti-experience .zti-page-heading{background:radial-gradient(circle at 95% 10%,#fff18a 0,transparent 35%),linear-gradient(110deg,#fff,#fffde9);border-radius:16px;box-shadow:0 10px 24px #00000007}