/* ===== About — Section 1 ===== */
.about-hero {
  background: linear-gradient(135deg, #fff8e6, #fffdf3);
  padding: clamp(56px, 7vw, 112px) 0;
  border-bottom: 1px solid #eee3b8;
}
.about-wrap {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(20px, 4vw, 48px);
  align-items: center;
}
@media (max-width: 992px) { .about-wrap { grid-template-columns: 1fr; } }

.about-copy .lead {
  margin: 10px 0 18px;
  color: #474747;
  max-width: 62ch;
}
.about-points {
  margin: 0 0 16px;
  padding-left: 18px;
  color: #333;
}
.about-points li { margin: 6px 0; }

.about-badges {
  display: flex; gap: 12px; flex-wrap: wrap; align-items: center;
  margin: 10px 0 14px;
}
.badge img {
  width: 80px; height: auto; border-radius: 12px;
  filter: drop-shadow(0 8px 18px rgba(255,179,0,.16));
  transform: scale(.94);
  opacity: 0;
  animation: badge-pop .7s ease forwards;
}
.badge-free   img { animation-delay: .05s; }
.badge-fair   img { animation-delay: .18s; }
.badge-light  img { animation-delay: .31s; }

.about-cta { display: flex; gap: 12px; flex-wrap: wrap; }

.about-media {
  display: grid;
  gap: 14px;
}
.orbit img, .studio img { width: 100%; max-width: 350px; border-radius: 18px; }
.orbit {
  justify-self: center;
  animation: feather-orbit 7.5s ease-in-out infinite;
  transform-origin: 50% 60%;
}
.studio { justify-self: start; }
@media (max-width: 992px) { .studio { justify-self: center; } }

/* подчёркивание маркером внутри текста */
.marker {
  background: linear-gradient(90deg, #ffe08a, #ffcb5e);
  padding: 0 2px;
  border-radius: 4px;
  box-decoration-break: clone;
}

/* ===== Animations (unique to About) ===== */
@keyframes badge-pop {
  0%   { opacity: 0; transform: scale(.86) rotate(-4deg); }
  70%  { opacity: 1; transform: scale(1.06) rotate(-1deg); }
  100% { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes feather-orbit {
  0%,100% { transform: translateY(0) rotate(0deg); }
  40%     { transform: translateY(-6px) rotate(-1.4deg); }
  70%     { transform: translateY(-2px) rotate(1deg); }
}

/* Respect motion preferences */
@media (prefers-reduced-motion: reduce) {
  .badge img, .orbit { animation: none !important; }
}
/* ===== About — Section 2: DESIGN PRINCIPLES ===== */
.about-principles {
  background: #fffdf3;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #eee3b8;
}
.principles-head {
  text-align: center;
  margin-bottom: clamp(22px, 3vw, 36px);
}
.principles-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.principles-sub {
  margin: 0 auto;
  max-width: 62ch;
  color: #474747;
}

.principles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 992px) { .principles-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .principles-grid { grid-template-columns: 1fr; } }

.p-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 12px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255, 179, 0, 0.10);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform, box-shadow, border-color;
}
.p-card:hover,
.p-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255, 179, 0, 0.18);
}

.p-media img {
  width: 100%;
  border-radius: 14px;
  box-shadow: 0 6px 16px rgba(255,179,0,.12);
}

