/* Language roles. The three commissioned display faces require licensed web files.
   Their production assignments live in the typography board, not fake @font-face rules. */
@font-face{font-family:CySUIT;src:url('/assets/fonts/r23/suit/SUIT-Variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:CyRaleway;src:url('/assets/fonts/r23/raleway/Raleway-Variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--type-body:CyReference,Arial,sans-serif;--type-display:CySUIT,CyReference,sans-serif;--type-editorial:var(--type-display);--type-signature:var(--type-display)}
html[lang=en]{--type-body:CyRaleway,CyReference,Arial,sans-serif;--type-display:CyRaleway,CyReference,Arial,sans-serif;--type-editorial:var(--type-display);--type-signature:var(--type-display)}
body:is(.reference-r11,.route-r12),body.reference-r11 :is(#facilities,#material-passage,#services,#why,#research,#resources,#contact,.service-drawer){font-family:var(--type-body)}
body:is(.reference-r11,.route-r12) :is(h1,h2,h3,.menu-label,.menu-experience-title,.footer-invitation){font-family:var(--type-display)}
body.reference-r11 #hero-title,body.reference-r11 #hero-title *{font-family:var(--type-display)}
html[lang=ko] :is(.reference-heading,.passage-copy h2,.principles-heading h2,.contact-headline h1,.location-intro h1){font-weight:370;letter-spacing:-.055em;line-height:1.2;word-break:keep-all}
html[lang=en] body :is(h1,h2,h3,.reference-heading,.footer-invitation){word-break:normal;overflow-wrap:normal;hyphens:none;letter-spacing:-.045em}
html[lang=en] :is(p,.faq-answer,.service-drawer,.contact-form,summary){word-break:normal;overflow-wrap:break-word;letter-spacing:-.012em}
html[lang=en] :is(button,input,select,textarea){font-family:var(--type-body)}
html[lang=en] body.reference-r11 .passage-copy h2{font-size:clamp(36px,3.45vw,62px);line-height:1.06;letter-spacing:-.045em;font-weight:380}
html[lang=en] body.reference-r11 .passage-copy h2>span{font-size:clamp(15px,1.35vw,20px);line-height:1.45;letter-spacing:-.02em}
html[lang=en] body.reference-r11 .passage-copy p{font-size:clamp(14px,1.16vw,17px);line-height:1.6;font-weight:450;word-break:normal}
/* Connected protection has a copy-sized stage. Its label follows the copy rather
   than occupying a fixed bottom coordinate over the final lines of translation. */
body.reference-r11 .passage-sticky{display:grid;grid-template-columns:minmax(0,39%) 1fr;align-items:center;padding:96px 5vw 100px;min-height:var(--passage-min-height,100svh);height:auto}
body.reference-r11 .passage-copy{position:relative;inset:auto;transform:none;translate:none;width:100%;max-width:520px;grid-column:1;grid-row:1;margin:0}
body.reference-r11 .passage-copy h2{margin-bottom:24px}
body.reference-r11 .passage-copy h2>span{margin-top:22px}
body.reference-r11 .passage-copy p{max-width:42ch}
body.reference-r11 .passage-copy .passage-identity{display:block;position:static;margin:28px 0 0;font-size:9px;line-height:1.6;letter-spacing:.13em;font-weight:550;opacity:.55;max-width:100%}
body.reference-r11 .equipment-steps{top:auto;bottom:18%;right:10%}
#site-menu .menu-secondary{flex-wrap:wrap;row-gap:11px}
html[lang=en] body.reference-r11 #services .v8-service-copy p{font-weight:450}
body.reference-r11 #services .service-records{min-height:var(--service-copy-height,290px)}
body.reference-r11 #facilities .facility-viewport{height:var(--facility-copy-height,155px)}
@media(max-width:1000px) and (min-width:761px){
 body.reference-r11 .passage-sticky{grid-template-columns:44% 1fr;padding-inline:4vw}
 html[lang=en] body.reference-r11 .passage-copy h2{font-size:clamp(32px,3.9vw,44px)}
}
@media(max-width:760px){
 body.reference-r11 .passage-sticky{display:block;padding:85px 26px 440px;min-height:var(--passage-min-height,100svh);overflow:clip}
 body.reference-r11 .passage-copy{position:relative;inset:auto;width:100%;max-width:500px;text-align:left;transform:none;margin:0 auto}
 body.reference-r11 .passage-copy h2{font-size:clamp(32px,7.8vw,44px);line-height:1.18;max-width:100%;margin-bottom:20px}
 html[lang=en] body.reference-r11 .passage-copy h2{font-size:clamp(31px,8.4vw,47px);line-height:1.06}
 body.reference-r11 .passage-copy h2>span{font-size:15px;margin-top:16px}
 body.reference-r11 .passage-copy p,html[lang=en] body.reference-r11 .passage-copy p{font-size:14px;line-height:1.65;max-width:38ch;margin:0;font-weight:450}
 body.reference-r11 .passage-copy .passage-identity{font-size:8px;margin-top:22px}
 body.reference-r11 #equipment-stage{top:auto!important;bottom:60px!important;left:0!important;right:0;width:100%!important;height:350px!important;transform:none!important}
 body.reference-r11 #equipment-stage .equipment-art{position:absolute;left:50%;top:0;width:min(460px,100vw);height:350px;transform:translateX(-50%) translateY(var(--equipment-y,0px))}
 body.reference-r11 .equipment-caption{right:25px;bottom:0;gap:6px;max-width:200px;font-size:8px}
 body.reference-r11 .equipment-caption small{font-size:8px}
 body.reference-r11 .equipment-steps{top:auto;bottom:15px;right:auto;left:26px;gap:9px}
 body.reference-r11 .equipment-steps button{height:47px;width:47px;font-size:8px}
 html[lang=en] body.reference-r11 .reference-heading{font-size:clamp(38px,10vw,58px);line-height:1.12}
 html[lang=en] body.reference-r11 #why .principles-heading h2{font-size:clamp(34px,9vw,50px);line-height:1.12}
 html[lang=en] body.reference-r11 #hero-title .hero-mission{font-size:15px;line-height:1.4;max-width:330px;margin:auto}
 html[lang=en] body.reference-r11 #hero-title .hero-company{font-size:clamp(30px,8vw,42px)}
}
@media(min-width:761px) and (max-height:700px){body.reference-r11 .passage-sticky{padding-block:85px 65px}body.reference-r11 .passage-copy h2,html[lang=en] body.reference-r11 .passage-copy h2{font-size:34px}body.reference-r11 .passage-copy p,html[lang=en] body.reference-r11 .passage-copy p{font-size:14px}}