/* Photography leads; movement follows the visitor's scroll. */
:root{--accent:#e7462c;--hero-progress:0;--hero-shift:0px;--hero-scale:1.06;--hero-inset:0px}
html{scroll-padding-top:100px}
.site-header{position:sticky;top:0;z-index:25;height:76px;background:#fffffff5;backdrop-filter:blur(12px);border-bottom:1px solid #00000012}
.scroll-progress{position:absolute;bottom:-1px;left:0;width:100%;height:3px;background:var(--accent);transform:scaleX(var(--read-progress,0));transform-origin:left;pointer-events:none}
.hero{padding:0;background:#f0f0ec;overflow:hidden}
.hero-index{margin:0 var(--pad);border:0;padding:22px 0;font-size:12px;min-height:66px}
.hero-index>span{font-weight:600}
.hero-index p{font-size:13px}
.hero-images{display:block;height:min(670px,calc(100svh - 180px));min-height:440px;padding:0;clip-path:inset(0 var(--hero-inset));will-change:clip-path}
.hero-main{height:100%;isolation:isolate}
.hero-main img{filter:saturate(.72);object-position:57% 43%;transform:translateY(var(--hero-shift)) scale(var(--hero-scale));will-change:transform}
.hero-main:after{inset:0;background:linear-gradient(90deg,#0007,transparent 80%),linear-gradient(0deg,#000b,transparent 70%)}
.hero-side{display:none}
.hero-title{left:var(--pad);right:var(--pad);bottom:11%;display:block;transform:none}
.hero-title h1{font-size:clamp(43px,5.7vw,82px);line-height:1.13;letter-spacing:-.045em;font-weight:600;max-width:900px;text-shadow:0 2px 20px #0002}
.hero-title p{font-size:15px;line-height:1.8;margin-top:25px;color:#fff;max-width:350px}
.hero-footer{padding:16px var(--pad);font-size:11px}
.about{padding-top:105px;padding-bottom:85px}
.about-grid{grid-template-columns:1.25fr 1fr;gap:10%}
.about-grid h2{font-size:clamp(35px,4.7vw,68px)}
.word-reveal{display:inline-block;clip-path:inset(0 0 -10%);vertical-align:bottom}
.word-reveal>span{display:inline-block}
.motion-enabled .word-reveal>span{transform:translateY(110%);transition:transform .85s cubic-bezier(.2,.75,.2,1);transition-delay:var(--word-delay,0ms)}
.motion-enabled .is-visible .word-reveal>span{transform:none}
.practice-line{position:relative;border-top:1px solid #d4d4d0;margin-top:60px;padding-top:35px}
.motion-enabled .practice-line>span{color:#b8b8b3;transition:color .3s}
.motion-enabled .practice-line>span.is-active{color:#000}
.practice-line>i{transition:transform .5s}
.practice-line>i.is-active{transform:rotate(45deg)}
.programs{background:#fff;padding-top:65px;border-top:1px solid #e5e5e0}
.program-image{height:470px}
.program-panel{background:#f0f0ec;padding:16px}
.program-caption{padding:20px 8px 8px}
.program-image.switching img{animation:photo-wipe .7s cubic-bezier(.2,.65,.25,1) both}
@keyframes photo-wipe{from{clip-path:inset(0 100% 0 0);transform:scale(1.08)}to{clip-path:inset(0);transform:scale(1)}}
.archive{background:#171b1a;padding-top:65px;padding-bottom:55px}
.archive .section-heading{margin-bottom:35px}
.archive-track img{filter:saturate(.82)}
.archive-track figcaption{color:#bdbdbd}
.archive-track button{position:relative}
.archive-track button:after{content:'사진 보기 ';position:absolute;bottom:18px;right:18px;background:#fff;color:#000;padding:9px 12px;font-size:11px;opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s}
.archive-track button:hover:after,.archive-track button:focus-visible:after{opacity:1;transform:none}
.fees{padding-top:85px}
.beyond-photo{overflow:hidden}
.motion-enabled .beyond-photo img{clip-path:inset(18% 12%);transform:scale(1.16);transition:clip-path 1.2s cubic-bezier(.2,.65,.2,1),transform 1.6s cubic-bezier(.2,.65,.2,1)}
.motion-enabled .beyond-photo.is-visible img{clip-path:inset(0);transform:scale(1)}
.contact-main h2{font-size:clamp(60px,8vw,118px)}
.footer-wordmark{font-size:clamp(80px,12vw,180px);padding-top:40px}
@media(min-width:1000px) and (min-height:780px){
 .motion-enabled .archive{height:210svh;padding-top:0;padding-bottom:0;overflow:clip}
 .motion-enabled .archive-pin{position:sticky;top:100px;padding-top:32px;padding-bottom:32px}
 .motion-enabled .archive .section-heading h2{font-size:50px}
 .motion-enabled .archive-track{scroll-snap-type:none;scrollbar-width:none}
 .motion-enabled .archive-track img{height:min(350px,39svh)}
 .motion-enabled .archive-small img{height:min(270px,30svh)}
 .motion-enabled .archive-medium img{height:min(320px,36svh)}
 .motion-enabled .archive-small{padding-top:65px}
 .motion-enabled .archive-instagram{margin-top:10px}
}
@media(max-width:999px){.hero-images{min-height:390px}.program-image{height:390px}.archive .section-heading h2{font-size:38px}}
@media(max-width:760px){
 html{scroll-padding-top:90px}
 .site-header{height:68px;gap:18px}
 .mobile-nav{position:fixed;top:68px;max-height:calc(100dvh - 68px);overflow:auto}
 .hero-index{min-height:70px;padding:14px 0;gap:8px}
 .hero-index p{font-size:11px}
 .hero-index a{font-size:11px}
 .hero-images{height:570px;min-height:0;max-height:76svh;clip-path:none}
 .hero-main img{object-position:72% 43%;transform:translateY(var(--hero-shift)) scale(var(--hero-scale))}
 .hero-main:after{background:linear-gradient(0deg,#000c,transparent 85%)}
 .hero-title{left:6%;right:6%;bottom:9%}
 .hero-title h1{font-size:clamp(33px,9.7vw,44px);line-height:1.16}
 .hero-title p{font-size:13px;margin-top:22px}
 .hero-footer{font-size:10px;padding-top:12px;padding-bottom:12px}
 .about{padding-top:65px;padding-bottom:55px}
 .about-grid{grid-template-columns:1fr;gap:28px}
 .about-grid h2{font-size:clamp(29px,8.7vw,39px)}
 .about-copy{padding-left:8%}
 .about-copy>p:not(.lead){font-size:14px}
 .practice-line{margin-top:36px;padding-top:27px;font-size:clamp(26px,8vw,36px)}
 .practice-line i{font-size:19px}
 .programs{padding-top:50px;padding-bottom:50px}
 .program-panel{padding:10px}
 .program-image{height:300px}
 .program-caption{display:block;padding:16px 6px 6px}
 .program-caption p{font-size:13px}
 .program-caption .text-button{margin-top:12px;font-size:12px}
 .program-short{font-size:13px}
 .archive{padding-top:50px;padding-bottom:45px}
 .archive .section-heading h2{font-size:34px}
 .archive-controls button{width:40px;height:40px}
 .archive-track img{height:300px}
 .archive-small img{height:240px}
 .archive-medium img{height:280px}
 .fee-name p,.fee-detail p,.fee-note{font-size:11px}
 .fees-title p{font-size:12px}
 .contact-main h2{font-size:clamp(58px,17vw,78px)}
 .footer-wordmark{font-size:17vw}
 .copy-email{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 .hero-images{clip-path:none!important}
 .hero-main img{transform:none!important}
 .motion-enabled .word-reveal>span{transform:none!important}
 .motion-enabled .practice-line>span{color:#000!important}
 .motion-enabled .beyond-photo img{clip-path:none!important;transform:none!important}
 .motion-enabled .archive{height:auto!important;overflow:hidden!important}
 .motion-enabled .archive-pin{position:static!important}
}

/* Final direction: quiet surfaces, clear hierarchy, cinematic scroll. */
:root{--accent:#ededf0;--paper:#f5f5f7;--muted:#6e6e73;--line:#d2d2d7}
body{color:#1d1d1f}
.site-header{height:68px;background:#ffffffed;max-width:none}
.wordmark{font-size:23px}
.header-inquiry{background:var(--accent);color:#000;border-radius:24px;padding:10px 17px;gap:18px}
.header-inquiry:hover,.contact-cta:hover{background:#dedee3}
.hero{background:#fff;padding-bottom:30px}
.hero-index{justify-content:center;min-height:40px;padding:18px 0 0;margin:0;font-size:12px}
.hero-index>span,.hero-index>a{display:none}
.hero-index p{font-size:13px;color:var(--muted);font-weight:500}
.hero-title{position:static;color:#1d1d1f;text-align:center;padding:30px 5vw 44px;max-width:1000px;margin:auto}
.hero-title h1{font-size:clamp(42px,5.6vw,76px);font-weight:650;letter-spacing:-.045em;line-height:1.12;max-width:none;text-shadow:none}
.hero-title p{color:#6e6e73;font-size:18px;line-height:1.55;max-width:none;margin-top:22px;font-weight:400}
.hero-title p br{display:none}
.hero-images{height:54svh;min-height:350px;max-height:600px;border-radius:24px;max-width:1600px;margin:auto;clip-path:inset(0 var(--hero-inset) round 24px)}
.hero-main{border-radius:24px}
.hero-main:after{display:none}
.hero-main img{filter:saturate(.85);object-position:57% 43%}
.hero-footer{max-width:1600px;margin:auto;color:#86868b}
.about{padding-top:100px;padding-bottom:95px;max-width:1500px;margin:auto}
.section-kicker{color:var(--muted);font-size:13px}
.about-grid h2{font-size:clamp(34px,4.1vw,59px);font-weight:600;line-height:1.2}
.about-copy .lead{font-size:24px}
.practice-line{border-top:0;margin-top:55px;padding-top:0;font-size:clamp(35px,5vw,72px);font-weight:600}
.programs{background:#f5f5f7;border:0;padding-top:85px;padding-bottom:85px}
.programs .section-heading h2{font-size:clamp(34px,4vw,56px);font-weight:600}
.program-panel{border-radius:24px;padding:20px;background:#fff}
.program-image{border-radius:14px}
.program-name{font-weight:500}
.program-tab[aria-selected=true] .program-name{color:#000}
.program-tab{border-top-color:#d2d2d7}
.program-tab:last-child{border-bottom-color:#d2d2d7}
.inline-link,.text-button{color:#000;border-bottom:0}
.archive{background:#000;color:#f5f5f7}
.archive-track button{border-radius:18px}
.archive-track button:after{border-radius:20px}
.archive-controls button{border-radius:50%}
.archive-instagram{background:#ededf0;color:#000;border:0;border-radius:22px;padding:13px 18px}
.fees{background:white;padding-top:100px}
.fees h2,.beyond h2,.faq h2{font-size:clamp(32px,3.8vw,54px);font-weight:600}
.fee-list article{border-color:#d2d2d7}
.fee-list article>button{color:#000;font-size:13px}
.fee-list article:last-of-type{border-color:#d2d2d7}
.beyond-photo{border-radius:24px}
.beyond-photo>span{background:#ffffffeb;color:#1d1d1f;border-radius:20px;font-size:12px}
.faq{background:#f5f5f7;padding-top:75px;padding-bottom:75px}
.contact{background:white;color:#1d1d1f;padding-top:70px;padding-bottom:80px}
.contact-top{border:0;color:#6e6e73}
.contact-main{padding-top:25px}
.contact-main h2{font-size:clamp(50px,7.3vw,96px);font-weight:600;line-height:1.1}
.contact-main p{color:#6e6e73;font-size:18px;line-height:1.6}
.contact-cta{background:#ededf0;color:#000;border:0;border-radius:32px;font-size:16px;padding:17px 23px;margin:25px 0 20px}
.contact-cta span{font-size:24px}
.contact-main>div>a{color:#000}
.footer{background:#f5f5f7;padding-top:35px}
.footer-wordmark{font-size:44px;letter-spacing:-.06em;padding:35px 0 23px}
dialog{border-radius:22px}
.email-action{background:#ededf0;color:#000;border-radius:24px}
.copy-email{border-radius:24px;border-color:#d2d2d7}
@media(max-width:760px){
 .site-header{height:64px}
 .mobile-nav{top:64px}
 .hero-index{padding-top:22px;min-height:35px}
 .hero-index p{font-size:11px;flex-basis:auto}
 .hero-title{padding:24px 5vw 30px}
 .hero-title h1{font-size:clamp(32px,9.3vw,43px);line-height:1.16}
 .hero-title p{font-size:15px;margin-top:17px;max-width:320px;margin-left:auto;margin-right:auto;line-height:1.6}
 .hero-images{height:53svh;min-height:300px;max-height:460px;margin:0 14px;border-radius:18px;clip-path:none}
 .hero-main{border-radius:18px}
 .hero-main img{object-position:73% 43%}
 .hero-footer{padding:13px 20px}
 .hero{padding-bottom:5px}
 .about{padding-top:65px;padding-bottom:60px}
 .about-grid h2{font-size:clamp(29px,8.1vw,37px)}
 .about-copy{padding-left:0}
 .about-copy .lead{font-size:21px}
 .practice-line{margin-top:36px;font-size:clamp(26px,8vw,35px)}
 .programs{padding-top:60px;padding-bottom:60px}
 .programs .section-heading h2{font-size:35px}
 .program-panel{padding:12px;border-radius:20px}
 .program-image{height:285px}
 .fees{padding-top:65px}
 .fees h2,.beyond h2,.faq h2{font-size:34px}
 .faq{padding-top:55px;padding-bottom:55px}
 .contact{padding-top:50px;padding-bottom:55px}
 .contact-main h2{font-size:clamp(51px,15vw,67px)}
 .contact-main p{font-size:16px}
 .contact-main>div{margin-top:28px}
 .contact-cta{max-width:360px}
 .footer-wordmark{font-size:38px;padding-top:28px}
}

/* Keep faces inside the cinematic photo crop. */
@media(min-width:761px){.hero-main img{object-position:57% 10%}}

/* Text-only controls, using the Pickbridge homepage typeface. */
:root{--font:'Noto Sans KR','Malgun Gothic','Apple SD Gothic Neo',sans-serif}
.archive-controls button{width:auto;min-width:50px;padding:0 12px;font-size:12px}
.header-inquiry,.text-button,.inline-link,.contact-cta{gap:0}
.practice-line{gap:20px}
.program-name i:empty{display:none}
.about-grid h2{font-size:clamp(32px,3.8vw,55px)}
@media(max-width:760px){.about-grid h2{font-size:clamp(25px,7.6vw,34px)}.hero-title h1{font-size:clamp(30px,8.9vw,41px)}.contact-main h2{font-size:clamp(45px,14vw,64px)}}