.home-page {
  --gold: #ffe07f;
  --cream: #fff2e0;
  --pink: #ff2a80;
  --wine: #250009;
  --scale: min(1vw, 19.2px);
  max-width: 1920px;
  margin-inline: auto;
  background: var(--wine);
  color: var(--cream);
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
}

.home-page *, .home-page *::before, .home-page *::after { box-sizing: border-box; }
.home-page h1, .home-page h2, .home-page h3, .home-page p, .home-page figure { margin: 0; }
.home-page img { display: block; max-width: 100%; }
.home-page a { color: inherit; }
.home-page a:focus-visible, .home-page button:focus-visible {
  outline: 3px solid #fff4bc;
  outline-offset: 3px;
}

.home-page h2, .home-page h3, .home-hero-links {
  font-family: "Songti SC", "Noto Serif CJK SC", SimSun, serif;
  font-weight: 900;
  line-height: 1.24;
}

.home-page .gold, .home-page .outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4em;
  padding: .45em 1.08em;
  border: 1px solid #ffed91;
  border-radius: 999px;
  font-size: clamp(14px, 1.65vw, 32px);
  line-height: 1.2;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.home-page .gold {
  color: #391401;
  background: linear-gradient(#fffde2, #fff084 34%, #ffcf05 69%, #ffad0e);
  box-shadow: inset 0 2px #fff9ca, 0 0 10px #ff980054;
}

.home-page .outline {
  color: #fff0bb;
  background: #28010cc9;
  box-shadow: inset 0 0 12px #f68e322a;
}

.home-page .consult-button {
  padding: .53em 1.8em;
  color: #8d1b01;
  font-size: clamp(19px, 2.9vw, 56px);
}

.home-page .consult-button span {
  padding-right: .36em;
  margin-right: .08em;
  border-right: 1px solid #aa4e0c66;
}

.home-banner {
  position: relative;
  isolation: isolate;
  min-height: calc(var(--scale) * 44.6);
  display: grid;
  grid-template-columns: 47% 53%;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 100% 77%, #9200277a, transparent 50%),
    radial-gradient(ellipse at 56% 12%, #69172066, transparent 56%),
    linear-gradient(110deg, #300214, #190008 73%, #30000f);
}

.home-banner::before, .home-banner::after,
.home-page .ornament::before, .home-page .ornament::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.home-banner::before {
  width: 58%;
  height: 79%;
  top: 9%;
  right: -4%;
  border-right: 3px solid #ff629e;
  border-bottom: 7px solid #ff78a5;
  border-radius: 45% 56%;
  transform: rotate(-12deg);
  box-shadow: 8px 9px 20px #ed0b5e, inset -4px -3px 16px #ff9e63;
  z-index: -1;
}

.home-banner::after {
  inset: auto 0 4% 45%;
  height: 12%;
  background: url("/assets/home/banner-streak.jpg") bottom right / 100% 100% no-repeat;
  mask-image: linear-gradient(90deg, transparent, #000 13%);
}

.home-couple {
  position: absolute;
  z-index: -1;
  width: 48.5%;
  height: 100%;
  object-fit: cover;
  object-position: 48% top;
  mask-image: linear-gradient(90deg, #000 85%, transparent), linear-gradient(#000 89%, transparent);
  mask-composite: intersect;
}

.banner-copy {
  grid-column: 2;
  padding: calc(var(--scale) * 3.3) 8% calc(var(--scale) * 6.2) 2%;
  position: relative;
  align-self: start;
}

.hero-eyebrow {
  display: flex;
  gap: .45em;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  text-align: center;
  font-size: clamp(14px, 1.85vw, 36px);
  font-weight: 700;
}

.hero-eyebrow::before, .hero-eyebrow::after {
  content: "";
  height: 1px;
  flex: 1;
  background: currentColor;
  opacity: .68;
}

.home-page .home-hero-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .15em .35em;
  margin: .29em 0 .37em;
  color: var(--gold);
  font-size: clamp(26px, 4.05vw, 78px);
  font-style: italic;
  text-shadow: 0 3px #733009;
}

.home-hero-links a {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .09em;
  white-space: nowrap;
  text-decoration: none;
}

.home-hero-links img, .service-card-copy h3 img {
  width: 1.08em;
  height: 1em;
  object-fit: contain;
  mix-blend-mode: lighten;
}

.home-page .ribbon {
  padding: .42em .6em;
  border-radius: 999px;
  background: linear-gradient(#ff5891, #e51560 53%, #ad0241);
  box-shadow: inset 0 1px #ff9bc1;
  font-size: clamp(14px, 1.8vw, 35px);
  font-weight: 800;
  text-align: center;
}

.home-page .promises {
  margin: .7em 0 0;
  padding: 0;
  display: flex;
  justify-content: space-evenly;
  gap: .25em .7em;
  flex-wrap: wrap;
  list-style: none;
  font-size: clamp(13px, 1.54vw, 30px);
  font-weight: 700;
  color: var(--gold);
}

.promises li::before {
  content: "";
  display: inline-block;
  width: .53em;
  height: .3em;
  margin-right: .28em;
  border: solid currentColor;
  border-width: 0 0 .12em .12em;
  transform: rotate(-45deg) translateY(-.13em);
}

.banner-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .6em;
  margin-top: calc(var(--scale) * 1.9);
  font-size: clamp(16px, 2.1vw, 40px);
}

.banner-actions .gold, .banner-actions .outline {
  font-size: inherit;
  padding-block: .52em;
}

.home-page .ornament {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: calc(var(--scale) * 1.3) 3.65% calc(var(--scale) * 2.2);
  background:
    radial-gradient(ellipse at 2% 0, #87002980 0, transparent 22%),
    radial-gradient(ellipse at 96% 100%, #97003166, transparent 30%),
    #260007;
  border-block: 1px solid #a92d5366;
}

.home-page .ornament::before, .home-page .ornament::after {
  inset: -1% 0 auto;
  height: 8%;
  border: 2px solid #fb5e9d85;
  border-radius: 50%;
  box-shadow: 0 0 13px 4px #ff28746b, inset 0 0 18px #ff2874;
  z-index: -1;
}

.home-page .ornament::after { inset: auto -2% -5%; }

.home-page .home-strength.ornament::after {
  inset: auto 0 0;
  height: clamp(15px, 2.1vw, 40px);
  border: 0;
  border-radius: 0;
  background: url("/assets/home/strength-streak.jpg") center / 100% 100% no-repeat;
  box-shadow: none;
}


.home-title {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto calc(var(--scale) * 1.12);
  padding-inline: 1.35em;
  position: relative;
  text-align: center;
  font-size: clamp(19px, 3.05vw, 58px);
}

.home-title::before, .home-title::after {
  content: "";
  position: absolute;
  top: 50%;
  width: .83em;
  height: 1.4em;
  transform: translateY(-50%);
  background: url("/assets/home/laurel.png") center / contain no-repeat;
  mix-blend-mode: lighten;
  pointer-events: none;
}

.home-title::before { left: .17em; }
.home-title::after { right: .17em; transform: translateY(-50%) scaleX(-1); }

.home-title h2 {
  color: var(--gold);
  font-size: 1em;
  letter-spacing: .026em;
  text-shadow: 0 2px #6b2800;
}

.home-title .subtitle {
  margin-top: .28em;
  color: var(--cream);
  font-size: .51em;
  line-height: 1.45;
}

.home-strength .home-title { margin-bottom: .55rem; }

.intro-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr 1fr;
  gap: 1%;
}

.intro-grid > *, .home-page .neon-card {
  min-width: 0;
  overflow: hidden;
  border: 2px solid #ffb5c5;
  border-radius: clamp(12px, 1.64vw, 31px);
  background: linear-gradient(163deg, #6e0025, #200006 72%);
  box-shadow: 0 0 14px #ff176d, inset 0 0 18px #a4003b;
}

.intro-grid > * { min-height: calc(var(--scale) * 14.3); }

.office-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brand-preview {
  display: grid;
  position: relative;
  isolation: isolate;
  align-items: start;
  grid-template-columns: 1fr 1fr;
  justify-items: center;
  text-align: center;
  background: radial-gradient(ellipse at 92% 82%, #ef0b72, #410754 67%, #29193c);
}

.brand-preview-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  mask-image: linear-gradient(90deg, #000 84%, transparent);
}

.brand-preview div { padding: .6em .45em .6em 0; }
.brand-preview strong {
  display: block;
  color: #fff3fc;
  font-size: clamp(16px, 3.05vw, 58px);
  line-height: 1.1;
  font-family: "Songti SC", SimSun, serif;
}

.brand-preview span {
  font-size: clamp(13px, 2vw, 38px);
  color: #ffe0f0;
}

.credentials {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: .32em;
  padding: 4% 5%;
  text-align: center;
}

.credentials img {
  width: 100%;
  border-radius: 6px;
}

.credentials h3 {
  font-size: clamp(17px, 2.4vw, 46px);
  color: var(--gold);
}

.credentials p { font-size: clamp(12px, 1.47vw, 28px); }

.home-page .stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 0;
  padding: calc(var(--scale) * .8) 0;
  list-style: none;
}

.stats li {
  display: flex;
  gap: .65em;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: clamp(12px, 1.35vw, 26px);
}

.stats li + li { border-left: 1px solid #c99a3770; }
.stats strong {
  display: block;
  color: var(--gold);
  font: 900 1.82em / 1.03 Georgia, "Songti SC", serif;
}

.home-page .home-symbol {
  width: 1.1em;
  height: 1em;
  display: inline-block;
  object-fit: contain;
  vertical-align: -.11em;
  mix-blend-mode: lighten;
}

.stats .home-symbol { font-size: 1.85em; }

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1%;
  margin-bottom: calc(var(--scale) * .65);
  text-align: center;
}

.team-grid .neon-card > img {
  width: 100%;
  height: calc(var(--scale) * 6.35);
  object-fit: cover;
}

.team-grid h3 {
  margin-top: .16em;
  color: #ffe6a2;
  font-size: clamp(15px, 1.9vw, 36px);
}

.team-grid p {
  padding: 0 .4em .5em;
  font-size: clamp(12px, 1.45vw, 28px);
}

.benefits-title { font-size: clamp(19px, 2.55vw, 49px); }

.benefits {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 11% minmax(0, 1fr);
  gap: calc(var(--scale) * .8) 0;
  align-items: stretch;
  margin-top: 1em;
}

.benefits section {
  display: flex;
  gap: .66em;
  align-items: center;
  text-align: center;
  color: #240900;
  padding: .54em .87em;
  background: linear-gradient(155deg, #fff9df, #ffeba6 77%, #ffe5a0);
  border: 2px solid #ffefae;
  border-radius: 7em 15em / 5em 8em;
  box-shadow: 0 0 16px #fc5e2c;
  font-size: clamp(14px, 2vw, 38px);
}

.benefits section:nth-of-type(1) { grid-area: 1 / 1; }
.benefits section:nth-of-type(2) { grid-area: 1 / 3; }
.benefits section:nth-of-type(3) { grid-area: 2 / 1; }
.benefits section:nth-of-type(4) { grid-area: 2 / 3; }
.guarantee-shield {
  grid-area: 1 / 2 / 3;
  place-self: center;
  width: 96%;
  mix-blend-mode: lighten;
}

.benefits h3 { font-size: .93em; }
.benefits p { font-size: .62em; line-height: 1.43; }
.benefits em { color: #c31a08; font-style: normal; }

.benefits .number {
  flex: none;
  display: grid;
  width: 1.48em;
  height: 1.48em;
  place-items: center;
  border: 1px solid #fff8b5;
  border-radius: 50%;
  background: linear-gradient(#ff5505, #ac0400);
  box-shadow: 0 0 .4em #ff9a2e;
  color: #ffe486;
  font-family: Georgia, serif;
  font-weight: 900;
}

.consult-band {
  display: grid;
  place-items: center;
  min-height: calc(var(--scale) * 15.5);
  padding: 28px 12px;
  background: radial-gradient(ellipse at 50% 49%, #50001a, #200007 66%);
}

.home-services.ornament { padding-inline: 7.75%; }
.service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(var(--scale) * 1.4);
}

.service-grid section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36%;
  position: relative;
  isolation: isolate;
  min-height: calc(var(--scale) * 19.5);
  box-shadow: 0 0 18px #ff176d, inset 0 0 15px #ff914185;
}

.service-card-copy {
  z-index: 1;
  padding: calc(var(--scale) * 1.3) 0 calc(var(--scale) * 1.15) calc(var(--scale) * 1.65);
}

.service-card-copy h3 {
  display: flex;
  align-items: center;
  gap: .12em;
  color: var(--gold);
  font-size: clamp(19px, 3.18vw, 61px);
  white-space: nowrap;
}

.service-card-copy ul {
  list-style: none;
  padding: 0;
  margin: .4em 0 .5em 1.32em;
  font-size: clamp(13px, 1.75vw, 34px);
  line-height: 1.32;
}

.service-card-copy li {
  position: relative;
  padding-left: 1.2em;
  text-wrap: nowrap;
}

.service-card-copy li::before, .service-card-copy li::after {
  position: absolute;
  content: "";
  left: 0;
}

.service-card-copy li::before {
  top: .25em;
  width: .8em;
  height: .78em;
  border: 1px solid var(--gold);
  border-radius: 3px;
}

.service-card-copy li::after {
  top: .4em;
  left: .16em;
  width: .63em;
  height: .32em;
  border: solid var(--gold);
  border-width: 0 0 .1em .1em;
  transform: rotate(-45deg);
}

.service-card-copy .gold { margin-left: 1.15em; }
.service-portrait {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  mask-image: linear-gradient(90deg, transparent, #000 10%);
}

.home-videos.ornament { text-align: center; padding-inline: 2.35%; }
.video-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25%;
}

.video-preview, .featured-preview {
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 20%, #902f6a, #460017 64%, #18000b);
}

.video-preview { aspect-ratio: 2.53; }
.video-preview img, .featured-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-preview img { object-position: center 34%; }

.video-duration {
  position: absolute;
  bottom: .32em;
  right: .45em;
  padding: .12em .5em;
  background: #16000bdc;
  border-radius: 999px;
  color: #fff5ef;
  font-size: clamp(12px, 1.45vw, 28px);
}

.video-grid h3 {
  margin: .35em .25em .1em;
  color: var(--gold);
  font-size: clamp(15px, 2.06vw, 39px);
}

.video-grid p {
  margin: 0 .35em .55em;
  font-size: clamp(13px, 1.55vw, 29px);
}

.featured {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 3%;
  min-height: calc(var(--scale) * 22);
  margin: calc(var(--scale) * 1.65) 0 calc(var(--scale) * 1.55);
  padding: 1.8% 3.5%;
  border: 2px solid #ff4388;
  border-radius: 9% 5% / 22%;
  box-shadow: 0 0 25px #ea2162a6, inset 0 0 33px #92083a;
  background: radial-gradient(ellipse at 70% 50%, #570117, #24000a 71%);
}

.feature-kicker {
  display: inline-block;
  padding: .15em .58em;
  border-radius: .3em;
  font-size: clamp(16px, 2.55vw, 49px);
  color: #fff5dc;
  font-weight: 800;
  background: linear-gradient(#fc5083, #ad043d);
  transform: rotate(-5deg);
}

.featured h3 {
  margin-top: .12em;
  color: var(--gold);
  font-size: clamp(22px, 4.1vw, 79px);
  font-style: italic;
}

.featured-preview {
  height: 100%;
  min-height: 8em;
  max-height: calc(var(--scale) * 19.7);
  border: 3px solid #ffdc84;
  border-radius: 50%;
  box-shadow: 0 0 17px #ff8b19;
}

.featured-preview img { object-position: center; }
.featured-preview .video-duration { right: 11%; bottom: 13%; }

.home-articles.ornament {
  padding-inline: 1.6%;
  padding-bottom: calc(var(--scale) * 4.8);
}

.article-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1%;
  margin-top: calc(var(--scale) * 2.65);
}

.article-grid article {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 2px solid #fff5d8;
  border-radius: 50% 50% 21% 20% / 26% 24% 13% 13%;
  background: linear-gradient(#fff9ec, #ffe0a0);
  color: #170900;
}

.article-grid img {
  width: 100%;
  aspect-ratio: 1.52;
  object-fit: cover;
}

.article-grid article > div {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: .4em .6em .8em;
  font-size: clamp(15px, 2.17vw, 42px);
}

.article-grid h3 {
  font-size: 1em;
  line-height: 1.34;
}

.article-grid p {
  font-size: .81em;
  line-height: 1.36;
  margin: .35em 0 .55em;
}

.article-grid .gold {
  align-self: center;
  margin-top: auto;
  font-size: .79em;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .home-page .gold, .home-page .outline, .home-page .neon-card, .home-hero-links a {
    transition: transform .22s ease, filter .22s ease;
  }

  .home-page .gold:hover, .home-page .outline:hover { transform: translateY(-2px); filter: brightness(1.12); }
  .home-page .neon-card:hover { transform: translateY(-3px); }
  .home-hero-links a:hover { filter: brightness(1.18); }
}

@media (max-width: 1050px) {
  .home-title .subtitle { font-size: max(14px, .51em); }
  .service-grid section { grid-template-columns: minmax(0, 1fr) 34%; }
  .service-card-copy h3 { font-size: clamp(20px, 3.14vw, 34px); }
  .service-card-copy ul { margin-left: .58em; }
  .service-card-copy .gold { margin-left: .45em; }
}

@media (max-width: 740px) {
  .home-banner { min-height: 315px; grid-template-columns: 41% 59%; }
  .home-couple { width: 46%; mask-image: linear-gradient(90deg, #000 70%, transparent); }
  .banner-copy { padding: 32px 5% 55px 0; align-self: center; }
  .hero-eyebrow { font-size: clamp(13px, 2.6vw, 19px); }
  .home-page .home-hero-links { font-size: clamp(21px, 4.45vw, 33px); }
  .banner-actions { margin-top: 14px; }
  .home-page .ribbon { font-size: clamp(13px, 2.3vw, 17px); }
  .home-page .ornament { padding: 24px 4%; }
  .home-title { margin-bottom: 12px; }
  .home-title h2 { letter-spacing: 0; }
  .intro-grid { gap: 9px; }
  .intro-grid > * { min-height: 115px; }
  .home-page .stats { padding-block: 12px; }
  .stats li { gap: .2em; }
  .stats .home-symbol { font-size: 1.4em; }
  .team-grid { gap: 8px; margin-bottom: 16px; }
  .team-grid .neon-card > img { height: 59px; }
  .benefits { gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefits section:nth-of-type(n) { grid-area: auto; padding: .8em; border-radius: 18px; }
  .benefits h3 { font-size: 15px; }
  .benefits p { font-size: 13px; }
  .home-page .guarantee-shield { display: none; }
  .service-grid, .video-grid { gap: 12px; }
  .service-grid section { min-height: 145px; }
  .service-card-copy { padding: .66rem 0 .75rem .6rem; }
  .service-card-copy li { text-wrap: wrap; }
  .video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .video-grid p { min-height: 2.5em; }
  .featured { margin-block: 18px; }
  .home-articles.ornament { padding-bottom: 45px; }
  .article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
}

@media (max-width: 470px) {
  .home-banner {
    min-height: 365px;
    display: block;
  }

  .home-couple {
    width: 100%;
    opacity: .56;
    mask-image: linear-gradient(#000 15%, #0009 50%, transparent);
  }

  .home-banner::before { width: 88%; }
  .banner-copy { padding: 38px 5% 55px; }
  .home-page .home-hero-links { font-size: clamp(21px, 6.35vw, 30px); }
  .banner-actions .gold, .banner-actions .outline { font-size: 14px; }
  .intro-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brand-preview { grid-column: 1 / -1; grid-row: 1; max-height: 145px; }
  .brand-preview strong { font-size: 23px; }
  .brand-preview span { font-size: 15px; }
  .stats li { flex-direction: column; gap: .25em; }
  .stats strong { font-size: 1.5em; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-grid .neon-card > img { height: 70px; }
  .benefits, .service-grid { grid-template-columns: minmax(0, 1fr); }
  .service-grid section { grid-template-columns: minmax(0, 1fr) 33%; }
  .service-card-copy h3 { font-size: clamp(22px, 6.4vw, 30px); }
  .featured { grid-template-columns: minmax(0, 1fr); padding: 12px; gap: 12px; }
  .featured-preview { min-height: 100px; }
  .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-grid article:last-child { width: 67%; grid-column: 1 / -1; justify-self: center; }
}

@media (max-width: 350px) {
  .article-grid { grid-template-columns: minmax(0, 1fr); }
  .article-grid article:last-child { width: auto; grid-column: auto; justify-self: auto; }
}