/* 메인(index · index-en) 전용 스타일 — 두 쪽이 같은 파일을 fonts.css · site.css 뒤에 불러옴(규칙 순서도 캐스케이드의 일부 — 옮기지 말 것)
   영문 전용 규칙은 원래 자리에 :where(html[lang="en"]) 접두어(명시도 0) · index.html은 lang이 없어 국문
   군집 드론 무대(#swarm, js/swarm.js) · 미래 기술 · 소식 · 문의. 문의 버튼 줄(.cta-act)은 site.css 16 · 색 · 칸 사이는 site.css 토큰 */
/* 국문: 예전 게시 틀이 body에 준 14px(영문은 기본 16px) — 채용 안내 화살표(.cta-job .arw) 칸 높이가 이 값을 따름 */
:where(html:not([lang="en"])) body{font-size:14px}

/* ---------- 군집 드론(#swarm) — js/swarm.js ---------- */
/* 스크립트가 없으면(html.sw-on 없음) 장 글을 차례로 쌓고 캔버스 · 목차 · 상태는 숨김 */
.sw{position:relative;background:var(--night);color:var(--cream)}
main>section.sw{animation:none}   /* 첫 구역 흐림 등장(site.css) 대신 드론이 모여드는 연출 — 아주 긴 구역에 흐림을 걸지 않음 */
.sw-mark{position:absolute;left:0;top:0;width:1px;height:1px;pointer-events:none}
.sw-cv,.sw-rail,.sw-tags{display:none}
.sw-ch{padding:40px var(--m)}
.sw-ch:first-of-type{padding-top:calc(var(--hdr) + 48px)}
html.sw-on .sw{height:calc(100vh + 455vh);height:calc(100svh + 455svh)}   /* 100 + (4장 − 0.5) × 130 — swarm.js가 높이에서 한 장 거리를 거꾸로 셈 */
html.sw-on .sw-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(60% 70% at var(--cx,54%) 48%,rgb(var(--cblue-rgb) / .34),rgb(var(--night-rgb) / 0) 70%),var(--night)}   /* --cx: 형상 가운데(swarm.js) */
html.sw-on .sw-stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgb(var(--night-rgb) / .86),rgb(var(--night-rgb) / .62) 26%,rgb(var(--night-rgb) / 0) 48%),linear-gradient(0deg,rgb(var(--night-rgb) / .7),rgb(var(--night-rgb) / 0) 22%)}
html.sw-on .sw-cv{display:block;position:absolute;inset:0;width:100%;height:100%}
html.sw-on .sw-ch{position:absolute;inset:0;z-index:2;padding:0;pointer-events:none;visibility:hidden;transition:visibility 0s linear .45s}
html.sw-on .sw-ch.on{visibility:visible;transition-delay:0s}
html.sw-on .sw-ch.on :is(.sw-tx,.sw-card){pointer-events:auto}
/* 글: 왼쪽 가운데 · 위에서 차례로 */
html.sw-on .sw-tx{position:absolute;left:var(--m);top:50%;width:min(520px,37vw);transform:translateY(-46%)}
html.sw-on .sw-tx::before{content:"";position:absolute;inset:-56px -90px -56px calc(var(--m) * -1);z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgb(var(--night-rgb) / .78),rgb(var(--night-rgb) / .5) 60%,rgb(var(--night-rgb) / 0));opacity:0;transition:opacity .4s var(--ease-std)}   /* 글 받침: 가운데 형상이 글 뒤로 지나가도 읽히게 그 자리 드론만 흐리게 */
html.sw-on .sw-ch.on .sw-tx::before{opacity:1;transition-duration:.9s}
html.sw-on .sw-tx>*,html.sw-on .sw-card{opacity:0;filter:blur(8px);transform:translateY(20px);transition:opacity .4s var(--ease-std),filter .4s var(--ease-std),transform .4s var(--ease-std)}
html.sw-on .sw-ch.on .sw-tx>*,html.sw-on .sw-ch.on .sw-card{opacity:1;filter:none;transform:none;transition-duration:1s;transition-timing-function:var(--rv-ease);transition-delay:calc(var(--i,0) * 80ms + 60ms)}
@media (min-width:901px){html.sw-on .sw-k0 .sw-tx{width:min(680px,46vw)}}   /* 첫 장 제목은 두 줄로 */
.sw-tx>:nth-child(2){--i:1}.sw-tx>:nth-child(3){--i:2}.sw-tx>:nth-child(4){--i:3}.sw-tx>:nth-child(5){--i:4}
html.sw-on .sw-card{--i:3}
.sw-pill{display:inline-flex;align-items:center;gap:10px;height:30px;margin:0;padding:0 14px 0 12px;border-radius:15px;box-shadow:inset 0 0 0 1px var(--line2);background:rgb(var(--night-rgb) / .35);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.sw-pill i{width:6px;height:6px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 0 3px rgb(var(--gold-hi-rgb) / .22)}
.sw-pill span{padding-right:10px;color:var(--cream80);box-shadow:inset -1px 0 0 var(--line2)}
.sw-h1{margin:26px 0 0;font-size:clamp(40px,4vw,68px);font-weight:300;line-height:1.12;letter-spacing:-.035em}
.sw-h1 strong{display:block;font-weight:700}
.sw-h2{margin:24px 0 0;font-size:clamp(44px,5vw,84px);font-weight:700;line-height:1.02;letter-spacing:-.05em}
.sw-h2 small{display:block;margin-top:16px;font-size:var(--fs-lbl);font-weight:700;letter-spacing:var(--ls-lbl);line-height:1;text-transform:uppercase;color:var(--gold-hi)}
.sw-lead{margin:24px 0 0;max-width:500px;font-size:17px;line-height:1.7;color:var(--cream80)}
.sw-lead b{font-weight:700;color:var(--cream)}
.sw-y{margin:24px 0 0;padding:0;list-style:none;max-width:500px}
.sw-y li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;padding:11px 0;box-shadow:inset 0 1px 0 var(--line);font-size:14.5px;line-height:1.5}
.sw-y b{font-size:var(--fs-lbl);font-weight:700;letter-spacing:.08em;line-height:1.8;color:var(--gold-hi);white-space:nowrap}
.sw-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.sw-act .btn{min-width:180px}
/* 오른쪽 아래 카드(임무 흐름 · 제원 · 수치) */
html.sw-on .sw-card{position:absolute;right:var(--m);bottom:calc(92px + var(--sab));width:min(340px,25vw)}
.sw-card{padding:18px 20px 20px;background:rgb(var(--night-rgb) / .55);box-shadow:inset 0 0 0 1px var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.sw-cd-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;box-shadow:inset 0 -1px 0 var(--line)}
.sw-cd-h .lbl{font-size:11px;color:var(--cream80)}
.sw-tag{padding:4px 9px;border-radius:11px;box-shadow:inset 0 0 0 1px var(--line2);font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--cream);white-space:nowrap}
.sw-flow{margin:14px 0 0;padding:0;list-style:none}
.sw-flow li{position:relative;padding:6px 0 6px 26px;font-size:14px;line-height:1.45;color:var(--cream80);transition:color .4s var(--ease-std)}
.sw-flow li::before{content:"";position:absolute;left:3px;top:13px;width:9px;height:9px;border-radius:50%;background:var(--night);box-shadow:inset 0 0 0 1px var(--cream80);transition:background-color .4s var(--ease-std),box-shadow .4s var(--ease-std)}
.sw-flow li::after{content:"";position:absolute;left:7px;top:24px;bottom:-6px;width:1px;background:var(--line2)}
.sw-flow li:last-child::after{display:none}
.sw-flow li.done::before{background:var(--cream80)}
.sw-flow li.run{color:var(--cream)}
.sw-flow li.run::before{background:var(--gold-hi);box-shadow:0 0 0 4px rgb(var(--gold-hi-rgb) / .22)}
.sw-spec,.sw-kv{margin:14px 0 0}
.sw-spec div{display:flex;justify-content:space-between;gap:16px;padding:8px 0;box-shadow:inset 0 1px 0 var(--line);font-size:13px}
.sw-spec dt{color:var(--cream80)}
.sw-spec dd{margin:0;font-weight:700;text-align:right}
.sw-kv div{padding:10px 0;box-shadow:inset 0 1px 0 var(--line)}
.sw-kv div:first-child{box-shadow:none}
.sw-kv dt{font-size:12.5px;color:var(--cream80)}
.sw-kv dd{margin:4px 0 0;font-size:13px;font-weight:700}
.sw-kv b{margin-right:6px;font-size:34px;font-weight:300;letter-spacing:var(--ls-num);line-height:1.1;font-variant-numeric:tabular-nums}
.sw-fm{margin:12px 0 0;padding:0;list-style:none}
.sw-fm li{display:flex;flex-direction:column;gap:3px;padding:9px 0;box-shadow:inset 0 1px 0 var(--line)}
.sw-fm li:first-child{box-shadow:none}
.sw-fm b{font-size:14px;font-weight:700}
.sw-fm span{font-size:12.5px;line-height:1.45;color:var(--cream80)}
.sw-kv+.sw-fm{margin-top:4px}.sw-kv+.sw-fm li:first-child{box-shadow:inset 0 1px 0 var(--line)}
/* 한 줄 목록(무인기 9종): 이름 왼쪽 · 설명 오른쪽, 좁으면 설명이 다음 줄 */
.sw-row li{flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:baseline;column-gap:12px;padding:7px 0}
.sw-row span{margin-left:auto;text-align:right}
/* 기체 이름표: swarm.js가 li를 기준점으로 옮기고(translate) 이름을 기체 영역 바깥에 둠 — 점 · 지시선 · 이름 */
html.sw-on .sw-tags{display:block;position:absolute;inset:0;margin:0;padding:0;list-style:none;pointer-events:none;opacity:0;transition:opacity .4s var(--ease-std)}
html.sw-on .sw-ch.on .sw-tags{opacity:1;transition:opacity 1s var(--rv-ease) .5s}
.sw-tags li{position:absolute;left:0;top:0;width:0;height:0}
.sw-tags li::before{content:"";position:absolute;left:-2px;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--gold-hi)}
.sw-tags li::after{content:"";position:absolute;left:0;top:0;width:var(--len,0px);height:1px;transform-origin:0 0;transform:rotate(var(--ang,0deg));background:linear-gradient(90deg,rgb(var(--gold-hi-rgb) / .9),rgb(var(--gold-hi-rgb) / .3))}   /* 지시선: 기준점 → 이름(길이 · 각도는 swarm.js) */
.sw-tags span{position:absolute;left:var(--lx,0px);top:var(--ly,0px);transform:translate(calc(-50% + var(--dx,0) * 50%),calc(-50% + var(--dy,-1) * 50%));padding:5px 10px;border-radius:13px;box-shadow:inset 0 0 0 1px var(--line2);background:rgb(var(--night-rgb) / .88);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:11.5px;font-weight:700;letter-spacing:.02em;white-space:nowrap}   /* 이름의 기체 쪽 가장자리가 지시선 끝에 닿게 */
.sw-chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0;list-style:none}
.sw-chips li{padding:5px 10px;border-radius:13px;box-shadow:inset 0 0 0 1px var(--line2);font-size:12px;font-weight:700;letter-spacing:.02em}
/* 스크롤 안내(.scue, site.css 14): 목차 위 · 드론이 모인 뒤 나타남 */
html.sw-on .sw-stage .scue{bottom:calc(74px + var(--sab))}
.sw-stage .scue>*{animation-delay:2.5s}.sw-stage .scue>*+*{animation-delay:2.62s}
/* 장 목차(아래) */
html.sw-on .sw-rail{display:block;position:absolute;left:var(--m);right:var(--m);bottom:calc(24px + var(--sab));z-index:3}
.sw-rail::before,.sw-rail::after{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--line)}
.sw-rail::after{background:var(--gold-hi);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.sw-rail ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.sw-rail button{display:flex;align-items:baseline;gap:10px;width:100%;padding:14px 12px 4px 0;border:0;background:none;color:var(--cream80);font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:color var(--t-ui)}
.sw-rail button i{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.1em;font-variant-numeric:tabular-nums}
.sw-rail button:hover,.sw-rail button[aria-current]{color:var(--cream)}
.sw-rail button[aria-current] i{color:var(--gold-hi)}
.sw-rail span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1100px) and (min-width:901px){html.sw-on .sw-card{width:300px}}
@media (max-width:900px){
  html.sw-on .sw-stage{background:radial-gradient(90% 50% at 50% 34%,rgb(var(--cblue-rgb) / .34),rgb(var(--night-rgb) / 0) 70%),var(--night)}
  html.sw-on .sw-stage::after{background:linear-gradient(0deg,rgb(var(--night-rgb) / .94) 0,rgb(var(--night-rgb) / .8) 34%,rgb(var(--night-rgb) / 0) 58%)}
  html.sw-on .sw-tx{top:auto;left:var(--m);right:var(--m);bottom:calc(92px + var(--sab));width:auto;transform:none}   /* 아래 스크롤 안내 자리만큼 올림 */
  html.sw-on .sw-tx::before{display:none}
  html.sw-on .sw-card,.sw-y{display:none}
  .sw-pill{height:26px;font-size:10px}
  .sw-h1{margin-top:18px;font-size:clamp(30px,8vw,40px)}
  .sw-h2{margin-top:16px;font-size:clamp(34px,9.6vw,48px)}
  .sw-h2 small{margin-top:12px}
  .sw-lead{margin-top:16px;font-size:15px;line-height:1.65}
  .sw-act{margin-top:22px}
  .sw-act .btn{height:46px;min-width:0;flex:1 1 auto;gap:16px;padding:0 16px 0 18px;font-size:14px}
  html.sw-on .sw-rail{bottom:calc(16px + var(--sab))}
  html.sw-on .sw-stage .scue{bottom:calc(52px + var(--sab))}
  .sw-rail button{justify-content:center;padding:10px 0 2px}
  .sw-rail span{display:none}
}
@media (max-width:900px) and (max-height:620px){.sw-lead{display:none}}
@media (prefers-reduced-motion:reduce){html.sw-on .sw-tx>*,html.sw-on .sw-card{filter:none;transform:none}}
:where(html[lang="en"]) .sw-h1{letter-spacing:-.03em}
:where(html[lang="en"]) .sw-h2{letter-spacing:var(--ls-h1)}

