:root {
  --pc-primary: #ff8ecb;
  --pc-primary-dark: #f57ab8;
  --pc-primary-soft: #fd84be33;

  --pc-secondary: #71c3cf;
  --pc-secondary-dark: #44a1af;

  --pc-primary-vivid: #ed007d;

  --pc-accent: #f6af2f;
  --pc-accent-soft: #f6b02f25;
  --pc-accent-glow: #f6b02f3f;

  --pc-text: #222;
  --pc-text-muted: #767676;
  --pc-text-disabled: #bcbcc6;
  --pc-text-faint: #22222210;

  --pc-surface: #fff;
  --pc-bg-soft: #eef5f8;
  --pc-border: #e0e0e0;
  --pc-secondary-soft: #71c3cf33;
  --pc-shadow-badge: 0 3px 10px #71c3cf14;

  --pc-footer-top-bg: #e4eaec;
  --pc-footer-bottom-bg: #dfedf1;

  --pc-shadow-card: 0 5px 15px #22222210;
  --pc-shadow-focus: 0 0 20px var(--pc-accent-glow);

  --pc-title-size: clamp(17px, 1.2vw + 13px, 22px);
  --pc-title-gap: 20px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

body {
  font-family: "Pofak", sans-serif;
  font-feature-settings: "ss01" 1;
  direction: rtl;
  background-color: var(--pc-surface);
  margin: 0;
}

select,
input,
button,
textarea {
  font-family: "Pofak", sans-serif;
  font-feature-settings: "ss01" 1;
}

.pc-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}