/* The real hero image expands into place; the logo is an intentional CSS mask. */
.blondie-intro{display:none}
.intro-entry{--intro-duration:1.45s}
.intro-entry .blondie-intro{display:block;position:fixed;inset:0;z-index:100;pointer-events:none;background:radial-gradient(ellipse at 68% 68%,#5a3c35 0%,#2b2028 55%,#211820 100%);animation:reveal-complete var(--intro-duration) linear both;overflow:hidden}
.intro-signature{position:absolute;top:calc(50% - 90px);left:calc(50% - 70px);width:140px;height:140px;z-index:4;background:#fff;mask:url('/assets/cropped-Blondie-logo_B.png') center/142% no-repeat;-webkit-mask:url('/assets/cropped-Blondie-logo_B.png') center/142% no-repeat;animation:mark-away var(--intro-duration) both}
.intro-strand{position:absolute;width:300px;height:200px;left:calc(50% - 150px);top:calc(50% + 25px);z-index:4;color:#d3b491;opacity:.5;animation:mark-away var(--intro-duration) both}
.intro-strand path{stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:strand-draw .6s cubic-bezier(.22,.61,.36,1) both}
.intro-meta{position:absolute;inset:auto 5vw 7vh;display:flex;justify-content:space-between;z-index:4;font:10px/1.4 DM,sans-serif;letter-spacing:.2em;color:#ead9c4;animation:metadata-away var(--intro-duration) both}
.intro-mirrors{position:absolute;inset:0;overflow:hidden}.intro-slice{position:absolute;height:53%;width:18%;overflow:hidden;box-shadow:0 24px 65px #130f1844;animation:mirror-enter var(--intro-duration) cubic-bezier(.22,.7,.2,1) both}.intro-slice img{width:100%;height:100%;object-fit:cover;filter:saturate(.72);transform:scale(1.06)}.intro-hair{left:16%;top:28%}.intro-portrait{left:40%;top:20%}.intro-portrait img{object-position:50% 25%}
.intro-entry .opening-image{position:fixed;inset:0;z-index:101;height:100svh;min-height:720px;transform:none!important;animation:hero-mirror var(--intro-duration) cubic-bezier(.76,0,.18,1) both}
.intro-entry .opening-sticky{z-index:101}.intro-entry .opening-wash{visibility:hidden}
.intro-entry .opening-sticky h1,.intro-entry .opening-caption,.intro-entry .opening-word,.intro-entry .opening-small,.intro-entry .opening-scroll,.intro-entry .header{animation:hero-type var(--intro-duration) both;z-index:102}.intro-entry .header{z-index:103}
.intro-entry .opening-image::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#1b1726cf,transparent 80%),linear-gradient(0deg,#25151a9e,transparent 60%);animation:hero-type var(--intro-duration) both}
@keyframes strand-draw{to{stroke-dashoffset:0}}
@keyframes mark-away{0%,34%{opacity:1;transform:translateY(0)}55%,100%{opacity:0;transform:translateY(-14px)}}
@keyframes metadata-away{0%,65%{opacity:1;transform:none}82%,100%{opacity:0;transform:translateY(-8px)}}
@keyframes mirror-enter{0%,25%{opacity:0;clip-path:inset(100% 0 0);transform:translateY(28px)}48%,68%{opacity:1;clip-path:inset(0);transform:translateY(0)}90%,100%{opacity:0;clip-path:inset(0);transform:translateY(-12px)}}
@keyframes hero-mirror{0%,27%{clip-path:inset(78% 16% 22% 66%)}48%,57%{clip-path:inset(22% 16% 22% 66%)}94%,100%{clip-path:inset(0)}}
@keyframes reveal-complete{0%,99%{opacity:1}100%{opacity:0;visibility:hidden}}
@keyframes hero-type{0%,86%{opacity:0}100%{opacity:1}}
@media(max-width:999px){.intro-entry .opening-image{min-height:780px}}
@media(max-width:700px){
 .intro-entry{--intro-duration:1.2s}.intro-entry .opening-image{min-height:650px;animation-name:mobile-salon-reveal}
 .intro-signature{top:12%;left:calc(50% - 45px);width:90px;height:90px}.intro-strand{left:18%;width:64%;top:21%;height:100px}
 .intro-meta{inset:auto 24px 7vh;font-size:8px}.intro-mirrors{display:none}
 .intro-entry .opening-image::after{background:linear-gradient(180deg,#20192366,transparent 38%,#251820df 94%),linear-gradient(90deg,#22192355,transparent 75%)}
 @keyframes mobile-salon-reveal{0%,27%{clip-path:inset(72% 18% 28% 18%)}48%,60%{clip-path:inset(32% 18% 15% 18%)}96%,100%{clip-path:inset(0)}}
}
@media(prefers-reduced-motion:reduce){.intro-entry .blondie-intro{display:none!important}.intro-entry .opening-image{position:absolute;animation:none;clip-path:none;z-index:auto}.intro-entry .opening-sticky>* , .intro-entry .header{animation:none!important}.intro-entry .opening-wash{visibility:visible}.intro-entry .opening-image::after{display:none}}