/* ============================================================
   CONNECT.GT – Frontend CSS
   Prefix: cgt-
   Design: Navy #2d4084 | Grün #7ea747 | Warmgrau #f4f3f0
   Schrift: Archivo (Google Fonts), Fallback system-ui
   Keine border-radius, scharfe Ecken überall
   ============================================================ */

/* ---- CSS-Variablen ---- */
:root {
    --cgt-navy:       #2d4084;
    --cgt-green:      #7ea747;
    --cgt-green-dark: #5e8033;
    --cgt-warm-grey:  #f4f3f0;
    --cgt-border:     #eceae5;
    --cgt-input-bd:   #d8d5ce;
    --cgt-text:       #4a4a4a;
    --cgt-muted:      #8a8880;
    --cgt-white:      #ffffff;
    --cgt-font:       Archivo, system-ui, sans-serif;
    --cgt-error:      #b91c1c;
}

/* ---- Resets im Plugin-Scope ---- */
.cgt-wrap *,
.cgt-wrap *::before,
.cgt-wrap *::after {
    box-sizing: border-box;
}
.cgt-wrap {
    font-family: var(--cgt-font);
    color: var(--cgt-text);
    line-height: 1.65;
}
.cgt-wrap a {
    color: var(--cgt-green);
    text-decoration: none;
}
.cgt-wrap a:hover {
    color: var(--cgt-navy);
}

/* ============================================================
   EYEBROW + SECTION HEADER
   ============================================================ */
.cgt-eyebrow {
    font-size: clamp(9px, 1.6vw, 12px);
    font-weight: 700;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--cgt-green);
    margin: 0 0 8px;
}
.cgt-section-title {
    font-size: clamp(28px, 4.4vw, 46px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.03em;
    color: var(--cgt-navy);
    margin: 0 0 16px;
}
.cgt-section-lead {
    font-size: clamp(15px, 2.2vw, 19px);
    line-height: 1.65;
    color: var(--cgt-text);
    margin: 0 0 24px;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.cgt-btn {
    display: inline-block;
    padding: 15px 28px;
    font: 700 15px/1.2 var(--cgt-font);
    cursor: pointer;
    border: none;
    transition: background .15s, color .15s, border-color .15s;
    text-decoration: none;
}
.cgt-btn--primary {
    background: var(--cgt-navy);
    color: var(--cgt-white);
}
.cgt-btn--primary:hover {
    background: var(--cgt-green);
    color: var(--cgt-white);
}
.cgt-btn--outline {
    background: transparent;
    color: var(--cgt-navy);
    border: 1px solid var(--cgt-input-bd);
    padding: 14px 27px;
}
.cgt-btn--outline:hover {
    border-color: var(--cgt-navy);
    color: var(--cgt-navy);
}
.cgt-btn--green {
    background: var(--cgt-green);
    color: var(--cgt-navy);
}
.cgt-btn--green:hover {
    background: var(--cgt-navy);
    color: var(--cgt-white);
}
.cgt-btn-group {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}

/* ============================================================
   ANMELDEFORMULAR – [cgt_form]
   ============================================================ */
.cgt-form-wrapper {
    background: transparent;
    padding: 0;
    max-width: 100%;
    width: 100%;
}

/* Formular-Header */
.cgt-form-header {
    background: var(--cgt-navy);
    color: var(--cgt-white);
    padding: 24px 32px;
    margin: -clamp(28px,4vw,48px) -clamp(28px,4vw,48px) 28px;
    border-top: 3px solid var(--cgt-green);
}
.cgt-form-header__title {
    font-size: clamp(18px,3vw,24px);
    font-weight: 900;
    letter-spacing: -.02em;
    margin: 0 0 4px;
}
.cgt-form-header__sub {
    font-size: 13px;
    color: rgba(255,255,255,.75);
    margin: 0;
}

/* Sections */
.cgt-form-section {
    margin-bottom: 24px;
}
.cgt-form-section__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--cgt-green);
    margin: 0 0 12px;
}

