/* ==========================================================================
   Laboratorio: webs de concepto dentro de dispositivos
   Todo se escala con el ancho de la pantalla del mockup (unidades cqw).
   ========================================================================== */

.demo { position: relative; flex: 1; min-height: 0; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; padding: 64px 28px 28px; }
.demo canvas, .mock canvas { display: block; width: 100%; height: 100%; }

/* Las secciones de las demos no heredan el espaciado de las secciones del sitio */
.mock :where(section) { padding: 0; }

/* ---------- Dispositivos ---------- */
.mock { --u: 1cqw; position: relative; container-type: inline-size; width: 100%; max-height: 100%; display: flex; flex-direction: column; box-shadow: 0 40px 120px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.08); }
.mock--browser { height: 100%; border-radius: 14px; overflow: hidden; background: #1b1b22; }
.mock__bar { flex: none; display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; background: #24242c; border-bottom: 1px solid rgba(255, 255, 255, 0.06); }
.mock__bar i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; }
.mock__bar i:nth-child(2) { background: #febc2e; }
.mock__bar i:nth-child(3) { background: #28c840; }
.mock__url { flex: 1; max-width: 360px; margin: 0 auto; padding: 5px 12px; border-radius: 8px; background: #16161c; color: #a3a1ab; font: 500 12px var(--body); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mock__screen { position: relative; flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; container-type: inline-size; scrollbar-width: thin; overscroll-behavior: contain; }
.mock--phone { width: auto; height: 100%; aspect-ratio: 9 / 19.2; max-width: 100%; padding: 10px; border-radius: 46px; background: #0e0e12; box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6), inset 0 0 0 2px #2b2b33, 0 0 0 1px rgba(255, 255, 255, 0.06); }
.mock--phone .mock__screen { border-radius: 36px; }
.mock__island { position: absolute; z-index: 5; top: 20px; left: 50%; width: 30%; height: 24px; transform: translateX(-50%); border-radius: 20px; background: #000; }
.mock :is(button, a) { cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .mock :is(button, a, label, select) { cursor: none; } }

/* ---------- Andes Motors (3D real) ---------- */
.an { min-height: 100%; background: #0c0c10; color: #f1f1f1; font: 400 calc(1.8 * var(--u))/1.45 'Archivo', 'Inter', sans-serif; }
.an__nav { position: sticky; top: 0; z-index: 6; height: 0; display: flex; align-items: flex-start; gap: calc(4 * var(--u)); padding: 0 calc(4 * var(--u)); }
.an__nav > * { margin-top: calc(2.4 * var(--u)); }
.an__logo { font: 800 calc(2.4 * var(--u))/1 'Archivo', sans-serif; letter-spacing: 0.5em; }
.an__nav nav { display: flex; gap: calc(3 * var(--u)); margin-left: auto; font-size: calc(1.4 * var(--u)); letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.85; }
.an__pill { margin-top: calc(1.9 * var(--u)) !important; padding: calc(1 * var(--u)) calc(2.2 * var(--u)); border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 99px; font-size: calc(1.3 * var(--u)); letter-spacing: 0.1em; text-transform: uppercase; }
.an__stage { position: sticky; top: 0; overflow: hidden; }
.an__stage canvas { position: absolute; inset: 0; touch-action: pan-y; }
.an__load { position: absolute; inset: 0; z-index: 3; display: grid; place-content: center; gap: calc(1 * var(--u)); text-align: center; background: #0c0c10; transition: opacity 0.8s; }
.an__load span { font-size: calc(1.4 * var(--u)); letter-spacing: 0.3em; text-transform: uppercase; opacity: 0.7; }
.an__load b { font: 800 calc(6 * var(--u))/1 'Archivo', sans-serif; }
.an__load.is-done { opacity: 0; pointer-events: none; }
.an__cap { position: absolute; z-index: 2; left: calc(4 * var(--u)); bottom: calc(9 * var(--u)); max-width: calc(44 * var(--u)); pointer-events: none; text-shadow: 0 calc(0.3 * var(--u)) calc(2 * var(--u)) rgba(0, 0, 0, 0.5); }
.an__cap.is-in > * { animation: anUp 0.9s cubic-bezier(0.2, 1, 0.3, 1) both; }
.an__cap.is-in > :nth-child(2) { animation-delay: 0.06s; }
.an__cap.is-in > :nth-child(3) { animation-delay: 0.12s; }
@keyframes anUp { from { opacity: 0; transform: translateY(2cqw); } }
.an__cap span { font-size: calc(1.35 * var(--u)); letter-spacing: 0.3em; text-transform: uppercase; opacity: 0.8; }
.an__cap h1 { margin: calc(0.6 * var(--u)) 0; font: 800 calc(8.4 * var(--u))/0.88 'Archivo', sans-serif; letter-spacing: -0.045em; }
.an__cap p { margin: 0; font-size: calc(1.8 * var(--u)); opacity: 0.85; }
.an__dots { position: absolute; z-index: 2; left: calc(4 * var(--u)); top: 50%; display: grid; gap: calc(0.9 * var(--u)); transform: translateY(-50%); }
.an__dots i { width: calc(0.4 * var(--u)); height: calc(2.6 * var(--u)); border-radius: 99px; background: rgba(255, 255, 255, 0.25); transition: height 0.3s, background 0.3s; }
.an__dots i.is-on { height: calc(5 * var(--u)); background: #fff; }
.an__tools { position: absolute; z-index: 3; right: calc(4 * var(--u)); bottom: calc(3 * var(--u)); display: flex; gap: calc(1 * var(--u)); }
.an__tools button { padding: calc(1.2 * var(--u)) calc(2.2 * var(--u)); border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 99px; background: rgba(12, 12, 16, 0.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: #fff; font: 600 calc(1.35 * var(--u)) 'Archivo', sans-serif; letter-spacing: 0.06em; text-transform: uppercase; }
.an__tools button:first-child { background: #fff; color: #0c0c10; border-color: #fff; }
.an__hud { position: absolute; z-index: 2; left: calc(4 * var(--u)); right: calc(4 * var(--u)); top: calc(8 * var(--u)); display: flex; gap: calc(5 * var(--u)); }
.an__hud[hidden] { display: none; }
.an__hud div { display: grid; }
.an__hud b { font: 800 calc(5 * var(--u))/1 'Archivo', sans-serif; font-variant-numeric: tabular-nums; }
.an__hud div:last-child b { font-size: calc(2.4 * var(--u)); margin-top: calc(2.4 * var(--u)); }
.an__hud small { font-size: calc(1.2 * var(--u)); letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.7; }
.an__stage.is-driving .an__cap, .an__stage.is-driving .an__dots, .an__stage.is-driving .an__cfg { opacity: 0; pointer-events: none; }
.an__cfg { position: absolute; z-index: 3; right: calc(3 * var(--u)); top: calc(7 * var(--u)); bottom: calc(9 * var(--u)); width: calc(34 * var(--u)); overflow-y: auto; padding: calc(2.4 * var(--u)); border-radius: calc(1.6 * var(--u)); background: rgba(16, 16, 22, 0.72); border: 1px solid rgba(255, 255, 255, 0.12); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); opacity: 0; transform: translateX(calc(4 * var(--u))); pointer-events: none; transition: opacity 0.6s, transform 0.6s; scrollbar-width: none; }
.an__cfg.is-on { opacity: 1; transform: none; pointer-events: auto; }
.an__stage.is-config .an__cap { max-width: calc(38 * var(--u)); }
.an__cfg h4 { display: flex; justify-content: space-between; margin: calc(1.6 * var(--u)) 0 calc(1 * var(--u)); font: 600 calc(1.2 * var(--u)) 'Archivo', sans-serif; letter-spacing: 0.14em; text-transform: uppercase; }
.an__cfg h4:first-child { margin-top: 0; }
.an__cfg h4 span { letter-spacing: 0.02em; text-transform: none; font-weight: 400; opacity: 0.7; }
.an__sw { display: flex; gap: calc(1.2 * var(--u)); flex-wrap: wrap; }
.an__sw button { width: calc(3.8 * var(--u)); height: calc(3.8 * var(--u)); border-radius: 50%; border: 0; background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.55), transparent 45%), var(--c); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2); }
.an__sw button[aria-checked="true"] { box-shadow: 0 0 0 calc(0.3 * var(--u)) #101016, 0 0 0 calc(0.55 * var(--u)) #fff; }
.an__radio { display: grid; grid-template-columns: 1fr 1fr; gap: calc(0.8 * var(--u)); }
.an__radio--3 { grid-template-columns: repeat(3, 1fr); }
.an__radio button { display: grid; gap: calc(0.2 * var(--u)); padding: calc(1.2 * var(--u)); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: calc(0.9 * var(--u)); background: none; color: inherit; text-align: left; font: 600 calc(1.3 * var(--u)) 'Archivo', sans-serif; }
.an__radio button small { font-weight: 400; font-size: calc(1.05 * var(--u)); opacity: 0.6; }
.an__radio button[aria-pressed="true"] { border-color: #fff; background: rgba(255, 255, 255, 0.08); }
.an__sum { display: grid; gap: calc(1.2 * var(--u)); margin-top: calc(2 * var(--u)); padding-top: calc(1.8 * var(--u)); border-top: 1px solid rgba(255, 255, 255, 0.14); }
.an__sum span { font-size: calc(1.1 * var(--u)); letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.6; }
.an__sum b { display: block; font: 800 calc(3.4 * var(--u))/1.1 'Archivo', sans-serif; font-variant-numeric: tabular-nums; }
.an__sum small { font-size: calc(1.15 * var(--u)); opacity: 0.7; }
.an__sum button { padding: calc(1.4 * var(--u)); border: 0; border-radius: 99px; background: #fff; color: #0c0c10; font: 700 calc(1.3 * var(--u)) 'Archivo', sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.an__sum button.is-ok { background: #2fbf71; color: #fff; }
.an__scroll { position: relative; z-index: 1; pointer-events: none; }
.an__specs { position: relative; z-index: 4; padding: calc(6 * var(--u)) calc(4 * var(--u)); background: #0c0c10; }
.an__specs h2 { margin: 0 0 calc(3 * var(--u)); font: 800 calc(4 * var(--u))/1 'Archivo', sans-serif; letter-spacing: -0.03em; }
.an__specs dl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0; border-top: 1px solid rgba(255, 255, 255, 0.12); }
.an__specs dl div { padding: calc(2 * var(--u)) 0; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.an__specs dt { font-size: calc(1.2 * var(--u)); letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.6; }
.an__specs dd { margin: calc(0.4 * var(--u)) 0 0; font: 700 calc(2.4 * var(--u)) 'Archivo', sans-serif; }
.an__credit { margin: calc(3 * var(--u)) 0 0; font-size: calc(1.1 * var(--u)); opacity: 0.5; }

/* ---------- Tarjetas del laboratorio (pósters de marca) ---------- */
.card__poster { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-start; padding: 28px; transition: transform 1s var(--ease); }
.card:hover .card__poster { transform: scale(1.04); }
.card__poster small { font: 500 11px var(--mono); letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.75; }
.card__poster strong { display: block; margin-top: 14px; font-weight: 400; }
.poster--nebula { background: radial-gradient(90% 60% at 70% 30%, #a35a2b, transparent 70%), radial-gradient(70% 60% at 20% 90%, #f0c79a, transparent 60%), #2a170c; color: #f4ede3; }
.poster--nebula strong { font: italic 500 clamp(48px, 6vw, 84px)/0.9 'Fraunces', serif; letter-spacing: -0.03em; }
.poster--andes { background: radial-gradient(80% 50% at 60% 55%, #d1202b, transparent 70%), linear-gradient(180deg, #0b0b0d, #240407); color: #fff; }
.poster--andes strong { font: 800 clamp(64px, 9vw, 130px)/0.8 'Archivo', sans-serif; letter-spacing: -0.05em; }
.poster--pulso { background: radial-gradient(80% 60% at 20% 20%, #6e9bff, transparent 60%), radial-gradient(80% 70% at 90% 90%, #22d3c5, transparent 60%), #2457ff; color: #fff; }
.poster--pulso strong { font: 800 clamp(36px, 4.2vw, 60px)/0.95 'Plus Jakarta Sans', sans-serif; letter-spacing: -0.045em; }
.poster--ruta { background: linear-gradient(180deg, #2a1b4a, #e0794e 70%, #ffd56b); color: #fff8ec; }
.poster--ruta strong { font: 500 clamp(48px, 6vw, 88px)/0.9 'Cormorant Garamond', serif; }
.poster--ruta::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: #1d1430; clip-path: polygon(0 60%, 14% 30%, 26% 52%, 40% 18%, 52% 44%, 63% 8%, 70% 26%, 80% 12%, 100% 48%, 100% 100%, 0 100%); }
.poster--ceviche { background: radial-gradient(80% 70% at 85% 10%, #ffb199, transparent 60%), #ff4f2b; color: #fff; }
.poster--ceviche strong { font: 800 clamp(52px, 6.6vw, 96px)/0.9 'Inter', sans-serif; letter-spacing: -0.05em; }
.poster--ceviche::before { content: ''; position: absolute; right: -12%; bottom: -12%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 40% 40%, #fffaf0 0 30%, #c8e05a 31% 42%, transparent 43%), #f7f4ec; opacity: 0.95; box-shadow: 0 0 0 18px rgba(247, 244, 236, 0.15); }
.card__poster > * { position: relative; z-index: 1; }

/* Superposiciones dentro del dispositivo (modales, cajones) */
.mock--browser > :is(.nb__dr, .nb__pm, .pu__modal) { position: absolute; z-index: 20; inset: 38px 0 0; }
:is(.nb__dr, .nb__pm, .pu__modal)[hidden] { display: none; }
.nb__dr, .nb__pm { --ink: #1d140e; --paper: #f4ede3; --accent: #c0632f; }
.pu__modal { --ink: #0c1b33; --blue: #2457ff; --soft: #f1f5ff; }
:is(.nb__dr, .nb__pm, .pu__modal) button { cursor: pointer; }

/* ---------- Nébula Café ---------- */
.nb { --ink: #1d140e; --paper: #f4ede3; --accent: #c0632f; min-height: 100%; background: var(--paper); color: var(--ink); font: 400 calc(1.75 * var(--u))/1.5 'Inter', sans-serif; }
.nb button { font: inherit; color: inherit; cursor: pointer; }
.nb__ann { padding: calc(1 * var(--u)); background: var(--ink); color: var(--paper); text-align: center; font-size: calc(1.35 * var(--u)); letter-spacing: 0.04em; }
.nb__nav { position: sticky; top: 0; z-index: 4; display: flex; align-items: center; gap: calc(4 * var(--u)); padding: calc(2 * var(--u)) calc(4 * var(--u)); background: rgba(244, 237, 227, 0.9); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid rgba(29, 20, 14, 0.08); }
.nb__logo { font: italic 600 calc(3.2 * var(--u))/1 'Fraunces', serif; letter-spacing: -0.02em; }
.nb__logo sup { font: 500 calc(1.2 * var(--u)) 'Inter', sans-serif; letter-spacing: 0.2em; text-transform: uppercase; margin-left: 0.4em; vertical-align: 1.2em; }
.nb__nav nav { display: flex; gap: calc(2.6 * var(--u)); margin-left: auto; font-size: calc(1.55 * var(--u)); }
.nb__cart { display: flex; align-items: center; gap: calc(0.8 * var(--u)); padding: calc(0.9 * var(--u)) calc(1.9 * var(--u)); border: 1px solid var(--ink); border-radius: 99px; background: none; font-size: calc(1.5 * var(--u)) !important; }
.nb__cart b { display: grid; place-items: center; min-width: calc(2.5 * var(--u)); height: calc(2.5 * var(--u)); border-radius: 99px; background: var(--accent); color: #fff; font-size: calc(1.3 * var(--u)); transition: transform 0.3s; }
.nb__cart b.bump { transform: scale(1.45); }
.nb__hero { position: relative; display: grid; grid-template-columns: 1.15fr 1fr; gap: calc(3 * var(--u)); align-items: center; min-height: calc(52 * var(--u)); padding: calc(5 * var(--u)); overflow: hidden; color: #f4ede3; }
.nb__hero canvas { position: absolute; inset: 0; }
.nb__hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 12, 7, 0.82), rgba(20, 12, 7, 0.2)); pointer-events: none; }
.nb__heroText, .nb__heroPh { position: relative; z-index: 1; }
.nb__eyebrow { margin: 0 0 calc(1.4 * var(--u)); font: 500 calc(1.3 * var(--u)) 'Inter', sans-serif; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.8; white-space: nowrap; }
.nb h1 { margin: 0; font: 500 calc(6 * var(--u))/0.98 'Fraunces', serif; letter-spacing: -0.035em; }
.nb h1 em { font-style: italic; color: #f0b98a; }
.nb__heroText > p { margin: calc(1.8 * var(--u)) 0 calc(2.6 * var(--u)); font-size: calc(1.75 * var(--u)); opacity: 0.88; }
.nb__ctas { display: flex; align-items: center; gap: calc(2.4 * var(--u)); flex-wrap: wrap; }
.nb__btn { display: inline-block; padding: calc(1.5 * var(--u)) calc(3 * var(--u)); border: 0; border-radius: 99px; background: #f4ede3; color: var(--ink) !important; font: 600 calc(1.6 * var(--u)) 'Inter', sans-serif !important; transition: transform 0.3s, background 0.3s; }
.nb__btn:hover { transform: translateY(-2px); }
.nb__btn--dark { background: var(--ink); color: #f4ede3 !important; }
.nb__btn--yape { background: #742284; color: #fff !important; }
.nb__btn.is-ok { background: #3f6b3a; color: #fff !important; }
.nb__link { border: 0; background: none; color: #f4ede3 !important; font-size: calc(1.55 * var(--u)) !important; border-bottom: 1px solid currentColor; padding: 0; }
.nb__proof { margin-top: calc(2.4 * var(--u)); font-size: calc(1.4 * var(--u)); opacity: 0.85; }
.nb__proof span { color: #f0b98a; letter-spacing: 0.1em; }
.nb__heroPh { margin: 0; aspect-ratio: 4 / 5; border-radius: calc(2 * var(--u)); background: radial-gradient(70% 60% at 50% 40%, #7a4a2a, #2a170c); background-size: cover; background-position: center; box-shadow: 0 calc(3 * var(--u)) calc(6 * var(--u)) rgba(0, 0, 0, 0.45); transition: background-image 0.6s; }
.nb__heroPh figcaption { position: absolute; left: calc(1.4 * var(--u)); bottom: calc(1 * var(--u)); font-size: calc(1 * var(--u)); opacity: 0.75; }
.nb__float { position: absolute; left: calc(-3 * var(--u)); top: calc(3 * var(--u)); display: grid; padding: calc(1.4 * var(--u)) calc(1.8 * var(--u)); border-radius: calc(1.4 * var(--u)); background: #f4ede3; color: var(--ink); box-shadow: 0 calc(2 * var(--u)) calc(4 * var(--u)) rgba(0, 0, 0, 0.3); animation: nbFloat 5s ease-in-out infinite; }
@keyframes nbFloat { 50% { transform: translateY(-1cqw); } }
.nb__float b { font: italic 600 calc(1.9 * var(--u)) 'Fraunces', serif; }
.nb__float span { font-size: calc(1.25 * var(--u)); }
.nb__float u { color: var(--accent); font-weight: 700; text-decoration: none; }
.nb__trust { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(1 * var(--u)); padding: calc(2 * var(--u)) calc(4 * var(--u)); border-bottom: 1px solid rgba(29, 20, 14, 0.1); font-size: calc(1.35 * var(--u)); font-weight: 500; }
.nb__sec { padding: calc(6 * var(--u)) calc(5 * var(--u)) calc(2 * var(--u)); }
.nb__head { display: flex; align-items: baseline; justify-content: space-between; gap: calc(2 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.nb h2 { margin: 0; font: 500 calc(4.2 * var(--u))/1 'Fraunces', serif; letter-spacing: -0.03em; }
.nb__head span { font-size: calc(1.45 * var(--u)); opacity: 0.6; }
.nb__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(2 * var(--u)); }
.nb__prod { display: flex; flex-direction: column; gap: calc(0.9 * var(--u)); }
.nb__shot { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 5; padding: 0; border: 0; border-radius: calc(1.6 * var(--u)); background: radial-gradient(80% 70% at 50% 40%, #fffaf2, #e6dccd); overflow: hidden; }
.nb__shot em { position: absolute; z-index: 1; top: calc(1.2 * var(--u)); left: calc(1.2 * var(--u)); padding: calc(0.4 * var(--u)) calc(1.1 * var(--u)); border-radius: 99px; background: var(--ink); color: var(--paper); font: 600 calc(1.1 * var(--u)) 'Inter', sans-serif; font-style: normal; }
.pouch { position: relative; width: 54%; aspect-ratio: 3 / 4.4; border-radius: calc(0.8 * var(--u)) calc(0.8 * var(--u)) calc(1.4 * var(--u)) calc(1.4 * var(--u)); background: linear-gradient(100deg, rgba(255, 255, 255, 0.2), transparent 30%, transparent 70%, rgba(0, 0, 0, 0.2)), var(--c); box-shadow: 0 calc(3 * var(--u)) calc(4 * var(--u)) calc(-1.5 * var(--u)) rgba(40, 20, 10, 0.55), inset 0 calc(-1 * var(--u)) calc(2 * var(--u)) rgba(0, 0, 0, 0.15); transition: transform 0.6s cubic-bezier(0.2, 1.4, 0.4, 1); }
.nb__prod:hover .pouch { transform: rotate(-4deg) translateY(-4%); }
.pouch::before { content: ''; position: absolute; left: 0; right: 0; top: 6%; height: 4%; background: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0 2px, transparent 2px 5px); }
.pouch__label { position: absolute; left: 12%; right: 12%; top: 28%; padding: 9% 8%; border-radius: calc(0.4 * var(--u)); background: #fbf6ee; color: var(--ink); text-align: center; }
.pouch__label b { display: block; font: italic 600 calc(2 * var(--u))/1 'Fraunces', serif; }
.pouch__label span { display: block; margin-top: calc(0.7 * var(--u)); font: 500 calc(0.85 * var(--u))/1.3 'Inter', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; }
.pouch__label i { display: block; margin: calc(0.9 * var(--u)) auto 0; width: 60%; height: calc(0.3 * var(--u)); background: var(--c); }
.pouch--big { width: 62%; }
.pouch--big .pouch__label b { font-size: calc(3 * var(--u)); }
.pouch--big .pouch__label span { font-size: calc(1.2 * var(--u)); }
.nb__rate { font-size: calc(1.3 * var(--u)); color: #b5651d; }
.nb__rate small { color: #7a6a5f; }
.nb__prod h3 { margin: 0; font: 500 calc(2.1 * var(--u))/1.1 'Fraunces', serif; }
.nb__prod h3 button { padding: 0; border: 0; background: none; font: inherit; text-align: left; }
.nb__meta { font-size: calc(1.3 * var(--u)); opacity: 0.65; }
.nb__chips { display: flex; flex-wrap: wrap; gap: calc(0.5 * var(--u)); }
.nb__chips span { padding: calc(0.25 * var(--u)) calc(0.9 * var(--u)); border-radius: 99px; background: rgba(192, 99, 47, 0.12); font-size: calc(1.15 * var(--u)); }
.nb__opts { display: grid; gap: calc(0.7 * var(--u)); }
.nb__seg { display: flex; gap: calc(0.5 * var(--u)); padding: calc(0.4 * var(--u)); border-radius: 99px; background: rgba(29, 20, 14, 0.07); }
.nb__seg button { flex: 1; padding: calc(0.7 * var(--u)) 0; border: 0; border-radius: 99px; background: none; font-size: calc(1.3 * var(--u)) !important; font-weight: 600; }
.nb__seg button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.nb select { width: 100%; padding: calc(0.8 * var(--u)) calc(1 * var(--u)); border: 1px solid rgba(29, 20, 14, 0.18); border-radius: calc(0.8 * var(--u)); background: #fffaf2; font: 500 calc(1.3 * var(--u)) 'Inter', sans-serif; color: var(--ink); }
.nb__stock { font-size: calc(1.2 * var(--u)); color: #a3321b; }
.nb__stock i { display: block; height: calc(0.5 * var(--u)); margin-bottom: calc(0.5 * var(--u)); border-radius: 99px; background: linear-gradient(90deg, #d2451f calc(var(--v) * 100%), rgba(29, 20, 14, 0.1) 0); }
.nb__buy { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.nb__buy b { font: 600 calc(2.2 * var(--u)) 'Fraunces', serif; }
.nb__buy b small { font: 400 calc(1.2 * var(--u)) 'Inter', sans-serif; opacity: 0.6; }
.nb__add { padding: calc(1 * var(--u)) calc(2 * var(--u)); border: 0; border-radius: 99px; background: var(--accent); color: #fff !important; font-weight: 600 !important; font-size: calc(1.4 * var(--u)) !important; }
.nb__quiz { margin: calc(5 * var(--u)) calc(5 * var(--u)) 0; padding: calc(5 * var(--u)) !important; border-radius: calc(2.4 * var(--u)); background: var(--ink); color: var(--paper); }
.nb__eyebrow2 { display: block; margin-bottom: calc(1.2 * var(--u)); font-size: calc(1.25 * var(--u)); letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.7; }
.nb__qOpts { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(1.4 * var(--u)); margin-top: calc(3 * var(--u)); }
.nb__qOpts button { padding: calc(3 * var(--u)) calc(2 * var(--u)); border: 1px solid rgba(244, 237, 227, 0.25); border-radius: calc(1.4 * var(--u)); background: rgba(244, 237, 227, 0.05); font: 500 calc(1.8 * var(--u)) 'Fraunces', serif !important; transition: background 0.3s, border-color 0.3s; }
.nb__qOpts button:hover { background: rgba(244, 237, 227, 0.14); border-color: #f0b98a; }
.nb__qProg { display: flex; gap: calc(0.8 * var(--u)); margin-top: calc(2.6 * var(--u)); }
.nb__qProg i { width: calc(5 * var(--u)); height: calc(0.5 * var(--u)); border-radius: 99px; background: rgba(244, 237, 227, 0.2); }
.nb__qProg i.on { background: #f0b98a; }
.nb__qRes { display: grid; grid-template-columns: calc(22 * var(--u)) 1fr; gap: calc(4 * var(--u)); align-items: center; }
.nb__qRes .pouch { width: 100%; }
.nb__qRes p { opacity: 0.85; }
.nb__code2 b { padding: calc(0.2 * var(--u)) calc(1 * var(--u)); border: 1px dashed #f0b98a; border-radius: calc(0.6 * var(--u)); color: #f0b98a; }
.nb__link2 { border: 0; background: none; color: var(--paper) !important; text-decoration: underline; font-size: calc(1.5 * var(--u)) !important; }
.nb__origin { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(2.4 * var(--u)); }
.nb__oph { position: relative; aspect-ratio: 4 / 3; border-radius: calc(1.6 * var(--u)); background: linear-gradient(135deg, #5b3a22, #a3693c); background-size: cover; background-position: center; }
.nb__oph b { position: absolute; left: calc(1.4 * var(--u)); top: calc(1 * var(--u)); font: italic 500 calc(4 * var(--u))/1 'Fraunces', serif; color: #fff; text-shadow: 0 calc(0.3 * var(--u)) calc(1.4 * var(--u)) rgba(0, 0, 0, 0.4); }
.nb__origin h3 { margin: calc(1.4 * var(--u)) 0 calc(0.4 * var(--u)); font: 500 calc(2.2 * var(--u)) 'Fraunces', serif; }
.nb__origin p { margin: 0; font-size: calc(1.5 * var(--u)); opacity: 0.75; }
.nb__origin small, .pu__tech small { display: block; margin-top: calc(0.6 * var(--u)); font-size: calc(1 * var(--u)); opacity: 0.5; }
.nb__subs { display: grid; grid-template-columns: 1fr 1fr; gap: calc(4 * var(--u)); align-items: center; margin: calc(4 * var(--u)) calc(5 * var(--u)) 0; padding: calc(5 * var(--u)) !important; border-radius: calc(2.4 * var(--u)); background: #e8dccb; }
.nb__subs ul { margin: calc(2 * var(--u)) 0 0; padding-left: calc(2 * var(--u)); font-size: calc(1.5 * var(--u)); }
.nb__subBox { display: grid; gap: calc(1 * var(--u)); padding: calc(3 * var(--u)); border-radius: calc(1.8 * var(--u)); background: #fffaf2; box-shadow: 0 calc(2 * var(--u)) calc(5 * var(--u)) rgba(29, 20, 14, 0.12); }
.nb__subBox label { display: grid; gap: calc(0.6 * var(--u)); font-size: calc(1.25 * var(--u)); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }
.nb__subTot { display: flex; align-items: flex-end; justify-content: space-between; margin: calc(1 * var(--u)) 0; }
.nb__subTot s { display: block; font-size: calc(1.4 * var(--u)); opacity: 0.5; }
.nb__subTot b { font: 600 calc(3.6 * var(--u))/1 'Fraunces', serif; }
.nb__subTot small { margin-left: calc(0.6 * var(--u)); font-size: calc(1.2 * var(--u)); opacity: 0.6; }
.nb__subTot em { padding: calc(0.5 * var(--u)) calc(1.2 * var(--u)); border-radius: 99px; background: #3f6b3a; color: #fff; font-style: normal; font-size: calc(1.2 * var(--u)); font-weight: 600; }
.nb__reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(2 * var(--u)); }
.nb__reviews blockquote { margin: 0; padding: calc(2.4 * var(--u)); border-radius: calc(1.6 * var(--u)); background: #fffaf2; }
.nb__reviews span { color: #b5651d; letter-spacing: 0.1em; font-size: calc(1.3 * var(--u)); }
.nb__reviews p { margin: calc(1 * var(--u)) 0; font: italic 500 calc(1.8 * var(--u))/1.35 'Fraunces', serif; }
.nb__reviews cite { font-style: normal; font-size: calc(1.2 * var(--u)); opacity: 0.6; }
.nb__foot { margin-top: calc(4 * var(--u)); padding: calc(3 * var(--u)) calc(5 * var(--u)); border-top: 1px solid rgba(29, 20, 14, 0.12); font-size: calc(1.25 * var(--u)); opacity: 0.6; }
.nb__dr { display: flex; justify-content: flex-end; background: rgba(29, 20, 14, 0.4); animation: fade 0.3s; }
.nb__drIn { width: calc(40 * var(--u)); height: 100%; overflow-y: auto; padding: calc(2.6 * var(--u)); background: #fffaf2; color: #1d140e; font: 400 calc(1.5 * var(--u))/1.4 'Inter', sans-serif; animation: nbIn 0.5s cubic-bezier(0.2, 1, 0.3, 1); }
@keyframes nbIn { from { transform: translateX(100%); } }
.nb__drIn header { display: flex; justify-content: space-between; align-items: center; margin-bottom: calc(2 * var(--u)); font: 600 calc(2.4 * var(--u)) 'Fraunces', serif; }
.nb__drIn header button, .nb__x { width: calc(3.4 * var(--u)); height: calc(3.4 * var(--u)); border: 1px solid rgba(29, 20, 14, 0.2); border-radius: 50%; background: none; font-size: calc(1.4 * var(--u)); }
.nb__free { display: grid; gap: calc(0.8 * var(--u)); margin-bottom: calc(2 * var(--u)); font-size: calc(1.35 * var(--u)); }
.nb__free i { height: calc(0.7 * var(--u)); border-radius: 99px; background: linear-gradient(90deg, #3f6b3a calc(var(--v) * 100%), rgba(29, 20, 14, 0.1) 0); }
.nb__line { display: grid; grid-template-columns: calc(5 * var(--u)) 1fr auto; gap: calc(1.4 * var(--u)); align-items: center; padding: calc(1.4 * var(--u)) 0; border-bottom: 1px solid rgba(29, 20, 14, 0.08); }
.nb__mini { aspect-ratio: 3 / 4; border-radius: calc(0.5 * var(--u)); background: var(--c); }
.nb__line small { display: block; opacity: 0.6; font-size: calc(1.2 * var(--u)); }
.nb__step { display: inline-flex; align-items: center; gap: calc(1 * var(--u)); margin-top: calc(0.5 * var(--u)); font-weight: 600; }
.nb__step button { width: calc(2.6 * var(--u)); height: calc(2.6 * var(--u)); border: 1px solid rgba(29, 20, 14, 0.2); border-radius: 50%; background: none; }
.nb__up { display: flex; justify-content: space-between; align-items: center; gap: calc(1 * var(--u)); margin: calc(2 * var(--u)) 0; padding: calc(1.6 * var(--u)); border-radius: calc(1.2 * var(--u)); background: #f1e7d8; }
.nb__up small { display: block; opacity: 0.7; }
.nb__up button { padding: calc(0.9 * var(--u)) calc(1.6 * var(--u)); border: 0; border-radius: 99px; background: var(--ink, #1d140e); color: #fff !important; font-weight: 600; }
.nb__tots { display: grid; gap: calc(0.6 * var(--u)); margin: calc(2 * var(--u)) 0; }
.nb__tots div { display: flex; justify-content: space-between; }
.nb__tots .t { padding-top: calc(1 * var(--u)); border-top: 1px solid rgba(29, 20, 14, 0.12); font: 600 calc(2.2 * var(--u)) 'Fraunces', serif; }
.nb__payRow { display: grid; gap: calc(1 * var(--u)); }
.nb__payRow .nb__btn { width: 100%; }
.nb__done, .nb__empty { display: grid; gap: calc(1.4 * var(--u)); justify-items: center; padding: calc(4 * var(--u)) 0; text-align: center; }
.nb__done i { display: grid; place-items: center; width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: #3f6b3a; color: #fff; font-style: normal; font-size: calc(3.4 * var(--u)); }
.nb__done h3 { margin: 0; font: 600 calc(2.8 * var(--u)) 'Fraunces', serif; }
.nb__code, .pu__code { padding: calc(0.6 * var(--u)) calc(1.6 * var(--u)); border-radius: 99px; background: #f1e7d8; font: 700 calc(1.5 * var(--u)) 'JetBrains Mono', monospace; }
.nb__pm { display: grid; place-items: center; padding: calc(3 * var(--u)); background: rgba(29, 20, 14, 0.5); animation: fade 0.3s; }
.nb__pmIn { position: relative; width: 100%; max-height: 100%; overflow-y: auto; padding: calc(3 * var(--u)); border-radius: calc(2 * var(--u)); background: #f4ede3; color: #1d140e; font: 400 calc(1.6 * var(--u))/1.5 'Inter', sans-serif; animation: pop 0.5s cubic-bezier(0.2, 1, 0.3, 1); }
.nb__x { position: absolute; top: calc(2 * var(--u)); right: calc(2 * var(--u)); z-index: 2; }
.nb__pmGrid { display: grid; grid-template-columns: 1fr 1.2fr; gap: calc(3 * var(--u)); align-items: center; }
.nb__pmShot { display: grid; place-items: center; aspect-ratio: 1; border-radius: calc(1.6 * var(--u)); background: radial-gradient(80% 70% at 50% 40%, #fffaf2, #e6dccd); }
.nb__pmIn h2 { margin: 0 0 calc(0.6 * var(--u)); font: 500 calc(4 * var(--u))/1 'Fraunces', serif; letter-spacing: -0.03em; }
.nb__bars { display: grid; gap: calc(0.8 * var(--u)); margin: calc(1.6 * var(--u)) 0; }
.nb__bar { display: grid; grid-template-columns: calc(8 * var(--u)) 1fr; align-items: center; font-size: calc(1.3 * var(--u)); }
.nb__bar i { height: calc(0.7 * var(--u)); border-radius: 99px; background: linear-gradient(90deg, #c0632f calc(var(--v) * 100%), rgba(29, 20, 14, 0.1) 0); }
.nb__recipe { display: grid; margin-bottom: calc(1.6 * var(--u)); padding: calc(1.4 * var(--u)); border-radius: calc(1 * var(--u)); background: #fffaf2; font-size: calc(1.35 * var(--u)); }
.nb__farm { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: calc(22 * var(--u)); margin-top: calc(2.6 * var(--u)); padding: calc(2 * var(--u)); border-radius: calc(1.6 * var(--u)); background: linear-gradient(135deg, #3d4a2a, #8a6a3a); background-size: cover; background-position: center; color: #fff; }
.nb__farm::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(transparent 40%, rgba(0, 0, 0, 0.6)); }
.nb__farm > * { position: relative; }
.nb__farm span { font: italic 500 calc(2.4 * var(--u)) 'Fraunces', serif; }
.nb__farm small { font-size: calc(1 * var(--u)); opacity: 0.8; }
.has-photo { background-size: cover !important; background-position: center !important; }

/* ---------- Clínica Pulso ---------- */
.pu { --ink: #0c1b33; --blue: #2457ff; --soft: #f1f5ff; min-height: 100%; background: #fff; color: var(--ink); font: 400 calc(1.65 * var(--u))/1.5 'Plus Jakarta Sans', 'Inter', sans-serif; }
.pu button, .pu input, .pu select { font: inherit; color: inherit; }
.pu__top { display: flex; gap: calc(3 * var(--u)); padding: calc(0.9 * var(--u)) calc(4 * var(--u)); background: var(--ink); color: #c9d4ee; font-size: calc(1.2 * var(--u)); }
.pu__top b { color: #fff; }
.pu__topR { margin-left: auto; opacity: 0.8; }
.pu__nav { position: sticky; top: 0; z-index: 4; display: flex; align-items: center; gap: calc(3 * var(--u)); padding: calc(1.8 * var(--u)) calc(4 * var(--u)); background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid #edf0f6; }
.pu__logo { display: flex; align-items: center; gap: calc(0.8 * var(--u)); font: 800 calc(2.3 * var(--u))/1 'Plus Jakarta Sans', sans-serif; letter-spacing: -0.03em; white-space: nowrap; }
.pu__logo svg { width: calc(3.2 * var(--u)); height: calc(3.2 * var(--u)); color: var(--blue); }
.pu__nav nav { display: flex; gap: calc(2.2 * var(--u)); margin-left: auto; font-size: calc(1.4 * var(--u)); font-weight: 600; }
.pu__btn { padding: calc(1.1 * var(--u)) calc(2.2 * var(--u)); border: 0; border-radius: 99px; background: var(--blue); color: #fff !important; font-weight: 700 !important; font-size: calc(1.4 * var(--u)) !important; white-space: nowrap; transition: transform 0.3s, opacity 0.3s; }
.pu__btn:hover { transform: translateY(-1px); }
.pu__btn:disabled { opacity: 0.4; }
.pu__btn--w { background: #fff; color: var(--blue) !important; }
.pu__btn--ghost { background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.5); }
.pu__btn--ghost2 { background: var(--soft); color: var(--blue) !important; }
.pu__hero { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; gap: calc(3 * var(--u)); align-items: end; margin: calc(1.6 * var(--u)) calc(2 * var(--u)) 0; padding: calc(6 * var(--u)) calc(4 * var(--u)) calc(4 * var(--u)); border-radius: calc(2.4 * var(--u)); overflow: hidden; color: #fff; }
.pu__hero canvas { position: absolute; inset: 0; }
.pu__hero > div:not(.pu__heroBg) { position: relative; z-index: 1; }
.pu__eyebrow { font-size: calc(1.2 * var(--u)); letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.85; }
.pu h1 { margin: calc(1 * var(--u)) 0; font: 800 calc(5.2 * var(--u))/1 'Plus Jakarta Sans', sans-serif; letter-spacing: -0.045em; }
.pu__heroL p { max-width: calc(46 * var(--u)); margin: 0 0 calc(2.6 * var(--u)); font-size: calc(1.7 * var(--u)); opacity: 0.92; }
.pu__heroCtas { display: flex; gap: calc(1 * var(--u)); flex-wrap: wrap; }
.pu__live { display: flex; align-items: center; gap: calc(1.4 * var(--u)); padding: calc(1.6 * var(--u)); border-radius: calc(1.6 * var(--u)); background: #fff; color: var(--ink); box-shadow: 0 calc(2 * var(--u)) calc(5 * var(--u)) rgba(12, 27, 51, 0.25); }
.pu__live i { width: calc(1.2 * var(--u)); height: calc(1.2 * var(--u)); border-radius: 50%; background: #2fbf71; box-shadow: 0 0 0 calc(0.6 * var(--u)) rgba(47, 191, 113, 0.2); }
.pu__live span { flex: 1; display: grid; }
.pu__live small { font-size: calc(1.2 * var(--u)); color: #5d6b88; }
.pu__live button { padding: calc(0.8 * var(--u)) calc(1.6 * var(--u)); border: 0; border-radius: 99px; background: var(--blue); color: #fff; font-weight: 700; font-size: calc(1.3 * var(--u)); }
.pu__stats { display: grid; grid-template-columns: 1fr 1fr; gap: calc(1 * var(--u)); margin-top: calc(1.2 * var(--u)); }
.pu__stats div { display: grid; padding: calc(1.4 * var(--u)); border-radius: calc(1.4 * var(--u)); background: rgba(255, 255, 255, 0.14); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.pu__stats b { font-size: calc(2.8 * var(--u)); line-height: 1; }
.pu__stats small { font-size: calc(1.2 * var(--u)); opacity: 0.85; }
.pu__quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(1.4 * var(--u)); margin: calc(-2 * var(--u)) calc(4 * var(--u)) 0; position: relative; z-index: 2; }
.pu__quick button { display: grid; justify-items: start; gap: calc(0.2 * var(--u)); padding: calc(2 * var(--u)); border: 1px solid #e6ebf5; border-radius: calc(1.6 * var(--u)); background: #fff; text-align: left; box-shadow: 0 calc(1.4 * var(--u)) calc(3 * var(--u)) rgba(12, 27, 51, 0.08); }
.pu__quick span { font-size: calc(2.6 * var(--u)); }
.pu__quick b { font-size: calc(1.6 * var(--u)); }
.pu__quick small { font-size: calc(1.2 * var(--u)); color: #5d6b88; }
.pu__sec { padding: calc(6 * var(--u)) calc(4 * var(--u)) calc(3 * var(--u)); }
.pu__sec--soft { margin-top: calc(3 * var(--u)); background: var(--soft); }
.pu__secH { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: calc(2.6 * var(--u)); }
.pu h2 { margin: 0; font: 800 calc(3.4 * var(--u))/1.1 'Plus Jakarta Sans', sans-serif; letter-spacing: -0.035em; }
.pu__secH a, .pu__secH span { font-size: calc(1.4 * var(--u)); color: var(--blue); font-weight: 600; }
.pu__specs { display: grid; grid-template-columns: repeat(6, 1fr); gap: calc(1.2 * var(--u)); }
.pu__specs button { display: grid; justify-items: center; gap: calc(1 * var(--u)); padding: calc(2 * var(--u)) calc(0.6 * var(--u)); border: 1px solid #e6ebf5; border-radius: calc(1.4 * var(--u)); background: #fff; font-size: calc(1.3 * var(--u)); font-weight: 600; text-align: center; transition: border-color 0.3s, box-shadow 0.3s; }
.pu__specs button:hover { border-color: var(--blue); box-shadow: 0 calc(1 * var(--u)) calc(3 * var(--u)) rgba(36, 87, 255, 0.12); }
.pu__specs svg { width: calc(3.6 * var(--u)); height: calc(3.6 * var(--u)); padding: calc(0.8 * var(--u)); border-radius: calc(1 * var(--u)); background: var(--soft); color: var(--blue); }
.pu__checks { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(2 * var(--u)); }
.pu__checks article { position: relative; display: flex; flex-direction: column; gap: calc(1 * var(--u)); padding: calc(2.6 * var(--u)); border-radius: calc(1.8 * var(--u)); background: #fff; border: 1px solid #e6ebf5; }
.pu__checks article.is-feat { background: var(--ink); color: #fff; border-color: var(--ink); }
.pu__checks em { position: absolute; top: calc(2 * var(--u)); right: calc(2 * var(--u)); padding: calc(0.3 * var(--u)) calc(1 * var(--u)); border-radius: 99px; background: #2fbf71; color: #fff; font-style: normal; font-size: calc(1.1 * var(--u)); font-weight: 700; }
.pu__checks h3 { margin: 0; font-size: calc(2 * var(--u)); }
.pu__checks > article > b { font-size: calc(3.6 * var(--u)); letter-spacing: -0.03em; }
.pu__checks ul { flex: 1; margin: 0; padding-left: calc(1.8 * var(--u)); font-size: calc(1.35 * var(--u)); opacity: 0.85; }
.pu__tech { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(2 * var(--u)); }
.pu__ph { aspect-ratio: 4 / 3; border-radius: calc(1.6 * var(--u)); background: linear-gradient(135deg, #dbe5ff, #b9cdfc); }
.pu__tech h3 { margin: calc(1.4 * var(--u)) 0 calc(0.4 * var(--u)); font-size: calc(1.8 * var(--u)); }
.pu__tech p { margin: 0; font-size: calc(1.4 * var(--u)); color: #5d6b88; }
.pu__sedes { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(2 * var(--u)); }
.pu__sedes article { padding: calc(1.4 * var(--u)); border-radius: calc(1.6 * var(--u)); background: #fff; }
.pu__sedes svg { display: block; width: 100%; border-radius: calc(1 * var(--u)); }
.pu__sedes h3 { margin: calc(1.2 * var(--u)) 0 calc(0.2 * var(--u)); font-size: calc(1.8 * var(--u)); }
.pu__sedes p { margin: 0; font-size: calc(1.4 * var(--u)); }
.pu__sedes small { display: block; color: #5d6b88; font-size: calc(1.2 * var(--u)); }
.pu__sedes a { display: inline-block; margin-top: calc(0.8 * var(--u)); color: var(--blue); font-weight: 700; font-size: calc(1.3 * var(--u)); }
.pu__ins { display: flex; flex-wrap: wrap; align-items: center; gap: calc(1 * var(--u)); margin-top: calc(3 * var(--u)); font-size: calc(1.4 * var(--u)); }
.pu__ins span { padding: calc(0.6 * var(--u)) calc(1.6 * var(--u)); border-radius: 99px; background: #fff; border: 1px solid #dfe6f5; font-weight: 600; }
.pu__res { display: grid; grid-template-columns: 1fr 1fr; gap: calc(3 * var(--u)); align-items: center; padding: calc(4 * var(--u)); border-radius: calc(2.4 * var(--u)); background: var(--ink); color: #fff; }
.pu__res p { color: #c9d4ee; }
.pu__resForm { display: grid; gap: calc(1.2 * var(--u)); }
.pu__resForm label { display: grid; gap: calc(0.5 * var(--u)); font-size: calc(1.2 * var(--u)); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.pu__resForm input { padding: calc(1.2 * var(--u)) calc(1.4 * var(--u)); border: 0; border-radius: calc(1 * var(--u)); background: #fff; color: var(--ink) !important; font-size: calc(1.6 * var(--u)) !important; }
.pu__resList { grid-column: 1 / -1; display: grid; gap: calc(1 * var(--u)); }
.pu__resList div { display: flex; align-items: center; gap: calc(1.6 * var(--u)); padding: calc(1.4 * var(--u)) calc(1.8 * var(--u)); border-radius: calc(1.2 * var(--u)); background: rgba(255, 255, 255, 0.08); }
.pu__resList span { flex: 1; display: grid; }
.pu__resList small { color: #9fb0d6; font-size: calc(1.2 * var(--u)); }
.pu__resList em { font-style: normal; font-size: calc(1.25 * var(--u)); color: #ffcf6b; }
.pu__resList em.ok { color: #6ee7a8; }
.pu__resList button { padding: calc(0.7 * var(--u)) calc(1.6 * var(--u)); border: 0; border-radius: 99px; background: #fff; color: var(--ink) !important; font-weight: 700; font-size: calc(1.2 * var(--u)); }
.pu__resList button:disabled { opacity: 0.3; }
.pu__foot { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: calc(3 * var(--u)); margin-top: calc(4 * var(--u)); padding: calc(4 * var(--u)); border-top: 1px solid #edf0f6; font-size: calc(1.3 * var(--u)); }
.pu__foot p { color: #5d6b88; }
.pu__foot div:not(:first-child) { display: grid; gap: calc(0.6 * var(--u)); align-content: start; }
.pu__modal { display: grid; place-items: center; padding: calc(3 * var(--u)); background: rgba(12, 27, 51, 0.5); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); animation: fade 0.3s; }
.pu__dlg { position: relative; width: min(calc(62 * var(--u)), 100%); max-height: 100%; overflow-y: auto; padding: calc(3 * var(--u)); border-radius: calc(2 * var(--u)); background: #fff; color: #0c1b33; font: 400 calc(1.5 * var(--u))/1.5 'Plus Jakarta Sans', sans-serif; animation: pop 0.5s cubic-bezier(0.2, 1, 0.3, 1); }
.pu__dlg button, .pu__dlg input, .pu__dlg select { font: inherit; color: inherit; }
.pu__dlg h3 { margin: 0 0 calc(1 * var(--u)); font-size: calc(2.6 * var(--u)); letter-spacing: -0.03em; }
.pu__x { position: absolute; top: calc(2 * var(--u)); right: calc(2 * var(--u)); width: calc(3.4 * var(--u)); height: calc(3.4 * var(--u)); border: 1px solid #e6ebf5; border-radius: 50%; background: #fff; }
.pu__prog { display: flex; gap: calc(0.8 * var(--u)); margin: 0 calc(4 * var(--u)) calc(2.4 * var(--u)) 0; padding: 0; list-style: none; font-size: calc(1.15 * var(--u)); font-weight: 600; color: #9aa6bf; }
.pu__prog li { flex: 1; padding-top: calc(0.8 * var(--u)); border-top: calc(0.45 * var(--u)) solid #e6ebf5; }
.pu__prog li.on { color: #2457ff; border-color: #2457ff; }
.pu__prog li.done { color: #0c1b33; border-color: #0c1b33; }
.pu__seg { display: flex; gap: calc(0.6 * var(--u)); margin: calc(1.4 * var(--u)) 0; padding: calc(0.5 * var(--u)); border-radius: 99px; background: #f1f5ff; }
.pu__seg button { flex: 1; padding: calc(1 * var(--u)); border: 0; border-radius: 99px; background: none; font-weight: 700; }
.pu__seg button[aria-pressed="true"] { background: #2457ff; color: #fff; }
.pu__fld { display: grid; gap: calc(0.5 * var(--u)); margin-bottom: calc(1.4 * var(--u)); font-size: calc(1.2 * var(--u)); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #5d6b88; }
.pu__fld :is(input, select) { padding: calc(1.2 * var(--u)); border: 1.5px solid #e3e8f2; border-radius: calc(1 * var(--u)); background: #fff; color: #0c1b33 !important; font-size: calc(1.6 * var(--u)); text-transform: none; letter-spacing: 0; font-weight: 600; }
.pu__grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: calc(1.4 * var(--u)); }
.pu__note { margin: 0 0 calc(1.4 * var(--u)); color: #5d6b88; }
.pu__nav2 { display: flex; justify-content: space-between; gap: calc(1 * var(--u)); margin-top: calc(2 * var(--u)); }
.pu__docs { display: grid; gap: calc(1 * var(--u)); }
.pu__doc { display: flex; align-items: center; gap: calc(1.6 * var(--u)); padding: calc(1.6 * var(--u)); border: 1.5px solid #e3e8f2; border-radius: calc(1.4 * var(--u)); background: #fff; text-align: left; }
.pu__doc[aria-pressed="true"] { border-color: #2457ff; box-shadow: 0 0 0 calc(0.4 * var(--u)) rgba(36, 87, 255, 0.12); }
.pu__doc span:last-child { display: grid; }
.pu__doc small { color: #5d6b88; font-size: calc(1.25 * var(--u)); }
.pu__av { flex: none; display: grid; place-items: center; width: calc(5.4 * var(--u)); height: calc(5.4 * var(--u)); border-radius: 50%; background: linear-gradient(135deg, #2457ff, #22d3c5); color: #fff; font-weight: 800; }
.pu__days { display: grid; grid-template-columns: repeat(6, 1fr); gap: calc(0.8 * var(--u)); margin-bottom: calc(1.4 * var(--u)); }
.pu__days button, .pu__slots button { border: 0; border-radius: calc(1.1 * var(--u)); background: #f1f5ff; font-weight: 700; }
.pu__days button { display: grid; padding: calc(1 * var(--u)) 0; text-transform: capitalize; }
.pu__days small { font-size: calc(1.1 * var(--u)); color: #5d6b88; font-weight: 500; }
.pu__days b { font-size: calc(2 * var(--u)); }
.pu__days button[aria-pressed="true"] { background: #2457ff; color: #fff; }
.pu__days button[aria-pressed="true"] small { color: #dfe7ff; }
.pu__slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(0.8 * var(--u)); }
.pu__slots button { padding: calc(1.2 * var(--u)) 0; }
.pu__slots button:disabled { opacity: 0.3; text-decoration: line-through; }
.pu__slots button[aria-pressed="true"] { background: #0c1b33; color: #fff; }
.pu__resume { padding: calc(1.6 * var(--u)); border-radius: calc(1.2 * var(--u)); background: #f1f5ff; font-weight: 600; text-transform: capitalize; }
.pu__total { display: flex; justify-content: space-between; align-items: baseline; margin-top: calc(1 * var(--u)); }
.pu__total b { font-size: calc(3.2 * var(--u)); }
.pu__ok { display: grid; justify-items: center; gap: calc(1.2 * var(--u)); padding: calc(2 * var(--u)) 0; text-align: center; }
.pu__ok i { display: grid; place-items: center; width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: #2fbf71; color: #fff; font-style: normal; font-size: calc(3.4 * var(--u)); animation: puPop 0.6s cubic-bezier(0.2, 1.6, 0.4, 1); }
@keyframes puPop { from { transform: scale(0); } }
.pu__ok p { margin: 0; color: #4b5a78; }

/* ---------- Ruta Inca (fotos reales) ---------- */
.ri { position: relative; min-height: 100%; background: #0d0b14; color: #f4efe6; font: 400 calc(1.75 * var(--u))/1.6 'Inter', sans-serif; }
.ri button, .ri input { font: inherit; color: inherit; }
.ri__nav { position: sticky; top: 0; z-index: 6; height: 0; display: flex; align-items: flex-start; gap: calc(4 * var(--u)); padding: 0 calc(4 * var(--u)); }
.ri__nav > * { margin-top: calc(2.4 * var(--u)); }
.ri__logo { font: 600 calc(2.3 * var(--u))/1 'Cormorant Garamond', serif; letter-spacing: 0.32em; text-transform: uppercase; }
.ri__nav nav { margin-left: auto; display: flex; gap: calc(3 * var(--u)); font-size: calc(1.4 * var(--u)); }
.ri__navbtn { margin-top: calc(1.8 * var(--u)) !important; padding: calc(0.9 * var(--u)) calc(2 * var(--u)); border-radius: 99px; background: #f4efe6; color: #1a1420; font-weight: 600; font-size: calc(1.3 * var(--u)); }
.ri__stage { position: sticky; top: 0; overflow: hidden; background: #0d0b14; }
.ri__ph { position: absolute; inset: 0; opacity: 0; transform: scale(1.12); background: radial-gradient(70% 60% at 60% 30%, hsl(var(--h) 45% 45%), transparent 70%), linear-gradient(180deg, hsl(calc(var(--h) + 30) 40% 22%), #0d0b14); transition: opacity 1.2s ease, transform 9s linear; }
.ri__ph.is-on { opacity: 1; transform: scale(1); }
.ri__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13, 11, 20, 0.55), rgba(13, 11, 20, 0) 25%, rgba(13, 11, 20, 0) 45%, rgba(13, 11, 20, 0.9)); }
.ri__cap { position: absolute; z-index: 2; left: calc(5 * var(--u)); bottom: calc(17 * var(--u)); max-width: calc(48 * var(--u)); text-shadow: 0 calc(0.4 * var(--u)) calc(3 * var(--u)) rgba(0, 0, 0, 0.5); }
.ri__cap span { font-size: calc(1.35 * var(--u)); letter-spacing: 0.3em; text-transform: uppercase; opacity: 0.9; }
.ri__cap h1 { margin: calc(0.6 * var(--u)) 0 0; font: 500 calc(6.6 * var(--u))/0.92 'Cormorant Garamond', serif; letter-spacing: -0.02em; }
.ri__alt { position: absolute; z-index: 2; right: calc(5 * var(--u)); top: calc(8 * var(--u)); display: grid; justify-items: end; text-align: right; text-shadow: 0 calc(0.3 * var(--u)) calc(2 * var(--u)) rgba(0, 0, 0, 0.5); }
.ri__alt b { font: 600 calc(4.6 * var(--u))/1 'Cormorant Garamond', serif; font-variant-numeric: tabular-nums; }
.ri__alt b + small + b { margin-top: calc(1.4 * var(--u)); font-size: calc(3 * var(--u)); }
.ri__alt small { font-size: calc(1.2 * var(--u)); letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.8; }
.ri__prof { position: absolute; z-index: 2; left: calc(5 * var(--u)); right: calc(5 * var(--u)); bottom: calc(3.4 * var(--u)); height: calc(11 * var(--u)); }
.ri__profile { position: absolute; inset: 0; width: 100%; height: 100%; }
.ri__marker { position: absolute; width: 0; height: 0; transition: left 0.3s, bottom 0.3s; }
.ri__marker i { position: absolute; left: calc(-1 * var(--u)); bottom: calc(-1 * var(--u)); width: calc(2 * var(--u)); height: calc(2 * var(--u)); border-radius: 50%; background: #ffd56b; box-shadow: 0 0 0 calc(0.6 * var(--u)) rgba(255, 213, 107, 0.3), 0 0 calc(2 * var(--u)) #ffd56b; }
.ri__credit { position: absolute; z-index: 2; right: calc(5 * var(--u)); bottom: calc(0.8 * var(--u)); margin: 0; font-size: calc(1 * var(--u)); opacity: 0.6; }
.ri__credit a { text-decoration: underline; }
.ri__hint { position: absolute; z-index: 2; left: 50%; bottom: calc(16 * var(--u)); transform: translateX(-50%); font-size: calc(1.25 * var(--u)); letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.8; transition: opacity 0.4s; animation: riBob 2s ease-in-out infinite; }
@keyframes riBob { 50% { transform: translate(-50%, 0.8cqw); } }
.ri__scroll { position: relative; z-index: 3; display: grid; justify-items: end; padding: 0 calc(5 * var(--u)); pointer-events: none; }
.ri__card { width: calc(36 * var(--u)); padding: calc(2.6 * var(--u)); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: calc(1.8 * var(--u)); background: rgba(16, 12, 26, 0.55); backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3); box-shadow: 0 calc(2 * var(--u)) calc(6 * var(--u)) rgba(0, 0, 0, 0.3); opacity: 0.45; transform: translateY(calc(2 * var(--u))); transition: opacity 0.6s, transform 0.6s; pointer-events: auto; }
.ri__card.is-on { opacity: 1; transform: none; }
.ri__meta { display: flex; gap: calc(1.6 * var(--u)); font: 500 calc(1.2 * var(--u)) 'JetBrains Mono', monospace; color: #ffd56b; }
.ri__card h3 { margin: calc(0.8 * var(--u)) 0 calc(0.6 * var(--u)); font: 600 calc(3.2 * var(--u))/1 'Cormorant Garamond', serif; }
.ri__card p { margin: 0; font-size: calc(1.5 * var(--u)); opacity: 0.88; }
.ri__book { position: relative; z-index: 4; display: grid; grid-template-columns: 1fr 1fr; gap: calc(4 * var(--u)); padding: calc(6 * var(--u)) calc(5 * var(--u)); background: #f4efe6; color: #1a1420; }
.ri__eyebrow { font-size: calc(1.25 * var(--u)); letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.6; }
.ri__book h2 { margin: calc(1 * var(--u)) 0 calc(2 * var(--u)); font: 600 calc(5 * var(--u))/1 'Cormorant Garamond', serif; }
.ri__inc { margin: 0; padding-left: calc(2 * var(--u)); display: grid; gap: calc(0.8 * var(--u)); font-size: calc(1.5 * var(--u)); }
.ri__form { display: grid; gap: calc(1 * var(--u)); padding: calc(3 * var(--u)); border-radius: calc(2 * var(--u)); background: #fff; box-shadow: 0 calc(2 * var(--u)) calc(5 * var(--u)) rgba(26, 20, 32, 0.1); }
.ri__form > label { font-size: calc(1.2 * var(--u)); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.7; }
.ri__dates { display: grid; grid-template-columns: 1fr 1fr; gap: calc(0.8 * var(--u)); }
.ri__dates button { display: grid; padding: calc(1.2 * var(--u)); border: 1.5px solid #e5ded2; border-radius: calc(1.2 * var(--u)); background: #fff; text-align: left; }
.ri__dates small { font-size: calc(1.15 * var(--u)); color: #8a6d3b; }
.ri__dates button[aria-pressed="true"] { border-color: #1a1420; background: #1a1420; color: #f4efe6; }
.ri__dates button[aria-pressed="true"] small { color: #ffd56b; }
.ri__qty { display: flex; align-items: center; gap: calc(2 * var(--u)); }
.ri__qty button { width: calc(3.6 * var(--u)); height: calc(3.6 * var(--u)); border: 1.5px solid #e5ded2; border-radius: 50%; background: #fff; font-size: calc(1.8 * var(--u)); }
.ri__qty b { font-size: calc(2.4 * var(--u)); }
.ri label.ri__check { display: flex; align-items: center; gap: calc(1 * var(--u)); font-size: calc(1.4 * var(--u)); text-transform: none; letter-spacing: 0; opacity: 1; font-weight: 500; }
.ri__tot { display: grid; grid-template-columns: 1fr 1fr; gap: calc(1 * var(--u)); margin: calc(1 * var(--u)) 0; padding-top: calc(1.4 * var(--u)); border-top: 1px solid #ece6db; }
.ri__tot small { display: block; font-size: calc(1.15 * var(--u)); opacity: 0.6; }
.ri__tot b { font: 600 calc(3 * var(--u))/1 'Cormorant Garamond', serif; }
.ri__cta { padding: calc(1.6 * var(--u)); border: 0; border-radius: 99px; background: #1a1420; color: #f4efe6 !important; font-weight: 600; font-size: calc(1.6 * var(--u)); }
.ri__cta.is-ok { background: #2f8f5b; }
.ri__foot { position: relative; z-index: 4; padding: calc(2.4 * var(--u)) calc(5 * var(--u)); background: #f4efe6; color: #6b6070; font-size: calc(1.15 * var(--u)); border-top: 1px solid #e5ded2; }

/* ---------- Antojo: app de delivery (celular) ---------- */
.ax { --ink: #1d1d1f; --brand: #ff4f2b; --soft: #f5f3ef; position: relative; height: 100%; overflow: hidden; background: #fff; color: var(--ink); font: 400 3.4cqw/1.4 'Inter', sans-serif; }
.ax button, .ax input, .ax textarea { font: inherit; color: inherit; }
.ax__views { position: absolute; inset: 0; }
.ax__view { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 22cqw; background: #fff; scrollbar-width: none; transition: transform 0.45s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.45s; }
.ax__view.from-right { transform: translateX(100%); }
.ax__view.from-left { transform: translateX(-30%); opacity: 0; }
.ax__view.to-left { transform: translateX(-30%); opacity: 0; }
.ax__view.to-right { transform: translateX(100%); }
.ax__img { position: relative; display: block; background: linear-gradient(135deg, #ffd9c7, #ffb199); background-size: cover; background-position: center; }
.ax__head { padding: 15cqw 5cqw 2cqw; }
.ax__head small { display: block; font-size: 2.8cqw; color: #8a8a8f; }
.ax__head b { font-size: 3.8cqw; }
.ax__title { font: 800 7cqw/1 'Inter', sans-serif !important; letter-spacing: -0.03em; }
.ax__search { display: flex; align-items: center; gap: 2cqw; width: calc(100% - 10cqw); margin: 2cqw 5cqw; padding: 3.2cqw 4cqw; border: 0; border-radius: 99px; background: var(--soft); color: #77777c !important; text-align: left; font-size: 3.4cqw; }
.ax__search--input input { flex: 1; border: 0; background: none; outline: none; color: var(--ink) !important; }
.ax__promos { display: flex; gap: 3cqw; overflow-x: auto; padding: 2cqw 5cqw; scroll-snap-type: x mandatory; scrollbar-width: none; }
.ax__promo { flex: none; display: grid; align-content: end; width: 72cqw; height: 30cqw; padding: 4cqw; border-radius: 5cqw; color: #fff; scroll-snap-align: start; }
.ax__promo b { font: 800 5.6cqw/1 'Inter', sans-serif; letter-spacing: -0.03em; }
.ax__promo span { font-size: 3cqw; opacity: 0.9; }
.ax__promo u { text-decoration: none; padding: 0 1.4cqw; border-radius: 1cqw; background: rgba(255, 255, 255, 0.25); }
.p1 { background: radial-gradient(80% 90% at 90% 0%, #ffb199, transparent 60%), var(--brand); }
.p2 { background: radial-gradient(80% 90% at 90% 0%, #c38be8, transparent 60%), #742284; }
.p3 { background: radial-gradient(80% 90% at 90% 0%, #ffd56b, transparent 60%), #c2410c; }
.ax__cats { display: flex; gap: 3cqw; overflow-x: auto; padding: 3cqw 5cqw; scrollbar-width: none; }
.ax__cats button { flex: none; display: grid; justify-items: center; gap: 1.4cqw; padding: 0; border: 0; background: none; font-size: 2.9cqw; font-weight: 600; }
.ax__cats .ax__img { width: 15cqw; height: 15cqw; border-radius: 50%; }
.ax__h { margin: 4cqw 5cqw 2cqw; font: 800 4.6cqw/1.1 'Inter', sans-serif; letter-spacing: -0.02em; }
.ax__list { display: grid; gap: 4cqw; padding: 0 5cqw; }
.ax__store { display: grid; gap: 2cqw; padding: 0; border: 0; background: none; text-align: left; }
.ax__store .ax__img { height: 38cqw; border-radius: 4cqw; }
.ax__store em { position: absolute; left: 2.4cqw; top: 2.4cqw; padding: 0.8cqw 2.4cqw; border-radius: 99px; background: #fff; color: var(--brand); font: 700 2.7cqw 'Inter', sans-serif; font-style: normal; }
.ax__storeTxt { display: grid; }
.ax__storeTxt b { font-size: 4cqw; }
.ax__storeTxt small, .ax__hit small { font-size: 2.9cqw; color: #6e6e73; }
.ax__chips { display: flex; gap: 2cqw; overflow-x: auto; padding: 1cqw 5cqw 2cqw; scrollbar-width: none; }
.ax__chips button { flex: none; padding: 1.8cqw 4cqw; border: 1px solid #e3e1dc; border-radius: 99px; background: #fff; font-weight: 600; font-size: 3cqw; }
.ax__chips--sticky { position: sticky; top: 0; z-index: 2; padding-top: 3cqw; background: #fff; }
.ax__results { display: grid; gap: 1cqw; padding: 0 5cqw; }
.ax__hit { display: flex; align-items: center; gap: 3cqw; padding: 2cqw 0; border: 0; border-bottom: 1px solid #f0eee9; background: none; text-align: left; }
.ax__hit .ax__img { flex: none; width: 14cqw; height: 14cqw; border-radius: 3cqw; }
.ax__hit span:last-child { display: grid; }
.ax__empty { padding: 6cqw 0; color: #6e6e73; text-align: center; }
.ax__hero { height: 52cqw; }
.ax__back { position: absolute; left: 4cqw; top: 13cqw; width: 9cqw; height: 9cqw; border: 0; border-radius: 50%; background: #fff; font-size: 4.4cqw; box-shadow: 0 1cqw 3cqw rgba(0, 0, 0, 0.15); }
.ax__back--flat { position: static; box-shadow: none; background: var(--soft); }
.ax__storeHead { margin-top: -6cqw; position: relative; padding: 5cqw 5cqw 1cqw; border-radius: 6cqw 6cqw 0 0; background: #fff; }
.ax__storeHead h2 { margin: 0; font: 800 6.4cqw/1 'Inter', sans-serif; letter-spacing: -0.03em; }
.ax__storeHead p { margin: 1.4cqw 0; font-size: 3cqw; color: #6e6e73; }
.ax__badges { display: flex; flex-wrap: wrap; gap: 1.6cqw; }
.ax__badges span { padding: 1cqw 2.4cqw; border-radius: 99px; background: var(--soft); font-size: 2.7cqw; font-weight: 600; }
.ax__badges span:nth-child(2) { background: #ffe8e2; color: var(--brand); }
.ax__menu { display: grid; padding: 0 5cqw; }
.ax__item { display: grid; grid-template-columns: 1fr 25cqw; gap: 3cqw; padding: 3.4cqw 0; border: 0; border-bottom: 1px solid #f0eee9; background: none; text-align: left; }
.ax__item > span:first-child { display: grid; gap: 0.8cqw; }
.ax__item b { font-size: 3.6cqw; }
.ax__item small { font-size: 2.9cqw; color: #6e6e73; }
.ax__item em { font-style: normal; font-weight: 700; }
.ax__item .ax__img { height: 25cqw; border-radius: 3.4cqw; }
.ax__item i { position: absolute; right: 1.6cqw; bottom: 1.6cqw; display: grid; place-items: center; width: 7.4cqw; height: 7.4cqw; border-radius: 50%; background: #fff; font-style: normal; font-weight: 700; font-size: 4.6cqw; box-shadow: 0 1cqw 2cqw rgba(0, 0, 0, 0.18); }
.ax__pad { height: 10cqw; }
.ax__tab { position: absolute; z-index: 5; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(4, 1fr); padding: 2cqw 2cqw 5cqw; background: rgba(255, 255, 255, 0.96); border-top: 1px solid #efedea; transition: transform 0.4s; }
.ax.no-tabs .ax__tab { transform: translateY(100%); }
.ax__tab button { display: grid; justify-items: center; gap: 0.4cqw; padding: 0; border: 0; background: none; font-size: 2.6cqw; font-weight: 600; color: #9a9aa0 !important; }
.ax__tab i { font-style: normal; font-size: 4.6cqw; line-height: 1; }
.ax__tab button[aria-pressed="true"] { color: var(--brand) !important; }
.ax__cartbar { position: absolute; z-index: 6; left: 4cqw; right: 4cqw; bottom: 22cqw; display: flex; align-items: center; justify-content: space-between; padding: 3.4cqw 4.6cqw; border: 0; border-radius: 99px; background: var(--brand); color: #fff !important; font-weight: 700; box-shadow: 0 2cqw 5cqw rgba(255, 79, 43, 0.4); animation: axUp 0.4s cubic-bezier(0.2, 1, 0.3, 1); }
.ax.no-tabs .ax__cartbar { bottom: 6cqw; }
.ax__cartbar[hidden] { display: none; }
.ax__cartbar span:first-child { display: grid; place-items: center; width: 7cqw; height: 7cqw; border-radius: 50%; background: rgba(255, 255, 255, 0.25); }
@keyframes axUp { from { transform: translateY(150%); } }
.ax__sheet { position: absolute; z-index: 10; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; background: rgba(0, 0, 0, 0.35); opacity: 0; pointer-events: none; transition: opacity 0.35s; }
.ax__sheet.is-on { opacity: 1; pointer-events: auto; }
.ax__sheetIn { max-height: 88%; overflow-y: auto; border-radius: 6cqw 6cqw 0 0; background: #fff; transform: translateY(100%); transition: transform 0.45s cubic-bezier(0.2, 1, 0.3, 1); scrollbar-width: none; }
.ax__sheet.is-on .ax__sheetIn { transform: none; }
.ax__pimg { height: 50cqw; }
.ax__pbody { padding: 4cqw 5cqw; }
.ax__pbody h3 { margin: 0; font: 800 5.4cqw/1.1 'Inter', sans-serif; letter-spacing: -0.02em; }
.ax__pbody > p { margin: 1.4cqw 0 2cqw; color: #6e6e73; font-size: 3.1cqw; }
.ax__opt { margin-top: 3cqw; }
.ax__opt h5 { display: flex; justify-content: space-between; align-items: center; margin: 0 -5cqw 1cqw; padding: 2cqw 5cqw; background: var(--soft); font-size: 3.3cqw; }
.ax__opt h5 small { font-size: 2.6cqw; font-weight: 500; color: #6e6e73; }
.ax__opt label { display: flex; align-items: center; gap: 2.6cqw; padding: 2.4cqw 0; border-bottom: 1px solid #f0eee9; font-size: 3.2cqw; }
.ax__opt label span { flex: 1; }
.ax__opt label em { font-style: normal; color: #6e6e73; }
.ax__opt input { width: 4.6cqw; height: 4.6cqw; accent-color: var(--brand); }
.ax textarea { width: 100%; margin-top: 3cqw; padding: 3cqw; border: 1px solid #e3e1dc; border-radius: 3cqw; resize: none; height: 18cqw; font-size: 3cqw; }
.ax__padd { position: sticky; bottom: 0; display: flex; gap: 3cqw; padding: 3cqw 5cqw 6cqw; background: #fff; border-top: 1px solid #f0eee9; }
.ax__step { display: inline-flex; align-items: center; gap: 2.6cqw; padding: 1cqw; border-radius: 99px; background: var(--soft); font-weight: 700; }
.ax__step button { width: 7.4cqw; height: 7.4cqw; border: 0; border-radius: 50%; background: #fff; font-size: 4cqw; }
.ax__cta { flex: 1; padding: 3.4cqw; border: 0; border-radius: 99px; background: var(--brand); color: #fff !important; font-weight: 700; }
.ax__cta:disabled { opacity: 0.4; }
.ax__bar { display: flex; align-items: center; gap: 3cqw; padding: 14cqw 5cqw 3cqw; border-bottom: 1px solid #f0eee9; }
.ax__bar b { font-size: 4cqw; }
.ax__body { padding: 0 5cqw; }
.ax__line { display: grid; grid-template-columns: 13cqw 1fr auto; gap: 3cqw; align-items: center; padding: 3cqw 0; border-bottom: 1px solid #f0eee9; }
.ax__line .ax__img { height: 13cqw; border-radius: 3cqw; }
.ax__line > span:nth-child(2) { display: grid; }
.ax__line small { font-size: 2.6cqw; color: #6e6e73; }
.ax__line em { font-style: normal; font-weight: 700; font-size: 3.2cqw; }
.ax__line .ax__step button { width: 6cqw; height: 6cqw; font-size: 3.4cqw; }
.ax__h4 { margin: 4.4cqw 0 2cqw; font-size: 3.6cqw; }
.ax__card { display: flex; gap: 3cqw; align-items: center; padding: 3cqw; border-radius: 3.4cqw; background: var(--soft); }
.ax__card span:last-child { display: grid; }
.ax__card small { font-size: 2.8cqw; color: #6e6e73; }
.ax__tips, .ax__pays { display: flex; gap: 2cqw; }
.ax__tips button { flex: 1; padding: 2.6cqw 0; border: 1.5px solid #e3e1dc; border-radius: 3cqw; background: #fff; font-weight: 700; font-size: 3cqw; }
.ax__pays { flex-direction: column; }
.ax__pays button { display: grid; padding: 2.8cqw 3.4cqw; border: 1.5px solid #e3e1dc; border-radius: 3cqw; background: #fff; text-align: left; }
.ax__pays small { font-size: 2.7cqw; color: #6e6e73; }
.ax__tips button[aria-pressed="true"], .ax__pays button[aria-pressed="true"] { border-color: var(--brand); background: #fff3ef; }
.ax__coupon { display: flex; gap: 2cqw; }
.ax__coupon input { flex: 1; min-width: 0; padding: 2.8cqw 3.4cqw; border: 1.5px solid #e3e1dc; border-radius: 3cqw; text-transform: uppercase; font-size: 3cqw; }
.ax__coupon button { padding: 0 4cqw; border: 0; border-radius: 3cqw; background: var(--ink); color: #fff !important; font-weight: 700; }
.ax__sum { display: grid; gap: 1.6cqw; margin: 4cqw 0; font-size: 3.2cqw; }
.ax__sum div { display: flex; justify-content: space-between; }
.ax__sum .ok, .ax__sum b.ok { color: #12884a; }
.ax__sum .tot { padding-top: 2.4cqw; border-top: 1px solid #f0eee9; font-weight: 800; font-size: 4cqw; }
.ax__foot { position: sticky; bottom: 0; display: flex; padding: 3cqw 5cqw 6cqw; background: #fff; border-top: 1px solid #f0eee9; }
.ax__paying { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 3cqw; background: var(--ink); color: #fff; text-align: center; }
.ax__paying.yape { background: #742284; }
.ax__paying b { font-size: 5cqw; }
.ax__paying span { opacity: 0.8; }
.ax__spin { width: 14cqw; height: 14cqw; border: 1.4cqw solid rgba(255, 255, 255, 0.25); border-top-color: #fff; border-radius: 50%; animation: axSpin 0.8s linear infinite; }
.ax__paying.is-ok .ax__spin { animation: none; border-color: #2fdc85; background: #2fdc85; }
@keyframes axSpin { to { transform: rotate(360deg); } }
.ax__map { position: relative; height: 58%; }
.ax__map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ax__eta { position: absolute; left: 5cqw; right: 5cqw; top: 13cqw; display: grid; padding: 3.4cqw 4.4cqw; border-radius: 5cqw; background: #fff; box-shadow: 0 2cqw 6cqw rgba(0, 0, 0, 0.15); }
.ax__eta small { font-size: 2.8cqw; color: #6e6e73; }
.ax__eta b { font: 800 7.4cqw/1.1 'Inter', sans-serif; letter-spacing: -0.03em; }
.ax__eta span { font-size: 2.9cqw; color: var(--brand); font-weight: 600; }
.ax__panel { position: relative; margin-top: -6cqw; padding: 5cqw; border-radius: 6cqw 6cqw 0 0; background: #fff; box-shadow: 0 -2cqw 5cqw rgba(0, 0, 0, 0.06); }
.ax__steps { display: grid; gap: 2.2cqw; margin: 0 0 4cqw; padding: 0; list-style: none; }
.ax__steps li { display: grid; grid-template-columns: 5cqw 1fr auto; align-items: center; gap: 2cqw; font-size: 3.1cqw; color: #a1a1a6; }
.ax__steps i { width: 4cqw; height: 4cqw; border-radius: 50%; border: 0.8cqw solid #e3e1dc; }
.ax__steps li.is-done { color: var(--ink); font-weight: 600; }
.ax__steps li.is-done i { border-color: var(--brand); background: var(--brand); }
.ax__steps time { font-size: 2.7cqw; color: #6e6e73; font-weight: 500; }
.ax__rider { display: flex; align-items: center; gap: 3cqw; padding: 3cqw; border-radius: 4cqw; background: var(--soft); }
.ax__rider i { display: grid; place-items: center; width: 10cqw; height: 10cqw; border-radius: 50%; background: var(--brand); color: #fff; font-style: normal; font-weight: 800; }
.ax__rider span { flex: 1; display: grid; font-size: 3.1cqw; }
.ax__rider small { color: #6e6e73; font-size: 2.7cqw; }
.ax__rider button { width: 10cqw; height: 10cqw; border: 0; border-radius: 50%; background: #fff; font-size: 4.4cqw; }
.ax__link { display: block; margin: 4cqw auto 0; border: 0; background: none; color: var(--brand) !important; font-weight: 700; }
.ax__chat { padding: 5cqw; }
.ax__chat h3, .ax__rate h3 { margin: 0 0 3cqw; font-size: 4.6cqw; }
.ax__msgs { display: grid; gap: 2cqw; max-height: 50cqw; overflow-y: auto; margin-bottom: 3cqw; }
.ax__msgs p { max-width: 80%; margin: 0; padding: 2.4cqw 3.4cqw; border-radius: 4cqw; font-size: 3.1cqw; }
.ax__msgs .them { background: var(--soft); border-bottom-left-radius: 1cqw; }
.ax__msgs .me { justify-self: end; background: var(--brand); color: #fff; border-bottom-right-radius: 1cqw; }
.ax__quick { display: flex; flex-wrap: wrap; gap: 2cqw; }
.ax__quick button { padding: 2cqw 3.4cqw; border: 1px solid #e3e1dc; border-radius: 99px; background: #fff; font-size: 2.9cqw; font-weight: 600; }
.ax__rate { display: grid; gap: 3cqw; justify-items: center; padding: 6cqw 5cqw 8cqw; text-align: center; }
.ax__rate p { margin: 0; color: #6e6e73; }
.ax__stars { display: flex; gap: 2cqw; }
.ax__stars button { border: 0; background: none; font-size: 9cqw; color: #e3e1dc !important; }
.ax__stars button.on { color: #ffb400 !important; }
.ax__rate .ax__cta { width: 100%; }
.ax__order { display: grid; margin: 0 5cqw 3cqw; padding: 3.4cqw 4cqw; border: 0; border-radius: 4cqw; background: var(--soft); text-align: left; }
.ax__order.is-live { background: #fff3ef; border: 1.5px solid var(--brand); }
.ax__order small { font-size: 2.9cqw; color: #6e6e73; }
.ax__order em { margin-top: 1cqw; font-style: normal; font-size: 2.9cqw; color: var(--brand); font-weight: 600; }
.ax__again { padding: 0; border: 0; background: none; color: var(--brand) !important; font-weight: 700; text-decoration: underline; }
.ax__pro { display: grid; gap: 2cqw; margin: 2cqw 5cqw; padding: 5cqw; border-radius: 5cqw; background: radial-gradient(80% 90% at 90% 0%, #ffb199, transparent 60%), var(--brand); color: #fff; }
.ax__pro b { font-size: 5.6cqw; }
.ax__pro .ax__cta { background: #fff; color: var(--brand) !important; }
.ax__menuList { display: grid; margin: 3cqw 5cqw; }
.ax__menuList button { display: flex; justify-content: space-between; padding: 4cqw 0; border: 0; border-bottom: 1px solid #f0eee9; background: none; text-align: left; font-size: 3.4cqw; }
.ax__toast { position: absolute; z-index: 20; left: 50%; top: 13cqw; padding: 2.4cqw 4cqw; border-radius: 99px; background: var(--ink); color: #fff; font-size: 3cqw; font-weight: 600; white-space: nowrap; transform: translate(-50%, -200%); transition: transform 0.4s cubic-bezier(0.2, 1, 0.3, 1); }
.ax__toast.is-on { transform: translate(-50%, 0); }


/* ---------- Webs de laptop en pantallas angostas (celular) ----------
   Se agranda la unidad base y se reorganizan las columnas. */
@container (max-width: 620px) {
  .nb, .pu, .ri, .an, .nb__dr, .nb__pm, .pu__modal { --u: 2.15cqw; }
  .nb__nav nav, .pu__nav nav, .ri__nav nav, .an__nav nav, .pu__top span:not(:first-child) { display: none; }
  .nb__hero, .nb__subs, .nb__qRes, .nb__pmGrid, .pu__hero, .pu__res, .ri__book { grid-template-columns: 1fr; }
  .nb__heroPh { max-height: 60cqw; aspect-ratio: auto; height: 60cqw; }
  .nb__float { left: calc(2 * var(--u)); }
  .nb__grid, .nb__trust, .pu__quick, .an__specs dl { grid-template-columns: 1fr 1fr; }
  .nb__origin, .nb__reviews, .nb__qOpts, .pu__checks, .pu__tech, .pu__sedes, .pu__foot { grid-template-columns: 1fr; }
  .pu__specs { grid-template-columns: repeat(3, 1fr); }
  .pu__quick { margin-top: 0; }
  .nb__qRes .pouch { width: 50%; margin: 0 auto; }
  .nb__drIn { width: 100%; }
  .pu__dlg { width: 100%; }
  .pu__days, .pu__slots { grid-template-columns: repeat(3, 1fr); }
  .ri__card { width: 100%; }
  .ri__cap { max-width: 90%; bottom: calc(15 * var(--u)); }
  .ri__alt { display: none; }
  .an__cap { max-width: 90%; }
  .an__cfg { left: calc(2 * var(--u)); right: calc(2 * var(--u)); width: auto; top: auto; bottom: calc(9 * var(--u)); max-height: 62%; }
  .an__stage.is-config .an__cap { display: none; }
  .an__hud { gap: calc(3 * var(--u)); flex-wrap: wrap; }
}

/* ---------- Fotos y videos propios ---------- */
.lab-video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; pointer-events: none; }
.nb__heroBg, .pu__heroBg { position: absolute; inset: 0; opacity: 0; background-size: cover; background-position: center; transition: opacity 1.2s; }
.nb__heroBg.has-photo, .pu__heroBg.has-photo { opacity: 1; }
.pu__heroBg.has-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12, 27, 51, 0.85), rgba(12, 27, 51, 0.25)); }
.nb__heroPh, .ri__ph, .nb__oph, .pu__ph, .ax__img, .nb__farm { overflow: hidden; }

/* ---------- Página "web completa" (sin marco) ---------- */
.mock--bare { width: 100%; height: 100%; max-height: none; border-radius: 0; box-shadow: none; padding: 0; background: none; aspect-ratio: auto; }
.mock--bare .mock__screen { border-radius: 0; }
.mock--browser.mock--bare > :is(.nb__dr, .nb__pm, .pu__modal) { inset: 0; }
@media (min-width: 700px) {
  .mock--phone.mock--bare { width: auto; height: min(880px, 94vh); aspect-ratio: 9 / 19.2; padding: 10px; border-radius: 46px; background: #0e0e12; box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6), inset 0 0 0 2px #2b2b33; }
  .mock--phone.mock--bare .mock__screen { border-radius: 36px; }
}