@font-face { font-family: 'Eurostile';       src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'euro';             src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'EURO-NEU';         src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Muli';             src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Lato';             src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Gentium Basic';    src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Sans';    src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Open Sans';        src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Roboto Mono';      src: url('../fonts/eurostile.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }

                                                                      
                           
                                                                         

:root {
                                                         
    --gos-bg:             #d5d8da;                                                                       
    --gos-content-bg:     #ffffff;                                               
    --gos-surface:        #f2f2f2;                                               
    --gos-accent:         #faca30;                                               
    --gos-accent-hover:   #e0b729;                                               
    --gos-accent-dark:    #e0b741;                                               
    --gos-blue:           #39a4d2;                                               
    --gos-blue-hover:     #095fbb;                                              
    --gos-text:           #111111;                                               
    --gos-text-secondary: #424242;                                               
    --gos-text-muted:     #6a6b6c;                                               
    --gos-text-light:     #ffffff;                                               
    --gos-tabs-active:    #ffffff;                                               
    --gos-tabs-inactive:  #f2f2f2;                                               
    --gos-border:         #cccccc;                                               
    --gos-border-light:   #e0e0e0;                                               
    --gos-header-bg:      rgb(140, 150, 157);                                            
    --gos-footer-bg:      #24272a;                                               
    --gos-error:          #ff5f64;                                               
    --gos-success:        #0ab059;                                               

                    
    --gos-font:           'Eurostile', sans-serif;

                
    --gos-content-max:    1080px;
    --gos-gap:            1.5rem;
    --gos-radius:         4px;
    --gos-btn-radius:     100px;
}

                                                                      
                  
                                                                         

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

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body,
h1, h2, h3, h4, h5, h6,
p, ul, ol, li,
figure, figcaption,
blockquote,
dl, dd {
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--gos-font);
    font-size: 18px;
    line-height: 1.5;
    color: var(--gos-text);
    background-color: var(--gos-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

                                                                   
.thrive-layout-5375 #wrapper {
    background-color: #24272a;
}

img,
video {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--gos-blue);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover,
a:focus {
    color: var(--gos-accent);
}

ul, ol {
    list-style: none;
}

                                                                      
                             
                                                                         

                                                              
.site-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

                                                                         
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: var(--gos-header-bg);
    border-radius: 6px;
    margin: 10px;
}

                                                   
.site-content {
    flex: 1;
    padding: var(--gos-gap) 0;
}

                                                   
.site-footer {
    background-color: var(--gos-footer-bg);                       
    border-top: 2px solid var(--gos-accent);
    padding: 2rem 0;
    color: #cccccc;
    font-size: 0.875rem;
}

.site-footer a {
    color: #cccccc;
}

.site-footer a:hover {
    color: var(--gos-accent);
}

                                                           
.content-wrapper {
    width: 100%;
    max-width: var(--gos-content-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--gos-gap);
    padding-right: var(--gos-gap);
}

                                
.main-nav {
    padding: 0.75rem 0;
}

                                                                      
                                                    
                                                                         

h1, h2, h3, h4, h5, h6 {
    font-family: var(--gos-font);
    font-weight: 700;
    line-height: 1.2;
    color: var(--gos-text);                         
}

h1 { font-size: 2rem;    margin-bottom: 1rem;    }
h2 { font-size: 1.625rem; margin-bottom: 0.875rem; }
h3 { font-size: 1.375rem; margin-bottom: 0.75rem;  }
h4 { font-size: 1.125rem; margin-bottom: 0.625rem; }
h5 { font-size: 1rem;     margin-bottom: 0.5rem;   }
h6 { font-size: 0.875rem; margin-bottom: 0.5rem;   }

p {
    margin-bottom: 1rem;
    color: var(--gos-text);
}

.entry-content p:last-child {
    margin-bottom: 0;
}

                                                                      
                       
                                                                         

                                                                           
.kurs-header-section {
    background: rgb(250, 202, 48);
    padding: 2rem 0;
    margin-bottom: 3.5rem;
}

                                                                
.kurs-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    max-width: var(--gos-content-max);
    margin: 0 auto;
    padding: 0 var(--gos-gap);
}

                                             
.kurs-header .kurs-icon-link {
    flex-shrink: 0;
    display: block;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.kurs-header .kurs-icon-link:hover {
    opacity: 0.85;
    transform: scale(1.05);
}

                              
.kurs-header .kurs-icon {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    object-fit: contain;
}

                        
.kurs-header .kurs-title-area {
    flex: 0 1 auto;
}

                                                                                     
.kurs-header .kurs-divider {
    border: none;
    border-top: 3px solid var(--gos-text);
    margin: 0;
    max-width: 500px;
}

                
.kurs-header .kurs-title {
    font-size: 1.75rem;
    font-weight: 400;
    margin: 0.75rem 0;
    color: var(--gos-text);
}

                                                  
.kurs-content {
    background-color: var(--gos-content-bg);
    border-radius: var(--gos-radius);
    padding: var(--gos-gap);
}

                                                                      
             
                                                                         

                               
.btn {
    display: inline-block;
    font-family: var(--gos-font);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.75rem 1.5rem;
    border: 2px solid transparent;
    border-radius: var(--gos-radius);
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    user-select: none;
}

                                                        
.btn-primary {
    background-color: var(--gos-accent);
    color: var(--gos-text);                                
    border-color: var(--gos-accent);
    border-radius: var(--gos-btn-radius);
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--gos-accent-hover);
    border-color: var(--gos-accent-hover);
    color: var(--gos-text);
}

                                 
.btn-secondary {
    background-color: var(--gos-blue);
    color: var(--gos-text-light);
    border-color: var(--gos-blue);
    border-radius: var(--gos-btn-radius);
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--gos-blue-hover);
    border-color: var(--gos-blue-hover);
    color: var(--gos-text-light);
}

                                                                      
                                         
                                                                         

                                                                             
.video-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gos-gap);
    margin-bottom: var(--gos-gap);
}

