/* PETRYK FITNESS — unified interactive design system */
:root {
  --pf-purple-1: #a89aff;
  --pf-purple-2: #755dff;
  --pf-purple-3: #4d32d8;
  --pf-purple-depth: #2b1a88;
  --pf-button-ink: #f8f7ff;
  --pf-button-dark: rgba(15, 15, 27, .82);
  --pf-button-border: rgba(164, 151, 255, .38);
  --pf-button-radius: 999px;
  --pf-button-ease: cubic-bezier(.2, .78, .2, 1);
  --pf-icon-size: 18px;
  --pf-button-height-large: 56px;
  --pf-button-height-standard: 50px;
  --pf-button-height-nav: 38px;
  --pf-button-height-utility: 40px;
  --pf-button-height-mobile-nav: 46px;
}

/* Shared language, motion and accessibility */
.button,
.hero__scroll,
.header .nav a,
.language-trigger,
.language-menu button,
.menu-toggle,
.mobile-nav-cta,
.text-link,
.subscribe-back,
.contact-links a,
.faq summary {
  -webkit-tap-highlight-color: transparent;
  font-family: "Manrope", "Inter", Arial, sans-serif;
  transition:
    transform .22s var(--pf-button-ease),
    color .22s ease,
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    opacity .22s ease;
}

.button:focus-visible,
.hero__scroll:focus-visible,
.header .nav a:focus-visible,
.language-trigger:focus-visible,
.language-menu button:focus-visible,
.menu-toggle:focus-visible,
.text-link:focus-visible,
.subscribe-back:focus-visible,
.contact-links a:focus-visible,
.faq summary:focus-visible {
  outline: 2px solid var(--pf-purple-1);
  outline-offset: 3px;
}

/* Primary 3D conversion button */
.button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(212, 205, 255, .64);
  border-radius: var(--pf-button-radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,.17), transparent 42%),
    linear-gradient(135deg, var(--pf-purple-2), var(--pf-purple-3));
  color: var(--pf-button-ink);
  font-weight: 800;
  letter-spacing: .025em;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(0,0,0,.26);
  min-height: var(--pf-button-height-standard);
  padding: 12px 22px;
  line-height: 1.2;
  text-align: center;
  white-space: normal;
  box-shadow:
    0 5px 0 var(--pf-purple-depth),
    0 12px 26px rgba(96, 70, 255, .28),
    inset 0 1px 0 rgba(255,255,255,.36),
    inset 0 -1px 0 rgba(18,10,68,.3);
}

.button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 18%, rgba(255,255,255,.18) 47%, transparent 73%);
  opacity: 0;
  transform: translateX(-35%);
  transition: opacity .25s ease, transform .42s var(--pf-button-ease);
}

.button > .pf-icon,
.hero__scroll > .pf-icon {
  width: var(--pf-icon-size);
  height: var(--pf-icon-size);
  flex: 0 0 var(--pf-icon-size);
}

/* One icon family: 24px SVG grid, 1.8 stroke, round caps and joins. */
.pf-icon {
  display: inline-block;
  width: var(--pf-icon-size);
  height: var(--pf-icon-size);
  flex: 0 0 var(--pf-icon-size);
  color: currentColor;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: transform .22s var(--pf-button-ease), opacity .22s ease;
}

.pf-icon--forward {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
}

.pf-icon--down {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 9 5.5 5.5L17.5 9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 9 5.5 5.5L17.5 9'/%3E%3C/svg%3E");
}

.pf-icon--up {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 15 5.5-5.5 5.5 5.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 15 5.5-5.5 5.5 5.5'/%3E%3C/svg%3E");
}

@media (hover: hover) and (pointer: fine) {
  .button:hover {
    color: #fff;
    border-color: rgba(229,225,255,.82);
    transform: translateY(-2px);
    box-shadow:
      0 7px 0 var(--pf-purple-depth),
      0 17px 34px rgba(103, 78, 255, .38),
      inset 0 1px 0 rgba(255,255,255,.42),
      inset 0 -1px 0 rgba(18,10,68,.3);
  }

  .button:hover::before { opacity: 1; transform: translateX(35%); }
  .button:hover .pf-icon--forward { transform: translate(2px, -2px); }
  .hero__scroll:hover .pf-icon--down { transform: translateY(2px); }
}

.button:active {
  transform: translateY(3px);
  box-shadow:
    0 1px 0 var(--pf-purple-depth),
    0 5px 12px rgba(80, 55, 220, .24),
    inset 0 2px 5px rgba(27,17,86,.35);
  transition-duration: .08s;
}

