/* ═══════════════════════════════════════════════════════════════════════════
   Jakomi · hoja pública compartida (cartas.jakomi.mx) · v20260914
   Fuentes de marca self-hosted + tokens + navegación y pie comunes.
   Una sola hoja para todas las páginas públicas: si cambia el horario o un
   link, se cambia aquí y no en ocho archivos.
   ═══════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:'Fredoka';font-weight:600;font-style:normal;font-display:swap;src:url('/static/fredoka-600.woff2') format('woff2')}
@font-face{font-family:'Fredoka';font-weight:700;font-style:normal;font-display:swap;src:url('/static/fredoka-700.woff2') format('woff2')}
@font-face{font-family:'Nunito';font-weight:400;font-style:normal;font-display:swap;src:url('/static/nunito-400.woff2') format('woff2')}
@font-face{font-family:'Nunito';font-weight:700;font-style:normal;font-display:swap;src:url('/static/nunito-700.woff2') format('woff2')}
@font-face{font-family:'Nunito';font-weight:800;font-style:normal;font-display:swap;src:url('/static/nunito-800.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-weight:600;font-style:normal;font-display:swap;src:url('/static/poppins-600.woff2') format('woff2')}
@font-face{font-family:'Gowun Dodum';font-weight:400;font-style:normal;font-display:swap;src:url('/static/gowun-ko.woff2') format('woff2')}

:root{
  --bg:#F6EDDF;--surface:#FCF8F0;--s2:#F0E4D2;--text:#2E1E14;--muted:#7A5C44;--subtle:#A98D72;
  --border:#E7D8C0;--border-strong:#D9C3A5;--primary:#A37955;--primary-press:#8A6342;--on-primary:#FFF8EE;
  --accent:#E9B0A9;--pop:#E16B73;--on-pop:#FFF6F2;--matcha:#9CAE84;--cacao:#7B4B25;
  --ring:rgba(163,121,85,.5);
  --sh-xs:0 1px 2px rgba(74,48,30,.06);
  --sh-sm:0 1px 2px rgba(74,48,30,.05),0 2px 6px rgba(74,48,30,.06);
  --sh:0 1px 2px rgba(74,48,30,.04),0 6px 16px rgba(74,48,30,.08),0 12px 28px rgba(74,48,30,.06);
  --sh-lg:0 2px 6px rgba(74,48,30,.05),0 12px 28px rgba(74,48,30,.10),0 30px 60px rgba(74,48,30,.10);
  --hi:inset 0 1px 0 rgba(255,255,255,.5);
  --r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:22px;--r-2xl:28px;--r:16px;
  --ease:cubic-bezier(.22,1,.36,1);--ease-expo:cubic-bezier(.16,1,.3,1);--ease-back:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:140ms;--dur:220ms;--dur-slow:360ms;
  --font:'Nunito',ui-rounded,'Segoe UI',system-ui,-apple-system,sans-serif;
  --display:'Fredoka',ui-rounded,'Segoe UI',system-ui,sans-serif;
  --ui:'Poppins','Nunito',system-ui,sans-serif;
  --ko:'Gowun Dodum','Nunito',system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#1E140E;--surface:#271A12;--s2:#33231A;--text:#F3E7D6;--muted:#C7AD92;--subtle:#8C7359;
  --border:#3D2B1F;--border-strong:#4F3826;--primary:#CBA67E;--primary-press:#B58E63;--on-primary:#1E140E;
  --accent:#E9B0A9;--pop:#E8767D;--on-pop:#1E140E;--cacao:#F3E7D6;--ring:rgba(203,166,126,.55);
  --sh-xs:0 1px 2px rgba(0,0,0,.4);--sh-sm:0 1px 2px rgba(0,0,0,.4),0 2px 6px rgba(0,0,0,.35);
  --sh:0 2px 6px rgba(0,0,0,.4),0 10px 24px rgba(0,0,0,.45);--sh-lg:0 4px 10px rgba(0,0,0,.45),0 24px 60px rgba(0,0,0,.55);
  --hi:inset 0 1px 0 rgba(255,255,255,.04);
}}

html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
:lang(ko),.ko{font-family:var(--ko);font-weight:400}
::selection{background:var(--accent);color:#2E1E14}
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--ring);border-radius:var(--r-sm)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.jk-skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--text);color:var(--bg);padding:10px 14px;border-radius:var(--r-md);font-weight:800;text-decoration:none;transition:top var(--dur) var(--ease)}
.jk-skip:focus{top:12px}

/* ── Navegación pública ─────────────────────────────────────────────────── */
.jk-nav{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.jk-nav-in{max-width:1120px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:12px}
.jk-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);flex:none;padding:4px 6px 4px 0;border-radius:var(--r-md)}
.jk-brand img{width:34px;height:34px;border-radius:10px;background:var(--s2);object-fit:cover}
.jk-brand b{font-family:var(--display);font-weight:700;font-size:1.15rem;letter-spacing:-.02em;line-height:1;display:block}
.jk-brand small{display:block;font-family:var(--ko);font-size:.7rem;color:var(--muted);line-height:1.1;margin-top:2px}
.jk-links{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding:2px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.jk-links::-webkit-scrollbar{display:none}
.jk-links a{flex:none;font-family:var(--ui);font-weight:600;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:9px 12px;border-radius:var(--r-md);transition:background var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.jk-links a:hover{background:var(--s2);color:var(--text);transform:translateY(-1px)}
.jk-links a[aria-current="page"]{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1.5px var(--primary)}
.jk-nav-cta{flex:none;font-family:var(--ui);font-weight:600;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--on-primary);background:var(--primary);padding:10px 14px;border-radius:var(--r-md);box-shadow:var(--sh-sm),var(--hi);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.jk-nav-cta:hover{transform:translateY(-2px);box-shadow:var(--sh),var(--hi);color:var(--on-primary)}
.jk-nav-cta:active{transform:scale(.985)}
@media(max-width:640px){.jk-nav-in{flex-wrap:wrap;gap:6px 10px;padding:8px 12px}.jk-brand{order:1}.jk-nav-cta{order:2;margin-left:auto;padding:9px 12px}.jk-links{order:3;width:100%;flex:1 0 100%}}

/* ── Pie de página ──────────────────────────────────────────────────────── */
.jk-foot{margin-top:64px;border-top:1px solid var(--border);background:var(--surface);color:var(--muted);font-size:.9rem}
.jk-foot-in{max-width:1120px;margin:0 auto;padding:40px 16px 28px}
.jk-foot-brand{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.jk-foot-brand img{width:48px;height:48px;border-radius:14px;background:var(--s2)}
.jk-foot-brand b{font-family:var(--display);font-size:1.25rem;color:var(--text);letter-spacing:-.02em}
.jk-foot-brand .ko{margin-left:6px}
.jk-foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px 32px}
.jk-foot :is(h2,h3){font-family:var(--ui);font-weight:600;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--primary);margin:0 0 10px}
.jk-foot p,.jk-foot address{margin:0;font-style:normal;line-height:1.6}
.jk-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.jk-foot a{color:var(--text);text-decoration:none;font-weight:700;transition:color var(--dur-fast) var(--ease)}
.jk-foot a:hover{color:var(--primary)}
.jk-foot-legal{margin-top:28px;padding-top:16px;border-top:1px dashed var(--border);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;font-size:.8rem}
.jk-foot-legal a{font-weight:600;color:var(--muted)}

/* ── Utilidades compartidas ─────────────────────────────────────────────── */
.jk-wrap{max-width:1120px;margin:0 auto;padding:0 16px}
.jk-eyebrow{font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;color:var(--pop)}
.jk-h1{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.05;font-size:clamp(2rem,6vw,3.4rem);margin:8px 0 0}
.jk-h2{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.1;font-size:clamp(1.5rem,3.6vw,2.1rem);margin:6px 0 0}
.jk-lead{color:var(--muted);font-size:1.05rem;line-height:1.6;max-width:56ch}
.jk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:800;font-size:.95rem;line-height:1;cursor:pointer;border:0;text-decoration:none;color:var(--on-primary);background:var(--primary);padding:14px 20px;border-radius:var(--r-md);box-shadow:var(--sh-sm),var(--hi);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur-fast) var(--ease);will-change:transform}
.jk-btn:hover{transform:translateY(-2px);box-shadow:var(--sh),var(--hi);color:var(--on-primary)}
.jk-btn:active{transform:translateY(0) scale(.985);box-shadow:var(--sh-xs);transition-duration:90ms}
.jk-btn--pop{background:var(--pop);color:var(--on-pop)}.jk-btn--pop:hover{color:var(--on-pop);box-shadow:0 8px 22px rgba(225,107,115,.28),var(--hi)}
.jk-btn--ghost{background:transparent;color:var(--primary);box-shadow:inset 0 0 0 1.5px var(--border-strong)}
.jk-btn--ghost:hover{background:var(--s2);color:var(--primary-press);box-shadow:inset 0 0 0 1.5px var(--primary)}
.jk-btn:disabled{opacity:.55;cursor:progress;transform:none}
.jk-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:20px;box-shadow:var(--sh);transition:transform var(--dur-slow) var(--ease),box-shadow var(--dur-slow) var(--ease)}
.jk-card--link{display:block;text-decoration:none;color:inherit}
.jk-card--link:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.jk-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--ui);font-weight:600;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--s2);border-radius:999px;padding:5px 11px;white-space:nowrap}
.jk-chip--accent{background:color-mix(in srgb,var(--accent) 45%,transparent);color:var(--text)}
.jk-chip--pop{background:color-mix(in srgb,var(--pop) 18%,transparent);color:var(--pop)}
.jk-chip--ok{background:color-mix(in srgb,var(--matcha) 30%,transparent);color:var(--text)}
.jk-field{display:block;margin-top:12px}
.jk-field span{display:block;font-weight:800;font-size:.86rem;margin-bottom:6px}
.jk-field small{display:block;color:var(--muted);font-size:.78rem;margin-top:4px;font-weight:600}
.jk-input{box-sizing:border-box;width:100%;font:inherit;background:var(--bg);color:var(--text);border:1.5px solid var(--border);border-radius:var(--r-md);padding:12px 14px;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.jk-input::placeholder{color:var(--subtle)}
.jk-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.jk-skel{position:relative;overflow:hidden;background:var(--s2);border-radius:var(--r-md);animation:jk-pulse 1.8s cubic-bezier(.65,.05,.36,1) infinite}
.jk-skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,248,238,.45),transparent);animation:jk-shimmer 1.8s cubic-bezier(.65,.05,.36,1) infinite}
.jk-empty{text-align:center;color:var(--muted);padding:36px 16px;line-height:1.6}
.jk-empty .komi{width:72px;height:72px;border-radius:22px;background:var(--s2);margin:0 auto 12px;display:block}
.jk-rise{animation:jk-rise var(--dur-slow) var(--ease-expo) both}
.jk-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--text);color:var(--bg);padding:10px 18px;border-radius:999px;font-weight:700;font-size:.85rem;opacity:0;transition:all .3s var(--ease);z-index:50;pointer-events:none;max-width:calc(100vw - 32px)}
.jk-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@keyframes jk-pulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes jk-shimmer{100%{transform:translateX(100%)}}
@keyframes jk-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.jk-btn:hover,.jk-card--link:hover,.jk-links a:hover,.jk-nav-cta:hover{transform:none}}

