/* =========================================
   DeutschAkademy - Main Design
   ========================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --black: #111111;
    --red: #e31b23;
    --red-dark: #bd1118;
    --gold: #f5c518;
    --white: #ffffff;
    --background: #f5f6f8;
    --text: #202124;
    --muted: #6b7280;
    --border: #e5e7eb;
    --success: #15803d;
    --shadow: 0 12px 35px rgba(0, 0, 0, 0.08);
}

body {
    font-family: Arial, Helvetica, sans-serif;
    background: var(--background);
    color: var(--text);
    min-height: 100vh;
}

/* ================= HEADER ================= */

.navbar {
    height: 76px;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 6%;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.brand-text {
    font-size: 22px;
    font-weight: 800;
    color: var(--black);
}

.brand-text span {
    color: var(--red);
}

.nav-right {
    display: flex;
    align-items: center;
    gap: 18px;
}

.user-name {
    color: var(--muted);
    font-size: 14px;
}

/* German flag line */

.flag-line {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    height: 4px;
    width: 100%;
}

.flag-line .black {
    background: #111;
}

.flag-line .red {
    background: #dd0000;
}

.flag-line .gold {
    background: #ffce00;
}

/* ================= BUTTONS ================= */

.btn {
    border: none;
    border-radius: 9px;
    padding: 11px 20px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: 0.2s ease;
}

.btn-primary {
    background: var(--red);
    color: white;
}

.btn-primary:hover {
    background: var(--red-dark);
    transform: translateY(-1px);
}

.btn-dark {
    background: var(--black);
    color: white;
}

.btn-dark:hover {
    opacity: 0.85;
}

.btn-outline {
    border: 1px solid var(--border);
    background: white;
    color: var(--text);
}

.btn-outline:hover {
    background: #f3f4f6;
}

/* ================= AUTH PAGES ================= */

.auth-page {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.auth-left {
    background: linear-gradient(
        145deg,
        #090909 0%,
        #171717 55%,
        #2b0b0d 100%
    );
    color: white;
    padding: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.auth-left::after {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    background: rgba(227, 27, 35, 0.13);
    right: -120px;
    bottom: -130px;
}

.auth-logo {
    width: 190px;
    max-height: 120px;
    object-fit: contain;
    object-position: left;
    margin-bottom: 45px;
    background: white;
    border-radius: 14px;
    padding: 10px;
}

.auth-left h1 {
    font-size: 44px;
    line-height: 1.15;
    margin-bottom: 18px;
    max-width: 560px;
}

.auth-left p {
    max-width: 500px;
    color: #d1d5db;
    font-size: 17px;
    line-height: 1.7;
}

.auth-colors {
    display: flex;
    width: 160px;
    height: 7px;
    margin-top: 32px;
    border-radius: 20px;
    overflow: hidden;
}

.auth-colors span {
    flex: 1;
}

.auth-colors span:nth-child(1) {
    background: #000;
    border: 1px solid #333;
}

.auth-colors span:nth-child(2) {
    background: #dd0000;
}

.auth-colors span:nth-child(3) {
    background: #ffce00;
}

.auth-right {
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 30px;
}

.auth-card {
    width: 100%;
    max-width: 460px;
}

.auth-card h2 {
    font-size: 32px;
    color: var(--black);
    margin-bottom: 8px;
}

.auth-subtitle {
    color: var(--muted);
    margin-bottom: 30px;
    line-height: 1.5;
}

/* ================= FORMS ================= */

.form-group {
    margin-bottom: 18px;
}

.form-group label {
    display: block;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 7px;
}

.form-group input,
.auth-card input,
.auth-card select {
    width: 100%;
    padding: 13px 14px;
    border: 1px solid #d7dce2;
    border-radius: 9px;
    font-size: 15px;
    outline: none;
    transition: 0.2s;
    background: white;
}

.form-group input:focus,
.auth-card input:focus,
.auth-card select:focus {
    border-color: var(--red);
    box-shadow: 0 0 0 3px rgba(227, 27, 35, 0.09);
}

.auth-card button[type="submit"] {
    width: 100%;
    margin-top: 8px;
    padding: 13px;
}

.auth-footer {
    margin-top: 24px;
    text-align: center;
    color: var(--muted);
    font-size: 14px;
}

.auth-footer a {
    color: var(--red);
    font-weight: 700;
    text-decoration: none;
}

.auth-footer a:hover {
    text-decoration: underline;
}

/* Django form help text */

.helptext {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-top: 5px;
    line-height: 1.5;
}

ul.errorlist {
    list-style: none;
    background: #fff1f2;
    color: #b91c1c;
    border: 1px solid #fecdd3;
    padding: 10px 12px;
    border-radius: 8px;
    margin: 5px 0 12px;
    font-size: 13px;
}

/* ================= DASHBOARD ================= */

.dashboard {
    max-width: 1250px;
    margin: 0 auto;
    padding: 45px 30px;
}

.welcome {
    background:
        linear-gradient(
            120deg,
            rgba(0, 0, 0, 0.97),
            rgba(35, 35, 35, 0.96)
        );
    color: white;
    border-radius: 18px;
    padding: 40px;
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow);
}

.welcome::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    right: -60px;
    top: -80px;
    background: rgba(221, 0, 0, 0.2);
}

.welcome h1 {
    font-size: 32px;
    margin-bottom: 10px;
}

.welcome p {
    color: #d1d5db;
    line-height: 1.6;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 28px;
}

.dashboard-card {
    background: white;
    padding: 25px;
    border-radius: 14px;
    border: 1px solid var(--border);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04);
    transition: 0.2s ease;
}

.dashboard-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}

.card-icon {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff0f0;
    margin-bottom: 18px;
    font-size: 21px;
}

.dashboard-card h3 {
    margin-bottom: 9px;
}

.dashboard-card p {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}

/* ================= STATUS ================= */

.status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
}

.status-success {
    color: #166534;
    background: #dcfce7;
}

/* ================= RESPONSIVE ================= */

@media (max-width: 900px) {
    .auth-page {
        grid-template-columns: 1fr;
    }

    .auth-left {
        padding: 45px 30px;
        min-height: 350px;
    }

    .auth-left h1 {
        font-size: 34px;
    }

    .auth-logo {
        width: 150px;
        margin-bottom: 25px;
    }

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

@media (max-width: 600px) {
    .navbar {
        padding: 0 18px;
    }

    .brand-text {
        font-size: 18px;
    }

    .user-name {
        display: none;
    }

    .dashboard {
        padding: 25px 16px;
    }

    .welcome {
        padding: 28px 22px;
    }

    .welcome h1 {
        font-size: 25px;
    }

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

    .auth-left {
        padding: 35px 22px;
    }

    .auth-right {
        padding: 40px 22px;
    }

    .auth-card h2 {
        font-size: 27px;
    }
}
/* ================================
   DEUTSCHAKADEMY LOGO
================================ */

.brand {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.brand-logo {
    display: block;
    width: 155px;
    height: 55px;
    object-fit: contain;
    object-position: left center;
}

@media (max-width: 600px) {
    .brand-logo {
        width: 125px;
        height: 45px;
    }
}
/* =========================================================
   DEUTSCHAKADEMY - PROFESSIONAL DASHBOARD
   ========================================================= */

/* Dashboard page */
.dashboard {
    width: min(1100px, calc(100% - 40px));
    margin: 42px auto 70px;
}

/* =========================================================
   NAVBAR
   ========================================================= */

.navbar {
    width: 100%;
    min-height: 82px;
    padding: 12px max(28px, calc((100% - 1100px) / 2));
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    border-bottom: 1px solid #e8e8e8;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
}

.brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    flex-shrink: 0;
}

.brand-logo {
    display: block;
    width: auto;
    height: 58px;
    max-width: 220px;
    object-fit: contain;
}

/* User area */
.nav-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.user-name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 700;
    color: #222222;
}

/* Logout button */
.nav-right .btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #d7d7d7;
    border-radius: 10px;
    background: #ffffff;
    color: #222222;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.nav-right .btn-outline:hover {
    background: #f7f7f7;
    border-color: #bbbbbb;
    transform: translateY(-1px);
}

/* =========================================================
   GERMAN FLAG
   ========================================================= */

.flag-line {
    width: 100%;
    height: 6px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.flag-line .black {
    background: #111111;
}

.flag-line .red {
    background: #dd0000;
}

.flag-line .gold {
    background: #ffcc00;
}

/* =========================================================
   WELCOME SECTION
   ========================================================= */

.welcome {
    position: relative;
    overflow: hidden;
    padding: 38px 42px;
    border-radius: 22px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(255, 204, 0, 0.14),
            transparent 30%
        ),
        linear-gradient(135deg, #171717 0%, #282828 100%);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.13);
}

.welcome::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 7px;
    height: 100%;
    background: linear-gradient(
        to bottom,
        #111111 0%,
        #111111 33.33%,
        #dd0000 33.33%,
        #dd0000 66.66%,
        #ffcc00 66.66%,
        #ffcc00 100%
    );
}

.welcome h1 {
    position: relative;
    margin: 0 0 10px;
    color: #ffffff;
    font-size: clamp(28px, 4vw, 38px);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.5px;
}

.welcome p {
    position: relative;
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
    line-height: 1.7;
}

/* =========================================================
   DASHBOARD CARDS
   ========================================================= */

.dashboard-grid {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.dashboard-card {
    position: relative;
    min-height: 210px;
    padding: 28px;
    background: #ffffff;
    border: 1px solid #e8e8e8;
    border-radius: 18px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.055);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.dashboard-card:hover {
    transform: translateY(-5px);
    border-color: #d7d7d7;
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.10);
}

.card-icon {
    width: 52px;
    height: 52px;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #f4f4f4;
    font-size: 24px;
}

.dashboard-card h3 {
    margin: 0 0 10px;
    color: #1b1b1b;
    font-size: 19px;
    font-weight: 800;
}

.dashboard-card p {
    margin: 0;
    color: #6d6d6d;
    font-size: 14px;
    line-height: 1.65;
}

