/* Full-screen protection story. All rules stay inside this component. */
.protection-cinema{--pc-header:90px;--pc-height:calc(100svh - var(--pc-header));--pc-ink:#294438;--pc-muted:#607063;--pc-paper:#eeeee7;--pc-clay:#b36b4c;--pc-progress:0;background:var(--pc-paper);color:var(--pc-ink);width:100%;position:relative;isolation:isolate;scroll-margin-top:var(--pc-anchor-margin,0px)}
.protection-cinema,.protection-cinema *{box-sizing:border-box}
.protection-cinema .pc-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.protection-cinema .pc-track{position:relative;width:100%}
.protection-cinema .pc-stage{position:relative;width:100%;background:var(--pc-paper)}
.protection-cinema .pc-scenes{position:relative;width:100%}
.protection-cinema .pc-scene{--pc-phase:1;--pc-join:0;display:grid;grid-template-rows:auto minmax(340px,1fr);min-height:max(680px,var(--pc-height));width:100%;padding:30px clamp(18px,3.5vw,62px) 26px;position:relative;margin:0;scroll-margin-top:var(--pc-anchor-margin,0px)}
.protection-cinema .pc-copy{width:min(1050px,100%);margin:0 auto;text-align:center;position:relative;z-index:3}
.protection-cinema .pc-eyebrow{font-size:10px;font-weight:700;line-height:1.5;letter-spacing:.13em;text-transform:uppercase;margin:0 0 11px;color:#64765e}
.protection-cinema .pc-copy h3{font-family:Georgia,'Times New Roman',serif;font-size:clamp(40px,4.8vw,76px);font-weight:400;letter-spacing:-.052em;line-height:1.02;margin:0 0 13px;color:var(--pc-ink);text-wrap:balance}
.protection-cinema .pc-copy>p:not(.pc-eyebrow):not(.pc-scroll-cue){font-size:clamp(13px,1.12vw,16px);line-height:1.6;max-width:720px;margin:0 auto;color:#596a5d;text-wrap:balance}
.protection-cinema .pc-scroll-cue{font-size:10px;line-height:1.4;margin:11px 0 0;color:#677861;letter-spacing:.035em}
.protection-cinema .pc-scroll-cue span{display:inline-block;margin-left:7px}
.protection-cinema .pc-visual{display:grid;place-items:center;width:min(1440px,100%);height:100%;min-height:0;margin:0 auto;position:relative;pointer-events:none}
.protection-cinema .pc-assembly{position:relative;width:100%;height:100%;min-height:340px;--pc-separation:clamp(82px,21vw,290px)}
.protection-cinema .pc-piece{position:absolute;left:50%;top:50%;height:90%;width:auto;max-width:65%;aspect-ratio:3/4;filter:drop-shadow(0 20px 20px #263d2a18);transform:translate(-50%,-50%);will-change:transform,opacity}
.protection-cinema .pc-piece img{width:100%;height:100%;display:block;object-fit:contain}
.protection-cinema .pc-piece-shell{z-index:2;transform:translate(calc(-50% - (1 - var(--pc-join))*var(--pc-separation)),-50%) rotate(calc((1 - var(--pc-join))*-6deg));opacity:clamp(0,calc((.94 - var(--pc-join))/.2),1)}
.protection-cinema .pc-piece-liner{z-index:1;transform:translate(calc(-50% + (1 - var(--pc-join))*var(--pc-separation)),-50%) rotate(calc((1 - var(--pc-join))*6deg));opacity:clamp(0,calc((.94 - var(--pc-join))/.2),1)}
.protection-cinema .pc-piece-assembled{z-index:3;opacity:clamp(0,calc((var(--pc-join) - .72)/.2),1);transform:translate(-50%,-50%)}
.protection-cinema .pc-material{position:absolute;z-index:4;top:0;max-width:42%;text-align:center;color:#4d6350;line-height:1.4;transform:translateX(-50%);opacity:clamp(0,calc(1 - var(--pc-join)*1.8),1)}
.protection-cinema .pc-material-shell{left:calc(50% - var(--pc-separation))}.protection-cinema .pc-material-liner{left:calc(50% + var(--pc-separation))}
.protection-cinema .pc-material strong{display:block;font-size:11px;letter-spacing:.06em;margin-bottom:3px}
.protection-cinema .pc-material span{display:block;font-size:12px}
.protection-cinema .pc-material:after{content:'';display:block;width:1px;height:21px;margin:8px auto 0;background:#81927680}
.protection-cinema .pc-joined-caption{position:absolute;bottom:0;left:12px;right:12px;font-size:11px;text-align:center;line-height:1.5;color:#61725e;opacity:var(--pc-join)}
.protection-cinema .pc-diagram{position:relative;aspect-ratio:4/3;width:min(100%,calc((var(--pc-height) - 235px)*1.333333));max-height:100%;margin:0 auto;isolation:isolate}
.protection-cinema .pc-diagram>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.protection-cinema .pc-diagram>svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.protection-cinema .pc-diagram svg path,.protection-cinema .pc-diagram svg circle,.protection-cinema .pc-diagram svg line,.protection-cinema .pc-diagram svg rect{vector-effect:non-scaling-stroke}
.protection-cinema .pc-trace,.protection-cinema .pc-leader,.protection-cinema .pc-gap-arrow,.protection-cinema .pc-energy,.protection-cinema .pc-impact-wave{fill:none;stroke-linecap:round;stroke-linejoin:round}
.protection-cinema .pc-trace{stroke:#466b50;stroke-width:2.4;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--pc-phase));filter:drop-shadow(0 0 2px #eeeee7)}
.protection-cinema .pc-trace-under{fill:none;stroke:#f6f3e9;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.protection-cinema .pc-leader{stroke:#526f51;stroke-width:1.2;opacity:.9}
.protection-cinema .pc-point{fill:#f5f2e7;stroke:#4e6c4e;stroke-width:1.7}
.protection-cinema .pc-energy{stroke:var(--pc-clay);stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--pc-phase));opacity:.9}
.protection-cinema .pc-impact-wave{stroke:var(--pc-clay);stroke-width:1.5;opacity:calc(.85 - var(--pc-phase)*.3);transform-origin:510px 590px;transform:scale(calc(.6 + var(--pc-phase)*.4))}
.protection-cinema .pc-gap-highlight{fill:#b6caa54d;stroke:none;opacity:calc(.35 + var(--pc-phase)*.65)}
.protection-cinema .pc-gap-arrow{stroke:#44694d;stroke-width:1.9;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--pc-phase))}
.protection-cinema .pc-tag{position:absolute;z-index:3;max-width:35%;font-size:clamp(10px,1vw,13px);line-height:1.35;font-weight:650;color:#3f5b43;background:#eeeee7e8;border-radius:5px;padding:5px 8px;box-shadow:0 0 18px #eeeee770}
.protection-cinema .pc-tag-impact{left:49%;top:39%}.protection-cinema .pc-tag-impact-pc{left:64%;top:61%}
.protection-cinema .pc-tag-screen-edge{left:21%;top:40%}.protection-cinema .pc-tag-screen-gap{left:60%;top:70%}
.protection-cinema .pc-tag-camera-edge{left:21%;top:37%}.protection-cinema .pc-tag-camera-gap{left:61%;top:69%}
.protection-cinema .pc-visual-caption{position:absolute;left:20px;right:20px;bottom:0;text-align:center;font-size:10px;line-height:1.4;color:#6a7a64;margin:0}
.protection-cinema .pc-nav{display:none}
.protection-cinema.is-ready .pc-track{height:calc(var(--pc-height)*5)}
.protection-cinema.is-ready .pc-stage{position:sticky;top:var(--pc-header);height:var(--pc-height);display:grid;grid-template-rows:minmax(0,1fr) 66px;overflow:hidden}
.protection-cinema.is-ready .pc-scenes{height:100%;min-height:0}
.protection-cinema.is-ready .pc-scene{position:absolute;inset:0;height:100%;min-height:0;padding-top:clamp(20px,3.5vh,38px);padding-bottom:12px;opacity:0;pointer-events:none;will-change:opacity}
.protection-cinema.is-ready .pc-scene:first-child{opacity:1}
.protection-cinema.is-ready .pc-assembly{min-height:0}
.protection-cinema.is-ready .pc-nav{display:flex;align-items:center;justify-content:center;gap:5px;position:relative;z-index:5;width:100%;padding:4px 18px 12px;background:var(--pc-paper)}
.protection-cinema .pc-nav button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 17px;margin:0;border:0;border-radius:99px;background:transparent;color:#6d7c67;font:inherit;font-size:11px;line-height:1.3;cursor:pointer}
.protection-cinema .pc-nav button>span{display:grid;place-items:center;width:23px;height:23px;flex:0 0 23px;border:1px solid #abb5a3;border-radius:50%;font-size:10px}
.protection-cinema .pc-nav button[aria-current="step"]{background:#dde4d6;color:#2c4b36}
.protection-cinema .pc-nav button[aria-current="step"]>span{background:#365a40;border-color:#365a40;color:#fff8e9}
.protection-cinema .pc-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#c6cebd}
.protection-cinema .pc-progress>span{display:block;width:calc(var(--pc-progress)*100%);height:100%;background:#416749}
.protection-cinema .pc-nav :focus-visible,.protection-cinema .pc-after a:focus-visible{outline:3px solid #ff2b62;outline-offset:3px}
.protection-cinema .pc-after{padding:25px max(24px,calc((100vw - 1200px)/2)) 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid #d9ddcf;background:#e6e9df}
.protection-cinema .pc-after p{font-size:11px;line-height:1.6;max-width:680px;margin:0;color:#66745f}
.protection-cinema .pc-shop-link{display:inline-flex;align-items:center;justify-content:space-between;gap:27px;min-height:46px;flex-shrink:0;font-size:12px;font-weight:650;padding:12px 17px;border-radius:5px;color:#fff8ec;background:#2c4a37}
.protection-cinema .pc-shop-link svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.protection-cinema:not(.is-ready) .pc-scene{border-bottom:1px solid #d9ddcf}
.protection-cinema:not(.is-ready) .pc-visual{min-height:420px}
.protection-cinema:not(.is-ready) .pc-diagram{width:min(1050px,100%)}
@media(max-width:760px){
 .protection-cinema{--pc-header:78px}
 .protection-cinema .pc-scene{padding:24px 18px 28px;grid-template-rows:auto minmax(320px,1fr);min-height:max(650px,var(--pc-height))}
 .protection-cinema .pc-copy{max-width:550px}
 .protection-cinema .pc-eyebrow{font-size:8px;letter-spacing:.12em;margin-bottom:10px}
 .protection-cinema .pc-copy h3{font-size:clamp(35px,8.9vw,51px);line-height:1.03;margin-bottom:12px}
 .protection-cinema .pc-copy>p:not(.pc-eyebrow):not(.pc-scroll-cue){font-size:12px;line-height:1.55;max-width:450px}
 .protection-cinema .pc-scroll-cue{font-size:9px;margin-top:10px}
 .protection-cinema.is-ready .pc-stage{grid-template-rows:minmax(0,1fr) 61px}
 .protection-cinema.is-ready .pc-scene{padding:21px 14px 10px;grid-template-rows:auto minmax(0,1fr)}
 .protection-cinema .pc-piece{height:88%;max-width:67%;filter:drop-shadow(0 12px 12px #263d2a17)}
 .protection-cinema .pc-assembly{--pc-separation:22vw}
 .protection-cinema .pc-material{top:2%;max-width:44%}
 .protection-cinema .pc-material strong{font-size:9px}.protection-cinema .pc-material span{font-size:10px}
 .protection-cinema .pc-material:after{height:14px;margin-top:6px}
 .protection-cinema .pc-joined-caption{font-size:10px;bottom:3%}
 .protection-cinema .pc-diagram{width:100%;max-width:600px}
 .protection-cinema .pc-tag{font-size:9px;padding:4px 6px;max-width:38%}
 .protection-cinema .pc-visual-caption{font-size:9px;left:8px;right:8px;bottom:3px}
 .protection-cinema.is-ready .pc-nav{padding:3px 8px 10px;gap:2px}
 .protection-cinema .pc-nav button{font-size:10px;gap:5px;padding:7px 9px}
 .protection-cinema .pc-nav button>span{width:21px;height:21px;flex-basis:21px;font-size:9px}
 .protection-cinema .pc-after{display:block;padding:20px 24px 25px}
 .protection-cinema .pc-after p{font-size:10px;line-height:1.6}
 .protection-cinema .pc-shop-link{margin-top:16px;font-size:11px}
 .protection-cinema:not(.is-ready) .pc-visual{min-height:360px}
}
@media(max-width:360px){
 .protection-cinema.is-ready .pc-scene{padding-inline:12px}
 .protection-cinema .pc-copy h3{font-size:33px}
 .protection-cinema .pc-copy>p:not(.pc-eyebrow):not(.pc-scroll-cue){font-size:11.5px}
 .protection-cinema .pc-nav button{font-size:9px;gap:4px;padding-inline:6px}
 .protection-cinema .pc-nav button>span{width:19px;height:19px;flex-basis:19px}
}
@media(max-height:760px) and (min-width:761px){
 .protection-cinema.is-ready .pc-scene{padding-top:18px}
 .protection-cinema .pc-copy h3{font-size:48px;line-height:1;margin-bottom:10px}
 .protection-cinema .pc-eyebrow{font-size:9px;margin-bottom:8px}
 .protection-cinema .pc-copy>p:not(.pc-eyebrow):not(.pc-scroll-cue){font-size:13px}
 .protection-cinema .pc-scroll-cue{font-size:9px;margin-top:7px}
}
@media(prefers-reduced-motion:reduce){
 .protection-cinema *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
 .protection-cinema .pc-piece,.protection-cinema .pc-scene{will-change:auto}
 .protection-cinema .pc-trace,.protection-cinema .pc-energy,.protection-cinema .pc-gap-arrow{stroke-dashoffset:0}
 .protection-cinema .pc-impact-wave{transform:none;opacity:.7}
}



.protection-cinema .pc-assembly{overflow:hidden}
.protection-cinema .pc-copy h3 br{display:none}
.protection-cinema .pc-copy h3{font-size:clamp(40px,4.1vw,66px)}
@supports(width:1cqw){.protection-cinema .pc-visual{container-type:size}}
@media(max-width:760px){.protection-cinema .pc-copy h3 br{display:block}.protection-cinema .pc-copy h3{font-size:clamp(33px,8.9vw,48px)}}
/* Two intact product pieces: no cutaway, invented hardware or material deformation. */
.protection-cinema .pc-material-visual{grid-template-rows:minmax(0,1fr) 22px;gap:8px;padding-top:10px}
.protection-cinema .pc-material-demo{width:min(940px,100%);height:100%;min-height:0;position:relative;margin:0 auto}
.protection-cinema .pc-material-card{position:absolute;display:grid;grid-template-rows:39px minmax(0,1fr) 24px;min-height:0;text-align:center}
.protection-cinema .pc-material-card-shell{left:8%;bottom:0;width:35%;height:77%;transform:translateX(calc(var(--pc-phase)*-14px));opacity:.86}
.protection-cinema .pc-material-card-liner{right:8%;top:0;bottom:0;width:47%}
.protection-cinema .pc-material-name{margin:0;align-self:center;line-height:1.3;color:var(--pc-ink)}
.protection-cinema .pc-material-name strong{display:block;font-size:12px;letter-spacing:.1em}
.protection-cinema .pc-material-name span{display:block;font-size:12px;margin-top:3px}
.protection-cinema .pc-material-art{height:100%;min-height:0;position:relative}
.protection-cinema .pc-material-artwork{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 12px 14px #263d2a12)}
.protection-cinema .pc-material-artwork image{image-rendering:auto}
.protection-cinema .pc-material-note{align-self:end;font-size:11px;line-height:1.3;color:var(--pc-muted);margin:0}
.protection-cinema .pc-material-card-liner .pc-material-note{color:var(--pc-ink);font-weight:650}
.protection-cinema .pc-material-legend{position:static;align-self:center;margin:0;color:var(--pc-muted);font-size:10px;line-height:1.3;text-align:center}
.protection-cinema .pc-material-corner-base,.protection-cinema .pc-material-corner-line{fill:none;stroke-linejoin:round;stroke-linecap:round}
.protection-cinema .pc-material-corner-base{stroke:var(--pc-paper);stroke-width:12;opacity:.7}
.protection-cinema .pc-material-corner-line{stroke:#85a178;stroke-width:5;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--pc-phase))}
.protection-cinema .pc-material-dots{fill:#f8f5e9;stroke:#6c8c61;stroke-width:4;opacity:calc(.2 + var(--pc-phase)*.8)}
@media(max-width:760px){
 .protection-cinema .pc-material-visual{padding-top:14px;grid-template-rows:minmax(0,1fr) 20px;gap:5px}
 .protection-cinema .pc-material-card{grid-template-rows:38px minmax(0,1fr) 26px}
 .protection-cinema .pc-material-card-shell{left:0;width:37%;height:73%;bottom:3%;transform:translateX(calc(var(--pc-phase)*-4px))}
 .protection-cinema .pc-material-card-liner{right:0;width:55%}
 .protection-cinema .pc-material-name strong{font-size:10px}
 .protection-cinema .pc-material-name span{font-size:10px;margin-top:2px}
 .protection-cinema .pc-material-note{font-size:9px}
 .protection-cinema .pc-material-legend{font-size:9px}
 .protection-cinema .pc-material-artwork{filter:drop-shadow(0 8px 9px #263d2a12)}
}
@media(prefers-reduced-motion:reduce){
 .protection-cinema .pc-material-card-shell{transform:none}
 .protection-cinema .pc-material-corner-line{stroke-dashoffset:0}
 .protection-cinema .pc-material-dots{opacity:1}
}

/* Full product -> close view. The view changes; the product does not deform. */
.protection-cinema .pc-macro-visual {
  --pc-detail: clamp(0, calc((var(--pc-phase, 1) - .24) * 10), 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: min(1440px, 100%);
  height: 100%;
  min-height: 0;
  margin: 0 auto;
  padding: 8px 0;
  container-type: normal;
  pointer-events: none;
}
.protection-cinema .pc-macro-frame {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: min(100%, 960px);
  aspect-ratio: var(--pc-macro-ratio, 1.333333333);
  min-height: 0;
  position: relative;
  overflow: visible;
}
.protection-cinema .pc-macro-overview,
.protection-cinema .pc-macro-detail {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
}
.protection-cinema .pc-macro-overview {
  object-fit: contain;
  object-position: center;
  opacity: calc(1 - var(--pc-detail));
}
.protection-cinema .pc-macro-detail { opacity: var(--pc-detail); }
.protection-cinema .pc-macro-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  object-fit: contain;
  object-position: center;
  border: 0;
  border-radius: 14px;
}
.protection-cinema .pc-macro-caption {
  position: static;
  margin: 0;
  padding: 0 8px;
  font-size: 11px;
  line-height: 1.4;
  text-align: center;
  color: #637263;
}
.protection-cinema.is-ready .pc-macro-visual { container-type: size; }
@supports (width: 1cqw) {
  .protection-cinema.is-ready .pc-macro-frame {
    width: min(100cqw, calc((100cqh - 40px) * var(--pc-macro-ratio, 1.333333333)));
  }
}
@media (max-width: 760px) {
  .protection-cinema .pc-macro-visual {
    width: 100%;
    justify-content: flex-start;
    padding-block: 8px;
    gap: 8px;
  }
  .protection-cinema .pc-macro-frame {
    width: min(100%, 360px);
    aspect-ratio: var(--pc-macro-mobile-ratio, .666666667);
  }
  .protection-cinema .pc-macro-caption { font-size: 10px; padding-inline: 0; }
  .protection-cinema .pc-scene[data-pc-scene="screen"] .pc-copy h3,
  .protection-cinema .pc-scene[data-pc-scene="camera"] .pc-copy h3 {
    font-size: clamp(29px, 8.2vw, 42px);
    margin-bottom: 9px;
    line-height: 1.03;
  }
  @supports (width: 1cqw) {
    .protection-cinema.is-ready .pc-macro-frame {
      width: min(100cqw, calc((100cqh - 36px) * var(--pc-macro-mobile-ratio, .666666667)));
    }
  }
}
/* Without scroll animation, the explanatory close view is immediately visible. */
.protection-cinema:not(.is-ready) .pc-macro-visual {
  --pc-detail: 1;
  height: auto;
  min-height: 0;
  align-self: start;
  container-type: normal;
}
.protection-cinema:not(.is-ready) .pc-macro-frame { width: min(100%, 800px); }
.protection-cinema:not(.is-ready) .pc-macro-overview { display: none; }
.protection-cinema:not(.is-ready) .pc-macro-cue { display: none; }
@media (max-width: 760px) {
  .protection-cinema:not(.is-ready) .pc-macro-frame { width: min(100%, 360px); }
}
@media (prefers-reduced-motion: reduce) {
  .protection-cinema .pc-macro-visual { --pc-detail: 1; }
  .protection-cinema .pc-macro-overview { display: none; }
}

.protection-cinema:not(.is-ready) .pc-joined-caption{opacity:1}

/* Scroll movement of the two complete pieces; no simulated material deformation. */
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-demo {
  perspective: 1200px;
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card {
  transform-origin: center;
  will-change: transform;
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card-shell {
  --pc-impact-angle: calc(-7deg + var(--pc-phase, 1) * 10deg);
  left: 7%;
  bottom: 7%;
  width: 34%;
  height: 76%;
  opacity: .92;
  transform: translate3d(calc(34px - var(--pc-phase, 1) * 58px), calc((1 - var(--pc-phase, 1)) * 10px), 0) rotate(var(--pc-impact-angle)) scale(calc(.94 + var(--pc-phase, 1) * .03));
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card-liner {
  --pc-impact-angle: calc(7deg - var(--pc-phase, 1) * 10deg);
  top: 6%;
  bottom: 4%;
  right: 8%;
  width: 47%;
  transform: translate3d(calc(8px - var(--pc-phase, 1) * 28px), calc((1 - var(--pc-phase, 1)) * 14px), 0) rotate(var(--pc-impact-angle)) scale(calc(.88 + var(--pc-phase, 1) * .12));
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-name,
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-note {
  transform: rotate(calc(var(--pc-impact-angle) * -1));
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-corner-base {
  opacity: calc(.12 + var(--pc-phase, 1) * .58);
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots { opacity: 1; }
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle {
  transform-box: fill-box;
  transform-origin: center;
  transform: scale(calc(.65 + var(--pc-phase, 1) * .35));
}
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle:nth-child(1) { opacity: clamp(0, calc((var(--pc-phase, 1) - .08) * 6), 1); }
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle:nth-child(2) { opacity: clamp(0, calc((var(--pc-phase, 1) - .25) * 6), 1); }
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle:nth-child(3) { opacity: clamp(0, calc((var(--pc-phase, 1) - .42) * 6), 1); }
.protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle:nth-child(4) { opacity: clamp(0, calc((var(--pc-phase, 1) - .59) * 6), 1); }
@media (max-width: 760px) {
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card-shell {
    --pc-impact-angle: calc(-4.5deg + var(--pc-phase, 1) * 7deg);
    left: 4%;
    bottom: 7%;
    width: 34%;
    height: 73%;
    transform: translate3d(calc(10px - var(--pc-phase, 1) * 13px), calc((1 - var(--pc-phase, 1)) * 6px), 0) rotate(var(--pc-impact-angle)) scale(calc(.92 + var(--pc-phase, 1) * .04));
  }
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card-liner {
    --pc-impact-angle: calc(4.5deg - var(--pc-phase, 1) * 6.5deg);
    top: 6%;
    bottom: 5%;
    right: 4%;
    width: 53%;
    transform: translate3d(calc(3px - var(--pc-phase, 1) * 13px), calc((1 - var(--pc-phase, 1)) * 9px), 0) rotate(var(--pc-impact-angle)) scale(calc(.89 + var(--pc-phase, 1) * .11));
  }
}
@media (prefers-reduced-motion: reduce) {
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-card,
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-name,
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-note,
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle {
    transform: none;
    will-change: auto;
  }
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-corner-base { opacity: .7; }
  .protection-cinema.is-ready .pc-scene[data-pc-scene="impact"] .pc-material-dots circle { opacity: 1; }
}

/* Scroll moves the intact product into focus before revealing its close view. */
.protection-cinema.is-ready .pc-macro-visual{
 --pc-sweep:clamp(0,calc(var(--pc-phase,1) / .32),1);
 --pc-return:clamp(0,calc((var(--pc-phase,1) - .32) / .30),1);
 --pc-focus:clamp(0,calc((var(--pc-phase,1) - .56) / .44),1);
 --pc-detail:0;
 --pc-dir:1;
}
.protection-cinema.is-ready .pc-scene[data-pc-close="true"] .pc-macro-visual{--pc-detail:1}
.protection-cinema.is-ready .pc-scene[data-pc-scene="camera"] .pc-macro-visual{--pc-dir:-1}
.protection-cinema.is-ready .pc-macro-overview{
 inset:auto;left:0;top:50%;width:100%;height:auto;max-height:100%;aspect-ratio:4/3;
 transform-origin:center;
 transform:translate(calc(var(--pc-dir) * (-5% + var(--pc-sweep) * 9% - var(--pc-return) * 4%)),calc(-50% + 18px - var(--pc-sweep) * 30px + var(--pc-return) * 12px)) rotate(calc(var(--pc-dir) * (-5deg + var(--pc-sweep) * 9deg - var(--pc-return) * 4deg))) scale(calc(.80 + var(--pc-sweep) * .04 + var(--pc-return) * .10));
 will-change:transform,opacity;
}
.protection-cinema.is-ready .pc-macro-detail{
 transform-origin:center;
 transform:translateY(calc((1 - var(--pc-focus)) * 3%)) scale(calc(.92 + var(--pc-focus) * .08));
 will-change:transform,opacity;
}
/* Natural static panels keep their current full-size close-up. */
.protection-cinema:not(.is-ready) .pc-macro-overview,
.protection-cinema:not(.is-ready) .pc-macro-detail{transform:none;will-change:auto}
@media(prefers-reduced-motion:reduce){
 .protection-cinema .pc-macro-overview,.protection-cinema .pc-macro-detail{transform:none!important;will-change:auto!important}
}