/* References v2: independent art directions; accepted chrome and controls stay shared. */
.ref-hero{height:calc(100svh - var(--header-height));min-height:0;background:#087e51}
.ref-hero:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 75% 48%,#42a77950,transparent 55%),radial-gradient(ellipse at 12% 85%,#005e4340,transparent 60%)}
.ref-hero-content{width:calc(86 * var(--hero-u));height:100%;padding:calc(1.4 * var(--hero-u)) 0 calc(3.4 * var(--hero-u));justify-content:center;pointer-events:none}
.ref-hero-copy{width:46%;max-width:none;pointer-events:auto}
.ref-hero-copy h1{font-size:calc(4.03 * var(--hero-u));line-height:1.08;letter-spacing:-.045em;max-width:none;text-wrap:initial;margin:0}
.ref-hero-copy h1 span{color:#d6f7cf;display:block}
.ref-hero-copy p{font-size:calc(1.46 * var(--hero-u));line-height:1.38;letter-spacing:-.018em;max-width:calc(32 * var(--hero-u));margin:calc(1.55 * var(--hero-u)) 0 0;color:#e7f7eb}
.ref-hero .oc-hero-actions{pointer-events:auto}
.ref-scene{position:absolute;z-index:1;width:min(70vw,112svh,1376px);aspect-ratio:4/3;right:calc(50% - 49 * var(--hero-u));top:50%;transform:translateY(-48%);pointer-events:none;isolation:isolate}
.ref-environment{position:absolute;inset:0;z-index:-1;mask-image:linear-gradient(90deg,transparent,#000 22%,#000 85%,transparent),linear-gradient(180deg,transparent,#000 12%,#000 78%,transparent);mask-composite:intersect}
.ref-environment img{width:100%;height:100%;max-width:none;object-fit:contain}
.ref-scene-light{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ref-brand{position:absolute;width:23%;height:15%;perspective:1000px;--turn:0deg}
.ref-brand-surface{position:absolute;inset:0;display:grid;place-items:center;border-radius:clamp(12px,1.2vw,22px);border:1px solid #efffe6;background:linear-gradient(125deg,#ffffff 10%,#f4fbed 56%,#d3ead7);box-shadow:0 3px 0 #a1cdaa,0 8px 0 #196443,0 20px 28px #00372245;transform:rotate(var(--turn));overflow:hidden}
.ref-brand-surface:after{content:'';position:absolute;inset:5%;border:1px solid #b6d2b866;border-radius:inherit;pointer-events:none}
.ref-brand img{display:block;position:relative;width:86%;height:87%;object-fit:contain;mix-blend-mode:multiply;z-index:1}
.ref-brand--1{left:37%;top:25%;width:30%;height:19%;z-index:3;animation-delay:.08s}
.ref-brand--2{left:65%;top:44%;animation-delay:.24s}
.ref-brand--3{left:28%;top:64%;width:22%;animation-delay:.4s}
.ref-brand--4{left:56%;top:64%;width:22%;animation-delay:.55s}
.ref-brand--5{left:13%;top:44%;animation-delay:.16s}
.ref-brand--5 img{width:79%;height:auto}
.ref-exhibit-glint{inset:-60% -80%;background:linear-gradient(105deg,transparent 44%,#ffffffb0 49%,#fff5 52%,transparent 57%);animation:ref-glint-v2 12s ease-in-out infinite;transform:translateX(-90%);z-index:3}
.ref-brand--1 .ref-exhibit-glint{animation-delay:-3s}.ref-brand--2 .ref-exhibit-glint{animation-delay:-8s}.ref-brand--3 .ref-exhibit-glint{animation-delay:-5.5s}.ref-brand--4 .ref-exhibit-glint{animation-delay:-10s}.ref-brand--5 .ref-exhibit-glint{animation-delay:-.5s}
.ref-travelling-light{stroke-dasharray:3 97;animation:ref-light-v2 12s linear infinite;opacity:0}
.ref-light-secondary{animation-duration:16s;animation-delay:-7s}
.ref-mote{animation:ref-mote-v2 9s ease-in-out infinite;opacity:0}.ref-mote--2{animation-delay:-3s;animation-duration:11s}.ref-mote--3{animation-delay:-6s}
@keyframes ref-glint-v2{0%,72%{transform:translateX(-90%)}86%,100%{transform:translateX(90%)}}
@keyframes ref-light-v2{0%{stroke-dashoffset:3;opacity:0}12%,76%{opacity:.75}100%{stroke-dashoffset:-99;opacity:0}}
@keyframes ref-mote-v2{0%,100%{opacity:0;transform:translate(0,10px)}35%,60%{opacity:.6}85%{opacity:0;transform:translate(9px,-24px)}}
/* The second direction uses a freer, staggered botanical composition. */
[data-concept=bahce] .ref-scene{transform:translateY(-47%)}
[data-concept=bahce] .ref-environment{mask-image:linear-gradient(90deg,transparent 9%,#000 32%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 13%,#000 79%,transparent)}
[data-concept=bahce] .ref-brand--1{left:36%;top:40%;width:31%;height:19%;--turn:-3deg}
[data-concept=bahce] .ref-brand--2{left:57%;top:21%;width:26%;height:15%;--turn:4deg}
[data-concept=bahce] .ref-brand--3{left:15%;top:61%;width:23%;height:15%;--turn:-5deg}
[data-concept=bahce] .ref-brand--4{left:64%;top:65%;width:21%;height:17%;--turn:5deg}
[data-concept=bahce] .ref-brand--5{left:24%;top:18%;width:25%;height:17%;--turn:-5deg}
[data-concept=bahce] .ref-brand-surface{border-radius:clamp(16px,1.8vw,34px);box-shadow:0 3px 0 #abcfaa,0 7px 0 #286b49,0 22px 32px #00362355}
/* Preview chooser sits outside the full-screen entrance. It is not a site-wide UI. */
.ref-concepts{display:flex;align-items:center;justify-content:center;gap:24px;padding:18px 24px;background:#f0f8f4;border-bottom:1px solid #dceade;color:#365f4a;flex-wrap:wrap}
.ref-concepts>span{font-size:12px;letter-spacing:.07em}.ref-concepts>div{display:flex;gap:8px}
.ref-concepts a{display:flex;align-items:center;gap:10px;padding:9px 17px;border:1px solid #cbded0;border-radius:999px;font-size:13px;text-decoration:none;min-height:44px}
.ref-concepts a[aria-current]{background:#075c3f;color:#fff;border-color:#075c3f}.ref-concepts a:not([aria-current]):hover{background:#e1f0e5}
.ref-concepts b{font-weight:500;opacity:.7;font-size:10px}
.ref-story-copy>.text-link{margin-top:26px}
.ref-story-detail+.text-link{margin-top:0}
.references-page .video-bottom{justify-content:flex-end}
/* Background art is part of the contact surface, never an extra layout block. */
.references-page .contact-section{position:relative;isolation:isolate;overflow:hidden;background:#087e51}
.references-page .contact-grid{position:relative;z-index:1}
.references-page .contact-copy{position:static}
.references-page .contact-copy>h2,.references-page .contact-copy>p,.references-page .contact-copy>ul,.references-page .contact-copy>.eyebrow{position:relative;z-index:2}
.references-page .contact-section:before{z-index:0}
.ref-contact-art{position:absolute;z-index:-1;pointer-events:none;width:min(900px,68vw);height:auto;aspect-ratio:4/3;left:-16%;bottom:-260px;margin:0;max-width:none;opacity:.75;mask-image:linear-gradient(180deg,transparent 8%,#000 55%)}
.ref-contact-art img{width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 78%,transparent)}
.ref-contact-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ref-contact-leaf{transform-origin:0 0;opacity:.35;animation:ref-contact-sway 8s ease-in-out infinite alternate}.ref-contact-leaf--2{animation-duration:11s;animation-delay:-4s}
@keyframes ref-contact-sway{from{rotate:-4deg}to{rotate:4deg}}
.motion-idle [data-motion-scene] *,.no-motion *{animation-play-state:paused!important}
@media(max-width:899px), (max-width:1200px) and (max-aspect-ratio:1/1){
 .ref-hero{height:calc(100svh - var(--header-height));min-height:0}
 .ref-hero-content{width:calc(100% - 10 * var(--hero-u));max-width:calc(94 * var(--hero-u));display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:calc(11.5 * var(--hero-u)) 0 max(calc(7 * var(--hero-u)),env(safe-area-inset-bottom));gap:calc(4 * var(--hero-u))}
 .ref-hero-copy{display:contents}
 .ref-hero-copy h1{order:0;max-width:none;font-size:calc(8.5 * var(--hero-u));line-height:1.13;letter-spacing:-.035em}
 .ref-hero-copy p{order:1;max-width:calc(80 * var(--hero-u));font-size:calc(4.15 * var(--hero-u));line-height:1.4;letter-spacing:-.012em;margin:0}
 .ref-scene,[data-concept=bahce] .ref-scene{width:min(100%,calc(105 * var(--hero-u)));height:auto;right:50%;top:auto;bottom:calc(39 * var(--hero-u));transform:translateX(50%)}
 .ref-environment,[data-concept=bahce] .ref-environment{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 13%,#000 80%,transparent)}
 .ref-brand-surface{border-radius:12px;box-shadow:0 2px 0 #a1cdaa,0 4px 0 #196443,0 9px 15px #00372245}
 [data-concept=bahce] .ref-brand-surface{border-radius:14px;box-shadow:0 2px 0 #a1cdaa,0 4px 0 #196443,0 9px 15px #00372245}
 .ref-brand--1{left:33%;width:35%;height:20%;top:23%}.ref-brand--5{left:7%;top:45%;width:28%;height:17%}.ref-brand--2{left:66%;top:45%;width:28%;height:17%}.ref-brand--3{left:26%;top:66%;width:25%;height:17%}.ref-brand--4{left:57%;top:66%;width:23%;height:17%}
 .ref-contact-art{width:640px;max-width:none;left:-25%;bottom:auto;top:80px;opacity:.5}
 .ref-concepts{gap:10px;padding:16px}.ref-concepts>span{font-size:10px}.ref-concepts a{padding:8px 14px;font-size:12px}
}
@media(max-width:599px) and (max-height:740px) and (orientation:portrait){
 .ref-hero-content{padding-top:calc(7 * var(--hero-u));gap:calc(3.4 * var(--hero-u))}
 .ref-hero-copy h1{font-size:max(25px,calc(8.5 * var(--hero-u)))}
 .ref-hero-copy p{font-size:13px;max-width:90%}
 .ref-hero .oc-hero-actions{margin:0}
 .ref-scene,[data-concept=bahce] .ref-scene{width:calc(98 * var(--hero-u));bottom:calc(38 * var(--hero-u))}
}
@media(min-width:600px) and (max-width:1200px) and (max-aspect-ratio:1/1){
 .ref-hero-content{max-width:calc(112 * var(--hero-u))}
 .ref-scene,[data-concept=bahce] .ref-scene{width:calc(110 * var(--hero-u))}
}
@media(max-width:899px) and (min-aspect-ratio:1/1){
 .ref-hero{height:calc(100svh - var(--header-height));min-height:0}
 .ref-hero-content{width:calc(100% - 48px);max-width:none;min-height:0;align-items:flex-start;justify-content:center;padding:16px 0;gap:10px}
 .ref-hero-copy h1{font-size:clamp(23px,3.6vw,30px);line-height:1.07;max-width:48%}
 .ref-hero-copy p{font-size:12px;max-width:45%;line-height:1.4}
 .ref-scene,[data-concept=bahce] .ref-scene{width:370px;max-width:48%;height:auto;right:0;top:45%;bottom:auto;transform:translateY(-61%)}
 .ref-brand-surface{border-radius:10px}
}
/* At extreme height or browser zoom, allow content to grow rather than crop controls. */
@media(max-height:479px) and (orientation:portrait){.ref-hero{height:auto;min-height:550px}.ref-hero-content{min-height:550px}.ref-hero .oc-hero-partners{margin-top:210px}}
@media(max-height:349px) and (orientation:landscape){.ref-hero{height:auto;min-height:300px}.ref-hero-content{min-height:300px}}
@media(prefers-reduced-motion:reduce){.ref-hero *,.ref-contact-art *{animation:none!important}.ref-travelling-light,.ref-mote{display:none}.ref-brand{opacity:1;translate:none}.ref-exhibit-glint{display:none}}
