/* ==========================================================================
   Nexivium Group — landing page
   Implemented from the Claude Design handoff (Nexivium Group.dc.html).
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  --bg: #0A0A0B;
  --text: #F5F5F5;
  --text-2: #9B9B9F;
  --border: #2A2A2E;
  --field-bg: #141416;
  --metal: linear-gradient(135deg, #8A8A8E 0%, #C9C9CC 45%, #F2F2F4 62%, #ADADB1 100%);
  --card-grad: linear-gradient(170deg, #18181B, #121214);
  --font-display: 'Cinzel', serif;
  --font-body: 'Manrope', sans-serif;
  --ease-soft: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

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

img { max-width: 100%; }

::placeholder { color: #75757A; opacity: 1; }

a:focus-visible,
button:focus-visible {
  outline: 2px solid #C9C9CC;
  outline-offset: 3px;
  border-radius: 4px;
}

.skip-link {
  position: fixed;
  top: -100px;
  left: 16px;
  z-index: 300;
  padding: 12px 20px;
  background: var(--field-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  text-decoration: none;
  font-size: 14px;
  transition: top .2s;
}
.skip-link:focus { top: 12px; }

.container {
  position: relative;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}
.container-narrow { max-width: 1100px; }

/* ---------- Ambient background canvas ---------- */
.fx-page {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  display: block;
  opacity: 0.9;
}

/* ---------- Scroll reveal ---------- */
.rv {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .85s var(--ease-soft), transform .85s var(--ease-soft);
}
.rv.rv-in { opacity: 1; transform: none; }

/* ---------- Keyframes ---------- */
@keyframes glint { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@keyframes breath { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.3); } }
@keyframes ringspin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.fxring {
  transform-box: fill-box;
  transform-origin: center;
  animation: ringspin 46s linear infinite;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: filter .25s, box-shadow .25s, transform .2s;
}

.btn-metal {
  background: var(--metal);
  color: #101012;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.75);
}
.btn-metal:hover {
  filter: brightness(1.12);
  box-shadow: 0 6px 30px rgba(201, 201, 204, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transform: translateY(-1px);
}

.btn-nav {
  gap: 8px;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.75);
}
.btn-nav:hover {
  box-shadow: 0 4px 26px rgba(201, 201, 204, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.btn-hero {
  padding: 16px 30px;
  border-radius: 9px;
  font-size: 15px;
}
.btn-metal.btn-hero { color: #0F0F11; }

.btn-ghost {
  background: rgba(255, 255, 255, 0.02);
  color: #E9E9EB;
  font-weight: 600;
  border: 1px solid #3A3A3F;
  transition: border-color .25s, background .25s, box-shadow .25s, transform .2s;
}
.btn-ghost:hover {
  border-color: #7A7A80;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 0 24px rgba(201, 201, 204, 0.14);
  transform: translateY(-1px);
}

.btn-menu {
  margin-top: 20px;
  justify-content: center;
  gap: 8px;
  padding: 14px 24px;
  border-radius: 8px;
  font-size: 14.5px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.btn-submit {
  flex: 0 1 auto;
  padding: 19px 42px;
  border-radius: 10px;
  font-size: 15.5px;
}
.btn-submit[disabled] { opacity: .65; pointer-events: none; }

/* ---------- Header ---------- */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 9px clamp(18px, 4vw, 56px);
  background: rgba(10, 10, 11, 0.82);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid #222226;
}

.site-logo { display: block; flex: none; }
.site-logo img { display: block; height: clamp(52px, 6vw, 66px); width: auto; }

.site-nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 30px); }
.site-nav a {
  color: var(--text-2);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: color .25s;
}
.site-nav a:hover { color: var(--text); }

.menu-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 46px;
  height: 46px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
}
.menu-toggle span { display: block; width: 20px; height: 2px; background: #E8E8EA; }

.mobile-menu {
  position: fixed;
  top: 71px;
  left: 0;
  right: 0;
  z-index: 190;
  background: rgba(12, 12, 13, 0.97);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  padding: 14px 26px 28px;
}
.mobile-menu[hidden] { display: none; }
.mobile-menu > a:not(.btn) {
  color: #E8E8EA;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  padding: 15px 2px;
  border-bottom: 1px solid #1E1E22;
}

@media (max-width: 919.98px) {
  .site-nav, .site-header .btn-nav { display: none; }
}
@media (min-width: 920px) {
  .menu-toggle { display: none; }
  .mobile-menu { display: none; }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 170px clamp(20px, 5vw, 64px) 110px;
}

.hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 32%;
}

