.photo-hero{position:relative;isolation:isolate;height:100svh;min-height:640px;max-height:980px;margin:0;width:100%;overflow:hidden;border-radius:0;background:radial-gradient(ellipse at 77% 45%,#42594a,#213b2d 55%,#17291f);color:#fff;touch-action:pan-y}
.photo-hero .hero-frames,.photo-hero .hero-frame,.photo-hero .hero-photo-shell,.photo-hero .hero-composite{position:absolute;inset:0;width:100%;height:100%}
.photo-hero .hero-frame{opacity:0;visibility:hidden;transition:opacity 1s ease,visibility 1s;overflow:hidden}
.photo-hero .hero-frame.is-active{opacity:1;visibility:visible;z-index:1}
.photo-hero .hero-photo-shell{transform:translate3d(0,0,0);backface-visibility:hidden}
.photo-hero .is-active .hero-photo-shell,.photo-hero .is-leaving .hero-photo-shell{will-change:transform}
.photo-hero .hero-model{opacity:0;transform-box:view-box;transform-origin:74% 56%}
.photo-hero .hero-studio-floor{position:absolute;inset:0;background:url("assets/hero-perspective-grid.svg") center/cover no-repeat;pointer-events:none;opacity:0}
.photo-hero .hero-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(13,26,20,.83),rgba(16,28,21,.56) 36%,rgba(16,28,21,.01) 76%),linear-gradient(0deg,rgba(11,23,17,.81),transparent 32%)}

.photo-hero .hero-body{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:35px 0 90px;pointer-events:none}
.photo-hero .hero-kicker{display:flex;gap:10px;align-items:center;font-size:9px;font-weight:500;letter-spacing:.15em;color:#e4ecdf;text-transform:uppercase;margin-bottom:26px}
.photo-hero .hero-kicker:before{content:'';width:26px;height:1px;background:#c0dbb9}
.photo-hero h1{font-size:clamp(55px,5.8vw,82px);line-height:1.06;letter-spacing:-.065em;font-weight:450;margin:0;max-width:660px;color:#fff}
.photo-hero h1 span{color:#c6e1bb;display:block}
.photo-hero .hero-description{color:#eef2e8;font-size:13px;line-height:1.9;font-weight:400;margin-top:25px;max-width:420px}
.photo-hero .hero-actions{display:flex;align-items:center;gap:25px;margin-top:30px;pointer-events:auto}
.photo-hero .hero-primary{background:#c4dfb9;border-color:#c4dfb9;color:#172c22;min-height:50px;padding-inline:21px;gap:28px;font-size:11px}
.photo-hero .hero-primary:hover{background:#deedcc;border-color:#deedcc}
.photo-hero .hero-secondary{color:white;font-size:10px;display:inline-flex;gap:18px;align-items:center;padding-block:15px;border-bottom:1px solid #ffffff55}
.photo-hero .hero-secondary:hover{border-color:#d5e9c8}
.photo-hero .hero-secondary span{font-size:18px}
.photo-hero .hero-top{position:absolute;top:28px;left:0;right:0;z-index:3;display:flex;justify-content:flex-end}
.photo-hero .hero-scene-label{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:#f0f4e9;background:#1b332c70;padding:7px 10px;border:1px solid #d0e0c51c;border-radius:3px}
.photo-hero .hero-scene-label:before{content:'';width:4px;height:4px;background:#c6e1bb;border-radius:50%}
.photo-hero .hero-bottom{position:absolute;bottom:0;left:0;right:0;z-index:4;display:flex;align-items:center;justify-content:flex-end;gap:22px;padding-block:22px 24px}
.photo-hero .hero-controls{display:flex;align-items:center;gap:6px;padding:0}
.photo-hero .hero-arrow,.photo-hero .hero-pause{display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff50;background:#10231820;color:white;border-radius:3px;transition:background .2s,border-color .2s}
.photo-hero .hero-arrow:hover,.photo-hero .hero-pause:hover{background:#ffffff20;border-color:#ffffffa0}
.photo-hero .hero-arrow svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.4;fill:none}
.photo-hero .hero-pause{font-size:14px}
.photo-hero :is(a,button):focus-visible{outline:2px solid #e4f4d9;outline-offset:5px}
.photo-hero .hero-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1150px){.photo-hero{min-height:620px}.photo-hero h1{font-size:clamp(52px,6vw,70px)}}
@media(max-width:850px){.photo-hero{height:850px;min-height:0;max-height:none;margin:0}.photo-hero .hero-frames{height:450px}.photo-hero .hero-shade{background:linear-gradient(0deg,#1b3326 0%,#1b3326 43%,#1b332600 72%)}.photo-hero .hero-body{justify-content:flex-end;padding:420px 0 145px}.photo-hero h1{font-size:64px}.photo-hero .hero-kicker{margin-bottom:20px}.photo-hero .hero-description{margin-top:20px}.photo-hero .hero-actions{margin-top:24px}.photo-hero .hero-top{top:20px}.photo-hero .hero-bottom{gap:20px}.photo-hero .hero-controls{position:static;padding:0}}
@media(max-width:600px){.photo-hero{height:750px;margin:0;border-radius:0}.photo-hero .hero-frames{height:365px}.photo-hero .hero-shade{background:linear-gradient(0deg,#1b3326 0%,#1b3326 52%,#1b332600 78%)}.photo-hero .hero-body{padding:335px 0 100px;justify-content:flex-end}.photo-hero h1{font-size:clamp(37px,9.5vw,56px);line-height:1.08;max-width:100%}.photo-hero .hero-kicker{font-size:7px;letter-spacing:.09em;gap:7px;margin-bottom:17px}.photo-hero .hero-kicker:before{width:17px}.photo-hero .hero-description{font-size:11px;line-height:1.8;margin-top:18px;max-width:290px}.photo-hero .hero-description br{display:none}.photo-hero .hero-actions{flex-direction:column;align-items:flex-start;gap:9px;margin-top:21px}.photo-hero .hero-primary{min-height:43px;font-size:9px;padding-inline:16px;gap:24px}.photo-hero .hero-secondary{font-size:9px;padding-block:4px;gap:15px;border-color:transparent}.photo-hero .hero-top{top:18px;justify-content:flex-end}.photo-hero .hero-scene-label{font-size:6px;padding:6px 8px;gap:6px}.photo-hero .hero-bottom{padding:18px 0 20px}.photo-hero .hero-controls{gap:6px}.photo-hero .hero-arrow,.photo-hero .hero-pause{width:30px;height:30px}.photo-hero .hero-arrow svg{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){.photo-hero .hero-frame{transition:none}.photo-hero .hero-photo-shell{transform:none}.photo-hero .hero-model,.photo-hero .hero-studio-floor{position:absolute;inset:0;background:url("assets/hero-perspective-grid.svg") center/cover no-repeat;pointer-events:none;opacity:0}.photo-hero .hero-scene-bg{opacity:1}}

@media(max-width:850px){.photo-hero .hero-photo-shell{mask-image:linear-gradient(#000 0%,#000 75%,transparent 100%)}}
@media(max-width:600px){.photo-hero .hero-description br{display:initial}}

@media(max-width:600px){.photo-hero .hero-description{max-width:320px}.photo-hero .hero-body{padding-bottom:90px}.photo-hero .hero-kicker{letter-spacing:.08em}}
