/* ============================================================
   HUDIUS4 — nvidia.com/ko-kr 벤치마킹 엔터프라이즈 포털
   다크 헤더·히어로 / 화이트 콘텐츠 / 그린 액센트
   ============================================================ */
:root{
  --green:#137A4C; --lime:#8DC63F; --lime-bright:#A9E15C;
  --ink:#1A1A1A; --body:#333; --muted:#666; --dim:#8A8A8A;
  --bg:#FFFFFF; --bg-gray:#F4F6F5; --line:#E2E6E4; --line2:#CDD4D0;
  --dark:#0E0E0E; --dark2:#161A18; --on-dark:#F2F4F2; --on-dark-muted:#A8B0AB;
  --mono:ui-monospace,'SF Mono',Consolas,monospace;
  --maxw:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--body); font-size:15.5px; line-height:1.65;
  font-family:'Pretendard Variable',Pretendard,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:var(--green); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%; display:block}
:focus-visible{outline:2px solid var(--lime); outline-offset:2px}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
h1,h2,h3{color:var(--ink); letter-spacing:-.01em; text-wrap:balance}

/* ---------- header (다크, NVIDIA식) ---------- */
.hd{position:fixed; top:0; left:0; right:0; z-index:80; background:var(--dark); height:58px; transition:transform .35s ease}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .mega{background:#fff} .m2-body{background:var(--bg-gray)} .m2-side button.on{background:var(--bg-gray)} }
.hd.hide{transform:translateY(-100%)}
.hd-in{max-width:var(--maxw); margin:0 auto; padding:0 24px; height:100%; display:flex; align-items:center; gap:8px}
.logo{display:flex; align-items:center; gap:10px; color:#fff; font-weight:800; font-size:17px; text-decoration:none; margin-right:18px}
.logo-img{height:30px; width:auto; display:block; object-fit:contain}
.logo:hover{opacity:.9; text-decoration:none}
.gnb{display:flex; height:100%}
.gnb>li{list-style:none; position:relative}
.gnb>li>button{height:58px; padding:0 16px; background:none; border:0; color:#E6E6E6; font:inherit; font-size:14.5px; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:6px}
.gnb>li>button .car{font-size:9px; transition:transform .2s}
.gnb>li:hover>button,.gnb>li.open>button{color:var(--lime-bright); box-shadow:inset 0 -3px 0 var(--lime)}
.gnb>li.open>button .car{transform:rotate(180deg)}
/* 메가 패널 — NVIDIA식 전체 폭: 좌측 카테고리 레일 + 우측 콘텐츠 */
.mega{position:fixed; top:58px; left:0; right:0; background:rgba(255,255,255,.55); border:0; border-bottom:1px solid rgba(226,230,228,.6);
  box-shadow:0 30px 60px rgba(0,0,0,.25); display:none; padding:0; border-radius:0;
  -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4)}
.gnb>li.open .mega{display:flex}
.m2-side{flex:0 0 300px; margin-left:max(0px, calc((100vw - 1240px)/2)); padding:24px 0 28px; display:flex; flex-direction:column; border-right:1px solid rgba(226,230,228,.7)}
.m2-side button{text-align:left; background:none; border:0; border-left:3px solid transparent; padding:11px 26px 11px 27px;
  font:inherit; font-size:14.5px; font-weight:600; color:var(--body); cursor:pointer; font-family:var(--mono); letter-spacing:.04em; font-size:13px}
.m2-side button:hover{color:var(--green)}
.m2-side button.on{border-left-color:var(--lime); color:var(--ink); font-weight:800; background:rgba(230,236,233,.6)}
.m2-body{flex:1; background:rgba(238,243,241,.62); padding:26px 44px 32px; min-height:0}
.m2-cat{display:none}
.m2-cat.on{display:block}
.m2-cat h4{font-size:21px; margin:0 0 16px; color:var(--ink)}
.m2-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 40px; max-width:980px}
.m2-grid a{display:block; color:var(--ink); font-size:15px; font-weight:700; padding:0}
.m2-grid a b{font-weight:700}
.m2-grid a b::after{content:' ›'; color:var(--green); font-weight:800}
.m2-grid a:hover{color:var(--green); text-decoration:none}
.m2-grid a span{display:block; font-size:12.5px; color:var(--muted); font-weight:400; margin-top:5px; line-height:1.55}
.hd-actions{margin-left:auto; display:flex; align-items:center; gap:8px}
.icon-btn{background:none; border:0; color:#E6E6E6; font-size:17px; cursor:pointer; padding:8px; border-radius:6px}
.icon-btn:hover{color:var(--lime-bright)}
.btn{display:inline-flex; align-items:center; gap:7px; font:inherit; font-weight:700; font-size:14px;
  padding:9px 20px; border-radius:4px; border:1.5px solid transparent; cursor:pointer; text-decoration:none}
.btn:hover{text-decoration:none}
.btn-lime{background:var(--lime); color:#101800; border-color:var(--lime)}
.btn-lime:hover{background:var(--lime-bright)}
.btn-ghost-d{background:transparent; color:#fff; border-color:#555}
.btn-ghost-d:hover{border-color:#fff}
.btn-ghost{background:transparent; color:var(--green); border-color:var(--line2)}
.btn-ghost:hover{border-color:var(--green)}
.menu-btn{display:none}
@media (max-width:980px){
  .gnb{display:none; position:fixed; top:58px; left:0; right:0; bottom:0; overflow:auto; background:var(--dark); flex-direction:column; padding:10px 0 40px; margin:0}
  .gnb.open{display:flex}
  .gnb>li>button{width:100%; justify-content:space-between; padding:0 24px; height:52px}
  .mega{position:static; min-width:0; border:0; border-radius:0; box-shadow:none; background:var(--dark2); padding:8px 24px 18px}
  .gnb>li.open .mega{display:block}
  .m2-side{display:none}
  .m2-body{background:transparent; padding:0; min-height:0}
  .m2-cat{display:block; padding:6px 0}
  .m2-cat h4{font-family:var(--mono); font-size:12px; color:#8A8A8A; letter-spacing:.08em; margin:8px 0 10px; font-weight:600}
  .m2-grid{display:block; max-width:none}
  .m2-grid a{color:#DDD; font-weight:600; padding:6px 0}
  .m2-grid a span{color:#8A8A8A}
  .menu-btn{display:block}
}
main{padding-top:58px}

/* ---------- 히어로 캐러셀 ---------- */
.carousel{position:relative; background:var(--dark); color:var(--on-dark); overflow:hidden}
.slides{position:relative; height:min(93vh,840px); min-height:630px}
.slide{position:absolute; inset:0; opacity:0; transition:opacity .7s ease; pointer-events:none}
.slide.on{opacity:1; pointer-events:auto}
.slide .sbg{position:absolute; inset:0; background-size:cover; background-position:center; opacity:.5}
.slide .sveil{position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,12,10,.92) 0%, rgba(10,12,10,.55) 55%, rgba(10,12,10,.2) 100%)}
.slide .sin{position:relative; max-width:var(--maxw); margin:0 auto; padding:0 24px; height:100%; display:flex; flex-direction:column; justify-content:center; max-width:calc(var(--maxw))}
.slide .tag{font-family:var(--mono); font-size:12px; letter-spacing:.16em; color:var(--lime-bright); margin-bottom:14px}
.slide h2{font-size:clamp(26px,3.6vw,44px); color:#fff; margin:0 0 12px; max-width:22ch; line-height:1.25}
.slide p{color:var(--on-dark-muted); max-width:52ch; margin:0 0 24px; font-size:16px}
.c-nav{position:absolute; right:24px; bottom:22px; display:flex; gap:8px; z-index:3}
.c-nav button{width:38px; height:38px; border-radius:50%; border:1px solid #555; background:rgba(0,0,0,.35); color:#fff; cursor:pointer; font-size:15px}
.c-nav button:hover{border-color:var(--lime)}
.c-dots{position:absolute; left:50%; transform:translateX(-50%); bottom:26px; display:flex; gap:8px; z-index:3}
.c-dots i{width:26px; height:8px; border-radius:4px; background:#4A4A4A; cursor:pointer; transition:background .3s}
.c-dots i.on{background:var(--lime)}

/* ---------- 섹션 공통 (NVIDIA 카테고리 섹션) ---------- */
section.cat{padding:72px 0}
section.cat.gray{background:var(--bg-gray)}
.cat-head{display:flex; align-items:baseline; gap:20px; flex-wrap:wrap; margin-bottom:8px}
.cat-head h2{font-size:clamp(24px,3vw,34px); margin:0}
.cat-head .more{margin-left:auto; font-weight:700; font-size:14px; white-space:nowrap}
.cat-lead{color:var(--muted); max-width:70ch; margin:0 0 20px}
/* 바로가기 스트립 */
.quick{display:flex; gap:10px; flex-wrap:wrap; margin:0 0 28px; padding:0}
.quick a{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line2); border-radius:999px;
  padding:7px 16px; font-size:13.5px; font-weight:600; color:var(--ink); background:#fff}
.quick a::after{content:'›'; color:var(--green); font-weight:800}
.quick a:hover{border-color:var(--green); color:var(--green); text-decoration:none}
/* 카드 그리드 */
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:20px}
.card{background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; display:flex; flex-direction:column;
  transition:transform .22s ease, box-shadow .22s ease; position:relative}
.card:hover{transform:translateY(-4px); box-shadow:0 14px 34px rgba(20,40,30,.13)}
.card .thumb{aspect-ratio:16/9; background-size:cover; background-position:center; border-bottom:1px solid var(--line)}
.card .thumb video{width:100%; height:100%; object-fit:cover}
.card .cb{padding:18px 20px 20px; display:flex; flex-direction:column; flex:1}
.card .kind{font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; color:var(--green); margin-bottom:8px}
.card h3{font-size:16.5px; margin:0 0 8px; line-height:1.4}
.card p{font-size:13.5px; color:var(--muted); margin:0 0 14px; flex:1}
.card .cta{font-size:13.5px; font-weight:700}
.card a.stretch::before{content:''; position:absolute; inset:0}
/* 스펙 카드 */
.spec-li{list-style:none; margin:0 0 14px; padding:0; font-size:12.5px; color:var(--muted)}
.spec-li li{display:flex; justify-content:space-between; border-top:1px dashed var(--line); padding:5px 0}
.spec-li li b{font-family:var(--mono); color:var(--ink); font-weight:600}
.badge{display:inline-block; font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; border:1px solid var(--line2); border-radius:4px; padding:2px 8px; color:var(--muted); background:var(--bg-gray)}

/* ---------- 탭 (솔루션) ---------- */
.tabs{display:flex; gap:4px; border-bottom:2px solid var(--line); margin-bottom:26px; overflow-x:auto}
.tabs button{background:none; border:0; font:inherit; font-size:15px; font-weight:700; color:var(--muted); padding:12px 18px; cursor:pointer; white-space:nowrap; border-bottom:3px solid transparent; margin-bottom:-2px}
.tabs button.on{color:var(--green); border-bottom-color:var(--lime)}
.tpanel{display:none; grid-template-columns:1.15fr 1fr; gap:34px; align-items:center}
.tpanel.on{display:grid}
.tpanel .tmedia{border-radius:10px; overflow:hidden; border:1px solid var(--line); aspect-ratio:16/9; background:#000}
.tpanel .tmedia video{width:100%; height:100%; object-fit:cover; display:block}
.tpanel h3{font-size:24px; margin:0 0 10px}
.tpanel p{color:var(--muted); margin:0 0 18px}
.tpanel .kpi{font-family:var(--mono); font-size:12.5px; color:var(--green); margin-bottom:18px}
@media (max-width:880px){ .tpanel{grid-template-columns:1fr} }

/* ---------- 스탯 밴드 ---------- */
.stat-band{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1px; background:var(--line2); border:1px solid var(--line2); border-radius:10px; overflow:hidden; margin-top:8px}
.stat-band>div{background:#fff; padding:24px 22px; text-align:center}
.stat-band b{display:block; font-family:var(--mono); font-size:32px; font-weight:700; color:var(--green); font-variant-numeric:tabular-nums}
.stat-band span{font-size:13px; color:var(--muted)}
.stat-band .fn{display:block; font-size:10.5px; color:var(--dim); font-family:var(--mono); margin-top:5px}

/* ---------- 다크 CTA 스트립 ---------- */
.cta-strip{background:linear-gradient(120deg,var(--dark) 0%,#12291C 100%); color:var(--on-dark); padding:58px 0}
.cta-strip .wrap{display:flex; align-items:center; gap:26px; flex-wrap:wrap}
.cta-strip h2{color:#fff; font-size:clamp(22px,2.8vw,30px); margin:0; flex:1; min-width:280px}
.cta-strip p{color:var(--on-dark-muted); margin:6px 0 0; font-size:14.5px}

/* ---------- 검색 오버레이 ---------- */
.search-ov{position:fixed; inset:0; background:rgba(8,10,9,.78); z-index:100; display:none; padding:12vh 24px 0}
.search-ov.open{display:block}
.search-box{max-width:640px; margin:0 auto; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.4)}
.search-box input{width:100%; border:0; font:inherit; font-size:17px; padding:18px 22px; outline:none}
.search-res{max-height:46vh; overflow:auto; border-top:1px solid var(--line)}
.search-res a{display:block; padding:12px 22px; color:var(--ink); font-size:14.5px; border-bottom:1px solid var(--line)}
.search-res a span{display:block; font-size:12px; color:var(--dim)}
.search-res a:hover{background:var(--bg-gray); text-decoration:none}
.search-res .none{padding:18px 22px; color:var(--dim); font-size:14px}

/* ---------- 푸터 (메가) ---------- */
footer{background:var(--dark); color:#BDBDBD; font-size:13.5px; margin-top:0}
.f-news{border-bottom:1px solid #2A2A2A}
.f-news .wrap{display:flex; align-items:center; gap:18px; padding:26px 24px; flex-wrap:wrap}
.f-news b{color:#fff; font-size:16px}
.f-news form{display:flex; gap:8px; margin-left:auto; flex-wrap:wrap}
.f-news input{background:#1C1C1C; border:1px solid #3A3A3A; color:#EEE; font:inherit; font-size:14px; padding:10px 14px; border-radius:4px; min-width:240px}
.f-cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:34px; padding:44px 0 30px}
.f-cols b{display:block; color:#fff; margin-bottom:12px; font-size:13px}
.f-cols a{display:block; color:#BDBDBD; padding:4px 0; font-size:13px}
.f-cols a:hover{color:var(--lime-bright); text-decoration:none}
.f-legal{border-top:1px solid #2A2A2A; padding:20px 0 30px; font-size:12px; color:#8A8A8A; line-height:1.9}
.f-legal a{color:#8A8A8A; margin-right:16px}

/* ---------- 리빌·백투탑 ---------- */
html.js .rv{opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease}
html.js .rv.in{opacity:1; transform:none}
.to-top{position:fixed; right:22px; bottom:22px; z-index:70; width:44px; height:44px; border-radius:50%;
  border:1px solid var(--line2); background:#fff; color:var(--green); font-size:18px; cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.18); opacity:0; pointer-events:none; transition:opacity .3s}
.to-top.show{opacity:1; pointer-events:auto}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .rv{opacity:1!important; transform:none!important; transition:none!important}
  .slide{transition:none}
  *{animation:none!important}
}

/* ---------- 서브페이지: 페이지 히어로(다크 밴드) ---------- */
.phero4{background:linear-gradient(120deg,var(--dark) 0%,#12291C 100%); color:var(--on-dark); padding:64px 0 48px}
.phero4 .crumb{font-family:var(--mono); font-size:11.5px; letter-spacing:.12em; color:var(--lime-bright); margin-bottom:14px}
.phero4 .crumb a{color:var(--on-dark-muted)}
.phero4 h1{color:#fff; font-size:clamp(26px,3.6vw,40px); margin:0 0 10px}
.phero4 p{color:var(--on-dark-muted); max-width:62ch; margin:0; font-size:15.5px}

/* 타임라인 */
.tl4{list-style:none; margin:0; padding:0 0 0 20px; border-left:2px solid var(--line2)}
.tl4 li{position:relative; padding:0 0 24px 20px}
.tl4 li::before{content:''; position:absolute; left:-25px; top:7px; width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px #DCEEDF}
.tl4 .yr{font-family:var(--mono); font-weight:700; color:var(--green); font-size:13px}
.tl4 b{display:block; color:var(--ink); font-size:15.5px; margin:2px 0}
.tl4 span{font-size:13.5px; color:var(--muted)}

/* 폼 */
.form4{max-width:560px; display:grid; gap:15px}
.form4 label{display:block; font-size:13px; font-weight:700; color:var(--ink); margin-bottom:6px}
.form4 label em{font-style:normal; color:#B0452C}
.form4 input,.form4 select,.form4 textarea{width:100%; font:inherit; font-size:15px; color:var(--ink);
  background:#fff; border:1.5px solid var(--line2); border-radius:6px; padding:11px 13px}
.form4 input:focus,.form4 select:focus,.form4 textarea:focus{outline:none; border-color:var(--green)}
.form4 .hint{font-size:12px; color:var(--dim); margin-top:4px}
.consent4{display:flex; gap:9px; align-items:flex-start; font-size:12.5px; color:var(--muted)}
.consent4 input{width:16px; height:16px; margin-top:2px; accent-color:var(--green)}

/* 문서 타일(개인정보 등) */
.doc-tile{background:#fff; border:1px solid var(--line); border-radius:10px; padding:22px 24px; margin-bottom:14px}
.doc-tile h3{margin:0 0 8px; font-size:16px}
.doc-tile p{font-size:14px; color:var(--muted); margin:0}

/* 뉴스 리스트 */
.news-li{border-bottom:1px solid var(--line); padding:18px 0; display:flex; gap:22px; align-items:baseline}
.news-li .dt{font-family:var(--mono); font-size:12px; color:var(--dim); flex:0 0 88px}
.news-li b{font-size:16px; color:var(--ink)}
.news-li p{margin:2px 0 0; font-size:13.5px; color:var(--muted)}

/* 브라우저 프레임(디지털 트윈) */
.frame4{border:1px solid var(--line2); border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 16px 44px rgba(20,40,30,.12); max-width:920px; margin:26px auto 0}
.frame4 .bar{display:flex; align-items:center; gap:7px; padding:10px 16px; border-bottom:1px solid var(--line); background:var(--bg-gray)}
.frame4 .bar i{width:10px; height:10px; border-radius:50%; background:var(--line2)}
.frame4 .bar i:first-child{background:#D97A62}
.frame4 .bar span{margin-left:8px; font-family:var(--mono); font-size:11px; color:var(--dim)}
.frame4 img{width:100%}
.frame4 figcaption{padding:12px 16px; font-size:12.5px; color:var(--muted); border-top:1px solid var(--line)}

/* 브랜드 필름: 고정 크기 재생(전체화면 버튼 숨김) */
.tmedia video::-webkit-media-controls-fullscreen-button{display:none}

/* 브랜드 무비 패널: 영상 1.3배 확대 */
#movie-card.tpanel{grid-template-columns:2.3fr 1fr}
@media (max-width:880px){ #movie-card.tpanel{grid-template-columns:1fr} }

/* 캐러셀 스플릿: 이미지를 풀블리드 백그라운드로, 중심은 우측 — 좌측 베일 위 텍스트 */
.slide.split .sbg{inset:0; opacity:1; background-size:85% auto; background-repeat:no-repeat; background-position:right center}
.slide.split .sveil{background:linear-gradient(90deg,#0A0C0A 0%,rgba(10,12,10,.96) 36%,rgba(10,12,10,.7) 52%,rgba(10,12,10,.18) 72%,rgba(10,12,10,0) 100%)}
.slide.split h2,.slide.split p{max-width:46ch}
@media (max-width:760px){ .slide.split .sveil{background:linear-gradient(90deg,rgba(10,12,10,.95) 0%,rgba(10,12,10,.8) 100%)} }

/* 스크롤 반응(hudius3 이식): 부드러운 전환 대상 */
html.lenis, html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto}

/* ---------- 한국어 줄바꿈 규칙: 단어 단위 유지 (줄바뀜 오류 수정) ---------- */
body{word-break:keep-all; overflow-wrap:break-word}
h1,h2,h3,h4,p,li,figcaption,span,a,button,label{word-break:keep-all; overflow-wrap:break-word}

/* 앵커 정착 위치: 고정 헤더 보정 */
main [id]{scroll-margin-top:78px}

/* 서비스 카탈로그 칩(비링크): 화살표·커서 제거 */
.quick a:not([href])::after{content:none}
.quick a:not([href]){cursor:default}
.quick a:not([href]):hover{border-color:var(--line2); color:var(--ink); text-decoration:none}

/* ---------- 데이터 흐름 카탈로그 ---------- */
.dflow{display:grid; gap:0; max-width:980px}
.stage{display:grid; grid-template-columns:170px 1fr; gap:8px 24px; background:#fff; border:1px solid var(--line); border-radius:10px; padding:18px 22px; align-items:start}
.stage .snum{font-family:var(--mono); font-size:11px; color:var(--lime); background:var(--dark); border-radius:4px; padding:2px 8px; display:inline-block; margin-bottom:6px}
.stage .slab b{display:block; font-size:16px; color:var(--ink)}
.stage .slab i{font-style:normal; font-family:var(--mono); font-size:10px; letter-spacing:.12em; color:var(--dim)}
.stage .sgov{grid-column:2; font-family:var(--mono); font-size:11px; color:var(--green); border-top:1px dashed var(--line); padding-top:8px; margin-top:2px}
.stage-tools{display:flex; flex-wrap:wrap; gap:8px}
.tool{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:8px; padding:7px 12px; background:var(--bg-gray)}
.tool img{width:18px; height:18px; display:block}
.tool .mb{width:18px; height:18px; border-radius:4px; color:#fff; font:700 8.5px var(--mono); display:flex; align-items:center; justify-content:center; flex:none}
.tool b{font-size:12.5px; color:var(--ink); white-space:nowrap}
.tool span{font-size:10.5px; color:var(--dim); white-space:nowrap}
.darr{text-align:center; color:var(--green); font-weight:800; font-size:16px; padding:4px 0; max-width:980px}
.darr small{display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; color:var(--dim); font-weight:400}
.xrail{border-left:4px solid var(--lime); background:linear-gradient(90deg,#F2F7EE 0%,#fff 60%)}
@media (max-width:720px){ .stage{grid-template-columns:1fr} .stage .sgov{grid-column:1} }

/* ---------- 저니 스크롤리텔링 (hudius3 이식) ---------- */
.journey{display:grid; grid-template-columns:0.95fr 1.05fr; gap:44px; align-items:start; margin-top:14px}
.j-media{position:sticky; top:86px}
.j-frame{border:1px solid var(--line2); border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 16px 44px rgba(20,40,30,.12)}
.j-frame .bar{display:flex; align-items:center; gap:7px; padding:11px 16px; border-bottom:1px solid var(--line); background:var(--bg-gray)}
.j-frame .bar i{width:10px; height:10px; border-radius:50%; background:var(--line2)}
.j-frame .bar i:first-child{background:#D97A62}
.j-frame .bar span{margin-left:8px; font-family:var(--mono); font-size:11px; color:var(--dim)}
.j-imgs{position:relative; aspect-ratio:4/3; background:#F7FAF8}
.j-imgs img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; transform:scale(1.02); transition:opacity .45s ease, transform .6s ease}
.j-imgs img.on{opacity:1; transform:scale(1)}
.j-meter{display:flex; align-items:center; gap:12px; padding:10px 16px; border-top:1px solid var(--line)}
.j-meter b{font-family:var(--mono); font-size:11.5px; color:var(--green); white-space:nowrap}
.j-meter i{flex:1; height:4px; border-radius:2px; background:var(--line); overflow:hidden; display:block}
.j-meter i span{display:block; height:100%; background:linear-gradient(90deg,var(--green),var(--lime)); transition:width .4s ease}
.j-chapters{display:flex; flex-direction:column; gap:40px}
.j-ch{min-height:auto; padding:20px 0 32px; display:flex; flex-direction:column; justify-content:flex-start; opacity:.35; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease; scroll-margin-top:90px; border-bottom:1px solid var(--line)}
.j-ch:first-child{padding-top:0; margin-top:0}
.j-ch:last-child{border-bottom:0; padding-bottom:8px}
.j-ch.active{opacity:1; transform:none}
.j-ch .snum{font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--lime); background:var(--dark); border-radius:4px; padding:3px 10px; display:inline-block; width:max-content; margin-bottom:14px}
.j-ch h2{font-size:clamp(23px,2.6vw,32px); margin:0 0 12px}
.j-ch p{color:var(--muted); margin:0 0 16px; max-width:54ch}
.j-points{list-style:none; margin:0 0 20px; padding:0}
.j-points li{font-size:13.5px; color:var(--muted); padding:8px 0 8px 20px; border-bottom:1px dashed var(--line); position:relative}
.j-points li::before{content:''; position:absolute; left:0; top:14px; width:8px; height:8px; border-radius:2px; background:var(--lime)}
.j-points li b{color:var(--ink); font-weight:700; margin-right:6px}
@media (max-width:920px){
  .journey{grid-template-columns:1fr}
  .j-media{position:static}
  .j-ch{min-height:0; padding:40px 0; opacity:1; transform:none}
}
@media (prefers-reduced-motion:reduce){ .j-ch{opacity:1!important; transform:none!important} .j-imgs img{transition:none} }

html:not(.gsap) .j-ch{opacity:1; transform:none} /* GSAP 미로드 폴백 */

/* ---------- 휴디어스의 AI가 일하는 현장: 핀 수평 시네마틱 갤러리 (hudius2 이식) ---------- */
.gallery4{position:relative; overflow:hidden; background:var(--dark); padding:20px 0 32px}
.gallery4 .g-head{max-width:var(--maxw); margin:0 auto 18px; padding:0 24px}
.gallery4 .g-head h2{color:#fff; font-size:clamp(22px,2.6vw,32px); margin:0 0 6px}
.gallery4 .g-head p{color:var(--on-dark-muted); margin:0; max-width:60ch}
.g4-track{display:flex; will-change:transform; padding-left:max(24px, calc((100vw - 1240px)/2))}
.g4-panel{position:relative; flex:0 0 76vw; max-width:1020px; height:clamp(360px, calc(100svh - 252px), 620px); margin-right:3vw; border-radius:14px; overflow:hidden}
.g4-panel video,.g4-panel .g4-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background-size:cover; background-position:center}
.g4-panel .g4-shade{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,12,10,.04) 30%, rgba(10,12,10,.88) 100%)}
.g4-panel .g4-label{position:absolute; left:34px; right:34px; bottom:28px}
.g4-panel .g4-label .cat{font-family:var(--mono); font-size:11.5px; letter-spacing:.22em; color:var(--lime-bright); display:block; margin-bottom:8px}
.g4-panel .g4-label h3{font-size:clamp(22px,2.6vw,34px); font-weight:300; color:#fff; margin:0 0 6px}
.g4-panel .g4-label h3 b{font-weight:700}
.g4-panel .g4-label p{font-size:13.5px; color:#C7CFC7; margin:0 0 10px; max-width:58ch}
.g4-panel .g4-label a{font-size:13.5px; font-weight:700; color:var(--lime-bright)}
html:not(.gsap) .gallery4{overflow-x:auto; scroll-snap-type:x mandatory}
html:not(.gsap) .g4-panel{scroll-snap-align:center}
@media (max-width:700px){ .g4-panel{flex-basis:86vw; height:clamp(300px, calc(100svh - 240px), 520px)} .g4-panel .g4-label{left:22px; right:22px; bottom:20px} }

/* 진행 절차: 4장 한 줄 배열 */
.steps4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){ .steps4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .steps4{grid-template-columns:1fr} }

/* 갤러리 패널 CTA: 상단 우측 그린박스 (항상 노출) */
.g4-cta{position:absolute; top:20px; right:20px; z-index:3; background:var(--lime); color:#101800;
  font-size:13px; font-weight:800; padding:10px 16px; border-radius:6px; text-decoration:none;
  box-shadow:0 6px 18px rgba(0,0,0,.35); transition:background .18s, transform .18s}
.g4-cta:hover{background:var(--lime-bright); transform:translateY(-2px); text-decoration:none}
@media (max-width:700px){ .g4-cta{top:14px; right:14px; padding:8px 13px; font-size:12px} }

/* SolarPulse 페르소나 카드 */
.pchips{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px}
.pchips i{font-style:normal; font-size:11.5px; font-weight:600; color:var(--green); background:var(--bg-gray);
  border:1px solid var(--line); border-radius:999px; padding:3px 10px}
.card .pbadge{font-style:normal; font-size:10.5px; font-weight:800; color:#101800; background:var(--lime);
  border-radius:4px; padding:2px 7px; margin-left:6px; letter-spacing:0}

/* 시공 원스톱 6단계 */
.steps6{grid-template-columns:repeat(6,1fr); gap:12px}
@media (max-width:960px){ .steps6{grid-template-columns:repeat(3,1fr)} }
@media (max-width:520px){ .steps6{grid-template-columns:repeat(2,1fr)} }

/* 회사소개: 5대 가치·성장스토리·밸류체인 */
.vals5{grid-template-columns:repeat(5,1fr); gap:12px}
.growth5{grid-template-columns:repeat(5,1fr); gap:12px}
.chain5{grid-template-columns:repeat(5,1fr); gap:12px}
.chain5 ul{margin:0; padding-left:16px; font-size:12.5px; color:var(--muted); line-height:1.7}
.growth5 .cb p{font-size:12.5px}
.card.hl-lime{border:2px solid var(--lime); box-shadow:0 10px 28px rgba(141,198,63,.22)}
@media (max-width:1100px){ .vals5,.growth5,.chain5{grid-template-columns:repeat(3,1fr)} }
@media (max-width:700px){ .vals5{grid-template-columns:repeat(2,1fr)} .growth5,.chain5{grid-template-columns:1fr} }

/* R&D 연도별 이력 칩 */
.yr-chips{display:flex; flex-wrap:wrap; gap:7px; margin-top:10px}
.yr-chips .badge{font-size:12px; padding:5px 11px; line-height:1.5; letter-spacing:0}
.doc-tile h3 .badge{vertical-align:middle}

/* 지식재산 테이블 */
.tbl-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:10px; background:#fff}
table.ip-tbl{width:100%; border-collapse:collapse; font-size:13.5px; min-width:720px}
.ip-tbl th{background:var(--bg-gray); color:var(--ink); font-weight:700; text-align:left; padding:11px 14px; border-bottom:1px solid var(--line2); white-space:nowrap}
.ip-tbl td{padding:10px 14px; border-bottom:1px solid var(--line); vertical-align:top}
.ip-tbl tr:last-child td{border-bottom:0}
.ip-tbl .num{font-family:var(--mono); font-size:12px; color:var(--muted); white-space:nowrap}
.st{display:inline-block; font-size:11px; font-weight:800; border-radius:4px; padding:2px 9px; white-space:nowrap}
.st-reg{background:#E8F4EC; color:var(--green)}
.st-app{background:#F1F3EA; color:#6B7A2A}
.st-know{background:#E8F0F7; color:#2A5B8A}
.st-tm{background:#F7EFE4; color:#8A6420}


/* ============================================================
   회사소개 (Company) 정돈된 3D Glassmorphism 스타일 & 전폭/여백제거 최적화
   ============================================================ */

/* 1. 히어로 */
.company-hero{display:grid; grid-template-columns:1.1fr 0.9fr; gap:36px; align-items:center; padding:44px 0 36px}
.company-hero-content h1{font-size:clamp(26px,3.2vw,38px); line-height:1.28; color:#fff; margin:0 0 14px; font-weight:800}
.company-hero-content p{font-size:15px; line-height:1.75; color:var(--on-dark-muted); margin:0 0 20px; max-width:52ch}
.company-hero-badges{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px}
.company-hero-badges span{display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:11.5px; font-weight:600; padding:5px 12px; border-radius:999px; background:rgba(255,255,255,.08); color:var(--lime-bright); border:1px solid rgba(141,198,63,.3); backdrop-filter:blur(8px)}
.company-hero-media{position:relative; max-width:480px; max-height:330px; margin-left:auto; border-radius:14px; overflow:hidden; box-shadow:0 18px 45px rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.15); background:#0B0E0C; display:flex; align-items:center; justify-content:center}
.company-hero-media img{width:100%; max-height:330px; object-fit:contain; display:block; transition:transform .5s ease}
.company-hero-media:hover img{transform:scale(1.02)}

/* 2. 대표 인사말 카드 */
.ceo-quote-card{background:linear-gradient(135deg, #FFFFFF 0%, #F8FAF9 100%); border:1px solid var(--line2); border-left:4px solid var(--lime); border-radius:14px; padding:28px 36px; box-shadow:0 12px 30px rgba(20,40,30,.05); position:relative; overflow:hidden}
.ceo-quote-card::after{content:'“'; position:absolute; right:28px; bottom:-24px; font-size:140px; font-family:serif; color:rgba(19,122,76,.035); line-height:1; pointer-events:none}
.ceo-quote-card p{font-size:15px; line-height:1.9; color:var(--body); margin:0 0 18px}
.ceo-quote-author{display:flex; justify-content:flex-end; align-items:baseline; gap:8px; font-size:14px; color:var(--muted); border-top:1px solid var(--line); padding-top:14px}
.ceo-quote-author b{color:var(--ink); font-size:16.5px; font-weight:800}

/* 3. 비전 및 5대 핵심가치 */
.vision-split{display:grid; grid-template-columns:460px 1fr; gap:36px; align-items:stretch; margin-top:22px}
.vision-media{border-radius:16px; overflow:hidden; border:1px solid var(--line2); box-shadow:0 14px 36px rgba(20,40,30,.08); background:#FFFFFF; display:flex; padding:0; min-height:410px}
.vision-media img{width:100%; height:100%; min-height:410px; object-fit:cover; object-position:center; display:block; border-radius:0; transition:transform .5s ease}
.vision-media:hover img{transform:scale(1.02)}
.vision-cards{display:grid; grid-template-columns:repeat(2,1fr); gap:14px; align-content:space-between}
.vision-cards .card{padding:16px 18px; border-radius:12px; border:1px solid var(--line); background:#fff; transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; display:flex; flex-direction:column; justify-content:center}
.vision-cards .card:hover{transform:translateY(-3px); border-color:var(--lime); box-shadow:0 10px 24px rgba(19,122,76,.1)}
.vision-cards .card.span2{grid-column:span 2}
.vision-cards .kind{font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; color:var(--green); margin-bottom:4px; display:block}
.vision-cards h3{font-size:15.5px; margin:0 0 5px}
.vision-cards p{font-size:13px; color:var(--muted); margin:0; line-height:1.6}

/* 4. 핵심 역량 성장 스토리 (5개 카드 폭 100% 일치 & 카드 내 여백 없이 가득 채움) */
.growth-infographic-box{width:100%; max-width:100%; margin:22px 0 28px; border-radius:16px; overflow:hidden; border:1px solid var(--line2); box-shadow:0 16px 40px rgba(20,40,30,.08); background:#151B2A}
.growth-infographic-box img{width:100%; height:480px; object-fit:cover; object-position:center 45%; display:block; margin:0; padding:0; transition:transform .5s ease}
.growth-infographic-box:hover img{transform:scale(1.02)}
.growth-infographic-box figcaption{padding:12px 22px; font-size:12.5px; color:var(--muted); background:var(--bg-gray); border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px}
.growth-infographic-box figcaption b{color:var(--ink); font-family:var(--mono)}

/* 인포그래픽 공통 (데이터 밸류체인 등 5개 카드 폭 100% 일치 & 여백 없이 채움) */
.infographic-box{width:100%; max-width:100%; margin:20px 0 26px; border-radius:14px; overflow:hidden; border:1px solid var(--line2); box-shadow:0 14px 35px rgba(20,40,30,.08); background:#151B2A}
.infographic-box img{width:100%; height:420px; object-fit:cover; object-position:center; display:block; margin:0; padding:0; transition:transform .5s ease}
.infographic-box:hover img{transform:scale(1.02)}
.infographic-box figcaption{padding:11px 20px; font-size:12px; color:var(--muted); background:var(--bg-gray); border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px}
.infographic-box figcaption b{color:var(--ink); font-family:var(--mono)}

/* 5. 걸어온 길 */
.history-wrap{display:grid; grid-template-columns:300px 1fr; gap:36px; align-items:start; margin-top:22px}
.history-intro{background:#fff; border:1px solid var(--line); border-radius:12px; padding:22px 20px; position:sticky; top:88px; box-shadow:0 8px 24px rgba(0,0,0,.03)}
.history-intro .badge{font-size:10.5px; color:var(--green); background:rgba(19,122,76,.1); border-color:transparent; padding:3px 8px; margin-bottom:10px}
.history-intro h3{font-size:18px; margin:0 0 8px}
.history-intro p{font-size:13px; color:var(--muted); margin:0 0 14px; line-height:1.55}
.history-highlights{display:flex; flex-direction:column; gap:7px}
.history-highlights span{font-size:11.5px; color:var(--body); background:var(--bg-gray); padding:6px 10px; border-radius:5px; border:1px solid var(--line); display:flex; align-items:center; gap:6px}
.history-highlights span::before{content:'✔'; color:var(--green); font-size:9.5px}

/* 6. 3대 도메인 솔루션 카드 */
.domain-cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:24px}
.domain-card{background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; box-shadow:0 6px 20px rgba(0,0,0,.03)}
.domain-card:hover{transform:translateY(-4px); box-shadow:0 16px 36px rgba(20,40,30,.12); border-color:var(--lime)}
.domain-card .d-thumb{height:130px; overflow:hidden; background:#F2F6F4; position:relative; border-bottom:1px solid var(--line)}
.domain-card .d-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .4s ease}
.domain-card:hover .d-thumb img{transform:scale(1.04)}
.domain-card .d-body{padding:18px 18px 16px; display:flex; flex-direction:column; flex:1}
.domain-card .d-num{font-family:var(--mono); font-size:10.5px; font-weight:800; color:var(--green); background:rgba(19,122,76,.1); padding:2px 8px; border-radius:4px; width:max-content; margin-bottom:8px}
.domain-card h3{font-size:17.5px; margin:0 0 6px}
.domain-card p{font-size:13px; color:var(--muted); margin:0 0 12px; flex:1; line-height:1.55}
.domain-card .d-tags{display:flex; flex-wrap:wrap; gap:5px; margin-bottom:14px}
.domain-card .d-tags span{font-size:11px; padding:2px 7px; border-radius:4px; background:var(--bg-gray); color:var(--body); border:1px solid var(--line)}
.domain-card .btn{width:100%; justify-content:center; padding:8px 0; font-size:13px}

/* 7. 오시는 길 */
.location-cards2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:20px}
.location-card{background:#fff; border:1px solid var(--line2); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:transform .2s ease, box-shadow .2s ease; box-shadow:0 8px 24px rgba(20,40,30,.04)}
.location-card:hover{transform:translateY(-3px); box-shadow:0 16px 36px rgba(20,40,30,.1)}
.location-map-thumb{height:150px; overflow:hidden; position:relative; background:#E8F2EC; border-bottom:1px solid var(--line)}
.location-map-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.location-card:hover .location-map-thumb img{transform:scale(1.03)}
.location-map-badge{position:absolute; top:10px; left:10px; background:rgba(14,14,14,.85); backdrop-filter:blur(6px); color:#fff; font-family:var(--mono); font-size:10.5px; font-weight:700; padding:3px 8px; border-radius:4px; border:1px solid rgba(255,255,255,.2); display:flex; align-items:center; gap:5px}
.location-map-badge i{width:6px; height:6px; border-radius:50%; background:var(--lime-bright)}
.location-card-body{padding:20px; display:flex; flex-direction:column; flex:1}
.location-card-body .kind{font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; color:var(--green); margin-bottom:4px; display:block}
.location-card-body h3{font-size:18px; margin:0 0 8px}
.location-card-body .addr{font-size:13.5px; color:var(--muted); line-height:1.65; margin:0 0 16px; flex:1}
.location-card-body .addr b{color:var(--ink); font-weight:600}
.location-map-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:auto}
.location-map-actions a{flex:1; min-width:110px; text-align:center; padding:7px 12px; font-size:12.5px; font-weight:700; border-radius:5px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:5px}
.btn-kakao{background:#FEE500; color:#191919; border:1px solid #E6CF00}
.btn-kakao:hover{background:#FADA0A}
.btn-naver{background:#03C75A; color:#FFFFFF; border:1px solid #02B351}
.btn-naver:hover{background:#02B351}

@media (max-width:1020px){
  .growth-infographic-box img{height:340px}
  .infographic-box img{height:300px}
  .vision-split{grid-template-columns:1fr}
  .vision-media{border-radius:16px; overflow:hidden; border:1px solid var(--line2); box-shadow:0 14px 36px rgba(20,40,30,.08); background:#FFFFFF; display:flex; padding:0; min-height:410px}
  .company-hero{grid-template-columns:1fr; padding:32px 0}
  .company-hero-media{margin:0 auto; max-width:100%}
  .domain-cards3{grid-template-columns:1fr}
  .history-wrap{grid-template-columns:1fr; gap:20px}
  .history-intro{position:static}
  .location-cards2{grid-template-columns:1fr}
}


/* ============================================================
   산업별 AI (Industry Pages) 테마별 컬러 & 3D 비주얼 컴포넌트
   ============================================================ */

/* 1. 산업별 빠른 이동 탭 (Quick Nav) 액티브 스타일 */
.quick a.on{background:#fff; font-weight:700; box-shadow:0 4px 12px rgba(0,0,0,.06)}
.quick a.theme-energy.on{border-color:#8DC63F; color:#137A4C}
.quick a.theme-factory.on{border-color:#0070F3; color:#0051B3}
.quick a.theme-environment.on{border-color:#00B4D8; color:#007799}
.quick a.theme-public.on{border-color:#4361EE; color:#3A0CA3}
.quick a.theme-automotive.on{border-color:#E63946; color:#C1121F}
.quick a.theme-ai.on{border-color:#8338EC; color:#6A11CB}
.quick a.theme-healthcare.on{border-color:#FF4D6D; color:#C9184A}
.quick a.theme-logistics.on{border-color:#FB8500; color:#D97706}
.quick a.theme-finance.on{border-color:#D4AF37; color:#997300}

/* 2. 산업별 히어로 뱃지 & 헤더 스타일 */
.ind-hero-badge{display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:11.5px; font-weight:700; padding:5px 13px; border-radius:999px; margin-bottom:14px; backdrop-filter:blur(8px)}
.theme-energy .ind-hero-badge{background:rgba(141,198,63,.15); color:#A3E635; border:1px solid rgba(163,230,53,.35)}
.theme-factory .ind-hero-badge{background:rgba(0,112,243,.15); color:#60A5FA; border:1px solid rgba(96,165,250,.35)}
.theme-environment .ind-hero-badge{background:rgba(0,180,216,.15); color:#38BDF8; border:1px solid rgba(56,189,248,.35)}
.theme-public .ind-hero-badge{background:rgba(67,97,238,.15); color:#818CF8; border:1px solid rgba(129,140,248,.35)}
.theme-automotive .ind-hero-badge{background:rgba(230,57,70,.15); color:#F87171; border:1px solid rgba(248,113,113,.35)}
.theme-ai .ind-hero-badge{background:rgba(131,56,236,.15); color:#C084FC; border:1px solid rgba(192,132,252,.35)}
.theme-healthcare .ind-hero-badge{background:rgba(255,77,109,.15); color:#FB7185; border:1px solid rgba(251,113,133,.35)}
.theme-logistics .ind-hero-badge{background:rgba(251,133,0,.15); color:#FDBA74; border:1px solid rgba(253,186,116,.35)}
.theme-finance .ind-hero-badge{background:rgba(212,175,55,.18); color:#FDE047; border:1px solid rgba(253,224,71,.35)}

/* 3. 산업별 3D 인포그래픽 박스 */
.ind-visual-box{width:100%; max-width:100%; margin:24px 0 28px; border-radius:16px; overflow:hidden; border:1px solid var(--line2); box-shadow:0 16px 40px rgba(20,40,30,.08); background:#151B2A}
.ind-visual-box img{width:100%; height:460px; object-fit:cover; object-position:center; display:block; margin:0; padding:0; transition:transform .5s ease}
.ind-visual-box:hover img{transform:scale(1.015)}
.ind-visual-box figcaption{padding:12px 22px; font-size:12.5px; color:var(--muted); background:var(--bg-gray); border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px}
.ind-visual-box figcaption b{color:var(--ink); font-family:var(--mono)}

/* 4. 산업별 AI 적용 지형 카드 테마별 태그 & 호버 */
.theme-energy .card:hover{border-color:#8DC63F; box-shadow:0 12px 28px rgba(141,198,63,.15)}
.theme-energy .card .kind{color:#137A4C}

.theme-factory .card:hover{border-color:#0070F3; box-shadow:0 12px 28px rgba(0,112,243,.15)}
.theme-factory .card .kind{color:#0066CC}

.theme-environment .card:hover{border-color:#00B4D8; box-shadow:0 12px 28px rgba(0,180,216,.15)}
.theme-environment .card .kind{color:#0096C7}

.theme-public .card:hover{border-color:#4361EE; box-shadow:0 12px 28px rgba(67,97,238,.15)}
.theme-public .card .kind{color:#3F37C9}

.theme-automotive .card:hover{border-color:#E63946; box-shadow:0 12px 28px rgba(230,57,70,.15)}
.theme-automotive .card .kind{color:#D90429}

.theme-ai .card:hover{border-color:#8338EC; box-shadow:0 12px 28px rgba(131,56,236,.15)}
.theme-ai .card .kind{color:#7209B7}

.theme-healthcare .card:hover{border-color:#FF4D6D; box-shadow:0 12px 28px rgba(255,77,109,.15)}
.theme-healthcare .card .kind{color:#E63946}

.theme-logistics .card:hover{border-color:#FB8500; box-shadow:0 12px 28px rgba(251,133,0,.15)}
.theme-logistics .card .kind{color:#D97706}

.theme-finance .card:hover{border-color:#D4AF37; box-shadow:0 12px 28px rgba(212,175,55,.18)}
.theme-finance .card .kind{color:#B8860B}

@media (max-width:960px){
  .ind-visual-box img{height:300px}
}