/* PODO THE BLACK — 2026-09-30 리뉴얼 (블랙·코퍼 하이엔드, 이미지 중심·역동)
   글꼴: 영문 표제 Bodoni Moda / 한글·숫자 Pretendard(숫자는 모두 Pretendard) */
:root{
  --ink:#0b0b0c;--ink2:#141416;--ink3:#1d1d20;--bone:#f3efe9;--paper:#faf8f5;--sand:#e9e3da;
  --tx:#1a1918;--tx2:#57524c;--tx3:#8d857d;--line:rgba(26,25,24,.12);--lineW:rgba(255,255,255,.14);
  --cu:#c46a36;--cu2:#dba27a;--rose:#b7a2a3;
  --serif:'Bodoni Moda','Times New Roman',serif;--sans:Pretendard,-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);--wrap:1240px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{word-break:keep-all;font-family:var(--sans);color:var(--tx);background:var(--paper);line-height:1.65;letter-spacing:-.01em;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.en{font-family:var(--serif);font-weight:500;letter-spacing:.02em}
.num{font-family:var(--sans);font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:-.03em}
:focus-visible{outline:2px solid var(--cu);outline-offset:3px}

/* 진행 막대 */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--cu);transform:scaleX(0);transform-origin:0 50%;z-index:1001}