.p-title {
  margin: 4px 0 8px;
  font-size: 1.12rem;
  color: #1f1f1f;
  position: relative;
}
.p-title::after {
  content: "";
  position: absolute; left: 0; bottom: -6px; height: 6px; width: 100%;
  border-radius: 6px;
  background: linear-gradient(90deg, #ffe08a, #ffcb5e);
  transform-origin: left center;
  transform: scaleX(0);
  animation: title-underline .6s ease forwards .2s;
}

.p-body p { margin: 0; color: #393939; }

/* ===== Unique animations for Section 2 ===== */
/* 1) Лёгкий 3D-наклон карточки */
.card-tilt:hover,
.card-tilt:focus-within {
  transform: perspective(900px) rotateX(2.2deg) rotateY(-2.2deg) translateY(-4px);
}

/* 2) Бегущий контур (градиент по рамке) */
@keyframes border-sweep-kf {
  0%   { border-color: #f1e5b2; box-shadow: 0 10px 28px rgba(255,179,0,.10); }
  50%  { border-color: #ffd980; box-shadow: 0 12px 30px rgba(255,179,0,.14); }
  100% { border-color: #f1e5b2; box-shadow: 0 10px 28px rgba(255,179,0,.10); }
}
.border-sweep { animation: border-sweep-kf 3.8s ease-in-out infinite; }

/* 3) Микро-покачивание иконок */
@keyframes icon-bob-kf {
  0%,100% { transform: translateY(0) rotate(0deg); }
  40% { transform: translateY(-4px) rotate(-0.6deg); }
  70% { transform: translateY(-1px) rotate(0.4deg); }
}
.icon-bob { animation: icon-bob-kf 4.6s ease-in-out infinite; }

/* 4) Подчёркивание заголовка при появлении */
@keyframes title-underline {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .border-sweep,
  .icon-bob,
  .p-title::after,
  .card-tilt:hover,
  .card-tilt:focus-within { animation: none !important; transform: none !important; }
}
/* ===== About — Section 3: ORIGINS & TIMELINE ===== */
.about-timeline {
  background: #fff8e6;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #f0e2ac;
  position: relative;
}
.tl-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.tl-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.tl-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

/* Timeline list */
.tl-list {
  position: relative;
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: clamp(18px, 3vw, 28px);
}

/* Vertical line (draw animation) */
.tl-list::before {
  content: "";
  position: absolute;
  left: clamp(10px, 2.4vw, 20px);
  top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, #ffe08a, #ffcb5e);
  transform: scaleY(0);
  transform-origin: top center;
  animation: line-draw 1s ease forwards .2s;
  border-radius: 3px;
}

/* Each item */
.tl-item {
  position: relative;
  padding-left: clamp(36px, 6vw, 72px);
}

/* Dot */
.tl-dot {
  position: absolute;
  left: clamp(4px, 1.6vw, 12px);
  top: clamp(6px, .8vw, 10px);
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #ffcb5e;
  box-shadow: 0 0 0 0 rgba(255,203,94,.0);
  animation: pulse-dot 2.6s ease-in-out infinite;
}

/* Card */
.tl-card {
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 16px;
  padding: clamp(12px, 2vw, 18px);
  box-shadow: 0 10px 28px rgba(255,179,0,.10);
  transition: transform .22s ease, box-shadow .22s ease;
  will-change: transform, box-shadow;
  opacity: 0; transform: translateY(8px);
  animation: card-pop .5s ease forwards;
}
.tl-item:nth-child(1) .tl-card { animation-delay: .15s; }
.tl-item:nth-child(2) .tl-card { animation-delay: .28s; }
.tl-item:nth-child(3) .tl-card { animation-delay: .41s; }
.tl-item:nth-child(4) .tl-card { animation-delay: .54s; }

.tl-card:hover,
.tl-card:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(255,179,0,.18);
}

.tl-meta {
  font-size: .92rem;
  color: #6b5f2e;
  margin-bottom: 6px;
}
.tl-title {
  margin: 0 0 6px;
  font-size: 1.1rem;
  color: #1f1f1f;
}
.tl-text { margin: 0 0 10px; color: #333; }

.tl-media img {
  width: 100%;
  max-width: 350px;
  border-radius: 14px;
  box-shadow: 0 6px 16px rgba(255,179,0,.12);
}

/* CTA under timeline */
.tl-cta {
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
  margin-top: clamp(16px, 3vw, 28px);
}

/* ===== Unique animations ===== */
@keyframes line-draw {
  from { transform: scaleY(0); }
  to   { transform: scaleY(1); }
}
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,203,94,.0); transform: scale(1); }
  50%      { box-shadow: 0 0 0 10px rgba(255,203,94,.18); transform: scale(1.06); }
}
@keyframes card-pop {
  0%   { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Responsive tweaks */
@media (max-width: 560px) {
  .tl-item { padding-left: 56px; }
  .tl-list::before { left: 20px; }
  .tl-dot { left: 14px; }
}

/* Motion preferences */
@media (prefers-reduced-motion: reduce) {
  .tl-list::before,
  .tl-dot,
  .tl-card { animation: none !important; opacity: 1; transform: none; }
}
/* ===== About — Section 4: CRAFT CHOICES ===== */
.about-craft {
  background: #fffdf3;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #eee3b8;
}
.craft-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.craft-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.craft-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.craft-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 820px) { .craft-grid { grid-template-columns: 1fr; } }

.craft-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 12px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255, 179, 0, 0.10);
  transition: transform .22s ease, box-shadow .22s ease, outline-color .22s ease;
  will-change: transform, box-shadow, outline-color;
}
.craft-card:hover,
.craft-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255, 179, 0, 0.18);
}
.craft-media img { width: 100%; border-radius: 14px; }
.craft-title { margin: 4px 0 8px; font-size: 1.12rem; color: #1f1f1f; }
.craft-points { margin: 0; padding-left: 18px; color: #333; }
.craft-points li { margin: 6px 0; }

.craft-cta {
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
  margin-top: clamp(16px, 3vw, 28px);
}

/* ===== Unique animations ===== */
/* 1) рябь по контуру при появлении (ripple-outline) */
@keyframes ripple-outline-kf {
  0%   { box-shadow: 0 0 0 0 rgba(255, 203, 94, 0.00); }
  60%  { box-shadow: 0 0 0 8px rgba(255, 203, 94, 0.18); }
  100% { box-shadow: 0 0 0 0 rgba(255, 203, 94, 0.00); }
}
.ripple-outline { animation: ripple-outline-kf 1.8s ease; }

/* 2) лёгкий 3D-наклон (snap-tilt) */
.snap-tilt:hover,
.snap-tilt:focus-within {
  transform: perspective(900px) rotateX(2deg) rotateY(-2deg) translateY(-4px);
}

/* 3) медленное вращение «шестерёнки» у иллюстрации производительности */
@keyframes gear-slow-kf {
  0%   { transform: rotate(0); }
  100% { transform: rotate(360deg); }
}
.gear-slow {
  animation: gear-slow-kf 18s linear infinite;
  transform-origin: 50% 50%;
}

/* 4) мягкое свечение для «кода/а11y» */
@keyframes code-glow-kf {
  0%, 100% { box-shadow: 0 0 0 rgba(255,179,0,0); }
  50%      { box-shadow: 0 0 24px rgba(255,179,0,.20); }
}
.code-glow { animation: code-glow-kf 3.6s ease-in-out infinite; }

/* motion preferences */
@media (prefers-reduced-motion: reduce) {
  .ripple-outline,
  .snap-tilt:hover,
  .snap-tilt:focus-within,
  .gear-slow,
  .code-glow { animation: none !important; transform: none !important; }
}
/* ===== About — Section 5: TEAM NOTES ===== */
.about-team {
  background: #fff8e6;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #f0e2ac;
}
.team-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.team-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.team-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 992px) { .team-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .team-grid { grid-template-columns: 1fr; } }

.team-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255, 179, 0, 0.10);
  transition: transform .22s ease, box-shadow .22s ease;
  will-change: transform, box-shadow;
}
.team-card:hover,
.team-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255, 179, 0, 0.18);
}

