.intro-active body{overflow:hidden}
.intro-seen .intro-screen{display:none}
.intro-screen{position:fixed;inset:0;z-index:50;display:grid;grid-template-rows:auto 1fr auto;overflow:hidden;isolation:isolate;background:#2b1b12;color:#f5ebda;min-height:100svh;clip-path:inset(0 0 0 0)}
.intro-screen{cursor:pointer}
.intro-panels{position:absolute;inset:0;z-index:-1;display:grid;grid-template-columns:repeat(4,1fr)}
.intro-panel{display:flex;align-items:end;justify-content:space-between;gap:15px;padding:28px;border-right:1px solid #dbc4a42a;background:linear-gradient(160deg,#3b281b,#29190f);color:#dfc9ad88;animation:intro-rise 900ms cubic-bezier(.2,.7,.2,1) both}
.intro-panel:nth-child(2){background:linear-gradient(160deg,#4c3020,#342012);animation-delay:90ms}
.intro-panel:nth-child(3){background:linear-gradient(160deg,#64422c,#392416);animation-delay:180ms}
.intro-panel:nth-child(4){background:linear-gradient(160deg,#50321f,#2b1a10);animation-delay:270ms;border-right:0}
.intro-panel span:first-child{font:500 .8rem 'Noto Sans KR',sans-serif;letter-spacing:.1em}
.intro-panel span:last-child{font:500 1rem 'Noto Sans KR',sans-serif}
.intro-top,.intro-foot{position:relative;display:flex;justify-content:space-between;align-items:center;gap:22px;padding:29px 5%;font-size:.75rem;letter-spacing:.16em}
.intro-top{border-bottom:1px solid #dbc4a435}
.intro-foot{border-top:1px solid #dbc4a435}
.intro-center{position:relative;align-self:center;justify-self:center;width:min(90%,1320px);padding:10vh 0 13vh;text-align:center;animation:intro-fade 1s 260ms both}
.intro-center p{color:#e6d4b8;font-size:1rem;letter-spacing:.13em;margin-bottom:22px}
.intro-title{color:#fff7ea;font-family:'Noto Serif KR','Batang',serif;font-size:clamp(4rem,10vw,10rem);font-weight:600;line-height:1.25;letter-spacing:-.085em;text-shadow:0 15px 60px #1b100b77;white-space:nowrap}
.intro-rule{width:54px;height:1px;background:#dfc6a0;margin:36px auto 0}
.intro-enter{appearance:none;border:1px solid #e4ceb1;background:#f1e5d2;color:#2d1b10;padding:15px 23px;display:flex;align-items:center;gap:48px;cursor:pointer;font:600 1rem 'Noto Sans KR',sans-serif;letter-spacing:0;transition:background .2s,transform .2s}
.intro-enter:hover{background:#fff8ed;transform:translateY(-3px)}
.intro-enter:focus-visible{outline:3px solid #fff;outline-offset:5px}
.intro-enter span{font-size:1.5rem;font-weight:400;line-height:1}
.intro-screen.is-leaving{clip-path:inset(0 0 100% 0);transition:clip-path 850ms cubic-bezier(.68,0,.15,1)}
.intro-screen.is-leaving .intro-center,.intro-screen.is-leaving .intro-top,.intro-screen.is-leaving .intro-foot{opacity:0;transform:translateY(-16px);transition:opacity 300ms,transform 300ms}
@keyframes intro-rise{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes intro-fade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.intro-panels{grid-template-columns:repeat(2,1fr);grid-template-rows:1fr 1fr}.intro-panel{padding:15px;align-items:start}.intro-panel span:last-child{font-size:.8rem}.intro-top,.intro-foot{padding:20px 6%;font-size:.66rem}.intro-top span:last-child{display:none}.intro-center{width:94%;padding:7vh 0}.intro-center p{font-size:.8rem}.intro-title{font-size:clamp(3.2rem,12vw,5rem)}.intro-foot>span{display:none}.intro-enter{width:100%;justify-content:space-between;padding:15px 20px}}
@media(prefers-reduced-motion:reduce){.intro-panel,.intro-center{animation:none}.intro-screen.is-leaving,.intro-screen.is-leaving .intro-center,.intro-screen.is-leaving .intro-top,.intro-screen.is-leaving .intro-foot{transition:none}}
/* The clinic promise is the focus of the opening screen. */
.intro-center{width:min(91%,1100px);padding:7vh 0 9vh}
.intro-center .intro-brand{margin:0 0 28px;color:#e6d4b8;font:500 .94rem 'Noto Sans KR',sans-serif;letter-spacing:.13em}
.intro-title{font-size:clamp(2.6rem,4.3vw,4.8rem);line-height:1.45;letter-spacing:-.06em;white-space:normal;text-wrap:balance}
.intro-center .intro-detail{max-width:780px;margin:32px auto 0;color:#f3e8d8;font:400 clamp(1rem,1.5vw,1.25rem)/1.8 'Noto Sans KR',sans-serif;letter-spacing:-.025em;text-wrap:balance}
.intro-rule{margin-top:32px}
@media(max-width:700px){.intro-center{width:88%;padding:4vh 0}.intro-center .intro-brand{font-size:.8rem;margin-bottom:22px}.intro-title{font-size:clamp(2rem,8.3vw,3.3rem);line-height:1.5}.intro-center .intro-detail{font-size:1rem;line-height:1.75;margin-top:25px}}
.intro-logo{display:block;width:min(270px,55vw);height:auto;margin:0 auto 29px}
@media(max-width:700px){.intro-logo{width:min(200px,55vw);margin-bottom:24px}}