/* ── 헤더 ── */
#hdr{position:fixed;left:0;right:0;top:0;z-index:1000;transition:background .35s,border-color .35s,transform .35s;border-bottom:1px solid transparent;padding-top:env(safe-area-inset-top,0px)}
#hdr.solid,#hdr.opaque{background:rgba(11,11,12,.97);border-color:var(--lineW)}
.hd{display:flex;align-items:center;height:76px;gap:24px}
.brand{display:flex;flex-direction:column;line-height:1;color:#fff}
.brand .bw{font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:.08em}
.brand .bw b{font-weight:600;color:var(--cu2)}
.brand small{font-size:10.5px;letter-spacing:.24em;color:rgba(255,255,255,.62);margin-top:6px;font-weight:500}
.nav{margin-left:auto;display:flex;align-items:center;gap:26px}
.nav a{color:rgba(255,255,255,.82);font-size:14px;font-weight:500;position:relative;padding:6px 0;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--cu2);transform:scaleX(0);transition:transform .35s var(--ease)}
.nav a:hover,.nav a.on{color:#fff}.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}
.nav a.cta{border:1px solid var(--cu2);color:#fff;padding:9px 18px;border-radius:999px;margin-left:6px}
.nav a.cta::after{display:none}.nav a.cta:hover{background:var(--cu);border-color:var(--cu)}
.burger{display:none;margin-left:auto;width:44px;height:44px;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.burger span{display:block;width:24px;height:1.5px;background:#fff;transition:transform .3s,opacity .3s}
.burger.on span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}.burger.on span:nth-child(2){opacity:0}.burger.on span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* ── 버튼 ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:54px;padding:0 28px;border-radius:999px;font-size:15px;font-weight:700;letter-spacing:-.01em;transition:background .25s,color .25s,border-color .25s,transform .25s;border:1px solid transparent;white-space:nowrap}
.btn.fill{background:var(--cu);color:#fff}.btn.fill:hover{background:#d27a45;transform:translateY(-2px)}
.btn.line{border-color:rgba(255,255,255,.55);color:#fff}.btn.line:hover{background:#fff;color:var(--ink)}
.btn.dark{background:var(--ink);color:#fff}.btn.dark:hover{background:#26262a}
.btn.lineD{border-color:var(--tx);color:var(--tx)}.btn.lineD:hover{background:var(--tx);color:#fff}
.btn.kko{background:#fee500;color:#191919}.btn.kko:hover{background:#f5dc00}
.arrow::after{content:"→";font-weight:400;transition:transform .25s}.arrow:hover::after{transform:translateX(4px)}

/* ── 공통 섹션 ── */
section{position:relative}
.sec{padding:130px 0}
.sec.dark{background:var(--ink);color:#fff}
.sec.bone{background:var(--bone)}
.kick{display:inline-flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--cu);font-weight:600}
.kick::before{content:"";width:34px;height:1px;background:currentColor}
.dark .kick{color:var(--cu2)}
.h2{font-size:clamp(30px,4.2vw,54px);line-height:1.18;font-weight:700;letter-spacing:-.035em;margin-top:18px;text-wrap:balance}
.h2 .en{font-weight:500;font-style:italic;color:var(--cu)}
.dark .h2 .en{color:var(--cu2)}
.lead{font-size:17px;color:var(--tx2);margin-top:20px;max-width:620px}
.dark .lead{color:rgba(255,255,255,.72)}
.head2{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:56px}

/* 스크롤 등장 (JS 켜진 경우에만 숨김→등장) */
html.js .rv{opacity:0;transform:translateY(38px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
html.js .rv.in{opacity:1;transform:none}
html.js .rv.d1{transition-delay:.1s}html.js .rv.d2{transition-delay:.2s}html.js .rv.d3{transition-delay:.3s}html.js .rv.d4{transition-delay:.4s}
html.js .rvimg{clip-path:inset(12% 0 0 0);transition:clip-path 1.4s var(--ease)}
html.js .rvimg.in{clip-path:inset(0 0 0 0)}

/* ── 홈 히어로 ── */
.hero{position:relative;height:100svh;min-height:680px;background:var(--ink);color:#fff;overflow:hidden}
.hero .slides{position:absolute;inset:0}
.hero .sl{position:absolute;inset:-2%;background-size:cover;background-position:center;opacity:0;transition:opacity 1.8s ease;transform:scale(1.1)}
.hero .sl.on{opacity:1;animation:kb 9s linear forwards}
@keyframes kb{from{transform:scale(1.12)}to{transform:scale(1.0)}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,9,.82) 0%,rgba(8,8,9,.45) 45%,rgba(8,8,9,.08) 75%),linear-gradient(180deg,rgba(8,8,9,.35) 0%,rgba(8,8,9,0) 30%,rgba(8,8,9,.55) 100%);pointer-events:none}
.hero-in{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;padding-top:60px}
.hero .eyebrow{font-size:12px;letter-spacing:.34em;color:var(--cu2);font-weight:600}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(58px,9.6vw,148px);line-height:.92;letter-spacing:.01em;margin-top:26px}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln>span{display:inline-block;animation:up 1.3s var(--ease) both}
.hero h1 .ln:nth-child(2)>span{animation-delay:.14s;font-style:italic;color:var(--cu2)}
@keyframes up{from{transform:translateY(105%)}to{transform:none}}
.hero .kr{font-size:clamp(18px,2vw,24px);font-weight:600;margin-top:26px;letter-spacing:-.02em;animation:fade 1.4s .45s both}
.hero .sub{font-size:16px;color:rgba(255,255,255,.76);margin-top:12px;max-width:560px;animation:fade 1.4s .6s both}
@keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero .hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px;animation:fade 1.4s .8s both}
.hero .hero-cta>a,.hero .hero-cta>button{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:54px;padding:0 26px;border-radius:999px;font-size:15px;font-weight:700;border:1px solid rgba(255,255,255,.55);color:#fff;transition:background .25s,color .25s,transform .25s}
.hero .hero-cta>.fill{background:var(--cu);border-color:var(--cu)}
.hero .hero-cta>*:hover{transform:translateY(-2px);background:#fff;color:var(--ink);border-color:#fff}
.hero .hero-cta>.fill:hover{background:#d27a45;color:#fff;border-color:#d27a45}
.hero .tower{position:absolute;right:max(28px,calc((100vw - var(--wrap))/2 + 28px));bottom:12vh;width:min(25vw,340px);aspect-ratio:1100/1376;z-index:2;border:1px solid rgba(255,255,255,.28);padding:10px;animation:rise 1.6s .5s var(--ease) both}
.hero .tower img{width:100%;height:100%;object-fit:cover}
.hero .tower figcaption{position:absolute;left:10px;bottom:-30px;font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.6)}
@keyframes rise{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:none}}
.hero .hud{position:absolute;left:0;right:0;bottom:34px;z-index:3}
.hero .hud .wrap{display:flex;align-items:center;gap:22px}
.hero .cnt{font-size:13px;letter-spacing:.14em;color:rgba(255,255,255,.8)}
.hero .cnt b{color:#fff;font-weight:700}
.hero .bars{display:flex;gap:8px}
.hero .bars i{display:block;width:44px;height:2px;background:rgba(255,255,255,.25);position:relative;overflow:hidden}
.hero .bars i.on::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:0 50%;animation:bar 6s linear forwards}
@keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero .cap{margin-left:auto;font-size:12px;letter-spacing:.08em;color:rgba(255,255,255,.66)}
.scrollcue{position:absolute;left:50%;bottom:0;z-index:3;width:1px;height:70px;background:rgba(255,255,255,.2);overflow:hidden}
.scrollcue::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:#fff;animation:cue 2.2s ease-in-out infinite}
@keyframes cue{to{top:100%}}

/* 흐르는 띠 */
.marq{background:var(--ink);color:#fff;overflow:hidden;border-top:1px solid var(--lineW);border-bottom:1px solid var(--lineW)}
.marq .tr{display:flex;width:max-content;animation:mq 42s linear infinite}
.marq span{font-family:var(--serif);font-size:clamp(22px,2.6vw,34px);padding:22px 0;white-space:nowrap;display:flex;align-items:center}
.marq span::after{content:"✦";font-family:var(--sans);font-size:14px;color:var(--cu2);margin:0 34px}
.marq span i{font-style:italic;color:var(--cu2)}
@keyframes mq{to{transform:translateX(-50%)}}

/* 인트로 (큰 문장 + 이미지) */
.intro{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}
.intro .pic{position:relative;aspect-ratio:4/5;overflow:hidden}
.intro .pic img{width:100%;height:118%;object-fit:cover;will-change:transform}
.intro .pic .tag{position:absolute;left:18px;bottom:18px;background:rgba(11,11,12,.8);color:#fff;font-size:12px;padding:8px 14px;letter-spacing:.06em}
.intro .stat{display:grid;grid-template-columns:repeat(3,1fr);margin-top:48px;border-top:1px solid var(--line)}
.intro .stat div{padding:22px 0 0}
.intro .stat b{display:block;font-size:clamp(28px,3vw,40px);font-weight:700;letter-spacing:-.04em;line-height:1}
.intro .stat b small{font-size:14px;font-weight:600;margin-left:3px;color:var(--tx2)}
.intro .stat>div>span{display:block;font-size:13px;color:var(--tx3);margin-top:8px}

/* 시그니처 4 (이미지 카드) */
.sig{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--ink)}
.sig a{position:relative;aspect-ratio:3/4.2;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:30px 28px}
.sig a img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s;filter:brightness(.55)}
.sig a:hover img{transform:scale(1.07);filter:brightness(.7)}
.sig a>*:not(img){position:relative}
.sig .big{font-size:clamp(34px,3.6vw,52px);font-weight:700;letter-spacing:-.04em;line-height:1}
.sig .big em{font-style:normal;font-size:.45em;margin-left:4px;color:var(--cu2)}
.sig h3{font-size:18px;margin-top:16px;font-weight:700;letter-spacing:-.02em}
.sig p{font-size:14px;color:rgba(255,255,255,.72);margin-top:8px;line-height:1.6}
.sig .no{position:absolute;top:26px;left:28px;font-family:var(--serif);font-style:italic;color:var(--cu2);font-size:18px}

/* 층별 구성(스택) */
.stack{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:stretch}
.stack ol{list-style:none;border-top:1px solid var(--lineW)}
.stack li{border-bottom:1px solid var(--lineW);display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:18px;padding:22px 6px;cursor:pointer;transition:background .3s,padding .3s}
.stack li .fl{font-size:14px;color:var(--cu2);font-weight:700;letter-spacing:.04em}
.stack li .nm{font-size:20px;font-weight:700;letter-spacing:-.02em}
.stack li .nm small{display:block;font-size:13px;font-weight:400;color:rgba(255,255,255,.6);margin-top:3px;letter-spacing:0}
.stack li .ar{opacity:0;transform:translateX(-8px);transition:.3s;color:var(--cu2)}
.stack li.on,.stack li:hover{background:rgba(255,255,255,.05);padding-left:16px}
.stack li.on .ar,.stack li:hover .ar{opacity:1;transform:none}
.stack .view{position:relative;min-height:520px;overflow:hidden;background:#000}
.stack .view img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .9s,transform 1.6s var(--ease)}
.stack .view img.on{opacity:1;transform:none}
.stack .view .vc{position:absolute;left:0;right:0;bottom:0;padding:28px;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent);color:#fff;font-size:14px;z-index:2}

/* 가로 갤러리 */
.hg{position:relative}
.hg .rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(28px,calc((100vw - var(--wrap))/2 + 28px)) 8px;scrollbar-width:none;cursor:grab}
.hg .rail::-webkit-scrollbar{display:none}
.hg .rail.drag{cursor:grabbing;scroll-snap-type:none}
.hg figure{flex:0 0 min(62vw,760px);scroll-snap-align:start;position:relative}
.hg figure .im{overflow:hidden;aspect-ratio:16/9;background:#111}
.hg figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);pointer-events:none}
.hg figure:hover img{transform:scale(1.05)}
.hg figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:14px;font-size:14px;color:rgba(255,255,255,.7)}
.hg figcaption b{color:#fff;font-weight:600}
.hg .ctl{display:flex;gap:10px}
.hg .ctl button{width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.35);color:#fff;font-size:18px;transition:background .25s,color .25s}
.hg .ctl button:hover{background:#fff;color:var(--ink)}
.bone .hg .ctl button,.paper .hg .ctl button{border-color:var(--line);color:var(--tx)}

/* 서비스 카드 */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc .c{position:relative;overflow:hidden;background:var(--ink);color:#fff;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;padding:28px}
.svc .c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.52);transition:transform 1.2s var(--ease),filter .5s}
.svc .c:hover img{transform:scale(1.07);filter:brightness(.4)}
.svc .c>*:not(img){position:relative}
.svc .c .en{font-size:15px;letter-spacing:.06em;color:var(--cu2);font-style:italic}
.svc .c h3{font-size:22px;margin-top:8px;letter-spacing:-.02em}
.svc .c ul{list-style:none;margin-top:12px;font-size:14px;color:rgba(255,255,255,.8);max-height:0;overflow:hidden;transition:max-height .7s var(--ease)}
.svc .c:hover ul,.svc .c:focus-within ul{max-height:260px}
.svc .c ul li{padding:3px 0 3px 14px;position:relative}.svc .c ul li::before{content:"";position:absolute;left:0;top:12px;width:5px;height:1px;background:var(--cu2)}
@media (hover:none){.svc .c ul{max-height:none}}

/* 입지 */
.loc{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
.loc .map{background:#fff;padding:10px;box-shadow:0 30px 60px rgba(0,0,0,.08)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.chips span{border:1px solid var(--line);padding:9px 16px;border-radius:999px;font-size:14px;background:#fff}
.chips span b{color:var(--cu);margin-right:6px}
.dark .chips span{background:transparent;border-color:var(--lineW)}

/* 큰 CTA */
.bigcta{position:relative;overflow:hidden;color:#fff;padding:170px 0;text-align:center;background:var(--ink)}
.bigcta .bg{position:absolute;inset:-15% 0;background-size:cover;background-position:center;filter:brightness(.38);will-change:transform}
.bigcta .wrap{position:relative}
.bigcta h2{font-family:var(--serif);font-weight:500;font-size:clamp(40px,6vw,86px);line-height:1.05}
.bigcta h2 i{color:var(--cu2)}
.bigcta p{margin:22px auto 0;max-width:560px;color:rgba(255,255,255,.78);font-size:17px}
.bigcta .btns{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:42px}

/* ── 서브 히어로 ── */
.subhero{position:relative;height:72vh;min-height:520px;max-height:760px;color:#fff;overflow:hidden;background:var(--ink)}
.subhero .bg{position:absolute;inset:-6% 0;background-size:cover;background-position:center;animation:kb2 14s ease-out both;will-change:transform}
@keyframes kb2{from{transform:scale(1.14)}to{transform:scale(1)}}
.subhero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,9,.55),rgba(8,8,9,.2) 40%,rgba(8,8,9,.78))}
.subhero .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:70px}
.subhero .kick{color:var(--cu2)}
.subhero h1{font-size:clamp(38px,5.4vw,72px);font-weight:700;letter-spacing:-.04em;line-height:1.1;margin-top:16px;animation:fade 1.2s .2s both}
.subhero h1 .en{font-style:italic;font-weight:500;color:var(--cu2);letter-spacing:0}
.subhero p{margin-top:14px;font-size:17px;color:rgba(255,255,255,.78);max-width:620px;animation:fade 1.2s .35s both}
.crumbs{position:absolute;right:28px;bottom:74px;z-index:2;font-size:12px;letter-spacing:.14em;color:rgba(255,255,255,.6)}

/* 서브 페이지 탭(메뉴 칩) */
.tabs{position:sticky;top:76px;z-index:50;background:var(--paper);border-bottom:1px solid var(--line)}
.tabs .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.tabs .wrap::-webkit-scrollbar{display:none}
.tabs a{flex:none;padding:18px 16px;font-size:14px;color:var(--tx3);font-weight:600;position:relative;white-space:nowrap}
.tabs a.on{color:var(--tx)}.tabs a.on::after{content:"";position:absolute;left:16px;right:16px;bottom:-1px;height:2px;background:var(--cu)}
.tabs a:hover{color:var(--tx)}

/* 표·스펙 */
.spec{display:grid;grid-template-columns:1fr;border-top:2px solid var(--tx)}
.spec div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:20px 4px;border-bottom:1px solid var(--line);font-size:15.5px}
.spec dt{color:var(--tx3);font-size:14px;font-weight:600}
.spec dd{font-weight:600}
.tbl-wrap{overflow-x:auto;border-top:2px solid var(--tx)}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px;font-variant-numeric:tabular-nums}
.tbl th{font-size:13px;color:var(--tx3);font-weight:600;padding:14px 10px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl td{padding:15px 10px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.tbl td:first-child{font-weight:700}
.tbl tr:hover td{background:rgba(196,106,54,.05)}
.tbl small{color:var(--tx3);margin-left:4px}
.tbl tfoot td{font-weight:700;border-bottom:0}
.note{font-size:13px;color:var(--tx3);margin-top:18px;line-height:1.7}

/* 이미지 그리드 */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pic{overflow:hidden;position:relative;background:#111}
.pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.pic:hover img{transform:scale(1.04)}
.pic figcaption,.pic .cp{position:absolute;left:0;bottom:0;right:0;padding:16px 18px;color:#fff;font-size:13.5px;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent)}
.r169{aspect-ratio:16/9}.r43{aspect-ratio:4/3}.r45{aspect-ratio:4/5}.r11{aspect-ratio:1}
.full{position:relative;overflow:hidden}
.full img{width:100%;height:auto}
.cap2{font-size:13px;color:var(--tx3);margin-top:12px}

/* 교차 배치(이미지+글) */
.alt{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center;margin-top:100px}
.alt:first-child{margin-top:0}
.alt.rev .pic{order:2}
.alt h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.03em;line-height:1.3;margin-top:14px}
.alt p{color:var(--tx2);margin-top:14px}
.alt ul{list-style:none;margin-top:20px;border-top:1px solid var(--line)}
.alt ul li{padding:12px 0 12px 22px;border-bottom:1px solid var(--line);position:relative;font-size:15px}
.alt ul li::before{content:"";position:absolute;left:0;top:23px;width:10px;height:1px;background:var(--cu)}
.dark .alt p{color:rgba(255,255,255,.72)}.dark .alt ul,.dark .alt ul li{border-color:var(--lineW)}

/* 평면 탭 */
.ptabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.ptabs button{padding:10px 20px;border-radius:999px;border:1px solid var(--line);font-size:14px;font-weight:600;background:#fff;transition:.25s}
.ptabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.plan{display:none;background:#fff;padding:30px;border:1px solid var(--line)}
.plan.on{display:block;animation:fade .6s both}

/* 브랜드 칩(인테리어) */
.brands{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--lineW)}
.brands div{padding:34px 26px 34px 0;border-bottom:1px solid var(--lineW)}
.brands b{font-family:var(--serif);font-size:26px;font-weight:600;letter-spacing:.02em;display:block}
.brands span{display:block;font-size:14px;color:rgba(255,255,255,.66);margin-top:6px}

/* 갤러리 벽 */
.wall{columns:3;column-gap:16px}
.wall .gal-item{break-inside:avoid;margin-bottom:16px;cursor:zoom-in;position:relative;overflow:hidden}
.wall .gal-item img{width:100%;transition:transform 1s var(--ease)}
.wall .gal-item:hover img{transform:scale(1.04)}
.wall .gal-item span{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;font-size:13px;color:#fff;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent);opacity:0;transition:opacity .3s}
.wall .gal-item:hover span{opacity:1}
.lb{position:fixed;inset:0;background:rgba(6,6,7,.96);z-index:3000;display:none;align-items:center;justify-content:center}
.lb.on{display:flex}
.lb img{max-width:90vw;max-height:82vh;object-fit:contain}
.lb .cap{position:absolute;bottom:28px;left:0;right:0;text-align:center;color:rgba(255,255,255,.8);font-size:14px}
.lb .x{position:absolute;top:22px;right:24px;width:48px;height:48px;border-radius:50%;border:1.5px solid #fff;color:#fff;font-size:22px}
.lb .a{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;border:1px solid rgba(255,255,255,.4);color:#fff;font-size:26px}
.lb .prev{left:24px}.lb .next{right:24px}

/* 파노라마 */
.pano{position:relative;overflow:hidden;background:#fff}
.pano img{width:100%;height:auto}
.pano .bar{position:absolute;left:4%;right:4%;top:14%;display:flex;align-items:center;gap:12px;color:var(--ink)}
.pano .bar::before,.pano .bar::after{content:"";flex:1;height:1px;background:var(--cu)}
.pano .bar b{font-size:clamp(16px,2vw,26px);letter-spacing:-.02em;background:#fff;padding:4px 14px}

/* 이전/다음 */
.pnav{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.pnav a{padding:44px 28px;display:flex;flex-direction:column;gap:6px;transition:background .3s}
.pnav a:hover{background:var(--bone)}
.pnav a+a{text-align:right;border-left:1px solid var(--line)}
.pnav small{font-size:12px;letter-spacing:.2em;color:var(--tx3)}
.pnav b{font-size:22px;letter-spacing:-.02em}

/* 상담 폼 페이지 */
.form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;background:#fff;box-shadow:0 40px 80px rgba(0,0,0,.08)}
.form-wrap .side{position:relative;min-height:560px;color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.form-wrap .side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.45)}
.form-wrap .side>*:not(img){position:relative}
.form-wrap .side h3{font-size:30px;letter-spacing:-.03em;line-height:1.3}
.form-wrap .side .ways{margin-top:22px;display:grid;gap:10px}
.form-wrap .side .ways a,.form-wrap .side .ways button{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border:1px solid rgba(255,255,255,.35);font-size:15px;font-weight:600;color:#fff;width:100%;text-align:left}
.form-wrap .side .ways a:hover,.form-wrap .side .ways button:hover{background:rgba(255,255,255,.12)}
.ipf{padding:48px}
.ipf .seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-bottom:26px}
.ipf .seg button{padding:14px;font-size:15px;font-weight:700;color:var(--tx3)}
.ipf .seg button.on{background:var(--ink);color:#fff}
.ipf label{display:block;font-size:13px;font-weight:700;color:var(--tx2);margin:18px 0 8px}
.ipf input,.ipf textarea,.ipf select{width:100%;border:0;border-bottom:1px solid #cfc8bf;padding:12px 2px;font-size:16px;font-family:inherit;background:transparent;color:var(--tx);border-radius:0}
.ipf input:focus,.ipf textarea:focus{outline:none;border-color:var(--cu)}
.ipf textarea{min-height:80px;resize:vertical}
.ipf .chip-row{display:flex;flex-wrap:wrap;gap:8px}
.ipf .chip-row button{padding:9px 16px;border:1px solid var(--line);border-radius:999px;font-size:14px}
.ipf .chip-row button.on{background:var(--cu);border-color:var(--cu);color:#fff}
.ipf .agree{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-size:13.5px;color:var(--tx2)}
.ipf .agree input{width:18px;height:18px;margin-top:2px;flex:none}
.ipf .err{color:#c0392b;font-size:13.5px;margin-top:12px;display:none}
.ipf .go{width:100%;margin-top:22px;height:58px;background:var(--cu);color:#fff;font-size:16px;font-weight:700;border-radius:999px;transition:background .25s}
.ipf .go:hover{background:#d27a45}
.ipf .done{display:none;text-align:center;padding:60px 0}
.ipf .done b{display:block;font-size:26px;letter-spacing:-.03em}
.ipf .done p{color:var(--tx2);margin-top:10px}

/* ── 푸터 ── */
footer{background:var(--ink);color:rgba(255,255,255,.62);padding:80px 0 120px;font-size:13.5px}
footer .fb{font-family:var(--serif);font-size:30px;color:#fff;letter-spacing:.06em}
footer .fb b{color:var(--cu2);font-weight:500;font-style:italic}
footer .fnav{display:flex;flex-wrap:wrap;gap:6px 22px;margin:26px 0;font-size:14px}
footer .fnav a:hover{color:#fff}
footer .info{display:flex;flex-wrap:wrap;gap:6px 20px}
footer .dis{margin-top:22px;font-size:12px;line-height:1.8;color:rgba(255,255,255,.42);max-width:900px}
footer [data-dbd-admin]{color:rgba(255,255,255,.55)!important;opacity:1!important;max-width:var(--wrap);margin:18px auto 0!important;padding:0 28px;font-size:12px}

/* ── 컨택 크롬(하단 바·모달·토스트·로더) ── */
.fbar{position:fixed;left:0;right:0;bottom:0;z-index:900;display:none;grid-template-columns:1fr 1.25fr 1fr;background:var(--ink);border-top:1px solid var(--lineW);padding-bottom:env(safe-area-inset-bottom,0px)}
.fbar a,.fbar button{height:60px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;text-align:center;line-height:1.2}
.fbar .kko{background:#fee500;color:#191919}
.fbar #fbarInt{background:var(--cu)}
.dim{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:2000;display:none}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(460px,calc(100vw - 32px));max-height:90vh;overflow:auto;background:#fff;z-index:2001;display:none}
.modal .mh{background:var(--ink);color:#fff;padding:30px 30px 26px}
.modal .mh .en{font-style:italic;color:var(--cu2);font-size:15px}
.modal .mh h3{font-size:24px;margin-top:6px;letter-spacing:-.03em}
.modal .mh p{font-size:14px;color:rgba(255,255,255,.7);margin-top:8px}
.modal .mb{padding:24px 30px 30px}
.modal label{display:block;font-size:13px;font-weight:700;color:var(--tx2);margin:14px 0 6px}
.modal input,.modal textarea{width:100%;border:0;border-bottom:1px solid #cfc8bf;padding:10px 2px;font-size:16px;font-family:inherit}
.modal input:focus,.modal textarea:focus{outline:none;border-color:var(--cu)}
.modal textarea{min-height:70px;resize:vertical}
.modal .chkrow{display:flex;gap:8px;align-items:center;margin-top:16px;font-size:13.5px}
.modal .mErr{color:#c0392b;font-size:13px;margin-top:10px;display:none}
.modal .msub{width:100%;height:54px;margin-top:18px;background:var(--cu);color:#fff;font-size:16px;font-weight:700;border-radius:999px}
.modal .mclose{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;border:1.5px solid rgba(255,255,255,.8);color:#fff;font-size:20px}
.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:14px 22px;border-radius:999px;font-size:14px;opacity:0;pointer-events:none;transition:.35s;z-index:2500}
.toast.on{opacity:1;transform:translate(-50%,0)}
.loadov{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:2600;display:none;align-items:center;justify-content:center}
.loadov .sp{width:44px;height:44px;border-radius:50%;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── 반응형 ── */
@media (max-width:1100px){
  .nav{gap:18px}.nav a{font-size:13px}
  .sig{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:980px){
  .nav{position:fixed;inset:76px 0 0;background:var(--ink);flex-direction:column;align-items:flex-start;gap:0;padding:20px 28px 40px;transform:translateX(100%);transition:transform .45s var(--ease);overflow:auto}
  .nav.open{transform:none}
  .nav a{font-size:22px;font-weight:700;padding:14px 0;width:100%;border-bottom:1px solid var(--lineW)}
  .nav a::after{display:none}
  .nav a.cta{margin:20px 0 0;border-radius:999px;text-align:center;justify-content:center;display:flex;font-size:17px;padding:14px}
  .burger{display:flex}
  .intro,.stack,.loc,.alt,.form-wrap{grid-template-columns:1fr;gap:40px}
  .alt.rev .pic{order:0}
  .svc{grid-template-columns:1fr 1fr}
  .hero .tower{display:none}
  .stack .view{min-height:360px;order:-1}
  .brands{grid-template-columns:1fr 1fr}
  .wall{columns:2}
}
@media (max-width:640px){
  .wrap{padding:0 20px}
  .hd{height:64px}
  .tabs{top:64px}
  .nav{inset:64px 0 0}
  .brand .bw{font-size:18px}
  .sec{padding:84px 0}
  .hero{min-height:620px}
  .hero::after{background:linear-gradient(180deg,rgba(8,8,9,.45) 0%,rgba(8,8,9,.25) 35%,rgba(8,8,9,.85) 100%)}
  .hero-in{justify-content:flex-end;padding-bottom:200px}
  .hero .sub{font-size:14.5px}
  .hero .hero-cta{margin-top:28px;gap:8px}
  .hero .hero-cta>a,.hero .hero-cta>button{height:48px;padding:0 18px;font-size:14px;flex:1 1 calc(50% - 8px)}
  .hero .hud{bottom:150px;left:auto;right:0}.hero .hud .wrap{justify-content:flex-end}.hero .cap,.hero .bars{display:none}
  .scrollcue{display:none}
  .sig{grid-template-columns:1fr 1fr}
  .sig a{padding:20px 18px;aspect-ratio:3/4.4}
  .sig .no{top:16px;left:18px}
  .sig p{display:none}
  .svc{grid-template-columns:1fr 1fr;gap:10px}
  .svc .c{min-height:230px;padding:16px}
  .svc .c h3{font-size:16px}
  .svc .c .en{font-size:12.5px}
  .svc .c ul{font-size:12.5px}
  .spec{grid-template-columns:1fr}
  .spec div{grid-template-columns:100px 1fr}
  .duo,.trio{grid-template-columns:1fr}
  .hg figure{flex-basis:84vw}
  .stack li{grid-template-columns:80px 1fr;padding:18px 4px}
  .stack li .ar{display:none}
  .subhero{height:62vh;min-height:440px}
  .subhero .wrap{padding-bottom:46px}
  .crumbs{display:none}
  .intro .stat{grid-template-columns:1fr 1fr 1fr}
  .bigcta{padding:110px 0}
  .brands{grid-template-columns:1fr}
  .wall{columns:1}
  .pnav a{padding:30px 20px}.pnav b{font-size:17px}
  .ipf,.form-wrap .side{padding:30px 22px}
  .form-wrap .side{min-height:360px}
  .fbar{display:grid}
  footer{padding-bottom:140px}
  .lb .a{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html.js .rv{opacity:1;transform:none}
  .marq .tr{animation:none}
}