/* The section's scroll distance drives a silent, reversible botanical sequence. */
#recognition.recognition-scroll{display:block;padding:0;min-height:0;height:auto;background:var(--ink);border:0;position:relative}
.recognition-scene{position:relative;aspect-ratio:16/9;height:auto;min-height:540px;display:flex;align-items:center;justify-content:flex-end;isolation:isolate;overflow:hidden;padding:45px 7%}
.recognition-motion{position:absolute;inset:0;z-index:-2;pointer-events:none;mask-image:none;-webkit-mask-image:none}
.recognition-motion canvas,.recognition-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.recognition-motion:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 30%,#282b2730 50%,#282b2790 80%,#282b27a0)}
#recognition .recognition-copy{width:44%;max-width:600px;text-shadow:0 2px 20px #282b2766}
#recognition .recognition-copy h2{font-size:clamp(64px,6.6vw,108px);line-height:.96}
#recognition .recognition-copy .eyebrow{color:var(--cream)}
#recognition .recognition-copy blockquote{max-width:390px}
@media(max-width:800px){.recognition-scene{min-height:0;padding:45px 7% 65px;height:100svh}#recognition .recognition-copy{width:80%;max-width:420px;margin-left:auto}#recognition .recognition-copy h2{font-size:clamp(64px,12vw,90px)}.recognition-motion:after{background:linear-gradient(90deg,#282b2715,#282b27bd 28%,#282b27e8 72%)}#recognition .recognition-copy blockquote{font-size:25px}#recognition .recognition-title{font-size:15px}}
@media(max-height:550px) and (orientation:landscape){.recognition-scene{min-height:360px;padding:25px 7%}#recognition .recognition-copy{width:53%;max-width:540px}#recognition .recognition-copy h2{font-size:clamp(45px,8vh,65px);margin:12px 0}#recognition .recognition-copy blockquote{font-size:20px;margin:14px 0}#recognition .recognition-copy .text-link{font-size:11px}}
@media(prefers-reduced-motion:reduce){#recognition.recognition-scroll{height:auto}.recognition-scene{position:relative}#recognition-canvas{display:none}}

#recognition .recognition-copy h2{margin:18px 0 20px}#recognition .recognition-copy blockquote{margin:22px 0}

/* Portrait uses an explicit 9:16 composition, not the desktop aspect ratio. */
@media(max-width:800px) and (orientation:portrait){
 #recognition.recognition-scroll{width:100%;max-width:100%;overflow:clip}
 #recognition .recognition-scene{box-sizing:border-box;width:100%;max-width:100%;aspect-ratio:9/16;height:auto;min-height:640px;padding:48px 8%;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;justify-content:normal}
 #recognition .recognition-motion{z-index:0}
 #recognition .recognition-copy{z-index:2;position:relative;box-sizing:border-box;width:100%;max-width:none;min-width:0;margin:0;align-self:center;text-shadow:0 2px 18px #16251ef2}
 #recognition .recognition-copy .eyebrow{display:block;font-size:10px;line-height:1.5;letter-spacing:.12em}
 #recognition .recognition-copy h2{font-size:clamp(48px,14.5vw,86px);line-height:1.02;margin:22px 0}
 #recognition .recognition-heading>span,#recognition .recognition-heading>em{display:block}
 #recognition .recognition-title{max-width:100%;font-size:15px;line-height:1.55}
 #recognition .recognition-copy blockquote{max-width:100%;font-size:clamp(21px,6vw,29px);line-height:1.25;margin:24px 0}
 #recognition .recognition-copy .text-link{font-size:12px;line-height:1.6;max-width:100%;white-space:normal}
 #recognition .recognition-motion:after{background:#18291e50}
 #recognition .recognition-poster{object-position:35% center}
}
@media(max-width:1000px) and (orientation:landscape){
 #recognition .recognition-scene{box-sizing:border-box;width:100%;max-width:100%;aspect-ratio:16/9;height:auto;min-height:360px}
 #recognition .recognition-copy{position:relative;z-index:2;min-width:0}
}

/* Retain scroll-driven artwork without enlarging a landscape source into a portrait crop. */
#recognition .recognition-scene{max-width:1100px;margin:auto;min-height:0}
#recognition .recognition-poster{object-fit:contain}
@media(max-width:800px){
 #recognition .recognition-scene{display:flex;flex-direction:column;align-items:stretch;aspect-ratio:auto;height:auto;min-height:0;padding:30px 6% 50px;gap:30px}
 #recognition .recognition-motion{position:relative;inset:auto;width:100%;aspect-ratio:16/9;flex-shrink:0}
 #recognition .recognition-motion:after{display:none}
 #recognition .recognition-copy{width:100%;max-width:none;margin:0;text-shadow:none}
}

/* Desktop pairs the native-size animation with copy across the remaining field. */
@media(min-width:801px){
 #recognition .recognition-scene{display:grid;grid-template-columns:min(60%,960px) minmax(0,1fr);align-items:center;width:100%;max-width:none;margin:0;padding:0;gap:0;aspect-ratio:auto;height:auto;min-height:0}
 #recognition .recognition-motion{position:relative;inset:auto;z-index:0;width:100%;aspect-ratio:16/9;align-self:center}
 #recognition .recognition-motion:after{display:none}
 #recognition .recognition-copy{position:relative;z-index:1;box-sizing:border-box;width:100%;max-width:680px;min-width:0;margin:0;padding:45px clamp(28px,4vw,80px);text-shadow:none}
 #recognition .recognition-copy h2{font-size:clamp(52px,5.3vw,92px)}
 #recognition .recognition-copy .text-link{white-space:normal}
}
