/* CLEO introduction: ice-blue colour, stronger type and equal cards. */
.home-reasons.home-highlights {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px;
  width: min(1320px,100%); margin: 0 auto; padding: 44px 40px; background: #fff; border: 0;
}
.home-highlights > .highlight-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px;
  min-width: 0; min-height: 204px; padding: 30px 20px;
  --card-fill: #e5f1f9; --card-border: #acc7da; --card-accent: #6389a5; --card-hover: #d9ebf7;
  border: 1.5px solid var(--card-border); border-top: 4px solid var(--card-accent);
  border-radius: 10px; background: var(--card-fill); color: #213f56;
  text-align: center; text-decoration: none; transition: border-color .18s, background-color .18s;
}
.home-highlights > .highlight-card:nth-child(2) { --card-fill: #d7eaf7; --card-border: #8fb2cb; --card-accent: #365f7c; --card-hover: #c9e2f3; }
.home-highlights > .highlight-card:nth-child(3) { --card-fill: #eaf1f7; --card-border: #b6c9d8; --card-accent: #7996ac; --card-hover: #dce9f3; }
.home-highlights .highlight-copy { min-width: 0; }
.home-highlights .highlight-card h3 {
  margin: 0; color: #203e55; font-family: 'Cormorant Garamond',Georgia,serif;
  font-size: clamp(30px,3vw,42px); font-weight: 600; line-height: 1.15;
  letter-spacing: -.025em; text-wrap: nowrap;
}
.home-highlights .highlight-caption {
  display: block; margin-top: 12px; color: #415b70;
  font: 550 16px/1.5 var(--font-body); letter-spacing: 0;
}
html[lang="ko"] .home-highlights .highlight-card h3 {
  font-family: var(--font-body); font-size: clamp(24px,2.2vw,30px);
  font-weight: 750; line-height: 1.4; letter-spacing: -.035em;
}
.home-highlights .highlight-arrow { display: block; flex: 0 0 auto; width: 28px; height: 18px; color: #315d7d; }
.home-highlights .highlight-arrow svg { display: block; width: 100%; height: 100%; }
.home-highlights .highlight-arrow svg path { stroke-width: 1.8; }
.home-highlights > .highlight-card:hover { border-color: var(--card-accent); background: var(--card-hover); }
.home-highlights > .highlight-card:focus-visible { outline: 3px solid #294f6a; outline-offset: 4px; }
@media (min-width: 768px) and (max-width: 1050px) {
  .home-reasons.home-highlights { gap: 14px; padding: 32px 24px; }
  .home-highlights > .highlight-card { padding: 26px 12px; min-height: 184px; }
  .home-highlights .highlight-card h3 { font-size: 30px; }
  html[lang="ko"] .home-highlights .highlight-card h3 { font-size: 23px; }
  .home-highlights .highlight-caption { font-size: 15px; }
}
@media (max-width: 767px) {
  .home-reasons.home-highlights { grid-template-columns: minmax(0,1fr); padding: 28px 20px; gap: 12px; }
  .home-highlights > .highlight-card { flex-direction: row; justify-content: space-between; gap: 16px; min-height: 118px; padding: 24px 20px; text-align: left; }
  .home-highlights .highlight-card h3 { font-size: 31px; }
  html[lang="ko"] .home-highlights .highlight-card h3 { font-size: 24px; }
  .home-highlights .highlight-caption { margin-top: 7px; font-size: 16px; }
  .home-highlights .highlight-arrow { width: 25px; }
}
@media (prefers-reduced-motion: reduce) { .home-highlights > .highlight-card { transition: none; } }