/* ident.css — the opener */
.ident{position:fixed;inset:0;z-index:60;background:#000;opacity:0;pointer-events:none;transition:opacity 1.2s var(--e);perspective:1400px;perspective-origin:50% 50%;overflow:hidden}
.ident.on{opacity:1}
.ident.out{opacity:0;transition:opacity 2.4s var(--e)}
.ident .bg{position:absolute;inset:0;background:#000;transition:background 1.6s var(--e)}
.ident.filled .bg{background:#083323}
/* the book */
.book{position:absolute;left:50%;top:50%;width:124vw;height:124vh;transform:translate(-50%,-50%);transform-style:preserve-3d}
.book.a{transition:opacity .9s var(--e)}
.ident.letters .book.a{opacity:0}
.pg{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform}
.pg .grid{position:absolute;inset:0;display:grid;gap:1.2vmin;padding:1.2vmin;backface-visibility:hidden;background:#07110c}
.pg .grid.back{transform:rotateY(180deg)}
.pg .cell{background-size:cover;background-repeat:no-repeat;filter:saturate(.95) contrast(1.05)}
.pg.flip{animation:flip .62s cubic-bezier(.55,.05,.35,1) forwards}
@keyframes flip{0%{transform:rotateY(0)}100%{transform:rotateY(-178deg)}}
/* the letters */
.stage{position:absolute;inset:0;transform-style:preserve-3d;opacity:0;transform:translate3d(-26vw,6vh,980px) rotateY(-24deg);will-change:transform}
.ident.letters .stage{opacity:1;animation:camera 4.4s cubic-bezier(.16,.84,.2,1) forwards}
@keyframes camera{0%{transform:translate3d(-26vw,6vh,980px) rotateY(-24deg)}100%{transform:translate3d(0,0,0) rotateY(0)}}
.word{position:absolute;inset:0;-webkit-mask-image:url(/brand/wordmark-cream.png);mask-image:url(/brand/wordmark-cream.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center 44%;mask-position:center 44%;-webkit-mask-size:min(82vw,1600px) auto;mask-size:min(82vw,1600px) auto;transform-style:preserve-3d}
.word.ex{background:#1a1510;transform:translateZ(-10px)}
.word.ex2{background:#120e0a;transform:translateZ(-20px)}
.word.ex3{background:#0b0805;transform:translateZ(-32px)}
.word.face{overflow:hidden}
.word.face .book{transform:translate(-50%,-50%) scale(1.02)}
.word.face .fill{position:absolute;inset:0;background:#F2E7DA;opacity:0;transition:opacity 1.3s var(--e)}
.ident.filled .word.face .fill{opacity:1}
.word.face .light{position:absolute;inset:0;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.9) 50%,transparent 60%);transform:translateX(-130%);opacity:0;mix-blend-mode:screen}
.ident.lit .word.face .light{opacity:1;animation:pass 2s cubic-bezier(.65,0,.25,1) 1 forwards}
@keyframes pass{to{transform:translateX(130%)}}
.ident .flash{position:absolute;inset:0;background:#fff7ea;opacity:0;pointer-events:none;mix-blend-mode:screen}
.ident .flash.go{animation:flash .34s ease-out 1}
@keyframes flash{0%{opacity:.8}100%{opacity:0}}
.ident .line{position:absolute;left:0;right:0;top:calc(44% + min(12vw,230px));text-align:center;font:500 clamp(12px,1.1vw,20px)/1 var(--mono);letter-spacing:.55em;color:#C4A384;opacity:0;transform:translateY(12px);transition:opacity 1.4s var(--e2),transform 1.6s var(--e2)}
.ident.line .line{opacity:1;transform:none}
.ident .vig{position:absolute;inset:0;background:radial-gradient(ellipse 75% 65% at 50% 50%,rgba(0,0,0,0) 45%,rgba(0,0,0,.6) 100%);pointer-events:none}