/* Service video layer. To revert to r5, replace index.html with ../revert/index_r5.html (index.html also carries has-v, vplate, vplay, vpause, the dialog, the video.css link and the video.js script); then video.css, lib/video.js and assets/ can be deleted. */
.has-v{position:relative;isolation:isolate;overflow:hidden}
.vplate{position:absolute;inset:0;z-index:-1;pointer-events:none;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 82%,transparent 100%)}
.vplate video{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s ease;filter:saturate(.85) contrast(1.05)}
.vplate video.ready{opacity:.55}
.vplate::after{content:"";position:absolute;inset:0;background:
 radial-gradient(120% 90% at 50% 50%,transparent 30%,var(--bg) 100%),
 linear-gradient(to bottom,rgba(17,21,31,.55),rgba(17,21,31,.35) 50%,rgba(17,21,31,.7));mix-blend-mode:normal}
.vplay{margin-top:var(--sp3);display:inline-flex;align-items:center;gap:.6em;min-height:44px;padding:.55em 1.1em;border-radius:999px;
 border:1px solid rgba(217,180,106,.55);background:rgba(17,21,31,.55);color:var(--ink);font:600 var(--s-1)/1.2 var(--f-ui);cursor:pointer;backdrop-filter:blur(6px)}
.vplay:hover{border-color:var(--brand);background:rgba(217,180,106,.14)}
.vplay:focus-visible,.vdlg button:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.vplay .vi{color:var(--brand);font-size:.8em}
.vplay [lang=en]{opacity:.75}
.vgrid{list-style:none;margin:var(--sp4) 0 0;padding:0;display:grid;gap:var(--sp3);grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr))}
.vcard{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r);aspect-ratio:16/10;border:1px solid var(--line);display:flex;align-items:flex-end}
.vcard .vplate{-webkit-mask-image:none;mask-image:none}
.vcard .vplate video.ready{opacity:.8}
.vcard .vplate::after{background:linear-gradient(to top,rgba(17,21,31,.92) 0,rgba(17,21,31,.35) 55%,rgba(17,21,31,.15)),radial-gradient(120% 100% at 50% 40%,transparent 50%,rgba(17,21,31,.6))}
.vc-in{padding:var(--sp3);width:100%}
.vc-in .en{text-align:right}
.vc-in h3{margin:.1em 0 0;font:700 var(--s2)/1.2 var(--f-disp);color:var(--ink)}
.vc-in .num{color:var(--brand);font:600 var(--s-1)/1 var(--f-en);letter-spacing:.1em}
.vc-in .en{margin:0;color:var(--mute);font-size:var(--s-1)}
.vc-in .vplay{margin-top:var(--sp2)}
.vdlg{border:0;padding:0;background:transparent;max-width:min(96vw,1100px);width:100%}
.vdlg::backdrop{background:rgba(8,10,16,.88);backdrop-filter:blur(4px)}
.vdlg video{display:block;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--r) var(--r) 0 0}
.vdlg-bar{display:flex;justify-content:space-between;gap:var(--sp2);padding:var(--sp2);background:var(--bg2);border-radius:0 0 var(--r) var(--r)}
.vdlg button{min-height:44px;padding:.4em 1em;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);font:600 var(--s-1)/1 var(--f-ui);cursor:pointer}
.vdlg .vlang button[aria-pressed=true]{border-color:var(--brand);color:var(--brand)}
@media (prefers-reduced-motion:reduce){.vplate video{transition:none}.vplate video.ready{opacity:.55}}
/* r-video: stronger text backing over video, pause control, transcript */
.vc-in{background:linear-gradient(to top,rgba(17,21,31,.9) 0,rgba(17,21,31,.84) calc(100% - var(--sp3)*1.6),rgba(17,21,31,0) 100%);padding-top:calc(var(--sp3)*2)}
.vcard .vplate video.ready{opacity:1}
.vcard .vplate::after{background:linear-gradient(to top,rgba(17,21,31,.5) 0,rgba(17,21,31,0) 60%)}
.vc-in h3,.vc-in .en,.vc-in .num{text-shadow:0 1px 3px rgba(0,0,0,.8)}
.vcard{aspect-ratio:auto;min-height:clamp(260px,22vw,340px)}
#warranty .card,#warranty .kicker,#warranty h2{background:rgba(17,21,31,.86);border-radius:var(--r)}
#warranty .kicker,#warranty h2{display:inline-block;padding:.15em .5em}
#warranty .vplay,.vpause{background:rgba(17,21,31,.9)}
.vpause{display:inline-flex;white-space:nowrap;line-height:1.2;align-items:center;gap:.5em;min-height:44px;margin:var(--sp2) 0 0;margin-inline-end:var(--sp2);padding:.45em 1em;border-radius:999px;border:1px solid var(--line);color:var(--ink);font:600 var(--s-1)/1.2 var(--f-ui);cursor:pointer}
.vpause:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.vpause .vi{font-size:.75em;color:var(--brand)}
.vtx{flex:1 1 100%;order:3;color:var(--ink);font-size:var(--s-1)}
.vtx summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:.5em}
.vtx-l{margin:0;padding-inline-start:1.2em;line-height:1.6}
.vdlg-bar{flex-wrap:wrap}
.vdlg video::cue{background:rgba(0,0,0,.8);color:#fff;font-size:1.05em}
/* QA fixes */
.vpause[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){.vpause{display:none!important}}
.vdlg video{aspect-ratio:16/10;object-fit:contain;object-position:50% 0}
@media (max-width:600px){.vdlg video{aspect-ratio:16/11.2}}
.vtx .prop{display:block;margin:.2em 0 .4em;color:var(--mute);font-size:.8em;font-style:italic}