.hero-dim { position: absolute; inset: 0; background: #000000; opacity: 0.5; }

.hero-vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 95% at 50% 42%, rgba(10, 10, 11, 0) 38%, rgba(10, 10, 11, 0.6) 100%);
}

.hero-fade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 10, 11, 0.85) 0%, rgba(10, 10, 11, 0) 22%, rgba(10, 10, 11, 0) 58%, #0A0A0B 100%);
}

.fx-hero {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  display: block;
  mix-blend-mode: screen;
  opacity: 0.85;
}

.hero-inner { z-index: 2; }

.hero-content {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 26px;
}

.hero h1 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(29px, 4.1vw, 52px);
  line-height: 1.24;
  font-weight: 500;
  letter-spacing: 0.015em;
  text-wrap: pretty;
}
.hero h1 strong { font-weight: 700; }

.hero-content > p {
  margin: 0;
  max-width: 52ch;
  color: #ECECEF;
  font-size: 16.5px;
  line-height: 1.75;
  text-wrap: pretty;
  text-shadow: 0 1px 16px rgba(0, 0, 0, 0.85), 0 0 4px rgba(0, 0, 0, 0.55);
}

.hero-ctas {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 10px;
}

/* ---------- Kim jesteśmy ---------- */
.about {
  position: relative;
  display: flex;
  align-items: center;
  min-height: min(92vh, 760px);
  padding: clamp(100px, 11vw, 150px) clamp(20px, 5vw, 64px);
  overflow: hidden;
  scroll-margin-top: 90px;
}

.about-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
}

.about-grad-x {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.95) 0%, rgba(10, 10, 11, 0.78) 42%, rgba(10, 10, 11, 0.22) 100%);
}

.about-grad-y {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #0A0A0B 0%, rgba(10, 10, 11, 0) 16%, rgba(10, 10, 11, 0) 84%, #0A0A0B 100%);
}

.about .container { z-index: 2; }

.about-content {
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-head { display: flex; align-items: center; gap: 16px; }

.about-bar {
  width: 44px;
  height: 2px;
  background: linear-gradient(90deg, #6B6B6E, #F0F0F2);
  border-radius: 2px;
}

.about-head h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(24px, 2.8vw, 32px);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.about-content p {
  margin: 0;
  color: var(--text-2);
  font-size: 16px;
  line-height: 1.8;
  text-wrap: pretty;
}

/* ---------- Generic section chrome ---------- */
.section {
  position: relative;
  padding: clamp(80px, 9vw, 120px) clamp(20px, 5vw, 64px);
  scroll-margin-top: 90px;
}
.section-clip { overflow: hidden; }

.t-label {
  margin: 0;
  text-align: center;
  color: #F0F0F2;
  font-family: var(--font-display);
  font-size: clamp(15px, 1.8vw, 19px);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.t-label-lg {
  font-size: clamp(17px, 2.4vw, 24px);
  text-wrap: balance;
}

.divider {
  display: block;
  width: 130px;
  height: 1px;
  margin: 20px auto 0;
  background: linear-gradient(90deg, transparent, #C9C9CC, transparent);
  opacity: 0.6;
}
.divider-contact { margin-top: 22px; }

/* ---------- Medal (ring + textured disc + icon) ---------- */
.medal { position: relative; width: 88px; height: 88px; flex: none; }

.medal-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.medal-disc {
  position: absolute;
  inset: 9px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 48%),
    linear-gradient(165deg, rgba(41, 41, 46, 0.92), rgba(13, 13, 15, 0.96)),
    url('../assets/tex-cracks.jpg');
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(201, 201, 204, 0.3);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.22), inset 0 -9px 16px rgba(0, 0, 0, 0.65), 0 12px 26px rgba(0, 0, 0, 0.55);
  animation: breath 5.6s ease-in-out infinite;
}

.medal-icon {
  width: 33px;
  height: 33px;
  filter: drop-shadow(0 1.5px 1.5px rgba(0, 0, 0, 0.9));
}

.medal-sm { width: 66px; height: 66px; }
.medal-sm .medal-disc {
  inset: 7px;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.22), inset 0 -7px 12px rgba(0, 0, 0, 0.65), 0 9px 20px rgba(0, 0, 0, 0.55);
  animation-duration: 4.8s;
}
.medal-sm .medal-icon { width: 25px; height: 25px; }

/* ---------- Dla kogo ---------- */
.who-grid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(290px, 100%), 1fr));
  gap: 24px;
}

