/* The portrait becomes a small dimensional scene; copy and controls stay flat. */
.hero-visual{min-width:0;padding:10px 10px 0 3px}
.cinematic-stage{position:relative;isolation:isolate;perspective:1500px;--tilt-x:0deg;--tilt-y:0deg;--light-x:32%;--light-y:22%;animation:cinematic-arrive 1.1s cubic-bezier(.2,.7,.2,1) both}
.cinematic-halo{position:absolute;inset:-45px -30px -20px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 80% 18%,#c4d7bf80,transparent 60%),radial-gradient(ellipse at 20% 95%,#c7b68a35,transparent 55%);filter:blur(24px)}
.cinematic-scene{position:relative;transform-style:preserve-3d;transform:rotateX(calc(2deg + var(--tilt-x))) rotateY(calc(-5deg + var(--tilt-y))) rotateZ(-1deg);transition:transform .65s cubic-bezier(.2,.65,.3,1)}
.cinematic-stage.is-tracking .cinematic-scene{transition:transform .14s ease-out}
.portrait-backplate{position:absolute;inset:0;border-radius:10px;background:linear-gradient(135deg,#faf7eb 0%,#9caa92 30%,#284438 65%,#d6c99e 100%);border:1px solid #adba9f;transform:translate3d(14px,15px,-22px);box-shadow:18px 30px 40px -25px #102c3670,0 4px 8px #102c3620}
.cinematic-scene .portrait-frame{transform:translateZ(0);border-radius:8px;border:1px solid #fff9;box-shadow:0 0 0 1px #102c3620,0 10px 28px -18px #102c3670}
.cinematic-scene .portrait-frame>img{transform:scale(1.025)}
.cinematic-scene .portrait-frame:after{inset:38% 0 0;background:linear-gradient(transparent,rgba(7,31,38,.9));pointer-events:none}
.cinematic-scene .portrait-caption{z-index:3;right:125px}
.portrait-sheen{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.65;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#fff9 0%,#fff2 18%,transparent 55%);mix-blend-mode:soft-light}
.cinematic-light-pass{position:absolute;inset:-30% -100%;pointer-events:none;z-index:2;background:linear-gradient(105deg,transparent 43%,#fff0 45%,#fff5 49%,#fff0 55%,transparent 57%);transform:translateX(65%);opacity:0;animation:cinematic-light 2.2s .2s ease-in-out both}
.protection-sculpture{position:absolute;right:-8px;bottom:65px;width:134px;height:158px;transform-style:preserve-3d;transform:translateZ(90px) rotateY(-16deg) rotateZ(9deg);pointer-events:none}
.shield-shadow{position:absolute;inset:28px 2px 0 17px;background:#061c1d85;clip-path:polygon(50% 0%,96% 18%,92% 57%,76% 82%,50% 100%,24% 82%,8% 57%,4% 18%);filter:blur(10px);transform:translate3d(7px,12px,-45px);opacity:.45}
.shield-solid{position:absolute;inset:0;transform-style:preserve-3d;animation:shield-settle 1.6s .15s cubic-bezier(.2,.65,.25,1) both}
.shield-layer,.shield-face{position:absolute;inset:0;clip-path:polygon(50% 0%,96% 18%,92% 57%,76% 82%,50% 100%,24% 82%,8% 57%,4% 18%)}
.shield-layer{background:linear-gradient(120deg,#b5b78c,#263e33 48%,#c7b981 85%,#f7eac6);transform:translate3d(calc(var(--layer) * 1.2px),calc(var(--layer) * .5px),calc(var(--layer) * -1.6px))}
.shield-face{background:linear-gradient(125deg,#fff8dd 0%,#ceb878 24%,#fff7de 45%,#827a4b 72%,#d9d8ab 94%);transform:translateZ(1px)}
.shield-inset{position:absolute;inset:4px;display:grid;place-items:center;clip-path:polygon(50% 0%,96% 18%,92% 57%,76% 82%,50% 100%,24% 82%,8% 57%,4% 18%);background:radial-gradient(ellipse at 22% 5%,#9aa98590,transparent 60%),linear-gradient(125deg,#426957 3%,#123e35 40%,#0e292a 71%,#385a48);color:#f5e4b6}
.shield-inset:before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 27%,#fff2 28%,#fff0 50%);pointer-events:none}
.shield-inset:after{content:'';position:absolute;inset:10px;border:1px solid #d8cca14d;clip-path:polygon(50% 0%,96% 18%,92% 57%,76% 82%,50% 100%,24% 82%,8% 57%,4% 18%);background:linear-gradient(140deg,#dce2b21a,transparent 70%)}
.shield-inset svg{width:64%;height:64%;margin-top:-9%;filter:drop-shadow(0 2px 1px #0006)}
.hero-visual .photo-footer{padding-top:29px;padding-left:3px;font-size:7.5px;letter-spacing:1px}
@keyframes cinematic-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes cinematic-light{0%{transform:translateX(-60%);opacity:0}25%{opacity:.6}80%{opacity:.25}100%{transform:translateX(65%);opacity:0}}
@keyframes shield-settle{from{opacity:0;transform:translate3d(0,24px,70px) rotateY(23deg)}to{opacity:1;transform:translate3d(0,0,0) rotateY(0)}}
@media(max-width:1100px){.protection-sculpture{width:114px;height:138px;right:-8px;bottom:70px}.cinematic-scene .portrait-caption{right:105px}.hero-visual .photo-footer{font-size:6.4px;letter-spacing:.8px}}
@media(max-width:800px){.hero-visual{padding-inline:4px 9px}.cinematic-stage{perspective:1200px}.cinematic-scene{transform:rotateX(1deg) rotateY(-3deg) rotateZ(-.7deg)}.protection-sculpture{width:88px;height:105px;bottom:106px;right:-3px;transform:translateZ(50px) rotateY(-12deg) rotateZ(8deg)}.cinematic-scene .portrait-caption{right:18px}.portrait-backplate{transform:translate3d(9px,10px,-18px)}.hero-visual .photo-footer{font-size:5.8px;letter-spacing:.4px;padding-top:25px}}
@media(max-width:600px){.hero-visual{padding:5px 14px 0 7px}.cinematic-scene .portrait-frame{height:440px}.cinematic-halo{inset:-15px 0}.protection-sculpture{width:96px;height:114px;right:-5px;bottom:106px;transform:translateZ(45px) rotateY(-13deg) rotateZ(8deg)}.cinematic-scene .portrait-caption{left:20px;bottom:24px;right:15px}.hero-visual .photo-footer{font-size:6px;letter-spacing:.7px;padding-top:25px}.cinematic-stage,.shield-solid{animation:none}.cinematic-light-pass{display:none}.portrait-sheen{opacity:.3}}
@media(prefers-reduced-motion:reduce){.cinematic-stage,.shield-solid,.cinematic-light-pass{animation:none}.cinematic-light-pass{display:none}.cinematic-scene,.cinematic-stage.is-tracking .cinematic-scene{transition:none;transform:rotateY(-3deg)}.portrait-sheen{opacity:.3}}