/* German color detail on cards */
.dashboard-card:nth-child(1) {
    border-top: 3px solid #111111;
}

.dashboard-card:nth-child(2) {
    border-top: 3px solid #dd0000;
}

.dashboard-card:nth-child(3) {
    border-top: 3px solid #ffcc00;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

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

    .dashboard-card:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 650px) {
    .navbar {
        min-height: 72px;
        padding: 10px 18px;
    }

    .brand-logo {
        height: 46px;
        max-width: 165px;
    }

    .user-name {
        display: none;
    }

    .nav-right {
        gap: 8px;
    }

    .nav-right .btn-outline {
        min-height: 38px;
        padding: 0 13px;
        font-size: 13px;
    }

    .dashboard {
        width: calc(100% - 28px);
        margin-top: 24px;
    }

    .welcome {
        padding: 30px 24px 30px 30px;
        border-radius: 17px;
    }

    .welcome h1 {
        font-size: 27px;
    }

    .welcome p {
        font-size: 14px;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .dashboard-card,
    .dashboard-card:last-child {
        grid-column: auto;
    }

    .dashboard-card {
        min-height: auto;
        padding: 24px;
    }
}
/* =========================================================
   DEUTSCHAKADEMY - PUBLIC WEBSITE
   ========================================================= */

.public-page {
    background: #ffffff;
    color: #181818;
}

/* ---------- Public Navbar ---------- */

.public-navbar {
    position: sticky;
    top: 0;
    z-index: 1000;
}

.public-nav-links {
    display: flex;
    align-items: center;
    gap: 28px;
}

.public-nav-links a {
    color: #404040;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    transition: color 0.2s ease;
}

.public-nav-links a:hover {
    color: #dd0000;
}


/* ---------- Hero ---------- */

.public-hero {
    width: min(1180px, calc(100% - 48px));
    min-height: 650px;
    margin: 0 auto;
    padding: 85px 0 70px;

    display: grid;
    grid-template-columns: 1.08fr 0.92fr;
    align-items: center;
    gap: 70px;
}

.hero-content {
    max-width: 650px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;

    border: 1px solid #e5e5e5;
    border-radius: 999px;

    background: #fafafa;

    color: #4b4b4b;
    font-size: 13px;
    font-weight: 800;

    margin-bottom: 25px;
}

.hero-content h1 {
    margin: 0;

    color: #111111;

    font-size: clamp(45px, 6vw, 72px);
    line-height: 1.02;
    letter-spacing: -2.7px;
    font-weight: 900;
}

.hero-content h1 span {
    display: block;
    color: #dd0000;
}

.hero-description {
    max-width: 620px;
    margin-top: 25px;

    color: #646464;

    font-size: 18px;
    line-height: 1.75;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

    margin-top: 32px;
}

.hero-button {
    min-height: 52px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding-left: 24px;
    padding-right: 24px;
}

.hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;

    margin-top: 28px;

    color: #666666;
    font-size: 13px;
    font-weight: 700;
}


/* ---------- Hero System Panel ---------- */

.hero-panel {
    overflow: hidden;

    border: 1px solid #303030;
    border-radius: 24px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(221, 0, 0, 0.20),
            transparent 35%
        ),
        #151515;

    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.22);
}

.hero-panel-header {
    min-height: 62px;

    display: flex;
    align-items: center;
    gap: 10px;

    padding: 0 24px;

    border-bottom: 1px solid #303030;

    color: #f5f5f5;
    font-size: 13px;
    font-weight: 800;
}

.system-dot {
    width: 9px;
    height: 9px;

    border-radius: 50%;
    background: #31c96b;

    box-shadow: 0 0 0 5px rgba(49, 201, 107, 0.12);
}

.hero-panel-content {
    padding: 28px;
}

.panel-label {
    display: block;

    margin-bottom: 18px;

    color: #ffcc00;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.process-item {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 16px;

    padding: 18px 0;

    border-bottom: 1px solid #303030;
}

.process-item:last-child {
    border-bottom: 0;
}

.process-item > strong {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: rgba(255, 255, 255, 0.07);

    color: #ffcc00;
    font-size: 12px;
}

.process-item h3 {
    margin: 0 0 5px;

    color: #ffffff;
    font-size: 16px;
}

.process-item p {
    margin: 0;

    color: #a9a9a9;

    font-size: 13px;
    line-height: 1.55;
}


/* ---------- General Public Sections ---------- */

.public-section {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 95px 0;
}

.section-heading {
    max-width: 700px;
    margin-bottom: 45px;
}

.section-heading > span {
    display: block;

    margin-bottom: 10px;

    color: #dd0000;

    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1.8px;
}

.section-heading h2 {
    margin: 0;

    color: #151515;

    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.12;
    letter-spacing: -1.2px;
}

.section-heading p {
    margin-top: 15px;

    color: #6c6c6c;

    font-size: 16px;
    line-height: 1.7;
}


/* ---------- Career Choice ---------- */

.career-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.career-choice-card {
    position: relative;

    min-height: 330px;
    padding: 35px;

    border: 1px solid #e5e5e5;
    border-radius: 22px;

    background: #ffffff;

    color: inherit;
    text-decoration: none;

    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.055);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.career-choice-card:hover {
    transform: translateY(-6px);

    border-color: #cccccc;

    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.11);
}

.career-choice-card:first-child {
    border-top: 5px solid #dd0000;
}

.career-choice-card:last-child {
    border-top: 5px solid #ffcc00;
}

.career-choice-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 25px;

    border-radius: 16px;

    background: #f5f5f5;

    font-size: 27px;
}

.choice-tag {
    display: block;

    margin-bottom: 9px;

    color: #888888;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.career-choice-card h3 {
    margin: 0 0 13px;

    color: #181818;

    font-size: 25px;
}

.career-choice-card p {
    max-width: 480px;

    margin: 0 0 25px;

    color: #6a6a6a;

    font-size: 15px;
    line-height: 1.7;
}

.career-choice-card strong {
    color: #dd0000;
    font-size: 14px;
}


/* ---------- How It Works ---------- */

.how-section {
    width: 100%;
    max-width: none;

    padding-left: max(24px, calc((100% - 1180px) / 2));
    padding-right: max(24px, calc((100% - 1180px) / 2));

    background: #f6f6f6;
}

.steps-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.step-card {
    padding: 28px;

    border: 1px solid #e5e5e5;
    border-radius: 18px;

    background: #ffffff;
}

.step-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    margin-bottom: 22px;

    border-radius: 50%;

    background: #111111;

    color: #ffffff;

    font-size: 12px;
    font-weight: 900;
}

.step-card h3 {
    margin: 0 0 9px;

    color: #181818;

    font-size: 18px;
}

.step-card p {
    margin: 0;

    color: #717171;

    font-size: 14px;
    line-height: 1.65;
}


/* ---------- CTA ---------- */

.home-cta {
    width: min(1180px, calc(100% - 48px));
    margin: 95px auto;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;

    padding: 50px;

    border-radius: 25px;

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(221, 0, 0, 0.27),
            transparent 30%
        ),
        #151515;

    color: #ffffff;

    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.16);
}

.home-cta > div:first-child {
    max-width: 650px;
}

.home-cta > div > span {
    color: #ffcc00;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.6px;
}

.home-cta h2 {
    margin: 10px 0;

    font-size: clamp(28px, 4vw, 42px);
}

.home-cta p {
    margin: 0;

    color: #bdbdbd;

    line-height: 1.7;
}

.home-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.home-cta .btn-outline {
    border-color: #555555;

    background: transparent;

    color: #ffffff;
}

.home-cta .btn-outline:hover {
    background: rgba(255, 255, 255, 0.08);
}


/* ---------- Footer ---------- */

.public-footer {
    padding: 60px max(24px, calc((100% - 1180px) / 2)) 25px;

    border-top: 1px solid #e7e7e7;

    background: #ffffff;
}

.footer-main {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 60px;

    padding-bottom: 45px;
}

.footer-brand img {
    width: 190px;
    height: 70px;

    object-fit: contain;
    object-position: left center;
}

.footer-brand p {
    max-width: 370px;

    margin-top: 15px;

    color: #777777;

    font-size: 14px;
    line-height: 1.7;
}

