/* PSD MATCH PASS v2: static geometry/colors follow 1920x11323 PSD */
:root{--point:#4F38FF;--point2:#4F38FF;--content:1404px;--header-content:1622px;--header-h:92px}
.site-shell{background:#fff url('psd-background.jpg') center top/1920px 11323px no-repeat}
main{position:relative}.hero,.projects,.read,.purple-zone,.strategy,.case,.experience{background:transparent!important}.purple-zone:before{display:none!important}
.reveal,.reveal.visible,[class*="reveal"]{opacity:1!important;transform:none!important;transition:none!important}.article-card,.article-card:hover,.exp-image img,.exp-card:hover img{transform:none!important;transition:none!important}
.header{height:92px}.header-inner{width:1622px;max-width:calc(100% - 44px)}.brand img{width:109px}.main-nav{gap:48px}.main-nav a{font:300 13px/1 var(--en-light);color:#55565d}.main-nav a.active{color:var(--point);font-family:var(--en);font-weight:600}
.wrap{width:1404px;max-width:calc(100% - 56px)}.eyebrow{font:600 13px/1 var(--en);color:var(--point);letter-spacing:.01em}

/* 01 WHO */
.hero{height:1082px;padding:0}.hero-inner{position:relative;width:1404px;max-width:calc(100% - 56px);height:100%;padding:0;margin:0 auto}
.hero .eyebrow{position:absolute;left:2px;top:337px}.hero h1{position:absolute;left:2px;top:398px;margin:0;width:760px;max-width:none;font-size:48px;line-height:56px;font-weight:700;letter-spacing:-.045em}
.hero-desc{position:absolute;left:1px;top:539px;margin:0;width:676px;max-width:none;font-size:13px;line-height:21px;color:#2f3034;letter-spacing:-.02em}
.metric-grid{position:absolute;left:0;top:780px;width:1404px;margin:0;display:grid;grid-template-columns:repeat(3,454px);gap:21px}
.metric-card{height:244px;padding:59px 47px 0;background:rgba(255,255,255,.80);border:1px solid #bbb;border-radius:12px;backdrop-filter:none}.metric-card .label{font:600 13px/13px var(--en);margin:0 0 9px}.metric-card .desc{font-size:13px;line-height:14px;color:#303136;min-height:14px;white-space:nowrap}.metric-card .number{font:600 70px/70px var(--en);letter-spacing:-.045em;margin-top:26px}.metric-card .suffix{font:600 30px/1 var(--en);color:var(--point);margin-left:17px;vertical-align:15px}

/* Major projects */
.projects{height:2300px;padding:0}.projects>.wrap{position:relative;height:100%;width:1402px;max-width:calc(100% - 56px)}
.projects-head{position:absolute;left:0;top:76px;width:100%;height:43px;border-bottom:1px solid #bbb;padding:0;display:block}.projects-head h2{position:absolute;left:1px;top:0;margin:0;font-size:20px;line-height:23px;font-weight:700;letter-spacing:-.03em}
.project-tabs{position:absolute;right:54px;top:0;height:43px;display:flex;gap:0}.project-tab{width:182px;height:43px;padding:0 0 14px;border:0;background:none;font-size:14px;line-height:16px;color:#25262b}.project-tab.active{font-weight:700}.project-tab.active:after{height:3px;bottom:-1px;background:var(--point)}
.project-content{position:absolute;left:60px;right:60px;top:195px;padding:0}.project-title{height:30px;font-size:26px;line-height:30px;margin:0 0 16px;letter-spacing:-.035em}.project-hero{width:1282px;height:723px;aspect-ratio:auto;object-fit:cover}.asset-caption{font:600 13px/15px var(--en);margin:17px 0 56px}
.project-sub-grid{display:grid;grid-template-columns:repeat(6,206px);gap:9px;padding-left:1px}.project-sub-grid img{width:206px;height:720px;aspect-ratio:auto;object-fit:cover;border:1px solid #d2d3d8}.project-sub-caption{font:600 13px/16px var(--en);margin:17px 0 56px 1px}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.article-card{position:relative;height:313px;min-height:313px;padding:0 36px;background:rgba(255,255,255,.88);border:1px solid #bbb}.article-source{position:absolute;left:36px;top:32px;font-size:13px;line-height:16px;color:var(--point);font-weight:700}.article-card h3{position:absolute;left:36px;right:36px;bottom:126px;margin:0;font-size:20px;line-height:30px;letter-spacing:-.035em}.article-card p{position:absolute;left:36px;right:36px;top:214px;margin:0;font-size:13px;line-height:21px;color:#666}.article-caption{font:600 13px/20px var(--en);margin:12px 0 0 1px}

/* 02 READ */
.read{height:1090px;min-height:0;padding:0;text-align:center}.read>.wrap{position:relative;height:100%;width:1406px;max-width:calc(100% - 56px)}.read .eyebrow{position:absolute;top:100px;left:0;right:0}.read h2{position:absolute;top:162px;left:0;right:0;margin:0;font-size:48px;line-height:56px;letter-spacing:-.045em}.read .intro{position:absolute;top:304px;left:0;right:0;margin:0 auto;max-width:none;font-size:13px;line-height:17px;color:#55575c}
.signal-grid{position:absolute;left:-2px;top:417px;width:1405px;margin:0;display:flex;grid-template-columns:none}.signal{position:relative;z-index:1;flex:0 0 405px;width:405px;height:405px;aspect-ratio:auto;margin:0;border:2px solid var(--point);background:rgba(255,255,255,.10);transition:background .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease,color .25s ease}.signal+.signal{margin-left:-72px}.signal:hover,.signal:focus-within{z-index:10;background:linear-gradient(180deg,rgba(79,56,255,.98),rgba(63,42,224,.98));border-color:rgba(79,56,255,.98);box-shadow:0 22px 52px rgba(46,28,162,.24);transform:translateY(-4px)}.signal .small{font-size:13px;line-height:16px;margin:0 0 22px;color:var(--point);transition:color .25s ease,opacity .25s ease}.signal strong{font-size:24px;line-height:38px;letter-spacing:-.035em;transition:color .25s ease}.signal:hover .small,.signal:focus-within .small,.signal:hover strong,.signal:focus-within strong{color:#fff}
.signal-default,.signal-hover-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:58px 46px;transition:opacity .25s ease,transform .25s ease}.signal-default{opacity:1;transform:translateY(0)}.signal-hover-copy{opacity:0;transform:translateY(10px);font-size:20px;line-height:32px;letter-spacing:-.02em;color:#fff;word-break:keep-all;white-space:pre-line}.signal:hover .signal-default,.signal:focus-within .signal-default{opacity:0;transform:translateY(-10px)}.signal:hover .signal-hover-copy,.signal:focus-within .signal-hover-copy{opacity:1;transform:translateY(0)}.signal:focus-visible{outline:none}
.connect-copy{position:absolute;top:918px;left:0;right:0;margin:0}.connect-copy img{width:43px;height:41px;margin:0 auto}.connect-copy h3{font-size:38px;line-height:56px;letter-spacing:-.04em;margin:27px 0 0}

/* 03 STRATEGY */
.strategy{height:1128px;padding:0}.strategy>.wrap{position:relative;height:100%;width:1404px;max-width:calc(100% - 56px)}.strategy .eyebrow{position:absolute;left:2px;top:234px;color:#fff}.strategy h2{position:absolute;left:2px;top:296px;margin:0;font-size:48px;line-height:56px;letter-spacing:-.045em}.strategy .intro{position:absolute;left:3px;top:436px;margin:0;max-width:none;font-size:13px;line-height:17px;color:rgba(255,255,255,.85)}
.strategy-grid{position:absolute;left:0;top:511px;width:1404px;margin:0;display:grid;grid-template-columns:repeat(2,694px);grid-auto-rows:264px;column-gap:16px;row-gap:17px}.strategy-card{height:264px;padding:0;background:#fff;border:1px solid #dbdbdb;border-radius:12px;color:#09090b}.strategy-card .mini{position:absolute;left:50px;top:95px;font:600 13px/13px var(--en);color:var(--point);margin:0;z-index:2}.strategy-card h3{position:absolute;left:50px;top:127px;margin:0;font-size:26px;line-height:30px;letter-spacing:-.035em;z-index:2}.strategy-card p{position:absolute;left:50px;top:175px;margin:0;max-width:390px;font-size:13px;line-height:21px;color:#4f5055;z-index:2}.strategy-card img{position:absolute;right:47px;top:30px;bottom:auto;max-width:220px;max-height:202px;opacity:1;z-index:1;pointer-events:none}

/* 04 CASE */
.case{height:2400px;padding:0;text-align:center}.case>.wrap{position:relative;height:100%;width:1404px;max-width:calc(100% - 56px)}.case .eyebrow{position:absolute;top:126px;left:0;right:0;color:#fff}.case h2{position:absolute;top:187px;left:0;right:0;margin:0;font-size:48px;line-height:56px;letter-spacing:-.045em}
.case-board{position:absolute;left:76px;top:388px;transform:none;width:1252px;height:1675px;margin:0;padding:0;background:rgba(0,0,0,.20);border:0;border-radius:25px;box-shadow:none}.case-pill{position:absolute;top:-20px;left:50%;transform:translateX(-50%);width:303px;height:43px;padding:0;display:flex;align-items:center;justify-content:center;background:#050507;border-radius:99px;font-size:13px;line-height:19px;margin:0}
.case-stage-label{position:absolute;left:0;right:0;margin:0;font-size:13px;line-height:16px;color:rgba(255,255,255,.88)}.case-stage-label.stage-initial{top:46px}.case-stage-label.stage-response{top:523px}.case-stage-label.stage-direction{top:855px}.case-stage-label.stage-final{top:1476px}
.case-main{position:absolute;left:324px;top:114px;transform:none;width:603px;height:183px;margin:0;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.65);border-radius:10px}.case-main h3{font-size:24px;line-height:28px;margin:0 0 16px}.case-main p{font-size:13px;line-height:17px;margin:0;color:rgba(255,255,255,.82)}
.case-grid{margin:0}.case-grid.three{position:absolute;left:324px;top:309px;transform:none;width:603px;max-width:none;display:grid;grid-template-columns:repeat(var(--case-cols,3),minmax(0,1fr));gap:11px}.case-dark{height:144px;min-height:144px;padding:0 18px;background:rgba(0,0,0,.65);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center}.case-dark h4{font-size:14px;line-height:22px;margin:0}.case-dark p{font-size:12px;line-height:19px;margin:8px 0 0;color:rgba(255,255,255,.72)}
.arrow-down{position:absolute;left:0;right:0;height:30px;font-size:27px;line-height:30px;margin:0;color:rgba(255,255,255,.9)}.arrow-down.arrow-1{top:473px}.arrow-down.arrow-2{top:805px}.arrow-down.arrow-3{top:1426px}
.case-grid.wide{position:absolute;left:174px;top:591px;transform:none;width:904px;height:194px;max-width:none;margin:0;display:grid;grid-template-columns:repeat(var(--case-cols,3),minmax(0,1fr));gap:0;border:1px solid rgba(255,255,255,.62);border-radius:11px;background:rgba(0,0,0,.15)}.case-stat{height:192px;min-height:0;padding:0 28px;display:flex;align-items:center;justify-content:center;flex-direction:column}.case-stat+.case-stat{border-left:1px solid rgba(255,255,255,.38)}.case-stat strong{font:600 21px/23px var(--en);margin:0 0 14px}.case-stat p{font-size:12px;line-height:21px;margin:0;color:rgba(255,255,255,.78)}
.case-result-list{position:absolute;left:224px;top:923px;transform:none;width:803px;max-width:none;margin:0;display:grid;gap:12px}.case-result{width:803px;height:153px;padding:0 80px;display:grid;grid-template-columns:210px 1fr;gap:28px;align-items:center;background:#fff;color:#111;border-radius:77px;text-align:left}.case-result strong{font-size:18px;line-height:23px;color:var(--point)}.case-result p{font-size:13px;line-height:21px;margin:0;color:#303035}
.case-final{position:absolute;left:252px;top:1544px;transform:none;width:777px;margin:0}.case-final .highlight{width:777px;height:78px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent url('psd-layer-152.png') center/100% 100% no-repeat;color:#111;font-family:var(--kr);font-size:27px;line-height:41px;font-weight:800;transform:none;box-shadow:none}.case-final p{font-size:13px;line-height:21px;color:rgba(255,255,255,.83);margin:11px 0 0}
.case-quote{position:absolute;right:76px;top:2176px;width:843px;max-width:none;margin:0;text-align:right;font-size:34px;line-height:58px;font-weight:500}.case-quote:before{left:-2px;top:-58px}.case-quote:after{right:-2px;bottom:-42px}

/* 05 EXPERIENCE */
.experience{height:2622px;padding:0;background:transparent}.experience>.wrap{position:relative;height:100%;width:1402px;max-width:calc(100% - 56px)}.experience .eyebrow{position:absolute;left:1px;top:98px}.experience h2{position:absolute;left:1px;top:160px;margin:0;font-size:48px;line-height:56px;letter-spacing:-.045em}.experience .intro{position:absolute;left:1px;top:304px;margin:0;max-width:none;font-size:13px;line-height:17px;color:#55575c}
.year-tabs{position:absolute;left:0;top:400px;margin:0;display:flex;gap:7px}.year-btn{width:123px;min-width:123px;height:42px;border:1.5px solid #111;border-radius:99px;background:#fff;font:300 13px/14px var(--en-light);padding:0}.year-btn.active{background:#050505;color:#fff;font-family:var(--en);font-weight:600}
.experience-grid{position:absolute;left:0;top:480px;width:1402px;display:grid;grid-template-columns:repeat(3,452px);column-gap:23px;row-gap:39px}.exp-image{width:452px;height:252px;aspect-ratio:auto;border-radius:10px}.exp-overlay{background:rgba(0,0,0,.78);padding:26px}.exp-overlay p{font-size:13px;line-height:20px}.exp-name{text-align:center;font-size:13px;line-height:16px;margin-top:13px}.more{position:absolute;left:50%;top:2446px;transform:translateX(-50%);margin:0;border:0;background:none;font-size:20px;line-height:28px}

/* Clients + footer */
.clients{height:200px;border-top:0;border-bottom:0;background:#fff;display:flex;align-items:center;overflow:hidden}.client-strip{display:block;flex:0 0 1920px;width:1920px;height:200px;max-width:none;object-fit:none;margin:0}
.footer{height:503px;min-height:503px;padding:54px 0 0;background:#000;color:#fff}.footer>.wrap{position:relative;height:100%;width:1622px;max-width:calc(100% - 56px)}.footer-top{display:grid;grid-template-columns:1fr auto;gap:80px;align-items:start}.footer-logo{width:146px;height:41px;object-fit:contain;margin:0 0 40px}.footer h2{font-size:38px;line-height:48px;margin:0;letter-spacing:-.04em}.contact-btn{width:282px;min-width:282px;height:82px;margin-top:81px;background:var(--point);border-radius:41px;font-size:20px}.footer-info{margin-top:64px;display:grid;grid-template-columns:74px 1fr;gap:8px 18px;font-size:12px;line-height:17px;color:#ddd}.footer-bottom{position:absolute;left:0;right:0;bottom:57px;margin:0;padding:0;border:0;font-size:11px;line-height:16px;color:#8d8d91}.admin-link{font-size:10px;color:#777}

/* Re-enable automatic horizontal marquee for the client strip */
.client-marquee{animation:clientRun 32s linear infinite!important}
@media(max-width:1199px){.site-shell{background-image:none}}

/* PSD TEXT SIZE FIX — actual Photoshop text sizes, desktop 1920 basis.
   This block intentionally comes AFTER the geometry stylesheet so it wins the cascade. */
@media (min-width:1200px){
  .main-nav a{font-size:16px}
  .eyebrow{font-size:16px}
  .hero h1{font-size:50px}
  .hero-desc{font-size:16px}
  .metric-card .label{font-size:16px}
  .metric-card .desc{font-size:14px}
  .metric-card .number{font-size:80px}
  .metric-card .suffix{font-size:60px}
  .projects-head h2{font-size:24px}
  .project-tab{font-size:16px}
  .project-title{font-size:32px}
  .asset-caption{font-size:16px}
  .project-sub-caption{font-size:16px}
  .article-caption{font-size:20px}
  .article-source{font-size:16px}
  .article-card h3{font-size:25px}
  .article-card p{font-size:14px}
  .read h2{font-size:50px}
  .read .intro{font-size:16px}
  .signal .small{font-size:16px}
  .signal strong{font-size:32px}
  .connect-copy h3{font-size:50px}
  .strategy h2{font-size:50px}
  .strategy .intro{font-size:16px}
  .strategy-card .mini{font-size:16px}
  .strategy-card h3{font-size:32px}
  .strategy-card p{font-size:16px}
  .case h2{font-size:50px}
  .case-pill{font-size:20px}
  .case-stage-label{font-size:16px}
  .case-main h3{font-size:30px}
  .case-main p{font-size:16px}
  .case-dark h4{font-size:16px}
  .case-dark p{font-size:16px}
  .case-stat strong{font-size:30px}
  .case-stat:nth-child(3) strong{font-size:24px}
  .case-stat p{font-size:16px}
  .case-result strong{font-size:24px}
  .case-result p{font-size:18px}
  .case-final .highlight{font-size:42px}
  .case-final p{font-size:20px}
  .case-quote{font-size:50px}
  .experience h2{font-size:50px}
  .experience .intro{font-size:16px}
  .year-btn{font-size:20px}
  .exp-overlay p{font-size:16px}
  .exp-name{font-size:16px}
  .more{font-size:30px}
  .footer h2{font-size:40px}
  .contact-btn{font-size:32px}
  .footer-info{font-size:16px}
  .footer-bottom{font-size:14px}
}

/* PSD LINE BREAK PASS — preserve Photoshop composition at 1920 without changing geometry */
@media (min-width:1200px){
  .hero h1,.hero-desc,.metric-card .desc,.article-card h3,.article-card p,
  .read h2,.read .intro,.signal strong,.connect-copy h3,
  .strategy h2,.strategy .intro,.strategy-card h3,.strategy-card p,
  .case h2,.case-main h3,.case-main p,.case-dark h4,.case-dark p,.case-stat p,
  .case-result strong,.case-result p,.case-final .highlight,.case-final p,.case-quote,
  .experience h2,.experience .intro,.exp-overlay p,.exp-name,.footer h2,.footer-info{
    word-break:keep-all;overflow-wrap:normal;
  }
  .article-card h3,.article-card p,.case-main p,.case-dark h4,.case-dark p,.case-stat p,.case-result p{white-space:pre-line}
}


/* PSD TYPOGRAPHY / LINE-BREAK LOCK v3
   Desktop composition follows the Photoshop text layers exactly.
   Explicit PSD breaks are preserved and browser auto-wrap is disabled inside each intended line. */
@media (min-width:1200px){
  /* Static copy: <br> remains the only allowed break on desktop. */
  .hero h1,.hero-desc,.metric-card .desc,.projects-head h2,.project-title,.project-tab,
  .read h2,.read .intro,.signal .small,.signal strong,.connect-copy h3,
  .strategy h2,.strategy .intro,.strategy-card h3,.strategy-card p,
  .case h2,.case-main h3,.case-final .highlight,.case-final p,.case-quote,
  .experience h2,.experience .intro,.exp-name,.footer h2{
    white-space:nowrap;
    word-break:keep-all;
    overflow-wrap:normal;
  }

  /* Admin/default dynamic copy contains PSD line feeds; preserve ONLY those line feeds. */
  .article-card h3,.article-card p,
  .case-main p,.case-dark h4,.case-dark p,.case-stat p,
  .case-result strong,.case-result p,.exp-overlay p{
    white-space:pre;
    word-break:keep-all;
    overflow-wrap:normal;
  }

  /* Exact Photoshop leading values. */
  .hero h1{line-height:65px}
  .hero-desc{line-height:26px}
  .article-card h3{line-height:36px;right:26px}
  .article-card p{line-height:24px;right:26px}
  .read h2{line-height:65px}
  .read .intro{line-height:30px}
  .signal strong{line-height:42px}
  .connect-copy h3{line-height:65px}
  .strategy h2{line-height:65px}
  .strategy .intro{line-height:30px}
  .strategy-card h3{line-height:50px}
  .strategy-card p{line-height:26px}
  .case h2{line-height:65px}
  .case-pill{line-height:30px}
  .case-stage-label{line-height:36px}
  .case-main h3{line-height:45px}
  .case-main p{line-height:30px}
  .case-dark h4{line-height:26px}
  .case-dark p{line-height:26px}
  .case-stat strong{line-height:36px}
  .case-stat p{line-height:26px}
  .case-result{padding-left:80px;padding-right:73px;grid-template-columns:210px 1fr;gap:27px}
  .case-result strong{line-height:45px}
  .case-result p{line-height:32px}
  .case-final .highlight{line-height:45px}
  .case-final p{line-height:30px}
  .case-quote{line-height:70px}
  .experience h2{line-height:65px}
  .experience .intro{line-height:30px}
  .year-btn{line-height:30px}
  .exp-overlay p{line-height:30px}
  .exp-name{line-height:30px}
  .footer h2{line-height:60px}
  .footer-info{line-height:32px}
  .footer-bottom{line-height:32px}
}

/* Below desktop, release the fixed Photoshop line boxes so responsive layout can wrap naturally. */
@media (max-width:1199px){
  .hero h1,.hero-desc,.metric-card .desc,.projects-head h2,.project-title,.project-tab,
  .read h2,.read .intro,.signal .small,.signal strong,.connect-copy h3,
  .strategy h2,.strategy .intro,.strategy-card h3,.strategy-card p,
  .case h2,.case-main h3,.case-final .highlight,.case-final p,.case-quote,
  .experience h2,.experience .intro,.exp-name,.footer h2{white-space:normal}
  .article-card h3,.article-card p,.case-main p,.case-dark h4,.case-dark p,
  .case-stat p,.case-result strong,.case-result p,.exp-overlay p{white-space:pre-line}
}

/* ARTICLE CARD TEXT BLOCK — text stays left-aligned, the text area itself is centered in each card */
.article-card{
  --article-inset:45px;
  overflow:hidden;
  text-align:left;
}
.article-source{
  left:var(--article-inset);
  right:var(--article-inset);
  width:auto;
  text-align:left;
}
.article-card h3{
  left:var(--article-inset);
  right:var(--article-inset);
  width:auto;
  text-align:left;
  white-space:pre-line !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
.article-card p{
  left:var(--article-inset);
  right:var(--article-inset);
  width:auto;
  max-width:none;
  text-align:left;
  white-space:pre-line !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
@media (min-width:1200px){
  .article-card h3,.article-card p{
    white-space:pre-line !important;
    overflow-wrap:break-word !important;
  }
}
@media (max-width:1199px){
  .article-card{--article-inset:28px}
}

/* USER REVISION 2026-10-19 — News / Media cards */
/* Updated per request: all article card inner spacing set to 45px on desktop. */
.article-card{
  --article-inset:45px;
  height:370px;
  min-height:370px;
  padding:45px var(--article-inset);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.article-source{
  position:static;
  left:auto;
  right:auto;
  top:auto;
  width:auto;
  flex:0 0 auto;
  margin:0 0 22px;
  text-align:left;
}
.article-card h3{
  position:static;
  left:auto;
  right:auto;
  top:auto;
  bottom:auto;
  width:auto;
  margin:0;
  text-align:left;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp:3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:pre-line !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
.article-card p{
  position:static;
  left:auto;
  right:auto;
  top:auto;
  bottom:auto;
  width:auto;
  max-width:none;
  margin:auto 0 0;
  text-align:left;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp:3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:pre-line !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}
/* Match the size of the other project captions; this had been the only 20px caption. */
@media (min-width:1200px){
  .article-caption{font-size:16px;line-height:20px}
}
@media (max-width:1199px){
  .article-card{
    --article-inset:28px;
    height:auto;
    min-height:340px;
    padding:40px var(--article-inset);
  }
}

/* CASE final yellow marker — emulate the PSD's duplicated yellow layer. */
.case-final .highlight{
  background-image:url('psd-layer-152.png'),url('psd-layer-152.png');
  background-position:center,center;
  background-size:100% 100%,100% 100%;
  background-repeat:no-repeat,no-repeat;
}

@media (max-width:1199px){.signal-default,.signal-hover-copy{padding:36px 30px}.signal-hover-copy{font-size:20px;line-height:1.6}}

/* USER REVISION — Adobe Fonts TT Commons Pro lock
   Primary family: Adobe Fonts web name `tt-commons-pro`.
   Local preview fallback: Creative Cloud activated `TT Commons Pro` family.
   DemiBold 600 everywhere listed below; only inactive top nav/year tabs are Light 300. */
.en{font-family:var(--en)!important;font-weight:600!important}
.main-nav a{font-family:var(--en-light)!important;font-weight:300!important}
.main-nav a.active{font-family:var(--en)!important;font-weight:600!important}
.metric-card .label,.metric-card .number,.metric-card .suffix,
.asset-caption,.project-sub-caption,.article-caption,
.strategy-card .mini,.case-stat strong,
.case-quote:before,.case-quote:after{font-family:var(--en)!important;font-weight:600!important}
.year-btn{font-family:var(--en-light)!important;font-weight:300!important}
.year-btn.active{font-family:var(--en)!important;font-weight:600!important}

/* KOREAN FONT LOCK — keep Hangul consistently on NEXON while TT Commons remains for designated English/numeric UI */
.hero h1,.hero-desc,.projects-head h2,.project-tab,.project-title,.article-source,.article-card h3,.article-card p,.read h2,.read .intro,.signal strong,.signal-hover-copy,.connect-copy h3,.strategy h2,.strategy .intro,.strategy-card h3,.strategy-card p,.case h2,.case-pill,.case-main h3,.case-main p,.case-dark h4,.case-dark p,.case-stage-label,.case-stat p,.case-result strong,.case-result p,.case-final .highlight,.case-final p,.case-quote,.experience h2,.experience .intro,.exp-overlay p,.exp-name,.more,.footer h2,.footer-info,.contact-btn{font-family:var(--kr)}
.metric-card .desc{font-family:var(--kr)}


/* CASE PSD refinement v2 — only 04 section and its quote block */
.case-stage-label.stage-response{top:534px}
.case-stage-label.stage-direction{top:868px}
.case-stage-label.stage-final{top:1486px}
.arrow-down{left:50%;right:auto;width:24px;height:34px;transform:translateX(-50%);font-size:0;line-height:0;color:#fff}
.arrow-down::before{content:'';position:absolute;left:50%;top:0;width:2px;height:18px;background:currentColor;transform:translateX(-50%);opacity:.95}
.arrow-down::after{content:'';position:absolute;left:50%;top:14px;width:9px;height:9px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateX(-50%) rotate(-45deg)}
.arrow-down.arrow-1{top:483px;color:rgba(255,255,255,.96)}
.arrow-down.arrow-2{top:818px;color:rgba(255,255,255,.96)}
.arrow-down.arrow-3{top:1438px;color:#34d4ff}
.case-grid.wide{top:604px;border-color:rgba(255,255,255,.72);border-radius:16px;background:rgba(0,0,0,.08);overflow:visible}
.case-grid.wide::before{content:'새로운 타깃 층 확인';position:absolute;left:50%;top:-15px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;width:320px;height:40px;border-radius:999px;background:#fff;color:#5140ff;font-family:var(--kr);font-size:16px;font-weight:700;letter-spacing:-.02em;box-shadow:0 2px 0 rgba(255,255,255,.18)}
.case-stat{position:relative;height:194px;padding:28px 34px 0}
.case-stat+.case-stat{border-left:0}
.case-stat+.case-stat::before{content:'';position:absolute;left:0;top:41px;bottom:41px;width:1px;background:rgba(255,255,255,.55)}
.case-stat strong{margin:0 0 12px}
.case-stat p{line-height:20px}
.case-result-list{top:937px;gap:14px}
.case-result{height:155px;border-radius:78px;box-shadow:none}
.case-final{top:1557px}
.case-final p{margin-top:12px}
.case-quote{right:0;top:2194px;width:1092px;font-family:var(--kr);font-size:38px;line-height:1.45;color:#fff;font-weight:400;letter-spacing:-.04em}
.case-quote b{font-weight:700}
.case-quote:before,.case-quote:after{font-family:serif;font-size:82px;line-height:1;color:#fff;font-weight:700}
.case-quote:before{left:80px;top:-42px}
.case-quote:after{right:-6px;bottom:-24px}


/* CASE ADMIN MULTILINE TITLES — preserve Enter line breaks from admin */
.case-main h3,.case-dark h4,.case-stat strong,.case-result strong{
  white-space:pre-line !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}


/* Global font usage rule: mixed Hangul/English strings stay on NEXON; only pure English/numeric strings use TT Commons */
.kr-only{font-family:var(--kr)!important}
.en-only{font-family:var(--en)!important}
.article-source.en-only,.case-stat strong.en-only,.year-btn,.main-nav a,.eyebrow,.metric-card .label,.metric-card .number,.metric-card .suffix,.asset-caption,.project-sub-caption,.article-caption{font-family:var(--en)!important}
.article-source.kr-only,.case-pill,.case-main h3,.case-main p,.case-dark h4,.case-dark p,.case-result strong,.case-result p,.case-final .highlight,.case-final p,.case-quote,.exp-overlay p,.exp-name{font-family:var(--kr)!important}

/* 04 CASE detailed correction */
.case-grid.wide{top:602px;height:196px;border-radius:18px;border:1px solid rgba(255,255,255,.72);background:rgba(0,0,0,.08)}
.case-grid.wide::before{content:'새로운 타깃 층 확인';position:absolute;left:50%;top:-15px;transform:translateX(-50%);width:325px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#fff;color:#4f46ff;font-family:var(--kr);font-size:16px;font-weight:700;letter-spacing:-.03em}
.case-stat{position:relative;height:194px;min-height:194px;padding:0 42px;display:flex;align-items:center;justify-content:center;flex-direction:column}
.case-stat+.case-stat{border-left:0}
.case-stat+.case-stat::before{content:'';position:absolute;left:0;top:39px;bottom:39px;width:1px;background:rgba(255,255,255,.55)}
.case-stat strong{margin:0 0 14px;font-family:var(--kr)}
.case-stat strong.en-only{font-family:var(--en)!important}
.case-stat p{margin:0;line-height:21px;text-align:center}
.case-stage-label.stage-response{top:540px}
.case-stage-label.stage-direction{top:872px}
.case-stage-label.stage-final{top:1490px}
.case-result-list{top:940px;gap:14px}
.case-result{height:155px;align-items:center}
.case-final{top:1562px}
.case-final p{text-align:center}
/* Use image-based arrows for closer PSD match */
.arrow-down{position:absolute;left:50%;right:auto;width:20px;height:38px;transform:translateX(-50%);font-size:0;line-height:0;background-repeat:no-repeat;background-position:center top;background-size:20px 38px}
.arrow-down.arrow-1{top:488px;background-image:linear-gradient(rgba(255,255,255,.98),rgba(255,255,255,.98)),linear-gradient(135deg, transparent 43%, rgba(255,255,255,.98) 43%, rgba(255,255,255,.98) 57%, transparent 57%),linear-gradient(225deg, transparent 43%, rgba(255,255,255,.98) 43%, rgba(255,255,255,.98) 57%, transparent 57%);background-size:2px 18px,9px 9px,9px 9px;background-position:center 0,calc(50% - 3.5px) 15px,calc(50% + 3.5px) 15px}
.arrow-down.arrow-2{top:821px;background-image:linear-gradient(rgba(255,255,255,.98),rgba(255,255,255,.98)),linear-gradient(135deg, transparent 43%, rgba(255,255,255,.98) 43%, rgba(255,255,255,.98) 57%, transparent 57%),linear-gradient(225deg, transparent 43%, rgba(255,255,255,.98) 43%, rgba(255,255,255,.98) 57%, transparent 57%);background-size:2px 18px,9px 9px,9px 9px;background-position:center 0,calc(50% - 3.5px) 15px,calc(50% + 3.5px) 15px}
.arrow-down.arrow-3{top:1443px;background-image:linear-gradient(#29d5ff,#29d5ff),linear-gradient(135deg, transparent 43%, #29d5ff 43%, #29d5ff 57%, transparent 57%),linear-gradient(225deg, transparent 43%, #29d5ff 43%, #29d5ff 57%, transparent 57%);background-size:2px 18px,9px 9px,9px 9px;background-position:center 0,calc(50% - 3.5px) 15px,calc(50% + 3.5px) 15px}
.arrow-down::before,.arrow-down::after{display:none!important}
.case-quote{right:0;top:2190px;width:1120px;font-family:var(--kr);font-size:38px;line-height:1.42;font-weight:400;color:#fff;letter-spacing:-.04em}
.case-quote b{font-weight:700}
.case-quote:before,.case-quote:after{font-family:var(--kr);font-size:82px;line-height:1;color:#fff;font-weight:700}
.case-quote:before{left:84px;top:-38px;content:'“'}
.case-quote:after{right:-2px;bottom:-28px;content:'”'}


/* FINAL micro-fix per user review */
.case{height:2460px}
.case-board{height:1718px}
.case-final{top:1568px}
.case-final p{margin-top:18px;padding-bottom:30px}

/* Replace odd arrow with simple clean arrow */
.arrow-down{width:18px;height:34px;background:none!important}
.arrow-down::before,.arrow-down::after{display:block!important;content:'';position:absolute;left:50%}
.arrow-down::before{top:0;width:2px;height:18px;background:currentColor;transform:translateX(-50%)}
.arrow-down::after{top:15px;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateX(-50%) rotate(45deg)}
.arrow-down.arrow-1{top:490px;color:#fff}
.arrow-down.arrow-2{top:823px;color:#fff}
.arrow-down.arrow-3{top:1448px;color:#29d5ff}

/* Quote block: prevent overlap and match PSD spacing more closely */
.case-quote{right:0;top:2250px;width:1140px;padding:0 52px 0 118px;box-sizing:border-box;text-align:right;font-family:var(--kr);font-size:36px;line-height:1.42;font-weight:400;letter-spacing:-.045em;color:#fff}
.case-quote b{font-weight:700}
.case-quote:before,.case-quote:after{font-family:var(--kr);font-size:74px;line-height:1;font-weight:700;color:#fff}
.case-quote:before{content:'“';left:42px;top:-26px}
.case-quote:after{content:'”';right:10px;bottom:-14px}


/* FINAL user review v5 */
.case{height:2510px}
.case-board{height:1768px}
.case-final{top:1568px}
.case-final p{margin-top:18px;padding-bottom:30px}

/* Use literal text arrows */
.arrow-down{width:24px;height:34px;background:none!important;font-size:30px;line-height:34px;text-align:center;font-weight:400}
.arrow-down::before{display:none!important}
.arrow-down::after{content:'↓'!important;display:block!important;position:static!important;width:auto!important;height:auto!important;border:0!important;transform:none!important;background:none!important}
.arrow-down.arrow-1{top:490px;color:#ffffff}
.arrow-down.arrow-2{top:823px;color:#ffffff}
.arrow-down.arrow-3{top:1448px;color:#29d5ff}

/* Quote block aligned to the case board right edge, with separated quotation marks */
.case-quote{right:76px;top:2300px;width:1252px;padding:0 26px 0 108px;box-sizing:border-box;text-align:right;font-family:var(--kr);font-size:38px;line-height:1.42;font-weight:400;letter-spacing:-.045em;color:#fff}
.case-quote b{display:block;margin-top:14px;font-weight:700}
.case-quote:before,.case-quote:after{position:absolute;font-family:var(--kr);font-size:76px;line-height:1;font-weight:700;color:#fff}
.case-quote:before{content:'“';left:0;top:-16px}
.case-quote:after{content:'”';right:0;bottom:-8px}


/* FINAL quote + arrow lock — match supplied reference image */
.arrow-down{position:absolute;left:50%;right:auto;width:28px;height:36px;transform:translateX(-50%);background:none!important;font-family:var(--kr)!important;font-size:30px!important;line-height:36px!important;font-weight:400!important;text-align:center!important}
.arrow-down::before,.arrow-down::after{display:none!important;content:none!important}
.arrow-down.arrow-1{top:490px;color:#fff!important}
.arrow-down.arrow-2{top:823px;color:#fff!important}
.arrow-down.arrow-3{top:1448px;color:#29d5ff!important}

.case-quote{position:absolute;right:76px;top:2250px;width:850px;height:250px;margin:0;padding:0;box-sizing:border-box;text-align:right;font-family:var(--kr)!important;color:#fff;letter-spacing:-.045em}
.case-quote:before,.case-quote:after{display:none!important;content:none!important}
.case-quote-open,.case-quote-close{position:absolute;display:block;font-family:var(--kr)!important;font-size:66px;line-height:1;font-weight:700;color:#fff}
.case-quote-open{left:0;top:0}
.case-quote-close{right:0;bottom:0}
.case-quote-text{position:absolute;left:0;right:0;top:60px;text-align:right;font-family:var(--kr)!important;font-size:38px;line-height:1.42;font-weight:400;white-space:nowrap}
.case-quote-text b{display:block;margin-top:10px;font-weight:700}


/* Quote mark image swap */
.case-quote-open,.case-quote-close{
  font-size:0 !important;
  color:transparent !important;
  width:108px;
  height:74px;
  background:url('quote-mark.png') center/contain no-repeat;
}
.case-quote-open{left:0;top:0}
.case-quote-close{right:0;bottom:0;transform:rotate(180deg)}


/* Quote spacing + typography match */
.case-quote{
  position:absolute;
  right:76px;
  top:2250px;
  width:850px;
  height:auto;
  margin:0;
  padding:0;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  text-align:right;
  font-family:var(--kr)!important;
  color:#fff;
}
.case-quote-open,
.case-quote-close{
  position:static!important;
  display:block!important;
  width:40px!important;
  height:auto!important;
  aspect-ratio:217/156;
  flex:0 0 auto;
  background:url('quote-mark.png') center/contain no-repeat!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
}
.case-quote-open{
  align-self:flex-start;
  margin:0;
  transform:none!important;
}
.case-quote-text{
  position:static!important;
  width:100%;
  margin:30px 0 0;
  padding:0;
  text-align:right;
  font-family:var(--kr)!important;
  font-size:38px;
  line-height:1.2;
  letter-spacing:-0.045em;
  font-weight:400;
  white-space:nowrap;
  color:#fff;
}
.case-quote-text b{
  display:block;
  margin-top:16px;
  font-weight:700;
}
.case-quote-close{
  align-self:flex-end;
  margin-top:30px;
  transform:rotate(180deg)!important;
}


/* Quote alignment + lower following section spacing */
.case-quote-open{
  margin-left:210px !important;
}
.experience{
  margin-top:150px !important;
}

/* FINAL BACKGROUND FIX — preserve all foreground styling */
.site-shell{background:#fff !important;}
main{
  position:relative;
  background:#fff url('top-background-wide-fixed.jpg') center top / 5120px 5122px no-repeat !important;
}
.purple-zone{
  position:relative;
  isolation:isolate;
  overflow:visible;
  z-index:1;
  background:transparent !important;
}
.purple-zone::before{
  content:'' !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  background-color:#4731e0 !important;
  background-image:url('purple-texture-seamless.png') !important;
  background-repeat:repeat !important;
  background-size:1024px 1024px !important;
  background-position:center top !important;
  clip-path:polygon(0 0.15%,100% 8.1%,100% 100%,0 92%) !important;
  z-index:0 !important;
  pointer-events:none !important;
}
.purple-zone::after{display:none !important;content:none !important;}
.strategy,.case{position:relative;z-index:1;}
/* Let EXPERIENCE overlap the transparent bottom wedge so the annotated gaps match the reference. */
.experience{
  position:relative;
  z-index:0;
  margin-top:-220px !important;
  background:#fff !important;
}
@media(max-width:1199px){
  main{background:#fff !important;}
  .experience{margin-top:0 !important;}
  .purple-zone::before{clip-path:none !important;}
}

.purple-zone>.strategy,.purple-zone>.case{position:relative;z-index:1!important;}

/* explicit background layer for reliable rendering */
.purple-zone::before{display:none!important;content:none!important;}
.purple-bg{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-color:#4731e0;
  background-image:url('purple-texture-seamless.png');
  background-repeat:repeat;
  background-size:1024px 1024px;
  background-position:center top;
  clip-path:polygon(0 0.15%,100% 8.1%,100% 100%,0 92%);
}
.purple-zone>.strategy,.purple-zone>.case{position:relative;z-index:1!important;}
/* spacing match from annotated reference */
.case{height:2660px !important;}
/* annotated spacing final */
.case{height:2680px !important;}
.experience{margin-top:-170px !important;}


/* FINAL MESSAGE ARROW — requested white */
.arrow-down.arrow-3{color:#fff !important;}
.arrow-down.arrow-3::after{color:#fff !important;}


/* FOOTER PSD MATCH — footer only */
.footer{height:503px!important;min-height:503px!important;padding:54px 0 0!important;background:#000!important;color:#fff!important}
.footer>.wrap{position:relative!important;height:100%!important;width:1622px!important;max-width:calc(100% - 56px)!important}
.footer-top{display:grid!important;grid-template-columns:1fr auto!important;gap:80px!important;align-items:start!important}
.footer-logo{width:146px!important;height:41px!important;object-fit:contain!important;margin:0 0 40px!important}
.footer h2{font-size:38px!important;line-height:48px!important;margin:0!important;letter-spacing:-.04em!important}
.contact-btn{width:282px!important;min-width:282px!important;height:82px!important;margin-top:81px!important;border-radius:41px!important;font-size:20px!important}
.footer-info{margin-top:64px!important;display:grid!important;gap:8px!important;color:#ddd!important;font-size:12px!important;line-height:17px!important}
.footer-info-row{display:grid!important;grid-template-columns:18px 55px 1fr!important;column-gap:2px!important;align-items:center!important;min-height:17px!important}
.footer-info-row img{display:block!important;max-width:17px!important;max-height:18px!important;object-fit:contain!important;justify-self:start!important}
.footer-info-row b{font-weight:700!important;white-space:nowrap!important}.footer-info-row span{white-space:nowrap!important}
.footer-bottom{position:absolute!important;left:0!important;right:0!important;bottom:57px!important;margin:0!important;padding:0!important;border:0!important;display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:40px!important;font-size:11px!important;line-height:16px!important;color:#8d8d91!important}
.footer-legal{display:flex!important;flex-direction:column!important;align-items:flex-start!important}.footer-legal>span{white-space:nowrap!important}
.admin-link{display:block!important;margin-top:8px!important;font-size:10px!important;line-height:14px!important;color:#777!important}
.company-download{display:flex!important;align-items:center!important;gap:8px!important;color:#fff!important;text-decoration:none!important;font-size:12px!important;line-height:18px!important;font-weight:700!important;white-space:nowrap!important}
.company-download img{width:19px!important;height:18px!important;object-fit:contain!important;flex:0 0 auto!important}

/* Footer right-side PSD x-position correction */
.contact-btn{margin-right:111px!important}
.company-download{position:relative!important;right:112px!important}

.company-download{width:153px!important}


/* FOOTER CONTACT ROW FIX — spacing only */
.footer-info{
  width:1000px !important;
  max-width:100% !important;
  margin-top:64px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  row-gap:10px !important;
  font-size:16px !important;
  line-height:24px !important;
  color:#ddd !important;
}
.footer-info-row{
  display:grid !important;
  grid-template-columns:22px 82px minmax(0,1fr) !important;
  column-gap:10px !important;
  align-items:center !important;
  min-height:24px !important;
}
.footer-info-row img{
  display:block !important;
  width:18px !important;
  height:18px !important;
  max-width:18px !important;
  max-height:18px !important;
  object-fit:contain !important;
  justify-self:start !important;
}
.footer-info-row b{
  font-size:16px !important;
  line-height:24px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
.footer-info-row span{
  font-size:16px !important;
  line-height:24px !important;
  white-space:nowrap !important;
}


/* NEWS CARD title alignment — reserve full 3-line title area so 2-line titles align with neighbors */
@media (min-width:1200px){
  .article-card h3{
    min-height:108px !important;
    height:108px !important;
    align-content:start;
  }
}


/* NEWS CARD final title position/alignment */
@media (min-width:1200px){
  .article-source{
    margin:0 0 65px !important;
  }
  .article-card h3{
    min-height:108px !important;
    height:108px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    -webkit-line-clamp:unset !important;
    line-clamp:unset !important;
    overflow:hidden !important;
  }
}


/* ADMIN / CLIENT STRIP + BROCHURE */
.clients .client-marquee{display:flex!important;align-items:center!important;gap:0!important;width:max-content!important}
.clients .client-strip{display:block!important;flex:0 0 auto!important;height:50px!important;width:auto!important;min-width:0!important;max-width:none!important;object-fit:contain!important;object-position:left center!important;margin:0!important}
.file-control{border:1px dashed #c8cad4;border-radius:10px;padding:16px}
.file-current{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px 14px;margin-bottom:10px;border-radius:8px;background:#f5f6f9;font-size:13px}
.file-current b{flex:0 0 auto}.file-current span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#4d5058}
.file-control small{display:block;color:#777b84;line-height:1.45;margin:6px 0 10px}.file-control input[type=file]{display:block;font-size:12px;max-width:100%;margin-bottom:10px}


/* ADMIN EXPERIENCE YEAR TABS + 3-COLUMN EDIT GRID */
.admin-year-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:18px 0 22px;
}
.admin-year-btn{
  min-width:104px;
  height:40px;
  border:1.5px solid #16171b;
  border-radius:999px;
  background:#fff;
  color:#15161a;
  font-family:var(--en-light);
  font-weight:300;
  cursor:pointer;
}
.admin-year-btn.active{
  background:#111;
  color:#fff;
  font-family:var(--en);
  font-weight:600;
}
.admin-experience-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.admin-exp-card{min-width:0;}
.admin-exp-year{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  height:28px;
  padding:0 12px;
  margin-bottom:8px;
  border-radius:999px;
  background:#f0efff;
  color:var(--point);
  font-family:var(--en);
  font-size:12px;
  font-weight:600;
}
@media(max-width:1199px){
  .admin-experience-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
  .admin-experience-grid{grid-template-columns:1fr;}
}

/* CLIENT LOGO STRIP — restore pre-change 200px height, keep uploaded aspect ratio */
.clients{height:200px!important;}
.clients .client-marquee{
  display:flex!important;
  align-items:center!important;
  gap:0!important;
  width:max-content!important;
}
.clients .client-strip{
  display:block!important;
  flex:0 0 auto!important;
  height:200px!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:left center!important;
  margin:0!important;
}


/* CASE first result: tighten only the first line so it stays inside the pill */
@media (min-width:1200px){
  .case-result-list .case-result:first-child p::first-line{
    letter-spacing:-0.055em !important;
  }
}


/* STRATEGY CARD vertical rhythm — equal gaps across all 4 cards */
@media (min-width:1200px){
  .strategy-card h3{top:126px !important;}
  .strategy-card p{top:194px !important;}
}


/* STRATEGY CARD exact spacing from annotated reference — all 4 cards */
@media (min-width:1200px){
  .strategy-card .mini{left:50px !important;top:95px !important;}
  .strategy-card h3{left:50px !important;top:127px !important;}
  .strategy-card p{left:50px !important;top:175px !important;}
}


/* STRATEGY cards: place Korean title visually between the English label and body copy */
@media (min-width:1200px){
  .strategy-card .mini{left:50px !important;top:95px !important;}
  .strategy-card h3{left:50px !important;top:123px !important;line-height:42px !important;}
  .strategy-card p{left:50px !important;top:180px !important;}
}


/* STRATEGY title micro-adjustment: title down 3px only */
@media (min-width:1200px){
  .strategy-card h3{top:126px !important;}
}


/* PROJECT unified banner + slide-safe media stages */
.project-hero-stage{position:relative;width:1282px;height:723px;overflow:hidden;background:#eee}
.project-hero-stage .project-hero{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.project-sub-grid.project-banner-stage{position:relative;display:block;width:1282px;height:720px;padding-left:0;overflow:hidden;background:#e5e5e8}
.project-banner-stage .project-banner-image,.project-banner-stage .project-banner-placeholder{position:absolute;inset:0;width:100%;height:100%;display:block}
.project-banner-stage .project-banner-image{object-fit:contain;background:#e5e5e8;border:0}
.project-banner-stage .project-banner-placeholder{background:#e5e5e8;border:1px solid #d2d3d8;box-sizing:border-box}
.project-media-stage .project-slide-layer{will-change:transform}
@media(max-width:1199px){.project-hero-stage{width:100%;height:auto;aspect-ratio:1282/723}.project-sub-grid.project-banner-stage{width:100%;height:auto;aspect-ratio:1282/720}}


/* FINAL 2026-10-20: requested responsive/dynamic refinements only */
/* 1) CASE label pill: lock exact horizontal centering inside the CASE board. */
.case-pill{
  left:0 !important;
  right:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  transform:none !important;
  text-align:center !important;
  justify-content:center !important;
}

/* 2) Unified project banner: keep the 1282×720 layout area but show nothing until an image is uploaded. */
.project-sub-grid.project-banner-stage{
  background:transparent !important;
}
.project-banner-stage .project-banner-placeholder{
  background:transparent !important;
  border:0 !important;
}
.project-banner-stage .project-banner-image{
  background:transparent !important;
  object-fit:contain !important;
}

/* 3) Keep the purple diagonal angle stable even when CASE height changes with visible result cards. */
.purple-bg{
  clip-path:polygon(0 6px,100% 308px,100% 100%,0 calc(100% - 305px)) !important;
}

/* 4) On narrower desktop windows, reduce the wide background horizontally while preserving the PSD's vertical alignment. */
@media (min-width:1200px) and (max-width:1919px){
  main{
    background-size:266.6667vw 5122px !important;
  }
}
@media (max-width:1199px){
  .purple-bg{clip-path:none !important;}
}