/* Grid */
.cgt-form-row {
    display: grid;
    gap: 10px;
    margin-bottom: 10px;
}
.cgt-form-row--2 { grid-template-columns: 1fr 1fr; }
.cgt-form-row--3 { grid-template-columns: 1fr 1fr 1fr; }
.cgt-form-row--full { grid-template-columns: 1fr; }

/* Inputs */
.cgt-form-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.cgt-form-field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--cgt-navy);
}
.cgt-form-field label .cgt-req {
    color: var(--cgt-error);
    margin-left: 2px;
}
.cgt-input,
.cgt-select,
.cgt-textarea {
    padding: 14px 16px;
    border: 1px solid var(--cgt-input-bd);
    background: var(--cgt-white);
    font: 400 15px/1.2 var(--cgt-font);
    color: var(--cgt-navy);
    width: 100%;
    outline: none;
    transition: border-color .15s;
    border-radius: 0;
    -webkit-appearance: none;
}
.cgt-input:focus,
.cgt-select:focus,
.cgt-textarea:focus {
    border-color: var(--cgt-navy);
}
.cgt-textarea {
    resize: vertical;
    min-height: 90px;
    line-height: 1.6;
}
.cgt-input.cgt-error-field,
.cgt-select.cgt-error-field,
.cgt-textarea.cgt-error-field {
    border-color: var(--cgt-error);
}

/* Toggle-Buttons (Ja/Nein) */
.cgt-toggle-group {
    display: flex;
    gap: 0;
}
.cgt-toggle-btn {
    padding: 13px 30px;
    border: 1px solid var(--cgt-input-bd);
    cursor: pointer;
    font: 700 14px/1.2 var(--cgt-font);
    transition: all .15s;
    background: var(--cgt-white);
    color: var(--cgt-navy);
    border-radius: 0;
    -webkit-appearance: none;
}
.cgt-toggle-btn + .cgt-toggle-btn {
    border-left: none;
}
.cgt-toggle-btn--active {
    background: var(--cgt-navy);
    color: var(--cgt-white);
    border-color: var(--cgt-navy);
}

/* Foren-Picker */
.cgt-foren-picker {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cgt-forum-row {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--cgt-white);
    padding: 12px 14px;
    flex-wrap: wrap;
}
.cgt-forum-row__title {
    flex: 1 1 160px;
    font: 600 14px/1.4 var(--cgt-font);
    color: var(--cgt-navy);
}
.cgt-forum-row select {
    flex: 0 0 auto;
    padding: 8px 10px;
    border: 1px solid var(--cgt-input-bd);
    background: var(--cgt-white);
    font: 600 13px/1.2 var(--cgt-font);
    color: var(--cgt-navy);
    outline: none;
    border-radius: 0;
    -webkit-appearance: none;
    cursor: pointer;
}
.cgt-forum-row select:focus {
    border-color: var(--cgt-navy);
}
.cgt-forum-row.cgt-error-field {
    outline: 1px solid var(--cgt-error);
}

/* Checkboxen */
.cgt-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.cgt-checkbox-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.cgt-checkbox-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-top: 2px;
    accent-color: var(--cgt-green);
    cursor: pointer;
}
.cgt-checkbox-item label {
    font-size: 14px;
    line-height: 1.55;
    color: var(--cgt-text);
    cursor: pointer;
}
.cgt-checkbox-item label a {
    color: var(--cgt-green);
    text-decoration: underline;
}

