/* Styles by Dockschiff Digital */

body { background: #fff; color: #101008; font-family: Poppins; font-size: 16px; font-style: normal; font-weight: normal; line-height: 35px; }
strong { color: #fff; }

.hero-header { position: relative; width: 100%; height: 100vh; overflow: hidden; }
.hero-video-wrapper { position: relative; width: 100%; height: 100%; }
.hero-video-wrapper video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.video-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: rgba(16, 16, 8, 0.9); pointer-events: none; }
.hero-content { z-index: 2; color: #fff; position: relative; text-align: center; }
.logo-container { text-align: center; margin-top: 10rem; margin-bottom: 10rem; }
.logo-container img { width: 100%; }
.claim { color: #B79574; font-size: 65px; font-weight: 600; line-height: 70px; text-transform: uppercase; margin-bottom: 60px; text-align: left;  }
.scroll-down { position: absolute; bottom: 8%; left: 0; right: 0; margin: 0 auto; z-index: 10; display: block; text-align: center; }
.scroll-down img { width: 36px; height: auto; display: inline-block; animation: bounce 2s infinite; }
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(8px); }
    60% { transform: translateY(4px); }
}
#content { font-size: 18px; color: 101008; }
#content p { padding-top: 20px; }
.claim { color: #B79574; font-family: Poppins; font-size: 65px; font-style: normal; font-weight: 600; line-height: 70px; text-transform: uppercase; }
.statement { padding-top: 70px; padding-bottom: 50px; color: #B79574; text-align: center; font-size: 60px; line-height: 70px; text-transform: uppercase; font-weight: 600; }
.text { text-align: justify; }
.logo-unten { line-height: 1; }
.logo-unten img { width: 170px; }
.lang-nav { padding-top: 40px; }
.lang-switch { text-align: right; font-weight: 600; margin-bottom: 0rem; line-height: 1; font-size: 14px; }
.lang-switch a { color: #878787; text-decoration: none; margin: 0px 0.25rem; line-height: 1; }
.lang-switch a.active { color: #101008; line-height: 1; }
.lang-switch span { color: #494949; line-height: 1; }


.section-companies { margin-top: 60px; }
.section-statement { padding-bottom: 0px; }
footer { padding-bottom: 20px; padding-top: 140px; font-size: 12px; color: #494949; }
.bl-card { background: rgba(183, 149, 116, 0.80); border-radius: 20px; padding: 30px 50px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: space-between; height: 100%; transition: transform 0.5s ease, box-shadow 0.5s ease, background 0.5s ease; }
.bl-card-icon { height:115px; width: 115px; margin-bottom: 1.5rem; }
.bl-card-logo-wrapper { height: 80px; display: flex; align-items: flex-start; justify-content: center; width: 100%; margin-bottom: auto; margin: 40px 0 0px 0; }
.bl-card-logo-img { height: auto; max-height: 65px; }
.cell-desc { line-height: 1.4; padding: 20px 0 40px 0; color: #000000; font-weight: bold; }
.bl-card-button .arrow { font-size: 16px; }
.bl-card.hovered { background: rgba(183, 149, 116, 0.80); transform: scale(1.01); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); }
.bl-card-button { text-transform: uppercase; background: #101008; color: #C3A88E; border-radius: 30px; padding: 10px 60px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font-size: 14px; font-weight: 700; transition: background 0.3s ease, transform 0.5s ease; }
.bl-card-button:hover { background: #333; color: #C3A88E; transform: scale(1.02); }
@keyframes arrowWooble { 0% { transform: translateX(0); } 25% { transform: translateX(3px); } 50% { transform: translateX(-2px); } 75% { transform: translateX(2px); } 100% { transform: translateX(0); } }
.bl-card-button:hover .arrow, .btn-trans:hover .arrow { animation: arrowWooble 0.6s ease; }
.btn-trans { text-transform: uppercase; background: transparent; border: #101008 1px solid; color: #101008; border-radius: 30px; padding: 10px 60px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font-size: 14px; font-weight: 700; transition: background 0.3s ease, transform 0.5s ease; margin-top: 85px; }
.btn-trans:hover { color: #101008; transform: scale(1.02); }
footer a { color: #101008; font-size: 12px; font-style: normal; font-weight: 400; line-height: 35px; transition: color 0.3s ease; }
footer a:hover { color: #101008; transition: color 0.3s ease; }

.legal .logo-unten { padding-top: 40px; padding-bottom: 20px; border-bottom: 1px solid #101008; margin-bottom: 40px; }
.content-legal .text { text-align: left; }
.content-legal#content p { padding-top: 0px; }
.content-legal h1 { color: #B79574; margin-bottom: 40px; }
.content-legal h2 { font-size: 2rem; margin-bottom: 20px; }
.content-legal h3 { font-size: 1.5rem; margin-bottom: 10px; }
.content-legal h4 { font-size: 1.3rem; margin-bottom: 10px;  }
.btn-404 { margin-top: 20px; }
.text a { text-decoration: underline; text-decoration-color: #101008; text-underline-offset: 4px; color: #101008; transition: color 0.3s ease, text-decoration-color 0.3s ease; }
.text a:hover { color: #000; text-decoration-color: #000; opacity: 0.6; }

@media (max-width: 639px) {
    body { line-height: 1.7; text-align: center; }
    .hero-header { height: 100svh; }
    #content { margin-top: 20px; }
    .bl-card.hovered { transform: none; box-shadow: none; background: #BBB; }
    .bl-card-button:hover { transform: none; }
    .claim, .statement { font-size: 30px; line-height: 1.3; text-align: center; }
    .claim { margin-bottom: 30px; text-align: left; }
    .statement { margin-top: 20px; padding-top: 30px; font-size: 25px; padding-bottom: 40px; }
    .section-companies, .btn-trans { margin-top: 40px; }
    .section-companies .cell { margin-bottom: 40px; }
    footer { padding-top: 40px; }
    .lang-switch { font-size: 14px; }
    .text { text-align: left; font-size: 16px; }
    .claim { font-size: 30px; line-height: 1.3; }
    .logo-container { margin-bottom: 5rem; }
    .logo-container img { max-width: 100%; }
    .legal .logo-unten { margin-bottom: 0px; text-align: left; }
    .content-legal h1 { font-size: 2rem; color: #B79574; margin-bottom: 20px; text-align: left; }
    .content-legal h2 { font-size: 1.5rem; margin-bottom: 15px; }
    .content-legal h3 { font-size: 1.2rem; margin-bottom: 10px; }
    .content-legal h4 { font-size: 1rem; margin-bottom: 10px;  }
    .btn-404 { margin-top: 20px; }
}