.footer-links {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-links h4 {
    margin-bottom: 5px;

    color: #181818;
    font-size: 14px;
}

.footer-links a {
    color: #707070;

    text-decoration: none;

    font-size: 13px;
}

.footer-links a:hover {
    color: #dd0000;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 20px;

    padding-top: 22px;

    border-top: 1px solid #ededed;

    color: #8a8a8a;

    font-size: 12px;
}


/* =========================================================
   PUBLIC WEBSITE RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {

    .public-nav-links {
        display: none;
    }

    .public-hero {
        grid-template-columns: 1fr;
        gap: 45px;

        padding-top: 60px;
    }

    .hero-content {
        max-width: 780px;
    }

    .hero-panel {
        max-width: 720px;
    }

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


@media (max-width: 700px) {

    .public-navbar .nav-right .btn-outline {
        display: none;
    }

    .public-navbar .brand-logo {
        max-width: 145px;
    }

    .public-hero,
    .public-section,
    .home-cta {
        width: calc(100% - 30px);
    }

    .public-hero {
        min-height: auto;

        padding: 48px 0 55px;
    }

    .hero-content h1 {
        font-size: 43px;
        letter-spacing: -1.7px;
    }

    .hero-description {
        font-size: 16px;
    }

    .hero-actions {
        flex-direction: column;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .hero-trust {
        flex-direction: column;
        gap: 9px;
    }

    .hero-panel-content {
        padding: 20px;
    }

    .career-choice-grid,
    .steps-grid {
        grid-template-columns: 1fr;
    }

    .public-section {
        padding: 65px 0;
    }

    .career-choice-card {
        min-height: auto;
        padding: 27px;
    }

    .how-section {
        width: 100%;

        padding-left: 15px;
        padding-right: 15px;
    }

    .home-cta {
        margin-top: 65px;
        margin-bottom: 65px;

        padding: 35px 25px;

        flex-direction: column;
        align-items: flex-start;
    }

    .home-cta-actions {
        width: 100%;
    }

    .home-cta-actions .btn {
        width: 100%;
        text-align: center;
    }

    .footer-main {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .footer-bottom {
        flex-direction: column;
    }
}
/* =========================================================
   DEUTSCHAKADEMY - CAREER EXPLORER
   ========================================================= */

.career-explorer-hero {
    padding: 80px 24px 65px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0%, rgba(221, 0, 0, .09), transparent 35%),
        linear-gradient(180deg, #fafafa 0%, #ffffff 100%);
    border-bottom: 1px solid #eeeeee;
}

.career-explorer-hero h1 {
    max-width: 800px;
    margin: 0 auto;
    font-size: clamp(42px, 6vw, 68px);
    line-height: 1.04;
    letter-spacing: -2.3px;
    color: #111111;
}

.career-explorer-hero h1 span {
    display: block;
    color: #dd0000;
}

.career-explorer-hero > p {
    max-width: 680px;
    margin: 20px auto 0;
    color: #696969;
    font-size: 17px;
    line-height: 1.7;
}


/* Ausbildung / Arbeit */

.career-type-switch {
    width: min(620px, 100%);
    margin: 35px auto 0;
    padding: 6px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    background: #eeeeee;
    border-radius: 18px;
}

.career-type-option {
    min-height: 72px;
    padding: 13px 18px;
    display: flex;
    align-items: center;
    gap: 13px;
    text-align: left;
    text-decoration: none;
    color: #333333;
    border-radius: 13px;
    transition: .2s ease;
}

.career-type-option > span {
    font-size: 24px;
}

.career-type-option strong,
.career-type-option small {
    display: block;
}

.career-type-option strong {
    font-size: 15px;
}

.career-type-option small {
    margin-top: 3px;
    color: #777777;
    font-size: 11px;
}

.career-type-option.active {
    background: #ffffff;
    color: #111111;
    box-shadow: 0 5px 18px rgba(0,0,0,.09);
}

.career-type-option.active strong {
    color: #dd0000;
}


/* Explorer */

.career-explorer {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 75px 0 40px;
}

.career-explorer-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
}

.explorer-label {
    color: #dd0000;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.7px;
}

.career-explorer-toolbar h2 {
    margin: 8px 0 8px;
    color: #151515;
    font-size: clamp(30px, 4vw, 43px);
    letter-spacing: -1px;
}

.career-explorer-toolbar p {
    color: #707070;
    line-height: 1.6;
}


/* Search */

.career-search {
    width: min(350px, 100%);
    height: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 13px;
}

.career-search:focus-within {
    border-color: #dd0000;
    box-shadow: 0 0 0 3px rgba(221,0,0,.07);
}

.career-search span {
    font-size: 20px;
    color: #777777;
}

.career-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 14px;
}


/* Filters */

.career-filters {
    margin: 35px 0 32px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.career-filter {
    padding: 10px 15px;
    border: 1px solid #dddddd;
    border-radius: 999px;
    background: #ffffff;
    color: #555555;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s ease;
}

.career-filter:hover {
    border-color: #aaaaaa;
    transform: translateY(-1px);
}

.career-filter.active {
    border-color: #111111;
    background: #111111;
    color: #ffffff;
}


/* Cards */

.career-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.profession-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    box-shadow: 0 8px 28px rgba(0,0,0,.055);
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

.profession-card:hover {
    transform: translateY(-6px);
    border-color: #cccccc;
    box-shadow: 0 20px 45px rgba(0,0,0,.11);
}

.profession-image {
    position: relative;
    height: 205px;
    overflow: hidden;
    background:
        radial-gradient(circle at 80% 20%, rgba(221,0,0,.16), transparent 30%),
        linear-gradient(135deg, #181818, #303030);
}

.profession-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.profession-card:hover .profession-image img {
    transform: scale(1.04);
}

.profession-image-placeholder {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
}

.profession-image-placeholder span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 82px;
    height: 82px;
    border-radius: 22px;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.12);
    font-size: 40px;
}

.profession-category {
    position: absolute;
    left: 16px;
    bottom: 15px;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(0,0,0,.72);
    backdrop-filter: blur(8px);
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
}

.profession-content {
    flex: 1;
    padding: 23px;
    display: flex;
    flex-direction: column;
}

.profession-mode {
    margin-bottom: 9px;
    color: #dd0000;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .5px;
}

.profession-content h3 {
    margin: 0 0 11px;
    color: #181818;
    font-size: 19px;
    line-height: 1.35;
}

.profession-content > p {
    margin: 0;
    color: #717171;
    font-size: 13px;
    line-height: 1.65;
}

.profession-info {
    margin: 20px 0;
    padding: 15px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
}

.profession-info span {
    color: #777777;
    font-size: 10px;
    line-height: 1.4;
}

.profession-info strong {
    display: block;
    margin-bottom: 4px;
    color: #333333;
    font-size: 11px;
}

.profession-more {
    width: 100%;
    margin-top: auto;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: transparent;
    color: #181818;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    text-align: left;
}

.profession-more span {
    color: #dd0000;
    font-size: 18px;
    transition: transform .2s ease;
}

.profession-more:hover span {
    transform: translateX(4px);
}


/* No results */

.career-no-results {
    padding: 70px 20px;
    text-align: center;
}

.career-no-results span {
    font-size: 35px;
}

.career-no-results h3 {
    margin: 15px 0 8px;
}

.career-no-results p {
    color: #777777;
}


/* Notice */

.career-notice {
    width: min(1180px, calc(100% - 48px));
    margin: 45px auto 0;
    padding: 25px 28px;
    display: flex;
    gap: 18px;
    align-items: flex-start;
    border: 1px solid #eadfbb;
    border-radius: 16px;
    background: #fffaf0;
}

.career-notice-icon {
    flex: 0 0 auto;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffcc00;
    color: #111111;
    font-weight: 900;
}

.career-notice h3 {
    margin: 0 0 6px;
    font-size: 15px;
}

.career-notice p {
    max-width: 900px;
    margin: 0;
    color: #6b6250;
    font-size: 13px;
    line-height: 1.65;
}


/* Responsive */

@media (max-width: 1000px) {
    .career-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .career-explorer-hero {
        padding: 55px 16px 45px;
    }

    .career-explorer-hero h1 {
        font-size: 42px;
    }

    .career-type-switch {
        grid-template-columns: 1fr;
    }

    .career-explorer {
        width: calc(100% - 30px);
        padding-top: 55px;
    }

    .career-explorer-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .career-search {
        width: 100%;
    }

    .career-filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 7px;
    }

    .career-filter {
        flex: 0 0 auto;
    }

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

    .profession-image {
        height: 220px;
    }

    .career-notice {
        width: calc(100% - 30px);
    }
}
/* =========================================================
   PROFESSION DETAIL PAGE
   DeutschAkademy BewerbungsPortal
   ========================================================= */

.profession-detail-page {
    background: #f6f7f9;
    color: #17191d;
}


/* ---------- BREADCRUMB ---------- */

.profession-detail-breadcrumb {
    max-width: 1200px;
    margin: 0 auto;
    padding: 26px 24px 18px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 14px;
    color: #6b7280;
}

.profession-detail-breadcrumb a {
    color: #6b7280;
    text-decoration: none;
    transition: 0.2s ease;
}

.profession-detail-breadcrumb a:hover {
    color: #d00000;
}

.profession-detail-breadcrumb strong {
    color: #17191d;
    font-weight: 700;
}


/* ---------- HERO ---------- */

.profession-detail-hero {
    max-width: 1200px;
    margin: 0 auto;
    padding: 28px 24px 55px;

    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(350px, 0.85fr);
    gap: 55px;
    align-items: center;
}

.profession-detail-hero-content {
    min-width: 0;
}

.profession-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 22px;
}

.profession-detail-category,
.profession-detail-type {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 9px 14px;
    border-radius: 999px;

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

.profession-detail-category {
    background: #ffffff;
    border: 1px solid #e4e7ec;
    color: #34383f;
}

.profession-detail-type {
    background: #fff0f0;
    color: #b00000;
    border: 1px solid #ffd4d4;
}

.profession-detail-hero h1 {
    margin: 0;
    max-width: 720px;

    font-size: clamp(38px, 5vw, 68px);
    line-height: 1.04;
    letter-spacing: -2.2px;
    font-weight: 850;
    color: #111318;

    overflow-wrap: anywhere;
}

.profession-detail-intro {
    max-width: 680px;
    margin: 24px 0 0;

    font-size: 18px;
    line-height: 1.75;
    color: #5e646e;
}

.profession-detail-actions {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}


/* ---------- HERO IMAGE ---------- */

.profession-detail-image {
    position: relative;
    min-height: 410px;
    overflow: hidden;

    border-radius: 28px;
    background:
        linear-gradient(
            145deg,
            #181b21,
            #292e37
        );

    box-shadow:
        0 24px 60px rgba(16, 24, 40, 0.16);
}

.profession-detail-image img {
    width: 100%;
    height: 100%;
    min-height: 410px;

    position: absolute;
    inset: 0;

    object-fit: cover;
    display: block;
}

.profession-detail-image-placeholder {
    position: absolute;
    inset: 0;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 30px;
    text-align: center;

    color: #ffffff;
}

.profession-detail-image-placeholder::before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;

    background: rgba(255, 255, 255, 0.05);
}

.profession-detail-image-placeholder span {
    position: relative;
    z-index: 1;

    font-size: 82px;
    margin-bottom: 20px;
}

.profession-detail-image-placeholder strong {
    position: relative;
    z-index: 1;

    max-width: 330px;
    font-size: 21px;
    line-height: 1.4;
}


/* ---------- QUICK INFO ---------- */

.profession-detail-quick-grid {
    max-width: 1200px;
    margin: 0 auto 50px;
    padding: 0 24px;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.profession-quick-card {
    min-width: 0;

    background: #ffffff;
    border: 1px solid #e6e8ec;
    border-radius: 18px;

    padding: 20px;

    display: flex;
    align-items: center;
    gap: 14px;

    box-shadow:
        0 8px 24px rgba(16, 24, 40, 0.04);
}

.profession-quick-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;

    border-radius: 13px;
    background: #f3f4f6;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 22px;
}