.team-ava {
  width: 84px; height: 84px; border-radius: 50%;
  overflow: hidden; border: 2px solid #ffecb3;
  flex-shrink: 0;
}
.team-ava img { width: 100%; height: 100%; object-fit: cover; }

.team-body { align-self: center; }
.team-name { margin: 0 0 6px; font-size: 1.06rem; color: #1f1f1f; }
.team-note { margin: 0 0 8px; color: #333; }

/* подпись с прорисовкой линии */
.team-signature {
  margin: 0; font-style: italic; color: #6b5f2e; position: relative;
}
.team-signature::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -6px;
  height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, #ffe08a, #ffcb5e);
  transform: scaleX(0); transform-origin: left center;
  animation: sig-draw .6s ease forwards .35s;
}

/* ===== Unique animations ===== */
/* 1) ink-reveal — эффект проявления портрета */
@keyframes ink-reveal-kf {
  0%   { clip-path: inset(0 100% 0 0); filter: grayscale(1) contrast(1.1); }
  60%  { clip-path: inset(0 0 0 0);     filter: grayscale(.2) contrast(1.05); }
  100% { clip-path: inset(0 0 0 0);     filter: none; }
}
.ink-reveal img {
  animation: ink-reveal-kf 1.1s ease forwards;
}

/* 2) card-sway — мягкое покачивание первой карточки (слегка живое) */
@keyframes card-sway-kf {
  0%, 100% { transform: rotate(-.6deg) translateY(0); }
  50%      { transform: rotate(.6deg) translateY(-2px); }
}
.card-sway {
  animation: card-sway-kf 6.8s ease-in-out infinite;
}

/* 3) hover-tilt — лёгкий 3D-наклон при наведении/фокусе */
.hover-tilt:hover,
.hover-tilt:focus-within {
  transform: perspective(900px) rotateX(2deg) rotateY(-2deg) translateY(-4px);
}

/* 4) sig-draw — прорисовка подписи */
@keyframes sig-draw {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* motion preferences */
@media (prefers-reduced-motion: reduce) {
  .ink-reveal img,
  .card-sway,
  .hover-tilt:hover,
  .hover-tilt:focus-within,
  .team-signature::after { animation: none !important; transform: none !important; }
}
/* === Disable image animations (requested) === */
.gear-slow,
.icon-bob,
.about-principles .p-media img,
.about-craft .craft-media img {
  animation: none !important;
  transform: none !important;
}
/* ===== About — Section 6: PLAYER-FRIENDLY POLICIES ===== */
.about-policies {
  background: #fffdf3;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #eee3b8;
}
.policies-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.policies-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.policies-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.policies-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 860px) { .policies-grid { grid-template-columns: 1fr; } }

.policy-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255, 179, 0, 0.10);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform, box-shadow, border-color;
}
.policy-card:hover,
.policy-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255, 179, 0, 0.18);
}

