/* =========================================================
   Altrenotti Certifications (final - stabilized)
   ========================================================= */

:root{
  --alt-bg: #ffffff; /* ✅ 누락 보완 */
  --alt-text: #2b2b2b;
  --alt-muted: #6f6a63;
  --alt-border: rgba(0,0,0,.12);
  --alt-title: #C9BCA0;
  --alt-other-bg: #7E8257;
}

/* Wrap */
.altit-wrap{
  background: var(--alt-bg);
  color: var(--alt-text);
  font-family: "Noto Sans KR", sans-serif;
}
.altit-wrap *{ box-sizing: border-box; }

/* English only serif */
.altit-wrap :lang(en),
.altit-wrap .en{
  font-family: "Noto Serif Display", serif;
}

/* reset */
.altit-wrap h1,
.altit-wrap h2,
.altit-wrap h3,
.altit-wrap h4,
.altit-wrap h5,
.altit-wrap p{
  margin: 0;
  padding: 0;
}

/* =========================================================
   HERO
   ========================================================= */
.altit-hero{
  position: relative;
  height: 350px;
  padding: 0;
  color: #fff;
  overflow: hidden;
  background: none;
}

.altit-hero .hero__imgRow{
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
}

.altit-hero .hero__imgRow img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.altit-hero__overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.65) 100%
  );
}

.altit-hero__inner{
  position: absolute;
  inset: 0;
  z-index: 2;

  max-width: 1020px;
  margin: 0 auto;
  padding: 0 16px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.altit__h1{
  font-size: 42px;
  font-weight: 400;
  letter-spacing: -0.02em;
  margin-bottom: 12px;
  color: #C9BCA0;
}

.altit__lead{
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255,255,255,.9);
  max-width: 820px;
}

/* =========================================================
   BODY
   ========================================================= */
.altit{
  padding: 56px 0;
  background: #fff;
}

.altit .altit__inner{
  max-width: 1020px;
  margin: 0 auto;
  padding: 40px 40px;
  background: #fff;
}

/* each item = stable 2-col grid */
.altit-item{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  column-gap: 106px;
  row-gap: 10px;
  align-items: center;
}

.altit-item__text{ min-width: 0; }

.altit__divider{
  margin: 40px 0;
  border-top: 1px solid var(--alt-border);
}

.altit__h3{
  font-size: 40.5px;
  font-weight: 400;
  color: var(--alt-title);
  line-height: 1.1;
  margin: 0 0 8px;
}

.altit-item__text > .altit__p{ margin-top: 20px; }

.altit__p{
  font-size: 15px;
  line-height: 1.9;
  color: var(--alt-text);
  margin: 0 0 12px;
  word-break: keep-all;
}

.altit__imgRow{
  margin: 0;
  align-self: center;
}

.altit__imgRow img{
  width: 250px;
  height: 354px;
  object-fit: cover;
  display: block;
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}

/* =========================================================
   OTHER CERTIFICATIONS (green block)
   ========================================================= */
.altit-other{
  background: var(--alt-other-bg);
  padding: 56px 0;
  margin-top: 64px;
  color: #fff;
}

.altit-other__inner{
  max-width: 1020px;
  margin: 0 auto;
  padding: 40px 40px;
}

.altit-other .altit__h3{
  color: #fff;
  text-align: center;
  margin: 0 0 100px;
}

.altit-other .altit__p{ color: #fff; }

/* 2-col grid: left text + right image */
.altit-otherItem{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  column-gap: 106px;
  align-items: center;
}

/* ✅ 최종 의도만 남김: left는 icon + text */
.altit-otherItem__left{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.altit__icon{
  width: 88px;
  height: 88px;
  object-fit: contain;
  display: block;
  margin-bottom: 6px;
}

.altit__h5{
  margin: 12px 0 8px;
  font-size: 36px;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-transform: none;
  color: #ffffff;
}

.altit-other__divider{
  margin: 28px 0;
  border-top: 1px solid rgba(255,255,255,.25);
}

/* =========================================================
   Mobile
   ========================================================= */
@media (max-width: 860px){
  .altit-hero{
    height: auto;
    min-height: 500px;
    padding: 36px 0;
  }

  .altit-hero__inner{
    height: auto;
    align-items: center;
  }

  .altit-hero .hero__imgRow img{
    object-position: calc(100% + 150px) center;
  }

  .altit__h1{ font-size: 32px; }
  .altit__h3{ font-size: 30px; }

  .altit .altit__inner,
  .altit-other__inner{
    padding: 28px 20px;
  }

  .altit-item,
  .altit-otherItem{
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 12px;
    align-items: start;
  }

  .altit__imgRow{
    display: flex;
    justify-content: center;
  }

  .altit__imgRow img{
    width: 250px;
    height: 354px;
    margin: 20px auto 0;
  }

  .altit-otherItem .altit__icon{
    width: 60px;
    height: 60px;
    margin: 0;
  }

  .altit-m{
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .altit-otherItem .altit__h5{
    margin: 0 0 6px;
    font-size: 26px;
  }

  .altit-otherItem .altit__p{
    margin: 0;
  }
   .altit-otherItem__left{
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    align-items: center;
  }

  /* 아이콘 */
  .altit-otherItem__left .altit__icon{
    width: 56px;
    height: 56px;
    margin: 0;
  }

  /* 텍스트 래퍼 */
  .altit-otherItem__left .altit-m{
    display: contents;
  }

  /* 제목은 아이콘 옆 */
  .altit-otherItem__left .altit__h5{
    grid-column: 2 / 3;
    margin: 0;
    font-size: 24px;
    line-height: 1.2;
  }

  /* 설명문은 아래 한 줄 전체 */
  .altit-otherItem__left .altit__p{
    grid-column: 1 / -1;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.7;
  }

}