.home-about {
  position: relative;
  overflow: hidden;
  padding: clamp(78px, 8vw, 112px) 24px clamp(84px, 8vw, 120px);
  color: #eee9df;
  background: #000;
}

.home-about::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 34% 58% at 20% 45%, rgba(105, 48, 20, 0.11), transparent 76%),
    linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.08) 48%, #000 100%);
  content: "";
  pointer-events: none;
}

.home-about-character {
  position: absolute;
  bottom: -24px;
  left: max(-170px, calc(50% - 850px));
  z-index: 1;
  width: auto;
  height: min(96%, 780px);
  pointer-events: none;
  object-fit: contain;
  object-position: left bottom;
  transform: scaleX(-1);
  transform-origin: center;
  filter: drop-shadow(20px 10px 30px rgba(0, 0, 0, 0.76));
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.72) 11%, #000 24%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.72) 11%, #000 24%, #000 100%);
}

.home-about-inner {
  position: relative;
  z-index: 2;
  width: min(1120px, 100%);
  margin: 0 auto;
}

.home-about-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 48px;
  text-align: center;
}

.home-about-mark,
.home-about-card-mark {
  width: 7px;
  height: 7px;
  display: block;
  background: #bd973e;
  box-shadow: 0 0 12px rgba(189, 151, 62, 0.36);
  transform: rotate(45deg);
}

.home-about-eyebrow {
  margin-top: 17px;
  color: #c3a45f;
  font-family: var(--font-ui, Arial, Helvetica, sans-serif);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.34em;
  line-height: 1;
  text-transform: uppercase;
}

.home-about-title-row {
  display: grid;
  grid-template-columns: minmax(54px, 95px) auto minmax(54px, 95px);
  align-items: center;
  gap: 18px;
  margin-top: 15px;
}

.home-about-title-row > span {
  height: 1px;
  background: linear-gradient(90deg, transparent, #806a38);
}

.home-about-title-row > span:last-child {
  background: linear-gradient(90deg, #806a38, transparent);
}

.home-about h2 {
  margin: 0;
  color: #ead9aa;
  background: linear-gradient(180deg, #fff5d6 5%, #e3c878 52%, #b89347 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: var(--font-display, Georgia, "Times New Roman", serif);
  font-size: clamp(2.25rem, 4.4vw, 3.65rem);
  font-weight: 700;
  letter-spacing: 0.015em;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 0 4px 22px rgba(0, 0, 0, 0.7);
}

.home-about-head p {
  max-width: 720px;
  margin: 16px 0 0;
  color: #aaa39a;
  font-family: var(--font-ui, Arial, Helvetica, sans-serif);
  font-size: 0.92rem;
  font-style: italic;
  line-height: 1.55;
}

.home-about-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.home-about-card {
  min-height: 238px;
  padding: 30px 28px 32px;
  border: 1px solid rgba(132, 105, 50, 0.5);
  border-radius: 2px;
  background: rgba(10, 8, 6, 0.82);
  box-shadow: 0 15px 38px rgba(0, 0, 0, 0.27), inset 0 1px 0 rgba(255, 255, 255, 0.018);
  transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.home-about-card:hover {
  border-color: rgba(185, 154, 85, 0.68);
  background: rgba(14, 11, 8, 0.9);
  transform: translateY(-3px);
}

.home-about-card-mark {
  width: 6px;
  height: 6px;
  margin: 2px 0 21px 4px;
}

.home-about-card h3 {
  margin: 0 0 13px;
  color: #eeece7;
  font-family: var(--font-display, Georgia, "Times New Roman", serif);
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}

.home-about-card p {
  margin: 0;
  color: #aca59a;
  font-family: var(--font-ui, Arial, Helvetica, sans-serif);
  font-size: 0.88rem;
  line-height: 1.67;
}

@media (max-width: 900px) {
  .home-about-character {
    left: -190px;
    height: min(84%, 650px);
    opacity: 0.4;
  }
  .home-about-grid { grid-template-columns: 1fr; gap: 12px; }
  .home-about-card { min-height: 0; }
}

@media (max-width: 640px) {
  .home-about { padding: 68px 14px 76px; }
  .home-about-character { display: none; }
  .home-about-head { margin-bottom: 32px; }
  .home-about-title-row { grid-template-columns: 42px auto 42px; gap: 11px; }
  .home-about h2 { font-size: clamp(2rem, 11vw, 2.75rem); }
  .home-about-head p { max-width: 320px; font-size: 0.84rem; }
  .home-about-card { padding: 25px 22px 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-about-card { transition: none; }
}

/* Editorial layout: character-led composition with unboxed copy on the right. */
.home-about-editorial {
  min-height: 670px;
  padding-top: clamp(70px, 7vw, 96px);
  padding-bottom: clamp(72px, 7vw, 100px);
}

.home-about-editorial::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 4;
  height: clamp(14px, 1.35vw, 22px);
  background: url("../images/divider_stone_top.webp") center / 100% 100% no-repeat;
  content: "";
  pointer-events: none;
}

.home-about-editorial .home-about-character {
  left: max(-130px, calc(50% - 760px));
  height: min(98%, 760px);
}

.home-about-editorial .home-about-inner {
  width: min(1180px, 100%);
  display: grid;
  grid-template-columns: minmax(330px, 0.8fr) minmax(520px, 1.2fr);
  column-gap: clamp(28px, 4vw, 68px);
}

.home-about-editorial .home-about-head,
.home-about-editorial .home-about-grid {
  grid-column: 2;
}

.home-about-editorial .home-about-head {
  align-items: center;
  margin-bottom: 28px;
  text-align: center;
}

.home-about-editorial .home-about-title-row {
  width: 100%;
  grid-template-columns: minmax(54px, 1fr) auto minmax(54px, 1fr);
}

.home-about-editorial .home-about-head p {
  max-width: 650px;
}

.home-about-editorial .home-about-grid {
  display: block;
  border-top: 1px solid rgba(160, 128, 62, 0.36);
}

.home-about-editorial .home-about-card,
.home-about-editorial .home-about-card:hover {
  position: relative;
  min-height: 0;
  padding: 21px 10px 22px 30px;
  border: 0;
  border-bottom: 1px solid rgba(160, 128, 62, 0.24);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.home-about-editorial .home-about-card:hover {
  transform: translateX(4px);
}

.home-about-editorial .home-about-card-mark {
  position: absolute;
  top: 29px;
  left: 4px;
  width: 6px;
  height: 6px;
  margin: 0;
}

.home-about-editorial .home-about-card h3 {
  margin-bottom: 8px;
  font-size: clamp(1rem, 1.35vw, 1.18rem);
}

.home-about-editorial .home-about-card p {
  max-width: 650px;
  font-size: 0.86rem;
  line-height: 1.62;
}

@media (max-width: 1000px) {
  .home-about-editorial .home-about-inner {
    grid-template-columns: minmax(230px, 0.55fr) minmax(0, 1.45fr);
    column-gap: 24px;
  }

  .home-about-editorial .home-about-character {
    left: -150px;
    opacity: 0.58;
  }
}

@media (max-width: 760px) {
  .home-about-editorial {
    min-height: 0;
    padding: 68px 16px 74px;
  }

  .home-about-editorial .home-about-character {
    display: none;
  }

  .home-about-editorial .home-about-inner {
    display: block;
  }

  .home-about-editorial .home-about-head {
    align-items: center;
    text-align: center;
  }

  .home-about-editorial .home-about-title-row {
    width: auto;
    grid-template-columns: 42px auto 42px;
  }

  .home-about-editorial .home-about-grid {
    width: min(620px, 100%);
    margin: 0 auto;
  }
}