/* ============================================================
   P&W International — Home (2026 리뉴얼 메인)
   시안 기준 1920px → vw 비율로 변환 (px/19.2 = vw)
   섹션: rh(히어로) · rp(파트너) · rw(Why/올인원) · rs(브랜드 스토리) · qbar(하단 고정 퀵메뉴)
   ============================================================ */
.home-renewal{
  --h-brown:   #453127;   /* 본문/제목 브라운 */
  --h-brown-2: #654D45;   /* 퀵메뉴 텍스트 */
  --h-beige:   #E7E1DB;   /* 섹션 배경 */
  --h-beige-2: #F2EFEC;   /* 퀵메뉴 배경 · 다크 섹션 텍스트 */
  --h-ink:     #212221;   /* 히어로 카피 */
  background:var(--h-beige);
}
.home-renewal main{ word-break:keep-all; }

/* ---- Header on home: 히어로 위 투명, 영상의 어두운 장면에서는 흰색 ---- */
body.home-renewal .header:not(.is-solid):not(.mega-open){ background:transparent; box-shadow:none; }
body.home-renewal.scene-dark .header:not(.is-solid):not(.mega-open) .nav,
body.home-renewal.scene-dark .header:not(.is-solid):not(.mega-open) .header__util{ color:#fff; }
body.home-renewal.scene-dark .header:not(.is-solid):not(.mega-open) .logo img{ filter:brightness(0) invert(1); }
body.home-renewal.scene-dark .header:not(.is-solid):not(.mega-open) .burger span{ background:#fff; }

/* ============================================================
   HERO
   ============================================================ */
.rh{
  position:relative; overflow:hidden;
  height:calc(100svh - var(--qbar-h)); min-height:560px;
  display:flex; align-items:center;
  padding:clamp(110px, 8vw, 150px) 0 0 12vw;
  color:var(--h-ink);
  background:#E8C9BC;
}
.rh__media{ position:absolute; inset:0; z-index:0; }
.rh__video{ width:100%; height:100%; object-fit:cover; object-position:70% center; display:block; }
.rh__content{ position:relative; z-index:1; transition:color .8s var(--ease); }
.rh__title{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(38px, 5.15vw, 99px); line-height:1.1; letter-spacing:.01em;
}
.rh__sub{
  font-family:var(--serif);
  margin-top:clamp(18px, 2.8vw, 54px);
  font-size:clamp(14px, 1.34vw, 26px); line-height:1.5;
}
.rh__btn{
  display:inline-flex; align-items:center; justify-content:center;
  margin-top:clamp(28px, 4vw, 77px);
  min-width:clamp(140px, 10.6vw, 204px); height:clamp(36px, 2.15vw, 41px); padding-inline:1.2em;
  background:rgba(33,34,33,.5); color:#fff;
  font-size:clamp(13.5px, 1.34vw, 26px); letter-spacing:.02em;
  transition:background-color .35s var(--ease);
}
.rh__btn:hover{ background:rgba(33,34,33,.78); }
.rh.is-dark .rh__content{ color:#fff; }

/* ============================================================
   PARTNERS
   ============================================================ */
.rp{
  display:grid; grid-template-columns:29.3vw minmax(0,1fr);
  padding:6vw 9.7vw 6.5vw;
  background:var(--h-beige); color:var(--h-brown);
}
.rp__intro{ display:flex; flex-direction:column; justify-content:space-between; padding-right:2vw; }
.rp__title{
  display:flex; flex-direction:column; gap:.4em;
  font-size:clamp(26px, 2.68vw, 52px); font-weight:700; line-height:1.4; letter-spacing:-.01em;
}
.rp__more{
  display:flex; flex-direction:column; align-items:flex-start; gap:.5em;
  width:min(100%, 22.7vw); padding:0; text-align:left;
  font-size:clamp(13px, 1.34vw, 26px); color:var(--h-brown);
}
.rp__more i{ position:relative; display:block; width:100%; height:1px; background:rgba(69,49,39,.35); }
.rp__more i::after{
  content:""; position:absolute; right:0; bottom:0; width:clamp(9px,.7vw,13px); height:1px;
  background:inherit; transform-origin:right center; transform:rotate(45deg);
}
.rp__more:hover i{ background:rgba(69,49,39,.7); }
/* 261013: OUR PARTNERS 화살표 — 섹션이 보이면 선이 왼쪽→오른쪽으로 길어지고 끝에 화살촉 등장, 호버 시 진한 선이 다시 왼→오로 차오름 */
.rp__intro[data-reveal] .rp__more i{ transform:scaleX(0); transform-origin:left center; transition:transform 1.4s cubic-bezier(.65,0,.25,1) .45s, background-color .3s var(--ease); }
.rp__intro[data-reveal].is-in .rp__more i{ transform:none; }
.rp__intro[data-reveal] .rp__more i::after{ opacity:0; transition:opacity .45s var(--ease) 1.75s; }
.rp__intro[data-reveal].is-in .rp__more i::after{ opacity:1; }
.rp__more i::before{
  content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:var(--h-brown);
  transform:scaleX(0); transform-origin:left center; transition:transform .7s cubic-bezier(.65,0,.25,1);
}
.rp__more:hover i::before, .rp__more:focus-visible i::before{ transform:scaleX(1); }
/* 261013: OUR PARTNERS 옆 전체보기 → 포트폴리오 */
.rp__more-wrap{ position:relative; width:min(100%, 22.7vw); }
.rp__more-wrap .rp__more{ width:100%; }
.rp__all{
  position:absolute; right:0; top:0; line-height:calc(clamp(13px, 1.34vw, 26px) * 1.7); /* OUR PARTNERS 줄과 같은 줄 높이 → 세로 중앙 맞춤 */
  font-size:clamp(12px, .94vw, 18px); color:var(--h-brown); opacity:.75;
  transition:opacity .3s var(--ease);
}
.rp__all::after{ content:" +"; }
.rp__all:hover{ opacity:1; text-decoration:underline; text-underline-offset:3px; }

.rp__viewport{ overflow:hidden; min-width:0; }
.rp__track{
  display:flex; gap:1.05vw;
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:none; cursor:grab;
}
.rp__track::-webkit-scrollbar{ display:none; }
.rp__track.is-dragging{ cursor:grabbing; scroll-snap-type:none; scroll-behavior:auto; }
.pcard{ position:relative; flex:0 0 19.17vw; scroll-snap-align:start; }
.pcard__link{ position:absolute; inset:0; z-index:2; }
.pcard__thumb{ aspect-ratio:368/514; overflow:hidden; background:#231815; }
.pcard__thumb img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); pointer-events:none; user-select:none; }
.pcard:hover .pcard__thumb img{ transform:scale(1.04); }
.pcard__label{ display:block; margin-top:1.9vw; font-size:clamp(12px, 1.34vw, 26px); letter-spacing:.01em; }
.pcard__title{ margin-top:1.9vw; font-size:clamp(22px, 2.68vw, 52px); font-weight:700; line-height:1.2; }
.pcard__desc{ margin-top:.5vw; font-size:clamp(12.5px, 1.07vw, 21px); line-height:1.2; max-width:18.4vw; }

/* ============================================================
   WHY / ALL-IN-ONE
   ============================================================ */
.rw{ padding:8.2vw 0 8.5vw; background:var(--h-beige); color:var(--h-brown); text-align:center; overflow:hidden; }
.rw__why{ font-size:clamp(44px, 4.3vw, 83px); font-weight:300; line-height:1.2; letter-spacing:-.01em; }
.rw__why-sub{ margin-top:.3vw; font-size:clamp(18px, 2.15vw, 41px); font-weight:700; line-height:1.25; }
.rw__line{
  position:relative; display:block; width:1px; height:clamp(70px, 8.2vw, 157px);
  margin:2.4vw auto 3.6vw; background:rgba(69,49,39,.35);
}
.rw__line::after{
  content:""; position:absolute; left:50%; top:calc(100% + .9vw);
  width:clamp(8px,.84vw,16px); height:clamp(8px,.84vw,16px); border-radius:50%;
  background:var(--h-brown); transform:translateX(-50%);
}
.rw__en{ margin-top:2.6vw; font-size:clamp(22px, 2.68vw, 52px); font-weight:300; line-height:1.3; }
.rw__ko{ margin-top:.9vw; font-size:clamp(22px, 2.68vw, 52px); font-weight:700; line-height:1.3; }

.rw__slider{ --rw-side:7.55vw; position:relative; margin:3.9vw var(--rw-side) 0; }
/* 261013: 카드 좌우 < > 화살표 — 좌우 여백 가운데 */
.rw__stage{ position:relative; }
.rw__viewport{ overflow:hidden; touch-action:pan-y; cursor:grab; user-select:none; } /* 261013: PC 마우스 · 모바일 손가락 스와이프 */
.rw__viewport.is-dragging{ cursor:grabbing; }
.rw__viewport img{ -webkit-user-drag:none; pointer-events:none; }
.rw__arrow{
  position:absolute; top:50%; z-index:2; display:flex; align-items:center; justify-content:center;
  width:clamp(32px, 2.6vw, 50px); height:clamp(32px, 2.6vw, 50px); padding:0;
  color:var(--h-brown); opacity:.7; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.rw__arrow svg{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.4; }
.rw__arrow--prev{ left:calc(var(--rw-side) / -2); transform:translate(-50%, -50%); }
.rw__arrow--next{ right:calc(var(--rw-side) / -2); transform:translate(50%, -50%); }
.rw__arrow:hover{ opacity:1; }
.rw__track{
  --per:3.5; --gap:2.4vw; /* 261013: 3.5장 노출 — 다음 카드가 있다는 느낌 */
  display:flex; gap:var(--gap);
  transition:transform .8s var(--ease);
}
.scard{
  position:relative; flex:0 0 calc((100% - (var(--per) - 1) * var(--gap)) / var(--per));
  aspect-ratio:512/580; overflow:hidden; /* 261013: 3.5장 노출로 폭이 줄어 세로 여유 확보 */
  display:flex; flex-direction:column; align-items:flex-start;
  padding:2.5vw 2.2vw 3.3vw; background:#fff; text-align:left;
}
.scard__picto{
  position:absolute; left:50%; top:56%; width:68%; height:72%; object-fit:contain;
  transform:translate(-50%,-50%); pointer-events:none;
}
.scard > *:not(.scard__picto){ position:relative; }
.scard__label{ font-size:clamp(12px, 1.34vw, 26px); line-height:1.2; }
.scard__title{ margin-top:1.1vw; font-size:clamp(18px, 2.15vw, 41px); font-weight:700; line-height:1.2; letter-spacing:-.015em; }
.scard__list{ margin-top:auto; min-height:4.2em; padding-left:.45vw; font-size:clamp(12.5px, 1.34vw, 26px); line-height:1.4; }

.rw__dots{ display:flex; justify-content:center; gap:clamp(8px,.85vw,16px); margin-top:2.6vw; }
.rw__dots button{
  width:clamp(7px,.6vw,11px); height:clamp(7px,.6vw,11px); border-radius:50%; padding:0;
  background:var(--h-brown); opacity:.28; transition:opacity .3s var(--ease);
}
.rw__dots button[aria-selected="true"]{ opacity:1; }

.rw__closing{
  margin-top:7.4vw; padding-inline:var(--pad-x);
  font-size:clamp(18px, 2.68vw, 52px); line-height:1.4; letter-spacing:-.01em;
}
.rw__closing strong{ display:inline-block; margin-top:.45em; font-weight:700; }
/* 261013: "완벽한 일관성" 글자마다 위에 강조 도트 (6개) */
.rw__dot-em{ font-style:normal; }
.rw__dot-em span{ position:relative; display:inline-block; }
.rw__dot-em span::before{
  content:""; position:absolute; left:50%; top:.02em;
  width:.19em; height:.19em; min-width:5px; min-height:5px; border-radius:50%;
  background:currentColor; transform:translate(-50%, -100%);
  opacity:0;
}
/* 스크롤로 문장이 보이면(.is-in) 도트가 왼쪽부터 하나씩 통통 튀어나옴 */
.rw__closing.is-in .rw__dot-em span::before{ animation:rw-dot-pop .7s cubic-bezier(.3,.9,.4,1) both; animation-delay:calc(.55s + var(--d, 0) * .13s); }
.rw__dot-em span:nth-child(2){ --d:1; } .rw__dot-em span:nth-child(3){ --d:2; }
.rw__dot-em span:nth-child(4){ --d:3; } .rw__dot-em span:nth-child(5){ --d:4; } .rw__dot-em span:nth-child(6){ --d:5; }
@keyframes rw-dot-pop{
  0%  { opacity:0; transform:translate(-50%, -100%) translateY(80%) scale(.2); }
  40% { opacity:1; transform:translate(-50%, -100%) translateY(-160%) scale(1.15, 1.3); }
  62% { transform:translate(-50%, -100%) translateY(0) scale(1.3, .75); }
  78% { transform:translate(-50%, -100%) translateY(-55%) scale(.92, 1.1); }
  90% { transform:translate(-50%, -100%) translateY(0) scale(1.08, .94); }
  100%{ opacity:1; transform:translate(-50%, -100%); }
}
@media (prefers-reduced-motion: reduce){ .rw__dot-em span::before{ opacity:1; animation:none !important; } }

/* ============================================================
   BRAND STORY (dark video)
   ============================================================ */
.rs{ position:relative; overflow:hidden; color:var(--h-beige-2); background:#1d1813; text-align:center; }
.rs__media{ position:absolute; inset:0; z-index:0; }
.rs__media::after{ content:""; position:absolute; inset:0; background:rgba(20,15,10,.35); }
.rs__video{ width:100%; height:100%; object-fit:cover; display:block; }
/* 261013: 배경 이미지 2장 롤링 (크로스페이드 + 아주 느린 줌) — 기존 영상은 index.html 주석으로 백업 */
.rs__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; animation:rs-zoom 16s ease-in-out infinite alternate; }
.rs__img--2{ opacity:0; animation:rs-fade 14s ease-in-out infinite, rs-zoom 16s ease-in-out infinite alternate-reverse; }
@keyframes rs-fade{ 0%, 38%{ opacity:0; } 50%, 88%{ opacity:1; } 100%{ opacity:0; } }
@keyframes rs-zoom{ from{ transform:scale(1); } to{ transform:scale(1.06); } }
@media (prefers-reduced-motion: reduce){ .rs__img{ animation:none; } }
.rs__inner{ position:relative; z-index:1; padding:9.8vw 7.55vw 8.3vw; pointer-events:none; }
.rs__link{ position:absolute; inset:0; z-index:1; cursor:pointer; }
/* 261013: 마우스 커서 향 입자 캔버스 (home.js) */
.scent-cursor{ position:fixed; inset:0; width:100vw; height:100vh; z-index:200; pointer-events:none; }
.rs__inner a{ pointer-events:auto; } /* 인스타 링크만 별도 클릭 */
.rs__title{ font-family:var(--serif); font-weight:400; font-size:clamp(24px, 3.22vw, 62px); line-height:1.25; }
.rs__lead{ margin-top:3.3vw; font-family:var(--serif); font-size:clamp(14px, 1.34vw, 26px); line-height:1.25; }
.rs__lead span{ display:inline-block; margin-top:1.25em; }
.rs__insta{
  display:inline-flex; align-items:center; gap:1.1vw; margin-top:5.6vw;
  font-size:clamp(16px, 1.6vw, 31px); font-weight:700;
}
.rs__insta img{ width:clamp(28px, 2.3vw, 44px); height:auto; }
.rs__insta:hover span{ text-decoration:underline; text-underline-offset:.2em; }
.rs__values{
  display:grid; grid-template-columns:repeat(3,1fr);
  margin-top:5.5vw; padding-top:1.8vw; border-top:1px solid rgba(242,239,236,.35);
}
.rs__value{ padding:1.1vw 1.5vw .8vw; }
.rs__value + .rs__value{ border-left:1px solid rgba(242,239,236,.35); }
.rs__value h3{ font-size:clamp(17px, 1.6vw, 31px); font-weight:700; line-height:1.2; }
.rs__value p{ font-size:clamp(12.5px, 1.07vw, 21px); line-height:1.2; }
.rs__value .rs__value-ko{ margin-top:2vw; margin-bottom:1.3vw; }


/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .rh{ padding:calc(var(--nav-h) + 20px) var(--pad-x) 0; align-items:center; }
  .rh__video{ object-position:80% center; } /* 261007_pc 기준 · MO 전용 영상 수령 전 임시 */
  .rh__content{ max-width:100%; }

  .rp{ grid-template-columns:1fr; gap:36px; padding:72px var(--pad-x) 80px; }
  .rp__intro{ flex-direction:row; align-items:flex-end; gap:24px; padding-right:0; }
  .rp__more{ width:auto; min-width:150px; }
  .rp__more-wrap{ width:auto; min-width:190px; }
  .rp__viewport{ margin-right:calc(var(--pad-x) * -1); }
  .rp__track{ gap:14px; padding-right:var(--pad-x); }
  .pcard{ flex-basis:58vw; }
  .pcard__label, .pcard__title{ margin-top:14px; }
  .pcard__desc{ margin-top:6px; max-width:none; }

  .rw{ padding:80px 0; }
  .rw__line{ margin:20px auto 36px; }
  .rw__line::after{ top:calc(100% + 8px); }
  .rw__en{ margin-top:30px; } .rw__ko{ margin-top:6px; }
  .rw__slider{ --rw-side:var(--pad-x); margin:36px var(--pad-x) 0; }
  .rw__arrow{ width:24px; height:24px; }
  .rw__track{ --per:1.15; --gap:14px; }
  .scard{ aspect-ratio:auto; min-height:clamp(320px, 88vw, 420px); padding:26px 24px 30px; }
  .scard__title{ margin-top:10px; }
  .rw__dots{ margin-top:22px; }
  .rw__closing{ margin-top:64px; }

  .rs__inner{ padding:96px var(--pad-x) 72px; }
  .rs__lead{ margin-top:28px; } .rs__insta{ margin-top:40px; gap:10px; }
  .rs__values{ grid-template-columns:1fr; margin-top:48px; padding-top:8px; }
  .rs__value{ padding:24px 0; }
  .rs__value + .rs__value{ border-left:0; border-top:1px solid rgba(242,239,236,.25); }
  .rs__value .rs__value-ko{ margin:10px 0 8px; }

}
@media (max-width:600px){
  .rh{ min-height:520px; }
  .rp__intro{ flex-direction:column; align-items:flex-start; }
  .pcard{ flex-basis:72vw; }
  .rw__closing br{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .rw__track, .pcard__thumb img{ transition:none; }
}