/* ================================================================
   02. 회사소개
   원본: kuber-main/blocks/02_회사소개_블록.html 의 <style> 블록을 그대로 이관.
   수치·색상은 확정본이므로 임의 변경 금지.
   ================================================================ */

.ks-about *{box-sizing:border-box;margin:0;padding:0}
.ks-about{
  --ci:#7e3236;
  --ink:#111111;
  --text:#616161;
  --line:#e5e5e5;
  width:100%;
  min-height:760px;               /* 최소 높이 */
  min-height:max(760px,100vh);    /* 풀스크린 */
  display:flex;flex-direction:column;
  background:#ffffff;color:var(--ink);
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}

/* ---- 상단 비주얼 ---- */
.ks-about__visual{
  position:relative;width:100%;overflow:hidden;background:#dfe4e8;
  flex:0 0 46vh;min-height:340px;
}
.ks-about__visual img{
  width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;
  filter:grayscale(1) contrast(1.04);   /* 0825 : 흑백 처리 */
  transform:scale(1.06);
  transition:transform 2.4s cubic-bezier(.22,.61,.36,1);
}
.ks-about.is-in .ks-about__visual img{transform:scale(1)}
.ks-about__visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.05) 34%,rgba(255,255,255,.78) 84%,#ffffff 100%);
}
.ks-about__vtext{
  position:absolute;z-index:2;left:0;right:0;bottom:6%;
  max-width:1560px;margin:0 auto;padding:0 32px;
}
.ks-about__vtext h2{
  font-size:clamp(38px,6.4vw,88px);font-weight:700;letter-spacing:-.03em;line-height:1;
  color:var(--ink);
  opacity:0;transform:translateY(70px);
  transition:opacity 1.2s cubic-bezier(.22,.61,.36,1) .25s,transform 1.2s cubic-bezier(.22,.61,.36,1) .25s;
}
.ks-about.is-in .ks-about__vtext h2{opacity:1;transform:none}

/* ---- 본문 ---- */
.ks-about__bodywrap{flex:1;display:flex;align-items:center}
.ks-about__body{
  width:100%;max-width:1560px;margin:0 auto;padding:72px 32px 88px;
  display:grid;grid-template-columns:360px 1fr;gap:0 90px;align-items:start;
}
.ks-about__label{
  font-size:12px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--ci);
  padding-top:10px;position:relative;
}
.ks-about__label::before{
  content:"";position:absolute;left:0;top:-16px;width:40px;height:2px;background:var(--ci);
}
.ks-about__statement{
  font-size:clamp(22px,2.6vw,34px);font-weight:500;line-height:1.5;letter-spacing:-.01em;color:var(--ink);
}
.ks-about__paras{margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.ks-about__paras p{font-size:16px;line-height:1.9;color:var(--text)}
.ks-about__paras b{font-weight:600;color:var(--ink)}

.ks-about__more{
  display:inline-flex;align-items:center;gap:12px;margin-top:52px;
  padding:15px 30px;border:1px solid var(--ci);border-radius:2px;
  font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ci);text-decoration:none;background:transparent;
  transition:background .35s ease,color .35s ease;
}
.ks-about__more span{display:block;width:18px;height:1px;background:currentColor;position:relative;transition:width .35s ease}
.ks-about__more span::after{
  content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;
  border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)
}
.ks-about__more:hover{background:var(--ci);color:#fff}
.ks-about__more:hover span{width:28px}

/* 본문 리빌 */
.ks-about__body > *{opacity:0;transform:translateY(36px);transition:opacity 1s ease,transform 1s ease}
.ks-about__body > *:nth-child(2){transition-delay:.12s}
.ks-about.is-in .ks-about__body > *{opacity:1;transform:none}

/* ---- 반응형 ---- */
@media (max-width:1189px){
  .ks-about__visual{flex-basis:44vh;min-height:320px}
  .ks-about__vtext{padding:0 40px}
  .ks-about__body{padding:64px 40px 80px;grid-template-columns:220px 1fr;gap:0 56px}
  .ks-about__paras{gap:32px}
}
@media (max-width:767px){
  .ks-about{min-height:560px;min-height:max(560px,100svh)}
  .ks-about__visual{flex-basis:42vh;min-height:260px}
  .ks-about__visual::after{background:linear-gradient(180deg,rgba(255,255,255,.24) 0%,rgba(255,255,255,.06) 40%,rgba(255,255,255,.86) 88%,#fff 100%)}
  .ks-about__vtext{padding:0 24px;bottom:8%}
  .ks-about__body{padding:48px 24px 64px;grid-template-columns:1fr;gap:26px}
  .ks-about__label::before{top:-14px}
  .ks-about__paras{margin-top:30px;grid-template-columns:1fr;gap:26px}
  .ks-about__more{margin-top:36px;width:100%;justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .ks-about__visual img{transform:none;transition:none}
  .ks-about__vtext h2,.ks-about__body > *{opacity:1;transform:none;transition:none}
}