.policy-media {
  width: 84px; height: 84px; border-radius: 16px; overflow: hidden;
  border: 2px solid #ffecb3; flex-shrink: 0;
}
.policy-media img { width: 100%; height: 100%; object-fit: cover; } /* ⛔ без анимаций на изображениях */

.policy-title {
  margin: 0 0 6px;
  font-size: 1.06rem;
  color: #1f1f1f;
  position: relative;
}
.policy-title::after {
  content: "";
  position: absolute; left: 0; bottom: -6px;
  height: 4px; width: 100%; border-radius: 4px;
  background: linear-gradient(90deg, #ffe08a, #ffcb5e);
  transform-origin: left center; transform: scaleX(0);
  animation: rule-underline .5s ease forwards .15s;
}

.policy-body p { margin: 0 0 8px; color: #363636; }
.policy-links a { color: #1b73e8; }

.policy-points {
  margin: 0; padding-left: 0; list-style: none; color: #333;
}
.policy-points .check {
  position: relative; padding-left: 26px; margin: 6px 0;
}
.policy-points .check::before {
  content: "";
  position: absolute; left: 0; top: 4px;
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid #ffcb5e; background: #fff9df;
}
.policy-points .check::after {
  content: "";
  position: absolute; left: 5px; top: 9px;
  width: 8px; height: 2px; border-radius: 2px;
  background: #ffb300;
  transform-origin: left center; transform: scaleX(0);
  animation: check-sweep .45s ease forwards .25s;
}

/* CTA */
.policies-cta {
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
  margin-top: clamp(16px, 3vw, 28px);
}

/* === Container-only animations (no image animations) === */
@keyframes border-glow-kf {
  0%,100% { border-color: #f1e5b2; }
  50%     { border-color: #ffd980; }
}
.border-glow { animation: border-glow-kf 3.6s ease-in-out infinite; }

@keyframes check-sweep {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes rule-underline {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* motion preferences */
@media (prefers-reduced-motion: reduce) {
  .border-glow,
  .policy-points .check::after,
  .policy-title::after { animation: none !important; }
}
/* ===== About — Section 7: PRESS KIT ===== */
.about-press {
  background: #fff8e6;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #f0e2ac;
}
.press-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.press-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.press-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.press-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 992px) { .press-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .press-grid { grid-template-columns: 1fr; } }

.pk-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 12px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255, 179, 0, 0.10);
  transition: transform .22s ease, box-shadow .22s ease;
  will-change: transform, box-shadow;
  position: relative;
}
.pk-card:hover,
.pk-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255, 179, 0, 0.18);
}

.pk-media img { width: 100%; border-radius: 14px; } /* ⛔ без анимаций на изображениях */
.pk-title { margin: 4px 0 8px; font-size: 1.12rem; color: #1f1f1f; }
.pk-points { margin: 0; padding-left: 18px; color: #333; }
.pk-points li { margin: 6px 0; }
.pk-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.pk-link { text-decoration: none; }

/* Контейнерный «shine»-эффект по рамке на hover (без движения картинок) */
.pk-card::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: 18px;
  background: linear-gradient(120deg, rgba(255, 224, 138, .0) 30%, rgba(255, 224, 138, .35) 50%, rgba(255, 224, 138, .0) 70%);
  transform: translateX(-120%);
  opacity: 0; pointer-events: none;
}
.pk-card:hover::after,
.pk-card:focus-within::after {
  animation: pk-shine .9s ease;
  opacity: 1;
}
@keyframes pk-shine {
  from { transform: translateX(-120%); }
  to   { transform: translateX(120%); }
}

/* Подчёркивание ссылок */
.pk-actions .btn-ghost.pk-link:hover,
.pk-actions .btn-ghost.pk-link:focus {
  text-decoration: underline;
}

/* Примечание */
.press-note {
  margin: clamp(14px, 2.5vw, 22px) auto 0;
  max-width: 820px;
  color: #6b5f2e;
  text-align: center;
}

/* Motion prefs */
@media (prefers-reduced-motion: reduce) {
  .pk-card::after { animation: none !important; }
}
/* === Press kit: copy link UX === */
.pk-actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
.pk-actions .copy-status {
  min-height: 1em;
  font-size: .92rem;
  color: #6b5f2e;
  text-align: left;
}

/* Анимация подтверждения */
@keyframes copied-glow {
  0%,100% { box-shadow: 0 0 0 0 rgba(67,160,71,0); }
  50%     { box-shadow: 0 0 0 8px rgba(67,160,71,.18); }
}
.pk-copy.is-copied {
  background: #43a047;            /* зелёный сигнал */
  animation: copied-glow 1.4s ease;
}
.pk-copy.is-copied:focus-visible { outline-color: #2e7d32; }
/* ===== About — Section 8: ACCESSIBILITY NOTES ===== */
.about-a11y {
  background: #fffdf3;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #eee3b8;
}
.a11y-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.a11y-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.a11y-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.a11y-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 860px) { .a11y-grid { grid-template-columns: 1fr; } }

.a11y-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255,179,0,.10);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform, box-shadow, border-color;
}
.a11y-card:hover,
.a11y-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255,179,0,.18);
}

