/* Resiapp · página de venta (según el diseño aprobado) */
.lp { overflow-x: hidden; font-family: var(--bs-body-font-family); color: var(--ra-ink); background: #fff; }
.lp h1, .lp h2, .lp h3 { letter-spacing: -.02em; line-height: 1.08; }
.lp .teal { color: var(--ra-teal); }
.lp .teal-d { color: var(--ra-teal-dark); }
.lp-kicker { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--ra-muted); margin-bottom: .8rem; display: block; }
.lp-hand { font-family: 'Caveat', cursive; font-weight: 600; }
.lp-btn { display: inline-flex; align-items: center; gap: .6rem; background: var(--ra-teal); color: var(--ra-navy); font-weight: 800; border-radius: 999px; padding: .85rem 1.7rem; text-decoration: none; border: 0; box-shadow: 0 10px 24px rgba(15,200,176,.28); transition: transform .15s, background .15s; }
.lp-btn:hover { background: #17dcc3; color: var(--ra-navy); transform: translateY(-2px); }
.lp-btn.sm { padding: .5rem 1.1rem; font-size: .85rem; box-shadow: none; }
.lp-btn.lg { padding: 1rem 2.1rem; font-size: 1.05rem; }

/* Navegación */
.lp-nav { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--ra-line); }
.lp-nav .in { display: flex; align-items: center; gap: 2rem; padding-top: .75rem; padding-bottom: .75rem; }
.lp-nav img.logo { height: 32px; width: auto; display: block; }
.lp-nav .links { display: flex; gap: 1.7rem; margin-left: 1rem; }
.lp-nav .links a { color: var(--ra-navy); font-weight: 600; font-size: .85rem; text-decoration: none; }
.lp-nav .links a:hover { color: var(--ra-teal-dark); }
.lp-nav .end { margin-left: auto; display: flex; align-items: center; gap: 1rem; }
.lp-nav .login { color: var(--ra-navy); font-weight: 600; font-size: .85rem; text-decoration: none; }
@media (max-width: 860px) { .lp-nav .links { display: none; } }

