/* design-r5: authored reinterpretation, not a reference-site font or hover match. */
@font-face{font-family:"Pretendard Variable";font-style:normal;font-weight:100 900;font-display:swap;src:url("/assets/fonts/PretendardVariable.woff2") format("woff2")}
:root{--link:#1687C9;--link-hover:#1687C9;--motion:180ms;--g:clamp(22px,5vw,72px)}
body{font-family:"Pretendard Variable","Apple SD Gothic Neo","Malgun Gothic",sans-serif;font-size:18px;line-height:1.75;font-synthesis:none}
h1,h2,h3{font-weight:700;letter-spacing:-.035em;text-wrap:balance}
.page-heading{padding-block:56px 40px}
.page-heading h1,.policy-body h1{font-size:clamp(40px,4vw,60px);line-height:1.3}
.section{padding-block:88px}
.section-head h2,.company h2,.contact h2,.tools-heading h2{font-size:clamp(36px,3vw,42px);line-height:1.35}
.copy h3,.copy>h2{font-size:34px;line-height:1.4}
.copy p,.content-prose p,.policy-body>p,.company-intro,.selection p{max-width:68ch}
.policy-body{max-width:78ch;margin-right:auto;line-height:1.8}
.policy-body h2{font-size:28px;line-height:1.45;margin-top:48px}
.policy-table{max-width:100%}
.foot{color:var(--body)}
/* All hyperlink states: no underline, simulated underline, or pseudo decoration.
   Entire button frames are restored separately; focus outlines are never removed. */
a,a:link,a:visited,a:hover,a:active,a:focus,a:focus-visible,a[aria-current],a *,
.nav a,.policy-nav a,.policy-body a,.text-link,.matrix a{
 text-decoration:none!important;border-bottom:0!important;box-shadow:none!important;background-image:none!important;border-image:none!important;
}
a::before,a::after,a *::before,a *::after{
 content:none!important;display:none!important;text-decoration:none!important;border:0!important;box-shadow:none!important;background-image:none!important;
}
a{transition:color var(--motion),background-color var(--motion)}
.text-link,.policy-nav a,.policy-body a,.foot a,.email,.breadcrumb a{color:var(--link);font-weight:600}
.text-link:visited,.policy-nav a:visited,.policy-body a:visited,.foot a:visited,.email:visited,.breadcrumb a:visited{color:var(--link)}
.text-link:hover,.policy-nav a:hover,.policy-body a:hover,.foot a:hover,.email:hover,.breadcrumb a:hover,
.text-link:focus,.policy-nav a:focus,.policy-body a:focus,.foot a:focus,.email:focus,.breadcrumb a:focus,
.text-link:active,.policy-nav a:active,.policy-body a:active,.foot a:active,.email:active,.breadcrumb a:active{color:var(--link-hover);background-color:#111111}
.policy-nav a,.foot a{min-height:44px;display:inline-flex;align-items:center}
.primary,.primary:visited{color:#fff}
.primary,.primary:link,.primary:visited,.primary:focus{border-bottom:1px solid var(--blue)!important}
.primary:hover{border-bottom:1px solid var(--hover)!important}
.primary:active{border-bottom:1px solid var(--active)!important}
.types a{border-bottom:1px solid var(--line)!important}
.uiux-main-r1 .types a:first-child{border-bottom-color:var(--blue)!important}
.uiux-main-r1 .types a:first-child:hover{border-bottom-color:var(--hover)!important}
.uiux-main-r1 .types a:first-child:active{border-bottom-color:var(--active)!important}
a:focus-visible,button:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.head{gap:24px}
.nav{gap:clamp(12px,1.8vw,28px);flex-wrap:wrap}
.nav a{font-size:18px;font-weight:500;line-height:1.4;min-height:48px;padding:8px 6px}
.nav a:hover,.nav a:focus{color:var(--ink);background-color:var(--raised)}
.nav a[aria-current="page"]{font-weight:700;color:#38BDF8}
.head,.uiux-main-r1 .head{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px}
.nav,.uiux-main-r1 .nav{display:grid;grid-template-columns:.55fr 1.4fr 1.05fr 1.05fr 1.05fr 1.15fr;gap:12px;width:100%}
.nav a{white-space:normal}
.uiux-main-r1 .hero{padding-block:72px 88px}
.uiux-main-r1 .hero h1{font-size:clamp(48px,4.2vw,62px);line-height:1.3}
.uiux-main-r1 .hero-description{font-size:19px;line-height:1.8;max-width:64ch}
.uiux-main-r1 .section{padding-block:88px}
.uiux-main-r1 .section-head h2,.uiux-main-r1 .contact h2{font-size:clamp(36px,3vw,42px);line-height:1.35}
.uiux-main-r1 .matrix a{border-bottom:0!important}
@media(min-width:701px) and (max-width:1200px){
 header,.uiux-main-r1 header{position:relative}
 .head,.uiux-main-r1 .head{grid-template-columns:minmax(0,1fr);padding-block:16px;gap:12px 24px}
 .nav,.uiux-main-r1 .nav{width:100%;column-gap:20px}
}
@media(max-width:700px){
 .head,.uiux-main-r1 .head{display:flex;gap:0}
 .nav,.uiux-main-r1 .nav{display:flex;gap:0 20px}
 body{font-size:18px;line-height:1.75}
 .page-heading{padding-block:36px 28px}
 .page-heading h1,.policy-body h1{font-size:clamp(32px,8.5vw,40px);line-height:1.35}
 .section,.uiux-main-r1 .section{padding-block:52px}
 .section-head h2,.company h2,.contact h2,.tools-heading h2,
 .uiux-main-r1 .section-head h2,.uiux-main-r1 .contact h2{font-size:28px;line-height:1.45}
 .policy-body h2{font-size:26px}
 .copy h3,.copy>h2{font-size:30px}
 .js .nav{gap:0;flex-wrap:nowrap;padding:20px 24px max(24px,env(safe-area-inset-bottom));overscroll-behavior:contain}
 .js .nav>a{font-size:22px;font-weight:500;min-height:68px;padding:12px 8px;white-space:normal}
 .uiux-main-r1 .hero{padding-block:40px 52px}
 .uiux-main-r1 .hero h1{font-size:clamp(32px,8.5vw,40px);line-height:1.35}
 .uiux-main-r1 .hero-description{font-size:18px;line-height:1.8}
 .uiux-main-r1 .section-head p,.uiux-main-r1 .contact-top>p{font-size:18px}
 .nav:not([hidden]){align-items:stretch}
}
@media(prefers-reduced-motion:reduce){
 a,button,.uiux-main-r1 a{transition:none!important;transform:none!important;animation:none!important}
}

/* simple-r6: remove the five title bands without adding a visible heading. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.simple-page>.section:first-of-type{padding-top:32px;border-top:0}
@media(max-width:700px){.simple-page>.section:first-of-type{padding-top:24px}}