/* ============================================================
   AURUMFIT — Изменить контактные данные (profile.html)
   Figma node: 11-1847  |  Page: 1728 × 1453
   ============================================================ */

.pf-page {
  min-height: 1453px;
}

/* footer override: sit at 1074px on this shorter page */
.pf-page .lk-footer {
  top: 1074px;
}

/* ---------- Content area ---------- */
.pf-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 157px;
  padding-bottom: 58px;
}

/* ---------- Title ---------- */
.pf-title {
  font-family: var(--font-text);
  font-size: 64px;
  font-weight: 500;
  line-height: 68px;
  text-align: center;
  color: var(--color-white);
  margin-bottom: 42px;
}

/* ---------- Card ---------- */
/* Figma: 763 × 681px, bg #404040, centered, top 335 */
.pf-card {
  width: 763px;
  background: #404040;
  border-radius: 20px;
  padding: 65px 0 59px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

/* ---------- Field ---------- */
/* Figma: 600 × 100px, bg #5f5f5f, rounded-20 */
.pf-field {
  width: 600px;
  min-height: 100px;
  background: #5f5f5f;
  border-radius: 20px;
  padding: 18px 26px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pf-field__label {
  font-family: var(--font-text);
  font-size: 18px;
  color: #b9b9b9;
  line-height: 1;
}

.pf-field__input {
  background: none;
  border: none;
  outline: none;
  font-family: var(--font-text);
  font-size: 22px;
  color: var(--color-white);
  padding: 0;
  width: 100%;
}

/* Phone uses Nimbus Sans L (--font-display) */
.pf-field--phone .pf-field__input {
  font-family: var(--font-display);
  font-size: 24px;
}

.pf-field__input::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

/* ---------- Save button ---------- */
/* Figma: 216 × 60px, rounded-8, gold gradient */
.pf-btn {
  width: 216px;
  height: 60px;
  margin-top: 17px; /* total gap to last field = 20(card-gap) + 17 = 37px */
  border: none;
  border-radius: 8px;
  background: linear-gradient(90deg, var(--color-accent-1), var(--color-accent-2));
  color: #1a1209;
  font-family: var(--font-text);
  font-size: 16px;
  font-weight: 400;
  cursor: pointer;
  transition: opacity 0.2s;
}

.pf-btn:hover { opacity: 0.88; }

/* ============================================================
   MOBILE — ≤ 560px  (Figma frame 16:3913, 393 × 1163)
   ============================================================ */
@media (max-width: 560px) {

  /* Page wrapper */
  .pf-page {
    width: 100%;
    min-height: auto;
  }

  /* Reset desktop absolute footer override */
  .pf-page .lk-footer {
    top: auto;
    position: relative;
  }

  /* Content flows after the mob bar (lk-mob__bar = 121px, lives outside pf-page) */
  /* Title sits at y=147 in Figma → gap from bar bottom = 147−121 = 26px            */
  .pf-content {
    padding-top: 26px;
    padding-bottom: 0;
  }

  /* Title: "Изменить / контактные данные" — 28px, 274px wide, 2 lines */
  .pf-title {
    font-size: 28px;
    line-height: normal;
    width: 274px;
    margin-bottom: 31px; /* card_top(234) − title_top(147) − title_h(56) = 31 */
  }

  /* Card: 379×436, bg #404040, rounded-12 */
  .pf-card {
    width: calc(100% - 14px);
    max-width: 379px;
    border-radius: 12px;
    padding: 39px 0 33px; /* top=273−234=39; bottom=436−403=33 */
    gap: 12px;
    margin-bottom: 28px;  /* footer gap: 698−670=28 */
  }

  /* Fields: 360px wide, 60px tall, bg #5f5f5f, rounded-12 */
  .pf-field {
    width: calc(100% - 19px); /* 379−19=360 at full card width */
    max-width: 360px;
    min-height: 60px;
    border-radius: 12px;
    padding: 9px 18px;
    gap: 6px;
  }

  .pf-field__label {
    font-size: 10.8px;
  }

  .pf-field__input {
    font-size: 13.2px;
  }

  .pf-field--phone .pf-field__input {
    font-size: 14.4px;
  }

  /* Save button: 190×56, rounded-5.6 */
  .pf-btn {
    width: 190px;
    height: 56px;
    border-radius: 5.6px;
    margin-top: 20px;  /* 12px gap + 20 = 32px total, matching Figma: 581−549=32 */
    font-size: 16px;
  }

}