.video-grid > * {
    min-width: 0;
}

                                                                                  
.video-grid .video-thumb {
    border: 1px solid #ccc;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 20px 25px;
    overflow: hidden;
}

.video-grid .video-thumb img {
    display: block;
    max-width: 100%;
    max-height: 160px;
    width: auto;
    height: auto;
}

                                                                           
.video-gallery {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gos-gap);
    margin-bottom: var(--gos-gap);
}

.video-gallery .video-thumb:not(.gos-source-preview) {
    max-width: 100%;
    margin: 0 auto;
    border: 1px solid var(--gos-border-light);
    padding: 10px 15px;
    text-align: center;
}

.video-gallery .video-thumb:not(.gos-source-preview) img {
    display: inline-block;
                                                                      
                                                                                 
    width: 100%;
    max-width: 640px;
    height: auto;
    max-height: 500px;
    object-fit: contain;
}

:where(.video-gallery) .gos-source-preview {
    max-width: 100%;
    margin: 0 auto 20px;
    padding: 0;
    border: 0;
}

:where(.video-gallery .gos-source-preview) .tve_image_frame,
:where(.video-gallery .gos-source-preview) img {
    display: block;
    width: 100%;
    height: auto;
}

.video-gallery:has(> .gos-source-preview) {
    display: block;
    margin-bottom: 0;
}

                                                                      
                                                     
                                                                         

                                                  
.kurs-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin-top: 2rem;
    margin-bottom: var(--gos-gap);
}

                                                                             
.kurs-buttons .btn {
    text-transform: none;
    letter-spacing: normal;
}

.kurs-buttons .btn-primary {
    display: block;
    width: 50%;
    min-width: 300px;
    text-align: center;
    font-size: 1.125rem;
    padding: 1rem 2rem;
}

                                           
.faq-bubble {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border: 2px solid var(--gos-accent);
    border-radius: var(--gos-btn-radius);
    color: var(--gos-text);
    text-decoration: none;
    margin: 0 auto;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.faq-bubble:hover {
    background-color: var(--gos-accent);
    color: var(--gos-text);
}

.faq-bubble-icon {
    color: var(--gos-accent);
    flex-shrink: 0;
}

.faq-bubble:hover .faq-bubble-icon {
    color: var(--gos-text);
}

.faq-bubble-text {
    text-align: left;
    font-size: 0.9375rem;
    line-height: 1.4;
}

.faq-bubble-text small {
    color: var(--gos-text-secondary);
    font-size: 0.8125rem;
}

                                                                      
               
                                                                         

                                                  
.download-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: var(--gos-gap);
}

                                                                             
.download-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--gos-border-light);
    border-radius: 0;
    color: var(--gos-text);
    text-decoration: none;
    font-family: var(--gos-font);
    font-size: 0.9375rem;
    transition: color 0.2s ease;
}

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

