/* ============================================================
   PageWriter — 전역 스타일 (pw-global.css)
   모든 페이지 공통: 토큰 · 리셋 · 타이포 · 헤더/오버레이 · 푸터 · 반응형
   페이지별 섹션 CSS(홈 히어로 / 서브페이지 등)는 여기 넣지 않음.
   ------------------------------------------------------------
   [폰트 로딩] 이 파일에는 폰트 @import를 넣지 않았음.
   렌더 블로킹을 피하려면 functions.php에서 wp_enqueue_style로 로드할 것
   (동봉한 pw-functions.php 참고). 임시로 급하면 아래 두 줄을
   이 파일 맨 위에서 주석 해제해도 되지만 권장하지 않음:
   @import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&display=swap');
   @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');
   ============================================================ */

:root{
  /* --- 브랜드 토큰 (로고에서 추출한 PW 블루 중심) --- */
  --pw-blue:#1E4E8C;
  --pw-navy:#12305A;
  --pw-sky:#E8EFF7;
  --ink:#141414;
  --white:#FFFFFF;
  --gray:#9AA3AE;
  --coral:#F0654F;

  --line:rgba(20,20,20,.12);
  --line-inv:rgba(255,255,255,.16);

  --maxw:1480px;
  --gutter:clamp(20px,4.2vw,72px);
  --sec-y:clamp(84px,12vw,160px);
  --header-h:82px;

  --font-display:'Archivo','Pretendard',system-ui,-apple-system,sans-serif;
  --font-body:'Pretendard','Archivo',system-ui,-apple-system,sans-serif;

  --ease:cubic-bezier(.76,0,.24,1);
}

/* ─────────────── 리셋 & 베이스 ─────────────── */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:var(--font-body);font-size:clamp(16px,1.05vw,18px);
  line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font-family:inherit}
.container{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}

/* ─────────────── 타이포 스케일 ─────────────── */
.eyebrow{
  font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gray);display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:26px;height:1.5px;background:currentColor;display:inline-block}
.display{font-family:var(--font-display);font-weight:800;line-height:1.0;letter-spacing:-.025em;
  font-size:clamp(38px,7.6vw,112px);margin:0}
.h1{font-family:var(--font-display);font-weight:800;line-height:1.04;letter-spacing:-.02em;
  font-size:clamp(34px,5.4vw,74px);margin:0}
.h2{font-family:var(--font-display);font-weight:800;line-height:1.06;letter-spacing:-.02em;
  font-size:clamp(28px,3.6vw,50px);margin:0}
.h3{font-family:var(--font-display);font-weight:700;line-height:1.15;letter-spacing:-.01em;
  font-size:clamp(20px,1.8vw,26px);margin:0}
.lede{font-size:clamp(18px,1.4vw,22px);line-height:1.6;color:#3a3f45;max-width:46ch}
.sub{color:var(--gray);font-size:clamp(16px,1.15vw,19px);line-height:1.5}
.mono{font-family:var(--font-display);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.02em}

/* ─────────────── 스크롤 리빌 ─────────────── */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}

/* ─────────────── 텍스트 링크(화살표) ─────────────── */
.arrow-link{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);
  font-weight:700;font-size:clamp(16px,1.2vw,19px);letter-spacing:-.01em;position:relative;padding-bottom:6px}
.arrow-link svg{width:22px;height:22px;transition:transform .4s var(--ease)}
.arrow-link::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:currentColor;transform:scaleX(1);transform-origin:left;opacity:.25;transition:opacity .3s}
.arrow-link:hover svg{transform:translateX(6px)}
.arrow-link:hover::after{opacity:1;background:var(--coral)}

/* ═══════════════ 헤더 (전역) ═══════════════ */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:120;color:var(--ink);
  display:flex;align-items:center;justify-content:space-between;
  height:var(--header-h);padding-inline:var(--gutter);
  transition:color .45s var(--ease);
  mix-blend-mode:normal;
}
.site-header.is-dark{color:var(--white)}
.logo{display:flex;align-items:center;gap:12px;font-family:var(--font-display);
  font-weight:800;font-size:19px;letter-spacing:-.02em}
.logo .mark{height:24px;width:auto;overflow:visible;color:inherit}
.header-tools{display:flex;align-items:center;gap:clamp(16px,2vw,26px)}
.icon-btn{background:none;border:0;color:inherit;cursor:pointer;padding:6px;display:grid;place-items:center}
.icon-btn svg{width:22px;height:22px}
.hamburger{width:30px;height:16px;position:relative;padding:0}
.hamburger span{position:absolute;left:0;height:2px;width:100%;background:currentColor;
  transition:transform .4s var(--ease),opacity .3s var(--ease)}
.hamburger span:nth-child(1){top:0}
.hamburger span:nth-child(2){bottom:0}
.hamburger.is-active span:nth-child(1){top:7px;transform:rotate(45deg)}
.hamburger.is-active span:nth-child(2){bottom:7px;transform:rotate(-45deg)}

/* 검색 슬라이드바 */
.searchbar{position:fixed;top:var(--header-h);left:0;right:0;z-index:118;background:var(--white);
  border-bottom:1px solid var(--line);transform:translateY(-101%);transition:transform .5s var(--ease)}
.searchbar.open{transform:none}
.searchbar .container{display:flex;align-items:center;gap:16px;height:76px}
.searchbar input{flex:1;border:0;outline:0;background:none;font-family:var(--font-display);
  font-weight:600;font-size:clamp(20px,3vw,34px);color:var(--ink);letter-spacing:-.02em}
.searchbar input::placeholder{color:var(--gray)}