.card {
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  background: var(--card-grad);
  border: 1px solid var(--border);
  transition: transform .35s, border-color .35s, box-shadow .35s;
}
.card:hover {
  transform: translateY(-6px);
  border-color: #4A4A50;
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.55);
}

.who-card {
  gap: 20px;
  padding: 36px 32px 32px;
  scroll-margin-top: 130px;
}

.who-card h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.who-card p {
  margin: 0;
  color: var(--text-2);
  font-size: 15px;
  line-height: 1.7;
  text-wrap: pretty;
}

.card-arrow {
  margin-top: auto;
  color: #C9C9CC;
  font-size: 22px;
  line-height: 1;
}

/* ---------- Czego uczymy ---------- */
.teach-lead {
  margin: 26px auto 0;
  max-width: 56ch;
  text-align: center;
  color: #F0F0F2;
  font-size: clamp(17px, 2vw, 21px);
  font-weight: 600;
  line-height: 1.5;
  text-wrap: balance;
}

.grad-text {
  background: linear-gradient(135deg, #8A8A8E, #E8E8EA 55%, #B0B0B4);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.teach-grid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(310px, 100%), 1fr));
  gap: 1px;
  background: #232327;
  border: 1px solid #232327;
  border-radius: 18px;
  overflow: hidden;
}

.skill {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 30px 30px;
  background: linear-gradient(160deg, #131316, #0F0F11);
  transition: background .3s;
}
.skill:hover { background: #17171B; }

.skill p {
  margin: 0;
  color: #D6D6DA;
  font-size: 15.5px;
  font-weight: 500;
  line-height: 1.5;
  text-wrap: pretty;
}

/* ---------- Branża ---------- */
.industry {
  margin-top: 56px;
  display: flex;
  flex-wrap: wrap;
  gap: 44px;
  align-items: center;
}

.industry-main {
  flex: 1 1 480px;
  display: flex;
  gap: 28px;
  align-items: flex-start;
}

.industry-main p {
  margin: 0;
  color: var(--text-2);
  font-size: 16px;
  line-height: 1.8;
  text-wrap: pretty;
}

.industry-note {
  flex: 1 1 380px;
  background: #17171A;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 30px 34px;
}

.industry-note p {
  margin: 0;
  color: #B9B9BD;
  font-size: 14.5px;
  line-height: 1.8;
  text-wrap: pretty;
}

/* ---------- Benefity ---------- */
.benefits {
  position: relative;
  overflow: hidden;
  border-top: 1px solid #1C1C20;
  border-bottom: 1px solid #1C1C20;
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr));
  gap: 1px;
  background: #26262A;
  min-height: 100vh;
}

/* Desktop: always a 2×2 wall — auto-fit alone would stretch to 3–4 columns on wide screens */
@media (min-width: 921px) {
  .benefits-grid { grid-template-columns: repeat(2, 1fr); }
}

.btile {
  position: relative;
  overflow: hidden;
  min-height: max(50vh, 340px);
  display: flex;
  align-items: flex-end;
  padding: clamp(28px, 4vw, 56px);
  background: #0D0D0F;
}

.bimg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .9s var(--ease-soft);
}
.btile:hover .bimg { transform: scale(1.05); }
.btile-champion .bimg { object-position: center 30%; }

.btile-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 10, 11, 0.4) 0%, rgba(10, 10, 11, 0.1) 45%, rgba(10, 10, 11, 0.92) 100%);
}

.btile-caption {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.btile-caption p {
  margin: 0;
  color: #B9B9BD;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.btile-caption h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--text);
}

/* ---------- Opinie ---------- */
.reviews-grid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 24px;
}

.review {
  margin: 0;
  gap: 18px;
  padding: 34px 32px 30px;
}

.stars { display: flex; gap: 5px; }
.stars svg { width: 16px; height: 16px; }

