@@ -132,10 +132,12 @@
-
30 €
+ –
30 min
-
50 €
+ –
60 min
diff --git a/css/style.css b/css/style.css
index 4190da0..a0c0e4b 100644
--- a/css/style.css
+++ b/css/style.css
@@ -16,11 +16,16 @@
box-sizing: border-box;
}
+html {
+ overflow-x: hidden;
+}
+
body {
font-family: 'Poppins', sans-serif;
line-height: 1.6;
color: var(--text-color);
background: var(--bg-color);
+ overflow-x: hidden;
}
body.no-scroll {
@@ -1253,6 +1258,7 @@ footer {
.offer-hero-card {
margin: 0 auto;
max-width: min(90%, 440px);
+ text-align: left;
}
.offer-hero .shape-a {
@@ -1315,6 +1321,19 @@ footer {
.offer-languages-grid {
grid-template-columns: 1fr;
}
+
+ .offer-hero-lead,
+ .offer-language-card p,
+ .offer-mediation-text p {
+ text-align: left;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
+
+ .offer-hero-card li {
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
}
@media (max-width: 520px) {
@@ -1435,9 +1454,9 @@ footer {
.rates-hero-list li {
display: flex;
- justify-content: space-between;
- align-items: baseline;
- gap: 1.4rem;
+ justify-content: flex-start;
+ align-items: center;
+ gap: 0.75rem;
font-size: 1.05rem;
color: #3f4551;
}
@@ -1447,6 +1466,12 @@ footer {
color: #1f2530;
}
+.rates-hero-list .rates-hero-separator {
+ font-size: 1.2rem;
+ color: #3f4551;
+ line-height: 1;
+}
+
.rates-hero-shape {
position: absolute;
border-radius: 50%;
@@ -1487,23 +1512,23 @@ footer {
.rates-pricing-container {
position: relative;
max-width: 1080px;
- margin: -110px auto 0;
+ margin: -95px auto 0;
background: #ffffff;
border-radius: 34px;
- box-shadow: 0 45px 90px rgba(15, 25, 40, 0.1);
- padding: 3.4rem 3rem;
+ box-shadow: 0 35px 75px rgba(15, 25, 40, 0.09);
+ padding: 3rem 2.6rem;
display: flex;
flex-direction: column;
- gap: 3rem;
+ gap: 2.4rem;
overflow: hidden;
}
.rates-section {
position: relative;
- padding: 2.8rem 2.4rem;
+ padding: 2.4rem 2rem;
border-radius: 30px;
background: linear-gradient(135deg, rgba(251, 99, 57, 0.12), rgba(255, 210, 190, 0.26));
- box-shadow: 0 25px 65px rgba(15, 25, 40, 0.08);
+ box-shadow: 0 22px 58px rgba(15, 25, 40, 0.07);
overflow: hidden;
}
@@ -1569,7 +1594,7 @@ footer {
.rates-testimonials {
position: relative;
background: #fdfcfa;
- padding: 120px 2rem 150px;
+ padding: 90px 2rem 120px;
overflow: hidden;
}
@@ -1757,22 +1782,144 @@ footer {
}
.rates-section {
- padding: 2.4rem 2.1rem;
+ padding: 2rem 1.8rem;
}
.rates-testimonials {
- padding: 110px 1.6rem 120px;
+ padding: 80px 1.6rem 100px;
}
.rates-testimonials-header h2 {
font-size: 2rem;
letter-spacing: 0.16em;
}
+
+ .mediation-hero {
+ padding: 140px 1.6rem 120px;
+ }
+
+ .mediation-hero-container {
+ grid-template-columns: 1fr;
+ gap: 2.5rem;
+ text-align: center;
+ }
+
+ .mediation-hero-text {
+ align-items: center;
+ }
+
+ .mediation-hero-kicker {
+ align-self: center;
+ }
+
+ .mediation-hero-card {
+ margin: 0 auto;
+ max-width: min(90%, 420px);
+ }
+
+ .mediation-hero .shape-a {
+ left: -20%;
+ }
+
+ .mediation-hero .shape-c {
+ left: 16%;
+ }
+
+ .mediation-detail {
+ padding: 90px 1.6rem;
+ }
+
+ .mediation-detail-container {
+ grid-template-columns: 1fr;
+ gap: 2.5rem;
+ text-align: center;
+ }
+
+ .mediation-detail-image {
+ order: -1;
+ }
+
+ .mediation-detail-text {
+ align-items: center;
+ }
+
+ .mediation-detail-text p {
+ max-width: 60ch;
+ }
+
+ .mediation-process {
+ padding: 90px 1.6rem;
+ }
+
+ .mediation-process-container {
+ padding: 2.6rem;
+ text-align: center;
+ }
+
+ .mediation-accordion {
+ padding: 100px 1.6rem 120px;
+ }
+
+ .mediation-accordion-header {
+ text-align: center;
+ }
+
+ .mediation-accordion-header p {
+ margin: 0 auto;
+ }
+
+ .faq-hero {
+ padding: 140px 1.6rem 120px;
+ }
+
+ .faq-hero-container {
+ grid-template-columns: 1fr;
+ gap: 2.5rem;
+ text-align: center;
+ }
+
+ .faq-hero-text {
+ align-items: center;
+ }
+
+ .faq-hero-kicker {
+ align-self: center;
+ }
+
+ .faq-hero-lead {
+ max-width: 54ch;
+ }
+
+ .faq-hero-card {
+ margin: 0 auto;
+ max-width: min(90%, 420px);
+ }
+
+ .faq-hero .shape-a {
+ left: -18%;
+ }
+
+ .faq-hero .shape-c {
+ right: 16%;
+ }
+
+ .faq-accordion {
+ padding: 100px 1.6rem 120px;
+ }
+
+ .faq-accordion-header {
+ text-align: center;
+ }
+
+ .faq-accordion-header p {
+ margin: 0.6rem auto 0;
+ max-width: 54ch;
+ }
}
@media (max-width: 768px) {
.rates-hero {
- padding: 120px 1.3rem 110px;
+ padding: 110px 1.3rem 95px;
}
.rates-hero h1 {
@@ -1781,6 +1928,9 @@ footer {
.rates-hero-lead {
font-size: 1.05rem;
+ text-align: left;
+ -webkit-hyphens: auto;
+ hyphens: auto;
}
.rates-hero .shape-b {
@@ -1794,37 +1944,166 @@ footer {
left: 14%;
}
+ .rates-pricing {
+ padding: 0 1.5rem 50px;
+ }
+
.rates-pricing-container {
- padding: 2.6rem 1.9rem;
+ margin: -60px auto 0;
+ padding: 1.9rem 1.45rem;
+ gap: 1.6rem;
}
.rates-section {
- padding: 2rem 1.6rem;
- border-radius: 24px;
+ padding: 1.5rem 1.25rem;
+ border-radius: 22px;
+ }
+
+ .rates-section-header h2 {
+ font-size: 1.9rem;
+ margin-bottom: 1.4rem;
}
.rates-card-grid {
grid-template-columns: 1fr;
+ gap: 1.4rem;
+ }
+
+ .rates-card {
+ padding: 1.5rem 1.3rem;
+ gap: 0.8rem;
+ }
+
+ .rates-card ul {
+ gap: 0.5rem;
+ text-align: left;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
+
+ .rates-testimonials {
+ padding: 50px 1.3rem 65px;
}
.rates-testimonials-container {
- gap: 2.4rem;
+ gap: 2.2rem;
+ }
+
+ .rates-testimonials-header h2 {
+ letter-spacing: 0.14em;
}
.rates-testimonial-card {
- padding: 2.4rem 2rem;
- gap: 1.2rem;
+ padding: 2.2rem 1.8rem;
+ gap: 1.1rem;
}
+ .rates-testimonial-text p {
+ text-align: left;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
+
+ .mediation-hero {
+ padding: 110px 1.3rem 95px;
+ }
+
+ .mediation-hero h1 {
+ font-size: 2.6rem;
+ }
+
+ .mediation-hero-lead {
+ font-size: 1.05rem;
+ }
+
+ .mediation-hero .shape-b {
+ display: none;
+ }
+
+ .mediation-hero .shape-c {
+ width: 320px;
+ height: 320px;
+ bottom: -140px;
+ left: 18%;
+ }
+
+ .mediation-detail {
+ padding: 80px 1.3rem;
+ }
+
+ .mediation-detail-text h2 {
+ font-size: 1.9rem;
+ }
+
+ .mediation-detail-image {
+ min-height: 260px;
+ }
+
+ .mediation-detail-image picture,
+ .mediation-detail-image img {
+ border-radius: 24px;
+ }
+
+ .mediation-process {
+ padding: 80px 1.3rem;
+ }
+
+ .mediation-process-container {
+ padding: 2.2rem;
+ }
+
+ .mediation-accordion {
+ padding: 90px 1.3rem 110px;
+ }
+
+ .mediation-accordion-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .faq-hero {
+ padding: 110px 1.3rem 95px;
+ }
+
+ .faq-hero h1 {
+ font-size: 2.6rem;
+ }
+
+ .faq-hero-lead {
+ font-size: 1.05rem;
+ }
+
+ .faq-hero .shape-b {
+ display: none;
+ }
+
+ .faq-hero .shape-c {
+ display: none;
+ }
+
+ .faq-hero-card {
+ padding: 2rem 1.9rem;
+ }
+
+ .faq-accordion {
+ padding: 90px 1.3rem 110px;
+ }
+
+ .faq-question {
+ font-size: 1.05rem;
+ }
+
+ .faq-item {
+ padding: 1.5rem 1.6rem;
+ }
}
@media (max-width: 520px) {
.rates-hero {
- padding: 110px 1rem 95px;
+ padding: 100px 1rem 75px;
}
.rates-hero h1 {
- font-size: 2.3rem;
+ font-size: 2.2rem;
}
.rates-hero .shape-a,
@@ -1833,26 +2112,197 @@ footer {
}
.rates-hero-card {
- padding: 2rem 1.6rem;
+ padding: 1.8rem 1.4rem;
+ }
+
+ .rates-pricing {
+ padding: 0 1.1rem 45px;
}
.rates-pricing-container {
- padding: 2.4rem 1.4rem;
+ margin: -40px auto 0;
+ padding: 1.6rem 1.15rem;
border-radius: 22px;
+ gap: 1.3rem;
}
.rates-section {
- padding: 1.8rem 1.3rem;
+ padding: 1.3rem 1rem;
+ }
+
+ .rates-section-header h2 {
+ font-size: 1.7rem;
+ margin-bottom: 1.1rem;
+ }
+
+ .rates-card {
+ padding: 1.3rem 1.15rem;
+ gap: 0.75rem;
+ }
+
+ .rates-testimonials {
+ padding: 40px 1rem 55px;
+ }
+
+ .rates-testimonials-header h2 {
+ letter-spacing: 0.12em;
}
.rates-testimonial-card {
- padding: 2rem 1.6rem;
- gap: 1.2rem;
+ padding: 1.8rem 1.4rem;
+ gap: 1rem;
}
.rates-testimonials-shape {
display: none;
}
+
+ .mediation-hero {
+ padding: 100px 1rem 70px;
+ }
+
+ .mediation-hero h1 {
+ font-size: 2rem;
+ line-height: 1.2;
+ }
+
+ .mediation-hero-container {
+ display: flex;
+ flex-direction: column;
+ gap: 1.6rem;
+ align-items: stretch;
+ text-align: left;
+ }
+
+ .mediation-hero-text {
+ align-items: flex-start;
+ text-align: left;
+ gap: 1rem;
+ }
+
+ .mediation-hero-lead {
+ font-size: 0.98rem;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
+
+ .mediation-hero-kicker {
+ align-self: flex-start;
+ }
+
+ .mediation-hero .shape-a,
+ .mediation-hero .shape-c {
+ display: none;
+ }
+
+ .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);
+ }
+
+ .mediation-hero-card ul {
+ gap: 0.6rem;
+ }
+
+ .mediation-hero-card li a {
+ font-size: 0.95rem;
+ }
+
+ .mediation-hero-card li a::before {
+ font-size: 0.85rem;
+ }
+
+ .mediation-detail {
+ padding: 70px 1rem;
+ }
+
+ .mediation-detail-text {
+ align-items: flex-start;
+ text-align: left;
+ gap: 1rem;
+ }
+
+ .mediation-detail-text h2 {
+ font-size: 1.6rem;
+ }
+
+ .mediation-detail-text p {
+ max-width: none;
+ font-size: 0.96rem;
+ line-height: 1.75;
+ }
+
+ .mediation-detail-container {
+ display: flex;
+ flex-direction: column;
+ text-align: left;
+ gap: 1.8rem;
+ }
+
+ .mediation-detail-image {
+ order: -1;
+ min-height: 220px;
+ max-width: 320px;
+ width: 100%;
+ margin: 0 auto;
+ }
+
+ .mediation-process {
+ padding: 70px 1rem;
+ }
+
+ .mediation-process-container {
+ padding: 1.8rem 1.5rem;
+ }
+
+ .mediation-accordion {
+ padding: 80px 1rem 95px;
+ }
+
+ .mediation-accordion-item {
+ padding: 1.8rem 1.5rem;
+ }
+
+ .accordion-toggle {
+ width: 100%;
+ justify-content: center;
+ }
+
+ .faq-hero {
+ padding: 95px 1rem 70px;
+ }
+
+ .faq-hero h1 {
+ font-size: 2.2rem;
+ }
+
+ .faq-hero-card {
+ padding: 1.7rem 1.4rem;
+ text-align: left;
+ }
+
+ .faq-accordion {
+ padding: 80px 1rem 95px;
+ }
+
+ .faq-item {
+ padding: 1.4rem 1.3rem;
+ }
+
+ .faq-question {
+ font-size: 1rem;
+ }
+
+ .faq-question::after {
+ font-size: 1.1rem;
+ margin-left: 0.8rem;
+ }
}
/* Workshop Directory Page */
@@ -2486,11 +2936,11 @@ footer {
content: "+";
font-size: 1.5rem;
color: var(--primary-color);
- transition: transform 0.3s ease;
+ transition: color 0.3s ease;
}
.faq-item.active .faq-question::after {
- transform: rotate(45deg);
+ content: "–";
}
.faq-answer {
@@ -2507,7 +2957,7 @@ footer {
}
.faq-answer p {
- color: #555555;
+ color: #000000;
line-height: 1.7;
margin-bottom: 1rem;
}
@@ -2934,82 +3384,996 @@ footer {
margin: 0 auto;
}
-/* Mediation Page Styles */
-.mediation-section {
- margin-bottom: 2rem;
- padding-bottom: 2rem;
- border-bottom: 1px solid #eee;
-}
-
-.mediation-section:last-child {
- border-bottom: none;
- margin-bottom: 0;
-}
-
-.mediation-section h2 {
- color: var(--primary-color);
- margin-bottom: 0;
- cursor: pointer;
- transition: var(--transition);
-}
-
-.mediation-section h2:hover {
- opacity: 0.8;
-}
-
-.mediation-content {
- max-height: 0;
- overflow: hidden;
- transition: max-height 0.4s ease-out, margin-top 0.4s ease-out;
-}
-
-.mediation-section.active .mediation-content {
- max-height: 1000px;
- margin-top: 1.5rem;
-}
-
-.mediation-section p, .mediation-section li {
- line-height: 1.8;
-}
-
-.mediation-section ul {
- list-style: none;
- padding-left: 0;
-}
-
-.mediation-section ul li {
- padding-left: 1.5rem;
+/* Medkulturno Posredovanje Page */
+.mediation-hero {
position: relative;
- margin-bottom: 0.5rem;
+ padding: 160px 2rem 140px;
+ background: #fdfcfa;
+ overflow: hidden;
}
-.mediation-section ul li::before {
- content: '□';
- position: absolute;
- left: 0;
+.mediation-hero-container {
+ position: relative;
+ z-index: 2;
+ max-width: 1120px;
+ margin: 0 auto;
+ display: grid;
+ grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
+ gap: 3rem;
+ align-items: center;
+}
+
+.mediation-hero-text {
+ display: flex;
+ flex-direction: column;
+ gap: 1.4rem;
+}
+
+.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);
color: var(--primary-color);
+ font-size: 0.72rem;
+ letter-spacing: 0.12em;
+ text-transform: uppercase;
+ font-weight: 600;
+}
+
+.mediation-hero h1 {
+ font-size: 3rem;
+ line-height: 1.24;
+ color: #1f2530;
+ margin: 0;
+}
+
+.mediation-hero-lead {
+ font-size: 1.15rem;
+ line-height: 1.9;
+ color: #454b57;
+ max-width: 52ch;
+}
+
+.mediation-hero-card {
+ background: rgba(255, 255, 255, 0.9);
+ border-radius: 28px;
+ padding: 2.3rem 2.4rem;
+ box-shadow: 0 30px 75px rgba(15, 25, 40, 0.12);
+ border-left: 5px solid var(--primary-color);
+ display: flex;
+ flex-direction: column;
+ gap: 1.4rem;
+}
+
+.mediation-hero-card h3 {
+ margin: 0;
+ font-size: 1.25rem;
+ color: #1f2530;
+}
+
+.mediation-hero-card ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ display: grid;
+ gap: 0.9rem;
+}
+
+.mediation-hero-card li a {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.6rem;
+ text-decoration: none;
+ color: #3f4551;
+ font-weight: 600;
+ transition: color 0.2s ease;
+}
+
+.mediation-hero-card li a::before {
+ content: '→';
+ font-size: 1rem;
+ color: var(--primary-color);
+ transition: transform 0.2s ease;
+}
+
+.mediation-hero-card li a:hover {
+ color: var(--primary-color);
+}
+
+.mediation-hero-card li a:hover::before {
+ transform: translateX(4px);
+}
+
+.mediation-hero-shape {
+ position: absolute;
+ border-radius: 50%;
+ pointer-events: none;
+ opacity: 0.55;
+ z-index: 1;
+}
+
+.mediation-hero .shape-a {
+ width: 320px;
+ height: 320px;
+ background: rgba(251, 99, 57, 0.18);
+ top: 14%;
+ left: -8%;
+}
+
+.mediation-hero .shape-b {
+ width: 220px;
+ height: 220px;
+ background: rgba(255, 210, 190, 0.28);
+ bottom: 10%;
+ right: 12%;
+}
+
+.mediation-hero .shape-c {
+ width: 440px;
+ height: 440px;
+ background: rgba(200, 230, 255, 0.26);
+ bottom: -160px;
+ left: 22%;
+}
+
+.mediation-detail {
+ padding: 110px 2rem;
+ background: #ffffff;
+}
+
+.mediation-detail:nth-of-type(even) {
+ background: #fdfcfa;
+}
+
+.mediation-detail-container {
+ max-width: 1120px;
+ margin: 0 auto;
+ display: grid;
+ grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
+ gap: 3rem;
+ align-items: center;
+}
+
+.mediation-detail--reverse .mediation-detail-container {
+ grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
+}
+
+.mediation-detail-text {
+ display: flex;
+ flex-direction: column;
+ gap: 1.2rem;
+}
+
+.mediation-detail-text h2 {
+ margin: 0;
+ font-size: 2.1rem;
+ color: #1f2530;
+}
+
+.mediation-detail-text p {
+ color: #464d5b;
+ line-height: 1.85;
+}
+
+.mediation-detail-image {
+ position: relative;
+ border-radius: 28px;
+ overflow: hidden;
+ min-height: 320px;
+}
+
+.mediation-detail-image picture,
+.mediation-detail-image img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ border-radius: 28px;
+ box-shadow: 0 28px 60px rgba(15, 25, 40, 0.14);
+}
+
+.mediation-process {
+ padding: 110px 2rem;
+ background: linear-gradient(135deg, rgba(251, 99, 57, 0.08), rgba(255, 210, 190, 0.12));
+}
+
+.mediation-process-container {
+ max-width: 900px;
+ margin: 0 auto;
+ background: rgba(255, 255, 255, 0.94);
+ border-radius: 28px;
+ padding: 3rem;
+ box-shadow: 0 24px 55px rgba(15, 25, 40, 0.1);
+ display: flex;
+ flex-direction: column;
+ gap: 1.5rem;
+}
+
+.mediation-process-container h2 {
+ margin: 0;
+ font-size: 2.1rem;
+ color: #1f2530;
+}
+
+.mediation-process-content p {
+ color: #3f4551;
+ line-height: 1.9;
+}
+
+.mediation-accordion {
+ padding: 120px 2rem 140px;
+ background: #ffffff;
+}
+
+.mediation-accordion-container {
+ max-width: 1120px;
+ margin: 0 auto;
+ display: flex;
+ flex-direction: column;
+ gap: 3rem;
+}
+
+.mediation-accordion-header {
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+ align-items: center;
+ text-align: center;
+ margin: 0 auto;
+}
+
+.mediation-accordion-header h2 {
+ margin: 0;
+ font-size: 2.2rem;
+ color: #1f2530;
+ letter-spacing: 0.12em;
+}
+
+.mediation-accordion-header p {
+ max-width: 60ch;
+ color: #464d5b;
+ line-height: 1.8;
+ text-align: center;
+ margin: 0 auto;
+}
+
+.mediation-accordion-grid {
+ display: flex;
+ flex-direction: column;
+ gap: 1.6rem;
+ counter-reset: mediation-step;
+ max-width: 760px;
+ margin: 0 auto;
+}
+
+.mediation-accordion-item {
+ position: relative;
+ counter-increment: mediation-step;
+ background: rgba(255, 255, 255, 0.98);
+ border-radius: 22px;
+ padding: 2.1rem 2.2rem 2rem 4.5rem;
+ border: 1px solid rgba(31, 37, 48, 0.08);
+ box-shadow: 0 14px 38px rgba(15, 25, 40, 0.08);
+ display: flex;
+ flex-direction: column;
+ gap: 1.2rem;
+ transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
+}
+
+.mediation-accordion-item::before {
+ content: counter(mediation-step);
+ position: absolute;
+ top: 1.9rem;
+ left: 1.4rem;
+ width: 2.4rem;
+ height: 2.4rem;
+ border-radius: 50%;
+ background: var(--primary-color);
+ color: #ffffff;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ font-weight: 600;
+ box-shadow: 0 10px 22px rgba(251, 99, 57, 0.25);
+ font-size: 1rem;
+}
+
+.mediation-accordion-item:hover {
+ transform: translateY(-4px);
+ border-color: rgba(251, 99, 57, 0.25);
+ box-shadow: 0 18px 45px rgba(15, 25, 40, 0.12);
+}
+
+.mediation-accordion-title {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1rem;
+}
+
+.mediation-accordion-title h3 {
+ margin: 0;
+ font-size: 1.25rem;
+ color: #1f2530;
+ font-weight: 600;
+}
+
+.mediation-accordion-title button {
+ flex-shrink: 0;
}
/* Accordion Styles */
.accordion-toggle {
- background: none;
- border: none;
+ display: inline-flex;
+ align-items: center;
+ gap: 0.4rem;
+ background: transparent;
+ border: 1px solid rgba(251, 99, 57, 0.35);
color: var(--primary-color);
font-weight: 600;
cursor: pointer;
- font-size: 1.1rem;
- padding: 10px 0;
- margin-top: 1rem;
- text-align: left;
+ font-size: 0.92rem;
+ padding: 0.52rem 1.2rem;
+ border-radius: 999px;
+ transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
+}
+
+.accordion-toggle::after {
+ content: '+';
+ font-weight: 700;
+}
+
+.accordion-toggle.active::after {
+ content: '−';
+}
+
+.accordion-toggle:hover {
+ background: rgba(251, 99, 57, 0.12);
+ border-color: rgba(251, 99, 57, 0.55);
+ transform: translateY(-1px);
+}
+
+.accordion-toggle.active,
+.accordion-toggle:hover.active {
+ background: var(--primary-color);
+ color: #ffffff;
+ border-color: var(--primary-color);
}
.accordion-content {
max-height: 0;
overflow: hidden;
- transition: max-height 0.4s ease-out;
- border-left: 2px solid var(--primary-color);
- padding-left: 1.5rem;
- margin-top: 1rem;
+ transition: max-height 0.35s ease;
+ display: grid;
+ gap: 0.9rem;
+ color: #434955;
+ line-height: 1.75;
+}
+
+.accordion-content ul {
+ margin: 0;
+ padding-left: 1.2rem;
+ display: grid;
+ gap: 0.45rem;
+}
+
+.accordion-content li {
+ list-style: disc;
+}
+
+.accordion-toggle + .accordion-content {
+ padding-top: 0;
+}
+
+/* FAQ Page */
+.faq-hero {
+ position: relative;
+ padding: 160px 2rem 140px;
+ background: #fdfcfa;
+ overflow: hidden;
+}
+
+.faq-hero-container {
+ position: relative;
+ z-index: 2;
+ max-width: 1120px;
+ margin: 0 auto;
+ display: grid;
+ grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
+ gap: 3rem;
+ align-items: center;
+}
+
+.faq-hero-text {
+ display: flex;
+ flex-direction: column;
+ gap: 1.4rem;
+}
+
+.faq-hero-kicker {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.4rem;
+ padding: 0.4rem 1.1rem;
+ border-radius: 999px;
+ background: rgba(251, 99, 57, 0.16);
+ color: var(--primary-color);
+ font-size: 0.72rem;
+ letter-spacing: 0.12em;
+ text-transform: uppercase;
+ font-weight: 600;
+}
+
+.faq-hero h1 {
+ margin: 0;
+ font-size: 3rem;
+ line-height: 1.22;
+ color: #1f2530;
+}
+
+.faq-hero-lead {
+ font-size: 1.18rem;
+ line-height: 1.95;
+ color: #3f4551;
+ max-width: 60ch;
+}
+
+.faq-hero-card {
+ background: rgba(255, 255, 255, 0.92);
+ border-radius: 28px;
+ padding: 2.4rem 2.3rem;
+ box-shadow: 0 28px 65px rgba(15, 25, 40, 0.12);
+ border-left: 5px solid var(--primary-color);
+ display: flex;
+ flex-direction: column;
+ gap: 1.4rem;
+}
+
+.faq-hero-card h3 {
+ margin: 0;
+ font-size: 1.35rem;
+ color: #1f2530;
+}
+
+.faq-hero-card p {
+ margin: 0;
+ color: #464d5b;
+ line-height: 1.8;
+}
+
+.faq-hero-contact {
+ display: grid;
+ gap: 0.7rem;
+}
+
+.faq-hero-contact a {
+ color: var(--primary-color);
+ font-weight: 600;
+ text-decoration: none;
+}
+
+.faq-hero-contact a:hover {
+ text-decoration: underline;
+}
+
+.faq-hero-shape {
+ position: absolute;
+ pointer-events: none;
+ border-radius: 50%;
+ opacity: 0.55;
+ z-index: 1;
+}
+
+.faq-hero .shape-a {
+ width: 280px;
+ height: 280px;
+ background: rgba(255, 210, 190, 0.35);
+ top: 14%;
+ left: -10%;
+}
+
+.faq-hero .shape-b {
+ width: 340px;
+ height: 340px;
+ background: rgba(200, 230, 255, 0.26);
+ bottom: -160px;
+ left: 24%;
+}
+
+.faq-hero .shape-c {
+ width: 200px;
+ height: 200px;
+ background: rgba(251, 99, 57, 0.18);
+ bottom: 12%;
+ right: 8%;
+}
+
+.faq-accordion {
+ padding: 120px 2rem 140px;
+ background: #ffffff;
+}
+
+.faq-accordion-container {
+ max-width: 900px;
+ margin: 0 auto;
+ display: flex;
+ flex-direction: column;
+ gap: 2.6rem;
+}
+
+.faq-accordion-header h2 {
+ margin: 0;
+ font-size: 2.3rem;
+ color: #1f2530;
+ letter-spacing: 0.08em;
+}
+
+.faq-accordion-header p {
+ margin: 0.8rem 0 0;
+ color: #434955;
+ line-height: 1.85;
+}
+
+.faq-accordion-list {
+ display: grid;
+ gap: 1.2rem;
+}
+
+.faq-item {
+ background: rgba(255, 255, 255, 0.94);
+ border-radius: 24px;
+ padding: 1.6rem 1.8rem;
+ box-shadow: 0 20px 50px rgba(15, 25, 40, 0.08);
+ border: 1px solid rgba(31, 37, 48, 0.04);
+ transition: box-shadow 0.2s ease, transform 0.2s ease;
+}
+
+.faq-item.active {
+ box-shadow: 0 28px 64px rgba(15, 25, 40, 0.12);
+ transform: translateY(-2px);
+}
+
+.faq-question {
+ width: 100%;
+ border: none;
+ background: transparent;
+ padding: 0;
+ font-size: 1.1rem;
+ font-weight: 600;
+ color: #1f2530;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ text-align: left;
+ cursor: pointer;
+}
+
+.faq-question span {
+ flex: 1;
+}
+
+.faq-question::after {
+ content: '+';
+ font-size: 1.3rem;
+ color: var(--primary-color);
+ margin-left: 1rem;
+ transition: color 0.2s ease;
+}
+
+.faq-item.active .faq-question::after {
+ content: '–';
+}
+
+.faq-answer {
+ max-height: 0;
+ overflow: hidden;
+ transition: max-height 0.35s ease;
+ display: grid;
+ gap: 1rem;
+ margin-top: 0;
+}
+
+.faq-item.active .faq-answer {
+ margin-top: 1.1rem;
+}
+
+.faq-answer p {
+ margin: 0;
+ color: #000000;
+ line-height: 1.85;
+}
+
+.faq-answer ul {
+ margin: 0;
+ padding-left: 0;
+ display: grid;
+ gap: 0.5rem;
+ color: #000000;
+ line-height: 1.75;
+ list-style: none;
+}
+
+.faq-answer li {
+ list-style: none;
+}
+
+@media (min-width: 1024px) {
+ .mediation-hero-lead,
+ .mediation-detail-text p,
+ .mediation-process-content p,
+ .accordion-content p {
+ text-align: justify;
+ text-justify: inter-word;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+ }
+}
+
+@media (max-width: 992px) {
+ .faq-hero {
+ padding: 130px 1.6rem 110px;
+ }
+
+ .faq-hero-container {
+ grid-template-columns: 1fr;
+ gap: 2.6rem;
+ justify-items: stretch;
+ }
+
+ .faq-hero-text,
+ .faq-hero-card {
+ width: 100%;
+ max-width: 560px;
+ margin: 0 auto;
+ }
+
+ .faq-hero-text {
+ align-items: flex-start;
+ text-align: left;
+ gap: 1.2rem;
+ }
+
+ .faq-hero-kicker {
+ align-self: flex-start;
+ }
+
+ .faq-hero-card {
+ align-items: flex-start;
+ text-align: left;
+ }
+}
+
+@media (max-width: 768px) {
+ .faq-hero {
+ padding: 110px 1.3rem 95px;
+ }
+
+ .faq-hero h1 {
+ font-size: 2.4rem;
+ }
+
+ .faq-hero-lead {
+ font-size: 1.05rem;
+ line-height: 1.8;
+ }
+
+ .faq-hero .shape-b,
+ .faq-hero .shape-c {
+ display: none;
+ }
+
+ .faq-hero-card {
+ padding: 2rem 1.8rem;
+ border-left-width: 4px;
+ gap: 1.2rem;
+ }
+
+ .faq-accordion {
+ padding: 90px 1.3rem 110px;
+ }
+
+ .faq-item {
+ padding: 1.5rem 1.6rem;
+ }
+
+ .faq-question {
+ font-size: 1.05rem;
+ }
+}
+
+@media (max-width: 520px) {
+ .faq-hero {
+ padding: 95px 1.1rem 80px;
+ }
+
+ .faq-hero-text {
+ gap: 1rem;
+ }
+
+ .faq-hero h1 {
+ font-size: 2rem;
+ }
+
+ .faq-hero-lead {
+ font-size: 1rem;
+ line-height: 1.75;
+ }
+
+ .faq-hero-card {
+ padding: 1.7rem 1.4rem;
+ gap: 1rem;
+ }
+
+ .faq-accordion {
+ padding: 80px 1.1rem 90px;
+ }
+
+ .faq-item {
+ padding: 1.3rem 1.2rem;
+ }
+
+ .faq-question {
+ font-size: 1rem;
+ align-items: flex-start;
+ }
+
+ .faq-question::after {
+ margin-left: 0.6rem;
+ font-size: 1.1rem;
+ }
+
+ .faq-answer {
+ gap: 0.75rem;
+ }
+
+ .faq-answer p,
+ .faq-answer li {
+ font-size: 0.97rem;
+ line-height: 1.7;
+ }
+
+ .faq-answer ul {
+ gap: 0.4rem;
+ }
+}
+
+/* Responsive adjustments for Medkulturno Posredovanje */
+@media (max-width: 1060px) {
+ .mediation-hero {
+ padding: 140px 1.5rem 110px;
+ }
+
+ .mediation-hero-container {
+ grid-template-columns: 1fr;
+ max-width: 760px;
+ gap: 2.5rem;
+ }
+
+ .mediation-hero-card {
+ max-width: 480px;
+ margin: 0 auto;
+ }
+
+ .mediation-hero .shape-a {
+ top: 4%;
+ left: -28%;
+ }
+
+ .mediation-hero .shape-b {
+ right: -12%;
+ bottom: 4%;
+ }
+
+ .mediation-hero .shape-c {
+ left: -10%;
+ bottom: -180px;
+ }
+
+ .mediation-detail,
+ .mediation-process,
+ .mediation-accordion {
+ padding: 90px 1.5rem;
+ }
+
+ .mediation-detail-container,
+ .mediation-detail--reverse .mediation-detail-container {
+ grid-template-columns: 1fr;
+ gap: 2.5rem;
+ }
+
+ .mediation-detail-image {
+ min-height: 260px;
+ }
+
+ .mediation-process-container {
+ padding: 2.6rem;
+ }
+}
+
+@media (max-width: 720px) {
+ .mediation-hero {
+ padding: 120px 1.25rem 100px;
+ }
+
+ .mediation-hero-text {
+ gap: 1.1rem;
+ }
+
+ .mediation-hero h1 {
+ font-size: 2.35rem;
+ }
+
+ .mediation-hero-lead {
+ font-size: 1.02rem;
+ line-height: 1.75;
+ }
+
+ .mediation-hero-card {
+ width: 100%;
+ padding: 2rem 2.1rem;
+ border-radius: 22px;
+ }
+
+ .mediation-detail {
+ padding: 80px 1.25rem;
+ }
+
+ .mediation-detail-image picture,
+ .mediation-detail-image img {
+ border-radius: 22px;
+ }
+
+ .mediation-detail-text h2 {
+ font-size: 1.85rem;
+ }
+
+ .mediation-detail-text p {
+ line-height: 1.7;
+ }
+
+ .mediation-process {
+ padding: 80px 1.25rem;
+ }
+
+ .mediation-process-container {
+ padding: 2rem 1.8rem;
+ border-radius: 22px;
+ }
+
+ .mediation-accordion {
+ padding: 90px 1.25rem;
+ }
+
+ .mediation-accordion-item {
+ padding: 1.6rem 1.35rem 1.55rem 3.2rem;
+ border-radius: 18px;
+ border-width: 1px;
+ box-shadow: 0 10px 30px rgba(15, 25, 40, 0.12);
+ gap: 0.9rem;
+ }
+
+ .mediation-accordion-title {
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 0.6rem;
+ }
+
+ .mediation-accordion-title h3 {
+ text-align: left;
+ font-size: 1.05rem;
+ }
+
+ .accordion-toggle {
+ align-self: flex-start;
+ font-size: 0.85rem;
+ padding: 0.45rem 0.9rem;
+ }
+
+ /* Prevent AOS horizontal offsets from causing sideways scrolling */
+ [data-aos="fade-left"],
+ [data-aos="fade-right"] {
+ transform: none !important;
+ }
+
+ .mediation-accordion-grid {
+ max-width: 100%;
+ gap: 1.1rem;
+ }
+
+ .mediation-accordion-item::before {
+ width: 1.9rem;
+ height: 1.9rem;
+ top: 1.4rem;
+ left: 1.2rem;
+ font-size: 0.85rem;
+ box-shadow: 0 8px 18px rgba(251, 99, 57, 0.25);
+ }
+
+ .accordion-content {
+ gap: 0.7rem;
+ }
+}
+
+@media (max-width: 520px) {
+ .mediation-hero {
+ padding: 110px 1rem 90px;
+ }
+
+ .mediation-hero h1 {
+ font-size: 2.05rem;
+ }
+
+ .mediation-hero-lead {
+ font-size: 0.98rem;
+ }
+
+ .mediation-hero-card {
+ padding: 1.6rem 1.7rem;
+ gap: 1rem;
+ }
+
+ .mediation-hero-card h3 {
+ font-size: 1.15rem;
+ }
+
+ .mediation-hero-card li a {
+ font-size: 0.95rem;
+ }
+
+ .mediation-detail,
+ .mediation-process,
+ .mediation-accordion {
+ padding: 70px 1rem;
+ }
+
+ .mediation-detail-container {
+ gap: 2rem;
+ }
+
+ .mediation-detail-image {
+ min-height: 220px;
+ }
+
+ .mediation-process-container h2,
+ .mediation-accordion-header h2 {
+ font-size: 1.85rem;
+ }
+
+ .mediation-accordion-item {
+ padding: 1.4rem 1.2rem 1.4rem 2.9rem;
+ gap: 0.75rem;
+ border-radius: 16px;
+ }
+
+ .accordion-toggle {
+ width: 100%;
+ align-self: flex-start;
+ justify-content: center;
+ text-align: center;
+ padding: 0.45rem 0.9rem;
+ font-size: 0.83rem;
+ }
+
+ .mediation-accordion-item::before {
+ width: 1.6rem;
+ height: 1.6rem;
+ top: 1.2rem;
+ left: 1.05rem;
+ font-size: 0.75rem;
+ }
+
+ .mediation-accordion-title h3 {
+ font-size: 1rem;
+ }
+
+ .accordion-content {
+ font-size: 0.94rem;
+ gap: 0.6rem;
+ }
}
/* Workshop Page Styles */
diff --git a/delavnice/index.html b/delavnice/index.html
index eda3249..971345b 100644
--- a/delavnice/index.html
+++ b/delavnice/index.html
@@ -124,7 +124,7 @@
Pregled delavnic
Skupaj gradimo podporno okolje
-
Izberi delavnico, ki najbolje odgovarja potrebam tvoje šole ali vrtca, in spoznaj, kako lahko s strokovno pripravljeno vsebino okrepiš vključevanje priseljencev, sodelovanje s starši ter strokovno rast ekipe.
+
Izberite delavnico, ki najbolje ustreza vaši šoli ali vrtcu, in odkrijte, kako lahko z našo strokovno pripravljeno vsebino izboljšate vključevanje priseljencev, sodelovanje s starši ter strokovni razvoj ekipe.
diff --git a/index.html b/index.html
index b6b5d78..c72cd82 100644
--- a/index.html
+++ b/index.html
@@ -180,7 +180,7 @@
-
Sem tu za vas, Amra - mama, žena, raziskovalka jezikov in kultur ter vaša zvesta sopotnica na razburljivi poti učenja in odkrivanja novih svetov.
+
Sem Amra – mama, žena, raziskovalka jezikov in kultur ter vaša zvesta sopotnica na zanimivi poti učenja in odkrivanja novih svetov.
Kot profesorica angleščine in medkulturna posrednica vam pomagam usvajati angleščino (in druge jezike), odpirati vrata razumevanju ter ustvarjati priložnosti, da se v vsakem okolju počutite domače in samozavestno. Skupaj bomo rasli, se smejali in sijali v svetu novih možnosti!
MOJA ZGODBA