/* =========================================================
   FOLLOWERS STORE
   TERMS VIP
   ========================================================= */

.terms-vip-body {
  overflow-x: hidden;
  background: #fff8fb;
  color: #321323;
}


/* =========================================================
   LEGAL PAGE
   ========================================================= */

.terms-vip-body
.legal-page {
  position: relative;

  padding:
    0 0 82px;

  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      #2b1020 0,
      #43182f 375px,
      #fff8fb 375px,
      #fffafd 100%
    );
}


/* subtle hero glow */

.terms-vip-body
.legal-page::before {
  content: "";

  position: absolute;

  width: 650px;
  height: 650px;

  top: -350px;
  right: -240px;

  border-radius: 50%;

  pointer-events: none;

  background:
    rgba(216,79,133,.17);

  filter: blur(25px);
}


.terms-vip-body
.legal-shell {
  position: relative;
  z-index: 2;

  max-width: 1080px;
}


/* =========================================================
   HERO
   ========================================================= */

.terms-vip-body
.legal-hero {
  max-width: 760px;

  margin: 0;

  padding:
    74px 0 78px;
}


.terms-vip-body
.legal-hero
.eyebrow {
  display: inline-flex;
  align-items: center;

  min-height: 29px;

  padding:
    0 11px;

  border:
    1px solid
    rgba(232,109,156,.18);

  border-radius: 999px;

  color: #ef8bb2;

  background:
    rgba(216,79,133,.08);

  font-size: 8px;

  font-weight: 900;

  letter-spacing: .14em;
}


.terms-vip-body
.legal-hero h1 {
  margin:
    17px 0 14px;

  color: #fff;

  font-size:
    clamp(
      48px,
      7vw,
      72px
    );

  line-height: .95;

  letter-spacing: -.058em;
}


.terms-vip-body
.legal-hero p {
  max-width: 620px;

  margin: 0;

  color:
    rgba(232,205,218,.72);

  font-size: 15px;

  line-height: 1.7;

  opacity: 1;
}


.terms-vip-body
.legal-effective-date {
  display: inline-flex;

  align-items: center;

  width: fit-content;

  min-height: 31px;

  margin-top: 20px;

  padding:
    0 11px;

  border:
    1px solid
    rgba(255,255,255,.1);

  border-radius: 999px;

  color:
    rgba(246,226,235,.78);

  background:
    rgba(255,255,255,.05);

  font-size: 9px;

  font-weight: 750;
}


/* =========================================================
   LEGAL LAYOUT
   ========================================================= */

.terms-vip-body
.legal-layout {
  display: grid;

  grid-template-columns:
    260px
    minmax(0,1fr);

  gap: 20px;

  align-items: start;

  margin-top: -34px;
}


/* =========================================================
   SUMMARY
   ========================================================= */

.terms-vip-body
.legal-summary {
  position: sticky;

  top: 100px;

  padding: 22px;

  overflow: hidden;

  border:
    1px solid
    rgba(255,255,255,.1);

  border-radius: 20px;

  color: #fff;

  background:
    radial-gradient(
      circle at 90% 0,
      rgba(216,79,133,.17),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      #301222,
      #51203b
    );

  box-shadow:
    0 20px 55px
    rgba(67,24,47,.18);
}


.terms-vip-body
.legal-summary::before {
  content: "IMPORTANT";

  display: inline-flex;

  margin-bottom: 14px;

  color: #e86d9c;

  font-size: 7px;

  font-weight: 900;

  letter-spacing: .14em;
}


.terms-vip-body
.legal-summary strong {
  display: block;

  margin-bottom: 12px;

  color: #fff;

  font-size: 18px;

  letter-spacing: -.02em;
}


.terms-vip-body
.legal-summary p {
  margin:
    0 0 13px;

  color:
    rgba(229,200,214,.70);

  font-size: 11px;

  line-height: 1.65;

  opacity: 1;
}


.terms-vip-body
.legal-summary p:last-child {
  margin-bottom: 0;
}


/* =========================================================
   DOCUMENT
   ========================================================= */

.terms-vip-body
.legal-content {
  overflow: hidden;

  border:
    1px solid
    rgba(81,38,60,.075);

  border-radius: 22px;

  background:
    rgba(255,255,255,.99);

  box-shadow:
    0 22px 65px
    rgba(81,38,60,.09);
}


/* =========================================================
   LEGAL SECTION
   ========================================================= */

.terms-vip-body
.legal-content section {
  position: relative;

  padding:
    31px 32px 30px;
}


.terms-vip-body
.legal-content section + section {
  border-top:
    1px solid
    rgba(81,38,60,.065);
}


/* Number */

