348 lines
11 KiB
PHP
348 lines
11 KiB
PHP
<?php include 'header.php'; ?>
|
||
|
||
<style>
|
||
/* ─── Impressum Styles ─── */
|
||
.impressum {
|
||
padding: 3rem 1.5rem 4rem;
|
||
max-width: 900px;
|
||
margin: 0 auto;
|
||
animation: fadeInUp 0.6s ease both;
|
||
}
|
||
|
||
.impressum__hero {
|
||
text-align: center;
|
||
margin-bottom: 3rem;
|
||
}
|
||
|
||
.impressum__hero-icon {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 72px;
|
||
height: 72px;
|
||
border-radius: var(--radius-xl);
|
||
background: linear-gradient(135deg, var(--color-primary-soft), rgba(16, 185, 129, 0.08));
|
||
border: 1px solid var(--border-default);
|
||
margin-bottom: 1.25rem;
|
||
font-size: 2rem;
|
||
animation: float 6s ease-in-out infinite;
|
||
}
|
||
|
||
.impressum__hero h1 {
|
||
font-size: 2.2rem;
|
||
font-weight: 800;
|
||
background: linear-gradient(135deg, var(--text-primary), var(--color-primary));
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
|
||
.impressum__hero p {
|
||
color: var(--text-secondary);
|
||
font-size: 1rem;
|
||
max-width: 520px;
|
||
margin: 0 auto;
|
||
line-height: 1.7;
|
||
}
|
||
|
||
.impressum__grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 1.5rem;
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
|
||
.impressum__card {
|
||
background: var(--bg-card);
|
||
border: 1px solid var(--border-default);
|
||
border-radius: var(--radius-lg);
|
||
padding: 2rem;
|
||
transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-smooth);
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.impressum__card::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
height: 3px;
|
||
background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
|
||
opacity: 0;
|
||
transition: opacity var(--transition-normal);
|
||
}
|
||
|
||
.impressum__card:hover {
|
||
border-color: var(--border-glow);
|
||
box-shadow: var(--shadow-glow-blue);
|
||
transform: translateY(-3px);
|
||
}
|
||
|
||
.impressum__card:hover::before {
|
||
opacity: 1;
|
||
}
|
||
|
||
.impressum__card--full {
|
||
grid-column: 1 / -1;
|
||
}
|
||
|
||
.impressum__card-icon {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 44px;
|
||
height: 44px;
|
||
border-radius: var(--radius-md);
|
||
margin-bottom: 1rem;
|
||
font-size: 1.25rem;
|
||
}
|
||
|
||
.impressum__card-icon--blue {
|
||
background: var(--color-primary-soft);
|
||
border: 1px solid rgba(59, 130, 246, 0.15);
|
||
}
|
||
|
||
.impressum__card-icon--green {
|
||
background: var(--color-accent-soft);
|
||
border: 1px solid rgba(16, 185, 129, 0.15);
|
||
}
|
||
|
||
.impressum__card-icon--orange {
|
||
background: rgba(245, 158, 11, 0.1);
|
||
border: 1px solid rgba(245, 158, 11, 0.15);
|
||
}
|
||
|
||
.impressum__card-icon--purple {
|
||
background: rgba(139, 92, 246, 0.1);
|
||
border: 1px solid rgba(139, 92, 246, 0.15);
|
||
}
|
||
|
||
.impressum__card-icon--red {
|
||
background: var(--color-danger-soft);
|
||
border: 1px solid rgba(239, 68, 68, 0.15);
|
||
}
|
||
|
||
.impressum__card h2 {
|
||
font-size: 1.15rem;
|
||
font-weight: 700;
|
||
color: var(--text-primary);
|
||
margin-bottom: 0.85rem;
|
||
}
|
||
|
||
.impressum__card p,
|
||
.impressum__card li {
|
||
color: var(--text-secondary);
|
||
font-size: 0.92rem;
|
||
line-height: 1.75;
|
||
}
|
||
|
||
.impressum__card ul {
|
||
list-style: none;
|
||
padding: 0;
|
||
}
|
||
|
||
.impressum__card ul li {
|
||
padding: 0.3rem 0;
|
||
padding-left: 1.2rem;
|
||
position: relative;
|
||
}
|
||
|
||
.impressum__card ul li::before {
|
||
content: "›";
|
||
position: absolute;
|
||
left: 0;
|
||
color: var(--color-primary);
|
||
font-weight: 700;
|
||
}
|
||
|
||
.impressum__label {
|
||
display: block;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.08em;
|
||
color: var(--text-muted);
|
||
margin-bottom: 0.25rem;
|
||
}
|
||
|
||
.impressum__value {
|
||
color: var(--text-primary) !important;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.impressum__divider {
|
||
border: none;
|
||
height: 1px;
|
||
background: var(--border-default);
|
||
margin: 1rem 0;
|
||
}
|
||
|
||
.impressum__footer-note {
|
||
text-align: center;
|
||
margin-top: 2.5rem;
|
||
padding: 1.5rem;
|
||
border-radius: var(--radius-lg);
|
||
background: var(--bg-surface);
|
||
border: 1px solid var(--border-subtle);
|
||
}
|
||
|
||
.impressum__footer-note p {
|
||
color: var(--text-muted);
|
||
font-size: 0.82rem;
|
||
line-height: 1.7;
|
||
}
|
||
|
||
/* ─── Responsive ─── */
|
||
@media (max-width: 700px) {
|
||
.impressum__grid {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
|
||
.impressum__hero h1 {
|
||
font-size: 1.7rem;
|
||
}
|
||
|
||
.impressum {
|
||
padding: 2rem 1rem 3rem;
|
||
}
|
||
|
||
.impressum__card {
|
||
padding: 1.5rem;
|
||
}
|
||
|
||
.impressum__card--full div[style*="grid-template-columns"] {
|
||
grid-template-columns: 1fr !important;
|
||
}
|
||
}
|
||
</style>
|
||
|
||
<main class="impressum">
|
||
|
||
<!-- ═══ Hero ═══ -->
|
||
<div class="impressum__hero">
|
||
<div class="impressum__hero-icon">⚖️</div>
|
||
<h1>Impressum</h1>
|
||
<p>Angaben gemäß § 5 TMG und § 25 MedienG – Informationen über die Betreiber dieser Website.</p>
|
||
</div>
|
||
|
||
<!-- ═══ Karten-Grid ═══ -->
|
||
<div class="impressum__grid">
|
||
<!-- Karte 1 – Website-Inhaber (volle Breite) -->
|
||
<div class="impressum__card impressum__card--full">
|
||
<div class="impressum__card-icon impressum__card-icon--green">🌐</div>
|
||
<h2>Website-Inhaber</h2>
|
||
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;">
|
||
<ul>
|
||
<li>
|
||
<span class="impressum__label">Name</span>
|
||
<span class="impressum__value">Fabian Schieder</span>
|
||
</li>
|
||
<li>
|
||
<span class="impressum__label">Rolle</span>
|
||
Website-Inhaber & Server-Betreiber
|
||
</li>
|
||
<li>
|
||
<span class="impressum__label">Kontakt</span>
|
||
fabian@geizkragen.store
|
||
</li>
|
||
</ul>
|
||
<ul>
|
||
<li>
|
||
<span class="impressum__label">Name</span>
|
||
<span class="impressum__value">Paul Eisenbock</span>
|
||
</li>
|
||
<li>
|
||
<span class="impressum__label">Rolle</span>
|
||
Website-Inhaber
|
||
</li>
|
||
<li>
|
||
<span class="impressum__label">Kontakt</span>
|
||
paul@geizkragen.store
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Karte 2 – Server-Betreiber -->
|
||
<div class="impressum__card impressum__card--full">
|
||
<div class="impressum__card-icon impressum__card-icon--blue">🖥️</div>
|
||
<h2>Server-Betreiber</h2>
|
||
<ul>
|
||
<li>
|
||
<span class="impressum__label">Verantwortlich</span>
|
||
<span class="impressum__value">Fabian Schieder</span>
|
||
</li>
|
||
<li>
|
||
<span class="impressum__label">Aufgaben</span>
|
||
Technische Bereitstellung, Hosting, Serverbetrieb & Wartung
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- Karte 3 – Projektinfo (volle Breite) -->
|
||
<div class="impressum__card impressum__card--full">
|
||
<div class="impressum__card-icon impressum__card-icon--purple">🚀</div>
|
||
<h2>Über das Projekt</h2>
|
||
<p>
|
||
<strong>Geizkragen</strong> ist eine Preisvergleichsplattform, die es Nutzern ermöglicht, die besten
|
||
Angebote verschiedener Online-Shops auf einen Blick zu vergleichen. Das Projekt wird als Schulprojekt
|
||
von Fabian Schieder und Paul Eisenbock entwickelt und betrieben.
|
||
</p>
|
||
</div>
|
||
|
||
<!-- Karte 4 – Haftungsausschluss -->
|
||
<div class="impressum__card">
|
||
<div class="impressum__card-icon impressum__card-icon--orange">⚠️</div>
|
||
<h2>Haftungsausschluss</h2>
|
||
<p>
|
||
Die Inhalte dieser Website werden mit größtmöglicher Sorgfalt erstellt. Der Anbieter übernimmt jedoch
|
||
keine Gewähr für die Richtigkeit, Vollständigkeit und Aktualität der bereitgestellten Inhalte.
|
||
</p>
|
||
<hr class="impressum__divider">
|
||
<p>
|
||
Trotz sorgfältiger inhaltlicher Kontrolle übernehmen wir keine Haftung für die Inhalte externer Links.
|
||
Für den Inhalt verlinkter Seiten sind ausschließlich deren Betreiber verantwortlich.
|
||
</p>
|
||
</div>
|
||
|
||
<!-- Karte 5 – Urheberrecht -->
|
||
<div class="impressum__card">
|
||
<div class="impressum__card-icon impressum__card-icon--red">©</div>
|
||
<h2>Urheberrecht</h2>
|
||
<p>
|
||
Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem
|
||
österreichischen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der
|
||
Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des
|
||
jeweiligen Autors bzw. Erstellers.
|
||
</p>
|
||
</div>
|
||
|
||
<!-- Karte 6 – Datenschutz (volle Breite) -->
|
||
<div class="impressum__card impressum__card--full">
|
||
<div class="impressum__card-icon impressum__card-icon--blue">🔒</div>
|
||
<h2>Datenschutzhinweis</h2>
|
||
<p>
|
||
Die Nutzung unserer Website ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf
|
||
unseren Seiten personenbezogene Daten (z. B. Name, E-Mail-Adresse) erhoben werden, erfolgt dies
|
||
stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte
|
||
weitergegeben. Wir weisen darauf hin, dass die Datenübertragung im Internet (z. B. bei der
|
||
Kommunikation per E-Mail) Sicherheitslücken aufweisen kann.
|
||
</p>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- ═══ Footer-Note ═══ -->
|
||
<div class="impressum__footer-note">
|
||
<p>
|
||
Stand: <?= date('F Y') ?> · Dieses Impressum wurde nach bestem Wissen und Gewissen erstellt.<br>
|
||
Bei Fragen wenden Sie sich bitte an die oben genannten Ansprechpartner.
|
||
</p>
|
||
</div>
|
||
|
||
</main>
|
||
|
||
<?php include 'footer.php'; ?>
|