/* VELOCE · reserva de chasis — cincuenta números, uno es tuyo */
.resvHead{text-align:center;max-width:780px;margin:0 auto}
.resvHead .lead{margin:20px auto 0}
.resvGrid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,4vw,56px);align-items:start;margin-top:clamp(40px,6vh,64px)}
/* sin esto la tira de chasis del teléfono ensanchaba la columna y la
   tarjeta de resumen se salía de la pantalla */
.resvGrid>*{min-width:0}
.chassisWrap{border:1px solid var(--line);border-radius:18px;padding:clamp(18px,2.4vw,30px);background:linear-gradient(170deg,rgba(244,240,231,.035),rgba(244,240,231,.01))}
.chassisTop{display:flex;justify-content:space-between;gap:16px;margin-bottom:18px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--faint)}
.chassisTop b{color:var(--sig);font-weight:500}
.chassis{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}
.ch{appearance:none;aspect-ratio:1;min-height:40px;padding:0;border:1px solid var(--line);border-radius:10px;background:rgba(244,240,231,.02);color:var(--bone);font:500 12px/1 "JetBrains Mono",monospace;cursor:pointer;transition:border-color .25s ease,background .25s ease,transform .25s ease,color .25s ease,box-shadow .25s ease}
.ch:hover:not(:disabled){border-color:var(--sig);transform:translateY(-2px)}
.ch:disabled{cursor:not-allowed;color:rgba(244,240,231,.24);text-decoration:line-through;background:repeating-linear-gradient(135deg,transparent 0 5px,rgba(244,240,231,.045) 5px 6px)}
.ch[aria-pressed="true"]{background:linear-gradient(120deg,var(--sig2),var(--sig));border-color:transparent;color:#241503;box-shadow:0 10px 30px color-mix(in srgb,var(--sig) 42%,transparent)}
.chassisLegend{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px;font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--faint)}
.chassisLegend i{display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:3px;border:1px solid var(--line);vertical-align:-1px}
.chassisLegend .l-off{background:rgba(244,240,231,.1)}
.chassisLegend .l-on{background:var(--sig);border-color:transparent}

.resvCard{position:sticky;top:96px;padding:clamp(26px,3vw,38px) clamp(22px,2.6vw,32px);border-radius:22px;border:1px solid color-mix(in srgb,var(--sig) 34%,transparent);background:linear-gradient(170deg,rgba(244,240,231,.06),rgba(244,240,231,.015));box-shadow:0 44px 120px rgba(0,0,0,.55)}
.resvNo{font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:3px;text-transform:uppercase;color:var(--sig)}
.resvBig{margin:10px 0 4px;font-weight:700;font-size:clamp(56px,6vw,88px);line-height:1;letter-spacing:-3px;font-variant-numeric:tabular-nums}
.resvBig small{font-size:.32em;letter-spacing:0;color:var(--faint)}
.resvRows{margin:22px 0 26px;border-top:1px solid var(--line)}
.resvRow{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14px}
.resvRow span{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--faint)}
.resvRow b{font-weight:600;text-align:right}
.resvRow b em{font-style:normal}
.resvRow b i{display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:50%;background:var(--sig);box-shadow:0 0 10px var(--sig);transition:background .6s ease,box-shadow .6s ease}
.resvCard .pill{width:100%;justify-content:center;min-height:54px;font-size:15px}
.resvFine{margin:16px 0 0;font-family:"JetBrains Mono",monospace;font-size:9.5px;line-height:1.7;letter-spacing:1.4px;text-transform:uppercase;color:var(--faint)}

.own{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0 24px;margin:clamp(64px,10vh,110px) 0 0;padding:0;border-top:1px solid var(--line)}
.own li{position:relative;padding:28px 0 0}
.own li::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--sig);box-shadow:0 0 12px var(--sig)}
.own small{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--sig)}
.own b{display:block;margin:10px 0 8px;font-size:19px;font-weight:700;letter-spacing:-.3px}
.own p{margin:0;max-width:30ch;color:var(--dim);font-size:14px;line-height:1.7}

@media (max-width:900px){
  .resvGrid{grid-template-columns:1fr}
  .resvCard{position:static}
  .own{grid-template-columns:1fr 1fr;gap:0 20px}
  .own li{padding-bottom:28px}
}
/* teléfono: la reserva cabe en una pantalla y media — los chasis se
   deslizan en una tira de dos filas y la línea de propiedad es un carril */
@media (max-width:620px){
  .resvGrid{margin-top:28px;gap:14px}
  .chassisWrap{padding:14px 0 14px 14px;border-radius:14px}
  .chassisTop{margin-bottom:12px;padding-right:14px}
  .chassis{grid-template-columns:none;grid-template-rows:repeat(2,44px);grid-auto-flow:column;grid-auto-columns:44px;gap:6px;overflow-x:auto;padding-right:14px;scroll-snap-type:x proximity;scrollbar-width:none}
  .chassis::-webkit-scrollbar{display:none}
  .ch{aspect-ratio:auto;height:44px;min-height:0;scroll-snap-align:start}
  .chassisLegend,.resvFine{display:none}
  .resvCard{padding:20px 18px;border-radius:16px}
  .resvBig{font-size:52px}
  .resvRows{margin:14px 0 18px}
  .resvRow{padding:10px 0;font-size:13px}
  .own{display:flex;gap:12px;margin:36px -24px 0;padding:0 24px;border-top:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .own::-webkit-scrollbar{display:none}
  .own li{flex:0 0 78%;padding:20px 18px;border:1px solid var(--line);border-radius:14px;scroll-snap-align:start}
  .own li::before{top:24px;left:auto;right:18px}
}