.terms-vip-body
.legal-number {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 31px;
  height: 25px;

  margin-bottom: 10px;

  border:
    1px solid
    rgba(216,79,133,.12);

  border-radius: 8px;

  color: #d84f85;

  background:
    rgba(216,79,133,.055);

  font-size: 8px;

  font-weight: 900;

  letter-spacing: .08em;
}


/* Heading */

.terms-vip-body
.legal-content h2 {
  margin:
    0 0 13px;

  color: #321323;

  font-size: 23px;

  line-height: 1.15;

  letter-spacing: -.035em;
}


/* Paragraphs */

.terms-vip-body
.legal-content p {
  max-width: 720px;

  margin:
    0 0 13px;

  color: #806d78;

  font-size: 13px;

  line-height: 1.75;

  opacity: 1;
}


.terms-vip-body
.legal-content p:last-child {
  margin-bottom: 0;
}


/* subtle hover for desktop reading */

@media (hover:hover) {

  .terms-vip-body
  .legal-content section {
    transition:
      background .18s ease;
  }

  .terms-vip-body
  .legal-content section:hover {
    background:
      #fffdfd;
  }

}


/* =========================================================
   CONTACT ACTIONS
   ========================================================= */

.terms-vip-body
.legal-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 9px;

  margin-top: 21px;
}


.terms-vip-body
.legal-actions
.customer-primary-button,
.terms-vip-body
.legal-actions
.customer-secondary-button {
  min-height: 45px;

  padding:
    0 16px;

  border-radius: 11px;

  font-size: 11px;

  font-weight: 850;
}


.terms-vip-body
.legal-actions
.customer-primary-button {
  color: #fff;

  background:
    linear-gradient(
      135deg,
      #b63d6d,
      #df5f91
    );

  box-shadow:
    0 12px 25px
    rgba(216,79,133,.17);
}


.terms-vip-body
.legal-actions
.customer-secondary-button {
  border:
    1px solid
    rgba(81,38,60,.09);

  color: #6f5965;

  background:
    #fff9fb;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 760px) {

  .terms-vip-body
  .site-header
  .nav-shell {
    min-height: 68px;
  }


  .terms-vip-body
  .legal-page {
    padding-bottom: 58px;

    background:
      linear-gradient(
        180deg,
        #2b1020 0,
        #43182f 330px,
        #fff8fb 330px,
        #fffafd 100%
      );
  }


  .terms-vip-body
  .legal-hero {
    padding:
      48px 0 67px;
  }


  .terms-vip-body
  .legal-hero h1 {
    margin-top: 14px;

    font-size:
      clamp(
        42px,
        13vw,
        58px
      );
  }


  .terms-vip-body
  .legal-hero p {
    font-size: 12px;

    line-height: 1.65;
  }


  .terms-vip-body
  .legal-effective-date {
    margin-top: 16px;
  }


  .terms-vip-body
  .legal-layout {
    grid-template-columns:
      minmax(0,1fr);

    gap: 11px;

    margin-top: -28px;
  }


  /* SUMMARY */

  .terms-vip-body
  .legal-summary {
    position: static;

    padding: 18px;

    border-radius: 17px;
  }


  .terms-vip-body
  .legal-summary::before {
    margin-bottom: 9px;
  }


  .terms-vip-body
  .legal-summary strong {
    margin-bottom: 8px;

    font-size: 16px;
  }


  .terms-vip-body
  .legal-summary p {
    font-size: 10px;

    line-height: 1.6;
  }


  /* DOCUMENT */

  .terms-vip-body
  .legal-content {
    border-radius: 18px;
  }


  .terms-vip-body
  .legal-content section {
    padding:
      23px 18px 22px;
  }


  .terms-vip-body
  .legal-number {
    min-width: 29px;

    height: 23px;

    margin-bottom: 8px;
  }


  .terms-vip-body
  .legal-content h2 {
    margin-bottom: 10px;

    font-size: 20px;
  }


  .terms-vip-body
  .legal-content p {
    margin-bottom: 11px;

    font-size: 12px;

    line-height: 1.7;
  }


  .terms-vip-body
  .legal-actions {
    display: grid;

    grid-template-columns:
      1fr;

    margin-top: 17px;
  }


  .terms-vip-body
  .legal-actions
  .customer-primary-button,
  .terms-vip-body
  .legal-actions
  .customer-secondary-button {
    width: 100%;

    min-height: 47px;
  }

}


/* =========================================================
   SMALL IPHONE
   ========================================================= */

@media screen and (max-width: 390px) {

  .terms-vip-body
  .legal-hero h1 {
    font-size: 40px;
  }


  .terms-vip-body
  .legal-content section {
    padding:
      21px 16px;
  }


  .terms-vip-body
  .legal-content h2 {
    font-size: 19px;
  }

}