/* Submit */
.cgt-submit-section {
    margin-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cgt-submit-hint {
    font-size: 12px;
    color: var(--cgt-muted);
    margin: 0;
}

/* Fehlermeldung */
.cgt-form-error {
    color: var(--cgt-error);
    font-size: 13px;
    font-weight: 600;
    margin: 6px 0 0;
}
.cgt-field-error {
    color: var(--cgt-error);
    font-size: 12px;
    margin: 2px 0 0;
}
.cgt-global-error {
    background: #fff5f5;
    border-left: 3px solid var(--cgt-error);
    padding: 12px 16px;
    font-size: 14px;
    color: var(--cgt-error);
    margin-top: 16px;
}

/* Erfolg */
.cgt-success-box {
    background: var(--cgt-white);
    border-top: 3px solid var(--cgt-green);
    padding: 32px 32px;
    text-align: center;
}
.cgt-success-box__icon {
    font-size: 40px;
    margin-bottom: 12px;
}
.cgt-success-box__title {
    font-size: 22px;
    font-weight: 900;
    color: var(--cgt-navy);
    margin: 0 0 12px;
}
.cgt-success-box__text {
    font-size: 15px;
    color: var(--cgt-text);
    line-height: 1.7;
    margin: 0;
}

/* ============================================================
   PROGRAMM – [cgt_program]
   ============================================================ */
.cgt-program-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 2px;
    background: var(--cgt-border);
}
.cgt-program-block {
    background: var(--cgt-warm-grey);
    padding: clamp(18px,2.2vw,26px);
    border-top: 3px solid var(--cgt-navy);
}
.cgt-program-block:nth-child(even) {
    border-top-color: var(--cgt-green);
}
.cgt-program-block__time {
    font: 700 11px/1 var(--cgt-font);
    letter-spacing: .14em;
    color: var(--cgt-green);
    text-transform: uppercase;
    margin-bottom: 8px;
}
.cgt-program-block__title {
    font: 800 clamp(17px,2.2vw,21px)/1.25 var(--cgt-font);
    letter-spacing: -.01em;
    color: var(--cgt-navy);
    margin: 0 0 6px;
}
.cgt-program-block__text {
    font-size: clamp(13px,1.5vw,15px);
    line-height: 1.65;
    color: var(--cgt-text);
    margin: 0;
}

/* ============================================================
   FOREN – [cgt_foren]
   ============================================================ */
.cgt-foren-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 2px;
    background: var(--cgt-border);
}
.cgt-forum-card {
    background: var(--cgt-white);
    border-top: 3px solid var(--cgt-navy);
    padding: clamp(20px,2.5vw,28px);
}
.cgt-forum-card__time {
    font: 700 11px/1 var(--cgt-font);
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--cgt-green);
    margin-bottom: 10px;
}
.cgt-forum-card__title {
    font: 800 clamp(16px,2vw,19px)/1.3 var(--cgt-font);
    letter-spacing: -.01em;
    color: var(--cgt-navy);
    margin: 0;
}
.cgt-forum-card__desc {
    font-size: 14px;
    color: var(--cgt-text);
    line-height: 1.65;
    margin: 10px 0 0;
}

/* ============================================================
   KARTEN – [cgt_cards] / [cgt_card]
   ============================================================ */
.cgt-cards-stack {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--cgt-border);
}
.cgt-card-item {
    background: var(--cgt-warm-grey);
    padding: clamp(18px,2.2vw,26px);
}
.cgt-card-item__label {
    font: 700 11px/1 var(--cgt-font);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--cgt-green);
    margin-bottom: 8px;
}
.cgt-card-item__title {
    font: 800 clamp(17px,2vw,20px)/1.25 var(--cgt-font);
    letter-spacing: -.01em;
    color: var(--cgt-navy);
    margin: 0 0 8px;
}
.cgt-card-item__text {
    font-size: clamp(13px,1.5vw,15px);
    color: var(--cgt-text);
    line-height: 1.65;
    margin: 0;
}

/* ============================================================
   PAKETE – [cgt_packages]
   ============================================================ */
.cgt-packages-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 2px;
    background: var(--cgt-border);
}
.cgt-package-card {
    background: var(--cgt-white);
    border-top: 3px solid var(--cgt-input-bd);
    padding: clamp(20px,2.5vw,28px);
}
.cgt-package-card--featured {
    background: var(--cgt-navy);
    border-top-color: var(--cgt-green);
}
.cgt-package-card__badge {
    font: 700 10px/1 var(--cgt-font);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--cgt-green);
    margin-bottom: 10px;
}
.cgt-package-card__title {
    font: 800 clamp(16px,2vw,20px)/1.25 var(--cgt-font);
    color: var(--cgt-navy);
    margin: 0 0 12px;
}
.cgt-package-card--featured .cgt-package-card__title {
    color: var(--cgt-white);
}
.cgt-package-card__price {
    font: 900 clamp(24px,3vw,36px)/1 var(--cgt-font);
    letter-spacing: -.02em;
    color: var(--cgt-navy);
    margin: 0 0 4px;
}
.cgt-package-card--featured .cgt-package-card__price {
    color: var(--cgt-white);
}
.cgt-package-card__text {
    font-size: 14px;
    color: var(--cgt-text);
    line-height: 1.65;
    margin: 10px 0 0;
}
.cgt-package-card--featured .cgt-package-card__text {
    color: rgba(255,255,255,.8);
}

