diff --git a/assets/scss/custom.scss b/assets/scss/custom.scss index 64c74fe..35e0e2d 100644 --- a/assets/scss/custom.scss +++ b/assets/scss/custom.scss @@ -632,7 +632,7 @@ body { } #about .about-image { width: 100%; - max-width: clamp(260px, 38vw, 480px); + max-width: clamp(200px, 38vw, 300px); height: auto; object-fit: contain; margin-left: auto; /* rechtsbündig in Spalte */ @@ -742,29 +742,15 @@ body { --cta-accent: #F5A623; /* Orange */ /* Button-Preset (hier zentral Größe steuern) */ - --btn-py: clamp(2rem, 2.8vw, 3rem); /* oben/unten -> Höhe */ - --btn-px: clamp(2rem, 3.6vw, 3em); /* links/rechts -> Breite (em skaliert mit Schriftgröße) */ - --btn-fs: clamp(2rem, 2vw, 3rem); /* Schriftgröße */ + --btn-py: clamp(1.8rem, 2.8vw, 2.5rem); /* oben/unten -> Höhe */ + --btn-px: clamp(1.8rem, 2.8vw, 2.5rem); /* links/rechts -> Breite (em skaliert mit Schriftgröße) */ + --btn-fs: clamp(1.8rem, 2.8vw, 2.5rem); /* Schriftgröße */ position: relative; overflow: hidden; padding: clamp(6rem, 10vw, 12rem) 0; /* Section höher wie „Standard-Sektion“ */ - background: #f3f3f3; } -/* Hintergrund dezent + optional animiert */ -.cta__bg { position: absolute; inset: 0; pointer-events: none; z-index: 0; } -.cta__grad { position: absolute; inset: 0; background: linear-gradient(180deg,#fff,#f6f9f9,#fff); } -@keyframes cta-pan { from { background-position: 0% 0%; } to { background-position: 200% 200%; } } -.cta__pan { - position: absolute; inset: 0; opacity: .08; background-size: 200% 200%; - background-image: - radial-gradient(40% 40% at 20% 10%, rgba(4,110,110,.25), transparent 60%), - radial-gradient(35% 35% at 85% 35%, rgba(245,166,35,.25), transparent 55%); - animation: cta-pan 24s linear infinite; -} -@media (prefers-reduced-motion: reduce) { .cta__pan { animation: none !important; } } - .cta .my-container { position: relative; z-index: 1; } .cta__wrap { text-align: center; max-width: 72rem; margin: 0 auto; padding: 0 clamp(1rem, 3vw, 2rem); } @@ -817,7 +803,7 @@ body { margin-top: clamp(1.2rem, 2.4vw, 1.6rem); } .cta__social-link { - width: clamp(56px, 6.2vw, 64px); height: clamp(56px, 6.2vw, 64px); + width: clamp(65px, 10vw, 70px); height: clamp(65px, 10vw, 70px); display: inline-flex; align-items: center; justify-content: center; background: #fff; border-radius: 9999px; box-shadow: 0 1px 3px rgba(0,0,0,.06); diff --git a/resources/_gen/assets/scss/style.scss_d9077b5cab49df084fb1a39ad4b1e75d.content b/resources/_gen/assets/scss/style.scss_d9077b5cab49df084fb1a39ad4b1e75d.content index f3db8e0..f4d05d3 100644 --- a/resources/_gen/assets/scss/style.scss_d9077b5cab49df084fb1a39ad4b1e75d.content +++ b/resources/_gen/assets/scss/style.scss_d9077b5cab49df084fb1a39ad4b1e75d.content @@ -3046,7 +3046,7 @@ body { #about .about-image { width: 100%; - max-width: clamp(260px, 38vw, 480px); + max-width: clamp(200px, 38vw, 300px); height: auto; object-fit: contain; margin-left: auto; @@ -3154,47 +3154,16 @@ body { --cta-accent: #F5A623; /* Orange */ /* Button-Preset (hier zentral Größe steuern) */ - --btn-py: clamp(2rem, 2.8vw, 3rem); + --btn-py: clamp(1.8rem, 2.8vw, 2.5rem); /* oben/unten -> Höhe */ - --btn-px: clamp(2rem, 3.6vw, 3em); + --btn-px: clamp(1.8rem, 2.8vw, 2.5rem); /* links/rechts -> Breite (em skaliert mit Schriftgröße) */ - --btn-fs: clamp(2rem, 2vw, 3rem); + --btn-fs: clamp(1.8rem, 2.8vw, 2.5rem); /* Schriftgröße */ position: relative; overflow: hidden; padding: clamp(6rem, 10vw, 12rem) 0; - /* Section höher wie „Standard-Sektion“ */ - background: #f3f3f3; } - -/* Hintergrund dezent + optional animiert */ -.cta__bg { - position: absolute; - inset: 0; - pointer-events: none; - z-index: 0; } - -.cta__grad { - position: absolute; - inset: 0; - background: linear-gradient(180deg, #fff, #f6f9f9, #fff); } - -@keyframes cta-pan { - from { - background-position: 0% 0%; } - to { - background-position: 200% 200%; } } - -.cta__pan { - position: absolute; - inset: 0; - opacity: .08; - background-size: 200% 200%; - background-image: radial-gradient(40% 40% at 20% 10%, rgba(4, 110, 110, 0.25), transparent 60%), radial-gradient(35% 35% at 85% 35%, rgba(245, 166, 35, 0.25), transparent 55%); - animation: cta-pan 24s linear infinite; } - -@media (prefers-reduced-motion: reduce) { - .cta__pan { - animation: none !important; } } + /* Section höher wie „Standard-Sektion“ */ } .cta .my-container { position: relative; @@ -3269,8 +3238,8 @@ body { margin-top: clamp(1.2rem, 2.4vw, 1.6rem); } .cta__social-link { - width: clamp(56px, 6.2vw, 64px); - height: clamp(56px, 6.2vw, 64px); + width: clamp(65px, 10vw, 70px); + height: clamp(65px, 10vw, 70px); display: inline-flex; align-items: center; justify-content: center;