.download-item:hover,
.download-item:focus {
    color: var(--gos-accent-dark);
}

                                                 
.download-item::before {
    content: '›';
    flex-shrink: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--gos-text-secondary);
    width: 16px;
    text-align: center;
}

                                                                      
                
                                                                         

                                    
@media (max-width: 1024px) {
    h1 { font-size: 1.75rem; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.25rem; }

    .kurs-header .kurs-icon {
        width: 80px;
        height: 80px;
    }

    .kurs-header .kurs-title {
        font-size: 1.5rem;
    }
}

                             
@media (max-width: 767px) {
    :root {
        --gos-gap: 1rem;
    }

    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.25rem; }
    h3 { font-size: 1.125rem; }

                                       
    .kurs-header-section {
        padding: 1.5rem 0;
    }

                                                 
    .kurs-header {
        flex-direction: column;
        text-align: center;
    }

    .kurs-header .kurs-icon {
        width: 60px;
        height: 60px;
    }

    .kurs-header .kurs-title {
        font-size: 1.375rem;
    }

                                                
    .video-grid {
        grid-template-columns: 1fr;
    }

    .video-gallery {
        grid-template-columns: repeat(2, 1fr);
    }

                                
    .kurs-buttons {
        flex-direction: column;
    }

                                         
    .btn {
        display: block;
        width: 100%;
    }
}

                                            
@media (max-width: 299px) {
    body {
        font-size: 14px;
    }

    h1 { font-size: 1.25rem; }

    .content-wrapper {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .kurs-header .kurs-icon {
        width: 48px;
        height: 48px;
    }
}

                                                                      
                        
                                                                         

                                                                
.nav-inner {
    display: flex;
    align-items: center;
    justify-content: center;
}

                                                   
.site-logo {
    font-family: var(--gos-font);
    font-weight: 700;
    font-size: 1.125rem;
    color: var(--gos-accent);
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}

.site-logo:hover,
.site-logo:focus {
    color: var(--gos-text-light);
}

                        
.nav-menu {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-menu li {
    margin: 0;
    padding: 0;
}

.nav-menu a {
    display: block;
    font-family: var(--gos-font);
    font-size: 1.1875rem;
    font-weight: 700;
    color: var(--gos-accent);
    text-decoration: none;
    text-transform: capitalize;
    padding: 0.75rem 0.375rem;
    border-radius: var(--gos-radius);
    transition: color 0.25s ease, background-color 0.25s ease;
    white-space: nowrap;
}

@media (min-width: 768px) {
    .nav-menu { gap: 19px; }
    .nav-menu > li > a { font: 500 19px/38px 'Roboto Mono'; padding: 0; }
    .is-thrive-landing .main-nav { padding: 0; }
    .is-thrive-landing .nav-menu { gap: 0; }
    .is-thrive-landing .nav-menu > li { display: block; margin: 0 6px; padding: 12px 3.5px; }
    .is-thrive-landing .nav-menu > li:first-child { margin-left: 0 !important; }
    .is-thrive-landing .nav-menu > li:last-child { margin-right: 0 !important; }
    .is-thrive-landing .dropdown-menu { left: 0; transform: none; width: max-content; min-width: fit-content; border: 1px solid rgb(180,180,180); box-shadow: none; font: 500 16px/28px euro; text-align: center; }
    .is-thrive-landing .dropdown-menu li { display: block; margin: 0; padding: 10px 0; border: 0; background: none; color: rgba(10,10,10,.85); text-align: center; }
    .is-thrive-landing .dropdown-menu a { display: flex; align-items: center; justify-content: center; margin: 0; padding: 2px 15px; border: 0; border-radius: 0; font: 600 16px/21.6px 'Open Sans'; }
}

#tcb_landing_page .site-header .nav-menu > li { font: 500 16px/28px euro; }
#tcb_landing_page .site-header .dropdown-menu li { font: 600 16px/28px euro; }

.nav-menu a:hover,
.nav-menu a:focus {
    color: var(--gos-text-light);
    background-color: rgba(255, 255, 255, 0.1);
}

                  
.nav-menu .nav-active a,
.nav-menu a[aria-current="page"] {
    font-weight: 700;
    color: var(--gos-text-light);
}

                  
.nav-logout a {
    color: var(--gos-accent);
    font-weight: 500;
}

.nav-logout a:hover,
.nav-logout a:focus {
    color: var(--gos-text-light);
    background-color: rgba(255, 255, 255, 0.1);
}

                                                                        
.nav-stufen-label a {
    font-family: var(--gos-font);
    font-size: 1.1875rem;
    font-weight: 700;
    color: var(--gos-accent);
    padding: 0.75rem 0.375rem;
    display: block;
    text-decoration: none;
    transition: color 0.25s ease, background-color 0.25s ease;
}

.nav-stufen-label a:hover,
.nav-stufen-label a:focus {
    color: var(--gos-text-light);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--gos-radius);
}

                                        
.nav-dropdown {
    position: relative;
}

.nav-dropdown > a {
    cursor: pointer;
}

.nav-arrow {
    font-size: 0.6em;
    margin-left: 1px;
    vertical-align: middle;
}

.is-thrive-landing .nav-dropdown > a { display: flex; align-items: center; }
.is-thrive-landing .nav-arrow { display: inline-flex; align-items: center; width: 19px; height: 19px; margin-left: 8px; font-size: inherit; line-height: 1; vertical-align: baseline; flex-shrink: 0; }
.is-thrive-landing .nav-arrow svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.thrive-legacy-page .thrv_responsive_video { box-sizing: border-box; }

                                                                                
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgb(90, 94, 99);
    border: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 90px;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.nav-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
}

