Terminbuchung über PetWorkers und G&H-Zertifikat eingebaut
- "Termin buchen" in der Kopfleiste, im Kontakt und als Buchungs-Fläche mit allen Angeboten - Direkte Buchen-Knöpfe für Einzelcoaching, Gruppenstunden und Stundenplan - G&H-Siegel im Footer, auf Ernährung und bei den Ausbildungen - Datenschutz um die Online-Terminbuchung ergänzt - tools/make_zip.sh baut das Übergabe-Paket Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
NotPika69andClaude Opus 5.5 committed
1 parent
e368a0b2cc
commit
d154ea13c2
16 files changed
+243
-19
No files matched your search
+53
-1
@@ -97,6 +97,21 @@ svg { flex: none; }
|
||||
transition: background .25s var(--ease);
|
||||
}
|
||||
.nav a:hover, .nav a[aria-current="page"] { background: var(--sage-soft); }
|
||||
/* Buchen-Knopf in der Kopfleiste */
|
||||
.book-btn {
|
||||
pointer-events: auto;
|
||||
display: inline-flex; align-items: center; gap: 10px;
|
||||
height: 60px; padding: 0 24px 0 20px;
|
||||
margin-left: 12px;
|
||||
border-radius: var(--radius);
|
||||
background: var(--sage);
|
||||
color: var(--ink);
|
||||
font-size: 1.05rem;
|
||||
box-shadow: 0 10px 30px rgba(25, 66, 66, .12);
|
||||
transition: background .25s var(--ease);
|
||||
}
|
||||
.book-btn:hover { background: #c2dc8f; }
|
||||
.book-btn svg { width: 22px; height: 22px; }
|
||||
.burger {
|
||||
display: none;
|
||||
width: 60px; height: 60px;
|
||||
@@ -461,6 +476,27 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
.plate-panel { align-items: center; justify-content: center; }
|
||||
.plate-panel img { width: min(82%, 560px); filter: drop-shadow(0 34px 46px rgba(25, 66, 66, .25)); }
|
||||
|
||||
/* Buchungs-Fläche */
|
||||
.booking { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(28px, 4vw, 72px); align-items: end; }
|
||||
.book-links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
|
||||
.book-links a {
|
||||
display: flex; align-items: center; justify-content: space-between; gap: 16px;
|
||||
padding: 22px 26px;
|
||||
border-radius: 18px;
|
||||
background: var(--bg);
|
||||
font-size: clamp(1.15rem, 1.5vw, 1.35rem);
|
||||
transition: background .3s var(--ease), color .3s var(--ease);
|
||||
}
|
||||
.book-links a:hover { background: var(--ink); color: var(--bg); }
|
||||
.book-links svg { width: 22px; height: 22px; transition: transform .4s var(--ease); }
|
||||
.book-links a:hover svg { transform: translate(2px, -2px); }
|
||||
.book-links a:only-child { grid-column: 1 / -1; }
|
||||
|
||||
/* G&H-Zertifikat */
|
||||
.cert { display: block; width: clamp(150px, 13vw, 200px); height: auto; margin-top: 36px; }
|
||||
.quals-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
|
||||
.quals-head .cert { margin-top: 0; width: clamp(120px, 11vw, 170px); }
|
||||
|
||||
/* Kontakt */
|
||||
.contact-links { display: grid; gap: 12px; margin-top: 40px; max-width: 520px; }
|
||||
.contact-links a {
|
||||
@@ -472,6 +508,9 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
transition: background .3s var(--ease);
|
||||
}
|
||||
.contact-links a:hover { background: rgba(208, 230, 165, .18); }
|
||||
.contact-links a.contact-book { background: var(--sage); color: var(--ink); }
|
||||
.contact-links a.contact-book svg { color: var(--ink); }
|
||||
.contact-links a.contact-book:hover { background: #c2dc8f; }
|
||||
.contact-links svg { width: 28px; height: 28px; color: var(--sage); }
|
||||
.contact-links a > span:last-child { margin-left: auto; opacity: .5; }
|
||||
.contact-links a > span:last-child svg { width: 22px; height: 22px; color: currentColor; }
|
||||
@@ -488,6 +527,7 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
.footer-brand { display: flex; align-items: center; gap: 22px; }
|
||||
.footer-logo { width: 96px; height: 96px; border-radius: 50%; background: var(--bg); display: grid; place-items: center; flex: none; }
|
||||
.footer-logo img { width: 92%; }
|
||||
.footer-cert { width: auto; height: 84px; }
|
||||
.footer-links { display: flex; flex-wrap: wrap; gap: 8px 26px; }
|
||||
.footer-links a:hover { color: var(--bg); }
|
||||
.footer-meta { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .95rem; opacity: .75; }
|
||||
@@ -518,7 +558,9 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
}
|
||||
@media (max-width: 980px) {
|
||||
.nav { display: none; }
|
||||
.burger { display: grid; }
|
||||
.burger { display: grid; margin-left: 10px; }
|
||||
.book-btn { margin-left: auto; }
|
||||
.booking { grid-template-columns: 1fr; align-items: start; }
|
||||
.menu-open .nav {
|
||||
display: flex; flex-direction: column; gap: 4px;
|
||||
position: fixed; top: 88px; left: var(--pad); right: var(--pad);
|
||||
@@ -540,6 +582,9 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
body { font-size: 18px; }
|
||||
.header-inner { height: 76px; }
|
||||
.brand { width: 62px; height: 62px; }
|
||||
.book-btn { height: 54px; padding: 0 18px; font-size: 1rem; }
|
||||
.book-links { grid-template-columns: 1fr; }
|
||||
.footer-cert { height: 72px; }
|
||||
.brand img { width: 58px; height: 58px; }
|
||||
.burger { width: 54px; height: 54px; }
|
||||
.menu-open .nav { top: 76px; }
|
||||
@@ -567,6 +612,13 @@ a.panel:hover .panel-arrow svg { transform: rotate(-45deg); }
|
||||
.footer-brand { flex-direction: column; align-items: flex-start; }
|
||||
}
|
||||
|
||||
.book-short { display: none; }
|
||||
@media (max-width: 400px) {
|
||||
.book-btn { padding: 0 16px; gap: 8px; }
|
||||
.book-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
|
||||
.book-short { display: inline; }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
html { scroll-behavior: auto; }
|
||||
.tile, .seal, .seal-joint { animation: none; opacity: 1; }
|
||||
|
||||
Reference in new issue
Block a user