diff --git a/vorschau/css/style.css b/vorschau/css/style.css index 8119a15..ba97104 100644 --- a/vorschau/css/style.css +++ b/vorschau/css/style.css @@ -70,9 +70,9 @@ a { color:inherit; text-decoration:none; } .hero-content { position:relative; z-index:2; max-width:700px; padding:80px 24px; color:var(--white); } .hero-title { font-size:3.4rem; font-weight:700; line-height:1.1; margin-bottom:20px; letter-spacing:-0.02em; color:var(--white); } -.hero-claim { font-size:1.45rem; font-weight:300; line-height:1.5; margin-bottom:16px; color:rgba(255,255,255,0.9); } +.hero-claim { font-size:1.45rem; font-weight:300; line-height:1.5; margin-bottom:24px; color:rgba(255,255,255,0.9); } .gold { color:var(--gold); font-weight:600; } -.hero-sub { font-size:1.05rem; color:rgba(255,255,255,0.65); line-height:1.7; margin-bottom:36px; } +.hero-sub { font-size:0.95rem; color:rgba(255,255,255,0.55); line-height:1.7; margin-bottom:36px; } .hero-cta { display:flex; gap:16px; flex-wrap:wrap; } /* ==================== BUTTONS ==================== */ @@ -100,10 +100,12 @@ a { color:inherit; text-decoration:none; } .divider { line-height:0; margin:0; overflow:hidden; } .divider svg { display:block; width:100%; height:auto; } .divider-chevron { background:var(--alt-solid); } +.divider-chevron-dark { background:var(--navy); } .divider-diagonal { background:var(--base); } .divider-diagonal-dark { background:var(--base); } .divider-gradient-alt-to-base { height:40px; background:linear-gradient(to bottom, var(--alt-solid), var(--base)); } .divider-gradient-dark-to-base { height:80px; background:linear-gradient(to bottom, var(--navy), var(--base)); } +.divider-gradient-dark-to-alt { height:60px; background:linear-gradient(to bottom, var(--navy), var(--alt-solid)); } /* ==================== GRID ==================== */ .grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; } @@ -115,6 +117,13 @@ a { color:inherit; text-decoration:none; } .problem-card h3 { font-size:1.1rem; font-weight:700; color:var(--navy); margin-bottom:10px; } .problem-card p { font-size:0.93rem; color:var(--text-light); line-height:1.6; } +/* Problem dark variant */ +.problem-card-dark { color:var(--white); } +.problem-card-dark h3 { color:var(--white); } +.problem-card-dark p { color:rgba(255,255,255,0.7); } +.problem-icon-dark { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.1); box-shadow:none; } +.problem-icon-dark img { filter:brightness(0) invert(1); } + /* ==================== WORKFLOW ==================== */ .workflow { display:flex; align-items:flex-start; justify-content:center; margin-top:56px; } .workflow-step { flex:1; max-width:300px; text-align:center; padding:0 24px; } @@ -141,6 +150,13 @@ a { color:inherit; text-decoration:none; } .live-stat-value { display:block; font-size:2.4rem; font-weight:700; color:var(--navy); line-height:1.1; letter-spacing:-0.02em; } .live-stat-label { display:block; font-size:0.8rem; color:var(--text-light); text-transform:uppercase; letter-spacing:0.08em; margin-top:4px; } +/* ==================== FEATURE HIGHLIGHT ==================== */ +.feature-highlight { display:flex; align-items:center; gap:28px; background:var(--white); border-radius:var(--radius-lg); padding:32px 36px; margin-bottom:32px; box-shadow:var(--shadow-lg); border-left:4px solid var(--gold); } +.feature-highlight-icon { width:64px; height:64px; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:rgba(200,168,81,0.1); border-radius:var(--radius); } +.feature-highlight-content h3 { font-size:1.2rem; font-weight:700; color:var(--navy); margin-bottom:8px; } +.feature-highlight-content p { font-size:0.95rem; color:var(--text-light); line-height:1.6; } +@media(max-width:768px) { .feature-highlight { flex-direction:column; text-align:center; padding:24px 20px; } .feature-highlight-icon { margin:0 auto; } } + /* ==================== 3D CAROUSEL ==================== */ .carousel-viewport { overflow-x:clip; overflow-y:visible; padding:20px 0; position:relative; } .carousel-track { display:flex; justify-content:center; position:relative; } diff --git a/vorschau/index.html b/vorschau/index.html index 2a4b996..ad43176 100644 --- a/vorschau/index.html +++ b/vorschau/index.html @@ -102,10 +102,43 @@ -
Hunderte Quellen in dutzenden Sprachen. Kein Analyst überblickt alles gleichzeitig.
+Neue Meldungen im Minutentakt. Manuelle Auswertung kostet Zeit, die Sie nicht haben.
+Kritische Informationen gehen in der Masse unter, Zusammenhänge bleiben unsichtbar.
+