/* booking.css · /book/ (WEB-069 · 2026-09-10 · v2 tras /supersupervisar) · SOLO la página de reserva · tokens de la home. */
/* hero v5: fondo claro, copy + foto real enmarcada a la izquierda, tarjeta blanca de arranque a la derecha (referencias de Randy adaptadas a Soto) */
.bk-hero{position:relative;background:#f3f6fb;background-image:radial-gradient(900px 420px at 18% 0%,rgba(20,55,245,.10),transparent 60%),radial-gradient(700px 380px at 100% 100%,rgba(20,55,245,.08),transparent 60%);color:#07111b;overflow:hidden}
.bk-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;grid-template-rows:auto 1fr;gap:20px clamp(24px,4vw,56px);align-items:start;padding:clamp(30px,4vw,48px) 0 clamp(30px,4vw,44px)}
.bk-hero-copy{grid-column:1;grid-row:1}
.bk-hero-photo{grid-column:1;grid-row:2}
.bk-hero-side{grid-column:2;grid-row:1/3;align-self:start;display:grid;gap:16px;align-content:start}
.bk-hero-review{margin:0;padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.72);border:1px solid rgba(7,17,27,.06);display:grid;gap:6px}
.bk-hero-review .stars{color:#f5b301;letter-spacing:2px;font-size:14px}
.bk-hero-review q{quotes:"“" "”";font-size:14.5px;line-height:1.5;color:#1f2a3a;font-weight:600}
.bk-hero-review cite{font-style:normal;font-size:12.5px;font-weight:700;color:#64748b}
.bk-hero-copy{display:grid;gap:0;align-content:start}
.bk-kick{display:inline-flex;align-items:center;gap:10px;color:#1437f5;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.bk-kick i{display:inline-block;width:26px;height:2px;background:#1437f5}
.bk-hero h1{margin:10px 0 10px;font-size:clamp(40px,4.4vw,58px);line-height:.96;letter-spacing:-.03em;font-weight:900;color:#07111b}
.bk-hero h1 .l2{font-style:italic;color:#1437f5}
.bk-hero-copy>p{margin:0;max-width:560px;color:#1f2a3a;font-size:clamp(16px,1.3vw,18px);line-height:1.5;font-weight:600}
.bk-hero-proof{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}
.bk-hero-proof span{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:#07111b}
.bk-hero-proof .ic{color:#1437f5;flex:0 0 auto}
.bk-hero-proof .stars{color:#f5b301;letter-spacing:1px}
.bk-hero-photo{position:relative;margin:0;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(7,17,27,.18),0 0 0 1px rgba(7,17,27,.06);aspect-ratio:2/1;background:#dfe6f0}
.bk-hero-photo .bk-hero-img{width:100%;height:100%;object-fit:cover;object-position:50% 64%;display:block}
.bk-hero-photo figcaption{position:absolute;left:14px;bottom:12px;padding:6px 10px;border-radius:999px;background:rgba(7,17,27,.62);color:#fff;font-size:11.5px;font-weight:800;letter-spacing:.04em;backdrop-filter:blur(6px)}
/* tarjeta de arranque */
.bk-quick{background:#fff;border-radius:18px;padding:24px 24px 18px;box-shadow:0 30px 70px rgba(7,17,27,.16),0 0 0 1px rgba(7,17,27,.05);display:grid;gap:8px}
.bk-quick [hidden]{display:none!important}
.bk-quick-kick{display:inline-flex;align-items:center;gap:10px;color:#1437f5;font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.bk-quick-kick i{display:inline-block;width:22px;height:2px;background:#1437f5}
.bk-quick h2{margin:2px 0 4px;font-size:clamp(26px,2.2vw,32px);letter-spacing:-.025em;color:#07111b;line-height:1.05}
.bk-quick-steps{list-style:none;margin:0 0 6px;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.bk-quick-steps li{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:#94a3b8;white-space:nowrap}
.bk-quick-steps li b{width:20px;height:20px;border-radius:50%;background:#eef1f6;color:#64748b;display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:900}
.bk-quick-steps li.on{color:#07111b}.bk-quick-steps li.on b{background:#1437f5;color:#fff}
.bk-quick label{font-size:13px;font-weight:800;color:#07111b;margin-top:4px}
.bk-quick-sel{position:relative}
.bk-quick-sel select{width:100%;height:50px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:0 42px 0 14px;font:inherit;font-size:15px;color:#07111b;appearance:none;-webkit-appearance:none;cursor:pointer}
.bk-quick-sel select:invalid{color:#64748b}
.bk-quick-sel select:focus{outline:0;border-color:#1437f5;box-shadow:0 0 0 4px rgba(20,55,245,.14)}
.bk-quick-sel .ic{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:#64748b;pointer-events:none}
.bk-quick-price{display:flex;align-items:baseline;gap:8px;padding:9px 12px;border-radius:10px;background:#f4f6ff;border:1px solid #dbe3ff;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#64748b;white-space:nowrap}
.bk-quick-price b{font-size:20px;color:#07111b;letter-spacing:-.02em;text-transform:none}
.bk-quick-price small{margin-left:auto;font-size:12px;font-weight:700;letter-spacing:0;text-transform:none;color:#475569;white-space:normal;text-align:right}
.bk-quick-btn{width:100%;margin-top:6px;min-height:54px;font-size:14.5px}
.bk-quick-note{margin:8px 0 0;display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:#475569;font-weight:500}
.bk-quick-note .ic{color:#1437f5;flex:0 0 auto;margin-top:2px}
.bk-quick-note a{color:#1437f5;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.bk-quick-note a:hover{color:#0c26b8}
.bk-quick-foot{margin-top:10px;padding-top:12px;border-top:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center;gap:14px;font-size:13px;font-weight:700;color:#07111b}
.bk-quick-foot span{display:inline-flex;align-items:center;gap:7px}
.bk-quick-foot .ic{color:#1437f5}
.bk-quick-foot i{width:1px;height:16px;background:#cbd5e1}

/* barra de progreso pegajosa bajo la cabecera */
.bk-progress{position:sticky;top:76px;z-index:40;background:rgba(4,11,19,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.1)}
.bk-progress ol{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.bk-progress li{display:flex;align-items:center;justify-content:center;gap:9px;padding:11px 6px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#9fb0c3;border-bottom:3px solid transparent;cursor:pointer;transition:color .3s ease,border-color .3s ease}
.bk-progress li b{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#e7eef7;transition:all .3s ease}
.bk-progress li b .ic{width:11px;height:11px;display:none}
.bk-progress li.on{color:#fff;border-bottom-color:#1437f5}
.bk-progress li.on b{background:#1437f5;border-color:#1437f5}
.bk-progress li.done{color:#dbe4ff}
.bk-progress li.done b{background:transparent;border-color:rgba(255,255,255,.35);color:#7da4ff}
.bk-progress li.done b .ic{display:block}.bk-progress li.done b span{display:none}

/* maquetación */
.bk-layout{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:clamp(22px,3vw,44px);align-items:start;padding:clamp(22px,3.4vw,40px) 0 56px}
.bk-steps{display:grid;gap:14px}
.bk-step{position:relative;background:#0f1b2b;border:1px solid rgba(255,255,255,.1);border-radius:18px;transition:background .3s ease,box-shadow .3s ease,border-color .3s ease}
.bk-step-h{display:flex;align-items:center;gap:12px;width:100%;padding:14px clamp(16px,2.2vw,24px);border:0;background:none;text-align:left;font:inherit;color:#fff;cursor:default;border-radius:18px}
.bk-step-h .bk-n{flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:900;font-size:13px;display:inline-flex;align-items:center;justify-content:center;transition:background .3s ease}
.bk-step-h .bk-n .ic{width:15px;height:15px;display:none}
.bk-step-t{display:grid;gap:2px;min-width:0}
.bk-step-h h2{margin:0;font-size:16px;letter-spacing:-.01em;color:#fff;line-height:1.2;font-weight:800}
.bk-step-done{display:none;font-size:13px;color:#9fb0c3;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk-opt{font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#64748b;padding:5px 9px;border-radius:999px;background:#f1f5f9;flex:0 0 auto}
.bk-step:not(.on) .bk-opt{background:rgba(255,255,255,.08);color:#9fb0c3}
.bk-change{display:none;margin-left:auto;flex:0 0 auto;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#7da4ff;padding:6px 0}
.bk-step-body{padding:0 clamp(16px,2.2vw,24px) clamp(18px,2.2vw,24px)}
.bk-step-sub{margin:0 0 16px 46px;color:#64748b;font-size:14px;line-height:1.5}
/* estados: activo · hecho (colapsado) · pendiente (atenuado) */
.bk-step.on{background:#fff;border-color:rgba(20,55,245,.4);box-shadow:0 18px 44px rgba(20,55,245,.16)}
.bk-step.on .bk-step-h{color:#07111b;padding:18px clamp(16px,2.2vw,24px) 4px}
.bk-step.on .bk-step-h h2{color:#07111b;font-size:clamp(20px,2.1vw,25px)}
.bk-step.on .bk-n{background:#1437f5;border-color:#1437f5}
.bk-step.done .bk-n{background:#fff;border-color:#fff;color:#1437f5}.bk-step.done .bk-n .ic{display:block}.bk-step.done .bk-n span{display:none}
.bk-step.done:not(.on) .bk-step-body,.bk-step.todo .bk-step-body{display:none}
.bk-step.done:not(.on) .bk-step-h{cursor:pointer}
.bk-step.done:not(.on) .bk-step-done{display:block}
.bk-step.done:not(.on) .bk-change{display:inline-block}
.bk-step.done:not(.on) .bk-opt{display:none}
.bk-step.todo .bk-step-h{color:#7c8797}.bk-step.todo .bk-n{color:#9fb0c3}
.bk-step h3,.bk-svc-body h3,.bk-addon b,.bk-size strong,.bk-win strong,.bk-day strong{color:#07111b}
.bk-row-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.bk-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 20px;border-radius:12px;border:0;background:linear-gradient(135deg,#244dff,#1437f5);color:#fff;font:inherit;font-weight:900;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;text-decoration:none;box-shadow:0 12px 26px rgba(20,55,245,.3);transition:transform .25s ease}
.bk-btn:hover{transform:translateY(-2px)}
.bk-btn--ghost{background:#fff;color:#0a1420;border:1px solid #cbd5e1;box-shadow:none}

/* servicios */
.bk-svcs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.bk-svc{position:relative;text-align:left;border:2px solid #e2e8f0;border-radius:16px;background:#fff;padding:0;overflow:hidden;cursor:pointer;transition:border-color .2s ease,transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease;font:inherit;color:#07111b;display:block;width:100%}
.bk-svc:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(7,17,27,.12);border-color:#c7d2fe}
.bk-svc.on{border-color:#1437f5;box-shadow:0 0 0 4px rgba(20,55,245,.16),0 18px 36px rgba(20,55,245,.14)}
.bk-svc-media{position:relative;display:block;overflow:hidden}
.bk-svc img{display:block;width:100%;height:auto;aspect-ratio:16/7;object-fit:cover;transition:transform .8s ease}
.bk-svc:hover img{transform:scale(1.04)}
.bk-svc-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,17,27,0),rgba(7,17,27,.18) 100%)}
.bk-svc-from{margin-left:auto;display:inline-flex;align-items:baseline;gap:4px;color:#1437f5;font-weight:900;font-size:19px;letter-spacing:-.01em;white-space:nowrap}
.bk-svc-from small{font-size:11px;font-weight:700;color:#64748b;letter-spacing:.04em;text-transform:uppercase}
.bk-svc-body{padding:14px 16px 16px;display:grid;gap:6px}
.bk-svc-body h3{margin:0;font-size:19px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.bk-svc-body h3 em{font-style:normal;font-size:11px;font-weight:800;color:#64748b;letter-spacing:.06em;text-transform:uppercase}
.bk-svc-body>small{color:#475569;font-size:13px;line-height:1.45}
.bk-inc{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:4px}
.bk-inc li{display:flex;gap:7px;align-items:center;font-size:12.5px;color:#0a1420;font-weight:600}
.bk-inc .ic{width:13px;height:13px;color:#1437f5;flex:0 0 auto}
.bk-svc .bk-tag{position:absolute;left:12px;top:12px;z-index:1;padding:6px 10px;border-radius:999px;background:#f5c542;color:#07111b;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.bk-svc .bk-check{position:absolute;right:12px;top:12px;z-index:1;width:28px;height:28px;border-radius:50%;background:#1437f5;color:#fff;display:none;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(20,55,245,.4)}
.bk-svc.on .bk-check{display:inline-flex}
.bk-studio{margin-top:14px;padding:13px 16px;border-radius:12px;background:#f7f9fc;border:1px dashed #cbd5e1;display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13.5px;color:#0a1420}
.bk-studio a{color:#1437f5;font-weight:800;text-decoration:none;white-space:nowrap;margin-left:auto}

/* tamaños · franjas · extras */
.bk-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.bk-size,.bk-win{position:relative;border:2px solid #e2e8f0;border-radius:14px;background:#fff;padding:14px 10px 12px;cursor:pointer;font:inherit;color:#07111b;display:grid;gap:3px;text-align:center;transition:border-color .2s ease,transform .25s ease,box-shadow .25s ease}
.bk-size:hover,.bk-win:hover{transform:translateY(-2px);border-color:#c7d2fe}
.bk-size strong,.bk-win strong{font-size:15px}
.bk-size small,.bk-win small{color:#64748b;font-size:12px}
.bk-size-price{margin-top:4px;font-weight:900;color:#1437f5;font-size:22px;letter-spacing:-.02em}
.bk-size.on,.bk-win.on{border-color:#1437f5;box-shadow:0 0 0 4px rgba(20,55,245,.16)}
.bk-size.on::after,.bk-win.on::after,.bk-day.on::after{content:"";position:absolute;right:8px;top:8px;width:9px;height:9px;border-radius:50%;background:#1437f5;box-shadow:0 0 0 3px rgba(20,55,245,.2)}
.bk-addons{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bk-addon{position:relative;display:flex;gap:12px;align-items:center;border:2px solid #e2e8f0;border-radius:14px;padding:13px 15px;cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .25s ease;text-transform:none;letter-spacing:0;font-weight:400}
.bk-addon:hover{transform:translateY(-2px);border-color:#c7d2fe}
.bk-addon.on{border-color:#1437f5;background:#f4f6ff}
.bk-addon input{width:20px;height:20px;accent-color:#1437f5;flex:0 0 auto}
.bk-addon b{display:block;font-size:15px}
.bk-addon small{color:#64748b;font-size:12.5px}
.bk-addon .bk-addon-price{margin-left:auto;font-weight:900;color:#1437f5;white-space:nowrap;font-size:16px}

/* días */
.bk-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:10px}
.bk-day{position:relative;border:2px solid #e2e8f0;border-radius:14px;background:#fff;padding:12px 4px 10px;cursor:pointer;font:inherit;color:#07111b;display:grid;gap:1px;text-align:center;transition:border-color .2s ease,transform .25s ease}
.bk-day:hover{transform:translateY(-2px);border-color:#c7d2fe}
.bk-day[hidden]{display:none}
.bk-day small{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#64748b}
.bk-day strong{font-size:23px;line-height:1.1}
.bk-day span{font-size:11px;color:#64748b}
.bk-day i{position:absolute;top:-9px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10px;font-weight:900;padding:3px 8px;border-radius:999px;background:#f5c542;color:#07111b;white-space:nowrap;box-shadow:0 4px 10px rgba(0,0,0,.12)}
.bk-day.on{border-color:#1437f5;box-shadow:0 0 0 4px rgba(20,55,245,.16)}
.bk-day.on::after{right:6px;top:6px}
.bk-more{border:0;background:none;color:#1437f5;font:inherit;font-weight:800;font-size:13px;cursor:pointer;padding:4px 0;text-decoration:underline;text-underline-offset:3px}
.bk-lbl{margin:16px 0 8px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#0a1420}
.bk-wins{grid-template-columns:repeat(3,1fr)}
.bk-hours{margin:12px 0 0;color:#64748b;font-size:13px}
.bk-hours a{color:#1437f5;font-weight:800;text-decoration:none}

/* datos */
.bk-proof{display:flex;gap:14px;align-items:center;margin:0 0 16px;padding:13px 16px;border-radius:14px;background:#07111b;color:#fff}
.bk-proof .bk-proof-badge{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);font-size:13px;font-weight:800}
.bk-proof .bk-proof-badge b{font-size:15px}
.bk-proof q{quotes:"“" "”";font-size:13.5px;line-height:1.45;color:#dbe4ff}
.bk-proof q::before,.bk-proof q::after{color:#7da4ff}
.bk-proof cite{display:block;margin-top:3px;font-style:normal;font-size:12px;color:#9aa9b8;font-weight:700}
.bk-proof--light{background:#f3f5f9;color:#0a1420;border:1px solid #e2e8f0}
.bk-proof--light .bk-proof-badge{background:#fff;border-color:#e2e8f0;color:#0a1420}
.bk-proof--light q{color:#0a1420;font-size:14px}
.bk-proof--light q::before,.bk-proof--light q::after{color:#1437f5}
.bk-proof--light cite{color:#64748b;font-size:12.5px}
.bk-step form.quote{max-width:none;width:100%;margin:0;padding:0;background:transparent;box-shadow:none;border-radius:0;color:#0a1420}
.bk-step .form-grid-v3{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bk-step .form-grid-v3>div{display:grid;gap:6px}
.bk-step .form-grid-v3 .span2{grid-column:1/-1}
.bk-step .form-grid-v3 label{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#0a1420}
.bk-step .form-grid-v3 label .lbl-hint{font-size:12px;color:#475569}
.bk-step .form-grid-v3>div{gap:8px}
.bk-step .form-grid-v3{gap:16px 12px}
.bk-step .q-input{background:#fff;border:1px solid #cbd5e1;color:#07111b}
.bk-step .q-input:focus{border-color:#1437f5;box-shadow:0 0 0 4px rgba(20,55,245,.14);outline:0}
.bk-step .q-input.is-invalid{border-color:#c8102e;box-shadow:0 0 0 4px rgba(200,16,46,.12)}
.bk-step textarea.q-input{min-height:64px;resize:vertical;padding-top:12px;font:inherit;line-height:1.5}
.bk-consent{display:flex;gap:12px;align-items:flex-start;margin-top:16px;padding:14px 16px;border-radius:12px;background:#f7f9fc;border:1px solid #e2e8f0;font-size:13px;line-height:1.5;color:#0a1420;text-transform:none;letter-spacing:0;font-weight:400}
.bk-consent input{width:20px;height:20px;accent-color:#1437f5;flex:0 0 auto;margin-top:1px}
.bk-consent a{color:#1437f5}
.bk-consent--dep{margin-top:10px;background:#eef2ff;border-color:#c7d2fe}
.bk-consent--dep b{font-weight:900}
.bk-consent.is-invalid{border-color:#dc2626;background:#fef2f2}
.bk-consent.is-invalid input{outline:2px solid #dc2626;outline-offset:2px}
.bk-submit{margin-top:16px;display:grid;gap:10px}
.bk-submit .q-submit{height:60px;font-size:15px;margin-top:0;border-radius:12px;box-shadow:0 18px 40px rgba(20,55,245,.32)}
.bk-submit-sub{margin:0;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;color:#475569;font-size:13.5px}
.bk-submit-sub>span{display:inline-flex;align-items:center;gap:6px}
.bk-submit-sub .ic{width:13px;height:13px;color:#1437f5;flex:0 0 auto}
.bk-status{margin-top:12px;padding:12px 14px;border-radius:10px;font-size:14px;font-weight:700}
.bk-status--error{background:#fdf2f3;color:#c8102e}
.bk-status--sending{background:#f7f9fc;color:#0a1420}
.bk-status--sent{background:#ecfdf3;color:#1a7f37}
.bk-submit .q-submit b{font-weight:900}
.bk-submit [hidden],.bk-summary [hidden]{display:none!important}   /* #138: el display de home.css vencía al atributo hidden */
.bk-alt{margin:4px 0 0;text-align:center;font-size:13px;color:#475569}
.bk-alt-btn{border:0;background:none;color:#1437f5;font:inherit;font-size:13px;font-weight:800;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:6px 4px}
.bk-sum-dep{margin-top:10px;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);display:grid;gap:6px;font-size:12.5px;color:#dbe4ff}
.bk-sum-dep>span{display:flex;justify-content:space-between;gap:10px}
.bk-sum-dep b{color:#fff;font-size:14px}
/* confirmación en la página */
.bk-success{padding:22px 20px;border-radius:16px;background:#ecfdf3;border:1px solid #bbf7d0;color:#0a1420}
.bk-success-ic .ic{width:44px;height:44px;color:#16a34a}
.bk-success h3{margin:8px 0 6px;font-size:24px;letter-spacing:-.015em}
.bk-success p{margin:0 0 14px;font-size:14.5px;line-height:1.55;color:#1f2937}
.bk-success-dl{margin:0 0 16px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bk-success-dl div{background:#fff;border-radius:10px;padding:10px 12px}
.bk-success-dl dt{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#64748b}
.bk-success-dl dd{margin:2px 0 0;font-weight:800;font-size:14.5px}

/* resumen pegajoso */
.bk-summary{position:sticky;top:132px;background:#07111b;color:#fff;border-radius:18px;padding:22px 22px 20px;box-shadow:0 26px 60px rgba(0,44,116,.4);overflow:hidden}
.bk-summary::before{content:"";position:absolute;inset:auto -40% -60% auto;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(20,55,245,.45),transparent 65%);pointer-events:none}
.bk-summary>*{position:relative}
.bk-summary .kicker{color:#7da4ff}
.bk-summary h3{margin:6px 0 12px;font-size:23px;letter-spacing:-.015em;color:#fff}
.bk-sum-row{display:grid;grid-template-columns:82px 1fr;gap:10px;padding:8px 0;border-top:1px solid rgba(255,255,255,.1);font-size:14px}
.bk-sum-row>span:first-child{color:#9aa9b8;font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.bk-sum-row .miss{color:#7da4ff;font-weight:700}
.bk-sum-total{display:flex;align-items:baseline;justify-content:space-between;margin-top:10px;padding-top:14px;border-top:1px solid rgba(255,255,255,.18)}
.bk-sum-total strong{font-size:40px;letter-spacing:-.035em;color:#fff;line-height:1;transition:transform .25s ease}
.bk-sum-total strong.from{font-size:26px;letter-spacing:-.02em}
.bk-sum-total strong.from small{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9aa9b8;margin-bottom:3px}
.bk-sum-total strong.pop{transform:scale(1.08)}
.bk-sum-total span{color:#9aa9b8;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.bk-sum-note{margin:6px 0 0;color:#dbe4ff;font-size:12.5px;line-height:1.5;min-height:1em}
.bk-sum-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:14px;height:52px;border-radius:12px;background:linear-gradient(135deg,#244dff,#1437f5);color:#fff;font-weight:900;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;box-shadow:0 14px 30px rgba(20,55,245,.35);transition:transform .25s ease}
.bk-sum-cta:hover{transform:translateY(-2px)}
.bk-sum-cta .ic{width:15px;height:15px}
.bk-sum-cta--link{background:transparent;border:0;color:#7da4ff;box-shadow:none;height:40px;margin-top:8px;text-transform:none;letter-spacing:0;font-size:14px;font-weight:800;text-decoration:underline;text-underline-offset:4px}
.bk-sum-cta--link:hover{transform:none;color:#fff}
.bk-sum-cta--link .ic{display:none}
.bk-sum-pay{margin-top:12px;padding:12px 14px;border-radius:10px;background:rgba(20,55,245,.16);border:1px solid rgba(125,164,255,.35);font-size:12.5px;line-height:1.5;color:#f3f4f6}
.bk-sum-pay b{color:#fff}
.bk-sum-google{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.12);font-size:12.5px;font-weight:700;color:#e7eef7}

.bk-next .pbg{opacity:.45}

/* barra móvil */
.bk-bar{display:none}
@media (max-width:1100px){.bk-layout{grid-template-columns:minmax(0,1fr) 320px}.bk-svcs{grid-template-columns:1fr}.bk-svc img{aspect-ratio:16/6}}
@media (max-width:959px){
  .bk-hero .wrap{grid-template-columns:minmax(0,1fr);align-items:start}   /* auditoría externa #5: con 1fr la pista crecía al min-content del formulario (a 320 px: 343 px, scroll horizontal en /book/) */
  .bk-trust{grid-template-columns:1fr 1fr}
  .bk-progress{top:64px}
  .bk-progress li span:last-child{display:none}
  .bk-progress ol{grid-template-columns:repeat(5,auto);justify-content:space-between;padding:0 6px}
  .bk-progress li.on span:last-child{display:inline;font-size:11px}
  .bk-progress li{padding:9px 6px;gap:6px}
  .bk-layout{grid-template-columns:1fr}
  .bk-summary{position:relative;top:auto}   /* relative, no static: el ::before absoluto se saldría del recorte y desborda 123 px */
  .bk-bar{display:grid;gap:6px;position:fixed;left:0;right:0;bottom:0;z-index:70;padding:6px 14px calc(8px + env(safe-area-inset-bottom));background:rgba(6,13,24,.96);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,.1);color:#fff}
  .bk-bar-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
  .bk-bar b{font-size:16px;letter-spacing:-.02em;line-height:1}
  .bk-bar small{color:#9aa9b8;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bk-bar a{width:100%;min-height:50px;font-size:14px}
  .m-bar{display:none!important}
  body{padding-bottom:104px}
  .bk-hero-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:none;gap:18px;padding:24px 0 22px}   /* minmax(0,…): la pista no crece con el min-content del hijo (auditoría externa #5) */
  .bk-hero-copy,.bk-hero-photo,.bk-hero-side{grid-column:1;grid-row:auto}
  .bk-hero-photo{order:3;aspect-ratio:16/10}
  .bk-hero-side{order:2;gap:14px}
  .bk-quick-foot{font-size:12.5px;gap:10px;flex-wrap:wrap;row-gap:6px}   /* auditoría externa #5 (320 px): el pie nowrap medía 307 px y empujaba el formulario; wrap solo actúa si no cabe */
  .bk-quick-foot span{white-space:nowrap}
  .bk-quick-steps li:not(.on) span{display:none}
  .bk-hero-photo .bk-hero-img{object-position:42% 64%}
  .bk-hero h1{font-size:37px;line-height:.96;margin:10px 0}
  .bk-hero h1 .l2{display:block}
  .bk-hero-copy>p{font-size:15px}
  .bk-quick{padding:20px 18px 16px}
  .bk-quick-price{white-space:normal;flex-wrap:wrap;row-gap:2px}   /* auditoría externa #5: a 390 px la fila «Fresh Start · Full Car Detailing $99 …» (nowrap) empujaba el hero de /offer/ hasta x=400 */
  .bk-bar.is-off{display:none}
  .bk-svcs{grid-template-columns:1fr 1fr}.bk-svc img{aspect-ratio:16/8}
}
@media (max-width:760px){.bk-trust{gap:8px 14px}.bk-trust li{font-size:12.5px}.bk-svcs{grid-template-columns:1fr}.bk-svc img{aspect-ratio:16/7}.bk-chips{grid-template-columns:1fr 1fr}.bk-wins{grid-template-columns:repeat(3,1fr)}.bk-addons{grid-template-columns:1fr}.bk-days{grid-template-columns:repeat(4,1fr)}.bk-step .form-grid-v3{grid-template-columns:1fr}.bk-step-sub{margin-left:0}.bk-proof{flex-direction:column;align-items:flex-start}.bk-change{padding:6px 9px;font-size:11px}.bk-success-dl{grid-template-columns:1fr}}
@media (max-width:480px){.bk-wins{grid-template-columns:1fr}.bk-days{grid-template-columns:repeat(4,1fr)}}
@media (max-width:380px){.bk-quick-foot i{display:none}}   /* con el pie en dos líneas el separador vertical quedaría suelto */
/* /book/ ≤374 px (auditoría externa #5 + /supervisar 2026-09-11): logo 74 + teléfono 145 + menú 44 + idioma 40 no cabían (320 px: faltaban 45; 360: 5).
   El teléfono sigue completo y a 12 px; se recorta aire, no contenido. Solo la cabecera de /book/ (la de /offer/ es .hdr--landing y ya cabía). */
@media (max-width:374px){
  .bk-page .hdr:not(.hdr--landing) .hdr-logo img{width:56px;height:auto}
  .bk-page .hdr:not(.hdr--landing) .hdr-right{gap:4px}
  .bk-page .hdr:not(.hdr--landing) .hdr-phone-m{padding-left:9px;padding-right:9px;gap:4px;letter-spacing:0}
  .bk-page .hdr:not(.hdr--landing) .lang-btn{min-width:34px;padding:0 6px}
}
.bk-svc-pkg{display:block;margin:-2px 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}
.bk-tip{margin:12px 0 4px}.bk-tip label{display:block;font-size:13px;font-weight:800;color:#07111b;margin-bottom:6px}.bk-tip .lbl-hint{font-weight:600;color:#64748b}.bk-tip select{height:46px;max-width:260px}
/* no-extras al lado de Continue en móvil (Randy 2026-09-10, captura) */
@media (max-width:640px){.bk-row-cta{display:flex!important;flex-wrap:nowrap;gap:10px}.bk-row-cta .bk-btn{flex:1 1 0;min-width:0;width:auto;padding-left:12px;padding-right:12px;white-space:nowrap;justify-content:center}}
/* Horas + 3 vans (P406 · 2026-09-15): cuadrícula de horas de inicio con van libre */
.bk-hourgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.bk-hourgrid .bk-win{padding:12px 6px 10px}
.bk-hours-empty{grid-column:1/-1;margin:4px 0;color:#64748b;font-size:14px}
.bk-avail-note{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#f1f5f9;color:#334155;font-size:13px;line-height:1.5}
@media (max-width:760px){.bk-hourgrid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:480px){.bk-hourgrid{grid-template-columns:repeat(3,1fr)}}

/* ════ WEB-095 · /book/: UN SOLO proceso de reserva, dentro de una tarjeta ancha (Randy 2026-09-16:
   «existen 2 procesos… todo debe realizarse en el form de booking» · «no se ve premium, no optimizado para conversiones»).
   Hero compacto (copy + reseña | foto) y la tarjeta montada debajo, con los 5 pasos y el resumen dentro.
   Solo aplica a body.bk-page--card (/book/); /offer/ conserva su maquetación. ════ */
.bk-page--card .bk-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,40%);grid-template-rows:auto;align-items:center;gap:16px clamp(24px,4vw,48px);padding:clamp(18px,2.2vw,26px) 0 clamp(56px,6vw,76px)}
.bk-page--card .bk-hero-copy{grid-column:1;grid-row:1}
.bk-page--card .bk-hero-photo{grid-column:2;grid-row:1;aspect-ratio:4/3}
.bk-page--card .bk-hero-side{display:none}
/* hero COMPACTO (Randy: «el hero puede ser más corto para acceder de inmediato al proceso, sin distracción») */
.bk-page--card .bk-hero h1{font-size:clamp(30px,3.2vw,44px);margin:8px 0 8px}
.bk-page--card .bk-hero-copy>p{font-size:clamp(15px,1.15vw,16.5px);max-width:460px}
.bk-page--card .bk-hero-proof{margin-top:10px;gap:6px 16px}
.bk-page--card .bk-hero-photo{aspect-ratio:16/10;max-height:288px}
/* la reseña vive ahora en el resumen, junto al precio */
.bk-card .bk-sum-review{margin:12px 0 0;padding:14px 15px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);display:grid;gap:5px}
.bk-card .bk-sum-review q{font-size:13px;line-height:1.45;color:#e7eef7;font-weight:600}
.bk-card .bk-sum-review cite{font-size:11.5px;color:#9aa9b8}
.bk-card .bk-sum-review .stars{font-size:13px}
/* la tarjeta */
.bk-cardwrap{position:relative;z-index:2;padding:0 0 clamp(42px,5vw,72px)}
.bk-cardwrap>.wrap{margin-top:clamp(-72px,-5vw,-44px)}
.bk-card{max-width:1040px;margin:0 auto;background:linear-gradient(180deg,#0a1523,#0c1a2a);border-radius:24px;padding:clamp(20px,2.4vw,32px);box-shadow:0 44px 110px rgba(0,18,56,.6),0 0 0 1px rgba(125,164,255,.2);display:grid;gap:clamp(14px,1.6vw,20px)}
.bk-card [hidden]{display:none!important}
.bk-card-head{display:grid;gap:6px}
.bk-card .bk-quick-kick{color:#7da4ff}
.bk-card .bk-quick-kick i{background:#7da4ff}
.bk-card>.bk-card-head>h2{margin:0 0 6px;font-size:clamp(26px,2.4vw,34px);letter-spacing:-.03em;color:#fff;line-height:1.05}
/* riel de progreso (sustituye a la barra pegajosa .bk-progress) */
.bk-rail{list-style:none;margin:0;padding:0 0 14px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;border-bottom:1px solid rgba(255,255,255,.12)}
.bk-rail li{display:flex;align-items:center;justify-content:center;gap:9px;font-size:11.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#7c8797;cursor:pointer;text-align:center;transition:color .25s ease}
.bk-rail li b{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#e7eef7;flex:0 0 auto;transition:all .25s ease}
.bk-rail li b .ic{width:12px;height:12px;display:none}
.bk-rail li.on{color:#fff}
.bk-rail li.on b{background:#1437f5;border-color:#1437f5;color:#fff}
.bk-rail li.done{color:#dbe4ff}
.bk-rail li.done b{background:#fff;border-color:#fff;color:#1437f5}
.bk-rail li.done b .ic{display:block}
.bk-rail li.done b span{display:none}
/* cuerpo: pasos + resumen, como el diseño original pero dentro de la tarjeta */
.bk-card-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:clamp(16px,2vw,26px);align-items:start}
.bk-card .bk-steps{display:grid;gap:12px}
/* WEB-096 · Randy: «la sección se ve muy larga… debería ir pasando por tarjetas» → SOLO el paso activo se ve;
   el riel de arriba, el botón Atrás y las filas del resumen (clicables) sustituyen a la pila de pasos colapsados. */
.bk-card .bk-step:not(.on){display:none}
.bk-card-nav{display:flex;justify-content:flex-start;min-height:0}
.bk-back{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:#dbe4ff;font:inherit;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.bk-back:hover{background:rgba(255,255,255,.1);border-color:rgba(125,164,255,.5);color:#fff}
.bk-back[hidden]{display:none!important}

.bk-card .bk-summary{position:sticky;top:96px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.12);box-shadow:none;border-radius:16px;padding:20px 20px 18px}
.bk-card .bk-summary::before{display:none}
.bk-card .bk-proof{display:none}   /* la reseña ya va en el hero */
.bk-card-foot{display:grid;gap:0;padding-top:4px;border-top:1px solid rgba(255,255,255,.1)}
.bk-card .bk-quick-note{margin-top:12px;color:#c7d2e0}
.bk-card .bk-quick-note .ic,.bk-card .bk-quick-note a{color:#7da4ff}
.bk-card .bk-quick-foot{border-top:0;color:#e7eef7;margin-top:6px}
.bk-card .bk-quick-foot .ic{color:#7da4ff}
.bk-card .bk-quick-foot i{background:rgba(255,255,255,.22)}
/* ── acabado premium (Randy: «premium, profesional, optimizado para conversiones») ── */
/* 1 · el hero se funde con el fondo oscuro: la tarjeta flota sobre la transición, sin costura dura */
.bk-page--card .bk-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(180deg,rgba(7,17,27,0),#07111b);pointer-events:none;z-index:1}
.bk-page--card .bk-hero .wrap{position:relative;z-index:2}
/* 2 · riel: la barra inferior marca el avance en vez de una línea plana */
.bk-rail{border-bottom:0;padding-bottom:0;gap:0}
.bk-rail li{padding:0 4px 12px;border-bottom:2px solid rgba(255,255,255,.1)}
.bk-rail li.on{border-bottom-color:#1437f5}
.bk-rail li.done{border-bottom-color:rgba(125,164,255,.45)}
/* 3 · tarjetas de servicio: foto uniforme, precio en píldora sobre la imagen y título en una línea */
.bk-card .bk-svc{position:relative}
.bk-card .bk-svc img{aspect-ratio:16/9}
.bk-card .bk-svc-body{padding:14px 16px 16px;gap:5px}
.bk-card .bk-svc-body h3{display:block;font-size:17px;line-height:1.2;letter-spacing:-.015em}
.bk-card .bk-svc-body h3 em{display:inline-block;margin-left:7px;font-size:11.5px;font-style:normal;font-weight:800;color:#64748b;letter-spacing:.04em}
.bk-card .bk-svc-from{position:absolute;top:10px;right:10px;z-index:2;display:inline-flex;align-items:baseline;gap:4px;padding:7px 11px;border-radius:999px;background:rgba(4,11,19,.86);backdrop-filter:blur(6px);color:#fff;font-size:15px;font-weight:900;letter-spacing:-.01em;box-shadow:0 8px 20px rgba(0,0,0,.28)}
.bk-card .bk-svc-from small{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#9fb0c3}
.bk-card .bk-svc.on{border-color:#1437f5;box-shadow:0 18px 40px rgba(20,55,245,.28)}
/* 4 · el resumen manda: el siguiente paso es un botón, no un enlace */
.bk-card .bk-sum-cta--link{background:linear-gradient(135deg,#244dff,#1437f5);color:#fff;height:54px;border-radius:12px;margin-top:16px;text-decoration:none;font-size:13px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 16px 34px rgba(20,55,245,.38)}
.bk-card .bk-sum-cta--link:hover{transform:translateY(-2px);color:#fff}
.bk-card .bk-sum-cta--link .ic{display:inline-block;width:15px;height:15px}
.bk-card .bk-sum-cta--pay{background:linear-gradient(135deg,#16a34a,#12813b);box-shadow:0 16px 34px rgba(22,163,74,.34)}   /* al final del recorrido el botón es el de pagar */
.bk-card .bk-sum-total strong{font-size:38px}
.bk-card .bk-summary h3{font-size:22px}
@media (max-width:1100px){
  .bk-card-body{grid-template-columns:minmax(0,1fr) 300px}
  .bk-card .bk-svcs{grid-template-columns:1fr}
}
@media (max-width:959px){
  body.bk-page--card{padding-bottom:0}   /* sin barra fija: no hace falta reservar el hueco inferior */
  .bk-page--card .bk-hero-grid{grid-template-columns:minmax(0,1fr);padding-bottom:clamp(56px,9vw,72px)}
  .bk-page--card .bk-hero-photo{grid-column:1;grid-row:auto;order:3;aspect-ratio:21/9;max-height:190px}   /* el hero móvil deja el formulario casi a la vista */
  .bk-page--card .bk-hero h1{font-size:32px;margin:6px 0}
  .bk-page--card .bk-hero-copy>p{font-size:14.5px}
  .bk-page--card .bk-hero-grid{gap:12px}
  .bk-page--card .bk-hero-copy{grid-row:auto}
  .bk-card-body{grid-template-columns:minmax(0,1fr)}
  .bk-card .bk-summary{position:relative;top:auto}
  .bk-card{border-radius:18px;padding:18px 14px 16px}
  .bk-cardwrap>.wrap{margin-top:-52px}
  .bk-card .bk-step-done{white-space:normal}   /* «Thu, Sep 17 · 8:00 AM» se cortaba con puntos suspensivos en la tarjeta estrecha */
  .bk-rail li span{display:none}
  .bk-rail li.on span{display:inline}
}
@media (max-width:430px){.bk-card .q-submit{font-size:12px;letter-spacing:.06em;gap:7px}}

/* ════ WEB-096 · FAQ de /book/: el logo de la van tapaba el texto y la lista se veía plana (Randy: «no se ve premium ni llamativo»).
   Fondo muy atenuado y con desenfoque + cada pregunta en su propia tarjeta con chevron en píldora. Solo /book/. ════ */
.bk-page--card .faq--dark .pbg img{opacity:.14;filter:saturate(.7) contrast(1.05) blur(3px)}
.bk-page--card .faq--dark .pbg::after{background:linear-gradient(180deg,rgba(7,17,27,.93),rgba(7,17,27,.82) 45%,rgba(7,17,27,.96)),radial-gradient(70% 60% at 74% 28%,rgba(20,55,245,.24),transparent 70%)}
.bk-page--card .faq{padding-bottom:clamp(56px,7vh,88px)}
.bk-page--card .faq-list{border-top:0;display:grid;gap:12px}
.bk-page--card .faq-item{border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.04);transition:border-color .25s ease,background .25s ease,box-shadow .25s ease}
.bk-page--card .faq-item:hover{border-color:rgba(125,164,255,.42);background:rgba(255,255,255,.065)}
.bk-page--card .faq-item.on{border-color:rgba(125,164,255,.55);background:linear-gradient(180deg,rgba(20,55,245,.16),rgba(255,255,255,.04));box-shadow:0 18px 40px rgba(0,20,60,.35)}
.bk-page--card .faq-q{padding:17px 18px;font-size:16.5px;letter-spacing:-.012em;gap:16px;align-items:center}
.bk-page--card .faq-q:focus-visible{outline:2px solid #7da4ff;outline-offset:3px;border-radius:16px}
/* el icono lleva width/height en el atributo style: hay que ganarle para convertirlo en píldora */
.bk-page--card .faq-q .chev{width:32px!important;height:32px!important;padding:9px;box-sizing:border-box;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#dbe4ff;flex:0 0 auto;transition:transform .25s ease,background .25s ease,border-color .25s ease}
.bk-page--card .faq-item.on .faq-q .chev{background:#1437f5;border-color:#1437f5;color:#fff}
.bk-page--card .faq-a{padding:0 18px 18px;max-width:none;font-size:15px;line-height:1.62;color:#cbd5e1}
@media (min-width:1100px){.bk-page--card .faq-list{grid-template-columns:1fr 1fr;gap:14px;align-items:start}}

/* ── WEB-096 · «ver todo lo que incluye» (Randy 2026-09-16) ── */
.bk-svc-wrap{display:grid;gap:0;align-content:start}
.bk-svc-more{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:8px;padding:11px 12px;border-radius:12px;border:1px dashed rgba(125,164,255,.45);background:rgba(125,164,255,.08);color:#dbe4ff;font:inherit;font-size:12.5px;font-weight:800;letter-spacing:.04em;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}
.bk-svc-more:hover{background:rgba(125,164,255,.16);border-color:rgba(125,164,255,.7);color:#fff}
.bk-svc-more .ic{color:#7da4ff}
.bk-modal[hidden]{display:none!important}
.bk-modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,32px)}
.bk-modal-back{position:absolute;inset:0;background:rgba(3,8,14,.82);backdrop-filter:blur(6px)}
.bk-modal-box{position:relative;width:min(760px,100%);max-height:88vh;overflow:auto;background:linear-gradient(180deg,#0b1726,#0d1b2b);border:1px solid rgba(125,164,255,.3);border-radius:22px;padding:clamp(22px,3vw,34px);box-shadow:0 50px 120px rgba(0,10,40,.7)}
.bk-modal-box:focus{outline:none}
.bk-modal-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#dbe4ff;font-size:15px;line-height:1;cursor:pointer;transition:background .2s ease,color .2s ease}
.bk-modal-x:hover{background:rgba(255,255,255,.14);color:#fff}
.bk-modal-k{display:block;color:#7da4ff;font-size:11px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.bk-inc-full[hidden]{display:none!important}
.bk-inc-full h3{margin:8px 0 4px;font-size:clamp(24px,2.6vw,32px);letter-spacing:-.03em;color:#fff;line-height:1.05}
.bk-inc-sub{margin:0 0 18px;color:#9fb0c3;font-size:13.5px;font-weight:700;letter-spacing:.02em}
.bk-inc-group{margin-bottom:18px}
.bk-inc-group h4{margin:0 0 10px;font-size:11.5px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#7da4ff}
.bk-inc-group ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.bk-inc-group li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;line-height:1.45;color:#e7eef7}
.bk-inc-group li .ic{width:16px;height:16px;color:#1437f5;flex:0 0 auto;margin-top:2px}
.bk-inc-note{margin:0 0 18px;padding:12px 14px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#c7d2e0;font-size:12.5px;line-height:1.5}
.bk-modal-pick{width:100%}
@media (min-width:760px){.bk-inc-group ul{grid-template-columns:1fr 1fr;gap:9px 22px}}
@media (max-width:760px){.bk-modal-box{max-height:92vh;border-radius:18px}}

/* WEB-097 · Randy 2026-09-16: las fotos de Express, Interior y Exterior no correspondían al servicio; solo queda la de espuma.
   Las tarjetas sin foto ganan una cinta superior y aire para la píldora del precio. */
/* mismas alturas aunque solo una tarjeta lleve foto */
.bk-card .bk-svcs{align-items:stretch}
.bk-svc-wrap{height:100%;display:flex;flex-direction:column}
.bk-card .bk-svc{flex:1;display:flex;flex-direction:column}
.bk-card .bk-svc-body{flex:1}
/* el botón vive sobre el panel BLANCO del paso activo: se estila en claro, no en oscuro */
.bk-card .bk-svc-more{margin-top:8px;border:1px solid #cbd5e1;border-style:solid;background:#f7f9fc;color:#1437f5}
.bk-card .bk-svc-more:hover{background:#eef2ff;border-color:#1437f5;color:#0c26b8}
.bk-card .bk-svc-more .ic{color:#1437f5}

/* ════ WEB-098 · acabado premium de las tarjetas de servicio (Randy 2026-09-16: «el título debería ser más
   llamativo… dale un toque premium y elegante»). Solo dentro de la tarjeta de reserva de /book/. ════ */
.bk-card .bk-svc{border-radius:18px;border:1px solid #e6ebf3;box-shadow:0 10px 28px rgba(7,17,27,.06);transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .2s ease}
.bk-card .bk-svc:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(7,17,27,.13);border-color:#c7d2fe}
.bk-card .bk-svc.on{border-color:#1437f5;box-shadow:0 24px 54px rgba(20,55,245,.26)}
.bk-card .bk-svc-media{border-radius:17px 17px 0 0}
.bk-card .bk-svc-media::after{content:"";position:absolute;inset:auto 0 0 0;height:52%;background:linear-gradient(180deg,transparent,rgba(7,17,27,.35));pointer-events:none}
.bk-card .bk-svc-body{padding:16px 18px 18px;gap:0}
/* título: más grande, más apretado, con la duración en chip */
.bk-card .bk-svc-body h3{display:block;margin:0;font-size:20px;font-weight:900;letter-spacing:-.035em;line-height:1.12;color:#07111b}
.bk-card .bk-svc-body h3 em{display:block;width:fit-content;margin:9px 0 0;padding:3px 9px;border-radius:999px;background:#f1f5f9;border:1px solid #e2e8f0;color:#475569;font-size:10.5px;font-weight:800;font-style:normal;letter-spacing:.06em;vertical-align:middle}
/* el paquete pasa de texto gris a píldora de marca */
.bk-card .bk-svc-pkg{display:inline-block;margin:8px 0 11px;padding:5px 11px;border-radius:999px;background:linear-gradient(135deg,rgba(20,55,245,.12),rgba(125,164,255,.18));color:#1437f5;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.bk-card .bk-svc-body>small:not(.bk-svc-pkg){display:block;margin:0 0 12px;color:#64748b;font-size:13.5px;line-height:1.5;font-weight:500}
/* viñetas: check en círculo y texto más ligero */
.bk-card .bk-inc{gap:7px;padding-top:12px;border-top:1px solid #eef2f7}
.bk-card .bk-inc li{align-items:center;gap:9px;font-size:13px;font-weight:600;color:#334155}
.bk-card .bk-inc li .ic{width:18px!important;height:18px!important;padding:4px;box-sizing:border-box;border-radius:50%;background:rgba(20,55,245,.1);color:#1437f5;flex:0 0 auto}
/* encabezado del paso, un punto más elegante */
.bk-card .bk-step.on .bk-step-h h2{font-size:clamp(20px,1.9vw,23px);letter-spacing:-.03em}
.bk-card .bk-svc-from{padding:8px 12px;font-size:15.5px;letter-spacing:-.02em;box-shadow:0 10px 24px rgba(0,0,0,.34)}
.bk-card .bk-tag{font-weight:900;letter-spacing:.1em}

/* ════ WEB-100 · /offer/ en UNA sola tarjeta plana, como la landing de BVP (Randy 2026-09-16: «debe ser igual de
   sencilla para que el booking sea más rápido; aquí llegan los de Facebook y Google Ads»). Todo a la vista:
   precio, tamaño, día, hora, datos y un botón. Acotado a body.bk-page--offer. ════ */
.bk-page--offer .bk-hero-grid{grid-template-columns:minmax(0,1fr) 470px;grid-template-rows:auto 1fr auto;align-items:start;gap:16px clamp(24px,4vw,48px);padding:clamp(20px,2.6vw,34px) 0 clamp(36px,4vw,56px)}
.bk-page--offer .bk-hero-copy{grid-column:1;grid-row:1}
.bk-page--offer .bk-hero-photo{grid-column:1;grid-row:2;align-self:stretch;aspect-ratio:auto;min-height:340px}   /* WEB-116 · en PC la foto llena el alto de la columna: con 16:9 fijo quedaban ~310 px vacíos bajo ella (medido a 1600 px) */
.bk-page--offer .bk-hero-side{grid-column:2;grid-row:1/4}
/* WEB-119 · insignias de reseñas (sin conteo · línea roja 1) y zonas a ≤10 mi, bajo la imagen */
.bk-page--offer .bk-hero-trust{grid-column:1;grid-row:3;display:flex;flex-direction:column;gap:12px}
.bk-proof-badges{display:flex;flex-wrap:wrap;gap:10px}
.bk-proof-badge{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:#fff;border:1px solid rgba(7,17,27,.10);box-shadow:0 6px 18px rgba(7,17,27,.07);color:#0a1420;font-size:13.5px;font-weight:700}
.bk-proof-badge b{font-size:16px;font-weight:900}
.bk-proof-stars{color:#f5b301;letter-spacing:1px;font-size:14px}
.bk-proof-areas-h{margin:2px 0 0;display:flex;align-items:center;gap:6px;color:#3b4656;font-size:13.5px;font-weight:700}
.bk-proof-areas-h .ic{color:#1437f5}
.bk-proof-areas{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.bk-proof-areas li{padding:6px 12px;border-radius:999px;background:rgba(20,55,245,.07);border:1px solid rgba(20,55,245,.16);color:#0a1420;font-size:13px;font-weight:700}
.bk-page--offer .bk-hero h1{font-size:clamp(32px,3.4vw,48px)}
.bk-card--offer{background:linear-gradient(180deg,#0a1523,#0c1a2a);border-radius:22px;padding:clamp(18px,2vw,26px);box-shadow:0 40px 90px rgba(0,18,56,.5),0 0 0 1px rgba(125,164,255,.2);display:grid;gap:14px}
.bk-card--offer .bk-card-head{display:grid;gap:8px}
.bk-offer-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.bk-offer-slots{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;background:rgba(22,163,74,.18);border:1px solid rgba(74,222,128,.45);color:#86efac;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.bk-offer-slots[hidden]{display:none!important}
.bk-offer-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.bk-offer-price b{font-size:clamp(40px,4.4vw,56px);line-height:1;letter-spacing:-.045em;color:#fff}
.bk-offer-price b small{display:inline;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#9aa9b8;margin-right:6px}
.bk-offer-was{font-size:20px;font-weight:900;color:#64748b;text-decoration:line-through}
.bk-offer-save{padding:6px 11px;border-radius:999px;background:linear-gradient(135deg,#244dff,#1437f5);color:#fff;font-size:11.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.bk-offer-sub{margin:0;color:#c7d2e0;font-size:13.5px;line-height:1.5}
/* ── modo plano: todos los pasos a la vista, sin numeración ni acordeón ── */
/* el cuerpo hereda de /book/ dos columnas (pasos + resumen lateral). En /offer/ no hay resumen:
   una sola columna, si no los pasos caen en una pista de 62 px y las horas se parten. */
.bk-card-body--flat{display:block!important}
.bk-flat .bk-steps{display:grid;gap:16px}
.bk-flat .bk-step{display:block!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0}
.bk-flat #bk-service,.bk-flat #bk-addons{display:none!important}
.bk-flat .bk-step-h,.bk-flat .bk-step.on .bk-step-h{display:flex!important;padding:0 0 8px!important;cursor:default;pointer-events:none}
.bk-flat .bk-step-h .bk-n,.bk-flat .bk-change,.bk-flat .bk-step-done,.bk-flat .bk-opt{display:none!important}
.bk-flat .bk-step-h h2{font-size:11px!important;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#7da4ff!important}
.bk-flat .bk-step-body{display:block!important;padding:0}
.bk-flat .bk-step-sub,.bk-flat .bk-proof,.bk-flat .bk-studio,.bk-flat .bk-hours{display:none!important}
.bk-flat .bk-chips{grid-template-columns:1fr 1fr;gap:9px}
.bk-flat .bk-size{padding:11px 12px}
.bk-flat .bk-size small{display:none}
.bk-flat .bk-days{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:4px;padding-top:9px}
.bk-flat .bk-lbl{margin:16px 0 8px;font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#7da4ff}
.bk-flat .bk-more{margin:6px 0 0;font-size:12.5px}
.bk-flat .bk-hours-empty{margin:2px 0 0;color:#9aa9b8;font-size:13px}
.bk-flat .bk-avail-note{margin-top:10px;background:rgba(255,255,255,.06);color:#dbe4ff;border:1px solid rgba(255,255,255,.12)}
.bk-flat .bk-hourgrid{grid-template-columns:repeat(4,1fr);gap:8px}
.bk-flat .bk-hourgrid .bk-win{padding:12px 4px 10px;white-space:nowrap}
.bk-flat .bk-hourgrid .bk-win strong{font-size:14px}
.bk-flat .form-grid-v3{grid-template-columns:1fr;gap:10px}
.bk-flat .form-grid-v3 .span2{grid-column:auto}
.bk-flat #bk-vehicle,.bk-flat #bk-email,.bk-flat #bk-notes{display:none}
.bk-flat label[for="bk-vehicle"],.bk-flat label[for="bk-email"],.bk-flat label[for="bk-notes"]{display:none}
.bk-flat .bk-consent{margin-top:10px;padding:11px 13px;font-size:12px}
/* contraste sobre la tarjeta oscura: sin esto las etiquetas quedan negras sobre azul oscuro */
.bk-card--offer .bk-step .form-grid-v3 label{color:#9fb6ff}
.bk-card--offer .bk-step .form-grid-v3 label .lbl-hint{color:#9aa9b8;text-transform:none;letter-spacing:0;font-weight:600}
.bk-card--offer .bk-consent{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#dbe4ff}
.bk-card--offer .bk-consent--dep{background:rgba(125,164,255,.12);border-color:rgba(125,164,255,.32)}
.bk-card--offer .bk-consent a{color:#9fb6ff}
.bk-card--offer .bk-consent.is-invalid{background:rgba(220,38,38,.16);border-color:#f87171}
.bk-flat .bk-submit{margin-top:14px}
.bk-flat .q-submit{height:58px;font-size:14px}
.bk-flat .bk-submit-sub{display:none}
.bk-card--offer .bk-card-foot{display:grid;gap:4px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);text-align:center}
.bk-offer-fine{margin:0;color:#9aa9b8;font-size:11.5px;letter-spacing:.02em}
.bk-offer-call{margin:0;color:#c7d2e0;font-size:13px;font-weight:700}
.bk-offer-call a{color:#7da4ff;text-decoration:underline;text-underline-offset:3px}
/* ════ WEB-101 · los datos van en una SEGUNDA tarjeta (Randy 2026-09-16: «como bvp, para que el form
   no sea tan largo»). La primera resuelve la cita; la segunda, los datos y el depósito. ════ */
.bk-page--offer .bk-hero-side{display:grid;gap:14px;align-content:start}
.bk-card--datos{margin:0}
.bk-card--datos .bk-card-body--flat{padding-top:2px}
.bk-card--datos .bk-step-h h2{font-size:12px!important;letter-spacing:.14em}
.bk-card--offer#bk-card .bk-card-body--flat .bk-steps>.bk-step:last-child{padding-bottom:0}
@media (max-width:959px){.bk-page--offer .bk-hero-side{gap:12px}}
/* ════ WEB-101 · acabado PREMIUM y compacto de /offer/ (Randy 2026-09-16: «debe verse premium y
   compacto en móvil, fácil y rápido de reservar y pagar»). Las fichas blancas sobre la tarjeta
   oscura se veían como un widget claro pegado encima; pasan a vidrio oscuro con realce azul al
   elegir. Los campos reusan la receta oscura ya probada del hero (.hero-form-col .q-input). ════ */
.bk-card--offer{box-shadow:0 40px 90px rgba(0,18,56,.5),0 0 0 1px rgba(125,164,255,.22),inset 0 1px 0 rgba(255,255,255,.07)}
/* fichas: tamaño, día y hora */
.bk-card--offer .bk-size,.bk-card--offer .bk-win,.bk-card--offer .bk-day{
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.16);color:#e9eeff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);border-radius:13px}
.bk-card--offer .bk-size strong,.bk-card--offer .bk-win strong,.bk-card--offer .bk-day strong{color:#f2f6ff}
.bk-card--offer .bk-size small,.bk-card--offer .bk-win small,.bk-card--offer .bk-day small,.bk-card--offer .bk-day span{color:#9fb0c6}
.bk-card--offer .bk-size .bk-size-price{color:#9fb6ff}
.bk-card--offer .bk-size:hover,.bk-card--offer .bk-win:hover,.bk-card--offer .bk-day:hover{
  border-color:rgba(125,164,255,.5);background:rgba(125,164,255,.1);transform:translateY(-1px)}
.bk-card--offer .bk-size.on,.bk-card--offer .bk-win.on,.bk-card--offer .bk-day.on{
  border-color:#4b7bff;background:linear-gradient(180deg,rgba(36,77,255,.28),rgba(20,55,245,.12));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 10px 26px rgba(20,55,245,.32)}
.bk-card--offer .bk-size.on .bk-size-price,.bk-card--offer .bk-day.on strong{color:#fff}
.bk-card--offer .bk-size.on::after,.bk-card--offer .bk-win.on::after,.bk-card--offer .bk-day.on::after{
  background:#fff;box-shadow:0 0 0 3px rgba(125,164,255,.45)}
.bk-card--offer .bk-day i{background:linear-gradient(135deg,#ffd77a,#e9b03e);color:#1a1205;box-shadow:0 4px 12px rgba(0,0,0,.35);font-size:9.5px;padding:3px 7px}
.bk-card--offer .bk-more{color:#9fb6ff}
.bk-card--offer .bk-hours-empty,.bk-card--offer .bk-hours{color:#9fb0c6}
.bk-card--offer .bk-hours a{color:#9fb6ff}
/* campos: misma receta oscura del hero, ya probada en el sitio */
.bk-card--offer .q-input,.bk-card--offer gmp-place-autocomplete{
  background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:11px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.bk-card--offer .q-input::placeholder{color:#9fb0c6}
.bk-card--offer .q-input:focus,.bk-card--offer gmp-place-autocomplete:focus-within{
  border-color:#7da4ff;background:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 3px rgba(20,55,245,.35)}
.bk-card--offer .q-input.is-invalid,.bk-card--offer gmp-place-autocomplete.is-invalid{border-color:#ff6b6b}
.bk-card--offer .bk-fld-ic,.bk-card--offer .fld-ic{color:#9fb0c6}
/* la reseña repetida dentro de la 2.ª tarjeta sobra: ya está el aside bajo las tarjetas */
.bk-card--datos .bk-proof{display:none}
/* ── compacto en móvil: menos aire, mismo tamaño de toque (44 px mínimo) ── */
@media (max-width:640px){
  .bk-page--offer .bk-hero-grid{padding:14px 0 26px;gap:12px}
  .bk-page--offer .bk-hero h1{font-size:clamp(27px,7.6vw,34px);line-height:1.08}
  .bk-page--offer .bk-hero-copy p{font-size:14px;line-height:1.5}
  .bk-card--offer{padding:14px 13px;border-radius:18px}
  .bk-card--offer .bk-offer-price b{font-size:40px}
  .bk-card--offer .bk-offer-sub{font-size:12.5px;line-height:1.45}
  .bk-flat .bk-steps{gap:13px}
  .bk-flat .bk-step-h{padding:0 0 6px}
  .bk-flat .bk-chips{gap:8px}
  .bk-flat .bk-size{padding:10px 10px;min-height:56px}
  .bk-flat .bk-days{gap:8px}
  .bk-card--offer .bk-day{padding:9px 3px 8px;min-height:56px}
  .bk-card--offer .bk-day strong{font-size:20px}
  .bk-flat .bk-hourgrid{grid-template-columns:repeat(3,1fr);gap:7px}
  .bk-card--offer .bk-win{padding:11px 4px;min-height:44px}
  .bk-flat .bk-lbl{margin:12px 0 7px}
  .bk-flat .form-grid-v3{gap:9px}
  .bk-card--offer .q-input,.bk-card--offer gmp-place-autocomplete{height:46px;min-height:46px}
  .bk-flat .bk-consent{padding:10px 11px;font-size:11.5px;line-height:1.45}
  .bk-flat .q-submit{height:56px;font-size:14.5px}
  .bk-card--offer .bk-card-foot{padding-top:10px}
  .bk-offer-fine{font-size:11px}
}
/* ════ WEB-102 · /offer/ como asistente de TRES pasos (Randy 2026-09-16: «la de bvp tiene 3 steps,
   debería ser así» + «aún no se ve premium en móvil»). Pestañas arriba, UN paso a la vista,
   pregunta grande en la voz tipográfica de la marca, y Atrás / Continuar abajo. ════ */
.bk-wiz3{display:grid;gap:0;padding:clamp(16px,2vw,22px) clamp(15px,2vw,24px) clamp(16px,2vw,22px)}
/* pestañas */
.bk-w3rail{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0 0 18px}
.bk-w3tab{display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 8px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.05);color:#8ea0b8;font:inherit;font-size:11px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;cursor:default;transition:background .22s ease,color .22s ease,border-color .22s ease}
.bk-w3tab i{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:rgba(255,255,255,.12);color:#c7d2e0;font-style:normal;font-size:10.5px;letter-spacing:0;flex:0 0 auto}
.bk-w3tab.is-done{color:#c7d2e0;border-color:rgba(125,164,255,.35);background:rgba(125,164,255,.1);cursor:pointer}
.bk-w3tab.is-done i{background:#244dff;color:#fff}
.bk-w3tab.is-on{color:#fff;border-color:#4b7bff;background:linear-gradient(180deg,rgba(36,77,255,.34),rgba(20,55,245,.16));box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 22px rgba(20,55,245,.3);cursor:default}
.bk-w3tab.is-on i{background:#fff;color:#0a1523}
/* la pregunta de cada paso, en la voz del sitio: pesada, en mayúsculas, itálica */
.bk-w3q{margin:0 0 14px;font-size:clamp(21px,2.1vw,26px);line-height:1.06;letter-spacing:-.02em;font-weight:900;font-style:italic;text-transform:uppercase;color:#fff;text-wrap:balance}
.bk-w3[hidden]{display:none!important}
/* los encabezados de paso SON las micro-etiquetas monoespaciadas del asistente; se muestran
   todos por igual (antes «Your vehicle size» salía y «Day and start time» no, porque solo
   la sección activa ganaba la regla con !important de WEB-100) */
.bk-wiz3 .bk-step-h{display:flex!important;padding:0 0 7px!important;cursor:default;pointer-events:none}
.bk-wiz3 .bk-step-h .bk-n,.bk-wiz3 .bk-step-h .bk-change,.bk-wiz3 .bk-step-h .bk-step-done{display:none!important}
.bk-wiz3 .bk-card-body,.bk-wiz3 .bk-steps{display:block;padding:0;gap:0}
/* con .bk-steps en block el `gap` no aplica: la separación entre bloques va por margen,
   si no la etiqueta «Day and start time» se monta sobre la última fila de vehículos */
.bk-wiz3 .bk-step{margin:0}
.bk-wiz3 .bk-step + .bk-step:not([style*="display: none"]){margin-top:16px}
.bk-wiz3 #bk-date{margin-top:16px}
.bk-wiz3 .bk-step,.bk-wiz3 .bk-step-body{padding:0;background:none;border:0;box-shadow:none}
.bk-wiz3 .bk-offer-top{margin-bottom:9px}
.bk-wiz3 .bk-offer-price{margin-bottom:6px}
.bk-wiz3 .bk-offer-sub{margin:0 0 14px}
/* resumen del paso 3 */
.bk-w3sum{display:grid;gap:0;margin:0 0 14px;padding:4px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13)}
.bk-w3sum>div{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.bk-w3sum>div:last-child{border-bottom:0}
.bk-w3sum dt{margin:0;color:#8ea0b8;font-size:11px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;flex:0 0 auto}
.bk-w3sum dd{margin:0;color:#e9eeff;font-size:13.5px;font-weight:700;text-align:right}
.bk-w3sum-tot dd{font-size:16px;font-weight:900;color:#fff}
.bk-w3sum-dep dd{font-size:18px;font-weight:900;color:#9fb6ff}
/* botones Atrás / Continuar */
.bk-w3nav{display:flex;gap:9px;margin:16px 0 0}
.bk-w3btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 20px;border-radius:999px;border:1px solid transparent;font:inherit;font-size:14.5px;font-weight:900;letter-spacing:.01em;cursor:pointer;transition:transform .18s ease,box-shadow .22s ease,background .22s ease}
.bk-w3btn--back{flex:0 0 auto;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:#c7d2e0}
.bk-w3btn--back:hover{background:rgba(255,255,255,.12);color:#fff}
.bk-w3btn--back[hidden]{display:none}
.bk-w3btn--next{flex:1 1 auto;background:linear-gradient(135deg,#2f5cff,#1437f5);color:#fff;box-shadow:0 14px 34px rgba(20,55,245,.42)}
.bk-w3btn--next:hover{transform:translateY(-1px);box-shadow:0 18px 40px rgba(20,55,245,.5)}
.bk-w3btn--next:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.bk-wiz3 .bk-w3nav[hidden]{display:none}
/* en el paso 3 manda el botón de pago del formulario */
.bk-wiz3 .bk-submit{margin-top:14px}
.bk-wiz3 .q-submit{height:58px;border-radius:999px;font-size:15px}
.bk-wiz3 .bk-submit-sub{display:grid;gap:5px;margin-top:10px;color:#9fb0c6;font-size:11.5px}
.bk-wiz3 .bk-submit-sub[hidden]{display:none}
/* ── móvil: más aire donde importa, un paso corto por pantalla ── */
@media (max-width:640px){
  .bk-wiz3{padding:15px 14px 16px;border-radius:20px}
  .bk-w3rail{gap:5px;margin-bottom:16px}
  .bk-w3tab{min-height:38px;font-size:9.5px;letter-spacing:.09em;gap:5px;padding:0 5px}
  .bk-w3tab i{width:17px;height:17px;font-size:9.5px}
  .bk-w3q{font-size:clamp(20px,5.6vw,24px);margin-bottom:13px}
  .bk-w3sum dt{font-size:10px}
  .bk-w3sum dd{font-size:13px}
  .bk-w3nav{margin-top:15px}
  .bk-w3btn{min-height:52px;font-size:14px}
  .bk-w3btn--back{padding:0 15px}
}
/* ════ WEB-103 · compactar /offer/ al estándar de la landing de BVP, que Randy puso como vara
   («la de bvp es un 9, la de soto un 7; quiero un 10-10»). MEDIDO en su página el 2026-09-16:
   fichas de vehículo y de día de 37 px de alto, de UNA línea, y micro-etiquetas monoespaciadas
   de 10 px con 1 px de interletraje. Las de Soto medían entre 56 y 88 px y eran de dos o tres
   líneas: esa era la diferencia de «compacta», no el color. Se adopta la DISCIPLINA, no la
   paleta: Soto conserva su azul y su tipografía. ════ */
.bk-wiz3{--w3-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace}
/* micro-etiquetas monoespaciadas */
.bk-wiz3 .bk-step-h h2,.bk-wiz3 .bk-lbl{font-family:var(--w3-mono)!important;font-size:10px!important;font-weight:400!important;letter-spacing:1px!important;text-transform:uppercase;color:#8ea0b8!important;margin:0 0 7px}
.bk-wiz3 .bk-lbl{margin:13px 0 7px}
/* ficha de vehículo: UNA línea «Sedán / Coupé · $99» */
.bk-wiz3 .bk-chips{grid-template-columns:1fr 1fr;gap:7px}
.bk-wiz3 .bk-size{display:flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:9px 11px;border-radius:11px;text-align:center}
.bk-wiz3 .bk-size small{display:none}
.bk-wiz3 .bk-size strong{font-size:13.5px;font-weight:700;letter-spacing:-.01em}
.bk-wiz3 .bk-size strong::after{content:" ·";opacity:.45}
.bk-wiz3 .bk-size .bk-size-price{font-size:13.5px;font-weight:900;color:#9fb6ff}
.bk-wiz3 .bk-size.on .bk-size-price{color:#fff}
.bk-wiz3 .bk-size.on::after,.bk-wiz3 .bk-day.on::after,.bk-wiz3 .bk-win.on::after{display:none}
/* píldoras de día y de hora, que fluyen y envuelven */
.bk-wiz3 .bk-days{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0}
.bk-wiz3 .bk-day{min-height:40px;padding:9px 14px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center}
.bk-wiz3 .bk-day b{font-size:13.5px;font-weight:700;letter-spacing:-.005em;white-space:nowrap}
.bk-wiz3 .bk-day:hover{transform:none}
.bk-wiz3 .bk-hourgrid{display:flex;flex-wrap:wrap;gap:7px;grid-template-columns:none}
.bk-wiz3 .bk-win{min-height:40px;padding:9px 14px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center}
.bk-wiz3 .bk-win strong{font-size:13.5px;font-weight:700;white-space:nowrap}
.bk-wiz3 .bk-win small{display:none}
.bk-wiz3 .bk-more{margin:9px 0 0;font-size:12.5px}
.bk-wiz3 .bk-hours-empty{width:100%;margin:2px 0;font-size:13px}
/* frase clave resaltada, como el marcador de BVP: ancla el «desde» al precio real */
.bk-wiz3 .bk-offer-sub{margin:0 0 13px;font-size:12.5px;line-height:1.5}
.bk-wiz3 .bk-offer-sub b{color:#fff;background:rgba(125,164,255,.16);box-shadow:0 0 0 4px rgba(125,164,255,.16);border-radius:3px;font-weight:800}
/* campos del paso 2, también más compactos */
.bk-wiz3 .form-grid-v3{gap:8px;margin-top:0}
.bk-wiz3 .q-input,.bk-wiz3 gmp-place-autocomplete{height:48px;min-height:48px;border-radius:11px;font-size:15px}
.bk-wiz3 .bk-consent{margin-top:9px;padding:10px 12px;font-size:11.5px;line-height:1.45;border-radius:11px}
/* el precio, el tachado y el ahorro en UNA sola fila, como en BVP */
.bk-wiz3 .bk-offer-price{flex-wrap:nowrap;align-items:baseline;gap:9px}
.bk-wiz3 .bk-offer-price b{white-space:nowrap}
.bk-wiz3 .bk-offer-was{font-size:17px;white-space:nowrap}
.bk-wiz3 .bk-offer-save{padding:5px 9px;font-size:10.5px;white-space:nowrap}
.bk-wiz3 .bk-size strong,.bk-wiz3 .bk-size .bk-size-price{white-space:nowrap}
@media (max-width:640px){
  .bk-wiz3 .bk-size{min-height:44px;padding:9px 8px;gap:5px}
  .bk-wiz3 .bk-size strong{font-size:13px}
  .bk-wiz3 .bk-size .bk-size-price{font-size:13px}
  .bk-wiz3 .bk-day,.bk-wiz3 .bk-win{min-height:42px;padding:9px 12px}
  .bk-wiz3 .bk-day b,.bk-wiz3 .bk-win strong{font-size:13px}
  .bk-wiz3 .bk-offer-price{gap:7px}
  .bk-wiz3 .bk-offer-price b{font-size:38px}
  .bk-wiz3 .bk-offer-was{font-size:15px}
  .bk-wiz3 .bk-offer-save{padding:4px 7px;font-size:9.5px;letter-spacing:.05em}
}
/* ════ WEB-104 · SEPARACIÓN DE VALOR (Randy 2026-09-16, con captura ampliada: «no hay separación,
   todo se ve del mismo color, no se ve premium»). Tenía razón y el defecto era medible: la tarjeta
   y las fichas estaban a pocos puntos de luminancia, así que nada parecía estar ENCIMA de nada.
   BVP funciona por contraste de VALOR (tarjeta crema sobre página casi negra), no por su color.
   Aquí se aplica el mismo principio en la paleta de Soto: tarjeta casi negra, fichas claramente
   elevadas, seleccionado en azul sólido, y reglas finas que separan precio · elección · pago. ════ */
.bk-card--offer{
  background:linear-gradient(180deg,#060b14,#0a1120 62%,#070d18);
  border-radius:24px;
  box-shadow:0 2px 0 rgba(255,255,255,.05) inset,0 0 0 1px rgba(148,178,255,.16),0 30px 70px rgba(2,8,26,.55)}
/* 1 · bloque de precio, con su propia base y una regla que lo cierra */
.bk-wiz3 .bk-card-head,.bk-wiz3 .bk-w3 .bk-offer-top{margin-bottom:10px}
/* el <small>FROM</small> es de bloque y desplaza la línea base del <b>, así que el tachado y el
   ahorro flotaban arriba: se alinean por el BORDE INFERIOR y se levantan al nivel del precio */
.bk-wiz3 .bk-offer-price{display:flex;align-items:flex-end;gap:11px;margin:0 0 11px}
.bk-wiz3 .bk-offer-price b{line-height:.92}
.bk-wiz3 .bk-offer-was,.bk-wiz3 .bk-offer-save{position:relative;bottom:6px}
.bk-wiz3 .bk-offer-price b small{display:block;margin:0 0 2px;font-size:9.5px;letter-spacing:.18em;color:#7f90a8}
.bk-wiz3 .bk-offer-was{color:#5b6b84;font-size:18px}
.bk-wiz3 .bk-offer-save{background:linear-gradient(135deg,#2f5cff,#1330d8);box-shadow:0 6px 18px rgba(20,55,245,.42)}
/* la frase clave sin caja gris: una regla azul a la izquierda, como una nota al margen */
.bk-wiz3 .bk-offer-sub{margin:0 0 15px;padding:0 0 0 11px;border-left:2px solid rgba(125,164,255,.55);color:#93a6c0}
.bk-wiz3 .bk-offer-sub b{background:none;box-shadow:none;color:#dfe8ff;font-weight:800}
/* regla fina que separa el precio de la elección */
.bk-wiz3 .bk-w3q{position:relative;margin:0 0 15px;padding-top:15px;border-top:1px solid rgba(148,178,255,.16)}
/* 2 · fichas ELEVADAS: se ven encima de la tarjeta, no fundidas con ella */
.bk-card--offer .bk-size,.bk-card--offer .bk-win,.bk-card--offer .bk-day{
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.07));
  border:1px solid rgba(178,199,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 6px rgba(0,0,0,.3);
  color:#eef3ff}
.bk-card--offer .bk-size:hover,.bk-card--offer .bk-win:hover,.bk-card--offer .bk-day:hover{
  background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.1));
  border-color:rgba(178,199,255,.42);transform:translateY(-1px)}
/* seleccionado: azul SÓLIDO, texto blanco — no hay duda de qué está elegido */
.bk-card--offer .bk-size.on,.bk-card--offer .bk-win.on,.bk-card--offer .bk-day.on{
  background:linear-gradient(135deg,#3564ff,#1330d8);border-color:#6f97ff;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 24px rgba(20,55,245,.5)}
.bk-card--offer .bk-size.on strong,.bk-card--offer .bk-size.on .bk-size-price,
.bk-card--offer .bk-day.on b,.bk-card--offer .bk-win.on strong{color:#fff}
.bk-wiz3 .bk-size .bk-size-price{color:#a8c0ff}
/* 3 · bloque de acción, separado por una regla */
.bk-wiz3 .bk-w3nav{margin-top:18px;padding-top:16px;border-top:1px solid rgba(148,178,255,.16)}
.bk-wiz3 .bk-card-foot{margin-top:13px;padding-top:11px;border-top:1px solid rgba(148,178,255,.1)}
/* pestañas: la inactiva se hunde, la activa es azul sólido */
.bk-wiz3 .bk-w3rail{margin-bottom:17px}
.bk-wiz3 .bk-w3tab{background:rgba(0,0,0,.3);border-color:rgba(148,178,255,.13);color:#7f90a8;box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
.bk-wiz3 .bk-w3tab i{background:rgba(255,255,255,.08);color:#8ea0b8}
.bk-wiz3 .bk-w3tab.is-done{background:rgba(125,164,255,.12);border-color:rgba(125,164,255,.4);color:#c7d6f5;box-shadow:none}
.bk-wiz3 .bk-w3tab.is-on{background:linear-gradient(135deg,#3564ff,#1330d8);border-color:#7da4ff;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 8px 22px rgba(20,55,245,.45)}
/* el resumen del paso 3, también elevado */
.bk-wiz3 .bk-w3sum{background:rgba(0,0,0,.28);border-color:rgba(148,178,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.bk-wiz3 .bk-w3sum>div{border-bottom-color:rgba(148,178,255,.12)}
/* campos del paso 2 igualmente elevados sobre la tarjeta */
.bk-card--offer .q-input,.bk-card--offer gmp-place-autocomplete{
  background:rgba(255,255,255,.1);border-color:rgba(178,199,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 2px 6px rgba(0,0,0,.28)}
.bk-card--offer .bk-consent{background:rgba(0,0,0,.26);border-color:rgba(148,178,255,.16)}
.bk-card--offer .bk-consent--dep{background:rgba(53,100,255,.14);border-color:rgba(125,164,255,.34)}
/* ════ WEB-105 · Randy 2026-09-16, con dos capturas: «elimina espacio en el título, y haz que fecha
   y hora no se vean tan pequeños, extiende a la derecha que aún tiene espacio disponible».
   MEDIDO antes de tocar: 36 px entre el titular y la línea de confianza; la fila de días sumaba
   277 px dentro de un contenedor de 326 (49 px desperdiciados a la derecha) porque era flex con
   envolvimiento; la letra de las fichas iba a 13 px. ════ */
/* 1 · el titular se pega a lo que sigue */
.bk-page--offer .bk-hero h1{margin-bottom:2px}
.bk-page--offer .bk-hero-proof{margin-top:2px}
/* 2 · día y hora en cuadrícula que OCUPA TODO EL ANCHO, sin hueco a la derecha */
.bk-wiz3 .bk-days,.bk-wiz3 .bk-hourgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.bk-wiz3 .bk-day,.bk-wiz3 .bk-win{width:100%;padding:11px 6px}
/* 3 · letra más grande en fecha y hora */
.bk-wiz3 .bk-day{min-height:48px}
.bk-wiz3 .bk-win{min-height:48px}
.bk-wiz3 .bk-day b,.bk-wiz3 .bk-win strong{font-size:15px;font-weight:800;letter-spacing:-.01em}
@media (max-width:640px){
  .bk-page--offer .bk-hero-grid{gap:9px clamp(24px,4vw,48px)}
  .bk-page--offer .bk-hero h1{margin-bottom:0}
  .bk-page--offer .bk-hero-copy>.bk-hero-proof{margin-top:0}
  .bk-wiz3 .bk-days,.bk-wiz3 .bk-hourgrid{gap:7px}
  .bk-wiz3 .bk-day,.bk-wiz3 .bk-win{min-height:50px;padding:11px 4px}
  .bk-wiz3 .bk-day b,.bk-wiz3 .bk-win strong,
  .bk-wiz3 .bk-hourgrid .bk-win strong{font-size:15px}
  /* las horas pasan a TRES columnas en móvil: a 15 px «10:00 AM» no cabe en 76 px y se partiría */
  .bk-wiz3 .bk-hourgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* ════ WEB-106 · LEGIBILIDAD de las micro-etiquetas (Randy 2026-09-16: «el texto Start Time y los
   demás casi no se distinguen, deberían ser blanco u otra combinación que puedan ser legibles»).
   Se inventariaron las 26 etiquetas del asistente y se midió su contraste contra la tarjeta: TODAS
   pasaban el mínimo técnico (5.8 a 9.5 sobre 4.5). El contraste no era el problema — el tamaño y el
   trazo sí: iban a 10 px con peso 400 en monoespaciada, y a ese calibre un 7:1 sigue leyéndose
   apagado. Suben tamaño, peso y color a la vez. ════ */
.bk-wiz3 .bk-step-h h2,.bk-wiz3 .bk-lbl{font-size:11.5px!important;font-weight:700!important;letter-spacing:.14em!important;color:#d3e0f7!important}
.bk-wiz3 .bk-w3sum dt{font-size:11.5px;font-weight:700;letter-spacing:.11em;color:#d3e0f7}
.bk-card--offer .bk-step .form-grid-v3 label{font-size:12.5px;font-weight:800;color:#cfddf7}
.bk-card--offer .bk-step .form-grid-v3 label .lbl-hint{color:#a8b8d0}
.bk-wiz3 .bk-w3tab:not(.is-on){color:#aabbd6}
.bk-wiz3 .bk-w3tab:not(.is-on) i{color:#c2d0e8}
.bk-wiz3 .bk-offer-price b small{color:#aabbd6;font-weight:700}
.bk-wiz3 .bk-offer-sub{color:#bccbe2}
.bk-wiz3 .bk-offer-sub b{color:#fff}
.bk-offer-fine{color:#b3c2d8}
.bk-wiz3 .bk-submit-sub{color:#bccbe2}
.bk-wiz3 .bk-hours-empty,.bk-wiz3 .bk-hours{color:#bccbe2}
@media (max-width:640px){
  .bk-wiz3 .bk-step-h h2,.bk-wiz3 .bk-lbl{font-size:11px!important}
  .bk-wiz3 .bk-w3sum dt{font-size:11px}
}
/* WEB-107 · emoji delante de cada micro-etiqueta (Randy 2026-09-16: «agrégale emojis relevantes,
   Start Time ⌚ o algo similar»). Va en un <i> hermano y NO dentro del texto traducido: el
   conmutador de idioma hace `el.innerHTML = data-es`, así que un emoji dentro se perdería al
   pasar a español. El <i> no hereda el interletraje de la etiqueta, que lo separaría de más. */
.bk-lbl-ic{display:inline-block;margin-right:6px;font-style:normal;font-size:12.5px;letter-spacing:0;line-height:1;vertical-align:-1px}
.bk-wiz3 .bk-step-h h2 .bk-lbl-ic,.bk-wiz3 .bk-lbl .bk-lbl-ic{font-size:13px;vertical-align:-1.5px}
.bk-card--offer .form-grid-v3 label .bk-lbl-ic{font-size:12.5px;margin-right:5px}
@media (max-width:1100px){.bk-page--offer .bk-hero-grid{grid-template-columns:minmax(0,1fr) 400px}}
@media (max-width:959px){
  body.bk-page--offer{padding-bottom:0}
  .bk-page--offer .bk-hero-grid{grid-template-columns:minmax(0,1fr)}
  .bk-page--offer .bk-hero-copy,.bk-page--offer .bk-hero-photo,.bk-page--offer .bk-hero-side{grid-column:1;grid-row:auto}
  /* WEB-103 · en móvil la TARJETA sube por encima del párrafo largo, que repite los precios que
     la tarjeta ya muestra. El cliente de anuncios llega al titular y al booking sin scroll muerto
     (Randy: «que el cliente pueda acceder inmediatamente al proceso sin distracción»). */
  .bk-page--offer .bk-hero-copy{display:contents}
  .bk-page--offer .bk-hero-copy>.bk-kick{order:1}
  .bk-page--offer .bk-hero-copy>h1{order:2}
  .bk-page--offer .bk-hero-copy>.bk-hero-proof{order:3}
  .bk-page--offer .bk-hero-side{order:4}
  .bk-page--offer .bk-hero-copy>p{order:5;margin-top:4px}
  .bk-page--offer .bk-hero-photo{order:6;aspect-ratio:21/9;max-height:190px;min-height:0;align-self:start}
  .bk-page--offer .bk-hero-trust{grid-column:1;grid-row:auto;order:7}
  .bk-card--offer{padding:16px 14px}
  .bk-flat .bk-days{grid-template-columns:repeat(4,1fr)}
}
.bk-page--offer .bk-hero-photo .bk-hero-img{position:absolute;inset:0;object-position:50% 58%}   /* WEB-119 · el coche nuevo va centrado; en móvil (21:9) el frontal queda a la vista */

/* ════ 2026-10-02 · cupón SOTO15 · política de precio por condición del vehículo · casilla única (pedido del cliente) ════
   La política se ve SIEMPRE en una frase corta y el texto completo queda a un clic (<details>: teclado y lector de pantalla
   nativos). En /offer/ (tarjeta oscura) heredan la paleta de .bk-card--offer. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.bk-coupon{margin-top:14px}
.bk-coupon-toggle{background:none;border:0;padding:4px 0;font:inherit;font-size:13.5px;font-weight:800;color:#1437f5;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.bk-coupon-box{display:flex;gap:8px;margin-top:8px}
.bk-coupon-box .q-input{flex:1 1 auto;min-width:0;height:48px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.bk-coupon-box .bk-btn{flex:0 0 auto;white-space:nowrap;min-height:48px}
.bk-coupon-on{display:flex;align-items:center;gap:10px;margin-top:8px;padding:11px 14px;border-radius:12px;background:#ecfdf3;border:1px solid #a7f3d0;color:#065f46;font-size:14px;font-weight:900;letter-spacing:.02em}
.bk-coupon-on button{margin-left:auto;background:none;border:0;padding:4px 0;color:inherit;font:inherit;font-size:12.5px;font-weight:700;text-decoration:underline;cursor:pointer;white-space:nowrap}
.bk-coupon-msg{margin:6px 0 0;font-size:13px;font-weight:700;color:#c8102e}
.bk-policy{margin-top:12px;border-radius:12px;background:#f7f9fc;border:1px solid #e2e8f0;font-size:13px;line-height:1.5;color:#0a1420}
.bk-policy summary{list-style:none;cursor:pointer;display:flex;gap:12px;align-items:baseline;padding:11px 14px}
.bk-policy summary::-webkit-details-marker{display:none}
.bk-policy summary b{font-weight:900}
.bk-policy-more{margin-left:auto;flex:0 0 auto;color:#1437f5;font-weight:800;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.bk-policy[open] .bk-policy-more{opacity:.7}
.bk-policy-full{padding:0 14px 12px;color:#334155}
.bk-policy-full p{margin:0 0 6px}
.bk-policy--pay{margin-top:14px}
.bk-sum-row--coupon span:last-child,.bk-w3sum-coupon dd{color:#047857;font-weight:900}
.bk-card--offer .bk-coupon-toggle,.bk-card--offer .bk-policy-more{color:#9fb6ff}
.bk-card--offer .bk-coupon-on{background:rgba(16,185,129,.14);border-color:rgba(16,185,129,.4);color:#a7f3d0}
.bk-card--offer .bk-coupon-msg{color:#ff8a8a}
.bk-card--offer .bk-policy{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#dbe4ff}
.bk-card--offer .bk-policy-full{color:#c7d2fe}
.bk-card--offer .bk-w3sum-coupon dd{color:#6ee7b7}
@media (max-width:640px){.bk-policy summary{flex-wrap:wrap;gap:4px 12px}.bk-policy-more{margin-left:0}.bk-flat .bk-policy{font-size:12px}}

/* Casillas compactas, máx. 2-3 líneas (Randy 2026-10-03); el SMS en letra de aviso legal */
.bk-consent--sms{font-size:11px;line-height:1.45}
.bk-consent--sms b{font-weight:700}
.bk-consent .bk-ack-more{all:unset;cursor:pointer;font-weight:700;text-decoration:underline;color:#1437f5;white-space:nowrap}
.bk-consent .bk-ack-more:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:2px}
.bk-card--offer .bk-consent .bk-ack-more{color:#9fb6ff}
.bk-ack-txt:not([hidden]){display:block;margin-top:6px}

/* ── 2026-10-03 · /offer/ en 5 pasos (Carro · Extras · Cita · Datos · Pago) · Randy puntos 1-4 ── */
.bk-wiz3 .bk-w3rail{display:flex;gap:6px}
.bk-wiz3 .bk-w3tab{flex:1 1 0;min-width:0;white-space:nowrap}
.bk-wiz3 .bk-w3[hidden]{display:none!important}
.bk-wiz3 #bk-addons:not([hidden]){display:block!important}
.bk-wiz3 #bk-addons .bk-row-cta{display:none!important}
.bk-wiz3 #bk-date.bk-w3{margin-top:0}
.bk-wiz3 .bk-w3grp{display:block}
.bk-offer-not{display:block;margin-top:6px;color:#fdba74;font-size:12.5px;font-weight:700;line-height:1.45}
@media (max-width:600px){
  /* cinco pestañas no caben con nombre a 360-430 px: la activa lleva nombre, las demás solo su número */
  .bk-wiz3 .bk-w3tab{flex:0 0 40px;padding:0}
  .bk-wiz3 .bk-w3tab span{display:none}
  .bk-wiz3 .bk-w3tab.is-on{flex:1 1 auto;padding:0 12px}
  .bk-wiz3 .bk-w3tab.is-on span{display:inline}
}
/* el texto completo de la casilla («Más»): párrafos */
.bk-ack-p{display:block}
.bk-ack-p+.bk-ack-p{margin-top:6px}
/* paso de extras dentro de la tarjeta oscura de /offer/: el estilo claro de /book/ dejaba el nombre negro sobre negro */
.bk-wiz3 .bk-addons{grid-template-columns:1fr;gap:8px}
.bk-wiz3 .bk-addon{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);padding:10px 13px;border-radius:12px}
.bk-wiz3 .bk-addon:hover{transform:none;border-color:rgba(125,164,255,.5)}
.bk-wiz3 .bk-addon b{color:#fff;font-size:14.5px}
.bk-wiz3 .bk-addon small{color:#9aa9b8;font-size:12px}
.bk-wiz3 .bk-addon .bk-addon-price{color:#9fb6ff;font-size:15px}
.bk-wiz3 .bk-addon.on{background:rgba(36,77,255,.22);border-color:#7da4ff}

/* ── 2026-10-03 · Randy: «los precios de la primera tarjeta deben verse más llamativos, más premium» ──
   El paso 1 ya solo lleva el tamaño: cada tamaño es una tarjeta con su nombre en versalitas, el PRECIO grande y los
   modelos de referencia; elegida, se llena del azul de la marca con un check. */
.bk-wiz3 .bk-chips{gap:10px}
.bk-wiz3 .bk-size{position:relative;display:grid;justify-items:start;align-content:center;gap:0;min-height:104px;padding:14px 16px 13px;border-radius:16px;text-align:left;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(148,178,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:transform .2s ease,border-color .2s ease,background .25s ease,box-shadow .25s ease}
.bk-wiz3 .bk-size:hover{transform:translateY(-2px);border-color:rgba(125,164,255,.55)}
.bk-wiz3 .bk-size strong{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#aabbd6;white-space:nowrap}
.bk-wiz3 .bk-size strong::after{content:none}
.bk-wiz3 .bk-size .bk-size-price{display:block;margin-top:5px;font-size:32px;font-weight:900;letter-spacing:-.035em;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.bk-wiz3 .bk-size .bk-size-price::first-letter{font-size:.55em;vertical-align:.7em;margin-right:1px;color:#9fb6ff;font-weight:800}
.bk-wiz3 .bk-size small{display:block;margin-top:6px;font-size:11px;line-height:1.3;color:#7f90a8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bk-wiz3 .bk-size.on{background:linear-gradient(145deg,#3564ff,#1330d8);border-color:#9fb6ff;box-shadow:0 16px 34px rgba(20,55,245,.45),inset 0 1px 0 rgba(255,255,255,.26)}
.bk-wiz3 .bk-size.on strong{color:#dbe4ff}
.bk-wiz3 .bk-size.on .bk-size-price,.bk-wiz3 .bk-size.on .bk-size-price::first-letter{color:#fff}
.bk-wiz3 .bk-size.on small{color:#c7d6ff}
.bk-wiz3 .bk-size.on::after{content:"";display:block;position:absolute;right:12px;top:12px;width:22px;height:22px;border-radius:50%;box-shadow:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%231437f5' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
@media (max-width:640px){
  .bk-wiz3 .bk-size{min-height:98px;padding:13px 13px 12px}
  .bk-wiz3 .bk-size strong{font-size:11px}
  .bk-wiz3 .bk-size .bk-size-price{font-size:30px}
  .bk-wiz3 .bk-size small{font-size:10.5px}
}
/* orden visual nombre → precio → modelos (en el HTML los modelos van antes del precio) · el check abajo, sin tapar el nombre */
.bk-wiz3 .bk-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-wiz3 .bk-size strong{order:0;white-space:normal;line-height:1.25}
.bk-wiz3 .bk-size .bk-size-price{order:1}
.bk-wiz3 .bk-size small{order:2;white-space:normal;overflow:visible;text-overflow:clip}
.bk-wiz3 .bk-size.on::after{top:auto;bottom:12px}
.bk-wiz3 .bk-size.on::after{top:50%;bottom:auto;transform:translateY(-50%)}