.dropdown-menu li {
    margin: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.dropdown-menu li:last-child {
    border-bottom: none;
}

.dropdown-menu a {
    display: block;
    padding: 0.6rem 1rem;
    color: var(--gos-accent);
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    white-space: nowrap;
    text-align: center;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.dropdown-menu a:hover {
    background-color: rgba(255, 255, 255, 0.15);
    color: var(--gos-text-light);
}

                                                                      
                                                               
                                                                         

.ueber-schule-section {
    background: var(--gos-accent);
    padding: 3rem 0;
    margin-top: 2rem;
}

.ueber-schule-icon {
    display: block;
    width: 80px;
    height: 80px;
    object-fit: contain;
    margin: 0 auto 1rem;
}

.ueber-schule-title {
    font-size: 1.375rem;
    font-weight: 400;
    margin-bottom: 1.5rem;
    color: var(--gos-text);
}

.ueber-schule-section p {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: var(--gos-text);
    max-width: 800px;
    margin: 0 auto 1rem;
    text-align: left;
}

                                                
.nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    -webkit-tap-highlight-color: transparent;
}

.hamburger,
.hamburger::before,
.hamburger::after {
    display: block;
    width: 24px;
    height: 2px;
    background-color: var(--gos-text);                       
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.hamburger {
    position: relative;
}

.hamburger::before,
.hamburger::after {
    content: '';
    position: absolute;
    left: 0;
}

.hamburger::before {
    top: -7px;
}

.hamburger::after {
    top: 7px;
}

                             
.nav-toggle[aria-expanded="true"] .hamburger {
    background-color: transparent;
}

.nav-toggle[aria-expanded="true"] .hamburger::before {
    top: 0;
    transform: rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .hamburger::after {
    top: 0;
    transform: rotate(-45deg);
}

                                                                      
             
                                                                         

.footer-links {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    margin-bottom: 0.75rem;
}

.footer-links a {
    color: #999999;
    font-size: 0.875rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.2s ease;
}

.footer-links a:hover,
.footer-links a:focus {
    color: var(--gos-accent);
}

.footer-copyright {
    text-align: center;
    font-size: 0.8125rem;
    color: #777777;
    margin: 0;
}

                                                                      
                              
                                                                         

                                  
@media (max-width: 1024px) {
    .nav-menu a {
        font-size: 0.8125rem;
        padding: 0.4rem 0.5rem;
    }

    .site-logo {
        font-size: 1.125rem;
    }
}

                                         
@media (max-width: 767px) {
    .nav-toggle {
        display: block;
    }

    .nav-menu {
        display: none;
        flex-direction: column;
        align-items: stretch;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--gos-header-bg);            
        border-bottom: 2px solid var(--gos-accent-dark);
        padding: 0.5rem var(--gos-gap);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        z-index: 99;
    }

    .nav-menu.is-open {
        display: flex;
    }

    .nav-menu a {
        font-size: 1rem;
        padding: 0.75rem 0.5rem;
        border-bottom: 1px solid var(--gos-border);
    }

    .nav-menu li:last-child a {
        border-bottom: none;
    }

                                                                   
    .main-nav {
        position: relative;
    }

                                                        
    .footer-links {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }
}

                                                                      
                              
                                                                         

.klassenzimmer {
    padding-bottom: var(--gos-gap);
}

.klassenzimmer-intro {
    text-align: center;
    font-size: 1.25rem;
    color: var(--gos-text);
    margin: 1rem 0 2rem;
}

.klassenzimmer-section {
    margin-bottom: 2.5rem;
}

.klassenzimmer-section:last-child {
    margin-bottom: 0;
}

.klassenzimmer-section h2 {
    font-size: 1.625rem;
    font-weight: 700;
    color: var(--gos-accent);
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--gos-border);
    margin-bottom: 1rem;
}

.klassenzimmer-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.klassenzimmer-list li {
    margin: 0;
    padding: 0;
}

.klassenzimmer-list a {
    display: block;
    font-family: var(--gos-font);
    font-size: 1.375rem;
    color: var(--gos-accent);
    text-decoration: none;
    padding: 0.625rem 1rem;
    border-radius: var(--gos-radius);
    border: 1px solid var(--gos-border);
    background-color: var(--gos-content-bg);
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.klassenzimmer-list a:hover,
.klassenzimmer-list a:focus {
    background-color: rgba(250, 202, 48, 0.1);
    border-color: var(--gos-accent);
    color: var(--gos-text);
}

                                                                      
                   
                                                                         

.site-error {
    text-align: center;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    padding: 4rem 0;
}

.site-error h1 {
    margin-bottom: 1rem;
}

.site-error p {
    color: var(--gos-text-secondary);
    font-size: 1.125rem;
    margin-bottom: 2rem;
}

.site-error-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

                                                                      
                  
                                                                         

.kein-zugang {
    text-align: center;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    padding: 3rem 0;
}

.kein-zugang h1 {
    margin-bottom: 1rem;
}

.kein-zugang p {
    color: var(--gos-text-secondary);
    font-size: 1.125rem;
    margin-bottom: 0.75rem;
}

.kein-zugang p:last-of-type {
    margin-bottom: 2rem;
}

                           
.kein-zugang-icon {
    margin-bottom: 1.5rem;
}

.lock-icon {
    display: inline-block;
    position: relative;
    width: 48px;
    height: 40px;
    background-color: var(--gos-accent);
    border-radius: var(--gos-radius);
}

.lock-icon::before {
    content: '';
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 26px;
    border: 4px solid var(--gos-accent);
    border-radius: 14px 14px 0 0;
    border-bottom: none;
    background-color: transparent;
}

.lock-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background-color: var(--gos-bg);
    border-radius: 50%;
}

                     
.kein-zugang-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

                                                                      
                  
                                                                         

.login-page {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 0;
    padding: 2rem 0 3rem;
}

.login-box {
    width: 100%;
    max-width: 400px;
    padding: 2rem;
    background-color: var(--gos-content-bg);
    border-radius: var(--gos-radius);
    border: 1px solid var(--gos-border);
}

.login-box h1 {
    text-align: center;
    margin-bottom: 1.5rem;
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form-field label {
    display: block;
    font-family: var(--gos-font);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gos-text-secondary);
    margin-bottom: 0.375rem;
}

.form-field input[type="text"],
.form-field input[type="password"],
.form-field input[type="email"] {
    width: 100%;
    padding: 0.75rem;
    font-family: var(--gos-font);
    font-size: 1rem;
    color: var(--gos-text);
    background-color: #ffffff;
    border: 2px solid rgba(0, 0, 0, 0.12);
    border-radius: var(--gos-radius);
    outline: none;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6), inset 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-field input[type="text"]:focus,
.form-field input[type="password"]:focus,
.form-field input[type="email"]:focus {
    border-color: var(--gos-accent);
    box-shadow: 0 0 0 3px rgba(250, 202, 48, 0.25), inset 0 1px 2px rgba(0, 0, 0, 0.04);
}

.form-remember label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: var(--gos-text-secondary);
    cursor: pointer;
}

