diff --git a/assets/images/nerpa.svg b/assets/images/nerpa.svg
new file mode 100644
index 0000000..def880c
--- /dev/null
+++ b/assets/images/nerpa.svg
@@ -0,0 +1,89 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 250" fill="none">
+  <title>Байкальская нерпа хлопает ластами по камню</title>
+  <defs>
+    <linearGradient id="rock" x1="131" y1="177" x2="170" y2="240" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#c3c7c5"/><stop offset=".48" stop-color="#929e9f"/><stop offset="1" stop-color="#4a6069"/>
+    </linearGradient>
+    <radialGradient id="coat" cx="0" cy="0" r="1" gradientTransform="translate(135 88) rotate(49) scale(132 119)" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#bdc9ca"/><stop offset=".42" stop-color="#819598"/><stop offset=".77" stop-color="#4b6269"/><stop offset="1" stop-color="#283e49"/>
+    </radialGradient>
+    <radialGradient id="chest" cx="0" cy="0" r="1" gradientTransform="translate(108 119) rotate(80) scale(67 44)" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#e0e5e1"/><stop offset=".6" stop-color="#becbc8" stop-opacity=".7"/><stop offset="1" stop-color="#b7c9c7" stop-opacity="0"/>
+    </radialGradient>
+    <radialGradient id="head" cx="0" cy="0" r="1" gradientTransform="translate(111 44) rotate(62) scale(64 50)" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#becacc"/><stop offset=".55" stop-color="#81969a"/><stop offset="1" stop-color="#3b525e"/>
+    </radialGradient>
+    <linearGradient id="fin" x1="154" y1="149" x2="174" y2="201" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#92a5a8"/><stop offset=".46" stop-color="#5e777f"/><stop offset="1" stop-color="#2d444e"/>
+    </linearGradient>
+    <radialGradient id="muzzle">
+      <stop stop-color="#e3e8e3"/><stop offset="1" stop-color="#abbdbb"/>
+    </radialGradient>
+    <pattern id="spots" width="31" height="27" patternUnits="userSpaceOnUse" patternTransform="rotate(-17)">
+      <ellipse cx="7" cy="6" rx="3.4" ry="2" fill="#263f4a" opacity=".15"/>
+      <ellipse cx="24" cy="17" rx="4.5" ry="2.2" fill="#243a43" opacity=".13"/>
+      <ellipse cx="10" cy="24" rx="1.5" ry="1" fill="#e6efec" opacity=".28"/>
+      <path d="m18 6 3-1M2 17l3-1" stroke="#d2e0dc" stroke-opacity=".2" stroke-linecap="round"/>
+    </pattern>
+    <path id="body" d="M92 74C79 88 67 117 69 145c1 28 22 45 59 48 45 5 103 4 124-10-11-7-17-20-23-35-12-32-37-66-68-72-21-5-46-10-69-2Z"/>
+  </defs>
+  <style>
+    .near-flipper{transform-origin:151px 148px;animation:tap-near 3.6s ease-in-out infinite}
+    .far-flipper{transform-origin:85px 139px;animation:tap-far 3.6s ease-in-out .22s infinite}
+    .eyes{transform-box:fill-box;transform-origin:center;animation:blink 6.8s infinite}
+    @keyframes tap-near{0%,12%,32%,47%,100%{transform:rotate(0)}23%,38%{transform:rotate(-24deg)}28%,43%{transform:rotate(3deg)}}
+    @keyframes tap-far{0%,12%,32%,47%,100%{transform:rotate(0)}23%,38%{transform:rotate(20deg)}28%,43%{transform:rotate(-2deg)}}
+    @keyframes blink{0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.08)}}
+    @media(prefers-reduced-motion:reduce){.near-flipper,.far-flipper,.eyes{animation:none}}
+  </style>
+  <!-- Неподвижный камень и контактная тень удерживают нерпу на поверхности. -->
+  <ellipse cx="163" cy="234" rx="136" ry="9" fill="#092335" opacity=".25"/>
+  <path d="m18 217 15-28 35-10 42 5 49-12 40 7 54 3 27 12 27 30-29 14-63 2-50-5-58 6-55-8Z" fill="url(#rock)"/>
+  <path d="m33 189 35-10 42 5 49-12 40 7 54 3-28 14-68 7-56-6-48 9Z" fill="#d4d9d4" opacity=".54"/>
+  <path d="m18 217 35-11 48-9-18 24-41 12Zm139-14 68-7 55-2-27 21-68 9Zm96 12 54 9-29 14-63 2Z" fill="#48616c" opacity=".28"/>
+  <path d="m68 185 20 9 13 3-18 24m74-18 11 13-8 13m57-40-10 9m53 16 12 6" stroke="#677c81" stroke-width="1.4" stroke-linecap="round" opacity=".65"/>
+  <path d="m45 210 23-7m45 21 25-1m89-4 18-3m-129-29 20-5" stroke="#e6e9df" stroke-width="2" stroke-linecap="round" opacity=".5"/>
+  <ellipse cx="161" cy="193" rx="99" ry="10" fill="#213e4b" opacity=".35"/>
+  <!-- Задние ласты: у нерпы нет рыбьего хвоста. -->
+  <path d="M232 174c21-1 30 2 46 13 5 4 4 9-3 9-12 0-24-6-36-8 16 8 28 16 25 20-5 6-32-9-46-20Z" fill="#354c58" stroke="#718991" stroke-width="1"/>
+  <path d="m240 180 30 11m-35-5 22 16" stroke="#9bafb1" stroke-width="1" opacity=".5"/>
+  <g class="far-flipper">
+    <path d="M89 132c-12 7-26 24-29 39-3 11-4 20 1 22 7 2 25-15 33-25l10-25Z" fill="#536e76" stroke="#9cafb0" stroke-width="1"/>
+    <path d="m66 183 9-13m-5 17 10-14" stroke="#bac9c6" stroke-width="1" opacity=".5"/>
+  </g>
+  <use href="#body" fill="url(#coat)" stroke="#9bafb1" stroke-width="1.2"/>
+  <use href="#body" fill="url(#spots)"/>
+  <path d="M94 82c-16 28-21 57-8 80 9 18 32 27 49 21 16-7 13-39 3-63-11-26-21-44-44-38Z" fill="url(#chest)"/>
+  <path d="M157 91c27 9 49 35 59 63" stroke="#c1d0cd" stroke-width="3" stroke-linecap="round" opacity=".22"/>
+  <path d="M81 108c17 15 43 17 59 5M78 118c13 10 32 13 45 10" stroke="#344f59" stroke-width="2" stroke-linecap="round" opacity=".36"/>
+  <path d="M81 112c14 12 37 15 53 9" stroke="#e0e7e0" stroke-width="1.3" stroke-linecap="round" opacity=".44"/>
+  <!-- Маленькая округлая голова плавно переходит в широкую шею. -->
+  <path d="M80 72c-2-14 3-31 14-39 12-9 31-10 44-1 12 8 18 24 16 39-1 11-8 23-19 29-15 8-37 4-48-7-5-6-7-13-7-21Z" fill="url(#head)"/>
+  <path d="M91 44c9-12 28-17 41-8" stroke="#d7e0da" stroke-width="2" stroke-linecap="round" opacity=".6"/>
+  <path d="M87 64q9-11 18-5m19-1q9-8 17 2" stroke="#344e59" stroke-width="3" stroke-linecap="round" opacity=".65"/>
+  <g class="eyes">
+    <ellipse cx="99" cy="65" rx="5.5" ry="6.5" fill="#101f29"/>
+    <ellipse cx="133" cy="64" rx="5" ry="6" fill="#101f29"/>
+    <circle cx="97.5" cy="62.8" r="1.8" fill="#fff"/>
+    <circle cx="131.5" cy="61.8" r="1.6" fill="#fff"/>
+    <circle cx="101" cy="67" r=".8" fill="#829fa7"/>
+    <circle cx="134" cy="66" r=".7" fill="#829fa7"/>
+  </g>
+  <path d="M94 78c2-8 11-11 20-8 9-4 20-1 23 6 4 9-5 18-19 19-14 1-26-6-24-17Z" fill="url(#muzzle)"/>
+  <path d="M107 74c1-5 16-6 18-1 1 3-5 8-8 8-4 0-11-4-10-7Z" fill="#1b2e39"/>
+  <path d="m112 73 7-1" stroke="#71888e" stroke-width="1.5" stroke-linecap="round"/>
+  <path d="m117 80 1 6m-10 1q10 4 18-1" stroke="#405861" stroke-width="1.4" stroke-linecap="round"/>
+  <g fill="#5b747b" opacity=".8">
+    <circle cx="101" cy="79" r=".9"/><circle cx="104" cy="84" r=".9"/><circle cx="99" cy="85" r=".8"/>
+    <circle cx="130" cy="78" r=".9"/><circle cx="129" cy="84" r=".8"/><circle cx="134" cy="82" r=".8"/>
+  </g>
+  <g stroke="#e7eee5" stroke-width="1" stroke-linecap="round" opacity=".85">
+    <path d="M103 79Q85 74 71 78m31 5Q80 82 68 88m36-1q-19 3-29 9m55-18q18-7 29-4m-28 8q22-3 31 2m-32 2q20 3 28 9"/>
+  </g>
+  <!-- Короткий передний ласт вращается от плеча и возвращается к камню. -->
+  <g class="near-flipper">
+    <path d="M145 143c9-6 19-1 22 10 4 14 8 23 19 34 7 8 4 12-4 12-17-1-33-16-39-30-4-11-5-21 2-26Z" fill="url(#fin)" stroke="#9bafb0" stroke-width="1"/>
+    <path d="M149 149c-1 14 9 33 23 41" stroke="#c2ceca" stroke-width="1.5" stroke-linecap="round" opacity=".55"/>
+    <path d="m174 185 8 9m-12-6 6 7m-12-4 5 4" stroke="#263f4a" stroke-width="1.2" stroke-linecap="round"/>
+  </g>
+</svg>
diff --git a/assets/site.css b/assets/site.css
index 597a49d..41b6c44 100644
--- a/assets/site.css
+++ b/assets/site.css
@@ -4127,87 +4127,21 @@ body.menu-open{overflow:hidden}
 .baikal-nav a:after,.baikal-nav a:before{display:none!important}
 .baikal-nav a:hover{color:#e2b36d!important}
 
-/* Нерпа отдыхает на камне в нижней части шапки. */
-.baikal-header .free-seal{
-  display:block!important;
-  left:auto!important;
-  right:9%!important;
-  bottom:8%!important;
-  width:190px!important;
-  height:142px!important;
-  z-index:8!important;
-  opacity:.88!important;
-  animation:sealResting 5.4s ease-in-out infinite!important;
-}
-.baikal-header .free-seal-inner{
-  position:absolute!important;
-  left:10px!important;
-  bottom:27px!important;
-  width:150px!important;
-  height:125px!important;
-  z-index:2!important;
-  animation:sealBob 5.4s ease-in-out infinite!important;
-  filter:drop-shadow(0 5px 7px rgba(0,11,35,.3));
-}
-.baikal-header .seal-rock{
+/* Самостоятельный SVG: старые стили плавающих нерп не влияют на рисунок. */
+.baikal-header .hero-nerpa{
   position:absolute;
-  left:0;
-  bottom:0;
-  width:190px;
-  height:52px;
-  z-index:1;
-  border:1px solid rgba(218,178,121,.42);
-  border-radius:52% 45% 28% 32%;
-  background:linear-gradient(160deg,#8193a1 0%,#4f6375 48%,#263d55 100%);
-  box-shadow:inset 12px 8px 18px rgba(255,255,255,.13),0 10px 18px rgba(0,9,30,.28);
-  transform:rotate(-3deg);
-}
-.baikal-header .seal-rock:after{
-  content:"";
-  position:absolute;
-  left:24px;
-  top:10px;
-  width:72px;
-  height:5px;
-  border-radius:50%;
-  background:rgba(221,218,199,.24);
-  transform:rotate(-8deg);
-}
-.baikal-header .free-seal .seal-flipper{
-  transform-box:fill-box;
-  transform-origin:center top;
-  animation:sealFlipperClap 1.15s ease-in-out infinite;
-}
-.baikal-header .free-seal .seal-flipper-right{animation-delay:-.58s}
-.baikal-header .free-seal .seal-eye{fill:#f7e5cf;stroke:currentColor;stroke-width:1.2}
-.baikal-header .free-seal .seal-pupil{fill:#081a35;stroke:none}
-.baikal-header .free-seal .seal-nose{fill:#2a1930;stroke:none}
-.baikal-header .free-seal .seal-flipper{stroke-width:1.6}
-.baikal-header .free-seal .seal-smile,
-.baikal-header .free-seal .seal-whiskers{stroke-width:1.35}
-@keyframes sealResting{
-  0%,100%{transform:translateY(0) rotate(-1deg)}
-  50%{transform:translateY(-4px) rotate(1deg)}
-}
-@keyframes sealFlipperClap{
-  0%,100%{transform:rotate(-12deg)}
-  50%{transform:rotate(22deg) translateY(3px)}
+  right:8%;
+  bottom:7%;
+  display:block;
+  width:clamp(200px,19vw,290px);
+  height:auto;
+  z-index:8;
+  pointer-events:none;
 }
 @media(max-width:620px){
-  .baikal-header .free-seal{
-    right:3%!important;
-    bottom:4%!important;
-    width:132px!important;
-    height:100px!important;
-    opacity:.72!important;
+  .baikal-header .hero-nerpa{
+    right:2%;
+    bottom:5%;
+    width:clamp(145px,42vw,185px);
   }
-  .baikal-header .free-seal-inner{width:108px!important;height:90px!important;left:8px!important;bottom:19px!important}
-  .baikal-header .seal-rock{width:132px;height:37px}
-  .baikal-header .seal-rock:after{left:16px;top:7px;width:50px;height:3px}
-}
-@media(prefers-reduced-motion:reduce){
-  .baikal-header .free-seal,
-  .baikal-header .free-seal-inner,
-  .baikal-header .free-seal .seal-flipper,
-  .baikal-header .free-seal .seal-tail{animation:none!important}
 }
diff --git a/fragments/hero.php b/fragments/hero.php
index 55febb4..9494c22 100644
--- a/fragments/hero.php
+++ b/fragments/hero.php
@@ -186,40 +186,7 @@
 
     
 
-    <div class="free-seal" aria-hidden="true">
-      <span class="seal-rock"></span>
-      <div class="free-seal-inner">
-        <svg viewBox="0 0 180 150" aria-hidden="true">
-          <defs>
-            <linearGradient id="seal-body-fill" x1="0" y1="0" x2="1" y2="1">
-              <stop offset="0" stop-color="#d7c4a5"/>
-              <stop offset=".48" stop-color="#8d806f"/>
-              <stop offset="1" stop-color="#4b4d50"/>
-            </linearGradient>
-            <radialGradient id="seal-muzzle-fill" cx="50%" cy="35%" r="70%">
-              <stop offset="0" stop-color="#f4e7d0"/>
-              <stop offset="1" stop-color="#b9a98f"/>
-            </radialGradient>
-          </defs>
-          <g stroke="#273447" stroke-linecap="round" stroke-linejoin="round">
-            <path class="seal-flipper seal-flipper-left" fill="#67635f" d="M61 94C47 96 33 108 31 123c8 9 23 5 39-13l7-12Z"/>
-            <path class="seal-flipper seal-flipper-right" fill="#5b5957" d="M119 96c15 1 29 12 32 27-8 9-23 5-39-13l-7-12Z"/>
-            <path class="seal-body" fill="url(#seal-body-fill)" stroke-width="2.2" d="M48 116C40 99 43 76 55 61c9-11 21-17 35-18 18-2 34 5 44 19 10 14 13 38 4 54-9 16-78 18-90 0Z"/>
-            <ellipse class="seal-belly" fill="#b8a990" stroke="none" cx="90" cy="96" rx="25" ry="34" opacity=".72"/>
-            <ellipse class="seal-head" fill="url(#seal-body-fill)" stroke-width="2.2" cx="90" cy="48" rx="35" ry="30"/>
-            <ellipse class="seal-muzzle" fill="url(#seal-muzzle-fill)" stroke="none" cx="90" cy="59" rx="22" ry="15"/>
-            <circle class="seal-eye" cx="77" cy="47" r="5"/>
-            <circle class="seal-pupil" cx="78" cy="47" r="2"/>
-            <circle class="seal-eye" cx="103" cy="47" r="5"/>
-            <circle class="seal-pupil" cx="104" cy="47" r="2"/>
-            <path class="seal-nose" d="M86 57q4-5 8 0-2 6-4 6-2 0-4-6Z"/>
-            <path class="seal-smile" fill="none" stroke-width="1.7" d="M90 63q-6 8-13 1M90 63q6 8 13 1"/>
-            <path class="seal-whiskers" fill="none" stroke-width="1.2" d="M82 60 60 55M82 64 58 65M98 60l22-5M98 64l24 1"/>
-            <path class="seal-spot" fill="none" stroke="#d9c7a8" stroke-width="2" opacity=".62" d="M62 79q8-5 16 0M112 82q8-5 15 1M68 109q6-4 12 0"/>
-          </g>
-        </svg>
-      </div>
-    </div>
+    <img class="hero-nerpa" src="assets/images/nerpa.svg" width="320" height="250" alt="" aria-hidden="true" decoding="async">
 
     <div class="hero-bubbles hero-bubbles-front">
       <i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>