/* ============================================================
   LOGOS – [cgt_logos]
   ============================================================ */
.cgt-logos-wrap {
    overflow: hidden;
    position: relative;
}
.cgt-logos-track {
    display: flex;
    gap: 40px;
    align-items: center;
    animation: cgt-marquee 30s linear infinite;
    width: max-content;
}
.cgt-logos-wrap:hover .cgt-logos-track { animation-play-state: paused; }
.cgt-logos-track img {
    height: 40px;
    width: auto;
    filter: grayscale(1);
    opacity: .6;
    transition: opacity .2s;
    flex-shrink: 0;
}
.cgt-logos-track img:hover { opacity: 1; filter: none; }
@keyframes cgt-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* ============================================================
   FAQ – [cgt_faq] / [cgt_faq_item]
   ============================================================ */
.cgt-faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(24px,3vw,48px);
}
.cgt-faq-section {}
.cgt-faq-section__header {
    border-top: 3px solid var(--cgt-navy);
    padding-top: clamp(14px,1.8vw,20px);
    margin-bottom: 20px;
}
.cgt-faq-section__title {
    font: 800 clamp(20px,2.6vw,26px)/1.2 var(--cgt-font);
    letter-spacing: -.02em;
    color: var(--cgt-navy);
    margin: 0;
}
.cgt-faq-item {
    margin-bottom: 20px;
}
.cgt-faq-item__q {
    font: 700 14px/1.4 var(--cgt-font);
    color: var(--cgt-navy);
    margin: 0 0 6px;
}
.cgt-faq-item__a {
    font-size: clamp(13px,1.5vw,15px);
    line-height: 1.7;
    color: var(--cgt-text);
    margin: 0;
}

/* ============================================================
   NEWSLETTER – [cgt_newsletter]
   ============================================================ */
.cgt-newsletter-form {
    display: flex;
    gap: 0;
    max-width: 480px;
}
.cgt-newsletter-form input[type="email"] {
    flex: 1;
    padding: 14px 16px;
    border: 1px solid var(--cgt-input-bd);
    border-right: none;
    font: 400 15px/1.2 var(--cgt-font);
    color: var(--cgt-navy);
    outline: none;
    background: var(--cgt-white);
    border-radius: 0;
}
.cgt-newsletter-form input:focus {
    border-color: var(--cgt-navy);
}
.cgt-newsletter-form .cgt-btn {
    flex: 0 0 auto;
    padding: 14px 24px;
}
.cgt-newsletter-hint {
    font-size: 12px;
    color: var(--cgt-muted);
    margin: 8px 0 0;
}

/* ============================================================
   COUNTDOWN – [cgt_countdown]
   ============================================================ */
.cgt-countdown {
    display: flex;
    gap: 0;
    flex-wrap: wrap;
}
.cgt-countdown-cell {
    background: rgba(255,255,255,.08);
    padding: clamp(16px,2vw,24px) clamp(20px,3vw,36px);
    text-align: center;
    min-width: 80px;
}
.cgt-countdown-num {
    display: block;
    font: 900 clamp(30px,6vw,62px)/1 var(--cgt-font);
    letter-spacing: -.03em;
    color: var(--cgt-white);
}
.cgt-countdown-label {
    display: block;
    font: 700 10px/1 var(--cgt-font);
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255,255,255,.7);
    margin-top: 6px;
}

/* ============================================================
   EVENT INFO – [cgt_event_info]
   ============================================================ */
.cgt-event-info {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}
.cgt-event-info__item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cgt-event-info__label {
    font: 700 10px/1 var(--cgt-font);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--cgt-green);
}
.cgt-event-info__value {
    font: 700 clamp(14px,1.8vw,17px)/1.3 var(--cgt-font);
    letter-spacing: -.01em;
    color: var(--cgt-navy);
}

