Migration complete

resources/css/layout/news.css

@@ -77,6 +77,21 @@
     color: var(--text);
     margin-bottom: 12px;
     text-shadow: 0 2px 4px rgba(0,0,0,0.6);
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    word-break: break-word;
+}
+
+@media (max-width: 768px) {
+    .news-header .news-title {
+        font-size: 1.8rem;
+    }
+}
+
+@media (max-width: 600px) {
+    .news-header .news-title {
+        font-size: 1.4rem;
+    }
 }
 
 .news-header .news-meta {
@@ -298,7 +313,6 @@
     color: #e57373;
 }
 
-/* ── Hero ────────────────────────────────────────────────── */
 .news-hero {
     display: block;
     position: relative;
@@ -484,3 +498,106 @@
     .news-hero-title  { font-size: 1.4rem; }
     .news-grid        { grid-template-columns: 1fr; }
 }
+
+@media (max-width: 768px) {
+
+    .news-header .news-meta {
+        gap: 12px;
+        font-size: 0.85rem;
+    }
+
+    .news-layout {
+        flex-direction: column;
+        gap: 20px;
+        padding: 20px;
+    }
+
+    .news-sidebar {
+        width: 100%;
+    }
+
+    .news-content {
+        padding: 25px;
+        font-size: 1rem;
+    }
+
+    .news-body-text {
+        font-size: 1rem;
+    }
+
+    .sidebar-block {
+        padding: 15px;
+    }
+}
+
+@media (max-width: 600px) {
+    .news-header .news-meta {
+        gap: 8px;
+        font-size: 0.8rem;
+        flex-wrap: wrap;
+    }
+
+    .news-header .meta-item {
+        padding: 3px 8px;
+        font-size: 0.75rem;
+    }
+
+    .news-layout {
+        gap: 15px;
+        padding: 15px;
+    }
+
+    .news-main-content {
+        min-width: 0;
+    }
+
+    .news-content {
+        padding: 15px;
+        font-size: 0.95rem;
+    }
+
+    .news-body-text {
+        font-size: 0.95rem;
+        margin-bottom: 12px;
+    }
+
+    .news-body-text p {
+        margin-bottom: 15px;
+    }
+
+    .news-sidebar {
+        width: 100%;
+        gap: 15px;
+    }
+
+    .sidebar-block {
+        padding: 12px;
+    }
+
+    .sidebar-block h3 {
+        font-size: 0.95rem;
+    }
+
+    .sidebar-block p {
+        font-size: 0.9rem;
+    }
+
+    .news-card-title {
+        font-size: 0.9rem;
+    }
+}
+
+@media (max-width: 420px) {
+
+    .news-header .news-meta {
+        font-size: 0.75rem;
+    }
+
+    .news-layout {
+        padding: 12px;
+    }
+
+    .news-content {
+        padding: 12px;
+    }
+}