/* Secondary / outline tactile button */
.button--ghost,
.hero__scroll {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 1px solid var(--pf-button-border);
  border-radius: var(--pf-button-radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), transparent 48%),
    linear-gradient(135deg, rgba(27,26,43,.9), rgba(11,11,20,.82));
  color: rgba(248,247,255,.9);
  box-shadow:
    0 3px 0 rgba(30,22,75,.82),
    0 9px 20px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  min-height: var(--pf-button-height-standard);
  padding-block: 10px;
}

.button--ghost { color: rgba(248,247,255,.94); }

@media (hover: hover) and (pointer: fine) {
  .button--ghost:hover,
  .hero__scroll:hover {
    color: #fff;
    border-color: rgba(171,157,255,.68);
    background:
      linear-gradient(180deg, rgba(255,255,255,.1), transparent 48%),
      linear-gradient(135deg, rgba(42,36,78,.94), rgba(16,14,31,.88));
    transform: translateY(-2px);
    box-shadow:
      0 5px 0 rgba(39,27,100,.82),
      0 13px 25px rgba(72,51,183,.22),
      inset 0 1px 0 rgba(255,255,255,.15);
  }
}

.button--ghost:active,
.hero__scroll:active {
  transform: translateY(3px);
  box-shadow: 0 1px 0 rgba(35,25,88,.85), inset 0 2px 5px rgba(0,0,0,.3);
  transition-duration: .08s;
}

/* Strong but compact header CTA */
.header .button--small {
  border-color: rgba(212,205,255,.55);
  border-radius: var(--pf-button-radius);
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), transparent 45%),
    linear-gradient(135deg, var(--pf-purple-2), var(--pf-purple-3));
  color: #fff;
  min-height: var(--pf-button-height-utility);
  padding: 9px 16px;
  box-shadow: 0 3px 0 var(--pf-purple-depth), 0 9px 20px rgba(89,64,226,.24), inset 0 1px 0 rgba(255,255,255,.3);
}

/* Premium navigation pills */
.header .nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--pf-button-height-nav);
  padding: 6px 10px;
  border: 1px solid rgba(154,145,206,.16);
  border-radius: var(--pf-button-radius);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(13,13,22,.2));
  color: rgba(244,242,255,.7);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .025em;
  line-height: 1;
  box-shadow: 0 2px 5px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

@media (hover: hover) and (pointer: fine) {
  .header .nav a:hover {
    color: #fff;
    border-color: rgba(161,146,255,.46);
    background: linear-gradient(180deg, rgba(128,104,255,.17), rgba(30,25,58,.54));
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(62,43,160,.18), inset 0 1px 0 rgba(255,255,255,.1);
  }
}

.header .nav a:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.26);
  transition-duration: .08s;
}

/* Current section — visible accent without turning the pill into a loud CTA */
.header .nav a.is-current,
.header .nav a[aria-current="location"] {
  color: #fff;
  border-color: rgba(174, 160, 255, .7);
  background:
    linear-gradient(180deg, rgba(157, 137, 255, .2), rgba(45, 34, 91, .42));
  box-shadow:
    0 0 18px rgba(105, 82, 255, .18),
    inset 0 0 12px rgba(143, 121, 255, .12),
    inset 0 1px 0 rgba(255,255,255,.13);
}

.header .nav a.is-current::after,
.header .nav a[aria-current="location"]::after {
  content: "";
  width: 4px;
  height: 4px;
  margin-left: 7px;
  border-radius: 50%;
  background: var(--pf-purple-1);
  box-shadow: 0 0 8px rgba(168,154,255,.8);
}

/* Compact utility controls */
.language-trigger,
.subscribe-back,
.text-link {
  border-radius: var(--pf-button-radius);
  border: 1px solid rgba(157,146,222,.28);
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(12,12,20,.48));
  color: rgba(248,247,255,.86);
  box-shadow: 0 3px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.language-trigger { min-height: var(--pf-button-height-utility); }
.language-trigger > span { font-family: Arial, sans-serif; color: var(--pf-purple-1); }
.language-trigger > i {
  width: 15px;
  height: 15px;
  color: rgba(220,215,255,.72);
}
.subscribe-back,
.text-link { padding: 9px 14px; }
.subscribe-back,
.text-link {
  display: inline-flex;
  align-items: center;
  min-height: var(--pf-button-height-utility);
}

.language-menu {
  border: 1px solid rgba(157,146,222,.28);
  border-radius: 16px;
  background: rgba(10,10,17,.94);
  box-shadow: 0 18px 44px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  overflow: hidden;
}

