diff --git a/Dockerfile b/Dockerfile index 49d37d4..be5dd4d 100644 --- a/Dockerfile +++ b/Dockerfile @@ -2,4 +2,5 @@ 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 praxis-hero.png /usr/share/nginx/html/praxis-hero.png COPY favicon.svg /usr/share/nginx/html/favicon.svg diff --git a/impressum.html b/impressum.html index 441d58c..b18d119 100644 --- a/impressum.html +++ b/impressum.html @@ -262,6 +262,62 @@ @media (max-width: 540px) { section { padding: 52px 16px; } } + + /* ─── 2026 visual refresh ──────────────────────────────── */ + :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); + } + nav { max-width: 1180px; height: 82px; } + .nav-logo img { height: 48px; } + .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; } + .font-toggle-wrap button { border-color: var(--line); border-radius: 999px; } + .font-toggle-wrap button.active { background: var(--red-soft); } + 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::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; } + .legal-section p, .legal-section li { color: #53615d; line-height: 1.75; } + .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 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 (prefers-reduced-motion: reduce) { + html { scroll-behavior: auto; } + *, *::before, *::after { transition-duration: .01ms !important; } + } @@ -283,7 +339,8 @@ - 📞 +43 1 493 17 73 + + +43 1 493 17 73 diff --git a/index.html b/index.html index 65c420c..cf7f940 100644 --- a/index.html +++ b/index.html @@ -493,6 +493,259 @@ .leistungen-grid { grid-template-columns: 1fr; } section { padding: 52px 16px; } } + + /* ─── 2026 visual refresh ──────────────────────────────── */ + :root { + --ink: #20302c; + --muted: #66736f; + --sage: #e9f1ec; + --sage-mid: #a8c7b6; + --cream: #fbf8f3; + --red-soft: #f9e9ec; + --line: rgba(32, 48, 44, .11); + --shadow: 0 18px 50px rgba(35, 55, 48, .10); + --radius: 20px; + } + body { color: var(--ink); background: var(--cream); } + section { padding: 96px 24px; scroll-margin-top: 82px; } + section.alt { background: #f3f6f3; } + .section-inner, nav, .hero-inner, .hero-cards { max-width: 1180px; } + .section-title { + font-family: 'DM Sans', sans-serif; + color: var(--ink); + font-size: clamp(2rem, 4vw, 3.15rem); + font-weight: 600; + line-height: 1.12; + letter-spacing: -.035em; + 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; margin-bottom: 44px; } + + 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 { height: 82px; } + .nav-logo img { height: 48px; } + .nav-links { gap: 30px; } + .nav-links a { color: #41504c; font-size: 15px; font-weight: 600; } + .nav-phone { + border-radius: 999px; + padding: 11px 18px; + box-shadow: 0 8px 22px rgba(200, 16, 46, .20); + } + .nav-phone svg, .btn svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; } + .font-toggle-wrap button { border-color: var(--line); border-radius: 999px; } + .font-toggle-wrap button.active { background: var(--red-soft); } + + #hero { + padding: 30px 24px 0; + min-height: auto; + background: + radial-gradient(circle at 8% 10%, rgba(168, 199, 182, .22), transparent 28%), + var(--cream); + } + .hero-watermark { display: none; } + .hero-inner { + position: relative; + display: block; + min-height: 590px; + overflow: hidden; + border-radius: 30px; + background: #f4f1eb; + box-shadow: var(--shadow); + } + .hero-inner::after { + content: ''; + position: absolute; + inset: 0; + z-index: 1; + pointer-events: none; + background: linear-gradient(90deg, rgba(251,248,243,.99) 0%, rgba(251,248,243,.96) 33%, rgba(251,248,243,.58) 51%, rgba(251,248,243,0) 72%); + } + .hero-visual { position: absolute; inset: 0; margin: 0; } + .hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; } + .hero-text { + position: relative; + z-index: 2; + width: 55%; + padding: 84px 0 72px 64px; + animation: fadeUp .7s ease both; + } + .eyebrow { + display: inline-flex; + align-items: center; + gap: 9px; + color: var(--red); + font-size: 13px; + font-weight: 700; + letter-spacing: .11em; + text-transform: uppercase; + margin-bottom: 20px; + } + .eyebrow::before { content: ''; width: 26px; height: 2px; background: currentColor; } + .hero-text h1 { + max-width: 620px; + font-family: 'DM Sans', sans-serif; + font-size: clamp(2.8rem, 5.3vw, 4.35rem); + font-weight: 600; + line-height: 1.02; + letter-spacing: -.055em; + color: var(--ink); + margin-bottom: 24px; + } + .hero-text h1 span { color: var(--red); } + .hero-text p { max-width: 510px; color: #52615c; font-size: 18px; line-height: 1.65; margin-bottom: 32px; } + .btn { min-height: 52px; padding: 13px 22px; border-radius: 999px; } + .btn-primary { box-shadow: 0 10px 26px rgba(200,16,46,.20); } + .btn-outline { background: rgba(255,255,255,.72); border-color: rgba(200,16,46,.38); } + .hero-trust { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 30px; color: #4f605a; font-size: 14px; font-weight: 600; } + .hero-trust span { display: inline-flex; align-items: center; gap: 7px; } + .hero-trust svg { width: 18px; height: 18px; color: #668f79; fill: none; stroke: currentColor; stroke-width: 2; } + .hero-cards { + position: relative; + z-index: 3; + margin: -34px auto 0; + padding: 0 26px; + gap: 0; + border-radius: 20px; + background: #fff; + box-shadow: 0 16px 46px rgba(35,55,48,.12); + } + .hero-card { min-width: 0; padding: 24px 22px; background: #fff; border-radius: 0; border-right: 1px solid var(--line); } + .hero-card:last-child { border-right: 0; } + .hero-card-icon { + display: grid; + place-items: center; + width: 42px; + height: 42px; + border-radius: 13px; + background: var(--sage); + color: #527b65; + } + .hero-card-icon svg, .leistung-icon svg, .kontakt-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } + .hero-card-label { color: #87918e; font-size: 12px; letter-spacing: .08em; } + .hero-card-value { color: var(--ink); font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; } + + #oeffnungszeiten { padding-top: 110px; } + .hours-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 28px; align-items: stretch; } + .hours-grid { max-width: none; gap: 12px; } + .hour-card { + border: 1px solid var(--line); + border-left: 0; + border-radius: 14px; + box-shadow: none; + padding: 17px 20px; + } + .hour-card:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(35,55,48,.08); } + .hour-time { color: var(--red); } + .hours-note { padding: 34px; border-radius: var(--radius); background: var(--ink); color: #fff; } + .hours-note .eyebrow { color: #d9b6bc; margin-bottom: 16px; } + .hours-note h3 { font-size: 1.7rem; line-height: 1.2; letter-spacing: -.025em; margin-bottom: 16px; } + .hours-note p { color: #d9e0dd; font-size: 16px; margin-bottom: 26px; } + .hours-note .btn { background: #fff; color: var(--ink); } + + #schliesszeiten { background: var(--cream); } + #schliesszeiten .no-closures { border-color: var(--sage-mid); background: rgba(255,255,255,.62); } + .closure-card { border: 1px solid var(--line); border-top: 4px solid var(--red); box-shadow: 0 12px 34px rgba(35,55,48,.08); } + .closure-dates { font-family: 'DM Sans', sans-serif; color: var(--red); } + + .leistungen-grid { gap: 18px; } + .leistung-card { + position: relative; + overflow: hidden; + min-height: 225px; + padding: 30px; + border: 1px solid var(--line); + border-radius: var(--radius); + box-shadow: none; + } + .leistung-card::after { content: ''; position: absolute; right: -34px; bottom: -48px; width: 110px; height: 110px; border-radius: 50%; background: var(--sage); transition: transform .3s ease; } + .leistung-card:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(35,55,48,.10); } + .leistung-card:hover::after { transform: scale(1.22); } + .leistung-icon { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 22px; border-radius: 15px; background: var(--red-soft); color: var(--red); } + .leistung-title { position: relative; z-index: 1; color: var(--ink); font-size: 18px; } + .leistung-desc { position: relative; z-index: 1; color: var(--muted); font-size: 15px; } + + #aktuelles { background: var(--cream); } + .aktuelles-list { display: grid; grid-template-columns: repeat(3, 1fr); max-width: none; gap: 18px; } + .aktuell-item { padding: 30px; border: 1px solid var(--line); border-left: 1px solid var(--line); border-top: 4px solid var(--sage-mid); border-radius: var(--radius); box-shadow: none; background: #fff; } + .aktuell-title { color: var(--ink); font-size: 18px; margin-bottom: 14px; } + .aktuell-body { color: var(--muted); } + + .kontakt-inner { gap: 28px; align-items: stretch; } + .kontakt-rows { padding: 34px; gap: 0; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; } + .kontakt-row { padding: 19px 0; border-bottom: 1px solid var(--line); } + .kontakt-row:first-child { padding-top: 0; } + .kontakt-row:last-child { padding-bottom: 0; border-bottom: 0; } + .kontakt-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--sage); color: #527b65; } + .kontakt-label { color: #87918e; letter-spacing: .08em; } + .kontakt-value { color: var(--ink); } + .map-wrap { border-radius: var(--radius); box-shadow: 0 14px 36px rgba(35,55,48,.10); } + .map-wrap iframe { height: 100%; min-height: 410px; } + + footer { padding: 50px 24px; background: #21332e; color: #bfd0c8; } + footer img { height: 44px; filter: brightness(0) invert(1); opacity: .88; } + footer a { color: #eef4f1; } + + @media (max-width: 980px) { + .nav-links { gap: 18px; } + .hero-text { width: 63%; padding-left: 46px; } + .hero-inner::after { background: linear-gradient(90deg, rgba(251,248,243,.99) 0%, rgba(251,248,243,.93) 43%, rgba(251,248,243,.2) 75%); } + .aktuelles-list { grid-template-columns: 1fr; } + } + @media (max-width: 768px) { + section { padding: 72px 20px; } + nav { height: 72px; padding: 0 20px; } + .mobile-menu { padding: 20px; box-shadow: 0 18px 30px rgba(35,55,48,.10); } + #hero { padding: 18px 16px 0; } + .hero-inner { display: flex; flex-direction: column; min-height: 0; text-align: left; } + .hero-inner::after { display: none; } + .hero-text { order: 1; width: 100%; padding: 42px 28px 34px; } + .hero-text h1 { font-size: clamp(2.55rem, 12vw, 3.8rem); } + .hero-text p { margin: 0 0 28px; } + .hero-cta { justify-content: flex-start; } + .hero-visual { position: relative; order: 2; height: 330px; } + .hero-visual img { object-position: 65% center; } + .hero-cards { grid-template-columns: repeat(2, 1fr); margin: 18px auto 0; padding: 0; } + .hero-card:nth-child(2) { border-right: 0; } + .hero-card:nth-child(-n+2) { border-bottom: 1px solid var(--line); } + .hours-layout { grid-template-columns: 1fr; } + .hours-note { padding: 28px; } + .kontakt-inner { grid-template-columns: 1fr; } + } + @media (max-width: 540px) { + section { padding: 64px 16px; } + .nav-logo img { height: 42px; } + .hero-text { padding: 36px 22px 30px; } + .hero-cta { display: grid; } + .btn { justify-content: center; } + .hero-trust { gap: 12px; flex-direction: column; } + .hero-visual { height: 260px; } + .hero-cards { grid-template-columns: 1fr; } + .hero-card, .hero-card:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); } + .hero-card:last-child { border-bottom: 0; } + .hours-grid { grid-template-columns: 1fr; } + .leistungen-grid { grid-template-columns: 1fr; } + .kontakt-rows { padding: 26px; } + .map-wrap iframe { min-height: 330px; } + } + + @media (prefers-reduced-motion: reduce) { + html { scroll-behavior: auto; } + *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } + } @@ -539,7 +792,8 @@ const SCHLIESSZEITEN = [ - 📞 +43 1 493 17 73 + + +43 1 493 17 73 @@ -560,47 +814,49 @@ const SCHLIESSZEITEN = [
-
+
+ Stethoskop in einer hellen, freundlichen Ordination +
-

Ihre Ärztin für
Allgemeinmedizin
in Wien

-

Dr. med. Carina Kautsch – persönliche, umfassende medizinische Betreuung in 1160 Wien.

+
Allgemeinmedizin in 1160 Wien
+

Medizin, die sich Zeit für Sie nimmt.

+

Dr. med. Carina Kautsch und Ihr Team begleiten Sie persönlich, aufmerksam und umfassend – in jeder Lebensphase.

- 📞 Jetzt anrufen + Jetzt anrufen Öffnungszeiten
-
-
- meineOrdi +
+ Persönliche Betreuung + Kurze Wege +
-
📍
+
Adresse
Pfenninggeldgasse 1B/3
A-1160 Wien
-
📞
+
Telefon
+43 / 1 / 493 17 73
-
✉️
+
E-Mail
info@meineordi.at
-
🕐
+
Heute
–
@@ -614,7 +870,8 @@ const SCHLIESSZEITEN = [

Öffnungszeiten

Bitte vereinbaren Sie telefonisch einen Termin.

-
+
+
Montag 14:00 – 19:00 @@ -639,6 +896,13 @@ const SCHLIESSZEITEN = [ Sa / So geschlossen
+
+
@@ -659,32 +923,32 @@ const SCHLIESSZEITEN = [

Umfassende allgemeinmedizinische Versorgung für die ganze Familie.

-
🩺
+
Allgemeine Untersuchung
Vorsorgeuntersuchungen, Gesundencheck und allgemeine Diagnostik.
-
💊
+
Rezepte & Überweisungen
Ausstellung von Rezepten und Überweisungen.
-
🩸
+
Laboruntersuchungen
Blutabnahme und Befundbesprechung in der Ordination.
-
❤️
+
Chronische Erkrankungen
Langzeitbetreuung bei Diabetes, Bluthochdruck, Schilddrüsenerkrankungen u. v. m.
-
🌡️
+
Akutbehandlung
Behandlung akuter Erkrankungen und Verletzungen, Krankmeldungen.
-
💉
+
Impfungen
Reise- und Standardimpfungen nach aktuellem Impfplan.
@@ -732,28 +996,28 @@ const SCHLIESSZEITEN = [
-
📍
+
Adresse
Pfenninggeldgasse 1B/3
A-1160 Wien
-
📞
+
Telefon
+43 / 1 / 493 17 73
-
✉️
+
E-Mail
info@meineordi.at
-
👩‍⚕️
+
Ärztin
Dr. med. Carina Kautsch
Ärztin für Allgemeinmedizin
diff --git a/praxis-hero.png b/praxis-hero.png new file mode 100644 index 0000000..51dd2fb Binary files /dev/null and b/praxis-hero.png differ