/* ============================================================
   HEADER – [cgt_header]
   ============================================================ */
.cgt-header {
    background: var(--cgt-white);
    border-bottom: 1px solid var(--cgt-border);
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}
.cgt-header--static { position: static; }
.cgt-header-inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 clamp(20px,4vw,64px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
}
.cgt-header-logo img {
    height: 38px;
    width: auto;
    display: block;
}
.cgt-header-nav {
    display: flex;
    gap: clamp(20px,2.5vw,36px);
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}
.cgt-header-nav li { margin: 0; padding: 0; }
.cgt-header-nav a {
    font: 600 clamp(11px,1.4vw,13px)/1 var(--cgt-font);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--cgt-navy);
    text-decoration: none;
    transition: color .15s;
}
.cgt-header-nav a:hover { color: var(--cgt-green); }

/* Mobile Nav Toggle */
.cgt-nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    color: var(--cgt-navy);
}

/* ============================================================
   FOOTER – [cgt_footer]
   ============================================================ */
.cgt-footer {
    background: var(--cgt-navy);
    color: rgba(255,255,255,.8);
    padding: clamp(40px,5vw,64px) clamp(20px,4vw,64px) 0;
}
.cgt-footer-inner {
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: clamp(24px,3vw,48px);
    padding-bottom: clamp(32px,4vw,56px);
    border-bottom: 1px solid rgba(255,255,255,.15);
}
.cgt-footer-col__label {
    font: 700 11px/1 var(--cgt-font);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: rgba(255,255,255,.5);
    margin: 0 0 16px;
}
.cgt-footer-col__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cgt-footer-col__list li { margin-bottom: 8px; }
.cgt-footer-col__list a,
.cgt-footer-col__text {
    font-size: 14px;
    color: rgba(255,255,255,.8);
    text-decoration: none;
    transition: color .15s;
    line-height: 1.6;
}
.cgt-footer-col__list a:hover { color: var(--cgt-green); }
.cgt-footer-col__text { display: block; }

.cgt-footer-bottom {
    max-width: 1240px;
    margin: 0 auto;
    padding: 20px 0;
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.cgt-footer-copy {
    font-size: 12px;
    color: rgba(255,255,255,.5);
}
.cgt-footer-legal {
    display: flex;
    gap: 16px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.cgt-footer-legal a {
    font-size: 12px;
    color: rgba(255,255,255,.6);
    text-decoration: none;
}
.cgt-footer-legal a:hover { color: var(--cgt-green); }

.cgt-social-links {
    display: flex;
    gap: 12px;
    margin-top: 8px;
}
.cgt-social-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.2);
    color: rgba(255,255,255,.7);
    font-size: 14px;
    text-decoration: none;
    transition: border-color .15s, color .15s;
}
.cgt-social-links a:hover {
    border-color: var(--cgt-green);
    color: var(--cgt-green);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 640px) {
    .cgt-form-row--2,
    .cgt-form-row--3 {
        grid-template-columns: 1fr;
    }
    .cgt-faq-grid {
        grid-template-columns: 1fr;
    }
    .cgt-packages-grid,
    .cgt-foren-grid,
    .cgt-program-grid {
        grid-template-columns: 1fr;
    }
    .cgt-newsletter-form {
        flex-direction: column;
    }
    .cgt-newsletter-form input[type="email"] {
        border-right: 1px solid var(--cgt-input-bd);
        border-bottom: none;
    }
    .cgt-header-nav {
        display: none;
        flex-direction: column;
        gap: 0;
        position: absolute;
        top: 68px;
        left: 0;
        right: 0;
        background: var(--cgt-white);
        border-bottom: 1px solid var(--cgt-border);
        padding: 12px 0;
    }
    .cgt-header-nav.cgt-nav-open {
        display: flex;
    }
    .cgt-header-nav a {
        padding: 12px 24px;
        display: block;
    }
    .cgt-nav-toggle {
        display: block;
    }
    .cgt-footer-inner {
        grid-template-columns: 1fr 1fr;
    }
    .cgt-footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }
}
@media (max-width: 380px) {
    .cgt-footer-inner { grid-template-columns: 1fr; }
}