/* reskilling.css — ページ固有スタイル */
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:768px){
  .nav-links{display:none!important}
  .nav-hamburger{display:flex!important}
  .nav-mobile-open .nav-links{display:flex!important;flex-direction:column;position:fixed;top:60px;left:0;right:0;background:rgba(10,15,30,.98);padding:24px;gap:0;z-index:999;animation:slideDown .2s ease;border-bottom:1px solid rgba(255,255,255,.1)}
  .nav-mobile-open .nav-links a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:15px;color:rgba(255,255,255,.8)!important}
  .nav-mobile-open .nav-links a:last-child{border-bottom:none;margin-top:12px;background:#2563eb;text-align:center;padding:14px}
  .overview-stats{flex-direction:column!important}
  .day-inner{flex-direction:column!important}
}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.d1{transition-delay:.12s}.d2{transition-delay:.24s}.d3{transition-delay:.36s}.d4{transition-delay:.48s}
.nav-a{color:rgba(255,255,255,.7);font-size:13px;letter-spacing:.05em;transition:color .2s}
.nav-a:hover{color:#fff}
.nav-scrolled{background:rgba(26,26,46,.97) !important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.07) !important}
.sl{font-size:10px;letter-spacing:.22em;color:#2563eb;font-weight:500;text-transform:uppercase;margin-bottom:16px}
.sh{font-size:clamp(24px,3vw,40px);font-weight:700;letter-spacing:-.02em;line-height:1.25;margin-bottom:20px}
.sa{width:32px;height:2px;background:#2563eb;margin-bottom:44px}
.card{border:1px solid #E2E8F0;padding:28px 24px;background:#fff;transition:box-shadow .25s}
.card:hover{box-shadow:0 4px 20px rgba(26,26,46,.08)}
.tag{font-size:11px;background:#EFF6FF;color:#2563eb;padding:4px 10px;letter-spacing:.04em}
.check-row{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid #f1f5f9}
.check-row:last-child{border-bottom:none}
.check-icon{width:22px;height:22px;background:#2563eb;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.step-bar{display:flex;gap:0;flex-wrap:wrap;margin-bottom:0;}
.step-item{flex:1;min-width:120px;text-align:center;position:relative;}
.step-item+.step-item::before{content:'';position:absolute;top:18px;left:-1px;width:2px;height:2px;background:#CBD5E1;}

/* hover states */
.hv1:hover{color:#a8cbff;}
.hv2:hover{background:#1D4ED8;}
.hv3:hover{color:#fff;}
.hv4:hover{color:#fff;}
.hv5:hover{color:#fff;}
.hv6:hover{color:#fff;}
.hv7:hover{color:#fff;}
.hv-cta:hover{background:#1D4ED8;}
.hv-flink:hover{color:#fff;}

/* curriculum tabs */
.course-radio{position:absolute;opacity:0;pointer-events:none}
.course-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.course-label{display:inline-block;padding:11px 22px;font-size:13px;font-weight:600;letter-spacing:.03em;color:rgba(255,255,255,.55);background:rgba(255,255,255,.04);border:1px solid rgba(212,175,106,.22);border-radius:6px;cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.course-label:hover{color:#fff;border-color:rgba(212,175,106,.5)}
.course-panel{display:none}

#tab-sales:checked ~ .course-tabs label[for="tab-sales"],
#tab-mkt:checked ~ .course-tabs label[for="tab-mkt"],
#tab-bo:checked ~ .course-tabs label[for="tab-bo"],
#tab-adops:checked ~ .course-tabs label[for="tab-adops"],
#tab-adplan:checked ~ .course-tabs label[for="tab-adplan"]{color:#0f172a;background:#D4AF6A;border-color:#D4AF6A}

#tab-sales:checked ~ #panel-sales,
#tab-mkt:checked ~ #panel-mkt,
#tab-bo:checked ~ #panel-bo,
#tab-adops:checked ~ #panel-adops,
#tab-adplan:checked ~ #panel-adplan{display:block}

.tcard:hover{border-color:rgba(212,175,106,.45)}

@media(max-width:768px){
  .course-tabs{gap:6px}
  .course-label{padding:9px 14px;font-size:12px}
}

@media(max-width:640px){
  .tcard{flex-direction:column!important;gap:16px!important}
}