.form-remember input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--gos-accent);
    cursor: pointer;
}

.login-error {
    background-color: rgba(255, 95, 100, 0.12);
    color: var(--gos-accent);
    padding: 0.75rem 1rem;
    border-radius: var(--gos-radius);
    border: 1px solid rgba(255, 95, 100, 0.3);
    font-size: 0.9375rem;
    margin-bottom: 1rem;
    text-align: center;
}

.btn-full {
    display: block;
    width: 100%;
}

.login-links {
    text-align: center;
    margin-top: 1.25rem;
    font-size: 0.875rem;
}

.login-links a {
    color: var(--gos-text-secondary);
}

.login-links a:hover,
.login-links a:focus {
    color: var(--gos-accent);
}

                                                                      
                      
                                                                         

.stufen-uebersicht {
    padding-bottom: var(--gos-gap);
}

.stufen-uebersicht h1 {
    text-align: center;
    margin-bottom: 2rem;
}

.stufen-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gos-gap);
}

.stufe-card {
    display: block;
    padding: 2rem 1.5rem;
    background-color: var(--gos-content-bg);
    border: 1px solid var(--gos-border);
    border-radius: var(--gos-radius);
    text-decoration: none;
    text-align: center;
    transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.stufe-card:hover,
.stufe-card:focus {
    border-color: var(--gos-accent);
    background-color: rgba(250, 202, 48, 0.1);
    transform: translateY(-2px);
}

.stufe-card h2 {
    font-size: 1.5rem;
    color: var(--gos-accent);
    margin-bottom: 0.5rem;
    transition: color 0.2s ease;
}

.stufe-card:hover h2 {
    color: var(--gos-text);
}

.stufe-card p {
    font-size: 1rem;
    color: var(--gos-text-secondary);
    margin-bottom: 0;
    transition: color 0.2s ease;
}

.stufe-card:hover p {
    color: var(--gos-text);
}

                                                                      
                          
                                                                         

.vokabeln-page {
    padding-bottom: var(--gos-gap);
}

.vokabeln-page h1 {
    margin-bottom: 1.5rem;
}

                                                                      
                                 
                                                                         

                                    
@media (max-width: 1024px) {
                           
    .stufen-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .klassenzimmer-list a {
        font-size: 1.25rem;
    }
}

                             
@media (max-width: 767px) {
                          
    .stufen-grid {
        grid-template-columns: 1fr;
    }

    .stufe-card {
        padding: 1.5rem 1rem;
    }

                       
    .klassenzimmer-section {
        margin-bottom: 2rem;
    }

    .klassenzimmer-list a {
        font-size: 1.125rem;
        padding: 0.5rem 0.75rem;
    }

                      
    .site-error {
        padding: 2.5rem 0;
    }

    .site-error-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .site-error-actions .btn {
        text-align: center;
    }

                     
    .kein-zugang {
        padding: 2rem 0;
    }

    .kein-zugang-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .kein-zugang-actions .btn {
        text-align: center;
    }

               
    .login-page {
        min-height: 0;
        padding: 2rem 0 2.5rem;
    }

    .login-box {
        padding: 1.5rem;
        border: none;
        background-color: transparent;
    }
}

                                                                      
                                                          
                                                           
                                        
                                                                         

                                                                
.thrive-legacy-page {
    background-color: transparent;
}

.is-thrive-landing { font-size: 16px; line-height: 1.5; color: rgba(10, 10, 10, 0.85); }

.home.is-thrive-landing,
.home.is-thrive-landing .thrive-legacy-page {
    background-color: #fff;
}

.is-thrive-landing .site-content {
    padding: 0;
}

.page-slug-vokabeln .site-content,
.page-slug-video .site-content,
.page-slug-vokabeln .thrive-legacy-page,
.page-slug-video .thrive-legacy-page,
.page-slug-vokabeln #tcb_landing_page,
.page-slug-video #tcb_landing_page,
.page-slug-vokabeln #tcb_landing_page > .thrv-content-block,
.page-slug-video #tcb_landing_page > .thrv-content-block,
.page-slug-vokabeln #tcb_landing_page > .thrv-page-section,
.page-slug-video #tcb_landing_page > .thrv-page-section {
    background-color: var(--gos-bg) !important;
    background-image: none !important;
}

