/* Nexlivo: the seating plan of the portal's house of events. Night, velvet, brass, pale wood. */
:root {
  --night: #15121A; --night-2: #1C1722; --night-3: #241E2B; --night-4: #2E2636;
  --line: #3A3142; --line-2: #4F4358;
  --cream: #F1E6D3; --cream-2: #CDBFAF; --cream-3: #A99BA0;
  --brass: #D9A84A; --brass-hi: #F2CF7A; --brass-lo: #9A6E22; --brass-ink: #2A1C08;
  --wood: #DCC39A; --wine: #B3263F;
  --fd: 'Unbounded', 'Arial Black', sans-serif; --ft: 'Karla', 'Segoe UI', sans-serif;
  --ease: cubic-bezier(0.16, 1, 0.3, 1); --ease-q: cubic-bezier(0.25, 1, 0.5, 1); --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--night); color-scheme: dark; }
body { margin: 0; background: var(--night); color: var(--cream); font: 400 16px/1.55 var(--ft); -webkit-font-smoothing: antialiased; }
::selection { background: var(--brass); color: var(--brass-ink); }
button { font: inherit; color: inherit; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--brass-hi); outline-offset: 2px; }
[hidden] { display: none !important; }

/* ---------- the house: hall (plan) + booking ---------- */
.house { display: grid; grid-template-columns: minmax(0, 1fr) 404px; height: 100vh; min-height: 700px; }
.hall { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; overflow: hidden;
  background: radial-gradient(120% 70% at 50% 0%, #2A1E2A 0%, rgba(42, 30, 42, 0) 60%), var(--night); }

.marquee { display: flex; align-items: center; gap: 24px; padding: 16px 28px 10px; position: relative; z-index: 6; }
.brand { display: block; line-height: 0; }
.brand img { height: 26px; width: auto; display: block; }
.marquee-sub { font: 500 11px/1.2 var(--fd); letter-spacing: .16em; text-transform: uppercase; color: var(--cream-3); }
.marquee-r { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.prog-btn { white-space: nowrap; background: transparent; border: 1px solid var(--line-2); color: var(--cream); border-radius: 6px; padding: 8px 12px; font: 600 12px/1 var(--ft); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: border-color .25s var(--ease-q), color .25s var(--ease-q); }
.prog-btn:hover { border-color: var(--brass); color: var(--brass-hi); }
.langs { display: flex; border: 1px solid var(--line-2); border-radius: 6px; overflow: hidden; }
.langs button { background: transparent; border: 0; padding: 7px 10px; font: 600 11px/1 var(--fd); letter-spacing: .08em; color: var(--cream-3); cursor: pointer; }
.langs button.on { background: var(--cream); color: var(--night); }

/* ---------- plan area ---------- */
.stagebox { position: relative; min-height: 0; }
.viewport { position: absolute; inset: 0; overflow: auto; display: flex; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; outline: none; }
.viewport.grab, .viewport.grab * { cursor: grabbing !important; }
.hall.zoomed .viewport { cursor: grab; }
.canvas { margin: auto auto 0; flex: none; width: 100%; height: 100%; }
.hall.zoomed .canvas { margin: auto; }
.plan { display: block; width: 100%; height: 100%; overflow: visible; user-select: none; -webkit-user-select: none; }

.cartouche { position: absolute; left: 28px; top: 6px; width: 290px; z-index: 3; pointer-events: none; transition: opacity .45s var(--ease-q), transform .45s var(--ease); }
.hall.zoomed .cartouche { opacity: 0; transform: translateY(-8px); }
.c-k { margin: 0 0 10px; font: 500 10.5px/1.3 var(--fd); letter-spacing: .18em; text-transform: uppercase; color: var(--brass); }
.cartouche h1 { margin: 0; font: 700 38px/1.02 var(--fd); letter-spacing: -.035em; color: var(--cream); text-wrap: balance; }
.c-p { margin: 10px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--cream-2); max-width: 27ch; }
.r-how { margin: 12px 0 0; padding: 0; list-style: none; counter-reset: n; display: grid; gap: 8px; }
.r-how li { position: relative; padding-left: 26px; font-size: 13.5px; line-height: 1.45; color: var(--cream-2); }
.r-how li::before { counter-increment: n; content: counter(n); position: absolute; left: 0; top: 1px; width: 17px; height: 17px; border-radius: 50%; border: 1px solid var(--brass); color: var(--brass-hi); font: 600 9.5px/15px var(--fd); text-align: center; }
.r-how kbd { font: 600 10.5px/1 var(--fd); border: 1px solid var(--line-2); border-bottom-width: 2px; border-radius: 4px; padding: 1px 4px; color: var(--cream); }

.zoom { position: absolute; right: 24px; bottom: 14px; z-index: 4; display: flex; align-items: center; gap: 2px; background: rgba(28, 23, 34, .92); border: 1px solid var(--line); border-radius: 8px; padding: 3px; }
.zoom button { width: 32px; height: 30px; border: 0; background: transparent; color: var(--cream); font: 500 18px/1 var(--ft); border-radius: 5px; cursor: pointer; }
.zoom button:hover:not(:disabled) { background: var(--night-4); }
.zoom button:disabled { color: #6E6070; cursor: default; }
.zoom .z-fit { width: auto; padding: 0 10px; font: 600 11px/1 var(--ft); letter-spacing: .06em; text-transform: uppercase; border-left: 1px solid var(--line); border-radius: 0 5px 5px 0; }
.zoom output { min-width: 46px; text-align: center; font: 500 11px/1 var(--fd); color: var(--cream-3); }

/* ---------- the plan drawing ---------- */
.floor { fill: #1A1620; }
.walls { fill: none; stroke: #4A3E50; stroke-width: 3; stroke-linejoin: round; }
.aisle { fill: none; stroke: #3A3142; stroke-width: 1.5; stroke-dasharray: 2 9; stroke-linecap: round; }
.apron { fill: none; stroke: #F4E6C6; stroke-width: 3; opacity: .65; }
.desk { fill: none; stroke: #8C6A44; stroke-width: 10; stroke-linecap: round; }
.mic { fill: #5A3B22; }
.palco { font: 700 30px var(--fd); letter-spacing: .55em; fill: #5A3B22; }
.palco-s { font: 500 14px var(--ft); letter-spacing: .14em; fill: #6A4A2D; }
.rail-b { fill: none; stroke: #54464F; stroke-width: 6; stroke-linecap: round; }
.rowl { font: 500 12.5px var(--fd); fill: #B3A6A8; }
.entry { font: 600 12px var(--ft); letter-spacing: .32em; fill: #A99BA0; }
.spotlight { opacity: 0; transition: opacity .6s var(--ease-q); pointer-events: none; }
.plan.spot .spotlight { opacity: 1; }

.lab { cursor: pointer; outline: none; }
.lab-t { font: 600 15px var(--fd); letter-spacing: .16em; fill: #E9DCC6; transition: fill .25s var(--ease-q), opacity .4s var(--ease-q); }
.lab:hover .lab-t, .lab:focus-visible .lab-t { fill: var(--brass-hi); }
.lab.dim { opacity: .25; }

.it { cursor: pointer; outline: none; transition: opacity .45s var(--ease-q); }
.it .cu { fill: var(--c); transition: fill .25s var(--ease-q); }
.it .bk { fill: var(--b); transition: fill .25s var(--ease-q); }
.it.k-table .top { fill: #2E2330; }
.it.k-table .rim { fill: none; stroke: var(--c); stroke-width: 3; transition: stroke .25s var(--ease-q); }
.it.k-box .rail { fill: #C9A877; }
.it .code { font: 600 15px var(--fd); fill: #F6EDDD; pointer-events: none; }
.it .tno { font-size: 13px; fill: #E9DCC6; }
.it.hov .cu { fill: color-mix(in srgb, var(--c) 62%, #F6E7CC); }
.it.hov .rim { stroke: color-mix(in srgb, var(--c) 62%, #F6E7CC); }
.it.sel .cu { fill: var(--brass); }
.it.sel .bk { fill: var(--brass-lo); }
.it.sel .rim { stroke: var(--brass); }
.it.sel.k-table .top { fill: #3B2A12; }
.it.sel .code { fill: var(--brass-ink); }
.it.sel.k-table .code { fill: var(--brass-hi); }
.it.sel.hov .cu { fill: var(--brass-hi); }
.it:focus-visible .cu { stroke: var(--brass-hi); stroke-width: 3; }
.it:focus-visible .rim { stroke: var(--brass-hi); stroke-width: 4; }
.it.dim { opacity: .16; }
.it.sel .cu { transform-box: fill-box; transform-origin: center; animation: pop .42s var(--ease); }
@keyframes pop { 0% { transform: scale(1); } 40% { transform: scale(1.28); } 100% { transform: scale(1); } }

/* the house lights come up from the stage outward */
html.js:not(.static) .plan .it { animation: lightup .9s var(--ease-q) both; animation-delay: calc(var(--d, 0) * 1.6ms); }
html.js:not(.static) .plan.drawn .it { animation: none; }
@keyframes lightup { from { opacity: 0; } to { opacity: 1; } }

/* ---------- tooltip ---------- */
.tip { position: absolute; left: 0; top: 0; z-index: 5; pointer-events: none; display: grid; gap: 1px; min-width: 190px; max-width: 260px; padding: 10px 12px 10px 14px;
  background: var(--cream); color: #241A1E; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 14px 30px -10px rgba(0,0,0,.7); border-left: 5px solid var(--c); font-size: 13px; line-height: 1.35; }
.tip .t-s { font: 600 10px/1.3 var(--fd); letter-spacing: .12em; text-transform: uppercase; color: #6B4E58; }
.tip b { font-weight: 700; font-size: 14px; }
.tip .t-p { color: #3B2C33; }
.tip em { font-style: normal; color: #6B4E58; }
.tip .t-h { margin-top: 4px; font-size: 11.5px; color: #6B4E58; }

/* ---------- section sheet (ficha) and company sheet ---------- */
.ficha { position: absolute; left: 24px; bottom: 14px; z-index: 7; width: 404px; max-width: calc(100% - 32px); max-height: calc(100% - 24px); overflow: auto;
  background: linear-gradient(180deg, #241D2A, #1E1924); border: 1px solid var(--line); border-top: 3px solid var(--c, var(--brass)); border-radius: 10px;
  padding: 20px 22px 18px; box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 40px 80px -30px rgba(0,0,0,.9); scrollbar-width: thin; }
.ficha.in { animation: rise .55s var(--ease) both; }
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.ficha .x { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 6px; background: transparent; color: var(--cream-2); font-size: 22px; line-height: 1; cursor: pointer; }
.ficha .x:hover { background: var(--night-4); color: var(--cream); }
.f-k { display: flex; align-items: center; gap: 8px; margin: 0 40px 8px 0; font: 500 10.5px/1.3 var(--fd); letter-spacing: .12em; text-transform: uppercase; color: var(--cream-3); }
.f-k .sw { flex: none; }
.ficha h2 { margin: 0 0 8px; font: 700 25px/1.08 var(--fd); letter-spacing: -.03em; color: var(--cream); padding-right: 30px; }
.f-price { margin: 0 0 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.f-price b { font: 600 22px/1.1 var(--fd); color: var(--brass-hi); letter-spacing: -.02em; }
.f-price b i, .r-amt i, .t-v i, .lg-p i { font: 500 12px var(--ft); font-style: normal; letter-spacing: 0; color: var(--cream-2); }
.f-price span { color: var(--cream-2); font-size: 14px; }
.f-price em { font-style: normal; font-size: 11.5px; letter-spacing: .04em; color: var(--brass); border: 1px solid #6B5326; border-radius: 4px; padding: 1px 6px; }
.f-dl { margin: 0; display: grid; gap: 10px; }
.f-dl div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.f-dl dt { font: 600 10.5px/1.5 var(--ft); letter-spacing: .1em; text-transform: uppercase; color: var(--cream-3); padding-top: 2px; }
.f-dl dd { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--cream); overflow-wrap: anywhere; }
.f-dl dd a { color: var(--cream); text-decoration-color: var(--brass); text-underline-offset: 3px; }
.f-acts { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.f-add { background: var(--brass); color: var(--brass-ink); border: 0; border-radius: 6px; padding: 10px 14px; font: 600 12px/1 var(--fd); letter-spacing: .02em; cursor: pointer; transition: background .2s var(--ease-q); }
.f-add:hover { background: var(--brass-hi); }
.f-n { font-size: 13px; color: var(--cream-2); }
.f-n b { color: var(--brass-hi); }
.f-nav { margin-left: auto; display: flex; gap: 4px; }
.f-nav button { width: 32px; height: 32px; border-radius: 6px; border: 1px solid var(--line-2); background: transparent; color: var(--cream); font-size: 20px; line-height: 1; cursor: pointer; }
.f-nav button:hover { border-color: var(--brass); color: var(--brass-hi); }
.firma { --c: var(--wood); }
.f-note { margin: 14px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--cream-3); }

/* ---------- key and notes ---------- */
.keyline { position: relative; z-index: 6; padding: 10px 28px 14px; border-top: 1px solid var(--line); background: linear-gradient(180deg, rgba(21,18,26,.6), var(--night)); }
.legend { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.lg-k { grid-column: 1 / -1; margin: 0 0 4px; font: 500 10px/1.3 var(--fd); letter-spacing: .16em; text-transform: uppercase; color: var(--cream-3); }
.lg-k span { color: var(--brass); }
.lg { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px; align-items: center; text-align: left; background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 6px 8px 6px 4px; cursor: pointer; transition: background .25s var(--ease-q), border-color .25s var(--ease-q); min-width: 0; }
.lg .sw { grid-row: 1 / 3; }
.lg:hover { background: var(--night-3); }
.lg.on { background: var(--night-3); border-color: var(--line-2); }
.lg-n { font: 700 12.5px/1.2 var(--ft); color: var(--cream); }
.lg-p { font: 500 12px/1.3 var(--fd); color: var(--brass-hi); letter-spacing: -.01em; }
.lg-p small { display: block; font: 400 11.5px/1.3 var(--ft); color: var(--cream-3); letter-spacing: 0; }
.lg-c { position: absolute; top: 0; left: 20px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--brass); color: var(--brass-ink); font: 700 10px/18px var(--fd); text-align: center; }
.house-note { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: var(--cream-3); max-width: 150ch; }
.house-note .docs a { color: var(--cream-2); text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.house-note .docs a:hover { color: var(--brass-hi); }

/* ---------- my booking ---------- */
.reserva { background: var(--night-2); border-left: 1px solid var(--line); overflow-y: auto; padding: 26px 26px 30px; display: flex; flex-direction: column; gap: 0; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; color: var(--cream-2); }
.r-head h2 { margin: 0; font: 700 30px/1.05 var(--fd); letter-spacing: -.035em; color: var(--cream); }
.r-sub { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--cream-2); }
.r-count { margin: 14px 0 0; display: inline-block; font: 600 11px/1 var(--fd); letter-spacing: .12em; text-transform: uppercase; color: var(--brass-hi); }
.r-count.bump { animation: bump .5s var(--ease); }
@keyframes bump { 40% { transform: scale(1.12); } }
.r-list { margin-top: 14px; border-top: 1px solid var(--line); }
.r-empty { padding: 18px 0 8px; }
.r-empty svg { width: 120px; height: 40px; display: block; margin-bottom: 8px; }
.r-empty p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--cream-3); }
.r-line { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); align-items: start; }
.r-mid { min-width: 0; display: grid; gap: 3px; }
.r-n { justify-self: start; background: none; border: 0; padding: 0; font: 700 15px/1.25 var(--ft); color: var(--cream); text-align: left; cursor: pointer; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; transition: text-decoration-color .2s var(--ease-q); }
.r-n:hover { text-decoration-color: var(--brass); }
.r-d { font-size: 12.5px; color: var(--cream-3); }
.r-lots { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.r-lot { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line-2); background: transparent; border-radius: 4px; padding: 2px 6px; font: 500 11px/1.35 var(--ft); color: var(--cream-2); cursor: pointer; }
.r-lot span { color: var(--cream-3); font-size: 13px; line-height: 1; }
.r-lot:hover { border-color: var(--brass); color: var(--cream); }
.r-r { display: grid; justify-items: end; gap: 6px; }
.r-amt { font: 600 14px/1.2 var(--fd); color: var(--cream); white-space: nowrap; letter-spacing: -.01em; }
.r-pm { display: flex; gap: 3px; }
.r-pm button { width: 26px; height: 26px; border-radius: 5px; border: 1px solid var(--line-2); background: transparent; color: var(--cream); font: 500 15px/1 var(--ft); cursor: pointer; }
.r-pm button:hover { border-color: var(--brass); color: var(--brass-hi); }
.r-total { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 12px; padding: 14px 0 4px; }
.t-k { font: 600 10.5px/1.3 var(--ft); letter-spacing: .12em; text-transform: uppercase; color: var(--cream-3); }
.t-v { font: 700 26px/1.1 var(--fd); color: var(--brass-hi); letter-spacing: -.03em; white-space: nowrap; }
.t-x { grid-column: 1 / -1; justify-self: end; font-style: normal; font-size: 11.5px; letter-spacing: .04em; color: var(--brass); }

.r-form { margin-top: 18px; padding-top: 18px; border-top: 1px dashed var(--line-2); display: grid; gap: 10px; color: var(--cream-2); }
.r-form-k { margin: 0; font: 600 11px/1.3 var(--fd); letter-spacing: .14em; text-transform: uppercase; color: var(--cream); }
.r-form label { display: grid; gap: 4px; min-width: 0; }
.r-form label > span { font: 600 10.5px/1.3 var(--ft); letter-spacing: .1em; text-transform: uppercase; color: var(--cream-3); }
.r-form input, .r-form textarea { width: 100%; min-width: 0; background: var(--night); border: 1px solid var(--line); border-radius: 6px; padding: 9px 11px; color: var(--cream); font: 400 14.5px/1.4 var(--ft); transition: border-color .2s var(--ease-q), box-shadow .2s var(--ease-q); }
.r-form textarea { resize: vertical; min-height: 64px; }
.r-form input::placeholder, .r-form textarea::placeholder { color: #8C7F87; }
.r-form input:focus, .r-form textarea:focus { outline: none; border-color: var(--brass); box-shadow: 0 0 0 3px rgba(217, 168, 74, .18); }
.r-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.r-err { margin: 0; font-size: 13px; color: #F0A0AE; }
.r-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 4px; }
.send { background: var(--brass); color: var(--brass-ink); border: 0; border-radius: 6px; padding: 13px 16px; font: 600 12.5px/1.2 var(--fd); letter-spacing: .01em; cursor: pointer; box-shadow: 0 1px 0 var(--brass-hi) inset, 0 10px 24px -12px rgba(217, 168, 74, .6); transition: background .2s var(--ease-q), transform .2s var(--ease-q); }
.send:hover { background: var(--brass-hi); }
.send:active { transform: translateY(1px); }
.call { font-size: 13.5px; color: var(--cream); text-decoration-color: var(--brass); text-underline-offset: 3px; white-space: nowrap; }
.r-sent { margin: 0; font-size: 13px; line-height: 1.5; color: var(--cream); background: #2A2216; border: 1px solid #6B5326; border-radius: 6px; padding: 10px 12px; }

/* brass token flying from a seat to the booking */
.token { position: fixed; left: 0; top: 0; width: 14px; height: 14px; border-radius: 50%; z-index: 60; pointer-events: none; background: radial-gradient(circle at 35% 35%, var(--brass-hi), var(--brass) 55%, var(--brass-lo)); box-shadow: 0 0 14px rgba(242, 207, 122, .7); }

.dock { display: none; }

/* ---------- static review mode ---------- */
html.static *, html.static *::before, html.static *::after { transition: none !important; animation: none !important; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* ---------- narrower screens: hall above, booking below ---------- */
@media (max-width: 1240px) {
  .house { grid-template-columns: minmax(0, 1fr) 360px; }
  .legend { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cartouche h1 { font-size: 28px; }
}
@media (max-width: 1099px) {
  .house { display: block; height: auto; min-height: 0; }
  .hall { height: auto; display: block; }
  .stagebox { height: auto; }
  .viewport { position: relative; inset: auto; height: min(70vh, 620px); min-height: 400px; }
  .canvas { margin: auto; }
  .cartouche { position: static; width: auto; padding: 4px 28px 14px; pointer-events: auto; }
  .hall.zoomed .cartouche { opacity: 1; transform: none; }
  .cartouche h1 { font-size: 34px; }
  .c-p { max-width: 60ch; }
  .reserva { border-left: 0; border-top: 1px solid var(--line); overflow: visible; padding: 28px; }
  .reserva > * { max-width: 640px; }
  .dock { position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 50; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 2px 12px; padding: 10px 14px; border-radius: 8px; text-decoration: none;
    background: var(--brass); color: var(--brass-ink); box-shadow: 0 16px 30px -12px rgba(0,0,0,.8); }
  .dock span { font: 600 11px/1.2 var(--fd); letter-spacing: .1em; text-transform: uppercase; }
  .dock b { font: 700 13px/1.2 var(--fd); white-space: nowrap; }
  .dock em { grid-column: 1 / -1; font-style: normal; font-size: 11px; }
  .dock[hidden] { display: none !important; }
}
@media (max-width: 640px) {
  .marquee { flex-wrap: wrap; gap: 10px 14px; padding: 14px 16px 8px; }
  .marquee-sub { order: 3; width: 100%; font-size: 10px; }
  .brand img { height: 22px; }
  .prog-btn { padding: 7px 10px; font-size: 11px; }
  .cartouche { padding: 6px 16px 12px; }
  .cartouche h1 { font-size: 30px; }
  .viewport { height: 460px; min-height: 0; }
  .zoom { right: 10px; bottom: 10px; }
  .zoom .z-fit { display: none; }
  .ficha { left: 8px; right: 8px; bottom: 8px; width: auto; max-width: none; max-height: calc(100% - 16px); padding: 18px 16px 16px; }
  .f-dl div { grid-template-columns: 1fr; gap: 2px; }
  .ficha h2 { font-size: 22px; }
  .keyline { padding: 10px 16px 14px; }
  .legend { grid-template-columns: 1fr 1fr; }
  .lg-p { white-space: normal; }
  .reserva { padding: 24px 16px 96px; }
  .r-two { grid-template-columns: 1fr; }
  .tip { min-width: 0; max-width: 220px; }
}

/* == legal == cookie banner + seller block (generated by sites/_legal/gen.py; the banner look comes from _legal/cookie-styles.css) */
.ck { position: fixed; left: 16px; bottom: 16px; z-index: 9999; max-width: 400px; font-family: inherit; font-size: 14px; line-height: 1.5; letter-spacing: 0; text-transform: none; text-align: left; }
.ck, .ck * { box-sizing: border-box; } .ck .ck-k { display: block; } .ck .ck-t, .ck .ck-p { margin: 0; } .ck .b { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
.ck button, .ck a.more { cursor: pointer; text-decoration: none; line-height: 1.2; margin: 0; }
/* banner: nexlivo */
.ck { left: 24px; bottom: 18px; width: 392px; max-width: calc(100vw - 32px); padding: 16px 40px 16px 40px; border-radius: 10px; color: #2A1C08; font-family: 'Karla', 'Segoe UI', sans-serif;
  background: repeating-linear-gradient(90deg, rgba(255, 244, 214, .07) 0 1px, rgba(0, 0, 0, 0) 1px 3px), linear-gradient(160deg, #EBC77F 0%, #D5A64C 38%, #C1913A 68%, #DDB566 100%);
  border: 1px solid #8A6424; box-shadow: inset 0 1px 0 rgba(255, 242, 205, .7), inset 0 -2px 0 rgba(96, 64, 12, .35), 0 2px 3px rgba(0, 0, 0, .45), 0 22px 44px -16px rgba(0, 0, 0, .85); }
.ck::before, .ck::after { content: ''; position: absolute; top: 50%; width: 13px; height: 13px; margin-top: -6.5px; border-radius: 50%;
  background: linear-gradient(35deg, rgba(0, 0, 0, 0) 43%, #6B4A14 43% 57%, rgba(0, 0, 0, 0) 57%), radial-gradient(circle at 35% 35%, #F6DDA4, #B4863A 62%, #7A5518 100%);
  box-shadow: 0 1px 0 rgba(255, 240, 200, .6), inset 0 0 0 1px rgba(90, 60, 10, .45); }
.ck::before { left: 14px; } .ck::after { right: 14px; transform: rotate(70deg); }
.ck .ck-k { margin: 0 0 6px; font: 700 10.5px/1.2 'Unbounded', 'Arial Black', sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #3A270A; text-shadow: 0 1px 0 rgba(255, 236, 190, .55); }
.ck .ck-t b { display: block; font: 600 17px/1.2 'Unbounded', 'Arial Black', sans-serif; letter-spacing: -.02em; color: #24170A; text-shadow: 0 1px 0 rgba(255, 236, 190, .5); margin-bottom: 6px; }
.ck .ck-p { font-size: 13px; line-height: 1.5; color: #33240C; }
.ck .b { gap: 8px 12px; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(90, 60, 10, .35); box-shadow: 0 1px 0 rgba(255, 238, 196, .4) inset; }
.ck button { border-radius: 5px; padding: 9px 14px; font: 600 12px/1 'Unbounded', 'Arial Black', sans-serif; letter-spacing: .02em; }
.ck button.ok { background: #24170A; color: #F2CF7A; border: 1px solid #24170A; }
.ck button.ok:hover { background: #3A270A; }
.ck button.no { background: transparent; color: #24170A; border: 1.5px solid #24170A; }
.ck button.no:hover { background: rgba(36, 23, 10, .1); }
.ck a.more { color: #24170A; font: 700 12.5px/1 'Karla', 'Segoe UI', sans-serif; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.ck button:focus-visible, .ck a.more:focus-visible { outline: 2px solid #24170A; outline-offset: 2px; }
@media (max-width: 600px) { .ck { padding: 14px 34px; } .ck::before { left: 11px; } .ck::after { right: 11px; } }
footer.seller { background: #110E15; color: #CDBFAF; border-top: 1px solid #3A3142; font-family: 'Karla', 'Segoe UI', sans-serif; padding-top: 26px; padding-bottom: 30px; }
footer.seller b { color: #D9A84A; opacity: 1; font: 600 10px/1.3 'Unbounded', 'Arial Black', sans-serif; letter-spacing: .16em; }
footer.seller strong { color: #F1E6D3; }
footer.seller a { color: #F1E6D3; text-decoration-color: #D9A84A; text-underline-offset: 3px; }

@media (max-width: 600px) { .ck { left: 10px; right: 10px; bottom: var(--ck-bottom, 10px); width: auto; max-width: none; transform: none; } }
.seller { font-size: 12.5px; line-height: 1.6; color: inherit; padding: 22px 24px 26px; border-top: 1px solid rgba(128,128,128,.35); letter-spacing: 0; text-transform: none; font-family: inherit; }
.seller-in { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 28px; }
.seller b { display: block; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; opacity: .7; margin-bottom: 4px; font-weight: 700; }
.seller a { color: inherit; } .seller address { font-style: normal; } .seller strong { font-weight: 700; }
.seller.panel { display: none; position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 9998; background: #fff; color: #111; border-radius: 14px; box-shadow: 0 30px 60px -20px rgba(0,0,0,.5); max-width: 940px; margin: 0 auto; border-top: 0; padding: 24px 26px 22px; }
.seller.panel:target { display: block; }
.seller .x { position: absolute; top: 6px; right: 12px; text-decoration: none; font-size: 22px; line-height: 1; padding: 6px 8px; }
.ck-page .st { padding: 10px 14px; border: 1px solid rgba(128,128,128,.4); border-radius: 8px; margin: 10px 0 14px; font-weight: 700; } .ck-page .b { display: flex; gap: 8px; flex-wrap: wrap; } .ck-page button { font: inherit; font-weight: 700; padding: 9px 16px; border-radius: 999px; border: 1px solid currentColor; background: transparent; color: inherit; cursor: pointer; }
@media (max-width: 760px) { table.lgl-t, table.lgl-t tbody, table.lgl-t tr, table.lgl-t td { display: block; width: auto; } table.lgl-t thead { display: none; } table.lgl-t tr { padding: 10px 0; border-bottom: 1px solid rgba(128,128,128,.35); } table.lgl-t td { border: 0 !important; padding: 2px 0 !important; overflow-wrap: anywhere; } table.lgl-t td::before { content: attr(data-l) ": "; font-weight: 700; } }
table.lgl-t code { overflow-wrap: anywhere; }
.lead-note.lead-note { font-size: 12px; line-height: 1.5; margin: 0; letter-spacing: 0; text-transform: none; font-weight: 400; font-style: normal; text-align: left; max-width: 62ch; } .lead-note.lead-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 700px) { .seller-in { grid-template-columns: 1fr; } .seller.panel { left: 8px; right: 8px; bottom: 8px; max-height: 80dvh; overflow: auto; } }