PageSourceSearch

https://retroshine.eu/index.html

html retroshine.eu collected 2026-10-02 11:19:02 UTC 33,927 bytes, 1,002 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <link rel="canonical" href="https://retroshine.eu/">
5    <link rel="alternate" hreflang="en" href="https://retroshine.eu/">
6    <link rel="alternate" hreflang="da" href="https://retroshine.eu/da/">
7    <link rel="alternate" hreflang="de" href="https://retroshine.eu/de/">
8    <link rel="alternate" hreflang="es" href="https://retroshine.eu/es/">
9    <link rel="alternate" hreflang="fi" href="https://retroshine.eu/fi/">
10    <link rel="alternate" hreflang="fr" href="https://retroshine.eu/fr/">
11    <link rel="alternate" hreflang="it" href="https://retroshine.eu/it/">
12    <link rel="alternate" hreflang="nl" href="https://retroshine.eu/nl/">
13    <link rel="alternate" hreflang="pl" href="https://retroshine.eu/pl/">
14    <link rel="alternate" hreflang="pt" href="https://retroshine.eu/pt/">
15    <link rel="alternate" hreflang="ro" href="https://retroshine.eu/ro/">
16    <link rel="alternate" hreflang="sv" href="https://retroshine.eu/sv/">
17    <link rel="alternate" hreflang="uk" href="https://retroshine.eu/uk/">
18    <link rel="alternate" hreflang="cs" href="https://retroshine.eu/cs/">
19    <link rel="alternate" hreflang="el" href="https://retroshine.eu/el/">
20    <link rel="alternate" hreflang="hu" href="https://retroshine.eu/hu/">
21    <link rel="icon" type="image/x-icon" href="/favicon.ico">
22    <link rel="icon" href="/images/icon16.png" sizes="16x16" type="image/png">
23    <link rel="icon" href="/images/icon32.png" sizes="32x32" type="image/png">
24    <link rel="icon" href="/images/icon48.png" sizes="48x48" type="image/png">
25    <link rel="apple-touch-icon" sizes="180x180" href="/images/icon180.png">
26    <meta charset="UTF-8">
27    <meta name="viewport" content="width=device-width, initial-scale=1.0">
28    <meta name="description" content="Transform faded scanned photos instantly with our free image-processing tool. Automated color correction and batch processing included!">
29    <title>RetroShine - Bring Your Old Photos to Life</title>
30    
30<script type="application/ld+json">
31    {
32        "@context": "https://schema.org",
33        "@type": "SoftwareApplication",
34        "name": "RetroShine",
35        "description": "Photo enhancement software that automatically corrects color, contrast, and exposure in scanned analog photographs and digitized film slides. Features batch processing, AI-powered curve adjustment, and manual control.",
36        "operatingSystem": ["Windows", "Linux", "macOS"],
37        "applicationCategory": "MultimediaApplication",
38        "applicationSubCategory": "Photo Enhancement Software",
39        "downloadUrl": "https://retroshine.eu/download.html",
40        "url": "https://retroshine.eu",
41        "softwareVersion": "1.2.3",
42        "datePublished": "2025-05-17",
43        "dateModified": "2025-12-19",
44        "featureList": [
45            "Automatic curve adjustment based on image content",
46            "Manual Control: Advanced tools for perfect results",
47            "Batch processing: Process entire folders of images",
48            "Full Quality:  <!-- delimit msgid -->Preserves original resolution and EXIF metadata",
49            "Simple Interface: No editing experience needed"
50        ],
51        "author": {
52            "@type": "Organization",
53            "name": "RetroShine Team"
54        },
55        "image": "https://retroshine.eu/images/retroshine-logo-25A.webp"
56    }
57    </script>
57
58    <style>
59        /* Base styles */
60        :root {
61            --primary: #1661b9;
62            --gold: #b99616;
63            --black: #000000;
64            --white: #ffffff;
65            --gray: #aaaaaa;
66            --light-gray: #f5f5f5;
67        }
68
69        * {
70            margin: 0;
71            padding: 0;
72            box-sizing: border-box;
73        }
74
75        body {
76            font-family: 'Inter', 'Helvetica Neue', sans-serif;
77            color: var(--black);
78            line-height: 1.6;
79        }
80
81        h1, h2, h3, h4 {
82            font-weight: 700;
83            line-height: 1.3;
84        }
85
86        h1 {
87            font-size: 2.75rem;
88            margin-bottom: 1.5rem;
89        }
90
91        h2 {
92            font-size: 2.25rem;
93            margin-bottom: 1rem;
94            color: var(--primary);
95        }
96
97        h3 {
98            font-size: 1.5rem;
99            margin-bottom: 1rem;
100        }
101
102        p {
103            margin-bottom: 1rem;
104            font-size: 1.1rem;
105        }
106
107        .container {
108            width: 100%;
109            max-width: 1200px;
110            margin: 0 auto;
111            padding: 0 2rem;
112        }
113
114        .btn {
115            display: inline-block;
116            padding: 0.8rem 1.8rem;
117            border-radius: 5px;
118            font-weight: 600;
119            font-size: 1rem;
120            cursor: pointer;
121            text-decoration: none;
122            transition: all 0.3s ease;
123            margin-right: 1rem;
124            margin-bottom: 1rem;
125        }
126
127        .btn-primary {
128            background-color: var(--primary);
129            color: var(--white);
130            border: none;
131        }
132
133        .btn-primary:hover {
134            background-color: #0d4b94;
135        }
136
137        .btn-outline {
138            background-color: transparent;
139            color: var(--primary);
140            border: 2px solid var(--primary);
141        }
142
143        .btn-outline:hover {
144            background-color: var(--primary);
145            color: var(--white);
146        }
147
148        /* Header */
149        header {
150            background-color: var(--white);
151            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
152            position: fixed;
153            width: 100%;
154            top: 0;
155            z-index: 100;
156        }
157
158        .header-content {
159            display: flex;
160            justify-content: space-between;
161            align-items: center;
162            padding: 1rem 0;
163        }
164
165        .logo {
166            display: flex;
167            align-items: center;
168        }
169
170        .logo img {
171            height: 40px;
172        }
173
174        .logo-text {
175            margin: 0;
176            margin-left: 0.5rem;
177            color: var(--primary);
178            font-size: 1.5rem;
179            font-weight: 700;
180            line-height: 1.3;
181        }
182
183        .logo span {
184            color: var(--gold);
185        }
186
187        nav ul {
188            display: flex;
189            list-style: none;
190        }
191
192        nav ul li {
193            margin-left: 2rem;
194        }
195
196        nav ul li a {
197            text-decoration: none;
198            color: var(--black);
199            font-weight: 500;
200            transition: color 0.3s ease;
201        }
202
203        nav ul li a:hover, nav ul li a.active {
204            color: var(--primary);
205        }
206
207        .language-switcher {
208            position: relative;
209        }
210
211        #langButton {
212            background: none;
213            border: none;
214            font-size: 1.5rem;
215            cursor: pointer;
216            /*padding: 0;*/
217            /*color: var(--primary);*/
218            transition: color 0.3s ease;
219            display: flex;
220            align-items: center;
221        }
222
223        #langButton:hover {
224            opacity: 0.7;
225        }
226
227        .lang-menu {
228            position: absolute;
229            top: calc(100% + 10px);
230            right: 0;
231            background: white;
232            border: 1px solid #ccc;
233            border-radius: 8px;
234            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
235            min-width: 160px;
236            z-index: 1000;
237            overflow: hidden;
238        }
239
240        .lang-menu.hidden {
241            display: none;
242        }
243
244        .lang-menu a {
245            display: block;
246            padding: 0.75rem 1rem;
247            text-decoration: none;
248            color: #333;
249            font-size: 0.95rem;
250            transition: background 0.2s ease;
251        }
252
253        .lang-menu a:hover {
254            background: #f5f5f5;
255        }
256
257        .lang-menu a[data-lang="en"] {
258            font-weight: 600;
259            background: #f9f9f9;
260        }
261
262        /* Hero section */
263        .hero {
264            padding: 8rem 0 5rem;
265            background-color: var(--white);
266        }
267
268        .hero-content {
269            display: flex;
270            align-items: center;
271            justify-content: space-between;
272        }
273
274        .hero-text {
275            flex: 1;
276            padding-right: 3rem;
277        }
278
279        .hero-image {
280            flex: 1;
281            position: relative;
282        }
283
284        .before-after-slider {
285            border-radius: 10px;
286            overflow: hidden;
287            height: 400px;
288            position: relative;
289            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
290        }
291
292        .slider-image {
293            position: absolute;
294            top: 0;
295            left: 0;
296            width: 100%;
297            height: 100%;
298            object-fit: cover;
299        }
300
301        .slider-before {
302            width: 50%; /* Initial width */
303            clip-path: none;
304            position: absolute;
305            left: 0;
306            top: 0;
307            bottom: 0;
308            overflow: hidden;
309        }
310
311        .slider-before img {
312            position: absolute;
313            width: 100vw; /* Full viewport width to ensure the correct position */
314            max-width: none;
315            height: 100%;
316            object-fit: cover;
317            object-position: left;
318        }
319
320        .slider-after {
321            position: absolute;
322            left: 0;
323            top: 0;
324            width: 100%;
325            height: 100%;
326        }
327
328        .slider-after img {
329            width: 100%;
330            height: 100%;
331            object-fit: cover;
332            object-position: left;
333        }
334
335        .slider-handle {
336            position: absolute;
337            top: 0;
338            bottom: 0;
339            width: 4px;
340            background: var(--white);
341            left: 50%;
342            transform: translateX(-50%);
343            cursor: col-resize;
344            z-index: 10;
345        }
346
347        .slider-handle::after {
348            content: '';
349            position: absolute;
350            width: 40px;
351            height: 40px;
352            background: var(--white);
353            border: 3px solid var(--primary);
354            border-radius: 50%;
355            top: 50%;
356            left: 50%;
357            transform: translate(-50%, -50%);
358            cursor: col-resize;
359        }
360
361        .image-label {
362            position: absolute;
363            background: var(--primary);
364            color: var(--white);
365            padding: 0.4rem 0.8rem;
366            border-radius: 4px;
367            font-size: 0.8rem;
368            font-weight: bold;
369            z-index: 5;
370            top: 20px;
371        }
372
373        .left-label {
374            left: 20px;
375        }
376
377        .right-label {
378            right: 20px;
379        }
380
381        /* Features section */
382        .features {
383            padding: 5rem 0;
384            background-color: var(--light-gray);
385        }
386
387        .features-heading {
388            text-align: center;
389            margin-bottom: 3rem;
390        }
391
392        .features-grid {
393            display: flex;
394            justify-content: space-between;
395            flex-wrap: wrap;
396        }
397
398        .feature-item {
399            flex-basis: calc(20% - 2rem);
400            margin: 1rem 0rem;  /* outside border (HW) */
401            text-align: center;
402            padding: 2rem 1rem;  /* inside border (HW) */
403            border-radius: 10px;
404            background-color: var(--white);
405            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
406            transition: transform 0.3s ease, box-shadow 0.3s ease;
407        }
408
409        .feature-item:hover {
410            transform: translateY(-10px);
411            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
412        }
413
414        .feature-icon {
415            font-size: 2.5rem;
416            color: var(--primary);
417            margin-bottom: 1rem;
418        }
419
420        .feature-title {
421            font-size: 1.2rem;
422            margin-bottom: 0.5rem;
423        }
424
425        /* Use cases section */
426        .use-cases {
427            padding: 5rem 0;
428        }
429
430        .use-case {
431            display: flex;
432            align-items: center;
433            margin-bottom: 5rem;
434        }
435
436        .use-case:nth-child(even) {
437            flex-direction: row-reverse;
438        }
439
440        .use-case-text {
441            flex: 1;
442            padding: 0 3rem;
443        }
444
445        .use-case-image {
446            flex: 1;
447            border-radius: 10px;
448            overflow: hidden;
449            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
450            display: flex;
451            flex-direction: column;
452            gap: 10px;
453        }
454
455        .use-case-image .image-container {
456            position: relative;
457            border-radius: 10px;
458            overflow: hidden;
459        }
460
461        .use-case-image img {
462            width: 100%;
463            height: auto;
464            display: block;
465        }
466
467        .use-case-image .image-label {
468            position: absolute;
469            background: var(--primary);
470            color: var(--white);
471            padding: 0.4rem 0.8rem;
472            border-radius: 4px;
473            font-size: 0.8rem;
474            font-weight: bold;
475            z-index: 5;
476            top: 10px;
477        }
478
479        .use-case-image .top-label {
480            left: 10px;
481        }
482
483        .use-case-image .bottom-label {
484            left: 10px;
485            top: 50%;
486            transform: translateY(+10px);
487        }
488
489        .use-case-image .top-33-label {
490            left: 10px;
491            top: 33.333%;
492            transform: translateY(+10px);
493        }
494
495        .use-case-image .top-66-label {
496            left: 10px;
497            top: 66.667%;
498            transform: translateY(+10px);
499        }
500
501        /* CTA section */
502        .cta {
503            padding: 5rem 0;
504            background: linear-gradient(135deg, var(--primary), #0d4b94);
505            color: var(--white);
506            text-align: center;
507        }
508
509        .cta h2 {
510            color: var(--white);
511        }
512
513        .cta-buttons {
514            margin-top: 2rem;
515        }
516
517        .btn-white {
518            background-color: var(--white);
519            color: var(--primary);
520            border: none;
521        }
522
523        .btn-white:hover {
524            background-color: var(--light-gray);
525        }
526
527        .btn-outline-white {
528            background-color: transparent;
529            color: var(--white);
530            border: 2px solid var(--white);
531        }
532
533        .btn-outline-white:hover {
534            background-color: var(--white);
535            color: var(--primary);
536        }
537
538        /* Footer */
539        footer {
540            background-color: var(--black);
541            color: var(--white);
542            padding: 3rem 0 1rem;
543        }
544
545        .footer-content {
546            display: flex;
547            justify-content: space-between;
548            margin-bottom: 2rem;
549        }
550
551        .footer-links {
552            flex: 1;
553        }
554
555        .footer-section-title {
556            color: var(--white);
557            margin-bottom: 1.5rem;
558            position: relative;
559            display: inline-block;
560            font-weight: 700;
561            line-height: 1.3;
562        }
563
564        .footer-section-title::after {
565            content: '';
566            position: absolute;
567            left: 0;
568            bottom: -0.5rem;
569            width: 40px;
570            height: 3px;
571            background-color: var(--gold);
572        }
573
574        .footer-links ul {
575            list-style: none;
576        }
577
578        .footer-links ul li {
579            margin-bottom: 0.75rem;
580        }
581
582        .footer-links ul li a {
583            color: var(--white);
584            text-decoration: none;
585            transition: color 0.3s ease;
586        }
587
588        .footer-links ul li a:hover {
589            color: var(--gold);
590        }
591
592        .copyright {
593            text-align: center;
594            padding-top: 2rem;
595            border-top: 1px solid rgba(255, 255, 255, 0.1);
596            color: var(--gray);
597            font-size: 0.9rem;
598        }
599
600        /* Responsive */
601        @media (max-width: 992px) {
602            .hero-content, .use-case {
603                flex-direction: column;
604            }
605
606            .hero-text, .use-case-text {
607                padding-right: 0;
608                padding-bottom: 3rem;
609                text-align: center;
610            }
611
612            .use-case:nth-child(even) {
613                flex-direction: column;
614            }
615
616            .feature-item {
617                flex-basis: calc(33.333% - 2rem);
618            }
619        }
620
621        @media (max-width: 768px) {
622            h1 {
623                font-size: 2.25rem;
624            }
625
626            h2 {
627                font-size: 1.75rem;
628            }
629
630            .feature-item {
631                flex-basis: calc(50% - 2rem);
632            }
633
634            .footer-content {
635                flex-direction: column;
636            }
637
638            .footer-links {
639                margin-bottom: 2rem;
640            }
641        }
642
643        @media (max-width: 576px) {
644            .feature-item {
645                flex-basis: 100%;
646            }
647        }
648    </style>
649</head>
650<body>
651    <!-- Header -->
652    <header>
653        <div class="container">
654            <div class="header-content">
655                <div class="logo">
656                    <img src="/images/retroshine-logo-25A.webp" alt="RetroShine Logo">
657                    <div class="logo-text">Retro<span>Shine</span></div>
658                </div>
659                <nav>
660                    <ul>
661                        <li><a href="index.html" class="active">Home</a></li>
662                        <li><a href="https://web.retroshine.eu">Web App</a></li>
663                        <li><a href="download.html">Download</a></li>
664                        <li><a href="contact.html">Contact</a></li>
665                        <li class="language-switcher">
666                            <button id="langButton" aria-label="Select language">🌐</button>
667                            <div id="langMenu" class="lang-menu hidden">
668                                <a href="/"    data-lang="en">English</a>
669                                <a href="/da/" data-lang="da">Dansk</a>
670                                <a href="/de/" data-lang="de">
670Deutsch</a>
671                                <a href="/es/" data-lang="es">Español</a>
672                                <a href="/fi/" data-lang="fi">Suomi</a>
673                                <a href="/fr/" data-lang="fr">Français</a>
674                                <a href="/it/" data-lang="it">Italiano</a>
675                                <a href="/nl/" data-lang="nl">Nederlands</a>
676                                <a href="/pl/" data-lang="pl">Polski</a>
677                                <a href="/pt/" data-lang="pt">Português</a>
678                                <a href="/ro/" data-lang="ro">Română</a>
679                                <a href="/sv/" data-lang="sv">Svenska</a>
680                                <a href="/uk/" data-lang="uk">Українська</a>
681                                <a href="/cs/" data-lang="cs">Čeština</a>
682                                <a href="/el/" data-lang="el">Νέα Ελληνικά</a>
683                                <a href="/hu/" data-lang="hu">Magyar</a>
684                            </div>
685                        </li>
686                    </ul>
687                </nav>
688            </div>
689        </div>
690    </header>
691
692    <!-- Hero Section -->
693    <section class="hero">
694        <div class="container">
695            <div class="hero-content">
696                <div class="hero-text">
697                    <h1>Enhance Your Scanned Photos with Professional Precision</h1>
698                    <p>RetroShine intelligently restores color and contrast to digitized analog
699                       photos — clean, accurate, and built for photographers and archivists.
700                       Historically faithful, refined for today's standards.</p>
701                    <div class="hero-buttons">
702                        <a href="https://web.retroshine.eu" class="btn btn-outline">Try Web App</a>
703                        <a href="download.html" class="btn btn-primary">Download for Desktop</a>
704                    </div>
705                </div>
706                <div class="hero-image">
707                    <div class="before-after-slider">
708                        <div class="slider-after">
709                            <img src="/images/after_m2_42.jpg" alt="After restoration">
710                            <div class="image-label right-label">After</div>
711                        </div>
712                        <div class="slider-before">
713                            <img src="/images/before_m2_42.jpg" alt="Before restoration">
714                            <div class="image-label left-label">Before</div>
715                        </div>
716                        <div class="slider-handle"></div>
717                    </div>
718                </div>
719            </div>
720        </div>
721    </section>
722
723    <!-- Features Section -->
724    <section class="features">
725        <div class="container">
726            <div class="features-heading">
727                <h2>Key Features</h2>
728                <p>RetroShine delivers professional results with minimal effort</p>
729            </div>
730            <div class="features-grid">
731                <div class="feature-item">
732                    <div class="feature-icon">🧠</div>
733                    <h3 class="feature-title">Smart Color Correction</h3>
734                    <p>Automatic curve adjustment based on image content</p>
735                </div>
736                <div class="feature-item">
737                    <div class="feature-icon">🛠️</div>
738                    <h3 class="feature-title">Manual Control</h3>
739                    <p>Advanced tools for perfect results</p>
740                </div>
741                <div class="feature-item">
742                    <div class="feature-icon">⚡</div>
743                    <h3 class="feature-title">Batch Processing</h3>
744                    <p>Process entire folders at once</p>
745                </div>
746                <div class="feature-item">
747                    <div class="feature-icon">🖼️</div>
748                    <h3 class="feature-title">Full Quality</h3>
749                    <p>Preserves original resolution and EXIF metadata</p>
750                </div>
751                <div class="feature-item">
752                    <div class="feature-icon">🪄</div>
753                    <h3 class="feature-title">Simple Interface</h3>
754                    <p>No editing experience needed</p>
755                </div>
756            </div>
757        </div>
758    </section>
759
760    <!-- Use Cases Section -->
761    <section class="use-cases">
762        <div class="container">
763            <div class="use-case">
764                <div class="use-case-text">
765                    <h2>Bleached Colors Recovered</h2>
766                    <p>Aged color films often suffer from dye bleaching and loss of contrast.
767                       RetroShine analyzes color spectrum and content to find the optimal
768                       correction curve for each channel. It rebalances the image to restore
769                       natural skin tones and vivid scenery without artifacts.</p>
770                    <a href="#" class="btn btn-outline">See More Examples</a>
771                </div>
772                <div class="use-case-image">
773                    <div class="image-container">
774                        <img src="/images/m1_34_raw.jpg" alt="Before">
775                        <div class="image-label top-label">Before</div>
776                        <img src="/images/m1_34_icc.jpg" alt="After">
777                        <div class="image-label bottom-label">After</div>
778                    </div>
779                </div>
780            </div>
781
782            <div class="use-case">
783                <div class="use-case-text">
784                    <h2>Underexposure Fixed</h2>
785                    <p>Underexposed photos are often developed longer to compensate for darkness.
786                       This leads to artificially high black points. RetroShine's advanced algorithm
787                       detects this and carefully adjusts shadows and highlights, revealing hidden
788                       details without producing glow effects.</p>
789                    <a href="#" class="btn btn-outline">See More Examples</a>
790                </div>
791                <div class="use-case-image">
792                    <div class="image-container">
793                        <img src="/images/m2_25_before.jpg" alt="Underexposed photo before">
794                        <div class="image-label top-label">Before</div>
795                        <img src="/images/m2_25_after.jpg" alt="Underexposed photo after">
796                        <div class="image-label bottom-label">After</div>
797                    </div>
798                </div>
799            </div>
800
801            <div class="use-case">
802                <div class="use-case-text">
803                    <h2>Scanner Software vs. RetroShine</h2>
804                    <p>All examples above were produced with the same settings, running Retroshine in full-auto mode.
805                       Standard scanner software features automatic correction functions that often fail to produce consistent results.
806                       We developed RetroShine to avoid the time-consuming tinkering with consumer-level scan and editing software.
807                       Let RetroShine's algorithm take over, you have better things to do!</p>
808                    <a href="#" class="btn btn-outline">See More Examples</a>
809                </div>
810                <div class="use-case-image">
811                    <div class="image-container">
812                        <img src="/images/m1_07_orig.jpg" alt="Scanner software">
813                        <div class="image-label top-label">Scanner Software</div>
814                        <img src="/images/m1_07_wa14.jpg" alt="RetroShine">
815                        <div class="image-label bottom-label">RetroShine</div>
816                    </div>
817                </div>
818            </div>
819
820            <div class="use-case">
821                <div class="use-case-text">
822                    <h2>Pro Workflow</h2>
823                    <p>If you are ambitious, you can leverage RetroShine's full capacity by
824                       processing raw 16-bit scans (PNG or TIFF). You can load your scanner's
825                       ICC profile into RetroShine for best results. It will convert the images
826                       to sRGB after curve corrections to avoid any channel bleeding.
827                       See the FAQ for how to do this.<br>
828                       While RetroShine aims at ease of use, its underlying AutoLevels engine
829                       is a command-line tool that seamlessly fits into professional automated
830                       archiving workflows.
831                       Perfect for museums, archives, and professional photographers.
832                       Please let us know if you require camera raw formats.</p>
833                    <a href="https://github.com/yellowdolphin/autolevels" class="btn btn-outline">Learn About AutoLevels</a>
834                </div>
835                <div class="use-case-image">
836                    <div class="image-container">
837                        <img src="/images/m1_41_raw.jpg" alt="16-bit scanner raw image">
838                        <div class="image-label top-label">Raw Scan</div>
839                        <img src="/images/m1_41_wa14.jpg" alt="Automatic Curve Correction">
840                        <div class="image-label top-33-label">Automatic Curve Correction</div>
841                        <img src="/images/m1_41_icc.jpg" alt="sRGB output image">
842                        <div class="image-label top-66-label">Final sRGB Output</div>
843                    </div>
844                </div>
845            </div>
846        </div>
847    </section>
848
849    <!-- CTA Section -->
850    <section class="cta">
851        <div class="container">
852            <h2>Ready to Bring Your Photos to Life?</h2>
853            <p>No subscriptions. No ads. No data collection. Your privacy is guaranteed.</p>
854            <div class="cta-buttons">
855                <a href="download.html" class="btn btn-white">Download for Desktop</a>
856                <a href="https://web.retroshine.eu" class="btn btn-outline-white">Try Web App</a>
857            </div>
858        </div>
859    </section>
860
861    <!-- Footer -->
862    <footer>
863        <div class="container">
864            <div class="footer-content">
865                <div class="footer-links">
866                    <div class="footer-section-title">RetroShine</div>
867                    <ul>
868                        <li><a href="index.html">Home</a></li>
869                        <li><a href="https://web.retroshine.eu">Web App</a></li>
870                        <li><a href="download.html">Download</a></li>
871                        <li><a href="contact.html">Contact</a></li>
872                    </ul>
873                </div>
874                <div class="footer-links">
875                    <div class="footer-section-title">Help</div>
876                    <ul>
877                        <li><a href="faq.html">FAQ</a></li>
878                        <li><a href="tutorial.html">
878Tutorial</a></li>
879                        <!-- <li><a href="support.html">Support</a></li> -->
880                    </ul>
881                </div>
882                <div class="footer-links">
883                    <div class="footer-section-title">Legal</div>
884                    <ul>
885                        <li><a href="privacy_policy.html">Privacy Policy</a></li>
886                        <li><a href="legal_notice.html">Legal Notice</a></li>
887                        <li><a href="legal_notice.html">Impressum</a></li>
888                    </ul>
889                </div>
890                <div class="footer-links">
891                    <div class="footer-section-title">Connect</div>
892                    <ul>
893                        <li><a href="mailto:[email protected]">Email Us</a></li>
894                        <li><a href="donate.html">Donate</a></li>
895                    </ul>
896                </div>
897            </div>
898            <div class="copyright">
899                <p>© 2026 RetroShine. All rights reserved.</p>
900            </div>
901        </div>
902    </footer>
903
904    
904<script>
905        // Language switcher functionality
906        const langButton = document.getElementById('langButton');
907        const langMenu = document.getElementById('langMenu');
908
909        langButton.addEventListener('click', () => {
910          langMenu.classList.toggle('hidden');
911        });
912
913        // Close menu when clicking outside
914        document.addEventListener('click', (e) => {
915          if (!langButton.contains(e.target) && !langMenu.contains(e.target)) {
916            langMenu.classList.add('hidden');
917          }
918        });
919
920        // Set language cookie when clicking a language link
921        document.querySelectorAll('.lang-menu a').forEach(link => {
922          link.addEventListener('click', (e) => {
923            const lang = e.target.dataset.lang;
924            document.cookie = `lang=${lang}; path=/; max-age=31536000; SameSite=Lax`;
925          });
926        });
927    </script>
927
928
929    
929<script>
930        // Simple implementation of the before/after slider
931        document.addEventListener('DOMContentLoaded', function() {
932            const slider = document.querySelector('.slider-handle');
933            const beforeContainer = document.querySelector('.slider-before');
934            const beforeImg = beforeContainer.querySelector('img');
935            const sliderContainer = document.querySelector('.before-after-slider');
936
937            // Initialize the before image with the correct width
938            function initializeSlider() {
939                const initialPercent = 50; // Default starting at 50%
940                beforeContainer.style.width = `${initialPercent}%`;
941                slider.style.left = `${initialPercent}%`;
942
943                // Set the initial width factor for the before image
944                const widthFactor = 100 / initialPercent;
945                beforeImg.style.width = `${widthFactor * 100}%`;
946            }
947
948            // Run initialization on page load
949            initializeSlider();
950
951            function updateSlider(x) {
952                const sliderRect = sliderContainer.getBoundingClientRect();
953                let percent = ((x - sliderRect.left) / sliderRect.width) * 100;
954                percent = Math.min(Math.max(percent, 0), 100);
955
956                beforeContainer.style.width = `${percent}%`;
957                slider.style.left = `${percent}%`;
958
959                // Update the width factor based on the current slider position
960                const widthFactor = 100 / percent;
961                if (percent > 0) {
962                    beforeImg.style.width = `${widthFactor * 100}%`;
963                }
964            }
965
966            let isDragging = false;
967
968            slider.addEventListener('mousedown', (e) => {
969                isDragging = true;
970                e.preventDefault(); // Prevent text selection during drag
971            });
972
973            window.addEventListener('mousemove', (e) => {
974                if (isDragging) {
975                    updateSlider(e.clientX);
976                }
977            });
978
979            window.addEventListener('mouseup', () => {
980                isDragging = false;
981            });
982
983            // For touch devices
984            slider.addEventListener('touchstart', (e) => {
985                isDragging = true;
986                e.preventDefault(); // Prevent default touch action
987            }, { passive: false });
988
989            window.addEventListener('touchmove', (e) => {
990                if (isDragging) {
991                    updateSlider(e.touches[0].clientX);
992                    e.preventDefault(); // Prevent page scrolling while dragging
993                }
994            }, { passive: false });
995
996            window.addEventListener('touchend', () => {
997                isDragging = false;
998            });
999        });
1000    </script>
1000
1001</body>
1002</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.