/* =========================================================
   DOJANG JEONSA – ZENTRALES STYLESHEET
   Ohne W3.CSS / ohne .w3-* Klassen
========================================================= */

html,
body{min-height:100%;}

*,
*::before,
*::after{box-sizing:border-box;}

html,
body,
h1,h2,h3,h4,h5,h6,
button,input,textarea{font-family:Arial,Helvetica,sans-serif;}

body{margin:0;background:#fff;color:#1f1f1f;font-size:16px;line-height:1.7;}
a{color:inherit;}
img{display:block;max-width:100%;height:auto;}

/* Grundlayout */
.site-content{position:relative;max-width:1500px;margin:0 auto;padding:24px 12px 0;background:#fff;}

/* Header / Navigation */
.site-header{width:100%;background:#fff;}
.main-header{display:flex;align-items:center;width:100%;min-height:82px;padding:0 24px;background:#fff;border-bottom:1px solid #e2e2e2;}
.logo-link{display:flex;align-items:center;flex-shrink:0;padding:6px 10px;text-decoration:none;}
.header-logo{display:block;width:155px;max-height:68px;height:auto;object-fit:contain;}
.desktop-nav{display:flex;align-items:center;gap:2px;margin-left:auto;}
.nav-button{display:inline-block;padding:11px 10px;border-radius:6px;color:#333;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background .2s ease,color .2s ease;}
.nav-button:hover{background:#eee;color:#111;}
.nav-button.active{background:#e5e5e5;color:#111;}
.contact-button{margin-left:4px;}
.menu-button{display:none;margin-left:auto;padding:10px 12px;border:0;background:transparent;color:#222;font-size:22px;cursor:pointer;}

/* Grafischer Headerbereich */
.header-hero{position:relative;display:flex;align-items:center;min-height:220px;overflow:hidden;background:#f1f1f1;border-bottom:1px solid #ddd;}
.header-hero::after{content:"";position:absolute;top:0;right:-80px;width:46%;height:100%;background:#252525;transform:skewX(-13deg);}
.header-hero-content{position:relative;z-index:3;width:100%;max-width:1450px;margin:0 auto;padding:38px 55px;}
.header-hero-kicker{margin:0 0 6px;color:#666;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;}
.header-hero-title{margin:0;color:#181818;font-size:clamp(36px,4vw,52px);font-weight:700;line-height:1.05;}
.header-hero-subtitle{margin:10px 0 0;color:#555;font-size:16px;}
.header-hero-decoration{position:absolute;top:0;right:0;z-index:2;display:flex;align-items:center;justify-content:center;width:41%;height:100%;overflow:hidden;pointer-events:none;}
.header-hero-decoration span{color:rgba(255,255,255,.11);font-size:clamp(38px,5vw,68px);font-weight:700;letter-spacing:.08em;white-space:nowrap;}

/* Mobile Navigation */
.mobile-sidebar{position:fixed;top:0;left:-300px;width:280px;height:100%;padding-top:10px;overflow-y:auto;background:#111;color:#fff;z-index:2000;box-shadow:4px 0 12px rgba(0,0,0,.25);transition:left .25s ease;}
.mobile-sidebar.open{left:0;}
.mobile-sidebar a,.mobile-close{display:block;width:100%;padding:14px 18px;border:0;background:transparent;color:#fff;text-align:left;text-decoration:none;font:inherit;cursor:pointer;}
.mobile-sidebar a:hover,.mobile-close:hover{background:#333;}
.mobile-logo-link{display:block;margin-top:20px;padding:28px 18px!important;background:#fff!important;}
.mobile-logo{display:block;width:190px;height:auto;}

/* Buttons / Links */
.primary-button,.secondary-button,.pdf-button,.secondary-action-button{display:inline-block;padding:12px 20px;border-radius:5px;font-weight:600;text-decoration:none;transition:background .2s ease,color .2s ease,transform .2s ease;}
.primary-button{background:#202020;color:#fff;}
.primary-button:hover{background:#000;color:#fff;transform:translateY(-1px);}
.secondary-button{border:1px solid #333;background:#fff;color:#222;}
.secondary-button:hover{background:#eee;}
.pdf-button{min-width:210px;background:#a72d2d;color:#fff;}
.pdf-button:hover{background:#862323;color:#fff;}
.secondary-action-button{min-width:210px;background:#666;color:#fff;}
.secondary-action-button:hover{background:#444;color:#fff;}
.text-link{display:inline-block;border-bottom:1px solid #999;font-weight:600;text-decoration:none;}
.text-link:hover{border-color:#111;}

/* Startseite */
.home-intro{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(420px,1.1fr);align-items:center;gap:70px;padding:65px 55px;background:#f3f3f3;}
.home-intro-image{display:flex;justify-content:center;align-items:center;}
.home-intro-image img{width:100%;max-width:430px;}
.home-intro-content{max-width:720px;}
.home-kicker{margin:0 0 2px;color:#555;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.home-name{margin:0 0 18px;font-size:17px;font-weight:700;}
.home-intro-content h1{margin:0 0 24px;color:#111;font-size:clamp(32px,4vw,52px);line-height:1.12;}
.home-intro-content p{margin:0 0 18px;}
.home-lead{color:#333;font-size:19px;line-height:1.65;}
.home-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.home-section{padding:70px 40px;}
.section-heading{max-width:850px;margin:0 auto 45px;text-align:center;}
.section-kicker{margin:0 0 5px;color:#666;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.section-heading h2{margin:0 0 16px;font-size:clamp(28px,3vw,40px);line-height:1.2;}
.section-heading p{max-width:720px;margin:0 auto;color:#555;}
.home-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.home-card{overflow:hidden;background:#fff;border-radius:4px;box-shadow:0 4px 15px rgba(0,0,0,.12);}

.home-card-image{display:block;overflow:hidden;}
.home-card-image img{width:100%;height:260px;object-fit:cover;}

.home-card-content{padding:24px;}
.home-card-content h3{margin:0 0 12px;font-size:22px;}
.home-card-content p{margin:0 0 16px;color:#555;}
.home-cta{padding:20px 40px 80px;}
.home-cta-content{max-width:1100px;margin:0 auto;padding:50px 35px;background:#eee;text-align:center;}
.home-cta-content h2{margin:0 0 12px;font-size:32px;}
.home-cta-content p{margin:0 0 24px;}

/* Allgemeine Unterseiten */
.page-intro{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(380px,1.1fr);align-items:center;gap:60px;padding:48px 40px;background:#f1f1f1;}
.page-intro-image{display:flex;justify-content:center;align-items:center;}
.page-intro-image img{width:100%;max-width:520px;max-height:300px;object-fit:contain;}
.page-intro-content{max-width:700px;}
.page-kicker{margin:0 0 4px;color:#555;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.page-name{margin:0 0 18px;font-size:17px;font-weight:700;}
.page-intro-content h1{margin:0;color:#111;font-size:clamp(32px,4vw,50px);line-height:1.15;}
.content-section{max-width:1200px;margin:0 auto;padding:55px 24px 20px;}
.content-header{max-width:850px;margin-bottom:32px;}
.content-header h2{margin:0 0 16px;font-size:clamp(27px,3vw,38px);line-height:1.2;}
.content-header p{margin:0 0 12px;}
.content-header a{border-bottom:1px solid #aaa;font-weight:600;text-decoration:none;}
.content-header a:hover{border-color:#111;}

/* Trainingszeiten */
.training-location{margin:28px 0 42px;padding:22px 24px;background:#f5f5f5;border-left:4px solid #222;}
.training-location h3{margin:0 0 8px;font-size:19px;}
.training-location p{margin:0;}
.training-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.training-card{padding:24px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 14px rgba(0,0,0,.09);}
.training-card h3{display:inline-block;margin:0 0 22px;padding:7px 13px;background:#ededed;font-size:20px;}
.training-entry{padding:15px 0;border-top:1px solid #e3e3e3;}
.training-entry:first-of-type{border-top:0;}
.training-time{margin-bottom:3px;color:#555;font-size:15px;}
.training-group{font-size:18px;font-weight:700;}
.training-group a{border-bottom:1px solid #aaa;text-decoration:none;}
.training-group a:hover{border-color:#111;}

/* Trainer */
.trainer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.trainer-card{display:flex;align-items:center;gap:28px;padding:28px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 14px rgba(0,0,0,.10);}

.trainer-image{flex:0 0 180px;}
.trainer-image img{width:180px;height:180px;border-radius:50%;object-fit:cover;}
.trainer-content{flex:1;}
.trainer-content h3{margin:0 0 8px;font-size:22px;line-height:1.25;text-transform:uppercase;}
.trainer-grade{margin:0 0 6px;font-size:16px;font-weight:700;}
.trainer-role{margin:0;color:#666;}

/* Mitgliedschaft */
.membership-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.membership-card{display:flex;flex-direction:column;min-height:320px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 14px rgba(0,0,0,.10);}

.membership-card-header{padding:16px 22px;background:#eee;border-bottom:1px solid #ddd;}
.membership-card-header h3{margin:0;font-size:21px;}
.membership-card-content{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;padding:28px 22px;text-align:center;}
.membership-price{margin:0 0 22px;}
.membership-price span{display:block;margin-bottom:4px;color:#666;font-size:14px;}
.membership-price strong{display:block;color:#111;font-size:24px;}
.membership-description{max-width:420px;margin:0 0 22px;color:#555;}
.membership-icon{margin-bottom:20px;color:#555;font-size:48px;line-height:1;}

/* Info / Han Moo Kwan */
.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.info-card{padding:28px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 14px rgba(0,0,0,.08);}
.info-card h2{margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid #ddd;font-size:24px;line-height:1.25;}
.info-card p{margin:0 0 16px;}
.info-list{margin:18px 0 0;padding-left:22px;}
.info-list li{margin-bottom:9px;}
.hanmookwan-highlight{margin-top:40px;padding:32px;background:#f1f1f1;border-left:4px solid #222;}
.hanmookwan-highlight h2{margin:0 0 16px;font-size:28px;}
.hanmookwan-highlight p{max-width:1000px;margin:0 0 15px;}

/* Lil Dragon */
.lildragon-feature{display:grid;grid-template-columns:minmax(360px,1.05fr) minmax(360px,.95fr);gap:45px;align-items:center;margin-top:35px;padding:35px;background:#f3f3f3;}
.lildragon-feature-image{overflow:hidden;}
.lildragon-feature-image img{width:100%;height:100%;max-height:520px;object-fit:cover;}
.lildragon-feature-content h2{margin:0 0 18px;font-size:30px;line-height:1.25;}
.lildragon-feature-content p{margin:0 0 16px;}

/* FAQ */
.faq-list{max-width:1000px;}
.faq-item{margin-bottom:14px;background:#fff;border:1px solid #ddd;}
.faq-question{display:flex;align-items:center;gap:14px;width:100%;padding:18px 20px;border:0;background:#f3f3f3;color:#222;text-align:left;font:inherit;font-size:17px;font-weight:600;cursor:pointer;transition:background .2s ease;}
.faq-question:hover{background:#e8e8e8;}
.faq-icon{display:flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:30px;background:#222;color:#fff;border-radius:50%;font-size:12px;}
.faq-container{display:none;}
.faq-container.open{display:block;}
.faq-answer{padding:20px;border-top:1px solid #ddd;line-height:1.7;}
.faq-answer p{margin:0 0 12px;}
.faq-answer p:last-child{margin-bottom:0;}

/* Kontakt */
.contact-intro{max-width:1200px;margin:0 auto;padding:60px 24px 28px;}
.contact-intro h1{margin:0 0 14px;font-size:clamp(34px,4vw,50px);line-height:1.15;}
.contact-intro p{max-width:720px;margin:0;color:#555;font-size:18px;}
.contact-section{max-width:1200px;margin:0 auto;padding:20px 24px 40px;}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:40px;align-items:start;}
.contact-form-wrapper{padding:30px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 14px rgba(0,0,0,.08);}
.contact-form-wrapper h2{margin:0 0 24px;font-size:28px;}
.contact-form{width:100%;}
.form-group{margin-bottom:20px;}
.form-group label{display:block;margin-bottom:7px;font-weight:600;}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
.form-control{display:block;width:100%;padding:11px 12px;border:1px solid #bbb;border-radius:3px;background:#fff;color:#222;font:inherit;line-height:1.4;transition:border-color .2s ease,box-shadow .2s ease;}
.form-control:focus{outline:none;border-color:#333;box-shadow:0 0 0 2px rgba(0,0,0,.08);}
textarea.form-control{min-height:180px;resize:vertical;}
.contact-submit{border:0;cursor:pointer;font:inherit;}
.contact-honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form-message{margin-bottom:24px;padding:16px 18px;border:1px solid;}
.form-error{background:#fceaea;border-color:#d5a0a0;color:#751e1e;}
.form-success{background:#e9f7e9;border-color:#afd5af;color:#164f16;}
.form-privacy{margin:4px 0 20px;padding:14px 16px;background:#f3f3f3;border-left:3px solid #777;color:#555;font-size:14px;line-height:1.6;}
.form-privacy p{margin:0;}
.form-privacy a{color:#222;font-weight:600;text-decoration:underline;}
.form-privacy a:hover{text-decoration:none;}
.contact-info{display:grid;gap:24px;}
.contact-info-card{padding:26px;background:#f2f2f2;border:1px solid #ddd;}
.contact-info-card h2{margin:0 0 22px;font-size:23px;}
.contact-info-item{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px;}
.contact-info-item:last-child{margin-bottom:0;}
.contact-info-icon{display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;background:#222;color:#fff;border-radius:50%;}
.contact-info-item strong{display:block;margin-bottom:3px;}
.contact-info-item a{text-decoration:none;}
.contact-info-item a:hover{text-decoration:underline;}
.contact-info-item p{margin:0;}

/* Rechtliche Seiten */
.legal-page{max-width:1100px;margin:0 auto;padding:60px 24px 30px;}
.legal-header{margin-bottom:45px;padding-bottom:30px;border-bottom:1px solid #ddd;}
.legal-header h1{margin:0 0 18px;font-size:clamp(34px,4vw,50px);line-height:1.15;}
.legal-header p:last-child{max-width:800px;margin-bottom:0;color:#555;font-size:17px;}
.legal-content{max-width:900px;}
.legal-content h2{margin:42px 0 15px;font-size:24px;line-height:1.3;}
.legal-content h2:first-child{margin-top:0;}
.legal-content p{margin:0 0 16px;}
.legal-content a{font-weight:600;text-decoration:underline;}
.legal-content a:hover{text-decoration:none;}
.legal-list{margin:10px 0 20px;padding-left:24px;}
.legal-list li{margin-bottom:8px;}
.legal-date{margin-top:30px!important;padding-top:18px;border-top:1px solid #ddd;color:#666;font-size:14px;}

/* Danke */
.thank-you-page{display:flex;align-items:center;justify-content:center;min-height:420px;padding:60px 24px;}
.thank-you-box{width:100%;max-width:850px;padding:50px 40px;background:#f2f2f2;border:1px solid #ddd;text-align:center;}
.thank-you-box h1{margin:0 0 18px;font-size:clamp(30px,4vw,44px);line-height:1.2;}
.thank-you-box p{margin:0 0 28px;color:#555;font-size:18px;}

/* CTA */
.page-cta{padding:30px 24px 40px;}
.page-cta-content{max-width:1100px;margin:0 auto;padding:42px 32px;background:#f1f1f1;text-align:center;}
.page-cta-content h2{margin:0 0 12px;font-size:30px;}
.page-cta-content p{max-width:700px;margin:0 auto 22px;}

/* Footer */
.site-footer{margin-top:128px;background:#232323;color:#fff;}
.footer-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;max-width:1400px;margin:0 auto;padding:40px 24px;}
.footer-column h5{margin:0 0 8px;font-size:16px;}
.footer-column h6{margin:0 0 14px;font-size:14px;font-weight:normal;}
.footer-column p{margin:8px 0;font-size:13px;}
.site-footer a{color:#fff;text-decoration:none;}
.site-footer a:hover{text-decoration:underline;}

/* =========================================================
   GLOBALE CARD-BEWEGUNG
   Erfasst nur vollständige Klassennamen, die auf -card enden.
   Beispiele: training-card, trainer-card, info-card,
   membership-card, home-card, contact-info-card.
========================================================= */

[class$="-card"],
[class*="-card "]{
    transition:
        transform .32s cubic-bezier(.2,.7,.3,1),
        box-shadow .32s ease,
        border-color .32s ease;
    transform:translateY(0);
    will-change:transform;
}

@media (hover:hover) and (pointer:fine){
    [class$="-card"]:hover,
    [class*="-card "]:hover{
        transform:translateY(-6px);
        box-shadow:0 14px 30px rgba(0,0,0,.14);
    }

    [class$="-card"] img,
    [class*="-card "] img{
        transition:transform .45s cubic-bezier(.2,.7,.3,1);
    }

    [class$="-card"]:hover img,
    [class*="-card "]:hover img{
        transform:scale(1.025);
    }
}

@media (prefers-reduced-motion:reduce){
    [class$="-card"],
    [class*="-card "],
    [class$="-card"] img,
    [class*="-card "] img{
        transition:none;
    }
}

/* Responsive */
@media(max-width:1100px){
    .desktop-nav{display:none;}
    .menu-button{display:block;}
}

@media(max-width:1000px){
    .home-intro{grid-template-columns:1fr;gap:40px;padding:50px 30px;}
    .home-intro-content{max-width:none;}
}

@media(max-width:900px){
    .header-hero{min-height:200px;}
    .header-hero-content{padding:34px 30px;}
    .header-hero::after{right:-100px;width:48%;}
    .header-hero-decoration{width:39%;}
    .page-intro{grid-template-columns:1fr;gap:30px;padding:42px 28px;}
    .page-intro-content{max-width:none;}
    .trainer-grid,.info-grid{grid-template-columns:1fr;}
    .lildragon-feature{grid-template-columns:1fr;gap:30px;padding:28px;}
    .contact-layout{grid-template-columns:1fr;}
}

@media(max-width:800px){
    .membership-grid{grid-template-columns:1fr;}
    .footer-inner{grid-template-columns:1fr;gap:24px;}
}

@media(max-width:700px){
    .home-intro{display:block;padding:35px 18px;}
    .home-intro-image{margin-bottom:32px;}
    .home-intro-image img{max-width:330px;}
    .home-intro-content h1{font-size:32px;}
    .home-lead{font-size:17px;}
    .home-actions{display:block;}
    .primary-button,.secondary-button{display:block;width:100%;margin-bottom:10px;text-align:center;}
    .home-section{padding:50px 10px;}
    .home-card-grid{grid-template-columns:1fr;gap:24px;}
    .home-card-image img{height:auto;}
    .home-cta{padding:10px 10px 50px;}
    .home-cta-content{padding:35px 20px;}
    .page-intro{display:block;padding:32px 16px;}
    .page-intro-image{margin-bottom:28px;}
    .page-intro-image img{max-width:400px;}
    .page-intro-content h1{font-size:32px;}
    .content-section{padding:40px 10px 10px;}
    .training-grid{grid-template-columns:1fr;gap:22px;}
    .training-card{padding:20px 17px;}
}

@media(max-width:600px){
    body{font-size:15px;}
    .site-content{padding:18px 8px 0;}
    .main-header{min-height:70px;padding:0 12px;}
    .header-logo{width:135px;max-height:58px;}
    .logo-link{padding:5px 6px;}
    .header-hero{min-height:175px;}
    .header-hero-content{padding:28px 18px;}
    .header-hero-kicker{font-size:11px;}
    .header-hero-title{font-size:32px;}
    .header-hero-subtitle{margin-top:7px;font-size:15px;}
    .header-hero::after{right:-120px;width:54%;}
    .header-hero-decoration{display:none;}
    .trainer-card{display:block;padding:22px 18px;text-align:center;}
    .trainer-image{margin-bottom:18px;}
    .trainer-image img{width:160px;height:160px;margin:0 auto;}
    .trainer-content h3{font-size:20px;}
    .membership-card{min-height:0;}
    .membership-card-content{padding:24px 16px;}
    .pdf-button,.secondary-action-button{width:100%;max-width:300px;text-align:center;}
    .info-card{padding:22px 17px;}
    .info-card h2{font-size:21px;}
    .hanmookwan-highlight{margin-top:25px;padding:24px 18px;}
    .hanmookwan-highlight h2{font-size:24px;}
    .lildragon-feature{display:block;margin-top:25px;padding:18px;}
    .lildragon-feature-image{margin-bottom:26px;}
    .lildragon-feature-image img{max-height:none;}
    .lildragon-feature-content h2{font-size:24px;}
    .faq-question{padding:15px;font-size:16px;}
    .faq-answer{padding:17px 15px;}
    .contact-intro{padding:40px 16px 20px;}
    .contact-section{padding:15px 10px 25px;}
    .contact-form-wrapper{padding:22px 16px;}
    .form-row{grid-template-columns:1fr;gap:0;}
    .contact-info-card{padding:22px 18px;}
    .legal-page{padding:40px 16px 20px;}
    .legal-header{margin-bottom:32px;padding-bottom:22px;}
    .legal-content h2{margin-top:34px;font-size:21px;}
    .thank-you-page{min-height:320px;padding:40px 10px;}
    .thank-you-box{padding:35px 18px;}
    .thank-you-box p{font-size:16px;}
    .page-cta{padding:20px 10px 30px;}
    .page-cta-content{padding:32px 18px;}
    .site-footer{margin-top:72px;}
    .footer-inner{padding:30px 18px;}
}

/* =========================================================
   MOBILE NAVIGATION
========================================================= */

.mobile-sidebar{
    position:fixed;

    top:0;
    left:-320px;

    display:flex;
    flex-direction:column;

    width:300px;
    max-width:88vw;
    height:100%;

    overflow-y:auto;

    background:#fff;
    color:#222;

    z-index:2000;

    box-shadow:6px 0 24px rgba(0,0,0,.18);

    transition:left .28s ease;
}

.mobile-sidebar.open{
    left:0;
}

/* Kopfbereich */

.mobile-sidebar-header{
    display:flex;
    align-items:center;
    justify-content:space-between;

    min-height:82px;

    padding:10px 14px 10px 18px;

    border-bottom:1px solid #e3e3e3;
}

.mobile-sidebar-logo-link{
    display:block;

    padding:0;

    background:transparent;

    text-decoration:none;
}

.mobile-sidebar-logo{
    display:block;

    width:140px;
    max-height:62px;

    object-fit:contain;
}

/* Schließen */

.mobile-close{
    display:flex;
    align-items:center;
    justify-content:center;

    width:42px;
    height:42px;

    padding:0;

    border:0;
    border-radius:50%;

    background:#f0f0f0;
    color:#333;

    font-size:20px;

    cursor:pointer;

    transition:background .2s ease;
}

.mobile-close:hover{
    background:#ddd;
}

/* Navigation */

.mobile-nav-links{
    padding:18px 12px;
}

.mobile-nav-links a{
    display:flex;
    align-items:center;

    gap:14px;

    width:100%;

    margin-bottom:4px;
    padding:13px 14px;

    border-radius:6px;

    color:#333;

    font-size:15px;
    font-weight:600;

    text-decoration:none;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.mobile-nav-links a:hover{
    background:#f1f1f1;

    color:#111;

    transform:translateX(2px);
}

.mobile-nav-links a.active{
    background:#222;

    color:#fff;
}

.mobile-nav-links i{
    display:flex;
    align-items:center;
    justify-content:center;

    width:22px;

    color:#777;

    font-size:16px;
}

.mobile-nav-links a.active i{
    color:#fff;
}

/* Footer */

.mobile-sidebar-footer{
    margin-top:auto;

    padding:20px 24px 24px;

    border-top:1px solid #e3e3e3;

    background:#f5f5f5;
}

.mobile-sidebar-name{
    margin-bottom:2px;

    font-size:14px;
    font-weight:700;
}

.mobile-sidebar-subtitle{
    color:#777;

    font-size:12px;
}

/* Smartphone */

@media(max-width:600px){

    .mobile-sidebar{
        width:280px;
    }

    .mobile-sidebar-header{
        min-height:70px;

        padding:8px 12px 8px 16px;
    }

    .mobile-sidebar-logo{
        width:125px;
    }

    .mobile-nav-links{
        padding:14px 10px;
    }

    .mobile-nav-links a{
        padding:12px 13px;

        font-size:14px;
    }

}
/* Eigene W3-ähnliche Zoom-Animation */
.w3-animate-zoom {
    animation: animatezoom 0.6s ease;
}

@keyframes animatezoom {
    from {
        transform: scale(0);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}