/* 회사소개 > 연혁 — 밝은 배경, 본문(CI·오시는길) 톤과 통일 */

.tab-panel[data-panel="history"]{
  /* 회사소개 상단 탭(.company-tabs-wrap) 높이에 맞춤 — GNB 숨김 시 html.gnb-scroll-away에서만 하단값 사용 */
  --au-history-era-nav-under-tabs:57px;
  --au-h-border:#e5ecf8;
  --au-h-line:#d7dfec;
  --au-h-tit:#1a1a1a;
  --au-h-body:#3e4f6d;
  --au-h-muted:#8fa0bc;
  --au-h-tab:#6f85a8;
  --au-h-card-border:#e6edf9;
  --au-h-gold:#c9a227;
  --au-h-green:#0a9f6e;
  --au-h-violet:#7c6fdc;
  background:transparent;
  color:var(--au-h-tit);
  -webkit-font-smoothing:antialiased;
}

/* 연혁 탭: 히어로 fade-up은 탭 진입 시 스크립트로 .on 부여 — 전환 없이 바로 표시 */
.tab-panel[data-panel="history"] .fade-up{
  opacity:0;
  transform:translateY(12px);
  transition:none;
}
.tab-panel[data-panel="history"] .fade-up.on{
  opacity:1;
  transform:none;
}

/* 이벤트 카드: 스크롤 순차 없이 한꺼번에 켤 때 깜빡임 없이 */
.tab-panel[data-panel="history"] .au-event-card{
  transition:none;
}