/* ═══════════════ 풀스크린 오버레이 메뉴 (전역) ═══════════════ */
.overlay{position:fixed;inset:0;z-index:119;background:var(--white);color:var(--ink);
  transform:translateY(-100%);transition:transform .7s var(--ease);
  display:flex;flex-direction:column;padding:calc(var(--header-h) + 24px) var(--gutter) 40px;overflow:auto}
.overlay.open{transform:none}
.overlay-inner{flex:1;display:grid;grid-template-columns:1fr;gap:40px;align-content:center;
  max-width:var(--maxw);margin-inline:auto;width:100%}
.primary-nav{display:flex;flex-direction:column;align-items:flex-end;gap:clamp(2px,.4vw,6px)}
.primary-nav a{font-family:var(--font-display);font-weight:800;letter-spacing:-.03em;
  font-size:clamp(46px,10vw,116px);line-height:1.0;color:var(--ink);position:relative;
  padding:2px 0;transition:color .3s}
.primary-nav a .idx{font-size:.22em;font-weight:700;color:var(--gray);vertical-align:super;margin-right:.4em;letter-spacing:.05em}
.primary-nav a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:5px;
  background:var(--coral);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.primary-nav a:hover::after{transform:scaleX(1);transform-origin:left}
.overlay-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px;
  border-top:1px solid var(--line);padding-top:26px}
.secondary-nav{display:flex;flex-wrap:wrap;gap:6px 30px}
.secondary-nav a{color:var(--gray);font-weight:600;font-size:15px;position:relative;padding-bottom:3px;transition:color .3s}
.secondary-nav a:hover{color:var(--ink)}
.secondary-nav a::after{content:"";position:absolute;left:0;bottom:0;height:1.5px;width:100%;
  background:var(--coral);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.secondary-nav a:hover::after{transform:scaleX(1);transform-origin:left}
.overlay-foot .mark{height:40px;color:var(--pw-blue)}

/* ═══════════════ 뉴스레터 + 푸터 (전역) ═══════════════ */
.newsletter{background:var(--pw-navy);color:var(--white);padding:clamp(56px,8vw,110px) 0}
.nl-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,70px);align-items:center}
.nl-grid .h2{color:var(--white)}
.nl-form{display:flex;gap:14px;margin-top:20px;border-bottom:1.5px solid rgba(255,255,255,.28);padding-bottom:12px}
.nl-form input{flex:1;border:0;background:none;outline:0;color:var(--white);font-size:18px;
  font-family:var(--font-body)}
.nl-form input::placeholder{color:rgba(255,255,255,.5)}
.nl-form button{background:none;border:0;color:var(--white);cursor:pointer;display:grid;place-items:center;padding:4px}
.nl-form button svg{width:26px;height:26px;transition:transform .4s var(--ease)}
.nl-form button:hover svg{transform:translateX(6px)}
.nl-note{color:rgba(255,255,255,.55);font-size:13px;margin-top:14px;min-height:18px}

.site-footer{background:var(--ink);color:var(--white);padding:clamp(50px,7vw,90px) 0 34px}
.foot-top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:34px;
  border-bottom:1px solid var(--line-inv);padding-bottom:clamp(40px,5vw,60px)}
.foot-brand .mark{height:44px;color:var(--white);margin-bottom:22px}
.foot-brand p{color:rgba(255,255,255,.55);max-width:34ch;font-size:15px;line-height:1.6}
.foot-col h4{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,.5);margin:0 0 18px}
.foot-col a{display:block;color:rgba(255,255,255,.82);font-size:15px;padding:6px 0;transition:color .3s}
.foot-col a:hover{color:var(--coral)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:26px;
  color:rgba(255,255,255,.45);font-size:13px}
.foot-bottom .socials{display:flex;gap:20px}
.foot-bottom .socials a:hover{color:var(--white)}

/* ─────────────── 포커스 접근성 ─────────────── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--coral);outline-offset:3px;border-radius:2px}

/* ═══════════════ 반응형 ═══════════════ */
/* 아래 미디어쿼리에는 페이지별 클래스(.svc-grid, .proj-grid 등)도 함께 들어 있음.
   해당 페이지가 없으면 그 셀렉터는 그냥 무시되니 전역 파일에 둬도 무해함. */
@media (max-width:1000px){
  .statement-grid,.subhero__inner,.nl-grid,.contact-grid,.cap-row{grid-template-columns:1fr}
  .subhero__block{justify-self:start;margin-top:10px}
  .subhero__block .mark{height:clamp(96px,26vw,160px)}
  .svc-grid,.ins-grid,.proj-grid{grid-template-columns:repeat(2,1fr)}
  .svc:nth-child(3n){border-right:1px solid var(--line)}
  .svc:nth-child(2n){border-right:0}
  .foot-top{grid-template-columns:1fr 1fr}
  .stats,.team-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  :root{--header-h:70px}
  .svc-grid,.ins-grid,.proj-grid,.foot-top,.stats,.team-grid{grid-template-columns:1fr}
  .svc:nth-child(2n){border-right:0}
  .primary-nav{align-items:flex-start}
  .primary-nav a::after{left:0;right:auto;width:min(100%,7ch)}
  .blockgrid{aspect-ratio:auto}
  .foot-bottom{flex-direction:column}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}

/* ─────────────── 접근성 유틸 ─────────────── */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-60px;left:16px;z-index:200;background:var(--ink);color:#fff;padding:10px 18px;border-radius:6px;font-family:var(--font-display);font-weight:600;font-size:14px;transition:top .3s}
.skip-link:focus{top:16px}