@charset "utf-8";

:root{
  --aha-ink:#111111;
  --aha-muted:#777777;
  --aha-line:#e3e3e3;
  --aha-paper:#ffffff;
  --aha-soft:#f4f4f2;
  --aha-accent:var(--aha-primary);
  --aha-backdrop:rgba(9,8,12,.82);
}

.aha-work,.aha-project{box-sizing:border-box;width:min(100% - 64px,1540px);margin:0 auto;color:var(--aha-ink);font-family:var(--aha-font-sans);word-break:keep-all}
.aha-work{padding:104px 0 120px}
.aha-work *,.aha-project *{box-sizing:border-box}
.aha-work a,.aha-project a{color:inherit;text-decoration:none}
.aha-eyebrow{margin:0 0 18px;color:var(--aha-accent);font-size:11px;font-weight:700;letter-spacing:.16em}
.sound_only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* LIST */
.aha-work__head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);align-items:end;gap:40px;padding:0 0 52px;border-bottom:1px solid var(--aha-ink)}
.aha-work__head .aha-eyebrow{grid-column:1/-1}
.aha-work__head h1{margin:0;font-size:clamp(42px,5.2vw,76px);font-weight:600;line-height:1;letter-spacing:-.055em}
.aha-work__intro{justify-self:end;max-width:470px;margin:0;color:#666;font-size:16px;line-height:1.75}

.aha-filter{padding:28px 0 58px}
.aha-filter ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.aha-filter li{margin:0}
.aha-filter a{display:block;padding:10px 16px;border:1px solid var(--aha-line);border-radius:999px;background:var(--aha-paper);color:#666;font-size:13px;line-height:1;transition:border-color .2s,background .2s,color .2s}
.aha-filter a:hover,.aha-filter #bo_cate_on{border-color:var(--aha-ink);background:var(--aha-ink);color:#fff}

.aha-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:72px 24px}
.aha-card{position:relative;min-width:0}
.aha-card__link{display:block}
.aha-card__visual{position:relative;overflow:hidden;aspect-ratio:4/3;margin:0;border-radius:2px;background:#ececec}
.aha-card__visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .35s ease}
.aha-card__overlay{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-between;padding:22px;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.6));color:#fff;font-size:11px;font-weight:700;letter-spacing:.13em;opacity:0;transition:opacity .28s ease}
.aha-card__arrow{display:grid;width:38px;height:38px;place-items:center;border:1px solid rgba(255,255,255,.45);border-radius:50%;font-size:16px;transition:transform .25s ease}
.aha-card:hover .aha-card__visual img{transform:scale(1.025)}
.aha-card:hover .aha-card__overlay{opacity:1}
.aha-card:hover .aha-card__arrow{transform:rotate(45deg)}
.aha-card__empty{display:grid;height:100%;place-items:center;color:#aaa;font-size:12px;letter-spacing:.18em}
.aha-card__body{padding-top:18px}
.aha-card__meta{display:flex;justify-content:space-between;margin-bottom:11px;color:var(--aha-muted);font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.aha-card h2{margin:0;font-size:22px;font-weight:600;line-height:1.35;letter-spacing:-.035em}
.aha-card__body p{margin:9px 0 0;color:#777;font-size:13px;line-height:1.65}
.aha-card__check{position:absolute;z-index:3;top:12px;left:12px;padding:7px;background:#fff;border-radius:50%}
.aha-card__check input{display:block;margin:0}
.aha-empty{grid-column:1/-1;padding:100px 0;text-align:center;color:#888}

.aha-pagination{margin-top:82px;text-align:center}
.aha-pagination .pg_wrap{display:inline-block}
.aha-pagination .pg_page,.aha-pagination .pg_current{display:inline-grid;min-width:38px;height:38px;margin:0 3px;place-items:center;border:0;border-radius:50%;background:transparent;color:#777}
.aha-pagination .pg_current{background:var(--aha-ink);color:#fff}
.aha-admin-select{margin:0 0 18px;color:#777;font-size:12px}
.aha-admin{display:flex;justify-content:flex-end;gap:6px;margin-top:32px}
.aha-admin a,.aha-admin button{padding:8px 11px;border:1px solid #ddd;background:#fff;color:#777;font:11px/1.2 inherit;cursor:pointer}
.aha-admin a:hover,.aha-admin button:hover{border-color:var(--aha-primary);color:var(--aha-primary)}

/* DETAIL - direct URL + layer modal share the same semantic markup */
.aha-project{padding:48px 0 112px}
.aha-board-view-hero-stage--project + .aha-project:not(.aha-project--modal){width:min(1660px,calc(100% - 64px))}
@media (min-width:769px) and (max-width:1100px){.aha-board-view-hero-stage--project + .aha-project:not(.aha-project--modal){width:calc(100% - 48px)}}
.aha-project>.aha-eyebrow{margin-bottom:28px}
.aha-detail{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(360px,1fr);align-items:start;gap:56px;background:transparent}
.aha-project:not(.aha-project--modal) .aha-detail{grid-template-columns:minmax(0,1fr) minmax(280px,320px);gap:48px}
.aha-detail__visual{min-width:0;background:transparent}
.aha-detail__gallery{margin:0;padding:0}
.aha-detail__figure{display:grid;margin:0;place-items:center;overflow:hidden;background:#f1f1ef}
.aha-detail__figure+ .aha-detail__figure{margin-top:32px}
.aha-detail__figure:first-child{max-height:none;aspect-ratio:auto}
.aha-detail__figure img{display:block;width:100%;max-width:100%;height:auto;max-height:660px;margin:0 auto;object-fit:contain}
.aha-detail__figure:first-child img{height:auto;max-height:none}
.aha-detail__figure video{display:block;width:100%;height:auto;max-height:660px;margin:0 auto;background:#111;object-fit:contain}
.aha-detail__noimage{display:grid;min-height:300px;place-items:center;background:#efefed;color:#96939b;font-size:12px;font-weight:700;letter-spacing:.2em}

.aha-detail__story{width:100%;max-width:1400px;margin:96px auto 0;padding:0;background:transparent;text-align:center}
.aha-detail__story h2{margin:0 0 30px;font-size:clamp(36px,3vw,42px);font-weight:600;line-height:1.15;letter-spacing:-.045em}
.aha-detail__prose{width:100%;max-width:none;margin:0;color:#34303a;font-size:18px;line-height:1.82;text-align:left}
.aha-detail__prose>:first-child{margin-top:0}
.aha-detail__prose>:last-child{margin-bottom:0}
.aha-detail__prose p{margin:0 0 1.25em}
.aha-detail__prose img,.aha-detail__prose figure img{display:block;float:none!important;width:100%!important;max-width:100%!important;height:auto!important;margin-right:0;margin-left:0}
.aha-detail__prose h2,.aha-detail__prose h3{margin:2em 0 .65em;letter-spacing:-.03em}

.aha-detail__info{position:relative;align-self:stretch;min-width:0;background:transparent}
.aha-detail__info-inner{position:sticky;top:100px;padding:8px 0 24px}
.aha-detail__topline{display:flex;align-items:center;gap:20px;margin-bottom:22px}
.aha-detail__category{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;background:var(--aha-primary-soft);color:var(--aha-accent);font-size:11px;font-weight:700}
.aha-detail__info h1{margin:0;font-size:clamp(42px,3.4vw,50px);font-weight:650;line-height:1.12;letter-spacing:-.05em}
.aha-detail__rule{display:block;width:36px;height:2px;margin:30px 0;background:var(--aha-accent)}
.aha-detail__summary{margin:0;color:#444;font-size:17px;line-height:1.75}
.aha-detail__meta{display:grid;gap:0;margin:36px 0 0}
.aha-detail__meta div{display:grid;grid-template-columns:92px 1fr;gap:14px;padding:14px 0;border-top:1px solid #eee}
.aha-detail__meta div:last-child{border-bottom:1px solid #eee}
.aha-detail__meta dt{color:var(--aha-primary);font-size:14px;font-weight:800;letter-spacing:.08em}
.aha-detail__meta dd{margin:0;color:#333;font-size:16px;font-weight:500;line-height:1.6}
.aha-detail__list-button{display:inline-flex!important;align-items:center;justify-content:center;width:auto;min-width:0;height:42px;margin-top:28px;padding:0 18px;box-sizing:border-box;border:1px solid #c9c5ce;border-radius:6px;background:transparent;color:#5f5a66!important;font-size:13px;font-weight:600;line-height:1;white-space:nowrap;transition:background .2s ease,border-color .2s ease,color .2s ease}
.aha-detail__list-button:hover{border-color:var(--aha-primary);background:var(--aha-primary-soft);color:var(--aha-primary)!important}
.aha-detail__visit{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;width:auto;height:42px;margin-top:28px;padding:0 20px;border:1px solid var(--aha-primary);border-radius:6px;background:var(--aha-primary);color:#fff!important;font-size:14px;font-weight:700;line-height:1;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.aha-detail__visit:hover{border-color:var(--aha-primary-hover);background:var(--aha-primary-hover);transform:translateY(-2px)}
.aha-project>.aha-detail__admin{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:48px}
.aha-project>.aha-detail__admin a{display:inline-flex;align-items:center;justify-content:center;min-width:100px;height:46px;padding:0 20px;box-sizing:border-box;border:1px solid var(--aha-line);border-radius:6px;background:#fff;color:#333!important;font-size:15px;font-weight:700;line-height:1;white-space:nowrap;transition:border-color .2s ease,color .2s ease}
.aha-project>.aha-detail__admin a:hover{border-color:var(--aha-primary);color:var(--aha-primary)!important}
.aha-detail__info .aha-detail__admin{display:flex;flex-wrap:wrap;gap:5px;margin-top:20px}
.aha-detail__info .aha-detail__admin a{padding:7px 9px;border:1px solid #ddd;color:#777!important;font-size:10px}

/* LAYER POPUP */
html.aha-modal-open,body.aha-modal-open{overflow:hidden!important}
.aha-modal[hidden]{display:none!important}
.aha-modal{position:fixed;z-index:99999;inset:0;display:grid;place-items:center;padding:34px;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease}
.aha-modal.is-open{opacity:1;visibility:visible}
.aha-modal__backdrop{position:absolute;inset:0;background:var(--aha-backdrop);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.aha-modal__dialog{position:relative;z-index:1;width:min(1320px,calc(100vw - 68px));height:min(880px,calc(100vh - 68px));overflow:auto;border-radius:22px;background:#fff;box-shadow:0 28px 80px rgba(0,0,0,.35);transform:translateY(12px) scale(.992);transition:transform .28s cubic-bezier(.2,.7,.2,1);overscroll-behavior:contain}
.aha-modal.is-open .aha-modal__dialog{transform:none}
.aha-modal__content{min-height:100%}
.aha-modal__loading{position:absolute;z-index:3;inset:0;display:grid;place-items:center;background:#fff;color:#888;font-size:10px;font-weight:700;letter-spacing:.18em}
.aha-modal__close{position:fixed;z-index:6;top:48px;right:48px;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:rgba(17,17,17,.94);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.aha-modal__close span{position:absolute;top:50%;left:50%;width:17px;height:1px;background:#fff}
.aha-modal__close span:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.aha-modal__close span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}

.aha-project--modal{width:100%;margin:0;padding:0}
.aha-project--modal .aha-detail{min-height:100%}
.aha-project--modal .aha-detail__info-inner{top:0;padding-top:42px}
.aha-project--modal .aha-detail__list{display:none}

/* 다크모드 클래스/속성을 쓰는 환경에서 목록만 자연스럽게 대응. 팝업 콘텐츠는 작업물 가독성을 위해 화이트 유지 */
html[data-theme="dark"] .aha-work,body.dark .aha-work,.dark-mode .aha-work{--aha-ink:#f5f5f5;--aha-muted:#9d9d9d;--aha-line:#343238;--aha-paper:#151319;color:#f5f5f5}
html[data-theme="dark"] .aha-work__intro,body.dark .aha-work__intro,.dark-mode .aha-work__intro{color:#aaa}
html[data-theme="dark"] .aha-filter a,body.dark .aha-filter a,.dark-mode .aha-filter a{background:transparent;color:#aaa}
html[data-theme="dark"] .aha-filter a:hover,html[data-theme="dark"] .aha-filter #bo_cate_on,body.dark .aha-filter a:hover,body.dark .aha-filter #bo_cate_on,.dark-mode .aha-filter a:hover,.dark-mode .aha-filter #bo_cate_on{background:#f5f5f5;color:#111;border-color:#f5f5f5}
html[data-theme="dark"] .aha-card__body p,body.dark .aha-card__body p,.dark-mode .aha-card__body p{color:#999}

@media (max-width:1080px){
  .aha-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:62px 20px}
  .aha-detail{grid-template-columns:minmax(0,1.7fr) minmax(330px,1fr);gap:40px}
  .aha-modal{padding:22px}
  .aha-modal__dialog{width:calc(100vw - 44px);height:calc(100vh - 44px)}
  .aha-modal__close{top:34px;right:34px}
}

@media (max-width:900px){
  .aha-work{width:min(100% - 36px,1440px);padding-top:80px}
  .aha-work__head{grid-template-columns:1fr;gap:22px}
  .aha-work__intro{justify-self:start}
  .aha-detail{display:flex;flex-direction:column}
  .aha-detail__info{order:-1;margin-top:0;margin-bottom:32px;border-top:0;border-bottom:1px solid #eee}
  .aha-detail__visual{order:1}
  .aha-detail__info-inner{position:relative;top:auto;padding:32px 0 12px}
  .aha-project--modal .aha-detail__info-inner{padding-top:30px}
  .aha-modal__close{position:absolute;top:12px;right:12px;width:42px;height:42px}
}

@media (max-width:560px){
  .aha-work{width:calc(100% - 28px);padding:62px 0 82px}
  .aha-work__head{padding-bottom:34px}
  .aha-work__head h1{font-size:42px}
  .aha-work__intro{font-size:14px}
  .aha-filter{padding:20px 0 42px}
  .aha-filter ul{gap:7px}
  .aha-filter a{padding:9px 13px;font-size:11px}
  .aha-grid{grid-template-columns:1fr;gap:50px}
  .aha-card__overlay{opacity:1;padding:17px;background:linear-gradient(180deg,transparent 66%,rgba(0,0,0,.55))}
  .aha-card__arrow{width:34px;height:34px}
  .aha-card h2{font-size:20px}
  .aha-card__body p{font-size:12px}
  .aha-pagination{margin-top:58px}

  .aha-project{width:calc(100% - 32px);padding:34px 0 80px}
  .aha-board-view-hero-stage--project + .aha-project:not(.aha-project--modal){width:calc(100% - 32px)}
  .aha-project>.aha-eyebrow{margin-bottom:20px}
  .aha-detail__figure:first-child{max-height:none;aspect-ratio:auto}
  .aha-detail__figure img,.aha-detail__figure video{max-height:420px}
  .aha-detail__figure:first-child img{max-height:none}
  .aha-detail__story{margin-top:72px;padding:0}
  .aha-detail__story h2{margin-bottom:24px;font-size:34px}
  .aha-detail__prose{font-size:16px;line-height:1.8}
  .aha-detail__info h1{font-size:30px;letter-spacing:0}
  .aha-detail__summary{font-size:16px;line-height:1.72}
  .aha-detail__meta div{grid-template-columns:78px 1fr;padding:12px 0}
  .aha-detail__meta dt{font-size:13px}
  .aha-detail__meta dd{font-size:15px}
  .aha-detail__noimage{min-height:220px}
  .aha-detail__visit{height:42px;padding:0 18px;font-size:14px}
  .aha-detail__list-button{height:42px;padding:0 16px;font-size:13px}
  .aha-project>.aha-detail__admin{margin-top:40px}
  .aha-project>.aha-detail__admin a{min-width:90px;height:44px;padding:0 16px;font-size:14px}

  .aha-modal{padding:0}
  .aha-modal__dialog{width:100vw;height:100dvh;border-radius:0}
  .aha-modal__close{position:fixed;top:12px;right:12px}
}