diff --git a/.DS_Store b/.DS_Store
index 4f07276..650077e 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/assets/.DS_Store b/assets/.DS_Store
index ae71a8f..885bf57 100644
Binary files a/assets/.DS_Store and b/assets/.DS_Store differ
diff --git a/assets/pdf/.DS_Store b/assets/pdf/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/assets/pdf/.DS_Store differ
diff --git a/assets/pdf/delavnica-od-tujca-do-sosolca.pdf b/assets/pdf/delavnica-od-tujca-do-sosolca.pdf
index fd94234..8970ffa 100644
Binary files a/assets/pdf/delavnica-od-tujca-do-sosolca.pdf and b/assets/pdf/delavnica-od-tujca-do-sosolca.pdf differ
diff --git a/assets/pdf/delavnica-skupaj-gradimo-nove-zacetke.pdf b/assets/pdf/delavnica-skupaj-gradimo-nove-zacetke.pdf
index b576f8c..3c1782d 100644
Binary files a/assets/pdf/delavnica-skupaj-gradimo-nove-zacetke.pdf and b/assets/pdf/delavnica-skupaj-gradimo-nove-zacetke.pdf differ
diff --git a/assets/pdf/delavnica-sola-in-starsi-priseljenci.pdf b/assets/pdf/delavnica-sola-in-starsi-priseljenci.pdf
index 03e8ab8..97fffa0 100644
Binary files a/assets/pdf/delavnica-sola-in-starsi-priseljenci.pdf and b/assets/pdf/delavnica-sola-in-starsi-priseljenci.pdf differ
diff --git a/assets/pdf/delavnica-zakaj-znati-slovensko.pdf b/assets/pdf/delavnica-zakaj-znati-slovensko.pdf
index cc2cf44..5fa6d95 100644
Binary files a/assets/pdf/delavnica-zakaj-znati-slovensko.pdf and b/assets/pdf/delavnica-zakaj-znati-slovensko.pdf differ
diff --git a/code_export.txt b/code_export.txt
index 5700d1c..f734b69 100644
--- a/code_export.txt
+++ b/code_export.txt
@@ -3103,7 +3103,6 @@ Mapa za JavaScript kodo, ki skrbi za interaktivnost.
Cene in reference
C E N I K
-
Cene za učno uro tečaja ali inštrukcij
Cene za medkulturno posredovanje
@@ -5846,6 +5845,20 @@ footer {
line-height: 1.2
}
+ .mediation-main-title {
+ gap: 0.5rem;
+ }
+
+ .mediation-main-title h1 {
+ font-size: 1.75rem;
+ }
+
+ .mediation-main-title .mediation-hero-lead {
+ font-size: clamp(0.5rem, 2vw, 0.95rem);
+ padding: 0 0.5rem;
+ white-space: nowrap;
+ }
+
.mediation-hero-container {
display: flex;
flex-direction: column;
@@ -5878,13 +5891,17 @@ footer {
.mediation-hero-card {
padding: 1.6rem 1.4rem;
margin: 0;
- margin-top: 0.5rem;
max-width: none;
width: 100%;
gap: 1.1rem;
border-left-width: 4px;
box-shadow: 0 18px 40px rgba(15, 25, 40, 0.12)
}
+
+ .cta-button-hero {
+ font-size: 0.95rem;
+ padding: 0.9rem;
+ }
.mediation-hero-card ul {
gap: 0.6rem
@@ -7484,7 +7501,7 @@ footer {
.mediation-hero {
position: relative;
- padding: 130px 2rem 110px;
+ padding: 130px 2rem 60px;
background: #fdfcfa;
overflow: hidden
}
@@ -7492,32 +7509,18 @@ footer {
.mediation-hero-container {
position: relative;
z-index: 2;
- max-width: 1120px;
+ max-width: 1400px;
margin: 0 auto;
display: grid;
- grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
- gap: 5rem;
+ grid-template-columns: 1.2fr 0.8fr;
+ gap: 4rem;
align-items: flex-start
}
-.mediation-hero-text {
- display: flex;
- flex-direction: column;
- gap: 2rem;
- align-items: center;
-}
-
-.mediation-hero-text p {
- color: #464d5b;
- line-height: 1.85;
- text-align: left;
-}
-
.mediation-hero-kicker {
display: inline-flex;
align-items: center;
gap: 0.4rem;
- align-self: flex-start;
padding: 0.4rem 1.1rem;
border-radius: 999px;
background: rgba(251, 99, 57, 0.14);
@@ -7525,7 +7528,31 @@ footer {
font-size: 0.72rem;
letter-spacing: 0.12em;
text-transform: uppercase;
- font-weight: 600
+ font-weight: 600;
+ grid-column: 1 / -1;
+ justify-self: flex-start;
+ margin-bottom: 0.5rem;
+}
+
+.mediation-main-title {
+ grid-column: 1 / -1;
+ text-align: center;
+ width: 100%;
+ margin-bottom: 1rem;
+}
+
+.mediation-main-title h1 {
+ margin: 0 0 0.8rem 0;
+}
+
+.mediation-main-title .mediation-hero-lead {
+ margin: 0 auto;
+ text-align: center;
+ font-size: clamp(0.65rem, 1.2vw, 1.15rem);
+ line-height: 1.6;
+ max-width: 100%;
+ padding: 0 2rem;
+ white-space: nowrap;
}
.mediation-hero h1 {
@@ -7552,35 +7579,67 @@ footer {
display: flex;
flex-direction: column;
gap: 1.4rem;
- margin-top: 2.2rem
+ width: 100%;
}
.mediation-hero-card h3 {
margin: 0;
font-size: 1.25rem;
- color: #1f2530
+ color: #1f2530;
+ text-align: center;
}
-.mediation-hero-card ul {
+.mediation-card-links {
list-style: none;
padding: 0;
- margin: 0;
+ margin: 1.5rem 0 0 0;
display: grid;
- gap: 0.9rem
+ gap: 1rem;
}
-.mediation-hero-card li a {
- display: inline-flex;
- align-items: center;
- gap: 0.6rem;
+.mediation-card-links li {
+ text-align: left;
+}
+
+.mediation-card-links li a {
+ display: inline-block;
text-decoration: none;
color: #3f4551;
font-weight: 600;
- transition: color 0.2s ease
+ transition: color 0.2s ease;
}
-.mediation-hero-card li a:hover {
- color: var(--primary-color)
+.mediation-card-links li a:hover {
+ color: var(--primary-color);
+}
+
+/* Poenotenje barve besedila - vsi odstavki temno sivi */
+.mediation-hero-content p,
+.mediation-hero-content ul li,
+.content-section p,
+.content-section ul li,
+.mediation-detail-text p,
+.purpose-card p,
+.purpose-card ul li,
+.purpose-goal,
+.prosberry-card p,
+.mediation-process p,
+.step-card p,
+.pricing-content,
+#zakaj p,
+#zakaj ul li {
+ color: #454b57;
+}
+
+/* Naslovi ostanejo temni */
+.mediation-hero h1,
+.mediation-hero h2,
+.mediation-hero h3,
+.content-section h2,
+.content-section h3,
+.purpose-card h3,
+.prosberry-card h3 {
+ color: #1f2530;
}
/* Spodnja vrstica z dvema okvirčkoma */
@@ -7715,6 +7774,25 @@ footer {
line-height: 1.85
}
+/* Načini posredovanja grid */
+.mediation-ways-grid {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 3rem;
+}
+
+.mediation-way-item {
+ display: flex;
+ flex-direction: column;
+}
+
+@media (max-width: 768px) {
+ .mediation-ways-grid {
+ grid-template-columns: 1fr;
+ gap: 3rem;
+ }
+}
+
.mediation-detail-image {
position: relative;
border-radius: 28px;
@@ -10744,11 +10822,11 @@ html, body {
.prosberry-benefits-container {
grid-template-columns: 1fr;
gap: 2rem;
- text-align: center;
+ text-align: left;
}
.benefits-list li {
- justify-content: center;
+ justify-content: flex-start;
}
}
@@ -10787,6 +10865,7 @@ html, body {
.hero-bullets li {
position: relative;
margin-bottom: 0.3rem; /* Manjši razmak med alinejami */
+ color: #454b57; /* Siva barva kot ostalo besedilo */
}
.hero-bullets li::before {
@@ -10841,9 +10920,13 @@ html, body {
gap: 2rem;
}
+ .mediation-hero {
+ padding: 120px 1.5rem 70px;
+ }
+
.mediation-hero-overview {
max-width: 100%;
- order: 2; /* Postavi kazalo pod besedilo na telefonu */
+ order: 2;
}
}
@@ -11029,24 +11112,6 @@ html, body {
}
@media (max-width: 768px) {
- .mediation-hero-container {
- grid-template-columns: 1fr !important;
- text-align: center;
- }
-
- /* Besedilo v hero sekciji - obojestransko poravnano na mobilnih */
- .mediation-hero-text p {
- text-align: justify !important;
- }
-
- .mediation-hero-text .cta-button {
- margin: 0 auto;
- }
-
- .mediation-hero-card {
- margin-top: 2rem;
- }
-
/* S kom sodelujem - mobilna optimizacija */
#sodelujem .container > div {
grid-template-columns: 1fr !important;
@@ -11057,11 +11122,6 @@ html, body {
grid-template-columns: 1fr !important;
}
- /* Besedilo v step karticah - obojestransko poravnano na mobilnih */
- .step-card p {
- text-align: justify !important;
- }
-
/* "Zakaj izbrati Prosberry" naslov - leva poravnava na mobilnih */
#zakaj h2 {
text-align: left !important;
@@ -11285,15 +11345,21 @@ html, body {
margin-bottom: 2rem !important;
}
- /* E) Ostale podrobnosti in gumb - NA DNU */
+ /* E) Ostale podrobnosti - NA DNU */
.workshop-section {
order: 6 !important;
margin-bottom: 1rem !important;
}
- .pdf-button {
+ /* F) Gumbi (PDF + Calendly) - PO CENI, PRED "PRIPOROČAMO BRANJE" */
+ .workshop-buttons {
order: 7 !important;
- margin-top: 1rem !important;
+ margin-top: 1.5rem !important;
+ margin-bottom: 2rem !important;
+ }
+
+ .pdf-button, .workshop-buttons .cta-button {
+ margin-top: 0 !important;
}
}
@@ -11340,11 +11406,47 @@ html, body {
}
.mediation-main-title {
+ grid-column: 1 / -1;
text-align: center;
width: 100%;
margin-bottom: 2rem;
}
+.mediation-main-title h1 {
+ margin: 0 0 1rem 0;
+}
+
+.mediation-main-title .mediation-hero-lead {
+ margin: 0 auto;
+ text-align: center;
+ font-size: clamp(0.9rem, 1.5vw, 1.15rem);
+ line-height: 1.6;
+ max-width: 100%;
+ padding: 0 2rem;
+}
+
+.mediation-hero-content {
+ width: 100%;
+}
+
+.mediation-hero-content p {
+ text-align: left;
+}
+
+.mediation-hero-right {
+ display: flex;
+ flex-direction: column;
+ gap: 2rem;
+ align-items: stretch;
+ width: 100%;
+}
+
+.cta-button-hero {
+ width: 100%;
+ display: block;
+ text-align: center;
+}
+
.mediation-hero-split {
display: flex;
justify-content: space-between;
@@ -11404,6 +11506,618 @@ html, body {
font-size: 0.95rem;
margin-bottom: 1rem;
}
+
+
+/* --- POSODOBITEV ZA HERO DESNI STOLPEC (Calendly + Delavnice) --- */
+/* Wrapper za desni stolpec - postavi elemente enega nad drugega */
+.sidebar-wrapper {
+ grid-area: sidebar;
+ display: flex;
+ flex-direction: column;
+ gap: 1rem; /* Razmik med zgornjim in spodnjim okvirčkom */
+ height: fit-content; /* Spremenjeno iz 100% - preprečuje raztezanje */
+ margin-top: 2rem; /* Dodano - preprečuje prekrivanje z headerjem */
+}
+
+/* 1. Zgornji okvirček (Calendly) - Kompakten */
+.home-appointment-box {
+ background: #ffffff;
+ border: 2px solid var(--primary-color);
+ border-radius: 12px;
+ padding: 1rem; /* Manjši padding */
+ text-align: center;
+ box-shadow: 0 5px 15px rgba(251, 99, 57, 0.08);
+}
+
+.home-appointment-box h3 {
+ font-size: 0.95rem; /* Manjša pisava */
+ margin-bottom: 0.8rem;
+ color: #1f2530;
+ line-height: 1.3;
+}
+
+.home-appointment-box .cta-button {
+ margin-top: 0;
+ width: 100%;
+ padding: 0.6rem 1rem !important; /* Tanjši gumb */
+ font-size: 0.9rem !important;
+}
+
+/* 2. Spodnji okvirček (Delavnice) - Kompakten */
+.workshops-sidebar-inline {
+ background: #ffffff;
+ border: 1px solid rgba(251, 99, 57, 0.15);
+ border-radius: 12px;
+ padding: 1rem;
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
+ border-left: 4px solid var(--primary-color);
+ display: flex;
+ flex-direction: column;
+}
+
+.workshops-sidebar-inline h3 {
+ font-size: 0.95rem;
+ margin-bottom: 0.8rem;
+ color: #1f2530;
+ font-weight: 700;
+ padding-bottom: 0;
+ border-bottom: none;
+}
+
+.workshops-sidebar-list {
+ display: flex;
+ flex-direction: column;
+ gap: 0.4rem; /* Še manjši razmik med delavnicami za kompaktnost */
+}
+
+.workshop-sidebar-item {
+ display: flex;
+ flex-direction: column;
+ text-decoration: none;
+ color: #3f4551;
+ background: #fdfdfd;
+ border-radius: 8px;
+ border: 1px solid rgba(0, 0, 0, 0.05);
+ overflow: hidden;
+ transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.workshop-sidebar-item:hover {
+ transform: translateY(-2px);
+ box-shadow: 0 5px 10px rgba(0,0,0,0.05);
+ border-color: rgba(251, 99, 57, 0.3);
+}
+
+.workshop-sidebar-item img {
+ width: 100%;
+ height: 120px; /* Še bolj zmanjšana višina slik za kompaktnost */
+ object-fit: cover;
+ display: block;
+ margin: 0;
+}
+
+.workshop-sidebar-item span {
+ font-size: 0.75rem; /* Manjša pisava */
+ font-weight: 600;
+ padding: 0.35rem 0.5rem; /* Zmanjšan padding za kompaktnost */
+ line-height: 1.25;
+ display: block;
+}
+
+/* --- MOBILNA PRILAGODITEV --- */
+@media (max-width: 992px) {
+ /* Na tablicah in mobitelih skrijemo stranski stolpec ali ga prestavimo */
+ .sidebar-wrapper {
+ order: 3; /* Prikaži pod glavno vsebino */
+ margin-top: 2rem;
+ }
+
+ .workshops-sidebar-list {
+ display: grid;
+ grid-template-columns: 1fr 1fr; /* Dva stolpca na mobitelu za lepši pregled */
+ gap: 0.8rem;
+ }
+
+ .home-appointment-box {
+ margin-bottom: 0; /* Gap na wrapperju ureja razmik */
+ }
+}
+
+@media (max-width: 480px) {
+ .workshops-sidebar-list {
+ grid-template-columns: 1fr; /* En stolpec na zelo majhnih zaslonih */
+ }
+}
+
+
+/* --- Popravek za prikaz načinov posredovanja na mobilnih napravah --- */
+@media (max-width: 768px) {
+ /* Spremeni grid v en stolpec na mobilnih napravah */
+ .content-section > .container > div[style*="grid-template-columns: repeat(2, 1fr)"] {
+ grid-template-columns: 1fr !important;
+ gap: 2rem !important;
+ }
+
+ /* Odstrani align-items: end, da se kartici ne poravnata po spodnjem robu */
+ .content-section > .container > div[style*="align-items: end"] {
+ align-items: stretch !important;
+ }
+
+ /* Prilagodi padding za boljši prikaz */
+ .content-section > .container > div > div[style*="flex-direction: column"] {
+ padding-bottom: 0 !important;
+ }
+}
+
+/* ========================================
+ MOBILE OPTIMIZATIONS FOR MEDIATION PAGE
+ ======================================== */
+
+/* Mobile optimization for grid layout with 2 columns */
+@media (max-width: 768px) {
+ /* Make the 2-column grid single column on mobile */
+ .content-section div[style*="grid-template-columns: repeat(2, 1fr)"] {
+ grid-template-columns: 1fr !important;
+ }
+
+ /* Optimize spacing for mobile */
+ .content-section {
+ padding: 40px 1rem !important;
+ }
+
+ /* Purpose cards mobile optimization */
+ .purposes-container {
+ gap: 1.5rem;
+ }
+
+ .purpose-card {
+ padding: 1.5rem;
+ }
+
+ .purpose-card h3 {
+ font-size: 1.2rem;
+ }
+
+ .purpose-card p,
+ .purpose-card li {
+ font-size: 0.95rem;
+ line-height: 1.7;
+ }
+
+ .purpose-example p {
+ font-size: 0.93rem;
+ }
+
+ .purpose-goal {
+ font-size: 0.93rem;
+ }
+
+ /* Prosberry cards mobile */
+ .prosberry-card {
+ padding: 1.5rem;
+ }
+
+ .prosberry-card h3 {
+ font-size: 1.1rem;
+ }
+
+ .prosberry-card p {
+ font-size: 0.95rem;
+ }
+
+ /* Process steps mobile */
+ .steps-container {
+ gap: 1.2rem;
+ }
+
+ .step-card {
+ padding: 1.3rem;
+ }
+
+ .step-number {
+ width: 35px;
+ height: 35px;
+ font-size: 1.1rem;
+ }
+
+ .step-card strong {
+ font-size: 1rem;
+ }
+
+ .step-card p {
+ font-size: 0.93rem;
+ }
+
+ /* Pricing mobile */
+ .pricing-content {
+ flex-direction: column;
+ gap: 1rem;
+ }
+
+ .pricing-row {
+ font-size: 0.95rem;
+ }
+
+ .pricing-amount {
+ font-size: 1.5rem;
+ }
+
+ /* Benefits list mobile */
+ .benefits-list {
+ gap: 0.8rem;
+ padding-left: 0;
+ }
+
+ .benefits-list li {
+ font-size: 0.95rem;
+ justify-content: flex-start;
+ align-items: flex-start;
+ text-align: left;
+ }
+
+ .benefit-check {
+ flex-shrink: 0;
+ margin-top: 0.1rem;
+ }
+
+ /* Hero section mobile text */
+ .mediation-hero-text h3 {
+ font-size: 1.2rem;
+ }
+
+ .mediation-hero-text ul.hero-bullets li {
+ font-size: 0.95rem;
+ line-height: 1.7;
+ }
+
+ .mediation-hero-text p {
+ font-size: 0.95rem;
+ line-height: 1.7;
+ }
+
+ /* Main title mobile */
+ .mediation-main-title h1 {
+ font-size: 2rem;
+ }
+
+ .mediation-main-title .mediation-hero-lead {
+ font-size: 1rem;
+ }
+
+ /* Button row mobile */
+ .button-row {
+ flex-direction: column;
+ gap: 1rem;
+ }
+
+ .button-row .cta-button {
+ width: 100%;
+ }
+
+ /* References section mobile */
+ .split-ref-layout {
+ grid-template-columns: 1fr !important;
+ }
+
+ .reference-card {
+ padding: 1.5rem;
+ }
+
+ .reference-card p {
+ font-size: 0.95rem;
+ }
+
+ .reference-author {
+ font-size: 0.93rem;
+ }
+
+ /* Final CTA mobile */
+ .final-cta-content h2 {
+ font-size: 1.5rem;
+ }
+
+ .final-cta-content p {
+ font-size: 0.95rem;
+ }
+
+ .final-cta-buttons {
+ flex-direction: column;
+ width: 100%;
+ }
+
+ .final-cta-buttons .cta-button {
+ width: 100%;
+ }
+
+ /* Reading grid mobile */
+ .reading-grid {
+ grid-template-columns: 1fr !important;
+ }
+
+ .blog-link-card {
+ padding: 1.5rem;
+ }
+}
+
+/* Extra small mobile devices */
+@media (max-width: 520px) {
+ .mediation-hero {
+ padding: 100px 1rem 60px !important;
+ }
+
+ .mediation-main-title h1 {
+ font-size: 1.75rem;
+ line-height: 1.3;
+ }
+
+ .mediation-main-title .mediation-hero-lead {
+ font-size: 0.93rem;
+ line-height: 1.6;
+ }
+
+ .mediation-hero-kicker {
+ font-size: 0.65rem;
+ padding: 0.3rem 0.8rem;
+ }
+
+ .mediation-hero-text h3 {
+ font-size: 1.1rem;
+ margin-top: 1.5rem !important;
+ margin-bottom: 0.8rem !important;
+ }
+
+ .mediation-hero-text p {
+ font-size: 0.9rem;
+ line-height: 1.65;
+ }
+
+ .mediation-hero-text ul.hero-bullets li {
+ font-size: 0.9rem;
+ line-height: 1.65;
+ }
+
+ .mediation-hero-card {
+ padding: 1.3rem 1.2rem;
+ }
+
+ .mediation-hero-card h3 {
+ font-size: 1rem;
+ }
+
+ .mediation-hero-card ul li a {
+ font-size: 0.9rem;
+ }
+
+ .content-section {
+ padding: 35px 1rem !important;
+ }
+
+ .content-section h2 {
+ font-size: 1.5rem;
+ margin-bottom: 2rem !important;
+ }
+
+ .purpose-card {
+ padding: 1.3rem;
+ }
+
+ .purpose-card h3 {
+ font-size: 1.1rem;
+ }
+
+ .purpose-card p,
+ .purpose-card li {
+ font-size: 0.9rem;
+ }
+
+ .prosberry-card {
+ padding: 1.3rem;
+ }
+
+ .prosberry-card h3 {
+ font-size: 1rem;
+ }
+
+ .prosberry-card p {
+ font-size: 0.9rem;
+ }
+
+ .step-card {
+ padding: 1.2rem;
+ }
+
+ .step-card strong {
+ font-size: 0.95rem;
+ }
+
+ .step-card p {
+ font-size: 0.88rem;
+ }
+
+ .pricing-amount {
+ font-size: 1.3rem;
+ }
+
+ .benefits-list li {
+ font-size: 0.9rem;
+ justify-content: flex-start;
+ align-items: flex-start;
+ }
+
+ .reference-card {
+ padding: 1.3rem;
+ }
+
+ .reference-card p {
+ font-size: 0.9rem;
+ }
+
+ .final-cta-content h2 {
+ font-size: 1.3rem;
+ }
+
+ .final-cta-content p {
+ font-size: 0.9rem;
+ }
+}
+
+/* Landscape mobile optimization */
+@media (max-width: 768px) and (orientation: landscape) {
+ .mediation-hero {
+ padding: 80px 1.5rem 50px !important;
+ min-height: auto;
+ }
+
+ .mediation-hero-container {
+ gap: 1.5rem;
+ }
+
+ .content-section {
+ padding: 40px 1.5rem !important;
+ }
+}
+
+/* Touch-friendly improvements */
+@media (hover: none) and (pointer: coarse) {
+ /* Increase tap targets for mobile */
+ .cta-button {
+ min-height: 48px;
+ padding: 1rem 1.5rem;
+ }
+
+ .mediation-hero-card li a {
+ padding: 0.5rem 0;
+ min-height: 44px;
+ display: flex;
+ align-items: center;
+ }
+
+ .accordion-toggle,
+ .about-accordion-toggle {
+ min-height: 48px;
+ }
+
+ /* Improve readability on mobile */
+ body {
+ -webkit-text-size-adjust: 100%;
+ text-size-adjust: 100%;
+ }
+
+ /* Prevent text overflow */
+ p, li, span {
+ word-wrap: break-word;
+ overflow-wrap: break-word;
+ }
+}
+
+/* Desktop layout - mediation-main-title simplified */
+@media (min-width: 769px) {
+ .mediation-main-title {
+ text-align: center;
+ }
+}
+
+/* Mobile layout - mediation-main-title simplified */
+@media (max-width: 768px) {
+ .mediation-hero {
+ padding: 100px 1.5rem 50px;
+ }
+
+ .mediation-hero-container {
+ grid-template-columns: 1fr;
+ gap: 2rem;
+ display: flex;
+ flex-direction: column;
+ }
+
+ /* 1. Kicker - ostane na vrhu */
+ .mediation-hero-kicker {
+ order: 1;
+ justify-self: center;
+ margin-bottom: 0.5rem;
+ }
+
+ /* 2. Naslov in podnaslov */
+ .mediation-main-title {
+ order: 2;
+ grid-column: 1;
+ margin-bottom: 1.5rem;
+ }
+
+ .mediation-main-title h1 {
+ font-size: 2rem;
+ text-align: center;
+ }
+
+ .mediation-main-title .mediation-hero-lead {
+ font-size: 0.95rem;
+ padding: 0;
+ white-space: normal;
+ text-align: center;
+ line-height: 1.6;
+ }
+
+ /* 3. Gumb Rezervirajte termin */
+ .mediation-hero-right {
+ order: 3;
+ display: flex;
+ flex-direction: column;
+ gap: 2rem;
+ }
+
+ .cta-button-hero {
+ order: 1;
+ width: 100%;
+ text-align: center;
+ padding: 1rem;
+ }
+
+ /* 4. Uvodni odstavek in Pogoste težave */
+ .mediation-hero-content {
+ order: 4;
+ max-width: 100%;
+ }
+
+ .mediation-hero-content p {
+ text-align: left;
+ }
+
+ .mediation-hero-content h3 {
+ text-align: left;
+ margin-top: 2rem !important;
+ }
+
+ .mediation-hero-content ul {
+ text-align: left;
+ }
+
+ /* 7. Hiter pregled vsebine - na koncu */
+ .mediation-hero-card {
+ order: 2;
+ margin-top: 2rem;
+ }
+
+ .mediation-hero-card h3 {
+ text-align: left;
+ }
+
+ .mediation-card-links {
+ text-align: left;
+ }
+
+ /* Rešitev in Rezultat sekcija */
+ .content-section {
+ padding: 40px 1.5rem;
+ }
+
+ .content-section h3 {
+ text-align: left;
+ }
+
+ .content-section p {
+ text-align: left;
+ }
+}
"""
@@ -11551,36 +12265,34 @@ html, body {