/* =========================================================
   K-ACT 공식 출범식 — K-MOTION GLOBAL WEEK
   Design tokens mirror the Figma variables.
   ========================================================= */
:root{
  --black:#101010;
  --body:#050505;
  --gray:#929292;
  --primary:#e9e9e9;   /* section gray bg */
  --purple:#7d1bf6;    /* theme accent    */
  --light-gray:#d4d4d8;
  --white:#ffffff;

  --font:"Pretendard","Helvetica Neue",Helvetica,Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --header-h:68px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--body);
  background:var(--white);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{display:block;max-width:100%;}
h1,h2,h3,p{margin:0;}
a{text-decoration:none;color:inherit;}
.is-bold{font-weight:700;}

/* ================= Header ================= */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--header-h);
  background:var(--black);
  display:flex;align-items:center;justify-content:center;
  padding:10px 65px;
}
.site-header__logo img{height:36px;width:auto;}

/* ================= Hero ================= */
.hero{
  position:relative;
  min-height:clamp(600px,88vh,900px);
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  padding:clamp(160px,22vh,300px) clamp(24px,10vw,180px) clamp(90px,14vh,200px);
  background:url("../img/hero-bg.png") center/cover no-repeat;
  overflow:hidden;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:rgba(255,255,255,.4);
  pointer-events:none;
}
.hero__inner{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;
  gap:clamp(20px,3vw,35px);
  max-width:900px;width:100%;
}
.hero__title{
  font-weight:600;
  font-size:clamp(2rem,5.2vw,4.5rem);   /* 72px */
  line-height:1.2;
  color:var(--body);
  word-break:keep-all;
}
.hero__subtitle{
  font-size:clamp(1rem,1.7vw,1.5rem);    /* 24px */
  line-height:1.58;
  color:var(--body);
  word-break:keep-all;
}
.hero__subtitle span{display:block;}
.hero__badge{
  display:inline-flex;align-items:center;gap:.5em;
  background:var(--white);
  border:1px solid var(--gray);
  border-radius:5px;
  padding:7px 30px;
  font-size:clamp(1rem,1.5vw,1.5rem);    /* 24px */
  white-space:nowrap;
}

/* ================= Split (two-column) sections ================= */
.split{display:flex;flex-wrap:wrap;}
.split__col{flex:1 1 50%;min-width:0;}

/* ================= Intro / KMGW ================= */
.intro__text{
  background:var(--white);
  display:flex;flex-direction:column;justify-content:center;
  gap:13px;
  padding:clamp(50px,9vw,130px) clamp(28px,10.4vw,200px);
}
.intro__title{display:flex;flex-direction:column;gap:7px;}
.intro__heading{
  font-weight:600;
  font-size:clamp(2rem,4.4vw,4.5rem);    /* 72px */
  line-height:1.18;
  word-break:keep-all;
}
.intro__eyebrow{
  font-size:clamp(.9rem,1.2vw,1.125rem); /* 18px */
  color:var(--gray);
  letter-spacing:.02em;
}
.intro__sub{padding:clamp(24px,3vw,50px) 0 19px;display:flex;flex-direction:column;gap:15px;}
.intro__sub-title{
  font-weight:700;
  font-size:clamp(1.25rem,2.1vw,1.875rem); /* 30px */
  line-height:1.4;
  color:var(--purple);
}
.intro__sub-desc{
  font-size:clamp(.9rem,1.2vw,1.125rem);  /* 18px */
  color:var(--gray);
  letter-spacing:-.01em;
  word-break:keep-all;
}
.btn-arrow{
  align-self:flex-start;
  display:inline-flex;align-items:center;gap:20px;
  border:1px solid var(--black);
  border-radius:7px;
  padding:11px 31px;
  font-weight:700;
  font-size:clamp(.9rem,1.2vw,1.125rem);  /* 18px */
  color:var(--body);
  transition:background .2s ease,color .2s ease;
}
.btn-arrow:hover{background:var(--black);color:var(--white);}
.btn-arrow:hover .btn-arrow__icon{filter:invert(1);}
.btn-arrow__label{padding-left:24px;}
.btn-arrow__icon{
  display:flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;flex:none;
}
.btn-arrow__icon img{width:13px;height:13px;}

.intro__visual{
  position:relative;
  min-height:clamp(320px,42vw,723px);
  display:flex;align-items:center;justify-content:center;
  padding:clamp(40px,7vw,130px);
  background:url("../img/kmgw-right-bg.png") center/cover no-repeat;
}
.intro__visual-logo{
  position:relative;z-index:1;
  width:min(78%,620px);height:auto;object-fit:contain;
}

/* ================= Organization ================= */
.org{background:var(--primary);}
.org__info{
  display:flex;flex-direction:column;justify-content:center;
  gap:25px;
  padding:clamp(56px,7vw,100px) clamp(28px,4vw,50px) clamp(56px,7vw,100px) clamp(28px,9.4vw,180px);
}
.org__title{
  font-weight:600;
  font-size:clamp(1.25rem,2.1vw,1.875rem); /* 30px */
  line-height:1.4;
  padding:0 20px;
}
.org__logo img{width:clamp(240px,32vw,433px);height:auto;}
.org__desc{display:flex;flex-direction:column;gap:20px;padding:0 20px;}
.org__names{
  font-size:clamp(.95rem,1.2vw,1.125rem); /* 18px */
  line-height:1.55;letter-spacing:-.01em;
}
.org__body{
  font-size:1rem;                          /* 16px */
  line-height:1.62;
  color:var(--body);
  word-break:keep-all;
}
.org__visual{
  display:flex;align-items:center;justify-content:center;
  padding:clamp(40px,5vw,50px) clamp(24px,7vw,100px);
}
.org__chart{width:min(100%,615px);height:auto;}

/* ================= Footer ================= */
.site-footer{
  background:var(--black);
  color:var(--light-gray);
  text-align:center;
  padding:clamp(50px,7vw,80px) clamp(24px,8vw,120px);
}
.site-footer__name{font-weight:600;font-size:1rem;line-height:1.4;}
.site-footer__contact{font-size:.875rem;line-height:1.6;margin-top:10px;}
.site-footer__copy{font-size:.875rem;line-height:1.4;margin-top:30px;}

/* ================= Scroll to top ================= */
.to-top{
  position:fixed;right:clamp(16px,2vw,30px);bottom:clamp(16px,2vw,30px);
  z-index:90;
  width:56px;height:56px;border-radius:50%;
  border:1px solid rgba(16,16,16,.15);
  background:var(--white);
  box-shadow:0 6px 20px rgba(0,0,0,.14);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .2s ease;
}
.to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}
.to-top:hover{background:var(--black);}
.to-top:hover img{filter:invert(1);}
.to-top img{width:26px;height:26px;}

/* ================= Responsive ================= */
@media (max-width:900px){
  .split{flex-direction:column;}
  .split__col{flex:1 1 100%;}
  .intro__visual{order:-1;}            /* image on top when stacked */
  .btn-arrow{align-self:stretch;justify-content:center;}
}
@media (max-width:520px){
  .site-header{padding:10px 20px;}
  .hero__badge{padding:7px 20px;}
  .btn-arrow{gap:10px;padding:11px 20px;}
  .btn-arrow__label{padding-left:0;}
  .org__title,.org__desc,.org__names{padding-left:0;padding-right:0;}
  .org__title{padding:0;}
}
