/* =========================================================
   GEWERKENETZ – KOMPLETTES FRONTEND-STYLESHEET
   Version 1.0.0
   ========================================================= */

:root {
    --gn-navy: #07346b;
    --gn-blue: #1768d5;
    --gn-teal: #12aeb5;
    --gn-teal-dark: #0d9096;
    --gn-text: #263238;
    --gn-muted: #667085;
    --gn-light: #f5f7fa;
    --gn-border: #e3e9f0;
    --gn-white: #ffffff;
    --gn-danger: #b42318;
    --gn-shadow-sm: 0 5px 16px rgba(7, 52, 107, 0.05);
    --gn-shadow-md: 0 8px 24px rgba(7, 52, 107, 0.08);
    --gn-shadow-lg: 0 16px 38px rgba(7, 52, 107, 0.18);
}

html {
    scroll-behavior: smooth;
}

body {
    color: var(--gn-text);
}

body .site-content {
    overflow: hidden;
}

body a {
    color: var(--gn-navy);
    transition: color 0.2s ease;
}

body a:hover {
    color: var(--gn-teal);
}

.gewerkenetz-hero,
.gewerkenetz-bereiche,
.gewerkenetz-aktuell,
.gewerkenetz-ablauf,
.gewerkenetz-zielgruppen,
.gewerkenetz-gewerke,
.gewerkenetz-mailing,
.gewerkenetz-faq,
.gewerkenetz-abschluss,
.gewerkenetz-seite {
    box-sizing: border-box;
}

.gewerkenetz-hero *,
.gewerkenetz-bereiche *,
.gewerkenetz-aktuell *,
.gewerkenetz-ablauf *,
.gewerkenetz-zielgruppen *,
.gewerkenetz-gewerke *,
.gewerkenetz-mailing *,
.gewerkenetz-faq *,
.gewerkenetz-abschluss *,
.gewerkenetz-seite * {
    box-sizing: border-box;
}

/* =========================================================
   HERO
   ========================================================= */

.gewerkenetz-hero {
    max-width: 1200px;
    margin: 50px auto 30px;
    padding: 80px 60px;
    background:
        radial-gradient(circle at 92% 18%, rgba(18, 174, 181, 0.13), transparent 30%),
        linear-gradient(135deg, #f8fafc 0%, var(--gn-light) 100%);
    border: 1px solid rgba(7, 52, 107, 0.06);
    border-radius: 14px;
}

.gewerkenetz-hero h1 {
    max-width: 950px;
    margin: 0 0 24px;
    color: var(--gn-navy);
    font-size: clamp(2.35rem, 5vw, 4.25rem);
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.gewerkenetz-hero > p {
    max-width: 900px;
    margin: 0 0 30px;
    color: var(--gn-navy);
    font-size: 18px;
    line-height: 1.7;
}

.gewerkenetz-hero .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 25px 0 0;
}

.gewerkenetz-hero .wp-block-button__link {
    padding: 14px 24px;
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.gewerkenetz-hero .wp-block-button__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(7, 52, 107, 0.16);
}

.gewerkenetz-hero .wp-block-button:first-child .wp-block-button__link {
    background: var(--gn-navy);
    color: var(--gn-white);
}

.gewerkenetz-hero .wp-block-button:first-child .wp-block-button__link:hover {
    background: #052956;
    color: var(--gn-white);
}

.gewerkenetz-hero .wp-block-button:last-child .wp-block-button__link {
    background: var(--gn-teal);
    color: var(--gn-white);
}

.gewerkenetz-hero .wp-block-button:last-child .wp-block-button__link:hover {
    background: var(--gn-teal-dark);
    color: var(--gn-white);
}

/* =========================================================
   GEMEINSAME ABSCHNITTSÜBERSCHRIFTEN
   ========================================================= */

.gewerkenetz-bereiche > h2,
.gewerkenetz-aktuell > h2,
.gewerkenetz-ablauf > h2,
.gewerkenetz-zielgruppen > h2,
.gewerkenetz-gewerke > h2,
.gewerkenetz-mailing > h2,
.gewerkenetz-faq > h2,
.gewerkenetz-abschluss > h2,
.gewerkenetz-seite > h1,
.gewerkenetz-seite > h2 {
    margin-top: 0;
    color: var(--gn-navy);
    line-height: 1.25;
}

.gewerkenetz-bereiche > h2,
.gewerkenetz-aktuell > h2,
.gewerkenetz-ablauf > h2,
.gewerkenetz-zielgruppen > h2,
.gewerkenetz-gewerke > h2,
.gewerkenetz-faq > h2 {
    margin-bottom: 12px;
}

.gewerkenetz-bereiche > p,
.gewerkenetz-aktuell > p,
.gewerkenetz-ablauf > p,
.gewerkenetz-zielgruppen > p,
.gewerkenetz-gewerke > p,
.gewerkenetz-faq > p {
    max-width: 850px;
    margin-top: 0;
    color: var(--gn-muted);
    font-size: 17px;
    line-height: 1.7;
}

/* =========================================================
   SECHS INSERATSARTEN
   ========================================================= */

.gewerkenetz-bereiche {
    --wp--style--block-gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 30px 70px;
}

.gewerkenetz-bereiche > p {
    margin-bottom: 35px;
}

.gewerkenetz-bereiche > .wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 24px;
    margin: 0 0 24px;
}

