/* EUKLI readability + visual hierarchy revision · 2026-10-29
   Overrides older styles without changing scroll animations or product UI logic. */
:root {
  --readable-navy: #17345c;
  --readable-blue: #23528c;
  --readable-green: #294c45;
  --readable-muted: #455d70;
}
/* Bold, legible Korean, without affecting English lettering or phone mockup graphics. */
html[lang="ko"] h1,
html[lang="ko"] h2,
html[lang="ko"] h3 {
  font-weight: 850 !important;
  line-height: 1.27;
  letter-spacing: -.055em;
  word-break: keep-all;
  overflow-wrap: break-word;
  text-wrap: pretty;
}
html[lang="ko"] .detail-lead,
html[lang="ko"] .feature-copy p,
html[lang="ko"] .mobile-feature-description p,
html[lang="ko"] .inner-product p,
html[lang="ko"] .inner-hero p,
html[lang="ko"] .home-intro p,
html[lang="ko"] .home-scope p,
html[lang="ko"] .home-about p,
html[lang="ko"] .home-progress p,
html[lang="ko"] .home-next p,
html[lang="ko"] .editorial-lead,
html[lang="ko"] .product-extra p,
html[lang="ko"] .detail-outro p {
  font-weight: 650;
  line-height: 1.8;
  word-break: keep-all;
}
.site-header .main-nav a,
.site-header .language-switch {font-weight: 750;}
/* Distinguish the two product palettes without resorting to a near-black page. */
.product-voca .detail-intro {
  background: #d8e6f8;
  border-color: #bfd3ef;
}
.product-voca .detail-intro h2 {color: #13335e;}
.product-now .detail-intro {
  background: #d7e8dd;
  border-color: #b8d5c8;
}
.product-now .detail-intro h2 {color: #274941;}
.detail-intro {
  padding-block: clamp(88px, 9vw, 142px);
}
.detail-intro .frame {
  display: block;
  max-width: 1250px;
}
.detail-intro h2 {
  margin: 0;
  max-width: 1080px;
  font-size: clamp(38px, 5vw, 72px);
  line-height: 1.34 !important;
  letter-spacing: -.055em;
  font-weight: 850;
  overflow-wrap: break-word;
  text-wrap: balance;
}
.product-now .features-heading h2,
.product-now .feature-copy h3,
.product-now .mobile-feature-description h3 {
  color: #294c45 !important;
}
.product-voca .features-heading h2,
.product-voca .feature-copy h3,
.product-voca .mobile-feature-description h3 {
  color: #15365f !important;
}
.features-heading {margin-bottom: 42px;}
.features-heading h2 {
  margin: 0 0 14px;
  font-size: clamp(38px, 4.7vw, 68px);
  line-height: 1.27 !important;
}
.feature-section {
  padding-top: clamp(95px, 10vw, 150px);
}
.feature-copy-list, .feature-copy {min-width: 0;}
.feature-copy {
  max-width: 100%;
  padding-right: clamp(10px, 3vw, 36px);
}
.feature-copy h3,
.mobile-feature-description h3 {
  max-width: 100%;
  font-size: clamp(33px, 4vw, 57px);
  line-height: 1.32 !important;
  overflow-wrap: break-word;
  text-wrap: balance;
  margin-bottom: 20px;
}
.feature-copy p, .mobile-feature-description p {
  font-size: clamp(14px, 1.4vw, 17px);
  color: var(--readable-muted);
  line-height: 1.75;
}
.product-now .feature-copy p,
.product-now .mobile-feature-description p {color: #46645d;}
.product-voca .feature-copy p,
.product-voca .mobile-feature-description p {color: #455e7a;}
.product-now .feature-story-track .feature-stage {
  background: #e6f1ea;
  border-color: #cadecf;
}
.product-voca .feature-story-track .feature-stage {
  background: #e3eefc;
  border-color: #c9dbf0;
}
.product-now .feature-story-ready .feature-story-track .feature-copy .feature-no,
.product-now .feature-no {color:#41665b;}
.product-voca .feature-no {color:#2b588f;}
/* Remove redundant micro-copy around art, retain the meaningful three-step progress. */
.detail-hero-foot, .concept-tag, .feature-stage-note,
.hero-demo-label, .hp-art-note {display:none !important;}
/* Product list: stronger contrast and confident type. */
.inner-hero h1 {color:#152b43;line-height:1.2 !important;}
.inner-hero p, .inner-product p {color:#425b6f;}
.inner-product {border-color:#bdcbd8;background:#fff;}
.inner-product:first-child {border-color:#a7c2de;}
.inner-product:nth-child(2) {border-color:#bad7cf;}
.inner-product-label {color:#395f80;}
.inner-product h2 {line-height:1.2 !important;}
.inner-product b {color:#1a4d7f;font-weight:800;}
.detail-outro-inner h2, .product-extra h2,
.home-intro h2, .home-scope h2, .home-products h2,
.home-about h2, .home-progress h2, .home-next h2 {line-height:1.27 !important;}
/* Ensure display copy and the sticky header never collide at narrow desktop/tablet sizes. */
.detail-intro, .feature-section, .inner-hero {scroll-margin-top:96px;}
.detail-intro .frame > h2,
.features-heading > h2,
.feature-copy h3 {min-width:0;}
@media (min-width:761px) and (max-width:1100px) {
  .detail-intro h2 {font-size:clamp(39px,5.15vw,58px);line-height:1.38 !important;}
  .feature-story-ready .feature-story-track .feature-copy h3,
  .feature-copy h3 {font-size:clamp(34px,4.4vw,49px);line-height:1.34 !important;}
  .feature-copy p {font-size:15px;line-height:1.8;}
  .feature-section {padding-top:110px;}
}
@media (max-width:760px) {
  .detail-intro {padding:83px 0 91px;}
  .detail-intro .frame {display:block;}
  .detail-intro h2 {
    font-size:clamp(31px,7.25vw,44px);
    line-height:1.38 !important;
    text-wrap:pretty;
  }
  .feature-section {padding-top:91px;}
  .features-heading h2 {font-size:clamp(34px,8vw,43px);}
  .feature-story-ready .feature-story-track .feature-copy h3,
  .feature-copy h3,
  .mobile-feature-description h3 {
    font-size:clamp(27px,7.35vw,38px);
    line-height:1.36 !important;
  }
  .feature-copy p, .mobile-feature-description p {font-size:14px;line-height:1.8;}
  .inner-product {min-height:430px;}
  .detail-outro-inner h2, .product-extra h2 {font-size:clamp(35px,8vw,53px);}
}
@media (prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
}