/* OUR STORY wireframe implementation. Scope page content; keep existing site frame. */
.os-page{background:#fff;color:#111}
.os-main,.os-lightbox{font-family:"Noto Sans CJK KR","Noto Sans KR",sans-serif;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
.os-main *,.os-lightbox *{box-sizing:border-box}
.os-page #header{background:rgba(255,255,255,.95);backdrop-filter:blur(15px)}
.os-page #header nav ul li{opacity:1;top:0;transform:none}
.os-page #header nav ul li a,.os-page #header .mob_nav .revision-brand a{color:#000}
.os-page .sub_top{height:auto;margin-top:60px;padding:28px 0 32px;z-index:1}
.os-page .sub_top .text_wrap{padding:0 4vw}
.os-page .sub_top .revision-display{font-size:clamp(40px,10vw,192px);line-height:1.05;letter-spacing:-.075em;white-space:nowrap}
.os-section{padding:100px 0;scroll-margin-top:70px;background:#fff;color:#111}
.os-section.os-dark{background:#000;color:#fff}
.os-inner{width:92%;max-width:1760px;margin:0 auto}
.os-main h2{font-size:clamp(26px,2.35vw,44px);line-height:1.4;font-weight:700;letter-spacing:-.055em;margin:0 0 48px;color:inherit}
.os-main h3{font-size:clamp(19px,1.5vw,26px);font-weight:700;line-height:1.5;margin:0 0 16px;color:inherit}
.os-main p,.os-main li,.os-main dd,.os-main dt{font-size:clamp(15px,1.03vw,19px);line-height:1.9;color:inherit}
.os-main a{color:inherit}
.os-main img{display:block;width:100%;height:auto}
.os-hero{padding:10px 0 70px}
.os-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:5vw}
.os-main .os-hero-copy h2{font-size:clamp(34px,3.55vw,68px);line-height:1.3;letter-spacing:-.06em;margin-bottom:40px}
.os-hero-copy h2 span{display:inline-block;font-size:.64em;margin-top:20px}
.os-hero-copy>p{font-size:clamp(17px,1.4vw,24px)}
.os-media{position:relative;margin:0;min-width:0;line-height:0}
.os-media video{display:block;width:100%;height:auto;max-height:670px;object-fit:contain;background:transparent}
#story-how{overflow:clip}
.os-how-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:30px 5vw;grid-template-areas:"flat differences" "method renders"}
.os-flat{grid-area:flat;margin:0;align-self:end}.os-differences{grid-area:differences;display:grid;grid-template-columns:1fr 1.1fr;gap:24px}.os-method{grid-area:method}.os-renders{grid-area:renders;margin:0}
.os-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.os-flat img{height:270px;object-fit:contain}.os-main figcaption{font-size:13px;line-height:1.6;color:#b3b3b3;margin-top:16px}
.os-main .os-flat figcaption{text-align:center}
.os-method{align-self:center;padding-top:24px}
.os-main .os-method h3{font-size:clamp(21px,calc(1.5vw + 2px),28px)}
.os-main .os-method li,.os-main .os-method p{font-size:clamp(17px,calc(1.03vw + 2px),21px)}.os-method ol{list-style:decimal;padding-left:22px}.os-method li{margin:10px 0}.os-method-result{margin-top:22px}
.os-renders .os-pair{height:410px;grid-template-rows:minmax(0,1fr)}.os-renders button{position:relative;width:100%;height:100%;min-width:0;min-height:0;cursor:zoom-in;background:transparent;color:#fff;border:0;padding:0}
.os-main .os-renders img{height:100%;object-fit:contain}
.os-renders figcaption{display:none}.os-renders button span{display:block;position:absolute;bottom:8px;right:0;padding:5px 10px;font-size:12px;background:#222}
.os-main .os-differences h3{font-size:21px}.os-main .os-differences p{font-size:19px;line-height:1.9}
#body-data{border-top:1px solid #292929}
.os-data-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:6vw;align-items:center}
.os-main .os-data-copy h2{margin-bottom:20px}.os-main .os-scope,.os-main .os-source{font-size:14px;color:#b7b7b7}
.os-main .os-counter{font-family:termina,sans-serif;font-size:clamp(64px,8vw,154px);font-weight:700;line-height:1.1;letter-spacing:-.09em;white-space:nowrap;margin:54px 0 18px}
.os-main .os-source{font-size:16px}
.os-main .os-data-description{font-size:clamp(17px,calc(1.03vw + 2px),21px);margin:36px 0 26px}
.os-text-link{display:inline-flex;gap:16px;align-items:center;min-height:44px;font-size:15px;line-height:1.7;border-bottom:1px solid currentColor;padding:8px 0}
.os-data-grid .os-media video{max-height:640px}
.os-quality-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.os-quality-grid img{aspect-ratio:3/2;object-fit:cover;margin-bottom:24px}.os-quality-grid img.os-diagram{object-fit:contain;background:#f3f3f3}
.os-main .os-quality-grid h3{font-size:clamp(21px,calc(1.5vw + 2px),28px);margin-bottom:10px}
.os-main .os-quality-grid p{font-size:clamp(17px,calc(1.03vw + 2px),21px)}.os-prototype{color:#666}
#story-research,#story-company{padding-top:60px}
.os-timeline{list-style:none;margin:65px 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
.os-timeline>li{position:relative;border-top:1px solid #aaa;padding:28px 28px 0 0}
.os-timeline>li:before{content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;background:#000;border-radius:50%}
.os-timeline h3{font:600 19px/1.4 termina,sans-serif;margin-bottom:24px}
.os-timeline h4{font-size:16px;font-weight:700;line-height:1.6;margin-bottom:8px}.os-timeline h4:not(:first-child){margin-top:26px}
.os-timeline p{font-size:14px;line-height:1.8}
.os-company-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;border-top:1px solid #ccc;padding-top:38px}
.os-company-grid p,.os-company-grid dt,.os-company-grid dd{font-size:15px}.os-company-grid p{margin-bottom:6px}.os-company-grid dl>div{margin-bottom:10px}.os-company-grid dt{font-weight:700}.os-main .os-equipment-title{margin-top:34px}
.os-main .os-partners{margin-top:28px;background:#000;color:#fff;padding:16px 20px;font-weight:700}
.os-cta{text-align:center}.os-cta h2{margin-bottom:38px}.os-actions{display:flex;justify-content:center;gap:24px;margin:0 auto 24px;max-width:760px}
.os-button{display:flex;align-items:center;justify-content:space-between;gap:32px;background:#fff;color:#000!important;border:1px solid #fff;padding:18px 26px;min-height:60px;flex:1;font-size:17px;font-weight:600;transition:background .2s}
.os-button:hover{background:#ddd}.os-cta .os-text-link{color:#aaa}
.os-lightbox{background:#090909;color:#fff;width:min(94vw,1100px);height:min(92dvh,950px);max-width:none;max-height:none;padding:56px 24px 24px;border:1px solid #555;overflow:hidden}
.os-lightbox::backdrop{background:rgba(0,0,0,.85)}.os-lightbox h2{font-size:18px;margin:0 0 12px}.os-lightbox img{height:calc(100% - 45px);width:100%;object-fit:contain}.os-lightbox-close{position:absolute;right:16px;top:8px;color:#fff;background:transparent;border:0;padding:12px;min-height:44px;cursor:pointer;font-size:16px}
.os-sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.os-mobile-break{display:none}.os-skip{position:fixed;left:12px;top:-100px;z-index:10000;background:#000;color:#fff;padding:12px 20px}.os-skip:focus{top:10px}
.os-fitting-lead{max-width:850px}.os-fitting-lead>p{font-size:19px;margin-bottom:26px}.os-fitting-steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:64px}.os-fitting-steps li{border-top:1px solid #aaa;padding-top:20px}.os-fitting-steps span{font:500 15px termina,sans-serif}.os-fitting-steps h3{margin-top:20px}
/* Extend roughly 60% from the right, beneath the final 0+ of the counter. */
@media(min-width:1025px){
 /* Layer the story title over the hero without reserving a separate title row. */
 .os-story .sub_top{position:absolute;top:60px;left:0;margin-top:0;z-index:2;background:transparent}
 .os-story #story-main{padding-top:60px}
 .os-hero,#body-data{position:relative;isolation:isolate;overflow:clip}
 .os-hero-grid,.os-data-grid{display:grid;grid-template-columns:4% 32% 20% 44%;gap:0;width:100%;max-width:none;min-height:640px}
 .os-hero-copy,.os-data-copy{grid-area:1 / 2 / 2 / 4;position:relative;z-index:1;width:100%}
 .os-hero>.os-inner>.os-media,#body-data>.os-inner>.os-media{grid-area:1 / 3 / 2 / 5;position:relative;width:100%;height:auto;z-index:0;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 4%)}
 /* Keep the workflow window to the right of the final Y in OUR STORY. */
 .os-story .os-hero>.os-inner>.os-media{width:82%;justify-self:end}
 .os-hero .os-media video,#body-data .os-media video{width:100%;height:auto;max-height:none;object-fit:contain}
 .os-data-copy .os-counter{text-shadow:0 2px 18px rgba(0,0,0,.3)}
}
@media(max-width:1024px){
 .os-section{padding:65px 0}.os-inner{width:90%}.os-page .sub_top .text_wrap{padding:0 5%}.os-page .sub_top .revision-display{font-size:10vw}
 .os-hero-grid,.os-how-grid,.os-data-grid,.os-quality-grid,.os-company-grid,.os-fitting-steps{grid-template-columns:1fr}
 .os-hero-grid{gap:36px}.os-hero{padding-top:15px}.os-hero-copy h2{max-width:800px}.os-media{width:min(100%,650px);margin:0 auto}.os-media video{max-height:580px}
 .os-how-grid{grid-template-areas:"flat" "renders" "method" "differences";gap:40px}.os-flat img{height:300px}.os-renders .os-pair{height:410px}
 .os-differences{grid-template-columns:1fr;border-top:1px solid #333;padding-top:30px;gap:26px}.os-data-grid{gap:40px}.os-main .os-counter{font-size:clamp(60px,13vw,125px)}
 .os-quality-grid{gap:45px}.os-quality-grid img{max-height:520px}.os-timeline{grid-template-columns:1fr;margin-top:40px}.os-timeline>li{border-top:0;border-left:1px solid #aaa;margin-left:5px;padding:0 0 36px 28px;display:grid;grid-template-columns:90px 1fr;gap:20px}.os-timeline>li:last-child{padding-bottom:0}.os-timeline>li:before{top:5px;left:-5px}.os-timeline h3{margin:0}.os-timeline h4:not(:first-child){margin-top:20px}
 .os-company-grid{gap:40px}.os-poster-mobile video{max-height:500px}
 .os-actions{flex-direction:column;gap:16px}.os-button{width:100%}.os-fitting-steps{gap:25px}
}
@media(max-width:600px){
 .os-page .sub_top{margin-top:60px;padding:24px 0}.os-page #header{height:60px}.os-main h2{font-size:26px;margin-bottom:30px}.os-main .os-hero-copy h2{font-size:34px}.os-hero-copy h2 span{font-size:.61em;margin-top:15px}.os-main .os-hero-copy>p{font-size:16px}.os-main .os-hero-copy h2{margin-bottom:22px}
 .os-pair{gap:18px}.os-flat img{height:180px}.os-renders .os-pair{grid-template-columns:1163fr 955fr;height:min(265px,calc((90vw - 18px) * .75543))}.os-main .os-counter{font-size:15vw;margin:36px 0 18px}.os-main .os-source{font-size:15px}.os-main .os-scope{font-size:13px}.os-mobile-break{display:block}.os-timeline>li{grid-template-columns:64px 1fr;gap:12px;padding-left:22px}.os-timeline h3{font-size:16px}.os-section{scroll-margin-top:60px}.os-text-link{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.os-main *{animation:none!important;transition:none!important}}
