/* Material illustrations, independent of the real shop photographs and films. */
.code-study{position:relative;isolation:isolate;min-width:0}
.material-playground{overflow:hidden;background:#070a07;border:1px solid #526344;margin:25px 0 18px;--paint-light:48%;--glass-shade:.5}
.study-kicker{position:absolute;z-index:3;inset:14px 16px auto;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#b3bda9;font-size:7px;line-height:1.4;letter-spacing:.1em;font-weight:700;pointer-events:none}
.study-kicker>span:last-child{color:var(--lime)}
.paint-scene{height:240px;position:relative;overflow:hidden;background:radial-gradient(ellipse at var(--paint-light) 15%,#75806444,transparent 61%),#070a07;touch-action:pan-y}
.paint-surface{position:absolute;width:152%;height:160%;left:-21%;top:27%;border-radius:50%;transform:rotate(-15deg);background:linear-gradient(176deg,#9ca592 0,#313b29 1.2%,#080c07 3%,#030603 20%,#17200e 59%,#030503 89%);box-shadow:0 -2px 9px #e9f6d134,inset 0 1px #f3ffe7a8}
.paint-surface::after{content:'';position:absolute;inset:30% 0 0;border-radius:50%;border-top:1px solid #b6ef385e;box-shadow:0 -4px 25px #b6ef3814}
.inspection-lines{position:absolute;left:calc(var(--paint-light) - 37%);top:12%;width:74%;height:92%;overflow:visible;filter:drop-shadow(0 0 4px #edffe833);opacity:.8;pointer-events:none}
.inspection-lines path{fill:none;stroke:#e7f1dd;stroke-width:1.3;vector-effect:non-scaling-stroke}
.inspection-lines path:nth-child(2){stroke-width:4;opacity:.8}.inspection-lines path:nth-child(3){opacity:.36}
.paint-bloom{position:absolute;left:calc(var(--paint-light) - 25%);top:30%;width:50%;height:70%;transform:rotate(-15deg);background:radial-gradient(ellipse at 50% 0,#edffe735,transparent 70%);mix-blend-mode:screen;pointer-events:none}
.paint-beads{position:absolute;inset:0;pointer-events:none}.paint-beads i{position:absolute;display:block;width:8px;height:6px;border-radius:48% 48% 43% 43%;transform:rotate(-16deg);background:radial-gradient(ellipse at 30% 15%,#f7fff1ae 0,#ccd8b752 14%,#080d0722 46%,#040803ee 71%);border:1px solid #b8c4a84d;box-shadow:1px 2px 3px #0009,inset -1px -1px 1px #dbeac533}
.paint-beads i:nth-child(1){left:19%;top:57%}.paint-beads i:nth-child(2){left:34%;top:49%;width:12px;height:9px}.paint-beads i:nth-child(3){left:67%;top:63%;width:13px;height:10px}.paint-beads i:nth-child(4){left:74%;top:44%;width:6px;height:5px}.paint-beads i:nth-child(5){left:45%;top:74%;width:6px;height:5px}.paint-beads i:nth-child(6){left:53%;top:57%}.paint-beads i:nth-child(7){left:85%;top:77%}.paint-beads i:nth-child(8){left:28%;top:81%;width:5px;height:4px}.paint-beads i:nth-child(9){left:58%;top:85%;width:10px;height:7px}
.paint-edge-label{position:absolute;bottom:14px;left:16px;font-family:var(--display);font-weight:700;line-height:.9;font-size:33px;letter-spacing:-.01em;color:#c3d5af77;pointer-events:none}
.material-controls{position:relative;z-index:3;padding:14px 16px 13px;border-top:1px solid #47573b70;background:#10170c;line-height:1.5}
.material-controls label{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#dbe6d1;font-size:10px;letter-spacing:0;font-weight:600}
.material-controls label>span:last-child{color:var(--lime);font-size:18px;font-weight:400}
.material-range{appearance:none;-webkit-appearance:none;width:100%;height:44px;display:block;margin:0;cursor:ew-resize;background:transparent;touch-action:pan-y;accent-color:var(--lime)}
.material-range::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,#57654b,var(--lime));border-radius:2px}
.material-range::-moz-range-track{height:2px;background:#79975a;border-radius:2px}
.material-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:4px solid #10170c;border-radius:50%;margin-top:-8px;background:var(--lime);box-shadow:0 0 0 1px #b6ef3888}
.material-range::-moz-range-thumb{width:12px;height:12px;border:3px solid #10170c;border-radius:50%;background:var(--lime);box-shadow:0 0 0 1px #b6ef3888}
.material-range:focus-visible{outline:2px solid var(--lime);outline-offset:1px;border-radius:3px}
.study-note{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#a6b39a;line-height:1.6;font-weight:400;letter-spacing:0}
.motion-ready .paint-study.effect-in-view .paint-intro{animation:inspection-entry 3.5s cubic-bezier(.2,.65,.3,1) both}
@keyframes inspection-entry{from{transform:translateX(-20%);opacity:.1}to{transform:translateX(0);opacity:1}}
/* A shade illustration, never a tint percentage or a photograph of a tint job. */
.tint-with-glass{display:grid;grid-template-columns:36px .74fr 1.35fr;gap:20px 34px;padding:65px 0 0;align-items:start}
.tint-with-glass .tint-option-index{grid-column:1;grid-row:1/4}
.tint-with-glass>.tint-copy{grid-column:2;grid-row:1}
.tint-with-glass h3{font-size:clamp(37px,4.8vw,72px);line-height:.9}
.tint-with-glass h3 em{display:block}
.tint-with-glass>p{grid-column:2;grid-row:2;font-size:12px;max-width:260px;align-self:start}
.tint-with-glass>a{grid-column:2;grid-row:3;max-width:260px;width:100%;margin:0;align-self:start}
.tint-with-glass>.glass-study{display:flex;flex-direction:column;grid-column:3;grid-row:1/4;margin:0;width:100%;align-self:stretch}
.glass-scene{position:relative;min-height:240px;flex:1;overflow:hidden;background:radial-gradient(ellipse at 70% 0,#42513666,transparent 65%),#080c07}
.glass-drawing{display:block;position:absolute;inset:0;width:100%;height:100%}
.tint-film{fill:#010501;opacity:var(--glass-shade)}
.glass-glint{position:absolute;left:50%;top:-35%;width:8%;height:170%;transform:skewX(-28deg);background:linear-gradient(90deg,transparent,#f2ffe648,transparent);mix-blend-mode:screen;opacity:.4;pointer-events:none}
.shade-ends{display:flex;justify-content:space-between;margin:-2px 0 8px;font-size:8px;color:#bdc9b2;font-weight:500;letter-spacing:0}
.motion-ready .glass-study.effect-in-view .glass-glint{animation:glass-pass 3.8s cubic-bezier(.2,.65,.3,1) both}
@keyframes glass-pass{0%{transform:translateX(-450%) skewX(-28deg);opacity:0}18%{opacity:.7}100%{transform:translateX(550%) skewX(-28deg);opacity:0}}
/* The closing area is a lit arrival bay with direct service-specific destinations. */
.finish-closing{position:relative;isolation:isolate;overflow:hidden;background:#080c07;color:var(--paper);padding-top:0;border-top:1px solid #465538;--book-x:60%;--book-y:50%}
.finish-closing::before{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse at var(--book-x) var(--book-y),#b6ef381b,transparent 57%)}
.finish-closing .booking-cinema{display:block;height:190px;overflow:hidden;margin:0 calc(var(--pad)*-1) 35px;padding:0;border:0;background:linear-gradient(#050805,#0b1008)}
.booking-bay{position:absolute;inset:0;width:100%;height:100%;opacity:.9}
.bay-perspective{transform-origin:50% 0}.bay-perspective path{fill:none;stroke:#5b7743;stroke-width:.7;vector-effect:non-scaling-stroke}.bay-perspective .bay-guide{stroke:#b6ef38;stroke-width:1.3}
.booking-cinema::after{content:'';position:absolute;inset:0;background:linear-gradient(#080c0700 55%,#080c07)}
.booking-slash{position:absolute;top:40px;left:calc(50% - 12px);width:24px;height:85px;transform:skewX(-24deg);background:var(--lime);box-shadow:0 0 38px #b6ef3840}
.booking-cinema .booking-lintel{position:absolute;left:15%;right:15%;height:1px;top:32px;background:linear-gradient(90deg,transparent,#d7f2bd99 35%,#d7f2bd99 65%,transparent);box-shadow:0 0 14px #b6ef3844}
.motion-ready .booking-cinema.effect-in-view .bay-perspective{animation:bay-arrival 3.7s cubic-bezier(.2,.65,.3,1) both}
.motion-ready .booking-cinema.effect-in-view .booking-slash{animation:booking-mark 2.8s cubic-bezier(.2,.7,.3,1) both}
@keyframes bay-arrival{from{transform:scaleY(.4);opacity:0}to{transform:scaleY(1);opacity:1}}
@keyframes booking-mark{from{clip-path:inset(100% 0 0);transform:translateY(12px) skewX(-24deg)}to{clip-path:inset(0);transform:translateY(0) skewX(-24deg)}}
.finish-closing .closing-top{padding-bottom:28px;color:#bdc8b1}
.finish-closing .closing-top>.eyebrow{color:var(--lime)}
.finish-closing .booking-options{display:flex;justify-content:flex-start;gap:9px;flex-wrap:wrap;border:0;padding:0;margin:0 0 35px;font-family:var(--sans);letter-spacing:0}
.finish-closing .booking-options[hidden]{display:none}
.paint-intro{position:absolute;inset:0;pointer-events:none}
.booking-options button{min-height:46px;padding:11px 20px;background:#0c1309;border:1px solid #536444;border-radius:2px;font-size:11px;line-height:1.3;font-weight:600;color:#bfcbb2;transition:background .2s,color .2s,border-color .2s}
.booking-options button:hover{border-color:var(--lime);color:var(--paper)}
.booking-options button[aria-pressed="true"]{color:#111810;background:var(--lime);border-color:var(--lime)}
.finish-closing>.closing-book{position:relative;z-index:1;margin:0;padding-bottom:32px}
.finish-closing .closing-book h2{font-size:clamp(80px,12.5vw,200px);line-height:.87}
.finish-closing .closing-book h2 em{color:var(--lime)}
.finish-closing .closing-book>.closing-arrow{color:var(--lime);font-size:clamp(100px,15vw,230px);margin-top:-5px;transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.finish-closing .closing-book:hover>.closing-arrow{transform:translate(9px,-9px)}
.finish-closing .closing-book:focus-visible{outline-color:var(--lime)}
.finish-closing .closing-bottom{border-color:#55674480;min-height:87px;gap:35px}
.finish-closing .closing-bottom>p{max-width:450px;color:#bcc8b0}
.finish-closing .closing-small-book{color:var(--lime)}
.finish-closing .closing-bottom>.closing-small-book>[data-booking-action]{font-family:var(--sans);font-size:12px;font-weight:700;line-height:1.5}
.finish-closing :focus-visible{outline-color:var(--lime)}
.effects-suspended .effect-in-view *{animation-play-state:paused!important}
@media(min-width:761px) and (max-width:1100px){.tint-with-glass{grid-template-columns:28px .85fr 1.25fr;gap:18px 22px;padding-top:45px}.tint-with-glass h3{font-size:5vw}.glass-scene{min-height:255px}.paint-scene{height:210px}.study-kicker{font-size:6px;inset:12px 12px auto}.material-controls{padding-inline:12px}.paint-edge-label{font-size:29px}.booking-options button{padding-inline:16px}}
@media(max-width:760px){.material-playground{margin:21px 0 18px}.paint-scene{height:215px}.study-kicker{font-size:6px;inset:12px 12px auto}.study-kicker>span:last-child{letter-spacing:.04em}.paint-edge-label{font-size:32px;left:12px}.material-controls{padding:12px}.material-controls label{font-size:10px}.study-note{font-size:9px;gap:8px}.tint-with-glass{grid-template-columns:24px 1fr;gap:20px 16px;padding:38px 0 0}.tint-with-glass .tint-option-index{grid-column:1;grid-row:1}.tint-with-glass>.tint-copy{grid-column:2;grid-row:1}.tint-with-glass h3{font-size:48px}.tint-with-glass h3 em{display:inline}.tint-with-glass>.glass-study{grid-column:1/3;grid-row:2;margin:0}.glass-scene{min-height:230px}.tint-with-glass>p{grid-column:2;grid-row:3;max-width:300px}.tint-with-glass>a{grid-column:2;grid-row:4;max-width:270px;min-width:0}.finish-closing{padding-top:0}.finish-closing .booking-cinema{height:150px;margin-bottom:26px}.booking-slash{top:28px;width:21px;height:73px}.booking-cinema .booking-lintel{top:23px;left:8%;right:8%}.finish-closing .closing-top{padding-bottom:22px}.finish-closing .booking-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:32px}.booking-options button{min-height:46px;padding:11px 6px;font-size:10px}.finish-closing .closing-book h2{font-size:16.4vw;line-height:.91;width:100%}.finish-closing .closing-book>.closing-arrow{font-size:16vw;top:0;right:0;margin:0}.finish-closing>.closing-book{padding-bottom:29px}.finish-closing .closing-bottom{min-height:0;padding-top:21px}.finish-closing .closing-bottom>p{font-size:11px;min-height:40px}.finish-closing .closing-bottom>.closing-small-book{margin-top:13px;font-size:10px}}
@media(max-width:380px){.paint-scene{height:195px}.paint-edge-label{font-size:28px}.study-kicker{font-size:5.5px;gap:8px}.material-controls{padding-inline:10px}.study-note{font-size:8px}.tint-with-glass h3{font-size:39px}.glass-scene{min-height:205px}.finish-closing .closing-book h2{font-size:16vw}.booking-options button{font-size:9px}}
@media(prefers-reduced-motion:reduce){.code-study,.code-study *, .finish-closing *{animation:none!important;transition:none!important}.inspection-lines,.paint-intro,.bay-perspective{transform:none}.glass-glint{display:none}.booking-slash{clip-path:none}.finish-closing .closing-book:hover>.closing-arrow{transform:none}}