.language-menu button {
  border: 1px solid transparent;
  border-radius: 10px;
  color: rgba(248,247,255,.76);
}

.language-menu button.active,
.language-menu button:hover {
  color: #fff;
  border-color: rgba(157,146,222,.24);
  background: rgba(112,88,255,.16);
}

/* Conversion contexts use the Large size of the same Primary component. */
.hero .actions .button,
.plan .button,
.course-card .button,
.contact__form .button,
.subscribe-form .button {
  min-height: var(--pf-button-height-large);
}

@media (hover: hover) and (pointer: fine) {
  .language-trigger:hover,
  .subscribe-back:hover,
  .text-link:hover {
    color: #fff;
    border-color: rgba(161,146,255,.52);
    background: linear-gradient(180deg, rgba(125,102,255,.14), rgba(20,17,38,.62));
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(36,25,92,.24), inset 0 1px 0 rgba(255,255,255,.1);
  }
}

.language-trigger:active,
.subscribe-back:active,
.text-link:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.25);
}

/* Interactive rows keep the same quiet visual language */
.contact-links a,
.faq summary {
  border-radius: 14px;
}

@media (hover: hover) and (pointer: fine) {
  .contact-links a:hover,
  .faq summary:hover {
    color: #fff;
    background: rgba(112,88,255,.08);
    box-shadow: inset 0 0 0 1px rgba(157,146,222,.14);
    transform: translateX(3px);
  }
}

/* Mobile menu retains its structure but uses the same pill family */
@media (max-width: 980px) {
  .header .nav a {
    width: 100%;
    min-height: var(--pf-button-height-mobile-nav);
    margin: 3px 0;
    padding: 11px 14px;
    border: 1px solid rgba(154,145,206,.18);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(13,13,22,.38));
    font-size: 12px;
  }

  .header .nav a.is-current,
  .header .nav a[aria-current="location"] {
    border-color: rgba(174,160,255,.62);
    background: linear-gradient(180deg, rgba(144,122,255,.2), rgba(37,29,75,.48));
  }

  .header .nav .mobile-nav-cta {
    border-color: rgba(212,205,255,.55);
    background: linear-gradient(135deg, var(--pf-purple-2), var(--pf-purple-3));
    color: #fff;
    box-shadow: 0 3px 0 var(--pf-purple-depth), 0 9px 20px rgba(89,64,226,.24), inset 0 1px 0 rgba(255,255,255,.28);
  }

  .menu-toggle {
    min-width: 44px;
    min-height: 44px;
    border: 1px solid rgba(157,146,222,.26);
    border-radius: 13px;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(12,12,20,.48));
    box-shadow: 0 3px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07);
  }
}

/* Keep the full multilingual desktop header calm and collision-free. */
@media (min-width: 981px) and (max-width: 1180px) {
  .header .nav { gap: 6px; }
  .header .nav a {
    padding-inline: 7px;
    font-size: 9px;
    letter-spacing: 0;
  }
  .header .button--small {
    padding-inline: 11px;
    font-size: 9px;
  }
}

@media (max-width: 640px) {
  .hero .actions .button {
    border-color: rgba(212,205,255,.64);
    border-radius: var(--pf-button-radius);
    background:
      linear-gradient(180deg, rgba(255,255,255,.17), transparent 42%),
      linear-gradient(135deg, var(--pf-purple-2), var(--pf-purple-3));
    color: #fff;
    box-shadow: 0 5px 0 var(--pf-purple-depth), 0 12px 26px rgba(96,70,255,.28), inset 0 1px 0 rgba(255,255,255,.36);
  }

  .hero .actions .hero__scroll {
    min-height: var(--pf-button-height-standard);
    border: 1px solid var(--pf-button-border);
    border-radius: var(--pf-button-radius);
    background: linear-gradient(180deg, rgba(255,255,255,.065), rgba(11,11,20,.82));
    color: rgba(248,247,255,.9);
    box-shadow: 0 3px 0 rgba(30,22,75,.82), 0 9px 20px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.1);
  }
}

@media (max-width: 360px) {
  .button,
  .hero__scroll {
    padding-inline: 16px;
    font-size: 12px;
  }
  .header .nav a {
    padding-inline: 12px;
    font-size: 11px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .hero__scroll,
  .header .nav a,
  .language-trigger,
  .language-menu button,
  .menu-toggle,
  .text-link,
  .subscribe-back,
  .contact-links a,
  .faq summary,
  .button::before {
    transition-duration: .01ms !important;
  }
}