*{box-sizing:border-box}
:root{--bg:#0a0a0a;--panel:#101010;--panel2:#151515;--wine:#580d12;--gold:#f4af1b;--gold-soft:#c99d42;--text:#fff;--muted:#aaa39a;--line:rgba(255,255,255,.09);--green:#76b86b;--amber:#d8a84e;--red:#c85e58;--title:'Playfair Display',Georgia,serif;--body:'Inter',sans-serif}
html{background:var(--bg)}
body{margin:0;background:radial-gradient(circle at 50% -20%,rgba(88,13,18,.28),transparent 34%),var(--bg);color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased;min-height:100vh}
body.modal-open{overflow:hidden}
a{color:inherit}
.topbar{height:88px;padding:0 clamp(18px,4vw,60px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(10,10,10,.9);backdrop-filter:blur(18px);position:sticky;top:0;z-index:30}
.brand-wrap{display:flex;align-items:center;gap:14px;text-decoration:none}.brand-logo{width:48px;height:48px;object-fit:contain}.brand{font-family:var(--title);font-size:20px;letter-spacing:.14em}.brand span{color:var(--gold);font-style:italic}.brand-wrap small{display:block;color:#777;font-size:10px;text-transform:uppercase;letter-spacing:.18em;margin-top:3px}
.back-link{text-decoration:none;text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:#c8c2b8;border:1px solid var(--line);padding:11px 14px;border-radius:999px;transition:.25s}.back-link:hover{border-color:rgba(244,175,27,.55);color:var(--gold)}.back-link span{margin-right:7px}
.container{max-width:1480px;margin:auto;padding:clamp(34px,5vw,76px) clamp(16px,3vw,46px) 60px}.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:end;margin-bottom:48px}.hero-copy{max-width:760px}.eyebrow,.section-kicker{font-size:10px;letter-spacing:.25em;color:var(--gold);text-transform:uppercase}.hero h1{font:400 clamp(46px,6vw,82px)/.98 var(--title);margin:12px 0 20px;letter-spacing:.01em}.hero p{max-width:700px;color:var(--muted);font-size:15px;line-height:1.8;margin:0;font-weight:300}
.steps{display:flex;align-items:center;gap:13px;padding-bottom:6px}.step{display:flex;flex-direction:column;gap:5px;min-width:54px}.step b{font-size:11px;color:#666;letter-spacing:.14em}.step span{font-family:var(--title);font-size:14px;color:#757575}.step.active b,.step.active span{color:var(--gold)}.steps>i{width:34px;height:1px;background:#2b2b2b}
.map-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:16px}.map-head h2{font:400 28px var(--title);margin:6px 0 0}.legend{display:flex;gap:18px;flex-wrap:wrap;color:#a8a198;font-size:11px}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px;box-shadow:0 0 0 3px rgba(255,255,255,.03)}.free{background:var(--green)}.pending{background:var(--amber)}.busy{background:var(--red)}
.floor-wrap{background:linear-gradient(145deg,#111,#090909);border:1px solid var(--line);padding:12px;border-radius:22px;box-shadow:0 35px 100px rgba(0,0,0,.55);position:relative}.floor-wrap:before{content:'';position:absolute;inset:-1px;border-radius:22px;padding:1px;background:linear-gradient(135deg,rgba(244,175,27,.24),transparent 24%,transparent 75%,rgba(88,13,18,.3));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;pointer-events:none}.floor{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:13px;background:#222}.floor>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.92) brightness(.88)}
.table{position:absolute;border:0;background:transparent;padding:0;cursor:pointer;z-index:5;filter:drop-shadow(0 6px 9px #0008);transition:filter .25s,opacity .25s}.table:hover{filter:drop-shadow(0 10px 14px #000a) brightness(1.08)}.table-top{position:absolute;inset:22% 18%;background:#a86f36;border:3px solid #69451f;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff;box-shadow:inset 0 0 0 1px #d29755;transition:outline-color .25s,box-shadow .25s}.table.redonda .table-top{border-radius:50%}.table-top b{font-size:clamp(8px,1vw,14px);text-shadow:0 1px 2px #000}.table-top small{font-size:8px;opacity:.82}.chair{position:absolute;width:20%;height:16%;background:#d9d5cc;border-radius:45%;box-shadow:0 2px 3px #0008}.c1{left:40%;top:0}.c2{right:0;top:42%}.c3{left:40%;bottom:0}.c4{left:0;top:42%}.table.available .table-top{outline:3px solid var(--green)}.table.pending .table-top{outline:3px solid var(--amber)}.table.busy .table-top{outline:3px solid var(--red)}.table.selected .table-top{box-shadow:inset 0 0 0 1px #e9b86b,0 0 0 6px rgba(244,175,27,.18),0 0 30px rgba(244,175,27,.26)}
.message{padding:17px 3px 8px;color:#cfc8be;font-size:12px;letter-spacing:.01em}.message strong{color:#fff}.message-icon{color:var(--gold);margin-right:7px}.fineprint{margin:4px 0 0;color:#67625d;font-size:11px;line-height:1.6}
.modal-backdrop{display:flex;position:fixed;inset:0;background:rgba(0,0,0,.78);z-index:80;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .3s;backdrop-filter:blur(12px)}.modal-backdrop.open{opacity:1;pointer-events:auto}.modal{position:relative;width:min(660px,100%);max-height:min(90vh,900px);overflow:auto;background:linear-gradient(180deg,#151515,#0d0d0d);border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:34px;box-shadow:0 40px 140px rgba(0,0,0,.78);transform:translateY(18px) scale(.985);transition:transform .32s cubic-bezier(.2,.8,.2,1)}.modal-backdrop.open .modal{transform:none}.close{position:absolute;right:18px;top:14px;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#111;color:#aaa;font-size:25px;line-height:1;cursor:pointer;z-index:2;transition:.2s}.close:hover{color:#fff;border-color:#555}.modal h2{font:400 38px var(--title);margin:8px 0}.modal-head p{color:#9e978d;margin:0 0 22px;font-size:13px}.modal form{display:grid;gap:14px}.modal form label{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#958f86;display:flex;flex-direction:column;gap:7px}.modal input,.modal select,.modal textarea{width:100%;background:#171717;border:1px solid #303030;color:#fff;padding:13px 14px;border-radius:9px;outline:none;font:400 14px var(--body);transition:border-color .2s,box-shadow .2s}.modal input:focus,.modal select:focus,.modal textarea:focus{border-color:rgba(244,175,27,.65);box-shadow:0 0 0 3px rgba(244,175,27,.08)}.modal textarea{resize:vertical;min-height:86px}.reservation-grid{display:grid;grid-template-columns:1.1fr .8fr 1fr;gap:12px}.contact-grid{grid-template-columns:1fr 1fr}
.availability{display:flex;gap:12px;align-items:center;padding:13px 14px;border-radius:10px;border:1px solid #303030;background:#121212;transition:.2s}.availability-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto;background:#888;box-shadow:0 0 0 4px rgba(255,255,255,.03)}.availability b{display:block;font-size:12px;margin-bottom:3px}.availability small{display:block;color:#888;font-size:10px;line-height:1.4}.availability.checking .availability-dot{background:var(--gold);animation:pulse 1.2s infinite}.availability.available{border-color:rgba(118,184,107,.35);background:rgba(45,83,39,.15)}.availability.available .availability-dot{background:var(--green)}.availability.unavailable{border-color:rgba(200,94,88,.35);background:rgba(105,34,31,.13)}.availability.unavailable .availability-dot{background:var(--red)}@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(244,175,27,0)}}
.form-divider{height:22px;border-bottom:1px solid var(--line);margin:0 0 4px;position:relative}.form-divider span{position:absolute;bottom:-6px;left:0;background:#111;padding-right:10px;color:#5f5a54;font-size:9px;text-transform:uppercase;letter-spacing:.15em}.primary{margin-top:4px;border:1px solid var(--gold);background:var(--gold);color:#16110a;padding:15px 17px;border-radius:9px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:space-between;text-transform:uppercase;letter-spacing:.1em;font-size:11px;transition:.25s}.primary:hover:not(:disabled){background:#ffc044;transform:translateY(-1px)}.primary:disabled{cursor:not-allowed;opacity:.38;filter:grayscale(.25)}.primary.loading{pointer-events:none}.form-note{color:#65605a;font-size:10px;line-height:1.5;margin:0;text-align:center}
.success{display:none;text-align:center;padding:10px 2px 2px}.success.show{display:block}.success-mark{width:58px;height:58px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:rgba(118,184,107,.12);border:1px solid rgba(118,184,107,.45);color:#9ed293;font-size:25px}.success h2{font-size:36px;margin:10px 0}.success>p{color:#aaa39a;font-size:13px;line-height:1.7}.summary-card{display:grid;grid-template-columns:1fr 1fr;margin:25px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-align:left}.summary-card>div{padding:15px;background:#121212;border-bottom:1px solid var(--line)}.summary-card>div:nth-child(odd){border-right:1px solid var(--line)}.summary-card>div:nth-last-child(-n+2){border-bottom:0}.summary-card span{display:block;color:#716c66;font-size:9px;text-transform:uppercase;letter-spacing:.12em;margin-bottom:5px}.summary-card b{font-size:13px}.success-note{font-size:11px!important}.success-home{display:inline-flex;text-decoration:none;margin-top:5px;padding:12px 17px;border:1px solid #444;border-radius:999px;text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:#ddd}.success-home:hover{border-color:var(--gold);color:var(--gold)}
@media(max-width:900px){.hero{grid-template-columns:1fr}.steps{display:none}.hero{margin-bottom:34px}.map-head{align-items:flex-start;flex-direction:column;gap:14px}.floor-wrap{padding:5px}.container{padding-top:38px}.brand{font-size:16px}.brand-logo{width:40px;height:40px}}
@media(max-width:640px){.topbar{height:72px;padding:0 14px}.brand-wrap small{display:none}.back-link{font-size:0;width:40px;height:40px;padding:0;display:grid;place-items:center}.back-link span{font-size:18px;margin:0}.hero h1{font-size:48px}.hero p{font-size:13px}.legend{gap:12px}.floor-wrap{border-radius:14px}.floor{border-radius:10px}.modal-backdrop{padding:0;align-items:flex-end}.modal{width:100%;max-height:94vh;border-radius:20px 20px 0 0;padding:32px 20px calc(24px + env(safe-area-inset-bottom));transform:translateY(100%)}.modal-backdrop.open .modal{transform:translateY(0)}.reservation-grid,.contact-grid{grid-template-columns:1fr 1fr}.full-mobile{grid-column:1/-1}.modal h2{font-size:32px}.close{top:12px;right:14px}.summary-card{grid-template-columns:1fr}.summary-card>div,.summary-card>div:nth-child(odd){border-right:0;border-bottom:1px solid var(--line)}.summary-card>div:last-child{border-bottom:0}}

/* Sillas dinámicas según la capacidad configurada en el editor */
.chair.dynamic-chair{width:19%;height:13%;max-width:26px;max-height:15px;min-width:8px;min-height:5px;transform:translate(-50%,-50%)}

/* Assets visuales de mesas creados para capacidades 2/4/6/8 */
.table-image{position:absolute;inset:-12%;width:124%;height:124%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 7px #0009)}
.table .table-top{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);min-width:52%;padding:3px 5px;background:rgba(17,17,17,.72);border:1px solid rgba(255,255,255,.16);border-radius:6px;box-shadow:none;z-index:2}
.table.available .table-image{filter:drop-shadow(0 0 3px var(--green)) drop-shadow(0 5px 7px #0009)}
.table.pending .table-image{filter:drop-shadow(0 0 3px var(--amber)) drop-shadow(0 5px 7px #0009)}
.table.busy .table-image{filter:drop-shadow(0 0 3px var(--red)) drop-shadow(0 5px 7px #0009)}
.table.selected .table-image{filter:drop-shadow(0 0 7px var(--gold)) drop-shadow(0 5px 7px #0009)}

/* Assets visuales de mesas creados para capacidades 2/4/6/8 */
.table-image{position:absolute;inset:-12%;width:124%;height:124%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 7px #0009)}
.table .table-top{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);min-width:52%;padding:3px 5px;background:rgba(17,17,17,.72);border:1px solid rgba(255,255,255,.16);border-radius:6px;box-shadow:none;z-index:2}
.table.available .table-image{filter:drop-shadow(0 0 3px var(--green)) drop-shadow(0 5px 7px #0009)}
.table.pending .table-image{filter:drop-shadow(0 0 3px var(--amber)) drop-shadow(0 5px 7px #0009)}
.table.busy .table-image{filter:drop-shadow(0 0 3px var(--red)) drop-shadow(0 5px 7px #0009)}
.table.selected .table-image{filter:drop-shadow(0 0 7px var(--gold)) drop-shadow(0 5px 7px #0009)}
