body.woman-page {

  --accent: #f05ab8;

  --accent-dark: #b72c84;

  --accent-soft:
    rgba(
      240,
      90,
      184,
      0.16
    );

  --accent-border:
    rgba(
      240,
      90,
      184,
      0.55
    );

  --focus-ring:
    rgba(
      240,
      90,
      184,
      0.18
    );

  --button-shadow:
    rgba(
      183,
      44,
      132,
      0.24
    );

  background-image:

    linear-gradient(
      90deg,
      rgba(16, 5, 13, 0.48),
      rgba(14, 6, 13, 0.53) 55%,
      rgba(16, 5, 12, 0.61)
    ),

    linear-gradient(
      rgba(89, 22, 66, 0.08),
      rgba(12, 5, 12, 0.24)
    ),

    url("../assets/images/background1.png");

  background-size:
    cover;

  background-position:
    center;

  background-repeat:
    no-repeat;

  background-attachment:
    fixed;
}

/* W LOGO */

.woman-page .branch-letter {

  color: #ff4fb8;

  text-shadow:
    0
    0
    24px
    rgba(
      255,
      61,
      177,
      0.48
    );
}

/* GLASS */

.woman-page .calculator {

  background:
    rgba(
      16,
      5,
      14,
      0.47
    );
}

.woman-page .side-card {

  background:
    rgba(
      16,
      5,
      14,
      0.42
    );
}

.woman-page .side-card:hover {

  border-color:
    rgba(
      240,
      90,
      184,
      0.54
    );

  background:
    rgba(
      34,
      9,
      27,
      0.56
    );
}

/* WORLDWIDE */

.woman-page .worldwide-box {

  border:
    1px
    solid
    rgba(
      240,
      90,
      184,
      0.56
    );

  background:
    rgba(
      40,
      8,
      31,
      0.72
    );

  box-shadow:
    0
    0
    30px
    rgba(
      240,
      90,
      184,
      0.11
    ),
    inset
    0
    0
    28px
    rgba(
      240,
      90,
      184,
      0.07
    );
}

.woman-page .worldwide-box::before {

  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(
        255,
        89,
        189,
        0.14
      ),
      transparent 68%
    );
}

.woman-page .worldwide-label {

  color:
    #f2b4d9;
}

.woman-page .worldwide-value {

  color:
    #ff78c7;

  text-shadow:
    0
    0
    20px
    rgba(
      240,
      90,
      184,
      0.23
    );
}

.woman-page .worldwide-text {

  color:
    #ffe0f2;
}

/* HIP DIPS */

.hip-options {

  display: none;

  grid-template-columns:
    repeat(
      3,
      1fr
    );

  gap: 14px;

  margin-top: 16px;
}

.hip-options.show {

  display: grid;
}

.hip-card {

  cursor: pointer;

  border:
    1px
    solid
    var(--border);

  border-radius: 17px;

  background:
    rgba(
      8,
      6,
      11,
      0.72
    );

  padding: 10px;

  text-align: center;

  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}

.hip-card:hover {

  transform:
    translateY(-2px);

  border-color:
    rgba(
      240,
      90,
      184,
      0.45
    );
}

.hip-card.selected {

  border-color:
    var(--accent);

  box-shadow:
    0
    0
    0
    3px
    rgba(
      240,
      90,
      184,
      0.12
    );

  background:
    rgba(
      240,
      90,
      184,
      0.08
    );
}

.hip-image {

  height: 240px;

  border-radius: 13px;

  overflow: hidden;

  background: #16171b;
}

.hip-image img {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  object-position:
    center bottom;
}

.hip-card strong {

  display: block;

  margin-top: 10px;
}

.hip-card small {

  color:
    var(--muted);
}

/* RESULT TITLE COLORS */

.result-score.ltb,
.result-title.ltb {

  color: #9a9da6;
}

.result-score.mtb,
.result-title.mtb {

  color: #d89abf;
}

.result-score.htb,
.result-title.htb {

  color: #ef82bd;
}

.result-score.stacylite,
.result-title.stacylite {

  color: #c8ae67;
}

.result-score.stacy,
.result-title.stacy {

  color: #ffd34f;

  text-shadow:
    0
    0
    20px
    rgba(
      255,
      211,
      79,
      0.36
    );
}

/* LADDER */

.title-chip.ltb.active {
  color: #9a9da6;
}

.title-chip.mtb.active {
  color: #d89abf;
}

.title-chip.htb.active {
  color: #ef82bd;
}

.title-chip.stacylite.active {
  color: #c8ae67;
}

.title-chip.stacy.active {

  color: #ffd34f;

  text-shadow:
    0
    0
    12px
    rgba(
      255,
      211,
      79,
      0.25
    );
}

@media (max-width: 840px) {

  .hip-options {
    grid-template-columns:
      1fr;
  }

  .hip-image {
    height: 330px;
  }

}