.review blockquote {
  margin: 0;
  color: #C9C9CD;
  font-size: 15px;
  line-height: 1.75;
  text-wrap: pretty;
}

.review figcaption {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 6px;
}

.avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  flex: none;
  border-radius: 50%;
  background-image:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 48%),
    linear-gradient(165deg, rgba(41, 41, 46, 0.92), rgba(13, 13, 15, 0.96)),
    url('../assets/tex-cracks.jpg');
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(201, 201, 204, 0.3);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.22), inset 0 -5px 9px rgba(0, 0, 0, 0.65);
  font-family: var(--font-display);
  font-size: 15px;
  color: #D9D9DC;
}

.review-meta { display: flex; flex-direction: column; gap: 2px; }
.review-name { color: #F0F0F2; font-size: 14.5px; font-weight: 700; }
.review-role { color: #8F8F94; font-size: 13px; }

/* ---------- Kontakt ---------- */
.contact {
  position: relative;
  padding: clamp(84px, 9vw, 130px) clamp(20px, 5vw, 64px);
  scroll-margin-top: 90px;
}

.contact-lead {
  margin: 24px auto 0;
  max-width: 58ch;
  text-align: center;
  color: var(--text-2);
  font-size: 16px;
  line-height: 1.7;
  text-wrap: balance;
}

.contact-form {
  margin-top: 52px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.form-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
  gap: 16px;
}

.form-row-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: stretch;
}

.fld {
  display: flex;
  align-items: center;
  gap: 13px;
  background: var(--field-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0 18px;
  height: 58px;
  transition: border-color .25s;
}
.fld:focus-within {
  border-color: #5A5A61;
  box-shadow: 0 0 0 3px rgba(201, 201, 204, 0.07);
}

.fld-icon { width: 17px; height: 17px; flex: none; }

.fld input,
.fld select,
.fld textarea {
  flex: 1;
  min-width: 0;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text);
  font-family: inherit;
  font-size: 15px;
}

/* Prevent WebKit autofill from painting fields yellow */
.fld input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 100px var(--field-bg) inset;
  -webkit-text-fill-color: var(--text);
  caret-color: var(--text);
}

.fld-select { position: relative; }
.fld select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
select option { background: var(--field-bg); color: var(--text); }

.fld-chevron {
  width: 16px;
  height: 16px;
  flex: none;
  position: absolute;
  right: 18px;
  pointer-events: none;
}

.fld-area {
  flex: 1 1 420px;
  align-items: flex-start;
  height: auto;
  padding: 17px 18px;
}
.fld-area .fld-icon { margin-top: 2px; }
.fld textarea { line-height: 1.6; resize: vertical; }

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

.fld-file {
  flex: 1 1 320px;
  border-style: dashed;
  border-color: #3A3A3F;
  cursor: pointer;
}
.fld-file:hover { border-color: #6B6B70; }

.fld-file-text {
  color: #75757A;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fld-file-text.has-file { color: #E8E8EA; }

.fld-file input[type="file"] { display: none; }

.form-status {
  margin: 6px 0 0;
  text-align: center;
  color: #C9C9CC;
  font-size: 15px;
}
.form-status.is-error { color: #D89B9B; }

/* ---------- Stopka ---------- */
.site-footer {
  position: relative;
  border-top: 1px solid #1F1F23;
  padding: 64px 24px 58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  overflow: hidden;
}

.footer-logo { display: block; height: 104px; width: auto; }

.footer-contact {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px 40px;
}

.footer-contact a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #C9C9CC;
  text-decoration: none;
  font-size: 15px;
  transition: color .25s;
}
.footer-contact a:hover { color: var(--text); }
.footer-contact svg { width: 16px; height: 16px; }

.footer-social { display: flex; gap: 26px; }

.footer-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: var(--metal);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.75);
  text-decoration: none;
  transition: transform .25s, box-shadow .25s, filter .25s;
}
.footer-social a:hover {
  transform: translateY(-4px) scale(1.06);
  filter: brightness(1.1);
  box-shadow: 0 16px 48px rgba(201, 201, 204, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.icon-fb { width: 38px; height: 38px; }
.icon-ig { width: 36px; height: 36px; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fxring, .medal-disc { animation: none; }
  .medal-ring circle { animation: none !important; }
  .rv { opacity: 1; transform: none; transition: none; }
  .bimg { transition: none; }
}