/* Match the Kingstem hero composition while using the supplied responsive artwork. */
.el-implant-page{--header-height:80px}
/* Sections already reserve the sticky header/index height for anchor navigation. */
html:has(> body.el-implant-page){scroll-padding-top:0}
.el-detail.el-implant-page section[id]{scroll-margin-top:calc(var(--header-height) + 60px)}
.el-implant-page #main{margin-top:calc(-1 * var(--header-height))}
body.el-implant-page.el-legacy-page{padding-top:0}
.el-implant-page .el-shell-header{background:transparent}
/* Keep the normal white header for expanded menus and as soon as scrolling starts. */
.el-implant-page.implant-header-over-hero:not(.menu-open) .site-header:not(:has(.nav-trigger[aria-expanded=true])){background:transparent;border-bottom-color:transparent;color:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
.el-implant-page.implant-header-over-hero:not(.menu-open) .site-header:not(:has(.nav-trigger[aria-expanded=true])) .brand img{filter:brightness(0) invert(1)}
.el-implant-page.implant-header-over-hero:not(.menu-open) .site-header:not(:has(.nav-trigger[aria-expanded=true])) .account-link{color:#fff}
.el-implant-page.implant-header-over-hero:not(.menu-open) .site-header:not(:has(.nav-trigger[aria-expanded=true])) :is(.nav-trigger,.account-link):hover{color:#bcefff}
.el-implant-page.implant-header-over-hero:not(.menu-open) .site-header:not(:has(.nav-trigger[aria-expanded=true])) .icon-button:hover{background:#ffffff1f}
.implant-hero{min-height:100vh;min-height:100svh;background:#03122e}
.implant-hero-media{position:absolute;inset:0;z-index:-2}
.implant-hero .sub-visual-bg{z-index:auto;object-position:right center;animation:none;transform:scale(1.02)}
.implant-hero--photo>.sub-visual-bg{z-index:-2;object-position:var(--hero-position,center)}
.implant-hero .sub-visual-shade{background:linear-gradient(90deg,rgba(2,12,32,.85),rgba(2,12,32,.64) 46%,rgba(2,12,32,.08) 78%),linear-gradient(0deg,rgba(2,12,32,.5),transparent 60%)}
.implant-hero .sub-visual-inner{position:relative;width:min(1180px,calc(100% - 48px));min-height:100vh;min-height:100svh;padding:52px 0 80px}
.implant-hero .sub-visual-copy{max-width:900px;padding-top:0}
.implant-hero .breadcrumbs{margin-bottom:24px}
.implant-hero h1{max-width:900px;font-size:clamp(42px,5.4vw,70px);font-weight:900;line-height:1.12;letter-spacing:-.05em;text-shadow:none;word-break:keep-all;overflow-wrap:break-word}
.implant-hero h1>span,.implant-hero h1>em{display:block}
.implant-hero h1>em{color:#bcefff;font-style:normal;font-weight:800;letter-spacing:-.055em}
.implant-hero .detail-lead{max-width:720px;margin-top:24px;color:rgba(255,255,255,.84);font-size:clamp(15px,1.35vw,18px);line-height:1.75;letter-spacing:-.025em}
.implant-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.implant-hero-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 25px;border:1px solid #fff;border-radius:99px;background:#fff;color:#18272f;font-size:14px;font-weight:800;transition:transform .25s ease,background .25s ease}
.implant-hero-button>span{font-size:19px;font-weight:400;line-height:1}
.implant-hero-button:hover{transform:translateY(-2px);background:#eaf8ff}
.implant-hero-button--ghost{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.06);color:#fff;backdrop-filter:blur(8px)}
.implant-hero-button--ghost:hover{background:rgba(255,255,255,.15)}
.implant-hero-scroll{position:absolute;right:0;bottom:4px;display:flex;align-items:center;gap:12px;color:rgba(255,255,255,.56);font-size:9px;font-weight:800;letter-spacing:.16em;writing-mode:vertical-rl}
.implant-hero-scroll:after{content:"";width:1px;height:56px;background:rgba(255,255,255,.38)}
.el-implant-page #kingstemLanding .ks-hero{font-family:ElPretendard,Pretendard,'Apple SD Gothic Neo','Malgun Gothic',sans-serif}
.el-implant-page #kingstemLanding .ks-hero__inner{padding-top:calc(var(--header-height) + 36px)}
.el-implant-page #kingstemLanding .implant-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 24px;color:#ffffffbf;font-size:13px;font-weight:400;line-height:1.6;letter-spacing:-.02em}
.el-implant-page #kingstemLanding .implant-breadcrumbs a,.el-implant-page #kingstemLanding .implant-breadcrumbs [aria-current]{color:#fff;font-weight:600}
.el-implant-page #kingstemLanding .implant-breadcrumbs a:hover{text-decoration:underline;text-underline-offset:3px}
.el-implant-page #kingstemLanding .implant-breadcrumbs .el-icon{width:14px;height:14px;opacity:.7}
.el-implant-page #kingstemLanding section[id]{scroll-margin-top:calc(var(--header-height) + 20px)}
@media(max-width:1279px){.el-implant-page{--header-height:72px}}
@media(max-width:1100px){
 /* The hero has its own consultation action; avoid covering it with the floating control. */
 .implant-hero-visible .quick-tools:not(.is-contact-open){visibility:hidden;opacity:0;pointer-events:none}
}
@media(max-width:1023px){
 .implant-hero{background:#010a27}
 .implant-hero .sub-visual-bg{height:auto;object-fit:contain;object-position:center top;transform:none;-webkit-mask-image:linear-gradient(#000 60%,transparent 90%);mask-image:linear-gradient(#000 60%,transparent 90%)}
 .implant-hero .sub-visual-shade{background:linear-gradient(0deg,rgba(2,12,32,.3),transparent 60%)}
 .implant-hero .sub-visual-copy{padding-top:340px}
 .implant-hero--photo .sub-visual-bg{height:100%;object-fit:cover;object-position:var(--hero-position,center);-webkit-mask-image:none;mask-image:none}
 .implant-hero--photo .sub-visual-shade{background:linear-gradient(0deg,#061327f2 0%,#06132799 60%,#06132766 100%)}
}
@media(max-width:767px){
 .el-implant-page{--header-height:64px}
 .el-detail.el-implant-page section[id]{scroll-margin-top:calc(var(--header-height) + 52px)}
 .implant-hero .sub-visual-inner{width:calc(100% - 34px);padding:36px 0 48px}
 .implant-hero .breadcrumbs{margin-bottom:20px}
 .implant-hero h1{font-size:clamp(35px,10.2vw,40px);line-height:1.16;letter-spacing:-.045em}
 .implant-hero .detail-lead{margin-top:20px;font-size:14px;line-height:1.72}
 .implant-hero-actions{margin-top:29px}
 .implant-hero-button{width:100%}
 .implant-hero-scroll{display:none}
 .el-implant-page #kingstemLanding .implant-breadcrumbs{margin-bottom:20px}
 .el-implant-page #kingstemLanding .ks-hero__inner{padding-top:calc(var(--header-height) + 24px);padding-bottom:48px}
}
@media(max-width:360px){.implant-hero h1{font-size:32px;line-height:1.18}}
@media(prefers-reduced-motion:reduce){.implant-hero-button{transition:none}.implant-hero-button:hover{transform:none}}
@media print{.el-implant-page #main{margin-top:0}.implant-hero,.implant-hero .sub-visual-inner{min-height:0}.implant-hero-media,.implant-hero-actions,.implant-hero-scroll{display:none}.implant-hero .sub-visual-copy{padding-top:0}.implant-hero h1>em,.implant-hero .detail-lead{color:inherit}}