/* ---------- 미래 기술 ---------- */
.fut{grid-column:1/-1;margin-top:88px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gut)}
.fc{display:flex;flex-direction:column;gap:18px}
.fc .fr{aspect-ratio:16/10;overflow:hidden}
.fc .fr img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--t-img)}
.fc:hover .fr img{transform:scale(1.035)}
.fc .lbl{color:var(--cream80);margin-top:6px}
.fc h3{font-size:clamp(24px,2.1vw,32px);line-height:1.2;letter-spacing:-.03em}
.fc p{font-size:16px;line-height:1.7;color:var(--cream80)}
.fc ul{margin:6px 0 0;padding:0;list-style:none;display:flex;flex-direction:column}
.fc li a{display:grid;grid-template-columns:64px minmax(0,1fr) auto;column-gap:12px;align-items:baseline;padding:13px 0;box-shadow:inset 0 1px 0 var(--line2);font-size:14.5px;line-height:1.5}
.fc li:last-child a{box-shadow:inset 0 1px 0 var(--line2),inset 0 -1px 0 var(--line2)}
.fc li .d{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--cream80)}
.fc li svg{color:var(--cream80);transition:transform var(--t-roll)}
.fc li a:hover svg{transform:translate(2px,-2px)}

/* ---------- 뉴스 ---------- */
.news-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.more{display:inline-flex;align-items:center;gap:12px;flex-shrink:0;font-size:15px;font-weight:700}
.more:hover .arw{transform:translateX(6px)}
.nws{grid-column:1/-1;margin-top:72px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gut);row-gap:48px;align-items:start}
.nc{grid-column:span 3;gap:16px}
.nc:first-child{grid-column:span 6}
.nc .fr{aspect-ratio:16/10}
.nc .meta{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--ink80)}
.nc .t{font-size:18px;line-height:1.5;letter-spacing:-.01em}
.nc:first-child .t{font-size:clamp(22px,2vw,30px);line-height:1.4;letter-spacing:-.02em}
.nc .t svg{margin-left:6px;color:var(--ink80);vertical-align:1px}

