diff --git a/Dockerfile b/Dockerfile index be5dd4d..4d610ea 100644 --- a/Dockerfile +++ b/Dockerfile @@ -2,5 +2,8 @@ FROM nginx:alpine COPY index.html /usr/share/nginx/html/index.html COPY impressum.html /usr/share/nginx/html/impressum.html COPY logo.png /usr/share/nginx/html/logo.png +COPY meineordi.png /usr/share/nginx/html/meineordi.png COPY praxis-hero.png /usr/share/nginx/html/praxis-hero.png +COPY praxis-hero.webp praxis-hero-960.webp /usr/share/nginx/html/ +COPY erster-besuch-abstrakt.webp /usr/share/nginx/html/erster-besuch-abstrakt.webp COPY favicon.svg /usr/share/nginx/html/favicon.svg diff --git a/erster-besuch-abstrakt-prompt.txt b/erster-besuch-abstrakt-prompt.txt new file mode 100644 index 0000000..e44cef9 --- /dev/null +++ b/erster-besuch-abstrakt-prompt.txt @@ -0,0 +1,5 @@ +Tool: built-in image_gen. +Original: erster-besuch-abstrakt.png +Web asset: erster-besuch-abstrakt.webp + +Use case: stylized-concept. Asset type: abstract welcoming section image for 'Ihr erster Besuch' on a family medicine website. Primary request: a friendly, calming abstract composition suggesting openness, welcome and human connection, with no literal place. Style: sophisticated tactile paper sculpture with softly curved overlapping organic shapes and gentle flowing arcs, subtle fine paper grain and soft dimensional shadows. Color palette: warm ivory and cream, muted sage green and dusty teal, with one very small muted burgundy accent, harmonious and restrained. Lighting/mood: soft diffuse daylight, warm, approachable, reassuring. Composition: landscape 3:2, balanced spacious arrangement, softly rounded forms and clean generous margins, beautiful beside website text, no text baked into image. Constraints: entirely abstract; no rooms, no buildings, no doors, no furniture, no medical practice interiors, no people, no body parts, no medical equipment, no lettering, no symbols resembling a logo, no watermark. diff --git a/erster-besuch-abstrakt.png b/erster-besuch-abstrakt.png new file mode 100644 index 0000000..b044efb Binary files /dev/null and b/erster-besuch-abstrakt.png differ diff --git a/erster-besuch-abstrakt.webp b/erster-besuch-abstrakt.webp new file mode 100644 index 0000000..28b47aa Binary files /dev/null and b/erster-besuch-abstrakt.webp differ diff --git a/impressum.html b/impressum.html index b18d119..09a5b7b 100644 --- a/impressum.html +++ b/impressum.html @@ -27,141 +27,40 @@ /* ─── Reset & Base ─────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; } - body { - font-family: 'DM Sans', sans-serif; - font-size: 18px; - color: #222; - background: #fff; - line-height: 1.6; - } + body { font-family: 'DM Sans', sans-serif; font-size: 18px; line-height: 1.6; } a { color: inherit; text-decoration: none; } img { display: block; max-width: 100%; } /* ─── Variables ─────────────────────────────────────────── */ - :root { - --red: #C8102E; - --red-dk: #a00d24; - --bg-alt: #f7f7f7; - --shadow: 0 6px 28px rgba(0,0,0,.14); - --radius: 12px; - } + :root { --red: #C8102E; --red-dk: #a00d24; --bg-alt: #f7f7f7; --shadow: 0 6px 28px rgba(0,0,0,.14); } /* ─── Header / Nav ──────────────────────────────────────── */ - header { - position: sticky; - top: 0; - z-index: 100; - background: #fff; - border-bottom: 1px solid #eee; - box-shadow: 0 2px 12px rgba(0,0,0,.07); - } - nav { - max-width: 1100px; - margin: 0 auto; - padding: 0 24px; - height: 68px; - display: flex; - align-items: center; - justify-content: space-between; - gap: 16px; - } - .nav-logo img { height: 42px; width: auto; } - .nav-links { - display: flex; - align-items: center; - gap: 28px; - list-style: none; - } - .nav-links a { - font-size: 15px; - font-weight: 500; - color: #444; - transition: color .2s; - } + header { position: sticky; top: 0; z-index: 100; } + nav { margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; } + .nav-logo img { width: auto; } + .nav-links { display: flex; align-items: center; gap: 28px; list-style: none; } + .nav-links a { font-size: 15px; transition: color .2s; } .nav-links a:hover { color: var(--red); } - .nav-phone { - display: inline-flex; - align-items: center; - gap: 8px; - background: var(--red); - color: #fff; - font-weight: 600; - font-size: 15px; - padding: 9px 18px; - border-radius: 8px; - white-space: nowrap; - transition: background .2s; - } + .nav-phone { display: inline-flex; align-items: center; gap: 8px; background: var(--red); color: #fff; font-weight: 600; font-size: 15px; white-space: nowrap; transition: background .2s; } .nav-phone:hover { background: var(--red-dk); } /* Hamburger */ - .hamburger { - display: none; - flex-direction: column; - gap: 5px; - cursor: pointer; - background: none; - border: none; - padding: 4px; - } - .hamburger span { - display: block; - width: 26px; - height: 2px; - background: #333; - border-radius: 2px; - transition: all .3s; - } + .hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 4px; } + .hamburger span { display: block; width: 26px; height: 2px; background: #333; border-radius: 2px; transition: all .3s; } .hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); } .hamburger.open span:nth-child(2) { opacity: 0; } .hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); } - .mobile-menu { - display: none; - flex-direction: column; - background: #fff; - border-top: 1px solid #eee; - padding: 16px 24px 20px; - gap: 16px; - } + .mobile-menu { display: none; flex-direction: column; background: #fff; border-top: 1px solid #eee; padding: 16px 24px 20px; gap: 16px; } .mobile-menu.open { display: flex; } - .mobile-menu a { - font-size: 17px; - font-weight: 500; - color: #333; - padding: 6px 0; - border-bottom: 1px solid #f0f0f0; - } + .mobile-menu a { font-size: 17px; font-weight: 500; color: #333; padding: 6px 0; border-bottom: 1px solid #f0f0f0; } .mobile-menu a:last-child { border-bottom: none; } - .mobile-menu .nav-phone { - margin-top: 4px; - justify-content: center; - } + .mobile-menu .nav-phone { color: #fff; padding: 11px 18px; margin-top: 4px; justify-content: center; } /* ─── Font Size Toggle ──────────────────────────────────── */ - .font-toggle-wrap { - display: flex; - align-items: center; - gap: 4px; - flex-shrink: 0; - } - .font-toggle-wrap button { - background: none; - border: 2px solid #ddd; - border-radius: 7px; - cursor: pointer; - font-family: 'DM Sans', sans-serif; - font-weight: 700; - color: #666; - line-height: 1; - transition: all .2s; - padding: 5px 9px; - } - .font-toggle-wrap button.active { - border-color: var(--red); - color: var(--red); - background: #fff0f2; - } + .font-toggle-wrap { display: flex; align-items: center; gap: 4px; flex-shrink: 0; } + .font-toggle-wrap button { background: none; border: 2px solid #ddd; cursor: pointer; font-family: 'DM Sans', sans-serif; font-weight: 700; color: #666; line-height: 1; transition: all .2s; padding: 5px 9px; } + .font-toggle-wrap button.active { border-color: var(--red); color: var(--red); } .font-toggle-wrap button:first-child { font-size: 14px; } .font-toggle-wrap button:last-child { font-size: 18px; } @@ -171,92 +70,37 @@ body.large-font .nav-phone { font-size: 17px; } /* ─── Section Helpers ───────────────────────────────────── */ - section { padding: 72px 24px; } - section.alt { background: var(--bg-alt); } - .section-inner { - max-width: 1100px; - margin: 0 auto; - } - .section-title { - font-family: 'Cormorant Garamond', serif; - font-size: clamp(2rem, 4vw, 2.8rem); - font-weight: 700; - color: var(--red); - margin-bottom: 10px; - } - .section-sub { - font-size: 16px; - color: #666; - margin-bottom: 40px; - } + + + .section-inner { margin: 0 auto; } + + .section-sub { margin-bottom: 40px; } /* ─── Impressum / Datenschutz ──────────────────────────── */ - .legal-section h3 { - font-family: 'Cormorant Garamond', serif; - font-size: 1.4rem; - font-weight: 700; - color: var(--red); - margin: 32px 0 10px; - } + .legal-section h3 { font-weight: 700; margin: 32px 0 10px; } .legal-section h3:first-of-type { margin-top: 0; } - .legal-section p, .legal-section li { - font-size: 16px; - color: #444; - line-height: 1.7; - margin-bottom: 8px; - } - .legal-section ul { - padding-left: 20px; - margin-bottom: 12px; - } + .legal-section p, .legal-section li { font-size: 16px; margin-bottom: 8px; } + .legal-section ul { padding-left: 20px; margin-bottom: 12px; } .legal-section a { color: var(--red); text-decoration: underline; } - .legal-section .legal-box { - background: #fff; - border-radius: var(--radius); - border-left: 4px solid var(--red); - padding: 20px 24px; - margin-top: 8px; - } + .legal-section .legal-box { background: #fff; margin-top: 8px; } body.large-font .legal-section p, body.large-font .legal-section li { font-size: 18px; } /* ─── Back link ─────────────────────────────────────────── */ - .back-link { - display: inline-flex; - align-items: center; - gap: 6px; - color: var(--red); - font-weight: 600; - font-size: 15px; - margin-bottom: 32px; - text-decoration: none; - transition: color .2s; - } + .back-link { display: inline-flex; align-items: center; gap: 6px; color: var(--red); font-weight: 600; font-size: 15px; text-decoration: none; transition: color .2s; } .back-link:hover { color: var(--red-dk); } /* ─── Footer ────────────────────────────────────────────── */ - footer { - background: #1a1a1a; - color: #aaa; - padding: 36px 24px; - text-align: center; - } - .footer-inner { - max-width: 1100px; - margin: 0 auto; - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - } - footer img { height: 38px; filter: brightness(0) invert(1); opacity: .7; } + footer { text-align: center; } + .footer-inner { max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 16px; } + footer p { font-size: 14px; } - footer a { color: #ccc; } + footer a:hover { color: #fff; } /* ─── Responsive ────────────────────────────────────────── */ @media (max-width: 768px) { - .nav-links, .nav-phone { display: none; } + .nav-links, nav > .nav-phone { display: none; } .hamburger { display: flex; } } @media (max-width: 540px) { @@ -264,24 +108,11 @@ } /* ─── 2026 visual refresh ──────────────────────────────── */ - :root { - --ink: #20302c; - --muted: #66736f; - --sage: #e9f1ec; - --cream: #fbf8f3; - --red-soft: #f9e9ec; - --line: rgba(32, 48, 44, .11); - --radius: 20px; - } + :root { --ink: #20302c; --muted: #66736f; --sage: #e9f1ec; --cream: #fbf8f3; --red-soft: #f9e9ec; --line: rgba(32, 48, 44, .11); --radius: 20px; } body { color: var(--ink); background: var(--cream); } - header { - background: rgba(255,255,255,.94); - border-bottom: 1px solid rgba(32,48,44,.08); - box-shadow: 0 8px 30px rgba(35,55,48,.06); - backdrop-filter: blur(16px); - } + header { background: rgba(255,255,255,.94); border-bottom: 1px solid rgba(32,48,44,.08); box-shadow: 0 8px 30px rgba(35,55,48,.06); backdrop-filter: blur(16px); } nav { max-width: 1180px; height: 82px; } - .nav-logo img { height: 48px; } + .nav-logo img { height: 64px; } .nav-links a { color: #41504c; font-weight: 600; } .nav-phone { border-radius: 999px; padding: 11px 18px; box-shadow: 0 8px 22px rgba(200,16,46,.20); } .nav-phone svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; } @@ -290,15 +121,7 @@ section { padding: 90px 24px; scroll-margin-top: 82px; } section.alt { background: #f3f6f3; } .section-inner { max-width: 920px; } - .section-title { - font-family: 'DM Sans', sans-serif; - color: var(--ink); - font-size: clamp(2.2rem, 5vw, 3.3rem); - font-weight: 600; - line-height: 1.1; - letter-spacing: -.04em; - margin-bottom: 12px; - } + .section-title { font-family: 'DM Sans', sans-serif; color: var(--ink); font-size: clamp(2.2rem, 5vw, 3.3rem); font-weight: 600; line-height: 1.1; letter-spacing: -.04em; margin-bottom: 12px; } .section-title::before { content: ''; display: block; width: 42px; height: 4px; margin-bottom: 20px; border-radius: 999px; background: var(--red); } .section-sub { color: var(--muted); font-size: 17px; } .legal-section h3 { font-family: 'DM Sans', sans-serif; color: var(--ink); font-size: 1.25rem; letter-spacing: -.015em; margin-top: 42px; } @@ -306,27 +129,43 @@ .legal-section .legal-box { padding: 26px 28px; border: 1px solid var(--line); border-left: 4px solid var(--red); border-radius: var(--radius); box-shadow: 0 12px 32px rgba(35,55,48,.07); } .back-link { padding: 8px 14px; margin-bottom: 38px; border-radius: 999px; background: var(--red-soft); } footer { padding: 50px 24px; background: #21332e; color: #bfd0c8; } - footer img { height: 44px; opacity: .88; } + footer img { display: block; box-sizing: content-box; height: 60px; width: auto; padding: 12px 18px; border-radius: 12px; background: #fff; filter: none; opacity: 1; } footer a { color: #eef4f1; } @media (max-width: 768px) { nav { height: 72px; padding: 0 20px; } .mobile-menu { padding: 20px; box-shadow: 0 18px 30px rgba(35,55,48,.10); } section { padding: 70px 20px; } } - @media (max-width: 540px) { section { padding: 60px 16px; } } + @media (max-width: 540px) { + section { padding: 60px 16px; } + .nav-logo img { height: 56px; } + } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; } } + + /* Keyboard navigation and patient information */ + :focus-visible { outline: 3px solid #C8102E; outline-offset: 4px; } + .skip-link { position: fixed; top: 8px; left: 16px; z-index: 200; padding: 12px 18px; background: #fff; color: #20302c; border-radius: 8px; transform: translateY(-160%); } + .skip-link:focus { transform: translateY(0); } + .hamburger { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; } + .font-toggle-wrap button { min-width: 44px; min-height: 44px; } + .hero-card-value a { text-decoration: none; } + .hero-card-value a:hover { color: var(--red); } + .first-visit { max-width: 780px; } + .first-visit p { margin-bottom: 16px; } + .first-visit a { text-decoration: underline; text-underline-offset: 3px; } +
@@ -353,17 +192,18 @@ Kontakt +43 1 493 17 73
- - + +
+
← Zurück zur Startseite -

Impressum

+

Impressum

Angaben gemäß §5 ECG und §25 MedienG

Diensteanbieter

@@ -545,9 +385,10 @@
+