.au-history-page{
  position:relative;

.au-history-progress{
  position:fixed;
  top:0;
  left:0;
  z-index:200;
  height:2px;
  width:0%;
  background:linear-gradient(90deg,var(--blue),var(--blue-bright));
  box-shadow:0 0 8px rgba(0,128,255,.35);
  pointer-events:none;
  opacity:0;
  transition:opacity .2s ease;
}
.tab-panel[data-panel="history"].active .au-history-progress{
  opacity:1;
}

/* ── HERO ── */
.au-history-hero{
  position:relative;
  min-height:260px;
  padding:3rem 24px 2.8rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-bottom:1px solid var(--au-h-border);
  background:transparent;
}
.au-history-hero-bg,
.au-history-hero-grid{
  display:none;
}
.au-history-hero-eyebrow{
  position:relative;
  z-index:1;
  display:inline-block;
  font-size:1.15rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--main-color,#0080ff);
  margin-bottom:2rem;
}
.au-history-hero-title{
  position:relative;
  z-index:1;
  margin:0;
  font-size:clamp(28px,3.2vw,52px);
  font-weight:800;
  line-height:1.3;
  letter-spacing:-.04em;
  color:var(--au-h-tit);
}
.au-history-hero-sub{
  position:relative;
  z-index:1;
  margin:2.4rem auto 0;
  max-width:980px;
  font-size:1.6rem;
  font-weight:400;
  line-height:1.85;
  color:#5d6f91;
  text-align:center;
  word-break:keep-all;
}

/* ── ERA NAV (회사 탭 톤) ── */
.au-history-era-nav{
  position:sticky;
  top:calc(var(--gnb-h, 80px) + var(--au-history-era-nav-under-tabs,57px));
  z-index:90;
  display:flex;
  justify-content:center;
  gap:36px;
  padding:0 48px;
  background:#fff;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:1px solid #dbe8fb;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab;
}
.au-history-era-nav.is-strip-dragging{cursor:grabbing;user-select:none}
.au-history-era-nav::-webkit-scrollbar{display:none}
.au-history-era-nav a{
  display:block;
  padding:14px 0;
  font-size:1.15rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--au-h-tab);
  text-decoration:none;
  white-space:nowrap;
  flex-shrink:0;
  border-bottom:3px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.au-history-era-nav a:hover{color:var(--main-color,#0080ff)}
.au-history-era-nav a.active{
  color:var(--main-color,#0080ff);
  border-bottom-color:var(--main-color,#0080ff);
}

/* ── TIMELINE ── */
.au-tl-wrap{
  position:relative;
  max-width:900px;
  margin:0 auto;
  padding:80px 48px 160px;
}

.au-tl-track{
  position:absolute;
  left:calc(48px + 110px);
  top:80px;
  bottom:160px;
  width:2px;
  background:var(--au-h-line);
  border-radius:2px;
  overflow:hidden;
}
.au-tl-fill{
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:0%;
  background:linear-gradient(to bottom,var(--blue-bright),var(--blue));
  box-shadow:0 0 10px rgba(0,128,255,.25);
  border-radius:2px;
  transition:height .04s linear;
}
.au-tl-tip{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--blue-bright);
  box-shadow:0 0 0 3px rgba(30,192,255,.2);
  top:0;
  transition:top .04s linear;
}

.au-history-era{
  padding:0 0 20px;
}
.au-history-era + .au-history-era{
  padding-top:64px;
}

.au-history-era-head{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:8px;
  padding-left:calc(110px + 40px + 20px);
}
.au-history-era-chip{
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--main-color,#0080ff);
  background:transparent;
  border:1px solid rgba(0,128,255,.22);
  padding:4px 12px;
  border-radius:100px;
}
.au-history-era-range{
  font-size:12px;
  color:var(--au-h-muted);
  letter-spacing:.05em;
}
.au-history-era-slogan{
  font-size:clamp(15px,1.8vw,19px);
  font-weight:800;
  line-height:1.45;
  letter-spacing:-.03em;
  color:var(--au-h-tit);
  margin-bottom:48px;
  padding-left:calc(110px + 40px + 20px);
}

.au-year-row{
  display:grid;
  grid-template-columns:110px 40px 1fr;
  margin-bottom:40px;
  align-items:start;
}

.au-year-num{
  font-size:clamp(28px,3.2vw,40px);
  font-weight:900;
  letter-spacing:-.05em;
  line-height:1;
  color:#c5cedd;
  text-align:right;
  padding-right:20px;
  padding-top:4px;
  transition:color .16s ease;
}
.au-year-row.is-active .au-year-num{
  color:var(--au-h-tit);
  text-shadow:none;
}

.au-year-node{
  position:relative;
  display:flex;
  justify-content:center;
  padding-top:8px;
}
.au-year-node-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  background:transparent;
  border:2px solid #c5d4e8;
  box-shadow:none;
  transition:border-color .16s,box-shadow .16s,background .16s;
  position:relative;
  z-index:2;
}
.au-year-row.is-active .au-year-node-dot{
  border-color:var(--blue);
  background:var(--blue);
  box-shadow:0 0 0 4px rgba(0,128,255,.12);
}

.au-year-events{
  padding-left:20px;
}

.au-event-card{
  position:relative;
  padding:16px 18px;
  border-radius:10px;
  margin-bottom:8px;
  border:1px solid var(--au-h-card-border);
  background:transparent;
  display:flex;
  gap:16px;
  align-items:flex-start;
  opacity:.58;
  transform:translateX(8px);
  transition:opacity .11s ease,transform .11s ease,
    background .11s ease,border-color .11s ease,box-shadow .11s ease;
}
.au-event-card:last-child{margin-bottom:0}
.au-event-card.is-lit{
  opacity:1;
  transform:none;
}
.au-event-card.is-lit:hover{
  background:transparent;
  border-color:#c8daf5;
  box-shadow:none;
}

.au-event-card--milestone{
  background:transparent;
  border-color:#c8def8;
}
.au-event-card--milestone::before{
  content:'';
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:2px;
  background:linear-gradient(to bottom,var(--blue-bright),var(--blue));
}
.au-event-card--milestone .au-event-text{
  color:#1e3358;
  font-weight:600;
}

.au-event-card--award{
  background:transparent;
  border-color:#f0e4c0;
}
.au-event-card--award::before{
  content:'';
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:2px;
  background:linear-gradient(to bottom,#e8b84a,#d4a42e);
}
.au-event-card--award .au-event-text{
  color:#3a3420;
  font-weight:600;
}

.au-event-month{
  font-size:11px;
  font-weight:700;
  letter-spacing:.05em;
  color:var(--main-color,#0080ff);
  white-space:nowrap;
  min-width:30px;
  flex-shrink:0;
  padding-top:2px;
}
.au-event-text{
  font-size:14px;
  color:#5b6f8f;
  line-height:1.65;
  word-break:keep-all;
  margin:0;
  transition:color .12s ease;
}
.au-event-card.is-lit:hover .au-event-text{color:#304b71}

@media (max-width:768px){
  .au-history-hero{
    min-height:auto;
    padding:clamp(2rem,5vw,2.5rem) max(14px,env(safe-area-inset-right)) clamp(1.75rem,4vw,2.25rem);
  }
  .au-history-hero-eyebrow{
    font-size:11px;
    margin-bottom:clamp(0.65rem,2vw,0.85rem);
    letter-spacing:0.08em;
  }
  .au-history-hero-title{
    font-size:clamp(20px,5.2vw,26px);
    line-height:1.35;
  }
  .au-history-hero-sub{
    margin-top:clamp(0.75rem,2.2vw,1rem);
    font-size:clamp(13px,3.5vw,14px);
    line-height:1.62;
    letter-spacing:-0.02em;
  }
  .au-history-era-slogan{
    font-size:clamp(14px,3.8vw,15px);
    line-height:1.5;
    margin-bottom:clamp(1.75rem,4.5vw,2.25rem);
  }
}
@media (max-width:680px){
  .au-history-page{padding-top:clamp(4.5rem,12vw,7rem)}
  .au-tl-wrap{padding:60px 20px 120px}
  .au-tl-track{left:calc(20px + 72px);top:60px;bottom:120px}
  .au-year-row{grid-template-columns:72px 32px 1fr;margin-bottom:32px}
  .au-history-era-head,
  .au-history-era-slogan{padding-left:calc(72px + 32px + 12px)}
  .au-year-events{padding-left:12px}
  .au-year-num{font-size:22px;padding-right:14px}
  .au-history-era-nav{justify-content:flex-start;gap:20px;padding:0 20px}
}
@media (max-width:480px){
  .au-history-era-chip{font-size:12px}
  .au-event-month{font-size:12px}
}