/* Crespe main3 — the three-act manifesto, then the work as the proof. */
:root{
  --red:#e74655;--cyan:#00b3eb;--purple:#634f9d;
  --red-deep:#5c0d1c;--cyan-deep:#003b55;--purple-deep:#211744;
  --ink:#0e0f11;--ink-2:#18191c;--paper:#f3f1ec;--paper-2:#e8e5de;
  --text:#121316;--muted:#5f626a;--muted-dark:#9b9ea6;
  --line:rgba(18,19,22,.14);--line-dark:rgba(243,241,236,.16);
  --gutter:clamp(20px,4.2vw,72px);
  --hd-h:80px;
  --ease:cubic-bezier(.19,.8,.22,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --font:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html.js{scroll-behavior:smooth}
html.intro-pending{background:#25060f}
html.intro-pending body{visibility:hidden}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--font);font-size:17px;line-height:1.6;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"ss06"}
body.no-scroll{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,p,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
address{font-style:normal}
.nw{white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{width:min(100% - 2 * var(--gutter),1600px);margin-inline:auto}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}
.skip-link{position:fixed;left:16px;top:-80px;z-index:100;background:#fff;color:var(--ink);padding:12px 18px;border-radius:99px;font-weight:600;font-size:14px}
.skip-link:focus{top:16px}
.chev{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--ease)}
.plus{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;transition:transform .5s var(--ease)}
.logo-svg{display:block;width:100%;height:auto}

/* Buttons and text links */
.btn{--bg:var(--ink);--fg:#fff;display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:56px;padding:0 24px 0 28px;border-radius:999px;background:var(--bg);color:var(--fg);font-size:16px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;border:0;cursor:pointer;transition:background .35s,color .35s,transform .35s var(--ease)}
.btn:hover .chev,.tlink:hover .chev{transform:translateX(4px)}
.btn:active{transform:scale(.98)}
.btn-sm{min-height:44px;padding:0 16px 0 20px;font-size:14px;gap:10px}
.btn-sm .chev{width:15px;height:15px}
.btn-light{--bg:#fff;--fg:var(--deep,var(--ink))}
.btn-light:hover{--bg:#f1eee9}
.btn-xl{min-height:80px;padding:0 32px 0 38px;font-size:clamp(18px,1.4vw,21px);gap:28px}
.btn-xl .chev{width:22px;height:22px}
.tlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px;font-weight:650;letter-spacing:-.01em}
.tlink>span{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.tlink:hover>span{background-size:100% 1px}
.tlink .chev{width:16px;height:16px}

/* Header */
.hd{--fg:#fff;--cta-bg:#fff;--cta-fg:var(--red-deep);--bg:transparent;position:fixed;inset:0 0 auto;z-index:50;height:var(--hd-h);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--gutter);color:var(--fg);transition:color .45s,background-color .45s,transform .6s var(--ease),backdrop-filter .45s}
.hd.is-solid{background:var(--bg);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4)}
.hd.is-hidden{transform:translateY(-100%)}
.hd[data-tone=red]{--cta-fg:var(--red-deep)}
.hd[data-tone=cyan]{--cta-fg:var(--cyan-deep)}
.hd[data-tone=purple]{--cta-fg:var(--purple-deep);--bg:rgba(99,79,157,.82)}
.hd[data-tone=ink]{--cta-fg:var(--ink);--bg:rgba(14,15,17,.78)}
.hd[data-tone=paper]{--fg:var(--text);--cta-bg:var(--ink);--cta-fg:#fff;--bg:rgba(243,241,236,.84)}
.hd-logo{width:124px;flex:none}
.hd-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:40px;font-size:15px;font-weight:600;letter-spacing:-.01em}
.hd-nav a{position:relative;padding:8px 0}
.hd-nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.hd-nav a:hover::after{transform:scaleX(1);transform-origin:left}
.hd-actions{display:flex;align-items:center;gap:10px}
.hd-cta{--bg:var(--cta-bg);--fg:var(--cta-fg)}
.hd-menu{display:none;width:44px;height:44px;border:0;background:transparent;padding:0;cursor:pointer;position:relative}
.hd-menu span{position:absolute;left:11px;right:11px;height:1.6px;background:currentColor;border-radius:2px;transition:transform .5s var(--ease)}
.hd-menu span:first-child{top:17px}.hd-menu span:last-child{top:26px}
.menu-open .hd-menu span:first-child{transform:translateY(4.5px) rotate(45deg)}
.menu-open .hd-menu span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.menu-open .hd{--fg:#fff;--cta-bg:#fff;--cta-fg:var(--ink);background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none}
.menu{position:fixed;inset:0;z-index:49;background:var(--ink);color:#f3f1ec;display:flex;flex-direction:column;justify-content:space-between;padding:calc(var(--hd-h) + 28px) var(--gutter) 36px;overflow:auto}
.menu[hidden]{display:none}
.menu-links a{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line-dark);font-size:clamp(30px,8vw,44px);font-weight:700;letter-spacing:-.035em;opacity:0;transform:translateY(24px);transition:opacity .6s,transform .8s var(--ease)}
.menu-links a .chev{width:24px;height:24px}
.menu.is-open .menu-links a{opacity:1;transform:none}
.menu.is-open .menu-links a:nth-child(2){transition-delay:.05s}.menu.is-open .menu-links a:nth-child(3){transition-delay:.1s}.menu.is-open .menu-links a:nth-child(4){transition-delay:.15s}
.menu-foot{display:grid;gap:6px;margin-top:40px;font-size:16px;color:var(--muted-dark)}
.menu-foot a{color:#f3f1ec;font-weight:600}
.menu-foot p{margin-top:14px;font-size:14px}

/* Line reveal */
.ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ln-in{display:block;transform:translateY(108%);transition:transform 1.15s var(--ease);transition-delay:calc(var(--i,0) * 85ms)}
.is-in .ln-in,.no-js .ln-in{transform:none}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s)}
.reveal.is-in,.no-js .reveal{opacity:1;transform:none}

/* Acts */
.acts{position:relative;color:#fff;background:var(--red)}
.acts-backdrop{position:sticky;top:0;height:100vh;height:100svh;margin-bottom:-100vh;margin-bottom:-100svh;overflow:hidden;z-index:0;pointer-events:none}
.no-js .acts-backdrop{display:none}
.bg{position:absolute;inset:0}
.bg-red{background:var(--red)}
.bg-cyan{background:var(--cyan);clip-path:circle(0 at 70% 50%)}
.bg-purple{background:var(--purple);clip-path:circle(0 at 70% 50%)}
.sameness{--cw:15.5vw;--gap:2.2vw;position:absolute;left:-8vw;top:-34vh;display:grid;grid-template-columns:repeat(8,var(--cw));grid-auto-rows:calc(var(--cw) * .7);gap:var(--gap);opacity:0;transform:rotate(-7deg);transition:opacity 2s;-webkit-mask-image:linear-gradient(100deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.35) 30%,#000 62%);mask-image:linear-gradient(100deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.35) 30%,#000 62%)}
.acts.is-ready .sameness{opacity:.2}
.sameness i{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:9% 42% 1fr;gap:8% 6%;padding:6%;border:1px solid #fff;border-radius:6px;animation:sameness 9s linear infinite}
.sameness b{grid-column:1/-1;border-bottom:1px solid #fff}
.sameness u{grid-column:1/-1;background:#fff;opacity:.55;border-radius:2px}
.sameness s{background:#fff;opacity:.35;border-radius:2px}
@keyframes sameness{to{transform:translateY(calc(-1 * (var(--cw) * .7 + var(--gap))))}}
.acts-symbol{position:absolute;right:calc(var(--gutter) - 1vw);top:50%;width:min(66vh,40vw);aspect-ratio:1;transform:translate3d(0,-50%,0) rotate(var(--rot,0deg)) scale(var(--sc,1));will-change:transform}
.acts-symbol .symbol{width:100%;height:100%;overflow:visible;transform:scale(.62) rotate(-50deg);opacity:0;transition:transform 1.8s var(--ease),opacity .7s}
.acts.is-ready .acts-symbol .symbol,.no-js .acts-symbol .symbol{transform:none;opacity:1}
.act{position:relative;z-index:1;height:175vh;height:175svh}
.act-purple{height:150vh;height:150svh}
.act-red{--deep:var(--red-deep)}.act-cyan{--deep:var(--cyan-deep)}.act-purple{--deep:var(--purple-deep)}
.no-js .act{height:auto;min-height:100vh}
.no-js .act-red{background:var(--red)}.no-js .act-cyan{background:var(--cyan)}.no-js .act-purple{background:var(--purple)}
.act-inner{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hd-h) + 24px) var(--gutter) 128px;will-change:opacity}
.no-js .act-inner{position:relative;height:auto;min-height:100vh}
.act-copy{max-width:min(62vw,1080px)}
.act-label{display:flex;align-items:center;gap:14px;margin-bottom:clamp(20px,3vh,36px);font-size:16px;font-weight:650;letter-spacing:-.01em}
.act-no{display:inline-grid;place-items:center;min-width:38px;height:24px;padding:0 9px;border:1px solid rgba(255,255,255,.6);border-radius:99px;font-size:11px;font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.act-title{font-size:clamp(46px,min(7.3vw,13.4vh),148px);line-height:1.06;font-weight:300;letter-spacing:-.045em}
.act-title strong{display:block;font-weight:800;letter-spacing:-.05em}
.act-text,.act-actions{opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease) .45s,transform 1.1s var(--ease) .45s}
.act.is-in .act-text,.act.is-in .act-actions,.no-js .act-text,.no-js .act-actions{opacity:1;transform:none}
.act-text{margin-top:clamp(24px,4vh,44px);font-size:clamp(17px,1.3vw,21px);line-height:1.72;font-weight:500;letter-spacing:-.015em}
.act-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:clamp(26px,4.4vh,48px)}
.act-note{position:absolute;right:var(--gutter);bottom:104px;font-size:14px;line-height:1.7;font-weight:500;text-align:right;opacity:.88}
.acts-bar{position:sticky;bottom:0;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;height:92px;margin-top:-92px;padding:0 var(--gutter) 30px;pointer-events:none}
.acts-bar>*{pointer-events:auto}
.acts-dock{display:flex;gap:28px}
.acts-dock a{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;row-gap:9px;min-width:132px;font-size:13px;opacity:.6;transition:opacity .4s}
.acts-dock a[aria-current=step],.acts-dock a:hover{opacity:1}
.acts-dock span{font-size:11px;font-weight:700;font-variant-numeric:tabular-nums}
.acts-dock b{font-weight:650}
.acts-dock i{grid-column:1/-1;height:2px;background:rgba(255,255,255,.3);overflow:hidden;border-radius:2px}
.acts-dock em{display:block;height:100%;background:#fff;transform:scaleX(var(--p,0));transform-origin:left}
.acts-skip{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:650}

/* Section heads */
.eyebrow{margin-bottom:22px;font-size:16px;font-weight:650;letter-spacing:-.01em;color:var(--muted)}
.sec-title{font-size:clamp(44px,6.2vw,116px);line-height:1.05;font-weight:300;letter-spacing:-.045em}
.sec-title strong{display:block;font-weight:800;letter-spacing:-.05em}

/* Work */
.work{position:relative;z-index:2;background:var(--ink);color:#f3f1ec;padding:clamp(110px,12vw,210px) 0 clamp(70px,8vw,130px)}
.work .eyebrow,.ix .eyebrow{color:var(--muted-dark)}
.work-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:40px;margin-bottom:clamp(64px,8vw,130px)}
.work-aside{display:grid;justify-items:start;gap:22px;padding-bottom:12px;font-size:17px;line-height:1.7;color:#c9cbd0}
.tlink-light{color:#f3f1ec}
.showcase{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(20px,2.4vw,44px);row-gap:clamp(70px,8vw,150px);align-items:start}
.case{min-width:0}
.case-full{grid-column:1/-1}
.case-wide{grid-column:span 7}
.case-narrow{grid-column:span 5}
.case-half{grid-column:span 6}
.case-off{margin-top:clamp(80px,14vw,260px)}
.case-media{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--tone);aspect-ratio:4/3;isolation:isolate}
.case-full .case-media{aspect-ratio:2/1}
.case-narrow .case-media{aspect-ratio:4/5}
.case-half .case-media{aspect-ratio:5/4}
.case-media::after{content:"";position:absolute;inset:0;z-index:2;background:var(--ink);transform-origin:top;transition:transform 1.25s var(--ease-io)}
.case.is-in .case-media::after,.no-js .case-media::after{transform:scaleY(0)}
.case-frame{position:absolute;left:9%;right:9%;top:50%;transform:translateY(-50%)}
.case-full .case-frame{left:50%;right:auto;width:min(66%,1100px);transform:translate(-50%,-50%)}
.case-narrow .case-frame{left:11%;right:auto;top:15%;width:165%;transform:none}
.case-frame img{width:100%;height:auto;border-radius:4px;box-shadow:0 40px 80px -30px rgba(0,0,0,.5),0 10px 24px -12px rgba(0,0,0,.35);transform:translate3d(0,var(--py,0px),0) scale(var(--hs,1));transition:transform .9s var(--ease)}
.case.is-in .case-frame img{--hs:1}
.case .case-frame img{--hs:1.08}
.case.is-in .case-media:hover .case-frame img{--hs:1.035}
.case-phones{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:5%;padding:0 6%}
.phone{flex:0 0 43%;aspect-ratio:390/844;overflow:hidden;border:clamp(4px,.42vw,7px) solid #111214;border-radius:clamp(18px,2vw,32px);background:#fff;box-shadow:0 40px 70px -28px rgba(0,0,0,.55),0 8px 20px -10px rgba(0,0,0,.35);translate:0 calc(var(--py,0px) * .5 - 5%);transition:translate .9s var(--ease),scale .9s var(--ease)}
.phone+.phone{translate:0 calc(var(--py,0px) * 1.3 + 7%)}
.phone img{width:100%;height:100%;object-fit:cover;object-position:top}
.case.is-in .case-media:hover .phone{scale:1.03}
.case-fill .case-frame{inset:0;width:auto;transform:none}
.case-fill .case-frame img{width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none}
.case-meta{display:grid;grid-template-columns:1fr auto;align-items:start;gap:6px 24px;margin-top:24px}
.case-meta h3{font-size:clamp(22px,1.8vw,30px);font-weight:700;letter-spacing:-.03em;line-height:1.3}
.case-meta h3 a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .5s var(--ease)}
.case-meta h3 a:hover{background-size:100% 1.5px}
.case-desc{grid-column:1;font-size:16px;line-height:1.6;color:#b4b7bd}
.case-tags{grid-column:2;grid-row:1/span 2;display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding-top:6px;font-size:13px;color:var(--muted-dark);text-align:right}
.case-more{grid-column:span 7;margin-top:clamp(80px,14vw,260px);position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:4/3;padding:clamp(28px,3.4vw,56px);border-radius:6px;background:var(--red);color:#fff;overflow:hidden;transition:background .5s}
.case-more:hover{background:var(--purple)}
.case-more-count{font-size:clamp(84px,10vw,190px);font-weight:800;line-height:.9;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.case-more-count>span{display:inline-block}
.case-more-text{font-size:clamp(26px,2.6vw,46px);font-weight:700;line-height:1.2;letter-spacing:-.035em}
.case-more-go{position:absolute;right:clamp(28px,3.4vw,56px);bottom:clamp(28px,3.4vw,56px);display:grid;place-items:center;width:clamp(64px,6vw,96px);aspect-ratio:1;border-radius:50%;background:#fff;color:var(--red-deep);transition:transform .6s var(--ease),color .5s}
.case-more:hover .case-more-go{transform:translateX(8px);color:var(--purple-deep)}
.case-more-go .chev{width:40%;height:40%}

/* Cursor bubble and index preview, pointer devices only */
.view-cursor,.ix-preview{position:fixed;left:0;top:0;z-index:45;pointer-events:none;display:none}
@media (hover:hover) and (pointer:fine){
  .view-cursor{display:grid;place-items:center;width:104px;height:104px;margin:-52px 0 0 -52px;border-radius:50%;background:#fff;color:var(--ink);font-size:15px;font-weight:700;letter-spacing:-.01em;transform:translate3d(var(--x,-200px),var(--y,-200px),0) scale(0);transition:transform .45s var(--ease)}
  .view-cursor.is-on{transform:translate3d(var(--x),var(--y),0) scale(1)}
  [data-cursor=view]{cursor:none}
  .ix-preview{display:block;width:min(30vw,420px);aspect-ratio:16/10;margin:-130px 0 0 34px;border-radius:6px;overflow:hidden;opacity:0;transform:translate3d(var(--x,-500px),var(--y,-500px),0) scale(.86) rotate(-3deg);transition:opacity .3s,transform .55s var(--ease);box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
  .ix-preview.is-on{opacity:1;transform:translate3d(var(--x),var(--y),0) scale(1) rotate(0)}
  .ix-preview img{width:100%;height:100%;object-fit:cover;object-position:top}
}

/* Index */
.ix{position:relative;z-index:2;background:var(--ink);color:#f3f1ec;padding:clamp(60px,6vw,110px) 0 clamp(110px,12vw,200px)}
.ix-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:32px;padding-top:clamp(56px,6vw,96px);border-top:1px solid var(--line-dark);margin-bottom:clamp(40px,4vw,64px)}
.ix-title{font-size:clamp(34px,4.4vw,80px);line-height:1.1;font-weight:700;letter-spacing:-.045em}
.ix-title .ln+.ln .ln-in{font-weight:300}
.ix-filter{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;max-width:640px}
.ix-filter button{display:inline-flex;align-items:flex-start;gap:4px;min-height:42px;padding:10px 16px;border:1px solid var(--line-dark);border-radius:99px;background:transparent;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.ix-filter button:hover{border-color:#f3f1ec}
.ix-filter button[aria-pressed=true]{background:#f3f1ec;color:var(--ink);border-color:#f3f1ec}
.ix-filter sup{font-size:10px;font-weight:700;opacity:.7;line-height:1;margin-top:1px}
.ix-cols,.ix-list a{display:grid;grid-template-columns:96px minmax(0,1.5fr) minmax(0,1fr) minmax(0,.7fr) 24px;align-items:center;gap:24px}
.ix-cols{padding:0 0 14px;border-bottom:1px solid var(--line-dark);font-size:12px;font-weight:600;color:var(--muted-dark)}
.ix-list li{border-bottom:1px solid var(--line-dark)}
.ix-list li[hidden]{display:none}
.ix-list a{position:relative;padding:22px 0;transition:padding .55s var(--ease),color .3s}
.ix-list a::before{content:"";position:absolute;inset:0 calc(-1 * var(--gutter));z-index:-1;background:#f3f1ec;transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease)}
.ix-list a:hover,.ix-list a:focus-visible{color:var(--ink);padding-left:18px}
.ix-list a:hover::before,.ix-list a:focus-visible::before{transform:scaleY(1)}
.ix-list{position:relative;z-index:0}
.ix-year{font-size:14px;color:var(--muted-dark);font-variant-numeric:tabular-nums;transition:color .3s}
.ix-list a:hover .ix-year,.ix-list a:hover .ix-type,.ix-list a:hover .ix-group{color:#4c4f56}
.ix-name{display:flex;align-items:center;gap:16px;font-size:clamp(19px,1.55vw,26px);font-weight:650;letter-spacing:-.03em;line-height:1.3}
.ix-name img{display:none}
.ix-type,.ix-group{font-size:15px;color:#b4b7bd;transition:color .3s}
.ix-list .chev{opacity:.5;transition:opacity .3s,transform .45s var(--ease)}
.ix-list a:hover .chev{opacity:1;transform:translateX(4px)}
.ix-list li.is-extra{display:none}
.ix-list.is-open li.is-extra:not([hidden]){display:block}
.ix-more{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:72px;margin-top:-1px;border:0;border-bottom:1px solid var(--line-dark);background:transparent;color:#f3f1ec;font-size:16px;font-weight:650;cursor:pointer;transition:background .3s}
.ix-more:hover{background:var(--ink-2)}
.ix-more[hidden]{display:none}
.ix-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-top:clamp(48px,5vw,80px)}
.ix-foot p{font-size:17px;line-height:1.7;color:#b4b7bd}
.ix-foot .btn{--deep:var(--ink)}

/* Approach */
.approach,.scope,.faq{position:relative;z-index:2;background:var(--paper);color:var(--text)}
.approach{padding:clamp(110px,12vw,210px) 0 clamp(80px,9vw,150px)}
.approach .sec-title strong{color:var(--red)}
.clock{margin-top:clamp(56px,6vw,100px)}
.clock-value{display:flex;align-items:baseline;font-size:clamp(120px,21vw,400px);font-weight:750;line-height:.86;letter-spacing:-.055em;font-variant-numeric:tabular-nums;transform-origin:left bottom;transition:color .4s}
.clock-fraction{font-size:.5em;letter-spacing:-.04em}
.clock-value small{font-size:.13em;font-weight:650;letter-spacing:-.02em;margin-left:.3em}
.clock.has-three .clock-value{color:var(--red)}
.clock.pulse .clock-value{animation:clock-pulse .8s var(--ease)}
@keyframes clock-pulse{40%{transform:scale(1.035)}}
.clock-track{position:relative;height:64px;margin-top:clamp(20px,2vw,32px);border-top:1px solid var(--line)}
.clock-fill{position:absolute;left:0;right:0;top:-2px;height:3px;background:var(--red);transform:scaleX(var(--p,0));transform-origin:left}
.clock-tick{position:absolute;top:0;left:calc(var(--s) / 7 * 100%);height:12px;border-left:1px solid var(--line)}
.clock-tick b{position:absolute;top:18px;left:0;transform:translateX(-50%);font-size:13px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.clock-tick b::after{content:"초"}
.clock-tick:first-child b{transform:none}
.clock-tick:last-child b{transform:translateX(-100%)}
.clock-tick.is-key{height:20px;border-left:2px solid var(--text)}
.clock-tick.is-key b{color:var(--text);font-weight:750}
.clock.is-static .clock-fraction{display:none}
.clock-note{margin-top:clamp(28px,3vw,48px);font-size:clamp(20px,1.9vw,30px);line-height:1.55;font-weight:550;letter-spacing:-.03em}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,56px);margin-top:clamp(90px,10vw,170px)}
.step{padding-top:28px;border-top:1px solid var(--text)}
.step-kicker{font-size:15px;font-weight:700;color:var(--red);letter-spacing:-.01em}
.step h3{margin-top:14px;font-size:clamp(28px,2.6vw,44px);line-height:1.2;font-weight:750;letter-spacing:-.04em}
.step>p:not(.step-kicker){margin-top:16px;font-size:17px;line-height:1.7;color:var(--muted)}
.step-shot{margin-top:32px;overflow:hidden;border-radius:6px;background:var(--paper-2)}
.step-shot img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;transition:transform 1.2s var(--ease)}
.step:hover .step-shot img{transform:scale(1.03)}
.step-shot figcaption{padding:14px 16px;font-size:13px;color:var(--muted);background:var(--paper-2)}

/* Scope */
.scope{padding:clamp(80px,9vw,150px) 0}
.scope-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,120px);align-items:start;padding-top:clamp(56px,6vw,96px);border-top:1px solid var(--line)}
.scope-side{position:sticky;top:calc(var(--hd-h) + 32px)}
.scope-stage{position:relative;margin-top:clamp(36px,4vw,60px);aspect-ratio:16/10;border-radius:6px;overflow:hidden;background:var(--paper-2)}
.scope-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transform:scale(1.06);transition:opacity .6s,transform 1.2s var(--ease)}
.scope-stage img.is-on{opacity:1;transform:none}
.scope-list{border-bottom:1px solid var(--line)}
.scope-list li{border-top:1px solid var(--line);padding:clamp(22px,2.4vw,34px) 0}
.scope-list h3 a{display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:clamp(28px,3.1vw,54px);line-height:1.15;font-weight:750;letter-spacing:-.04em;color:#a3a5ab;transition:color .45s}
.scope-list li.is-on h3 a,.scope-list h3 a:hover{color:var(--text)}
.scope-list h3 .chev{width:clamp(44px,3.6vw,60px);height:clamp(44px,3.6vw,60px);padding:clamp(12px,1vw,17px);border:1px solid currentColor;border-radius:50%;stroke-width:1.5}
.scope-list li.is-on h3 .chev{background:var(--text);color:var(--paper);border-color:var(--text)}
.scope-desc{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .6s var(--ease),opacity .5s}
.scope-desc>p{min-height:0;overflow:hidden;font-size:17px;line-height:1.7;color:var(--muted)}
.scope-desc>p::before{content:"";display:block;height:18px}
.scope-list li.is-on .scope-desc,.no-js .scope-desc{grid-template-rows:1fr;opacity:1}

/* FAQ */
.faq{padding:clamp(80px,9vw,150px) 0 clamp(110px,12vw,200px)}
.faq-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,120px);padding-top:clamp(56px,6vw,96px);border-top:1px solid var(--line)}
.faq .sec-title{font-size:clamp(40px,4.6vw,84px)}
.faq-links{display:grid;justify-items:start;gap:2px;margin-top:40px}
.faq-list{border-bottom:1px solid var(--line)}
.faq-list details{border-top:1px solid var(--line)}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 0;font-size:clamp(19px,1.6vw,25px);font-weight:650;letter-spacing:-.03em;line-height:1.4;cursor:pointer;list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:hover .plus{transform:rotate(90deg)}
.faq-list details[open] .plus{transform:rotate(45deg)}
.faq-a{padding:0 48px 32px 0;font-size:17px;line-height:1.75;color:var(--muted)}
.faq-list details[open] .faq-a{animation:faq-open .6s var(--ease)}
@keyframes faq-open{from{opacity:0;transform:translateY(-8px)}}

/* Contact */
.contact{position:relative;z-index:2;overflow:hidden;background:var(--purple);color:#fff;padding:clamp(110px,12vw,210px) 0 clamp(90px,10vw,170px);--deep:var(--purple-deep)}
.contact .eyebrow{color:#d8d1f0}
.contact-symbol{position:absolute;right:-9vw;top:clamp(-40px,-3vw,0px);width:min(42vw,760px);aspect-ratio:1;transform:translate3d(0,var(--dy,0px),0) rotate(var(--dr,0deg))}
.contact-symbol .symbol{width:100%;height:100%;overflow:visible}
.contact .wrap{position:relative}
.contact-title{font-size:clamp(52px,8.4vw,164px);line-height:1.03;font-weight:300;letter-spacing:-.045em}
.contact-title strong{display:block;font-weight:800;letter-spacing:-.05em}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end;margin-top:clamp(56px,7vw,120px)}
.contact-lead{font-size:clamp(20px,1.8vw,28px);line-height:1.6;letter-spacing:-.03em;font-weight:500}
.contact-lead strong{font-weight:750}
.contact-caution{margin-top:28px;font-size:17px;line-height:1.75;color:#ddd7f1}
.contact-act{display:grid;justify-items:start;gap:16px;justify-self:end;max-width:560px;width:100%}
.contact-act .btn-xl{width:100%;justify-content:space-between}
.contact-act .btn-xl .chev{animation:nudge 3.2s var(--ease) infinite}
@keyframes nudge{0%,70%,100%{transform:none}80%{transform:translateX(7px)}90%{transform:translateX(0)}}
.contact-hint{font-size:14px;color:#ddd7f1}
.contact-direct{display:grid;gap:4px;margin-top:28px;width:100%;padding-top:24px;border-top:1px solid rgba(255,255,255,.28)}
.roll{display:inline-block;overflow:hidden;height:1.3em;font-size:clamp(24px,2.3vw,40px);font-weight:650;letter-spacing:-.03em;line-height:1.3}
.roll span{display:block;position:relative;transition:transform .6s var(--ease)}
.roll span::after{content:attr(data-text);position:absolute;left:0;top:100%;color:#ffd6dc}
.roll:hover span,.roll:focus-visible span{transform:translateY(-100%)}

/* Footer */
.ft{position:relative;z-index:2;background:var(--ink);color:#c9cbd0;padding:clamp(70px,7vw,110px) 0 40px;font-size:15px}
.ft-top{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:clamp(40px,4vw,64px);border-bottom:1px solid var(--line-dark)}
.ft-logo{width:150px;color:#f3f1ec}
.ft-clock{font-size:14px;color:var(--muted-dark)}
.ft-time{margin-left:10px;color:#f3f1ec;font-weight:650;font-variant-numeric:tabular-nums}
.ft-cols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;padding:clamp(36px,3.4vw,56px) 0}
.ft-cols address{line-height:1.7}
.ft-links{display:grid;justify-items:start;gap:8px}
.ft-links a:hover{color:#fff}
.ft-copy{font-size:13px;color:var(--muted-dark)}

/* Intro */
.intro{--ready:1;position:fixed;inset:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;border:0;padding:30px var(--gutter);background:#25060f;color:#fff4f6;overflow:hidden;font-family:var(--font)}
.intro[open]{display:flex;flex-direction:column}
.intro::backdrop{background:#25060f}
body.intro-playing{overflow:hidden}
.intro-top{display:flex;align-items:center;justify-content:space-between;gap:24px}
.intro-logo{width:124px;color:#fff4f6}
.intro-skip{display:inline-flex;align-items:center;gap:12px;min-height:46px;padding:0 18px 0 22px;border:1px solid rgba(255,244,246,.35);border-radius:99px;background:transparent;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s}
.intro-skip:hover{background:rgba(255,244,246,.08)}
.intro-skip .chev{width:16px;height:16px}
.intro-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-bottom:40px}
.intro-kicker{font-size:16px;font-weight:600;color:#e7a9b6;margin-bottom:14px}
.intro-clock{display:flex;align-items:baseline;font-size:clamp(150px,24vw,360px);font-weight:700;line-height:1;letter-spacing:-.055em;font-variant-numeric:tabular-nums;transition:color .3s,transform .6s var(--ease)}
.intro-fraction{font-size:.52em;letter-spacing:-.035em;min-width:1.5em;text-align:left}
.intro-unit{font-size:clamp(20px,2.6vw,38px);font-weight:600;margin-left:.3em;letter-spacing:-.03em}
.intro-copy{display:grid;justify-items:center;margin-top:30px;min-height:2.7em;font-size:clamp(30px,5vw,76px)}
.intro-copy>*{grid-area:1/1}
.intro-premise{font-size:clamp(21px,2.9vw,40px);line-height:1.55;font-weight:450;letter-spacing:-.03em;transition:opacity .25s,transform .4s var(--ease)}
.intro-outcome{line-height:1.2;font-weight:400;letter-spacing:-.05em;opacity:0;transform:translateY(24px);transition:opacity .4s,transform .7s var(--ease)}
.intro-outcome span,.intro-outcome strong{display:block;white-space:nowrap}
.intro-outcome strong{font-weight:800;color:#ff7085}
.intro.is-expired .intro-clock{color:#ff7085;transform:scale(.86)}
.intro.is-expired .intro-premise{opacity:0;transform:translateY(-14px)}
.intro.is-expired .intro-outcome{opacity:1;transform:none;transition-delay:.14s}
.intro-thoughts{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.thought{position:absolute;left:var(--x);top:var(--y);padding:12px 20px 13px;border-radius:24px 24px 24px 6px;background:#fff1f3;color:#4c0a19;font-size:clamp(15px,1.2vw,19px);font-weight:650;letter-spacing:-.02em;line-height:1.35;white-space:nowrap;box-shadow:0 14px 34px -14px rgba(0,0,0,.6);opacity:0;transform:scale(0) rotate(var(--r));transform-origin:0 100%}
.thought.is-r{border-radius:24px 24px 6px 24px;transform-origin:100% 100%}
.thought.alt{background:rgba(255,241,243,.06);color:#ffd5dc;box-shadow:inset 0 0 0 1px rgba(255,213,220,.45)}
.thought.is-on{animation:thought-pop .6s cubic-bezier(.34,1.7,.5,1) forwards}
.intro.is-expired .thought.is-on{animation:thought-burst .2s cubic-bezier(.5,0,.75,0) forwards}
@keyframes thought-pop{0%{opacity:0;transform:scale(0) rotate(var(--r))}35%{opacity:1}100%{opacity:1;transform:scale(1) rotate(var(--r))}}
@keyframes thought-burst{0%{opacity:1;transform:scale(1) rotate(var(--r))}100%{opacity:0;transform:scale(1.3) rotate(var(--r))}}
.intro-track{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,244,246,.12)}
.intro-track span{display:block;height:100%;background:#ff7085;transform:scaleX(var(--progress,1));transform-origin:left}
.intro.is-leaving{clip-path:circle(0% at var(--ox,70%) var(--oy,50%));transition:clip-path .9s var(--ease-io)}
.intro{clip-path:circle(150% at var(--ox,70%) var(--oy,50%))}
.intro.is-leaving::backdrop{background:transparent}

/* Responsive */
@media (max-width:1180px){
  .hd-nav{gap:28px}
  .act-copy{max-width:66vw}
}
@media (max-width:960px){
  :root{--hd-h:68px}
  .hd-nav{display:none}
  .hd-menu{display:block}
  .hd-logo{width:108px}
  .acts-symbol{top:auto;bottom:max(96px,11svh);right:-14vw;width:min(62vw,50svh);transform:translate3d(0,0,0) rotate(var(--rot,0deg)) scale(var(--sc,1))}
  .sameness{--cw:30vw;--gap:4vw;grid-template-columns:repeat(5,var(--cw))}
  .act-inner{justify-content:flex-start;padding:calc(var(--hd-h) + 7svh) var(--gutter) 120px}
  .act-copy{max-width:none}
  .act-title{font-size:clamp(40px,10.6vw,84px)}
  .act-note{display:none}
  .acts-dock{gap:18px;flex:1}
  .acts-dock a{min-width:0;flex:1}
  .acts-skip{display:none}
  .work-head,.ix-head{grid-template-columns:1fr}
  .ix-filter{justify-content:flex-start}
  .showcase{grid-template-columns:1fr;row-gap:72px}
  .case-full,.case-wide,.case-narrow,.case-half,.case-more{grid-column:1/-1}
  .case-off,.case-more{margin-top:0}
  .case-full .case-media,.case-wide .case-media,.case-half .case-media{aspect-ratio:4/3}
  .case-full .case-frame{width:84%}
  .case-narrow .case-media{aspect-ratio:4/4.4}
  .ix-cols{display:none}
  .ix-list a{grid-template-columns:minmax(0,1fr) 20px;gap:4px 16px;padding:16px 0}
  .ix-year,.ix-group{display:none}
  .ix-name{grid-column:1}
  .ix-name img{display:block;flex:none;width:76px;height:52px;object-fit:cover;object-position:top;border-radius:4px;background:var(--ink-2)}
  .ix-type{grid-column:1;padding-left:92px;font-size:13px;margin-top:-4px}
  .ix-list .chev{grid-column:2;grid-row:1/span 2}
  .ix-foot{flex-direction:column;align-items:flex-start}
  .steps{grid-template-columns:1fr;gap:64px}
  .scope-grid,.faq-grid{grid-template-columns:1fr}
  .scope-side{position:static}
  .scope-stage{display:none}
  .scope-desc{grid-template-rows:1fr;opacity:1}
  .scope-desc>p::before{height:12px}
  .scope-list h3 a{color:var(--text)}
  .scope-list li.is-on h3 .chev{background:transparent;color:inherit}
  .contact-grid{grid-template-columns:1fr}
  .contact-act{justify-self:stretch;max-width:none}
  .contact-symbol{width:72vw;right:-30vw;top:24px}
  .ft-cols{grid-template-columns:1fr 1fr}
  .ft-cols address{grid-column:1/-1}
}
@media (max-width:560px){
  body{font-size:16px}
  .btn{min-height:52px;font-size:15px;padding:0 20px 0 22px}
  .btn-sm{min-height:40px;font-size:13px;padding:0 13px 0 16px;gap:6px}
  .hd-actions{gap:4px}
  .act-label{font-size:14px;margin-bottom:18px}
  .act-title{font-size:clamp(36px,11.2vw,52px);line-height:1.1}
  .act-text{font-size:16px;line-height:1.7;margin-top:22px}
  .act-actions{flex-direction:column;align-items:flex-start;gap:4px;margin-top:24px}
  .acts-bar{height:78px;margin-top:-78px;padding-bottom:22px}
  .acts-dock{gap:12px}
  .acts-dock a{font-size:12px;column-gap:6px}
  .acts-dock span{font-size:10px}
  .acts-symbol{width:min(58vw,40svh);right:-12vw;bottom:max(84px,10svh)}
  .eyebrow{font-size:14px;margin-bottom:16px}
  .sec-title{font-size:clamp(38px,11vw,54px)}
  .work-aside{font-size:16px}
  .case-meta{grid-template-columns:1fr}
  .case-tags{grid-column:1;grid-row:auto;flex-direction:row;gap:12px;padding-top:2px}
  .case-more{aspect-ratio:auto;min-height:300px;gap:40px}
  .ix-title{font-size:clamp(30px,8.6vw,44px)}
  .ix-filter button{min-height:38px;padding:8px 13px;font-size:13px}
  .ix-name{font-size:17px;gap:14px}
  .ix-name img{width:64px;height:44px}
  .ix-type{padding-left:78px}
  .clock-value{font-size:clamp(96px,30vw,150px)}
  .clock-tick b{font-size:11px}
  .clock-tick:not(.is-key):not(:first-child) b{display:none}
  .clock-note{font-size:19px}
  .step h3{font-size:28px}
  .scope-list h3 a{font-size:26px}
  .scope-list h3 .chev{width:40px;height:40px;padding:11px}
  .faq-list summary{font-size:18px;padding:22px 0}
  .faq-a{padding-right:0}
  .contact-title{font-size:clamp(46px,13.4vw,70px)}
  .contact-lead{font-size:19px}
  .contact-caution{font-size:16px}
  .btn-xl{min-height:68px;font-size:17px;padding:0 24px 0 26px}
  .roll{font-size:24px}
  .ft-top{flex-direction:column;align-items:flex-start}
  .ft-cols{grid-template-columns:1fr}
  .intro{padding:20px}
  .thought{left:var(--mx);top:var(--my);font-size:14px;padding:9px 14px 10px}
  .thought.dt{display:none}
  .intro-logo{width:104px}
  .intro-clock{font-size:clamp(120px,36vw,190px)}
  .intro-copy{font-size:clamp(28px,8vw,36px)}
  .intro-premise{font-size:20px}
}
@media (max-width:360px){
  .hd-logo{width:92px}
  .act-title{font-size:34px}
  .acts-dock b{display:none}
}
@media (max-height:620px) and (min-width:961px){
  .act-title{font-size:clamp(40px,11vh,90px)}
  .act-text{font-size:16px;margin-top:18px}
  .act-actions{margin-top:20px}
  .act-note{display:none}
}
@media (prefers-reduced-motion:reduce){
  html.js{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
  .sameness i{animation:none}
}