.a11y-media {
  width: 84px; height: 84px; border-radius: 16px; overflow: hidden;
  border: 2px solid #ffecb3; flex-shrink: 0;
}
.a11y-media img { width: 100%; height: 100%; object-fit: cover; } /* ⛔ без анимаций на изображениях */

.a11y-title {
  margin: 0 0 6px;
  font-size: 1.06rem;
  color: #1f1f1f;
  position: relative;
}

.a11y-body p { margin: 0 0 8px; color: #363636; }
.a11y-points { margin: 0; padding-left: 18px; color: #333; }
.a11y-points li { margin: 6px 0; }

.a11y-cta {
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
  margin-top: clamp(16px, 3vw, 28px);
}

/* === Container-only animations (no image animations) === */
@keyframes outline-pulse-kf {
  0%   { border-color: #f1e5b2; }
  50%  { border-color: #ffd980; }
  100% { border-color: #f1e5b2; }
}
.outline-pulse { animation: outline-pulse-kf 2.6s ease-in-out; }

@keyframes underline-sweep-kf {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
.underline-sweep .a11y-title::after {
  content: "";
  position: absolute; left: 0; bottom: -6px;
  height: 4px; width: 100%; border-radius: 4px;
  background: linear-gradient(90deg, #ffe08a, #ffcb5e);
  transform-origin: left center; transform: scaleX(0);
  animation: underline-sweep-kf .6s ease forwards .15s;
}

/* Motion preferences */
@media (prefers-reduced-motion: reduce) {
  .outline-pulse,
  .underline-sweep .a11y-title::after { animation: none !important; }
}
/* ===== About — Section 9: CONTACT & SUPPORT ===== */
.about-contact {
  background: #fffdf3;
  padding: clamp(48px, 6vw, 96px) 0;
  border-top: 1px solid #eee3b8;
}
.contact-head { text-align: center; margin-bottom: clamp(22px, 3vw, 36px); }
.contact-head h2 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 1.1rem + 1.5vw, 2.2rem);
  color: #1f1f1f;
}
.contact-sub { margin: 0 auto; max-width: 62ch; color: #474747; }

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: clamp(16px, 3vw, 28px);
  align-items: stretch;
}
@media (max-width: 992px) { .contact-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .contact-grid { grid-template-columns: 1fr; } }

.contact-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  background: #fff;
  border: 1px solid #f1e5b2;
  border-radius: 18px;
  padding: clamp(14px, 2.2vw, 20px);
  box-shadow: 0 10px 28px rgba(255,179,0,.10);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform, box-shadow, border-color;
}
.contact-card:hover,
.contact-card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(255,179,0,.18);
}

.contact-media {
  width: 84px; height: 84px; border-radius: 16px; overflow: hidden;
  border: 2px solid #ffecb3; flex-shrink: 0;
}
.contact-media img { width: 100%; height: 100%; object-fit: cover; } /* ⛔ без анимаций на изображениях */

.contact-title { margin: 0 0 6px; font-size: 1.06rem; color: #1f1f1f; }
.contact-body p { margin: 0 0 8px; color: #363636; }

.contact-address a { font-weight: 600; }

.contact-links { margin: 0; padding-left: 18px; color: #333; }
.contact-links li { margin: 6px 0; }
.contact-links a { color: #1b73e8; }

.contact-actions {
  display: grid;
  grid-template-columns: auto auto;
  gap: 10px;
  align-items: center;
}
@media (max-width: 420px) {
  .contact-actions { grid-template-columns: 1fr; }
  .contact-actions .btn { width: 100%; }
}
.copy-status {
  grid-column: 1 / -1;
  min-height: 1em;
  font-size: .92rem;
  color: #6b5f2e;
}

/* Container-only animations */
@keyframes contact-glow-kf {
  0%,100% { border-color: #f1e5b2; }
  50%     { border-color: #ffd980; }
}
.contact-glow { animation: contact-glow-kf 3s ease-in-out infinite; }

@keyframes underline-ltr-kf {
  from { background-size: 0% 3px; }
  to   { background-size: 100% 3px; }
}
.underline-ltr .contact-title {
  background-image: linear-gradient(90deg, #ffe08a, #ffcb5e);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0% 3px;
  padding-bottom: 4px;
  animation: underline-ltr-kf .6s ease forwards .15s;
}

/* Reuse "copied" success animation from press kit */
.copy-btn.is-copied {
  background: #43a047;
  animation: copied-glow 1.4s ease;
}
/* ==== Fix: About → Contact section overflow on small screens ==== */

/* 1) Разрешаем грид-элементам ужиматься внутри карточки */
.about-contact .contact-card,
.about-contact .contact-card > *,
.about-contact .contact-body { min-width: 0; }

/* 2) Кнопки: два равных столбца, которые не распирают карточку */
.about-contact .contact-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* было: auto auto */
  gap: 10px;
}
.about-contact .contact-actions .btn { width: 100%; } /* кнопки тянутся/ужимаются */

/* 3) Почта не выталкивает контент за пределы */
.about-contact .contact-address a {
  overflow-wrap: anywhere;     /* можно переносить по любому месту при дефиците ширины */
}

/* 4) Чуть раньше складываем грид в одну колонку,
      чтобы исключить переполнение на узких экранах (iPhone SE/мини) */
@media (max-width: 760px) {
  .about-contact .contact-grid { grid-template-columns: 1fr; }
}

/* 5) Дополнительно уменьшаем «внутренние габариты» карточки на XS */
@media (max-width: 480px) {
  .about-contact .contact-card { padding: 12px; border-radius: 14px; }
}