@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600&family=Noto+Serif+KR:wght@400;500;600&display=swap');
:root{--ink:#202521;--muted:#6e756e;--paper:#f7f6f2;--cream:#ece9e0;--line:#d8d9d0;--white:#fff;--dark:#191c1a;--serif:'Noto Serif KR',serif;--sans:'Noto Sans KR',sans}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.7}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;height:100%;object-fit:cover}figure,h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}::selection{background:#b2b9ae;color:#121712}
.site-header{position:absolute;z-index:20;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:27px 5vw;color:#fff}.wordmark{display:flex;align-items:center;gap:14px;white-space:nowrap}.wordmark span{font:500 27px/1 var(--serif);letter-spacing:.12em}.wordmark small{font:500 12px/1.2 var(--sans);letter-spacing:.22em}.site-header nav{display:flex;gap:32px;font-size:14px;letter-spacing:.015em}.site-header a:hover,.site-header a:focus-visible{opacity:.68}.site-header a:focus-visible,.branch-card:focus-visible,.gallery-open:focus-visible,.return-button:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.hero{height:min(850px,100svh);min-height:650px;position:relative;display:grid;place-items:center;background:#252d2d;color:#fff;overflow:hidden;text-align:center}.hero-photo,.hero-shade{position:absolute;inset:0}.hero-photo img{object-position:50% 45%;filter:saturate(.7)}.hero-shade{background:linear-gradient(180deg,rgba(13,19,17,.42),rgba(12,17,15,.28) 40%,rgba(11,16,14,.65))}.image-caption{position:absolute;right:5vw;bottom:26px;font-size:12px;letter-spacing:.09em;color:rgba(255,255,255,.8)}.hero-copy{position:relative;z-index:1;padding:100px 24px 80px;text-shadow:0 2px 18px rgba(0,0,0,.2)}.hero-index,.eyebrow,.card-number,.small-note,.scroll-cue,.branch-status{font-size:12px;letter-spacing:.18em;font-weight:500}.hero h1{font:400 clamp(98px,15vw,215px)/1.3 var(--serif);letter-spacing:.16em;margin:18px 0 6px;padding-left:.16em}.hero-en{font-size:clamp(21px,2.5vw,31px);letter-spacing:.35em;font-weight:300;padding-left:.35em}.hero-rule{width:44px;height:1px;background:#fff8;margin:42px auto 29px}.hero-meaning{font-size:16px;line-height:1.8;font-weight:300}.scroll-cue{position:absolute;bottom:24px;left:5vw;z-index:2;display:flex;align-items:center;gap:20px;color:#fff}.scroll-cue span:last-child{font-size:24px;line-height:1}
.section{padding:130px max(5vw,28px);scroll-margin-top:30px}.eyebrow{color:#7c877d;margin-bottom:30px}.section h2{font:400 clamp(31px,3.4vw,55px)/1.42 var(--serif);letter-spacing:-.045em}.body-copy{font-size:17px;font-weight:300;line-height:2;max-width:575px;color:#545b55}.section-heading h2{max-width:680px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:51px}.section-intro{max-width:290px;color:var(--muted);font-size:15px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:center;background:#f8f8f5;min-height:720px}.about-text{padding:30px 0 30px 6vw}.about-text h2{max-width:550px;margin-bottom:35px}.fine-line{width:38px;height:1px;background:#a3a99e;margin:45px 0 21px}.small-note{color:var(--muted)}.about-visual{height:565px;position:relative}.about-visual figcaption,.process-visual figcaption,.branch-hero-image figcaption{font-size:12px;color:#7c837c;margin-top:10px;text-align:right}.image-placeholder{height:100%;width:100%;background:linear-gradient(145deg,#e9e9e1,#dadcd3);color:#80887f;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;font-size:12px;letter-spacing:.22em}.placeholder-mark{font:400 45px var(--serif);letter-spacing:.14em;color:#a0a79e}
.details{background:var(--cream)}.detail-grid,.branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.detail-image{height:clamp(310px,34vw,480px);overflow:hidden}.detail-card:nth-child(2) .image-placeholder{background:linear-gradient(135deg,#e0e1da,#d1d5cd)}.detail-card:nth-child(3) .image-placeholder{background:linear-gradient(135deg,#e8e5db,#d5d7ce)}.card-meta{padding:22px 0 0;display:flex;gap:22px;align-items:start}.card-number{color:#899088;white-space:nowrap;padding-top:4px}.card-meta h3,.branch-meta h3{font:400 24px/1.4 var(--serif);margin-bottom:6px}.card-meta p{font-size:14px;color:var(--muted)}
.branches{background:#fafaf7}.branch-image{height:clamp(340px,42vw,550px);overflow:hidden;position:relative;background:#d8d8d0}.branch-image img{transition:transform .65s ease;object-position:center}.branch-card:hover img,.branch-card:focus-visible img{transform:scale(1.045)}.view-overlay{position:absolute;inset:auto 0 0;background:linear-gradient(transparent,rgba(0,0,0,.54));color:#fff;padding:60px 21px 18px;display:flex;justify-content:space-between;font-size:14px;opacity:0;transition:opacity .2s}.branch-card:hover .view-overlay,.branch-card:focus-visible .view-overlay{opacity:1}.branch-meta{padding:21px 0}.branch-meta h3{margin:11px 0 15px;display:flex;justify-content:space-between;gap:8px}.branch-meta h3 span{font:400 20px var(--sans)}.branch-bottom{display:flex;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-top:13px;font-size:13px;color:var(--muted)}.status{color:#586459}
.process{background:#e5e7df}.process-layout{display:grid;grid-template-columns:1.1fr .8fr;gap:10vw;align-items:center}.process-main .body-copy{margin:32px 0 65px}.steps{border-top:1px solid #bcc2ba}.step{display:grid;grid-template-columns:50px 100px 1fr;gap:14px;align-items:center;padding:22px 0;border-bottom:1px solid #bcc2ba}.step span{font-size:12px;color:#69756c}.step h3{font:400 21px var(--serif)}.step p{font-size:14px;color:#59635b}.process-visual{height:600px}.achievements{margin-top:60px;border-top:1px solid #bcc2ba;display:flex;gap:70px;padding-top:30px}.achievements>div{display:flex;flex-direction:column;gap:8px}.achievements strong{font:400 32px var(--serif)}
.contact{background:var(--dark);color:#f2f2eb;min-height:580px;display:grid;grid-template-columns:1fr .8fr;gap:12vw;align-items:center}.contact .eyebrow{color:#a5b2a4}.contact h2{font-size:clamp(38px,4vw,64px)}.contact-lead{margin-top:42px;color:#bbc4bb;font-size:17px}.contact-info h3{font-size:13px;letter-spacing:.18em;margin-bottom:18px}.contact-row{border-bottom:1px solid #515950;padding:17px 0;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:15px}.contact-row span{color:#aab4aa}.contact-row em{font-style:normal;color:#879387}.contact-row strong{font-weight:400}.contact-row a{text-decoration:underline;text-decoration-color:#7b897b;text-underline-offset:4px;overflow-wrap:anywhere}.site-footer{background:var(--dark);color:#969e96;border-top:1px solid #474e47;padding:27px 5vw 40px;display:flex;justify-content:space-between;gap:20px;font-size:12px;letter-spacing:.17em}.site-footer span:first-child{color:#e9ece5}.site-footer i{font-style:normal;margin:0 9px}
.branch-page{background:#f7f6f2}.branch-page+.site-footer{background:#f7f6f2;color:#8b928b;border-color:var(--line)}.branch-page+.site-footer span:first-child{color:var(--ink)}.branch-hero{display:grid;grid-template-columns:42% 58%;min-height:750px;background:#202521;color:#fff}.branch-hero-copy{padding:140px 6vw 60px 8vw;display:flex;flex-direction:column;align-items:start}.back-link{font-size:14px;margin-bottom:auto;color:#cad2c9}.back-link span{margin-right:10px}.branch-hero-copy .eyebrow{color:#acb9ac;margin:60px 0 18px}.branch-hero h1{font:400 clamp(42px,5vw,76px)/1.2 var(--serif);letter-spacing:-.05em}.branch-description{font-size:17px;font-weight:300;color:#d2d8d0;line-height:1.9;max-width:375px;margin:26px 0 50px}.branch-status{display:inline-block;border:1px solid #667064;color:#c7d0c6;padding:9px 18px}.branch-hero-image{position:relative;height:750px;overflow:hidden}.branch-hero-image figcaption{position:absolute;bottom:22px;right:28px;color:#fff;background:#1118;padding:3px 10px}.branch-hero-image img{object-position:center}
.gallery-section{padding:110px 5vw 140px}.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:45px}.gallery-heading h2{font:400 clamp(31px,3.5vw,50px) var(--serif)}.gallery-heading p:last-child{font-size:15px;color:var(--muted)}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.gallery-item>.image-placeholder,.gallery-open{height:380px;width:100%;border:0;padding:0}.gallery-open{cursor:zoom-in;overflow:hidden}.gallery-open img{transition:transform .4s}.gallery-open:hover img{transform:scale(1.04)}.gallery-text{display:flex;gap:22px;padding:20px 0}.gallery-text>span{font-size:12px;color:#879188}.gallery-text h3{font:400 20px var(--serif);margin-bottom:5px}.gallery-text p{font-size:14px;color:var(--muted)}.return-button{display:inline-block;margin-top:70px;border:1px solid #aeb5ab;padding:14px 25px;font-size:14px;transition:background .2s,color .2s}.return-button:hover{background:var(--ink);color:#fff}.lightbox{border:0;background:#1b201d;color:#fff;max-width:min(92vw,1100px);max-height:92vh;padding:45px 30px 20px;text-align:center}.lightbox::backdrop{background:#080d0be6}.lightbox img{max-height:70vh;object-fit:contain}.lightbox p{font-size:15px;margin-top:14px}.lightbox-close{position:absolute;right:10px;top:2px;color:#fff;background:none;border:0;font-size:30px;cursor:pointer}.not-found{min-height:85vh;padding:200px 5vw 100px;background:#202521;color:#fff}.not-found h1{font:400 40px var(--serif)}
@media(max-width:900px){.section{padding:95px 5vw}.about{gap:5vw}.about-text{padding-left:0}.process-layout{gap:5vw}.step{grid-template-columns:35px 70px 1fr}.branch-hero-copy{padding-left:5vw}.gallery-item>.image-placeholder,.gallery-open{height:300px}}
@media(max-width:700px){.site-header{padding:18px 5vw;align-items:start}.wordmark{gap:7px;flex-direction:column;align-items:start}.wordmark span{font-size:24px}.wordmark small{font-size:10px}.site-header nav{gap:14px;flex-wrap:wrap;justify-content:end;max-width:205px;font-size:12px}.hero{height:760px;min-height:610px;max-height:95svh}.hero-photo img{object-position:center}.hero h1{font-size:clamp(83px,19vw,135px)}.hero-en{font-size:21px}.hero-meaning{font-size:14px;max-width:280px;margin:auto}.hero-index{font-size:10px}.scroll-cue{bottom:22px}.image-caption{bottom:25px;font-size:10px}.section{padding:82px 6vw}.section h2{font-size:34px}.section-top,.gallery-heading{display:block;margin-bottom:30px}.section-intro,.gallery-heading p:last-child{margin-top:18px;max-width:none}.about{display:flex;flex-direction:column;align-items:stretch;gap:35px}.about-text h2{margin-bottom:22px}.about-visual{height:420px}.body-copy{font-size:16px}.detail-grid,.branch-grid,.gallery-grid{grid-template-columns:1fr;gap:42px}.detail-image{height:410px}.branch-image{height:510px}.view-overlay{opacity:1}.process-layout{grid-template-columns:1fr;gap:45px}.process-main .body-copy{margin:24px 0 38px}.process-visual{height:440px}.contact{min-height:0;grid-template-columns:1fr;gap:65px}.contact-lead{margin-top:24px}.site-footer{padding:25px 6vw 35px;flex-direction:column;gap:8px}.branch-hero{display:flex;flex-direction:column}.branch-hero-copy{padding:110px 6vw 50px;min-height:450px}.branch-hero-copy .eyebrow{margin:50px 0 14px}.branch-hero h1{font-size:53px}.branch-hero-image{height:570px}.gallery-section{padding:80px 6vw 100px}.gallery-item>.image-placeholder,.gallery-open{height:390px}.return-button{margin-top:35px}}
@media(max-width:390px){.site-header nav{gap:8px;max-width:170px;font-size:11px}.hero h1{font-size:79px}.hero-en{font-size:18px}.branch-image{height:440px}.detail-image{height:350px}.step{grid-template-columns:27px 58px 1fr;gap:8px}.step h3{font-size:18px}.step p{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.about-text h2,.process-main .section-heading h2{white-space:pre-line;letter-spacing:-.055em}
.about-text .body-copy{white-space:pre-line;max-width:none}
@media(min-width:901px){.about{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:5vw}.about-text{padding-left:0}}
.about-image{object-position:54% center}
.detail-image{height:auto;aspect-ratio:16/10}
.gallery-group+.gallery-group{margin-top:76px}
.gallery-group-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:0 0 16px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.gallery-group-heading h3{font:400 clamp(23px,2.4vw,32px) var(--serif)}
.gallery-group-heading span{font-size:12px;letter-spacing:.18em;color:var(--muted)}
.gallery-item>.image-placeholder,.gallery-open{height:auto;aspect-ratio:16/10;display:block;background:#e5e7df}
.gallery-open img{height:100%;object-fit:cover}
@media(max-width:700px){.detail-image{height:auto;aspect-ratio:16/10}.gallery-item>.image-placeholder,.gallery-open{height:auto;aspect-ratio:16/10}.gallery-group+.gallery-group{margin-top:58px}}
/* Keep the full family and wall projection visible in the wide brand image. */
.about-visual{height:auto}
.about-image{height:auto;object-fit:contain;object-position:center}
@media(min-width:901px){.about{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}
@media(min-width:701px) and (max-width:900px){.about{grid-template-columns:1fr;gap:36px}}
.process-heading .section-heading h2{white-space:pre-line;letter-spacing:-.055em}
.process-intro{max-width:none;margin:28px 0 54px}
@media(min-width:901px){.process-intro{white-space:nowrap}}
@media(max-width:700px){.process-intro{margin:24px 0 38px}}

/* Keep editorial line breaks on wide screens; let smaller screens reflow the copy. */
@media(min-width:701px) and (max-width:1200px){
  .about{grid-template-columns:1fr;gap:36px}
  .about-text{padding:0}
}
@media(max-width:1100px){
  .process-intro{white-space:normal}
}
@media(max-width:700px){
  .section h2{font-size:clamp(27px,7.8vw,34px);line-height:1.45}
  .about-text h2,.process-heading .section-heading h2{white-space:pre-line}
  .about-text .body-copy{white-space:normal;max-width:40em;word-break:keep-all;overflow-wrap:break-word}
  .process-intro{word-break:keep-all;overflow-wrap:break-word}
  .contact h2{font-size:clamp(27px,7.8vw,38px)}
  .contact-row>*:last-child{min-width:0;text-align:right}
  .branch-hero h1{font-size:clamp(36px,9vw,53px)}
}
@media(max-width:390px){
  .contact-row{display:grid;grid-template-columns:1fr;gap:3px;align-items:start}
  .contact-row>*:last-child{text-align:left}
}