.gewerkenetz-bereiche > .wp-block-columns > .wp-block-column {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

.gewerkenetz-kachel {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding: 28px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 12px;
    box-shadow: var(--gn-shadow-md);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.gewerkenetz-kachel:hover {
    transform: translateY(-4px);
    border-color: rgba(18, 174, 181, 0.45);
    box-shadow: 0 13px 32px rgba(7, 52, 107, 0.14);
}

.gewerkenetz-kachel h3 {
    margin: 0 0 12px;
    color: var(--gn-navy);
    line-height: 1.3;
}

.gewerkenetz-kachel p {
    flex-grow: 1;
    margin: 0 0 18px;
    color: var(--gn-muted);
    line-height: 1.65;
}

.gewerkenetz-kachel .wp-block-buttons {
    margin: auto 0 0;
}

.gewerkenetz-kachel .wp-block-button__link {
    padding: 11px 18px;
    background: var(--gn-teal);
    color: var(--gn-white);
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.gewerkenetz-kachel .wp-block-button__link:hover {
    background: var(--gn-navy);
    color: var(--gn-white);
    transform: translateY(-1px);
}

/* =========================================================
   AKTUELLE INSERATE
   ========================================================= */

.gewerkenetz-aktuell {
    max-width: 1200px;
    margin: 0 auto;
    padding: 65px 30px 85px;
}

.gewerkenetz-aktuell > p {
    margin-bottom: 35px;
}

.gewerkenetz-aktuell .hp-listings,
.gewerkenetz-aktuell .gn-listings-grid {
    margin-top: 10px;
}

.gewerkenetz-aktuell .hp-row {
    align-items: stretch;
}

.gewerkenetz-aktuell .hp-grid__item {
    display: flex;
}

.gewerkenetz-aktuell .hp-listing--view-block {
    width: 100%;
    min-height: 100%;
    background: var(--gn-white);
}

.gewerkenetz-aktuell .hp-listing__content {
    padding: 24px;
}

/* Plugin-eigenes Inseratsraster */
.gn-listings-grid {
    display: grid;
    grid-template-columns: repeat(var(--gn-listing-columns, 3), minmax(0, 1fr));
    gap: 24px;
}

.gn-listing-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 26px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 12px;
    box-shadow: var(--gn-shadow-md);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.gn-listing-card:hover {
    transform: translateY(-3px);
    border-color: rgba(18, 174, 181, 0.45);
    box-shadow: 0 12px 28px rgba(7, 52, 107, 0.12);
}

.gn-listing-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
}

.gn-listing-card__tag {
    display: inline-flex;
    padding: 5px 9px;
    color: var(--gn-navy);
    background: rgba(23, 104, 213, 0.09);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.gn-listing-card h3 {
    margin: 0 0 12px;
    color: var(--gn-navy);
    font-size: 20px;
    line-height: 1.35;
}

.gn-listing-card h3 a {
    color: inherit;
    text-decoration: none;
}

.gn-listing-card p {
    margin: 0 0 20px;
    color: var(--gn-muted);
    line-height: 1.65;
}

.gn-listing-card__link {
    margin-top: auto;
    color: var(--gn-teal);
    font-weight: 700;
    text-decoration: none;
}

.gn-empty-state {
    padding: 30px;
    color: var(--gn-muted);
    background: var(--gn-light);
    border: 1px dashed var(--gn-border);
    border-radius: 10px;
    text-align: center;
}

/* =========================================================
   ABLAUF
   ========================================================= */

.gewerkenetz-ablauf {
    max-width: 1200px;
    margin: 0 auto 80px;
    padding: 70px 30px;
    background: var(--gn-light);
    border-radius: 14px;
}

.gewerkenetz-ablauf > p {
    margin-bottom: 38px;
}

.gewerkenetz-ablauf > .wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 24px;
    margin-bottom: 0;
}

.gewerkenetz-ablauf > .wp-block-columns > .wp-block-column {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

.gewerkenetz-schritt {
    position: relative;
    width: 100%;
    min-height: 100%;
    padding: 30px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(7, 52, 107, 0.07);
}

.gewerkenetz-schritt::before {
    content: "";
    display: block;
    width: 52px;
    height: 5px;
    margin-bottom: 22px;
    background: linear-gradient(90deg, var(--gn-blue), var(--gn-teal));
    border-radius: 999px;
}

.gewerkenetz-schritt h3 {
    margin: 0 0 14px;
    color: var(--gn-navy);
    line-height: 1.35;
}

.gewerkenetz-schritt p {
    margin: 0;
    color: var(--gn-muted);
    line-height: 1.7;
}

/* =========================================================
   ZIELGRUPPEN
   ========================================================= */

.gewerkenetz-zielgruppen {
    max-width: 1200px;
    margin: 0 auto;
    padding: 35px 30px 90px;
}

.gewerkenetz-zielgruppen > p {
    margin-bottom: 38px;
}

.gewerkenetz-zielgruppen > .wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 24px;
    margin-bottom: 0;
}

.gewerkenetz-zielgruppen > .wp-block-columns > .wp-block-column {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

.gewerkenetz-zielgruppe {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding: 38px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-top: 5px solid var(--gn-teal);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(7, 52, 107, 0.09);
}

.gewerkenetz-zielgruppe:first-child {
    border-top-color: var(--gn-navy);
}

.gewerkenetz-zielgruppe h3 {
    margin: 0 0 14px;
    color: var(--gn-navy);
    line-height: 1.3;
}

.gewerkenetz-zielgruppe > p {
    margin: 0 0 20px;
    color: var(--gn-muted);
    line-height: 1.7;
}

.gewerkenetz-zielgruppe ul {
    margin: 0 0 28px;
    padding-left: 0;
    list-style: none;
}

.gewerkenetz-zielgruppe li {
    position: relative;
    margin-bottom: 12px;
    padding-left: 28px;
    color: var(--gn-text);
    line-height: 1.55;
}

.gewerkenetz-zielgruppe li::before {
    content: "✓";
    position: absolute;
    top: 0;
    left: 0;
    color: var(--gn-teal);
    font-weight: 700;
}

.gewerkenetz-zielgruppe .wp-block-buttons {
    margin: auto 0 0;
}

.gewerkenetz-zielgruppe .wp-block-button__link {
    padding: 12px 20px;
    background: var(--gn-teal);
    color: var(--gn-white);
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
}

.gewerkenetz-zielgruppe .wp-block-button__link:hover {
    background: var(--gn-navy);
    color: var(--gn-white);
}

/* =========================================================
   GEWERKE
   ========================================================= */

.gewerkenetz-gewerke {
    --wp--style--block-gap: 24px;
    max-width: 1200px;
    margin: 0 auto 85px;
    padding: 70px 30px;
    background: var(--gn-light);
    border-radius: 14px;
}

.gewerkenetz-gewerke > p {
    margin-bottom: 38px;
}

.gewerkenetz-gewerke > .wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 20px;
    margin: 0 0 20px;
}

.gewerkenetz-gewerke > .wp-block-columns > .wp-block-column {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

.gewerkenetz-gewerk,
.gn-trade-card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding: 26px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 10px;
    box-shadow: 0 7px 20px rgba(7, 52, 107, 0.06);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.gewerkenetz-gewerk::before,
.gn-trade-card::before {
    content: "";
    display: block;
    width: 34px;
    height: 4px;
    margin-bottom: 17px;
    background: var(--gn-teal);
    border-radius: 999px;
}

.gewerkenetz-gewerk:hover,
.gn-trade-card:hover {
    transform: translateY(-3px);
    border-color: rgba(18, 174, 181, 0.45);
    box-shadow: 0 11px 26px rgba(7, 52, 107, 0.12);
}

.gewerkenetz-gewerk h3,
.gn-trade-card h3 {
    margin: 0 0 10px;
    max-width: 100%;
    color: var(--gn-navy);
    font-size: 19px;
    line-height: 1.35;
    overflow-wrap: anywhere;
    word-break: normal;
    -webkit-hyphens: none;
    hyphens: none;
}

.gewerkenetz-gewerk p,
.gn-trade-card p {
    margin: 0;
    color: var(--gn-muted);
    font-size: 15px;
    line-height: 1.6;
}

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

.gn-trade-card a {
    color: inherit;
    text-decoration: none;
}

/* Abbruchaktion in der Inseratserstellung und -bearbeitung. */
.hp-form--listing-submit .hp-form__footer,
.hp-form--listing-update .hp-form__footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.gn-form-cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    color: var(--gn-navy);
    background: transparent;
    border: 1px solid var(--gn-border);
    border-radius: 6px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.gn-form-cancel:hover,
.gn-form-cancel:focus-visible {
    color: var(--gn-navy);
    background: var(--gn-white);
    border-color: var(--gn-teal);
    text-decoration: none;
}

.gewerkenetz-gewerke > .wp-block-buttons {
    margin: 30px 0 0;
}

.gewerkenetz-gewerke > .wp-block-buttons .wp-block-button__link {
    padding: 12px 21px;
    background: var(--gn-navy);
    color: var(--gn-white);
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
}

.gewerkenetz-gewerke > .wp-block-buttons .wp-block-button__link:hover {
    background: var(--gn-teal);
    color: var(--gn-white);
}

/* =========================================================
   MAILING / RAPIDMAIL
   ========================================================= */

.gewerkenetz-mailing {
    max-width: 1200px;
    margin: 0 auto 90px;
    padding: 70px 60px;
    color: var(--gn-white);
    background: linear-gradient(135deg, var(--gn-navy) 0%, #0a4b88 55%, var(--gn-teal) 140%);
    border-radius: 14px;
    box-shadow: var(--gn-shadow-lg);
}

.gewerkenetz-mailing > h2 {
    max-width: 780px;
    margin: 0 0 16px;
    color: var(--gn-white);
}

.gewerkenetz-mailing > p {
    max-width: 800px;
    margin: 0 0 28px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 17px;
    line-height: 1.7;
}

.gewerkenetz-mailing > p:last-child {
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 14px;
}

.gewerkenetz-mailing .wp-block-buttons {
    margin: 0;
}

.gewerkenetz-mailing .wp-block-button__link {
    padding: 13px 23px;
    background: var(--gn-white);
    color: var(--gn-navy);
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.gewerkenetz-mailing .wp-block-button__link:hover {
    background: var(--gn-light);
    color: var(--gn-navy);
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
}

.gewerkenetz-mailing form {
    max-width: 850px;
    margin-top: 30px;
}

.gewerkenetz-mailing input[type="text"],
.gewerkenetz-mailing input[type="email"],
.gewerkenetz-mailing select {
    background: var(--gn-white);
    color: var(--gn-text);
    border-color: rgba(255, 255, 255, 0.65);
}

.gewerkenetz-mailing input[type="submit"],
.gewerkenetz-mailing button[type="submit"] {
    background: var(--gn-white);
    color: var(--gn-navy);
    border-color: var(--gn-white);
}

/* =========================================================
   FAQ
   ========================================================= */

.gewerkenetz-faq {
    max-width: 1000px;
    margin: 0 auto 90px;
    padding: 20px 30px 40px;
}

.gewerkenetz-faq > p {
    margin-bottom: 36px;
}

.gewerkenetz-faq-eintrag {
    margin-bottom: 14px;
    padding: 0;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 10px;
    box-shadow: var(--gn-shadow-sm);
    overflow: hidden;
}

.gewerkenetz-faq-eintrag summary {
    position: relative;
    padding: 20px 56px 20px 22px;
    color: var(--gn-navy);
    font-weight: 700;
    line-height: 1.45;
    cursor: pointer;
    list-style: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.gewerkenetz-faq-eintrag summary::-webkit-details-marker {
    display: none;
}

.gewerkenetz-faq-eintrag summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 22px;
    width: 28px;
    height: 28px;
    transform: translateY(-50%);
    color: var(--gn-teal);
    font-size: 25px;
    font-weight: 500;
    line-height: 26px;
    text-align: center;
}

.gewerkenetz-faq-eintrag[open] summary::after {
    content: "−";
}

.gewerkenetz-faq-eintrag summary:hover,
.gewerkenetz-faq-eintrag[open] summary {
    background: var(--gn-light);
}

.gewerkenetz-faq-eintrag[open] summary {
    border-bottom: 1px solid var(--gn-border);
}

.gewerkenetz-faq-eintrag > *:not(summary) {
    margin-left: 22px;
    margin-right: 22px;
}

.gewerkenetz-faq-eintrag > p {
    margin-top: 20px;
    margin-bottom: 22px;
    color: var(--gn-muted);
    line-height: 1.7;
}

/* =========================================================
   ABSCHLUSS-CTA
   ========================================================= */

.gewerkenetz-abschluss {
    max-width: 1200px;
    margin: 0 auto 90px;
    padding: 70px 60px;
    text-align: center;
    background: var(--gn-light);
    border: 1px solid var(--gn-border);
    border-radius: 14px;
}

.gewerkenetz-abschluss > h2 {
    max-width: 800px;
    margin: 0 auto 16px;
}

.gewerkenetz-abschluss > p {
    max-width: 820px;
    margin: 0 auto 28px;
    color: var(--gn-muted);
    font-size: 17px;
    line-height: 1.7;
}

.gewerkenetz-abschluss > p:last-child {
    margin-top: 18px;
    margin-bottom: 0;
    font-size: 14px;
}

.gewerkenetz-abschluss .wp-block-buttons {
    justify-content: center;
    gap: 12px;
    margin-bottom: 0;
}

.gewerkenetz-abschluss .wp-block-button__link {
    padding: 13px 23px;
    border-radius: 6px;
    font-weight: 700;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gewerkenetz-abschluss .wp-block-button:first-child .wp-block-button__link {
    background: var(--gn-navy);
    color: var(--gn-white);
}

.gewerkenetz-abschluss .wp-block-button:last-child .wp-block-button__link {
    background: var(--gn-teal);
    color: var(--gn-white);
}

.gewerkenetz-abschluss .wp-block-button__link:hover {
    color: var(--gn-white);
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(7, 52, 107, 0.14);
}

/* =========================================================
   UNTERSEITEN
   ========================================================= */

.gewerkenetz-seite {
    max-width: 1000px;
    margin: 45px auto 90px;
    padding: 55px 45px;
    background: var(--gn-white);
    border: 1px solid var(--gn-border);
    border-radius: 14px;
    box-shadow: var(--gn-shadow-sm);
}

.gewerkenetz-seite > h1 {
    margin-bottom: 20px;
}

.gewerkenetz-seite h2 {
    margin-top: 42px;
    margin-bottom: 14px;
    color: var(--gn-navy);
}

.gewerkenetz-seite h3 {
    margin-top: 30px;
    margin-bottom: 10px;
    color: var(--gn-navy);
}

.gewerkenetz-seite p,
.gewerkenetz-seite li {
    color: var(--gn-text);
    line-height: 1.75;
}

.gewerkenetz-seite .gn-placeholder {
    padding: 18px 20px;
    color: var(--gn-danger);
    background: #fff4f2;
    border: 1px solid #fecdca;
    border-radius: 8px;
    font-weight: 700;
}

/* =========================================================
   WORDPRESS / LISTINGHIVE / HIVEPRESS
   ========================================================= */

.wp-block-button__link {
    box-sizing: border-box;
}

.wp-block-button__link:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 3px solid rgba(18, 174, 181, 0.32);
    outline-offset: 2px;
}

.header-navbar {
    background: var(--gn-white);
    border-bottom: 1px solid #edf0f4;
}

.header-navbar__menu > ul > li > a,
.header-navbar__burger > ul > li > a {
    color: var(--gn-text);
}

.header-navbar__menu > ul > li > a:hover,
.header-navbar__burger > ul > li > a:hover {
    color: var(--gn-teal);
}

.header-navbar .button,
.header-navbar .hp-link {
    border-radius: 6px;
}

.site-footer {
    background: var(--gn-white);
    border-top: 1px solid #edf0f4;
}

.site-footer h5,
.site-footer h6,
.site-footer .widget__title {
    color: var(--gn-navy);
}

.site-footer a {
    color: var(--gn-muted);
}

.site-footer a:hover {
    color: var(--gn-teal);
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="tel"],
input[type="date"],
textarea,
select {
    border: 1px solid var(--gn-border);
    border-radius: 6px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
textarea:focus,
select:focus {
    border-color: var(--gn-teal);
    box-shadow: 0 0 0 3px rgba(18, 174, 181, 0.12);
    outline: none;
}

.hp-form__button,
.hp-button,
button,
input[type="submit"] {
    border-radius: 6px;
}

.hp-form__button,
.hp-button--primary,
input[type="submit"] {
    background: var(--gn-teal);
    color: var(--gn-white);
    border-color: var(--gn-teal);
}

.hp-form__button:hover,
.hp-button--primary:hover,
input[type="submit"]:hover {
    background: var(--gn-navy);
    color: var(--gn-white);
    border-color: var(--gn-navy);
}

.hp-listing--view-block {
    border: 1px solid var(--gn-border);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(7, 52, 107, 0.07);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.hp-listing--view-block:hover {
    transform: translateY(-3px);
    border-color: rgba(18, 174, 181, 0.4);
    box-shadow: 0 12px 28px rgba(7, 52, 107, 0.12);
}

.hp-listing__title a {
    color: var(--gn-navy);
}

.hp-listing__title a:hover {
    color: var(--gn-teal);
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {
    .gewerkenetz-hero,
    .gewerkenetz-ablauf,
    .gewerkenetz-gewerke,
    .gewerkenetz-mailing,
    .gewerkenetz-abschluss,
    .gewerkenetz-seite {
        margin-left: 20px;
        margin-right: 20px;
    }

    .gewerkenetz-bereiche,
    .gewerkenetz-aktuell,
    .gewerkenetz-zielgruppen,
    .gewerkenetz-faq {
        padding-left: 20px;
        padding-right: 20px;
    }

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

/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width: 781px) {
    .gewerkenetz-hero,
    .gewerkenetz-ablauf,
    .gewerkenetz-gewerke,
    .gewerkenetz-mailing,
    .gewerkenetz-abschluss,
    .gewerkenetz-seite {
        margin-left: 15px;
        margin-right: 15px;
        padding: 50px 24px;
        border-radius: 10px;
    }

    .gewerkenetz-hero {
        margin-top: 20px;
    }

    .gewerkenetz-hero h1 {
        font-size: 32px;
    }

    .gewerkenetz-hero > p,
    .gewerkenetz-bereiche > p,
    .gewerkenetz-aktuell > p,
    .gewerkenetz-ablauf > p,
    .gewerkenetz-zielgruppen > p,
    .gewerkenetz-gewerke > p,
    .gewerkenetz-mailing > p,
    .gewerkenetz-faq > p,
    .gewerkenetz-abschluss > p {
        font-size: 16px;
    }

    .gewerkenetz-hero .wp-block-buttons,
    .gewerkenetz-abschluss .wp-block-buttons,
    .gewerkenetz-mailing .wp-block-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .gewerkenetz-hero .wp-block-button,
    .gewerkenetz-hero .wp-block-button__link,
    .gewerkenetz-abschluss .wp-block-button,
    .gewerkenetz-abschluss .wp-block-button__link,
    .gewerkenetz-mailing .wp-block-button,
    .gewerkenetz-mailing .wp-block-button__link {
        width: 100%;
        text-align: center;
    }

    .gewerkenetz-bereiche > .wp-block-columns,
    .gewerkenetz-ablauf > .wp-block-columns,
    .gewerkenetz-zielgruppen > .wp-block-columns,
    .gewerkenetz-gewerke > .wp-block-columns {
        flex-direction: column;
        gap: 18px;
    }

    .gewerkenetz-bereiche > .wp-block-columns > .wp-block-column,
    .gewerkenetz-ablauf > .wp-block-columns > .wp-block-column,
    .gewerkenetz-zielgruppen > .wp-block-columns > .wp-block-column,
    .gewerkenetz-gewerke > .wp-block-columns > .wp-block-column {
        width: 100%;
        flex-basis: auto;
    }

    .gewerkenetz-bereiche,
    .gewerkenetz-aktuell,
    .gewerkenetz-zielgruppen,
    .gewerkenetz-faq {
        padding-left: 20px;
        padding-right: 20px;
    }

    .gewerkenetz-zielgruppe {
        padding: 28px;
    }

    .gn-listings-grid,
    .gn-trades-grid {
        grid-template-columns: 1fr;
    }

    .hp-form--listing-submit .hp-form__footer,
    .hp-form--listing-update .hp-form__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .hp-form--listing-submit .hp-form__footer > *,
    .hp-form--listing-update .hp-form__footer > * {
        width: 100%;
    }

    .gewerkenetz-faq-eintrag summary {
        padding: 18px 50px 18px 18px;
    }

    .gewerkenetz-faq-eintrag summary::after {
        right: 17px;
    }

    .gewerkenetz-faq-eintrag > *:not(summary) {
        margin-left: 18px;
        margin-right: 18px;
    }
}

/* =========================================================
   KLEINE SMARTPHONES
   ========================================================= */

@media (max-width: 480px) {
    .gewerkenetz-hero h1 {
        font-size: 27px;
    }

    .gewerkenetz-hero,
    .gewerkenetz-ablauf,
    .gewerkenetz-gewerke,
    .gewerkenetz-mailing,
    .gewerkenetz-abschluss,
    .gewerkenetz-seite {
        margin-left: 10px;
        margin-right: 10px;
        padding: 40px 20px;
    }

    .gewerkenetz-bereiche,
    .gewerkenetz-aktuell,
    .gewerkenetz-zielgruppen,
    .gewerkenetz-faq {
        padding-left: 15px;
        padding-right: 15px;
    }

    .gewerkenetz-kachel,
    .gewerkenetz-schritt,
    .gewerkenetz-gewerk,
    .gn-trade-card,
    .gn-listing-card {
        padding: 22px;
    }

    .gewerkenetz-zielgruppe {
        padding: 24px;
    }

    .gewerkenetz-faq-eintrag summary {
        font-size: 15px;
    }
}