/* ───────────────────────────────────────────────────────────── Sesion V2 — capa de presentación (estética tipo Replit). No duplica lógica: se inyecta sobre las MISMAS páginas de v1. Se carga solo cuando el worker resuelve ui=v2 (). ───────────────────────────────────────────────────────────── */ html.v2{ --paper:#f7f4ef; --card:#fffdfa; --accent:#f26207; --accent-soft:#fdf0e8; --accent-ink:#c94f04; /* se reescriben las variables que ya usan v1 y las subpáginas */ --brand:#f26207; --brand-ink:#c94f04; --brand-soft:#fdf0e8; --teal:#1c1917; --grad:#f26207; --ink:#1c1917; --ink-soft:#6b6560; --ink-mute:#9a938c; --line:#e5e0d8; --line-soft:#efeae2; --page:#f7f4ef; --radius:14px; --font:"Inter",-apple-system,"Segoe UI",sans-serif; } html.v2 body{background:var(--paper);font-family:var(--font);color:var(--ink)} /* ── tipografía: Replit no grita. Nada de 800/900 ───────────── */ html.v2 h1,html.v2 h2,html.v2 h3{font-weight:500;letter-spacing:-.032em} html.v2 .hero h1{font-size:clamp(34px,5.2vw,54px);line-height:1.05} html.v2 h1{line-height:1.1} html.v2 h2{font-weight:500;letter-spacing:-.03em} html.v2 b,html.v2 strong{font-weight:600} html.v2 .lead,html.v2 .sub,html.v2 p{letter-spacing:-.005em} html.v2 .kicker,html.v2 .stackhead,html.v2 .gfh,html.v2 .psec h2,html.v2 .qa h2{ font-weight:600;letter-spacing:.08em;font-size:11.5px;color:var(--ink-mute);text-transform:uppercase} html.v2 .psec h2,html.v2 .qa h2{color:var(--accent-ink)} /* ── botones: píldora, plano, un solo acento ────────────────── */ html.v2 .btn,html.v2 .btn.grad,html.v2 .btn.ghost,html.v2 button.btn{ font-weight:500;border-radius:999px;font-size:14px;padding:11px 20px;box-shadow:none;transition:.15s} html.v2 .btn.grad{background:var(--accent);color:#fff;border-color:var(--accent)} html.v2 .btn.grad:hover{filter:brightness(.93)} html.v2 .btn.ghost{background:transparent;border-color:var(--line);color:var(--ink)} html.v2 .btn.ghost:hover{border-color:#cfc7bb;background:var(--card)} html.v2 .btn.big{padding:14px 26px;font-size:15px} /* ── cabecera ───────────────────────────────────────────────── */ html.v2 .topbar{background:rgba(247,244,239,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)} html.v2 .topbar .wrap{height:62px} html.v2 .logo,html.v2 .logo .lw{font-weight:600;letter-spacing:-.02em} html.v2 .nav,html.v2 .nav a{font-weight:500;font-size:14px;color:var(--ink-soft)} html.v2 .nav a:hover,html.v2 .hasmenu .trg:hover{color:var(--ink)} html.v2 .hasmenu .trg{font-weight:500} html.v2 .sesbtn{background:var(--card);border:1px solid var(--line);border-radius:999px;font-weight:500;color:var(--ink)} html.v2 .sesbtn b{background:var(--accent);color:#fff;font-weight:600} html.v2 .menu .inner,html.v2 .menu{border-radius:14px;border-color:var(--line);box-shadow:0 12px 30px -18px rgba(28,25,23,.35)} /* ── logo: el degradado morado-teal pasa a naranja ──────────── */ html.v2 .slogo svg stop:first-child,html.v2 .logo svg stop:first-child{stop-color:#f26207} html.v2 .slogo svg stop:last-child,html.v2 .logo svg stop:last-child{stop-color:#c94f04} /* ── hero ───────────────────────────────────────────────────── */ @media(min-width:761px){html.v2 .hero{padding-top:5vh}} html.v2 .hero:before{background: radial-gradient(58% 86% at 84% -12%,rgba(242,98,7,.10),transparent 62%), radial-gradient(52% 78% at 8% 0%,rgba(242,98,7,.07),transparent 58%)} html.v2 .eyebrow{background:var(--card);border:1px solid var(--line);color:var(--ink-soft);font-weight:500;border-radius:999px} html.v2 .eyebrow .dot{background:var(--accent)} html.v2 .hl{color:var(--accent);background:none;-webkit-text-fill-color:currentColor} html.v2 .hero .sub{color:var(--ink-soft);font-weight:400;font-size:16.5px} html.v2 .heroline{color:var(--ink-soft);font-weight:400} html.v2 .heroline b{color:var(--ink);font-weight:600} html.v2 .hv-glow{background:radial-gradient(closest-side,rgba(242,98,7,.16),transparent 70%)} html.v2 .hv-card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 2px 4px rgba(28,25,23,.05)} html.v2 .hv-chip{background:var(--accent-soft);color:var(--accent-ink);font-weight:500;border-radius:999px} html.v2 .hv-live{color:#c94f04} html.v2 .hv-screen{background:#1c1917;border-radius:12px} html.v2 .atable .ahead{color:var(--ink-mute)} html.v2 .ok,html.v2 .ok2{color:#0f7b4f} /* ── franja de valor ────────────────────────────────────────── */ html.v2 .getsband{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)} html.v2 .get{background:transparent;border:1px solid transparent;border-radius:14px} html.v2 .get:hover{border-color:var(--line);background:var(--paper)} html.v2 .get b{font-weight:600} html.v2 .gi{background:var(--accent-soft);border-radius:11px} html.v2 .gi svg path,html.v2 .gi svg rect{stroke:#c94f04} html.v2 .gi svg path[fill="#4a05a0"]{fill:#c94f04} /* ── tarjetas de categoría (el corazón de la home) ──────────── */ html.v2 .cat{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:none;transition:.15s} html.v2 .cat:hover{border-color:#cfc7bb;transform:translateY(-2px);box-shadow:0 4px 16px -10px rgba(28,25,23,.3)} html.v2 .cat.on,html.v2 .cat.sel{border-color:var(--accent);background:var(--accent-soft)} html.v2 .cat b{font-weight:600} html.v2 .cat .pick{border-color:#d9d2c6} html.v2 .cat:hover .pick{border-color:var(--accent);color:#f3c3a2} html.v2 .tchip,html.v2 .tchip.ai{background:var(--card);border:1px solid var(--line);color:var(--ink);font-weight:500;border-radius:999px} html.v2 .tchip.on,html.v2 .tchip.ai.on{background:var(--accent);border-color:var(--accent);color:#fff} html.v2 .cbadge{background:#f0ece4;color:#6b6560;font-weight:600;border-radius:999px;letter-spacing:.05em} html.v2 .cbadge.ai{background:var(--accent-soft);color:var(--accent-ink)} html.v2 .cbadge.full,html.v2 .cbadge.dark{background:#1c1917;color:#fff} html.v2 .topsearch{border-width:1px;border-radius:14px} html.v2 .topsearch:focus-within{border-color:var(--accent)} html.v2 .topsearch input{border-radius:12px;border-color:var(--line);background:var(--card);font-weight:400} html.v2 .topsearch input:focus{border-color:var(--accent);outline:none} /* solo recolorea: el padding y el radio ya vienen de la base, si no el circulo AI se sale de la caja por la izquierda */ html.v2 .aihead{background:var(--accent-soft);border-width:1px;border-color:#f0dbc9;border-radius:14px} html.v2 .aihead b{font-weight:600} html.v2 .aidot{background:var(--accent);color:#fff;font-weight:600} html.v2 .showall{background:var(--card);border:1px solid var(--line);border-radius:999px;font-weight:500;color:var(--ink)} html.v2 .qtip{background:#1c1917;border-radius:10px;font-weight:400} /* ── contadores ─────────────────────────────────────────────── */ html.v2 .qty,html.v2 .stepper{border-radius:999px;border-color:var(--line);background:var(--card)} html.v2 .qty button,html.v2 .stepper button{color:var(--accent-ink);font-weight:600} /* ── personas ───────────────────────────────────────────────── */ html.v2 .exp,html.v2 .card,html.v2 .gcard,html.v2 .bcard,html.v2 .psec,html.v2 .pbook{ background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:none} html.v2 .exp:hover,html.v2 .gcard:hover,html.v2 .bcard:hover{ border-color:#cfc7bb;transform:translateY(-2px);box-shadow:0 6px 20px -14px rgba(28,25,23,.4)} html.v2 .exp b,html.v2 .gcard b,html.v2 .bcard b{font-weight:600;letter-spacing:-.02em} html.v2 .spec{color:var(--accent-ink);font-weight:500} html.v2 .rl{color:var(--ink-soft);font-weight:400} html.v2 .badge{background:var(--accent-soft);color:var(--accent-ink);font-weight:600;border-radius:999px} html.v2 .badge.ai{background:#eef2ff;color:#3730a3} html.v2 .badge.mk{background:#ecfdf5;color:#065f46} html.v2 .badge.rv{background:var(--accent-soft);color:var(--accent-ink)} html.v2 .badge.op{background:#eff6ff;color:#1e40af} html.v2 .badge.gx{background:#fdf2f8;color:#9d174d} /* ── bloques, secciones y footers de subpágina ──────────────── */ html.v2 .block{border-color:var(--line)} html.v2 .block[style*="background:#fff"]{background:var(--card)!important} html.v2 .cta-band{background:#1c1917;border-radius:18px} html.v2 .qa{background:var(--accent-soft);border-color:#f3d9c6} html.v2 .qa h2{color:var(--accent-ink)} html.v2 .tldr .c{background:var(--accent-soft);color:var(--accent-ink);font-weight:600} html.v2 .relrow a,html.v2 .letters a,html.v2 .gcat,html.v2 .gpager button{ border-radius:999px;border-color:var(--line);background:var(--card);font-weight:500;color:var(--ink)} html.v2 .letters a{border-radius:9px} html.v2 .gcat.on,html.v2 .letters a.on,html.v2 .gpager button.on{ background:var(--accent);border-color:var(--accent);color:#fff} html.v2 .foot a,html.v2 .art a,html.v2 .crumb a{color:var(--accent-ink);font-weight:500} html.v2 summary{font-weight:600} html.v2 summary:after{color:var(--accent)} html.v2 footer.site{background:#1c1917} html.v2 footer.site a:hover{color:var(--accent)} /* ── formularios y modal de reserva ─────────────────────────── */ html.v2 input,html.v2 textarea,html.v2 select{font-family:var(--font);border-radius:12px} html.v2 input:focus,html.v2 textarea:focus,html.v2 select:focus{border-color:var(--accent);outline:none} html.v2 .modal .box,html.v2 .sheet,html.v2 .dp{background:var(--card);border-radius:18px;border:1px solid var(--line)} html.v2 .dp-day.on,html.v2 .dp-time.on{background:var(--accent);border-color:var(--accent);color:#fff} html.v2 .pill.on,html.v2 .chip.on{background:var(--accent);border-color:var(--accent);color:#fff} /* ── panel de sesiones (piel v2) ────────────────────────────── */ html.v2 .sespanel{background:#1c1917;box-shadow:0 26px 60px -18px rgba(28,25,23,.5)} html.v2 .sp-head .ic,html.v2 .sp-row .tm,html.v2 .sp-add .tm{background:var(--accent)} html.v2 .sp-perk .pl i.on{background:var(--accent)} html.v2 .sp-foot .btn.grad{background:var(--accent);border-color:var(--accent)} html.v2 .mleft{background:#2e2a26} html.v2 .mleft .selsum{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.13)} html.v2 .mleft .selsum{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)} html.v2 .mleft .selsum .lbl{color:rgba(255,255,255,.6)} html.v2 .perkbar .pl i.on{background:var(--accent)} html.v2 .perkbar a{color:var(--accent)}