/* A quiet, staggered gallery. Source artwork remains uncropped and unchanged. */
.directions-section{padding:clamp(7rem,10vw,11rem) 0 clamp(8rem,12vw,13rem)!important;background:#050409;position:relative;scroll-margin-top:80px}
.directions-heading{margin-bottom:clamp(5.5rem,8vw,9rem)}.directions-heading .kicker{color:#b499f1;margin-bottom:1.5rem}.directions-heading h2{font-size:clamp(2.2rem,4vw,4rem);font-weight:300;line-height:1.1;letter-spacing:-.045em}.directions-heading>p:last-child{margin-top:1.5rem;color:#b4a8c3;font-size:.85rem}
.directions-line{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(4,minmax(0,300px));align-items:start;justify-content:center;gap:clamp(36px,4vw,76px);max-width:1428px;width:calc(100% - clamp(144px,14vw,288px));padding:0;margin:0 auto;list-style:none}
.directions-line:before{content:'';position:absolute;left:0;right:0;top:49%;height:1px;background:linear-gradient(90deg,transparent,#4b385c 15%,#705082 50%,#4b385c 85%,transparent);z-index:-1;opacity:.45;transform:rotate(-1.8deg)}
.direction-stop{position:relative;min-width:0;scroll-margin-top:100px;padding-top:var(--gallery-offset,0)}
.direction-stop:nth-child(1){--gallery-offset:46px}.direction-stop:nth-child(2){--gallery-offset:0px}.direction-stop:nth-child(3){--gallery-offset:68px}.direction-stop:nth-child(4){--gallery-offset:18px}
.direction-stop:before{content:'';position:absolute;inset:10% -12% -6%;background:radial-gradient(ellipse at 50% 55%,#9d65d4 0%,transparent 68%);opacity:0;transition:opacity .4s ease;z-index:-1;pointer-events:none}
.direction-item{display:block;position:relative;width:100%;text-decoration:none;transition:transform .4s cubic-bezier(.2,.65,.3,1),filter .4s ease,box-shadow .4s ease;outline-offset:8px;background:#050409}
.direction-item img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain}
.direction-item:focus-visible{outline:2px solid #bc96f0;box-shadow:0 12px 38px #9e68d51c}.direction-stop:focus-within:before{opacity:.13}
@media(hover:hover) and (pointer:fine){.direction-item:hover{transform:translateY(-8px) scale(1.018);filter:brightness(1.055) contrast(1.015);box-shadow:0 18px 48px #9e68d521}.direction-stop:hover:before{opacity:.13}}
@media(max-width:1100px){.directions-section{padding:5.5rem 0 7rem!important}.directions-heading{margin-bottom:4.5rem}.directions-line{grid-template-columns:minmax(0,360px);width:calc(100% - 64px);gap:88px}.directions-line:before{left:50%;right:auto;top:0;bottom:0;width:1px;height:auto;background:linear-gradient(transparent,#665075 15%,#665075 85%,transparent);transform:none}.direction-stop:nth-child(n){--gallery-offset:0px}.direction-stop:before{inset:0 -8%}.direction-item:hover{transform:none}}
@media(max-width:480px){.directions-section{padding:4.5rem 0 6rem!important}.directions-line{width:calc(100% - 56px);grid-template-columns:minmax(0,340px);gap:72px}.directions-heading{margin-bottom:3.5rem}.directions-heading h2{font-size:2.15rem}}
@media(prefers-reduced-motion:reduce){.direction-item,.direction-stop:before{transition:none}.direction-item:hover{transform:none}}

/* An open gallery without connecting lines. */
.directions-line:before,.direction-stop:before,.direction-stop:after{display:none}
@keyframes direction-arrive{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
.direction-stop.is-arriving{animation:direction-arrive .8s cubic-bezier(.2,.65,.3,1) both;animation-delay:var(--arrival-delay,0ms)}
}

/* Landscape teaser floats above the portrait artwork without shifting the gallery. */
.direction-stop:has(.preview-open){z-index:5}
.direction-preview{position:absolute;left:8%;top:10%;width:clamp(300px,29vw,430px);display:block;border:1px solid #b795f147;border-radius:8px;overflow:hidden;background:#100b19;box-shadow:0 24px 75px #000b,0 0 36px #9563d826;opacity:0;visibility:hidden;transform:translateY(14px) scale(.97);transition:opacity .3s,transform .3s,visibility .3s;pointer-events:none;text-align:left}
.direction-preview-film{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:#08060c}.direction-preview video{width:100%;height:100%;object-fit:contain;display:block}
.direction-preview-tag{position:absolute;left:0;right:0;bottom:0;padding:1.7rem 1rem .8rem;background:linear-gradient(transparent,#07050cdb);color:#e6dafc;font-size:.65rem;letter-spacing:.06em}
.direction-preview-caption{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;color:#eee7fb;font-size:.8rem}.direction-preview-caption b{font-size:1.3rem;font-weight:300;color:#c4a1ff}
.preview-open .direction-preview{opacity:1;visibility:visible;transform:none;pointer-events:auto}
@media(hover:none),(max-width:700px){.direction-preview{left:4%;width:92%}}
@media(prefers-reduced-motion:reduce){.direction-preview{transition:none;transform:none}}

/* Local offer previews share the validated floating frame. */
.direction-preview-frame{position:absolute;inset:0;opacity:0;transition:opacity .3s;background:#0c0912}
.direction-preview-frame.is-current{opacity:1}
.direction-preview .direction-preview-frame img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
.direction-preview-story{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:.8rem;padding:1.4rem 1.5rem 2.8rem;white-space:pre-line;color:#f8f5ff}
.direction-preview-story strong{font-size:1.1rem;font-weight:500;letter-spacing:-.02em}
.direction-preview-story>span{font-size:.78rem;line-height:1.6}
.direction-preview-story small{font-size:.65rem;color:#bdb0d2}
.direction-preview--assistant .direction-preview-film{aspect-ratio:4/3;background:#151029}
.direction-preview--assistant .direction-preview-frame{background:radial-gradient(ellipse at top right,#432776,transparent 85%),#110c20}
.direction-preview--assistant .direction-preview-story>span{padding:.8rem;border:1px solid #b795f140;border-radius:10px;background:#ffffff08}
.direction-preview--web .direction-preview-story{background:linear-gradient(90deg,#08050eee,#08050e99 55%,transparent);padding-right:43%}
.direction-preview--web .direction-preview-film{aspect-ratio:4/3}
.direction-preview--web .direction-preview-story>span{font-size:1rem}
.direction-preview--web .direction-preview-story small{line-height:1.5}
@media(min-width:1101px){.direction-stop:nth-last-child(-n+2) .direction-preview{left:auto;right:8%}}
@media(prefers-reduced-motion:reduce){.direction-preview-frame{transition:none}}

/* Show the three original campaign panels without modifying the source artwork. */
.direction-preview--viral .direction-preview-film{aspect-ratio:8/3}
.direction-preview--viral .direction-preview-tag{display:none}

/* Crops from the supplied GenerateToBeYou campaign board. */
.direction-preview--assistant .direction-preview-film{aspect-ratio:2.15}
.direction-preview--assistant .direction-preview-tag{display:none}
.direction-preview--assistant .direction-preview-frame img{position:absolute;width:131.6%;height:auto;max-width:none;top:0;left:0;object-fit:initial}
.direction-preview--assistant .direction-preview-frame:nth-child(2) img{width:256%;top:-196.4%;left:-52.5%}
.production-home{scroll-margin-top:90px}
.production-home-feature{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);align-items:center;margin:2.5rem 0}
.production-home-feature video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#08060c;border:1px solid var(--line)}
.production-home-copy p{color:var(--muted);line-height:1.8;margin:0 0 1.5rem}
.production-home-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:2.5rem}
.production-home-card{position:relative;display:block;text-decoration:none;color:inherit;border:1px solid var(--line);background:#0c0912;overflow:hidden}
.production-home-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.production-home-card span{display:block;padding:1rem;font-size:.8rem;line-height:1.5}
.production-home-card:hover,.production-home-card:focus-visible{border-color:#bc96f0}
.production-home-credit{color:var(--muted);font-size:.68rem;line-height:1.6;margin-top:1rem}
@media(max-width:760px){.production-home-feature{grid-template-columns:1fr}.production-home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.production-home-card video{position:absolute;inset:0 0 auto;width:100%;height:360px;object-fit:cover;opacity:0;pointer-events:none;transition:opacity .25s}
.production-home-card.is-playing video{opacity:1}
@media(prefers-reduced-motion:reduce){.production-home-card video{transition:none}}

/* Project Contour onto the existing Performance Pulse laptop screen. */
.direction-preview-desktop{position:absolute;display:block;width:1536px;height:1024px;transform-origin:top left;pointer-events:none}
.direction-preview-desktop iframe{position:absolute;left:0;top:0;width:1100px;height:760px;border:0;background:#141719;transform-origin:top left;transform:matrix3d(0.2773856183,0.04195273927,0,-0.0001395908591,-0.1373887674,0.4433792081,0,-2.87436212e-05,0,0,1,0,929,157,0,1)}
.direction-preview--web .direction-preview-story{pointer-events:none}

.production-home-feature#film{scroll-margin-top:100px}

/* Keep the Essential artwork and fit Kiosk York into its original screen. */
.direction-preview-smartphone{position:absolute;display:block;width:1536px;height:1024px;transform-origin:top left;pointer-events:none}
.direction-preview-smartphone iframe{position:absolute;left:0;top:0;width:390px;height:844px;border:0;border-radius:55px 48px 45px 45px;background:#19140e;transform-origin:top left;transform:matrix3d(0.4853463279,-0.08139768728,0,-0.0001662992613,0,0.7345971564,0,0,0,0,1,0,888,129,0,1)}
.direction-preview-smartphone:after{content:'';position:absolute;left:951px;top:116px;width:138px;height:28px;border-radius:0 0 18px 18px;background:#050508;transform:rotate(-5deg)}

.direction-preview-smartphone iframe,.direction-preview-desktop iframe{opacity:0}
.direction-preview-smartphone iframe.is-ready,.direction-preview-desktop iframe.is-ready{opacity:1}