/* ---------- 문의 ---------- */
.cta-t{font-size:clamp(40px,5.6vw,88px);line-height:1.05;letter-spacing:-.05em}
.cta .body{margin-top:32px;max-width:560px}
.cta-job{margin-top:96px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 0;box-shadow:inset 0 1px 0 var(--line2),inset 0 -1px 0 var(--line2)}
.cta-job .tx{display:flex;flex-direction:column;gap:12px}
.cta-job .lbl{color:var(--cream80)}
.cta-job .h{font-size:clamp(22px,2.2vw,32px);letter-spacing:-.025em}
.cta-job .nw{white-space:nowrap}
.cta-job .arw svg{width:28px;height:28px}
.cta-job:hover .arw{transform:translateX(8px)}

@media (max-width:900px){
  .fut{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:84%;column-gap:16px;margin:56px calc(var(--m) * -1) 0;padding:0 var(--m) 8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m)}
  .fc{scroll-snap-align:start}
  .news-h{flex-direction:column;align-items:flex-start}
  .nws{margin-top:48px;row-gap:40px}
  .nc,.nc:first-child{grid-column:1/-1}
  .cta-job{margin-top:64px}
}

/* ---------- 영문 조판(영문 쪽만) ---------- */
:where(html[lang="en"]) .fc h3{letter-spacing:-.02em}
:where(html[lang="en"]) .cta-t{font-size:clamp(38px,5vw,80px);letter-spacing:var(--ls-h1)}
:where(html[lang="en"]) .kr-note{grid-column:1/-1;margin-top:28px;font-size:13px;color:var(--cream80)}
/* 최근 소식 머리글: 링크는 오른쪽 끝 */
.news-h .more{margin-left:auto}
@media (max-width:900px){.news-h .more{margin-left:0}}