.header-custom-buttons { display: flex; gap: 15px; align-items: center; } /* Hotline / Telefon Text-Element */ .header-hotline { display: flex; align-items: center; gap: 8px; margin-right: 5px; } .hotline-icon { color: #e30613; /* Passt farblich zum Akzent, kann angepasst werden */ flex-shrink: 0; } .hotline-text { display: flex; flex-direction: column; } .hotline-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; color: #666666; line-height: 1.1; } .hotline-number { font-size: 13px; font-weight: 700; color: #111111; text-decoration: none; line-height: 1.3; } .hotline-number:hover { color: #e30613; } /* Bestehendes Button-Design */ .header-btn { display: flex; align-items: center; gap: 10px; text-decoration: none; padding: 8px 14px; border-radius: 4px; transition: all 0.2s ease; } .header-btn-customer { background: transparent; border: 1px solid #dcdcdc; color: #111111; } .header-btn-customer:hover { background: #f5f5f5; border-color: #111111; } .header-btn-vendor { background: #e30613; border: 1px solid #e30613; color: #ffffff; } .header-btn-vendor:hover { background: #c5050f; border-color: #c5050f; } .header-btn-text { display: flex; flex-direction: column; } .header-btn-subtitle { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 500; opacity: 0.75; line-height: 1.1; } .header-btn-title { font-size: 12px; text-transform: uppercase; letter-spacing: 0.02em; font-weight: 700; line-height: 1.3; } @media (max-width: 900px) { .header-custom-buttons { flex-direction: column; width: 100%; gap: 10px; align-items: flex-start; } .header-btn { width: 100%; justify-content: flex-start; } }