/* Hero */
.lp-hero { position: relative; overflow: hidden; color: #fff; padding: 4.5rem 0 4rem;
  background:
    radial-gradient(420px 320px at 62% 38%, rgba(255,170,70,.30), transparent 70%),
    radial-gradient(320px 260px at 92% 15%, rgba(255,200,120,.22), transparent 70%),
    radial-gradient(260px 220px at 75% 85%, rgba(255,140,60,.20), transparent 70%),
    radial-gradient(500px 360px at 8% 100%, rgba(15,200,176,.16), transparent 70%),
    linear-gradient(135deg, #07121f 0%, #0B2239 55%, #15293a 100%); }
.lp-hero.has-photo { background-size: cover; background-position: center; }
.lp-hero::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,214,150,.55) 0 2px, transparent 3px), radial-gradient(circle, rgba(255,214,150,.35) 0 4px, transparent 5px); background-size: 120px 90px, 210px 150px; background-position: 40px 20px, 90px 70px; opacity: .25; pointer-events: none; }
.lp-hero .container { position: relative; z-index: 2; }
.lp-hero h1 { color: #fff; font-size: clamp(2.2rem, 4.4vw, 3.3rem); font-weight: 800; margin-bottom: 1.3rem; }
.lp-hero h1 .teal { display: block; }
.lp-hero .sub { font-size: 1.1rem; color: #d3dde7; max-width: 30rem; margin-bottom: 1.9rem; line-height: 1.55; }
.lp-hero .ticks { margin-top: 1rem; font-size: .8rem; color: #b9c8d6; display: flex; gap: .4rem 1.2rem; flex-wrap: wrap; }
.lp-hero .ticks i { color: var(--ra-teal); margin-right: .25rem; }
.lp-hero .stage { position: relative; min-height: 470px; display: flex; justify-content: center; align-items: center; }
@media (min-width: 992px) { .lp-hero .stage { padding-right: 150px; } }
.lp-hero .note { position: absolute; z-index: 6; white-space: nowrap; top: 10px; right: 0; color: #fff; font-size: 1.55rem; line-height: 1.1; text-align: center; transform: rotate(-7deg); }
.lp-hero .note svg { display: block; margin: .2rem 0 0 .5rem; }
@media (max-width: 991px) { .lp-hero { padding: 3rem 0; } .lp-hero .stage { margin-top: 1.5rem; } .lp-hero .note { right: 0; top: -30px; font-size: 1.25rem; } }

/* Móvil genérico */
.lp-phone { width: 255px; background: #0b0f14; border-radius: 38px; padding: 9px; box-shadow: 0 30px 60px rgba(0,0,0,.45), 0 0 0 1.5px #2b3643 inset; position: relative; flex-shrink: 0; }
.lp-phone::before { content: ""; position: absolute; top: 14px; left: 50%; width: 70px; height: 18px; margin-left: -35px; border-radius: 12px; background: #0b0f14; z-index: 5; }
.lp-phone .scr { background: #fff; border-radius: 30px; overflow: hidden; color: var(--ra-ink); }
.lp-phone.tilt { transform: rotate(-3deg); }

/* Mini web del restaurante dentro del móvil */
.mw-top { display: flex; justify-content: space-between; align-items: center; padding: 1.7rem .9rem .35rem; font-size: .52rem; color: #7b8896; }
.mw-url { margin: 0 .7rem; background: #eef2f5; border-radius: 999px; font-size: .55rem; text-align: center; padding: .2rem; color: #5d6b7a; }
.mw-hero { margin-top: .5rem; height: 120px; background: radial-gradient(60px 50px at 20% 30%, rgba(255,190,100,.6), transparent 70%), radial-gradient(70px 50px at 80% 70%, rgba(255,150,70,.45), transparent 70%), linear-gradient(160deg, #3b2a1e, #1c130d 70%); display: flex; align-items: center; justify-content: center; }
.mw-hero b { font-family: 'Caveat', cursive; font-size: 1.9rem; color: #fff; }
.mw-card { background: #fff; margin: -.9rem .6rem 0; border-radius: 12px; padding: .7rem .6rem; box-shadow: 0 6px 18px rgba(11,34,57,.15); position: relative; text-align: center; }
.mw-card h6 { margin: 0; font-size: .85rem; font-weight: 800; }
.mw-card small { font-size: .55rem; color: var(--ra-muted); }
.mw-q { display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem; margin-top: .55rem; font-size: .48rem; color: var(--ra-navy); font-weight: 600; }
.mw-q i { display: block; font-size: .9rem; color: var(--ra-teal-dark); }
.mw-form { padding: .8rem .8rem .3rem; }
.mw-form b { font-size: .65rem; display: block; margin-bottom: .4rem; }
.mw-form .r { display: grid; grid-template-columns: repeat(3, 1fr); gap: .3rem; }
.mw-form .r span { border: 1px solid var(--ra-line); border-radius: 7px; font-size: .5rem; padding: .35rem .3rem; color: var(--ra-muted); }
.mw-btn { margin: .55rem .8rem; background: var(--ra-teal); color: var(--ra-navy); text-align: center; font-weight: 800; font-size: .62rem; padding: .5rem; border-radius: 999px; }
.mw-strip { height: 62px; background: linear-gradient(90deg, #2a1d14, #6b4a2d 50%, #2a1d14); margin-top: .3rem; }

/* Beneficios */
.lp-benefits { background: var(--ra-teal-soft); }
.lp-benefits .it { display: flex; align-items: center; gap: .9rem; padding: 1.4rem .5rem; font-weight: 700; color: var(--ra-navy); font-size: .92rem; line-height: 1.2; }
.lp-benefits i { font-size: 2rem; color: var(--ra-teal-dark); }

/* Secciones */
.lp-sec { padding: 5rem 0; }
.lp-sec h2 { font-size: clamp(1.8rem, 3.4vw, 2.5rem); font-weight: 800; margin-bottom: 1rem; }
.lp-sec p.lead2 { color: var(--ra-muted); font-size: 1.02rem; line-height: 1.6; max-width: 31rem; }
.lp-checks { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.lp-checks li { display: flex; align-items: center; gap: .7rem; margin-bottom: .65rem; font-weight: 500; color: var(--ra-ink); font-size: .95rem; }
.lp-checks li::before { content: "\F26B"; font-family: bootstrap-icons; flex: 0 0 22px; height: 22px; border-radius: 50%; background: var(--ra-teal); color: var(--ra-navy); display: grid; place-items: center; font-size: .78rem; }
.lp-soon { display: inline-block; margin-left: .6rem; font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; background: #fff3cd; color: #7a5a00; padding: .15rem .55rem; border-radius: 999px; vertical-align: middle; }

/* IA */
.lp-ia .visual { position: relative; border-radius: 22px; min-height: 440px; display: flex; align-items: center; justify-content: flex-start; padding: 0 0 0 3rem; overflow: hidden;
  background: radial-gradient(180px 150px at 75% 60%, rgba(255,200,120,.65), transparent 70%), radial-gradient(150px 120px at 90% 25%, rgba(220,90,50,.5), transparent 70%), radial-gradient(260px 200px at 60% 90%, rgba(120,70,30,.6), transparent 70%), linear-gradient(135deg, #dbc3a6, #8a6340 60%, #4b321f); }
.lp-ia .visual .lp-phone { background: #111; margin: 2rem 0 -4rem; }
.wa-bar { background: #f0f2f5; padding: 1.7rem .7rem .5rem; display: flex; align-items: center; gap: .5rem; font-size: .62rem; border-bottom: 1px solid #e3e6ea; }
.wa-bar .av { width: 24px; height: 24px; border-radius: 7px; background: var(--ra-teal); color: var(--ra-navy); font-weight: 800; display: grid; place-items: center; font-size: .7rem; }
.wa-bar b { display: block; font-size: .66rem; } .wa-bar small { color: #20a35a; font-size: .52rem; }
.wa-chat { background: #e9e0d4; padding: .7rem .5rem 4rem; min-height: 360px; display: flex; flex-direction: column; gap: .4rem; }
.wa-m { max-width: 86%; font-size: .56rem; line-height: 1.35; padding: .4rem .5rem; border-radius: 8px; box-shadow: 0 1px 1px rgba(0,0,0,.08); }
.wa-m.in { background: #fff; align-self: flex-start; border-top-left-radius: 2px; }
.wa-m.out { background: #d9fdd3; align-self: flex-end; border-top-right-radius: 2px; }
.wa-m time { display: block; text-align: right; font-size: .45rem; color: #8696a0; }
.wa-m a { color: #1b7fd0; }

/* Web incluida */
.lp-web { background: linear-gradient(180deg, #eefaf8 0%, #f7fcfb 100%); }
.lp-device { position: relative; padding: 1rem 0 2rem; }
.lp-laptop { width: 82%; margin: 0; }
.lp-laptop .lid { background: #0b0f14; border-radius: 14px 14px 0 0; padding: 9px 9px 0; box-shadow: 0 24px 50px rgba(11,34,57,.25); }
.lp-laptop .base { height: 14px; background: linear-gradient(#cfd6dd, #9aa5af); border-radius: 0 0 14px 14px; margin: 0 -4%; }
.lp-laptop .scr { background: #fff; border-radius: 6px 6px 0 0; overflow: hidden; }
.lw-nav { display: flex; align-items: center; justify-content: space-between; padding: .45rem .8rem; font-size: .5rem; color: var(--ra-navy); }
.lw-nav img { height: 11px; } .lw-nav span { display: flex; gap: .7rem; font-weight: 600; }
.lw-hero { height: 150px; text-align: center; color: #fff; padding-top: 1.7rem; background: radial-gradient(90px 60px at 15% 40%, rgba(255,190,100,.55), transparent 70%), radial-gradient(110px 70px at 85% 60%, rgba(255,150,70,.4), transparent 70%), linear-gradient(160deg, #3b2a1e, #1c130d 70%); }
.lw-hero b { font-family: 'Caveat', cursive; font-size: 2.1rem; display: block; line-height: 1; }
.lw-hero small { font-size: .55rem; opacity: .85; }
.lw-hero i { display: inline-block; margin-top: .5rem; background: var(--ra-teal); color: var(--ra-navy); font-style: normal; font-weight: 800; font-size: .55rem; padding: .3rem .8rem; border-radius: 999px; }
.lw-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; padding: .5rem; margin-top: -1.2rem; position: relative; }
.lw-tiles span { height: 62px; border-radius: 8px; color: #fff; font-size: .55rem; font-weight: 700; display: flex; align-items: flex-end; padding: .35rem; background: linear-gradient(160deg, #c27a3a, #5a3418); }
.lw-tiles span:nth-child(2) { background: linear-gradient(160deg, #d9a35a, #7a4a22); }
.lw-tiles span:nth-child(3) { background: linear-gradient(160deg, #6b5a46, #2a1f15); }
.lp-device .lp-phone { position: absolute; right: 19%; bottom: 0; width: 140px; border-radius: 26px; padding: 6px; }
.lp-device .lp-phone::before { top: 9px; width: 44px; height: 11px; margin-left: -22px; }
.lp-device .lp-phone .scr { border-radius: 21px; }
.lp-device .lp-phone .mw-hero { height: 70px; } .lp-device .lp-phone .mw-hero b { font-size: 1.3rem; }
.lp-qrcard { position: absolute; right: 0; bottom: -.5rem; width: 118px; background: #fff; border-radius: 12px; padding: .7rem; text-align: center; box-shadow: 0 14px 34px rgba(11,34,57,.25); transform: rotate(3deg); z-index: 9; }
.lp-qrcard b { display: block; font-size: .55rem; letter-spacing: .12em; margin-bottom: .35rem; color: var(--ra-navy); }
.lp-qrcard svg { width: 100%; height: auto; display: block; }
.lp-qrcard small { font-size: .5rem; color: var(--ra-muted); display: block; margin-top: .25rem; }
@media (max-width: 575px) { .lp-device .lp-phone { width: 110px; } .lp-qrcard { width: 100px; right: 0; } }

/* Gestión de sala */
.lp-dash { background: #0b0f14; border-radius: 18px; padding: 9px; box-shadow: 0 30px 60px rgba(11,34,57,.28); }
.lp-dash .in { display: flex; background: #fff; border-radius: 11px; overflow: hidden; min-height: 300px; }
.lp-dash .sb { width: 92px; background: var(--ra-navy); padding: .8rem .5rem; color: #9db0c3; font-size: .52rem; flex-shrink: 0; }
.lp-dash .sb img { height: 14px; display: block; margin-bottom: 1rem; }
.lp-dash .sb div { padding: .4rem .45rem; border-radius: 6px; margin-bottom: .2rem; font-weight: 600; }
.lp-dash .sb div.on { background: var(--ra-teal); color: var(--ra-navy); }
.lp-dash .mn { flex: 1; padding: .7rem; font-size: .5rem; min-width: 0; }
.lp-dash .tb { display: flex; gap: .4rem; margin-bottom: .6rem; }
.lp-dash .tb span { border: 1px solid var(--ra-line); border-radius: 6px; padding: .2rem .5rem; font-size: .5rem; }
.lp-dash .hrs { display: grid; grid-template-columns: 56px repeat(4, 1fr); color: #8a99a8; border-bottom: 1px solid var(--ra-line); padding-bottom: .25rem; }
.lp-dash .row { display: grid; grid-template-columns: 56px 1fr; border-bottom: 1px solid #f0f3f6; height: 34px; align-items: center; position: relative; }
.lp-dash .row em { font-style: normal; color: var(--ra-navy); font-weight: 600; line-height: 1.1; }
.lp-dash .row em small { display: block; font-weight: 400; color: #8a99a8; font-size: .42rem; }
.lp-dash .row .b { position: absolute; height: 24px; border-radius: 5px; padding: .15rem .4rem; font-weight: 700; line-height: 1.15; font-size: .45rem; }
.b.blue { background: #bfdcff; color: #1b4a96; } .b.orange { background: #ffd9ae; color: #94540b; } .b.green { background: #c4f0d6; color: #17623a; }

/* Plataforma */
.lp-all { background: #f7fafc; padding: 3.5rem 0; border-top: 1px solid var(--ra-line); border-bottom: 1px solid var(--ra-line); }
.lp-all .tt { text-align: center; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--ra-muted); margin-bottom: 2rem; }
.lp-all .it { text-align: center; font-weight: 700; font-size: .85rem; color: var(--ra-navy); line-height: 1.25; }
.lp-all .it i { display: block; font-size: 2.3rem; color: var(--ra-teal-dark); margin-bottom: .6rem; }

/* Precio */
.lp-price { padding: 4.5rem 0; background: #fff; }
.lp-price .box { display: grid; grid-template-columns: minmax(300px, 620px) 1fr; border-radius: 26px; overflow: hidden; box-shadow: 0 20px 60px rgba(11,34,57,.12); border: 1px solid var(--ra-line); }
.lp-price .l { padding: 2.4rem 2.4rem 2rem; background: #fff; }
.lp-price .amt { font-size: 3.8rem; font-weight: 800; color: var(--ra-navy); letter-spacing: -.04em; line-height: 1; margin: .4rem 0 1.2rem; }
.lp-price .amt small { font-size: 1.1rem; font-weight: 700; letter-spacing: 0; }
.lp-price .amt small span { font-weight: 500; color: var(--ra-muted); font-size: .9rem; }
.lp-price .note { font-size: .78rem; color: var(--ra-muted); margin: 1rem 0 0; }
.lp-price .r { position: relative; min-height: 300px; display: flex; align-items: center; justify-content: center; padding: 2rem; text-align: center; color: #fff;
  background: radial-gradient(120px 100px at 30% 40%, rgba(255,210,140,.6), transparent 70%), radial-gradient(160px 120px at 70% 70%, rgba(255,160,80,.4), transparent 70%), radial-gradient(240px 200px at 90% 10%, rgba(15,200,176,.18), transparent 70%), linear-gradient(135deg, #1b1510, #3a2717 60%, #0B2239); }
.lp-price .r p { font-size: clamp(1.7rem, 3vw, 2.3rem); line-height: 1.05; margin: 0; transform: rotate(-5deg); }
.lp-price .r p::after { content: ""; display: block; width: 130px; height: 5px; border-radius: 4px; background: var(--ra-teal); margin: .6rem auto 0; transform: rotate(-3deg); }
@media (max-width: 860px) { .lp-price .box { grid-template-columns: 1fr; } }

/* Opiniones */
.lp-test { background: var(--ra-bg); padding: 4rem 0; }
.lp-q { background: #fff; border-radius: 18px; padding: 1.5rem; height: 100%; box-shadow: 0 8px 26px rgba(11,34,57,.06); border: 1px solid var(--ra-line); position: relative; }
.lp-q p { margin-top: 1rem; font-size: .95rem; line-height: 1.5; color: var(--ra-ink); }
.lp-q .stars { color: #f5b021; letter-spacing: 2px; font-size: .85rem; }
.lp-q .who { display: flex; gap: .7rem; align-items: center; margin-top: 1rem; }
.lp-q .av { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg, var(--ra-navy), var(--ra-navy-2)); color: var(--ra-teal); font-weight: 800; display: grid; place-items: center; }
.lp-q .who b { display: block; font-size: .85rem; } .lp-q .who small { color: var(--ra-muted); font-size: .75rem; }
.lp-q .ex { position: absolute; top: .8rem; right: .9rem; font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; background: #eef2f6; color: #7a8896; border-radius: 999px; padding: .1rem .5rem; font-weight: 700; }

/* FAQ */
.lp-faq { padding: 4rem 0; background: #fff; }
.lp-faq .qa { border: 1px solid var(--ra-line); border-radius: 12px; margin-bottom: .6rem; background: #fff; }
.lp-faq .qa summary { cursor: pointer; list-style: none; padding: .9rem 1.1rem; font-weight: 600; font-size: .88rem; color: var(--ra-navy); display: flex; justify-content: space-between; gap: 1rem; }
.lp-faq .qa summary::-webkit-details-marker { display: none; }
.lp-faq .qa summary::after { content: "+"; color: var(--ra-muted); font-weight: 500; font-size: 1.2rem; line-height: 1; }
.lp-faq .qa[open] summary::after { content: "–"; }
.lp-faq .qa div { padding: 0 1.1rem 1rem; color: var(--ra-muted); font-size: .88rem; line-height: 1.55; }
.lp-faqcta { background: #fff; border: 1px solid var(--ra-line); border-radius: 18px; padding: 1.6rem; text-align: center; box-shadow: 0 12px 36px rgba(11,34,57,.09); }
.lp-faqcta b { display: block; font-size: 1.05rem; color: var(--ra-navy); margin-bottom: 1rem; line-height: 1.2; }
.lp-faqcta small { display: block; margin-top: .8rem; color: var(--ra-muted); font-size: .75rem; }

/* Pie */
.lp-foot { background: #fff; border-top: 1px solid var(--ra-line); padding: 1.6rem 0; }
.lp-foot .in { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; font-size: .8rem; }
.lp-foot img { height: 26px; }
.lp-foot a { color: var(--ra-navy); text-decoration: none; font-weight: 600; }
.lp-foot a:hover { color: var(--ra-teal-dark); }
.lp-foot .copy { margin-left: auto; color: var(--ra-muted); }

@media (max-width: 991px) {
  .lp-hero .note { position: static; transform: rotate(-3deg); font-size: 1.3rem; margin: 0 0 1rem; align-self: flex-start; }
  .lp-hero .note svg { display: none; }
  .lp-hero .stage { flex-direction: column; min-height: 0; }
}
@media (max-width: 575px) {
  .lp-device .lp-phone { display: none; }
  .lp-laptop { width: 100%; }
  .lp-qrcard { right: 4px; bottom: -1.2rem; }
  .lp-price .amt { font-size: 3rem; }
  .lp-ia .visual { padding-left: 1.2rem; }
}
.lp-sec, .lp-hero, .lp-price, .lp-all { overflow-x: clip; }
.lp-laptop .base { margin: 0 -2%; }
html { overflow-x: hidden; }

/* Planes mensual / anual */
.lp-price .plans { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; margin: .8rem 0 1.2rem; }
.lp-price .plan { position: relative; border: 2px solid var(--ra-line); border-radius: 18px; padding: 1.1rem 1rem .9rem; }
.lp-price .plan.best { border-color: var(--ra-teal); background: rgba(15,200,176,.06); }
.lp-price .plan b { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ra-muted); }
.lp-price .plan .amt { font-size: 2.5rem; margin: .3rem 0 .4rem; }
.lp-price .plan .amt small { font-size: .85rem; display: block; margin-top: .25rem; }
.lp-price .plan em { font-style: normal; font-size: .82rem; color: var(--ra-muted); }
.lp-price .plan .tag { position: absolute; top: -.7rem; right: .8rem; background: var(--ra-teal); color: #0B2239; font-size: .72rem; font-weight: 800; padding: .2rem .65rem; border-radius: 999px; }
@media (max-width: 575px) { .lp-price .plans { grid-template-columns: 1fr; } .lp-price .plan .amt { font-size: 2.2rem; } }
.lp-foot .lp-foot-login { font-weight: 700; color: var(--ra-teal); }
/* Botón Acceder siempre visible en la cabecera (también en móvil) */
.lp-nav .end .login { white-space: nowrap; font-weight: 700; }
@media (max-width: 575px) {
  .lp-nav .end { gap: .5rem; }
  .lp-nav .end .login { font-size: .88rem; padding: .35rem .7rem; border: 1.5px solid var(--ra-line); border-radius: 999px; }
  .lp-nav .end .lp-btn.sm { padding: .4rem .75rem; font-size: .8rem; }
  .lp-nav .end .lp-btn.sm i { display: none; }
}
@media (max-width: 575px) { .lp-nav .in { gap: .6rem; } .lp-nav img.logo { height: 26px; } }