
.hye-coc{background:#171c29;color:#f6f6f8;overflow:hidden}.hye-coc *{box-sizing:border-box}
.hye-coc-hero{position:relative;isolation:isolate;min-height:550px;display:flex;align-items:center;background:radial-gradient(ellipse at 80% 30%,#3b4054,#1d2433 60%,#151a26)}
.hye-coc-hero-art{position:absolute;inset:0 0 0 34%;z-index:-1;opacity:.34;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 28%,#000 82%,transparent)}
.hye-coc-hero-art img{width:100%;height:100%;object-fit:contain;transform:translate3d(var(--coc-x,0px),var(--coc-y,0px),0) scale(1.06);transition:transform .3s ease-out}
.hye-coc-hero-inner{padding:100px 0}.hye-coc-kicker{color:#e8c15b;font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.hye-coc h1{font-size:clamp(45px,6vw,82px);line-height:1.07;letter-spacing:-.052em;font-weight:800;max-width:850px;margin:25px 0}
.hye-coc em{color:#e6bd51;font-style:normal}.hye-coc-hero p{max-width:600px;font-size:18px;color:#c6ceda;line-height:1.8}
.hye-coc-hero-btn{display:inline-flex;gap:24px;align-items:center;background:#e6bd51;color:#171b25;text-decoration:none;border-radius:5px;font-weight:800;padding:16px 23px;margin-top:22px;transition:transform .2s,background .2s}
.hye-coc-hero-btn:hover{background:#f6d67a;color:#171b25;transform:translateY(-2px)}
.hye-coc-intro{padding:clamp(55px,7vw,90px) 0;background:#1a202d}.hye-coc-intro>.container{max-width:1100px}
.hye-coc h2{font-size:clamp(28px,3.3vw,46px);line-height:1.2;letter-spacing:-.03em;font-weight:800;margin:18px 0}
.hye-coc-intro p{font-size:16px;color:#c6ceda;line-height:1.9;max-width:960px}
.hye-coc-main{background:#232938;padding:clamp(55px,7vw,90px) 0}
.hye-coc-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:clamp(30px,5vw,75px);align-items:start}
.hye-coc-aside-inner{position:sticky;top:115px;border:1px solid #424b5c;border-radius:9px;background:#2d3444;padding:25px 19px}
.hye-coc-nav{display:flex;flex-direction:column;gap:3px;margin-top:18px}
.hye-coc-nav-link{display:flex;gap:12px;align-items:baseline;padding:11px 12px;border-radius:5px;text-decoration:none;color:#d6dbe4;font-size:13px;line-height:1.5;font-weight:700;transition:background .2s,color .2s}
.hye-coc-nav-link span{color:#d6b458;font-size:11px;flex:0 0 20px}
.hye-coc-nav-link:hover,.hye-coc-nav-link.is-current{background:#424a5d;color:#fff}
.hye-coc-section{display:grid;grid-template-columns:52px minmax(0,1fr);gap:20px;padding:0 0 38px;margin-bottom:38px;border-bottom:1px solid #414b5c;scroll-margin-top:120px}
.hye-coc-section-num{color:#e7c15a;font-size:15px;font-weight:800;letter-spacing:.1em;padding-top:20px}
.hye-coc-section h2{font-size:clamp(24px,2.4vw,33px);margin:10px 0 18px}
.hye-coc-section p{font-size:15px;color:#c7cfda;line-height:1.9;margin:0 0 15px}
.hye-coc-help{border:1px solid #786d4e;border-radius:10px;padding:35px;background:radial-gradient(circle at 90% 0,#444456,#303748)}
.hye-coc-help h2{font-size:30px}.hye-coc-help p{color:#c8cfda;line-height:1.8}
.hye-coc-help a{display:inline-flex;gap:18px;color:#e9c566;font-weight:800;text-decoration:none}
@media(max-width:900px){.hye-coc-layout{grid-template-columns:1fr}.hye-coc-aside-inner{position:static}.hye-coc-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hye-coc-hero-art{left:15%;opacity:.25}}
@media(max-width:600px){.hye-coc-hero{min-height:490px}.hye-coc-hero-inner{padding:80px 0}.hye-coc-hero-art{left:0;opacity:.14}.hye-coc-nav{grid-template-columns:1fr}.hye-coc-section{grid-template-columns:1fr;gap:0}.hye-coc-section-num{padding-top:0}.hye-coc-help{padding:25px}.hye-coc-main{padding:50px 0}}
@media(prefers-reduced-motion:reduce){.hye-coc-hero-art img,.hye-coc-hero-btn{transition:none!important}}
