/* Seoha's introduction: a short memoir at the door of Mul-gyeol study. */
.arrival-title .eyebrow {font-size:12px;letter-spacing:.1em}
.character-story {
  --story-photo-gutter:26px;
  padding:54px 26px;
  border-top:1px solid var(--line);
  background:radial-gradient(ellipse at 8% 10%,#1a475844,transparent 64%),var(--bg);
}
.character-story-kicker {
  font-size:12px;
  line-height:1.85;
  letter-spacing:.07em;
  color:var(--blue);
  margin-bottom:17px;
}
.sales-section.character-story>p.character-story-kicker {
  font-size:12px;
  line-height:1.85;
  color:var(--blue);
  margin:0 0 17px;
}
.character-story-title {
  font:500 28px/1.7 var(--serif);
  letter-spacing:-.035em;
  text-wrap:balance;
  color:var(--ink);
  margin:0 0 25px;
}
.character-story-portrait {
  margin:0 calc(-1 * var(--story-photo-gutter)) 29px;
  border:0;
  border-radius:0;
  overflow:hidden;
  background:transparent;
}
.character-story-portrait img {
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 73%,transparent);
  mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 73%,transparent);
}
.character-story-portrait figcaption {
  font-size:12px;
  line-height:1.85;
  color:var(--muted);
  padding:8px var(--story-photo-gutter) 0;
  text-align:center;
}
.character-story-copy p {
  font-size:16px;
  line-height:1.95;
  letter-spacing:-.005em;
  color:var(--body-text);
}
.character-story-copy p+p {margin-top:22px}
.character-story-traits {
  padding:0;
  margin:30px 0 0;
  list-style:none;
  border-top:1px solid var(--line);
  counter-reset:character-trait;
}
.character-story-traits li {
  position:relative;
  padding:19px 0 19px 31px;
  border-bottom:1px solid var(--line);
  counter-increment:character-trait;
}
.character-story-traits li:before {
  content:counter(character-trait,decimal-leading-zero);
  position:absolute;
  top:21px;
  left:0;
  font-size:12px;
  line-height:1.85;
  color:var(--blue);
}
.character-story-traits strong {
  display:block;
  font-size:15px;
  line-height:1.85;
  font-weight:500;
  color:var(--accent);
  margin-bottom:4px;
}
.character-story-traits span {
  display:block;
  font-size:14px;
  line-height:1.9;
  color:var(--body-text);
}
.character-story-signature {
  font:400 17px/1.9 var(--serif);
  color:var(--accent);
  text-align:right;
  margin-top:26px;
}
.sales-section.character-story>p.character-story-signature {
  font:400 17px/1.9 var(--serif);
  color:var(--accent);
  margin:26px 0 0;
}
.character-story-note {
  display:block;
  margin-top:21px;
  font-size:12px;
  line-height:1.85;
  color:var(--fine-text);
}
.character-story-home {background:linear-gradient(var(--bg),#0d2631 52%,var(--bg))}
.character-story-home .character-story-copy p {font-size:15px;line-height:1.95}

@media(max-width:370px) {
  .character-story {--story-photo-gutter:20px;padding:46px 20px}
  .character-story-title {font-size:25px;line-height:1.7}
  .character-story-kicker {letter-spacing:.035em}
  .character-story-signature {font-size:16px}
  .sales-section.character-story>p.character-story-signature {font-size:16px}
}
@media(min-width:780px) {
  .character-story {--story-photo-gutter:34px;padding:64px 34px}
  .character-story-title {font-size:31px}
}
@media print {.character-story {display:none}}