.profession-quick-card > div:last-child {
    min-width: 0;
}

.profession-quick-card span {
    display: block;
    margin-bottom: 4px;

    font-size: 12px;
    color: #858b95;
}

.profession-quick-card strong {
    display: block;

    font-size: 14px;
    line-height: 1.35;
    color: #22262d;

    overflow-wrap: anywhere;
}


/* ---------- MAIN LAYOUT ---------- */

.profession-detail-layout {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px 70px;

    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 28px;
    align-items: start;
}

.profession-detail-main {
    display: grid;
    gap: 20px;
}

.profession-detail-section {
    background: #ffffff;

    border: 1px solid #e6e8ec;
    border-radius: 22px;

    padding: 32px;

    box-shadow:
        0 8px 28px rgba(16, 24, 40, 0.035);
}

.profession-section-label {
    display: inline-block;
    margin-bottom: 10px;

    color: #c40000;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.profession-detail-section h2 {
    margin: 0 0 18px;

    font-size: 27px;
    line-height: 1.25;
    color: #17191d;
}

.profession-detail-section > p {
    margin: 0 0 14px;

    color: #626873;
    font-size: 15px;
    line-height: 1.8;
}

.profession-detail-section > p:last-child {
    margin-bottom: 0;
}


/* ---------- CHECK LIST ---------- */

.profession-check-list {
    display: grid;
    gap: 13px;
}

.profession-check-list > div {
    padding: 15px 17px;

    display: flex;
    align-items: flex-start;
    gap: 13px;

    background: #f8f9fa;
    border-radius: 14px;
}

.profession-check-list > div > span {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: #e9f7ed;
    color: #147a35;

    font-size: 13px;
    font-weight: 900;
}

.profession-check-list p {
    margin: 1px 0 0;

    color: #555c66;
    line-height: 1.65;
    font-size: 14px;
}


/* ---------- REQUIREMENTS ---------- */

.profession-requirement-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.profession-requirement {
    min-width: 0;

    padding: 18px;

    border: 1px solid #e8eaee;
    border-radius: 16px;

    display: flex;
    gap: 13px;

    background: #fbfbfc;
}

.profession-requirement > span {
    font-size: 25px;
    line-height: 1;
}

.profession-requirement strong {
    display: block;
    margin-bottom: 7px;

    color: #22262d;
    font-size: 14px;
}

.profession-requirement p {
    margin: 0;

    color: #707680;
    font-size: 13px;
    line-height: 1.6;
}


/* ---------- LANGUAGE ---------- */

.profession-language-box {
    display: flex;
    align-items: flex-start;
    gap: 17px;

    padding: 20px;

    border-radius: 16px;
    border: 1px solid #eadfba;

    background: #fffbef;
}

.profession-language-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background:
        linear-gradient(
            180deg,
            #1b1b1b 0 33%,
            #d00000 33% 66%,
            #f2c400 66% 100%
        );

    color: #ffffff;

    font-size: 12px;
    font-weight: 900;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
}

.profession-language-box strong {
    display: block;
    margin-bottom: 7px;

    font-size: 15px;
    color: #272a30;
}

.profession-language-box p {
    margin: 0;

    color: #666b73;
    font-size: 14px;
    line-height: 1.65;
}


/* ---------- SIDEBAR ---------- */

.profession-detail-sidebar {
    display: grid;
    gap: 15px;

    position: sticky;
    top: 25px;
}

.profession-sidebar-card {
    padding: 28px;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #15171c,
            #23272f
        );

    color: #ffffff;

    box-shadow:
        0 20px 45px rgba(16, 24, 40, 0.15);
}

.profession-sidebar-badge {
    display: inline-flex;

    padding: 7px 10px;
    margin-bottom: 18px;

    border-radius: 8px;

    background: rgba(255, 255, 255, 0.09);

    color: #f2c400;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.7px;
}

.profession-sidebar-card h3 {
    margin: 0 0 13px;

    font-size: 25px;
    line-height: 1.25;
}

.profession-sidebar-card > p {
    margin: 0;

    color: #c5c8cf;
    font-size: 14px;
    line-height: 1.7;
}

.profession-sidebar-card > p strong {
    color: #ffffff;
}

.profession-sidebar-steps {
    margin: 25px 0;

    display: grid;
    gap: 13px;
}

.profession-sidebar-steps > div {
    display: flex;
    align-items: center;
    gap: 11px;
}

.profession-sidebar-steps span {
    width: 29px;
    height: 29px;
    flex: 0 0 29px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.1);
    color: #f2c400;

    font-size: 12px;
    font-weight: 800;
}

.profession-sidebar-steps p {
    margin: 0;

    color: #e2e4e8;
    font-size: 13px;
}

.profession-sidebar-button {
    width: 100%;

    display: flex;
    justify-content: center;
    text-align: center;

    box-sizing: border-box;
}

.profession-info-notice {
    padding: 17px;

    display: flex;
    align-items: flex-start;
    gap: 11px;

    background: #ffffff;

    border: 1px solid #e6e8ec;
    border-radius: 15px;
}

.profession-info-notice > span {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #eef1f5;

    font-size: 12px;
    font-weight: 900;
}

.profession-info-notice p {
    margin: 0;

    color: #747a84;
    font-size: 12px;
    line-height: 1.55;
}


/* ---------- PLATFORM SECTION ---------- */

.profession-platform-section {
    padding: 80px max(24px, calc((100% - 1152px) / 2));

    background: #111318;
    color: #ffffff;
}

.profession-platform-heading {
    max-width: 680px;
    margin-bottom: 38px;
}

.profession-platform-heading > span {
    color: #f2c400;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.profession-platform-heading h2 {
    margin: 12px 0;

    font-size: clamp(30px, 4vw, 45px);
    line-height: 1.15;
    letter-spacing: -1px;
}

.profession-platform-heading p {
    margin: 0;

    max-width: 620px;

    color: #aeb3bc;
    line-height: 1.7;
}

.profession-platform-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.profession-platform-grid article {
    min-width: 0;

    padding: 25px;

    border-radius: 18px;

    background: #1b1e24;
    border: 1px solid #2a2e36;

    transition:
        transform 0.2s ease,
        border-color 0.2s ease;
}

.profession-platform-grid article:hover {
    transform: translateY(-4px);
    border-color: #444a55;
}

.profession-platform-grid article > div {
    margin-bottom: 27px;

    color: #f2c400;
    font-size: 13px;
    font-weight: 800;
}

.profession-platform-grid h3 {
    margin: 0 0 9px;

    font-size: 18px;
}

.profession-platform-grid p {
    margin: 0;

    color: #aeb3bc;
    font-size: 13px;
    line-height: 1.65;
}


/* ---------- FINAL CTA ---------- */

.profession-final-cta {
    margin-top: 0;
}


/* ---------- EXPLORER LINK FIX ---------- */

