@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard@1.3.9/dist/web/static/pretendard.css";
@import"https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;900&family=Noto+Sans+KR:wght@400;500;700;900&family=Baloo+2:wght@500;600;700;800&family=Kalam:wght@700&family=Caveat:wght@600;700&display=swap";
@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;800&display=swap";
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300..800&display=swap");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@1.3.9/dist/web/variable/pretendardvariable.css");
:root{--off-white:#FFFFFF;--white:#FFFFFF;--ink:#131211;--ink-soft:#6B6862;--ink-faint:#A6A297;--line:rgba(19,18,17,.14);--line-strong:rgba(19,18,17,.28);--accent:#5BA0A0;--accent-ink:color-mix(in srgb, var(--accent) 55%, black);--accent-soft:color-mix(in srgb, var(--accent) 20%, white);--surface-grey:color-mix(in srgb, var(--ink) 6%, white);--error:#B3453A;--font-display:"aktiv-grotesk", "Pretendard", sans-serif;--font-body:"aktiv-grotesk", "Pretendard", sans-serif;--container:clamp(20px, 4.4vw, 64px);--gap:clamp(10px, 1.6vw, 24px);--fs-hero:clamp(3rem, 9.6vw, 9.4rem);--fs-h1:clamp(2.2rem, 6.2vw, 5.6rem);--fs-h2:clamp(1.5rem, 3vw, 2.5rem);--fs-body:clamp(1rem, 1.05vw, 1.15rem);--fs-small:.92rem;--fs-meta:.72rem;color-scheme:only light}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--off-white);color:var(--ink);font-family:var(--font-body);font-weight:400;font-style:normal;font-size:var(--fs-body);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:998;opacity:.5;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='matrix' values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.035 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}::selection{background:var(--accent);color:var(--white)}.wrap{max-width:1680px;margin:0 auto;padding-left:var(--container);padding-right:var(--container)}.grid12{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}.rule{border:0;border-top:1px solid var(--line);margin:0}.eyebrow{font-family:var(--font-body);font-size:var(--fs-meta);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}.idx{font-family:var(--font-body);font-size:var(--fs-meta);color:var(--ink-faint);letter-spacing:.04em}.display{font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.03em;line-height:.94;text-transform:uppercase;text-wrap:balance}.kr{font-family:var(--font-body);font-weight:400;color:var(--ink)}.kr-soft{color:var(--ink-soft)}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}[data-reveal].is-visible{opacity:1;transform:translateY(0)}[data-reveal=line]{transform:none}@media (prefers-reduced-motion: reduce){[data-reveal]{opacity:1!important;transform:none!important;transition:none!important}html{scroll-behavior:auto!important}*{animation:none!important}}html{scroll-behavior:smooth}.site-header{position:sticky;top:0;z-index:500;background:#ffffffdb;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:1px solid transparent;transition:border-color .4s ease,background .4s ease}.site-header.is-scrolled{border-bottom-color:var(--line)}.site-header.on-dark{background:#131211c7;border-bottom-color:#f3f1ea29}.site-header.on-dark .nav-link{color:var(--off-white)}.site-header.on-dark .nav-link:after{background:var(--off-white)}.site-header.on-dark .nav-inquiry{border-color:#f3f1ea66;color:var(--off-white)}.site-header.on-dark .nav-inquiry:hover{background:var(--off-white);color:var(--ink)}.site-header.on-dark .nav-toggle{color:var(--off-white)}.site-header.on-dark .nav-toggle .bar,.site-header.on-dark .nav-toggle .bar:before,.site-header.on-dark .nav-toggle .bar:after{background:var(--off-white)}.site-header .logo-mark .lg-white,.site-header.on-dark .logo-mark .lg-color{display:none}.site-header.on-dark .logo-mark .lg-white{display:block}.header-inner{display:flex;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:16px}.logo-mark{display:flex;align-items:center;gap:8px}.logo-mark img{height:16px;width:auto}.header-nav{display:flex;align-items:center;gap:clamp(16px,2.4vw,34px)}.nav-link{font-family:var(--font-body);font-size:.82rem;font-weight:400;letter-spacing:.02em;text-transform:uppercase;position:relative;padding:2px 0}.nav-link:after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:var(--ink);transition:right .35s cubic-bezier(.16,.84,.44,1)}.nav-link:hover:after{right:0}.nav-inquiry{display:flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:.76rem;letter-spacing:.03em;border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;transition:background .3s ease,color .3s ease,border-color .3s ease}.nav-inquiry:hover{background:var(--ink);color:var(--off-white);border-color:var(--ink)}.nav-toggle{display:none}.hero{padding-top:clamp(28px,7vw,72px);padding-bottom:clamp(40px,8vw,96px)}.hero-meta{display:flex;flex-direction:column;gap:3px;padding-bottom:clamp(28px,5vw,56px)}.hero-meta .b1{font-family:var(--font-body);font-weight:400;letter-spacing:.02em;font-size:.95rem}.hero-headline{grid-column:1/13;position:relative}.hero-headline h1{font-size:var(--fs-hero)}.hero-headline h1 span{display:block}.hero-headline h1 .accent-word{color:var(--accent)}.hero-idx{grid-column:1/13;display:flex;justify-content:space-between;align-items:flex-end;margin-top:clamp(18px,3vw,32px);padding-top:16px;border-top:1px solid var(--line)}.hero-idx .kr-block{max-width:420px}.hero-idx .kr-block p{font-size:1.02rem;line-height:1.6}.hero-idx .kr-block .caption{margin-top:10px;font-family:var(--font-body);font-size:.78rem;color:var(--ink-soft);letter-spacing:.02em}.hero-visual{flex:none;max-width:460px}.hero-statement{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.01em;line-height:1.08;font-size:clamp(1.6rem,3.2vw,2.6rem);color:var(--ink);text-align:right}.hero-statement span{display:block}section{position:relative;padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(64px,9vw,120px)}.section-head{grid-column:1/13;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:clamp(30px,5vw,60px)}.section-head h2{font-size:var(--fs-h1)}.section-head .idx{margin-top:6px}.section-sub{grid-column:1/13;margin-top:-10px;padding-bottom:clamp(30px,5vw,54px)}.section-sub p{font-size:1.05rem;color:var(--ink-soft);max-width:520px}.work-list{grid-column:1/13;display:flex;flex-direction:column;gap:clamp(48px,7vw,96px)}.proj{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:end}.proj-visual{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line);aspect-ratio:4/5}.proj-visual .zoom{position:absolute;top:0;right:0;bottom:0;left:0;transition:transform 1s cubic-bezier(.16,.84,.44,1)}.proj:hover .proj-visual .zoom{transform:scale(1.045)}.key-visual-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.key-visual-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;display:block}.bv{position:absolute;top:0;right:0;bottom:0;left:0}.bv-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.bv-circle,.bv-petal,.bv-dot{opacity:0;transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1)}.bv-circle{transform:scale(.55)}.bv-petal{transform:scale(.5)}.bv-dot{transform:scale(.2);transition-duration:.45s}.bv.is-visible .bv-circle,.bv.is-visible .bv-petal,.bv.is-visible .bv-dot{opacity:1;transform:scale(1)}@media (prefers-reduced-motion: reduce){.bv-circle,.bv-petal,.bv-dot{opacity:1!important;transform:none!important;transition:none!important}}.proj-meta{display:flex;flex-direction:column;gap:10px}.proj-meta .p-index{font-family:var(--font-body);font-size:.74rem;color:var(--ink-faint)}.proj-meta h3{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.01em;line-height:1.02}.proj-meta .tags{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--font-body);font-size:.74rem;color:var(--ink-soft);letter-spacing:.02em}.proj-meta .tags span:not(:last-child):after{content:"—";margin-left:10px;color:var(--ink-faint)}.proj-link{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-family:var(--font-body);font-size:.78rem}.proj-link .u{position:relative}.proj-link .u:after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:var(--ink);transition:right .35s cubic-bezier(.16,.84,.44,1)}.proj:hover .proj-link .u:after{right:0}.proj--01 .proj-visual{grid-column:1/8;aspect-ratio:16/11}.proj--01 .proj-meta{grid-column:9/13;align-self:end;padding-bottom:4px}.proj--01 h3{font-size:clamp(1.8rem,3.2vw,3rem)}.proj--02 .proj-visual{grid-column:1/5}.proj--02 .proj-meta{grid-column:5/8;align-self:end}.proj--02 h3{font-size:clamp(1.3rem,2vw,1.9rem)}.proj--03{grid-template-columns:repeat(12,1fr)}.proj--03 .proj-meta{grid-column:1/4;align-self:end;order:1}.proj--03 .proj-visual{grid-column:5/13;order:2;aspect-ratio:16/9}.proj--03 h3{font-size:clamp(1.3rem,2vw,1.9rem)}.proj--04 .proj-visual{grid-column:2/7}.proj--04 .proj-meta{grid-column:8/12;align-self:end}.proj--04 h3{font-size:clamp(1.3rem,2vw,1.9rem)}.plate{position:absolute;top:0;right:0;bottom:0;left:0}.plate-dots{background-image:radial-gradient(var(--ink) 1.4px,transparent 1.6px);background-size:15px 15px;background-position:-4px -4px;opacity:.9}.plate-diag{background:repeating-linear-gradient(35deg,var(--ink) 0 2px,transparent 2px 18px);opacity:.85}.plate-block{background:var(--ink)}.plate-accent{background:var(--accent)}.plate-ring{border-radius:50%;border:1.5px solid var(--ink)}.plate-ring--fill{background:var(--accent-soft)}.plate-off{background:var(--off-white)}.plate-mono{font-family:var(--font-display);font-weight:900;font-style:normal;color:var(--off-white);letter-spacing:-.04em;line-height:.82;text-transform:uppercase}.pov{background:var(--surface-grey);color:var(--ink)}.pov .idx,.pov .eyebrow{color:var(--ink-soft)}.pov h2{font-size:var(--fs-hero);color:var(--ink)}.pov h2 .accent-word{color:var(--accent)}.pov-divider{grid-column:1/13;border:0;border-top:1px solid var(--line-strong);margin:clamp(28px,4vw,44px) 0 0}.pov-copy{grid-column:7/13;align-self:end}.pov-copy p{font-size:1.08rem;line-height:1.75;color:var(--ink);transition:color .3s ease}.pov-copy p:hover{color:var(--accent)}.pov-head{grid-column:1/13}.pov-intro{grid-column:1/6;align-self:end;margin-top:clamp(24px,4vw,40px)}.pov-intro p{font-size:1.1rem;line-height:1.75;color:var(--ink-soft)}.pov-keywords{grid-column:1/13;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,32px);margin-top:clamp(40px,6vw,64px);padding-top:22px;border-top:1px solid var(--line-strong)}.pov-keyword{display:flex;flex-direction:column;gap:5px}.pov-keyword-en{font-family:var(--font-body);font-size:.8rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--ink)}.pov-keyword-kr{font-family:var(--font-body);font-size:.78rem;color:var(--ink-soft)}.wwd-row{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);padding:clamp(30px,4.5vw,52px) 0;border-top:1px solid var(--line)}.wwd-row:last-child{border-bottom:1px solid var(--line)}.wwd-num{grid-column:1/2;font-family:var(--font-body);font-size:.85rem;color:var(--ink-faint);padding-top:10px}.wwd-title{grid-column:2/6}.wwd-title h3{font-family:var(--font-display);font-size:clamp(2rem,4.4vw,3.6rem);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.02em;line-height:.96;transition:color .3s ease}.wwd-row:hover .wwd-title h3{color:var(--accent)}.wwd-body{grid-column:7/12;align-self:center}.wwd-body p{font-size:1.05rem;color:var(--ink-soft);max-width:480px;margin-bottom:16px}.wwd-body .tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--font-body);font-size:.72rem;letter-spacing:.02em;color:var(--ink)}.wwd-body .tags span{border:1px solid var(--line-strong);border-radius:999px;padding:5px 12px}.wwd-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(36px,5vw,64px) var(--gap)}.wwd-group{border-top:1px solid var(--line);padding-top:22px;transition:border-color .3s ease}.wwd-group-title{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;font-size:clamp(1.3rem,2.4vw,1.9rem);letter-spacing:-.01em;line-height:1.1;transition:color .3s ease}.wwd-group-title-kr{display:block;font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint);letter-spacing:.01em;margin-top:5px;margin-bottom:18px;transition:color .3s ease}.wwd-group-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.wwd-group-list li{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:7px}.wwd-item-en{font-family:var(--font-body);font-size:.95rem;color:var(--ink-soft);transition:color .3s ease}.wwd-item-kr{font-family:var(--font-body);font-size:.8rem;color:var(--ink-faint);transition:color .3s ease}.wwd-group:hover{border-top-color:var(--accent)}.wwd-group:hover .wwd-group-title,.wwd-group:hover .wwd-group-title-kr,.wwd-group:hover .wwd-item-en,.wwd-group:hover .wwd-item-kr{color:var(--accent)}.our-method-title{font-size:clamp(1.6rem,3.4vw,2.6rem)!important;line-height:1.12!important}.our-method-link{font-size:clamp(1.15rem,1.8vw,1.4rem)!important}.branding-section{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.brand-copy{grid-column:1/6}.brand-copy p{font-size:1.05rem;color:var(--ink-soft);line-height:1.8;margin-top:18px;max-width:460px}.flow{grid-column:7/13;display:flex;flex-direction:column}.flow-step{display:flex;align-items:baseline;gap:18px;padding:14px 0;border-top:1px solid var(--line)}.flow-step:last-child{border-bottom:1px solid var(--line)}.flow-step .fn{font-family:var(--font-body);font-size:.75rem;color:var(--ink-faint);width:26px;flex:none}.flow-step .fw{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.01em;transition:transform .4s cubic-bezier(.16,.84,.44,1),color .4s ease;transform-origin:left center}.flow-step:nth-child(1) .fw{font-size:clamp(1.6rem,3.2vw,2.6rem)}.flow-step:nth-child(2) .fw{font-size:clamp(1.8rem,3.6vw,3rem)}.flow-step:nth-child(3) .fw{font-size:clamp(2rem,4vw,3.4rem)}.flow-step:nth-child(4) .fw{font-size:clamp(2.2rem,4.4vw,3.8rem)}.flow-step:nth-child(5) .fw{font-size:clamp(2.6rem,5.2vw,4.6rem);color:var(--accent)}.flow-step:hover .fw{transform:translate(10px)}#education-experience{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(64px,9vw,120px);border-top:1px solid var(--line)}.edu-experience-item{margin-top:clamp(70px,9vw,120px)}.edu-experience-item:first-child{margin-top:0}.edu-moment-media{position:relative;overflow:hidden;background:var(--surface-grey)}.edu-moment-media .pm-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.edu-moment-media .pm-placeholder{position:absolute;top:0;right:0;bottom:0;left:0}.edu-moment-caption{display:flex;flex-direction:column;gap:2px;margin-top:12px;font-family:var(--font-body)}.edu-moment-title{font-size:.82rem;color:var(--ink)}.edu-moment-meta{font-size:.7rem;color:var(--ink-faint);letter-spacing:.02em;text-transform:uppercase}.edu-moment--full{width:100%}.edu-moment--full .edu-moment-caption{padding:0 var(--container)}.edu-moment--center{max-width:820px;margin:0 auto;padding:0 var(--container)}.edu-moment--small{max-width:480px;margin:0 auto;padding:0 var(--container)}.edu-line{font-family:var(--font-body);font-size:1.05rem;color:var(--ink-soft);text-align:center;max-width:520px;margin:clamp(50px,7vw,90px) auto 0}.about-copy{grid-column:1/6}.about-copy .lead{font-size:1.2rem;line-height:1.7;margin-bottom:16px}.about-copy p.body-p{color:var(--ink-soft);font-size:1.02rem;line-height:1.8;max-width:440px}.about-photo{grid-column:7/13;aspect-ratio:4/3;position:relative;overflow:hidden;background:var(--ink)}.about-clients{grid-column:1/13;margin-top:clamp(50px,7vw,88px)}.clients-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-strong);border-left:1px solid var(--line-strong)}.client-cell{border-right:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);padding:26px 18px;display:flex;align-items:center;justify-content:center;min-height:96px}.client-mark{display:block;height:var(--h, 36px);width:calc(var(--h, 36px) * var(--ratio));max-width:100%;background-color:var(--ink-soft);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;transition:background-color .3s ease}.client-cell:hover .client-mark{background-color:var(--accent)}.contact{background:var(--accent);color:var(--ink)}.contact .idx,.contact .eyebrow{color:#1312119e}.contact h2{font-size:clamp(3rem,10vw,8.6rem);color:var(--ink)}.contact-copy{grid-column:1/6;margin-top:clamp(24px,4vw,40px)}.contact-copy p{font-size:1.1rem;line-height:1.7;color:#131211d1}.contact-actions{grid-column:7/13;margin-top:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:0}.talk-link{display:inline-flex;align-items:center;gap:14px;font-family:var(--font-body);font-weight:400;text-transform:uppercase;font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:-.01em;padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid rgba(19,18,17,.35);align-self:flex-start;color:var(--ink)}.talk-link .arrow{transition:transform .35s cubic-bezier(.16,.84,.44,1)}.talk-link:hover .arrow{transform:translate(5px,-5px)}.contact-links{display:flex;flex-direction:column}.contact-inquiry{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-top:1px solid rgba(19,18,17,.22);font-family:var(--font-body);font-size:.85rem;letter-spacing:.02em;color:var(--ink)}.contact-inquiry:last-child{border-bottom:1px solid rgba(19,18,17,.22)}.contact-inquiry span.arr{transition:transform .3s ease}.contact-inquiry:hover span.arr{transform:translate(6px)}.site-footer{background:var(--accent);color:var(--ink);padding-top:clamp(44px,7vw,72px);padding-bottom:28px}.footer-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;padding-bottom:clamp(30px,5vw,52px)}.footer-top-meta{display:flex;flex-direction:column;gap:3px;align-items:flex-end;text-align:right}.footer-top-meta .eyebrow{color:#1312119e}.footer-nav{display:flex;flex-wrap:wrap;gap:clamp(14px,2.4vw,28px);padding:20px 0;border-top:1px solid rgba(19,18,17,.22)}.footer-nav a{font-family:var(--font-body);font-weight:400;font-size:.85rem;letter-spacing:.02em;text-transform:uppercase}.footer-nav a:hover{color:var(--off-white)}.footer-direct{display:flex;gap:24px;padding:6px 0 20px}.footer-direct a{font-family:var(--font-body);font-size:.8rem}.footer-direct a:hover{color:var(--off-white)}.footer-row{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;padding-top:20px;border-top:1px solid rgba(19,18,17,.22)}.footer-tagline{font-family:var(--font-body);font-weight:400;text-transform:uppercase;font-size:.85rem;letter-spacing:.01em}.footer-brand img{height:20px;width:auto}.footer-meta{display:flex;gap:28px;font-family:var(--font-body);font-size:.76rem;color:#131211a6}.back-top{font-family:var(--font-body);font-size:.76rem;color:#131211a6}.back-top:hover{color:var(--ink)}.footer-legal{display:flex;flex-wrap:wrap;row-gap:4px;margin-top:20px;padding-top:16px;border-top:1px solid rgba(19,18,17,.22);font-family:var(--font-body);font-size:.68rem;line-height:1.6;color:#131211b8}.footer-legal-sep{margin:0 10px;color:#13121166}.floating-idx{position:fixed;left:16px;bottom:16px;z-index:400;font-family:var(--font-body);font-size:.72rem;color:var(--ink-soft);display:flex;align-items:center;gap:8px;writing-mode:horizontal-tb;opacity:0;transition:opacity .5s ease;pointer-events:none}.floating-idx.is-visible{opacity:1}.floating-idx .dot{width:5px;height:5px;border-radius:50%;background:var(--accent)}.floating-idx.on-dark{color:#f3f1eabf}.mobile-nav{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--off-white);z-index:600;display:flex;flex-direction:column;justify-content:center;padding:0 28px;transform:translateY(-100%);transition:transform .5s cubic-bezier(.16,.84,.44,1)}.mobile-nav.is-open{transform:translateY(0)}.mobile-nav a{font-family:var(--font-body);font-weight:400;text-transform:uppercase;font-size:clamp(2.2rem,10vw,3.4rem);letter-spacing:-.02em;padding:10px 0;border-bottom:1px solid var(--line)}.mobile-nav .m-close{position:absolute;top:20px;right:var(--container);font-family:var(--font-body);font-size:.85rem}.mobile-nav .m-inquiry{margin-top:24px;font-family:var(--font-body);font-size:.9rem;color:var(--accent)}.mobile-nav a.is-active,.nav-link.is-active{color:var(--accent)}.nav-link.is-active:after{right:0;background:var(--accent)}.site-header.on-dark .nav-link.is-active{color:var(--accent)}.page-transition{animation:page-in .5s cubic-bezier(.16,.84,.44,1) both}@keyframes page-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.page-transition{animation:none}}.page-hero{padding-top:clamp(28px,7vw,72px);padding-bottom:clamp(20px,4vw,40px)}.page-hero--branding{padding-top:clamp(56px,11vw,116px)}.contact-statement{padding-top:clamp(28px,5vw,56px);padding-bottom:clamp(28px,5vw,56px)}.contact-statement-text{display:block;line-height:1.2;font-size:clamp(1.4rem,2.6vw,2rem);color:var(--ink)}.page-hero--accent{background:var(--accent);color:var(--ink)}.page-hero--accent .eyebrow{color:#131211d1}.page-hero--accent .back-link{color:var(--ink)}.page-hero--accent .form-field label,.page-hero--accent .type-card .type-items,.page-hero--accent .dc-item .eyebrow{color:#131211d1}.page-hero--accent .form-field input,.page-hero--accent .form-field textarea{color:var(--ink);border-bottom-color:#1312114d}.page-hero--accent .form-field input::placeholder,.page-hero--accent .form-field textarea::placeholder{color:#13121173}.case-hero{padding-bottom:clamp(20px,3vw,32px)}.back-link{display:inline-block;font-family:var(--font-body);font-size:.78rem;letter-spacing:.03em;color:var(--ink-soft);margin-bottom:10px;transition:color .25s ease}.back-link:hover{color:var(--ink)}.intro-steps{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);margin-top:clamp(30px,5vw,54px)}.intro-step{grid-column:span 4;border-top:1px solid var(--line-strong);padding-top:16px}.intro-step .wwd-num{display:block;margin-bottom:10px}.intro-step h3{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:1.3rem;letter-spacing:.01em;margin-bottom:8px}.intro-step p{color:var(--ink-soft);font-size:.98rem}.preview-list{display:flex;flex-direction:column}.preview-block{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);padding:clamp(28px,5vw,52px) 0;border-top:1px solid var(--line)}.preview-list .preview-block:last-child{border-bottom:1px solid var(--line)}.preview-block .wwd-num{grid-column:1/2;padding-top:10px}.preview-block-body{grid-column:2/9}.preview-block-visual{grid-column:9/13;align-self:center}.preview-block-body .eyebrow{display:block;margin-bottom:10px}.preview-block-body h3{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.01em;line-height:1;margin-bottom:14px;font-size:clamp(1.9rem,4vw,3.2rem)}.preview-block-body p{color:var(--ink-soft);font-size:1.02rem;max-width:520px;margin-bottom:10px}.preview-block-body .tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--font-body);font-size:.72rem;margin:10px 0}.preview-block-body .tags span{border:1px solid var(--line-strong);border-radius:999px;padding:5px 12px}.preview-block-body .lines{color:var(--ink-soft);font-size:.92rem;font-family:var(--font-body)}.preview-block-body .lines div{margin-top:4px}.preview-block-body .proj-link{margin-top:14px;display:inline-flex}.chapter-static{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(64px,9vw,120px)}.chapter--branding{background:var(--off-white);color:var(--ink)}.chapter--design{background:var(--surface-grey);color:var(--ink)}.chapter--education{background:var(--off-white);color:var(--ink)}.chapter-inner{align-items:center}.chapter-content{grid-column:1/7}.chapter-content .idx{display:block;margin-bottom:14px}.chapter-content .eyebrow{display:block;margin-bottom:12px}.chapter-content .chapter-title{font-size:clamp(2.4rem,5.4vw,4.4rem);margin-bottom:18px}.chapter-content p.kr-soft{font-size:1.02rem;max-width:480px;margin-bottom:10px}.chapter-content .proj-link{margin-top:16px;display:inline-flex}.chapter-index{grid-column:7/13;display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:clamp(28px,4vw,52px)}.chapter-index .ci-number{font-family:var(--font-display);font-weight:900;font-style:normal;line-height:.86;letter-spacing:-.02em;font-size:clamp(6rem,11vw,10.5rem);color:color-mix(in srgb,var(--accent) 40%,white)}.chapter-index .ci-list{list-style:none;margin:0;padding:0;width:100%;max-width:300px}.chapter-index .ci-list li{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-top:1px solid var(--line-strong)}.chapter-index .ci-list li:last-child{border-bottom:1px solid var(--line-strong)}.chapter-index .ci-list .ci-en{font-family:var(--font-body);font-size:.86rem;letter-spacing:.01em;color:var(--ink-soft)}.chapter-index .ci-list .ci-kr{font-family:var(--font-body);font-size:.74rem;letter-spacing:0;color:var(--ink-faint)}.chapter-static .cm{opacity:0;transform:translateY(22px);transition:opacity .75s cubic-bezier(.16,.84,.44,1),transform .75s cubic-bezier(.16,.84,.44,1)}.chapter-static.is-visible .cm{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion: reduce){.chapter-static .cm{opacity:1!important;transform:none!important;transition:none!important}}.ending-scroll{position:relative}.ending-sticky{position:sticky;top:0;height:100vh;overflow:hidden}.ending-scene{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center}.ending-scene--about{background:var(--accent);color:var(--ink);z-index:1;transition:background-color .5s ease}.ending-scene--about.is-attitude{background:var(--off-white)}.ending-scene--about .idx,.ending-scene--about .eyebrow{color:#131211d1}.ending-scene--about .kr-soft{color:#131211c7}.ending-scene--contact{background:var(--accent);color:var(--ink);z-index:2;clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.16,.84,.44,1);pointer-events:none}.ending-scene--contact.is-revealed{clip-path:inset(0 0 0% 0);pointer-events:auto}.ending-inner{align-items:center}.ending-content{grid-column:1/7}.ending-scene--contact .ending-content{grid-column:1/8}.ending-visual{grid-column:7/13;will-change:transform;display:flex;align-items:center;justify-content:center}.ending-symbol{width:88%;max-width:560px;height:auto;display:block}.ending-content .idx{display:block;margin-bottom:14px}.ending-content .eyebrow{display:block;margin-bottom:12px}.ending-title{font-size:clamp(2.6rem,6vw,5.6rem);margin-bottom:16px}.ending-kr{margin-bottom:14px}.ending-kr p{line-height:1.6}.ending-desc{max-width:440px;font-size:1.02rem;margin-bottom:6px}.ending-scene--contact .ending-desc{font-size:1.1rem;line-height:1.7;color:#131211d1;max-width:460px;margin-bottom:26px}.ending-scene--contact .talk-link{margin-top:4px}.ending-contact-caption{display:block;margin-top:22px;font-family:var(--font-body);font-size:.7rem;letter-spacing:.12em;color:#1312118c}.ending-scene--contact .idx,.ending-scene--contact .eyebrow{color:#131211d1}.ending-attitude-word{font-size:clamp(3.5rem,9vw,7.5rem);margin-bottom:10px}.ending-attitude-tag{display:block;font-family:var(--font-body);font-size:.85rem;letter-spacing:.06em;color:#131211b3;text-transform:uppercase}.ending-attitude-rail{position:absolute;left:var(--container);bottom:clamp(28px,5vw,48px);z-index:3;display:flex;gap:14px;font-family:var(--font-body);font-size:.76rem;letter-spacing:.04em;color:#1312116b}.ending-attitude-rail span{transition:color .3s ease}.ending-attitude-rail span.is-active{color:#131211d9;font-weight:700}.ending-mobile{display:none}.ending-mobile-block{padding:clamp(44px,8vw,68px) 0}.ending-mobile-block .idx{display:block;margin-bottom:12px}.ending-mobile-block .eyebrow{display:block;margin-bottom:10px}.ending-mobile-block .ending-title{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.02em;line-height:1;font-size:clamp(2.1rem,9vw,3.2rem);margin-bottom:16px}.ending-attitude-mobile{display:flex;flex-direction:column;gap:14px;margin:22px 0 6px;padding-top:18px;border-top:1px solid var(--line-strong)}.ending-attitude-mobile-item{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.ending-attitude-mobile-item .display{font-size:clamp(1.8rem,7vw,2.4rem)}.ending-attitude-mobile-item .caption{font-family:var(--font-body);font-size:.72rem;color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase}.about-preview{padding:clamp(28px,5vw,52px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.about-preview .grid12{align-items:center}.home-cta{margin-top:0}.work-featured{position:relative;overflow:hidden;aspect-ratio:16/8;border:1px solid var(--line);background:var(--white)}.work-featured .plate{will-change:transform}.work-featured-meta{margin-top:18px;display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:10px}.work-featured-meta h3{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1.6rem,3.2vw,2.6rem);text-transform:uppercase}.work-featured-meta .tags{display:flex;gap:10px;font-family:var(--font-body);font-size:.78rem;color:var(--ink-soft)}.filter-row{display:flex;flex-wrap:wrap;gap:10px;padding-bottom:clamp(30px,5vw,54px)}.filter-pill{font-family:var(--font-body);font-size:.76rem;letter-spacing:.02em;border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;color:var(--ink-soft);transition:background .25s ease,color .25s ease,border-color .25s ease}.filter-pill:hover{border-color:var(--ink);color:var(--ink)}.filter-pill.is-active{background:var(--ink);border-color:var(--ink);color:var(--off-white)}.proj--grid{display:block}.proj--grid .proj-visual{aspect-ratio:4/5}.proj--grid .proj-meta{margin-top:14px}.work-grid-cols{grid-column:1/13;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.originals-section{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.case-visual-frame{aspect-ratio:21/9;border:1px solid var(--line)}.case-plate{border:0;aspect-ratio:auto;height:100%}.case-blocks{display:flex;flex-direction:column;gap:28px}.case-block{border-top:1px solid var(--line-strong);padding-top:14px}.case-block .eyebrow{display:block;margin-bottom:8px}.case-block p{font-size:.98rem}.case-next{border-top:1px solid var(--line)}.case-next-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.case-next-row .talk-link{border-bottom:none;margin:0;color:var(--ink)}.case-design-tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--font-body);font-size:.74rem;margin-top:16px}.case-design-tags span{border:1px solid var(--line-strong);border-radius:999px;padding:6px 13px}.scroll-steps-wrap{padding-top:clamp(64px,9vw,120px)}.scroll-steps-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:20px}.scroll-steps{display:grid}.scroll-steps-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:100vh;display:flex;align-items:center;background:var(--off-white);z-index:1}@keyframes ss-step-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.ss-display{animation:ss-step-in .55s cubic-bezier(.16,.84,.44,1)}.ss-num{display:block;font-family:var(--font-body);font-size:.85rem;color:var(--ink-faint);letter-spacing:.04em;margin-bottom:12px}.ss-mobile-step .ss-num{margin-bottom:8px}.ss-index-rail{position:absolute;left:var(--container);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;font-family:var(--font-body);font-size:.76rem;color:var(--ink-faint)}.ss-index-rail span{transition:color .3s ease}.ss-index-rail span.is-active{color:var(--accent)}.ss-display{padding-left:120px}.ss-display h2{font-size:clamp(3.5rem,11vw,11rem)}.ss-question{font-family:var(--font-body);font-size:.95rem;color:var(--ink-soft);margin-top:18px}.ss-display .kr-soft{margin-top:8px;max-width:520px;font-size:1.05rem}.scroll-steps-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.scroll-steps-trigger{height:70vh}.scroll-steps-mobile{display:none}.dsn-hero{min-height:92vh;min-height:92svh;display:flex;flex-direction:column;justify-content:space-between;padding-top:clamp(20px,3.6vw,40px);padding-bottom:clamp(40px,6vw,72px);border-top:1px solid var(--line)}.dsn-hero>.wrap{width:100%}.dsn-hero-top{padding-bottom:clamp(24px,4vw,40px)}.dsn-hero-stage{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;flex:1}.dsn-hero-big{font-size:var(--fs-hero)}.dsn-hero-big span{display:block}.dsn-hero-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-top:clamp(32px,5vw,56px);padding-top:18px;border-top:1px solid var(--line)}.dsn-hero-intro{font-family:var(--font-body);font-size:.95rem;color:var(--ink);max-width:360px}.dsn-hero-body{font-size:1rem;max-width:340px;text-align:right}.dsn-rows{padding-top:clamp(64px,9vw,112px);padding-bottom:clamp(64px,9vw,112px)}.dsn-row{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}.dsn-row+.dsn-row{margin-top:clamp(100px,14vw,220px)}.dsn-row--full{grid-template-columns:1fr}.dsn-row--split{grid-template-columns:repeat(12,1fr);align-items:start}.dsn-row--split .dsn-card:nth-child(1){grid-column:span var(--dsn-col-a)}.dsn-row--split .dsn-card:nth-child(2){grid-column:span var(--dsn-col-b)}.dsn-row--triple{grid-template-columns:repeat(3,1fr)}.dsn-card{display:block}.dsn-card-media{position:relative;overflow:hidden;background:var(--surface-grey)}.dsn-card-media .pm-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.16,.84,.44,1)}.dsn-card-media .pm-placeholder{position:absolute;top:0;right:0;bottom:0;left:0}.dsn-card--panel .dsn-card-media .pm-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;padding:clamp(20px,4vw,56px) clamp(24px,5vw,72px)}.dsn-card-extra{display:grid;gap:var(--gap);margin-top:var(--gap)}.dsn-card-extra--1{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.dsn-card-extra--2{grid-template-columns:repeat(2,1fr)}.dsn-card-extra-media{position:relative;overflow:hidden;background:var(--surface-grey)}.dsn-card-extra-media .pm-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.dsn-card-foot{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 16px;margin-top:14px}.dsn-card-text{display:flex;flex-direction:column;gap:2px}.dsn-card-name{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(.95rem,1.3vw,1.15rem);color:var(--ink)}.dsn-card-line{font-family:var(--font-body);font-size:.78rem;color:var(--ink-soft);letter-spacing:.01em}.dsn-card-link{font-family:var(--font-body);font-size:.76rem;color:var(--ink-soft);border-bottom:1px solid transparent;padding-bottom:2px;transition:color .25s ease,border-color .25s ease;white-space:nowrap}.dsn-card-link:hover{color:var(--accent);border-color:var(--accent)}@media (hover:hover) and (pointer:fine){.dsn-card:hover .dsn-card-media .pm-img{transform:scale(1.02)}.dsn-card--panel:hover .dsn-card-media .pm-img{transform:none}}.dsn-break{grid-column:1/13;padding:clamp(90px,14vw,180px) 0;text-align:center}.dsn-break-title{font-size:clamp(2.6rem,7.5vw,6.4rem)}.dsn-break-title span{display:block}@media (max-width:1080px){.dsn-row--split{grid-template-columns:repeat(2,1fr)}.dsn-row--split .dsn-card:nth-child(1),.dsn-row--split .dsn-card:nth-child(2){grid-column:auto}.dsn-row--triple{grid-template-columns:repeat(2,1fr);gap:clamp(40px,6vw,64px) var(--gap)}.dsn-row--triple .dsn-card:nth-child(3){grid-column:1/-1;max-width:calc(50% - var(--gap) / 2)}.dsn-card-extra--1{grid-template-columns:repeat(2,1fr)}}@media (max-width:860px){.dsn-hero{min-height:0;padding-top:clamp(20px,5vw,32px);padding-bottom:clamp(32px,7vw,48px)}.dsn-hero-foot{flex-direction:column;align-items:flex-start;gap:14px}.dsn-hero-body{text-align:left;max-width:none}.dsn-rows{padding-top:clamp(40px,10vw,56px);padding-bottom:clamp(40px,10vw,56px)}.dsn-row+.dsn-row{margin-top:clamp(56px,14vw,96px)}.dsn-row--split{grid-template-columns:1fr}.dsn-row--split .dsn-card:nth-child(1),.dsn-row--split .dsn-card:nth-child(2){grid-column:1/-1}.dsn-row--split .dsn-card+.dsn-card{margin-top:clamp(40px,10vw,56px)}.dsn-row--triple{grid-template-columns:1fr;gap:0}.dsn-row--triple .dsn-card{grid-column:1/-1!important;max-width:none!important}.dsn-row--triple .dsn-card+.dsn-card{margin-top:clamp(40px,10vw,56px)}.dsn-card--panel .dsn-card-media .pm-img{padding:clamp(20px,7vw,36px)}.dsn-card-extra{grid-template-columns:1fr!important;gap:clamp(12px,3vw,20px)}.dsn-break{padding:clamp(56px,16vw,96px) 0}}.two-directions{grid-column:1/13;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}.td-col{padding:clamp(24px,4vw,44px) clamp(16px,2vw,28px)}.td-col:first-child{border-right:1px solid var(--line-strong)}.td-col .eyebrow{display:block;margin-bottom:10px}.td-col .td-name{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1.6rem,3vw,2.4rem);text-transform:uppercase}.modingso-process{grid-column:1/13;margin-top:clamp(26px,4vw,44px)}.formats-row{grid-column:1/13;display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;font-family:var(--font-body);font-size:.76rem}.formats-row span{border:1px solid var(--line-strong);border-radius:999px;padding:7px 15px;color:var(--ink-soft)}.td-col .tags{display:flex;flex-wrap:wrap;gap:6px;font-family:var(--font-body);font-size:.68rem}.td-col .tags span{border:1px solid var(--line-strong);border-radius:999px;padding:5px 11px;color:var(--ink-soft)}.works-intro{grid-column:1/13;margin-top:0;margin-bottom:clamp(36px,5vw,56px);max-width:520px;font-size:1.05rem}.works-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.work-tile{display:block;width:100%;text-align:left}.work-thumb{position:relative;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--surface-grey)}.work-thumb .zoom{position:absolute;top:0;right:0;bottom:0;left:0;transition:transform 1s cubic-bezier(.16,.84,.44,1)}.work-tile:hover .work-thumb .zoom,.work-tile:focus-visible .work-thumb .zoom{transform:scale(1.035)}.work-thumb .pm-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.work-thumb .pm-placeholder{position:absolute;top:0;right:0;bottom:0;left:0}.works-modal-image .pm-img{width:100%;height:auto;display:block}.works-modal-image .pm-placeholder{position:relative;width:100%;aspect-ratio:4/3}.pm-placeholder{display:flex;align-items:center;justify-content:center;background:var(--surface-grey);color:var(--ink-faint)}.pm-placeholder-icon{width:15%;min-width:28px;max-width:64px;height:auto}.work-caption{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:16px clamp(16px,2.4vw,26px);background:#131211d1;display:flex;flex-direction:column;gap:4px;opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.work-name{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1.1rem,1.6vw,1.4rem);text-transform:uppercase;color:var(--off-white)}.work-meta{margin-top:2px;font-family:var(--font-body);font-size:.78rem;letter-spacing:.02em;color:#f3f1ead1}.work-keyword{position:absolute;top:14px;right:14px;z-index:1;padding:6px 12px;border-radius:999px;background:#131211d1;color:var(--off-white);font-family:var(--font-body);font-weight:700;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease;max-width:calc(100% - 28px)}@media (hover:hover) and (pointer:fine){.work-thumb:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:var(--accent);opacity:0;transition:opacity .3s ease;pointer-events:none}.work-tile:hover .work-thumb:before,.work-tile:focus-visible .work-thumb:before{opacity:.18}.work-caption{opacity:0;transform:translateY(8px)}.work-tile:hover .work-caption,.work-tile:focus-visible .work-caption{opacity:1;transform:translateY(0)}.work-keyword{opacity:0;transform:translateY(-8px)}.work-tile:hover .work-keyword,.work-tile:focus-visible .work-keyword{opacity:1;transform:translateY(0)}}.works-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;display:flex;justify-content:center;align-items:center;padding:clamp(10px,3vw,48px);background:#13121199;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity .32s ease}.works-modal-overlay.is-visible{opacity:1}.works-modal-panel{position:relative;width:100%;height:100%;max-width:1240px;background:var(--off-white);border:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;transform:translateY(28px) scale(.985);transition:transform .34s cubic-bezier(.16,.84,.44,1)}.works-modal-overlay.is-visible .works-modal-panel{transform:translateY(0) scale(1)}.works-modal-close{position:absolute;top:16px;right:16px;z-index:2;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);background:#ffffffdb;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid var(--line-strong);padding:9px 14px;transition:color .25s ease,border-color .25s ease}.works-modal-close:hover{color:var(--accent);border-color:var(--accent)}.works-modal-close span{font-size:1rem;line-height:1}.works-modal-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:clamp(56px,8vw,88px) clamp(20px,5vw,64px) clamp(48px,8vw,80px)}.wm-cover{margin-bottom:clamp(40px,6vw,64px);max-width:1080px}.wm-cover .pm-img{width:100%;height:auto;display:block}.wm-cover .pm-placeholder{width:100%}.works-modal-head{max-width:760px}.works-modal-head .display{font-size:clamp(2rem,4.4vw,3.4rem)}.wm-title-en{display:block;margin-top:8px;font-family:var(--font-body);font-size:.88rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}.works-modal-scope{margin-top:14px;font-family:var(--font-body);font-size:.85rem;letter-spacing:.02em;text-transform:uppercase;color:var(--ink-soft)}.works-modal-desc{margin-top:18px;font-size:1.02rem;max-width:620px}.wm-section-label{display:block;font-family:var(--font-body);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px}.wm-block{max-width:720px;margin-top:clamp(40px,6vw,64px)}.wm-block-body{font-size:1rem}.wm-tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--font-body);font-size:.78rem}.wm-tags span{border:1px solid var(--line-strong);border-radius:999px;padding:6px 14px;color:var(--ink-soft)}.wm-gallery{margin-top:clamp(48px,7vw,80px)}.works-modal-images{margin-top:0;display:flex;flex-direction:column;gap:clamp(32px,6vw,72px);max-width:1080px}.works-modal-image{position:relative;width:100%;border:1px solid var(--line)}.wm-image-caption{margin-top:10px;font-family:var(--font-body);font-size:.82rem;color:var(--ink-soft)}.wm-credits{margin-top:clamp(48px,7vw,80px);padding-top:clamp(32px,5vw,48px);border-top:1px solid var(--line);max-width:720px}.wm-credits-list{display:flex;flex-direction:column;gap:16px}.wm-credits-row{display:grid;grid-template-columns:200px 1fr;gap:16px;font-family:var(--font-body);font-size:.88rem}.wm-credits-row dt{color:var(--ink-faint);letter-spacing:.05em;text-transform:uppercase;font-size:.7rem}.wm-credits-row dd{color:var(--ink);display:flex;flex-wrap:wrap}.wm-credits-row dd span:not(:last-child):after{content:"—";margin-left:10px;margin-right:10px;color:var(--ink-faint)}.wm-nav{margin-top:clamp(56px,8vw,88px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line-strong);display:flex;justify-content:space-between;gap:24px}.wm-nav-btn{display:flex;flex-direction:column;gap:6px;max-width:46%;text-align:left;transition:opacity .25s ease}.wm-nav-btn:hover,.wm-nav-btn:focus-visible{opacity:.7}.wm-nav-next{margin-left:auto;text-align:right;align-items:flex-end}.wm-nav-dir{font-family:var(--font-body);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}.wm-nav-title{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1rem,1.6vw,1.3rem);text-transform:uppercase;color:var(--ink)}@media (prefers-reduced-motion: reduce){.works-modal-overlay,.works-modal-panel{transition:none}}@media (max-width:1080px){.works-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:900px){.works-modal-overlay{padding:0}.works-modal-panel{max-width:none;border-width:0}.works-modal-close{top:12px;right:12px;padding:8px 12px}.wm-credits-row{grid-template-columns:1fr;gap:4px}}@media (max-width:640px){.works-grid{grid-template-columns:1fr}.wm-nav{flex-direction:column}.wm-nav-btn,.wm-nav-next{max-width:none}.wm-nav-next{align-items:flex-start;text-align:left}}.tms-row{grid-column:1/13;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}.tms-item{padding:clamp(30px,5vw,56px) clamp(12px,2vw,20px);border-right:1px solid var(--line-strong);transition:opacity .4s ease}.tms-item:last-child{border-right:none}.tms-item h3{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1.8rem,3.6vw,2.8rem);color:var(--ink);transition:color .3s ease}.tms-item:hover h3{color:var(--accent)}.tms-item .tms-category{display:block;margin-top:10px;font-family:var(--font-body);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint)}.tms-item p{color:var(--ink-soft);margin-top:8px;font-size:.98rem}.hww-list{grid-column:1/13;display:flex;align-items:center;justify-content:center;margin-top:clamp(32px,5vw,72px);margin-bottom:clamp(32px,5vw,64px)}.hww-item{--hww-d:clamp(300px,33vw,572px);flex:0 0 auto;width:var(--hww-d);aspect-ratio:1/1;border-radius:50%;border:1px solid var(--line-strong);background-color:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(28px,5vw,64px);box-sizing:border-box;transition:background-color .3s ease,border-color .3s ease,opacity .8s cubic-bezier(.16,.84,.44,1),transform .8s cubic-bezier(.16,.84,.44,1);opacity:0;transform:translateY(72px) scale(.78)}.hww-item:nth-child(2),.hww-item:nth-child(3){margin-left:calc(var(--hww-d) * -.15)}.hww-item .fw{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(2rem,3.2vw,3rem);text-transform:uppercase;color:var(--ink);transition:color .3s ease}.hww-item p{color:var(--ink-soft);font-size:clamp(.92rem,1.1vw,1.02rem);line-height:1.45;min-height:4.35em;margin-top:12px;max-width:78%;word-break:keep-all;transition:color .3s ease}.hww-item:hover{background-color:var(--accent);border-color:var(--accent);z-index:1}.hww-item:hover .fw,.hww-item:hover p{color:var(--off-white)}.hww-list.is-visible .hww-item{opacity:1;transform:translateY(0) scale(1)}.hww-list.is-visible .hww-item:nth-child(1){transition-delay:0s}.hww-list.is-visible .hww-item:nth-child(2){transition-delay:.25s}.hww-list.is-visible .hww-item:nth-child(3){transition-delay:.5s}@media (prefers-reduced-motion: reduce){.hww-item{opacity:1!important;transform:none!important;transition:background-color .3s ease,border-color .3s ease!important}}@media (max-width:900px){.hww-list{flex-direction:column;align-items:center;margin-top:clamp(24px,6vw,48px)}.hww-item{--hww-d:clamp(230px,68vw,320px)}.hww-item:nth-child(1){margin-top:0;margin-left:0}.hww-item:nth-child(2){margin-top:calc(var(--hww-d) * -.14);margin-left:0}.hww-item:nth-child(3){margin-top:calc(var(--hww-d) * -.14);margin-left:0}}.studio-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}.studio-tile{position:relative;overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4}.studio-tile .caption{position:absolute;left:10px;bottom:10px;z-index:2;font-family:var(--font-body);font-size:.7rem;color:var(--off-white);background:#131211b3;padding:4px 9px}.studio-photo{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.studio-photo-tint{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:var(--accent);mix-blend-mode:color;opacity:0;transition:opacity .4s ease;pointer-events:none}.studio-tile:hover .studio-photo-tint{opacity:1}.type-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.type-card{text-align:left;border-top:2px solid var(--line-strong);padding-top:18px;transition:border-color .25s ease}.type-card.is-active{border-top-color:var(--ink)}.type-card .type-label{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:1.4rem;text-transform:uppercase}.type-card .type-items{margin-top:12px;display:flex;flex-direction:column;gap:4px;font-size:.88rem;color:var(--ink-soft)}.contact-form{grid-column:1/13;margin-top:clamp(36px,5vw,60px)}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 40px}.form-field{display:flex;flex-direction:column;gap:8px}.form-field.full{grid-column:1/-1}.form-field label{font-family:var(--font-body);font-size:.74rem;letter-spacing:.03em;color:var(--ink-soft);text-transform:uppercase}.form-field input,.form-field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line-strong);font-family:var(--font-body);font-size:1.05rem;color:var(--ink);padding:8px 0;resize:vertical}.form-field input:focus,.form-field textarea:focus{outline:none;border-bottom-color:var(--accent)}.form-submit{margin-top:36px;display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-weight:400;text-transform:uppercase;font-size:1.1rem;border-bottom:1px solid var(--ink);padding-bottom:10px;transition:color .25s ease,border-color .25s ease}.form-submit:hover{color:var(--accent);border-color:var(--accent)}.form-error{margin-top:14px;font-family:var(--font-body);font-size:.9rem;color:var(--error)}.form-success{grid-column:1/13;padding:60px 0;border-top:1px solid var(--line)}.form-success h3{font-family:var(--font-display);font-weight:900;font-style:normal;font-size:clamp(1.8rem,3.6vw,2.6rem);text-transform:uppercase}.form-success p{color:var(--ink-soft);margin-top:14px}.direct-contact{grid-column:1/13;margin-top:clamp(50px,7vw,84px);display:flex;flex-wrap:wrap;gap:clamp(30px,6vw,72px);border-top:1px solid var(--line);padding-top:28px}.direct-contact .dc-item .eyebrow{display:block;margin-bottom:8px}.direct-contact .dc-item a,.direct-contact .dc-item span.value{font-family:var(--font-body);font-size:.95rem}.direct-contact .dc-item a:hover{color:var(--accent)}.contact-final{grid-column:1/13;margin-top:clamp(40px,6vw,64px)}.cta-section{border-top:1px solid var(--line);padding-top:clamp(50px,8vw,88px);padding-bottom:clamp(60px,9vw,100px)}.cta-section .idx{font-family:var(--font-body);font-size:var(--fs-meta);color:var(--ink-faint);letter-spacing:.1em;text-transform:uppercase}.cta-section .talk-link{display:inline-flex;color:var(--ink)}.cta-section .tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--font-body);font-size:.7rem;color:var(--ink-soft)}.cta-section .tags span{border:1px solid var(--line-strong);border-radius:999px;padding:5px 12px}@media (max-width:900px){.header-nav .nav-link,.header-nav .nav-inquiry{display:none}.nav-toggle{display:flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:.78rem}.nav-toggle .bar{width:20px;height:1px;background:var(--ink);position:relative}.nav-toggle .bar:before,.nav-toggle .bar:after{content:"";position:absolute;left:0;width:100%;height:1px;background:var(--ink)}.nav-toggle .bar:before{top:-5px}.nav-toggle .bar:after{top:5px}.hero-idx{flex-direction:column;align-items:flex-start;gap:20px}.hero-statement{text-align:left}.proj--01 .proj-visual,.proj--02 .proj-visual,.proj--03 .proj-visual,.proj--04 .proj-visual{grid-column:1/13}.proj--01 .proj-meta,.proj--02 .proj-meta,.proj--04 .proj-meta{grid-column:1/13;margin-top:14px}.proj--03 .proj-meta{grid-column:1/13;order:2;margin-top:14px}.proj--03 .proj-visual{order:1}.pov-copy{grid-column:1/13;margin-top:26px}.pov-head{grid-column:1/13}.pov-intro{grid-column:1/13;margin-top:20px}.pov-keywords{grid-template-columns:repeat(2,1fr);gap:26px 20px}.wwd-title{grid-column:1/13}.wwd-num{grid-column:1/13;padding-top:0;padding-bottom:6px}.wwd-body{grid-column:1/13;margin-top:14px}.wwd-grid{grid-template-columns:1fr;gap:30px}.brand-copy{grid-column:1/13}.flow{grid-column:1/13;margin-top:34px}.about-copy{grid-column:1/13}.about-photo{grid-column:1/13;margin-top:30px}.clients-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-copy,.contact-actions,.intro-step,.preview-block-body{grid-column:1/13}.preview-block .wwd-num{grid-column:1/13;padding-top:0;padding-bottom:6px}.preview-block-visual{grid-column:1/13;margin-top:20px;max-width:280px}.work-featured{aspect-ratio:4/5}.work-grid-cols{grid-template-columns:1fr}.scroll-steps{display:none}.scroll-steps-mobile{display:block;padding-top:12px;padding-bottom:12px}.chapter-content,.chapter-index{grid-column:1/13}.chapter-index{margin-top:28px;align-items:flex-start;text-align:left;gap:24px}.chapter-index .ci-number{font-size:clamp(4rem,20vw,6rem)}.chapter-index .ci-list{max-width:none}.chapter-content .chapter-title{font-size:clamp(2.1rem,9vw,3.2rem)}.ending-scroll{height:auto!important}.ending-sticky{display:none}.ending-mobile{display:block}.ss-mobile-step{padding:26px 0;border-top:1px solid var(--line)}.ss-mobile-step h3{font-size:clamp(2rem,9vw,3rem)}.ss-mobile-step .ss-question{margin-top:12px}.dsc-head-foot{flex-direction:column;align-items:flex-start;gap:16px}.dsc-body{max-width:none}.dci-pair{grid-template-columns:1fr}.dcp-a,.dcp-b{grid-column:1/13;align-self:auto}.dcp-a{aspect-ratio:4/5}.dcp-b{aspect-ratio:3/4;margin-top:clamp(20px,3vw,40px)}.two-directions{grid-template-columns:1fr}.td-col:first-child{border-right:none;border-bottom:1px solid var(--line-strong)}.edu-moment--center{max-width:none}.edu-moment--small{max-width:340px}.studio-grid{grid-template-columns:repeat(2,1fr)}.tms-row{grid-template-columns:1fr}.tms-item{border-right:none;border-bottom:1px solid var(--line-strong)}.tms-row .tms-item:last-child{border-bottom:none}.type-grid{grid-template-columns:1fr;gap:24px}.form-grid{grid-template-columns:1fr}.direct-contact{flex-direction:column;gap:24px}.footer-nav{flex-wrap:wrap}}.sbc{position:relative;--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--sb-pink:#ed1b48;--sb-green:#098624;--sb-blue:#372f83;--sb-aqua:#2deae2;--sb-orange:#f27f21;--sb-yellow:#fdbf12;--sb-brown:#42210b}.sbc-section{padding-top:clamp(88px,11vw,148px);padding-bottom:clamp(88px,11vw,148px)}.sbc-section+.sbc-section{border-top:1px solid var(--line)}.sbc-scene-tag{display:block;font-family:var(--font-body);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:clamp(20px,3vw,32px)}.sbc-scene-tag--light{color:#fff9}.sbc-big{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:none;letter-spacing:-.02em;line-height:.98;font-size:clamp(2.4rem,6.4vw,5.4rem);text-wrap:balance;max-width:1040px}.sbc-big--m{font-size:clamp(2rem,4.8vw,3.8rem)}.sbc-kr{margin-top:14px;font-family:var(--font-body);font-size:1.1rem;color:var(--ink-soft);max-width:640px}.sbc-body{margin-top:20px;font-size:1.02rem;line-height:1.85;max-width:560px}.sbc-brin{display:block;margin-top:18px;font-family:var(--font-body);font-style:italic;font-size:.96rem;color:var(--sb-pink);letter-spacing:.01em}.sbc-brin--wit{color:var(--ink-soft);margin-top:8px}.sbc-clip{overflow:hidden;display:block}.sbc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.sbc-clip.is-visible .sbc-clip-inner{transform:translateY(0)}.sbc-clip .sbc-clip-inner>span{display:block}.sbc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:var(--surface-grey)}.sbc-imgwrap.is-visible{opacity:1;transform:scale(1)}.sbc-imgwrap img{width:100%;height:100%;object-fit:cover;display:block}.sbc-imgwrap:not([style*=aspect-ratio]) img{height:auto}.sbc-bleed-img{margin:clamp(40px,6vw,72px) var(--bleed) 0}.sbc-bleed-img img{width:100%}.sbc-opening{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(60px,8vw,96px)}.sbc-opening-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(20px,3vw,32px)}.sbc-opening-eyebrow{font-family:var(--font-display);font-weight:900;font-size:.92rem;letter-spacing:.06em}.sbc-opening-meta{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint);letter-spacing:.02em}.sbc-opening-big{font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.025em;line-height:.98;font-size:clamp(2.6rem,7.4vw,6.2rem)}.sbc-opening-big .sbc-clip-inner>span{display:block}.sbc-opening-body{margin-top:clamp(20px,3vw,28px)}.sbc-opening-body p{font-size:1.05rem;line-height:1.85;white-space:nowrap}.sbc-opening-body p+p{margin-top:2px}.sbc-scene01{position:relative;background:var(--off-white);overflow:hidden;min-height:min(86vh,760px);display:flex;align-items:center;justify-content:center;padding:clamp(28px,5vw,48px) 0}.sbc-scene01 .sbc-scene-tag{position:absolute;top:clamp(20px,4vw,40px);left:var(--inset);z-index:1;margin-bottom:0}.sbc-brand-logo-stage{position:relative;width:clamp(220px,46vw,620px);height:calc(clamp(220px,46vw,620px)*.14867);opacity:0;transform:scale(.94);transition:opacity 1.1s cubic-bezier(.16,.84,.44,1),transform 1.2s cubic-bezier(.16,.84,.44,1)}.sbc-brand-logo-stage.is-visible{opacity:1;transform:scale(1)}.sbc-brand-logo{position:absolute;top:0;right:0;bottom:0;left:0;background-repeat:no-repeat;transition:opacity 1s ease}.sbc-brand-logo--clean{background-size:calc(clamp(220px,46vw,620px)*1.00177) calc(clamp(220px,46vw,620px)*.15133);background-position:0 calc(clamp(220px,46vw,620px) * -.000885)}.sbc-brand-logo--grid{background-size:calc(clamp(220px,46vw,620px)*1.03809) calc(clamp(220px,46vw,620px)*.19221);background-position:calc(clamp(220px,46vw,620px)*-.0186) calc(clamp(220px,46vw,620px) * -.015058);opacity:0;transition-delay:.6s}.sbc-brand-logo-stage.is-visible .sbc-brand-logo--grid{opacity:1}.sbc-scene02-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center;margin-top:clamp(24px,4vw,36px)}.sbc-scene02-text{min-width:0}.sbc-scene02-img{border-radius:2px}.sbc-scene02-img--symbol{max-width:380px;margin:0 auto}.sbc-motifs{margin-top:clamp(72px,10vw,132px)}.sbc-motifs-intro{max-width:760px;margin-bottom:clamp(56px,8vw,96px)}.sbc-motifs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(3px,.5vw,8px);margin:0 var(--bleed)}.sbc-motif{display:flex;flex-direction:column;align-items:stretch}.sbc-motif-img{width:100%;margin:0;border-radius:0}.sbc-motif-caption{margin-top:clamp(8px,1.2vw,14px);padding:0 clamp(4px,1vw,10px);text-align:left}.sbc-motif-name{display:block;font-family:var(--font-display);font-weight:900;font-size:.78rem;letter-spacing:.03em}.sbc-motif-keywords{display:block;margin-top:3px;font-family:var(--font-body);font-size:.68rem;color:var(--ink-faint);letter-spacing:.01em}.sbc-islands-composite{margin-top:clamp(48px,7vw,80px)}.sbc-scene04{position:relative;min-height:min(96vh,860px);overflow:hidden;background:#0b0b0b;margin:0 var(--bleed)}.sbc-scene04-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;background-repeat:no-repeat}.sbc-scene04-overlay{position:relative;z-index:1;min-height:min(96vh,860px);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(28px,5vw,48px) var(--inset) clamp(40px,6vw,64px);color:#fff;background:linear-gradient(180deg,#0000000d,#0000001a 40%,#000000ad)}.sbc-scene04-big{font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.02em;line-height:1.02;font-size:clamp(1.9rem,5vw,3.6rem);text-wrap:balance}.sbc-scene04-big span{display:block}.sbc-scene04-name{display:block;margin-top:16px;font-family:var(--font-body);font-size:.86rem;letter-spacing:.1em;color:#ffffffb8}.sbc-scene05{position:relative}.sbc-scene05-visual{position:relative;background:#0b0b0b;margin:0 var(--bleed)}.sbc-scene05-visual>.sbc-scene-tag{padding:clamp(20px,4vw,40px) var(--inset) 0;color:#ffffff8c}.sbc-type-panel{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:clamp(24px,5vw,48px) var(--inset);opacity:0;transform:translateY(24px) scale(.97);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1)}.sbc-type-panel.is-visible{opacity:1;transform:translateY(0) scale(1)}.sbc-type-panel img{display:block}.sbc-type-panel--hello{min-height:80vh}.sbc-type-panel--hello img{width:min(78vw,960px);height:auto}.sbc-type-panel--whitewordmark{min-height:92vh}.sbc-type-panel--whitewordmark img{width:min(42vw,520px);height:auto}.sbc-type-specimen{margin:0!important;border-radius:0}.sbc-type-specimen img{width:100%}.sbc-scene05-foot{background:var(--off-white)}.sbc-scene06{position:relative}.sbc-color-wrap{position:relative;display:grid;margin:0 var(--bleed)}.sbc-color-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;flex-direction:column;justify-content:space-between;padding:clamp(28px,5vw,48px) var(--inset);transition:background-color .6s ease;color:#fff;overflow:hidden}.sbc-color-sticky[data-tone=light]{color:#131211}.sbc-color-sticky .sbc-scene-tag{color:inherit;opacity:.6;margin-bottom:0}.sbc-color-sticky-top{max-width:640px}.sbc-color-big{display:block;color:inherit;max-width:640px;margin-top:12px;font-family:var(--font-display);font-weight:900;letter-spacing:-.02em;line-height:1.05;font-size:clamp(1.1rem,2.2vw,1.6rem);text-wrap:balance}.sbc-color-sticky .sbc-kr{color:inherit;opacity:.78;font-size:.9rem;margin-top:8px}.sbc-color-sticky-bottom{display:flex;align-items:baseline;gap:clamp(12px,2vw,20px)}.sbc-color-name{display:block;font-family:var(--font-display);font-weight:900;font-size:clamp(1.1rem,2.6vw,1.7rem);letter-spacing:.01em;opacity:.94}.sbc-color-hex{display:block;font-family:var(--font-body);font-size:.76rem;letter-spacing:.04em;color:inherit;opacity:.6;text-transform:uppercase}.sbc-color-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.sbc-color-trigger{height:82vh}.sbc-color-system{padding:clamp(56px,7vw,88px) 0 0}.sbc-color-system>.sbc-scene-tag{padding:0 var(--inset);margin-bottom:clamp(24px,3.4vw,36px)}.sbc-color-group-label{display:block;margin:clamp(36px,5vw,56px) 0 clamp(16px,2.2vw,22px);padding:0 var(--inset);font-family:var(--font-display);font-weight:900;font-size:clamp(.92rem,1.4vw,1.1rem);letter-spacing:-.01em;opacity:.6}.sbc-color-fields{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:0 var(--bleed)}.sbc-color-field{aspect-ratio:1/1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(10px,1.1vw,16px);color:#fff;opacity:0;transform:translateY(14px);transition:opacity .6s cubic-bezier(.16,.84,.44,1),transform .6s cubic-bezier(.16,.84,.44,1)}.sbc-color-field:nth-child(5n+1){transition-delay:0ms}.sbc-color-field:nth-child(5n+2){transition-delay:40ms}.sbc-color-field:nth-child(5n+3){transition-delay:80ms}.sbc-color-field:nth-child(5n+4){transition-delay:.12s}.sbc-color-field:nth-child(5n+5){transition-delay:.16s}.sbc-color-fields.is-visible .sbc-color-field{opacity:1;transform:translateY(0)}.sbc-color-field--light{color:#131211}.sbc-color-field-name{display:block;margin-bottom:clamp(4px,.6vw,7px);font-family:var(--font-display);font-weight:900;font-size:clamp(.6rem,.72vw,.68rem);letter-spacing:-.005em;line-height:1.15;opacity:.92}.sbc-color-field-data{display:flex;flex-direction:column;gap:1px;font-family:var(--font-body);font-size:.5rem;letter-spacing:.01em;opacity:.64}.sbc-color-fields--grayscale{margin-top:0;margin-bottom:clamp(56px,8vw,88px)}.sbc-scene07-head{padding-bottom:clamp(28px,4vw,44px)}.sbc-scene07-stage{position:relative;min-height:min(88vh,760px);overflow:hidden;background:var(--surface-grey);margin:0 var(--bleed)}.sbc-scene07-bg{position:absolute;top:-6%;right:-6%;bottom:-6%;left:-6%;background-size:880px auto;background-repeat:repeat;background-position:0 0}.sbc-scene07-bg.is-drifting{animation:sbc-drift 67s linear infinite}@keyframes sbc-drift{0%{background-position:0 0}to{background-position:-1760px -1760px}}.sbc-scene08-blocks{margin-top:clamp(32px,5vw,52px);display:flex;flex-direction:column;gap:clamp(40px,6vw,64px)}.sbc-app-twocol{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,20px)}.sbc-app-col{border-radius:2px}.sbc-closing{background:#131211;color:#fff;margin:0 var(--bleed)}.sbc-closing-wrap{position:relative;display:grid}.sbc-closing-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 var(--inset);overflow:hidden}.sbc-closing-line{grid-column:1;grid-row:1;position:absolute;left:var(--inset);right:var(--inset);font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.025em;line-height:1;font-size:clamp(2.2rem,6.2vw,5rem);text-wrap:balance;transition:transform .8s cubic-bezier(.16,.84,.44,1),opacity .8s cubic-bezier(.16,.84,.44,1)}.sbc-closing-line-a{transform:translateY(0);opacity:1}.sbc-closing-line-a.is-out{transform:translateY(-46px);opacity:0}.sbc-closing-line-b{transform:translateY(46px);opacity:0}.sbc-closing-line-b.is-in{transform:translateY(0);opacity:1}.sbc-closing-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.sbc-closing-trigger{height:70vh}.sbc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid rgba(255,255,255,.16)}.sbc-closing-brin{display:block;font-family:var(--font-body);font-style:italic;font-size:.9rem;color:#ffffffbf}.sbc-closing-eyebrow{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-display);font-weight:900;font-size:.82rem;letter-spacing:.06em;color:#ffffffd9}.sbc-closing-meta{display:block;margin-top:6px;font-family:var(--font-body);font-size:.8rem;letter-spacing:.03em;color:#ffffff8c}@media (max-width:1080px){.sbc-color-fields{grid-template-columns:repeat(3,1fr)}}@media (max-width:860px){.sbc-opening-big{font-size:clamp(2.2rem,10vw,3.2rem)}.sbc-opening-body p{white-space:normal}.sbc-scene02-grid{grid-template-columns:1fr;gap:28px}.sbc-scene02-img{order:-1}.sbc-scene02-img--symbol{max-width:240px}.sbc-brand-logo-stage{width:min(80vw,420px);height:calc(min(80vw,420px)*.14867)}.sbc-brand-logo--clean{background-size:calc(min(80vw,420px)*1.00177) calc(min(80vw,420px)*.15133);background-position:0 calc(min(80vw,420px) * -.000885)}.sbc-brand-logo--grid{background-size:calc(min(80vw,420px)*1.03809) calc(min(80vw,420px)*.19221);background-position:calc(min(80vw,420px)*-.0186) calc(min(80vw,420px) * -.015058)}.sbc-scene04-big{font-size:clamp(1.6rem,7vw,2.4rem)}.sbc-type-panel--whitewordmark img{width:min(66vw,420px)}.sbc-motifs-grid,.sbc-color-fields{grid-template-columns:repeat(2,1fr)}.sbc-color-field{aspect-ratio:1/1}.sbc-app-twocol{grid-template-columns:1fr}.sbc-color-trigger{height:58vh}.sbc-closing-trigger{height:56vh}.sbc-closing-line{font-size:clamp(2rem,9vw,2.8rem)}}@media (prefers-reduced-motion: reduce){.sbc-clip-inner{transform:none!important;transition:none!important}.sbc-imgwrap,.sbc-brand-logo-stage{opacity:1!important;transform:none!important;transition:none!important}.sbc-brand-logo--grid{transition:none!important}.sbc-type-panel{opacity:1!important;transform:none!important;transition:none!important}.sbc-scene07-bg.is-drifting{animation:none!important}.sbc-closing-line{transition:none!important}}.ibc{position:relative;background:var(--ib-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--ib-white:#fdfbf5;--ib-white-deep:#f7f5e8;--ib-teal-light:#66dcc1;--ib-teal:#379f99;--ib-teal-deep:#285e5d;--ib-ink:#211f15}.works-modal-panel:has(.ibc),.works-modal-scroll:has(.ibc){background:#fdfbf5}.ibc-section{padding-top:clamp(88px,11vw,148px);padding-bottom:clamp(88px,11vw,148px)}.ibc-section+.ibc-section{border-top:1px solid var(--line)}.ibc-scene-tag{display:block;font-family:var(--font-body);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ib-teal-deep);margin-bottom:clamp(20px,3vw,32px)}.ibc-big{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:none;letter-spacing:-.02em;line-height:.98;font-size:clamp(2.4rem,6.4vw,5.4rem);text-wrap:balance;max-width:1040px;word-break:keep-all}.ibc-big span{display:block}.ibc-kr{margin-top:14px;font-family:var(--font-body);font-size:1.1rem;color:var(--ink-soft);max-width:640px;word-break:keep-all}.ibc-body{margin-top:20px;font-size:1.02rem;line-height:1.85;max-width:560px;word-break:keep-all}.ibc-accent{display:block;margin-top:18px;font-family:var(--font-body);font-style:italic;font-size:.96rem;color:var(--ib-teal-deep);letter-spacing:.01em;word-break:keep-all}.ibc-footnote{margin-top:14px;font-family:var(--font-body);font-size:.86rem;line-height:1.7;color:var(--ink-faint);max-width:520px;word-break:keep-all}.ibc-caption{margin-top:20px;font-family:var(--font-body);font-size:.9rem;line-height:1.75;color:var(--ink-soft);max-width:640px;word-break:keep-all}.ibc-clip{overflow:hidden;display:block}.ibc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.ibc-clip.is-visible .ibc-clip-inner{transform:translateY(0)}.ibc-clip .ibc-clip-inner>span{display:block}.ibc-principles-title .ibc-clip-inner>span{color:var(--ink);transition:transform .46s cubic-bezier(.16,.84,.44,1),color .4s ease;transition-delay:0s}.ibc-principles-title:hover .ibc-clip-inner>span{transform:translate(clamp(6px,1vw,14px),-.06em);color:var(--ib-teal)}.ibc-principles-title:hover .ibc-clip-inner>span:nth-child(2){transition-delay:.07s}.ibc-principles-title:hover .ibc-clip-inner>span:nth-child(3){transition-delay:.14s}.ibc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:var(--ib-white)}.ibc-imgwrap.is-visible{opacity:1;transform:scale(1)}.ibc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.ibc-imgwrap video{width:100%;height:100%;object-fit:contain;display:block;background:var(--ib-white)}.ibc-bleed-img{margin:clamp(32px,5vw,56px) var(--bleed) 0}.ibc-bleed-img img{width:100%;object-fit:cover}.ibc-bleed-img video{width:100%;object-fit:cover}.ibc-hero{padding-top:clamp(36px,6vw,64px);padding-bottom:clamp(48px,7vw,80px)}.ibc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(28px,4.2vw,44px)}.ibc-hero-eyebrow{font-family:var(--font-display);font-weight:900;font-size:.92rem;letter-spacing:.06em}.ibc-hero-meta{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint);letter-spacing:.02em}.ibc-hero-big{font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.025em;line-height:.98;font-size:clamp(2.6rem,7.4vw,6.2rem);word-break:keep-all}.ibc-hero-big .ibc-clip-inner>span{display:block}.ibc-hero-body{margin-top:clamp(24px,3.6vw,34px)}.ibc-hero-body p{font-size:1.05rem;line-height:1.85;max-width:760px;word-break:keep-all}.ibc-hero-logo-stage{margin-top:clamp(52px,7.6vw,92px)}.ibc-hero-logo{margin:0 var(--bleed);background:var(--ib-white)}.ibc-hero-logo img{object-fit:contain;padding:clamp(24px,5vw,64px) clamp(24px,6vw,96px)}.ibc-scene01-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,80px);align-items:center;margin-top:clamp(24px,4vw,36px)}.ibc-scene01-logo{background:var(--ib-white)}.ibc-scene01-logo img{object-fit:contain;padding:clamp(20px,4vw,48px)}.ibc-scene01-text{min-width:0}.ibc-scene02-body{margin-top:clamp(20px,3vw,28px)}.ibc-idea-keywords{margin-top:clamp(48px,7vw,80px);display:flex;flex-wrap:wrap;align-items:center;gap:clamp(10px,1.6vw,18px)}.ibc-idea-keyword{font-family:var(--font-display);font-weight:900;font-size:clamp(1.1rem,2.4vw,1.6rem);letter-spacing:-.01em;color:var(--ib-teal-deep);display:inline-flex;align-items:center}.ibc-idea-dot{width:6px;height:6px;border-radius:50%;background:var(--ib-teal);margin-right:clamp(10px,1.6vw,18px);flex-shrink:0}.ibc-principle-row{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;gap:clamp(28px,4.4vw,52px) clamp(28px,4.4vw,52px);width:100%;margin-top:clamp(40px,6vw,64px)}.ibc-principle-set{--pd: clamp(164px,17vw,244px);position:relative;width:var(--pd);height:calc(var(--pd) * 1.62)}.ibc-principle-circle{position:absolute;top:0;left:0;width:var(--pd);height:var(--pd);border-radius:50%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 clamp(14px,2.2vw,22px)}.ibc-principle-circle--glass{border:1.5px solid var(--ib-ink);background:transparent;color:var(--ib-ink);z-index:2;justify-content:flex-start;padding-top:clamp(12px,3vw,22px)}.ibc-principle-circle--color{background:var(--ib-teal);color:var(--ib-white);z-index:1;justify-content:flex-end;padding-bottom:clamp(12px,3vw,22px);will-change:transform}.ibc-principle-en{font-family:var(--font-display);font-weight:900;font-size:clamp(1.02rem,1.7vw,1.32rem);letter-spacing:-.01em}.ibc-principle-kr{font-family:var(--font-body);font-size:.8rem;word-break:keep-all;opacity:.86;margin-top:3px}.ibc-principle-sub{display:flex;flex-direction:column;font-family:var(--font-display);font-weight:800;font-size:clamp(1.14rem,2vw,1.56rem);line-height:1.08}.ibc-principle-subkr{font-family:var(--font-body);font-size:.8rem;margin-top:1px;word-break:keep-all;opacity:.86}.ibc-scene04{background:var(--ib-white)}.ibc-scene04-head{padding-bottom:0}.ibc-system-pin{position:relative;margin-top:clamp(32px,5vw,52px)}.ibc-system-sticky{position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,3vw,32px);overflow:hidden}.ibc-system-stage-label{display:flex;flex-direction:column;align-items:center;gap:3px}.ibc-system-stage-tag{font-family:var(--font-display);font-weight:900;font-size:.86rem;letter-spacing:.12em;color:var(--ib-teal-deep)}.ibc-system-stage-kr{font-family:var(--font-body);font-size:.92rem;color:var(--ink-faint);word-break:keep-all}.ibc-system-stage-count{margin-top:6px;font-family:var(--font-body);font-size:.68rem;letter-spacing:.04em;color:var(--ink-faint);opacity:.6;font-variant-numeric:tabular-nums}.ibc-system-svg{width:min(70vw,420px);aspect-ratio:1/1}.ibc-system-dot{stroke:none}.ibc-system-line{stroke-width:1.3;fill:none;stroke-linecap:round}.ibc-system-line--bridge{stroke-width:1.1}.ibc-system-shape{mix-blend-mode:multiply}.ibc-system-sticky g.is-connected .ibc-system-dot--seed{animation:ibc-pulse 2.6s ease-in-out infinite}@keyframes ibc-pulse{0%,to{filter:drop-shadow(0 0 0 rgba(55,159,153,0))}50%{filter:drop-shadow(0 0 6px rgba(55,159,153,.55))}}.ibc-system-caption-wrap{padding-top:clamp(40px,6vw,64px)}.ibc-logo-pin{position:relative;margin-top:clamp(48px,7vw,80px)}.ibc-logo-sticky{position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(28px,4vw,44px)}.ibc-logo-stage{position:relative;width:100%;height:clamp(90px,15vw,190px);display:flex;align-items:center;justify-content:center}.ibc-logo-stage-img{position:absolute;height:100%;width:auto;max-width:84%;object-fit:contain;opacity:0;transform:translateY(16px) scale(.94);will-change:opacity,transform}.ibc-logo-stage-img--first{opacity:1;transform:none}.ibc-logo-stage-label{display:flex;flex-direction:column;align-items:center;gap:3px}.ibc-logo-stage-title{font-family:var(--font-display);font-weight:900;font-size:.86rem;letter-spacing:.12em;color:var(--ib-teal-deep)}.ibc-logo-stage-sub{font-family:var(--font-body);font-size:.86rem;color:var(--ink-faint)}.ibc-logo-stage-count{margin-top:2px;font-family:var(--font-body);font-size:.68rem;letter-spacing:.04em;color:var(--ink-faint);opacity:.6;font-variant-numeric:tabular-nums}.ibc-scene06{position:relative}.ibc-color-system{padding:clamp(56px,7vw,88px) 0 0;margin-top:clamp(48px,7vw,80px);border-top:1px solid var(--line)}.ibc-color-system-tag{margin-bottom:clamp(24px,3.4vw,36px)}.ibc-color-group-label{display:block;margin:clamp(36px,5vw,56px) 0 clamp(16px,2.2vw,22px);font-family:var(--font-display);font-weight:900;font-size:clamp(.92rem,1.4vw,1.1rem);letter-spacing:-.01em;opacity:.55}.ibc-color-fields{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:0 var(--bleed)}.ibc-color-fields--gray{grid-template-columns:repeat(7,1fr)}.ibc-color-field{aspect-ratio:1/1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(10px,1.1vw,16px);color:#fff}.ibc-color-field--light{color:#131211}.ibc-color-field-name{display:block;margin-bottom:clamp(4px,.6vw,7px);font-family:var(--font-display);font-weight:900;font-size:clamp(.56rem,.68vw,.64rem);letter-spacing:-.005em;line-height:1.15;opacity:.92}.ibc-color-field-data{display:flex;flex-direction:column;gap:1px;font-family:var(--font-body);font-size:.46rem;letter-spacing:.01em;opacity:.62}.ibc-scene07{background:var(--ib-white)}.ibc-motif-pin{position:relative;margin-top:clamp(40px,6vw,64px)}.ibc-motif-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,3vw,32px);overflow:hidden}.ibc-motif-caption{position:relative;height:1.4em;text-align:center}.ibc-motif-caption-a,.ibc-motif-caption-b{position:absolute;left:50%;top:0;transform:translate(-50%);font-family:var(--font-display);font-weight:900;font-size:.86rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ib-teal-deep);white-space:nowrap}.ibc-motif-caption-a{opacity:1}.ibc-motif-caption-b{opacity:0}.ibc-motif-stage{position:relative;width:min(92vw,980px);aspect-ratio:1378/832;overflow:hidden}.ibc-motif-grid{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.ibc-motif-grid-dot{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--ib-teal);opacity:0;transform:translate(-50%,-50%);will-change:opacity,transform}.ibc-motif-composition{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none}.ibc-motif-piece{position:absolute}.ibc-motif-edge{position:absolute;background:var(--ib-teal);will-change:transform,opacity}.ibc-motif-edge--top{left:0;top:0;width:100%;height:1.5px;transform-origin:left center;transform:scaleX(0)}.ibc-motif-edge--right{right:0;top:0;width:1.5px;height:100%;transform-origin:top center;transform:scaleY(0)}.ibc-motif-edge--bottom{left:0;bottom:0;width:100%;height:1.5px;transform-origin:right center;transform:scaleX(0)}.ibc-motif-edge--left{left:0;top:0;width:1.5px;height:100%;transform-origin:bottom center;transform:scaleY(0)}.ibc-motif-fill{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--ib-teal);opacity:0;will-change:opacity}.ibc-motif-item{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;will-change:transform,opacity;transform:scale(.92);opacity:0}.ibc-scene08-body{margin-top:clamp(20px,3vw,28px)}.ibc-regions-row{display:flex;margin:clamp(48px,7vw,80px) var(--bleed) 0}.ibc-region{flex:1;display:flex;flex-direction:column;opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .8s cubic-bezier(.16,.84,.44,1)}.ibc-region:nth-child(1){transition-delay:0ms}.ibc-region:nth-child(2){transition-delay:.1s}.ibc-region:nth-child(3){transition-delay:.2s}.ibc-regions-row.is-visible .ibc-region{opacity:1;transform:translateY(0)}.ibc-region-img{width:100%;overflow:hidden}.ibc-region-img img{width:100%;height:100%;object-fit:cover;display:block}.ibc-region-label{display:flex;flex-direction:column;gap:3px;padding:clamp(14px,2vw,20px) clamp(4px,1vw,10px)}.ibc-region-label>span:first-child{font-family:var(--font-display);font-weight:900;font-size:.8rem;letter-spacing:.06em}.ibc-region-kr{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint);word-break:keep-all}.ibc-scene09-blocks{margin-top:clamp(32px,5vw,52px);display:flex;flex-direction:column;gap:clamp(56px,8vw,104px)}.ibc-app-twocol{display:grid;grid-template-columns:var(--app-col-l,1fr) var(--app-col-r,1fr);gap:clamp(14px,2vw,20px);align-items:center}.ibc-app-col{border-radius:0}.ibc-app-inset{margin:clamp(32px,5vw,56px) auto 0;max-width:min(58%,660px)}.ibc-app-inset img{width:100%}.ibc-closing{background:var(--ib-white);color:var(--ib-ink);margin:0 var(--bleed)}.ibc-closing-wrap{position:relative;display:grid}.ibc-closing-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 var(--inset);overflow:hidden}.ibc-closing-line{grid-column:1;grid-row:1;position:absolute;left:var(--inset);right:var(--inset);font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.025em;line-height:1;font-size:clamp(2.2rem,6.2vw,5rem);text-wrap:balance;color:var(--ib-ink);word-break:keep-all;transition:transform .8s cubic-bezier(.16,.84,.44,1),opacity .8s cubic-bezier(.16,.84,.44,1)}.ibc-closing-line span{display:block}.ibc-closing-line-a{transform:translateY(0);opacity:1}.ibc-closing-line-a.is-out{transform:translateY(-46px);opacity:0}.ibc-closing-line-b{transform:translateY(46px);opacity:0;color:var(--ib-teal-deep)}.ibc-closing-line-b.is-in{transform:translateY(0);opacity:1}.ibc-closing-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.ibc-closing-trigger{height:70vh}.ibc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid var(--line)}.ibc-closing-eyebrow{display:block;font-family:var(--font-display);font-weight:900;font-size:.82rem;letter-spacing:.06em;color:var(--ib-ink)}.ibc-closing-meta{display:block;margin-top:6px;font-family:var(--font-body);font-size:.8rem;letter-spacing:.03em;color:var(--ink-faint)}@media (max-width:1080px){.ibc-color-fields{grid-template-columns:repeat(3,1fr)}.ibc-color-fields--gray{grid-template-columns:repeat(4,1fr)}}@media (max-width:860px){.ibc-hero-big{font-size:clamp(2.2rem,10vw,3.2rem)}.ibc-scene01-grid{grid-template-columns:1fr;gap:28px}.ibc-idea-keywords{gap:10px 14px}.ibc-principle-row{justify-content:center;gap:clamp(24px,7vw,36px) clamp(24px,7vw,36px)}.ibc-principle-set{--pd: clamp(150px,44vw,206px)}.ibc-principle-sub{font-size:clamp(1.05rem,5vw,1.4rem)}.ibc-color-fields{grid-template-columns:repeat(2,1fr)}.ibc-color-fields--gray{grid-template-columns:repeat(3,1fr)}.ibc-color-field{aspect-ratio:1/1}.ibc-system-svg{width:min(58vw,280px)}.ibc-system-stage-tag{font-size:.76rem}.ibc-system-stage-kr{font-size:.82rem}.ibc-regions-row{flex-direction:column;gap:24px}.ibc-app-twocol{grid-template-columns:1fr}.ibc-app-inset{max-width:88%}.ibc-scene09-blocks{gap:clamp(40px,9vw,56px)}.ibc-logo-stage{height:clamp(74px,26vw,138px)}.ibc-motif-caption-a,.ibc-motif-caption-b{font-size:.72rem}.ibc-closing-trigger{height:56vh}.ibc-closing-line{font-size:clamp(1.7rem,7.6vw,2.8rem)}.ibc-big{font-size:clamp(1.75rem,8.2vw,2.4rem)}}@media (prefers-reduced-motion: reduce){.ibc-clip-inner{transform:none!important;transition:none!important}.ibc-principles-title .ibc-clip-inner>span{transition:none!important}.ibc-principles-title:hover .ibc-clip-inner>span{transform:none!important}.ibc-imgwrap,.ibc-region{opacity:1!important;transform:none!important;transition:none!important}.ibc-closing-line{transition:none!important}.ibc-system-sticky g.is-connected .ibc-system-dot--seed{animation:none!important}}.tkc{position:relative;background:var(--tk-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--tk-orange:#ff4700;--tk-orange-deep:color-mix(in srgb, #ff4700 78%, black);--tk-khaki:#6c6e5d;--tk-black-1:#272827;--tk-black-2:#000000;--tk-white:#ffffff}.tkc-section{padding-top:clamp(88px,11vw,148px);padding-bottom:clamp(88px,11vw,148px)}.tkc-section+.tkc-section{border-top:1px solid var(--line)}.tkc-scene-tag{display:block;font-family:var(--font-body);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tk-orange-deep);margin-bottom:clamp(20px,3vw,32px)}.tkc-scene-tag--light{color:#ffffff8f}.tkc-big{font-family:var(--font-display);font-weight:900;font-style:normal;text-transform:none;letter-spacing:-.02em;line-height:.98;color:var(--tk-black-1);font-size:clamp(2.4rem,6.4vw,5.4rem);text-wrap:balance;max-width:1040px}.tkc-big span{display:block}.tkc-big--light{color:var(--tk-white)}.tkc-kr{margin-top:14px;font-family:var(--font-body);font-size:1.1rem;color:var(--ink-soft);max-width:640px}.tkc-kr--light{color:#ffffffb8}.tkc-body{margin-top:20px;font-size:1.02rem;line-height:1.85;max-width:560px}.tkc-body--light{color:#fffc}.tkc-clip{overflow:hidden;display:block}.tkc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.tkc-clip.is-visible .tkc-clip-inner{transform:translateY(0)}.tkc-clip .tkc-clip-inner>span{display:block}.tkc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:var(--tk-white)}.tkc-imgwrap.is-visible{opacity:1;transform:scale(1)}.tkc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.tkc-bleed-img{margin:clamp(32px,5vw,56px) var(--bleed) 0}.tkc-bleed-img img{width:100%;object-fit:cover}.tkc-hero{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(48px,7vw,80px)}.tkc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(20px,3vw,32px)}.tkc-hero-eyebrow{font-family:var(--font-display);font-weight:900;font-size:.92rem;letter-spacing:.06em}.tkc-hero-meta{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint);letter-spacing:.02em}.tkc-hero-big{font-family:var(--font-display);font-weight:900;font-style:normal;letter-spacing:-.025em;line-height:.98;font-size:clamp(2.6rem,7.4vw,6.2rem);color:var(--tk-black-1)}.tkc-hero-big .tkc-clip-inner>span{display:block}.tkc-hero-body{margin-top:clamp(20px,3vw,28px)}.tkc-hero-body p{font-size:1.05rem;line-height:1.85;max-width:760px}.tkc-hero-logo-stage{margin-top:clamp(48px,7vw,84px)}.tkc-hero-logo{margin:0 var(--bleed);background:var(--tk-white)}.tkc-hero-logo img{object-fit:contain;padding:clamp(28px,6vw,72px) clamp(24px,6vw,96px)}.tkc-scene01{position:relative;overflow:hidden;background:var(--tk-black-1);margin:0 var(--bleed)}.tkc-scene01-motif{position:absolute;top:50%;right:-18%;width:min(56vw,620px);height:auto;transform:translateY(-50%);opacity:.9;pointer-events:none;z-index:0}.tkc-scene01-content{position:relative;z-index:1;padding-left:var(--inset);padding-right:var(--inset);max-width:760px}.tkc-scene02-head{padding-bottom:0}.tkc-attitude-wrap{position:relative;display:grid;margin:0 var(--bleed)}.tkc-attitude-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;justify-content:center;overflow:hidden}.tkc-attitude-frame{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0 var(--inset);text-align:center;opacity:0;transform:translateY(24px) scale(.94);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.tkc-attitude-frame.is-active{opacity:1;transform:translateY(0) scale(1)}.tkc-attitude-en{font-family:var(--font-display);font-weight:900;letter-spacing:-.02em;line-height:.94;font-size:clamp(3rem,11vw,8rem)}.tkc-attitude-frame--0 .tkc-attitude-en{color:var(--tk-black-1)}.tkc-attitude-frame--1 .tkc-attitude-en{color:var(--tk-orange)}.tkc-attitude-frame--2 .tkc-attitude-en{color:var(--tk-khaki)}.tkc-attitude-kr{font-family:var(--font-body);font-size:clamp(1rem,1.8vw,1.3rem);color:var(--ink-soft)}.tkc-attitude-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.tkc-attitude-trigger{height:65vh}.tkc-direction-row{margin-top:clamp(48px,7vw,84px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(3px,.6vw,8px);margin-left:var(--bleed);margin-right:var(--bleed)}.tkc-direction-panel{display:flex;flex-direction:column;opacity:0;transform:translateY(20px);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.tkc-direction-panel.is-visible{opacity:1;transform:translateY(0)}.tkc-direction-visual{position:relative;aspect-ratio:4/5;overflow:hidden}.tkc-direction-half{position:absolute;top:0;bottom:0;width:50%}.tkc-direction-half--dark{left:0;background:var(--tk-black-2)}.tkc-direction-half--light{right:0;background:var(--tk-orange)}.tkc-direction-visual--active{background:var(--tk-black-1);display:flex;align-items:center;justify-content:center}.tkc-direction-circle{width:60%;height:auto}.tkc-direction-visual--continuous{background:var(--tk-black-1)}.tkc-direction-strip{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;gap:clamp(10px,2vw,18px);padding:0 clamp(10px,2vw,18px);animation:tkc-strip-drift 14s linear infinite}.tkc-direction-chevron{width:clamp(46px,9vw,80px);height:auto;flex-shrink:0}@keyframes tkc-strip-drift{0%{transform:translate(0)}to{transform:translate(-50%)}}.tkc-direction-label{display:flex;flex-direction:column;gap:2px;padding:clamp(14px,2vw,20px) clamp(4px,1vw,8px)}.tkc-direction-tag{font-family:var(--font-display);font-weight:900;font-size:.78rem;letter-spacing:.06em}.tkc-direction-kr{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint)}.tkc-scene04{position:relative;background:var(--tk-black-2);margin:0 var(--bleed);padding-bottom:clamp(56px,8vw,96px)}.tkc-scene04-content{padding-left:var(--inset);padding-right:var(--inset)}.tkc-symbol-stage{width:min(52vw,460px);margin:clamp(24px,4vw,40px) auto 0;background:transparent}.tkc-symbol-stage img{filter:drop-shadow(0 0 60px rgba(255,71,0,.16))}.tkc-logotype-en{margin-top:clamp(48px,7vw,84px);width:min(100%,900px)}.tkc-logotype-kr{margin-top:clamp(28px,4vw,44px);width:min(60%,460px)}.tkc-lockup-grid{margin-top:clamp(56px,8vw,96px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,48px) clamp(32px,5vw,64px);border-top:1px solid var(--line);padding-top:clamp(40px,6vw,64px)}.tkc-lockup-item{display:flex;flex-direction:column}.tkc-lockup-img{background:var(--surface-grey)}.tkc-lockup-img img{padding:clamp(20px,3vw,32px)}.tkc-lockup-label{display:flex;flex-direction:column;gap:2px;margin-top:14px}.tkc-lockup-title{font-family:var(--font-display);font-weight:900;font-size:.74rem;letter-spacing:.1em;color:var(--tk-orange-deep)}.tkc-lockup-sub{font-family:var(--font-body);font-size:.82rem;color:var(--ink-faint)}.tkc-color-hero{margin:0 var(--bleed);color:var(--tk-white)}.tkc-color-hero-content{padding-left:var(--inset);padding-right:var(--inset)}.tkc-color-hero-hex{display:block;margin-top:clamp(28px,4vw,44px);font-family:var(--font-body);font-size:.85rem;letter-spacing:.06em;color:#ffffffc7}.tkc-color-system{padding-top:clamp(56px,7vw,88px)}.tkc-color-group-label{display:block;margin:clamp(36px,5vw,56px) 0 clamp(16px,2.2vw,22px);font-family:var(--font-display);font-weight:900;font-size:clamp(.92rem,1.4vw,1.1rem);letter-spacing:-.01em;opacity:.55}.tkc-color-fields{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 var(--bleed)}.tkc-color-fields--gray{grid-template-columns:repeat(5,1fr)}.tkc-color-field{aspect-ratio:1/1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(10px,1.1vw,16px);color:#fff}.tkc-color-field--light{color:#131211}.tkc-color-field-name{display:block;margin-bottom:clamp(4px,.6vw,7px);font-family:var(--font-display);font-weight:900;font-size:clamp(.58rem,.7vw,.66rem);letter-spacing:-.005em;line-height:1.15;opacity:.92}.tkc-color-field-hex{font-family:var(--font-body);font-size:.5rem;letter-spacing:.02em;opacity:.62;text-transform:uppercase}.tkc-scene07{background:var(--tk-black-1);margin:0 var(--bleed)}.tkc-scene07-content{padding-left:var(--inset);padding-right:var(--inset)}.tkc-motif-cluster{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,36px);width:100%;max-width:900px;margin:clamp(56px,8vw,96px) auto 0}.tkc-motif-item{width:100%;aspect-ratio:1/1;object-fit:contain;opacity:0;transform:translateY(20px) scale(.92);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.tkc-motif-cluster.is-visible .tkc-motif-item{opacity:1;transform:translateY(0) scale(1)}.tkc-pattern-stage{position:relative;min-height:min(64vh,560px);overflow:hidden;background:var(--tk-black-1);margin:clamp(48px,7vw,84px) var(--bleed) 0}.tkc-pattern-bg{position:absolute;top:-12%;right:-12%;bottom:-12%;left:-12%;opacity:.9}.tkc-pattern-bg.is-drifting{animation:tkc-pattern-drift 60s linear infinite}@keyframes tkc-pattern-drift{0%{background-position:0 0,130px 140px}to{background-position:-1200px -1200px,-1560px -1560px}}.tkc-scene09-blocks{margin-top:clamp(32px,5vw,52px);display:flex;flex-direction:column;gap:clamp(40px,6vw,64px)}.tkc-app-twocol{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,20px)}.tkc-app-col{border-radius:2px}.tkc-closing{background:var(--tk-black-1);color:var(--tk-white);margin:0 var(--bleed)}.tkc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.tkc-closing-symbol{width:min(20vw,140px);height:auto;margin-bottom:clamp(32px,5vw,52px)}.tkc-closing-line{font-family:var(--font-body);font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.7;color:#ffffffd1;max-width:640px}.tkc-closing-wordmark{margin-top:clamp(24px,4vw,36px)}.tkc-closing-wordmark .tkc-clip-inner>span{display:block;font-family:var(--font-display);font-weight:900;letter-spacing:-.02em;font-size:clamp(2.6rem,8vw,6rem);color:var(--tk-orange)}.tkc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid rgba(255,255,255,.14);text-align:center}.tkc-closing-eyebrow{display:block;font-family:var(--font-display);font-weight:900;font-size:.82rem;letter-spacing:.06em;color:var(--tk-white)}.tkc-closing-meta{display:block;margin-top:6px;font-family:var(--font-body);font-size:.8rem;letter-spacing:.03em;color:#ffffff8c}@media (max-width:1080px){.tkc-color-fields{grid-template-columns:repeat(2,1fr)}.tkc-color-fields--gray{grid-template-columns:repeat(3,1fr)}.tkc-motif-cluster{grid-template-columns:repeat(2,1fr);max-width:460px}}@media (max-width:860px){.tkc-hero-big{font-size:clamp(2.2rem,10vw,3.2rem)}.tkc-scene01-motif{width:min(90vw,420px);right:-30%;opacity:.7}.tkc-attitude-en{font-size:clamp(2.4rem,15vw,4.2rem)}.tkc-attitude-trigger{height:52vh}.tkc-direction-row{grid-template-columns:1fr;gap:20px}.tkc-direction-visual{aspect-ratio:16/9}.tkc-symbol-stage{width:min(72vw,320px)}.tkc-logotype-kr{width:min(80%,320px)}.tkc-lockup-grid{grid-template-columns:1fr}.tkc-color-fields{grid-template-columns:repeat(2,1fr)}.tkc-color-fields--gray{grid-template-columns:repeat(3,1fr)}.tkc-app-twocol{grid-template-columns:1fr}.tkc-pattern-stage{min-height:340px}.tkc-closing-symbol{width:min(30vw,110px)}}@media (prefers-reduced-motion: reduce){.tkc-clip-inner{transform:none!important;transition:none!important}.tkc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.tkc-attitude-frame{transition:none!important}.tkc-direction-panel{opacity:1!important;transform:none!important;transition:none!important}.tkc-direction-strip{animation:none!important}.tkc-motif-item{opacity:1!important;transform:none!important;transition:none!important}.tkc-pattern-bg.is-drifting{animation:none!important}}@font-face{font-family:Majuon Display;src:url(/assets/portfolio/majuon/majuon_font_display.woff2) format("woff2"),url(/assets/portfolio/majuon/majuon_font_display.otf) format("opentype");font-weight:400 800;font-style:normal;font-display:swap;unicode-range:U+0041-005A}.mjc{position:relative;background:var(--mj-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--mj-yellow:#F8B100;--mj-yellow-light:#FFD988;--mj-yellow-deep:#F8B100;--mj-green:#7CCA4A;--mj-green-light:#D9EBB4;--mj-green-deep:color-mix(in srgb, #7CCA4A 60%, black);--mj-ink:#2B2A28;--mj-ink-soft:#6B6862;--mj-ink-faint:#A6A297;--mj-white:#FFFFFF;--mj-surface:#F7F5E8;--font-mj-en-display:"Majuon Display","Baloo 2","Noto Sans KR",sans-serif;--font-mj-kr-display:"Noto Sans KR",sans-serif;--font-mj-body:"Noto Sans","Noto Sans KR",sans-serif;--font-mj-hand:"Kalam","Caveat",cursive;color:var(--mj-ink)}.mjc-section{padding-top:clamp(88px,11vw,148px);padding-bottom:clamp(88px,11vw,148px)}.mjc-section+.mjc-section{border-top:1px solid var(--line)}.mjc-tag{display:block;font-family:var(--font-mj-en-display);font-weight:700;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mj-yellow-deep);margin-bottom:clamp(20px,3vw,32px)}.mjc-tag--on-color{color:#2b2a2899}.mjc-tag--green{color:#fff}.mjc-big-en{font-family:var(--font-mj-en-display);font-weight:700;letter-spacing:-.01em;line-height:1.02;color:var(--mj-ink);font-size:clamp(2.2rem,5.6vw,4.6rem);text-wrap:balance;max-width:1040px;text-transform:uppercase}.mjc-big-en span{display:block}.mjc-big-kr{font-family:var(--font-mj-kr-display);font-weight:900;letter-spacing:-.02em;line-height:1.14;color:var(--mj-ink);font-size:clamp(2.2rem,5.8vw,4.8rem);text-wrap:balance;max-width:1100px}.mjc-big-kr span{display:block}.mjc-kr{margin-top:16px;font-family:var(--font-mj-body);font-size:1.06rem;line-height:1.85;color:var(--mj-ink-soft);max-width:620px}.mjc-body{margin-top:20px;font-family:var(--font-mj-body);font-size:1.02rem;line-height:1.85;color:var(--mj-ink-soft);max-width:560px}.mjc-clip{overflow:hidden;display:block}.mjc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.mjc-clip.is-visible .mjc-clip-inner{transform:translateY(0)}.mjc-clip .mjc-clip-inner>span{display:block}.mjc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.mjc-imgwrap.is-visible{opacity:1;transform:scale(1)}.mjc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.mjc-hero{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(48px,7vw,80px)}.mjc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(20px,3vw,32px)}.mjc-hero-eyebrow{font-family:var(--font-mj-en-display);font-weight:700;font-size:.92rem;letter-spacing:.04em}.mjc-hero-meta{font-family:var(--font-mj-body);font-size:.78rem;color:var(--mj-ink-faint);letter-spacing:.02em}.mjc-hero-big{font-family:var(--font-mj-kr-display);font-weight:900;letter-spacing:-.02em;line-height:1.08;font-size:clamp(2.6rem,7.4vw,5.8rem);color:var(--mj-ink)}.mjc-hero-big .mjc-clip-inner>span{display:block}.mjc-hero-body{margin-top:clamp(20px,3vw,28px)}.mjc-hero-body p{font-family:var(--font-mj-body);font-size:1.05rem;line-height:1.85;color:var(--mj-ink-soft);max-width:760px}.mjc-hero-logo-stage{width:100%;margin-top:clamp(48px,7vw,84px);margin-left:0;margin-right:0}.mjc-hero-logo-swap{position:relative;width:100%}.mjc-hero-logo-alt{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .45s ease;pointer-events:none}.mjc-hero-logo-stage--swap:hover .mjc-hero-logo.mjc-imgwrap{opacity:0}.mjc-hero-logo-stage--swap:hover .mjc-hero-logo-alt{opacity:1}.mjc-hero-logo{margin:0;background:transparent}.mjc-hero-logo img{width:100%;height:100%;object-fit:contain;padding:0}.mjc-name-scroll{position:relative;display:grid;margin-top:clamp(36px,5vw,64px)}.mjc-name-sticky{grid-column:1;grid-row:1;position:sticky;top:18vh;height:52vh;display:flex;align-items:center}.mjc-name-track{grid-column:1;grid-row:1}.mjc-name-trigger{height:48vh}.mjc-scene01-row{display:flex;align-items:center;gap:clamp(18px,2.5vw,32px);flex-wrap:nowrap;width:100%}.mjc-name-part{font-family:var(--font-mj-en-display);font-weight:800;letter-spacing:-.025em;line-height:.95;font-size:clamp(3rem,9.5vw,8rem);opacity:0;transform:translateY(24px);transition:opacity .55s ease,transform .65s cubic-bezier(.16,.84,.44,1);white-space:nowrap}.mjc-name-part.is-active{opacity:1;transform:translateY(0)}.mjc-name-copy{margin-top:clamp(48px,8vw,100px)}.mjc-pill-dot{position:relative;width:clamp(64px,7vw,96px);height:clamp(30px,3.4vw,46px);flex-shrink:0;border-radius:999px;border:clamp(6px,.7vw,9px) solid var(--mj-ink);box-sizing:border-box}.mjc-pill-dot:after{content:"";position:absolute;top:50%;right:14%;width:26%;aspect-ratio:1/1;background:var(--mj-yellow);border-radius:50%;transform:translateY(-50%)}.mjc-scene02-head{padding-bottom:0}.mjc-attitude-wrap{position:relative;display:grid;margin:0 var(--bleed)}.mjc-attitude-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;justify-content:center;overflow:hidden}.mjc-attitude-frame{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:0 var(--inset);text-align:center;opacity:0;transform:translateY(24px) scale(.94);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.mjc-attitude-frame.is-active{opacity:1;transform:translateY(0) scale(1)}.mjc-attitude-en{font-family:var(--font-mj-en-display);font-weight:800;letter-spacing:-.01em;line-height:.98;font-size:clamp(2.8rem,10vw,7.4rem)}.mjc-attitude-frame--0 .mjc-attitude-en{color:var(--mj-yellow-deep)}.mjc-attitude-frame--1 .mjc-attitude-en{color:var(--mj-ink)}.mjc-attitude-frame--2 .mjc-attitude-en{color:color-mix(in srgb,var(--mj-ink) 72%,var(--mj-yellow-deep))}.mjc-attitude-kr{font-family:var(--font-mj-body);font-size:clamp(1rem,1.8vw,1.3rem);color:var(--mj-ink-soft)}.mjc-attitude-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.mjc-attitude-trigger{height:65vh}.mjc-concept-list{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(28px,4.5vw,48px)}.mjc-concept-row{display:flex;align-items:baseline;gap:clamp(14px,2.2vw,24px);flex-wrap:wrap;padding-bottom:clamp(20px,3vw,32px);border-bottom:1px solid var(--line);opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.mjc-concept-row.is-visible{opacity:1;transform:translateY(0)}.mjc-concept-row:last-child{border-bottom:none}.mjc-concept-kr{font-family:var(--font-mj-kr-display);font-weight:900;letter-spacing:-.015em;font-size:clamp(1.7rem,3.6vw,2.8rem);color:var(--mj-ink)}.mjc-concept-en{font-family:var(--font-mj-body);font-size:.9rem;color:var(--mj-ink-faint);letter-spacing:.01em}.mjc-motif-stage{position:relative;margin:clamp(48px,7vw,84px) auto 0;width:min(60vw,460px);aspect-ratio:1/1}.mjc-motif-shape{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;animation:mjc-motif-cross 9s ease-in-out infinite}.mjc-motif-shape--circle{animation-delay:-4.5s}@keyframes mjc-motif-cross{0%,42%{opacity:1;transform:scale(1) rotate(0)}50%{opacity:0;transform:scale(.86) rotate(24deg)}92%,to{opacity:1;transform:scale(1) rotate(0)}}.mjc-elements-row{margin-top:clamp(56px,8vw,96px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,48px);margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.mjc-element-item{display:flex;flex-direction:column;align-items:center;text-align:center}.mjc-element-imgbox{display:flex;align-items:center;justify-content:center;width:100%;height:clamp(240px,25vw,320px)}.mjc-element-img{max-width:280px;width:100%}.mjc-piece-reveal{position:relative;max-width:280px;width:100%;overflow:visible}.mjc-piece-base{display:block;width:100%;height:100%;object-fit:contain;visibility:hidden}.mjc-piece-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(18px) scale(.94);transform-origin:center;will-change:opacity,transform}.mjc-piece-reveal.is-visible .mjc-piece-layer{animation:mjc-piece-in .58s cubic-bezier(.16,.84,.44,1) forwards;animation-delay:calc(var(--piece-index)*.13s)}@keyframes mjc-piece-in{to{opacity:1;transform:translateY(0) scale(1)}}.mjc-element-label{display:flex;flex-direction:column;gap:4px;margin-top:clamp(24px,3.4vw,36px)}.mjc-element-tag{font-family:var(--font-mj-en-display);font-weight:700;font-size:.8rem;letter-spacing:.06em;color:var(--mj-yellow-deep)}.mjc-element-kr{font-family:var(--font-mj-body);font-size:.84rem;color:var(--mj-ink-faint)}.mjc-logo-stage{margin-top:clamp(48px,7vw,84px);width:min(100%,760px);background:transparent}.mjc-logo-stage img{padding:clamp(12px,2vw,24px) clamp(20px,4vw,48px)}.mjc-logo-gif-stage{margin-top:clamp(48px,7vw,84px);width:100%;display:flex;justify-content:center;opacity:0;transform:scale(1.03);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1)}.mjc-logo-gif-stage.is-visible{opacity:1;transform:scale(1)}.mjc-logo-gif-stage img{width:100%;max-width:640px;height:auto;display:block}.mjc-scene06{--mjc-logo-vertical-gap:clamp(72px,8vw,120px);padding-top:clamp(64px,8vw,104px);padding-bottom:var(--mjc-logo-vertical-gap)}.mjc-scene06 .mjc-logo-gif-stage{margin-top:var(--mjc-logo-vertical-gap);padding-top:0;padding-bottom:0;box-sizing:border-box}.mjc-lockup-list{margin-top:clamp(56px,8vw,96px);display:flex;flex-direction:column;gap:clamp(40px,6vw,64px);border-top:1px solid var(--line);padding-top:clamp(40px,6vw,64px)}.mjc-lockup-pair{display:flex;flex-direction:column;gap:clamp(18px,2.6vw,28px)}.mjc-lockup-word{width:100%;max-width:640px}.mjc-lockup-symbol-row{display:flex;align-items:center;gap:clamp(16px,2.4vw,24px)}.mjc-lockup-symbol{width:min(40%,240px)}.mjc-lockup-tag{font-family:var(--font-mj-en-display);font-weight:700;font-size:.78rem;letter-spacing:.08em;color:var(--mj-yellow-deep)}.mjc-geometry-stage{margin-top:clamp(40px,6vw,64px);width:min(100%,760px);background:transparent}.mjc-geometry-stage img{padding:clamp(14px,2.4vw,28px) clamp(20px,3.6vw,40px)}.mjc-keyvisual-stage{width:min(100%,760px);margin:clamp(48px,7vw,84px) auto 0;max-height:none;overflow:hidden}.mjc-keyvisual-stage img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block}.mjc-color-hero{margin:0 var(--bleed);color:var(--mj-ink)}.mjc-color-hero-content{padding-left:var(--inset);padding-right:var(--inset)}.mjc-ratio-bar{display:flex;width:100%;gap:0;margin-top:clamp(36px,5.5vw,56px);min-height:clamp(180px,22vw,280px);background:transparent}.mjc-ratio-seg{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:clamp(20px,3vw,36px) clamp(18px,2.6vw,28px);border:1px solid rgba(43,42,40,.3);box-sizing:border-box}.mjc-ratio-seg+.mjc-ratio-seg{border-left:0}.mjc-ratio-seg-name{font-family:var(--font-mj-en-display);font-weight:700;font-size:clamp(.82rem,1.1vw,1rem);letter-spacing:.05em;color:#2b2a28d1}.mjc-ratio-seg-hex{font-family:var(--font-mj-body);font-size:clamp(.78rem,1vw,.9rem);letter-spacing:.03em;color:#2b2a28a8}.mjc-ratio-seg-percent{font-family:var(--font-mj-en-display);font-weight:800;font-size:clamp(2rem,4vw,3.2rem);line-height:1;color:#2b2a28e0}.mjc-color-lockups{padding-top:clamp(56px,8vw,88px);margin-top:clamp(56px,8vw,88px);border-top:1px solid rgba(43,42,40,.16)}.mjc-color-lockups-grid{margin-top:clamp(8px,1vw,16px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}.mjc-color-lockup-item{display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff6;padding:clamp(16px,2.4vw,24px)}.mjc-color-lockup-item img{width:100%;max-width:220px}.mjc-color-lockup-tag{margin-top:12px;font-family:var(--font-mj-en-display);font-weight:700;font-size:.76rem;letter-spacing:.06em;color:var(--mj-yellow-deep)}.mjc-gray-full{position:relative;margin:clamp(40px,6vw,64px) var(--bleed) 0;height:clamp(160px,20vw,260px);overflow:hidden;background:var(--mj-white)}.mjc-gray-track{display:flex;height:100%;width:max-content;animation:mjc-gray-slide 34s linear infinite paused}.mjc-gray-full.is-visible .mjc-gray-track{animation-play-state:running}.mjc-gray-set{display:flex;flex-shrink:0;height:100%}.mjc-gray-swatch{flex-shrink:0;width:clamp(96px,11vw,168px);height:100%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:clamp(10px,1.6vw,16px);border-right:1px solid rgba(43,42,40,.08)}.mjc-gray-swatch span{font-family:var(--font-mj-body);font-size:.66rem;letter-spacing:.03em;color:#fff;mix-blend-mode:difference}@keyframes mjc-gray-slide{0%{transform:translate(0)}to{transform:translate(-50%)}}.mjc-type-intro{margin-top:clamp(28px,4vw,40px);display:flex;flex-direction:column;gap:10px}.mjc-type-intro-title{font-family:var(--font-mj-en-display);font-weight:800;letter-spacing:-.01em;font-size:clamp(1.9rem,3.6vw,2.8rem);color:var(--mj-ink)}.mjc-type-intro-note{font-family:var(--font-mj-body);font-size:.88rem;letter-spacing:.02em;color:var(--mj-ink-faint)}.mjc-type-hero{margin-top:clamp(56px,8vw,96px);display:flex;justify-content:center}.mjc-type-hero-word{font-family:var(--font-mj-en-display);font-weight:800;letter-spacing:-.01em;line-height:.88;font-size:clamp(4.2rem,15vw,11.5rem);color:var(--mj-ink);text-align:center}.mjc-type-sweep-wrap{margin:clamp(48px,7vw,80px) var(--bleed) 0;overflow:hidden;padding:clamp(24px,3.4vw,36px) var(--inset);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.mjc-type-sweep-track{display:flex;width:max-content;font-family:var(--font-mj-en-display);font-weight:700;letter-spacing:.01em;font-size:clamp(2.8rem,8.4vw,6.4rem);color:var(--mj-ink-faint);animation:mjc-type-sweep 28s linear infinite paused}.mjc-type-sweep-wrap.is-visible .mjc-type-sweep-track{animation-play-state:running}.mjc-type-sweep-set{display:flex;flex-shrink:0}.mjc-type-sweep-set span{padding-right:.5em}@keyframes mjc-type-sweep{0%{transform:translate(0)}to{transform:translate(-50%)}}.mjc-type-list{margin-top:clamp(64px,9vw,96px);display:flex;flex-direction:column}.mjc-type-row{display:grid;grid-template-columns:180px 1fr;gap:clamp(16px,3vw,32px);padding:clamp(24px,3.4vw,32px) 0;border-top:1px solid var(--line)}.mjc-type-row:last-child{border-bottom:1px solid var(--line)}.mjc-type-meta{display:flex;flex-direction:column;gap:4px}.mjc-type-role{font-family:var(--font-mj-body);font-weight:700;font-size:.68rem;letter-spacing:.08em;color:var(--mj-ink-faint);text-transform:uppercase}.mjc-type-name{font-family:var(--font-mj-body);font-weight:600;font-size:1rem;color:var(--mj-ink)}.mjc-type-note{font-family:var(--font-mj-body);font-size:.76rem;color:var(--mj-ink-faint)}.mjc-type-sample{display:flex;align-items:center;color:var(--mj-ink)}.mjc-type-sample--en{font-family:var(--font-mj-body);font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.5}.mjc-type-sample--kr{font-family:Noto Sans KR,sans-serif;font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.5}.mjc-type-sample--hand{font-family:var(--font-mj-hand);font-weight:700;font-size:clamp(2rem,4vw,3rem);color:var(--mj-yellow-deep)}.mjc-type-sample--hand-img{display:block;width:min(100%,374px);height:auto;object-fit:contain;object-position:left center;transform:translateY(clamp(12px,1.6vw,22px))}.mjc-closing{background:var(--mj-white);color:var(--mj-ink);margin:0 var(--bleed)}.mjc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.mjc-closing-en{font-family:var(--font-mj-en-display);font-weight:700;letter-spacing:-.01em;line-height:1.05;font-size:clamp(2.4rem,7vw,5.2rem);color:var(--mj-yellow-deep);text-transform:uppercase}.mjc-closing-kr{margin-top:clamp(16px,2.4vw,24px);font-family:var(--font-mj-body);font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.7;color:var(--mj-ink-soft);max-width:640px}.mjc-closing-logo{width:min(46vw,320px);height:auto;margin-top:clamp(48px,7vw,84px)}.mjc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid rgba(43,42,40,.14);text-align:center}.mjc-closing-eyebrow{display:block;font-family:var(--font-mj-en-display);font-weight:700;font-size:.82rem;letter-spacing:.05em;color:var(--mj-ink)}.mjc-closing-meta{display:block;margin-top:6px;font-family:var(--font-mj-body);font-size:.8rem;letter-spacing:.03em;color:var(--mj-ink-faint)}.mjc-mockup{margin-top:clamp(64px,9vw,120px)}.mjc-mockup-full{margin-left:var(--bleed);margin-right:var(--bleed)}.mjc-mockup-full img{width:100%;height:auto;display:block}.mjc-mockup-full--narrow{width:min(82%,1200px);margin-left:auto;margin-right:auto}.mjc-mockup-duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,1.2vw,14px);margin-left:var(--bleed);margin-right:var(--bleed)}.mjc-mockup-duo-item{overflow:hidden;aspect-ratio:3/4}.mjc-mockup-duo-item img{width:100%;height:100%;object-fit:cover;display:block}.mjc-mockup-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:0;margin-top:0;margin-left:var(--bleed);margin-right:var(--bleed);padding:0}.mjc-mockup-detail-img{min-width:0;min-height:clamp(420px,50vw,760px);overflow:hidden}.mjc-mockup-detail-img img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.mjc-mockup-detail-text{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:clamp(36px,7vw,112px)}.mjc-mockup-detail-en{font-family:var(--font-mj-en-display);font-weight:700;font-size:clamp(1.5rem,2.8vw,2.2rem);color:var(--mj-ink);text-transform:uppercase}.mjc-mockup-detail-kr{font-family:var(--font-mj-body);font-size:.92rem;line-height:1.75;color:var(--mj-ink-soft);max-width:400px}.mjc-mood-grid{width:100%;max-width:1220px;margin:clamp(64px,9vw,120px) auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,400px));justify-content:center;gap:clamp(4px,.8vw,10px)}.mjc-mood-cell{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--mj-surface);opacity:0;transition:opacity .9s cubic-bezier(.16,.84,.44,1)}.mjc-mood-cell.is-visible{opacity:1}.mjc-mood-cell img,.mjc-mood-cell video{width:100%;height:100%;object-fit:cover;object-position:center;display:block}@media (max-width:1080px){.mjc-elements-row{grid-template-columns:repeat(3,1fr);gap:20px}.mjc-color-lockups-grid{grid-template-columns:repeat(3,1fr);gap:18px}.mjc-ratio-bar{flex-direction:column;min-height:0}.mjc-ratio-seg{padding:20px clamp(18px,2.6vw,28px)}}@media (max-width:860px){.mjc-hero-big{font-size:clamp(2.2rem,10vw,3.2rem)}.mjc-attitude-en{font-size:clamp(2.4rem,15vw,4.2rem)}.mjc-attitude-trigger{height:52vh}.mjc-scene01-row{gap:16px}.mjc-elements-row{grid-template-columns:1fr;gap:40px;max-width:340px;margin-left:auto;margin-right:auto}.mjc-element-imgbox{height:clamp(220px,58vw,300px)}.mjc-logo-gif-stage img{max-width:400px}.mjc-lockup-symbol-row{gap:14px}.mjc-lockup-symbol{width:min(52%,200px)}.mjc-keyvisual-stage{max-height:70vh}.mjc-color-lockups-grid{grid-template-columns:1fr;max-width:280px;margin-left:auto;margin-right:auto}.mjc-gray-full{height:clamp(200px,60vw,320px)}.mjc-type-hero-word{font-size:clamp(3.4rem,20vw,5.6rem)}.mjc-type-sweep-track{font-size:clamp(2.2rem,16vw,3.4rem)}.mjc-type-row{grid-template-columns:1fr;gap:10px}.mjc-closing-logo{width:min(70vw,280px)}.mjc-mockup-duo{grid-template-columns:1fr}.mjc-mockup-duo-item{aspect-ratio:4/3}.mjc-mockup-detail{grid-template-columns:1fr}.mjc-mockup-detail-img{min-height:70vw}.mjc-mockup-detail-text{padding:clamp(28px,8vw,56px)}.mjc-mood-grid{grid-template-columns:repeat(2,1fr);gap:3px}}@media (prefers-reduced-motion: reduce){.mjc-piece-layer{animation:none!important;opacity:1!important;transform:none!important}.mjc-clip-inner{transform:none!important;transition:none!important}.mjc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.mjc-attitude-frame{transition:none!important}.mjc-concept-row{opacity:1!important;transform:none!important;transition:none!important}.mjc-motif-shape{animation:none!important;opacity:1!important}.mjc-motif-shape--circle{opacity:0!important}.mjc-logo-gif-stage{opacity:1!important;transform:none!important;transition:none!important}.mjc-gray-track{animation:none!important;transform:none!important}.mjc-type-sweep-track{animation:none!important}.mjc-mood-cell{opacity:1!important;transition:none!important}}.oomc{position:relative;background:var(--oom-cream);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--oom-green:#004624;--oom-cream:#F6EDDA;--oom-surface:color-mix(in srgb, var(--oom-cream) 92%, var(--oom-green) 8%);--oom-ink:color-mix(in srgb, var(--oom-green) 84%, black);--oom-ink-soft:color-mix(in srgb, var(--oom-ink) 62%, var(--oom-cream));--oom-ink-faint:color-mix(in srgb, var(--oom-ink) 36%, var(--oom-cream));--oom-line:color-mix(in srgb, var(--oom-ink) 16%, transparent);--font-oom-display:var(--font-display);--font-oom-body:var(--font-body);color:var(--oom-ink)}.oomc-section{padding-top:clamp(88px,11vw,148px);padding-bottom:clamp(88px,11vw,148px)}.oomc-section+.oomc-section{border-top:1px solid var(--oom-line)}.oomc-tag{display:block;font-family:var(--font-oom-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--oom-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.oomc-tag--on-green{color:#f6edda9e}.oomc-eyebrow-tag{display:inline-block;margin-top:clamp(28px,4vw,40px);font-family:var(--font-oom-body);font-weight:700;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--oom-ink-faint)}.oomc-big-en{font-family:var(--font-oom-display);font-weight:900;font-style:normal;letter-spacing:-.01em;line-height:1.04;text-transform:uppercase;color:var(--oom-ink);font-size:clamp(2.1rem,5.2vw,4.2rem);text-wrap:balance;max-width:1040px}.oomc-big-en span{display:block}.oomc-big-en--on-green{color:var(--oom-cream)}.oomc-big-kr{font-family:var(--font-oom-body);font-weight:700;letter-spacing:-.01em;line-height:1.32;color:var(--oom-ink);font-size:clamp(1.5rem,3vw,2.1rem);text-wrap:balance;max-width:760px}.oomc-big-kr span{display:block}.oomc-big-kr--on-green{color:var(--oom-cream)}.oomc-kr{margin-top:16px;font-family:var(--font-oom-body);font-size:1.06rem;line-height:1.85;color:var(--oom-ink-soft);max-width:620px}.oomc-kr--on-green{color:#f6eddac7}.oomc-en{margin-top:14px;font-family:var(--font-oom-body);font-size:.98rem;line-height:1.7;color:var(--oom-ink-faint);max-width:560px}.oomc-en--on-green{color:#f6edda94}.oomc-body{margin-top:20px;font-family:var(--font-oom-body);font-size:1.02rem;line-height:1.9;color:var(--oom-ink-soft);max-width:600px}.oomc-clip{overflow:hidden;display:block}.oomc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.oomc-clip.is-visible .oomc-clip-inner{transform:translateY(0)}.oomc-clip .oomc-clip-inner>span{display:block}.oomc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.oomc-imgwrap.is-visible{opacity:1;transform:scale(1)}.oomc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.oomc-hero{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(48px,7vw,80px)}.oomc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(20px,3vw,32px)}.oomc-hero-eyebrow{font-family:var(--font-oom-display);font-weight:900;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase}.oomc-hero-meta{font-family:var(--font-oom-body);font-size:.78rem;color:var(--oom-ink-faint);letter-spacing:.02em}.oomc-hero-big{font-family:var(--font-oom-body);font-weight:700;letter-spacing:-.015em;line-height:1.28;font-size:clamp(1.9rem,4.6vw,3.4rem);color:var(--oom-ink)}.oomc-hero-big .oomc-clip-inner>span{display:block}.oomc-hero-body{margin-top:clamp(20px,3vw,28px)}.oomc-hero-body p{font-family:var(--font-oom-body);font-size:1.05rem;line-height:1.9;color:var(--oom-ink-soft);max-width:760px}.oomc-hero-logo-stage{margin-top:clamp(48px,7vw,84px)}.oomc-hero-logo{margin:0 var(--bleed);background:var(--oom-surface)}.oomc-hero-logo img{object-fit:contain;padding:clamp(28px,4.6vw,64px) clamp(20px,5vw,72px)}.oomc-color-hero{margin:0 var(--bleed)}.oomc-color-hero--green{background:var(--oom-green);color:var(--oom-cream)}.oomc-color-hero--cream{background:var(--oom-surface);color:var(--oom-ink)}.oomc-color-hero-content{padding-left:var(--inset);padding-right:var(--inset)}.oomc-color-hex{display:inline-block;margin-top:clamp(24px,3.4vw,36px);font-family:var(--font-oom-body);font-weight:600;font-size:.85rem;letter-spacing:.03em;color:var(--oom-ink-soft)}.oomc-color-hex--on-green{color:#f6eddab8}.oomc-quote-list{margin-top:clamp(28px,4vw,40px);display:flex;flex-direction:column;gap:14px;max-width:640px}.oomc-quote{font-family:var(--font-oom-body);font-style:italic;font-size:1rem;line-height:1.8;color:var(--oom-ink-faint)}.oomc-scene04-head{padding-bottom:0}.oomc-attitude-wrap{position:relative;display:grid;margin:0 var(--bleed)}.oomc-attitude-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--oom-green)}.oomc-attitude-frame{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:0 var(--inset);text-align:center;opacity:0;transform:translateY(24px) scale(.94);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.oomc-attitude-frame.is-active{opacity:1;transform:translateY(0) scale(1)}.oomc-attitude-en{font-family:var(--font-oom-display);font-weight:900;letter-spacing:-.005em;line-height:.98;text-transform:uppercase;font-size:clamp(2.6rem,9vw,6.6rem);color:var(--oom-cream)}.oomc-attitude-kr{font-family:var(--font-oom-body);font-size:clamp(1rem,1.8vw,1.3rem);color:#f6eddabf}.oomc-attitude-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.oomc-attitude-trigger{height:65vh}.oomc-scene05{position:relative;overflow:hidden}.oomc-scene05-mark{position:absolute;top:8%;right:calc(-1 * var(--inset) - 4vw);width:min(52vw,620px);aspect-ratio:1600/720;background-repeat:no-repeat;background-size:contain;background-position:center;opacity:.07;filter:invert(14%) sepia(58%) saturate(1200%) hue-rotate(120deg);pointer-events:none}.oomc-logo-stage{margin-top:clamp(48px,7vw,84px);width:min(100%,780px);background:var(--oom-surface)}.oomc-logo-stage img{padding:clamp(20px,3.4vw,40px) clamp(24px,4.4vw,56px)}.oomc-symbol-stage{margin-top:clamp(48px,7vw,84px);width:min(100%,880px);background:var(--oom-surface);clip-path:inset(0 100% 0 0);transition:clip-path 1.3s cubic-bezier(.16,.84,.44,1)}.oomc-symbol-stage.is-visible{clip-path:inset(0 0 0 0)}.oomc-symbol-stage img{width:100%;height:100%;object-fit:contain;display:block;padding:clamp(24px,4vw,48px) clamp(28px,5vw,64px)}.oomc-signature-list{margin-top:clamp(56px,8vw,96px);display:flex;flex-direction:column;gap:clamp(56px,8vw,96px);border-top:1px solid var(--oom-line);padding-top:clamp(48px,7vw,84px)}.oomc-signature-item{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(20px,3vw,28px)}.oomc-signature-img{width:100%;max-width:560px;background:var(--oom-surface)}.oomc-signature-img img{padding:clamp(24px,4vw,44px) clamp(28px,4.6vw,52px)}.oomc-signature-tag{font-family:var(--font-oom-body);font-weight:700;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--oom-ink-faint)}.oomc-gray-strip{display:flex;width:100%;margin-top:clamp(48px,7vw,84px);height:clamp(56px,7vw,96px)}.oomc-gray-swatch{flex:1}.oomc-gray-kr{margin-top:16px;font-family:var(--font-oom-body);font-size:.8rem;letter-spacing:.01em;color:var(--oom-ink-faint)}.oomc-type-list{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column}.oomc-type-row{display:grid;grid-template-columns:220px 1fr;gap:clamp(16px,3vw,32px);padding:clamp(28px,4vw,40px) 0;border-top:1px solid var(--oom-line)}.oomc-type-row:last-child{border-bottom:1px solid var(--oom-line)}.oomc-type-meta{display:flex;flex-direction:column;gap:4px}.oomc-type-role{font-family:var(--font-oom-body);font-weight:700;font-size:.68rem;letter-spacing:.08em;color:var(--oom-ink-faint);text-transform:uppercase}.oomc-type-name{font-family:var(--font-oom-body);font-weight:600;font-size:1rem;color:var(--oom-ink)}.oomc-type-note{font-family:var(--font-oom-body);font-size:.76rem;color:var(--oom-ink-faint)}.oomc-type-rule{margin-top:4px;font-family:var(--font-oom-body);font-size:.72rem;letter-spacing:.02em;color:var(--oom-ink-faint)}.oomc-type-sample{display:flex;align-items:center;color:var(--oom-ink)}.oomc-type-sample--en{font-family:var(--font-oom-body);font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.6}.oomc-type-sample--kr{font-family:var(--font-oom-body);font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.7}.oomc-frame-grid{margin-top:clamp(48px,7vw,84px);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:clamp(12px,2vw,20px);margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.oomc-frame-panel{position:relative;grid-column:2;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(155deg,var(--oom-green) 0%,color-mix(in srgb,var(--oom-green) 62%,black) 100%);opacity:0;transform:scale(1.06);transition:opacity 1s cubic-bezier(.16,.84,.44,1),transform 1.2s cubic-bezier(.16,.84,.44,1)}.oomc-frame-panel.is-visible{opacity:1;transform:scale(1)}.oomc-frame-panel--tall{grid-column:1;grid-row:1/3;aspect-ratio:auto}.oomc-frame-corner{position:absolute;width:0;height:0;border:1.5px solid rgba(246,237,218,.7);transition:width .9s cubic-bezier(.16,.84,.44,1) .3s,height .9s cubic-bezier(.16,.84,.44,1) .3s}.oomc-frame-corner--tl{top:18px;left:18px;border-right:none;border-bottom:none}.oomc-frame-corner--br{bottom:18px;right:18px;border-left:none;border-top:none}.oomc-frame-panel.is-visible .oomc-frame-corner{width:32px;height:32px}.oomc-rules-row{margin-top:clamp(40px,6vw,64px);display:flex;flex-wrap:wrap;gap:clamp(24px,3.4vw,40px);border-top:1px solid var(--oom-line);padding-top:clamp(28px,4vw,40px)}.oomc-rule-tag{display:flex;flex-direction:column;gap:4px}.oomc-rule-en{font-family:var(--font-oom-body);font-weight:700;font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;color:var(--oom-ink)}.oomc-rule-kr{font-family:var(--font-oom-body);font-size:.82rem;color:var(--oom-ink-faint)}.oomc-closing{background:var(--oom-surface);color:var(--oom-ink);margin:0 var(--bleed)}.oomc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.oomc-closing-en{font-family:var(--font-oom-display);font-weight:900;font-style:normal;letter-spacing:-.01em;line-height:1.06;text-transform:uppercase;font-size:clamp(2.1rem,6vw,4.4rem);color:var(--oom-green)}.oomc-closing-kr{margin-top:clamp(16px,2.4vw,24px);font-family:var(--font-oom-body);font-size:clamp(1.02rem,1.9vw,1.24rem);line-height:1.8;color:var(--oom-ink-soft);max-width:600px}.oomc-closing-logo{width:min(40vw,300px);height:auto;margin-top:clamp(48px,7vw,84px)}.oomc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid var(--oom-line);text-align:center}.oomc-closing-eyebrow{display:block;font-family:var(--font-oom-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--oom-ink)}.oomc-closing-meta{display:block;margin-top:6px;font-family:var(--font-oom-body);font-size:.8rem;letter-spacing:.03em;color:var(--oom-ink-faint)}@media (max-width:1080px){.oomc-scene05-mark{width:min(64vw,520px);top:4%}}@media (max-width:860px){.oomc-hero-big{font-size:clamp(1.7rem,7vw,2.4rem)}.oomc-attitude-en{font-size:clamp(2.3rem,15vw,4rem)}.oomc-attitude-trigger{height:52vh}.oomc-symbol-stage{width:100%}.oomc-signature-img{max-width:100%}.oomc-gray-strip{flex-wrap:wrap;height:auto}.oomc-gray-swatch{flex:1 1 20%;height:48px}.oomc-type-row{grid-template-columns:1fr;gap:10px}.oomc-frame-grid{grid-template-columns:1fr}.oomc-frame-panel{grid-column:1}.oomc-frame-panel--tall{grid-row:auto;aspect-ratio:4/3}.oomc-scene05-mark{display:none}.oomc-closing-logo{width:min(64vw,260px)}}@media (prefers-reduced-motion: reduce){.oomc-clip-inner{transform:none!important;transition:none!important}.oomc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.oomc-attitude-frame{transition:none!important}.oomc-symbol-stage{clip-path:inset(0 0 0 0)!important;transition:none!important}.oomc-frame-panel{opacity:1!important;transform:none!important;transition:none!important}.oomc-frame-corner{transition:none!important}}.bcsc{position:relative;background:var(--bcs-offwhite);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--bcs-blue:#BDDBDB;--bcs-grayblue:#E6EBEE;--bcs-offwhite:#EFEFEF;--bcs-stone:#B9B5B4;--bcs-charcoal:#342C2A;--bcs-ink:color-mix(in srgb, var(--bcs-charcoal) 88%, black);--bcs-ink-soft:color-mix(in srgb, var(--bcs-ink) 62%, var(--bcs-offwhite));--bcs-ink-faint:color-mix(in srgb, var(--bcs-ink) 38%, var(--bcs-offwhite));--bcs-line:color-mix(in srgb, var(--bcs-ink) 14%, transparent);--font-bcs-display:var(--font-display);--font-bcs-body:var(--font-body);color:var(--bcs-ink)}.bcsc-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.bcsc-section+.bcsc-section{border-top:1px solid var(--bcs-line)}.bcsc-tag{display:block;font-family:var(--font-bcs-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bcs-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.bcsc-big-kr{font-family:var(--font-bcs-body);font-weight:700;letter-spacing:-.01em;line-height:1.4;color:var(--bcs-ink);font-size:clamp(1.7rem,4.4vw,3.1rem);text-wrap:balance;max-width:880px}.bcsc-big-kr span{display:block}.bcsc-kr{margin-top:16px;font-family:var(--font-bcs-body);font-size:1.02rem;line-height:1.9;color:var(--bcs-ink-soft);max-width:600px}.bcsc-clip{overflow:hidden;display:block}.bcsc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.bcsc-clip.is-visible .bcsc-clip-inner{transform:translateY(0)}.bcsc-clip .bcsc-clip-inner>span{display:block}.bcsc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.bcsc-imgwrap.is-visible{opacity:1;transform:scale(1)}.bcsc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.bcsc-hero{background:var(--bcs-blue);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.bcsc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.bcsc-hero-eyebrow{font-family:var(--font-bcs-display);font-weight:900;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bcs-ink)}.bcsc-hero-meta{font-family:var(--font-bcs-body);font-size:.78rem;color:var(--bcs-ink-soft);letter-spacing:.02em}.bcsc-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.bcsc-hero-symbol{width:clamp(56px,7vw,96px)}.bcsc-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.bcsc-hero-big{font-family:var(--font-bcs-body);font-weight:700;letter-spacing:-.01em;line-height:1.34;font-size:clamp(1.5rem,3.6vw,2.5rem);color:var(--bcs-ink);text-align:center}.bcsc-hero-body{margin-top:clamp(18px,2.6vw,26px)}.bcsc-hero-body p{font-family:var(--font-bcs-body);font-size:.94rem;line-height:1.9;color:var(--bcs-ink-soft)}.bcsc-role-row{margin-top:clamp(56px,8vw,96px);display:flex;align-items:flex-start;justify-content:center;flex-wrap:wrap}.bcsc-role-item{display:flex;align-items:flex-start}.bcsc-role-dots{display:flex;align-items:center;gap:10px;margin:0 clamp(12px,2.4vw,28px);padding-top:clamp(56px,7vw,80px)}.bcsc-dot{border-radius:50%;display:block;background:var(--bcs-ink-faint)}.bcsc-dot--sm{width:6px;height:6px;opacity:.5}.bcsc-dot--lg{width:14px;height:14px;opacity:.32}.bcsc-role-col{display:flex;flex-direction:column;align-items:center;text-align:center;width:clamp(150px,20vw,220px)}.bcsc-role-circle{width:clamp(120px,15vw,168px);height:clamp(120px,15vw,168px);border-radius:50%;flex-shrink:0;border:1px solid var(--bcs-line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:color-mix(in srgb,var(--bcs-blue) 26%,var(--bcs-offwhite))}.bcsc-role-en{font-family:var(--font-bcs-display);font-weight:800;font-size:.9rem;letter-spacing:.02em;color:var(--bcs-ink)}.bcsc-role-kr{font-family:var(--font-bcs-body);font-size:.8rem;color:var(--bcs-ink-soft)}.bcsc-role-body{margin-top:20px;font-family:var(--font-bcs-body);font-size:.85rem;line-height:1.75;color:var(--bcs-ink-faint);max-width:220px}.bcsc-scene02-head{padding-bottom:0}.bcsc-attitude-wrap{position:relative;display:grid;margin:0 var(--bleed)}.bcsc-attitude-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--bcs-blue)}.bcsc-attitude-frame{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:0 var(--inset);text-align:center;opacity:0;transform:translateY(24px) scale(.94);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.bcsc-attitude-frame.is-active{opacity:1;transform:translateY(0) scale(1)}.bcsc-attitude-en{font-family:var(--font-bcs-display);font-weight:900;letter-spacing:-.005em;line-height:.98;text-transform:uppercase;font-size:clamp(2.4rem,8vw,5.8rem);color:var(--bcs-ink)}.bcsc-attitude-kr{font-family:var(--font-bcs-body);font-size:clamp(1rem,1.8vw,1.3rem);color:var(--bcs-ink-soft)}.bcsc-attitude-gloss{font-family:var(--font-bcs-body);font-size:.82rem;color:var(--bcs-ink-faint);max-width:420px}.bcsc-attitude-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.bcsc-attitude-trigger{height:65vh}.bcsc-principle-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(24px,4vw,48px);flex-wrap:wrap}.bcsc-principle-circle{width:clamp(140px,18vw,200px);height:clamp(140px,18vw,200px);border-radius:50%;flex-shrink:0;border:1px solid var(--bcs-line);display:flex;align-items:center;justify-content:center;text-align:center;padding:0 16px;background:var(--bcs-offwhite);background-size:cover;background-position:center;opacity:0;transform:scale(.92);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1)}.bcsc-principle-circle.is-visible{opacity:1;transform:scale(1)}.bcsc-principle-circle span{font-family:var(--font-bcs-body);font-weight:600;font-size:.92rem;color:var(--bcs-ink)}.bcsc-principle-circle--textured span{background:color-mix(in srgb,var(--bcs-offwhite) 78%,transparent);padding:4px 10px;border-radius:20px}.bcsc-rule{margin-top:clamp(48px,7vw,72px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--bcs-line)}.bcsc-footnote{font-family:var(--font-bcs-body);font-size:.86rem;line-height:1.8;color:var(--bcs-ink-faint);max-width:640px}.bcsc-symbol-stage{margin-top:clamp(56px,8vw,96px);width:min(60vw,420px);background:var(--bcs-grayblue)}.bcsc-symbol-stage img{padding:clamp(28px,5vw,56px)}.bcsc-logo-stage{margin-top:clamp(56px,8vw,96px);width:min(100%,720px);background:var(--bcs-grayblue)}.bcsc-logo-stage img{padding:clamp(24px,4vw,48px) clamp(28px,5vw,56px)}.bcsc-color-hero{margin:0 var(--bleed);min-height:66vh;display:flex;align-items:center;color:var(--bcs-ink)}.bcsc-color-hero--dark{color:var(--bcs-offwhite)}.bcsc-color-hero-content{padding-left:var(--inset);padding-right:var(--inset);width:100%}.bcsc-color-label{margin-top:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:4px}.bcsc-color-en{font-family:var(--font-bcs-display);font-weight:800;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}.bcsc-color-kr{font-family:var(--font-bcs-body);font-size:1.3rem;font-weight:600}.bcsc-color-values{font-family:var(--font-bcs-body);font-size:.78rem;opacity:.62;font-variant-numeric:tabular-nums}.bcsc-texture-row{margin-top:clamp(56px,8vw,96px);display:flex;gap:clamp(20px,3vw,32px);flex-wrap:wrap}.bcsc-texture-tile{position:relative;width:clamp(140px,20vw,220px);aspect-ratio:1;border-radius:50%;flex-shrink:0;background-size:cover;background-position:center;opacity:0;transform:scale(.94);transition:opacity 1s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);display:flex;align-items:flex-end;justify-content:center;padding-bottom:16px}.bcsc-texture-tile.is-visible{opacity:1;transform:scale(1)}.bcsc-texture-tile span{position:relative;font-family:var(--font-bcs-body);font-weight:700;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bcs-offwhite);background:color-mix(in srgb,var(--bcs-charcoal) 60%,transparent);padding:4px 10px;border-radius:20px}.bcsc-closing{background:var(--bcs-charcoal);color:var(--bcs-offwhite);margin:0 var(--bleed)}.bcsc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.bcsc-closing-kr{font-family:var(--font-bcs-body);font-weight:700;letter-spacing:-.01em;line-height:1.42;color:var(--bcs-offwhite);font-size:clamp(1.6rem,4.4vw,2.8rem);text-wrap:balance}.bcsc-closing-kr span{display:block}.bcsc-closing-symbol{width:clamp(64px,8vw,110px);margin-top:clamp(56px,8vw,96px);filter:brightness(0) invert(1)}.bcsc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(48px,7vw,72px);border-top:1px solid color-mix(in srgb,var(--bcs-offwhite) 20%,transparent);text-align:center}.bcsc-closing-eyebrow{display:block;font-family:var(--font-bcs-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bcs-offwhite)}.bcsc-closing-meta{display:block;margin-top:6px;font-family:var(--font-bcs-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--bcs-offwhite) 60%,transparent)}@media (max-width:1080px){.bcsc-role-circle{width:clamp(104px,16vw,150px);height:clamp(104px,16vw,150px)}}@media (max-width:860px){.bcsc-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.bcsc-role-row{flex-direction:column;align-items:center}.bcsc-role-item{flex-direction:column}.bcsc-role-dots{flex-direction:row;padding:20px 0;margin:0}.bcsc-role-col{margin-top:8px}.bcsc-attitude-en{font-size:clamp(2.2rem,14vw,3.6rem)}.bcsc-attitude-trigger{height:52vh}.bcsc-principle-row{justify-content:center}.bcsc-symbol-stage{width:100%}.bcsc-color-hero{min-height:52vh}.bcsc-texture-row{justify-content:center}.bcsc-closing-symbol{width:clamp(56px,14vw,84px)}}@media (prefers-reduced-motion: reduce){.bcsc-clip-inner{transform:none!important;transition:none!important}.bcsc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.bcsc-attitude-frame{transition:none!important}.bcsc-principle-circle,.bcsc-texture-tile{opacity:1!important;transform:none!important;transition:none!important}}.jsc{position:relative;background:var(--js-offwhite);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--js-offwhite:#F4F3EE;--js-lightgray:#EAE7DE;--js-deepgray:#9A9189;--js-beige:#D0B79C;--js-lightbrown:#A5774C;--js-basicbrown:#72513E;--js-deepbrown:#4E3417;--js-ink:var(--js-deepbrown);--js-ink-soft:color-mix(in srgb, var(--js-ink) 68%, var(--js-offwhite));--js-ink-faint:color-mix(in srgb, var(--js-ink) 44%, var(--js-offwhite));--js-line:color-mix(in srgb, var(--js-ink) 16%, transparent);--font-js-display:var(--font-display);--font-js-body:var(--font-body);color:var(--js-ink)}.jsc-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.jsc-section+.jsc-section{border-top:1px solid var(--js-line)}.jsc-tag{display:block;font-family:var(--font-js-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--js-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.jsc-big{font-family:var(--font-js-body);font-weight:700;letter-spacing:-.01em;line-height:1.4;color:var(--js-ink);font-size:clamp(1.7rem,4.4vw,3.1rem);text-wrap:balance;max-width:880px}.jsc-big span{display:block}.jsc-kr{margin-top:16px;font-family:var(--font-js-body);font-size:1.02rem;line-height:1.9;color:var(--js-ink-soft);max-width:600px}.jsc-logo-label{font-family:var(--font-js-body);font-weight:600;font-size:.74rem;letter-spacing:.05em;color:var(--js-ink-faint)}.jsc-clip{overflow:hidden;display:block}.jsc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.jsc-clip.is-visible .jsc-clip-inner{transform:translateY(0)}.jsc-clip .jsc-clip-inner>span{display:block}.jsc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.jsc-imgwrap.is-visible{opacity:1;transform:scale(1)}.jsc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.jsc-hero{background:var(--js-lightgray);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.jsc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.jsc-hero-eyebrow{font-family:var(--font-js-display);font-weight:900;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--js-ink)}.jsc-hero-meta{font-family:var(--font-js-body);font-size:.78rem;color:var(--js-ink-soft);letter-spacing:.02em}.jsc-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.jsc-hero-symbol{width:clamp(140px,17vw,240px);aspect-ratio:1}.jsc-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.jsc-hero-big{font-family:var(--font-js-body);font-weight:700;letter-spacing:-.01em;line-height:1.34;font-size:clamp(1.5rem,3.6vw,2.5rem);color:var(--js-ink);text-align:center}.jsc-hero-body{margin-top:clamp(18px,2.6vw,26px)}.jsc-hero-body p{font-family:var(--font-js-body);font-size:.94rem;line-height:1.9;color:var(--js-ink-soft)}.jsc-scene01 .jsc-kr{max-width:640px}.jsc-essence-hero{margin:0 var(--bleed);min-height:74vh;display:flex;align-items:center;color:var(--js-ink)}.jsc-essence-hero--dark{color:var(--js-offwhite)}.jsc-essence-content{padding-left:var(--inset);padding-right:var(--inset);width:100%}.jsc-essence-tag{display:block;font-family:var(--font-js-display);font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;opacity:.66;margin-bottom:clamp(16px,2.6vw,28px)}.jsc-essence-kr{max-width:760px}.jsc-scene03-head{padding-bottom:0}.jsc-attitude-wrap{position:relative;display:grid;margin:0 var(--bleed)}.jsc-attitude-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--js-lightgray)}.jsc-attitude-frame{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:0 var(--inset);text-align:center;opacity:0;transform:translateY(24px) scale(.94);transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.jsc-attitude-frame.is-active{opacity:1;transform:translateY(0) scale(1)}.jsc-attitude-en{font-family:var(--font-js-display);font-weight:900;letter-spacing:-.005em;line-height:.98;text-transform:uppercase;font-size:clamp(2.2rem,7.4vw,5.2rem);color:var(--js-ink)}.jsc-attitude-kr{font-family:var(--font-js-body);font-size:clamp(1rem,1.8vw,1.3rem);color:var(--js-ink-soft)}.jsc-attitude-gloss{font-family:var(--font-js-body);font-size:.82rem;color:var(--js-ink-faint);max-width:420px}.jsc-attitude-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.jsc-attitude-trigger{height:65vh}.jsc-principle-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(24px,4vw,48px);flex-wrap:wrap}.jsc-principle-circle{position:relative;width:clamp(140px,18vw,200px);height:clamp(140px,18vw,200px);border-radius:50%;flex-shrink:0;border:1px solid var(--js-line);display:flex;align-items:center;justify-content:center;text-align:center;padding:0 16px;background:var(--js-offwhite);overflow:hidden;opacity:0;transform:scale(.92);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1)}.jsc-principle-circle.is-visible{opacity:1;transform:scale(1)}.jsc-principle-circle img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:.5}.jsc-principle-circle span{position:relative;font-family:var(--font-js-body);font-weight:600;font-size:.86rem;color:var(--js-ink);background:color-mix(in srgb,var(--js-offwhite) 74%,transparent);padding:6px 12px;border-radius:20px;display:flex;flex-direction:column;gap:2px}.jsc-principle-circle b{font-family:var(--font-js-display);font-weight:800;font-size:.7rem;letter-spacing:.06em}.jsc-logo-stack{margin-top:clamp(56px,8vw,96px);display:flex;flex-direction:column;gap:clamp(40px,6vw,64px)}.jsc-logo-row{display:flex;flex-direction:column;gap:12px}.jsc-logo-stage{width:min(100%,520px);height:clamp(96px,12vw,160px);background:var(--js-lightgray)}.jsc-logo-stage img{padding:clamp(16px,2.4vw,28px)}.jsc-symbol-kr{margin-top:14px}.jsc-symbol-kr p{font-family:var(--font-js-body);font-size:1.05rem;line-height:1.8;color:var(--js-ink-soft)}.jsc-symbol-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(28px,4.5vw,56px);flex-wrap:wrap}.jsc-symbol-col{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.jsc-symbol-stage{width:clamp(160px,22vw,260px);background:var(--js-lightgray);border-radius:50%}.jsc-symbol-stage img{padding:clamp(20px,3vw,32px)}.jsc-signature-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(32px,5vw,64px);flex-wrap:wrap;align-items:flex-end}.jsc-signature-col{display:flex;flex-direction:column;gap:12px}.jsc-signature-stage{width:clamp(220px,26vw,340px);background:var(--js-lightgray)}.jsc-signature-stage img{padding:clamp(24px,3.4vw,36px)}.jsc-grid-footnote{margin-top:clamp(56px,8vw,88px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--js-line);display:flex;align-items:center;gap:clamp(20px,3vw,32px);flex-wrap:wrap;opacity:0;transform:translateY(10px);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1)}.jsc-grid-footnote.is-visible{opacity:1;transform:translateY(0)}.jsc-grid-footnote img{width:min(100%,340px);flex-shrink:0;opacity:.85}.jsc-grid-footnote p{font-family:var(--font-js-body);font-size:.84rem;line-height:1.8;color:var(--js-ink-faint);max-width:320px}.jsc-system-grid{margin-top:clamp(48px,7vw,84px);display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(32px,4.5vw,56px)}.jsc-system-item{display:flex;flex-direction:column;gap:12px}.jsc-system-stage{width:100%;background:var(--js-lightgray)}.jsc-system-stage img{padding:clamp(28px,4vw,44px)}.jsc-rule{margin-top:clamp(48px,7vw,72px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--js-line)}.jsc-footnote{font-family:var(--font-js-body);font-size:.86rem;line-height:1.8;color:var(--js-ink-faint);max-width:640px}.jsc-scene09-head{padding-bottom:clamp(56px,8vw,96px)}.jsc-graphic-basic{margin:clamp(56px,8vw,96px) auto 0;width:min(70vw,460px);background:var(--js-lightgray);border-radius:50%;overflow:hidden}.jsc-graphic-tiles{margin-top:clamp(40px,6vw,64px);display:flex;justify-content:center;gap:clamp(20px,3vw,32px);flex-wrap:wrap}.jsc-graphic-tile{width:clamp(120px,15vw,180px);background:var(--js-lightgray)}.jsc-graphic-field{margin:0 var(--bleed);height:clamp(260px,42vw,520px);background-size:cover;background-position:center;opacity:0;transition:opacity 1.1s cubic-bezier(.16,.84,.44,1)}.jsc-graphic-field.is-visible{opacity:1}.jsc-color-band{margin:clamp(48px,7vw,84px) var(--bleed) 0;display:flex;height:clamp(160px,20vw,260px)}.jsc-color-field{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--js-ink)}.jsc-color-field--dark{color:var(--js-offwhite)}.jsc-color-en{font-family:var(--font-js-display);font-weight:800;font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;opacity:.82}.jsc-color-hex{font-family:var(--font-js-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.62}.jsc-gray-band{margin:2px var(--bleed) 0;display:flex;height:clamp(28px,3.6vw,44px)}.jsc-gray-field{flex:1}.jsc-gray-caption{display:block;margin-top:12px;font-family:var(--font-js-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--js-ink-faint)}.jsc-scene11{background:var(--js-lightgray);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.jsc-scene11 .jsc-big{max-width:680px}.jsc-scene11 .jsc-kr{max-width:560px}.jsc-card-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(24px,3.6vw,40px);flex-wrap:wrap}.jsc-card-stage{width:clamp(260px,34vw,460px);border-radius:6px;box-shadow:0 24px 60px -30px color-mix(in srgb,var(--js-deepbrown) 45%,transparent)}.jsc-closing{background:var(--js-deepbrown);color:var(--js-offwhite);margin:0 var(--bleed)}.jsc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.jsc-closing-kr{font-family:var(--font-js-body);font-weight:700;letter-spacing:-.01em;line-height:1.42;color:var(--js-offwhite);font-size:clamp(1.6rem,4.4vw,2.8rem);text-wrap:balance}.jsc-closing-kr span{display:block}.jsc-closing-signoff{margin-top:clamp(48px,7vw,80px)}.jsc-closing-signoff p{font-family:var(--font-js-body);font-size:1rem;line-height:1.9;color:color-mix(in srgb,var(--js-offwhite) 76%,transparent)}.jsc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--js-offwhite) 20%,transparent);text-align:center}.jsc-closing-eyebrow{display:block;font-family:var(--font-js-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--js-offwhite)}.jsc-closing-meta{display:block;margin-top:6px;font-family:var(--font-js-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--js-offwhite) 60%,transparent)}@media (max-width:1080px){.jsc-system-grid{grid-template-columns:1fr}}@media (max-width:860px){.jsc-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.jsc-hero-symbol{width:clamp(110px,30vw,180px)}.jsc-attitude-en{font-size:clamp(2.1rem,13vw,3.4rem)}.jsc-attitude-trigger{height:52vh}.jsc-principle-row{justify-content:center}.jsc-logo-stage{width:100%}.jsc-symbol-row{justify-content:center}.jsc-symbol-stage{width:clamp(150px,44vw,220px)}.jsc-signature-row{justify-content:center}.jsc-signature-stage{width:min(80vw,280px)}.jsc-grid-footnote{flex-direction:column;align-items:flex-start}.jsc-system-grid{gap:32px}.jsc-essence-hero{min-height:56vh}.jsc-color-band{flex-wrap:wrap;height:auto}.jsc-color-field{flex:1 1 33.33%;min-width:33.33%;height:clamp(110px,26vw,150px)}.jsc-gray-band{flex-wrap:wrap;height:auto}.jsc-gray-field{flex:1 1 20%;min-width:20%;height:clamp(28px,7vw,40px)}.jsc-card-row{justify-content:center}.jsc-card-stage{width:100%}}@media (prefers-reduced-motion: reduce){.jsc-clip-inner{transform:none!important;transition:none!important}.jsc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.jsc-attitude-frame{transition:none!important}.jsc-principle-circle,.jsc-grid-footnote{opacity:1!important;transform:none!important;transition:none!important}.jsc-graphic-field{opacity:1!important;transition:none!important}}.jdc{position:relative;background:var(--jd-offwhite);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--jd-offwhite:#F4F3EE;--jd-burgundy:#751522;--jd-yellow:#E3D3B0;--jd-pink:#E6C1B1;--jd-navy:#051C2B;--jd-ink:var(--jd-navy);--jd-ink-soft:color-mix(in srgb, var(--jd-ink) 68%, var(--jd-offwhite));--jd-ink-faint:color-mix(in srgb, var(--jd-ink) 44%, var(--jd-offwhite));--jd-line:color-mix(in srgb, var(--jd-ink) 16%, transparent);--font-jd-display:var(--font-display);--font-jd-body:var(--font-body);color:var(--jd-ink)}.jdc-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.jdc-section+.jdc-section{border-top:1px solid var(--jd-line)}.jdc-tag{display:block;font-family:var(--font-jd-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--jd-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.jdc-tag--onphoto{color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.32)}.jdc-big{font-family:var(--font-jd-body);font-weight:700;letter-spacing:-.01em;line-height:1.4;color:var(--jd-ink);font-size:clamp(1.7rem,4.4vw,3.1rem);text-wrap:balance;max-width:880px}.jdc-big span{display:block}.jdc-kr{margin-top:16px;font-family:var(--font-jd-body);font-size:1.02rem;line-height:1.9;color:var(--jd-ink-soft);max-width:600px}.jdc-footnote{font-family:var(--font-jd-body);font-size:.86rem;line-height:1.8;color:var(--jd-ink-faint);max-width:640px}.jdc-logo-label{font-family:var(--font-jd-body);font-weight:600;font-size:.74rem;letter-spacing:.05em;color:var(--jd-ink-faint)}.jdc-clip{overflow:hidden;display:block}.jdc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.jdc-clip.is-visible .jdc-clip-inner{transform:translateY(0)}.jdc-clip .jdc-clip-inner>span{display:block}.jdc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.jdc-imgwrap.is-visible{opacity:1;transform:scale(1)}.jdc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.jdc-hero{background:var(--jd-burgundy);color:var(--jd-yellow);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.jdc-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.jdc-hero-eyebrow{font-family:var(--font-jd-display);font-weight:900;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--jd-yellow)}.jdc-hero-meta{font-family:var(--font-jd-body);font-size:.78rem;color:color-mix(in srgb,var(--jd-yellow) 72%,transparent);letter-spacing:.02em}.jdc-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.jdc-hero-logo{width:clamp(260px,38vw,560px);aspect-ratio:1217/351}.jdc-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.jdc-hero-big{font-family:var(--font-jd-body);font-weight:700;letter-spacing:-.01em;line-height:1.34;font-size:clamp(1.5rem,3.6vw,2.5rem);color:var(--jd-yellow);text-align:center}.jdc-hero-body{margin-top:clamp(18px,2.6vw,26px)}.jdc-hero-body p{font-family:var(--font-jd-body);font-size:.94rem;line-height:1.9;color:color-mix(in srgb,var(--jd-yellow) 80%,transparent)}.jdc-scene01{background:var(--jd-yellow);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--jd-ink)}.jdc-idea-kr{margin-top:14px}.jdc-idea-kr p{font-family:var(--font-jd-body);font-size:1.05rem;line-height:1.8;color:var(--jd-ink-soft)}.jdc-idea-body{max-width:600px}.jdc-keyword-row{margin-top:clamp(48px,7vw,84px);display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 6px}.jdc-keyword{font-family:var(--font-jd-display);font-weight:800;letter-spacing:-.005em;font-size:clamp(1.2rem,3vw,1.9rem);color:var(--jd-ink)}.jdc-keyword-slash{display:inline-block;margin-right:14px;opacity:.38;font-weight:400}.jdc-sunset-stage{position:relative;margin:0 var(--bleed);overflow:hidden;opacity:0;transform:scale(1.04);transition:opacity 1s cubic-bezier(.16,.84,.44,1),transform 1.2s cubic-bezier(.16,.84,.44,1)}.jdc-sunset-stage.is-visible{opacity:1;transform:scale(1)}.jdc-sunset-stage img{width:100%;height:clamp(420px,78vh,880px);object-fit:cover;display:block}.jdc-sunset-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;padding:clamp(28px,4vw,44px) var(--inset);pointer-events:none}.jdc-sunset-text p{font-family:var(--font-jd-body);font-weight:700;letter-spacing:-.01em;line-height:1.3;font-size:clamp(1.7rem,4.6vw,3rem);color:#fff;text-shadow:0 4px 28px rgba(0,0,0,.3);text-wrap:balance;max-width:820px}.jdc-sunset-fade{position:absolute;left:0;right:0;bottom:0;height:38%;background:linear-gradient(to bottom,transparent,var(--jd-offwhite));pointer-events:none}.jdc-sunset-foot{padding-top:clamp(48px,7vw,80px);text-align:center;display:flex;justify-content:center}.jdc-sunset-kr p{font-family:var(--font-jd-body);font-size:1.1rem;line-height:1.8;color:var(--jd-ink-soft);max-width:520px}.jdc-scene03-kr{margin-top:14px;max-width:600px}.jdc-symbol-stage{margin:clamp(48px,7vw,84px) auto 0;width:min(56vw,380px)}.jdc-scene03-body{margin-top:clamp(48px,7vw,72px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--jd-line)}.jdc-scene04{background:var(--jd-yellow);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--jd-ink)}.jdc-structure-row{margin-top:clamp(48px,7vw,84px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center}.jdc-structure-text .jdc-big{max-width:460px}.jdc-structure-detail{width:100%}.jdc-logotype-lead{max-width:520px}.jdc-colorway-row{margin-top:clamp(48px,7vw,84px);display:flex;gap:clamp(24px,4vw,40px);flex-wrap:wrap}.jdc-colorway-col{flex:1 1 260px;display:flex;flex-direction:column;gap:12px}.jdc-colorway-stage{width:100%;border-radius:4px;overflow:hidden}.jdc-color-band{margin:clamp(48px,7vw,84px) var(--bleed) 0;display:flex;height:clamp(160px,20vw,260px)}.jdc-color-field{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--jd-ink)}.jdc-color-field--dark{color:var(--jd-yellow)}.jdc-color-en{font-family:var(--font-jd-display);font-weight:800;font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;opacity:.82}.jdc-color-hex{font-family:var(--font-jd-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.62}.jdc-gray-band{margin:2px var(--bleed) 0;display:flex;height:clamp(28px,3.6vw,44px)}.jdc-gray-field{flex:1}.jdc-gray-caption{display:block;margin-top:12px;font-family:var(--font-jd-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--jd-ink-faint)}.jdc-scene07{background:var(--jd-navy);color:var(--jd-yellow);margin:0 var(--bleed);padding:clamp(64px,9vw,110px) var(--inset)}.jdc-scene07 .jdc-big{color:var(--jd-yellow);max-width:640px}.jdc-type-row{margin-top:clamp(40px,6vw,64px);display:flex;gap:clamp(40px,6vw,72px);flex-wrap:wrap}.jdc-type-item{display:flex;flex-direction:column;gap:6px}.jdc-type-name{font-family:var(--font-jd-display);font-weight:800;font-size:clamp(1.4rem,3vw,2rem);color:var(--jd-yellow)}.jdc-type-role{font-family:var(--font-jd-body);font-size:.82rem;color:color-mix(in srgb,var(--jd-yellow) 72%,transparent)}.jdc-application-stage{margin-top:clamp(48px,7vw,84px);width:100%;border-radius:6px;overflow:hidden;box-shadow:0 24px 60px -30px color-mix(in srgb,var(--jd-navy) 45%,transparent)}.jdc-rule{margin-top:clamp(48px,7vw,72px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--jd-line)}.jdc-closing{background:var(--jd-burgundy);color:var(--jd-yellow);margin:0 var(--bleed)}.jdc-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.jdc-closing-kr{font-family:var(--font-jd-body);font-weight:700;letter-spacing:-.01em;line-height:1.42;color:var(--jd-yellow);font-size:clamp(1.6rem,4.4vw,2.8rem);text-wrap:balance}.jdc-closing-kr span{display:block}.jdc-closing-signoff{margin-top:clamp(32px,5vw,48px)}.jdc-closing-signoff p{font-family:var(--font-jd-body);font-size:1rem;line-height:1.9;color:color-mix(in srgb,var(--jd-yellow) 76%,transparent)}.jdc-closing-logo{margin-top:clamp(56px,8vw,96px);width:clamp(220px,30vw,420px);aspect-ratio:1217/351}.jdc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--jd-yellow) 20%,transparent);text-align:center}.jdc-closing-eyebrow{display:block;font-family:var(--font-jd-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--jd-yellow)}.jdc-closing-meta{display:block;margin-top:6px;font-family:var(--font-jd-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--jd-yellow) 60%,transparent)}@media (max-width:1080px){.jdc-structure-row{grid-template-columns:1fr}}@media (max-width:860px){.jdc-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.jdc-hero-logo{width:clamp(200px,60vw,320px)}.jdc-keyword{font-size:clamp(1.05rem,5vw,1.4rem)}.jdc-sunset-stage img{height:clamp(340px,60vh,560px)}.jdc-sunset-text p{font-size:clamp(1.4rem,7vw,1.9rem)}.jdc-symbol-stage{width:min(78vw,300px)}.jdc-structure-row{gap:40px}.jdc-colorway-row{justify-content:center}.jdc-color-band{flex-wrap:wrap;height:auto}.jdc-color-field{flex:1 1 50%;min-width:50%;height:clamp(120px,30vw,160px)}.jdc-gray-band{flex-wrap:wrap;height:auto}.jdc-gray-field{flex:1 1 25%;min-width:25%;height:clamp(28px,7vw,40px)}.jdc-type-row{gap:32px}.jdc-closing-logo{width:clamp(180px,50vw,280px)}}@media (prefers-reduced-motion: reduce){.jdc-clip-inner{transform:none!important;transition:none!important}.jdc-imgwrap,.jdc-sunset-stage{opacity:1!important;transform:none!important;transition:none!important}}.bcnl{position:relative;background:var(--bcnl-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--bcnl-white:#FEFFFF;--bcnl-navy:#0A1431;--bcnl-lime:#E4FE33;--bcnl-gray:#D5D5D5;--bcnl-ink:var(--bcnl-navy);--bcnl-ink-soft:color-mix(in srgb, var(--bcnl-ink) 68%, var(--bcnl-white));--bcnl-ink-faint:color-mix(in srgb, var(--bcnl-ink) 44%, var(--bcnl-white));--bcnl-line:color-mix(in srgb, var(--bcnl-ink) 14%, transparent);--font-bcnl-display:var(--font-display);--font-bcnl-body:var(--font-body);color:var(--bcnl-ink)}.bcnl-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.bcnl-section+.bcnl-section{border-top:1px solid var(--bcnl-line)}.bcnl-tag{display:block;font-family:var(--font-bcnl-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bcnl-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.bcnl-big{font-family:var(--font-bcnl-body);font-weight:800;letter-spacing:-.015em;line-height:1.32;color:var(--bcnl-ink);font-size:clamp(1.9rem,5vw,3.6rem);text-wrap:balance;max-width:920px}.bcnl-big span{display:block}.bcnl-kr{margin-top:16px;font-family:var(--font-bcnl-body);font-size:1.02rem;line-height:1.9;color:var(--bcnl-ink-soft);max-width:600px}.bcnl-footnote{font-family:var(--font-bcnl-body);font-size:.86rem;line-height:1.8;color:var(--bcnl-ink-faint);max-width:640px}.bcnl-logo-label{font-family:var(--font-bcnl-body);font-weight:600;font-size:.74rem;letter-spacing:.05em;color:var(--bcnl-ink-faint)}.bcnl-clip{overflow:hidden;display:block}.bcnl-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.bcnl-clip.is-visible .bcnl-clip-inner{transform:translateY(0)}.bcnl-clip .bcnl-clip-inner>span{display:block}.bcnl-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.bcnl-imgwrap.is-visible{opacity:1;transform:scale(1)}.bcnl-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.bcnl-hero{background:var(--bcnl-white);color:var(--bcnl-navy);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.bcnl-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.bcnl-hero-eyebrow{font-family:var(--font-bcnl-display);font-weight:900;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bcnl-navy)}.bcnl-hero-meta{font-family:var(--font-bcnl-body);font-size:.78rem;color:var(--bcnl-ink-soft);letter-spacing:.02em}.bcnl-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.bcnl-hero-logo{width:clamp(280px,60vw,900px)}.bcnl-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.bcnl-hero-big{font-family:var(--font-bcnl-body);font-weight:800;letter-spacing:-.015em;line-height:1.3;font-size:clamp(1.6rem,3.8vw,2.6rem);color:var(--bcnl-navy);text-align:center}.bcnl-hero-body{margin-top:clamp(18px,2.6vw,26px)}.bcnl-hero-body p{font-family:var(--font-bcnl-body);font-size:.94rem;line-height:1.9;color:var(--bcnl-ink-soft)}.bcnl-scene01{background:var(--bcnl-navy);color:var(--bcnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.bcnl-scene01 .bcnl-big{color:var(--bcnl-white)}.bcnl-scene01 .bcnl-kr{color:color-mix(in srgb,var(--bcnl-white) 74%,transparent)}.bcnl-essence-row{margin-top:clamp(48px,7vw,84px);display:flex;flex-wrap:wrap;align-items:center;gap:14px clamp(16px,2.6vw,28px)}.bcnl-essence-step{display:flex;align-items:center;gap:14px clamp(16px,2.6vw,28px)}.bcnl-essence-text{font-family:var(--font-bcnl-display);font-weight:800;letter-spacing:-.005em;font-size:clamp(1rem,2.4vw,1.5rem);color:var(--bcnl-lime)}.bcnl-essence-arrow{font-size:clamp(1rem,2.4vw,1.5rem);color:color-mix(in srgb,var(--bcnl-white) 40%,transparent)}.bcnl-scene02{background:var(--bcnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--bcnl-navy)}.bcnl-personality-lead{max-width:560px}.bcnl-personality-list{margin-top:clamp(40px,6vw,64px);display:flex;flex-direction:column}.bcnl-personality-item{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:clamp(14px,2.2vw,22px) 0;border-top:1px solid var(--bcnl-line)}.bcnl-personality-item:last-child{border-bottom:1px solid var(--bcnl-line)}.bcnl-personality-en{font-family:var(--font-bcnl-display);font-weight:900;letter-spacing:-.01em;font-size:clamp(2rem,7vw,5rem);color:var(--bcnl-navy)}.bcnl-personality-kr{font-family:var(--font-bcnl-body);font-size:.9rem;color:var(--bcnl-ink-faint);white-space:nowrap}.bcnl-scene03{background:var(--bcnl-lime);color:var(--bcnl-navy);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.bcnl-scene03 .bcnl-kr{color:color-mix(in srgb,var(--bcnl-navy) 74%,transparent)}.bcnl-motif-row{position:relative;margin:clamp(56px,8vw,96px) 0;height:clamp(160px,22vw,300px)}.bcnl-motif-mark{position:absolute;top:0;width:min(62vw,520px);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.3s cubic-bezier(.16,.84,.44,1)}.bcnl-motif-mark--a{left:0}.bcnl-motif-mark--b{right:0;opacity:0;transform:translate(-14%) scale(1.045)}.bcnl-motif-mark--b.is-visible{opacity:1;transform:translate(0) scale(1)}.bcnl-principle-row{margin-top:clamp(24px,4vw,40px);display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 6px}.bcnl-principle{font-family:var(--font-bcnl-body);font-weight:600;font-size:.86rem;color:var(--bcnl-ink-soft)}.bcnl-principle-slash{display:inline-block;margin-right:12px;opacity:.4;font-weight:400}.bcnl-scene04{background:var(--bcnl-navy);color:var(--bcnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.bcnl-scene04 .bcnl-big{color:var(--bcnl-white)}.bcnl-scene04 .bcnl-kr{color:color-mix(in srgb,var(--bcnl-white) 74%,transparent)}.bcnl-colorway-stack{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(28px,4vw,44px)}.bcnl-colorway-panel{display:flex;flex-direction:column;gap:14px;padding:clamp(32px,5vw,56px);border-radius:6px;background:var(--bcnl-white)}.bcnl-colorway-panel--dark{background:var(--bcnl-navy);border:1px solid color-mix(in srgb,var(--bcnl-white) 16%,transparent)}.bcnl-colorway-stage{width:100%}.bcnl-colorway-panel--dark .bcnl-logo-label{color:color-mix(in srgb,var(--bcnl-white) 62%,transparent)}.bcnl-logo-body{margin-top:clamp(40px,6vw,64px);padding-top:clamp(24px,4vw,36px);border-top:1px solid color-mix(in srgb,var(--bcnl-white) 16%,transparent);color:color-mix(in srgb,var(--bcnl-white) 58%,transparent)}.bcnl-scene05{background:var(--bcnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--bcnl-navy)}.bcnl-space-row{margin-top:clamp(48px,7vw,84px);display:flex;align-items:center;gap:clamp(20px,4vw,40px)}.bcnl-space-flat{flex:0 0 auto;width:min(34vw,300px);display:flex;flex-direction:column;gap:12px}.bcnl-space-flat-img{width:100%}.bcnl-space-dimensional{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}.bcnl-space-form-img{width:100%}.bcnl-space-arrow{flex:0 0 auto;font-size:clamp(1.4rem,3vw,2.2rem);color:var(--bcnl-ink-faint)}.bcnl-space-caption{font-family:var(--font-bcnl-body);font-weight:700;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--bcnl-ink-faint)}.bcnl-scene06{background:var(--bcnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--bcnl-navy)}.bcnl-color-band{margin:clamp(48px,7vw,84px) 0 0;display:flex;height:clamp(160px,20vw,260px);border-radius:4px;overflow:hidden}.bcnl-color-field{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--bcnl-navy)}.bcnl-color-field--dark{color:var(--bcnl-white)}.bcnl-color-en{font-family:var(--font-bcnl-display);font-weight:800;font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;opacity:.82}.bcnl-color-hex{font-family:var(--font-bcnl-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.62}.bcnl-gray-band{margin:2px 0 0;display:flex;height:clamp(28px,3.6vw,44px)}.bcnl-gray-field{flex:1}.bcnl-gray-caption{display:block;margin-top:12px;font-family:var(--font-bcnl-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bcnl-ink-faint)}.bcnl-color-note{margin-top:clamp(32px,5vw,48px);padding-top:clamp(20px,3vw,32px);border-top:1px solid var(--bcnl-line)}.bcnl-scene07{background:var(--bcnl-white)}.bcnl-scene07-head{background:var(--bcnl-lime);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--bcnl-navy);border-top:1px solid var(--bcnl-line)}.bcnl-scene07-head .bcnl-kr{color:color-mix(in srgb,var(--bcnl-navy) 74%,transparent)}.bcnl-app-stack{display:flex;flex-direction:column;gap:2px;background:var(--bcnl-navy)}.bcnl-app-stage{width:100%}.bcnl-scene07-foot{padding-top:clamp(48px,7vw,72px);border-top:0}.bcnl-rule{padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--bcnl-line)}.bcnl-closing{background:var(--bcnl-navy);color:var(--bcnl-white);margin:0 var(--bleed)}.bcnl-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.bcnl-closing-kr{font-family:var(--font-bcnl-body);font-weight:800;letter-spacing:-.015em;line-height:1.38;color:var(--bcnl-white);font-size:clamp(1.7rem,4.6vw,3rem);text-wrap:balance}.bcnl-closing-kr span{display:block}.bcnl-closing-signoff{margin-top:clamp(28px,4vw,40px)}.bcnl-closing-signoff p{font-family:var(--font-bcnl-display);font-weight:800;font-size:clamp(1rem,2vw,1.3rem);letter-spacing:-.005em;line-height:1.5;color:var(--bcnl-lime)}.bcnl-closing-logo{margin-top:clamp(56px,8vw,96px);width:clamp(240px,32vw,440px)}.bcnl-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--bcnl-white) 18%,transparent);text-align:center}.bcnl-closing-eyebrow{display:block;font-family:var(--font-bcnl-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bcnl-white)}.bcnl-closing-meta{display:block;margin-top:6px;font-family:var(--font-bcnl-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--bcnl-white) 60%,transparent)}@media (max-width:1080px){.bcnl-space-row{flex-direction:column;align-items:stretch}.bcnl-space-arrow{transform:rotate(90deg);align-self:center}.bcnl-space-flat{width:min(50vw,280px);align-self:center}}@media (max-width:860px){.bcnl-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.bcnl-hero-logo{width:clamp(220px,80vw,420px)}.bcnl-essence-row{flex-direction:column;align-items:flex-start;gap:10px}.bcnl-essence-step{gap:10px}.bcnl-personality-en{font-size:clamp(1.8rem,12vw,2.8rem)}.bcnl-personality-item{flex-direction:column;align-items:flex-start;gap:4px}.bcnl-motif-row{height:clamp(120px,40vw,220px)}.bcnl-motif-mark{width:min(78vw,340px)}.bcnl-color-band{flex-wrap:wrap;height:auto}.bcnl-color-field{flex:1 1 50%;min-width:50%;height:clamp(120px,30vw,160px)}.bcnl-gray-band{flex-wrap:wrap;height:auto}.bcnl-gray-field{flex:1 1 25%;min-width:25%;height:clamp(28px,7vw,40px)}.bcnl-closing-logo{width:clamp(200px,60vw,320px)}}@media (prefers-reduced-motion: reduce){.bcnl-clip-inner{transform:none!important;transition:none!important}.bcnl-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.bcnl-motif-mark--b{opacity:1!important;transform:none!important}}.ups{position:relative;background:var(--ups-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--ups-white:#FFFFFF;--ups-blue:#023F97;--ups-green:#4FD977;--ups-ink:var(--ups-blue);--ups-ink-soft:color-mix(in srgb, var(--ups-ink) 68%, var(--ups-white));--ups-ink-faint:color-mix(in srgb, var(--ups-ink) 44%, var(--ups-white));--ups-line:color-mix(in srgb, var(--ups-ink) 14%, transparent);--font-ups-display:var(--font-display);--font-ups-body:var(--font-body);color:var(--ups-ink)}.ups-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.ups-section+.ups-section{border-top:1px solid var(--ups-line)}.ups-tag{display:block;font-family:var(--font-ups-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ups-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.ups-big{font-family:var(--font-ups-body);font-weight:800;letter-spacing:-.015em;line-height:1.28;color:var(--ups-ink);font-size:clamp(1.9rem,5vw,3.6rem);text-wrap:balance;max-width:920px}.ups-big span{display:block}.ups-kr{margin-top:16px;font-family:var(--font-ups-body);font-size:1.02rem;line-height:1.9;color:var(--ups-ink-soft);max-width:600px}.ups-footnote{font-family:var(--font-ups-body);font-size:.86rem;line-height:1.8;color:var(--ups-ink-faint);max-width:640px}.ups-clip{overflow:hidden;display:block}.ups-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.ups-clip.is-visible .ups-clip-inner{transform:translateY(0)}.ups-clip .ups-clip-inner>span{display:block}.ups-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.ups-imgwrap.is-visible{opacity:1;transform:scale(1)}.ups-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.ups-link{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-ups-body);font-weight:700;font-size:.72rem;letter-spacing:.04em;padding:8px 14px;border-radius:999px;border:1px solid currentColor;color:inherit;text-decoration:none;opacity:.86;transition:opacity .25s ease,transform .25s ease}.ups-link:hover{opacity:1;transform:translateY(-1px)}.ups-link span{font-size:.9em}.ups-hero{background:var(--ups-white);color:var(--ups-blue);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.ups-hero-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.ups-hero-eyebrow{font-family:var(--font-ups-display);font-weight:900;font-size:.9rem;letter-spacing:.02em;color:var(--ups-blue)}.ups-hero-link{color:var(--ups-blue)}.ups-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.ups-hero-logo{width:clamp(260px,54vw,760px)}.ups-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.ups-hero-big{font-family:var(--font-ups-body);font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--ups-blue);font-size:clamp(1.7rem,4.4vw,2.8rem);text-wrap:balance}.ups-hero-big span{display:block}.ups-hero-body{margin-top:clamp(18px,2.6vw,26px)}.ups-hero-body p{font-family:var(--font-ups-body);font-size:.94rem;line-height:1.9;color:var(--ups-ink-soft)}.ups-hero-meta{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-ups-body);font-size:.76rem;letter-spacing:.03em;color:var(--ups-ink-faint)}.ups-scene01{background:var(--ups-blue);color:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.ups-scene01 .ups-big{color:var(--ups-white)}.ups-scene01 .ups-kr{color:color-mix(in srgb,var(--ups-white) 76%,transparent)}.ups-name-list{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column}.ups-name-item{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:clamp(14px,2.2vw,22px) 0;border-top:1px solid color-mix(in srgb,var(--ups-white) 22%,transparent)}.ups-name-item:last-child{border-bottom:1px solid color-mix(in srgb,var(--ups-white) 22%,transparent)}.ups-name-en{font-family:var(--font-ups-display);font-weight:900;letter-spacing:-.01em;font-size:clamp(2rem,7vw,4.6rem);color:var(--ups-green)}.ups-name-kr{font-family:var(--font-ups-body);font-size:.9rem;color:color-mix(in srgb,var(--ups-white) 64%,transparent);white-space:nowrap}.ups-scene02{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-attitude-list{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column}.ups-attitude-item{padding:clamp(24px,3.6vw,40px) 0;border-top:1px solid var(--ups-line);display:flex;flex-direction:column;gap:8px}.ups-attitude-item:last-child{border-bottom:1px solid var(--ups-line)}.ups-attitude-en{font-family:var(--font-ups-display);font-weight:900;letter-spacing:-.01em;font-size:clamp(1.8rem,5.6vw,3.4rem);color:var(--ups-blue)}.ups-attitude-kr{font-family:var(--font-ups-body);font-size:.92rem;line-height:1.7;color:var(--ups-ink-soft);max-width:560px}.ups-scene03{background:var(--ups-green);color:var(--ups-blue);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.ups-scene03 .ups-kr{color:color-mix(in srgb,var(--ups-blue) 74%,transparent)}.ups-principle-row{margin-top:clamp(48px,7vw,84px);display:flex;flex-wrap:wrap;align-items:center;gap:8px 6px}.ups-principle-arrow{width:clamp(36px,5vw,56px);height:2px;background:var(--ups-blue);position:relative;margin-right:12px}.ups-principle-arrow:after{content:"";position:absolute;right:0;top:50%;width:10px;height:10px;border-top:2px solid var(--ups-blue);border-right:2px solid var(--ups-blue);transform:translateY(-50%) rotate(45deg)}.ups-principle{font-family:var(--font-ups-body);font-weight:600;font-size:.9rem;color:var(--ups-blue)}.ups-principle-slash{display:inline-block;margin-right:12px;opacity:.4;font-weight:400}.ups-scene04{background:var(--ups-blue);color:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.ups-scene04 .ups-big{color:var(--ups-white)}.ups-scene04 .ups-kr{color:color-mix(in srgb,var(--ups-white) 76%,transparent)}.ups-logo-steps{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(28px,4vw,44px)}.ups-logo-step{display:flex;flex-direction:column;gap:14px;padding:clamp(32px,5vw,56px);border-radius:6px;background:var(--ups-white)}.ups-logo-step-img{width:100%}.ups-logo-step-label{font-family:var(--font-ups-body);font-weight:700;font-size:.7rem;letter-spacing:.08em;color:var(--ups-ink-faint)}.ups-footnote.ups-logo-body,.ups-scene04 .ups-footnote{margin-top:clamp(40px,6vw,64px);padding-top:clamp(24px,4vw,36px);border-top:1px solid color-mix(in srgb,var(--ups-white) 20%,transparent);color:color-mix(in srgb,var(--ups-white) 62%,transparent)}.ups-scene05{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-arrow-stage{margin-top:clamp(56px,8vw,96px);position:relative;height:clamp(180px,24vw,320px)}.ups-arrow-shape{position:absolute;transition:transform 1.1s cubic-bezier(.16,.84,.44,1),opacity 1.1s cubic-bezier(.16,.84,.44,1)}.ups-arrow-shape--up{left:8%;bottom:0;width:3px;height:70%;background:var(--ups-blue)}.ups-arrow-shape--up:after{content:"";position:absolute;top:-2px;left:50%;width:18px;height:18px;border-top:3px solid var(--ups-blue);border-right:3px solid var(--ups-blue);transform:translate(-50%,-50%) rotate(-45deg)}.ups-arrow-shape--side{left:8%;bottom:16%;width:0;height:3px;background:var(--ups-green);animation:ups-grow-side 1.8s cubic-bezier(.16,.84,.44,1) .3s forwards}.ups-arrow-shape--side:after{content:"";position:absolute;top:50%;right:-2px;width:14px;height:14px;border-top:3px solid var(--ups-green);border-right:3px solid var(--ups-green);transform:translate(50%,-50%) rotate(45deg)}@keyframes ups-grow-side{0%{width:0}to{width:min(70vw,560px)}}.ups-arrow-labels{margin-top:clamp(24px,4vw,40px);display:flex;gap:clamp(24px,4vw,40px)}.ups-arrow-label{font-family:var(--font-ups-display);font-weight:800;font-size:.9rem;letter-spacing:.08em;color:var(--ups-ink-faint)}.ups-scene06{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-grid-stage{margin-top:clamp(48px,7vw,84px);width:100%}.ups-scene07{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-color-band{margin:clamp(48px,7vw,84px) 0 0;display:flex;height:clamp(200px,24vw,320px);border-radius:4px;overflow:hidden}.ups-color-field{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--ups-white)}.ups-color-field--dark{color:var(--ups-white)}.ups-color-en{font-family:var(--font-ups-display);font-weight:800;font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;opacity:.86}.ups-color-hex{font-family:var(--font-ups-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.68}.ups-gray-band{margin:2px 0 0;display:flex;height:clamp(28px,3.6vw,44px)}.ups-gray-field{flex:1}.ups-gray-caption{display:block;margin-top:12px;font-family:var(--font-ups-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ups-ink-faint)}.ups-color-note{margin-top:clamp(32px,5vw,48px);padding-top:clamp(20px,3vw,32px);border-top:1px solid var(--ups-line)}.ups-scene08{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-keyvisual-stage{margin-top:clamp(48px,7vw,84px);width:min(100%,680px);margin-left:auto;margin-right:auto;border-radius:6px;overflow:hidden}.ups-scene09{background:var(--ups-white)}.ups-scene09-head{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue);border-top:1px solid var(--ups-line)}.ups-app-stack{display:flex;flex-direction:column;gap:2px;background:var(--ups-blue)}.ups-app-stage{width:100%}.ups-scene10{background:var(--ups-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ups-blue)}.ups-type-rows{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(32px,5vw,52px)}.ups-type-row{padding-top:clamp(20px,3vw,28px);border-top:1px solid var(--ups-line)}.ups-type-name{display:block;font-family:var(--font-ups-body);font-weight:700;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ups-ink-faint)}.ups-type-sample{margin-top:10px;font-weight:800;letter-spacing:-.01em;line-height:1.4;color:var(--ups-blue);font-size:clamp(1.1rem,2.8vw,1.7rem)}.ups-type-sample--en{font-family:"Montserrat",var(--font-ups-body)}.ups-type-sample--kr{font-family:"Pretendard",var(--font-ups-body)}.ups-closing{background:var(--ups-blue);color:var(--ups-white);margin:0 var(--bleed)}.ups-closing-content{padding-left:var(--inset);padding-right:var(--inset);display:flex;flex-direction:column;align-items:center;text-align:center}.ups-closing-en{font-family:var(--font-ups-body);font-weight:800;letter-spacing:-.015em;line-height:1.28;color:var(--ups-white);font-size:clamp(1.9rem,4.8vw,3.2rem);text-wrap:balance}.ups-closing-en span{display:block}.ups-closing-signoff{margin-top:clamp(28px,4vw,40px)}.ups-closing-signoff p{font-family:var(--font-ups-display);font-weight:800;font-size:clamp(1rem,2vw,1.3rem);letter-spacing:-.005em;line-height:1.5;color:var(--ups-green)}.ups-closing-logo{margin-top:clamp(56px,8vw,96px);width:clamp(240px,32vw,440px)}.ups-closing-link{margin-top:clamp(28px,4vw,40px);color:var(--ups-white)}.ups-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--ups-white) 18%,transparent);text-align:center}.ups-closing-eyebrow{display:block;font-family:var(--font-ups-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ups-white)}.ups-closing-meta{display:block;margin-top:6px;font-family:var(--font-ups-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--ups-white) 60%,transparent)}@media (max-width:1080px){.ups-arrow-shape--side{animation:none;width:min(70vw,560px)}}@media (max-width:860px){.ups-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.ups-hero-logo{width:clamp(220px,80vw,420px)}.ups-name-en{font-size:clamp(1.7rem,11vw,2.6rem)}.ups-name-item{flex-direction:column;align-items:flex-start;gap:4px}.ups-attitude-en{font-size:clamp(1.5rem,10vw,2.2rem)}.ups-arrow-stage{height:clamp(140px,42vw,220px)}.ups-arrow-shape--side{width:min(60vw,320px)!important}.ups-color-band{flex-wrap:wrap;height:auto}.ups-color-field{flex:1 1 50%;min-width:50%;height:clamp(140px,34vw,180px)}.ups-gray-band{flex-wrap:wrap;height:auto}.ups-gray-field{flex:1 1 20%;min-width:20%;height:clamp(28px,7vw,40px)}.ups-closing-logo{width:clamp(200px,60vw,320px)}}@media (prefers-reduced-motion: reduce){.ups-clip-inner{transform:none!important;transition:none!important}.ups-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.ups-arrow-shape--side{animation:none!important;width:min(70vw,560px)!important}}.ilc{position:relative;background:var(--ilc-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--ilc-white:#FFFFFF;--ilc-blue:#0070BD;--ilc-teal:#00A7AC;--ilc-green:#8CB835;--ilc-orange:#F29600;--ilc-sand:#E6C578;--ilc-gray:#615F5F;--ilc-ink:var(--ilc-blue);--ilc-ink-soft:color-mix(in srgb, var(--ilc-ink) 68%, var(--ilc-white));--ilc-ink-faint:color-mix(in srgb, var(--ilc-ink) 44%, var(--ilc-white));--ilc-line:color-mix(in srgb, var(--ilc-ink) 14%, transparent);--font-ilc-display:var(--font-display);--font-ilc-body:var(--font-body);color:var(--ilc-ink)}.ilc-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.ilc-section+.ilc-section{border-top:1px solid var(--ilc-line)}.ilc-tag{display:block;font-family:var(--font-ilc-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ilc-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.ilc-big{font-family:var(--font-ilc-body);font-weight:800;letter-spacing:-.015em;line-height:1.28;color:var(--ilc-ink);font-size:clamp(1.9rem,5vw,3.6rem);text-wrap:balance;max-width:920px}.ilc-big span{display:block}.ilc-kr{margin-top:16px;font-family:var(--font-ilc-body);font-size:1.02rem;line-height:1.9;color:var(--ilc-ink-soft);max-width:600px}.ilc-body{margin-top:clamp(28px,4vw,40px);font-family:var(--font-ilc-body);font-size:.96rem;line-height:1.9;color:var(--ilc-ink-soft);max-width:640px}.ilc-footnote{font-family:var(--font-ilc-body);font-size:.86rem;line-height:1.8;color:var(--ilc-ink-faint);max-width:640px}.ilc-clip{overflow:hidden;display:block}.ilc-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.ilc-clip.is-visible .ilc-clip-inner{transform:translateY(0)}.ilc-clip .ilc-clip-inner>span{display:block}.ilc-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.ilc-imgwrap.is-visible{opacity:1;transform:scale(1)}.ilc-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.ilc-hero{background:var(--ilc-white);color:var(--ilc-blue);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.ilc-hero-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.ilc-hero-eyebrow{font-family:var(--font-ilc-display);font-weight:900;font-size:.9rem;letter-spacing:.02em;color:var(--ilc-blue)}.ilc-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.ilc-hero-logo{width:clamp(260px,54vw,640px)}.ilc-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.ilc-hero-big{font-family:var(--font-ilc-body);font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--ilc-blue);font-size:clamp(1.7rem,4.4vw,2.8rem);text-wrap:balance}.ilc-hero-big span{display:block}.ilc-hero-body{margin-top:clamp(18px,2.6vw,26px)}.ilc-hero-body p{font-family:var(--font-ilc-body);font-size:.94rem;line-height:1.9;color:var(--ilc-ink-soft)}.ilc-hero-meta{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-ilc-body);font-size:.76rem;letter-spacing:.03em;color:var(--ilc-ink-faint)}.ilc-scene01{background:var(--ilc-blue);color:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.ilc-scene01 .ilc-big{color:var(--ilc-white)}.ilc-scene01 .ilc-kr{color:color-mix(in srgb,var(--ilc-white) 82%,transparent);font-weight:600;font-size:1.1rem}.ilc-scene01 .ilc-body{color:color-mix(in srgb,var(--ilc-white) 70%,transparent)}.ilc-hashtags{margin-top:clamp(32px,5vw,48px);display:flex;flex-wrap:wrap;gap:8px}.ilc-hashtag{font-family:var(--font-ilc-body);font-weight:600;font-size:.78rem;letter-spacing:.01em;padding:7px 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ilc-white) 34%,transparent);color:color-mix(in srgb,var(--ilc-white) 88%,transparent)}.ilc-scene02{background:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ilc-blue)}.ilc-idea-en{font-family:var(--font-ilc-display);font-weight:900;letter-spacing:-.01em;font-size:clamp(1.7rem,5vw,3rem);color:var(--ilc-teal)}.ilc-idea-kr{font-family:var(--font-ilc-body);font-size:.88rem;color:var(--ilc-ink-faint)}.ilc-idea-body{margin-top:6px;font-family:var(--font-ilc-body);font-size:.9rem;line-height:1.8;color:var(--ilc-ink-soft);max-width:600px}.ilc-idea-wrap{position:relative;display:grid;margin:clamp(48px,7vw,84px) var(--bleed) 0}.ilc-idea-sticky{grid-column:1;grid-row:1;position:sticky;top:0;height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));display:flex;align-items:center;overflow:hidden;padding:0 var(--inset)}.ilc-idea-stage{position:relative;flex:1;height:clamp(220px,32vh,360px)}.ilc-idea-slide{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(48px);pointer-events:none;transition:opacity .6s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1)}.ilc-idea-slide.is-active{opacity:1;transform:translateY(0);pointer-events:auto}.ilc-idea-slide.is-prev{transform:translateY(-48px)}.ilc-idea-rail{display:flex;flex-direction:column;gap:14px;margin-left:clamp(24px,4vw,56px);font-family:var(--font-ilc-display);font-weight:800;font-size:.78rem;font-variant-numeric:tabular-nums;color:var(--ilc-ink-faint)}.ilc-idea-rail span{transition:color .3s ease}.ilc-idea-rail span.is-active{color:var(--ilc-teal)}.ilc-idea-track{grid-column:1;grid-row:1;display:flex;flex-direction:column}.ilc-idea-trigger{height:82vh}.ilc-scene03{background:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);border-top:1px solid var(--ilc-line)}.ilc-scene03 .ilc-footnote{margin-top:clamp(28px,4vw,40px)}.ilc-logo-steps{margin-top:clamp(48px,7vw,84px);display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ilc-line);border:1px solid var(--ilc-line)}.ilc-logo-step{display:flex;flex-direction:column;gap:clamp(16px,2.2vw,22px);padding:clamp(28px,4vw,44px);background:var(--ilc-white)}.ilc-logo-step-img{width:100%;aspect-ratio:4/3}.ilc-logo-step-label{order:-1;font-family:var(--font-ilc-body);font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ilc-ink-faint)}.ilc-scene04{background:var(--ilc-white)}.ilc-scene04-head{background:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ilc-blue)}.ilc-scene04-head .ilc-footnote{margin-top:clamp(28px,4vw,40px)}.ilc-keyvisual-stack{display:flex;flex-direction:column;gap:2px;background:var(--ilc-blue)}.ilc-keyvisual-stage{width:100%}.ilc-scene05{background:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ilc-blue);border-top:1px solid var(--ilc-line)}.ilc-color-band{margin:clamp(48px,7vw,84px) 0 0;display:flex;height:clamp(200px,24vw,320px);border-radius:4px;overflow:hidden}.ilc-color-field{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--ilc-white)}.ilc-color-en{font-family:var(--font-ilc-display);font-weight:800;font-size:.6rem;letter-spacing:.05em;text-transform:uppercase;opacity:.9}.ilc-color-hex{font-family:var(--font-ilc-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.72}.ilc-gray-band{margin:2px 0 0;display:flex;height:clamp(28px,3.6vw,44px)}.ilc-gray-field{flex:1}.ilc-gray-caption{display:block;margin-top:12px;font-family:var(--font-ilc-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ilc-ink-faint)}.ilc-color-note{margin-top:clamp(32px,5vw,48px);padding-top:clamp(20px,3vw,32px);border-top:1px solid var(--ilc-line)}.ilc-scene06{background:var(--ilc-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ilc-blue)}.ilc-type-rows{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(32px,5vw,52px)}.ilc-type-row{padding-top:clamp(20px,3vw,28px);border-top:1px solid var(--ilc-line)}.ilc-type-name{display:block;font-family:var(--font-ilc-body);font-weight:700;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ilc-ink-faint)}.ilc-type-sample{margin-top:10px;font-weight:800;letter-spacing:-.01em;line-height:1.4;color:var(--ilc-blue);font-size:clamp(1.05rem,2.6vw,1.6rem)}.ilc-type-sample--en{font-family:var(--font-ilc-display)}.ilc-type-sample--kr{font-family:"Pretendard",var(--font-ilc-body)}.ilc-scene07{background:color-mix(in srgb,var(--ilc-sand) 24%,var(--ilc-white));margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--ilc-gray)}.ilc-scene07 .ilc-big{color:var(--ilc-gray)}.ilc-scene07 .ilc-kr{color:color-mix(in srgb,var(--ilc-gray) 78%,transparent)}.ilc-app-tags{margin-top:clamp(32px,5vw,48px);display:flex;flex-wrap:wrap;gap:10px}.ilc-app-tag{font-family:var(--font-ilc-body);font-weight:700;font-size:.8rem;letter-spacing:.02em;padding:9px 16px;border-radius:6px;background:var(--ilc-white);color:var(--ilc-gray);border:1px solid color-mix(in srgb,var(--ilc-gray) 20%,transparent)}.ilc-scene07 .ilc-footnote{margin-top:clamp(28px,4vw,40px);color:color-mix(in srgb,var(--ilc-gray) 76%,transparent)}.ilc-closing{background:var(--ilc-blue);color:var(--ilc-white);margin:0 var(--bleed)}.ilc-closing-content{padding-left:var(--inset);padding-right:var(--inset);padding-top:clamp(96px,12vw,160px);display:flex;flex-direction:column;align-items:center;text-align:center}.ilc-closing-en{font-family:var(--font-ilc-body);font-weight:800;letter-spacing:-.015em;line-height:1.28;color:var(--ilc-white);font-size:clamp(1.9rem,4.8vw,3.2rem);text-wrap:balance}.ilc-closing-en span{display:block}.ilc-closing-signoff{margin-top:clamp(28px,4vw,40px)}.ilc-closing-signoff p{font-family:var(--font-ilc-display);font-weight:800;font-size:clamp(1rem,2vw,1.3rem);letter-spacing:-.005em;line-height:1.5;color:var(--ilc-sand)}.ilc-closing-tagline{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-ilc-display);font-weight:900;font-style:italic;font-size:1.3rem;letter-spacing:-.01em;color:color-mix(in srgb,var(--ilc-white) 70%,transparent)}.ilc-closing-logo{margin-top:clamp(56px,8vw,96px);width:clamp(240px,32vw,420px);filter:brightness(0) invert(1)}.ilc-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--ilc-white) 18%,transparent);text-align:center;margin-top:clamp(56px,8vw,96px)}.ilc-closing-eyebrow{display:block;font-family:var(--font-ilc-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ilc-white)}.ilc-closing-meta{display:block;margin-top:6px;font-family:var(--font-ilc-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--ilc-white) 60%,transparent)}@media (max-width:860px){.ilc-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.ilc-hero-logo{width:clamp(220px,80vw,380px)}.ilc-idea-en{font-size:clamp(1.4rem,9vw,2.2rem)}.ilc-idea-trigger{height:58vh}.ilc-idea-rail{margin-left:clamp(14px,3vw,24px)}.ilc-logo-steps{grid-template-columns:1fr}.ilc-logo-step-img{aspect-ratio:16/10}.ilc-color-band{flex-wrap:wrap;height:auto}.ilc-color-field{flex:1 1 50%;min-width:50%;height:clamp(140px,34vw,180px)}.ilc-gray-band{flex-wrap:wrap;height:auto}.ilc-gray-field{flex:1 1 20%;min-width:20%;height:clamp(28px,7vw,40px)}.ilc-closing-logo{width:clamp(200px,60vw,300px)}}@media (prefers-reduced-motion: reduce){.ilc-clip-inner{transform:none!important;transition:none!important}.ilc-imgwrap{opacity:1!important;transform:none!important;transition:none!important}.ilc-idea-slide{transition:opacity .3s ease!important;transform:none!important}.ilc-idea-slide.is-prev{opacity:0}}.cnl{position:relative;background:var(--cnl-white);--bleed:clamp(-64px, -5vw, -20px);--inset:clamp(20px, 5vw, 64px);--cnl-white:#FFFFFF;--cnl-cream:#F7F4EC;--cnl-navy:#11518D;--cnl-green:#3FA973;--cnl-orange:#E9B05D;--cnl-red:#D25054;--cnl-pink:#E1958E;--cnl-ink:var(--cnl-navy);--cnl-ink-soft:color-mix(in srgb, var(--cnl-ink) 68%, var(--cnl-white));--cnl-ink-faint:color-mix(in srgb, var(--cnl-ink) 44%, var(--cnl-white));--cnl-line:color-mix(in srgb, var(--cnl-ink) 14%, transparent);--font-cnl-display:var(--font-display);--font-cnl-body:var(--font-body);color:var(--cnl-ink)}.cnl-section{padding-top:clamp(96px,12vw,160px);padding-bottom:clamp(96px,12vw,160px)}.cnl-section+.cnl-section{border-top:1px solid var(--cnl-line)}.cnl-tag{display:block;font-family:var(--font-cnl-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cnl-ink-soft);margin-bottom:clamp(20px,3vw,32px)}.cnl-big{font-family:var(--font-cnl-body);font-weight:800;letter-spacing:-.015em;line-height:1.22;font-size:clamp(1.8rem,5.4vw,3.6rem)}.cnl-big span{display:block}.cnl-kr{margin-top:16px;font-family:var(--font-cnl-body);font-size:1.02rem;line-height:1.9;color:var(--cnl-ink-soft);max-width:600px}.cnl-body{margin-top:clamp(28px,4vw,40px);font-family:var(--font-cnl-body);font-size:.96rem;line-height:1.9;color:var(--cnl-ink-soft);max-width:640px}.cnl-footnote{font-family:var(--font-cnl-body);font-size:.86rem;line-height:1.8;color:var(--cnl-ink-faint);max-width:640px}.cnl-clip{overflow:hidden;display:block}.cnl-clip-inner{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.16,.84,.44,1)}.cnl-clip.is-visible .cnl-clip-inner{transform:translateY(0)}.cnl-clip .cnl-clip-inner>span{display:block}.cnl-imgwrap{overflow:hidden;opacity:0;transform:scale(1.045);transition:opacity .9s cubic-bezier(.16,.84,.44,1),transform 1.1s cubic-bezier(.16,.84,.44,1);background:transparent}.cnl-imgwrap.is-visible{opacity:1;transform:scale(1)}.cnl-imgwrap img{width:100%;height:100%;object-fit:contain;display:block}.cnl-imgwrap svg{width:100%;height:100%;display:block}.cnl-hero{background:var(--cnl-cream);color:var(--cnl-navy);margin:0 var(--bleed);padding:0 var(--inset);min-height:88vh;display:flex;flex-direction:column}.cnl-hero-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding-top:clamp(28px,4vw,44px)}.cnl-hero-eyebrow{font-family:var(--font-cnl-display);font-weight:900;font-size:.9rem;letter-spacing:.02em;color:var(--cnl-navy)}.cnl-hero-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(56px,14vh,160px) 0}.cnl-hero-logo{width:clamp(260px,54vw,640px)}.cnl-hero-foot{padding-bottom:clamp(56px,9vh,120px);text-align:center;display:flex;flex-direction:column;align-items:center}.cnl-hero-big{font-family:var(--font-cnl-display);font-weight:900;letter-spacing:-.02em;line-height:1.18;font-size:clamp(1.7rem,4.6vw,3rem);color:var(--cnl-navy)}.cnl-hero-big span{display:block}.cnl-hero-body{margin-top:clamp(18px,2.6vw,26px)}.cnl-hero-body p{font-family:var(--font-cnl-body);font-size:.94rem;line-height:1.9;color:var(--cnl-ink-soft)}.cnl-hero-meta{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-cnl-body);font-size:.76rem;letter-spacing:.03em;color:var(--cnl-ink-faint)}.cnl-scene01{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-scene02{background:var(--cnl-navy);color:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.cnl-scene02 .cnl-big{color:var(--cnl-white)}.cnl-scene02 .cnl-kr{color:color-mix(in srgb,var(--cnl-white) 82%,transparent);font-weight:600;font-size:1.1rem}.cnl-idea-list{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column}.cnl-idea-item{padding:clamp(28px,4vw,44px) 0;border-top:1px solid color-mix(in srgb,var(--cnl-white) 20%,transparent);display:flex;flex-direction:column;gap:8px}.cnl-idea-item:last-child{border-bottom:1px solid color-mix(in srgb,var(--cnl-white) 20%,transparent)}.cnl-idea-en{font-family:var(--font-cnl-display);font-weight:900;letter-spacing:-.01em;font-size:clamp(1.7rem,5vw,3rem);color:var(--cnl-orange)}.cnl-idea-kr{font-family:var(--font-cnl-body);font-size:.88rem;color:color-mix(in srgb,var(--cnl-white) 60%,transparent)}.cnl-idea-body{margin-top:6px;font-family:var(--font-cnl-body);font-size:.9rem;line-height:1.8;color:color-mix(in srgb,var(--cnl-white) 78%,transparent);max-width:600px}.cnl-scene03{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-venn{margin-top:clamp(40px,6vw,64px);display:flex;flex-wrap:wrap;align-items:center;gap:clamp(10px,2vw,18px)}.cnl-venn-item{font-family:var(--font-cnl-display);font-weight:900;font-size:clamp(1.3rem,3.6vw,2.1rem);letter-spacing:-.01em;color:var(--cnl-navy)}.cnl-venn-op{margin-left:clamp(10px,2vw,18px);font-family:var(--font-cnl-display);font-weight:700;color:var(--cnl-orange)}.cnl-scene04{background:var(--cnl-cream);color:var(--cnl-navy);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}.cnl-logo-steps{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(28px,4vw,44px)}.cnl-logo-step{display:flex;flex-direction:column;gap:14px;padding:clamp(32px,5vw,56px);border-radius:6px;background:var(--cnl-white)}.cnl-logo-step-img{width:100%}.cnl-logo-step-label{font-family:var(--font-cnl-body);font-weight:700;font-size:.7rem;letter-spacing:.08em;color:var(--cnl-ink-faint)}.cnl-scene05{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-shapes-img{margin-top:clamp(48px,7vw,84px);width:100%}.cnl-shapes-rows{margin-top:16px;display:flex;justify-content:space-between;max-width:100%}.cnl-shapes-row-label{font-family:var(--font-cnl-body);font-weight:600;font-size:.74rem;letter-spacing:.04em;color:var(--cnl-ink-faint)}.cnl-scene06{background:var(--cnl-white)}.cnl-scene06-head{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-scene06-head .cnl-footnote{margin-top:clamp(28px,4vw,40px)}.cnl-keyvisual-mainwrap{width:min(100%,620px);margin:clamp(32px,5vw,56px) auto 0;display:flex;flex-direction:column;align-items:center;gap:14px}.cnl-keyvisual-main{width:100%;margin:0}.cnl-keyvisual-caption{font-family:var(--font-cnl-body);font-weight:600;font-size:.8rem;letter-spacing:.01em;color:var(--cnl-ink-faint);text-align:center}.cnl-keyvisual-extra{margin-top:2px;display:flex;gap:2px;background:var(--cnl-cream)}.cnl-keyvisual-extra-item{flex:1}.cnl-scene07{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy);border-top:1px solid var(--cnl-line)}.cnl-color-band{margin:clamp(48px,7vw,84px) 0 0;display:flex;height:clamp(200px,24vw,320px);border-radius:4px;overflow:hidden}.cnl-color-field{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:0 clamp(10px,1.4vw,18px) clamp(14px,2vw,20px);color:var(--cnl-navy)}.cnl-color-field--dark{color:var(--cnl-white)}.cnl-color-en{font-family:var(--font-cnl-display);font-weight:800;font-size:.6rem;letter-spacing:.05em;text-transform:uppercase;opacity:.9}.cnl-color-hex{font-family:var(--font-cnl-body);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:.72}.cnl-color-flag{position:absolute;top:10px;right:12px;font-size:.8rem;opacity:.75;cursor:help}.cnl-gray-band{margin:2px 0 0;display:flex;height:clamp(28px,3.6vw,44px)}.cnl-gray-field{flex:1}.cnl-gray-caption{display:block;margin-top:12px;font-family:var(--font-cnl-body);font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--cnl-ink-faint)}.cnl-color-note{margin-top:clamp(32px,5vw,48px);padding-top:clamp(20px,3vw,32px);border-top:1px solid var(--cnl-line)}.cnl-scene08{background:var(--cnl-white);margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-type-rows{margin-top:clamp(48px,7vw,84px);display:flex;flex-direction:column;gap:clamp(32px,5vw,52px)}.cnl-type-row{padding-top:clamp(20px,3vw,28px);border-top:1px solid var(--cnl-line)}.cnl-type-name{display:block;font-family:var(--font-cnl-body);font-weight:700;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cnl-ink-faint)}.cnl-type-sample{margin-top:10px;font-weight:800;letter-spacing:-.01em;line-height:1.4;color:var(--cnl-navy);font-size:clamp(1.05rem,2.6vw,1.6rem)}.cnl-type-sample--en{font-family:var(--font-cnl-display)}.cnl-type-sample--kr{font-family:"Pretendard",var(--font-cnl-body)}.cnl-scene09{background:color-mix(in srgb,var(--cnl-cream) 60%,var(--cnl-white))}.cnl-scene09-head{margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);color:var(--cnl-navy)}.cnl-app-photo{margin-top:clamp(32px,5vw,56px);width:100%}.cnl-scene09-foot{margin:0 var(--bleed);padding-left:var(--inset);padding-right:var(--inset);padding-top:clamp(40px,6vw,64px)}.cnl-app-tags{display:flex;flex-wrap:wrap;gap:10px}.cnl-app-tag{display:inline-block;padding:8px 16px;border-radius:999px;border:1px solid var(--cnl-line);font-family:var(--font-cnl-body);font-size:.78rem;letter-spacing:.02em;color:var(--cnl-ink-soft)}.cnl-scene09-foot .cnl-footnote{margin-top:clamp(24px,3.6vw,36px)}.cnl-closing{background:var(--cnl-navy);color:var(--cnl-white);margin:0 var(--bleed)}.cnl-closing-content{padding-left:var(--inset);padding-right:var(--inset);padding-top:clamp(96px,12vw,160px);display:flex;flex-direction:column;align-items:center;text-align:center}.cnl-closing-en{font-family:var(--font-cnl-display);font-weight:900;letter-spacing:-.02em;line-height:1.1;font-size:clamp(2.2rem,7vw,4.6rem);color:var(--cnl-white)}.cnl-closing-en span{display:block}.cnl-closing-signoff{margin-top:clamp(28px,4vw,40px)}.cnl-closing-signoff p{font-family:var(--font-cnl-display);font-weight:800;font-size:clamp(1rem,2vw,1.3rem);letter-spacing:-.005em;line-height:1.5;color:var(--cnl-orange)}.cnl-closing-tagline{display:block;margin-top:clamp(20px,3vw,28px);font-family:var(--font-cnl-display);font-weight:900;font-style:italic;font-size:1.1rem;letter-spacing:-.01em;color:color-mix(in srgb,var(--cnl-white) 70%,transparent)}.cnl-closing-logo{margin-top:clamp(56px,8vw,96px);width:clamp(240px,32vw,420px);filter:brightness(0) invert(1)}.cnl-closing-foot{padding:clamp(32px,5vw,52px) var(--inset) clamp(96px,14vw,160px);border-top:1px solid color-mix(in srgb,var(--cnl-white) 18%,transparent);text-align:center;margin-top:clamp(56px,8vw,96px)}.cnl-closing-eyebrow{display:block;font-family:var(--font-cnl-display);font-weight:900;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--cnl-white)}.cnl-closing-meta{display:block;margin-top:6px;font-family:var(--font-cnl-body);font-size:.8rem;letter-spacing:.03em;color:color-mix(in srgb,var(--cnl-white) 60%,transparent)}@media (max-width:860px){.cnl-hero-big{font-size:clamp(1.3rem,6vw,1.8rem)}.cnl-hero-logo{width:clamp(220px,80vw,380px)}.cnl-idea-en{font-size:clamp(1.4rem,9vw,2.2rem)}.cnl-venn-item{font-size:clamp(1.1rem,6vw,1.5rem)}.cnl-color-band{flex-wrap:wrap;height:auto}.cnl-color-field{flex:1 1 50%;min-width:50%;height:clamp(140px,34vw,180px)}.cnl-gray-band{flex-wrap:wrap;height:auto}.cnl-gray-field{flex:1 1 20%;min-width:20%;height:clamp(28px,7vw,40px)}.cnl-keyvisual-extra{flex-direction:column}.cnl-closing-logo{width:clamp(200px,60vw,300px)}.cnl-closing-en{font-size:clamp(1.8rem,10vw,3rem)}}@media (prefers-reduced-motion: reduce){.cnl-clip-inner{transform:none!important;transition:none!important}.cnl-imgwrap{opacity:1!important;transform:none!important;transition:none!important}}/* global-readable-line-breaks */
h1,h2,h3,[class*="-big"],[class*="big-"]{text-wrap:balance;word-break:normal;overflow-wrap:normal;hyphens:none}
p,li,[class*="-body"],[class*="body-"]{text-wrap:pretty;word-break:keep-all;overflow-wrap:break-word}
.kr-soft,[class$="-kr"],[class*="-kr "]{word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty}
@media(max-width:640px){h1,h2,h3,[class*="-big"],[class*="big-"]{text-wrap:balance;overflow-wrap:break-word}}

.tkc-scene01-motif--keeper{right:-8%;width:min(50vw,590px);opacity:1;animation:tkc-keeper-float 7s ease-in-out infinite;filter:none;background:transparent}
.tkc-direction-visual,.tkc-direction-energy,.tkc-direction-chevron{background:transparent}
.tkc-direction-visual--contrast .tkc-direction-half{animation:tkc-contrast-breathe 4.8s ease-in-out infinite}
.tkc-direction-visual--contrast .tkc-direction-half--light{animation-delay:-2.4s}
.tkc-direction-energy{width:78%;height:78%;object-fit:contain;animation:tkc-energy-spin 8s linear infinite,tkc-energy-pulse 2.2s ease-in-out infinite;filter:none}
.tkc-direction-strip{background:var(--tk-black-1)}
.tkc-symbol-gif-wrap{width:min(92vw,960px);margin:clamp(24px,4vw,48px) auto 0;aspect-ratio:16/9;overflow:hidden;background:#272828}
.tkc-symbol-gif{display:block;width:100%;height:100%;object-fit:cover}
.tkc-logo-sequence{opacity:0;transform:translateY(56px);transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}
.tkc-logo-sequence.is-visible{opacity:1;transform:none}
.tkc-logo-sequence--en{margin-top:clamp(64px,10vw,128px)}
.tkc-logo-sequence--kr{margin-top:clamp(96px,14vw,180px)}
.tkc-logo-sequence--symbol{margin:clamp(96px,14vw,180px) auto clamp(56px,8vw,96px);display:flex;justify-content:center}
.tkc-logo-sequence .tkc-logotype-en,.tkc-logo-sequence .tkc-logotype-kr{margin-top:0}
.tkc-logotype-symbol{display:block;width:min(48vw,390px);height:auto}
.tkc-motif-cluster--keeper{grid-template-columns:minmax(0,2fr) minmax(0,1fr);max-width:980px;align-items:center}
.tkc-motif-shield-group{aspect-ratio:816/1056;width:100%;max-height:440px}
.tkc-motif-circle{width:100%}
.tkc-pattern-bg--keeper{background-color:var(--tk-black-1);background-blend-mode:normal}
.tkc-web-live{overflow:hidden;background:#0f1010;color:#fff;border-radius:2px;box-shadow:0 28px 70px rgba(0,0,0,.18)}
.tkc-web-nav{height:84px;display:flex;align-items:center;gap:28px;padding:0 clamp(22px,4vw,54px);border-bottom:1px solid rgba(255,255,255,.18)}
.tkc-web-nav strong{font-family:var(--font-display);font-size:clamp(1.25rem,2.5vw,2rem);letter-spacing:-.04em}
.tkc-web-nav nav{display:flex;gap:24px;margin-left:auto;font-family:var(--font-body);font-size:.82rem;color:rgba(255,255,255,.72)}
.tkc-web-nav button,.tkc-web-message button{border:0;background:var(--tk-orange);color:#fff;font:700 .78rem var(--font-body);padding:12px 18px;cursor:pointer}
.tkc-web-hero{position:relative;min-height:clamp(430px,58vw,680px);overflow:hidden;display:flex;align-items:flex-end}
.tkc-web-photo{position:absolute;inset:-18%;width:136%;height:136%;object-fit:cover;object-position:center 43%;filter:saturate(.78) contrast(1.1)}
.tkc-web-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,5,.94) 0%,rgba(5,5,5,.62) 44%,rgba(5,5,5,.12) 78%),linear-gradient(0deg,rgba(5,5,5,.7),transparent 55%)}
.tkc-web-message{position:relative;z-index:1;padding:clamp(38px,7vw,88px) clamp(24px,6vw,74px);max-width:720px}
.tkc-web-message>span{font:800 .7rem var(--font-body);letter-spacing:.18em;color:var(--tk-orange)}
.tkc-web-message h3{margin:14px 0 20px;font-family:var(--font-display);font-size:clamp(3rem,7.4vw,7rem);line-height:.86;letter-spacing:-.065em}
.tkc-web-message p{max-width:520px;margin:0 0 28px;color:rgba(255,255,255,.78);font:400 clamp(.88rem,1.4vw,1.05rem)/1.65 var(--font-body)}
.tkc-web-cards{display:grid;grid-template-columns:repeat(3,1fr);background:#f4f1ec;color:#181919}
.tkc-web-cards article{min-height:190px;padding:32px clamp(22px,3.2vw,42px);display:flex;flex-direction:column;border-right:1px solid #d7d2ca}
.tkc-web-cards article:last-child{border-right:0}.tkc-web-cards b{color:var(--tk-orange);font:800 .72rem var(--font-body)}
.tkc-web-cards strong{margin-top:auto;font:900 clamp(1.1rem,2vw,1.65rem) var(--font-display)}.tkc-web-cards span{margin-top:8px;color:#6f6c67;font:400 .8rem/1.5 var(--font-body)}
.tkc-closing-logo{display:block;width:min(82vw,1120px);height:auto;margin:clamp(64px,10vw,120px) auto 0}
.tkc-visual-break{padding:clamp(48px,7vw,92px) var(--inset);background:#fff}.tkc-visual-break .tkc-bleed-img{width:100%;margin:0}.tkc-visual-break--pair{background:var(--surface-grey)}
@keyframes tkc-keeper-float{0%,100%{transform:translateY(-50%) rotate(-2deg)}50%{transform:translateY(-53%) rotate(3deg)}}
@keyframes tkc-energy-spin{to{transform:rotate(360deg)}}
@keyframes tkc-energy-pulse{0%,100%{scale:.92}50%{scale:1.04}}
@keyframes tkc-contrast-breathe{0%,100%{transform:scaleX(1)}50%{transform:scaleX(1.08)}}
@media(max-width:700px){.tkc-scene01-motif--keeper{right:-28%;width:80vw}.tkc-logo-sequence--en,.tkc-logo-sequence--kr,.tkc-logo-sequence--symbol{margin-top:72px}.tkc-logotype-symbol{width:min(72vw,320px)}.tkc-motif-cluster--keeper{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}.tkc-web-nav nav{display:none}.tkc-web-hero{min-height:520px}.tkc-web-photo{inset:-8%;width:116%;height:116%}.tkc-web-cards{grid-template-columns:1fr}.tkc-web-cards article{min-height:145px;border-right:0;border-bottom:1px solid #d7d2ca}}
@media(prefers-reduced-motion:reduce){.tkc-scene01-motif--keeper,.tkc-direction-energy,.tkc-direction-visual--contrast .tkc-direction-half{animation:none}.tkc-logo-sequence{transition:none}}

.tkc-visual-break--full{padding:0!important;width:100%;max-width:none}.tkc-visual-break--full .tkc-bleed-img{width:100%;max-width:none;margin:0;border-radius:0}.tkc-visual-break--full .tkc-bleed-img img{width:100%;height:100%;object-fit:cover}

.tkc-direction-visual--active{background:#272828!important;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(255,71,0,.18)}
.tkc-direction-energy{width:72%;height:72%;object-fit:contain;background:transparent!important}
.tkc-direction-visual--continuous{background:#ff4700!important;display:flex;align-items:center;overflow:hidden}
.tkc-circle-stream{display:flex;align-items:center;gap:clamp(18px,3vw,38px);width:max-content;padding:0 clamp(18px,3vw,38px);animation:tkc-circle-flow 10s linear infinite}
.tkc-stream-circle{display:block;flex:0 0 auto;width:clamp(74px,10vw,150px);aspect-ratio:1;border-radius:50%;background:#272828}
.tkc-stream-circle:nth-child(even){background:#fff}
.tkc-scene01-morph{position:absolute;top:50%;right:2%;width:min(48vw,620px);aspect-ratio:1;transform:translateY(-50%);background:transparent!important;view-timeline-name:--keeper-morph;view-timeline-axis:block}
.tkc-scene01-static{position:absolute;top:50%;right:2%;width:min(48vw,650px);aspect-ratio:567/518;transform:translateY(-50%);background:transparent!important}.tkc-scene01-static img{display:block;width:100%;height:100%;object-fit:contain;background:transparent!important}
.tkc-morph-layer{position:absolute;inset:0;display:grid;place-items:center;background:transparent!important;opacity:0}
.tkc-morph-layer img{position:absolute;width:72%;height:72%;object-fit:contain;background:transparent!important}
.tkc-morph-circle{position:absolute;width:42%;aspect-ratio:1;border-radius:50%;background:#ff4700}
.tkc-morph-layer--one{opacity:1;animation:tkc-morph-one linear both;animation-timeline:--keeper-morph;animation-range:entry 0% exit 100%}
.tkc-morph-layer--two{animation:tkc-morph-two linear both;animation-timeline:--keeper-morph;animation-range:entry 0% exit 100%}.tkc-morph-layer--two img{filter:brightness(0) invert(1);transform:rotate(120deg)}.tkc-morph-layer--two .tkc-morph-circle{width:34%;transform:translate(42%,-25%)}
.tkc-morph-layer--three{animation:tkc-morph-three linear both;animation-timeline:--keeper-morph;animation-range:entry 0% exit 100%}.tkc-morph-layer--three img{transform:rotate(240deg) scale(.88)}.tkc-morph-circle--outline{width:52%;background:transparent;border:clamp(14px,2vw,28px) solid #ff4700}
.tkc-logo-story{height:300vh;margin-top:clamp(40px,6vw,72px);view-timeline-name:--logo-story;view-timeline-axis:block}
.tkc-logo-story-sticky{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden;background:#fff}
.tkc-logo-story-item{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(28px,6vw,88px);opacity:0;background:#fff}
.tkc-logo-story-item img{display:block;max-width:88%;max-height:62vh;width:auto;height:auto;object-fit:contain}
.tkc-logo-story-item--en{animation:tkc-logo-en linear both;animation-timeline:--logo-story;animation-range:entry 0% exit 100%}
.tkc-logo-story-item--kr{animation:tkc-logo-kr linear both;animation-timeline:--logo-story;animation-range:entry 0% exit 100%}
.tkc-logo-story-item--symbol{animation:tkc-logo-symbol linear both;animation-timeline:--logo-story;animation-range:entry 0% exit 100%}.tkc-logo-story-item--symbol img{max-width:min(46vw,430px)}
.tkc-app-twocol{display:flex!important;flex-direction:column!important;gap:0!important;margin-left:var(--bleed);margin-right:var(--bleed)}
.tkc-app-twocol .tkc-app-col{width:100%;max-width:none;border-radius:0!important}.tkc-app-twocol .tkc-app-col img{width:100%;height:100%;object-fit:cover}
.tkc-visual-break--pair{padding:0!important;background:transparent!important}.tkc-visual-break--pair .tkc-app-twocol{margin:0!important}
.tkc-color-field--white{box-shadow:inset 0 0 0 1px #d7d7d2,inset 0 0 20px rgba(0,0,0,.025)!important}
.tkc-motif-cluster--keeper{position:relative!important;display:block!important;max-width:1080px!important;min-height:clamp(360px,48vw,560px)!important;background:transparent!important;overflow:visible!important}
.tkc-motif-origin{position:absolute;left:2%;top:50%;width:52%;aspect-ratio:567/518;transform:translateY(-50%);background:transparent!important}
.tkc-motif-shield-group{display:block;width:100%;height:100%;object-fit:contain;background:transparent!important}
.tkc-motif-born-circle{position:absolute;left:28%;top:50%;width:32%;aspect-ratio:1;border-radius:50%;background:#ff4700;opacity:0;transform:translate(-50%,-50%) scale(0);box-shadow:none!important}
.tkc-motif-cluster--keeper.is-visible .tkc-motif-origin{animation:tkc-origin-breathe 1.35s cubic-bezier(.22,1,.36,1) both}
.tkc-motif-cluster--keeper.is-visible .tkc-motif-born-circle{animation:tkc-circle-born 1.45s cubic-bezier(.22,1,.36,1) .12s forwards}
.tkc-pattern-stage--refined{min-height:clamp(420px,52vw,660px)!important;background:#272827!important;padding:clamp(34px,5vw,72px)!important;display:flex;align-items:center}
.tkc-pattern-grid{width:100%;display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:clamp(20px,3vw,54px);align-items:center}
.tkc-pattern-unit{position:relative;aspect-ratio:1;display:grid;place-items:center;background:transparent!important;opacity:.92;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s}
.tkc-pattern-unit img{position:absolute;width:92%;height:92%;object-fit:contain;background:transparent!important}
.tkc-pattern-core{position:absolute;width:31%;aspect-ratio:1;border-radius:50%;background:#ff4700;box-shadow:0 0 0 clamp(8px,1vw,16px) #272827}
.tkc-pattern-unit--1{transform:translateY(24%) rotate(60deg)}.tkc-pattern-unit--2{transform:rotate(120deg)}.tkc-pattern-unit--3{transform:translateY(24%) rotate(180deg)}
.tkc-pattern-stage--refined.is-visible .tkc-pattern-unit{animation:tkc-pattern-settle 1s cubic-bezier(.22,1,.36,1) both}.tkc-pattern-stage--refined.is-visible .tkc-pattern-unit:nth-child(2n){animation-delay:.08s}.tkc-pattern-stage--refined.is-visible .tkc-pattern-unit:nth-child(3n){animation-delay:.16s}
@keyframes tkc-morph-one{0%,28%{opacity:1;transform:scale(.9) rotate(0)}38%,100%{opacity:0;transform:scale(1.05) rotate(20deg)}}
@keyframes tkc-morph-two{0%,28%{opacity:0;transform:scale(.85)}40%,62%{opacity:1;transform:scale(1)}72%,100%{opacity:0;transform:scale(1.08)}}
@keyframes tkc-morph-three{0%,62%{opacity:0;transform:scale(.85)}74%,100%{opacity:1;transform:scale(1)}}
@keyframes tkc-logo-en{0%,8%{opacity:0;transform:translateY(44px)}15%,30%{opacity:1;transform:none}38%,100%{opacity:0;transform:translateY(-36px)}}
@keyframes tkc-logo-kr{0%,31%{opacity:0;transform:translateY(44px)}40%,56%{opacity:1;transform:none}65%,100%{opacity:0;transform:translateY(-36px)}}
@keyframes tkc-logo-symbol{0%,58%{opacity:0;transform:translateY(44px) scale(.94)}69%,92%{opacity:1;transform:none}100%{opacity:0;transform:scale(1.04)}}
@keyframes tkc-circle-flow{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 19px))}}
@keyframes tkc-origin-breathe{0%{transform:translateY(-50%) scale(.92);opacity:.35}55%{transform:translateY(-50%) scale(1.025);opacity:1}100%{transform:translateY(-50%) scale(1);opacity:1}}
@keyframes tkc-circle-born{0%{left:28%;opacity:0;transform:translate(-50%,-50%) scale(0)}30%{left:28%;opacity:1;transform:translate(-50%,-50%) scale(.28)}58%{left:28%;opacity:1;transform:translate(-50%,-50%) scale(.54)}100%{left:82%;opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes tkc-pattern-settle{0%{opacity:0;scale:.72}100%{opacity:.92;scale:1}}
@media(max-width:700px){.tkc-scene01-morph,.tkc-scene01-static{right:-18%;width:78vw}.tkc-motif-cluster--keeper{min-height:330px!important}.tkc-motif-origin{left:-4%;width:62%}.tkc-motif-born-circle{width:34%}@keyframes tkc-circle-born{0%{left:27%;opacity:0;transform:translate(-50%,-50%) scale(0)}45%{left:27%;opacity:1;transform:translate(-50%,-50%) scale(.46)}100%{left:80%;opacity:1;transform:translate(-50%,-50%) scale(1)}}.tkc-pattern-grid{grid-template-columns:repeat(2,1fr)}.tkc-pattern-unit:nth-child(n+7){display:none}}
@media(prefers-reduced-motion:reduce){.tkc-circle-stream{animation:none}.tkc-morph-layer{animation:none}.tkc-morph-layer--one{opacity:1}.tkc-morph-layer--two,.tkc-morph-layer--three{opacity:0}.tkc-logo-story{height:auto}.tkc-logo-story-sticky{position:relative;height:auto;display:flex;flex-direction:column}.tkc-logo-story-item{position:relative;opacity:1;min-height:70vh;animation:none}}


.tkc-scene01-static{right:7%!important;width:min(35vw,500px)!important;max-height:68vh!important}
.tkc-direction-row{grid-template-columns:repeat(3,minmax(0,1fr))!important;width:auto!important}
.tkc-direction-panel{min-width:0!important;width:100%!important}
.tkc-direction-visual{width:100%!important;aspect-ratio:4/5!important}
.tkc-direction-visual--continuous{min-width:0!important}
.tkc-circle-stream{max-width:none!important}
.tkc-scene09-blocks .tkc-bleed-img{margin-right:calc(var(--bleed) - 1px)!important;border-radius:0!important}
.tkc-scene09-blocks .tkc-bleed-img img{display:block;width:100%!important;border-radius:0!important}
.tkc-color-fields--gray .tkc-color-field:first-child{box-shadow:inset 0 0 0 1px #d7d7d2,inset 0 0 20px rgba(0,0,0,.035)!important}
@media(max-width:700px){.tkc-scene01-static{right:4%!important;width:min(52vw,320px)!important}.tkc-direction-row{grid-template-columns:1fr!important}.tkc-direction-visual{aspect-ratio:16/9!important}}


.tkc-app-twocol{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;width:100%!important}
.tkc-app-twocol .tkc-app-col{width:100%!important;min-width:0!important;aspect-ratio:1/1!important;overflow:hidden!important}
.tkc-app-twocol .tkc-app-col img{width:100%!important;height:100%!important;object-fit:cover!important}
@media(max-width:700px){.tkc-app-twocol{grid-template-columns:1fr!important}.tkc-app-twocol .tkc-app-col{aspect-ratio:4/3!important}}


.tkc-scene04-content,.tkc-scene07-content{box-sizing:border-box!important;padding-left:clamp(48px,6vw,96px)!important;padding-right:clamp(48px,6vw,96px)!important}
@media(max-width:700px){.tkc-scene04-content,.tkc-scene07-content{padding-left:24px!important;padding-right:24px!important}}


.tkc-logo-story-item img{height:clamp(120px,18vh,180px)!important;width:auto!important;max-width:88%!important;max-height:none!important;object-fit:contain!important}
.tkc-logo-story-item--symbol img{height:clamp(120px,18vh,180px)!important;width:auto!important;max-width:88%!important}
@media(max-width:700px){.tkc-logo-story-item img,.tkc-logo-story-item--symbol img{height:clamp(90px,15vh,130px)!important;max-width:86%!important}}


.tkc-direction-visual--contrast{background:#272827!important;isolation:isolate}
.tkc-direction-visual--contrast .tkc-direction-half{top:0!important;bottom:0!important;transform:none!important;will-change:width;animation-duration:3.8s!important;animation-timing-function:cubic-bezier(.65,0,.35,1)!important;animation-iteration-count:infinite!important}
.tkc-direction-visual--contrast .tkc-direction-half--dark{left:0!important;right:auto!important;width:50%;background:#272827!important;animation-name:tkc-contrast-dark-sweep!important}
.tkc-direction-visual--contrast .tkc-direction-half--light{right:0!important;left:auto!important;width:50%;background:#ff4700!important;animation-name:tkc-contrast-light-sweep!important;animation-delay:0s!important}
@keyframes tkc-contrast-dark-sweep{0%,100%{width:18%}50%{width:82%}}
@keyframes tkc-contrast-light-sweep{0%,100%{width:82%}50%{width:18%}}
@media(prefers-reduced-motion:reduce){.tkc-direction-visual--contrast .tkc-direction-half{animation:none!important;width:50%!important}}


.tkc-visual-break{padding:0!important;width:100%!important;max-width:none!important;background:transparent!important}
.tkc-bleed-img,.tkc-bleed-img--natural{width:100%!important;max-width:none!important;height:auto!important;aspect-ratio:auto!important;margin:0!important;border-radius:0!important;overflow:visible!important}
.tkc-bleed-img img,.tkc-bleed-img--natural img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;border-radius:0!important}
.tkc-app-twocol{width:100%!important;margin:0!important;align-items:start!important}
.tkc-app-twocol .tkc-app-col{height:auto!important;aspect-ratio:auto!important;overflow:visible!important}
.tkc-app-twocol .tkc-app-col img{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important}


.tkc-scene01-static{right:-2.5%!important}
@media(max-width:700px){.tkc-scene01-static{right:-6%!important}}


.tkc-pattern-stage--refined{min-height:clamp(440px,46vw,620px)!important;padding:clamp(52px,7vw,96px)!important}
.tkc-pattern-grid{grid-template-columns:repeat(4,minmax(150px,1fr))!important;gap:clamp(48px,7vw,120px)!important}
.tkc-pattern-core{display:none!important}
.tkc-pattern-unit{aspect-ratio:1!important;opacity:1!important;background:transparent!important}
.tkc-pattern-unit img{width:100%!important;height:100%!important;object-fit:contain!important;background:transparent!important}
.tkc-pattern-unit:nth-child(n+9){display:none!important}
.tkc-pattern-unit--0{transform:rotate(0deg)!important}.tkc-pattern-unit--1{transform:translateY(18%) rotate(60deg)!important}.tkc-pattern-unit--2{transform:rotate(120deg)!important}.tkc-pattern-unit--3{transform:translateY(18%) rotate(180deg)!important}
@media(max-width:900px){.tkc-pattern-grid{grid-template-columns:repeat(3,minmax(110px,1fr))!important;gap:42px!important}.tkc-pattern-unit:nth-child(n+7){display:none!important}}
@media(max-width:560px){.tkc-pattern-grid{grid-template-columns:repeat(2,minmax(100px,1fr))!important;gap:34px!important}.tkc-pattern-stage--refined{padding:38px 24px!important}}


.tkc-visual-break{width:calc(100% - 2 * var(--bleed))!important;margin-left:var(--bleed)!important;margin-right:var(--bleed)!important}
.tkc-scene04-head{padding-left:clamp(48px,6vw,96px)!important;padding-right:clamp(48px,6vw,96px)!important;box-sizing:border-box!important}
@media(max-width:700px){.tkc-scene04-head{padding-left:24px!important;padding-right:24px!important}}
.tkc-symbol-gif-wrap{display:none!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — stationery application"]){display:flex!important;flex-direction:column!important;gap:clamp(32px,5vw,56px)!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — stationery application"]) .tkc-app-col{width:100%!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — tote bag with graphic-motif mural"]){display:block!important}
.tkc-app-twocol>.tkc-app-col:has(img[alt="THEKEEPER — tote bag with graphic-motif mural"]){display:none!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — windbreaker application"]) .tkc-app-col{width:100%!important}
.tkc-logo-story-item--symbol img{height:clamp(170px,25vh,250px)!important;max-width:92%!important}
@media(max-width:700px){.tkc-logo-story-item--symbol img{height:clamp(130px,20vh,190px)!important}}
@keyframes tkc-circle-born{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.tkc-motif-born-circle{top:37%!important;left:28%!important;width:27%!important}
.tkc-pattern-stage--refined{overflow:hidden!important;background:#272827!important;padding:0!important;display:block!important;min-height:clamp(460px,52vw,680px)!important}
.tkc-pattern-grid{display:grid!important;grid-template-columns:repeat(5,minmax(200px,1fr))!important;gap:clamp(36px,5vw,64px)!important;width:120%!important;margin-left:-10%!important;padding:clamp(48px,7vw,84px) 0!important}
.tkc-pattern-unit{transform:none!important;opacity:1!important;aspect-ratio:1!important;display:flex!important}
.tkc-pattern-unit img{width:100%!important;height:100%!important;object-fit:contain!important}
@media(max-width:900px){.tkc-pattern-grid{grid-template-columns:repeat(3,minmax(150px,1fr))!important}}
@media(max-width:560px){.tkc-pattern-grid{grid-template-columns:repeat(2,minmax(130px,1fr))!important}}
.tkc-web-live{background:#272827!important;border-radius:0!important}
.tkc-web-cards{background:#1c1d1c!important;color:#fff!important}
.tkc-web-cards article{border-right-color:rgba(255,255,255,.14)!important}
.tkc-web-cards span{color:rgba(255,255,255,.62)!important}

.tkc-web-photo,.tkc-web-shade{display:none!important}
.tkc-web-hero{background:radial-gradient(ellipse at 76% 32%,rgba(255,71,0,.22),transparent 62%),#272827!important}
.tkc-web-hero::before{content:"";position:absolute;inset:0;background-image:url(/assets/portfolio/thekeeper/thekeeper_common_shield.svg);background-repeat:no-repeat;background-position:88% 54%;background-size:44% auto;opacity:.16;pointer-events:none}
.tkc-web-message{position:relative;z-index:1}


.tkc-app-twocol:has(img[alt="THEKEEPER — t-shirt application"]){display:flex!important;flex-direction:column!important;gap:0!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — t-shirt application"]) .tkc-app-col{width:100%!important}
.tkc-visual-break--pair:has(img[alt="THEKEEPER — stationery application"]){padding:0!important;background:transparent!important}
.tkc-app-twocol:has(img[alt="THEKEEPER — stationery application"]){gap:0!important}

.tkc-visual-break:has(.tkc-web-live){position:relative!important;overflow:hidden!important;padding:clamp(48px,8vw,112px) clamp(24px,6vw,64px)!important;width:100%!important;max-width:none!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#1c1d1c!important}
.tkc-visual-break:has(.tkc-web-live)::before{content:"";position:absolute;inset:0;background-image:url(/assets/portfolio/thekeeper/thekeeper_09-application_website-bg.png);background-repeat:repeat;background-size:min(320px,34vw) auto;background-position:center;opacity:.16;pointer-events:none}
.tkc-web-live{position:relative!important;z-index:1!important;width:100%!important;max-width:1140px!important;box-shadow:0 30px 70px rgba(0,0,0,.4),0 80px 160px rgba(0,0,0,.35)!important}
.tkc-web-live::before{content:"";display:block;height:30px;background:#17181a;border-bottom:1px solid rgba(255,255,255,.08);background-image:radial-gradient(circle 5px at 20px 15px,#ff5f57 0 100%,transparent 101%),radial-gradient(circle 5px at 40px 15px,#febc2e 0 100%,transparent 101%),radial-gradient(circle 5px at 60px 15px,#28c840 0 100%,transparent 101%);background-repeat:no-repeat}
.tkc-motif-cluster--keeper{display:none!important}
.tkc-scene07{position:relative!important;overflow:hidden!important;min-height:clamp(560px,68vw,820px)!important;display:flex!important;align-items:flex-end!important;background:#0b0b0b!important}
.tkc-scene07::before{content:"";position:absolute;inset:0;background-image:url(/assets/portfolio/thekeeper/thekeeper_07-graphic-motif_background.webp);background-size:cover;background-position:30% 38%;filter:saturate(.95) contrast(1.04)}
.tkc-scene07::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,6,6,.92) 0%,rgba(6,6,6,.62) 34%,rgba(6,6,6,.18) 62%,rgba(6,6,6,.02) 82%),linear-gradient(100deg,rgba(6,6,6,.5) 0%,rgba(6,6,6,.12) 42%,transparent 65%)}
.tkc-scene07-content{position:relative!important;z-index:1!important;width:100%!important}


.tkc-pattern-unit img{display:none!important}
.tkc-pattern-unit{background-repeat:repeat!important;background-position:center!important}
.tkc-pattern-unit:nth-child(10n+1){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-01.png)!important;background-size:auto 56px!important}
.tkc-pattern-unit:nth-child(10n+2){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-02.png)!important;background-size:auto 56px!important}
.tkc-pattern-unit:nth-child(10n+3){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-03.png)!important;background-size:56px auto!important}
.tkc-pattern-unit:nth-child(10n+4){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-04.png)!important;background-size:56px auto!important}
.tkc-pattern-unit:nth-child(10n+5){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-05.png)!important;background-size:56px auto!important}
.tkc-pattern-unit:nth-child(10n+6){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-06.png)!important;background-size:auto 56px!important}
.tkc-pattern-unit:nth-child(10n+7){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-07.png)!important;background-size:auto 56px!important}
.tkc-pattern-unit:nth-child(10n+8){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-08.png)!important;background-size:56px auto!important}
.tkc-pattern-unit:nth-child(10n+9){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-09.png)!important;background-size:56px auto!important}
.tkc-pattern-unit:nth-child(10n){background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-10.png)!important;background-size:56px auto!important}
.tkc-web-live{max-width:none!important}
.tkc-web-hero{background-image:linear-gradient(100deg,rgba(8,7,6,.93) 0%,rgba(8,7,6,.70) 36%,rgba(8,7,6,.30) 64%,rgba(8,7,6,.08) 86%),linear-gradient(0deg,rgba(8,7,6,.55) 0%,transparent 42%),url(/assets/portfolio/thekeeper/thekeeper_09-application_website-hero.jpg)!important;background-size:auto,auto,cover!important;background-position:left,left,62% 32%!important;background-repeat:no-repeat,no-repeat,no-repeat!important}
.tkc-web-hero::before{content:"";position:absolute;inset:auto!important;top:auto!important;left:auto!important;right:clamp(20px,3vw,40px)!important;bottom:clamp(20px,3vw,40px)!important;width:clamp(180px,16vw,260px)!important;aspect-ratio:300/112!important;background-image:url(/assets/portfolio/thekeeper/thekeeper_09-application_website-hero-overlay.png)!important;background-size:contain!important;background-repeat:no-repeat!important;opacity:.95!important;pointer-events:none!important}


.tkc-visual-break:has(.tkc-web-live){padding:0!important;display:block!important;background:transparent!important;overflow:visible!important}
.tkc-web-stage{position:relative;height:400vh;view-timeline-name:--web-pattern;view-timeline-axis:block;background:#1c1d1c}
.tkc-web-stage-sticky{position:sticky;top:0;display:flex;align-items:center;justify-content:center;padding:clamp(48px,7vw,96px) clamp(10px,1.6vw,20px)}
.tkc-web-pattern-layer{position:absolute;inset:0;background-repeat:repeat;background-position:center;opacity:0;pointer-events:none;animation:tkc-wp-fade linear both;animation-timeline:--web-pattern}
.tkc-web-pattern-layer--1{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-06.png);background-size:144px 160px}.tkc-web-pattern-layer--2{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-07.png);background-size:152px 160px}.tkc-web-pattern-layer--3{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-08.png);background-size:160px 146px}.tkc-web-pattern-layer--4{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-09.png);background-size:160px 138px}.tkc-web-pattern-layer--5{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-10.png);background-size:160px 92px}
.tkc-web-pattern-layer--1{animation-range:0% 20%}.tkc-web-pattern-layer--2{animation-range:20% 40%}.tkc-web-pattern-layer--3{animation-range:40% 60%}.tkc-web-pattern-layer--4{animation-range:60% 80%}.tkc-web-pattern-layer--5{animation-range:80% 100%}
@keyframes tkc-wp-fade{0%{opacity:0}15%{opacity:1}85%{opacity:1}100%{opacity:0}}
.tkc-web-live{position:relative!important;z-index:2!important;width:100%!important;max-width:none!important}
.tkc-web-logo{height:clamp(22px,2.8vw,32px);width:auto;display:block}
.tkc-web-hero::before{content:none!important;display:none!important}
@media (prefers-reduced-motion:reduce){.tkc-web-pattern-layer{animation:none!important;opacity:1!important}.tkc-web-pattern-layer--2,.tkc-web-pattern-layer--3,.tkc-web-pattern-layer--4,.tkc-web-pattern-layer--5{display:none!important}}


.tkc-web-pattern-layer{display:none!important}
.tkc-web-stage{height:auto!important;min-height:0!important;background:#1c1d1c!important;background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-08.png)!important;background-size:160px 146px!important;background-repeat:repeat!important;background-position:center!important}
.tkc-web-stage-sticky{position:static!important;top:auto!important;padding:clamp(48px,7vw,96px) clamp(10px,1.6vw,20px)!important}
.tkc-pattern-grid{display:none!important}
.tkc-pattern-stage--refined{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_unit-08.png)!important;background-size:160px 146px!important;background-repeat:repeat!important;background-position:center!important}


.tkc-visual-break:has(.tkc-web-live){width:calc(100% - 2 * var(--bleed))!important;margin-left:var(--bleed)!important;margin-right:var(--bleed)!important;max-width:none!important}
.tkc-web-stage{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_stage-01.png)!important}
.tkc-pattern-stage--refined{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_stage-01.png)!important;position:relative!important}
.tkc-pattern-stage--refined::before{content:"";position:absolute;inset:0;background-color:#272827;background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_stage-overlay.png);background-size:144px 160px;background-repeat:repeat;background-position:center;opacity:0;transition:opacity .7s ease;pointer-events:none}
.tkc-pattern-stage--refined:hover::before{opacity:1}


.tkc-web-stage{background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_stage-02.png)!important}


.tkc-section.tkc-scene08{padding-bottom:0!important}


.tkc-pattern-stage--refined{overflow:visible!important}
.tkc-pattern-stage--refined::before{background-color:#1c1d1c!important;background-image:url(/assets/portfolio/thekeeper/thekeeper_08-graphic-pattern_stage-02.png)!important;background-size:160px 146px!important;background-position:center!important;background-repeat:repeat!important;transition:none!important;animation:tkc-pattern-reveal linear both;animation-timeline:view();animation-range:40% 92%}
@keyframes tkc-pattern-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.tkc-pattern-stage--refined::before{animation:none!important;opacity:0!important}}


/* v32 — bug & legibility fixes only; layout, type and motion unchanged */

/* 1. Mobile CONTACT block reused the desktop reveal class (.ending-scene--contact),
      which starts fully clipped and is only revealed by the desktop sticky scene.
      On mobile it was never revealed: invisible and unclickable. */
.ending-mobile-block.ending-scene--contact{clip-path:none;pointer-events:auto}
/*    On mobile the invisible header-colour sentinel (.header-dark-trigger, absolute,
      bottom 20% of the ending area) also sat on top of the LET'S TALK link. */
.header-dark-trigger{pointer-events:none}

/* 2. Small grey text legibility (WCAG AA 4.5:1).
      Same warm grey hue, darker: 2.55:1 → 5.15:1 on white, 4.56:1 on the grey section. */
:root{--ink-faint:#716D65}
/*    Small text on the teal accent surface: ink at 80% (≈4.6:1), no flat grey. */
.ending-attitude-mobile-item .caption,
.ending-contact-caption,
.ending-scene--about .kr-soft,
.footer-top-meta .eyebrow,
.footer-meta,
.back-top,
.footer-legal{color:#131211cc}
.back-top:hover{color:var(--ink)}

/* 3. Mobile footer: no dangling "·" at line ends, consistent left alignment. */
@media (max-width:900px){
  .footer-legal{flex-direction:column}
  .footer-legal-sep{display:none}
}
@media (max-width:640px){
  .footer-top{flex-direction:column;align-items:flex-start}
  .footer-top-meta{align-items:flex-start;text-align:left}
}


/* v33 — 북치는소년 case study, round 1. Scoped to .bcsc; other projects untouched. */

/* Modal frame: no white gutters around this case study. The top gutter is
   handed to the hero so its colour runs to the panel edge. */
.works-modal-panel:has(.bcsc),.works-modal-scroll:has(.bcsc){background:#EFEFEF}
.works-modal-scroll:has(.bcsc){padding-top:0}
.bcsc-hero{padding-top:clamp(56px,8vw,88px)}

/* Every scene is full-bleed; content keeps the shared inset grid. */
.bcsc>.bcsc-section{margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}
.bcsc-section+.bcsc-section{border-top:0}
.bcsc-scene01,.bcsc-scene03,.bcsc-scene05,.bcsc-scene07{background:var(--bcs-offwhite)}
.bcsc-scene04{background:var(--bcs-blue)}

/* 01 ROLE */
.bcsc-role-col{width:clamp(180px,22vw,260px)}
.bcsc-role-body{max-width:260px;font-size:.88rem;line-height:1.8;color:var(--bcs-ink-soft)}

/* 02 ATTITUDE — heading lives inside the blue field */
.bcsc-scene02-head .bcsc-big-kr{max-width:none;word-break:keep-all}
.bcsc-scene02{background:var(--bcs-blue);margin-left:var(--bleed);margin-right:var(--bleed)}
.bcsc-scene02-head{padding-left:var(--inset);padding-right:var(--inset);padding-bottom:clamp(24px,4vw,48px)}
.bcsc-scene02 .bcsc-attitude-wrap{margin-left:0;margin-right:0}

/* 03 VISUAL PRINCIPLE — textured circles, one tonal system */
.bcsc-principle-circle{position:relative;overflow:hidden;isolation:isolate;border-color:color-mix(in srgb,var(--bcs-charcoal) 14%,transparent)}
.bcsc-principle-circle--textured::before{content:"";position:absolute;inset:0;z-index:-1;background:color-mix(in srgb,var(--bcs-offwhite) 40%,transparent)}
.bcsc-principle-row>.bcsc-principle-circle:first-child::before{background:color-mix(in srgb,var(--bcs-offwhite) 66%,transparent)}
.bcsc-principle-circle span{word-break:keep-all;line-height:1.5}

/* 04 SYMBOL — one blue screen, larger mark */
.bcsc-symbol-stage{background:transparent;width:clamp(180px,24vw,320px);margin-left:auto;margin-right:auto}
.bcsc-symbol-stage img{padding:0}

/* 05 LOGOTYPE — no box behind the mark */
.bcsc-logo-stage{background:transparent;width:min(100%,560px);margin-left:auto;margin-right:auto}
.bcsc-logo-stage img{padding:0}

/* 06 COLOR — Majuon principle: full-screen colour field + wide colour bar */
.bcsc-color-hero{min-height:0}
.bcsc-color-hero--dark .bcsc-tag{color:color-mix(in srgb,var(--bcs-offwhite) 62%,transparent)}
.bcsc-color-hero--dark .bcsc-big-kr{color:var(--bcs-offwhite)}
.bcsc-color-hero--dark .bcsc-kr{color:color-mix(in srgb,var(--bcs-offwhite) 76%,transparent)}
.bcsc-color-bar{display:flex;margin-top:clamp(40px,6vw,64px);min-height:clamp(200px,24vw,300px)}
.bcsc-color-seg{display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-width:0;padding:clamp(20px,3vw,32px) clamp(18px,2.6vw,28px);border:1px solid color-mix(in srgb,var(--bcs-charcoal) 22%,transparent);color:var(--bcs-ink)}
.bcsc-color-seg+.bcsc-color-seg{border-left:0}
.bcsc-color-seg--dark{color:var(--bcs-offwhite)}
.bcsc-color-hero--dark .bcsc-color-seg{border-color:color-mix(in srgb,var(--bcs-offwhite) 26%,transparent)}
.bcsc-color-mood{font-family:var(--font-bcs-body);font-weight:600;font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.4}
.bcsc-color-seg-name{display:flex;flex-direction:column;gap:4px}
.bcsc-color-seg .bcsc-color-kr{font-size:.92rem;font-weight:500;opacity:.8}
.bcsc-color-seg .bcsc-color-values{margin-top:6px}

/* 07 TEXTURE — the stipple as the single hero sample */
.bcsc-texture-row--single{justify-content:center}
.bcsc-texture-tile--hero{width:clamp(220px,26vw,320px);padding-bottom:22px}

@media (max-width:700px){
  .bcsc-principle-circle span{font-size:.82rem}
  .bcsc-color-bar{flex-direction:column;min-height:0}
  .bcsc-color-seg{flex:none!important;min-height:136px}
  .bcsc-color-seg+.bcsc-color-seg{border-left:1px solid color-mix(in srgb,var(--bcs-charcoal) 22%,transparent);border-top:0}
  .bcsc-color-hero--dark .bcsc-color-seg+.bcsc-color-seg{border-left-color:color-mix(in srgb,var(--bcs-offwhite) 26%,transparent)}
}


.bcsc{--tx-grain:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-grain.png");--tx-frottage:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-frottage.png");--tx-speckle:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-speckle.webp");--tx-lines:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-lines.png");--tx-dots:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-dots.png");--tx-marble:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_unshown_texture-marble.png");--tx-relief:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-relief.png");--tx-edge:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-edge.png");}
/* v34 — 북치는소년 round 2: analog textures in brand colour, final marks, mockups.
   Textures are scanned/hand-made marks used as alpha masks, so each one can be
   tinted with a brand colour and density per scene. One or two per screen. */
.bcsc{--bcs-blue-deep:color-mix(in srgb,var(--bcs-blue) 60%,#3f6f73)}

/* texture hosts */
.bcsc-hero,.bcsc>.bcsc-section,.bcsc-color-hero,.bcsc-closing{position:relative;isolation:isolate}
.bcsc-attitude-sticky{isolation:isolate}
.bcsc-hero::before,.bcsc-hero::after,.bcsc>.bcsc-section::before,.bcsc>.bcsc-section::after,
.bcsc-color-hero::before,.bcsc-closing::after,.bcsc-attitude-sticky::before,
.bcsc-role-circle::before,.bcsc-texture-tile--hero::before{content:"";position:absolute;pointer-events:none;z-index:-1}

/* paper grain — whole-surface, very quiet, on every grey scene */
.bcsc-scene01::before,.bcsc-scene03::before,.bcsc-scene05::before,.bcsc-scene07::before,.bcsc-scene08::before,.bcsc-mock-section::before,.bcsc-hero::after{
  inset:0;background:var(--bcs-charcoal);opacity:.16;
  -webkit-mask:var(--tx-grain) 0 0/360px repeat;mask:var(--tx-grain) 0 0/360px repeat}
.bcsc-hero::after{background:var(--bcs-blue-deep);opacity:.22}

/* HERO — pencil rubbing rising from the bottom of the blue field */
.bcsc-hero::before{inset:0;background:var(--bcs-blue-deep);opacity:.34;
  -webkit-mask:var(--tx-frottage) center bottom/cover no-repeat,linear-gradient(to top,#000 0,transparent 62%);-webkit-mask-composite:source-in;
  mask:var(--tx-frottage) center bottom/cover no-repeat,linear-gradient(to top,#000 0,transparent 62%);mask-composite:intersect}

/* 01 — the hero blue breaks into the grey as an uneven ink edge */
.bcsc-scene01::after{left:0;right:0;top:0;height:clamp(64px,8vw,112px);background:var(--bcs-blue);
  -webkit-mask:var(--tx-edge) 0 0/100% 100% no-repeat;mask:var(--tx-edge) 0 0/100% 100% no-repeat}
/* role circles: stamped dots → speckle → relief, one mark per step */
.bcsc-role-circle{position:relative;overflow:hidden;isolation:isolate}
.bcsc-role-circle::before{inset:0;border-radius:50%;background:var(--bcs-blue-deep);opacity:.3;
  -webkit-mask:var(--tx-dots) center/cover no-repeat;mask:var(--tx-dots) center/cover no-repeat}
.bcsc-role-item:nth-child(2) .bcsc-role-circle::before{-webkit-mask-image:var(--tx-speckle);mask-image:var(--tx-speckle);-webkit-mask-size:240%;mask-size:240%;opacity:.42}
.bcsc-role-item:nth-child(3) .bcsc-role-circle::before{-webkit-mask-image:var(--tx-relief);mask-image:var(--tx-relief);opacity:.26}

/* 02 — hand-drawn lines laid low over the wide blue field */
.bcsc-attitude-sticky::before{inset:0;background:var(--bcs-blue-deep);opacity:.2;
  -webkit-mask:var(--tx-lines) center/cover no-repeat;mask:var(--tx-lines) center/cover no-repeat}

/* 04 — speckle gathering around the symbol, fading out radially */
.bcsc-scene04::before{left:0;right:0;top:0;height:min(1100px,62%);background:var(--bcs-blue-deep);opacity:.46;
  -webkit-mask:var(--tx-speckle) center 70%/min(1400px,140%) auto no-repeat,radial-gradient(ellipse 46% 52% at 50% 72%,#000 0,transparent 100%);-webkit-mask-composite:source-in;
  mask:var(--tx-speckle) center 70%/min(1400px,140%) auto no-repeat,radial-gradient(ellipse 46% 52% at 50% 72%,#000 0,transparent 100%);mask-composite:intersect}

/* 05 — a rubbing that sits partly behind the headline */
.bcsc-scene05::after{top:clamp(72px,9vw,124px);left:calc(var(--inset) - clamp(12px,2vw,28px));width:min(620px,78%);height:clamp(150px,17vw,230px);background:var(--bcs-stone);opacity:.62;
  -webkit-mask:var(--tx-frottage) 0 30%/130% auto no-repeat,radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 100%);-webkit-mask-composite:source-in;
  mask:var(--tx-frottage) 0 30%/130% auto no-repeat,radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 100%);mask-composite:intersect}

/* 06 — low-contrast marks across the colour fields */
.bcsc-color-hero::before{inset:0;background:var(--bcs-offwhite);opacity:.24;
  -webkit-mask:var(--tx-speckle) right -10% top 10%/min(1500px,120%) auto no-repeat;mask:var(--tx-speckle) right -10% top 10%/min(1500px,120%) auto no-repeat}
.bcsc-color-hero--dark::before{opacity:.07;-webkit-mask:var(--tx-frottage) left 30%/cover no-repeat;mask:var(--tx-frottage) left 30%/cover no-repeat}
.bcsc-color-seg{position:relative}

/* 07 — the stipple specimen tinted in charcoal on pale blue */
.bcsc-texture-tile--hero{background-image:none!important;background-color:color-mix(in srgb,var(--bcs-blue) 55%,var(--bcs-offwhite));overflow:hidden;isolation:isolate}
.bcsc-texture-tile--hero::before{inset:0;background:var(--bcs-charcoal);opacity:.82;-webkit-mask:var(--tx-dots) center/cover no-repeat;mask:var(--tx-dots) center/cover no-repeat}

/* CLOSING — the charcoal arrives with a ragged edge, faint speckle inside */
.bcsc-closing::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:clamp(64px,8vw,112px);background:var(--bcs-charcoal);transform:scaleY(-1);pointer-events:none;
  -webkit-mask:var(--tx-edge) 0 0/100% 100% no-repeat;mask:var(--tx-edge) 0 0/100% 100% no-repeat}
.bcsc-closing::after{inset:0;background:var(--bcs-offwhite);opacity:.06;-webkit-mask:var(--tx-speckle) center/cover no-repeat;mask:var(--tx-speckle) center/cover no-repeat}
.bcsc-closing-symbol{filter:none}

/* MOCKUPS — one per row, full panel width, natural ratio (no crop) */
.bcsc-scene08{background:var(--bcs-offwhite)}
.bcsc-mock{margin:clamp(64px,9vw,120px) 0 0}
.bcsc-mock-section{background:var(--bcs-offwhite);padding-top:clamp(72px,9vw,128px)}
.bcsc-mock-section .bcsc-mock{margin-top:0}
.bcsc>.bcsc-section:has(>.bcsc-mock:last-child){padding-bottom:0}
/* 08 keeps its bottom space so the closing's ragged edge lands on paper, not on the image */
.bcsc>.bcsc-scene08{padding-bottom:clamp(96px,12vw,160px)}
.bcsc-mock-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px clamp(20px,3vw,40px);margin-bottom:clamp(20px,3vw,32px)}
.bcsc-mock-tag{font-family:var(--font-bcs-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bcs-ink-soft);min-width:150px}
.bcsc-mock-text{flex:1 1 320px;max-width:600px;font-family:var(--font-bcs-body);font-size:.95rem;line-height:1.85;color:var(--bcs-ink-soft)}
.bcsc-mock-img{margin-left:var(--bleed);margin-right:var(--bleed)}
/* the reveal scale(1.045) must not push past the panel edge on narrow screens */
.bcsc>.bcsc-section{overflow-x:clip}
.bcsc-mock-img img{object-fit:cover}
/* connector between application images: a short hand-drawn stitch */
.bcsc-mock-link{width:18px;height:clamp(72px,9vw,128px);margin:clamp(36px,5vw,64px) auto;background:var(--bcs-blue-deep);opacity:1;
  -webkit-mask:var(--tx-lines) center/700px auto repeat;mask:var(--tx-lines) center/700px auto repeat}
.bcsc-mock-link+.bcsc-mock{margin-top:0}

@media (max-width:700px){
  .bcsc-mock-tag{min-width:0;width:100%}
  .bcsc-scene05::after{width:92%}
}
@media (prefers-reduced-motion: reduce){.bcsc-mock-img{opacity:1!important;transform:none!important}}


.bcsc{--tx-bark:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_07-texture_texture-bark.webp");--tx-bleed:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_07-texture_texture-bleed.png");--tx-fiber:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_07-texture_texture-fiber.webp");--tx-press:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_07-texture_texture-press.webp");--tx-rings:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-rings.webp");--tx-disc:url("/assets/portfolio/bukchineun-sonyeon/bukchineun-sonyeon_common_texture-disc.png");}
/* v36 — 북치는소년 07 / TEXTURE: eight analog textures, one at a time, in a sticky scene.
   Each disc = brand-coloured paper (rough stamped circle) + brand-coloured marks (texture mask). */
.bcsc>.bcsc-scene07{padding-bottom:0}
.bcsc-tx-wrap{position:relative;display:grid;margin:clamp(56px,8vw,96px) var(--bleed) 0}
.bcsc-tx-sticky{grid-column:1;grid-row:1;position:sticky;top:0;z-index:1;
  height:calc(100vh - (2*clamp(10px,3vw,48px)) - clamp(56px,8vw,88px));overflow:hidden;
  background:var(--tx-bg);color:var(--tx-text);transition:background-color .9s cubic-bezier(.16,.84,.44,1),color .6s}
.bcsc-tx-track{grid-column:1;grid-row:1}
.bcsc-tx-trigger{height:72vh}
.bcsc-tx-stage{position:absolute;inset:0}

.bcsc-tx-disc{position:absolute;left:64%;top:50%;width:min(64vh,520px);aspect-ratio:1;margin:calc(min(64vh,520px)/-2) 0 0 calc(min(64vh,520px)/-2);
  background:var(--tx-paper);opacity:0;transform:scale(.78) rotate(-12deg);
  transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform 1.3s cubic-bezier(.16,.84,.44,1);
  -webkit-mask:var(--tx-disc) center/100% 100% no-repeat;mask:var(--tx-disc) center/100% 100% no-repeat}
.bcsc-tx-disc.is-past{transform:scale(1.35) rotate(8deg)}
.bcsc-tx-disc.is-active{opacity:1;transform:scale(1) rotate(0deg)}
/* some textures push past the frame so their detail can be read at full size */
.bcsc-tx-disc.is-zoom.is-active{transform:scale(2.6) rotate(0deg)}
.bcsc-tx-marks{position:absolute;inset:0;background:var(--tx-ink);
  -webkit-mask:var(--tx-mark) center/cover no-repeat;mask:var(--tx-mark) center/cover no-repeat}
.bcsc-tx-disc.is-zoom .bcsc-tx-marks{opacity:.78}

.bcsc-tx-labels{position:absolute;left:var(--inset);top:50%;width:min(400px,34%);z-index:2}
.bcsc-tx-label{position:absolute;left:0;top:0;transform:translateY(calc(-50% + 28px));opacity:0;
  transition:opacity .6s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1);pointer-events:none}
.bcsc-tx-label.is-active{opacity:1;transform:translateY(-50%)}
.bcsc-tx-count{display:block;font-family:var(--font-bcs-body);font-weight:700;font-size:.72rem;letter-spacing:.12em;opacity:.7;margin-bottom:clamp(14px,2vw,22px);font-variant-numeric:tabular-nums}
.bcsc-tx-key{display:block;font-family:var(--font-bcs-display);font-weight:900;font-size:clamp(2.6rem,6vw,5rem);line-height:.95;letter-spacing:-.01em}
.bcsc-tx-kr{display:block;margin-top:10px;font-family:var(--font-bcs-body);font-weight:600;font-size:clamp(1.05rem,1.5vw,1.25rem)}
.bcsc-tx-how{margin-top:clamp(16px,2vw,22px);font-family:var(--font-bcs-body);font-size:.95rem;line-height:1.8;max-width:360px;word-break:keep-all;text-wrap:pretty;opacity:.82}
.bcsc-tx-use{display:block;margin-top:18px;font-family:var(--font-bcs-body);font-weight:700;font-size:.68rem;letter-spacing:.1em;opacity:.6}
/* when a disc is zoomed past the frame, the label gets a feathered ground in the disc's paper colour */
.bcsc-tx-label{transition:opacity .6s cubic-bezier(.16,.84,.44,1),transform .9s cubic-bezier(.16,.84,.44,1),background-color .6s,box-shadow .6s}

.bcsc-tx-progress{position:absolute;left:var(--inset);bottom:clamp(24px,4vh,40px);display:flex;gap:8px;z-index:2}
.bcsc-tx-progress span{width:18px;height:2px;background:currentColor;opacity:.22;transition:opacity .4s,width .4s}
.bcsc-tx-progress span.is-active{opacity:.9;width:34px}

@media (max-width:860px){
  .bcsc-tx-disc{left:50%;top:36%;width:min(74vw,46vh);margin:calc(min(74vw,46vh)/-2) 0 0 calc(min(74vw,46vh)/-2)}
  .bcsc-tx-disc.is-zoom.is-active{transform:scale(2)}
  .bcsc-tx-labels{top:auto;bottom:clamp(64px,10vh,96px);width:calc(100% - 2*var(--inset))}
  .bcsc-tx-label{top:auto;bottom:0;transform:translateY(28px)}
  .bcsc-tx-label.is-active{transform:none}
  .bcsc-tx-key{font-size:clamp(2.2rem,11vw,3rem)}
  .bcsc-tx-how{max-width:none;font-size:.9rem}
  .bcsc-tx-use{display:none}
  .bcsc-tx-trigger{height:60vh}
}
@media (prefers-reduced-motion: reduce){
  .bcsc-tx-disc,.bcsc-tx-label,.bcsc-tx-sticky{transition:none!important}
  .bcsc-tx-disc.is-past{transform:none}
}


/* v35 — portfolio system layer: full-bleed frame, shared type scale, colour/type format,
   scroll scenes and mockup slots for the unfinished case studies only. */
.works-modal-panel:has(.oomc),.works-modal-scroll:has(.oomc){background:#F6EDDA}
.works-modal-panel:has(.ilc),.works-modal-scroll:has(.ilc){background:#FFFFFF}
.works-modal-panel:has(.cnl),.works-modal-scroll:has(.cnl){background:#FFFFFF}
.works-modal-panel:has(.bcnl),.works-modal-scroll:has(.bcnl){background:#FEFFFF}
.works-modal-panel:has(.ups),.works-modal-scroll:has(.ups){background:#FFFFFF}
.works-modal-panel:has(.jdc),.works-modal-scroll:has(.jdc){background:#F4F3EE}
.works-modal-panel:has(.jsc),.works-modal-scroll:has(.jsc){background:#F4F3EE}
.works-modal-scroll:has(.oomc),.works-modal-scroll:has(.ilc),.works-modal-scroll:has(.cnl),.works-modal-scroll:has(.bcnl),.works-modal-scroll:has(.ups),.works-modal-scroll:has(.jdc),.works-modal-scroll:has(.jsc){padding-top:0}
.oomc .oomc-hero,.ilc .ilc-hero,.cnl .cnl-hero,.bcnl .bcnl-hero,.ups .ups-hero,.jdc .jdc-hero,.jsc .jsc-hero{padding-top:clamp(56px,8vw,88px)}
.bcnl>.bcnl-scene07,.cnl>.cnl-scene06,.cnl>.cnl-scene09,.ilc>.ilc-scene04,.jdc>.jdc-scene02,.jdc>.jdc-scene03,.jdc>.jdc-scene05,.jdc>.jdc-scene06,.jdc>.jdc-scene08,.jsc>.jsc-scene01,.jsc>.jsc-scene03,.jsc>.jsc-scene04,.jsc>.jsc-scene05,.jsc>.jsc-scene06,.jsc>.jsc-scene07,.jsc>.jsc-scene08,.jsc>.jsc-scene09,.jsc>.jsc-scene10,.jsc>.jsc-scene12,.oomc>.oomc-hero,.oomc>.oomc-scene01,.oomc>.oomc-scene03,.oomc>.oomc-scene04,.oomc>.oomc-scene05,.oomc>.oomc-scene06,.oomc>.oomc-scene07,.oomc>.oomc-scene08,.oomc>.oomc-scene10,.oomc>.oomc-scene11,.ups>.ups-scene09{margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset)}
.oomc>*,.ilc>*,.cnl>*,.bcnl>*,.ups>*,.jdc>*,.jsc>*{overflow-x:clip}
.bcnl-app-stack,.ups-app-stack,.ilc-keyvisual-stack,.jsc-card-row,.jdc-application-stage,.cnl-app-photo,.jdc-colorway-row,.bcnl-colorway-stack{margin-left:var(--bleed);margin-right:var(--bleed);gap:0}
.bcnl-app-stack,.ups-app-stack{flex-direction:column}
.ilc-keyvisual-stack,.jsc-card-row,.jdc-colorway-row{display:flex;flex-direction:row;align-items:stretch}
.ilc-keyvisual-stack>*,.jsc-card-row>*,.jdc-colorway-row>*{flex:1 1 0;min-width:0;max-width:none;width:auto}
.jdc-colorway-row .jdc-colorway-stage{width:100%}
@media (max-width:700px){.jsc-card-row,.jdc-colorway-row{flex-direction:column}}
.oomc,.ilc,.cnl,.bcnl,.ups,.jdc,.jsc{--pf-ink-soft:color-mix(in srgb,currentColor 68%,transparent)}
.oomc :is(h1,h2,h3,p,span,li),.ilc :is(h1,h2,h3,p,span,li),.cnl :is(h1,h2,h3,p,span,li),.bcnl :is(h1,h2,h3,p,span,li),.ups :is(h1,h2,h3,p,span,li),.jdc :is(h1,h2,h3,p,span,li),.jsc :is(h1,h2,h3,p,span,li){word-break:keep-all;overflow-wrap:break-word}
.oomc .oomc-tag,.ilc .ilc-tag,.cnl .cnl-tag,.bcnl .bcnl-tag,.ups .ups-tag,.jdc .jdc-tag,.jsc .jsc-tag{font-size:.72rem;line-height:1.5;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:clamp(20px,3vw,32px)}
.oomc .oomc-hero-big,.ilc .ilc-hero-big,.cnl .cnl-hero-big,.bcnl .bcnl-hero-big,.ups .ups-hero-big,.jdc .jdc-hero-big,.jsc .jsc-hero-big{font-weight:900;letter-spacing:-.025em;line-height:1.06;font-size:clamp(2.6rem,7.4vw,6.2rem);text-align:left;text-wrap:balance;max-width:none}
.oomc .oomc-big,.ilc .ilc-big,.cnl .cnl-big,.bcnl .bcnl-big,.ups .ups-big,.jdc .jdc-big,.jsc .jsc-big,.oomc .oomc-big-en,.oomc .oomc-big-kr{font-weight:900;letter-spacing:-.02em;line-height:1.06;font-size:clamp(2.4rem,6.4vw,5.4rem);text-wrap:balance;max-width:1040px}
.oomc .oomc-kr,.ilc .ilc-kr,.cnl .cnl-kr,.bcnl .bcnl-kr,.ups .ups-kr,.jdc .jdc-kr,.jsc .jsc-kr{font-size:1.1rem;line-height:1.7;font-weight:400;max-width:640px;text-wrap:pretty}
.oomc .oomc-body,.ilc .ilc-body,.cnl .cnl-body,.bcnl .bcnl-body,.ups .ups-body,.jdc .jdc-body,.jsc .jsc-body{font-size:1.02rem;line-height:1.85;max-width:560px;text-wrap:pretty}
.oomc .oomc-hero-body p,.ilc .ilc-hero-body p,.cnl .cnl-hero-body p,.bcnl .bcnl-hero-body p,.ups .ups-hero-body p,.jdc .jdc-hero-body p,.jsc .jsc-hero-body p{font-size:1.1rem;line-height:1.7;text-align:left}
.oomc :is(.oomc-footnote,.oomc-caption),.ilc :is(.ilc-footnote,.ilc-caption),.cnl :is(.cnl-footnote,.cnl-caption),.bcnl :is(.bcnl-footnote,.bcnl-caption),.ups :is(.ups-footnote,.ups-caption),.jdc :is(.jdc-footnote,.jdc-caption),.jsc :is(.jsc-footnote,.jsc-caption){font-size:.9rem;line-height:1.75;max-width:640px;text-wrap:pretty}
.oomc :is(.oomc-gray-caption,.oomc-logo-label,.oomc-logo-step-label,.oomc-space-caption,.oomc-app-tag,.oomc-type-role),.ilc :is(.ilc-gray-caption,.ilc-logo-label,.ilc-logo-step-label,.ilc-space-caption,.ilc-app-tag,.ilc-type-role),.cnl :is(.cnl-gray-caption,.cnl-logo-label,.cnl-logo-step-label,.cnl-space-caption,.cnl-app-tag,.cnl-type-role),.bcnl :is(.bcnl-gray-caption,.bcnl-logo-label,.bcnl-logo-step-label,.bcnl-space-caption,.bcnl-app-tag,.bcnl-type-role),.ups :is(.ups-gray-caption,.ups-logo-label,.ups-logo-step-label,.ups-space-caption,.ups-app-tag,.ups-type-role),.jdc :is(.jdc-gray-caption,.jdc-logo-label,.jdc-logo-step-label,.jdc-space-caption,.jdc-app-tag,.jdc-type-role),.jsc :is(.jsc-gray-caption,.jsc-logo-label,.jsc-logo-step-label,.jsc-space-caption,.jsc-app-tag,.jsc-type-role){font-size:.72rem;line-height:1.5;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.jdc .jdc-type-role{text-transform:none;letter-spacing:.02em;font-weight:400;font-size:.9rem}
.oomc .oomc-hero-foot,.ilc .ilc-hero-foot,.cnl .cnl-hero-foot,.bcnl .bcnl-hero-foot,.ups .ups-hero-foot,.jdc .jdc-hero-foot,.jsc .jsc-hero-foot{text-align:left;align-items:flex-start}
.oomc .oomc-hero-body,.ilc .ilc-hero-body,.cnl .cnl-hero-body,.bcnl .bcnl-hero-body,.ups .ups-hero-body,.jdc .jdc-hero-body,.jsc .jsc-hero-body{text-align:left}
@media (max-width:640px){.oomc .oomc-big,.ilc .ilc-big,.cnl .cnl-big,.bcnl .bcnl-big,.ups .ups-big,.jdc .jdc-big,.jsc .jsc-big,.oomc .oomc-big-en,.oomc .oomc-big-kr{font-size:clamp(1.75rem,8.2vw,2.4rem)}.oomc .oomc-hero-big,.ilc .ilc-hero-big,.cnl .cnl-hero-big,.bcnl .bcnl-hero-big,.ups .ups-hero-big,.jdc .jdc-hero-big,.jsc .jsc-hero-big{font-size:clamp(2.2rem,10vw,3rem)}}
.oomc .oomc-color-band,.ilc .ilc-color-band,.cnl .cnl-color-band,.bcnl .bcnl-color-band,.ups .ups-color-band,.jdc .jdc-color-band,.jsc .jsc-color-band{display:flex;margin-left:var(--bleed);margin-right:var(--bleed);min-height:clamp(260px,32vw,440px);gap:0;border-radius:0}
.oomc .oomc-color-field,.ilc .ilc-color-field,.cnl .cnl-color-field,.bcnl .bcnl-color-field,.ups .ups-color-field,.jdc .jdc-color-field,.jsc .jsc-color-field{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:clamp(20px,2.6vw,32px);border-radius:0;min-height:0}
.oomc .oomc-color-field:first-child,.ilc .ilc-color-field:first-child,.cnl .cnl-color-field:first-child,.bcnl .bcnl-color-field:first-child,.ups .ups-color-field:first-child,.jdc .jdc-color-field:first-child,.jsc .jsc-color-field:first-child{flex-grow:1.8}
.oomc .oomc-color-en,.ilc .ilc-color-en,.cnl .cnl-color-en,.bcnl .bcnl-color-en,.ups .ups-color-en,.jdc .jdc-color-en,.jsc .jsc-color-en{font-size:clamp(.92rem,1.2vw,1.08rem);line-height:1.3;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.oomc .oomc-color-hex,.ilc .ilc-color-hex,.cnl .cnl-color-hex,.bcnl .bcnl-color-hex,.ups .ups-color-hex,.jdc .jdc-color-hex,.jsc .jsc-color-hex,.oomc .oomc-color-hex{font-size:.82rem;line-height:1.5;font-weight:400;letter-spacing:.03em;opacity:.72;font-variant-numeric:tabular-nums}
.oomc .oomc-gray-band,.ilc .ilc-gray-band,.cnl .cnl-gray-band,.bcnl .bcnl-gray-band,.ups .ups-gray-band,.jdc .jdc-gray-band,.jsc .jsc-gray-band{margin-left:var(--bleed);margin-right:var(--bleed);gap:0;min-height:clamp(28px,4vw,48px)}
.oomc .oomc-gray-caption,.ilc .ilc-gray-caption,.cnl .cnl-gray-caption,.bcnl .bcnl-gray-caption,.ups .ups-gray-caption,.jdc .jdc-gray-caption,.jsc .jsc-gray-caption{display:block;margin-top:14px}
@media (max-width:700px){.oomc .oomc-color-band,.ilc .ilc-color-band,.cnl .cnl-color-band,.bcnl .bcnl-color-band,.ups .ups-color-band,.jdc .jdc-color-band,.jsc .jsc-color-band{flex-direction:column;min-height:0}.oomc .oomc-color-field,.ilc .ilc-color-field,.cnl .cnl-color-field,.bcnl .bcnl-color-field,.ups .ups-color-field,.jdc .jdc-color-field,.jsc .jsc-color-field{min-height:120px;flex:none}}
.oomc .oomc-type-rows,.ilc .ilc-type-rows,.cnl .cnl-type-rows,.bcnl .bcnl-type-rows,.ups .ups-type-rows,.jdc .jdc-type-rows,.jsc .jsc-type-rows,.oomc .oomc-type-list{margin-top:clamp(48px,7vw,88px)}
.oomc .oomc-type-row,.ilc .ilc-type-row,.cnl .cnl-type-row,.bcnl .bcnl-type-row,.ups .ups-type-row,.jdc .jdc-type-row,.jsc .jsc-type-row,.oomc .oomc-type-row{display:grid;grid-template-columns:minmax(160px,220px) 1fr;gap:16px clamp(24px,4vw,56px);align-items:baseline;padding:clamp(28px,4vw,48px) 0;border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.oomc .oomc-type-name,.ilc .ilc-type-name,.cnl .cnl-type-name,.bcnl .bcnl-type-name,.ups .ups-type-name,.jdc .jdc-type-name,.jsc .jsc-type-name{font-size:.72rem;line-height:1.5;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.oomc .oomc-type-sample--en,.ilc .ilc-type-sample--en,.cnl .cnl-type-sample--en,.bcnl .bcnl-type-sample--en,.ups .ups-type-sample--en,.jdc .jdc-type-sample--en,.jsc .jsc-type-sample--en,.oomc .oomc-type-sample--en{font-size:clamp(2rem,4.6vw,3.8rem);line-height:1.1;letter-spacing:-.02em;font-weight:800;text-wrap:balance}
.oomc .oomc-type-sample--kr,.ilc .ilc-type-sample--kr,.cnl .cnl-type-sample--kr,.bcnl .bcnl-type-sample--kr,.ups .ups-type-sample--kr,.jdc .jdc-type-sample--kr,.jsc .jsc-type-sample--kr,.oomc .oomc-type-sample--kr{font-size:clamp(1.6rem,3.6vw,3rem);line-height:1.32;letter-spacing:-.02em;font-weight:700;text-wrap:balance}
.jdc .jdc-type-row{display:grid;grid-template-columns:1fr;gap:0;margin-top:clamp(48px,7vw,88px)}
.jdc .jdc-type-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,320px);gap:12px 40px;align-items:baseline;padding:clamp(28px,4vw,48px) 0;border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.jdc .jdc-type-name{font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:1.05;letter-spacing:-.02em}
@media (max-width:700px){.oomc .oomc-type-row,.ilc .ilc-type-row,.cnl .cnl-type-row,.bcnl .bcnl-type-row,.ups .ups-type-row,.jdc .jdc-type-row,.jsc .jsc-type-row,.oomc .oomc-type-row,.jdc .jdc-type-item{grid-template-columns:1fr}}
[data-pf=cover]>*{clip-path:inset(calc((1 - var(--pf-q,1))*100%) 0 0 0)}
[data-pf=cover]>*:nth-child(1){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.00)/.6),1)}
[data-pf=cover]>*:nth-child(2){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.07)/.6),1)}
[data-pf=cover]>*:nth-child(3){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.14)/.6),1)}
[data-pf=cover]>*:nth-child(4){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.21)/.6),1)}
[data-pf=cover]>*:nth-child(5){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.28)/.6),1)}
[data-pf=cover]>*:nth-child(6){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.35)/.6),1)}
[data-pf=cover]>*:nth-child(7){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.42)/.6),1)}
[data-pf=cover]>*:nth-child(8){--pf-q:clamp(0,calc((var(--pf-p,1) - 0.49)/.6),1)}
[data-pf=settle]{overflow:hidden}[data-pf=settle] img{transform:scale(calc(1.12 - .12*var(--pf-p,1)));transform-origin:50% 40%}
@media (prefers-reduced-motion: reduce){[data-pf=cover]>*{clip-path:none}[data-pf=settle] img{transform:none}}
.oomc>.oomc-scene08::after{content:"MOCKUP · 시그니처 적용"}
.oomc>.oomc-color-hero--cream::after{content:"MOCKUP · 컬러 적용"}
.ilc>.ilc-scene03::after{content:"MOCKUP · 로고 적용"}
.ilc>.ilc-scene05::after{content:"MOCKUP · 컬러 적용"}
.cnl>.cnl-scene04::after{content:"MOCKUP · 로고 적용"}
.cnl>.cnl-scene07::after{content:"MOCKUP · 컬러 적용"}
.bcnl>.bcnl-scene04::after{content:"MOCKUP · 로고 적용"}
.bcnl>.bcnl-scene06::after{content:"MOCKUP · 컬러 적용"}
.ups>.ups-scene04::after{content:"MOCKUP · 로고 적용"}
.ups>.ups-scene07::after{content:"MOCKUP · 컬러 적용"}
.jdc>.jdc-scene05::after{content:"MOCKUP · 로고타입 적용"}
.jdc>.jdc-scene06::after{content:"MOCKUP · 컬러 적용"}
.jsc>.jsc-scene05::after{content:"MOCKUP · 로고타입 적용"}
.jsc>.jsc-scene10::after{content:"MOCKUP · 컬러 적용"}
.oomc>.oomc-scene08,.oomc>.oomc-color-hero--cream,.ilc>.ilc-scene03,.ilc>.ilc-scene05,.cnl>.cnl-scene04,.cnl>.cnl-scene07,.bcnl>.bcnl-scene04,.bcnl>.bcnl-scene06,.ups>.ups-scene04,.ups>.ups-scene07,.jdc>.jdc-scene05,.jdc>.jdc-scene06,.jsc>.jsc-scene05,.jsc>.jsc-scene10{padding-bottom:0}
.oomc>.oomc-scene08::after,.oomc>.oomc-color-hero--cream::after,.ilc>.ilc-scene03::after,.ilc>.ilc-scene05::after,.cnl>.cnl-scene04::after,.cnl>.cnl-scene07::after,.bcnl>.bcnl-scene04::after,.bcnl>.bcnl-scene06::after,.ups>.ups-scene04::after,.ups>.ups-scene07::after,.jdc>.jdc-scene05::after,.jdc>.jdc-scene06::after,.jsc>.jsc-scene05::after,.jsc>.jsc-scene10::after{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;margin:clamp(64px,9vw,120px) var(--bleed) 0;background:color-mix(in srgb,currentColor 7%,transparent);font-size:.72rem;font-weight:700;letter-spacing:.14em;color:color-mix(in srgb,currentColor 46%,transparent)}
.oomc>.oomc-color-hero--cream::after{margin-left:0;margin-right:0}


/* v38 — 아이로컬 case study rebuild: scroll-run scenes driven by --p (0→1) and --vh (modal viewport). */
.ilc{--il-blue:#0070BD;--il-teal:#00A7AC;--il-green:#8CB835;--il-gray:#615F5F;--il-ink:#1E2A36;--il-soft:color-mix(in srgb,var(--il-ink) 70%,white)}
.works-modal-panel:has(.ilc),.works-modal-scroll:has(.ilc){background:#fff}
/* v35 placeholder slots are replaced by real material on this page */
.ilc>.ilc-scene03::after,.ilc>.ilc-scene05::after{content:none}
.ilc>.ilc-scene03,.ilc>.ilc-scene05{padding-bottom:clamp(88px,11vw,148px)}

.ilc-run{position:relative;margin-left:var(--bleed);margin-right:var(--bleed)}
.ilc-run-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden}
.ilc-paras{margin-top:clamp(18px,2.4vw,28px);display:flex;flex-direction:column;gap:14px}
.ilc-paras p{font-size:1.02rem;line-height:1.85;max-width:600px;color:var(--il-soft);word-break:keep-all;text-wrap:pretty}
.ilc-steplabel{position:absolute;left:var(--inset);bottom:clamp(24px,4vh,40px);z-index:5}
.ilc-steplabel span{position:absolute;left:0;bottom:0;white-space:nowrap;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--il-blue);
  opacity:clamp(0,min(calc((var(--p,0) - var(--a)) * 30),calc((var(--b) - var(--p,0)) * 30)),1)}
.ilc-steplabel span b{display:block;margin-top:6px;font-size:.95rem;letter-spacing:0;text-transform:none;font-weight:600;color:var(--il-ink)}

/* 01 */
.ilc-scene01 .ilc-paras{margin-top:clamp(28px,4vw,44px)}

/* 02 THE IDEA — one scene, three ways of seeing it */
.ilc-idea2{position:relative;margin:0 var(--bleed);display:grid}
.ilc-idea2-stage{grid-area:1/1;position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;background:#fff}
.ilc-idea2-track{grid-area:1/1}
.ilc-idea2-trigger{height:80vh}
.ilc-idea2-arc{position:absolute;border-radius:50%;border:clamp(28px,5vw,64px) solid var(--il-teal);opacity:.9;pointer-events:none;transition:transform 1.2s cubic-bezier(.16,.84,.44,1)}
.ilc-idea2-arc--a{width:clamp(220px,28vw,400px);aspect-ratio:1;left:calc(-1*clamp(120px,15vw,210px));top:calc(-1*clamp(120px,15vw,210px))}
.ilc-idea2-arc--b{width:clamp(260px,34vw,480px);aspect-ratio:1;right:calc(-1*clamp(130px,17vw,240px));bottom:-14%;border-color:var(--il-blue);opacity:.12}
.ilc-idea2-stage[data-step="1"] .ilc-idea2-arc--a{transform:translate(8%,6%)}
.ilc-idea2-stage[data-step="2"] .ilc-idea2-arc--a{transform:translate(16%,12%)}
.ilc-idea2-stage[data-step="1"] .ilc-idea2-arc--b{transform:translate(-6%,-6%)}
.ilc-idea2-stage[data-step="2"] .ilc-idea2-arc--b{transform:translate(-12%,-12%)}
.ilc-idea2-text{position:absolute;left:var(--inset);top:50%;width:min(420px,36%);z-index:4}
.ilc-idea2-word{position:absolute;left:0;top:0;transform:translateY(calc(-50% + 30px));opacity:0;transition:opacity .6s,transform .9s cubic-bezier(.16,.84,.44,1)}
.ilc-idea2-word.is-active{opacity:1;transform:translateY(-50%)}
.ilc-idea2-n{display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--il-teal);margin-bottom:16px}
.ilc-idea2-en{display:block;font-weight:900;font-size:clamp(2.2rem,4.6vw,4rem);line-height:1;letter-spacing:-.02em;color:var(--il-blue)}
.ilc-idea2-kr{display:block;margin-top:12px;font-size:clamp(1.05rem,1.5vw,1.25rem);font-weight:700;color:var(--il-ink)}
.ilc-idea2-body{margin-top:18px;font-size:.98rem;line-height:1.85;color:var(--il-soft);word-break:keep-all;text-wrap:pretty}
.ilc-idea2-els{display:block;margin-top:16px;font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--il-teal)}
.ilc-idea2-circles{position:absolute;left:43%;right:var(--inset);top:0;bottom:0}
.ilc-idea2-circle{position:absolute;top:50%;width:var(--d);aspect-ratio:1;margin-top:calc(var(--d)/-2);border-radius:50%;overflow:hidden;background-size:cover;background-position:center;
  --d:min(16.5vw,calc(var(--vh,100vh)*.36));transform:scale(.86);transition:transform 1s cubic-bezier(.16,.84,.44,1),filter .8s,box-shadow .8s;z-index:1}
.ilc-idea2-circle::after{content:"";position:absolute;inset:0;background:var(--il-teal);mix-blend-mode:multiply;opacity:.62;transition:opacity .8s}
.ilc-idea2-circle:nth-child(1){left:0}.ilc-idea2-circle:nth-child(2){left:calc(var(--d)*.72)}.ilc-idea2-circle:nth-child(3){left:calc(var(--d)*1.44)}
.ilc-idea2-circle.is-active{transform:scale(1.28);z-index:3;box-shadow:0 0 0 clamp(6px,.8vw,10px) #fff}
.ilc-idea2-circle.is-active::after{opacity:0}
.ilc-idea2-rail{position:absolute;right:var(--inset);bottom:clamp(24px,4vh,40px);display:flex;gap:12px;z-index:4}
.ilc-idea2-rail span{font-size:.72rem;font-weight:700;letter-spacing:.1em;color:var(--il-ink);opacity:.3;transition:opacity .4s}
.ilc-idea2-rail span.is-active{opacity:1;color:var(--il-blue)}

/* 03 LOGO — the grid draws itself around one logo, then leaves */
.ilc-logo-run{height:calc(var(--vh,100vh)*3.2)}
.ilc-logo-run .ilc-run-stage{background:#fff;display:flex;align-items:center;justify-content:center}
.ilc-logo-frame{position:relative;width:min(84vw,1080px);aspect-ratio:2100/560;
  opacity:clamp(0,calc(var(--p,1)*12),1);transform:scale(calc(.96 + .04*clamp(0,calc(var(--p,1)*10),1)))}
.ilc-logo-frame img{position:absolute;inset:0;width:100%;height:100%;display:block}
.ilc-logo-grid{position:absolute;inset:0;width:100%;height:100%;overflow:visible;opacity:calc(1 - clamp(0,calc((var(--p,1) - .82)/.12),1))}
.ilc-logo-grid line,.ilc-logo-grid circle{fill:none;stroke:var(--il-teal);stroke-width:1;vector-effect:non-scaling-stroke}
.ilc-logo-grid line{stroke-opacity:.75;stroke-dasharray:1;stroke-dashoffset:calc(1 - clamp(0,calc((var(--p,1) - var(--a))/(var(--b) - var(--a))),1))}
.ilc-logo-grid circle{fill:var(--il-teal);fill-opacity:.32;stroke:none;opacity:clamp(0,calc((var(--p,1) - var(--a))/(var(--b) - var(--a))),1)}
.ilc-logo-grid text{font-size:30px;font-weight:700;fill:var(--il-teal);opacity:clamp(0,calc((var(--p,1) - var(--a))/(var(--b) - var(--a))),1)}

/* 04 KEY VISUAL — poster → camera tour with depth → poster */
.ilc-kv-run{height:calc(var(--vh,100vh)*4.4)}
.ilc-kv-run .ilc-run-stage{background:#fff;display:flex;align-items:center;justify-content:center}
.ilc-kv-poster{position:relative;height:min(calc(var(--vh,100vh)*.86),calc(100vw*1.25));aspect-ratio:1700/2397;
  --z:calc(clamp(0,calc((var(--p,0) - .12)/.16),1) - clamp(0,calc((var(--p,0) - .8)/.14),1));
  --c:calc(.28 + .44*clamp(0,calc((var(--p,0) - .3)/.46),1));
  --h:calc(clamp(0,calc((var(--p,0) - .26)/.1),1) - clamp(0,calc((var(--p,0) - .72)/.1),1));
  transform:scale(calc(1 + 1.15*var(--z))) translate(calc(-25.2% * var(--z)),calc((.5 - var(--c))*100% * var(--z)));
  clip-path:inset(0 0 0 calc(50.3% * var(--z)));box-shadow:0 30px 60px -30px rgba(10,40,80,.35)}
.ilc-kv-poster img{position:absolute;inset:0;width:100%;height:100%;display:block}
.ilc-kv-full{opacity:calc(1 - clamp(0,calc((var(--p,0) - .2)/.06),1) + clamp(0,calc((var(--p,0) - .9)/.06),1))}
.ilc-kv-base,.ilc-kv-ill{opacity:calc(clamp(0,calc((var(--p,0) - .17)/.06),1) - clamp(0,calc((var(--p,0) - .92)/.06),1))}
.ilc-kv-ill{transform:translateY(calc(-1.3% * var(--h))) scale(calc(1 + .012*var(--h)));filter:drop-shadow(0 calc(10px*var(--h)) calc(8px*var(--h)) rgba(0,30,70,.28))}
.ilc-kv-spot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-100%);z-index:3;pointer-events:none;
  opacity:clamp(0,min(calc((var(--p,0) - var(--s) + .07)*16),calc((var(--s) + .07 - var(--p,0))*16)),1)}
.ilc-kv-spot span{display:block;padding:3px 6px;border-radius:20px;background:#fff;color:var(--il-blue);font-size:6px;font-weight:800;letter-spacing:.08em;white-space:nowrap;box-shadow:0 2px 6px rgba(0,40,90,.18)}
.ilc-kv-spot span b{font-weight:600;letter-spacing:0;color:var(--il-ink);margin-left:4px}
.ilc-kv-spot::after{content:"";display:block;width:1px;height:14px;margin:0 auto;background:#fff}

/* mockups */
.ilc-mock{margin:0 var(--bleed)}
.ilc-mock-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px clamp(20px,3vw,40px);padding:clamp(56px,7vw,96px) var(--inset) clamp(22px,3vw,32px)}
.ilc-mock-tag{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--il-blue);min-width:190px}
.ilc-mock-text{flex:1 1 320px;max-width:600px;font-size:.98rem;line-height:1.85;color:var(--il-soft);word-break:keep-all;text-wrap:pretty}
.ilc-mock-img{display:block;width:100%;height:auto}
.ilc-mock--settle{overflow:hidden}
.ilc-mock--settle .ilc-mock-img{transform:scale(calc(1.08 - .08*var(--p,1)))}
.ilc-zoom-run{height:calc(var(--vh,100vh)*2.2)}
.ilc-zoom-run .ilc-run-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--fx) var(--fy);
  transform-origin:var(--fx) var(--fy);transform:scale(calc(1 + .9*clamp(0,calc((var(--p,0) - .25)/.5),1)))}
.ilc-swap-run{height:calc(var(--vh,100vh)*2.4)}
.ilc-swap-run .ilc-run-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ilc-swap-run .ilc-swap-b{clip-path:inset(0 0 0 calc((1 - clamp(0,calc((var(--p,0) - .3)/.4),1))*100%))}
.ilc-swap-run .ilc-swap-a{transform:scale(calc(1 + .06*clamp(0,calc((var(--p,0) - .3)/.4),1)))}

/* zoom / swap runs keep the image's own ratio (no crop) and centre it in the viewport */
.ilc-mock--run{container-type:inline-size}
.ilc-mock .ilc-run{margin-left:0;margin-right:0}
.ilc-zoom-run .ilc-run-stage,.ilc-swap-run .ilc-run-stage{height:min(var(--vh,100vh),calc(100cqw*941/1672));top:calc((var(--vh,100vh) - min(var(--vh,100vh),calc(100cqw*941/1672)))/2)}
.ilc-scene05b{padding-top:clamp(36px,5vw,64px)!important}

/* 05 COLOR — equal fields regroup into the guide's area ratio */
.ilc-color-run{height:calc(var(--vh,100vh)*2.8)}
.ilc-color-run .ilc-run-stage{display:flex;flex-direction:column;background:#fff;--k:clamp(0,calc((var(--p,0) - .16)/.5),1)}
.ilc-color2-band{display:flex;flex:1 1 auto;min-height:0}
.ilc-color2-field{position:relative;flex-grow:calc(1 + (var(--f) - 1)*var(--k));flex-shrink:1;flex-basis:0;min-width:0;background:var(--c);color:var(--il-ink);overflow:hidden;
  display:flex;flex-direction:column;justify-content:space-between;padding:clamp(18px,2.4vw,32px) clamp(12px,1.8vw,26px)}
.ilc-color2-field.is-dark{color:#fff}
.ilc-color2-name{display:flex;flex-direction:column;gap:4px;opacity:calc(1 - var(--k)*var(--hide,0))}
.ilc-color2-en{font-size:clamp(.82rem,1.1vw,1rem);font-weight:800;letter-spacing:.04em;white-space:nowrap}
.ilc-color2-hex{font-size:.78rem;opacity:.75;font-variant-numeric:tabular-nums;white-space:nowrap}
.ilc-color2-share{font-weight:900;font-size:clamp(1.4rem,3.4vw,3rem);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;opacity:clamp(0,calc((var(--k) - .7)*4),1);white-space:nowrap}
.ilc-color2-field.is-small .ilc-color2-share{font-size:clamp(.78rem,1.2vw,1.05rem)}
.ilc-color2-legend{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px clamp(20px,3vw,40px);padding:clamp(22px,3vh,36px) var(--inset) clamp(26px,4vh,44px);
  opacity:clamp(0,calc((var(--p,0) - .62)*6),1);transform:translateY(calc(16px*(1 - clamp(0,calc((var(--p,0) - .62)*6),1))))}
.ilc-color2-role{font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--il-blue)}
.ilc-color2-role i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:-1px;font-style:normal}
.ilc-color2-desc{margin-top:8px;font-size:.88rem;line-height:1.7;color:var(--il-soft);word-break:keep-all}
.ilc-color2-desc b{display:block;color:var(--il-ink);font-size:.82rem;font-weight:700;margin-bottom:2px}
.ilc-color2-note{display:block;margin-top:clamp(16px,2vw,24px);font-size:.78rem;color:var(--il-soft)}

/* 07 APPLICATION */
.ilc-scene07b{padding-bottom:0}

/* CLOSING — brand blue, a white road, the logo at the end of it */
.ilc-end{position:relative;margin:0 var(--bleed);background:var(--il-blue);color:#fff;overflow:hidden;padding:clamp(110px,14vw,190px) var(--inset) 0}
.ilc-end-arc{position:absolute;border-radius:50%;border:clamp(34px,6vw,80px) solid var(--il-teal);pointer-events:none}
.ilc-end-arc--a{width:clamp(260px,36vw,520px);aspect-ratio:1;right:calc(-1*clamp(130px,18vw,260px));top:calc(-1*clamp(130px,18vw,260px))}
.ilc-end-arc--b{width:clamp(200px,26vw,380px);aspect-ratio:1;left:calc(-1*clamp(100px,13vw,190px));top:38%}
.ilc-end-isl{position:absolute;pointer-events:none;width:clamp(60px,8vw,120px)}
.ilc-end-isl--1{left:58%;top:16%}.ilc-end-isl--2{left:80%;top:46%;width:clamp(70px,9vw,140px)}
.ilc-end-bridge{position:absolute;pointer-events:none;width:clamp(150px,20vw,300px);left:62%;top:58%}
.ilc-end-text{position:relative;z-index:2;max-width:820px}
.ilc-end-en{font-weight:900;font-size:clamp(2.6rem,7.4vw,6.2rem);line-height:1.02;letter-spacing:-.025em;color:#fff}
.ilc-end-en span{display:block}
.ilc-end-kr{margin-top:clamp(20px,3vw,32px);font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.6;font-weight:600;color:rgba(255,255,255,.88)}
.ilc-end-road{position:relative;z-index:2;margin:clamp(90px,12vw,160px) calc(-1*var(--inset)) 0;background:#fff;border-radius:0 clamp(60px,8vw,120px) 0 0;
  padding:clamp(40px,6vw,80px) var(--inset);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ilc-end-logo{width:min(56vw,520px);display:block}
.ilc-end-meta{font-size:.78rem;line-height:1.6;color:var(--il-soft);text-align:left}
.ilc-end-meta b{display:block;color:var(--il-blue);font-weight:800;letter-spacing:.04em}

@media (max-width:860px){
  .ilc-idea2-text{top:auto;bottom:clamp(56px,9vh,90px);width:calc(100% - 2*var(--inset))}
  .ilc-idea2-word{top:auto;bottom:0;transform:translateY(30px)}
  .ilc-idea2-word.is-active{transform:none}
  .ilc-idea2-body{font-size:.9rem}
  .ilc-idea2-circles{left:var(--inset);top:8%;bottom:auto;height:42%}
  .ilc-idea2-circle{--d:min(30vw,22vh)}
  .ilc-idea2-circle:nth-child(1){left:calc(50% - var(--d)*1.22)}.ilc-idea2-circle:nth-child(2){left:calc(50% - var(--d)*.5)}.ilc-idea2-circle:nth-child(3){left:calc(50% + var(--d)*.22)}
  .ilc-color2-legend{grid-template-columns:1fr 1fr}
  .ilc-color2-desc{font-size:.8rem}
  .ilc-color2-field{padding:14px 8px}
  .ilc-color2-en{font-size:.7rem}
  .ilc-color2-field.is-small .ilc-color2-share{display:none}
  .ilc-end-isl,.ilc-end-bridge{display:none}
}
@media (prefers-reduced-motion: reduce){
  .ilc-run,.ilc-run .ilc-run-stage{--p:1}
  .ilc-kv-run .ilc-run-stage{--p:0}
  .ilc-idea2-word,.ilc-idea2-circle,.ilc-idea2-arc{transition:none!important}
}


/* v39 — 아이로컬: key visual from the illustration-only original; closing uses whole, uncropped elements. */
.ilc-kv-poster{aspect-ratio:1700/2404;clip-path:none;
  --c:calc(.22 + .56*clamp(0,calc((var(--p,0) - .3)/.46),1));
  transform:scale(calc(1 + 1.58*var(--z))) translate(0,calc((.5 - var(--c))*100% * var(--z)))}
.ilc-end-art{position:absolute;right:var(--inset);top:clamp(90px,12vw,160px);width:min(40%,480px);aspect-ratio:480/420;pointer-events:none;z-index:1}
.ilc-end-art img{position:absolute;display:block;height:auto}
.ilc-end-art .ilc-end-isl--1{left:22%;top:0;width:24%}
.ilc-end-art .ilc-end-isl--2{left:auto;right:0;top:6%;width:33%}
.ilc-end-art .ilc-end-bridge{left:0;top:auto;bottom:0;width:100%}
@media (max-width:860px){.ilc-end-art{display:none}}


.tkc{--tk-shield:url("/assets/portfolio/thekeeper/thekeeper_common_shield.svg")}
/* v40 — motion pass for the finished case studies. Every effect reads --mp (0→1) set by the
   mo-runtime only while the element is on screen; without the runtime --mp falls back to 1 (final state). */

/* ── THE KEEPER · 04 THE SYMBOL — the circle grows inside the shield, a ring closes in to guard it */
.tkc .tkc-scene04 .tkc-symbol-gif-wrap{display:block!important;position:relative;width:min(56vw,460px);aspect-ratio:567/518;margin:clamp(8px,2vw,24px) auto clamp(72px,9vw,120px);background:transparent;overflow:visible;
  --e:clamp(0,calc((var(--mp,1) - .05)/.6),1)}
.tkc .tkc-scene04 .tkc-symbol-gif{display:none}
.tkc .tkc-scene04 .tkc-symbol-gif-wrap::before{content:"";position:absolute;inset:0;background:var(--tk-shield) center/100% 100% no-repeat;
  opacity:clamp(0,calc(var(--mp,1)*4),1);transform:translateY(calc((1 - clamp(0,calc(var(--mp,1)*3),1))*6%))}
.tkc .tkc-scene04 .tkc-symbol-gif-wrap::after{content:"";position:absolute;left:50%;top:36.76%;width:58.7%;aspect-ratio:1;border-radius:50%;background:#ff4700;
  transform:translate(-50%,-50%) scale(calc(.06 + .94*clamp(0,calc((var(--mp,1) - .25)/.55),1)));
  box-shadow:0 0 0 calc(1px + 22px*(1 - clamp(0,calc((var(--mp,1) - .55)/.4),1))) rgba(255,71,0,calc(.5*clamp(0,calc((var(--mp,1) - .45)/.15),1)*(1 - clamp(0,calc((var(--mp,1) - .82)/.16),1))))}

/* ── THE KEEPER · 06 COLOR — the symbol's circle spreads until orange owns the screen */
.tkc .tkc-color-hero{background:radial-gradient(circle calc(2vmax + 120vmax*clamp(0,calc((var(--mp,1) - .05)/.75),1)) at 50% 46%,#ff4700 99.6%,#000 100%)!important}

/* ── I'M IN BUSAN · 08 FLEXIBLE IDENTITY — starts in Busan, travels the route to other cities */
.ibc .ibc-regions-row{position:relative;--k:clamp(0,calc((var(--mp,1) - .2)/.6),1)}
.ibc .ibc-regions-row>.ibc-region{position:relative;z-index:1}
.ibc .ibc-regions-row>.ibc-region:nth-child(1){z-index:3}
.ibc .ibc-regions-row>.ibc-region:nth-child(2){z-index:2}
.ibc .ibc-regions-row>.ibc-region:nth-child(2) .ibc-region-img{transform:translateX(calc((1 - var(--k))*-100%))}
.ibc .ibc-regions-row>.ibc-region:nth-child(3) .ibc-region-img{transform:translateX(calc((1 - clamp(0,calc((var(--mp,1) - .32)/.6),1))*-200%))}
.ibc .ibc-regions-row>.ibc-region:nth-child(n+2) .ibc-region-label{opacity:clamp(0,calc((var(--k) - .8)*5),1)}
.ibc .ibc-regions-row::before{content:"";position:absolute;left:16.6%;right:16.6%;top:-22px;height:2px;background:currentColor;opacity:.35;transform-origin:left center;transform:scaleX(var(--k))}
.ibc .ibc-regions-row::after{content:"";position:absolute;left:calc(16.6% - 5px);right:calc(16.6% - 5px);top:-26px;height:10px;
  background:radial-gradient(circle,currentColor 4px,transparent 5px) 0 0/10px 10px no-repeat,radial-gradient(circle,currentColor 4px,transparent 5px) 50% 0/10px 10px no-repeat,radial-gradient(circle,currentColor 4px,transparent 5px) 100% 0/10px 10px no-repeat;
  opacity:calc(.25 + .45*var(--k))}
/* 09 APPLICATION — sea, city and people move at different depths as they pass */
.ibc .ibc-scene09 .ibc-bleed-img{overflow:hidden}
.ibc .ibc-scene09 .ibc-bleed-img>img,.ibc .ibc-scene09 .ibc-bleed-img>video{transform:translateY(calc((.5 - var(--mp,.5))*7%)) scale(1.08)}

/* ── STARBOARD · 02 THE IDEA — six islands, one board moving forward, faster as it goes */
.sbc .sbc-motifs{container-type:inline-size;height:calc(var(--mvh,100vh)*3.1);position:relative}
.sbc .sbc-motifs-grid{position:sticky;top:calc((var(--mvh,100vh) - 34cqw)/2);display:flex!important;flex-wrap:nowrap;gap:2cqw;width:max-content;
  --q:clamp(0,calc((var(--mp,1) - .1)/.78),1);
  transform:translateX(calc(-1*(.25*var(--q) + .75*var(--q)*var(--q))*(6*30cqw + 5*2cqw - 100cqw)))}
.sbc .sbc-motifs-grid>.sbc-motif{flex:0 0 30cqw;width:30cqw}
/* 08 APPLICATION — scenes slide in sideways instead of rising */
.sbc .sbc-scene08 .sbc-imgwrap{overflow:hidden;clip-path:inset(0 0 0 calc((1 - clamp(0,calc((var(--mp,1) - .05)/.55),1))*100%))}
.sbc .sbc-scene08 .sbc-imgwrap img{transform:translateX(calc((1 - clamp(0,calc((var(--mp,1) - .05)/.7),1))*10%))}
.sbc .sbc-scene08 .sbc-app-col:nth-child(2){clip-path:inset(0 0 0 calc((1 - clamp(0,calc((var(--mp,1) - .2)/.55),1))*100%))}

/* ── MAJUON · 04 TANGRAM — the square's pieces become the circle; yellow switches on to green */
.mjc .mjc-motif-stage{--k:clamp(0,calc((var(--mp,1) - .3)/.5),1)}
.mjc .mjc-motif-stage::before{content:"";position:absolute;inset:-8%;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,color-mix(in srgb,#F8B100 calc(100% - var(--k)*100%),#7CCA4A) 0,transparent 68%);opacity:calc(.35*clamp(0,calc((var(--mp,1) - .15)/.2),1))}
.mjc .mjc-motif-stage .mjc-motif-shape--square{opacity:calc(1 - var(--k))!important;transform:rotate(calc(var(--k)*90deg)) scale(calc(1 - .18*var(--k)))}
.mjc .mjc-motif-stage .mjc-motif-shape--circle{opacity:var(--k)!important;transform:rotate(calc((1 - var(--k))*-90deg)) scale(calc(.82 + .18*var(--k)))}
/* 05 GRAPHIC ELEMENTS — one origin splits into three talents, each turning on the 90° rule */
.mjc .mjc-elements-row{--k:clamp(0,calc((var(--mp,1) - .1)/.65),1)}
.mjc .mjc-elements-row>.mjc-element-item:nth-child(1) .mjc-element-imgbox{transform:translateX(calc((1 - var(--k))*100%)) rotate(calc((1 - var(--k))*-90deg))}
.mjc .mjc-elements-row>.mjc-element-item:nth-child(2) .mjc-element-imgbox{transform:scale(calc(.7 + .3*var(--k)))}
.mjc .mjc-elements-row>.mjc-element-item:nth-child(3) .mjc-element-imgbox{transform:translateX(calc((1 - var(--k))*-100%)) rotate(calc((1 - var(--k))*90deg))}

/* ── BUKCHINEUN SONYEON · 04 THE SYMBOL — a quiet resonance spreads from the drum */
.bcsc .bcsc-symbol-stage{overflow:visible;isolation:isolate}
.bcsc .bcsc-symbol-stage::before{content:"";position:absolute;left:50%;top:55%;width:240%;aspect-ratio:1;z-index:-1;pointer-events:none;background:var(--bcs-blue-deep);
  -webkit-mask:var(--tx-rings) center/contain no-repeat;mask:var(--tx-rings) center/contain no-repeat;
  transform:translate(-50%,-50%) scale(calc(.35 + .9*var(--mp,.6)));opacity:calc(.5*(1 - .55*var(--mp,.6)))}
/* 08 + colour mockups — each picture is printed into view like a stamped, uneven disc */
.bcsc .bcsc-scene08 .bcsc-mock-img img,.bcsc .bcsc-mock-section .bcsc-mock-img img{
  -webkit-mask:var(--tx-disc) center/calc(20% + 330%*clamp(0,calc((var(--mp,1) - .05)/.7),1)) no-repeat;mask:var(--tx-disc) center/calc(20% + 330%*clamp(0,calc((var(--mp,1) - .05)/.7),1)) no-repeat}

/* existing reveal scale(1.045) pushed images a few px past the panel on phones — clip at the modal's own edge,
   never at the text column (clipping scenes hid the full-bleed images' outer edges) */
.works-modal-scroll{overflow-x:hidden}

@media (max-width:860px){
  .sbc .sbc-motifs-grid{top:calc((var(--mvh,100vh) - 62cqw)/2);gap:4cqw;transform:translateX(calc(-1*(.25*var(--q) + .75*var(--q)*var(--q))*(6*64cqw + 5*4cqw - 100cqw)))}
  .sbc .sbc-motifs-grid>.sbc-motif{flex:0 0 64cqw;width:64cqw}
  .sbc .sbc-motifs{height:calc(var(--mvh,100vh)*4)}
  .ibc .ibc-regions-row::before,.ibc .ibc-regions-row::after{display:none}
  .ibc .ibc-regions-row>.ibc-region:nth-child(n+2) .ibc-region-img{transform:translateY(calc((1 - var(--k))*-30%))}
}
@media (prefers-reduced-motion: reduce){
  [data-mo]{--mp:1!important}
  .sbc .sbc-motifs{height:auto}
  .sbc .sbc-motifs-grid{position:static;flex-wrap:wrap!important;width:auto;transform:none}
  .sbc .sbc-motifs-grid>.sbc-motif{flex:1 1 30%}
}


/* v41 — full-bleed audit. Text keeps its inset + max-width; images, video, patterns and colour
   reach the screen edges. Only containers/margins change — no content, order or ratio changes. */

/* The case-study modal keeps its original frame; images fill the modal edge to edge. */
/* scene-level horizontal clipping (v35) cut full-bleed visuals back to the text column — the modal edge clips instead */
.oomc>*,.ilc>*,.cnl>*,.bcnl>*,.ups>*,.jdc>*,.jsc>*,.bcsc>.bcsc-section{overflow-x:visible}
.works-modal-scroll{overflow-x:hidden}

/* I'M IN BUSAN · 09 — two-up and inset pictures left the text column */
.ibc .ibc-scene09 .ibc-app-twocol{margin-left:var(--bleed);margin-right:var(--bleed)}
.ibc .ibc-scene09 .ibc-app-inset{max-width:none;width:auto;margin-left:var(--bleed);margin-right:var(--bleed)}
.ibc .ibc-scene09 .ibc-app-inset img{display:block;width:100%;height:auto}

/* STARBOARD · 08 — two-up pictures span the full width (inner gap kept) */
.sbc .sbc-scene08 .sbc-app-twocol{margin-left:var(--bleed);margin-right:var(--bleed)}

/* STARBOARD · 05 — the type animation sits on pure black; match the panel so it reads as one field, not a card */
.sbc .sbc-type-panel--hello{background:#000}

/* THE KEEPER — the live-website mockup fills the modal edge to edge */
.tkc .tkc-visual-break:has(.tkc-web-live){padding:0!important}
.tkc .tkc-web-live{margin-left:0!important;margin-right:0!important;width:100%!important}
.tkc .tkc-web-stage-sticky{padding-left:0!important;padding-right:0!important}

/* Colour bars (북치는소년 06, 마주온 09–10) — colour is a visual, so it runs to the modal edges */
.bcsc .bcsc-color-bar{margin-left:var(--bleed);margin-right:var(--bleed)}
.mjc .mjc-ratio-bar{margin-left:var(--bleed);margin-right:var(--bleed)}

/* MAJUON — narrow mockup, mood grid and key visual go edge to edge; key visual no longer cropped */
.mjc .mjc-mockup-full--narrow{width:auto;margin-left:var(--bleed);margin-right:var(--bleed)}
.mjc .mjc-mood-grid{max-width:none;width:auto;margin-left:var(--bleed);margin-right:var(--bleed);grid-template-columns:repeat(3,minmax(0,1fr));justify-content:stretch}
.mjc .mjc-keyvisual-stage{width:auto;max-height:none;margin-left:var(--bleed);margin-right:var(--bleed);aspect-ratio:auto!important}
.mjc .mjc-keyvisual-stage img{height:auto;object-fit:contain}

/* I LOCAL · 04 — the illustration's own blue continues behind it, so no white bands at the start */
.ilc .ilc-kv-run .ilc-run-stage{background:#0A6AB2}

@media (max-width:860px){
  .mjc .mjc-mood-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* v42 — 장서 rebuilt. Brown, warm and quiet: full-bleed fields, inset text, slow motion tied to scroll. */
@property --draw{syntax:"<number>";inherits:true;initial-value:1}
@property --fill{syntax:"<number>";inherits:true;initial-value:1}
.works-modal-panel:has(.jsn){background:#EAE7DE}
.jsc.jsn{--j-off:#F4F3EE;--j-light:#EAE7DE;--j-mid:#DAD5C6;--j-beige:#D0B79C;--j-lbrown:#A5774C;--j-brown:#72513E;--j-deep:#4E3417;--j-dark:#2B1F14;
  --ease:cubic-bezier(.22,.61,.36,1);--slow:1.15s;background:var(--j-light);color:var(--j-deep);font-family:var(--font-js-body);word-break:keep-all}
.jsn section,.jsn .jsn-mock{margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset);position:relative}
.jsn .jsn-mock{padding:0}

/* type */
.jsn .jsn-tag{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,currentColor 62%,transparent);margin-bottom:clamp(20px,3vw,32px)}
.jsn .jsn-sub{display:block;font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:clamp(14px,2vw,22px)}
.jsn .jsn-h{font-weight:600;font-size:clamp(1.85rem,4.1vw,3.4rem);line-height:1.3;letter-spacing:-.025em;margin:0;max-width:16em}
.jsn .jsn-h--hero{font-size:clamp(2.2rem,5.4vw,4.4rem);line-height:1.22}
.jsn .jsn-h--m{font-size:clamp(1.45rem,2.7vw,2.25rem);line-height:1.4}
.jsn .jsn-body{font-size:1.02rem;line-height:1.9;max-width:560px;margin:clamp(20px,2.6vw,30px) 0 0;color:color-mix(in srgb,currentColor 76%,transparent);text-wrap:pretty}
.jsn .jsn-lead{font-size:.8rem;line-height:1.7;margin:18px 0 0;max-width:420px;color:color-mix(in srgb,currentColor 52%,transparent)}
.jsn .jsn-meta{margin:22px 0 0;font-size:.7rem;font-weight:600;letter-spacing:.16em;color:color-mix(in srgb,currentColor 52%,transparent)}
.jsn .jsn-cap{display:block;padding:14px var(--inset) 0;font-size:.72rem;letter-spacing:.06em;color:color-mix(in srgb,var(--j-deep) 55%,transparent)}
.jsn .jsn-cap--in{padding-left:0}
.jsn-ln{display:block;overflow:hidden;padding-bottom:.06em}
.jsn-ln>span{display:block;transform:translateY(108%);transition:transform var(--slow) var(--ease) calc(var(--i,0)*90ms)}
.jsn-rv.is-in .jsn-ln>span,.jsn-hero.is-in .jsn-ln>span,.jsn-closing .is-in .jsn-ln>span{transform:none}
.jsn-rv .jsn-body,.jsn-rv .jsn-meta{opacity:0;transform:translateY(14px);transition:opacity 1s var(--ease) .35s,transform 1.2s var(--ease) .35s}
.jsn-rv.is-in .jsn-body,.jsn-rv.is-in .jsn-meta{opacity:1;transform:none}

/* sticky runs */
.jsn .jsn-run{position:relative;height:calc(var(--vh,100vh)*(var(--n,1)*1.05 + .35));margin-left:calc(var(--inset)*-1);margin-right:calc(var(--inset)*-1)}
.jsn .jsn-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;padding:0 var(--inset)}
.jsn .jsn-head{padding:clamp(96px,12vw,150px) 0 clamp(40px,6vw,72px)}

/* hero */
.jsn-hero{background:var(--j-light);padding-top:clamp(28px,4vw,40px);padding-bottom:clamp(64px,9vw,112px)}
.jsn-hero-head{display:flex;justify-content:space-between;gap:16px;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--j-deep) 62%,transparent)}
.jsn-hero-stage{display:grid;place-items:center;padding:clamp(56px,9vw,120px) 0}
.jsn-hero-sym{width:clamp(150px,22vw,260px);color:var(--j-brown)}
.jsn-hero .jsn-hero-sym path:last-child{stroke-dashoffset:1;transform:rotate(-90deg);transform-box:fill-box;transform-origin:center;transition:stroke-dashoffset 1.9s cubic-bezier(.45,.05,.25,1)}
.jsn-hero .jsn-hero-sym path:not(:last-child){opacity:0;transform:translateY(3px);transform-box:fill-box;transition:opacity 1.3s var(--ease) 1.25s,transform 1.5s var(--ease) 1.25s}
.jsn-hero.is-in .jsn-hero-sym path:last-child{stroke-dashoffset:0}
.jsn-hero.is-in .jsn-hero-sym path:not(:last-child){opacity:1;transform:none}
.jsn-hero .jsn-body{opacity:0;transition:opacity 1.2s var(--ease) .9s}
.jsn-hero.is-in .jsn-body{opacity:1}

/* marks: outline is drawn first, then the form fills in — the stroke reads as the structure of the letter */
.jsn-mark{display:block;overflow:visible}
.jsn-mark--fill path{fill:currentColor;fill-opacity:var(--fill);stroke:currentColor;stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--draw));stroke-opacity:calc(var(--draw)*(1 - var(--fill)*.85))}
.jsn-mark--line path.s{fill:none;stroke:currentColor;stroke-width:5.86;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--draw))}
.jsn-mark--line path.f{fill:currentColor;fill-opacity:var(--fill)}

/* 01–02 story — one sticky frame; the ground deepens from statement to mission */
.jsn .jsn-story{padding:0;background:var(--j-off)}

.jsn-story-stage{display:grid;grid-template-columns:minmax(150px,1fr) 3fr;align-items:center;gap:clamp(24px,4vw,64px);background:var(--j-off);color:var(--j-deep);transition:background-color 1.4s var(--ease),color 1.2s var(--ease)}
.jsn-story[data-active="1"] .jsn-story-stage{background:var(--j-light)}
.jsn-story[data-active="2"] .jsn-story-stage{background:var(--j-beige)}
.jsn-story[data-active="3"] .jsn-story-stage{background:var(--j-brown);color:var(--j-off)}
.jsn-story-index{list-style:none;margin:0;padding:0;align-self:center;display:flex;flex-direction:column;gap:14px;border-left:1px solid color-mix(in srgb,currentColor 22%,transparent)}
.jsn-story-index li{font-size:.7rem;font-weight:600;letter-spacing:.14em;padding-left:16px;position:relative;opacity:.38;transition:opacity .9s var(--ease)}
.jsn-story-index li::before{content:"";position:absolute;left:-1px;top:-3px;bottom:-3px;width:1px;background:currentColor;transform:scaleY(0);transition:transform .9s var(--ease)}
.jsn-story-index li.is-active{opacity:1}.jsn-story-index li.is-active::before{transform:none}
.jsn-story-body{position:relative;height:min(560px,76%)}
.jsn-story-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none}
.jsn-story-step .jsn-tag,.jsn-story-step .jsn-sub,.jsn-story-step .jsn-body,.jsn-story-step .jsn-lead{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.jsn-story-step.is-past .jsn-tag,.jsn-story-step.is-past .jsn-sub,.jsn-story-step.is-past .jsn-body,.jsn-story-step.is-past .jsn-lead{transform:translateY(-16px)}
.jsn-story-step.is-active .jsn-tag,.jsn-story-step.is-active .jsn-sub{opacity:1;transform:none;transition-delay:.25s}
.jsn-story-step.is-active .jsn-body{opacity:1;transform:none;transition-delay:.55s}
.jsn-story-step.is-active .jsn-lead{opacity:1;transform:none;transition-delay:.75s}
.jsn-story-step .jsn-ln>span{transform:translateY(108%)}
.jsn-story-step.is-past .jsn-ln>span{transform:translateY(-108%);transition-duration:.9s;transition-delay:calc(var(--i)*50ms)}
.jsn-story-step.is-active .jsn-ln>span{transform:none;transition-delay:calc(.35s + var(--i)*110ms)}
.jsn-story-step.is-active{pointer-events:auto}
.jsn-rule{display:block;width:min(420px,60%);height:1px;margin-top:clamp(22px,3vw,32px);background:color-mix(in srgb,currentColor 35%,transparent);transform-origin:left;transform:scaleX(0);transition:transform 1.6s var(--ease)}
.jsn-story-step.is-active .jsn-rule{transform:scaleX(1);transition-delay:.5s}
.jsn-story-step .jsn-body{margin-top:clamp(18px,2.4vw,26px)}
.jsn-progress{position:absolute;left:var(--inset);right:var(--inset);bottom:clamp(22px,4vh,36px);height:1px;background:color-mix(in srgb,currentColor 14%,transparent)}
.jsn-progress i{position:absolute;inset:0;background:currentColor;opacity:.5;transform-origin:left;transform:scaleX(var(--p,0))}

/* 03 attitudes — one deep-brown field from the title to the third attitude */
.jsn-att{background:var(--j-deep);color:var(--j-light)}
.jsn-att .jsn-run{margin-left:calc(var(--inset)*-1);margin-right:calc(var(--inset)*-1)}
.jsn-att-stage{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:clamp(24px,5vw,80px)}
.jsn-att-words{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(6px,1.2vw,14px)}
.jsn-att-words li{position:relative;font-size:clamp(2.6rem,7.2vw,6rem);font-weight:300;letter-spacing:-.01em;line-height:1.08;color:color-mix(in srgb,var(--j-light) 20%,transparent);transition:color 1.1s var(--ease);width:max-content;max-width:100%}
.jsn-att-words li i{position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--j-beige);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.jsn-att-words li.is-active{color:var(--j-light)}.jsn-att-words li.is-active i{transform:scaleX(1);transition-delay:.3s}
.jsn-att-detail{position:relative;height:min(380px,60%)}
.jsn-att-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center}
.jsn-att-step .jsn-sub{color:var(--j-beige);opacity:0;transition:opacity .8s var(--ease)}
.jsn-att-step .jsn-body{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.jsn-att-step.is-active .jsn-sub{opacity:1;transition-delay:.3s}
.jsn-att-step.is-active .jsn-body{opacity:1;transform:none;transition-delay:.6s}
.jsn-att-step.is-past .jsn-ln>span{transform:translateY(-108%);transition-duration:.9s}
.jsn-att-step.is-active .jsn-ln>span{transform:none;transition-delay:.35s}
.jsn-att .jsn-body{color:color-mix(in srgb,var(--j-light) 74%,transparent)}

/* 04 visual principle — the width split into thirds, one square per third, lit one at a time */
.jsn-vp{background:var(--j-off)}
.jsn-vp-stage{display:flex;flex-direction:column;justify-content:center;padding:0}
.jsn-vp-thirds{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid color-mix(in srgb,var(--j-deep) 10%,transparent);border-bottom:1px solid color-mix(in srgb,var(--j-deep) 10%,transparent)}
.jsn-vp-third{position:relative;display:grid;place-items:center;padding:clamp(32px,7vh,72px) 0}
.jsn-vp-third+.jsn-vp-third{border-left:1px solid color-mix(in srgb,var(--j-deep) 10%,transparent)}
.jsn-vp-sq{position:relative;width:min(76%,52vh);aspect-ratio:1;background:var(--j-light);overflow:hidden;transition:background-color 1.2s var(--ease)}
.jsn-vp-pat{position:absolute;inset:0;background:var(--j-lbrown);-webkit-mask:var(--mod) 0 0/20% 20% repeat;mask:var(--mod) 0 0/20% 20% repeat;opacity:.12;transition:opacity 1.4s var(--ease)}
.jsn-vp-from{position:absolute;left:9%;top:9%;font-size:.66rem;font-weight:600;letter-spacing:.16em;color:color-mix(in srgb,var(--j-deep) 70%,transparent)}
.jsn-vp-k{position:absolute;left:9%;bottom:9%;font-size:clamp(1.15rem,2.3vw,2rem);font-weight:500;line-height:1.15;letter-spacing:-.01em}
.jsn-vp-from,.jsn-vp-k{opacity:.32;transition:opacity 1.1s var(--ease)}
.jsn-vp-k{background:color-mix(in srgb,var(--j-light) 0%,transparent)}
.jsn-vp-third.is-active .jsn-vp-sq{background:var(--j-mid)}
.jsn-vp-third.is-active .jsn-vp-pat{opacity:.42}
.jsn-vp-third.is-active .jsn-vp-from,.jsn-vp-third.is-active .jsn-vp-k{opacity:1}
.jsn-vp-count{display:none}

/* 05 logotype + 06 symbol — one place, the letterform redraws itself */
.jsn-logo{background:var(--j-light)}
.jsn-logo-stage,.jsn-sym-stage{display:grid;grid-template-rows:1fr auto;padding-bottom:clamp(36px,7vh,72px)}
.jsn-logo-marks{position:relative;align-self:stretch;container-type:inline-size;--h:clamp(84px,15vw,180px);--eh:min(calc(var(--h)*.72),calc(88cqw/7.33));color:var(--j-deep)}
.jsn-logo-mark{position:absolute;left:50%;bottom:calc(50% - var(--eh)/2);transform:translateX(-50%)}
.jsn-logo-mark--kr{height:var(--eh)}
.jsn-logo-mark--hj{height:var(--eh)}
.jsn-logo-mark--en{height:var(--eh)}
.jsn-logo-caps{position:relative;height:5.2em;max-width:560px}
.jsn-logo-cap{position:absolute;inset:0 auto auto 0;margin:0;font-size:.95rem;line-height:1.7;opacity:0;transform:translateY(10px);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.jsn-logo-cap b{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;margin-bottom:6px}
.jsn-logo-cap span{color:color-mix(in srgb,currentColor 72%,transparent)}
.jsn-logo-cap.is-active{opacity:1;transform:none;transition-delay:.2s}
.jsn-note{padding:clamp(28px,4vw,48px) 0 clamp(88px,11vw,140px);border-top:1px solid color-mix(in srgb,var(--j-deep) 14%,transparent)}
.jsn-note p{margin:0;max-width:620px;font-size:.92rem;line-height:1.85;color:color-mix(in srgb,var(--j-deep) 70%,transparent);opacity:0;transition:opacity 1.2s var(--ease)}
.jsn-note.is-in p{opacity:1}
.jsn-sym{background:var(--j-brown);color:var(--j-light)}
.jsn-sym-marks{position:relative;align-self:stretch}
.jsn-sym-mark{position:absolute;left:50%;top:50%;width:clamp(170px,26vw,320px);transform:translate(-50%,-50%);color:var(--j-light)}
.jsn-sym .jsn-sym-stage{padding-bottom:clamp(36px,7vh,72px)}

/* full-bleed mockups: the whole picture, opened from the centre as it arrives */
.jsn-mock{margin-top:0;margin-bottom:0;background:var(--j-light)}
.jsn-mock-img{position:relative;overflow:hidden}
.jsn-mock-img img{display:block;width:100%;height:100%;object-fit:cover}
.jsn-mock .jsn-cap{padding-bottom:clamp(56px,8vw,96px)}

/* 07 graphic system — a module is pressed; the field fills with that module, repeated */
.jsn-gs{background:var(--j-off)}
.jsn-gs-stage{display:grid;grid-template-columns:minmax(200px,26%) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center;padding-top:clamp(28px,5vh,56px);padding-bottom:clamp(28px,5vh,56px)}
.jsn-gs-side{display:flex;flex-direction:column;gap:clamp(20px,3vh,32px)}
.jsn-gs-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.jsn-gs-item{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid color-mix(in srgb,var(--j-deep) 14%,transparent);background:var(--j-off);
  transition:background-color .7s var(--ease),border-color .7s var(--ease),transform .5s var(--ease),box-shadow .5s var(--ease)}
.jsn-gs-thumb{display:block;aspect-ratio:1;background:color-mix(in srgb,var(--j-deep) 55%,transparent);-webkit-mask:var(--mod) center/100% 100% no-repeat;mask:var(--mod) center/100% 100% no-repeat;transition:background-color .7s var(--ease)}
.jsn-gs-label{font-size:.62rem;font-weight:700;letter-spacing:.12em;color:color-mix(in srgb,var(--j-deep) 60%,transparent);transition:color .7s var(--ease)}
.jsn-gs-item.is-active{background:var(--j-brown);border-color:var(--j-brown);transform:translateY(1px) scale(.97);box-shadow:inset 0 2px 6px rgba(43,31,20,.35)}
.jsn-gs-item.is-active .jsn-gs-thumb{background:var(--j-beige)}
.jsn-gs-item.is-active .jsn-gs-label{color:var(--j-light)}
.jsn-gs-texts{position:relative;min-height:7.5em}
.jsn-gs-text{position:absolute;inset:0 0 auto 0;margin:0;font-size:.92rem;line-height:1.8;color:color-mix(in srgb,var(--j-deep) 74%,transparent);opacity:0;transform:translateY(10px);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.jsn-gs-text b{display:block;font-size:.72rem;letter-spacing:.12em;color:var(--j-deep);margin-bottom:6px}
.jsn-gs-text.is-active{opacity:1;transform:none;transition-delay:.35s}
.jsn-gs-fieldwrap{position:relative;min-width:0;height:min(78%,680px);display:flex;align-items:center}
.jsn-gs-field{position:relative;width:100%;overflow:hidden;background:var(--j-light)}
.jsn-gs-layer{position:absolute;inset:0;background:var(--bg);clip-path:circle(0% at 50% 50%);z-index:1}
.jsn-gs-layer::before{content:"";position:absolute;inset:0;background:var(--ln);
  -webkit-mask:var(--mod) 0 0/calc(100%/var(--cols,8)) calc(100%/var(--rows,4)) repeat;mask:var(--mod) 0 0/calc(100%/var(--cols,8)) calc(100%/var(--rows,4)) repeat}
/* entering: the pressed module opens out from its button and settles into the full repeat */
.jsn-gs-layer.is-active{z-index:3;clip-path:circle(75% at 50% 50%);transition:clip-path 1.6s cubic-bezier(.45,0,.2,1)}
.jsn-gs-layer.is-under{z-index:2;clip-path:circle(75% at 50% 50%)}

/* 08 color */
.jsn-color{background:var(--j-off);padding-bottom:clamp(56px,8vw,96px)}
.jsn-color-band{display:flex;margin:0 calc(var(--inset)*-1);height:clamp(260px,34vw,420px)}
.jsn-color-f{flex:1;position:relative;background:var(--c);color:var(--j-deep);display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:clamp(12px,1.6vw,22px);
  clip-path:inset(calc((1 - clamp(0,(var(--e,1) - var(--i)*.06)*2.2,1))*100%) 0 0 0)}
.jsn-color-f.is-dark{color:var(--j-off)}
.jsn-color-f b{font-size:.78rem;letter-spacing:.06em}
.jsn-color-f span{font-size:.62rem;letter-spacing:.04em;opacity:.78}
.jsn-gray-band{display:flex;margin:0 calc(var(--inset)*-1);height:clamp(28px,4vw,44px)}
.jsn-gray-band i{flex:1;background:var(--c)}
.jsn-color .jsn-cap{padding-top:14px}

.jsn-img{background:var(--j-light);padding-bottom:clamp(96px,12vw,150px)}
.jsn-app{background:var(--j-light);padding-bottom:clamp(40px,6vw,72px)}
.jsn-mock:last-of-type{background:var(--j-light)}

/* closing */
.jsn-closing{background:var(--j-deep);color:var(--j-light);padding-top:clamp(96px,13vw,170px);padding-bottom:clamp(28px,4vw,40px)}
.jsn-closing-sym{margin-bottom:clamp(40px,6vw,72px)}
.jsn-closing-mark{width:clamp(64px,8vw,92px);color:var(--j-beige)}
.jsn-closing .jsn-body{color:color-mix(in srgb,var(--j-light) 70%,transparent)}
.jsn-closing-foot{display:flex;justify-content:space-between;gap:16px;margin-top:clamp(96px,13vw,170px);padding-top:18px;border-top:1px solid color-mix(in srgb,var(--j-light) 18%,transparent);font-size:.68rem;font-weight:600;letter-spacing:.14em;color:color-mix(in srgb,var(--j-light) 55%,transparent)}

/* phones */
@media (max-width:760px){
  .jsn .jsn-stage{padding-top:72px}
  .jsn-story-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-items:stretch;padding-top:72px}
  .jsn-story-index{flex-direction:row;flex-wrap:wrap;gap:6px 14px;border-left:0;border-bottom:1px solid color-mix(in srgb,currentColor 18%,transparent);padding-bottom:12px}
  .jsn-story-index li{padding-left:0}.jsn-story-index li::before{left:0;right:0;top:auto;bottom:-13px;width:auto;height:1px;transform:scaleX(0)}
  .jsn-story-index li.is-active::before{transform:none}
  .jsn-story-body{height:auto}
  .jsn-story .jsn-h{font-size:clamp(1.45rem,6.4vw,1.9rem)}
  .jsn-story .jsn-body{font-size:.92rem;line-height:1.8}
  .jsn-att-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-content:center;gap:28px}
  .jsn-att-words li{font-size:clamp(2rem,10vw,2.8rem)}
  .jsn-att-detail{height:15rem}
  .jsn-vp-thirds{display:block;position:relative;height:auto;border:0}
  .jsn-vp-third{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--ease)}
  .jsn-vp-third:first-child{position:relative}
  .jsn-vp-third+.jsn-vp-third{border:0}
  .jsn-vp-third.is-active{opacity:1}
  .jsn-vp-sq{width:min(78vw,52vh)}
  .jsn-vp-count{display:flex;justify-content:center;gap:8px;margin-top:22px}
  .jsn-vp-count i{width:18px;height:1px;background:var(--j-deep);opacity:.25;transition:opacity .6s,width .6s}
  .jsn-vp-count i.is-active{opacity:.85;width:32px}
  .jsn-logo-marks{--h:clamp(72px,22vw,120px)}
  .jsn-gs-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-items:stretch;gap:16px}
  .jsn-gs-list{grid-template-columns:repeat(4,1fr);gap:6px}
  .jsn-gs-item{padding:6px}.jsn-gs-label{font-size:.5rem;letter-spacing:.06em}
  .jsn-gs-texts{min-height:5.6em}
  .jsn-gs-fieldwrap{height:auto;min-height:0;align-self:stretch}
  .jsn-color-band{flex-wrap:wrap;height:auto}
  .jsn-color-f{flex:1 1 50%;min-height:120px}
}

/* reduced motion: every scene is laid out flat, every step visible */
@media (prefers-reduced-motion: reduce){
  .jsn .jsn-run{height:auto}
  .jsn .jsn-stage{position:relative;height:auto;overflow:visible;padding-top:24px;padding-bottom:64px}
  .jsn-story-stage,.jsn-att-stage,.jsn-gs-stage{display:block}
  .jsn-story-body,.jsn-att-detail{height:auto}
  .jsn-story-step,.jsn-att-step,.jsn-logo-cap,.jsn-gs-text{position:relative;inset:auto;margin-bottom:56px}
  .jsn-story-index,.jsn-progress,.jsn-vp-count{display:none}
  .jsn *{transition:none!important;animation:none!important}
  .jsn-ln>span,.jsn [class*="jsn-"]{opacity:1!important;transform:none!important}
  .jsn-vp-thirds{height:auto}.jsn-vp-third{position:relative;padding:24px 0}
  .jsn-vp-sq{width:min(80%,320px)}
  .jsn-logo-marks,.jsn-sym-marks{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-end;padding:40px 0}
  .jsn-logo-mark,.jsn-sym-mark{position:relative;left:auto;top:auto;bottom:auto;transform:none!important}
  .jsn-mark{--draw:1!important;--fill:1!important}
  .jsn-gs-fieldwrap{display:block;height:auto;margin-top:32px}
  .jsn-gs-list{max-width:420px;grid-template-columns:repeat(4,1fr)}
  .jsn-gs-item{background:var(--j-off)!important;border-color:color-mix(in srgb,var(--j-deep) 14%,transparent)!important;box-shadow:none!important}
  .jsn-gs-item .jsn-gs-thumb{background:color-mix(in srgb,var(--j-deep) 55%,transparent)!important}
  .jsn-gs-item .jsn-gs-label{color:color-mix(in srgb,var(--j-deep) 60%,transparent)!important}
  .jsn-gs-field{display:grid;gap:12px;width:100%!important;height:auto!important;overflow:visible;background:none}
  .jsn-gs-layer{position:relative;inset:auto;aspect-ratio:2/1;clip-path:none!important}
  .jsn-mock-img{clip-path:none}.jsn-mock-img img{transform:none}
  .jsn-color-f{clip-path:none}
}





/* v43 — 장례담: guide colours, logotype colour scene, typography scene, mockups through the page */
.jdc>.jdc-scene06::after{content:none;display:none}
.jdc{--jd-burgundy:#6C1F25;--jd-yellow:#E8D5B1;--jd-pink:#E1C2B3;--jd-navy:#091C2A}
.jdn{margin-left:var(--bleed);margin-right:var(--bleed);font-family:"Pretendard",var(--font-jd-body);word-break:keep-all;--ease:cubic-bezier(.22,.61,.36,1)}
.jdn .jdn-tag{display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:clamp(18px,2.6vw,28px);opacity:.72}

/* mockups — full width, natural ratio, no effect */
.jdn-mock{margin:0;background:var(--jd-offwhite)}
.jdn-mock-img{overflow:hidden}
.jdn-mock-img img{display:block;width:100%;height:100%;object-fit:cover}
.jdn-mock figcaption{padding:14px var(--inset) clamp(56px,8vw,96px);font-size:.72rem;letter-spacing:.06em;color:var(--jd-ink-faint)}

/* 05 logotype — one logo, one place; ground and logo colour move through the guide's palette */
.jdn-logo{position:relative;height:calc(var(--vh,100vh)*(var(--n)*1.05 + .35))}
.jdn-logo-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(40px,7vh,72px) var(--inset) clamp(28px,5vh,48px)}
.jdn-logo-bg{position:absolute;inset:0;background:var(--c);opacity:0;transition:opacity 1.4s var(--ease)}
.jdn-logo-bg.is-active,.jdn-logo-bg.is-past{opacity:1}
.jdn-logo-bg.is-active{z-index:1}.jdn-logo-bg.is-past{z-index:0}
.jdn-logo-top,.jdn-logo-mark-wrap,.jdn-logo-foot{position:relative;z-index:2}
.jdn-logo-top{color:var(--fg,#6C1F25);transition:color 1.4s var(--ease)}
.jdn-logo-lead{margin:0;font-size:1.02rem;line-height:1.8;opacity:.86}
.jdn-logo-mark-wrap{position:relative}
.jdn-logo-mark{position:absolute;left:50%;top:50%;width:min(64%,560px);aspect-ratio:2160/596;transform:translate(-50%,-50%);background:var(--c);
  -webkit-mask:url(/assets/portfolio/jangnyedam/jangnyedam_05-logotype_logo-mask.png) center/contain no-repeat;mask:url(/assets/portfolio/jangnyedam/jangnyedam_05-logotype_logo-mask.png) center/contain no-repeat;
  opacity:0;transition:opacity 1.4s var(--ease)}
.jdn-logo-mark.is-active,.jdn-logo-mark.is-past{opacity:1}
.jdn-logo-mark.is-active{z-index:1}
.jdn-logo-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.jdn-logo-caps{position:relative;height:4.4em;flex:1}
.jdn-logo-cap{position:absolute;left:0;bottom:0;margin:0;display:flex;flex-direction:column;gap:4px;font-size:.86rem;opacity:0;transform:translateY(8px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.jdn-logo-cap b{font-size:.68rem;letter-spacing:.14em}
.jdn-logo-cap em{font-style:normal;font-size:.7rem;letter-spacing:.08em;opacity:.7}
.jdn-logo-cap.is-active{opacity:1;transform:none;transition-delay:.35s}
.jdn-logo-dots{display:flex;gap:8px}
.jdn-logo-dots i{width:18px;height:1px;background:currentColor;opacity:.3;transition:opacity .6s,width .6s}
.jdn-logo-dots i.is-active{opacity:.9;width:34px}
/* text on the stage follows the active logo colour */
.jdn-logo[data-active="0"],.jdn-logo[data-active="2"]{--fg:#6C1F25}
.jdn-logo[data-active="1"],.jdn-logo[data-active="3"]{--fg:#E8D5B1}
.jdn-logo-foot{color:var(--fg,#6C1F25);transition:color 1.4s var(--ease)}

/* 07 type — one continuous typographic page: Korean hierarchy flows into the English one */
.jdn-type{background:var(--jd-navy);color:var(--jd-yellow);padding:clamp(96px,12vw,150px) var(--inset) clamp(96px,12vw,150px)}
.jdn-type-head{margin-bottom:clamp(56px,8vw,104px)}
.jdn-type-title{margin:0;font-weight:700;font-size:clamp(1.7rem,4.4vw,3.1rem);line-height:1.4;letter-spacing:-.01em}
.jdn-spec{display:grid;grid-template-columns:minmax(180px,1fr) 3fr;gap:clamp(24px,5vw,72px);padding-top:clamp(36px,5vw,56px);border-top:1px solid color-mix(in srgb,var(--jd-yellow) 22%,transparent)}
.jdn-spec-meta b{display:block;font-size:1.05rem;font-weight:700;letter-spacing:.01em}
.jdn-spec--en .jdn-spec-meta b{font-family:"Inter",sans-serif}
.jdn-spec-meta span{display:block;margin-top:4px;font-size:.72rem;letter-spacing:.12em;opacity:.62}
.jdn-spec-meta p{margin:18px 0 0;font-size:.84rem;line-height:1.85;opacity:.72;max-width:300px}
.jdn-spec-body>*{margin:0}
.jdn-spec--kr{--tf:"Pretendard Variable","Pretendard",sans-serif}
.jdn-spec--en{--tf:"Inter",sans-serif}
.jdn-spec-body{font-family:var(--tf)}
.jdn-t-title{font-size:clamp(2.6rem,7.6vw,6.4rem);line-height:1.1;letter-spacing:-.03em}
.jdn-t-light{display:block;font-weight:300}.jdn-t-bold{display:block;font-weight:calc(300 + 500*var(--e,1))}
.jdn-t-sub{margin-top:clamp(28px,4vw,44px)!important;font-size:clamp(1.2rem,2.2vw,1.7rem);font-weight:500;line-height:1.45;letter-spacing:-.01em;color:var(--jd-pink)}
.jdn-t-body{margin-top:16px!important;max-width:560px;font-size:1rem;line-height:1.85;font-weight:400;opacity:.8}
.jdn-t-glyphs{margin-top:clamp(32px,4vw,48px)!important;padding-top:18px;border-top:1px solid color-mix(in srgb,var(--jd-yellow) 16%,transparent);font-size:clamp(1.2rem,2.6vw,2.1rem);line-height:1.4;letter-spacing:.02em;font-weight:400;overflow-wrap:anywhere}
.jdn-t-glyphs p{margin:0}
.jdn-t-glyphs .jdn-w{white-space:normal;display:inline}
.jdn-t-num{font-weight:500;color:var(--jd-pink);font-variant-numeric:tabular-nums}
.jdn-weights{display:flex;flex-wrap:wrap;gap:12px clamp(24px,4vw,48px);margin-top:clamp(32px,4vw,48px)!important;padding-top:18px;border-top:1px solid color-mix(in srgb,var(--jd-yellow) 16%,transparent)}
.jdn-weights span{display:flex;flex-direction:column;gap:6px;font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.1;letter-spacing:-.01em}
.jdn-weights b{font-family:"Inter",sans-serif;font-size:.66rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;opacity:.6}
.jdn-bridge{display:flex;align-items:center;gap:clamp(14px,2vw,24px);margin:clamp(72px,10vw,128px) 0 clamp(40px,6vw,64px);font-size:.78rem;letter-spacing:.06em;opacity:.7}
.jdn-bridge i{flex:1;height:1px;background:currentColor;opacity:.35;transform-origin:left;transform:scaleX(0);transition:transform 1.6s var(--ease) .2s}
.jdn-bridge.is-in i{transform:none}
/* reveal: lines rise, blocks settle — no plain fades */
.jdn .jsn-rv:not(.jdn-type-head):not(.jdn-app-head){opacity:0;transform:translateY(18px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.jdn .jsn-rv.is-in:not(.jdn-type-head):not(.jdn-app-head){opacity:1;transform:none}
.jdn .jsn-rv .jsn-ln>span{transition-delay:calc(.15s + var(--i,0)*110ms)}

/* 08 application — the final scene: one representative picture, then what it is made of */
.jdn-app{background:var(--jd-offwhite)}
.jdn-app-head{padding:clamp(96px,12vw,150px) var(--inset) clamp(40px,6vw,64px);color:var(--jd-ink)}
.jdn-app-title{margin:0;font-weight:700;font-size:clamp(1.7rem,4.4vw,3.1rem);line-height:1.4;letter-spacing:-.01em}
.jdn-app .jdn-mock figcaption{padding-bottom:0}
.jdn-app-recap{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);padding:clamp(40px,6vw,64px) var(--inset) clamp(96px,12vw,150px);color:var(--jd-ink)}
.jdn-app-recap>div{display:flex;flex-direction:column;gap:10px;padding-top:16px;border-top:1px solid var(--jd-line)}
.jdn-app-recap b{font-family:"Inter",sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.14em}
.jdn-app-recap span{font-size:.92rem;line-height:1.7;color:var(--jd-ink-soft)}
.jdn-chips{display:flex;gap:6px}
.jdn-chips i{width:22px;height:22px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}

@media (max-width:760px){
  .jdn-logo-stage{padding-top:72px}
  .jdn-logo-mark{width:82%}
  .jdn-spec{grid-template-columns:1fr}
  .jdn-spec-meta p{max-width:none}
  .jdn-app-recap{grid-template-columns:1fr}
  .jdn-t-glyphs{font-size:1.05rem}
}
@media (prefers-reduced-motion: reduce){
  .jdn-logo{height:auto}
  .jdn-logo-stage{position:relative;height:auto;display:block;padding-bottom:40px}
  .jdn-logo-bg{display:none}
  .jdn-logo-mark-wrap{display:grid;gap:12px;margin:32px 0}
  .jdn-logo-mark{position:relative;left:auto;top:auto;transform:none;opacity:1;width:100%;max-width:none;height:auto;aspect-ratio:auto;padding:12%;background:none;-webkit-mask:none;mask:none}
  .jdn-logo-mark::before{content:"";display:block;aspect-ratio:2160/596;background:var(--c);-webkit-mask:url(/assets/portfolio/jangnyedam/jangnyedam_05-logotype_logo-mask.png) center/contain no-repeat;mask:url(/assets/portfolio/jangnyedam/jangnyedam_05-logotype_logo-mask.png) center/contain no-repeat}
  .jdn-logo-mark:nth-child(1){background:#E8D5B1}.jdn-logo-mark:nth-child(2){background:#6C1F25}.jdn-logo-mark:nth-child(3){background:#E1C2B3}.jdn-logo-mark:nth-child(4){background:#091C2A}
  .jdn-logo-caps{height:auto}.jdn-logo-cap{position:relative;opacity:1;transform:none;margin-bottom:12px}
  .jdn-logo-dots{display:none}
  .jdn *{transition:none!important}
  .jdn .jsn-rv,.jdn .jsn-ln>span{opacity:1!important;transform:none!important}
}

/* type in motion — letters set one by one, the Korean title tightens into place,
   'farewell' gains weight from Light to ExtraBold as it is read */
.jdn-ch{display:inline-block;opacity:0;transform:translateY(.45em);transition:opacity .7s var(--ease),transform .9s var(--ease);transition-delay:calc(.1s + var(--c,0)*45ms)}
.jdn-w{display:inline-block;white-space:nowrap}
.jsn-rv.is-in .jdn-ch{opacity:1;transform:none}
.jdn-t-glyphs .jdn-ch{transition-delay:calc(.05s + var(--c,0)*28ms)}
.jdn-weights span{opacity:0;transform:translateY(12px);transition:opacity .8s var(--ease),transform 1s var(--ease);transition-delay:calc(.2s + var(--d,0)*120ms)}
.jdn-weights.is-in span{opacity:1;transform:none}
.jdn-weights span{position:relative;padding-bottom:10px}
.jdn-weights span::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;opacity:.35;transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease);transition-delay:calc(.5s + var(--d,0)*120ms)}
.jdn-weights.is-in span::after{transform:none}
@media (prefers-reduced-motion: reduce){
  .jdn-ch,.jdn-weights span{opacity:1!important;transform:none!important}
  .jdn-t-bold{font-weight:800}
}



/* v44 — UPside: UP (grow upward from a baseline) + SIDE (extend sideways, connect) as the only motion language */
.works-modal-panel:has(.upn){background:#fff}
.ups.upn{--blue:#023F97;--green:#4FD977;--ink:#131A23;--line:#3FD6E6;--ease:cubic-bezier(.2,.75,.25,1);--slow:1s;
  background:#fff;color:var(--ink);font-family:"Pretendard",var(--font-body);word-break:keep-all}
.upn section,.upn .upn-mock{margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset);position:relative}
.upn .upn-mock{padding:0}

/* type — one scale for the whole page */
.upn .upn-tag{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:clamp(20px,3vw,32px)}
.upn .upn-h{margin:0;font-family:"Montserrat",var(--font-display);font-weight:800;font-size:clamp(2.5rem,6.4vw,5.4rem);line-height:1.02;letter-spacing:-.025em;color:var(--blue)}
.upn .upn-h--kr{font-family:"Pretendard",sans-serif;font-size:clamp(2.2rem,5.2vw,4.3rem);line-height:1.18;letter-spacing:-.03em}
.upn .upn-kr{margin:0;font-weight:700;font-size:clamp(1.15rem,2.2vw,1.6rem);line-height:1.45;letter-spacing:-.01em}
.upn .upn-body{margin:22px 0 0;max-width:560px;font-size:1.02rem;line-height:1.85;color:color-mix(in srgb,var(--ink) 74%,transparent)}
.upn .upn-meta{display:block;margin-top:22px;font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--blue)}
.upn .upn-cap,.upn .upn-mock figcaption{margin:0;padding:14px var(--inset) 0;font-size:.72rem;font-weight:600;letter-spacing:.08em;color:color-mix(in srgb,var(--ink) 55%,transparent)}
.upn .upn-mock figcaption{padding-bottom:clamp(56px,8vw,96px)}
.upn .upn-cap{padding-left:0}
/* the bold rule: it extends sideways once the heading has risen */
.upn .upn-rule{display:block;width:72px;height:6px;margin:clamp(22px,3vw,30px) 0;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) .45s}
.upn .jsn-rv.is-in .upn-rule{transform:none}
.upn .upn-head{padding:clamp(96px,12vw,150px) 0 clamp(40px,6vw,72px)}
.upn .upn-head .upn-kr{color:var(--ink)}
.upn .jsn-ln>span{transition-duration:.95s;transition-timing-function:var(--ease)}

/* logo: the original artwork split by colour — UP rises from its baseline, side extends from its left edge */
.upn-logo{position:relative;display:block;aspect-ratio:2219/454}
.upn-logo img{position:absolute;inset:0;width:100%;height:100%}
.upn-logo-up{clip-path:inset(100% 0 0 0);transition:clip-path .9s var(--ease)}
.upn-logo-side{clip-path:inset(0 100% 0 0);transition:clip-path 1s var(--ease) .6s}
.jsn-rv.is-in .upn-logo-up,.jsn-rv.is-in .upn-logo-side{clip-path:inset(0 0 0 0)}

/* sticky runs */
.upn .jsn-run{height:calc(var(--vh,100vh)*(var(--n,1)*1.0 + .4));padding:0}
.upn .upn-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;padding:0 var(--inset)}
.upn .upn-steps{position:absolute;right:var(--inset);bottom:clamp(24px,4vh,40px);display:flex;gap:6px;z-index:5}
.upn .upn-steps i{width:16px;height:4px;background:currentColor;opacity:.22;transition:opacity .5s,width .5s var(--ease)}
.upn .upn-steps i.is-active{opacity:.9;width:36px}

/* hero */
.upn-hero{padding-top:clamp(28px,4vw,40px);padding-bottom:clamp(72px,10vw,120px)}
.upn-hero-head{display:flex;justify-content:space-between;gap:16px;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.upn-hero-head a{color:inherit;text-decoration:none}
.upn-hero-stage{padding:clamp(72px,12vw,150px) 0 clamp(56px,8vw,96px)}
.upn-logo--hero{width:min(100%,920px)}

/* 01 the name */
.upn-name-stage{color:var(--ink)}
.upn-name-tag{position:absolute;left:var(--inset);top:clamp(40px,8vh,72px);z-index:3}
.upn-name-grid{position:absolute;inset:0;pointer-events:none}
.upn-name-grid i{position:absolute;inset:-4% -12%}
/* thin, close lines: the slant of the logo going up, horizontals going across */
.upn-name-grid .gv{background:repeating-linear-gradient(108.43deg,transparent 0 calc(44px - 1px),color-mix(in srgb,var(--line) 75%,transparent) 0 44px);clip-path:inset(100% 0 0 0);transition:clip-path 1.2s var(--ease)}
.upn-name-grid .gh{background:repeating-linear-gradient(180deg,transparent 0 calc(40px - 1px),color-mix(in srgb,var(--line) 75%,transparent) 0 40px);clip-path:inset(0 100% 0 0);transition:clip-path 1.2s var(--ease) .1s}
.upn-name:not([data-active="0"]) .upn-name-grid .gv{clip-path:inset(0 0 0 0)}
.upn-name:not([data-active="0"]):not([data-active="1"]) .upn-name-grid .gh{clip-path:inset(0 0 0 0)}
.upn-name-words{position:absolute;left:var(--inset);right:var(--inset);top:22%;bottom:22%;font-size:clamp(3.6rem,12vw,9.5rem)}
.upn-word{position:absolute;left:0;top:calc(50% - .48em);display:flex;flex-direction:column;gap:.12em;transition:transform 1.1s var(--ease),opacity .7s var(--ease),font-size 1.1s var(--ease)}
.upn-word b{font-family:"Montserrat",sans-serif;font-weight:800;line-height:.86;letter-spacing:-.03em}
.upn-word span{font-size:max(.95rem,.13em);font-weight:700;letter-spacing:.02em;transition:opacity .6s}
.upn-word--up{color:var(--blue)}
.upn-word--side{color:var(--green)}
/* default (also the reduced-motion state) = the name assembled */
.upn-word{opacity:0}
.upn-name[data-active="0"] .upn-word--up{opacity:1;transform:translate(0,-70%) scale(.62);transform-origin:0 0}
.upn-name[data-active="0"] .upn-word--side{opacity:1;transform:translate(0,55%) scale(.62);transform-origin:0 0;left:52%}
.upn-name[data-active="1"] .upn-word--up{opacity:1;transform:none;transform-origin:0 0}
.upn-name[data-active="1"] .upn-word--side{opacity:.28;transform:translate(0,55%) scale(.62);transform-origin:0 0;left:52%}
.upn-name[data-active="2"] .upn-word--up{opacity:1;transform:none;transform-origin:0 0}
.upn-name[data-active="2"] .upn-word--side{opacity:1;transform:translateX(1.62em);transform-origin:0 0;left:0}
.upn-name[data-active="2"] .upn-word span,.upn-name[data-active="1"] .upn-word--side span{opacity:0}
.upn-name-up{display:none;position:absolute;left:-.32em;top:-.02em;width:.1em;height:.86em;background:var(--blue);transform-origin:50% 100%;transform:skewX(-18.43deg) scaleY(0);transition:transform 1s var(--ease) .15s}
.upn-name-side{position:absolute;left:0;top:calc(50% + .5em);width:4.1em;height:.1em;background:var(--green);transform-origin:0 50%;transform:scaleX(0);transition:transform 1s var(--ease) .25s}
.upn-name[data-active="1"] .upn-name-up,.upn-name[data-active="2"] .upn-name-up{transform:skewX(-18.43deg) scaleY(1)}
.upn-name[data-active="2"] .upn-name-side{transform:scaleX(1)}
.upn-logo--name{position:absolute;left:0;top:50%;width:min(100%,960px);transform:translateY(-50%)}
.upn-name:not([data-active]) .upn-logo--name img{clip-path:none}
.upn-name[data-active] .upn-logo--name .upn-logo-up{clip-path:inset(100% 0 0 0)}
.upn-name[data-active] .upn-logo--name .upn-logo-side{clip-path:inset(0 100% 0 0)}
.upn-name[data-active="3"] .upn-logo--name .upn-logo-up,.upn-name[data-active="3"] .upn-logo--name .upn-logo-side{clip-path:inset(0 0 0 0)}
.upn-name-caps{position:absolute;left:var(--inset);right:calc(var(--inset) + 140px);bottom:clamp(24px,4vh,40px);height:4.6em}
.upn-name-cap{position:absolute;left:0;bottom:0;margin:0;max-width:520px;display:flex;flex-direction:column;gap:6px;font-size:.95rem;line-height:1.6;opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .9s var(--ease)}
.upn-name-cap b{font-family:"Montserrat",sans-serif;font-size:.74rem;font-weight:800;letter-spacing:.12em;color:var(--blue)}
.upn-name-cap.is-active{opacity:1;transform:none;transition-delay:.3s}
.upn-name:not([data-active]) .upn-name-cap:last-child{opacity:1;transform:none}

/* 02 the attitude — each keyword arrives with its own field: Growth rises, Supportive extends, Professional does both */
.upn-att-wrap{padding-bottom:0}
.upn-att-stage{color:#fff;transition:color .8s var(--ease)}
.upn-att[data-active="1"] .upn-att-stage,.upn-att[data-active="2"] .upn-att-stage{color:var(--blue)}
.upn-att-field{position:absolute;inset:0;transition:transform 1.15s var(--ease)}
.upn-att-field--0{background:var(--blue);transform-origin:50% 100%;transform:scaleY(0)}
.upn-att-field--1{background:var(--green);transform-origin:0 50%;transform:scaleX(0)}
.upn-att-field--2{background:#fff linear-gradient(transparent calc(100% - 3px),color-mix(in srgb,var(--line) 70%,transparent) 0) 0 0/100% 25%;transform-origin:0 50%;transform:scaleX(0)}
.upn-att-field--2::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(108.43deg,transparent 0 calc(12.5% - 3px),color-mix(in srgb,var(--line) 70%,transparent) 0 12.5%)}
.upn-att-field.is-active,.upn-att-field.is-past{transform:none}
.upn-att-field--0.is-active,.upn-att-field--0.is-past{transform:scaleY(1)}
.upn-att-field--1.is-active,.upn-att-field--1.is-past{transform:scaleX(1)}
.upn-att-field--2.is-active{transform:scaleX(1)}
.upn-att-word{position:absolute;left:var(--inset);top:30%;z-index:3;max-width:calc(100% - 2*var(--inset));transform-origin:0 0;transition:transform 1.1s var(--ease),opacity .8s var(--ease),top 1.1s var(--ease)}
.upn-att-word b{display:block;font-family:"Montserrat",sans-serif;font-weight:800;font-size:clamp(3.2rem,10vw,8.4rem);line-height:.95;letter-spacing:-.03em}
.upn-att-word p{margin:clamp(18px,2.6vw,28px) 0 0;max-width:460px;font-size:clamp(1.05rem,1.8vw,1.35rem);font-weight:700;line-height:1.5;transition:opacity .6s var(--ease)}
.upn-att-from{display:block;margin-bottom:14px;font-family:"Montserrat",sans-serif;font-size:.72rem;font-weight:800;letter-spacing:.14em;transition:opacity .6s}
/* past keywords shrink into a trail at the top and stay connected by a bar */
.upn-att-word.is-next{opacity:0;transform:translateY(40%)}
.upn-att-word.is-past{top:clamp(40px,8vh,72px);transform:scale(.22);opacity:.9}
.upn-att-word.is-past p,.upn-att-word.is-past .upn-att-from{opacity:0}
.upn-att-word--1.is-past{transform:translateX(calc(clamp(3.2rem,10vw,8.4rem)*5*.22)) scale(.22)}
.upn-att-word--1.is-active{transform:none}
.upn-att-link{position:absolute;left:var(--inset);top:calc(clamp(40px,8vh,72px) + clamp(3.2rem,10vw,8.4rem)*.22 + 10px);height:4px;width:calc(clamp(3.2rem,10vw,8.4rem)*7.4*.22);background:currentColor;z-index:3;transform-origin:0 50%;transform:scaleX(0);transition:transform 1s var(--ease) .3s}
.upn-att[data-active="1"] .upn-att-link{transform:scaleX(.42)}
.upn-att[data-active="2"] .upn-att-link{transform:scaleX(1)}

/* 03 visual principle — each principle: a corner that rises then extends */
.upn-vp-row{display:flex;flex-wrap:wrap;gap:16px clamp(28px,5vw,64px);margin-top:clamp(36px,5vw,56px)}
.upn-vp-row span{display:flex;align-items:flex-end;gap:12px;font-family:"Montserrat",sans-serif;font-weight:800;font-size:clamp(1.05rem,1.8vw,1.4rem);color:var(--blue)}
.upn-vp-row i{position:relative;width:22px;height:22px;flex:0 0 auto}
.upn-vp-row i::before,.upn-vp-row i::after{content:"";position:absolute;left:0;bottom:0;background:var(--green)}
.upn-vp-row i::before{width:6px;height:100%;transform-origin:50% 100%;transform:scaleY(0);transition:transform .7s var(--ease) calc(.4s + var(--d)*.18s)}
.upn-vp-row i::after{height:6px;width:100%;transform-origin:0 50%;transform:scaleX(0);transition:transform .7s var(--ease) calc(.75s + var(--d)*.18s)}
.upn-vp-row.is-in i::before,.upn-vp-row.is-in i::after{transform:none}
.upn-vp{padding-bottom:clamp(72px,10vw,120px)}

/* 04 the logo built on its grid, 05 the arrow on the same grid — scrubbed by scroll (--p) */
.upn-logo-sec,.upn-arrow-sec,.upn-gridsec,.upn-app{padding-bottom:0}
.upn-build-stage,.upn-arrow-stage{display:grid;grid-template-rows:1fr auto;padding-bottom:clamp(28px,5vh,48px)}
.upn-build-art{position:relative;align-self:center;justify-self:center;width:min(100%,calc(var(--vh,100vh)*1.4));aspect-ratio:2/1}
.upn-grid{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.upn-arrow-art{position:relative;align-self:center;height:auto;max-height:78%}
.upn-grid .g{fill:none;stroke:var(--line);stroke-width:2.6;stroke-dasharray:1;stroke-dashoffset:calc(1 - clamp(0,(var(--p,1) - var(--s,0))/.12,1))}
.upn-grid .g.key{stroke:var(--blue);stroke-width:4.5}
.upn-build .upn-grid .g{opacity:calc(1 - .8*clamp(0,(var(--p,1) - .8)/.15,1))}
.upn-build .upn-grid .g.key{opacity:calc(1 - .55*clamp(0,(var(--p,1) - .8)/.15,1))}
.upn-logo--build{position:absolute;left:8.333%;top:32.95%;width:83.333%}
.upn-build .upn-logo--build .upn-logo-up{transition:none;clip-path:inset(calc((1 - clamp(0,(var(--p,1) - .4)/.2,1))*100%) 0 0 0)}
.upn-build .upn-logo--build .upn-logo-side{transition:none;clip-path:inset(0 calc((1 - clamp(0,(var(--p,1) - .6)/.2,1))*100%) 0 0)}
.upn-build-caps{position:relative;height:1.6em;font-family:"Montserrat",sans-serif;font-size:.78rem;font-weight:800;letter-spacing:.12em;color:var(--blue)}
.upn-build-caps span{position:absolute;left:0;bottom:0;opacity:clamp(0,min(calc((var(--p,1) - var(--a))*30),calc((var(--b) - var(--p,1))*30)),1);transform:translateY(calc((1 - clamp(0,(var(--p,1) - var(--a))*30,1))*10px))}
.upn-build-note{position:absolute;right:var(--inset);bottom:clamp(28px,5vh,48px);max-width:380px;margin:0;font-size:.86rem;line-height:1.75;color:color-mix(in srgb,var(--ink) 66%,transparent);opacity:clamp(0,(var(--p,1) - .82)*8,1)}
.upn-arrow .ar,.upn-arrow .ah{transform-box:fill-box}
.upn-arrow .ar-up{fill:var(--blue);transform-origin:50% 100%;transform:scaleY(clamp(0,(var(--p,1) - .18)/.18,1))}
.upn-arrow .ah-up{fill:var(--blue);transform-origin:50% 100%;transform:scale(clamp(0,(var(--p,1) - .34)/.08,1))}
.upn-arrow .ar-side{fill:var(--green);transform-origin:0 50%;transform:scaleX(clamp(0,(var(--p,1) - .45)/.18,1))}
.upn-arrow .ah-side{fill:var(--green);transform-origin:0 50%;transform:scale(clamp(0,(var(--p,1) - .61)/.08,1))}
.upn-arrow .al{font-family:"Montserrat",sans-serif;font-weight:800;font-size:76px;letter-spacing:-.02em}
.upn-arrow .al-up{fill:var(--blue);opacity:clamp(0,(var(--p,1) - .38)*10,1)}
.upn-arrow .al-side{fill:var(--green);opacity:clamp(0,(var(--p,1) - .65)*10,1)}
.upn-arrow .g{opacity:calc(.55 + .45*clamp(0,(var(--p,1) - .72)/.2,1))}

/* full-width pictures rise into place from their baseline — no zoom */
.upn-mock{margin:0;background:#fff}
.upn-mock-img{overflow:hidden;clip-path:inset(calc((1 - clamp(0,var(--e,1)*1.25,1))*16%) 0 0 0)}
.upn-mock-img img{display:block;width:100%;height:100%;object-fit:cover}

/* 07 color — equal fields, equal type, the same entrance */
.upn-color{padding-bottom:clamp(56px,8vw,96px)}
.upn-color-band{display:grid;grid-template-columns:1fr 1fr;margin:0 calc(var(--inset)*-1);height:clamp(300px,40vw,520px)}
.upn-color-f{position:relative;background:var(--c);color:var(--ink);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(16px,2.4vw,32px);
  clip-path:inset(calc((1 - clamp(0,var(--e,1)*1.5,1))*100%) 0 0 0)}
.upn-color-f.is-dark{color:#fff}
.upn-color-n{display:flex;flex-direction:column;gap:6px;font-size:.86rem;font-weight:600}
.upn-color-n b,.upn-color-v b{font-family:"Montserrat",sans-serif;font-size:clamp(1rem,1.6vw,1.3rem);font-weight:800;letter-spacing:.02em}
.upn-color-v{display:flex;flex-direction:column;gap:4px;font-size:.78rem;line-height:1.6;letter-spacing:.03em}
.upn-gray{display:flex;margin:0 calc(var(--inset)*-1);height:clamp(32px,4vw,48px);clip-path:inset(0 calc((1 - clamp(0,(var(--e,1) - .25)*1.6,1))*100%) 0 0)}
.upn-gray i{flex:1;background:var(--c)}

/* 08 key visual on a full-width blue field */
.upn-kv{padding-bottom:0}
.upn-kv-field{margin:0 calc(var(--inset)*-1);padding:clamp(40px,7vw,96px) 0;background:var(--blue);display:grid;place-items:center;overflow:hidden}
.upn-kv-field img{display:block;width:min(78%,72vh,820px);height:auto;transform:translateY(calc((1 - clamp(0,var(--e,1)*1.2,1))*48px));clip-path:inset(calc((1 - clamp(0,var(--e,1)*1.2,1))*16%) 0 0 0)}
.upn-kv + .upn-mock{margin-top:0}

/* 10 type */
.upn-type{padding-bottom:clamp(96px,12vw,150px)}
.upn-type-rows{display:flex;flex-direction:column}
.upn-type-row{display:grid;grid-template-columns:minmax(150px,1fr) 3fr;gap:clamp(20px,4vw,56px);padding:clamp(24px,3.6vw,40px) 0;position:relative}
.upn-type-row::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--blue);transform-origin:0 50%;transform:scaleX(0);transition:transform 1s var(--ease)}
.upn-type-row.is-in::before{transform:none}
.upn-type-name{font-family:"Montserrat",sans-serif;font-weight:800;font-size:.86rem;letter-spacing:.06em;color:var(--blue)}
.upn-type-row p{margin:0;font-size:clamp(1.4rem,3vw,2.4rem);line-height:1.28;letter-spacing:-.02em;transform:translateY(24px);opacity:0;transition:transform 1s var(--ease) .2s,opacity .8s var(--ease) .2s}
.upn-type-row.is-in p{transform:none;opacity:1}
.upn-type-en{font-family:"Montserrat",sans-serif;font-weight:800}
.upn-type-ko{font-weight:700}

/* closing */
.upn-closing{background:var(--blue);color:#fff;padding-top:clamp(96px,13vw,170px);padding-bottom:clamp(28px,4vw,40px)}
.upn-closing .upn-h{color:#fff}
.upn-closing .upn-kr{color:#fff;opacity:.9}
.upn-logo--closing{width:min(100%,640px);margin-top:clamp(56px,8vw,96px)}
.upn-closing-link{display:inline-block;margin-top:28px;color:var(--green);font-weight:700;font-size:.86rem;text-decoration:none}
.upn-closing-foot{display:flex;justify-content:space-between;gap:16px;margin-top:clamp(96px,13vw,170px);padding-top:18px;border-top:3px solid color-mix(in srgb,#fff 22%,transparent);font-size:.68rem;font-weight:700;letter-spacing:.12em;color:color-mix(in srgb,#fff 70%,transparent)}

@media (max-width:760px){
  .upn .upn-stage{padding-top:64px}
  .upn-name-words{top:24%;bottom:30%;font-size:clamp(3rem,17vw,5rem)}
  .upn-name-caps{right:var(--inset);bottom:64px}
  .upn-att-word{top:34%}
  .upn-build-note{position:static;margin-top:12px;max-width:none}
  .upn-type-row{grid-template-columns:1fr}
  .upn-kv-field img{width:min(86%,64vh)}
}
@media (prefers-reduced-motion: reduce){
  .upn .jsn-run{height:auto}
  .upn .upn-stage{position:relative;height:auto;min-height:0;overflow:visible;padding-top:24px;padding-bottom:72px}
  .upn *{transition:none!important}
  .upn .jsn-ln>span,.upn .upn-rule,.upn .upn-type-row p,.upn .upn-type-row::before{transform:none!important;opacity:1!important}
  .upn-logo-up,.upn-logo-side{clip-path:none!important}
  .upn-name-stage{min-height:70vh}
  .upn-name-grid .gv,.upn-name-grid .gh{clip-path:none}
  .upn-name-caps{position:relative;left:auto;right:auto;bottom:auto;height:auto;margin-top:60vh}
  .upn-name-cap{position:relative;opacity:1;transform:none;margin-bottom:18px}
  .upn-att-stage{display:flex;flex-direction:column;gap:48px;color:var(--blue)}
  .upn-att-field,.upn-att-link,.upn .upn-steps{display:none}
  .upn-att-word{position:relative;left:auto;top:auto;transform:none!important;opacity:1!important}
  .upn-att-word p,.upn-att-from{opacity:1!important}
  .upn-mock-img,.upn-color-f,.upn-gray,.upn-kv-field img{clip-path:none!important;transform:none!important}
}



/* v45 — OUR OLD MILL: still, modern and editorial on top of the mill's rough surfaces */
.works-modal-panel:has(.oon),.works-modal-panel:has(.oon) .works-modal-scroll{background:#F3F3F1!important}
.oomc.oon{--green:#1B4628;--beige:#F6EEDA;--off:#F3F3F1;--ink:#1B4628;--soft:color-mix(in srgb,var(--ink) 72%,transparent);--ease:cubic-bezier(.22,.61,.36,1);
  background:var(--off);color:var(--ink);font-family:"Pretendard",var(--font-body);word-break:keep-all}
.oon section,.oon .oon-ph,.oon .oon-duo,.oon .oon-gray{margin-left:var(--bleed);margin-right:var(--bleed);position:relative}
.oon section{padding-left:var(--inset);padding-right:var(--inset)}

/* type */
.oon .oon-tag{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;margin-bottom:clamp(20px,3vw,32px);color:var(--soft)}
.oon .oon-h{margin:0;font-weight:600;font-size:clamp(2rem,4.6vw,3.8rem);line-height:1.16;letter-spacing:-.035em}
.oon .oon-h--hero{font-size:clamp(2.3rem,5.4vw,4.6rem)}
.oon .oon-kr{margin:clamp(18px,2.4vw,26px) 0 0;max-width:560px;font-size:1.1rem;font-weight:500;line-height:1.7}
.oon .oon-body{margin:16px 0 0;max-width:540px;font-size:1rem;line-height:1.9;color:var(--soft)}
.oon .oon-meta{margin:20px 0 0;font-size:.7rem;font-weight:700;letter-spacing:.16em;color:var(--soft)}
.oon .oon-cap,.oon figcaption{margin:0;padding:14px var(--inset) 0;font-size:.72rem;letter-spacing:.06em;color:var(--soft)}
.oon .oon-cap--pad{padding-bottom:clamp(64px,9vw,110px)}
.oon .oon-head{padding:clamp(96px,12vw,150px) 0 clamp(48px,7vw,88px)}
.oon .oon-sec--tight{padding-bottom:0}
.oon .oon-sec--tight .oon-head{padding-bottom:clamp(24px,4vw,48px)}
.oon .jsn-rv:not(.oon-head):not(.oon-hero-body){opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.oon .jsn-rv.is-in:not(.oon-head):not(.oon-hero-body){opacity:1;transform:none}
.oon .oon-head .oon-kr,.oon .oon-head .oon-meta,.oon .oon-hero-body .oon-body{opacity:0;transition:opacity 1.1s var(--ease) .4s}
.oon .is-in .oon-kr,.oon .is-in .oon-meta,.oon .oon-hero-body.is-in .oon-body{opacity:1}

/* sticky runs */
.oon .jsn-run{height:calc(var(--vh,100vh)*(var(--n,1)*1.05 + .4));padding:0}
.oon .oon-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;padding:0 var(--inset)}

/* marks — the original artwork; no box behind any logo */
.oon .jsn-mark--line path.s{stroke-width:6.08}
.oon .jsn-mark--fill path{stroke-width:1.2}
.oon-mark{display:block;color:var(--green)}
.oon-marks{position:relative;align-self:stretch}
.oon-marks .oon-mark{position:absolute;left:50%;top:50%;width:min(64%,560px);transform:translate(-50%,-50%)}
.oon-caps{position:relative;height:1.6em}
.oon-capline{position:absolute;left:0;bottom:0;margin:0;font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--soft);opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.oon-capline.is-active{opacity:1;transform:none;transition-delay:.3s}

/* hero */
.oon-hero{padding-top:clamp(28px,4vw,40px);padding-bottom:0}
.oon-hero-head{display:flex;justify-content:space-between;gap:16px;font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--soft)}
.oon-hero-body{padding:clamp(88px,13vw,170px) 0 clamp(24px,4vw,48px)}
.oon-intro-stage,.oon-logo-stage{display:grid;grid-template-rows:1fr auto;padding-bottom:clamp(32px,6vh,56px)}
.oon .oon-intro .oon-stage{background:transparent}

/* 01–03 story: an old photograph in black and white, colour returns, then the new room */
.oon .oon-story-stage{padding:0;color:#F6EEDA}
.oon-story-ph{position:absolute;inset:0}
.oon-story-ph img{width:100%;height:100%;object-fit:cover;display:block}
.oon-story-ph--old img{filter:grayscale(1) brightness(.78) contrast(1.05);transform:scale(1.04);transition:filter 1.6s var(--ease),transform 2.4s var(--ease)}
.oon-story[data-active="1"] .oon-story-ph--old img,.oon-story[data-active="2"] .oon-story-ph--old img{filter:grayscale(.1) brightness(.82);transform:none}
.oon-story-ph--new{clip-path:inset(100% 0 0 0);transition:clip-path 1.6s cubic-bezier(.65,0,.25,1)}
.oon-story-ph--new.is-active,.oon-story:not([data-active]) .oon-story-ph--new{clip-path:inset(0 0 0 0)}
.oon-story-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,22,15,.78) 0,rgba(12,22,15,.5) 42%,rgba(12,22,15,0) 78%)}
.oon-story-text{position:absolute;left:var(--inset);right:var(--inset);top:0;bottom:0}
.oon-story-step{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:min(560px,90%)}
.oon-story-step .oon-tag{color:color-mix(in srgb,#F6EEDA 70%,transparent)}
.oon-story-step .oon-body{color:color-mix(in srgb,#F6EEDA 82%,transparent)}
.oon-story-step .oon-tag,.oon-story-step .oon-kr,.oon-story-step .oon-body{opacity:0;transition:opacity .8s var(--ease)}
.oon-story-step .jsn-ln>span{transform:translateY(108%)}
.oon-story-step.is-past .jsn-ln>span{transform:translateY(-108%);transition-duration:.9s}
.oon-story-step.is-active .jsn-ln>span{transform:none;transition-delay:calc(.3s + var(--i)*110ms)}
.oon-story-step.is-active .oon-tag,.oon-story-step.is-active .oon-kr{opacity:1;transition-delay:.3s}
.oon-story-step.is-active .oon-body{opacity:1;transition-delay:.6s}
.oon-story-line{position:absolute;right:var(--inset);top:20%;bottom:20%;width:1px;background:color-mix(in srgb,#F6EEDA 25%,transparent)}
.oon-story-line i{position:absolute;inset:0;background:#F6EEDA;transform-origin:top;transform:scaleY(var(--p,1))}

/* photographs: full width, pushed to one edge, or a pair at different sizes and heights */
.oon-ph{margin-top:0;margin-bottom:0}
.oon-ph img,.oon-duo img{display:block;width:100%;height:auto;object-fit:cover}
.oon-ph--full img{clip-path:inset(calc((1 - clamp(0,var(--e,1)*1.3,1))*10%) 0 0 0)}
.oon-ph--full figcaption{padding-bottom:clamp(64px,9vw,110px)}
.oon-ph--edge{width:min(64%,760px);padding-bottom:clamp(64px,9vw,110px)}
.oon .oon-ph--right{margin-left:auto}
.oon-ph--edge img{transform:translateY(calc((1 - clamp(0,var(--e,1),1))*60px))}
.oon-ph--right figcaption{padding-left:0}
.oon-duo{display:grid;grid-template-columns:58% 1fr;gap:clamp(16px,3vw,40px);align-items:start;padding-bottom:clamp(64px,9vw,110px)}
.oon-duo-a,.oon-duo-b{margin:0}
.oon-duo-b{margin-top:clamp(80px,18vh,200px);margin-right:var(--inset);transform:translateY(calc((1 - clamp(0,var(--e,1),1))*140px))}
.oon-duo .oon-cap{grid-column:2;padding:0 var(--inset) 0 0}

/* 04 attitudes, 05 */
.oon-sec{padding-bottom:clamp(64px,9vw,110px)}
.oon-sec > .oon-head{padding-bottom:0}
.oon-att{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(40px,6vw,64px);border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.oon-att div{padding:20px 20px 0 0;display:flex;flex-direction:column;gap:8px}
.oon-att b{font-size:clamp(1.3rem,2.4vw,2rem);font-weight:600;letter-spacing:-.02em}
.oon-att span{font-size:.92rem;color:var(--soft)}

/* 07 symbol: drawn once, large, on the page */
.oon-symbol-art{padding:clamp(40px,7vw,96px) 0 clamp(24px,4vw,40px)}
.oon-mark--draw{width:min(90%,820px);margin:0 auto}
.oon-symbol-art .jsn-mark--line path.s{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s cubic-bezier(.45,.05,.25,1)}
.oon-symbol-art .jsn-mark--line path.s:nth-child(2){transition-delay:.35s}.oon-symbol-art .jsn-mark--line path.s:nth-child(3){transition-delay:.7s}
.oon-symbol-art.is-in .jsn-mark--line path.s{stroke-dashoffset:0}

/* 08 signature: the symbol opens into the building it came from (scrubbed by --p) */
.oon .oon-sig-stage{padding:0;--sw:min(46vw,520px);--q:clamp(0,(var(--p,1) - .28)/.6,1);--k:calc(1 + 14*var(--q)*var(--q))}
.oon-sig-photo{position:absolute;inset:0;opacity:clamp(0,(var(--p,1) - .12)*6,1)}
.oon-sig-photo img{width:100%;height:100%;object-fit:cover;display:block}
.oon-sig-lines{position:absolute;left:50%;top:50%;width:calc(var(--sw)*1.012);transform:translate(-50%,-50%) scale(var(--k));opacity:calc(1 - clamp(0,(var(--p,1) - .42)/.3,1))}
.oon-sig-lines .jsn-mark--line path.s{vector-effect:non-scaling-stroke;stroke-width:2px;stroke-dasharray:none}
.oon-sig-word{position:absolute;left:50%;top:calc(50% + var(--sw)*.29);width:calc(var(--sw)*1.02);transform:translateX(-50%);opacity:clamp(0,1 - (var(--p,1) - .08)*7,1)}
.oon-sig-cap{position:absolute;left:var(--inset);bottom:clamp(28px,5vh,48px);margin:0;font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--soft);opacity:clamp(0,1 - (var(--p,1) - .5)*4,1)}
.oon-sig .oon-sig-lines .oon-mark{color:var(--green)}

/* 09 color: equal fields, then the share each colour takes; each sits on a surface of the mill */
.oon .oon-color-stage{padding:0;display:flex;--q:clamp(0,(var(--p,1) - .2)/.6,1)}
.oon-cf{position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:clamp(18px,3vw,40px)}
.oon-cf--beige{flex:calc(1 + .86*var(--q)) 1 0;background:var(--beige);color:var(--green)}
.oon-cf--green{flex:calc(1 - .46*var(--q)) 1 0;background:var(--green);color:var(--beige)}
.oon-cf-tex{position:absolute;inset:0;background-size:cover;background-position:center;filter:grayscale(1) contrast(1.1);mix-blend-mode:multiply;opacity:.16}
.oon-cf--green .oon-cf-tex{mix-blend-mode:soft-light;opacity:.5}
.oon-cf-l{position:relative;display:flex;flex-direction:column;gap:6px;font-size:.78rem;letter-spacing:.06em}
.oon-cf-l b{font-size:clamp(1.1rem,2vw,1.6rem);font-weight:600;letter-spacing:-.01em}
.oon-gray{display:flex;height:clamp(28px,4vw,44px);clip-path:inset(0 calc((1 - clamp(0,var(--e,1)*1.4,1))*100%) 0 0)}
.oon-gray i{flex:1;background:var(--c)}

/* 10 type, 11 */
.oon-type{margin-top:clamp(40px,6vw,64px);padding-top:24px;border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.oon-type-kr{margin:0;font-size:clamp(1.3rem,2.6vw,2.1rem);font-weight:600;line-height:1.7;letter-spacing:-.05em;max-width:880px}
.oon-type-en{margin:24px 0 0;font-size:clamp(1.2rem,2.4vw,1.9rem);font-weight:500;line-height:1.25;letter-spacing:-.05em;max-width:880px}
.oon-type-meta{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:28px;font-size:.78rem;color:var(--soft)}
.oon-type-meta b{display:block;font-size:.66rem;letter-spacing:.14em;margin-bottom:4px;color:var(--ink)}
.oon-rules{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(40px,6vw,64px);border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent);padding-top:18px}
.oon-rules span{display:flex;flex-direction:column;gap:6px;font-size:.88rem;color:var(--soft)}
.oon-rules b{font-size:.72rem;letter-spacing:.12em;color:var(--ink)}

/* closing */
.oon-closing{padding-top:clamp(110px,14vw,180px);padding-bottom:clamp(28px,4vw,40px)}
.oon-closing-mark{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(16px,2vw,24px);margin-top:clamp(72px,10vw,120px)}
.oon-mark--close{width:min(48%,340px)}
.oon-mark--closeword{width:min(48%,340px)}
.oon-closing-foot{display:flex;justify-content:space-between;gap:16px;margin-top:clamp(96px,13vw,160px);padding-top:18px;border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent);font-size:.68rem;font-weight:700;letter-spacing:.14em;color:var(--soft)}

/* posters */
.oon .oon-poster-stage{padding:0;container-type:inline-size;--H:min(calc(var(--vh,100vh)*.62),860px);--pw:calc(var(--H)*.707);--gap:clamp(20px,3.4vw,48px);
  --tw:calc(5*var(--pw) + 4*var(--gap) + 2*var(--inset) + 34cqw)}
.oon-poster-head{position:absolute;left:var(--inset);top:clamp(40px,8vh,72px);z-index:2;max-width:360px}
.oon-poster-head .oon-kr{margin-top:0;font-size:.95rem}
.oon-poster-track{position:absolute;left:0;top:calc(var(--vh,100vh)*.16);bottom:calc(var(--vh,100vh)*.04);display:flex;align-items:center;gap:var(--gap);padding-left:calc(var(--inset) + 34cqw);
  transform:translateX(calc(-1*clamp(0,(var(--p,1) - .04)/.9,1)*(var(--tw) - 100cqw)))}
.oon-poster-item{flex:0 0 var(--pw);margin:0;box-shadow:0 30px 60px -30px rgba(27,70,40,.45)}
.oon-poster-item img{display:block;width:100%;height:auto}
.oon-poster-item--2{transform:translateY(-7%)}.oon-poster-item--3{transform:translateY(6%)}.oon-poster-item--4{transform:translateY(-4%)}.oon-poster-item--5{transform:translateY(8%)}
.oon-poster-count{position:absolute;left:var(--inset);right:var(--inset);bottom:clamp(24px,4vh,40px);height:1px;background:color-mix(in srgb,var(--ink) 18%,transparent)}
.oon-poster-count i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(var(--p,1))}

@media (max-width:760px){
  .oon .oon-poster-stage{--H:calc(var(--vh,100vh)*.58)}
  .oon-poster-head{top:72px}
  .oon .oon-stage{padding-top:64px}
  .oon .oon-story-stage,.oon .oon-sig-stage,.oon .oon-color-stage{padding-top:0}
  .oon-marks .oon-mark{width:86%}
  .oon-story-scrim{background:linear-gradient(0deg,rgba(12,22,15,.82) 0,rgba(12,22,15,.55) 55%,rgba(12,22,15,.15) 100%)}
  .oon-story-step{top:auto;bottom:clamp(48px,8vh,72px);transform:none}
  .oon-ph--edge{width:86%}
  .oon-duo{grid-template-columns:1fr}
  .oon-duo-b{width:68%;margin-left:auto;margin-top:-18vh;position:relative}
  .oon-duo .oon-cap{grid-column:1;padding-left:var(--inset)}
  .oon-sig-stage{--sw:72vw}
  .oon-color-stage{flex-direction:column}
  .oon-att,.oon-rules{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion: reduce){
  .oon .jsn-run{height:auto}
  .oon .oon-stage{position:relative;height:auto;min-height:70vh;overflow:hidden}
  .oon *{transition:none!important}
  .oon .jsn-rv,.oon .jsn-ln>span,.oon .oon-kr,.oon .oon-body,.oon .oon-meta,.oon-capline{opacity:1!important;transform:none!important}
  .oon-story-stage{min-height:0}.oon-story-ph--new{display:none}
  .oon-story-text{position:relative;inset:auto;padding:80px var(--inset)}
  .oon-story-step{position:relative;top:auto;transform:none;margin-bottom:56px}
  .oon-story-step .oon-tag,.oon-story-step .oon-kr,.oon-story-step .oon-body{opacity:1}
  .oon-marks{display:flex;flex-direction:column;gap:40px;align-items:center;padding:60px 0}
  .oon-marks .oon-mark{position:relative;left:auto;top:auto;transform:none}
  .oon-caps{display:none}
  .oon-sig-stage{min-height:70vh}
  .oon-symbol-art .jsn-mark--line path.s{stroke-dashoffset:0}
  .oon-ph--full img,.oon-ph--edge img,.oon-duo-b,.oon-gray{clip-path:none;transform:none}
  .oon .oon-poster-stage{min-height:0}
  .oon-poster-head{position:relative;left:auto;top:auto;padding:64px var(--inset) 24px}
  .oon-poster-track{position:relative;transform:none;flex-wrap:wrap;padding:0 var(--inset) 64px}
  .oon-poster-item{flex:0 0 min(44%,320px);transform:none!important}
}



/* v46 — 천안로컬리스트: bright, bouncy; basic shapes meet and overlap into new forms */
.works-modal-panel:has(.cln),.works-modal-panel:has(.cln) .works-modal-scroll{background:#FBF9F3!important}
.cnl.cln{--green:#3FA973;--navy:#11518D;--orange:#E9B05D;--red:#D25054;--mint:#9ED2B5;--lb:#90B7D4;--cream:#EFE6CA;--pink:#E1958E;
  --paper:#FBF9F3;--ink:#11518D;--soft:color-mix(in srgb,var(--ink) 70%,var(--paper));
  --ease:cubic-bezier(.22,.61,.36,1);--pop:cubic-bezier(.34,1.56,.64,1);
  background:var(--paper);color:var(--ink);font-family:"Pretendard",var(--font-body);word-break:keep-all}
.cln section,.cln .cln-kv,.cln .cln-color,.cln .cln-gray{margin-left:var(--bleed);margin-right:var(--bleed);position:relative}
.cln section{padding-left:var(--inset);padding-right:var(--inset)}
.cln img{display:block;max-width:none}
.cln .cln-sh{width:100%;height:auto;user-select:none;-webkit-user-drag:none}

/* type */
.cln .cln-tag{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;margin-bottom:clamp(20px,3vw,32px);color:var(--soft)}
.cln .cln-h{margin:0;font-weight:700;font-size:clamp(2rem,4.8vw,4rem);line-height:1.12;letter-spacing:-.04em}
.cln .cln-kr{margin:clamp(18px,2.4vw,26px) 0 0;max-width:560px;font-size:1.1rem;font-weight:600;line-height:1.7}
.cln .cln-body{margin:16px 0 0;max-width:560px;font-size:1rem;line-height:1.9;color:var(--soft)}
.cln .cln-head{padding:clamp(96px,12vw,150px) 0 clamp(48px,7vw,88px)}
.cln .cln-sec--tight{padding-bottom:0}
.cln .cln-sec--tight .cln-head{padding-bottom:clamp(24px,4vw,48px)}
.cln .cln-head .cln-kr,.cln .cln-head .cln-body,.cln .cln-hero-foot .cln-body{opacity:0;transform:translateY(14px);transition:opacity 1s var(--ease) .35s,transform 1.1s var(--ease) .35s}
.cln .is-in .cln-kr,.cln .is-in .cln-body,.cln .cln-hero-foot.is-in .cln-body{opacity:1;transform:none}

/* sticky runs */
.cln .jsn-run{height:calc(var(--vh,100vh)*(var(--n,1)*1.05 + .4));padding:0}
.cln .cln-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden;padding:0 var(--inset)}
/* a range of the run's progress → 0..1 visibility (used by captions) */
.cln [style*="--a:"]{opacity:clamp(0,min((var(--p,0) - var(--a))*24,(var(--b) - var(--p,0))*24),1);transition:opacity .3s}

/* hero — the Korean logo with the basic shapes bouncing around it */
.cln .cln-hero{min-height:calc(var(--vh,100vh) - 40px);display:flex;flex-direction:column;padding-top:clamp(28px,4vw,48px);padding-bottom:clamp(56px,8vw,96px);overflow:hidden}
.cln .cln-hero-head{display:flex;justify-content:space-between;gap:16px;font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--soft)}
.cln .cln-hero-stage{position:relative;flex:1;min-height:clamp(320px,52vh,560px);display:grid;place-items:center}
.cln .cln-hero-logo{position:relative;z-index:2;width:min(64vw,620px);height:auto;opacity:0;transform:scale(.9);transition:opacity .9s var(--ease) .1s,transform 1.1s var(--pop) .1s}
.cln .cln-hero.is-in .cln-hero-logo{opacity:1;transform:none}
.cln .cln-pop{position:absolute;width:clamp(64px,11vw,150px);transform:scale(0) rotate(-90deg);transition:transform 1.1s var(--pop) var(--dl,.3s)}
.cln .cln-hero.is-in .cln-pop,.cln .cln-closing .is-in~.cln-pop{transform:none}
.cln .cln-pop--1{left:4%;top:8%;--dl:.45s}
.cln .cln-pop--2{right:6%;top:2%;width:clamp(48px,7vw,96px);--dl:.6s}
.cln .cln-pop--3{right:2%;bottom:6%;--dl:.75s}
.cln .cln-pop--4{left:12%;bottom:0;width:clamp(44px,6vw,84px);--dl:.9s}
.cln .cln-hero-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end}
.cln .cln-hero-foot .cln-h{font-size:clamp(2.4rem,6vw,5.2rem)}
.cln .cln-hero .jsn-ln>span{transition-delay:calc(.5s + var(--i,0)*90ms)}
.cln .cln-hero.is-in .jsn-ln>span{transform:none}

/* 02 — one attitude at a time; a new colour ground grows out from the shapes each step */
.cln .cln-att-stage{padding:0}
.cln .cln-att-bg{position:absolute;inset:0;background:var(--bg);clip-path:circle(0 at 72% 50%);transition:clip-path 1.1s cubic-bezier(.65,0,.35,1)}
.cln .cln-att-bg[data-step="0"]{--bg:var(--lb);clip-path:circle(150% at 72% 50%)}
.cln .cln-att-bg[data-step="1"]{--bg:var(--cream)}
.cln .cln-att-bg[data-step="2"]{--bg:var(--mint)}
.cln .cln-att-bg.is-active,.cln .cln-att-bg.is-past{clip-path:circle(150% at 72% 50%)}
.cln .cln-att-shapes{position:absolute;right:var(--inset);top:50%;width:min(44vw,72vh,600px);aspect-ratio:1;translate:0 -50%}
.cln .cln-as{position:absolute;transform:scale(0) rotate(-120deg);opacity:0;transition:transform 1s var(--pop),opacity .4s;transition-delay:calc(var(--j,0)*110ms)}
.cln .is-active .cln-as{transform:rotate(var(--r,0deg));opacity:1;transition-delay:calc(.25s + var(--j,0)*110ms)}
.cln .is-past .cln-as{transform:translateY(-30%) scale(.5) rotate(60deg);opacity:0;transition-delay:0s}
.cln .cln-as--1{--j:1}.cln .cln-as--2{--j:2}.cln .cln-as--3{--j:3}
/* Influencing — radiating from a centre */
.cln .cln-att-shapes--0 .cln-as{width:40%}
.cln .cln-att-shapes--0 .cln-as--0{left:30%;top:30%;--r:0deg;z-index:2}
.cln .cln-att-shapes--0 .cln-as--1{left:0;top:0;width:30%;--r:-15deg}
.cln .cln-att-shapes--0 .cln-as--2{left:66%;top:6%;width:30%;--r:20deg}
.cln .cln-att-shapes--0 .cln-as--3{left:58%;top:66%;width:30%;--r:-10deg}
.cln .cln-att-shapes--0.is-active .cln-as--0 img{animation:cln-spin 26s linear infinite}
/* Layered — overlapping, the overlap is a new colour */
.cln .cln-att-shapes--1 .cln-as{width:56%;mix-blend-mode:multiply}
.cln .cln-att-shapes--1 .cln-as--0{left:4%;top:8%}
.cln .cln-att-shapes--1 .cln-as--1{left:40%;top:14%;--r:12deg}
.cln .cln-att-shapes--1 .cln-as--2{left:22%;top:42%;--r:-8deg}
/* Clear — aligned on one line, clearly apart */
.cln .cln-att-shapes--2 .cln-as{width:30%;top:35%}
.cln .cln-att-shapes--2 .cln-as--0{left:0}
.cln .cln-att-shapes--2 .cln-as--1{left:35%}
.cln .cln-att-shapes--2 .cln-as--2{left:70%}
.cln .cln-att-text{position:absolute;left:var(--inset);top:0;bottom:0;width:min(42vw,520px)}
.cln .cln-att-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none}
.cln .cln-att-n{font-size:.72rem;font-weight:700;letter-spacing:.14em;opacity:0;transition:opacity .6s}
.cln .cln-att-en{margin:16px 0 0;font-size:clamp(3rem,8vw,7.4rem);font-weight:700;letter-spacing:-.05em;line-height:1}
.cln .cln-att-en .jsn-ln>span{transform:translateY(110%);transition:transform .9s var(--pop) .1s}
.cln .cln-att-step.is-past .jsn-ln>span{transform:translateY(-110%);transition:transform .6s var(--ease)}
.cln .cln-att-kr{margin:20px 0 0;font-size:1.15rem;font-weight:700}
.cln .cln-att-b{margin:12px 0 0;max-width:440px;font-size:1rem;line-height:1.85;color:color-mix(in srgb,var(--ink) 82%,transparent)}
.cln .cln-att-kr,.cln .cln-att-b{opacity:0;transform:translateY(14px);transition:opacity .5s,transform .7s var(--ease)}
.cln .cln-att-step.is-active .cln-att-n,.cln .cln-att-step.is-active .cln-att-kr,.cln .cln-att-step.is-active .cln-att-b{opacity:1;transform:none;transition-delay:.35s}
.cln .cln-att-step.is-active .jsn-ln>span{transform:none}

/* 03 — Local + Specialist = Local-List */
.cln .cln-idea-stage{--ux:1vw;--uy:0vh;--sz:min(30vw,50vh,440px);background:var(--g,#F4EEDC);transition:background-color .9s var(--ease)}
.cln .cln-idea[data-active="1"]{--g:#D4E3EE}
.cln .cln-idea[data-active="2"]{--g:#F7E3BF}
.cln .cln-idea[data-active="3"]{--g:#DCEFE3}
.cln .cln-idea-a,.cln .cln-idea-b,.cln .cln-idea-c,.cln .cln-plus,.cln .cln-eq{position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%) translate(calc(var(--x,0)*var(--ux)),calc(var(--x,0)*var(--uy))) scale(var(--s,1)) rotate(var(--rot,0deg));
  transition:transform 1.1s var(--pop),opacity .6s var(--ease),translate 1.1s var(--pop)}
.cln .cln-idea-a,.cln .cln-idea-b{width:var(--sz);mix-blend-mode:multiply}
.cln .cln-idea-a b,.cln .cln-idea-b b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;color:#fff;
  font-size:clamp(2.2rem,6.4vw,6rem);font-weight:700;letter-spacing:-.045em;line-height:1;transition:opacity .5s}
.cln .cln-idea-a{--x:-90;opacity:0}
.cln .cln-idea-b{--x:90;opacity:0}
.cln .cln-plus,.cln .cln-eq{width:calc(var(--sz)*.56);aspect-ratio:1;--s:0;--rot:-180deg}
.cln .cln-plus i,.cln .cln-eq i{position:absolute;left:0;right:0;top:50%;height:26%;margin-top:-13%;border-radius:999px;background:var(--orange)}
.cln .cln-plus i+i{transform:rotate(90deg)}
.cln .cln-eq i{background:var(--red);top:30%}.cln .cln-eq i+i{top:70%}
.cln .cln-idea-c{--s:.4;opacity:0}
.cln .cln-idea-c b{display:block;white-space:nowrap;color:var(--navy);font-size:clamp(3rem,11vw,10rem);font-weight:700;letter-spacing:-.05em;line-height:1}
.cln .cln-idea[data-active="0"] .cln-idea-a{--x:0;opacity:1}
.cln .cln-idea[data-active="1"] .cln-idea-a{--x:-26;opacity:1}
.cln .cln-idea[data-active="1"] .cln-idea-b{--x:26;opacity:1}
.cln .cln-idea[data-active="1"] .cln-plus{--s:1;--rot:0deg}
.cln .cln-idea[data-active="2"] .cln-idea-a{--x:-17;opacity:1;--s:.86}
.cln .cln-idea[data-active="2"] .cln-idea-b{--x:-3;opacity:1;--s:.86}
.cln .cln-idea[data-active="2"] .cln-eq{--x:24;--s:1;--rot:0deg}
.cln .cln-idea[data-active="3"] .cln-idea-a{--x:-5;opacity:1;--s:.7;translate:0 calc(var(--sz)*-.3)}
.cln .cln-idea[data-active="3"] .cln-idea-b{--x:5;opacity:1;--s:.7;translate:0 calc(var(--sz)*-.3)}
.cln .cln-idea[data-active="2"] b,.cln .cln-idea[data-active="3"] .cln-idea-a b,.cln .cln-idea[data-active="3"] .cln-idea-b b{opacity:0}
.cln .cln-idea[data-active="3"] .cln-eq{--x:0;--s:0;--rot:180deg}
.cln .cln-idea[data-active="3"] .cln-idea-c{--s:1;opacity:1;translate:0 calc(var(--sz)*.42)}
.cln .cln-idea[data-active="3"] .cln-idea-c b{opacity:1}
.cln .cln-idea-cap{position:absolute;left:var(--inset);right:var(--inset);bottom:clamp(20px,4vh,40px);margin:0;font-size:.72rem;font-weight:700;letter-spacing:.16em;color:var(--soft)}

/* 04 — the logo, then its guide lines drawn over it and fading; Korean, then English */
.cln .cln-logo-stage{display:grid;place-items:center;background:#fff}
.cln .cln-logo-box{position:absolute;left:50%;top:50%;height:min(34vh,30vw,380px);translate:-50% -50%;transition:opacity .8s var(--ease),transform 1s var(--pop)}
.cln .cln-logo-box img{width:100%;height:100%;object-fit:contain}
.cln .cln-logo-box--en{opacity:0;transform:translateY(12%) scale(.94)}
.cln .cln-logo[data-active="2"] .cln-logo-box--kr,.cln .cln-logo[data-active="3"] .cln-logo-box--kr{opacity:0;transform:translateY(-12%) scale(.94)}
.cln .cln-logo[data-active="2"] .cln-logo-box--en,.cln .cln-logo[data-active="3"] .cln-logo-box--en{opacity:1;transform:none}
.cln .cln-grid{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;--g:0}
.cln .cln-grid line{stroke:var(--red);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;
  stroke-dashoffset:calc(1 - clamp(0,var(--g)*2.4 - var(--d)*.025,1));opacity:clamp(0,(.92 - var(--g))*5,1)}
.cln .cln-grid line.v{stroke:var(--lb);stroke-width:1.2}
.cln .cln-logo[data-active="1"] .cln-logo-box--kr .cln-grid,.cln .cln-logo[data-active="3"] .cln-logo-box--en .cln-grid{--g:var(--lp,0)}
.cln .cln-logo-caps{position:absolute;left:var(--inset);bottom:clamp(20px,4vh,40px);font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--soft)}
.cln .cln-logo-caps span,.cln .cln-gs-cap span{position:absolute;left:0;bottom:0;white-space:nowrap}

/* 05 — zero gravity, then gathering; where they overlap a new colour appears */
.cln .cln-gs-stage{background:#fff}
.cln .cln-gs-field{position:absolute;inset:0;--q:clamp(0,(var(--p,0) - .12)/.58,1)}
.cln .cln-float{position:absolute;width:min(17vw,24vh,230px);
  left:calc((var(--x0) + (var(--x1) - var(--x0))*var(--q))*1%);top:calc((var(--y0) + (var(--y1) - var(--y0))*var(--q))*1%);
  translate:-50% -50%;rotate:calc(var(--r)*(1 - var(--q)));mix-blend-mode:multiply;--amp:calc(1 - var(--q))}
.cln .cln-float-sh{animation:cln-drift var(--t) ease-in-out var(--dl) infinite alternate}
@keyframes cln-drift{from{transform:translate(calc(var(--amp)*-14px),calc(var(--amp)*-18px)) rotate(calc(var(--amp)*-8deg))}to{transform:translate(calc(var(--amp)*14px),calc(var(--amp)*18px)) rotate(calc(var(--amp)*8deg))}}
@keyframes cln-spin{to{transform:rotate(360deg)}}
.cln .cln-gs-cap{position:absolute;left:var(--inset);bottom:clamp(20px,4vh,40px);margin:0;font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--soft)}

/* 06 — every combination on one ground, one size, one alignment */
.cln .cln-kv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#F4EEDC}
.cln .cln-kv figure{margin:0;aspect-ratio:1;position:relative;min-width:0;box-shadow:inset 0 0 0 .5px color-mix(in srgb,var(--ink) 12%,transparent)}
.cln .cln-kv img{position:absolute;inset:14%;width:72%;height:72%;object-fit:contain;transform:scale(.4) rotate(-20deg);opacity:0;transition:transform 1s var(--pop),opacity .5s;transition-delay:calc(var(--i)*90ms)}
.cln .cln-kv.is-in img{transform:none;opacity:1}

/* 07 — eight equal fields, full width */
.cln .cln-color{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin-top:clamp(8px,2vw,24px)}
.cln .cln-cf{position:relative;height:clamp(340px,62vh,640px);display:flex;flex-direction:column;justify-content:flex-end;padding:18px clamp(10px,1.2vw,18px);color:var(--ink);overflow:hidden}
.cln .cln-cf::before{content:"";position:absolute;inset:0;background:var(--c);transform:scaleY(0);transform-origin:bottom;transition:transform 1s var(--pop);transition-delay:calc(var(--i)*80ms)}
.cln .cln-cf.is-dark{color:#fff}
.cln .cln-cf>*{position:relative;opacity:0;transition:opacity .6s;transition-delay:calc(.5s + var(--i)*80ms)}
.cln .cln-color.is-in .cln-cf::before{transform:none}
.cln .cln-color.is-in .cln-cf>*{opacity:1}
.cln .cln-cf b{font-size:.8rem;letter-spacing:.06em}
.cln .cln-cf span{font-size:.8rem;margin-top:2px}
.cln .cln-cf em{font-style:normal;font-size:.68rem;line-height:1.6;margin-top:10px;opacity:.85}
.cln .cln-gray{display:grid;grid-template-columns:repeat(10,1fr);height:48px}
.cln .cln-gray i{background:var(--c)}
.cln .cln-note{margin:16px 0 0;max-width:720px;font-size:.78rem;line-height:1.8;color:var(--soft)}

/* 08, 09, closing */
.cln .cln-type{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);padding-bottom:clamp(64px,9vw,110px)}
.cln .cln-type b{display:block;font-size:.72rem;letter-spacing:.12em;color:var(--soft);padding-bottom:14px;border-bottom:1px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.cln .cln-type p{margin:18px 0 0;font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.45;letter-spacing:-.02em;font-weight:600}
.cln .cln-sec:has(+.cln-mock) .cln-head{padding-bottom:0}
.cln .cln-apps{display:flex;flex-wrap:wrap;gap:10px;padding-bottom:clamp(64px,9vw,110px)}
.cln .cln-apps span{padding:10px 18px;border-radius:999px;background:#fff;font-size:.9rem;font-weight:600;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 16%,transparent)}
.cln .cln-closing{padding-top:clamp(110px,14vw,180px);padding-bottom:clamp(40px,6vw,64px);background:var(--navy);color:#fff;overflow:hidden}
.cln .cln-closing .cln-h{font-size:clamp(3rem,9vw,8rem)}
.cln .cln-closing .cln-kr{opacity:.85}
.cln .cln-closing .is-in .jsn-ln>span{transform:none}
.cln .cln-closing-logos{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(18px,2.6vw,32px);margin-top:clamp(56px,8vw,96px)}
.cln .cln-closing-logos img{height:clamp(22px,3vw,40px);width:auto;filter:invert(1)}
.cln .cln-closing .cln-pop{width:clamp(80px,14vw,200px)}
.cln .cln-pop--5{right:6%;top:12%;--dl:.2s}
.cln .cln-pop--6{right:20%;top:34%;width:clamp(56px,8vw,120px)!important;--dl:.4s}
.cln .cln-closing-foot{display:flex;justify-content:space-between;gap:16px;margin-top:clamp(80px,10vw,130px);font-size:.72rem;font-weight:700;letter-spacing:.12em;opacity:.7}

/* mockups — full-bleed; each opens from a rounded shape-like window into the full frame */
.cln .cln-mock{margin:clamp(56px,8vw,110px) var(--bleed) 0;position:relative}
.cln .cln-mock-in{overflow:hidden;clip-path:inset(8% 6% 8% 6% round 48px);transition:clip-path 1.3s cubic-bezier(.65,0,.35,1)}
.cln .cln-mock img{width:100%;height:auto;transform:scale(1.08);transition:transform 1.6s var(--ease)}
.cln .cln-mock.is-in .cln-mock-in{clip-path:inset(0 0 0 0 round 0)}
.cln .cln-mock.is-in img{transform:none}
.cln .cln-mock figcaption{padding:14px var(--inset) 0;font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--soft)}
.cln.jsn-static .cln-mock-in{clip-path:none}.cln.jsn-static .cln-mock img{transform:none}

@media (max-width:760px){
  .cln .cln-hero-foot,.cln .cln-type{grid-template-columns:1fr}
  .cln .cln-att-shapes{right:auto;left:50%;top:9%;translate:-50% 0;width:min(70vw,38vh)}
  .cln .cln-att-bg{clip-path:circle(0 at 50% 28%)}
  .cln .cln-att-bg[data-step="0"],.cln .cln-att-bg.is-active,.cln .cln-att-bg.is-past{clip-path:circle(150% at 50% 28%)}
  .cln .cln-att-text{left:var(--inset);right:var(--inset);width:auto;top:44%}
  .cln .cln-att-step{justify-content:flex-start}
  .cln .cln-att-en{font-size:clamp(2.6rem,13vw,4rem)}
  .cln .cln-att-b{font-size:.92rem;line-height:1.75}
  .cln .cln-idea-stage{--ux:0vw;--uy:.9vh;--sz:min(46vw,30vh)}
  .cln .cln-logo-box{height:auto;width:84vw}
  .cln .cln-float{width:min(26vw,18vh)}
  .cln .cln-kv{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cln .cln-color{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cln .cln-cf{height:clamp(200px,34vh,300px)}
  .cln .cln-cf em{font-size:.6rem}
}
@media (prefers-reduced-motion:reduce){
  .cln *,.cln *::before{transition:none!important;animation:none!important}
}
/* reduced motion: the run states are not driven, so show each scene's settled state */
.cln.jsn-static .cln-pop,.cln.jsn-static .cln-hero-logo,.cln.jsn-static .cln-kv img{transform:none;opacity:1}
.cln.jsn-static .cln-att-bg{clip-path:none}
.cln.jsn-static .cln-att-shapes{display:none}
.cln.jsn-static .cln-att-shapes--1{display:block}
.cln.jsn-static .cln-att{height:auto}.cln.jsn-static .cln-att-stage,.cln.jsn-static .cln-idea-stage,.cln.jsn-static .cln-logo-stage,.cln.jsn-static .cln-gs-stage{position:relative}
.cln.jsn-static .cln-att-step{opacity:0}.cln.jsn-static .cln-att-step[data-step="1"]{opacity:1}
.cln.jsn-static .cln-idea-a{--x:-5;--s:.7;opacity:1;translate:0 calc(var(--sz)*-.3)}.cln.jsn-static .cln-idea-b{--x:5;--s:.7;opacity:1;translate:0 calc(var(--sz)*-.3)}.cln.jsn-static .cln-idea b{opacity:0}.cln.jsn-static .cln-idea-c{--s:1;opacity:1;translate:0 calc(var(--sz)*.42)}.cln.jsn-static .cln-idea-c b{opacity:1}
.cln.jsn-static .cln-logo-box--kr{translate:-50% -110%}.cln.jsn-static .cln-logo-box--en{opacity:1;transform:none;translate:-50% 10%}
.cln.jsn-static .cln-grid{--g:.4}
.cln.jsn-static .cln-gs-field{--q:1}
.cln.jsn-static [style*="--a:"]{opacity:1}.cln.jsn-static .cln-logo-caps span+span,.cln.jsn-static .cln-gs-cap span:first-child{display:none}


/* v47 — STARBOARD 08: the clip moves onto the image. Clipping the observed wrapper itself made it read as off-screen,
   so its progress froze at 0 and the image stayed blank. */
.sbc .sbc-scene08 .sbc-imgwrap,.sbc .sbc-scene08 .sbc-app-col:nth-child(2){opacity:1!important;transform:none!important;clip-path:none!important;background:transparent}
.sbc .sbc-scene08 .sbc-imgwrap img{--r:clamp(0,calc(var(--mp,1)/.35),1);clip-path:inset(0 0 0 calc((1 - var(--r))*100%));transform:translateX(calc((1 - clamp(0,calc(var(--mp,1)/.45),1))*8%))}
.sbc .sbc-scene08 .sbc-app-col:nth-child(2) img{--r:clamp(0,calc((var(--mp,1) - .08)/.35),1)}
@media (prefers-reduced-motion:reduce){.sbc .sbc-scene08 .sbc-imgwrap img{clip-path:none;transform:none}}


/* v48 — BEECONNECT.LAB: navy / lime / white; every motion follows the logo N's diagonal (35.64°) */
.bcn{--navy:#0A1431;--lime:#E4FE33;--gray:#D5D5D5;--ease:cubic-bezier(.22,.61,.36,1);--snap:cubic-bezier(.7,0,.2,1)}
.bcn .bcn-part section{margin-left:var(--bleed);margin-right:var(--bleed);padding-left:var(--inset);padding-right:var(--inset);position:relative}
.bcn .bcn-part img{display:block;max-width:none}
.bcn i.bcn-b{display:block;transform-origin:0 0}

/* type — one rule per level, same everywhere */
.bcn .bcn-tag{display:block;font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:clamp(20px,3vw,32px);opacity:.72}
.bcn .bcn-h{margin:0;font-weight:900;font-size:clamp(2.2rem,6vw,5.4rem);line-height:1.06;letter-spacing:-.02em}
.bcn .bcn-kr{margin:20px 0 0;max-width:600px;font-size:1.1rem;line-height:1.7;opacity:.74}
.bcn .bcn-body{margin:16px 0 0;max-width:480px;font-size:1rem;line-height:1.8;opacity:.82}
.bcn .bcn-head{padding:clamp(96px,12vw,160px) 0 clamp(40px,6vw,72px)}
.bcn .bcn-head.jsn-rv{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.bcn .bcn-head.jsn-rv.is-in{opacity:1;transform:none}
.bcn .bcn-sec{background:#fff;color:var(--navy)}
/* parts that arrive at a point of the run's progress */
.bcn .bcn-at{--v:clamp(0,(var(--p,1) - var(--a))*10,1);opacity:var(--v);translate:0 calc((1 - var(--v))*18px)}

/* sticky runs */
.bcn .jsn-run,.bcn .bcn-part .jsn-run{height:calc(var(--vh,100vh)*(var(--n,1)*1.05 + .4));padding:0}
.bcn .bcn-stage{position:sticky;top:0;height:var(--vh,100vh);overflow:hidden}

/* 01 — discover, connect, complete */
.bcn .bcn-ess-stage{background:var(--navy);color:#fff;container-type:inline-size}
/* discover + connect: the diagonal holds the centre; then it steps up to the corner and the message takes the ground */
.bcn .bcn-ess-lead{position:absolute;left:var(--inset);top:clamp(64px,9vh,96px);width:min(56cqw,620px)}
.bcn .bcn-ess-text{position:absolute;left:var(--inset);bottom:clamp(28px,6vh,64px);width:min(64cqw,780px)}
.bcn .bcn-lead{margin:0;font-size:clamp(1.2rem,2vw,1.7rem);font-weight:700;line-height:1.35;letter-spacing:-.02em}
.bcn .bcn-lead+.bcn-lead{color:var(--lime)}
.bcn .bcn-ess-msg span{display:block}
.bcn .bcn-evm{margin:clamp(20px,3vh,32px) 0 0;display:grid;gap:10px}
.bcn .bcn-evm>div{display:grid;grid-template-columns:96px 1fr;gap:16px;padding-top:10px;border-top:1px solid rgba(255,255,255,.18)}
.bcn .bcn-evm dt{font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--lime)}
.bcn .bcn-evm dd{margin:0;font-size:.92rem;line-height:1.6;opacity:.84}
.bcn .bcn-ess-g{--H:min(58vh,44cqw);--bw:calc(var(--H)*.12);--qb:clamp(0,(var(--p,1) - .3)/.2,1);--m:clamp(0,(var(--p,1) - .47)/.08,1);
  position:absolute;right:calc(var(--inset) + 150px);top:calc((1 - var(--m))*50% + var(--m)*clamp(56px,8vh,84px));height:var(--H);width:calc(var(--H)*.7169 + var(--bw));
  transform-origin:100% 0;transform:translateY(calc((var(--m) - 1)*50%)) scale(calc(1 - .5*var(--m)));transition:none}
.bcn .bcn-ess-band{position:absolute;left:0;top:0;width:var(--bw);height:100%;background:var(--lime);transform:skewX(35.64deg);clip-path:inset(0 0 calc((1 - var(--qb))*100%) 0)}
.bcn .bcn-node{position:absolute;left:calc(var(--bw)/2 + var(--f)*var(--H)*.7169);top:calc(var(--f)*var(--H));display:flex;align-items:baseline;gap:10px;white-space:nowrap;transform:translateY(-50%)}
.bcn .bcn-node i{width:14px;height:14px;margin-left:-7px;margin-right:calc(var(--bw)/2 + 4px);background:#fff;align-self:center}
.bcn .bcn-node b{font-size:.72rem;letter-spacing:.12em}
.bcn .bcn-node em{font-style:normal;font-size:.92rem;opacity:.72}

/* 02 — the personality changes the ground and how the diagonal moves */
.bcn .bcn-pers-stage{--bg:var(--lime);--fg:var(--navy);--ac:var(--navy);background:var(--bg);color:var(--fg);transition:background-color .8s var(--ease),color .6s}
.bcn .bcn-pers[data-active="1"] .bcn-pers-stage{--bg:var(--navy);--fg:#fff;--ac:var(--lime)}
.bcn .bcn-pers[data-active="2"] .bcn-pers-stage{--bg:#fff;--fg:var(--navy);--ac:var(--navy)}
.bcn .bcn-pers[data-active="3"] .bcn-pers-stage{--bg:var(--gray);--fg:var(--navy);--ac:var(--navy)}
.bcn .bcn-pers-tag{position:absolute;left:var(--inset);top:clamp(28px,5vh,48px);margin:0}
.bcn .bcn-pers-step{position:absolute;left:var(--inset);top:15vh;width:min(50vw,720px);pointer-events:none}
.bcn .bcn-pers-n{display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;opacity:0;transition:opacity .4s}
.bcn .bcn-pers-w{margin:14px 0 0;font-size:clamp(3.2rem,8.4vw,8.4rem);font-weight:900;letter-spacing:-.045em;line-height:.95;overflow:hidden;white-space:nowrap;color:var(--ac);padding-bottom:.04em}
.bcn .bcn-pers-w span{display:block;transform:translateY(105%);transition:transform .8s var(--snap)}
.bcn .bcn-pers-step.is-active .bcn-pers-w span{transform:none;transition-delay:.15s}
.bcn .bcn-pers-step.is-past .bcn-pers-w span{transform:translateY(-105%)}
.bcn .bcn-pers-kr{margin:18px 0 0;font-size:1.1rem;font-weight:700;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.bcn .bcn-pers-kr span{font-size:.72rem;font-weight:700;letter-spacing:.06em;padding:5px 11px;border:1px solid currentColor;border-radius:999px}
.bcn .bcn-pers-kr,.bcn .bcn-pers-step .bcn-body{opacity:0;transform:translateY(12px);transition:opacity .5s,transform .7s var(--ease)}
.bcn .bcn-pers-step.is-active .bcn-pers-n,.bcn .bcn-pers-step.is-active .bcn-pers-kr{opacity:1;transform:none;transition-delay:.35s}
.bcn .bcn-pers-step.is-active .bcn-body{opacity:.82;transform:none;transition-delay:.45s}
.bcn .bcn-pg{position:absolute;pointer-events:none;opacity:0;transition:opacity .5s}
.bcn .bcn-pg.is-active{opacity:1}
.bcn .bcn-pg .bcn-b{position:absolute}
/* Alive — rhythm: the diagonals run, free */
.bcn .bcn-pg--0{left:0;right:0;bottom:0;height:34%;overflow:hidden;--H:calc(var(--vh,100vh)*.34)}
.bcn .bcn-strip{position:absolute;top:0;bottom:0;left:calc(var(--H)*-1.3);animation:bcn-run 1.6s linear infinite}
.bcn .bcn-pg--0 .bcn-b{top:0;height:100%;left:calc(var(--i)*var(--H)*.5653);width:calc(var(--H)*.2977);background:var(--navy);transform:skewX(35.64deg)}
@keyframes bcn-run{to{transform:translateX(calc(var(--H)*.5653))}}
/* Potential — white space: three diagonals rise beyond the frame */
.bcn .bcn-pg--1{right:0;top:0;bottom:0;width:44%;overflow:hidden}
.bcn .bcn-pg--1 .bcn-b{bottom:0;left:calc(46% + var(--i)*13vh*2.4);width:13vh;height:0;background:var(--lime);transform-origin:0 100%;transform:skewX(35.64deg);transition:height 1.2s var(--ease) calc(var(--i)*.12s)}
.bcn .bcn-pg--1.is-active .bcn-b{height:110%}
/* Clever — contrast & bold: one massive diagonal cuts in */
.bcn .bcn-pg--2{left:0;right:0;top:0;bottom:0;overflow:hidden}
.bcn .bcn-pg--2 .bcn-b{top:-10%;height:120%;left:54%;width:30vw;background:var(--navy);transform:translateX(70vw) skewX(35.64deg);transition:transform .7s var(--snap)}
.bcn .bcn-pg--2.is-active .bcn-b{transform:skewX(35.64deg)}
/* Sincerely — connected & continuous: one unbroken line of diagonals */
.bcn .bcn-pg--3{left:0;right:0;bottom:6%;height:26%;overflow:hidden;--H:calc(var(--vh,100vh)*.26)}
.bcn .bcn-zig{position:absolute;inset:0 0 0 var(--inset)}
.bcn .bcn-zig .bcn-b{top:0;height:100%;left:calc(var(--z)*var(--H)*1.4338);width:calc(var(--H)*.2977);background:var(--navy);transform:skewX(35.64deg);
  clip-path:inset(0 0 100% 0);transition:clip-path .35s linear calc(var(--i)*.09s)}
.bcn .bcn-zig .bcn-b--up{transform:skewX(-35.64deg);clip-path:inset(100% 0 0 0)}
.bcn .bcn-pg--3.is-active .bcn-b{clip-path:inset(0)}

/* 03 — from the N: repeat, extend, cross, open */
.bcn .bcn-vl-stage{background:#fff;--u:calc(min(80vw,1180px)/1476);
  --qa:clamp(0,(var(--p,1) - .02)/.2,1);--qb:clamp(0,(var(--p,1) - .3)/.2,1);--qc:clamp(0,(var(--p,1) - .58)/.16,1);--qd:clamp(0,(var(--p,1) - .82)/.15,1)}
.bcn .bcn-motif{position:absolute;left:50%;top:50%;width:calc(1476*var(--u));height:calc(404*var(--u));transform:translate(-50%,-50%) scale(calc(1 + 4*var(--qd)));opacity:calc(1 - var(--qd))}
.bcn .bcn-motif i{position:absolute;display:block}
.bcn .bcn-st{--k:clamp(0,var(--qa)*8 - var(--i),1);top:calc(10*var(--u));left:calc(var(--L)*var(--u));width:calc(var(--w)*var(--u));height:calc(383*var(--u));background:var(--navy);
  opacity:calc(var(--k)*(1 - var(--qb)));transform:translateY(calc((1 - var(--k))*40*var(--u)))}
.bcn .bcn-dg{--k:clamp(0,var(--qa)*8 - var(--i),1);--E:calc(var(--qb)*1200);
  left:calc((var(--L) - .7169*var(--E))*var(--u));top:calc((10 - var(--E))*var(--u));width:calc(var(--w)*var(--u));height:calc((383 + 2*var(--E))*var(--u));
  background:var(--navy);transform-origin:0 0;opacity:var(--k);transform:translateX(calc((var(--k) - 1)*108*var(--u))) skewX(35.64deg)}
/* the stems' inner corners are cut by the diagonals' outer edges, so the outline runs straight like the artwork */
.bcn .bcn-st--l{clip-path:polygon(0 0,93% 0,100% 2.92%,100% 100%,0 100%)}
.bcn .bcn-st--r{clip-path:polygon(0 0,100% 0,100% 100%,7.28% 100%,0 97.02%)}
/* inside the N the outer diagonals stop at the stems' outer edge, exactly as in the artwork */
.bcn .bcn-dg--first{clip-path:polygon(calc(14*var(--u)*(1 - var(--qb))) 0,100% 0,100% 100%,0 100%,0 calc(19.53*var(--u)*(1 - var(--qb))))}
.bcn .bcn-dg--last{clip-path:polygon(0 0,100% 0,100% calc((1 - var(--qb))*366*var(--u) + var(--qb)*100%),calc((1 - var(--qb))*105.8*var(--u) + var(--qb)*100%) 100%,0 100%)}
.bcn .bcn-dg--x{--E:calc(var(--qc)*1200);left:calc((var(--L) + .7169*var(--E))*var(--u));top:calc((10 - var(--E))*var(--u));width:calc(var(--w)*var(--u));height:calc((383 + 2*var(--E))*var(--u));
  background:var(--lime);transform-origin:0 0;opacity:min(1,var(--qc)*3);transform:skewX(-35.64deg)}
.bcn .bcn-vl-cap{position:absolute;left:var(--inset);bottom:clamp(20px,4vh,40px);margin:0;height:34px}
.bcn .bcn-vl-cap span{position:absolute;left:0;bottom:0;white-space:nowrap;background:var(--navy);color:#fff;padding:8px 12px;font-size:.8rem;font-weight:700;
  opacity:clamp(0,min((var(--p,1) - var(--a0))*20,(var(--b0) - var(--p,1))*20),1)}
.bcn .bcn-vl-cap b{color:var(--lime);margin-right:10px;letter-spacing:.08em}

/* 04 — the same logo in the same place; a diagonal sweep changes ground and colour */
.bcn .bcn-lg{position:absolute;inset:0;display:grid;place-items:center}
.bcn .bcn-lg img{width:min(78vw,1080px);height:auto;aspect-ratio:2000/149}
.bcn .bcn-lg--a{background:#fff;color:var(--navy)}
.bcn .bcn-lg--b{--t:clamp(0,(var(--p,1) - .22)/.56,1);--r:calc(var(--vh,100vh)*.7169);background:var(--navy);color:#fff;
  clip-path:polygon(-100% 0,calc(var(--t)*(100% + var(--r)) - var(--r)) 0,calc(var(--t)*(100% + var(--r))) 100%,-100% 100%)}
.bcn .bcn-lg-cap{position:absolute;left:var(--inset);bottom:clamp(20px,4vh,40px);font-size:.72rem;font-weight:700;letter-spacing:.12em}

/* 06 — navy ground through the whole section; navy | lime halves */
.bcn .bcn-scene{background:var(--navy);color:#fff;padding-bottom:clamp(64px,8vw,110px)}
.bcn .bcn-half{margin-left:calc(-1*var(--inset));margin-right:calc(-1*var(--inset))}
.bcn .bcn-half-stage{display:grid;place-items:center;background:var(--navy)}
.bcn .bcn-half-box{width:100%;max-height:100%;aspect-ratio:16/9;display:grid;grid-template-columns:1fr 1fr;position:relative}
.bcn .bcn-half-l{background:var(--navy);overflow:hidden}
.bcn .bcn-half-l img{width:100%;height:auto;aspect-ratio:1}
.bcn .bcn-half-r{background:var(--lime);position:relative;overflow:hidden}
.bcn .bcn-mood{position:absolute;left:50%;top:50%;width:58%;height:auto;aspect-ratio:1200/1478;translate:-50% -50%;filter:drop-shadow(0 12px 18px rgba(10,20,49,.22));
  visibility:hidden}
/* the feed images cut straight from one to the next — no transition */
.bcn .bcn-mood.is-active{visibility:visible}
.bcn .bcn-half:not([data-active]) .bcn-mood[data-step="0"]{visibility:visible}
.bcn .bcn-half-n{position:absolute;right:clamp(16px,2vw,28px);bottom:clamp(16px,3vh,28px);color:var(--navy);font-size:.72rem;font-weight:700;letter-spacing:.12em}
.bcn .bcn-half-n i{font-style:normal;display:none}
.bcn .bcn-half-n i.is-active{display:inline}
/* the feed — scrolled like on the phone */
.bcn .bcn-feed{margin-left:calc(-1*var(--inset));margin-right:calc(-1*var(--inset))}
.bcn .bcn-feed-stage{background:var(--navy);display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,5vw,80px);padding:0 var(--inset)}
.bcn .bcn-feed-cap{max-width:420px}
.bcn .bcn-feed-cap .bcn-lead{color:var(--lime)}
.bcn .bcn-phone{--ph:min(80vh,760px);--bz:10px;--sw:calc(var(--ph)*9/19);--view:calc(var(--ph) - var(--sw)*480/1855);box-sizing:content-box;
  height:var(--ph);width:var(--sw);flex:none;margin-right:clamp(0px,6vw,96px);background:#000;border:var(--bz) solid #05070d;border-radius:46px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.bcn .bcn-phone-bar{width:100%;height:auto;flex:none;position:relative;z-index:1}
.bcn .bcn-phone-view{flex:none;height:var(--view);overflow:hidden;position:relative;background:#000}
.bcn .bcn-phone-scroll img{display:block;width:100%;height:auto}
.bcn .bcn-phone-scroll{transform:translateY(calc(-1*clamp(0,(var(--p,0) - .08)/.84,1)*(100% - var(--view))));transition:transform .45s cubic-bezier(.2,.8,.2,1)}
/* mockups — full width, shown as they are */
.bcn .bcn-mock{margin:0 var(--bleed);overflow:hidden}
.bcn .bcn-mock img{width:100%;height:auto}
/* the colour section's empty mockup slot is filled by the business card right after it */
.bcnl.bcn>.bcnl-scene06::after{content:none;display:none}

@media (max-width:760px){
  .bcn .bcn-ess-g{--H:min(26vh,220px);--m:0;left:var(--inset);right:auto;top:7vh;transform:none}
  .bcn .bcn-ess-lead{top:calc(9vh + min(26vh,220px));right:var(--inset);width:auto}
  .bcn .bcn-ess-text{bottom:4vh;right:var(--inset);width:auto}
  .bcn .bcn-lead{font-size:1.15rem}
  .bcn .bcn-evm>div{grid-template-columns:72px 1fr;gap:10px}
  .bcn .bcn-evm dd{font-size:.82rem}
  .bcn .bcn-pers-step{top:11vh;right:var(--inset);width:auto}
  .bcn .bcn-pers-step .bcn-body{font-size:.92rem;line-height:1.7}
  .bcn .bcn-pg--1,.bcn .bcn-pg--2{left:0;right:0;top:auto;bottom:0;height:30%;width:auto}
  .bcn .bcn-pg--1 .bcn-b{width:8vh;left:calc(30% + var(--i)*8vh*2.4)}
  .bcn .bcn-pg--2 .bcn-b{left:40%;width:46vw}
  .bcn .bcn-pg--0{height:28%;--H:calc(var(--vh,100vh)*.28)}
  .bcn .bcn-pg--3{height:22%;bottom:4%;--H:calc(var(--vh,100vh)*.22)}
  .bcn .bcn-vl-stage{--u:calc(90vw/1476)}
  .bcn .bcn-vl-cap span{font-size:.72rem}
  .bcn .bcn-lg img{width:84vw}
  .bcn .bcn-half-box{aspect-ratio:auto;height:100%;grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .bcn .bcn-half-l img{width:min(100%,46vh);margin:0 auto}
  .bcn .bcn-mood{width:auto;height:78%}
  .bcn .bcn-feed-stage{flex-direction:column;justify-content:center;gap:20px}
  .bcn .bcn-feed-cap{align-self:stretch}
  .bcn .bcn-feed-cap .bcn-kr{display:none}
  .bcn .bcn-phone{--ph:min(64vh,560px);--bz:8px;margin:0;border-radius:38px}
}
@media (prefers-reduced-motion:reduce){
  .bcn *{transition:none!important;animation:none!important}
}
/* reduced motion: runs are not driven, so each scene shows its settled state */
.jsn-static .bcn-part .jsn-run{height:auto}
.jsn-static .bcn-stage{position:relative}
.jsn-static .bcn-pers-step{opacity:0}.jsn-static .bcn-pers-step[data-step="0"]{opacity:1}
.jsn-static .bcn-pg{display:none}.jsn-static .bcn-pg--0{display:block}
.jsn-static .bcn-vl-stage{--qa:1;--qb:0;--qc:0;--qd:0}
.jsn-static .bcn-lg--b{display:none}
.jsn-static .bcn-half-n i+i{display:none}.jsn-static .bcn-mood{visibility:hidden}.jsn-static .bcn-mood[data-step="0"]{visibility:visible}


/* v49 — BRANDING page. POINT OF VIEW: the intro and the three lines are two columns that start on the same top line */
@media (min-width:901px){
  .pov .pov-head{grid-row:1}.pov .pov-divider{grid-row:2}.pov .pov-keywords{grid-row:4}
  .pov .pov-intro,.pov .pov-copy{grid-row:3;align-self:start;margin-top:clamp(28px,4vw,44px)}
  .pov .pov-intro{grid-column:1/6}.pov .pov-copy{grid-column:7/13}
}
.pov .pov-intro p,.pov .pov-copy p:first-child{margin-top:0!important}
.pov .pov-intro p,.pov .pov-copy p{font-size:1.1rem;line-height:1.75}
/* BRANDING IN PRACTICE: one 16:9 frame for every card, the image left clear */
.works-grid .work-thumb{aspect-ratio:16/9}
.works-grid .work-thumb .pm-img{object-fit:cover;object-position:var(--op,50% 50%)}
.works-grid .work-caption{background:linear-gradient(to top,rgba(19,18,17,.5),rgba(19,18,17,0));padding-top:clamp(36px,4vw,56px)}
.works-grid .work-name,.works-grid .work-meta{text-shadow:0 1px 8px rgba(0,0,0,.25)}


/* v50 — MODINGSO on the branding page: its own ground and a full section title, so the change of subject reads */
.mds{background:var(--surface-grey);padding-top:clamp(90px,12vw,160px)!important;padding-bottom:clamp(90px,12vw,160px)!important}
.mds .mds-intro{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gap);align-items:start;margin-top:clamp(12px,2vw,24px)}
.mds .mds-quote{grid-column:1/7;margin:0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.5rem,2.8vw,2.4rem);line-height:1.38;letter-spacing:-.025em;color:var(--ink);word-break:keep-all}
.mds .mds-intro-body{grid-column:8/13}
.mds .mds-body{margin:0 0 14px;font-size:1.05rem;line-height:1.8;max-width:560px}
.mds .mds-steps{grid-column:1/13;margin-top:clamp(64px,9vw,110px)}
.mds .wwd-title .wwd-group-title-kr{margin-bottom:0;margin-top:10px}
.mds .mds-sub{margin:12px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.3rem,2.2vw,1.8rem);line-height:1.4;letter-spacing:-.02em;color:var(--ink);word-break:keep-all}
/* how it runs — one month on a line */
.mds .mds-run{grid-column:1/13;margin-top:clamp(80px,11vw,140px)}
.mds .mds-tl{display:grid;grid-template-columns:repeat(4,1fr) 1.2fr;margin-top:clamp(28px,4vw,44px)}
.mds .mds-s{display:flex;flex-direction:column;gap:6px;padding:20px clamp(14px,2vw,24px) 26px;border-left:1px solid var(--line-strong)}
.mds .mds-s-k{font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--ink-soft)}
.mds .mds-s b{font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,6vw,5.6rem);line-height:.95;letter-spacing:-.03em;color:var(--ink)}
.mds .mds-s-t{font-family:var(--font-body);font-size:.92rem;line-height:1.55;color:var(--ink-soft)}
.mds .mds-s--plus{grid-row:1/3;grid-column:5;margin-left:clamp(10px,1.5vw,20px);border:1px dashed var(--line-strong)}
.mds .mds-s--plus b{color:var(--accent)}
.mds .mds-tl-bar{grid-column:1/5;grid-row:2;position:relative;height:44px;display:flex;align-items:center;padding-left:clamp(14px,2vw,24px)}
.mds .mds-tl-bar i{position:absolute;left:0;right:0;top:0;height:3px;background:var(--line-strong)}
.mds .mds-tl-bar i::after{content:"";position:absolute;inset:0;background:var(--accent);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.6s cubic-bezier(.65,0,.35,1) .2s}
.mds .mds-run.is-visible .mds-tl-bar i::after{transform:none}
.mds .mds-tl-bar span{font-family:var(--font-body);font-size:.9rem;font-weight:700;color:var(--ink);padding-top:10px}
.mds .mds-run-note{margin:22px 0 0;font-size:.95rem}
/* process book — a glimpse, the rest is filled in together */
.mds .mds-book{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gap);margin-top:clamp(80px,11vw,140px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line-strong)}
.mds .mds-book-copy{grid-column:1/6}
.mds .mds-book-side{grid-column:7/13}
.mds .mds-book-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap)}
.mds .mds-book-list li{display:flex;gap:14px;align-items:center;min-height:48px;border-bottom:1px solid var(--line);font-family:var(--font-body);font-size:.98rem;font-weight:600;color:var(--ink)}
.mds .mds-book-list li span{font-size:.72rem;font-weight:400;letter-spacing:.06em;color:var(--ink-faint);min-width:18px}
.mds .mds-book-list li.is-locked i{display:block;height:10px;width:var(--w);border-radius:999px;
  background:linear-gradient(90deg,var(--line) 0%,var(--line-strong) 50%,var(--line) 100%);background-size:200% 100%;animation:mds-veil 2.4s ease-in-out infinite}
@keyframes mds-veil{0%{background-position:100% 0}100%{background-position:-100% 0}}
.mds .mds-lock-note{margin:20px 0 0;font-family:var(--font-body);font-size:.95rem;line-height:1.7;color:var(--ink);max-width:460px}
.mds .mds-lock-note::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:10px;vertical-align:middle}
.mds .mds-link{grid-column:1/13;margin-top:clamp(48px,7vw,80px)}
@media (max-width:900px){
  .mds .mds-quote,.mds .mds-intro-body,.mds .mds-book-copy,.mds .mds-book-side{grid-column:1/13}
  .mds .mds-intro-body{margin-top:24px}
  .mds .mds-tl{grid-template-columns:1fr 1fr}
  .mds .mds-s{border-left:0;border-top:1px solid var(--line-strong)}
  .mds .mds-s--plus{grid-row:auto;grid-column:1/3;margin:16px 0 0}
  .mds .mds-tl-bar{grid-column:1/3;grid-row:3;padding-left:0}
  .mds .mds-book-side{margin-top:28px}
  .mds .mds-book-list{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.mds .mds-book-list li.is-locked i{animation:none}.mds .mds-tl-bar i::after{transform:none;transition:none}}


/* v51 — WHAT WE DO reads like a menu board: pinned, it slides sideways as the page scrolls down */
.svc-run{position:relative;border-top:1px solid var(--line)}
.svc-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.svc-track{display:flex;align-items:flex-start;gap:clamp(48px,6vw,96px);width:max-content;padding:0 var(--container);
  transform:translate3d(calc(var(--p,0)*var(--ov,0px)*-1),0,0);will-change:transform}
.svc-head{flex:none;width:min(42vw,620px)}
.svc-head .display{margin-top:14px;font-size:var(--fs-h1)}
.svc-track .wwd-group-title{font-size:clamp(1.6rem,2.6vw,2.4rem)}
.svc-track .wwd-group-title-kr{font-size:.85rem;margin-bottom:24px}
.svc-track .wwd-group-list{gap:13px}
.svc-track .wwd-item-en{font-size:1.08rem;color:var(--ink)}
.svc-track .wwd-item-kr{font-size:.85rem}
.svc-track .wwd-group{flex:none;width:clamp(280px,27vw,420px)}
.svc-track .svc-note{border-top-color:var(--accent)}
.svc-note-text{margin:0;font-family:var(--font-body);font-size:1.02rem;line-height:1.75;color:var(--ink)}
.svc-note-link{margin-top:22px;font-size:1rem}
.svc-bar{position:absolute;left:var(--container);right:var(--container);bottom:clamp(24px,5vh,48px);height:1px;background:var(--line)}
.svc-bar::after{content:"";position:absolute;inset:0;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--p,0))}
@media (max-width:900px){
  .svc-head{width:78vw}
  .svc-track .wwd-group{width:72vw}
}
.svc-run.svc-static{height:auto!important}
.svc-static .svc-stage{position:static;height:auto;display:block;padding:clamp(80px,10vw,140px) 0}
.svc-static .svc-track{flex-wrap:wrap;width:auto;transform:none}
.svc-static .svc-bar{display:none}


/* v52 — first-time readers: Korean beside every English label, a situation guide, a type legend and FAQ */
.guide{padding:clamp(28px,4vw,48px) 0 clamp(64px,8vw,104px)}
.guide-idx{grid-column:1/13;display:block;margin-bottom:18px}
.guide-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.guide-card{display:flex;flex-direction:column;gap:10px;text-align:left;padding:22px 0 0;border:0;border-top:1px solid var(--line-strong);background:none;color:var(--ink);font:inherit;cursor:pointer;text-decoration:none;transition:border-color .3s}
.guide-card b{font-family:var(--font-body);font-weight:700;font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.4;letter-spacing:-.02em;word-break:keep-all}
.guide-card p{margin:0;font-size:.92rem;line-height:1.65;color:var(--ink-soft);word-break:keep-all}
.guide-n{font-size:.72rem;letter-spacing:.08em;color:var(--ink-faint)}
.guide-go{margin-top:auto;padding-top:8px;font-size:.85rem;font-weight:600;color:var(--ink)}
.guide-card:hover,.guide-card:focus-visible{border-top-color:var(--accent)}
.guide-card:hover .guide-go,.guide-card:focus-visible .guide-go{color:var(--accent)}
.works-legend{grid-column:1/13;display:flex;flex-wrap:wrap;gap:8px 28px;margin:calc(-1*clamp(16px,2.4vw,28px)) 0 clamp(28px,4vw,40px);padding:0}
.works-legend div{display:flex;gap:8px;align-items:baseline}
.works-legend dt{font-size:.7rem;font-weight:700;letter-spacing:.06em;color:var(--ink)}
.works-legend dd{margin:0;font-size:.82rem;color:var(--ink-soft)}
.faq{border-top:1px solid var(--line);padding:clamp(80px,10vw,140px) 0}
.faq-head{grid-column:1/5}
.faq-title{margin:14px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.35;letter-spacing:-.02em;color:var(--ink);word-break:keep-all}
.faq-list{grid-column:6/13;border-top:1px solid var(--line-strong)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border:0;background:none;text-align:left;cursor:pointer;font-family:var(--font-body);font-size:1.05rem;font-weight:600;color:var(--ink);word-break:keep-all}
.faq-q i{flex:none;position:relative;width:14px;height:14px}
.faq-q i::before,.faq-q i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transition:transform .3s}
.faq-q i::after{transform:rotate(90deg)}
.faq-item.is-open .faq-q i::after{transform:rotate(0)}
.faq-q:hover,.faq-item.is-open .faq-q{color:var(--accent)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.22,.61,.36,1)}
.faq-a-in{overflow:hidden;max-width:640px}
.faq-a-in p{margin:0;font-size:.98rem;line-height:1.8;color:var(--ink-soft);word-break:keep-all}
.faq-a-in .faq-lead{margin-bottom:8px;font-size:1.12rem;font-weight:700;line-height:1.55;color:var(--ink)}
.faq-cta{display:inline-flex;gap:6px;margin-top:16px;font-family:var(--font-body);font-size:.92rem;font-weight:600;color:var(--accent);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.faq-item.is-open .faq-a{grid-template-rows:1fr}
.faq-item.is-open .faq-a-in{padding-bottom:26px}
@media (max-width:900px){
  .guide-grid{grid-template-columns:1fr 1fr;gap:28px var(--gap)}
  .faq-head,.faq-list{grid-column:1/13}
  .faq-list{margin-top:28px}
}
@media (max-width:560px){.guide-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.faq-a{transition:none}}


/* v53 — DESIGN: a visual archive. Masonry of single works, filters as text buttons, no clicks. */
.dsn-hero-foot{justify-content:flex-start;align-items:flex-start;flex-direction:column;gap:12px}
.dsn-hero-intro{max-width:560px}
.dsn-hero-body{text-align:left;max-width:520px;white-space:pre-line}
.dsn-arch{padding-top:clamp(36px,5vw,64px);padding-bottom:clamp(120px,15vw,240px)}
.dsn-filterbar{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line);margin-bottom:clamp(20px,3vw,32px)}
.dsn-filters{display:flex;gap:clamp(18px,2.6vw,36px);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.dsn-filters::-webkit-scrollbar{display:none}
.dsn-filter{flex:none;white-space:nowrap;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 0 12px;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:none;cursor:pointer;
  font-family:var(--font-body);font-size:.78rem;font-weight:600;letter-spacing:.08em;color:var(--ink-faint);transition:color .2s,border-color .2s}
.dsn-filter:hover{color:var(--ink)}
.dsn-filter-en sup{margin-left:3px;font-size:.62rem;font-weight:500;letter-spacing:0;vertical-align:super}
.dsn-filter-kr{font-size:.7rem;font-weight:500;letter-spacing:0;opacity:.8}
.dsn-filter.is-on{color:var(--accent);border-bottom-color:var(--accent)}
.dsn-filter:focus-visible{outline:1px solid var(--accent);outline-offset:4px}
.dsn-count{flex:none;font-family:var(--font-body);font-size:.72rem;letter-spacing:.1em;color:var(--ink-faint)}
.dsn-masonry{--g:var(--gap);display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:var(--g);align-items:start;animation:dsn-in .38s ease-out}
.dsn-col{display:flex;flex-direction:column;gap:var(--g);min-width:0}
@keyframes dsn-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dsn-item{position:relative;margin:0;break-inside:avoid;cursor:default}
.dsn-media{position:relative;overflow:hidden;background:var(--surface-grey)}
.dsn-media.is-light>img{mix-blend-mode:multiply}
.dsn-frame{position:absolute;inset:0;box-sizing:border-box}
.dsn-slides{position:relative;width:100%;height:100%}
.dsn-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;visibility:hidden}
.dsn-slides img.is-on{visibility:visible}
.dsn-split{display:grid;grid-template-columns:1fr 1fr}
.dsn-split-l{overflow:hidden}.dsn-split-l img{display:block;width:100%;height:auto}
.dsn-split-r{position:relative;padding:17% 20%}
.dsn-grid{display:grid;grid-template-columns:repeat(var(--gc),minmax(0,1fr));grid-auto-rows:1fr;gap:6%}
.dsn-grid img{width:100%;height:100%;min-height:0;object-fit:contain;display:block}
.dsn-media>img,.dsn-media>video{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.16,.84,.44,1)}
.dsn-cap{display:flex;flex-direction:column;gap:3px;padding:10px 2px 6px}
.dsn-cap b{font-family:var(--font-body);font-weight:600;font-size:clamp(.86rem,.95vw,.98rem);line-height:1.4;letter-spacing:-.01em;color:var(--ink);word-break:keep-all;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dsn-cap span{font-family:var(--font-body);font-size:.72rem;line-height:1.45;letter-spacing:.02em;color:var(--ink-faint);overflow-wrap:anywhere}
@media (hover:hover) and (pointer:fine){
  .dsn-item:hover .dsn-media>img,.dsn-item:hover .dsn-media>video{transform:scale(1.015)}
  .dsn-item:hover .dsn-cap b{color:var(--accent)}
}
.dsn-empty{padding:clamp(60px,9vw,120px) 0;animation:dsn-in .38s ease-out}
.dsn-empty-title{font-size:clamp(1.8rem,4.4vw,3.4rem);margin:0 0 14px}
@media (max-width:699px){.dsn-filterbar{margin-left:calc(-1*var(--container));margin-right:calc(-1*var(--container));padding:0 var(--container)}.dsn-count{display:none}}
@media (prefers-reduced-motion:reduce){.dsn-masonry,.dsn-empty{animation:none}.dsn-media>img,.dsn-media>video{transition:none}}


/* v54 — HOME: what BREEN does, readable in a second */
.hero-idx .kr-block{max-width:620px}
.hero-idx .kr-block .hero-what{font-size:clamp(1.25rem,2vw,1.6rem);font-weight:700;line-height:1.4;letter-spacing:-.02em;color:var(--ink);word-break:keep-all}
.hero-idx .kr-block .hero-how{margin-top:8px;font-size:1rem;line-height:1.65;color:var(--ink-soft);word-break:keep-all}
.hero-go{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:18px}
.hero-go-link{font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.06em;color:var(--ink);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;transition:color .2s,border-color .2s}
.hero-go-link:hover{color:var(--accent);border-color:var(--accent)}
.hero-go-cta{font-family:var(--font-body);font-size:.85rem;font-weight:600;color:var(--ink);text-decoration:none;border:1px solid var(--line-strong);border-radius:999px;padding:7px 16px;transition:color .2s,border-color .2s}
.hero-go-cta:hover{color:var(--accent);border-color:var(--accent)}
.intro-step--link{display:block;color:inherit;text-decoration:none;transition:border-color .3s}
.intro-step--link:hover{border-top-color:var(--accent)}
.intro-step--link:hover h3,.intro-step--link:hover .intro-go{color:var(--accent)}
.intro-count{color:var(--ink-faint)}
.intro-items{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.intro-items li{font-family:var(--font-body);font-size:.78rem;color:var(--ink);border:1px solid var(--line-strong);border-radius:999px;padding:4px 11px}
.intro-go{display:inline-block;margin-top:16px;font-family:var(--font-body);font-size:.85rem;font-weight:600;color:var(--ink);transition:color .2s}


/* v55 — Korean reads in whole words and phrases everywhere */
body{word-break:keep-all;overflow-wrap:break-word}
p,li,dd,dt,figcaption,blockquote,td{text-wrap:pretty}
h1,h2,h3,h4{text-wrap:balance}
h1,h2,h3,h4,[class*="-big"],[class*="big-"]{word-break:keep-all}
.kb{display:inline-block;max-width:100%;text-indent:0}


/* v56 — EDUCATION: BREEN type, grid and accent; scenes change as you scroll */
.edu{word-break:keep-all;--hh:68px;--ease:cubic-bezier(.22,.61,.36,1);overflow-x:clip}
.edu .edu-l{display:block}
.edu .edu-sec{padding-top:clamp(64px,9vw,120px)}
.edu .edu-sec+.edu-run{margin-top:0}
.edu .edu-sec--grey,.edu .edu-run.edu-mds,.edu .edu-run.edu-mds .edu-stage{background:var(--surface-grey)}
.edu .edu-run.edu-mds{margin-bottom:0}
.edu .edu-head .display{margin-top:14px}
.edu .edu-h{font-size:var(--fs-h1);line-height:1.02}
.edu .edu-body{margin-top:clamp(22px,3vw,34px);max-width:640px}
.edu .edu-body p{font-size:1.05rem;line-height:1.8;color:var(--ink-soft);margin:0 0 8px}
.edu .edu-body b{display:block;font-weight:700;color:var(--ink);font-size:1.15rem;margin-bottom:12px}
.edu .edu-rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:calc(var(--i,0)*80ms)}
.edu .edu-rv.is-in{opacity:1;transform:none}

/* sticky runs */
.edu .edu-run{position:relative;height:calc(100vh*(var(--n)*.6 + .4))}
.edu .edu-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:flex-start;padding-top:calc(var(--hh) + clamp(28px,7vh,72px));box-sizing:border-box}
.edu .edu-stage>.wrap{width:100%;position:relative}
.edu [data-step]{transition:opacity .5s var(--ease),transform .7s var(--ease)}
.edu .edu-bar{display:flex;gap:6px;margin-top:clamp(28px,5vh,56px)}
.edu .edu-bar i{flex:0 0 40px;height:2px;background:var(--line-strong)}
.edu .edu-bar i.is-active,.edu .edu-bar i.is-past{background:var(--accent)}

/* 00 hero — page-hero frame shared with the other pages */
.edu .edu-hero .hero-idx{align-items:flex-end}
.edu .edu-hero .kr-block{max-width:620px}
.edu .edu-hero-lead{margin:0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.3;letter-spacing:-.03em;color:var(--ink)}
.edu .edu-hero-sub{margin:20px 0 0;font-size:1.15rem;line-height:1.6;font-weight:600}
.edu .edu-hero-body{margin:12px 0 0;max-width:520px;font-size:1rem;line-height:1.8}
.edu .edu-hero-tags{margin:22px 0 0;font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.edu .edu-hero-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.edu .edu-btn{font:600 .95rem/1 var(--font-body);color:var(--ink);background:none;border:1px solid var(--line-strong);border-radius:999px;padding:13px 22px;cursor:pointer;text-decoration:none;transition:color .2s,border-color .2s,background .2s}
.edu .edu-btn:hover{color:var(--accent);border-color:var(--accent)}
.edu .edu-btn--solid{background:var(--ink);border-color:var(--ink);color:#fff}
.edu .edu-btn--solid:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.edu .edu-flow{align-self:flex-end;flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.edu .edu-flow span{font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,4.6vw,4.4rem);line-height:1;letter-spacing:-.03em;color:var(--line-strong);animation:edu-flow 6s var(--ease) infinite;animation-delay:calc(var(--i)*1.2s)}
.edu .edu-flow span.is-accent{animation-name:edu-flow-a}
.edu .edu-flow i{display:block;width:2px;height:clamp(16px,2.4vw,26px);margin-left:.5em;background:var(--line-strong)}
@keyframes edu-flow{0%,8%{color:var(--line-strong)}18%,60%{color:var(--ink)}75%,100%{color:var(--line-strong)}}
@keyframes edu-flow-a{0%,8%{color:var(--line-strong)}18%,60%{color:var(--accent)}75%,100%{color:var(--line-strong)}}

/* 01 why — one strength fills the screen */
.edu .edu-why-in{min-height:46vh;display:flex;flex-direction:column;justify-content:center}
.edu .edu-why-step{position:absolute;left:var(--container);right:var(--container);top:0;opacity:0;transform:translateY(40px)}
.edu .edu-why-step.is-past{transform:translateY(-40px)}
.edu .edu-why-step.is-active{opacity:1;transform:none;position:relative;left:auto;right:auto}
.edu .edu-why-n{font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.edu .edu-why-t{margin:12px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,10vw,9rem);line-height:.92;letter-spacing:-.04em;color:var(--ink)}
.edu .edu-why-b{margin:clamp(18px,3vw,30px) 0 0;max-width:620px;font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.6}

/* 02 teach — one field at a time, list fills in */
.edu .edu-teach-in{min-height:62vh}
.edu .edu-teach-step{position:absolute;left:var(--container);right:var(--container);top:0;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--gap);opacity:0;transform:translateX(40px)}
.edu .edu-teach-step.is-past{transform:translateX(-40px)}
.edu .edu-teach-step.is-active{opacity:1;transform:none}
.edu .edu-teach-n{font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,7vw,6rem);line-height:1;color:var(--accent)}
.edu .edu-teach-t{margin:10px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,4.6vw,4.2rem);line-height:.98;letter-spacing:-.03em}
.edu .edu-teach-b{margin:20px 0 0;font-size:1.1rem;line-height:1.7}
.edu .edu-teach-list{list-style:none;margin:0;padding:0;align-self:end;border-top:1px solid var(--line-strong)}
.edu .edu-teach-list li{font-family:var(--font-body);font-size:1.05rem;font-weight:600;padding:14px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(10px);transition:opacity .4s,transform .5s var(--ease)}
.edu .edu-teach-step.is-active li{opacity:1;transform:none;transition-delay:calc(.2s + var(--j)*70ms)}
.edu .edu-teach-in .edu-bar{position:absolute;left:var(--container);bottom:0}

/* 03 modingso — question big, answers pile up */
.edu .edu-mds-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gap);align-items:start}
.edu .edu-mds-q{position:relative;min-height:40vh}
.edu .edu-mds-qs{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(30px)}
.edu .edu-mds-qs.is-past{transform:translateY(-30px)}
.edu .edu-mds-qs.is-active{opacity:1;transform:none}
.edu .edu-mds-k{font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.edu .edu-mds-big{margin:16px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.9rem,4vw,3.6rem);line-height:1.25;letter-spacing:-.035em;color:var(--ink)}
.edu .edu-mds-end .edu-mds-big{color:var(--accent)}
.edu .edu-mds-sheet{list-style:none;margin:0;padding:22px 24px;background:#fff;border:1px solid var(--line)}
.edu .edu-mds-sheet li{padding:12px 0;border-bottom:1px dashed var(--line-strong);opacity:.18;transition:opacity .5s}
.edu .edu-mds-sheet li:last-child{border-bottom:0}
.edu .edu-mds-sheet li>b{display:block;font-family:var(--font-body);font-size:.72rem;letter-spacing:.1em;color:var(--accent)}
.edu .edu-mds-sheet li>span{display:block;margin-top:4px;font-family:var(--font-body);font-size:.95rem;line-height:1.5;color:var(--ink)}
.edu .edu-mds-sheet li.is-active,.edu .edu-mds-sheet li.is-past,.edu .edu-mds[data-active="5"] .edu-mds-sheet li{opacity:1}
.edu .edu-mds[data-active="5"] .edu-mds-sheet{border-color:var(--accent)}

/* 04 content — a single line from understand to review */
.edu .edu-cc-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.edu .edu-cc-s{opacity:.22;transform:translateY(16px)}
.edu .edu-cc-s.is-active,.edu .edu-cc-s.is-past{opacity:1;transform:none}
.edu .edu-cc-s.is-active .edu-cc-t{color:var(--accent)}
.edu .edu-cc-n{font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.1em;color:var(--ink-faint)}
.edu .edu-cc-t{margin:10px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,2.4vw,2.4rem);letter-spacing:-.03em;transition:color .4s}
.edu .edu-cc-s p{margin:12px 0 0;font-size:1rem;line-height:1.65;color:var(--ink-soft)}
.edu .edu-cc-line{margin-top:clamp(30px,5vh,50px);height:3px;background:var(--line-strong)}
.edu .edu-cc-line i{display:block;height:100%;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--p,0))}

/* 05 case — one big number at a time */
.edu .edu-case{margin-top:clamp(36px,5vw,60px);padding-top:clamp(22px,3vw,32px);border-top:1px solid var(--line-strong);max-width:760px}
.edu .edu-case-org{margin:0;font-family:var(--font-body);font-size:.9rem;font-weight:700;color:var(--accent)}
.edu .edu-case-t{margin:8px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:-.03em}
.edu .edu-case-meta{margin:14px 0 0;font-family:var(--font-body);font-size:.85rem;font-weight:600;letter-spacing:.02em;color:var(--ink)}
.edu .edu-case-b{margin:12px 0 0;font-size:1rem;line-height:1.8}
.edu .edu-num-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gap);align-items:start}
.edu .edu-num-s{grid-column:1;grid-row:1;opacity:0;transform:scale(.96)}
.edu .edu-num-s.is-active{opacity:1;transform:none}
.edu .edu-num-v{margin:0;display:flex;align-items:baseline;gap:.2em;font-family:var(--font-display);font-weight:900;line-height:.9;letter-spacing:-.04em}
.edu .edu-num-v b{font-size:clamp(4.4rem,13vw,12.5rem);color:var(--accent);font-variant-numeric:tabular-nums}
.edu .edu-num-v span{font-size:clamp(1.4rem,3vw,2.6rem);color:var(--ink)}
.edu .edu-num-l{margin:16px 0 0;font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:600}
.edu .edu-num-list{grid-column:2;grid-row:1;list-style:none;margin:0;padding:0;border-top:1px solid var(--line-strong)}
.edu .edu-num-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-family:var(--font-body);color:var(--ink-faint);transition:color .3s}
.edu .edu-num-list li>b{font-weight:700;font-variant-numeric:tabular-nums}
.edu .edu-num-list li small{margin-left:4px;font-size:.75em;font-weight:500}
.edu .edu-num-list li>span{font-size:.85rem;text-align:right}
.edu .edu-num-list li.is-past{color:var(--ink)}
.edu .edu-num-list li.is-active{color:var(--accent)}

/* 06 format — the name list stays, the details change */
.edu .edu-fmt-in{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--gap);align-items:start}
.edu .edu-fmt-names{list-style:none;margin:0;padding:0}
.edu .edu-fmt-names li{display:flex;align-items:baseline;gap:14px;padding:8px 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,2.6vw,2.4rem);letter-spacing:-.02em;line-height:1.1;color:var(--line-strong);transition:color .3s}
.edu .edu-fmt-names li>small{margin-left:4px;font-family:var(--font-body);font-size:.85rem;font-weight:600;letter-spacing:0;color:inherit;opacity:.85}
.edu .edu-fmt-names li>span{font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:.1em}
.edu .edu-fmt-names li.is-active{color:var(--ink)}
.edu .edu-fmt-names li.is-active span{color:var(--accent)}
.edu .edu-fmt-panel{position:relative;min-height:260px;padding-left:clamp(20px,3vw,40px);border-left:1px solid var(--line-strong)}
.edu .edu-fmt-s{position:absolute;inset:0 0 auto clamp(20px,3vw,40px);opacity:0;transform:translateY(20px)}
.edu .edu-fmt-s.is-past{transform:translateY(-20px)}
.edu .edu-fmt-s.is-active{opacity:1;transform:none}
.edu .edu-fmt-time{margin:10px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(2.4rem,5vw,4.6rem);line-height:1;letter-spacing:-.03em;color:var(--accent)}
.edu .edu-fmt-b{margin:20px 0 0;font-size:1.1rem;line-height:1.7;max-width:460px}

/* 07 who */
.edu .edu-who{list-style:none;margin:clamp(36px,5vw,60px) 0 0;padding:0;border-top:1px solid var(--line-strong)}
.edu .edu-who li{display:grid;grid-template-columns:60px minmax(0,5fr) minmax(0,6fr);gap:var(--gap);align-items:baseline;padding:clamp(18px,2.6vw,30px) 0;border-bottom:1px solid var(--line);transition:background .3s}
.edu .edu-who-n{font-family:var(--font-body);font-size:.78rem;color:var(--ink-faint)}
.edu .edu-who-t{font-family:var(--font-body);font-weight:700;font-size:clamp(1.4rem,2.6vw,2.2rem);letter-spacing:-.03em;transition:color .3s}
.edu .edu-who-b{font-size:1.02rem;line-height:1.6;color:var(--ink-soft)}
.edu .edu-who li:hover .edu-who-t{color:var(--accent)}

/* 08 experience — counts first, then every program by role */
.edu .edu-exp-sum{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap);margin-top:clamp(36px,5vw,60px);padding:clamp(22px,3vw,32px) 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.edu .edu-exp-sum b{display:block;font-family:var(--font-display);font-weight:900;font-size:clamp(2.6rem,5.6vw,5.2rem);line-height:.95;letter-spacing:-.03em;color:var(--ink)}
.edu .edu-exp-sum div:first-child b{color:var(--accent)}
.edu .edu-exp-sum span{display:block;margin-top:10px;font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:.06em;line-height:1.5;color:var(--ink-soft)}
.edu .edu-exp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,5vw,72px) var(--gap);margin-top:clamp(40px,5vw,64px)}
.edu .edu-exp-col{border-top:1px solid var(--line-strong);padding-top:18px}
.edu .edu-exp-t{margin:0 0 6px;font-family:var(--font-display);font-weight:900;font-size:clamp(1.2rem,2vw,1.6rem);letter-spacing:-.01em}
.edu .edu-exp-t small{margin-left:10px;font-family:var(--font-body);font-size:.8rem;font-weight:600;color:var(--ink-faint)}
.edu .edu-exp-col ul{list-style:none;margin:0;padding:0}
.edu .edu-exp-col li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-family:var(--font-body)}
.edu .edu-exp-y{font-size:.78rem;font-weight:700;color:var(--accent);padding-top:2px}
.edu .edu-exp-n b{display:block;font-size:.98rem;font-weight:600;line-height:1.45;color:var(--ink)}
.edu .edu-exp-more{border-bottom:0!important}
.edu .edu-exp-more .edu-exp-y{font-size:1.4rem;line-height:.6;letter-spacing:.08em;color:var(--accent);padding-top:6px}
.edu .edu-exp-more .edu-exp-n b{font-weight:600;color:var(--ink-soft)}
.edu .edu-exp-n em{display:block;margin-top:2px;font-style:normal;font-size:.82rem;color:var(--ink-soft)}
/* 09 archive — real material only */
.edu .edu-arch-grid{margin-top:clamp(36px,5vw,60px);overflow:hidden;--h:clamp(220px,30vw,420px)}
.edu .edu-arch-track{display:flex;gap:var(--gap);width:max-content;animation:edu-drift var(--dur,60s) linear infinite}
.edu .edu-arch-grid:hover .edu-arch-track{animation-play-state:paused}
@keyframes edu-drift{to{transform:translateX(calc(-50% - var(--gap)/2))}}
.edu .edu-arch-item{position:relative;margin:0;flex:none}
.edu .edu-arch-media{height:var(--h);overflow:hidden;background:var(--surface-grey)}
.edu .edu-arch-media img{display:block;height:100%;width:auto;filter:grayscale(1);transition:filter .5s var(--ease)}
.edu .edu-arch-item:hover img{filter:none}
.edu .edu-arch-item figcaption{display:flex;flex-direction:column;gap:2px;padding:12px 0 0;max-width:calc(var(--h)*1.3)}
.edu .edu-arch-item figcaption em{font:normal 700 .68rem/1.4 var(--font-body);letter-spacing:.08em;color:var(--accent)}
.edu .edu-arch-item figcaption b{font:700 .9rem/1.4 var(--font-body)}
.edu .edu-arch-item figcaption>span{font:.75rem/1.4 var(--font-body);color:var(--ink-faint)}
@media (hover:none){.edu .edu-arch-media img{filter:none}}

/* 10 cta — site CTA type, grey ground */
.edu .edu-cta{margin-top:clamp(64px,9vw,120px);min-height:100vh;min-height:100svh;display:flex;align-items:center;background:var(--surface-grey);border-top:1px solid var(--line)}
.edu .edu-cta-h{margin:18px 0 0;font-size:var(--fs-h1);line-height:.98}
.edu .edu-cta-h .edu-l:last-child{color:var(--accent)}
.edu .edu-cta-lead{margin:clamp(28px,4vw,44px) 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.4;letter-spacing:-.03em;color:var(--ink)}
.edu .edu-cta-b{margin:14px 0 0;max-width:560px;font-size:1.05rem;line-height:1.8}
.edu .edu-cta-link{margin-top:clamp(28px,4vw,44px);border-bottom:1px solid rgba(19,18,17,.35);padding-bottom:14px;text-decoration:none}
.edu .edu-cta-link:hover{color:var(--accent)}
@media (max-width:860px){
  .edu .edu-teach-step,.edu .edu-mds-in,.edu .edu-num-in,.edu .edu-fmt-in{grid-template-columns:1fr}
  .edu .edu-flow{display:none}
  .edu .edu-teach-in{min-height:76vh}
  .edu .edu-stage{padding-top:calc(var(--hh) + 20px)}
  .edu .edu-run.has-head .edu-stage{padding-top:calc(var(--hh) + 12px);align-items:flex-start}
  .edu .has-head .edu-h{font-size:clamp(1.7rem,7vw,2.2rem)}
  .edu .has-head .section-sub p{font-size:.92rem;line-height:1.65}
  .edu .edu-fmt-names li{flex-wrap:wrap;column-gap:10px}
  .edu .edu-fmt-names li>small{flex-basis:100%;margin:2px 0 0 0;padding-left:30px;font-size:.75rem}
  .edu .edu-teach-list li{padding:9px 0;font-size:.95rem}
  .edu .edu-teach-b{margin-top:12px;font-size:1rem}
  .edu .edu-mds-q{min-height:28vh}
  .edu .edu-mds-big{font-size:clamp(1.5rem,7vw,2.2rem)}
  .edu .edu-mds-sheet{padding:12px 16px}
  .edu .edu-mds-sheet li{padding:7px 0}.edu .edu-mds-sheet li>span{font-size:.82rem}
  .edu .edu-cc-track{grid-template-columns:1fr 1fr;row-gap:24px}
  .edu .edu-num-s,.edu .edu-num-list{grid-column:1}
  .edu .edu-num-list{grid-row:2}
  .edu .edu-num-list li{padding:7px 0}
  .edu .edu-fmt-names li{font-size:1.15rem;padding:5px 0}
  .edu .edu-fmt-panel{border-left:0;border-top:1px solid var(--line-strong);padding:18px 0 0;min-height:200px}
  .edu .edu-fmt-s{left:0}
  .edu .edu-who li{grid-template-columns:36px 1fr}.edu .edu-who-b{grid-column:2}
  .edu .edu-exp{grid-template-columns:1fr}
  .edu .edu-exp-sum{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:22px}
  .edu .edu-exp-col li{grid-template-columns:64px minmax(0,1fr)}
  .edu .edu-arch-grid{--h:56vw}
}
/* ── on the site's 12-column grid ── */
.edu .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
.edu .wrap>*{grid-column:1/13;min-width:0}
.edu .section-head{padding-bottom:0}
.edu .edu-head .display{margin-top:0}
.edu .section-sub{margin-top:clamp(22px,3vw,34px);padding-bottom:0;max-width:none}
.edu .section-sub p{max-width:640px}
.edu .edu-why-in{min-height:0}
.edu .edu-why-step,.edu .edu-why-step.is-active,.edu .edu-why-step.is-past{position:relative;left:auto;right:auto;grid-column:1/11;grid-row:1}
.edu .edu-why-in .edu-bar{grid-row:2}
.edu .edu-teach-in{min-height:0}
.edu .edu-teach-step{position:relative;left:auto;right:auto;grid-column:1/13;grid-row:1;grid-template-columns:repeat(12,minmax(0,1fr))}
.edu .edu-teach-l{grid-column:1/7}.edu .edu-teach-list{grid-column:8/13}
.edu .edu-teach-in .edu-bar{position:static;grid-row:2}
.edu .edu-mds-q{grid-column:1/7}.edu .edu-mds-sheet{grid-column:8/13}
.edu .edu-cc-track{grid-template-columns:repeat(12,minmax(0,1fr))}.edu .edu-cc-s{grid-column:span 3}
.edu .edu-case{grid-column:1/9;max-width:none}
.edu .edu-num-s{grid-column:1/7}.edu .edu-num-list{grid-column:8/13}
.edu .edu-fmt-names{grid-column:1/7}.edu .edu-fmt-panel{grid-column:8/13}
.edu .edu-who li{grid-template-columns:repeat(12,minmax(0,1fr))}
.edu .edu-who-n{grid-column:1/2}.edu .edu-who-t{grid-column:2/7}.edu .edu-who-b{grid-column:8/13}
.edu .edu-exp{grid-template-columns:repeat(12,minmax(0,1fr))}.edu .edu-exp-col{grid-column:span 6}
.edu .edu-cta>.wrap{width:100%;box-sizing:border-box}
.edu .edu-cta .section-head{grid-column:1/13}
.edu .edu-cta-h{margin:0}
.edu .edu-cta-lead{grid-column:1/7}
.edu .edu-cta-b{grid-column:1/7}
.edu .edu-cta-link{grid-column:1/7;justify-self:start}
@media (max-width:860px){
  .edu .wrap>*,.edu .edu-hero-copy,.edu .edu-why-step,.edu .edu-teach-l,.edu .edu-teach-list,.edu .edu-mds-q,.edu .edu-mds-sheet,.edu .edu-case,.edu .edu-num-s,.edu .edu-num-list,.edu .edu-fmt-names,.edu .edu-fmt-panel,.edu .edu-exp-col,.edu .edu-cta-lead,.edu .edu-cta-b,.edu .edu-cta-link{grid-column:1/13}
  .edu .edu-teach-list{grid-row:auto}
  .edu .edu-mds-sheet{grid-row:2;margin-top:20px}
  .edu .edu-num-list{grid-row:2;margin-top:20px}
  .edu .edu-fmt-panel{grid-row:auto;margin-top:16px}
  .edu .edu-cc-s{grid-column:span 6}
  .edu .edu-who-n{grid-column:1/3}.edu .edu-who-t{grid-column:3/13}.edu .edu-who-b{grid-column:3/13}
}
/* scenes carry their own heading, centred in the pinned screen */
.edu .edu-run.has-head .edu-stage{align-items:center;padding-top:var(--hh);padding-bottom:2vh}
.edu .edu-run:not(.has-head) .edu-stage{padding-top:calc(var(--hh) + clamp(20px,5vh,48px))}
.edu .has-head .section-head,.edu .has-head .section-sub{grid-column:1/13}
.edu .has-head .wrap>:is(.section-head,.section-sub):last-of-type,.edu .has-head .section-sub{margin-bottom:clamp(28px,5vh,56px)}
.edu .has-head .section-head{margin-bottom:clamp(28px,5vh,56px)}
.edu .has-head .section-head:has(+.section-sub){margin-bottom:0}
.edu .has-head .edu-h{font-size:clamp(2rem,4.6vw,4.2rem)}
.edu .edu-why .edu-why-step{grid-row:3}.edu .edu-why .edu-bar{grid-row:4}
.edu .edu-teach .edu-teach-step{grid-row:3}.edu .edu-teach .edu-bar{grid-row:4}
.edu .edu-why-t{font-size:clamp(2.8rem,8vw,7.4rem)}
/* ── flat scenes (branding-page rhythm): normal flow, one reveal per item ── */
.edu .edu-fmt-name{display:none}
.edu .edu-run.is-flat{height:auto;padding:clamp(64px,9vw,120px) 0 0}
.edu .edu-run.is-flat .edu-stage{position:relative;height:auto;display:block;padding:0;overflow:visible}
.edu .is-flat .edu-bar,.edu .is-flat .edu-cc-line,.edu .is-flat .edu-num-list,.edu .is-flat .edu-fmt-names{display:none}
.edu .is-flat [data-step]{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;grid-row:auto!important;opacity:0;transform:translateY(22px);clip-path:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}
.edu .is-flat [data-step].is-in{opacity:1;transform:none}
.edu .is-flat .section-head{margin-bottom:0}.edu .is-flat .section-sub{margin-bottom:0}
.edu .is-flat .edu-h{font-size:var(--fs-h1)}
/* why — three rows */
.edu .edu-why.is-flat .edu-why-in{margin-top:clamp(36px,5vw,60px)}
.edu .edu-why.is-flat .edu-why-step{grid-column:1/13;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:clamp(24px,3.4vw,44px) 0;border-top:1px solid var(--line)}
.edu .edu-why.is-flat .edu-why-step:last-of-type{border-bottom:1px solid var(--line)}
.edu .edu-why.is-flat .edu-why-n{grid-column:1/2}
.edu .edu-why.is-flat .edu-why-t{grid-column:2/7;margin:0;font-size:clamp(2rem,4.4vw,3.6rem);line-height:.96}
.edu .edu-why.is-flat .edu-why-b{grid-column:8/13;margin:0;font-size:1.05rem;line-height:1.7}
/* teach — three rows */
.edu .edu-teach.is-flat .edu-teach-step{margin-top:clamp(36px,5vw,60px);padding-top:clamp(24px,3vw,36px);border-top:1px solid var(--line-strong)}
.edu .edu-teach.is-flat .edu-teach-step+.edu-teach-step{margin-top:clamp(40px,5vw,64px)}
.edu .edu-teach.is-flat .edu-teach-list li{opacity:1;transform:none}
/* content — four columns, accent rule fills once */
.edu .edu-cc.is-flat .edu-cc-track{margin-top:clamp(36px,5vw,60px);border-top:2px solid var(--line-strong);padding-top:20px}
.edu .edu-cc.is-flat .edu-cc-s{opacity:0}.edu .edu-cc.is-flat .edu-cc-s.is-in{opacity:1}
.edu .edu-cc.is-flat .edu-cc-s .edu-cc-t{color:var(--ink)}
.edu .edu-cc.is-flat .edu-cc-s:last-child .edu-cc-t{color:var(--accent)}
.edu .edu-cc.is-flat .edu-cc-s{transition-delay:calc(var(--d,0)*90ms)}
/* numbers — one row, counted once */
.edu .edu-num.is-flat{padding-top:clamp(36px,5vw,60px)}
.edu .edu-num.is-flat .edu-num-in{grid-template-columns:repeat(5,minmax(0,1fr));border-top:2px solid var(--ink);padding-top:20px}
.edu .edu-num.is-flat .edu-num-s{grid-column:auto!important;grid-area:auto!important}
.edu .edu-num.is-flat .edu-num-v b{font-size:clamp(2.6rem,5.4vw,5rem)}
.edu .edu-num.is-flat .edu-num-v span{font-size:clamp(.9rem,1.4vw,1.2rem)}
.edu .edu-num.is-flat .edu-num-l{margin-top:10px;font-size:.95rem;line-height:1.5}
/* formats — a readable table */
.edu .edu-fmt.is-flat .edu-fmt-in{margin-top:clamp(36px,5vw,60px)}
.edu .edu-fmt.is-flat .edu-fmt-panel{grid-column:1/13!important;min-height:0;padding:0;border:0;border-top:1px solid var(--line-strong)}
.edu .edu-fmt.is-flat .edu-fmt-s{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:clamp(18px,2.4vw,28px) 0;border-bottom:1px solid var(--line)}
.edu .edu-fmt.is-flat .edu-fmt-name{display:block;grid-column:1/6;margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,2.2vw,1.9rem);letter-spacing:-.02em;line-height:1.1}
.edu .edu-fmt.is-flat .edu-fmt-name small{display:block;margin-top:4px;font-family:var(--font-body);font-size:.8rem;font-weight:600;color:var(--ink-faint)}
.edu .edu-fmt.is-flat .edu-fmt-s .idx{display:none}
.edu .edu-fmt.is-flat .edu-fmt-time{grid-column:6/9;margin:0;font-size:clamp(1.2rem,2vw,1.7rem)}
.edu .edu-fmt.is-flat .edu-fmt-b{grid-column:9/13;margin:0;font-size:.98rem;line-height:1.65}
@media (max-width:860px){
  .edu .edu-why.is-flat .edu-why-n,.edu .edu-why.is-flat .edu-why-t,.edu .edu-why.is-flat .edu-why-b{grid-column:1/13}
  .edu .edu-why.is-flat .edu-why-b{margin-top:10px}
  .edu .edu-num.is-flat .edu-num-in{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px}
  .edu .edu-fmt.is-flat .edu-fmt-name,.edu .edu-fmt.is-flat .edu-fmt-time,.edu .edu-fmt.is-flat .edu-fmt-b{grid-column:1/13}
  .edu .edu-fmt.is-flat .edu-fmt-time{margin-top:6px}.edu .edu-fmt.is-flat .edu-fmt-b{margin-top:6px}
}
/* 06 · 07 — cards drifting sideways (same motion as the photo row) */
.edu .edu-drift{margin-top:clamp(36px,5vw,60px);overflow:hidden}
.edu .edu-drift-track{display:flex;gap:var(--gap);width:max-content;animation:edu-drift var(--dur,48s) linear infinite}
.edu .edu-drift:hover .edu-drift-track{animation-play-state:paused}
.edu .edu-card{flex:none;width:clamp(260px,24vw,340px);min-height:clamp(280px,24vw,330px);display:flex;flex-direction:column;box-sizing:border-box;padding:clamp(22px,2.2vw,30px);border:1px solid var(--line-strong);background:#fff;transition:border-color .3s}
.edu .edu-card:hover{border-color:var(--accent)}
.edu .edu-card-n{font:700 .75rem/1 var(--font-body);letter-spacing:.1em;color:var(--accent)}
.edu .edu-card-t{margin:18px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,1.9vw,1.7rem);line-height:1.08;letter-spacing:-.02em;transition:color .3s}
.edu .edu-card-t small{display:block;margin-top:6px;font:600 .85rem/1.3 var(--font-body);letter-spacing:0;color:var(--ink-soft)}
.edu .edu-card:hover .edu-card-t{color:var(--accent)}
.edu .edu-card-meta{margin:auto 0 0;padding-top:24px;font-family:var(--font-display);font-weight:900;font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1;letter-spacing:-.02em;color:var(--accent)}
.edu .edu-card-b{margin:14px 0 0;font-size:.95rem;line-height:1.65;color:var(--ink-soft)}
.edu .edu-card--who{min-height:clamp(220px,18vw,250px)}
.edu .edu-card--who .edu-card-t{font-family:var(--font-body);font-weight:800;letter-spacing:-.03em}
.edu .edu-card--who .edu-card-b{margin-top:auto;padding-top:24px}
@media (hover:none){.edu .edu-drift:hover .edu-drift-track{animation-play-state:running}}
/* reduced motion: every scene shown settled, one after another */
.edu.edu-static .edu-run{height:auto}
.edu.edu-static .edu-stage{position:relative;height:auto;padding:clamp(40px,6vw,80px) 0}
.edu.edu-static [data-step]{position:relative!important;inset:auto!important;opacity:1!important;transform:none!important;margin-bottom:40px}
.edu.edu-static .edu-flow span{animation:none;color:var(--ink)}
.edu.edu-static .edu-cc-line,.edu.edu-static .edu-bar{display:none}
/* 09 — fixed title on the left, photos drifting on their own on the right */
.edu .edu-arch2-in{display:flex;align-items:center;gap:clamp(32px,4vw,64px);padding-left:var(--container)}
.edu .edu-arch2-head{flex:none;width:clamp(320px,38vw,580px)}
.edu .edu-arch2-head .display{margin:14px 0 0;font-size:var(--fs-h1);line-height:1.05}
.edu .edu-arch2-head .kr-soft{margin:clamp(20px,2.4vw,28px) 0 0;max-width:460px;font-size:1.02rem;line-height:1.75}
.edu .edu-arch2-view{flex:1;min-width:0;overflow:hidden}
.edu .edu-arch2-track{display:flex;gap:var(--gap);width:max-content;animation:edu-drift var(--dur,54s) linear infinite}
.edu .edu-arch2-view:hover .edu-arch2-track{animation-play-state:paused}
.edu .edu-arch2 .hfig-img{height:clamp(200px,32vh,320px)}
@media (max-width:900px){
  .edu .edu-arch2-in{flex-direction:column;align-items:stretch;padding-left:0;gap:28px}
  .edu .edu-arch2-head{width:auto;padding:0 var(--container)}
  .edu .edu-arch2 .hfig-img{height:30vh}
}
@media (prefers-reduced-motion:reduce){.edu .edu-arch2-view{overflow-x:auto}.edu .edu-arch2 .hfig[aria-hidden]{display:none}.edu .edu-arch-grid,.edu .edu-drift{overflow-x:auto}.edu .edu-card[aria-hidden]{display:none}.edu .edu-arch-grid{overflow-x:auto}.edu .edu-arch-item[aria-hidden]{display:none}.edu *{transition:none!important;animation:none!important}}

.contact-form select{width:100%;font:inherit;color:inherit;background:transparent;border:0;border-bottom:1px solid #1312114d;padding:10px 0;border-radius:0;-webkit-appearance:none;appearance:none}

/* v57 — ABOUT: BREEN on show. Site type, grid and accent only. */
.abt{--hh:68px;--ease:cubic-bezier(.22,.61,.36,1);--snap:cubic-bezier(.7,0,.2,1);word-break:keep-all;overflow-x:clip}
.abt .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
.abt .wrap>*{grid-column:1/13;min-width:0}
.abt .abt-l{display:block;overflow:hidden;padding-bottom:.04em}
.abt .abt-l>span{display:block}
.abt .abt-b{display:block}
.abt .abt-n{display:block;font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.abt .abt-tag{display:block;font-family:var(--font-body);font-size:.6rem;font-weight:700;letter-spacing:.14em}
.abt .section-head{padding-bottom:0}
.abt .section-sub{margin-top:clamp(20px,3vw,30px);padding-bottom:0}
.abt .section-sub p{max-width:600px;margin:0 0 6px;font-size:1.05rem;line-height:1.8;color:var(--ink-soft)}
.abt .abt-rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.abt .abt-rv.is-in{opacity:1;transform:none}
.abt .abt-sec{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(40px,5vw,64px)}

/* pinned runs: content sits under the header, never an empty screen */
.abt .abt-run{position:relative;height:calc(100vh*(var(--n)*.62 + .4))}
.abt .abt-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center;padding:var(--hh) 0 2vh;box-sizing:border-box}
.abt .abt-stage>.wrap{width:100%}
.abt [data-step]{transition:opacity .45s var(--ease),transform .65s var(--ease),clip-path .7s var(--snap)}
.abt .abt-bar{display:flex;gap:6px;margin-top:clamp(24px,4vh,44px)}
.abt .abt-bar i{flex:0 0 40px;height:2px;background:var(--line-strong);transition:background .3s}
.abt .abt-bar i.is-active,.abt .abt-bar i.is-past{background:var(--accent)}

/* 00 hero — words run, then WE ARE BREEN. */
.abt .abt-hero-h{position:relative}
.abt .abt-cyc{position:absolute;left:0;top:0;right:0}
.abt .abt-cyc span{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;clip-path:inset(0 0 100% 0)}
.abt.abt-go .abt-cyc span{animation:abt-cyc .46s var(--snap) both;animation-delay:calc(.1s + var(--i)*.3s)}
@keyframes abt-cyc{0%{opacity:1;clip-path:inset(0 0 100% 0);transform:translateY(30%) scale(.92)}35%,65%{opacity:1;clip-path:inset(0);transform:none}100%{opacity:1;clip-path:inset(100% 0 0 0);transform:translateY(-30%) scale(1.04)}}
.abt .abt-final .abt-l>span{transform:translateY(110%)}
.abt.abt-go .abt-final .abt-l>span{transform:none;transition:transform .8s var(--snap) 1.3s}
.abt.abt-go .abt-final .abt-l:nth-child(2)>span{transition-delay:1.4s}
.abt .abt-hero .kr-block{max-width:560px}
.abt .abt-hero-lead{margin:0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.5;letter-spacing:-.02em;color:var(--ink)}
.abt .abt-hero-body{margin:14px 0 0;font-size:1rem;line-height:1.8}
.abt .abt-hero-copy,.abt .hero-statement{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease) 1.6s,transform .9s var(--ease) 1.6s}
.abt.abt-go .abt-hero-copy,.abt.abt-go .hero-statement{opacity:1;transform:none}

/* 01 think · make · share */
.abt .abt-tms-steps{display:grid}
.abt .abt-tms-s{grid-area:1/1;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(30px)}
.abt .abt-tms-s.is-active{opacity:1;clip-path:inset(0);transform:none}
.abt .abt-tms-s.is-past{transform:translateY(-30px)}
.abt .abt-tms-w{margin:10px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(5rem,19vw,17rem);line-height:.86;letter-spacing:-.045em;color:var(--ink)}
.abt .abt-tms-s.is-active .abt-tms-w{color:var(--accent)}
.abt .abt-tms-b{margin:clamp(14px,2vw,22px) 0 0;font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:600}
.abt .abt-tms-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);border-top:2px solid var(--ink)}
.abt .abt-tms-row div{padding-top:16px;position:relative}
.abt .abt-tms-row b{display:block;margin-top:8px;font-family:var(--font-display);font-weight:900;font-size:clamp(2.6rem,7vw,6.4rem);line-height:.9;letter-spacing:-.04em}
.abt .abt-tms-end{margin:clamp(28px,4vw,48px) 0 0;display:flex;flex-wrap:wrap;gap:.3em .6em;font-family:var(--font-display);font-weight:900;font-size:clamp(1.4rem,2.8vw,2.4rem);letter-spacing:-.02em}
.abt .abt-tms-end span{opacity:0;transform:translateY(12px);transition:opacity .4s,transform .5s var(--ease)}
.abt .abt-tms-all.is-active .abt-tms-end span{opacity:1;transform:none;transition-delay:calc(.25s + var(--i)*.14s)}
.abt .abt-tms-end span:last-child{color:var(--accent)}

/* 02 belief — GOOD WORK, then the sentence completes; one line joins WORK to THINKING */
.abt .abt-belief .abt-stage{background:var(--surface-grey)}
.abt .abt-belief-idx{margin-bottom:clamp(16px,2.4vw,26px)}
.abt .abt-belief-h{position:relative;margin:0;font-size:var(--fs-hero);line-height:.92}
.abt .abt-belief-h>span{display:block}
.abt .abt-belief-h b{font-weight:inherit;display:inline-block;position:relative}
.abt .abt-bs,.abt .abt-bt{clip-path:inset(0 100% 0 0);transition:clip-path .9s var(--snap)}
.abt .abt-belief[data-active="1"] .abt-bs,.abt .abt-belief[data-active="2"] .abt-bs{clip-path:inset(0)}
.abt .abt-belief[data-active="2"] .abt-bt{clip-path:inset(0)}
.abt .abt-work,.abt .abt-think{transition:color .5s}
.abt .abt-belief[data-active="2"] .abt-work,.abt .abt-belief[data-active="2"] .abt-think{color:var(--accent)}
.abt .abt-link{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.abt .abt-link path{fill:none;stroke:var(--accent);stroke-width:6;stroke-linejoin:miter;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--snap) .35s}
.abt .abt-belief[data-active="2"] .abt-link path{stroke-dashoffset:0}
.abt.abt-static .abt-link path{stroke-dashoffset:0}
.abt .abt-belief-body{margin-top:clamp(24px,4vh,44px);max-width:600px;opacity:0;transform:translateY(14px);transition:opacity .6s .3s,transform .7s var(--ease) .3s}
.abt .abt-belief[data-active="2"] .abt-belief-body{opacity:1;transform:none}
.abt .abt-belief-body .kr{margin:0;font-size:1.2rem;font-weight:700}
.abt .abt-belief-body .kr-soft{margin:10px 0 0;font-size:1.02rem;line-height:1.8}

/* 03 how we work */
.abt .abt-hww .section-head{margin-bottom:clamp(24px,4vh,48px)}
.abt .abt-hww-text{grid-column:1/7;display:grid}
.abt .abt-hww-s{grid-area:1/1;opacity:0;transform:translateY(24px)}
.abt .abt-hww-s.is-active{opacity:1;transform:none}.abt .abt-hww-s.is-past{transform:translateY(-24px)}
.abt .abt-hww-w{margin:10px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(3.2rem,8vw,7.4rem);line-height:.9;letter-spacing:-.04em}
.abt .abt-hww-b{margin:18px 0 0;font-size:1.15rem;line-height:1.6;font-weight:600}
.abt .abt-venn{grid-column:7/13;position:relative;aspect-ratio:1.15;max-height:58vh;justify-self:center;width:100%}
.abt .abt-c{position:absolute;width:52%;aspect-ratio:1;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;transition:transform .8s var(--snap),background-color .5s,border-color .5s,opacity .5s;mix-blend-mode:multiply}
.abt .abt-c b{font-family:var(--font-display);font-weight:900;font-size:clamp(.9rem,1.5vw,1.3rem);letter-spacing:.02em;transition:opacity .4s}
.abt .abt-c--0{left:0;top:4%;transform:translate(-10%,-6%)}
.abt .abt-c--1{right:0;top:4%;transform:translate(10%,-6%)}
.abt .abt-c--2{left:24%;bottom:0;transform:translateY(8%)}
.abt .abt-hww[data-active="0"] .abt-c--0,.abt .abt-hww[data-active="1"] .abt-c--1,.abt .abt-hww[data-active="2"] .abt-c--2{background:var(--accent);border-color:var(--accent)}
.abt .abt-hww[data-active="3"] .abt-c{transform:none;background:color-mix(in srgb,var(--accent) 45%,transparent);border-color:var(--accent)}
.abt .abt-hww[data-active="3"] .abt-c b{opacity:.35}
.abt .abt-venn em{position:absolute;left:50%;top:50%;translate:-50% -30%;font-style:normal;font-family:var(--font-display);font-weight:900;font-size:clamp(1.2rem,2.4vw,2rem);letter-spacing:-.02em;color:var(--ink);opacity:0;transition:opacity .5s .4s}
.abt .abt-hww[data-active="3"] .abt-venn em{opacity:1}

/* 04 what we bring together — scattered, then gathered into BREEN */
.abt .abt-bring .section-head{margin-bottom:0}
.abt .abt-field{position:relative;height:clamp(240px,40vh,420px);margin-top:clamp(16px,3vh,30px);--q:clamp(0,(var(--p,0) - .8)/.14,1)}
.abt .abt-word{position:absolute;left:calc((var(--x) + (42 - var(--x))*var(--q))*1%);top:calc((var(--y) + (44 - var(--y))*var(--q))*1%);
  padding:4px 0;border:0;background:none;cursor:default;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,3.2vw,3rem);letter-spacing:-.02em;line-height:1;color:var(--line-strong);opacity:calc(1 - var(--q));transition:color .35s}
.abt .abt-word::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform .4s var(--ease)}
.abt .abt-bring[data-active="0"] .abt-word[data-k="0"],.abt .abt-bring[data-active="1"] .abt-word[data-k="1"],.abt .abt-bring[data-active="2"] .abt-word[data-k="2"],.abt .abt-bring[data-active="3"] .abt-word[data-k="3"],.abt .abt-bring[data-active="4"] .abt-word[data-k="4"],
.abt .abt-bring[data-hover="0"] .abt-word[data-k="0"],.abt .abt-bring[data-hover="1"] .abt-word[data-k="1"],.abt .abt-bring[data-hover="2"] .abt-word[data-k="2"],.abt .abt-bring[data-hover="3"] .abt-word[data-k="3"],.abt .abt-bring[data-hover="4"] .abt-word[data-k="4"]{color:var(--ink)}
.abt .abt-bring[data-active="0"] .abt-word[data-k="0"]::after,.abt .abt-bring[data-active="1"] .abt-word[data-k="1"]::after,.abt .abt-bring[data-active="2"] .abt-word[data-k="2"]::after,.abt .abt-bring[data-active="3"] .abt-word[data-k="3"]::after,.abt .abt-bring[data-active="4"] .abt-word[data-k="4"]::after{transform:none}
.abt .abt-breen{position:absolute;left:50%;top:50%;margin:0;translate:-50% -50%;font-family:var(--font-display);font-weight:900;font-size:clamp(4rem,15vw,13rem);line-height:1;letter-spacing:-.05em;color:var(--accent);opacity:var(--q);transform:scale(calc(.8 + .2*var(--q)))}
.abt .abt-desc{display:grid;margin-top:clamp(12px,2vh,24px);min-height:120px}
.abt .abt-desc-s{grid-area:1/1;opacity:0;transform:translateY(14px);max-width:620px}
.abt .abt-desc-s b{display:block;margin-top:6px;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,2.2vw,1.9rem);letter-spacing:-.01em}
.abt .abt-desc-s p{margin:8px 0 0;font-size:1rem;line-height:1.7}
.abt .abt-bring:not([data-hover]) .abt-desc-s.is-active,.abt .abt-bring[data-hover="0"] .abt-desc-s[data-k="0"],.abt .abt-bring[data-hover="1"] .abt-desc-s[data-k="1"],.abt .abt-bring[data-hover="2"] .abt-desc-s[data-k="2"],.abt .abt-bring[data-hover="3"] .abt-desc-s[data-k="3"],.abt .abt-bring[data-hover="4"] .abt-desc-s[data-k="4"]{opacity:1;transform:none}
@media (hover:hover) and (pointer:fine){.abt .abt-word{cursor:pointer}.abt .abt-word:hover{color:var(--ink)}}

/* 05 in practice */
.abt .abt-tagline{display:flex;flex-wrap:wrap;gap:8px 28px;margin:clamp(24px,3vw,36px) 0 0;font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--accent)}
.abt .abt-msg{background:var(--accent);color:var(--ink);padding:clamp(60px,8vw,110px) 0;cursor:default;user-select:none}
.abt .abt-msg-n{color:var(--ink)}
.abt .abt-msg-stack{display:grid;margin-top:clamp(20px,3vw,32px);min-height:clamp(160px,18vw,260px)}
.abt .abt-msg-s{grid-area:1/1;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(18px);transition:opacity .35s,clip-path .55s var(--snap),transform .55s var(--snap)}
.abt .abt-msg-s.is-on{opacity:1;clip-path:inset(0);transform:none}
.abt .abt-msg-en{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(2.2rem,6.4vw,6rem);line-height:.95;letter-spacing:-.035em;text-transform:uppercase;max-width:14em}
.abt .abt-msg-kr{margin:16px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1rem,1.6vw,1.3rem)}
.abt .abt-msg-bar{display:flex;gap:6px;margin-top:clamp(24px,3vw,36px)}
.abt .abt-msg-bar i{flex:1;max-width:60px;height:2px;background:rgba(19,18,17,.25);transition:background .3s}
.abt .abt-msg-bar i.is-on{background:var(--ink)}

.abt .abt-ex .abt-stage{background:var(--surface-grey)}
.abt .abt-ex .wrap{grid-template-rows:auto auto}
.abt .abt-ex-s{grid-area:1/1/2/13;opacity:0;transform:translateY(24px)}
.abt .abt-ex-s.is-active{opacity:1;transform:none}.abt .abt-ex-s.is-past{transform:translateY(-24px)}
.abt .abt-ex .abt-bar{grid-row:2}
.abt .abt-obj-img{display:block;width:100%;height:100%;object-fit:cover}
/* posters cross the screen */
.abt .abt-poster-track{display:flex;gap:var(--gap);margin-top:20px;width:max-content;transform:translateX(calc(8vw - var(--lp,0)*40vw))}
.abt .abt-poster{margin:0;flex:none;width:clamp(200px,24vw,340px);aspect-ratio:3/4;background:#fff;box-shadow:0 1px 0 var(--line-strong)}
.abt .abt-poster--1{background:var(--ink);color:#fff}.abt .abt-poster--2{background:var(--accent)}.abt .abt-poster--3{background:#fff}
.abt .abt-poster-in{height:100%;box-sizing:border-box;padding:clamp(14px,1.6vw,22px);display:flex;flex-direction:column}
.abt .abt-poster-t{margin:auto 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.6rem,2.8vw,2.6rem);line-height:.92;letter-spacing:-.03em;text-transform:uppercase}
.abt .abt-poster-f{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid currentColor;padding-top:8px;font-size:.62rem;letter-spacing:.1em}
.abt .abt-poster-f b{font-family:var(--font-display);font-size:.9rem;letter-spacing:0}
.abt .abt-poster-f em{font-style:normal;font-weight:700}
/* question cards fan out from a stack; hover turns a card over */
.abt .abt-cards{position:relative;height:clamp(240px,34vw,380px);margin-top:20px;perspective:1200px}
.abt .abt-card{position:absolute;left:50%;top:0;width:clamp(150px,16vw,220px);aspect-ratio:5/7;margin-left:calc(clamp(150px,16vw,220px)/-2);outline:0;
  --s:clamp(0,var(--lp,0)*1.6,1);transform:translateX(calc((var(--i) - 2.5)*var(--s)*clamp(120px,15vw,210px))) rotate(calc((var(--i) - 2.5)*(1 - var(--s))*4deg));transition:transform .2s linear;z-index:var(--i)}
.abt .abt-card-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s var(--snap)}
.abt .abt-card-f,.abt .abt-card-b{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-sizing:border-box;padding:16px;display:flex;flex-direction:column;border:1px solid var(--line-strong);background:#fff}
.abt .abt-card-f p,.abt .abt-card-b p{margin:auto 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1rem,1.5vw,1.35rem);line-height:1;letter-spacing:-.01em}
.abt .abt-card-f b{font-family:var(--font-display);font-size:.8rem}
.abt .abt-card-b{transform:rotateY(180deg);background:var(--ink);color:#fff;border-color:var(--ink)}
.abt .abt-card-b p{font-size:clamp(1.3rem,2vw,1.8rem);color:var(--accent)}
.abt .abt-card-b em{font-style:normal;font-size:.58rem;letter-spacing:.12em}
@media (hover:hover) and (pointer:fine){.abt .abt-card:hover .abt-card-in,.abt .abt-card:focus .abt-card-in{transform:rotateY(180deg)}.abt .abt-card:hover{z-index:9}}
/* worksheet pages turn with scroll */
.abt .abt-book{position:relative;width:clamp(220px,26vw,340px);aspect-ratio:3/4;margin:20px 0 0 clamp(0px,18vw,320px);perspective:2600px}
.abt .abt-page{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;z-index:calc(10 - var(--i,0) + var(--t)*20*var(--i,0));
  --t:clamp(0,var(--lp,0)*5.6 - var(--i,0),1);transform:rotateY(calc(var(--t)*-168deg));transition:transform .2s linear}
.abt .abt-face,.abt .abt-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff;border:1px solid var(--line-strong);box-sizing:border-box}
.abt .abt-back{transform:rotateY(180deg);background:#f7f7f5}
.abt .abt-cover{--i:0}
.abt .abt-page:last-child{--t:0}.abt .abt-cover .abt-face{background:var(--ink);color:#fff;border-color:var(--ink)}
.abt .abt-cover .abt-back{background:var(--ink);border-color:var(--ink)}
.abt .abt-page-in{height:100%;box-sizing:border-box;padding:clamp(16px,1.8vw,24px);display:flex;flex-direction:column}
.abt .abt-cover-t{margin:auto 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:.92;letter-spacing:-.03em}
.abt .abt-cover b{font-family:var(--font-display);color:var(--accent)}
.abt .abt-page-t{margin:14px 0 18px;font-family:var(--font-body);font-weight:700;font-size:1.1rem}
.abt .abt-page-in i{display:block;height:1px;background:var(--line-strong);margin-top:28px}

/* 06 clients */
.abt .about-clients{margin-top:0}
.abt .abt-clients-cap{margin:10px 0 20px;font-size:.9rem;max-width:520px}

/* closing line, then the CTA */
.abt .abt-close{padding:clamp(80px,11vw,150px) 0 clamp(20px,3vw,40px)}
.abt .abt-close-h{margin:0;font-size:var(--fs-h1);line-height:.96}
.abt .abt-close-h .abt-l:last-child{color:var(--accent)}

@media (max-width:860px){
  .abt .abt-hww-text,.abt .abt-venn{grid-column:1/13}
  .abt .abt-venn{width:74%;max-height:none;margin-top:20px}
  .abt .abt-tms-row b{font-size:clamp(1.3rem,6.4vw,2.2rem);white-space:nowrap}
  .abt .abt-field{height:30vh}
  .abt .abt-word{font-size:clamp(1rem,5vw,1.5rem)}
  .abt .abt-poster-track{transform:translateX(calc(4vw - var(--lp,0)*150vw))}
  .abt .abt-poster{width:58vw}
  .abt .abt-card{width:28vw;margin-left:-14vw;transform:translate(calc((var(--mc) - 1)*var(--s)*30vw),calc(var(--mr)*var(--s)*42vw)) rotate(calc((var(--i) - 2.5)*(1 - var(--s))*4deg))}
  .abt .abt-cards{height:84vw}
  .abt .abt-card-f,.abt .abt-card-b{padding:10px}
  .abt .abt-card-f p{font-size:.85rem}
  .abt .abt-book{width:58vw;margin-left:8vw}
  .abt .abt-belief-h{font-size:clamp(2.6rem,12vw,4rem)}
}
/* ── flat scenes (branding-page rhythm): normal flow, one soft reveal per item ── */
.abt .abt-run.is-flat{height:auto}
.abt .is-flat .abt-stage{position:relative;height:auto;display:block;overflow:visible;padding:clamp(64px,9vw,120px) 0 0}
.abt .is-flat .abt-bar{display:none}
.abt .is-flat [data-step]{opacity:0;transform:translateY(22px);clip-path:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}
.abt .is-flat [data-step].is-in{opacity:1;transform:none}
/* think · make · share — three columns, then the line */
.abt .abt-tms.is-flat .abt-tms-steps{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);border-top:2px solid var(--ink)}
.abt .abt-tms.is-flat .abt-tms-s{grid-area:auto;padding-top:16px}
.abt .abt-tms.is-flat .abt-tms-s:nth-child(2){transition-delay:.1s}.abt .abt-tms.is-flat .abt-tms-s:nth-child(3){transition-delay:.2s}
.abt .abt-tms.is-flat .abt-tms-w{font-size:clamp(2.6rem,8vw,7.4rem);color:var(--ink)}
.abt .abt-tms.is-flat .abt-tms-s:nth-child(3) .abt-tms-w{color:var(--accent)}
.abt .abt-tms.is-flat .abt-tms-b{font-size:clamp(1rem,1.4vw,1.2rem)}
.abt .abt-tms.is-flat .abt-tms-all{grid-column:1/-1}
.abt .abt-tms.is-flat .abt-tms-row{display:none}
.abt .abt-tms.is-flat .abt-tms-all.is-in .abt-tms-end span{opacity:1;transform:none;transition-delay:calc(var(--i)*.1s)}
/* belief — whole sentence, the bracket draws once */
.abt .abt-belief.is-flat{margin-top:clamp(64px,9vw,120px)}
.abt .abt-belief.is-flat .abt-stage{padding:clamp(64px,9vw,120px) 0}
.abt .abt-belief.is-flat .abt-bs,.abt .abt-belief.is-flat .abt-bt{clip-path:none}
.abt .abt-belief.is-flat .abt-belief-body{opacity:1;transform:none}
/* what we bring — rows on the grid */
.abt .abt-bring.is-flat .abt-field{display:none}
.abt .abt-bring.is-flat .abt-desc{display:block;min-height:0;margin-top:clamp(36px,5vw,60px)}
.abt .abt-bring.is-flat .abt-desc-s{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;max-width:none;padding:clamp(20px,2.6vw,32px) 0;border-top:1px solid var(--line)}
.abt .abt-bring.is-flat .abt-desc-s:last-child{border-bottom:1px solid var(--line)}
.abt .abt-bring.is-flat .abt-desc-s .abt-n{grid-column:1/2}
.abt .abt-bring.is-flat .abt-desc-s b{grid-column:2/7;margin:0;font-size:clamp(1.4rem,2.6vw,2.3rem)}
.abt .abt-bring.is-flat .abt-desc-s p{grid-column:8/13;margin:0}
.abt .abt-bring.is-flat .abt-desc-s:last-child b{color:var(--accent)}
/* in practice — the objects laid out like an exhibition table */
.abt .abt-ex.is-flat .abt-stage{padding:clamp(64px,9vw,120px) 0}
.abt .abt-ex.is-flat .abt-ex-s{grid-area:auto;grid-column:1/13}
.abt .abt-ex.is-flat .abt-ex-s+.abt-ex-s{margin-top:clamp(48px,6vw,80px)}
.abt .abt-ex.is-flat .abt-poster-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:auto;transform:none}
.abt .abt-ex.is-flat .abt-poster{width:auto}
.abt .abt-ex.is-flat .abt-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap);height:auto}
.abt .abt-ex.is-flat .abt-card{position:relative;left:auto;width:auto;margin:0;transform:none;transition:none}
.abt .abt-ex.is-flat .abt-book{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap);width:auto;aspect-ratio:auto;margin:20px 0 0;perspective:none}
.abt .abt-ex.is-flat .abt-page{position:relative;inset:auto;aspect-ratio:3/4;transform:none;transition:none;z-index:auto}
.abt .abt-ex.is-flat .abt-back{display:none}
.abt .abt-ex.is-flat .abt-page-t{font-size:.95rem}
.abt .abt-ex.is-flat .abt-cover-t{font-size:clamp(1rem,1.7vw,1.6rem)}
.abt .abt-bring.is-flat .abt-desc-s b small{display:inline-block;margin-left:12px;font:600 .9rem/1.3 var(--font-body);letter-spacing:0;color:var(--ink-soft);vertical-align:.25em}
.abt .abt-bring.is-flat .abt-desc-s:last-child b small{color:var(--ink-soft)}
@media (max-width:860px){
  .abt .abt-tms.is-flat .abt-tms-steps{grid-template-columns:1fr;border-top:0}
  .abt .abt-tms.is-flat .abt-tms-s{border-top:2px solid var(--ink);padding:14px 0 22px}
  .abt .abt-tms.is-flat .abt-tms-w{font-size:clamp(3rem,16vw,4.6rem)}
  .abt .abt-bring.is-flat .abt-desc-s .abt-n,.abt .abt-bring.is-flat .abt-desc-s b,.abt .abt-bring.is-flat .abt-desc-s p{grid-column:1/13}
  .abt .abt-bring.is-flat .abt-desc-s b{margin-top:6px}.abt .abt-bring.is-flat .abt-desc-s p{margin-top:8px}
  .abt .abt-ex.is-flat .abt-poster-track{grid-template-columns:repeat(2,minmax(0,1fr))}
  .abt .abt-ex.is-flat .abt-poster{width:auto}
  .abt .abt-ex.is-flat .abt-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .abt .abt-ex.is-flat .abt-card{width:auto;margin:0;transform:none}
  .abt .abt-ex.is-flat .abt-book{grid-template-columns:repeat(3,minmax(0,1fr));width:auto;margin-left:0}
  .abt .abt-ex.is-flat .abt-page-in{padding:10px}.abt .abt-ex.is-flat .abt-page-t{font-size:.72rem;margin:8px 0}.abt .abt-ex.is-flat .abt-cover-t{font-size:1rem}
  .abt .abt-ex.is-flat .abt-page-in i{margin-top:14px}
}
/* reduced motion: every scene settled, one after another */
.abt.abt-static .abt-run{height:auto}
.abt.abt-static .abt-stage{position:relative;height:auto;padding:clamp(40px,6vw,80px) 0}
.abt.abt-static [data-step]{grid-area:auto!important;opacity:1!important;transform:none!important;clip-path:none!important;margin-bottom:32px}
.abt.abt-static .abt-cyc{display:none}
.abt.abt-static .abt-final .abt-l>span,.abt.abt-static .abt-hero-copy,.abt.abt-static .hero-statement{transform:none;opacity:1}
.abt.abt-static .abt-bs,.abt.abt-static .abt-bt{clip-path:none}
.abt.abt-static .abt-belief-body{opacity:1;transform:none}
.abt.abt-static .abt-msg-s{display:none}.abt.abt-static .abt-msg-s.is-on{display:block}
.abt.abt-static .abt-field{display:none}
.abt.abt-static .abt-bar{display:none}
@media (prefers-reduced-motion:reduce){.abt *{transition:none!important;animation:none!important}}

/* campaign messages — pinned run, one message per scroll step */
#root .abt .abt-msg.abt-msg--run{padding:0;height:calc(100vh*(var(--n)*.45 + 1))}
.abt .abt-msg--run .abt-msg-stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;box-sizing:border-box;padding:var(--hh) 0 0}
.abt .abt-msg--run .abt-msg-stage>.wrap{width:100%}
.abt .abt-msg--run.is-static{height:auto}
.abt .abt-msg--run.is-static .abt-msg-stage{position:static;height:auto;padding:clamp(64px,9vw,120px) 0}
.abt .abt-msg--run.is-static .abt-msg-s{display:block;grid-area:auto;opacity:1;clip-path:none;transform:none;margin-bottom:28px}
.abt .abt-msg--run.is-static .abt-msg-bar{display:none}


/* v58 — MODINGSO® landing: site type, grid and accent */
.mdl{--hh:68px;--ease:cubic-bezier(.22,.61,.36,1);--snap:cubic-bezier(.7,0,.2,1);word-break:keep-all;overflow-x:clip}
.mdl sup{font-size:.42em;vertical-align:super;line-height:0;margin-left:.04em}
.mdl .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
.mdl .wrap>*{grid-column:1/13;min-width:0}
.mdl .mdl-l{display:block;overflow:hidden;padding-bottom:.05em}.mdl .mdl-l>span{display:block}
.mdl .mdl-b{display:block}
.mdl .mdl-n{display:block;font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.mdl .mdl-tag{display:block;font-family:var(--font-body);font-size:.6rem;font-weight:700;letter-spacing:.14em}
.mdl .section-head{padding-bottom:0}
.mdl .mdl-h{font-size:clamp(2rem,4.6vw,4.2rem);line-height:1.05}
.mdl .section-sub{margin-top:clamp(18px,2.6vw,28px);padding-bottom:0}
.mdl .section-sub p{max-width:620px;margin:0 0 6px;font-size:1.05rem;line-height:1.8;color:var(--ink-soft)}
.mdl .mdl-rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0)*70ms)}
.mdl .mdl-rv.is-in{opacity:1;transform:none}
.mdl .mdl-sec{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(40px,5vw,64px)}
.mdl .mdl-sec--tight{padding-bottom:0}
.mdl .mdl-btn{font:700 .9rem/1 var(--font-body);letter-spacing:.06em;color:#fff;background:var(--ink);border:0;border-radius:999px;padding:14px 22px;cursor:pointer;transition:background .2s}
.mdl .mdl-btn:hover{background:var(--accent)}
.mdl .mdl-status{font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.1em;color:var(--accent)}
.mdl .mdl-label{display:inline-block;font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.1em;padding:10px 16px;background:var(--ink);color:#fff}
.mdl .mdl-label--line{background:none;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

/* runs */
.mdl .mdl-run{position:relative;height:calc(100vh*(var(--n)*.6 + .4))}
.mdl .mdl-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center;padding:var(--hh) 0 2vh;box-sizing:border-box}
.mdl .mdl-stage>.wrap{width:100%}
.mdl [data-step]{transition:opacity .45s var(--ease),transform .6s var(--ease),clip-path .65s var(--snap)}
.mdl .mdl-bar{display:flex;gap:6px;margin-top:clamp(20px,3vh,36px)}
.mdl .mdl-bar i{flex:0 0 32px;height:2px;background:var(--line-strong);transition:background .3s}
.mdl .mdl-bar i.is-active,.mdl .mdl-bar i.is-past{background:var(--accent)}

/* 00 hero */
.mdl .mdl-hero .hero-meta{margin-bottom:clamp(24px,4vh,48px)}
.mdl .mdl-hero-h{margin:0;font-family:var(--font-body);font-weight:800;font-size:clamp(2.6rem,7vw,6.6rem);line-height:1.12;letter-spacing:-.045em;color:var(--ink)}
.mdl .mdl-hero-1{display:block}
.mdl .mdl-hero-2{display:grid;min-height:1.15em}
.mdl .mdl-hero-2>span{grid-area:1/1;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(.3em) scale(.96);transform-origin:0 50%}
.mdl .mdl-hero-2>span.is-active{opacity:1;clip-path:inset(0);transform:none}
.mdl .mdl-hero-2>span.is-past{clip-path:inset(100% 0 0 0);transform:translateY(-.3em)}
.mdl .mdl-hero-2>span[data-step="2"]{color:var(--accent)}
.mdl .mdl-hero[data-active="1"] .mdl-hero-2>span[data-step="1"]{font-size:.62em;line-height:1.5}
.mdl .mdl-hero-foot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);margin-top:clamp(24px,4vh,44px);padding-top:clamp(18px,2.4vh,26px);border-top:1px solid var(--line)}
.mdl .mdl-hero-body{grid-column:1/7;margin:0;font-size:1.02rem;line-height:1.8}
.mdl .mdl-flow{grid-column:8/13;margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;font-family:var(--font-display);font-weight:900;font-size:clamp(1rem,1.6vw,1.4rem);letter-spacing:-.01em;color:var(--line-strong)}
.mdl .mdl-flow span{animation:mdl-flow 5.6s var(--ease) infinite;animation-delay:calc(var(--i)*1.1s)}
.mdl .mdl-flow i{font-style:normal}
@keyframes mdl-flow{0%,6%{color:var(--line-strong)}14%,40%{color:var(--accent)}55%,100%{color:var(--ink)}}
.mdl .mdl-hero-act{grid-column:1/13;display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:clamp(18px,2.6vh,28px)}

/* 01 problem */
.mdl .mdl-prob .section-head{margin-bottom:clamp(28px,5vh,56px)}
.mdl .mdl-prob-s{display:grid}
.mdl .mdl-prob-q{grid-area:1/1;margin:0;max-width:16em;font-family:var(--font-body);font-weight:800;font-size:clamp(1.9rem,4.6vw,4.2rem);line-height:1.22;letter-spacing:-.04em;opacity:0;transform:translateY(30px)}
.mdl .mdl-prob-q.is-active{opacity:1;transform:none}.mdl .mdl-prob-q.is-past{transform:translateY(-30px)}
.mdl .mdl-prob-q .mdl-n{margin-bottom:14px}
.mdl .mdl-prob-end{font-size:clamp(1.6rem,3.6vw,3.2rem);max-width:20em}
.mdl .mdl-prob-end em{font-style:normal;color:var(--accent)}

/* 02 compare */
.mdl .mdl-cmp{margin-top:clamp(36px,5vw,60px);border-top:1px solid var(--line-strong)}
.mdl .mdl-cmp-row{position:relative;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:var(--gap);align-items:center;padding:clamp(22px,3vw,34px) 0;border-bottom:1px solid var(--line-strong);overflow:hidden}
.mdl .mdl-cmp-flow{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font-family:var(--font-body);font-weight:700;font-size:clamp(1.2rem,2.2vw,1.9rem);letter-spacing:-.02em}
.mdl .mdl-cmp-flow i{font-style:normal;font-weight:400;color:var(--ink-faint)}
.mdl .mdl-cmp-row--one .mdl-cmp-flow{color:var(--ink-faint)}
.mdl .mdl-cmp-row--two .mdl-cmp-flow span{color:var(--ink)}
.mdl .mdl-cmp-row--two .mdl-cmp-flow i{color:var(--accent);font-weight:700;display:inline-block;animation:mdl-swap 1.8s var(--ease) infinite}
@keyframes mdl-swap{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
.mdl .mdl-dart{position:absolute;left:25%;bottom:18px;width:40px;height:2px;background:var(--ink-faint);animation:mdl-dart 2.2s linear infinite}
@keyframes mdl-dart{0%{transform:translateX(0);opacity:0}10%{opacity:1}80%{opacity:1}100%{transform:translateX(65vw);opacity:0}}
.mdl .mdl-cmp-note{margin:clamp(24px,3vw,36px) 0 0;max-width:640px;font-size:1.1rem;line-height:1.8;font-weight:600}

/* 03 shadowing — scattered questions line up, then one sentence */
.mdl .mdl-shadow .section-head{margin-bottom:0}
.mdl .mdl-qfield{position:relative;height:clamp(300px,46vh,460px);margin-top:clamp(18px,3vh,32px);
  --q:clamp(0,(var(--p,0) - .2)/.4,1);--z:clamp(0,(var(--p,0) - .78)/.14,1)}
.mdl .mdl-qw{position:absolute;margin:0;white-space:nowrap;font-family:var(--font-body);font-weight:800;letter-spacing:-.03em;color:var(--ink);
  left:calc((var(--x)*(1 - var(--q)))*1%);top:calc((var(--y)*(1 - var(--q)) + var(--i)*13*var(--q))*1%);
  font-size:calc(clamp(1.2rem,2.4vw,2.2rem)*(1 - .25*var(--q)));opacity:calc((1 - var(--z))*(.45 + .55*var(--q)))}
.mdl .mdl-qend{position:absolute;left:0;top:50%;margin:0;translate:0 -50%;font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,9vw,8.4rem);line-height:.92;letter-spacing:-.045em;color:var(--accent);opacity:var(--z);transform:scale(calc(.94 + .06*var(--z)));transform-origin:0 50%}

/* 04 process */
.mdl .mdl-proc .section-head{margin-bottom:clamp(24px,4vh,44px)}
.mdl .mdl-proc-idx{grid-column:1/6;list-style:none;margin:0;padding:0}
.mdl .mdl-proc-idx li{font-family:var(--font-display);font-weight:900;font-size:clamp(2.2rem,5vw,4.6rem);line-height:1.02;letter-spacing:-.03em;color:var(--line-strong);transition:color .3s}
.mdl .mdl-proc-idx li span{font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.12em;margin-right:10px;vertical-align:middle}
.mdl .mdl-proc-idx li.is-active{color:var(--accent)}.mdl .mdl-proc-idx li.is-past{color:var(--ink)}
.mdl .mdl-proc-panel{grid-column:7/13;display:grid}
.mdl .mdl-proc-s{grid-area:1/1;opacity:0;transform:translateX(30px)}
.mdl .mdl-proc-s.is-active{opacity:1;transform:none}.mdl .mdl-proc-s.is-past{transform:translateX(-30px)}
.mdl .mdl-proc-t{margin:8px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.8rem,3.4vw,3rem);letter-spacing:-.03em;line-height:1}
.mdl .mdl-proc-s .kr{margin:14px 0 0;font-size:1.05rem;line-height:1.7;font-weight:600}
.mdl .mdl-proc-s ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.mdl .mdl-proc-s li{font-family:var(--font-body);font-size:.85rem;border:1px solid var(--line-strong);border-radius:999px;padding:5px 12px;opacity:0;transform:translateY(6px);transition:opacity .35s,transform .45s var(--ease)}
.mdl .mdl-proc-s.is-active li{opacity:1;transform:none;transition-delay:calc(.15s + var(--j)*60ms)}
.mdl .mdl-proc-foot{grid-column:1/13;margin-top:clamp(24px,4vh,40px);padding-top:14px;border-top:1px solid var(--line)}
.mdl .mdl-proc-meta{margin:0;font-family:var(--font-body);font-weight:700;font-size:1rem}
.mdl .mdl-proc-foot .kr-soft{margin:6px 0 0;font-size:.9rem}

/* 05 process book */
.mdl .mdl-book .mdl-stage{background:var(--surface-grey)}
.mdl .mdl-book .section-head{margin-bottom:0}
.mdl .mdl-bookwrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;margin-top:clamp(18px,3vh,30px)}
.mdl .mdl-pb{grid-column:5/9;position:relative;aspect-ratio:3/4;max-height:52vh;perspective:2600px}
.mdl .mdl-pg{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;--t:clamp(0,var(--p,0)*6.2 - var(--i) - .3,1);transform:rotateY(calc(var(--t)*-170deg));z-index:calc(10 - var(--i) + var(--t)*20*var(--i))}
.mdl .mdl-pg:last-child{--t:0}
.mdl .mdl-face,.mdl .mdl-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-sizing:border-box;padding:clamp(14px,1.6vw,22px);background:#fff;border:1px solid var(--line-strong);display:flex;flex-direction:column}
.mdl .mdl-back{transform:rotateY(180deg);background:#f7f7f5}
.mdl .mdl-pg--cover .mdl-face,.mdl .mdl-pg--cover .mdl-back{background:var(--ink);color:#fff;border-color:var(--ink)}
.mdl .mdl-cover-t{margin:auto 0;font-family:var(--font-display);font-weight:900;font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:-.03em}
.mdl .mdl-pg--cover b{font-family:var(--font-display);color:var(--accent)}
.mdl .mdl-pg-t{margin:16px 0 4px;font-family:var(--font-body);font-weight:700;font-size:1rem}
.mdl .mdl-face i,.mdl .mdl-back i{display:block;height:1px;background:var(--line-strong);margin-top:22px}
.mdl .mdl-book-end{grid-column:9/13;margin:0;font-family:var(--font-body);font-weight:700;font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.6;opacity:clamp(0,(var(--p,0) - .7)*5,1)}

/* 06 leave with */
.mdl .mdl-leave{list-style:none;margin:clamp(30px,4vw,48px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);border-top:1px solid var(--line-strong)}
.mdl .mdl-leave li{display:flex;gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line);font-family:var(--font-body);font-weight:700;font-size:clamp(1.05rem,1.6vw,1.35rem);letter-spacing:-.02em}
.mdl .mdl-leave li span{font-size:.75rem;font-weight:700;color:var(--accent);min-width:22px}
.mdl .mdl-leave-q{margin:clamp(36px,5vw,64px) 0 0;font-family:var(--font-body);font-weight:800;font-size:clamp(1.4rem,2.8vw,2.4rem);line-height:1.4;letter-spacing:-.03em}
.mdl .mdl-leave-q em{font-style:normal;color:var(--accent)}
.mdl .mdl-leave-note{margin:18px 0 0;font-size:.95rem;padding-left:14px;border-left:2px solid var(--accent)}

/* 07 cohorts */
.mdl .mdl-coh-num{grid-column:1/6;font-family:var(--font-display);font-weight:900;color:var(--ink)}
.mdl .mdl-coh-num span{display:block;font-size:clamp(1.2rem,2.2vw,1.8rem);letter-spacing:-.01em}
.mdl .mdl-coh-num b{display:grid;font-size:clamp(5rem,13vw,11rem);line-height:.9;letter-spacing:-.05em;color:var(--accent)}
.mdl .mdl-coh-num em{grid-area:1/1;font-style:normal;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(20%)}
.mdl .mdl-coh-num em.is-active{opacity:1;clip-path:inset(0);transform:none}
.mdl .mdl-coh-num em.is-past{clip-path:inset(100% 0 0 0);transform:translateY(-20%)}
.mdl .mdl-coh-text{grid-column:1/6;grid-row:2;display:grid;margin-top:clamp(16px,3vh,28px)}
.mdl .mdl-coh-s{grid-area:1/1;opacity:0;transform:translateY(20px)}
.mdl .mdl-coh-s.is-active{opacity:1;transform:none}.mdl .mdl-coh-s.is-past{transform:translateY(-20px)}
.mdl .mdl-coh-name{margin:0;font-family:var(--font-body);font-weight:800;font-size:clamp(1.5rem,2.6vw,2.2rem);letter-spacing:-.03em}
.mdl .mdl-coh-one{margin:8px 0 0;font-size:1rem;line-height:1.6;color:var(--ink-soft)}
.mdl .mdl-coh-dl{margin:clamp(14px,2.6vh,24px) 0 0;padding:0;border-top:1px solid var(--line-strong)}
.mdl .mdl-coh-dl div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.mdl .mdl-coh-dl dt{font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:.04em;color:var(--accent);padding-top:3px}
.mdl .mdl-coh-dl dd{margin:0;font-family:var(--font-body);font-size:.98rem;font-weight:600;line-height:1.5}
.mdl .mdl-coh-media{grid-column:7/13;grid-row:1/3;display:grid;align-self:stretch}
.mdl .mdl-coh-img{grid-area:1/1;margin:0;overflow:hidden;background:var(--surface-grey);aspect-ratio:4/3;max-height:70vh;clip-path:inset(0 0 0 100%);transition:clip-path .8s var(--snap)}
.mdl .mdl-coh-img.is-active{clip-path:inset(0)}
.mdl .mdl-coh-img.is-past{clip-path:inset(0 100% 0 0)}
.mdl .mdl-coh-img img{display:block;width:100%;height:100%;object-fit:cover}
.mdl .mdl-coh-empty{display:grid;place-items:center;background:none;box-shadow:inset 0 0 0 2px var(--accent);background-image:repeating-linear-gradient(135deg,transparent 0 14px,color-mix(in srgb,var(--accent) 12%,transparent) 14px 15px)}
.mdl .mdl-coh-empty span{font-family:var(--font-display);font-weight:900;font-size:clamp(1.6rem,3vw,2.6rem);color:var(--accent)}
.mdl .mdl-coh-next .mdl-coh-name{font-family:var(--font-display);font-weight:900;font-size:clamp(1.8rem,3.4vw,3rem);line-height:1}
.mdl .mdl-coh-next .mdl-status{display:block;margin-top:14px}

/* 08 workshops */
.mdl .mdl-ws{list-style:none;margin:clamp(30px,4vw,48px) 0 0;padding:0;border-top:1px solid var(--line-strong)}
.mdl .mdl-ws li{padding:clamp(14px,2vw,22px) 0;border-bottom:1px solid var(--line);font-family:var(--font-body);font-weight:700;font-size:clamp(1.3rem,2.6vw,2.2rem);letter-spacing:-.03em}
.mdl .mdl-ws-link{margin:clamp(24px,3vw,36px) 0 0}
.mdl .mdl-ws-link .talk-link{font-size:clamp(1.1rem,1.8vw,1.4rem);border-bottom:1px solid rgba(19,18,17,.35);padding-bottom:10px;text-decoration:none}

/* 09 fit */
.mdl .mdl-fit{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);margin-top:clamp(30px,4vw,48px)}
.mdl .mdl-fit-col{grid-column:1/7;border-top:2px solid var(--ink);padding-top:18px}
.mdl .mdl-fit-col--other{grid-column:8/13;border-top-color:var(--line-strong)}
.mdl .mdl-fit-col h3{margin:0;font-family:var(--font-body);font-weight:800;font-size:clamp(1.2rem,1.8vw,1.5rem);letter-spacing:-.02em}
.mdl .mdl-fit-col .kr-soft{margin:10px 0 0;font-size:.95rem;line-height:1.7}
.mdl .mdl-fit-col ul{list-style:none;margin:14px 0 0;padding:0}
.mdl .mdl-fit-col li{padding:12px 0;border-bottom:1px solid var(--line);font-family:var(--font-body);font-size:1.02rem;line-height:1.5}
.mdl .mdl-fit-col li::before{content:"";display:inline-block;width:8px;height:8px;margin-right:12px;background:var(--accent);vertical-align:middle}
.mdl .mdl-fit-col--other li{color:var(--ink-soft)}
.mdl .mdl-fit-col--other li::before{background:none;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}

/* 10 coming soon */
.mdl .mdl-soon{background:var(--accent);padding:clamp(80px,11vw,150px) 0;margin-top:clamp(40px,6vw,80px)}
.mdl .mdl-soon .idx{color:rgba(19,18,17,.7)}
.mdl .mdl-soon-num{margin:18px 0 0;font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.02em}
.mdl .mdl-soon-num b{font-size:2.6em;letter-spacing:-.05em;line-height:.9}
.mdl .mdl-soon-h{margin:16px 0 0;font-family:var(--font-body);font-weight:800;font-size:clamp(2rem,4.4vw,4rem);letter-spacing:-.045em;line-height:1.15}
.mdl .mdl-soon-b{margin:18px 0 0;max-width:620px;font-size:1.1rem;line-height:1.75}
.mdl .mdl-soon-row{display:flex;flex-wrap:wrap;gap:10px;margin:clamp(24px,3vw,36px) 0 0}
.mdl .mdl-soon-sub{margin:20px 0 0;font-family:var(--font-body);font-size:.88rem;line-height:1.6;color:rgba(19,18,17,.75)}
.mdl .mdl-soon-sub a{margin-left:10px;font-weight:700;color:var(--ink);text-decoration:none;border-bottom:1px solid currentColor}

/* 11 faq */
.mdl .mdl-faq-head{grid-column:1/5}
.mdl .mdl-faq-t{margin:14px 0 0;font-family:var(--font-body);font-weight:700;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.35;letter-spacing:-.02em}
.mdl .mdl-faq{grid-column:6/13;border-top:1px solid var(--line-strong)}
.mdl .mdl-faq-i{border-bottom:1px solid var(--line)}
.mdl .mdl-faq-i summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;cursor:pointer;font-family:var(--font-body);font-size:1.05rem;font-weight:600}
.mdl .mdl-faq-i summary::-webkit-details-marker{display:none}
.mdl .mdl-faq-i summary i{flex:none;position:relative;width:14px;height:14px}
.mdl .mdl-faq-i summary i::before,.mdl .mdl-faq-i summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transition:transform .3s}
.mdl .mdl-faq-i summary i::after{transform:rotate(90deg)}
.mdl .mdl-faq-i[open] summary{color:var(--accent)}
.mdl .mdl-faq-i[open] summary i::after{transform:none}
.mdl .mdl-faq-i div{padding:0 0 22px;max-width:640px}
.mdl .mdl-faq-i p{margin:0;font-size:.98rem;line-height:1.8;color:var(--ink-soft)}
.mdl .mdl-faq-i .mdl-faq-lead{margin-bottom:6px;font-size:1.1rem;font-weight:700;color:var(--ink)}

/* 12 final */
.mdl .mdl-final{min-height:90vh;min-height:90svh;display:flex;align-items:center;background:var(--surface-grey);margin-top:clamp(64px,9vw,120px)}
.mdl .mdl-final>.wrap{width:100%}
.mdl .mdl-final-h{margin:18px 0 0;font-family:var(--font-body);font-weight:800;font-size:clamp(2.2rem,5.6vw,5rem);line-height:1.12;letter-spacing:-.045em}
.mdl .mdl-final-h .mdl-l:last-child{color:var(--accent)}
.mdl .mdl-final-b{margin:20px 0 0;max-width:560px;font-size:1.05rem;line-height:1.8}

@media (max-width:860px){
  .mdl .mdl-hero-body,.mdl .mdl-flow,.mdl .mdl-proc-idx,.mdl .mdl-proc-panel,.mdl .mdl-coh-num,.mdl .mdl-coh-text,.mdl .mdl-coh-media,.mdl .mdl-fit-col,.mdl .mdl-fit-col--other,.mdl .mdl-faq-head,.mdl .mdl-faq,.mdl .mdl-pb,.mdl .mdl-book-end{grid-column:1/13}
  .mdl .mdl-flow{margin-top:14px}
  .mdl .mdl-hero-h{font-size:clamp(2rem,9vw,3rem)}
  .mdl .mdl-cmp-row{grid-template-columns:1fr}
  .mdl .mdl-qw{font-size:calc(clamp(.9rem,4vw,1.2rem)*(1 - .1*var(--q)));white-space:normal;max-width:70%}
  .mdl .mdl-proc-idx{display:flex;gap:10px}.mdl .mdl-proc-idx li{font-size:1.6rem}.mdl .mdl-proc-idx li span{display:none}
  .mdl .mdl-proc-panel{margin-top:16px}
  .mdl .mdl-pb{width:60vw;justify-self:center}
  .mdl .mdl-book-end{margin-top:16px}
  .mdl .mdl-leave{grid-template-columns:1fr}
  .mdl .mdl-coh-num b{font-size:4.4rem}
  .mdl .mdl-coh-text{grid-row:auto;margin-top:10px}
  .mdl .mdl-coh-media{grid-row:auto;margin-top:16px}
  .mdl .mdl-coh-img{aspect-ratio:16/10;max-height:30vh}
  .mdl .mdl-coh-dl div{grid-template-columns:96px 1fr;padding:7px 0}
  .mdl .mdl-coh-dl dd{font-size:.88rem}
  .mdl .mdl-faq{margin-top:24px}
}
/* 03 why a cohort — four teams, three reasons */
.mdl .mdl-why-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start;margin-top:clamp(36px,5vw,60px)}
.mdl .mdl-why-big{grid-column:1/5;margin:0;display:flex;align-items:flex-end;gap:14px}
.mdl .mdl-why-big b{font-family:var(--font-display);font-weight:900;font-size:clamp(7rem,15vw,13rem);line-height:.78;letter-spacing:-.06em;color:var(--accent)}
.mdl .mdl-why-big span{font-family:var(--font-display);font-weight:900;font-size:clamp(1rem,1.6vw,1.4rem);line-height:1.05;letter-spacing:-.01em;padding-bottom:.2em}
.mdl .mdl-why-list{grid-column:6/13;list-style:none;margin:0;padding:0;border-top:1px solid var(--line-strong)}
.mdl .mdl-why-list li{padding:clamp(18px,2.4vw,28px) 0;border-bottom:1px solid var(--line)}
.mdl .mdl-why-list h3{margin:8px 0 0;font-family:var(--font-body);font-weight:800;font-size:clamp(1.2rem,2vw,1.6rem);line-height:1.35;letter-spacing:-.03em}
.mdl .mdl-why-list p{margin:8px 0 0;font-size:1rem;line-height:1.75}
.mdl .mdl-why-note{grid-column:6/13;margin:clamp(24px,3vw,36px) 0 0;font-size:1.05rem;font-weight:700;line-height:1.6}
@media (max-width:860px){
  .mdl .mdl-why-big,.mdl .mdl-why-list,.mdl .mdl-why-note{grid-column:1/13}
  .mdl .mdl-why-list{margin-top:28px}
}
/* 01 problem — cards you step through sideways */
.mdl .mdl-car-nav{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:clamp(8px,1vw,12px)}
.mdl .mdl-car-count{margin-right:auto;font:600 .85rem/1 var(--font-body);color:var(--ink-faint)}
.mdl .mdl-car-count b{color:var(--ink)}
.mdl .mdl-car-btn{width:44px;height:44px;border:1px solid var(--line-strong);border-radius:50%;background:none;font:1.1rem/1 var(--font-body);color:var(--ink);cursor:pointer;transition:color .2s,border-color .2s}
.mdl .mdl-car-btn:hover{color:var(--accent);border-color:var(--accent)}
.mdl .mdl-car{margin-top:clamp(20px,2.4vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--container);scrollbar-width:none;outline:0}
.mdl .mdl-car::-webkit-scrollbar{display:none}
.mdl .mdl-car-track{display:flex;gap:var(--gap);width:max-content;padding:0 var(--container)}
.mdl .mdl-qcard{scroll-snap-align:start;flex:none;width:clamp(270px,27vw,400px);aspect-ratio:4/5;display:flex;flex-direction:column;box-sizing:border-box;padding:clamp(22px,2.4vw,32px);border:1px solid var(--line-strong);background:#fff;transition:border-color .3s}
.mdl .mdl-qcard:hover{border-color:var(--accent)}
.mdl .mdl-qcard-t{margin:auto 0;font:800 clamp(1.4rem,2.2vw,2rem)/1.35 var(--font-body);letter-spacing:-.04em;color:var(--ink)}
.mdl .mdl-qcard-tag{font:700 .72rem/1 var(--font-body);letter-spacing:.12em;color:var(--ink-faint)}
.mdl .mdl-qcard:hover .mdl-qcard-tag{color:var(--accent)}
.mdl .mdl-prob-turn2{width:clamp(320px,34vw,520px)}
.mdl .mdl-prob3 .mdl-qcard{align-self:stretch;aspect-ratio:auto;min-height:clamp(320px,52vh,460px)}
.mdl .mdl-prob3 .hrun-head .mdl-h{font-size:var(--fs-h1)}
.mdl .mdl-prob-turn{margin:0;max-width:20em;font:800 clamp(1.5rem,3.2vw,2.8rem)/1.3 var(--font-body);letter-spacing:-.04em}
.mdl .mdl-prob-turn .mdl-n{margin-bottom:14px}
.mdl .mdl-prob-turn em{font-style:normal;color:var(--accent)}

/* 06 process book — five stages and the one-page canvas */
.mdl .mdl-book2{background:var(--surface-grey)}
.mdl .mdl-pb2{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;margin-top:clamp(36px,5vw,60px)}
.mdl .mdl-pb2-list{grid-column:1/8;list-style:none;margin:0;padding:0;border-top:1px solid var(--line-strong)}
.mdl .mdl-pb2-list li{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:clamp(16px,2vw,24px) 0;border-bottom:1px solid var(--line)}
.mdl .mdl-pb2-list .mdl-n{grid-column:1/2}
.mdl .mdl-pb2-list h3{grid-column:2/5;margin:0;font:900 clamp(1.3rem,2.2vw,1.9rem)/1.05 var(--font-display);letter-spacing:-.02em}
.mdl .mdl-pb2-list h3 small{display:block;margin-top:6px;font:600 .85rem/1.3 var(--font-body);letter-spacing:0;color:var(--ink-soft)}
.mdl .mdl-pb2-list p{grid-column:5/8;margin:0;font-size:.95rem;line-height:1.65}
.mdl .mdl-pb2-list li:last-child h3{color:var(--accent)}
.mdl .mdl-pb2-fig{grid-column:9/13;margin:0}
.mdl .mdl-pb2-fig svg{display:block;width:100%;height:auto}
.mdl .mdl-pb2-fig circle{fill:none;stroke:var(--ink);stroke-width:1.2}
.mdl .mdl-pb2-fig .c1{fill:var(--accent);stroke:var(--accent)}
.mdl .mdl-pb2-fig .c2{fill:color-mix(in srgb,var(--accent) 22%,transparent);stroke:var(--accent)}
.mdl .mdl-pb2-fig text{text-anchor:middle;font:900 20px var(--font-display);letter-spacing:.02em;fill:var(--ink)}
.mdl .mdl-pb2-fig .t1{fill:#fff;font-size:26px}
.mdl .mdl-pb2-fig figcaption{margin-top:16px;display:flex;flex-direction:column;gap:4px}
.mdl .mdl-pb2-fig figcaption b{font:700 .75rem/1 var(--font-body);letter-spacing:.12em;color:var(--accent)}
.mdl .mdl-pb2-fig figcaption span{font-size:.85rem;color:var(--ink-soft)}
.mdl .mdl-pb2-proof{margin:clamp(40px,5vw,64px) 0 0;padding-top:clamp(20px,2.4vw,28px);border-top:1px solid var(--line-strong);max-width:none;font-size:1rem;font-weight:600;line-height:1.7}
.mdl .mdl-pb2-proof .mdl-n{margin-bottom:8px}

/* 09 proven method — three proofs on the grid, then the formats */
.mdl .mdl-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:clamp(36px,5vw,60px)}
.mdl .mdl-proof-c{border-top:2px solid var(--ink);padding-top:clamp(18px,2vw,24px)}
.mdl .mdl-proof-big{margin:0;display:flex;align-items:flex-end;gap:10px}
.mdl .mdl-proof-big b{font:900 clamp(3rem,6vw,5.4rem)/.85 var(--font-display);letter-spacing:-.05em;color:var(--accent)}
.mdl .mdl-proof-big span{font:700 .75rem/1.2 var(--font-body);letter-spacing:.12em;padding-bottom:.3em}
.mdl .mdl-proof-c h3{margin:clamp(20px,2.4vw,28px) 0 0;font:800 clamp(1.15rem,1.6vw,1.4rem)/1.35 var(--font-body);letter-spacing:-.03em}
.mdl .mdl-proof-c p{margin:10px 0 0;font-size:.98rem;line-height:1.7}
.mdl .mdl-ws2{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;margin-top:clamp(56px,7vw,96px);padding-top:clamp(20px,2.4vw,28px);border-top:1px solid var(--line-strong)}
.mdl .mdl-ws2 .mdl-n{grid-column:1/13;margin-bottom:clamp(16px,2vw,24px)}
.mdl .mdl-ws2 ol{grid-column:1/11;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.mdl .mdl-ws2 li{font:700 clamp(.95rem,1.2vw,1.1rem)/1.4 var(--font-body);letter-spacing:-.02em}
.mdl .mdl-ws2 li span{display:block;margin-bottom:6px;font-size:.72rem;letter-spacing:.1em;color:var(--accent)}
.mdl .mdl-ws2-link{grid-column:11/13;justify-self:end;display:inline-flex;align-items:center;gap:6px;font:600 .85rem/1.2 var(--font-body);color:var(--ink);border:1px solid var(--line-strong);border-radius:999px;padding:7px 16px;transition:color .2s,border-color .2s}
.mdl .mdl-ws2-link:hover{color:var(--accent);border-color:var(--accent)}
@media (max-width:860px){
  .mdl .mdl-qcard{width:76vw}
  .mdl .mdl-pb2-list,.mdl .mdl-pb2-fig{grid-column:1/13}
  .mdl .mdl-pb2-fig{width:70%;margin:36px auto 0}
  .mdl .mdl-pb2-list li{grid-template-columns:40px 1fr}
  .mdl .mdl-pb2-list h3,.mdl .mdl-pb2-list p{grid-column:2/3}.mdl .mdl-pb2-list p{margin-top:8px}
  .mdl .mdl-proof{grid-template-columns:1fr;row-gap:36px}
  .mdl .mdl-ws2 ol{grid-column:1/13;grid-template-columns:1fr 1fr;row-gap:16px}
  .mdl .mdl-ws2-link{grid-column:1/13;justify-self:start;margin-top:24px}
}
/* 02 what is — the familiar way (left, quiet) against MODINGSO® (right, teal) */
.mdl .mdl-vs{margin-top:clamp(36px,5vw,60px)}
.mdl .mdl-vs-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:stretch}
.mdl .mdl-vs-k{grid-column:1/3;padding:clamp(18px,2.2vw,26px) 0;border-top:1px solid var(--line);font:700 .85rem/1.5 var(--font-body);color:var(--ink-soft)}
.mdl .mdl-vs-a{grid-column:3/7;margin:0;padding:clamp(18px,2.2vw,26px) 0;border-top:1px solid var(--line);font-size:1rem;line-height:1.65;color:var(--ink-faint)}
.mdl .mdl-vs-b{grid-column:7/13;margin:0;padding:clamp(18px,2.2vw,26px) clamp(20px,2.6vw,36px);background:var(--accent);color:#fff;border-top:1px solid rgba(255,255,255,.3);font:700 clamp(1.02rem,1.3vw,1.18rem)/1.6 var(--font-body)}
.mdl .mdl-vs-top .mdl-vs-a,.mdl .mdl-vs-top .mdl-vs-b{border-top:0;padding-top:clamp(24px,3vw,40px);padding-bottom:clamp(24px,3vw,36px)}
.mdl .mdl-vs-top .mdl-vs-a{border-top:2px solid var(--line-strong)}
.mdl .mdl-vs-top .mdl-n{display:block;margin-bottom:12px}
.mdl .mdl-vs-top b{display:block;font:900 clamp(1.6rem,2.8vw,2.6rem)/1.1 var(--font-body);letter-spacing:-.04em}
.mdl .mdl-vs-top .mdl-vs-a b{color:var(--ink-soft)}
.mdl .mdl-vs-top .mdl-vs-b .mdl-n,.mdl .mdl-vs-top .mdl-vs-b b{color:#fff}
.mdl .mdl-vs-flow{margin:12px 0 0;font:600 .95rem/1.5 var(--font-body)}
.mdl .mdl-vs-top .mdl-vs-a .mdl-vs-flow{color:var(--ink-faint)}
.mdl .mdl-vs-top .mdl-vs-b .mdl-vs-flow{color:rgba(255,255,255,.85)}
.mdl .mdl-vs-top .mdl-vs-b{border-radius:4px 4px 0 0}
.mdl .mdl-vs-row.is-last .mdl-vs-b{border-radius:0 0 4px 4px;padding-bottom:clamp(26px,3vw,40px)}
.mdl .mdl-vs-row.is-last .mdl-vs-k,.mdl .mdl-vs-row.is-last .mdl-vs-a{border-bottom:1px solid var(--line)}
.mdl .mdl-vs-foot{margin:clamp(24px,3vw,36px) 0 0;max-width:640px;font-size:.95rem;line-height:1.75}
@media (max-width:860px){
  .mdl .mdl-vs-k{grid-column:1/13;padding-bottom:6px;border-top:1px solid var(--line)}
  .mdl .mdl-vs-a{grid-column:1/6;border-top:0;padding-top:6px;padding-right:8px;font-size:.88rem}
  .mdl .mdl-vs-b{grid-column:6/13;border-top:0;font-size:.92rem;padding:12px 14px}
  .mdl .mdl-vs-top>span:first-child{display:none}
  .mdl .mdl-vs-top .mdl-vs-a{grid-column:1/6;padding-right:8px}
  .mdl .mdl-vs-top .mdl-vs-b{grid-column:6/13}
  .mdl .mdl-vs-top b{font-size:1.15rem}
  .mdl .mdl-vs-flow{font-size:.78rem}
}
/* ── flat scenes (branding-page rhythm): normal flow, one soft reveal per item ── */
.mdl .mdl-run.is-flat{height:auto}
.mdl .is-flat .mdl-stage{position:relative;height:auto;display:block;overflow:visible;padding:clamp(64px,9vw,120px) 0 0}
.mdl .is-flat .mdl-bar{display:none}
.mdl .is-flat [data-step]{opacity:0;transform:translateY(22px);clip-path:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}
.mdl .is-flat [data-step].is-in{opacity:1;transform:none}
/* hero — the full sentence, settled */
.mdl .mdl-hero.is-flat .mdl-stage{padding-top:calc(var(--hh) + clamp(40px,4vw,48px))}
.mdl .mdl-hero.is-flat .mdl-hero-2>span[data-step="0"],.mdl .mdl-hero.is-flat .mdl-hero-2>span[data-step="1"]{display:none}
.mdl .mdl-hero.is-flat .mdl-hero-2>span[data-step="2"]{transition-delay:.25s}
/* problem — six worries as a list, then the turn */
.mdl .mdl-prob.is-flat .mdl-prob-s{display:block;border-top:1px solid var(--line-strong)}
.mdl .mdl-prob.is-flat .mdl-prob-q{position:relative;display:block;max-width:none;padding:clamp(16px,2vw,24px) 0 clamp(16px,2vw,24px) calc((100% + var(--gap))*2/12);border-bottom:1px solid var(--line);font-size:clamp(1.25rem,2.4vw,2rem);line-height:1.35;letter-spacing:-.03em}
.mdl .mdl-prob.is-flat .mdl-prob-q .mdl-n{position:absolute;left:0;top:calc(clamp(16px,2vw,24px) + .55em);margin:0}
.mdl .mdl-prob.is-flat .mdl-prob-end{padding-left:0;border-bottom:0;padding-top:clamp(36px,5vw,60px);font-size:clamp(1.5rem,3.2vw,2.8rem);max-width:20em}
.mdl .mdl-prob.is-flat .mdl-prob-end .mdl-n{position:static;margin-bottom:14px}
/* shadowing — the questions as a column, then the answer */
.mdl .mdl-shadow.is-flat .mdl-qfield{height:auto;margin-top:clamp(36px,5vw,60px);--q:1;--z:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);border-top:1px solid var(--line-strong)}
.mdl .mdl-shadow.is-flat .mdl-qw{position:static;white-space:normal;opacity:1;font-size:clamp(1.05rem,1.6vw,1.35rem);padding:16px 0;border-bottom:1px solid var(--line)}
.mdl .mdl-shadow.is-flat .mdl-qend{position:static;translate:none;transform:none;opacity:1;grid-column:1/-1;margin-top:clamp(36px,5vw,60px);font-size:clamp(2.6rem,7vw,6.4rem)}
/* process book — cover and the first spreads, the rest stays for the program */
.mdl .mdl-book.is-flat .mdl-stage{padding:clamp(64px,9vw,120px) 0;margin-top:clamp(64px,9vw,120px)}
.mdl .mdl-book.is-flat .mdl-pb{grid-column:1/9;aspect-ratio:auto;max-height:none;perspective:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.mdl .mdl-book.is-flat .mdl-pg{position:relative;inset:auto;transform:none;z-index:auto;aspect-ratio:3/4}
.mdl .mdl-book.is-flat .mdl-pg:nth-child(n+5),.mdl .mdl-book.is-flat .mdl-back{display:none}
.mdl .mdl-book.is-flat .mdl-cover-t{font-size:clamp(1.1rem,1.8vw,1.7rem)}
.mdl .mdl-book.is-flat .mdl-pg-t{font-size:.9rem;margin-top:12px}
.mdl .mdl-book.is-flat .mdl-face i{margin-top:16px}
.mdl .mdl-book.is-flat .mdl-book-end{opacity:1;align-self:end}
@media (max-width:860px){
  .mdl .mdl-prob.is-flat .mdl-prob-q{padding-left:0}.mdl .mdl-prob.is-flat .mdl-prob-q .mdl-n{position:static;margin-bottom:6px}
  .mdl .mdl-shadow.is-flat .mdl-qfield{grid-template-columns:1fr}
  .mdl .mdl-book.is-flat .mdl-pb{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.mdl.mdl-static .mdl-run{height:auto}
.mdl.mdl-static .mdl-stage{position:relative;height:auto;padding:clamp(40px,6vw,80px) 0}
.mdl.mdl-static [data-step]{grid-area:auto!important;opacity:1!important;transform:none!important;clip-path:none!important;margin-bottom:24px}
.mdl.mdl-static .mdl-hero-2>span[data-step="0"],.mdl.mdl-static .mdl-hero-2>span[data-step="1"],.mdl.mdl-static .mdl-qfield,.mdl.mdl-static .mdl-bar{display:none}
.mdl.mdl-static .mdl-pg{transform:none;position:relative;margin-bottom:12px}.mdl.mdl-static .mdl-pb{aspect-ratio:auto;max-height:none}.mdl.mdl-static .mdl-face{position:relative;min-height:200px}.mdl.mdl-static .mdl-back{display:none}
.mdl.mdl-static .mdl-book-end{opacity:1}
@media (prefers-reduced-motion:reduce){.mdl *{transition:none!important;animation:none!important}}


/* v59 — one BREEN button: the home "프로젝트 문의" pill (line, never black). Big closing talk-links stay as the page CTA. */
.hero-go-cta,.edu .edu-btn,.edu .edu-btn--solid,.mdl .mdl-btn,.mdl .mdl-label,.mdl .mdl-label--line,.mdl .mdl-inq,.faq-cta,.form-submit,.talk-link.svc-note-link,.talk-link.our-method-link,.mdl .mdl-ws-link .talk-link{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:.85rem!important;font-weight:600;line-height:1.2;letter-spacing:0;text-transform:none;
  color:var(--ink);background:none;border:1px solid var(--line-strong);border-radius:999px;padding:7px 16px;box-shadow:none;text-decoration:none;cursor:pointer;transition:color .2s,border-color .2s}
.hero-go-cta:hover,.edu .edu-btn:hover,.edu .edu-btn--solid:hover,.mdl .mdl-btn:hover,.mdl .mdl-inq:hover,.faq-cta:hover,.form-submit:hover,.talk-link.svc-note-link:hover,.talk-link.our-method-link:hover,.mdl .mdl-ws-link .talk-link:hover{color:var(--accent);border-color:var(--accent);background:none}
.talk-link.svc-note-link .arrow,.talk-link.our-method-link .arrow,.mdl .mdl-ws-link .talk-link .arrow{transition:none}
.talk-link.svc-note-link:hover .arrow,.talk-link.our-method-link:hover .arrow,.mdl .mdl-ws-link .talk-link:hover .arrow{transform:none}
.talk-link.svc-note-link,.talk-link.our-method-link,.mdl .mdl-ws-link .talk-link{margin-bottom:0}
.form-submit{margin-top:36px}
/* status labels look like the button but are not clickable */
.mdl .mdl-label,.mdl .mdl-label--line{cursor:default;color:var(--ink)}
.mdl .mdl-soon .mdl-label,.mdl .mdl-soon .mdl-inq{border-color:rgba(19,18,17,.35)}
.mdl .mdl-soon .mdl-inq:hover{color:#fff;border-color:#fff}
.mdl .mdl-soon-sub .mdl-inq{margin-left:6px;vertical-align:middle}
/* header MODINGSO® pill: same hover as the BREEN button */
.nav-inquiry:hover{background:none;color:var(--accent);border-color:var(--accent)}
.site-header.on-dark .nav-inquiry:hover{background:none;color:var(--accent);border-color:var(--accent)}


/* v60 — one page rhythm, taken from BRANDING:
   hero top 116 → the first block follows without a rule;
   every following block: 120 above, 120 below, one hairline rule at its top;
   heading → content 60; colour bands (teal) carry no rule. */
#root{--sy:clamp(64px,9vw,120px);--hy:clamp(56px,11vw,116px)}
/* heroes */
#root .page-hero.abt-hero,#root .page-hero.page-hero--accent{padding-top:var(--hy)}
#root .dsn-hero{min-height:0;padding-top:var(--hy);padding-bottom:clamp(20px,4vw,40px);border-top:0}
#root .dsn-arch{padding-top:48px;padding-bottom:var(--sy)}
/* EDUCATION */
#root .edu .edu-sec,#root .edu .edu-run.is-flat{padding:var(--sy) 0;border-top:1px solid var(--line)}
#root .edu .edu-run.is-flat .edu-stage{padding:0}
#root .edu .edu-hero+section{border-top:0}
#root .edu #edu-modingso{padding-bottom:0}
#root .edu .edu-mds{border-top:0;padding-top:0}
#root .edu #edu-case{padding-bottom:0}
#root .edu .edu-num.is-flat{border-top:0;padding-top:clamp(36px,5vw,60px)}
#root .edu .edu-cta{margin-top:0}
/* ABOUT */
#root .abt .abt-sec,#root .abt .abt-run,#root .abt .abt-close{padding:var(--sy) 0;margin-top:0;border-top:1px solid var(--line)}
#root .abt .abt-run.is-flat .abt-stage{padding:0;background:none}
#root .abt .abt-hero+section{border-top:0}
#root .abt .abt-belief.is-flat,#root .abt .abt-ex.is-flat{background:var(--surface-grey)}
#root .abt #breen-in-practice{border-top:1px solid var(--line)}
#root .abt .abt-msg{padding:var(--sy) 0;border-top:0}
#root .abt .abt-msg+section{border-top:0}
#root .abt .abt-close{padding-bottom:var(--sy)}
/* MODINGSO */
#root .mdl .mdl-h{font-size:var(--fs-h1);line-height:1.08}
#root .mdl .mdl-sec,#root .mdl .mdl-run,#root .mdl .mdl-final,#root .mdl #mdl-faq{padding:var(--sy) 0;margin-top:0;border-top:1px solid var(--line)}
#root .mdl .mdl-run.is-flat .mdl-stage{padding:0;margin:0;background:none}
#root .mdl .mdl-hero.is-flat{border-top:0;padding-top:var(--hy)}
#root .mdl .mdl-hero.is-flat .mdl-stage{padding-top:0}
#root .mdl .mdl-book.is-flat{background:var(--surface-grey)}
#root .mdl .mdl-sec--tight{padding-bottom:0}
#root .mdl .mdl-sec--tight+.mdl-run{border-top:0;padding-top:0}
#root .mdl .mdl-soon{margin-top:0;padding:var(--sy) 0;border-top:0}
#root .mdl .mdl-soon+section,#root .mdl .mdl-soon+#mdl-faq{border-top:0}
/* heading → sub → content (BRANDING spacing): title, breathing room, the lead, more room, then the content */
#root .edu .section-sub,#root .abt .section-sub,#root .mdl .section-sub{margin-top:clamp(28px,3.4vw,48px);padding-bottom:clamp(24px,3vw,40px)}
#root .edu .section-head:not(:has(+.section-sub)),#root .abt .section-head:not(:has(+.section-sub)),#root .mdl .section-head:not(:has(+.section-sub)){margin-bottom:clamp(16px,2vw,24px)}
#root .edu .edu-why.is-flat .section-sub+.edu-why-step{margin-top:clamp(20px,3vw,36px)}
#root .mdl .mdl-book.is-flat .mdl-bookwrap{margin-top:clamp(36px,5vw,60px)}
#root .mdl .mdl-leave,#root .mdl .mdl-ws,#root .mdl .mdl-fit{margin-top:clamp(36px,5vw,60px)}
#root .mdl .mdl-prob.is-flat .mdl-prob-s{margin-top:clamp(36px,5vw,60px)}
#root .abt .abt-hww .section-head,#root .mdl .mdl-proc .section-head{margin-bottom:clamp(36px,5vh,56px)}


/* v61 — on BREEN teal, text is white. Contact: three clear steps, selectable cards, one obvious send button. */
:root{--on-accent:#fff;--on-accent-soft:rgba(255,255,255,.78);--on-accent-line:rgba(255,255,255,.38)}
/* teal grounds across the site */
.page-hero--accent,.page-hero--accent .display,.page-hero--accent h1,.page-hero--accent h2,.page-hero--accent p{color:var(--on-accent)}
.page-hero--accent .eyebrow,.page-hero--accent .idx,.page-hero--accent .kr-soft,.page-hero--accent .back-link{color:var(--on-accent-soft)}
.page-hero--accent .hero-headline,.page-hero--accent .hero-idx{border-color:var(--on-accent-line)}
.page-hero--accent hr,.page-hero--accent .rule{background:var(--on-accent-line);border-color:var(--on-accent-line)}
.site-footer,.site-footer a,.site-footer span,.site-footer p,.site-footer b,.site-footer em{color:var(--on-accent)}
.site-footer *{border-color:var(--on-accent-line)!important}
.site-footer a:hover{opacity:.7}
.abt .abt-msg,.abt .abt-msg .abt-msg-n{color:var(--on-accent)}
.abt .abt-msg-bar i{background:rgba(255,255,255,.3)}.abt .abt-msg-bar i.is-on{background:#fff}
.mdl .mdl-soon,.mdl .mdl-soon h2,.mdl .mdl-soon p,.mdl .mdl-soon .idx,.mdl .mdl-soon b{color:var(--on-accent)}
#root .mdl .mdl-soon .mdl-label,#root .mdl .mdl-soon .mdl-inq{color:#fff;border-color:rgba(255,255,255,.6)}
#root .mdl .mdl-soon .mdl-inq:hover{color:var(--accent);background:#fff;border-color:#fff}
/* contact */
#root .ctc{padding:var(--sy) 0;border-top:1px solid var(--on-accent-line)}
.ctc .section-head{padding-bottom:0}
.ctc .section-head h2{font-size:var(--fs-h1);color:#fff}
.ctc .ctc-head--2{margin-top:clamp(72px,9vw,120px);padding-top:clamp(36px,5vw,60px);border-top:1px solid var(--on-accent-line)}
.ctc .ctc-sub{grid-column:1/13;margin:clamp(16px,2vw,24px) 0 0;font-size:1.05rem;line-height:1.7;color:var(--on-accent-soft)}
.ctc .ctc-sub b{color:#fff}
.ctc .req{font-style:normal;color:#fff;margin-left:3px}
/* type cards: a box you can see you picked */
.ctc .type-grid{margin-top:clamp(28px,4vw,44px)}
.ctc .type-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--on-accent-line);border-radius:4px;padding:clamp(18px,2vw,26px);color:#fff;background:transparent;transition:background .25s,border-color .25s,color .25s}
.ctc .type-card:hover{border-color:#fff}
.ctc .type-top{display:flex;align-items:center;gap:12px}
.ctc .type-dot{flex:none;width:18px;height:18px;border:1.5px solid currentColor;border-radius:50%;display:grid;place-items:center}
.ctc .type-dot:after{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;transform:scale(0);transition:transform .2s}
.ctc .type-card .type-label{font-size:clamp(1.3rem,2vw,1.7rem);color:inherit}
.ctc .type-kr{margin-left:auto;font-size:.85rem;font-weight:600;opacity:.8}
.ctc .type-card .type-items{flex-direction:row;flex-wrap:wrap;gap:6px;margin-top:18px;color:inherit}
.ctc .type-card .type-items span{font-size:.8rem;border:1px solid currentColor;border-radius:999px;padding:3px 10px;opacity:.85}
.ctc .type-state{margin-top:auto;padding-top:20px;font-size:.78rem;font-weight:700;letter-spacing:.06em;opacity:.8}
.ctc .type-card.is-active{background:#fff;border-color:#fff;color:var(--ink)}
.ctc .type-card.is-active .type-dot{color:var(--accent)}
.ctc .type-card.is-active .type-dot:after{transform:scale(1)}
.ctc .type-card.is-active .type-state{color:var(--accent);opacity:1}
.ctc .type-card:focus-visible{outline:2px solid #fff;outline-offset:3px}
/* fields */
.ctc .contact-form{margin-top:clamp(28px,4vw,44px)}
.ctc .form-grid{gap:clamp(24px,3vw,36px) var(--gap)}
.ctc .form-field label{color:#fff;font-size:.85rem;font-weight:600;letter-spacing:0;text-transform:none}
.ctc .form-field input,.ctc .form-field textarea,.ctc .contact-form select{color:#fff;border-bottom:1px solid rgba(255,255,255,.55);font-size:1.05rem;padding:10px 0}
.ctc .form-field input::placeholder,.ctc .form-field textarea::placeholder{color:rgba(255,255,255,.6)}
.ctc .form-field input:focus,.ctc .form-field textarea:focus,.ctc .contact-form select:focus{outline:none;border-bottom-color:#fff;box-shadow:0 1px 0 #fff}
.ctc .contact-form select{cursor:pointer;padding-right:28px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='white' stroke-width='1.6'/></svg>") no-repeat right 4px center}
.ctc .contact-form select option{color:var(--ink);background:#fff}
.ctc .ctc-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
/* send */
.ctc .ctc-send{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;margin-top:clamp(48px,6vw,72px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--on-accent-line)}
.ctc .ctc-send .idx{grid-column:1/4;color:var(--on-accent-soft)}
.ctc .ctc-submit{grid-column:4/8;justify-self:start;display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-size:1rem;font-weight:700;color:var(--accent);background:#fff;border:1px solid #fff;border-radius:999px;padding:14px 28px;cursor:pointer;transition:background .2s,color .2s}
.ctc .ctc-submit:hover{background:transparent;color:#fff}
.ctc .ctc-submit .arrow{transition:transform .3s}.ctc .ctc-submit:hover .arrow{transform:translate(3px,-3px)}
.ctc .ctc-submit:disabled{opacity:.6;cursor:wait}
.ctc .ctc-note{grid-column:8/13;margin:0;font-size:.88rem;line-height:1.7;color:var(--on-accent-soft)}
.ctc .ctc-done{margin-top:18px;font-weight:700;color:#fff}
.ctc .form-error{color:#fff;font-weight:600;background:rgba(19,18,17,.18);padding:10px 14px;border-radius:4px}
.ctc .form-error a{text-decoration:underline}
.ctc .direct-contact{border-top-color:var(--on-accent-line)}
.ctc .dc-item .eyebrow{color:var(--on-accent-soft)}
.ctc .dc-item a,.ctc .dc-item span.value,.ctc .contact-final .display{color:#fff}
@media (max-width:860px){
  .ctc .ctc-send .idx,.ctc .ctc-submit,.ctc .ctc-note{grid-column:1/13}
  .ctc .ctc-submit{margin-top:14px;width:100%;justify-content:center}
  .ctc .ctc-note{margin-top:14px}
}
.ending-scene--about:not(.is-attitude),.ending-scene--about:not(.is-attitude) *,.ending-scene--contact,.ending-scene--contact *{color:#fff!important}
.ending-scene--about:not(.is-attitude) .idx,.ending-scene--about:not(.is-attitude) .eyebrow,.ending-scene--about:not(.is-attitude) .kr-soft,.ending-scene--contact .idx,.ending-scene--contact .eyebrow,.ending-scene--contact .ending-desc,.ending-scene--contact .caption{color:var(--on-accent-soft)!important}
.ending-scene--contact .talk-link,.ending-scene--about:not(.is-attitude) .proj-link{border-color:rgba(255,255,255,.55)!important}
.site-footer .eyebrow,.site-footer .back-top{color:var(--on-accent-soft)}
.abt .abt-hww[data-active] .abt-c--0 b,.abt .abt-hww[data-active] .abt-c--1 b,.abt .abt-hww[data-active] .abt-c--2 b{color:inherit}
.abt .abt-hww[data-active="0"] .abt-c--0,.abt .abt-hww[data-active="1"] .abt-c--1,.abt .abt-hww[data-active="2"] .abt-c--2{color:#fff}


/* v62 — one sideways scene for the whole site, the same as BRANDING · WHAT WE DO:
   the section pins, and scrolling down slides the row to the left. Markup:
   section.hrun > .hrun-stage > .hrun-track > (.hrun-head + .hcol…) + .hrun-bar */
#root .hrun{position:relative;padding:0!important;margin:0;border-top:1px solid var(--line)}
.hrun-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.hrun-track{display:flex;align-items:flex-start;gap:clamp(48px,6vw,96px);width:max-content;padding:0 var(--container);transform:translate3d(calc(var(--p,0)*var(--ov,0px)*-1),0,0);will-change:transform}
.hrun-head{flex:none;width:max-content;max-width:min(62vw,940px)}
.hrun-head .display{white-space:nowrap}
.hrun-head .display{margin:14px 0 0;font-size:var(--fs-h1);line-height:1.05}
.hrun-sub{margin:clamp(20px,2.4vw,28px) 0 0;max-width:460px;font-size:1.02rem;line-height:1.75;color:var(--ink-soft)}
.hcol{flex:none;width:clamp(280px,27vw,420px);border-top:1px solid var(--line);padding-top:22px;transition:border-color .3s}
.hcol:hover{border-top-color:var(--accent)}
.hcol-n{display:block;margin-bottom:14px;font:700 .75rem/1 var(--font-body);letter-spacing:.1em;color:var(--accent)}
.hcol-t{margin:0;font-family:var(--font-display);font-weight:900;text-transform:uppercase;font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.01em;line-height:1.1;transition:color .3s}
.hcol-t.is-kr{font-family:var(--font-body);font-weight:800;letter-spacing:-.03em}
.hcol-kr{display:block;margin:10px 0 24px;font:.85rem/1.3 var(--font-body);color:var(--ink-faint);transition:color .3s}
.hcol:hover .hcol-t,.hcol:hover .hcol-kr{color:var(--accent)}
.hcol-big{margin:0 0 14px;font:900 clamp(1.7rem,2.8vw,2.5rem)/1 var(--font-display);letter-spacing:-.02em;color:var(--accent)}
.hcol-b{margin:0;font-size:1rem;line-height:1.75;color:var(--ink)}
.hcol--note{border-top-color:var(--accent)}
.hcol--note .hcol-b{color:var(--ink)}
.hcol-link{margin-top:22px}
/* photo row variant: same height, black and white until the cursor rests on one */
.hrun-track--media{align-items:center}
.hfig{flex:none;margin:0}
.hfig-img{height:clamp(280px,58vh,560px);overflow:hidden;background:var(--surface-grey)}
.hfig-img img{display:block;height:100%;width:auto;filter:grayscale(1);transition:filter .5s ease}
.hfig:hover img{filter:none}
.hfig figcaption{display:flex;flex-direction:column;gap:2px;padding-top:12px}
.hfig figcaption em{font:normal 700 .68rem/1.4 var(--font-body);letter-spacing:.08em;color:var(--accent)}
.hfig figcaption b{font:700 .9rem/1.4 var(--font-body)}
.hfig figcaption span{font:.75rem/1.4 var(--font-body);color:var(--ink-faint)}
@media (hover:none){.hfig-img img{filter:none}}
.hrun-bar{position:absolute;left:var(--container);right:var(--container);bottom:clamp(24px,5vh,48px);height:1px;background:var(--line)}
.hrun-bar::after{content:"";position:absolute;inset:0;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--p,0))}
@media (max-width:900px){.hrun-head{width:78vw;max-width:none}.hrun-head .display{white-space:normal}.hcol{width:72vw}.hfig-img{height:46vh}}
#root .hrun.hrun-static{height:auto!important}
.hrun-static .hrun-stage{position:static;height:auto;display:block;padding:clamp(64px,9vw,120px) 0}
.hrun-static .hrun-track{flex-wrap:wrap;row-gap:48px;width:auto;transform:none}
.hrun-static .hrun-bar{display:none}
/* split variant: the head stays, only the row on the right travels */
.hrun--split .hrun-stage{gap:clamp(32px,4vw,64px);padding-left:var(--container)}
.hrun--split .hrun-head{width:clamp(320px,38vw,580px);max-width:none}
.hrun--split .hrun-head .display{white-space:normal}
.hrun-view{flex:1;min-width:0;overflow:hidden;align-self:stretch;display:flex;align-items:center}
.hrun--split .hrun-track{padding:0 var(--container) 0 0}
.hrun--split .hfig-img{height:clamp(200px,32vh,320px)}
@media (max-width:900px){
  .hrun--split .hrun-stage{flex-direction:column;align-items:stretch;justify-content:center;padding-left:0;gap:28px}
  .hrun--split .hrun-head{width:auto;padding:0 var(--container)}
  .hrun--split .hrun-view{flex:none;align-self:auto}
  .hrun--split .hrun-track{padding:0 var(--container)}
  .hrun--split .hfig-img{height:30vh}
}
.hrun-static.hrun--split .hrun-stage{display:block;padding-left:0}
.hrun-static.hrun--split .hrun-head{width:auto;padding:0 var(--container);margin-bottom:36px}
.hrun-static .hrun-view{overflow-x:auto}
.hrun-static.hrun--split .hrun-track{flex-wrap:nowrap}

/* v63 — privacy policy page + contact consent; site type and grid only */
.prv .prv-h1{font-size:var(--fs-hero)}
.prv .prv-intro{display:block}
.prv .prv-intro .kr{margin:0;font-size:1.15rem;font-weight:700}
.prv .prv-intro .kr-soft{margin:12px 0 0;max-width:640px;font-size:1rem;line-height:1.8}
.prv .prv-date{margin:16px 0 0;font:600 .8rem/1 var(--font-body);letter-spacing:.06em;color:var(--accent)}
.prv .prv-body{padding:clamp(48px,6vw,80px) 0 clamp(64px,9vw,120px);border-top:1px solid var(--line)}
.prv .prv-sec{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:clamp(22px,2.6vw,32px) 0;border-bottom:1px solid var(--line)}
.prv .prv-sec h2{grid-column:1/5;margin:0;font:800 clamp(1rem,1.3vw,1.15rem)/1.5 var(--font-body);letter-spacing:-.02em}
.prv .prv-text{grid-column:5/13;font-size:.97rem;line-height:1.8;color:var(--ink-soft)}
.prv .prv-text p{margin:0 0 10px}.prv .prv-text p:last-child{margin-bottom:0}
.prv .prv-text ul{margin:0 0 10px;padding-left:1.1em}.prv .prv-text li{margin:4px 0}
.prv .prv-text b{color:var(--ink);font-weight:700;margin-right:6px}
.prv .prv-text a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.prv .prv-table{overflow-x:auto;margin:6px 0 14px}
.prv .prv-table table{width:100%;border-collapse:collapse;font-size:.9rem}
.prv .prv-table th,.prv .prv-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.prv .prv-table th{font-weight:700;color:var(--ink);border-bottom:1px solid var(--line-strong);white-space:nowrap}
@media (max-width:860px){.prv .prv-sec h2,.prv .prv-text{grid-column:1/13}.prv .prv-sec h2{margin-bottom:10px}}
/* contact: consent box on teal */
.ctc .ctc-consent{margin-top:clamp(36px,5vw,56px);padding:clamp(18px,2.2vw,26px);border:1px solid var(--on-accent-line);border-radius:4px}
.ctc .ctc-consent-t{margin:0 0 10px;font:700 .95rem/1.4 var(--font-body);color:#fff}
.ctc .ctc-consent ul{margin:0;padding-left:1.1em;font-size:.88rem;line-height:1.75;color:var(--on-accent-soft)}
.ctc .ctc-consent a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ctc .ctc-agree{display:flex;align-items:center;gap:10px;margin-top:16px;font:600 .95rem/1.4 var(--font-body);color:#fff;cursor:pointer}
.ctc .ctc-agree input{width:20px;height:20px;margin:0;accent-color:#fff;cursor:pointer;flex:none}
.footer-meta .footer-privacy{color:inherit;font-weight:700}
.footer-meta .footer-privacy:hover{opacity:.7}
.prv .hero-meta .eyebrow{white-space:nowrap}