.moos-download-wrapper {
max-width: 900px;
margin: 40px auto;
padding: 0 20px;
font-family: -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, Helvetica, Arial, sans-serif;
color: #2c2c2c;
}

.moos-download-header {
text-align: center;
margin-bottom: 40px;
}

.moos-download-header h2 {
font-size: 1.5rem;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 2px;
margin: 0 0 12px 0;
color: #1a1a1a;
}

.moos-download-header p {
font-size: 0.95rem;
color: #555;
line-height: 1.6;
max-width: 600px;
margin: 0 auto;
}

/* Dokumenten-Grid im Stil der Buttons */
.moos-doc-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 15px;
margin-bottom: 30px;
}

.moos-doc-card {
position: relative;
background: #ffffff;
border: 1px solid #dcd7d0;
border-radius: 2px;
padding: 16px 16px 16px 45px;
cursor: pointer;
transition: all 0.2s ease;
}

.moos-doc-card:hover {
border-color: #2e3729;
background: #fcfcfc;
}

.moos-doc-card input[type=”checkbox”] {
position: absolute;
left: 16px;
top: 20px;
width: 16px;
height: 16px;
accent-color: #2e3729;
cursor: pointer;
}

.moos-doc-title {
font-size: 0.9rem;
font-weight: 500;
color: #333;
line-height: 1.4;
display: block;
}

/* Haupt-Button (#2e3729) */
.moos-btn {
display: block;
width: 100%;
background-color: #2e3729;
color: #ffffff;
text-align: center;
padding: 15px 20px;
border: none;
border-radius: 2px;
font-size: 0.85rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1.5px;
cursor: pointer;
text-decoration: none;
transition: background-color 0.2s ease;
box-sizing: border-box;
}

.moos-btn:hover {
background-color: #22291e;
}

/* Zweit-Button (Zurück-Button) */
.moos-btn-secondary {
display: block;
width: 100%;
background-color: transparent;
color: #2e3729;
border: 1px solid #2e3729;
text-align: center;
padding: 12px 20px;
margin-top: 20px;
border-radius: 2px;
font-size: 0.8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1.5px;
cursor: pointer;
transition: all 0.2s ease;
box-sizing: border-box;
}

.moos-btn-secondary:hover {
background-color: #2e3729;
color: #ffffff;
}

/* Ergebnis-Bereich */
#moos-success-box {
display: none;
background: #f7f6f2;
border: 1px solid #dcd7d0;
padding: 30px;
border-radius: 2px;
}

#moos-success-box h3 {
margin-top: 0;
font-size: 1.1rem;
text-transform: uppercase;
letter-spacing: 1px;
color: #1a1a1a;
}

.moos-result-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0;
border-bottom: 1px solid #e5e2db;
}

.moos-result-item:last-child {
border-bottom: none;
}

.moos-result-item span {
font-size: 0.9rem;
}

.moos-btn-small {
background-color: #2e3729;
color: #fff;
padding: 8px 16px;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 1px;
border-radius: 2px;
text-decoration: none;
font-weight: 600;
}

.moos-btn-small:hover {
background-color: #22291e;
}

@media (max-width: 600px) {
.moos-doc-grid {
grid-template-columns: 1fr;
}
}

const form = document.getElementById(‘moosDownloadForm’);
const successBox = document.getElementById(‘moos-success-box’);
const backBtn = document.getElementById(‘moosBackBtn’);

form.addEventListener(‘submit’, function(e) {
e.preventDefault();

const checkedDocs = document.querySelectorAll(‘input[name=”docs[]”]:checked’);
if (checkedDocs.length === 0) {
alert(‘Bitte wählen Sie mindestens ein Dokument aus.’);
return;
}

const baseUrl = “https://moosmoos.de/wp-content/uploads/2026/07/”;

const titles = {
‘CO2Datasheet_Moss.pdf’: ‘CO₂ Datenblatt Moss’,
‘EJOT-CROSSFIX-Systembeschreibung.pdf’: ‘EJOT CROSSFIX Systembeschreibung’,
‘Greenovation_Datenblatt_2024.pdf’: ‘Greenovation Datenblatt (2024)’,
‘Greenovation_Datenblatt.pdf’: ‘Greenovation Datenblatt’,
‘Greenovation_Messprotokoll_mit_Wasserzeichen.pdf’: ‘Greenovation Messprotokoll’,
‘Greenovation_Querschnitt_bemasst.pdf’: ‘Greenovation Querschnitt bemaßt’,
‘MoosMoos_Facade_with_Climate_Protection_Effect_EN.pdf’: ‘Facade Climate Protection (EN)’,
‘Nachhaltigkeitserklarung-MOOS•MOOS-GREENOVATION.pdf’: ‘Nachhaltigkeitserklärung’,
‘Unbedenklichkeitserklarung-MOOS•MOOS-GREENOVATION.pdf’: ‘Unbedenklichkeitserklärung’
};

form.style.display = ‘none’;
const container = document.getElementById(‘moos-links-container’);
container.innerHTML = ”;

checkedDocs.forEach(checkbox => {
const filename = checkbox.value;
const title = titles[filename] || filename;

const item = document.createElement(‘div’);
item.className = ‘moos-result-item’;
item.innerHTML = `
${title}Download`;
container.appendChild(item);
});

successBox.style.display = ‘block’;
});

// Event Listener für den Zurück-Button
backBtn.addEventListener(‘click’, function() {
successBox.style.display = ‘none’;
form.style.display = ‘block’;
});