.page-slug-vokabeln #tcb_landing_page > .thrv-content-block,
.page-slug-video #tcb_landing_page > .thrv-content-block {
    border-color: transparent !important;
    box-shadow: none !important;
}

.thrive-legacy-page .thrv-inline-text,
.thrive-legacy-page .wp-caption-text {
    font-family: var(--gos-font) !important;
}

                                                                       
.is-thrive-landing .site-footer {
    display: none;
}

.is-thrive-landing .source-footer { display: block; }
.site-footer.source-footer { border: 0; padding: 22px 20px 20px; background: transparent; color: #000; }
.source-footer .footer-links { gap: 30px; margin: 0 0 12px; }
.source-footer .footer-links a { font: 700 15px/30px Eurostile; color: #000; letter-spacing: normal; }
.source-footer .footer-copyright { font: 15px/25.5px Eurostile; color: #000; padding-bottom: 24px; }

                                          
                                                                   
.thrive-legacy-page h1,
.thrive-legacy-page h2,
.thrive-legacy-page h3,
.thrive-legacy-page h4,
.thrive-legacy-page h5,
.thrive-legacy-page h6 {
    font-family: var(--gos-font);
    font-weight: revert;
    font-size: revert;
    color: revert;
    line-height: revert;
    margin: revert;
    padding: revert;
}

.thrive-legacy-page p {
    color: revert;
    margin: revert;
}

body.gos-professional .gos-native-login input,
body.gos-professional .gos-native-login button,
body.gos-professional .gos-room-filter select,
body.gos-professional .gos-site-menu > summary {
    font-family: var(--gos-font);
}

.thrive-legacy-page a {
    color: revert;
    transition: revert;
}

.thrive-legacy-page a:hover,
.thrive-legacy-page a:focus {
    color: revert;
}

.thrive-legacy-page ul,
.thrive-legacy-page ol {
    list-style: revert;
    margin: revert;
    padding: revert;
}

.thrive-legacy-page ul > li:not(.thrv-styled-list-item, .thrive-dynamic-styled-list-item),
.thrive-legacy-page ol > li:not(.thrv-styled-list-item, .thrive-dynamic-styled-list-item) {
    margin-left: 1.5em;
}

.thrive-legacy-page .thrv_tabs_shortcode .tve_scT[data-tve-tags-size="relative"] > ul > li.tve_tab_title_item {
    flex: 0 1 auto;
    min-width: 0;
}

.thrive-legacy-page .thrv_tabs_shortcode .tve_scT[data-tve-tags-size="relative"] .tve_tab_title { width: auto; }

@media (min-width: 768px) and (max-width: 1023px) {
    .thrive-legacy-page .thrv-tabbed-content { max-width: 100% !important; }
}

.gos-original-menu-icons { display: block; width: 33px; height: 33px; line-height: 0; }
.gos-original-menu-icons img { display: block; width: 33px; height: 33px; }
.nav-toggle[aria-expanded="false"] .gos-menu-close-icon,
.nav-toggle[aria-expanded="true"] .gos-menu-open-icon { display: none; }

@media (max-width: 767px) {
    .is-thrive-landing .site-header { margin: 0; border-radius: 0; background: none; position: relative; }
    .is-thrive-landing .main-nav { padding: 10px 0; }
    .is-thrive-landing .nav-inner { padding: 0; }
    .is-thrive-landing .nav-toggle { font-size: 33px; line-height: 0; padding: 0.3em; }
    .is-thrive-landing .nav-menu { top: calc(100% - 10px); padding: 0; border: 0; box-shadow: none; gap: 0; align-items: center; justify-content: center; }
    .is-thrive-landing .nav-menu > li { display: block; width: 100%; padding: 8px 20px; text-align: center; font: 500 16px/28px euro; }
    .is-thrive-landing .nav-menu > .nav-stufen-label { background: rgb(90, 94, 99); }
    .is-thrive-landing .nav-menu > li > a { display: inline-flex; align-items: center; font: 500 19px/38px 'Roboto Mono'; padding: 10px 38px; border: 0; }
    .is-thrive-landing .nav-menu { max-height: 80vh; overflow: hidden auto; justify-content: flex-start; }
    .is-thrive-landing .nav-dropdown > a { position: relative; }
    .is-thrive-landing .nav-arrow { position: absolute; top: 0; right: 0.8rem; height: 100%; }
    .is-thrive-landing .nav-arrow svg { width: 19px; height: 19px; }
    .nav-menu .dropdown-menu { display: none; position: static; top: auto; left: auto; transform: none; width: 100%; min-width: 0; opacity: 1; visibility: visible; }
    .nav-menu .is-submenu-open > .dropdown-menu { display: block; }
    .is-submenu-open > a .nav-arrow svg { transform: rotate(180deg); }
    .is-thrive-landing .dropdown-menu { border: 1px solid rgb(180,180,180); box-shadow: none; }
    .is-thrive-landing .dropdown-menu li { display: block; margin: 0; padding: 10px 0; border: 0; background: rgb(250,250,250); font: 600 16px/28px euro; text-align: center; }
    .is-thrive-landing .dropdown-menu a { display: inline-flex; align-items: center; margin: 0; padding: 10px 32px; border: 0; border-radius: 0; font: 600 16px/21.6px 'Open Sans'; }
}

.gos-original-footer .thrv_widget_menu[data-tve-allhoriz="1"] {
    position: relative;
    padding: 0;
}

.gos-original-footer .thrv_widget_menu[data-tve-allhoriz="1"] .tve-m-trigger {
    display: none;
}

.gos-original-footer .thrv_widget_menu[data-tve-allhoriz="1"] .tve_w_menu {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.gos-original-footer .thrv_widget_menu[data-tve-allhoriz="1"] .tve_w_menu > li {
    display: block;
    position: relative;
    padding: 2px 0;
}

#thrive-footer .thrv_widget_menu.thrv_wrapper[data-tve-allhoriz="1"] ul.tve_w_menu > li:first-child { margin-left: 0 !important; }
#thrive-footer .thrv_widget_menu.thrv_wrapper[data-tve-allhoriz="1"] ul.tve_w_menu > li:last-child { margin-right: 0 !important; }
.gos-original-footer .thrv_widget_menu.thrv_wrapper ul.tve_w_menu li > a { display: flex; }
.gos-original-footer .thrv_widget_menu.thrv_wrapper ul.tve_w_menu li > a:not(.tcb-logo) { line-height: 2em; }

#tcb_landing_page .gos-original-footer .thrv_wrapper,
#tcb_landing_page.gos-original-footer .thrv_wrapper { box-sizing: border-box; }

.thrive-legacy-page img {
    max-width: 100%;
    height: auto;
}

                                       
.thrive-group-edit-config,
.thrive-local-colors-config,
.thrive-colors-palette-config {
    display: none !important;
}

#cookie-consent button {
    font-family: inherit;
    line-height: 20px;
    appearance: button;
}

@media (min-width:768px) and (max-width:1023px){.is-thrive-landing .nav-menu>li{padding-top:20px;padding-bottom:20px;margin-left:5px;margin-right:5px;}}

.gos-resource-unavailable { cursor:default; opacity:.85; overflow-wrap:anywhere; }
.gos-resource-unavailable::after { content:attr(data-availability-notice); position:static; display:block; transform:none; width:auto; height:auto; padding:.5rem; border:0; background:#f4f3ef; color:#444; font-size:.9rem; font-weight:600; line-height:1.5; opacity:1; text-align:center; pointer-events:none; }
.gos-resource-unavailable.video-thumb::before, .gos-resource-unavailable.vimeo-facade::before, .gos-resource-unavailable .vimeo-play, .gos-resource-unavailable .vimeo-facade-play { display:none; }
.voks-video-unavailable { display:block; padding:.5rem; color:#555; font-size:.9rem; }