/* ── r101-sitio (16-oct-2026) · AA en tema claro, igual que en jakomi.mx ─────────────────────────────
   Texto coral sobre crema daba 2.76:1 y texto café #A37955 3.3–3.7:1. Solo en claro (el oscuro ya pasa):
   · eyebrows y chips coral → coral profundo #B8434E (5:1), el mismo «pop de texto» de jakomi.mx
   · enlaces y botones café → café «press» #8A6342 (crema encima 5.05:1); bordes y adornos no cambian
   · etiquetas sueltas en café → café press; las que van sobre el panel #F0E4D2 → café muted #7A5C44 (4.9:1) */
@media (prefers-color-scheme:light){
  :root{--pop-text:#B8434E}
  html body :is(.jk-eyebrow,.eyebrow,.eyebrow span,#tcg){color:var(--pop-text)}
  html body .jk-chip--pop{color:var(--pop-text)}
  :is(a,button,.jk-btn,.jk-nav-cta,[role=tab]){--primary:var(--primary-press)}
  html body :is(.jk-foot h2,.jk-foot h3,.t-when b,.card .pr,#menuPanel h3.sec,.hint a){color:var(--primary-press)}
  html body :is(.t-when,.item .pr,#menuPanel h3.sec){--primary:var(--primary-press)}   /* estilos en línea que usan var(--primary) */
  html body :is(.premios b,.card a.ap){color:var(--muted)}
}

/* ── 22-oct-2026 (cartas_publico-03) · lo que aún no pasaba AA, medido en el navegador (claro y oscuro) ───────────
   El café primario ya lo había resuelto r101-sitio. Faltaba:
   · coral con texto crema, 3.0:1 (botones «Inscribirme», «Véndenos tus cartas», «Nueva», «Te damos $…», saldo,
     factura): el coral se queda y la tinta pasa a --ink (= --jk-ink #2E1E14), 5.0:1, como ya hacía el tema oscuro.
     html:root le gana a los :root propios de buscamos, menú, saldo, factura y vender.
   · texto coral sobre su propio tinte (chips «8 lugares», etiquetas «Nuevo» del menú), 2.7–4.4:1 → --pop-ink, una
     sombra del mismo coral (≥4.5:1 sobre crema, panel y tinte); en oscuro, el coral aclarado con la crema del texto.
   · <summary> café («¿Dónde lo encuentro?») sigue la regla de los enlaces: café press en claro. */
html:root{--ink:#2E1E14;--on-pop:var(--ink)}
@media (prefers-color-scheme:light){
  :root{--pop-ink:color-mix(in srgb,var(--pop-text) 75%,var(--text))}
  summary{--primary:var(--primary-press)}
}
@media (prefers-color-scheme:dark){:root{--pop-ink:color-mix(in srgb,var(--pop) 60%,var(--text))}}
html body :is(.jk-chip--pop,#menuPanel .tag){color:var(--pop-ink,var(--pop))}