.profession-more {
    text-decoration: none;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {

    .profession-detail-hero {
        grid-template-columns: 1fr 380px;
        gap: 35px;
    }

    .profession-detail-layout {
        grid-template-columns: minmax(0, 1fr) 300px;
    }

    .profession-detail-quick-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profession-platform-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


@media (max-width: 820px) {

    .profession-detail-hero {
        grid-template-columns: 1fr;
        padding-top: 18px;
    }

    .profession-detail-image {
        min-height: 330px;
    }

    .profession-detail-image img {
        min-height: 330px;
    }

    .profession-detail-layout {
        grid-template-columns: 1fr;
    }

    .profession-detail-sidebar {
        position: static;
    }

}


@media (max-width: 620px) {

    .profession-detail-breadcrumb {
        padding-left: 18px;
        padding-right: 18px;
    }

    .profession-detail-hero {
        padding-left: 18px;
        padding-right: 18px;
        padding-bottom: 35px;
        gap: 30px;
    }

    .profession-detail-hero h1 {
        font-size: 39px;
        letter-spacing: -1.3px;
    }

    .profession-detail-intro {
        font-size: 16px;
    }

    .profession-detail-actions {
        display: grid;
    }

    .profession-detail-actions .btn {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
        justify-content: center;
    }

    .profession-detail-image {
        min-height: 285px;
        border-radius: 20px;
    }

    .profession-detail-image img {
        min-height: 285px;
    }

    .profession-detail-quick-grid {
        grid-template-columns: 1fr;
        padding-left: 18px;
        padding-right: 18px;
        margin-bottom: 35px;
    }

    .profession-detail-layout {
        padding-left: 18px;
        padding-right: 18px;
        padding-bottom: 50px;
    }

    .profession-detail-section {
        padding: 23px 19px;
        border-radius: 18px;
    }

    .profession-detail-section h2 {
        font-size: 23px;
    }

    .profession-requirement-grid {
        grid-template-columns: 1fr;
    }

    .profession-language-box {
        flex-direction: column;
    }

    .profession-sidebar-card {
        padding: 24px 20px;
    }

    .profession-platform-section {
        padding: 55px 18px;
    }

    .profession-platform-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 390px) {

    .profession-detail-hero h1 {
        font-size: 34px;
    }

    .profession-detail-tags {
        align-items: flex-start;
    }

    .profession-detail-category,
    .profession-detail-type {
        font-size: 11px;
    }

}
/* =========================================================
   DEUTSCHAKADEMY - PROFESSIONAL PORTAL DASHBOARD
   ========================================================= */

.portal-page {
    margin: 0;
    min-height: 100vh;
    background: #f5f6f8;
    color: #16181d;
    font-family: Arial, Helvetica, sans-serif;
}

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

/* German flag */

.portal-page .flag-line {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    z-index: 2000;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.portal-page .flag-line .black {
    background: #111111;
}

.portal-page .flag-line .red {
    background: #d71920;
}

.portal-page .flag-line .gold {
    background: #f5bd00;
}


/* =========================================================
   LAYOUT
   ========================================================= */

.portal-layout {
    min-height: 100vh;
    display: flex;
    padding-top: 5px;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.portal-sidebar {
    width: 270px;
    min-width: 270px;
    height: calc(100vh - 5px);
    position: fixed;
    top: 5px;
    left: 0;
    z-index: 1000;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    background:
        linear-gradient(
            180deg,
            #121419 0%,
            #191c22 55%,
            #101216 100%
        );

    border-right: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 8px 0 30px rgba(0, 0, 0, 0.08);
}

.portal-sidebar-top {
    min-height: 0;
}

.portal-brand {
    height: 105px;
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 18px 20px;

    text-decoration: none;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.portal-brand img {
    display: block;
    width: 100%;
    max-width: 215px;
    height: 68px;
    object-fit: contain;

    border-radius: 7px;
}


/* Navigation */

.portal-navigation {
    padding: 24px 15px;
}

.portal-nav-label {
    display: block;

    padding: 0 13px;
    margin-bottom: 9px;

    color: #737985;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.6px;
}

.portal-nav-label-second {
    margin-top: 28px;
}

.portal-nav-item {
    min-height: 48px;

    display: flex;
    align-items: center;
    gap: 12px;

    position: relative;

    margin: 4px 0;
    padding: 11px 13px;

    border-radius: 10px;

    color: #bfc4cd;
    text-decoration: none;

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

    transition:
        background 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}

.portal-nav-item:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #ffffff;
    transform: translateX(2px);
}

.portal-nav-item.active {
    color: #ffffff;

    background:
        linear-gradient(
            90deg,
            rgba(211, 35, 42, 0.25),
            rgba(211, 35, 42, 0.08)
        );

    border: 1px solid rgba(226, 57, 63, 0.18);
}

.portal-nav-item.active::before {
    content: "";

    position: absolute;
    left: -15px;
    top: 9px;
    bottom: 9px;

    width: 3px;

    border-radius: 0 4px 4px 0;

    background: #e12b32;
}

.portal-nav-icon {
    width: 24px;
    min-width: 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #f1b900;

    font-size: 18px;
}

.portal-nav-count {
    margin-left: auto;

    min-width: 25px;
    height: 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 7px;

    border-radius: 20px;

    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;

    font-size: 11px;
}


/* Sidebar user */

.portal-sidebar-bottom {
    padding: 18px 16px 20px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.portal-sidebar-user {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 14px;
}

.portal-avatar {
    width: 40px;
    height: 40px;
    min-width: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #d9272e,
            #f0b800
        );

    color: #ffffff;

    font-size: 16px;
    font-weight: 800;
}

.portal-sidebar-user strong {
    display: block;

    max-width: 170px;

    color: #ffffff;

    font-size: 13px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-sidebar-user small {
    display: block;

    max-width: 170px;

    margin-top: 3px;

    color: #858b95;

    font-size: 10px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-logout {
    min-height: 39px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    border: 1px solid rgba(255, 255, 255, 0.11);

    color: #c7cbd2;
    text-decoration: none;

    font-size: 12px;
    font-weight: 700;

    transition: 0.2s ease;
}

.portal-logout:hover {
    background: rgba(211, 35, 42, 0.15);
    border-color: rgba(225, 43, 50, 0.4);
    color: #ffffff;
}


/* =========================================================
   MAIN CONTENT
   ========================================================= */

.portal-main {
    width: calc(100% - 270px);
    min-height: 100vh;

    margin-left: 270px;

    padding: 42px 44px 25px;
}


/* =========================================================
   HEADER
   ========================================================= */

.portal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    margin-bottom: 28px;
}

.portal-eyebrow {
    display: block;

    margin-bottom: 8px;

    color: #9a7500;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.portal-header h1 {
    margin: 0;

    color: #17191e;

    font-size: clamp(27px, 3vw, 39px);
    font-weight: 800;
    letter-spacing: -1.1px;
}

.portal-header p {
    margin: 9px 0 0;

    color: #6c717b;

    font-size: 14px;
    line-height: 1.6;
}

.portal-header-actions {
    flex-shrink: 0;
}

.portal-system-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 10px 15px;

    border-radius: 30px;

    font-size: 12px;
    font-weight: 800;
}

.portal-system-pill span {
    width: 8px;
    height: 8px;

    border-radius: 50%;
}

.portal-system-pill.active {
    background: #eaf8ef;
    color: #187a3d;
    border: 1px solid #c9ead5;
}

.portal-system-pill.active span {
    background: #20a458;
    box-shadow: 0 0 0 4px rgba(32, 164, 88, 0.12);
}

.portal-system-pill.inactive {
    background: #fff7e6;
    color: #926600;
    border: 1px solid #f1dfa9;
}

.portal-system-pill.inactive span {
    background: #e3a600;
    box-shadow: 0 0 0 4px rgba(227, 166, 0, 0.13);
}


/* =========================================================
   SYSTEM PANEL
   ========================================================= */

.portal-system-panel {
    min-height: 150px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    position: relative;
    overflow: hidden;

    margin-bottom: 24px;
    padding: 27px 30px;

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(219, 42, 49, 0.2),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #15181e 0%,
            #20242c 100%
        );

    color: #ffffff;

    box-shadow: 0 14px 35px rgba(20, 22, 27, 0.11);
}

.portal-system-panel::after {
    content: "";

    position: absolute;
    width: 180px;
    height: 180px;

    right: -60px;
    bottom: -105px;

    border-radius: 50%;

    border: 25px solid rgba(240, 184, 0, 0.08);
}

.portal-system-copy {
    position: relative;
    z-index: 2;
}

.portal-system-title {
    display: flex;
    align-items: center;
    gap: 15px;
}

.portal-system-icon {
    width: 47px;
    height: 47px;
    min-width: 47px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: rgba(240, 184, 0, 0.12);
    border: 1px solid rgba(240, 184, 0, 0.18);

    color: #f2bd14;

    font-size: 20px;
}

.portal-system-title span {
    display: block;

    margin-bottom: 3px;

    color: #d4a90f;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.portal-system-title h2 {
    margin: 0;

    color: #ffffff;

    font-size: 21px;
}

.portal-system-copy > p {
    max-width: 690px;

    margin: 16px 0 0;

    color: #b7bcc6;

    font-size: 13px;
    line-height: 1.7;
}

.portal-system-state {
    min-width: 215px;

    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 15px 17px;

    border-radius: 12px;

    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.portal-status-dot {
    width: 12px;
    height: 12px;
    min-width: 12px;

    border-radius: 50%;
}

.portal-status-dot.active {
    background: #39c875;
    box-shadow: 0 0 0 5px rgba(57, 200, 117, 0.12);
}

.portal-status-dot.inactive {
    background: #e5ae0d;
    box-shadow: 0 0 0 5px rgba(229, 174, 13, 0.12);
}

.portal-system-state strong {
    display: block;

    color: #ffffff;

    font-size: 12px;
}

.portal-system-state small {
    display: block;

    margin-top: 3px;

    color: #939aa6;

    font-size: 10px;
}


/* =========================================================
   STATISTICS
   ========================================================= */

.portal-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;

    margin-bottom: 24px;
}

.portal-stat-card {
    position: relative;
    overflow: hidden;

    min-height: 145px;

    padding: 21px;

    border-radius: 15px;

    background: #ffffff;

    border: 1px solid #e6e8ec;

    box-shadow: 0 5px 18px rgba(18, 22, 28, 0.035);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.portal-stat-card:hover {
    transform: translateY(-2px);

    border-color: #d9dce1;

    box-shadow: 0 10px 28px rgba(18, 22, 28, 0.07);
}

.portal-stat-card::after {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 3px;
    height: 100%;

    background:
        linear-gradient(
            #17191e,
            #d7252c,
            #f0b800
        );
}

.portal-stat-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    color: #747983;

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

.portal-stat-icon {
    width: 31px;
    height: 31px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: #f4f5f7;

    color: #4e535c;

    font-size: 15px;
}

.portal-stat-card > strong {
    display: block;

    margin-top: 14px;

    color: #17191e;

    font-size: 31px;
    line-height: 1;
}

.portal-stat-card > small {
    display: block;

    margin-top: 9px;

    color: #9a9ea6;

    font-size: 10px;
}


/* =========================================================
   PANELS
   ========================================================= */

.portal-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;

    margin-bottom: 24px;
}

.portal-panel,
.portal-applications {
    border-radius: 16px;

    background: #ffffff;

    border: 1px solid #e5e7eb;

    box-shadow: 0 5px 20px rgba(18, 22, 28, 0.035);
}

.portal-panel {
    padding: 24px;
}

.portal-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 21px;
}

.portal-panel-label {
    display: block;

    margin-bottom: 5px;

    color: #a17a00;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.portal-panel-heading h2,
.portal-section-heading h2 {
    margin: 0;

    color: #1b1e23;

    font-size: 19px;
}

.portal-panel-icon {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background: #f6f7f8;

    color: #d5262d;

    font-size: 17px;
}


/* Profile */

.portal-profile-list {
    display: flex;
    flex-direction: column;
}

.portal-profile-row {
    min-height: 47px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    border-bottom: 1px solid #eff0f2;
}

.portal-profile-row:last-child {
    border-bottom: 0;
}

.portal-profile-row span {
    color: #7d828b;

    font-size: 12px;
}

.portal-profile-row strong {
    max-width: 62%;

    color: #24272d;

    font-size: 12px;
    text-align: right;
}


/* Process */

.portal-process-list {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.portal-process-item {
    display: flex;
    align-items: center;
    gap: 13px;
}

.portal-process-item > span {
    width: 32px;
    height: 32px;
    min-width: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #f7f1df;
    color: #8f6b00;

    font-size: 11px;
    font-weight: 800;
}

.portal-process-item strong {
    display: block;

    color: #292c31;

    font-size: 12px;
}

.portal-process-item small {
    display: block;

    margin-top: 3px;

    color: #92969e;

    font-size: 10px;
    line-height: 1.4;
}


/* =========================================================
   APPLICATIONS
   ========================================================= */

.portal-applications {
    overflow: hidden;

    margin-bottom: 24px;
}

.portal-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;

    padding: 24px 25px;

    border-bottom: 1px solid #eceef1;
}

.portal-section-heading p {
    margin: 7px 0 0;

    color: #8b9098;

    font-size: 11px;
}

.portal-warning {
    padding: 8px 12px;

    border-radius: 8px;

    background: #fff0f0;
    border: 1px solid #f4caca;

    color: #b51f25;

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


/* Table */

.portal-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.portal-table {
    width: 100%;
    min-width: 790px;

    border-collapse: collapse;
}

.portal-table th {
    padding: 13px 20px;

    background: #fafafa;

    color: #858a93;

    border-bottom: 1px solid #eceef1;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.7px;

    text-align: left;
    text-transform: uppercase;
}

.portal-table td {
    padding: 16px 20px;

    border-bottom: 1px solid #f0f1f3;

    color: #626771;

    font-size: 11px;
    vertical-align: middle;
}

.portal-table tbody tr:last-child td {
    border-bottom: 0;
}

.portal-table tbody tr {
    transition: background 0.18s ease;
}

.portal-table tbody tr:hover {
    background: #fcfcfd;
}

.portal-table td strong {
    color: #282b31;
    font-size: 11px;
}


/* Status badges */

.portal-status-badge {
    display: inline-flex;
    align-items: center;

    padding: 6px 9px;

    border-radius: 20px;

    background: #f1f2f4;
    color: #656a72;

    font-size: 9px;
    font-weight: 800;

    white-space: nowrap;
}

.portal-status-badge.sent {
    background: #e9f8ef;
    color: #16723a;
}

.portal-status-badge.processing {
    background: #eaf2ff;
    color: #2c61a9;
}

.portal-status-badge.queued {
    background: #fff7df;
    color: #886500;
}

.portal-status-badge.failed {
    background: #ffeded;
    color: #b41f25;
}

.portal-status-badge.replied {
    background: #eeeafe;
    color: #6246a6;
}

.portal-status-badge.accepted {
    background: #e7f8ec;
    color: #11743a;
}

.portal-status-badge.rejected {
    background: #f3f3f4;
    color: #686c73;
}


/* Empty states */

.portal-empty-state {
    min-height: 240px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 40px 25px;

    text-align: center;
}

.portal-empty-icon {
    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 14px;

    border-radius: 50%;

    background: #f6f1e4;
    color: #a47a00;

    font-size: 21px;
}

.portal-empty-state h3 {
    margin: 0;

    color: #24272c;

    font-size: 16px;
}

.portal-empty-state p {
    max-width: 430px;

    margin: 8px auto 0;

    color: #8b9098;

    font-size: 11px;
    line-height: 1.6;
}

.portal-empty-note {
    display: inline-block;

    margin-top: 14px;
    padding: 8px 12px;

    border-radius: 8px;

    background: #fff8e5;

    color: #8d6900;

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

.portal-empty-small {
    padding: 20px;

    border-radius: 10px;

    background: #f8f8f9;

    text-align: center;
}

.portal-empty-small strong {
    color: #2c2f34;
    font-size: 12px;
}

.portal-empty-small p {
    margin: 7px 0 0;

    color: #8d9198;

    font-size: 10px;
    line-height: 1.5;
}


/* =========================================================
   FOOTER
   ========================================================= */

.portal-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;

    padding: 5px 2px 15px;

    color: #a0a4ab;

    font-size: 10px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1150px) {

    .portal-sidebar {
        width: 230px;
        min-width: 230px;
    }

    .portal-main {
        width: calc(100% - 230px);
        margin-left: 230px;
        padding: 35px 27px 22px;
    }

    .portal-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .portal-brand img {
        max-width: 185px;
    }
}


@media (max-width: 850px) {

    .portal-layout {
        display: block;
    }

    .portal-sidebar {
        width: 100%;
        min-width: 0;
        height: auto;

        position: relative;
        top: 0;

        display: block;
    }

    .portal-brand {
        height: 82px;
    }

    .portal-brand img {
        width: auto;
        max-width: 210px;
        height: 55px;
    }

    .portal-navigation {
        display: flex;
        gap: 6px;

        padding: 11px 14px;

        overflow-x: auto;
    }

    .portal-nav-label,
    .portal-nav-label-second {
        display: none;
    }

    .portal-nav-item {
        flex: 0 0 auto;

        min-height: 40px;

        margin: 0;
        padding: 8px 11px;

        font-size: 11px;
    }

    .portal-nav-item.active::before {
        display: none;
    }

    .portal-nav-count {
        display: none;
    }

    .portal-sidebar-bottom {
        display: none;
    }

    .portal-main {
        width: 100%;

        margin-left: 0;

        padding: 28px 18px 20px;
    }

    .portal-header {
        align-items: flex-start;
    }

    .portal-system-panel {
        align-items: flex-start;
        flex-direction: column;
    }

    .portal-system-state {
        width: 100%;
        min-width: 0;
    }

    .portal-overview-grid {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 600px) {

    .portal-main {
        padding: 22px 13px 18px;
    }

    .portal-header {
        flex-direction: column;
        gap: 15px;
    }

    .portal-header h1 {
        font-size: 27px;
    }

    .portal-system-panel {
        padding: 22px 18px;
        border-radius: 14px;
    }

    .portal-system-title {
        align-items: flex-start;
    }

    .portal-system-title h2 {
        font-size: 18px;
    }

    .portal-stats {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .portal-stat-card {
        min-height: 130px;
        padding: 17px 15px;
    }

    .portal-stat-card > strong {
        font-size: 27px;
    }

    .portal-overview-grid {
        gap: 13px;
    }

    .portal-panel {
        padding: 19px 16px;
    }

    .portal-profile-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;

        padding: 11px 0;
    }

    .portal-profile-row strong {
        max-width: 100%;
        text-align: left;
    }

    .portal-section-heading {
        align-items: flex-start;
        flex-direction: column;

        padding: 20px 17px;
    }

    .portal-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
}


@media (max-width: 390px) {

    .portal-stats {
        grid-template-columns: 1fr;
    }

    .portal-nav-icon {
        display: none;
    }
}
/* =========================================================
   MEIN PROFIL
========================================================= */

.profile-edit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 24px;
    align-items: start;
}

.profile-edit-main {
    min-width: 0;
}

.profile-form {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.profile-form-section {
    margin: 0;
}

.profile-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.profile-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.profile-field-full {
    grid-column: 1 / -1;
}

.profile-field label {
    color: #111827;
    font-size: 14px;
    font-weight: 700;
}

.profile-field small {
    color: #7b8493;
    font-size: 12px;
    line-height: 1.55;
}


/* =========================================================
   INPUTS
========================================================= */

.profile-input {
    width: 100%;
    min-height: 48px;
    box-sizing: border-box;

    padding: 11px 14px;

    border: 1px solid #d9dee7;
    border-radius: 10px;

    background: #ffffff;
    color: #111827;

    font: inherit;
    font-size: 14px;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}

.profile-input:hover {
    border-color: #b8c0cc;
}

.profile-input:focus {
    border-color: #111827;
    box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.08);
}

.profile-input:disabled {
    background: #f4f6f8;
    color: #7b8493;
    cursor: not-allowed;
}

.profile-textarea {
    min-height: 135px;
    resize: vertical;
    line-height: 1.6;
}

select.profile-input {
    cursor: pointer;
}


/* =========================================================
   ERRORS
========================================================= */

.profile-field-error {
    color: #b42318;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.profile-field-error ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.profile-form-alert {
    padding: 14px 16px;
    border-radius: 10px;
    font-size: 14px;
}

.profile-form-alert.error {
    color: #b42318;
    background: #fff1f0;
    border: 1px solid #ffd5d2;
}


/* =========================================================
   PDF DOCUMENT
========================================================= */

.profile-document-box {
    display: flex;
    gap: 18px;
    margin-top: 24px;
    padding: 20px;

    background: #f8f9fb;
    border: 1px solid #e5e8ee;
    border-radius: 14px;
}

.profile-document-icon {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: #111827;
    color: #ffffff;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.profile-document-copy {
    flex: 1;
    min-width: 0;
}

.profile-document-copy > strong {
    display: block;
    color: #111827;
    font-size: 15px;
}

.profile-document-copy > p {
    margin: 6px 0 3px;
    color: #4b5563;
    font-size: 14px;
    line-height: 1.55;
}

.profile-document-copy > small {
    color: #7b8493;
    font-size: 12px;
    line-height: 1.5;
}

.profile-current-file {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-top: 16px;
    padding: 12px 14px;

    background: #ecfdf3;
    border: 1px solid #c9f0d8;
    border-radius: 10px;
}

.profile-current-file > span {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #157347;
    color: #ffffff;

    font-size: 13px;
    font-weight: 800;
}

.profile-current-file div {
    min-width: 0;
}

.profile-current-file strong,
.profile-current-file small {
    display: block;
}

.profile-current-file strong {
    color: #14532d;
    font-size: 13px;
}

.profile-current-file small {
    margin-top: 2px;
    color: #4b6f5a;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-file-field {
    margin-top: 16px;
}

.profile-file-input {
    display: block;
    width: 100%;
    box-sizing: border-box;

    padding: 10px;

    border: 1px dashed #c9ced8;
    border-radius: 10px;

    background: #ffffff;
    color: #374151;

    font: inherit;
    font-size: 13px;
}

.profile-file-input::file-selector-button {
    margin-right: 12px;
    padding: 9px 13px;

    border: 0;
    border-radius: 8px;

    background: #111827;
    color: #ffffff;

    font-weight: 700;
    cursor: pointer;
}

.profile-file-hint {
    display: block;
    margin-top: 8px;
}


/* =========================================================
   SAVE BAR
========================================================= */

.profile-save-bar {
    position: sticky;
    bottom: 18px;
    z-index: 20;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    padding: 17px 20px;

    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #e1e5eb;
    border-radius: 14px;

    box-shadow: 0 12px 35px rgba(17, 24, 39, 0.12);
    backdrop-filter: blur(10px);
}

.profile-save-bar strong,
.profile-save-bar small {
    display: block;
}

.profile-save-bar strong {
    color: #111827;
    font-size: 14px;
}

.profile-save-bar small {
    margin-top: 3px;
    color: #7b8493;
    font-size: 12px;
}

.profile-save-button {
    flex-shrink: 0;

    min-height: 46px;
    padding: 0 22px;

    border: 0;
    border-radius: 10px;

    background: #111827;
    color: #ffffff;

    font: inherit;
    font-size: 14px;
    font-weight: 800;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}

.profile-save-button:hover {
    transform: translateY(-1px);
    background: #000000;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.18);
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.profile-edit-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.profile-side-card {
    margin: 0;
}

.profile-side-card h3 {
    margin: 10px 0 8px;
    color: #111827;
    font-size: 17px;
}

.profile-side-card > p {
    margin: 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.65;
}


/* =========================================================
   SYSTEM STATUS
========================================================= */

.profile-big-status {
    display: flex;
    align-items: flex-start;
    gap: 11px;

    margin-top: 14px;
    padding: 14px;

    border-radius: 11px;
}

.profile-big-status > span {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;

    margin-top: 5px;

    border-radius: 50%;
}

.profile-big-status strong,
.profile-big-status small {
    display: block;
}

.profile-big-status strong {
    font-size: 14px;
}

.profile-big-status small {
    margin-top: 3px;
    font-size: 12px;
    line-height: 1.45;
}

.profile-big-status.active {
    background: #ecfdf3;
    border: 1px solid #c9f0d8;
}

.profile-big-status.active > span {
    background: #16a34a;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.12);
}

.profile-big-status.active strong {
    color: #14532d;
}

.profile-big-status.active small {
    color: #4b6f5a;
}

.profile-big-status.inactive {
    background: #fff8e6;
    border: 1px solid #f1dfaa;
}

.profile-big-status.inactive > span {
    background: #d89a00;
    box-shadow: 0 0 0 4px rgba(216, 154, 0, 0.12);
}

.profile-big-status.inactive strong {
    color: #765500;
}

.profile-big-status.inactive small {
    color: #806d3b;
}


/* =========================================================
   CHECK LIST
========================================================= */

.profile-check-list {
    display: flex;
    flex-direction: column;
    gap: 11px;

    margin-top: 15px;
}

.profile-check-list div {
    display: flex;
    align-items: center;
    gap: 9px;

    color: #4b5563;
    font-size: 13px;
    font-weight: 600;
}

.profile-check-list span {
    flex: 0 0 23px;
    width: 23px;
    height: 23px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ecfdf3;
    color: #15803d;

    font-size: 11px;
    font-weight: 900;
}

.profile-coming-soon {
    display: inline-flex;

    margin-top: 14px;
    padding: 6px 10px;

    border-radius: 999px;

    background: #f2f4f7;
    color: #667085;

    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}


/* =========================================================
   PROFILE RESPONSIVE
========================================================= */

@media (max-width: 1100px) {

    .profile-edit-layout {
        grid-template-columns: 1fr;
    }

    .profile-edit-side {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 720px) {

    .profile-form-grid {
        grid-template-columns: 1fr;
    }

    .profile-field-full {
        grid-column: auto;
    }

    .profile-edit-side {
        grid-template-columns: 1fr;
    }

    .profile-document-box {
        flex-direction: column;
    }

    .profile-save-bar {
        position: static;
        flex-direction: column;
        align-items: stretch;
    }

    .profile-save-button {
        width: 100%;
    }
}

/* =========================================================
   STAGE 6 - MEINE BEWERBUNGEN / ONLINE STELLEN
========================================================= */
.stage6-header { margin-bottom: 24px; }
.stage6-total { min-width: 145px; padding: 15px 18px; border: 1px solid #e4e7ec; border-radius: 14px; background: #fff; text-align: center; box-shadow: 0 6px 22px rgba(17,24,39,.05); }
.stage6-total strong,.stage6-total span { display:block; }
.stage6-total strong { color:#111827; font-size:26px; }
.stage6-total span { margin-top:3px; color:#7b8493; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; }
.stage6-toolbar,.stage6-search-card { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:20px; padding:18px 20px; background:#fff; border:1px solid #e5e8ee; border-radius:14px; box-shadow:0 6px 22px rgba(17,24,39,.04); }
.stage6-filter-form { min-width:230px; }
.stage6-filter-form label,.stage6-search-form label { display:block; margin-bottom:7px; color:#4b5563; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.45px; }
.stage6-search-form { width:100%; display:grid; grid-template-columns:minmax(180px,1fr) minmax(160px,.7fr) auto auto; gap:12px; align-items:end; }
.stage6-primary-button,.stage6-secondary-button { min-height:46px; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; padding:0 17px; border:0; border-radius:10px; background:#111827; color:#fff; text-decoration:none; font-size:12px; font-weight:800; cursor:pointer; transition:.18s ease; }
.stage6-primary-button:hover,.stage6-secondary-button:hover { transform:translateY(-1px); background:#000; box-shadow:0 8px 18px rgba(17,24,39,.16); }
.stage6-secondary-button { background:#fff; color:#111827; border:1px solid #dfe3e8; }
.stage6-reset { min-height:46px; display:flex; align-items:center; color:#69717e; font-size:11px; font-weight:700; text-decoration:none; white-space:nowrap; }
.stage6-card { margin-bottom:22px; background:#fff; border:1px solid #e5e8ee; border-radius:15px; overflow:hidden; }
.stage6-job-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.stage6-job-card { min-width:0; padding:22px; background:#fff; border:1px solid #e3e6eb; border-radius:15px; box-shadow:0 6px 22px rgba(17,24,39,.045); transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.stage6-job-card:hover { transform:translateY(-2px); border-color:#cfd5dd; box-shadow:0 12px 28px rgba(17,24,39,.08); }
.stage6-job-top { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.stage6-match,.stage6-method { display:inline-flex; padding:6px 9px; border-radius:999px; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.35px; }
.stage6-match { background:#ecfdf3; color:#157347; }
.stage6-method { background:#f2f4f7; color:#667085; }
.stage6-job-card h2 { margin:17px 0 7px; color:#171a20; font-size:17px; line-height:1.35; }
.stage6-company { color:#4b5563; font-size:12px; }
.stage6-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.stage6-meta span { padding:6px 9px; border-radius:8px; background:#f7f8fa; color:#69717e; font-size:10px; font-weight:700; }
.stage6-job-card > p { min-height:48px; margin:15px 0 18px; color:#7b8493; font-size:11px; line-height:1.6; }
.stage6-job-actions { padding-top:16px; border-top:1px solid #eef0f3; }
.stage6-job-actions .stage6-primary-button { width:100%; }
.stage6-job-actions small { display:block; margin-top:9px; color:#9aa0aa; font-size:9px; text-align:center; }
.stage6-pagination { display:flex; justify-content:center; align-items:center; gap:14px; margin:22px 0; }
.stage6-pagination a,.stage6-pagination span { padding:9px 12px; border-radius:9px; background:#fff; border:1px solid #e2e5ea; color:#505763; font-size:10px; font-weight:700; text-decoration:none; }
@media(max-width:900px){.stage6-job-grid{grid-template-columns:1fr}.stage6-search-form{grid-template-columns:1fr 1fr}.stage6-reset{min-height:auto}}
@media(max-width:600px){.stage6-total{width:100%;box-sizing:border-box}.stage6-toolbar{align-items:stretch;flex-direction:column}.stage6-filter-form,.stage6-secondary-button{width:100%}.stage6-search-form{grid-template-columns:1fr}.stage6-job-card{padding:18px}.stage6-pagination{justify-content:space-between}.stage6-pagination a,.stage6-pagination span{font-size:9px;padding:8px}}

/* =========================================================
   Stage 7 · DeutschAkademy Admin Control Center
   ========================================================= */
.admin7-page{background:#f4f5f7;color:#17191d}.admin7-shell{min-height:calc(100vh - 4px);display:grid;grid-template-columns:272px minmax(0,1fr)}.admin7-sidebar{position:sticky;top:0;height:calc(100vh - 4px);background:#111317;color:#fff;padding:26px 18px 20px;display:flex;flex-direction:column;z-index:10}.admin7-brand{display:flex;align-items:center;gap:12px;padding:0 8px 25px;color:#fff;text-decoration:none;border-bottom:1px solid #292c32}.admin7-brand img{width:48px;height:48px;border-radius:10px;object-fit:cover;background:#fff}.admin7-brand b{display:block;font-size:15px}.admin7-brand span{display:block;color:#f5c518;font-size:9px;letter-spacing:1.7px;margin-top:4px}.admin7-sidebar nav{display:flex;flex-direction:column;gap:5px;margin-top:22px;flex:1}.admin7-sidebar nav small{color:#777e89;font-size:10px;font-weight:800;letter-spacing:1.6px;padding:18px 12px 7px}.admin7-sidebar nav a{color:#cbd0d8;text-decoration:none;padding:12px 13px;border-radius:9px;font-size:13px;font-weight:700;transition:.18s}.admin7-sidebar nav a:hover{background:#1d2026;color:#fff}.admin7-sidebar nav a.active{background:#fff;color:#17191d;box-shadow:inset 4px 0 #dd0000}.admin7-admin{border-top:1px solid #292c32;padding:18px 8px 0;display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center}.admin7-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#dd0000;font-weight:900}.admin7-admin b,.admin7-admin span{display:block;font-size:11px}.admin7-admin span{color:#858b95;margin-top:3px}.admin7-admin a{font-size:10px;color:#aaa;text-decoration:none}.admin7-main{min-width:0;padding:38px 42px 24px}.admin7-top{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px}.admin7-kicker{font-size:10px;font-weight:900;letter-spacing:1.8px;color:#b40000}.admin7-top h1{font-size:31px;letter-spacing:-.8px;margin:6px 0}.admin7-top p{color:#747a84;font-size:13px}.admin7-live{background:#fff;border:1px solid #e5e7eb;padding:10px 13px;border-radius:30px;font-size:11px;font-weight:800;box-shadow:0 4px 16px #0000000a}.admin7-live i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#16a34a;margin-right:7px}.admin7-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.admin7-metrics>div{background:#fff;border:1px solid #e4e6ea;border-radius:13px;padding:20px 21px;box-shadow:0 5px 20px #11182708;border-top:3px solid #17191d}.admin7-metrics>div:nth-child(2){border-top-color:#dd0000}.admin7-metrics>div:nth-child(3){border-top-color:#f5c518}.admin7-metrics>div.danger{border-top-color:#dc2626;background:#fffafa}.admin7-metrics span,.admin7-cardhead span,.admin7-action>div>span{font-size:9px;letter-spacing:1.5px;font-weight:900;color:#858b95}.admin7-metrics b{display:block;font-size:27px;margin:8px 0 5px}.admin7-metrics small{font-size:10px;color:#858b95}.admin7-metrics.compact b{font-size:23px}.admin7-grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}.admin7-card{background:#fff;border:1px solid #e4e6ea;border-radius:13px;padding:20px;box-shadow:0 5px 20px #11182708;margin-bottom:18px}.admin7-cardhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.admin7-cardhead h2,.admin7-action h2{font-size:17px;margin-top:5px}.admin7-cardhead a{font-size:11px;font-weight:800;color:#b40000;text-decoration:none}.admin7-health{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.admin7-health div{background:#f7f8fa;border-radius:9px;padding:15px}.admin7-health b{display:block;font-size:20px}.admin7-health span{font-size:10px;color:#777}.admin7-tablewrap{overflow:auto}.admin7-table{width:100%;border-collapse:collapse;font-size:12px}.admin7-table th{text-align:left;padding:11px 12px;color:#7b818b;font-size:9px;letter-spacing:.7px;border-bottom:1px solid #e9eaed}.admin7-table td{padding:13px 12px;border-bottom:1px solid #eff0f2;vertical-align:middle}.admin7-table tr:last-child td{border-bottom:0}.admin7-table td small{display:block;color:#8a9099;margin-top:4px}.admin7-table a{color:#b40000;font-weight:800;text-decoration:none}.admin7-table code{font-size:10px;background:#f4f4f5;padding:4px 6px;border-radius:5px}.admin7-badge{display:inline-block;padding:5px 8px;border-radius:20px;font-size:9px;font-weight:900;background:#eef0f2;color:#555}.admin7-badge.ok,.admin7-badge.sent,.admin7-badge.accepted{background:#e9f8ee;color:#137333}.admin7-badge.warn,.admin7-badge.failed{background:#fff4dc;color:#9a5b00}.admin7-badge.danger{background:#feecec;color:#b91c1c}.admin7-badge.info,.admin7-badge.processing,.admin7-badge.queued{background:#eaf2ff;color:#2456a6}.admin7-badge.mute{background:#f0f1f3;color:#747a84}.admin7-empty{text-align:center!important;color:#8a9099;padding:32px!important}.admin7-filter{display:flex;gap:9px;margin-bottom:16px}.admin7-filter input,.admin7-filter select{height:42px;border:1px solid #dfe2e6;background:#fff;border-radius:9px;padding:0 12px;font-size:12px;min-width:180px}.admin7-filter input{flex:1}.admin7-filter button,.admin7-btn{border:0;background:#17191d;color:#fff;border-radius:9px;padding:0 18px;font-weight:800;cursor:pointer}.admin7-btn{padding:12px 17px}.admin7-btn.secondary{background:#fff;color:#b91c1c;border:1px solid #efcaca}.admin7-pagination{display:flex;align-items:center;justify-content:center;gap:18px;font-size:11px;color:#777;margin:18px 0}.admin7-pagination a{color:#b40000;text-decoration:none;font-weight:800}.admin7-dl>div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #eee;font-size:12px}.admin7-dl dt{color:#7a8089}.admin7-dl dd{font-weight:800}.admin7-systemstate strong{font-size:16px}.admin7-systemstate strong.on{color:#15803d}.admin7-systemstate p{font-size:11px;color:#737984;margin:10px 0 16px}.admin7-action{display:flex;justify-content:space-between;align-items:center;border-left:4px solid #f5c518}.admin7-action p{font-size:11px;color:#737984;margin-top:7px}.admin7-runlist>div{display:grid;grid-template-columns:auto 1fr auto;gap:7px 10px;align-items:center;padding:12px 0;border-bottom:1px solid #eee}.admin7-runlist b{font-size:11px}.admin7-runlist small{grid-column:2;font-size:10px;color:#7d838d}.admin7-runlist time{font-size:9px;color:#999;grid-row:1/3;grid-column:3}.admin7-alert{display:flex;gap:12px;align-items:center;background:#fff3f3;border:1px solid #f1c7c7;border-left:4px solid #dc2626;padding:14px 16px;border-radius:10px;margin-bottom:16px;font-size:11px}.admin7-alert b{color:#b91c1c}.admin7-message{padding:12px 15px;border-radius:9px;margin-bottom:14px;font-size:11px;font-weight:700;background:#eef6ff}.admin7-message.success{background:#e9f8ee;color:#137333}.admin7-message.error{background:#feecec;color:#b91c1c}.admin7-footer{color:#9a9fa7;font-size:9px;text-align:center;padding:18px}.admin7-page .flag-line{position:fixed;top:0;z-index:20}.admin7-shell{padding-top:4px}
@media(max-width:1100px){.admin7-shell{grid-template-columns:220px}.admin7-main{padding:30px 24px}.admin7-metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:780px){.admin7-shell{display:block}.admin7-sidebar{position:relative;height:auto}.admin7-sidebar nav{display:grid;grid-template-columns:1fr 1fr}.admin7-sidebar nav small{grid-column:1/-1}.admin7-admin{margin-top:15px}.admin7-main{padding:24px 14px}.admin7-top{align-items:flex-start;gap:16px}.admin7-live{display:none}.admin7-grid2{grid-template-columns:1fr}.admin7-filter{flex-direction:column}.admin7-filter input,.admin7-filter select,.admin7-filter button{width:100%;min-width:0;height:42px}.admin7-action{align-items:flex-start;gap:16px;flex-direction:column}}@media(max-width:480px){.admin7-metrics{grid-template-columns:1fr 1fr}.admin7-metrics>div{padding:15px}.admin7-metrics b{font-size:22px}.admin7-sidebar nav{grid-template-columns:1fr}.admin7-sidebar nav small{grid-column:auto}.admin7-top h1{font-size:26px}}


/* ===== Unified Auth + Stage 7 polish ===== */
.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(360px,1fr) minmax(440px,1fr);background:#f4f6f8;color:#111;font-family:Inter,Segoe UI,Arial,sans-serif}.auth-left{min-height:100vh;background:linear-gradient(145deg,#111 0%,#1d1d1f 100%);color:#fff;padding:52px clamp(34px,6vw,88px);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.auth-left:after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(255,206,0,.14);border-radius:50%;right:-170px;bottom:-120px}.auth-logo{width:190px;max-height:72px;object-fit:contain;object-position:left center;border-radius:12px}.auth-copy{position:relative;z-index:1}.auth-kicker,.auth-card-kicker{display:block;font-size:11px;letter-spacing:.18em;font-weight:800;margin-bottom:16px}.auth-kicker{color:#ffce00}.auth-card-kicker{color:#b51d26}.auth-left h1{font-size:clamp(38px,4vw,62px);max-width:650px;letter-spacing:-.045em}.auth-left p{font-size:17px;max-width:570px;color:#c7cbd1}.auth-back{color:#d9dde3;text-decoration:none;font-weight:700;position:relative;z-index:1}.auth-right{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:48px;background:#f7f8fa}.auth-card{width:min(100%,500px);background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:42px;box-shadow:0 24px 70px rgba(17,24,39,.10)}.auth-card h2{font-size:38px;letter-spacing:-.035em;margin:0 0 8px}.auth-subtitle{color:#68707c;line-height:1.6;margin-bottom:28px}.auth-form{display:grid;gap:18px}.auth-field{display:grid;gap:8px}.auth-field label{font-size:13px;font-weight:800;color:#30343b}.auth-field input,.auth-field select{width:100%;height:50px;border:1px solid #d8dce2;border-radius:11px;padding:0 14px;font:inherit;background:#fff;outline:none}.auth-field input:focus,.auth-field select:focus{border-color:#111;box-shadow:0 0 0 3px rgba(17,17,17,.07)}.auth-form button{height:52px;border:0;border-radius:11px;background:#111;color:#fff;font-weight:800;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:0 18px}.auth-form button:hover{background:#262626}.auth-footer{margin-top:24px;padding-top:22px;border-top:1px solid #eceef1;color:#68707c}.auth-footer a{color:#111;font-weight:800}.auth-alert{background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;padding:12px 14px;border-radius:10px;margin-bottom:18px}.auth-help{color:#737b86;line-height:1.45}.auth-help ul{padding-left:18px}.auth-error{color:#b42318;font-weight:700}.auth-trust{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px;color:#69717d;font-size:12px}.legal-shell{max-width:900px;margin:80px auto;padding:0 28px}.legal-shell h1{font-size:52px;margin:18px 0 8px}.legal-shell h2{font-size:22px;color:#555;margin-bottom:24px}.legal-shell p{font-size:17px;line-height:1.8;color:#4d5560;margin-bottom:30px}.admin7-btn.compact{display:inline-flex;width:auto;padding:9px 13px;text-decoration:none;font-size:13px}.admin7-longtext{max-width:520px;line-height:1.55}.admin7-link{font-weight:800;color:#8f171d;text-decoration:none}.admin7-dl dd{overflow-wrap:anywhere}
@media(max-width:850px){.auth-page{grid-template-columns:1fr}.auth-left{min-height:auto;padding:28px}.auth-copy{display:none}.auth-right{min-height:calc(100vh - 120px);padding:24px}.auth-card{padding:28px 22px}.auth-logo{width:160px}.auth-card h2{font-size:32px}}