/*
Theme Name: CRA-Net
Theme URI: https://cra-net.org
Description: Child-Theme für CRA-Net e.V. auf Basis von Twenty Twenty-Five. Design-System (Hanken Grotesk lokal, Teal/Violett-CI aus dem Logo), Startseite aus nativen Gutenberg-Blöcken und wiederverwendbare Komponenten für alle Seiten.
Template: twentytwentyfive
Author: CRA-Net e.V.
Version: 0.2.0
Requires at least: 6.7
Tested up to: 6.9
License: GNU General Public License v2 or later
Text Domain: cranet
*/

/* ===== Schriften – lokal ===== */
@font-face{font-family:"Hanken Grotesk";font-weight:400;font-style:normal;font-display:swap;src:url("assets/fonts/HankenGrotesk-400.ttf") format("truetype");}
@font-face{font-family:"Hanken Grotesk";font-weight:500;font-style:normal;font-display:swap;src:url("assets/fonts/HankenGrotesk-500.ttf") format("truetype");}
@font-face{font-family:"Hanken Grotesk";font-weight:600;font-style:normal;font-display:swap;src:url("assets/fonts/HankenGrotesk-600.ttf") format("truetype");}
@font-face{font-family:"Hanken Grotesk";font-weight:700;font-style:normal;font-display:swap;src:url("assets/fonts/HankenGrotesk-700.ttf") format("truetype");}
@font-face{font-family:"Hanken Grotesk";font-weight:800;font-style:normal;font-display:swap;src:url("assets/fonts/HankenGrotesk-800.ttf") format("truetype");}

/* ===== Tokens ===== */
:root{
  --cn-teal:#0f8093; --cn-teal-deep:#0b6070; --cn-teal-deeper:#0c4a55;
  --cn-purple:#5b4b9e; --cn-purple-light:#6e5fb0;
  --cn-grad:linear-gradient(100deg,#18a5b8 0%,#4a86b8 48%,#6a5bb0 100%);
  --cn-hero-bg:#eef0f6; --cn-tint:#e2f0f1; --cn-surface:#fff;
  --cn-ink:#17272c; --cn-slate:#5f7176; --cn-line:#e6ebec; --cn-footer:#0c2a30;
  --cn-font:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --cn-maxw:1180px; --cn-radius:16px; --cn-shadow:0 20px 50px -30px rgba(12,74,85,.45);
}

/* ===== Basis / Parent-Layout neutralisieren ===== */
.wp-site-blocks{padding:0 !important;max-width:none !important;}
body{margin:0;}
body,.wp-site-blocks{font-family:var(--cn-font);color:var(--cn-ink);background:var(--cn-surface);line-height:1.6;-webkit-font-smoothing:antialiased;}
.cn-main img{max-width:100%;}

/* Voll­breite: Inhalte über die gesamte Viewport-Breite, nur mit Randabstand */
.cn-inner{max-width:none !important;margin-inline:0;padding-inline:clamp(20px,4vw,72px);}

/* Typo-Utilities (auf Heading/Paragraph-Blöcke) */
.cn-eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cn-teal);margin:0 0 1rem;}
.cn-eyebrow--ondark{color:#cfe6ea;}
.cn-h1{font-size:clamp(2.3rem,5.2vw,3.6rem);font-weight:800;line-height:1.04;letter-spacing:-.02em;margin:0;color:var(--cn-ink);text-wrap:balance;}
.cn-h2{font-size:clamp(1.7rem,3.4vw,2.35rem);font-weight:800;line-height:1.1;letter-spacing:-.015em;margin:0;color:var(--cn-ink);text-wrap:balance;}
.cn-lead{font-size:1.13rem;color:var(--cn-slate);margin:1.3rem 0 0;max-width:44ch;}
.cn-body{font-size:1.02rem;color:var(--cn-slate);margin:1rem 0 0;}

/* ===== Buttons (Core-Button-Block) ===== */
.wp-block-button__link{font-family:var(--cn-font);font-weight:700;font-size:.98rem;line-height:1;border-radius:9px;padding:.9rem 1.5rem;background:var(--cn-teal-deep);color:#fff;border:1.5px solid transparent;}
.wp-block-button__link:hover{filter:brightness(1.09);color:#fff;}
.wp-block-button.is-style-outline>.wp-block-button__link{background:#fff;color:var(--cn-ink);border-color:var(--cn-line);}
.wp-block-button.is-style-outline>.wp-block-button__link:hover{border-color:var(--cn-teal);color:var(--cn-teal-deep);filter:none;}
.wp-block-buttons{gap:.85rem;margin-top:2rem;}

/* ===== Header (Template-Part / HTML) ===== */
.cn-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--cn-line);}
.cn-header__row{display:flex;align-items:center;gap:1.5rem;height:74px;}
.cn-logo{display:inline-flex;align-items:center;margin-right:auto;text-decoration:none;}
.cn-logo img{height:40px;width:auto;}
.cn-nav{display:flex;gap:1.5rem;align-items:center;}
.cn-nav a{font-size:.95rem;font-weight:600;color:#33474c;text-decoration:none;}
.cn-nav a:hover{color:var(--cn-teal-deep);}
.cn-btn{display:inline-flex;align-items:center;font-weight:700;font-size:.92rem;text-decoration:none;border-radius:999px;padding:.7rem 1.35rem;background:var(--cn-teal-deep);color:#fff;}
.cn-btn:hover{filter:brightness(1.09);color:#fff;}
@media(max-width:900px){.cn-nav{display:none;}.cn-header .cn-btn{display:none;}}

/* ===== Hero ===== */
.cn-hero{background:var(--cn-hero-bg);}
.cn-hero>.cn-inner{padding-block:clamp(48px,7vw,84px);}
.cn-hero__cols{align-items:center;gap:clamp(28px,5vw,60px) !important;}
.cn-hero__media .wp-block-image,.cn-hero__media figure{margin:0;}
.cn-hero__media img{width:100%;max-height:440px;object-fit:cover;border-radius:var(--cn-radius);box-shadow:var(--cn-shadow);display:block;}
@media(max-width:781px){.cn-hero__cols{flex-direction:column-reverse !important;}}

/* ===== Partner-Leiste (HTML) ===== */
.cn-partners{border-bottom:1px solid var(--cn-line);}
.cn-partners__row{display:flex;align-items:center;gap:1.5rem;padding-block:1.5rem;}
.cn-partners__label{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9aa7ab;white-space:nowrap;}
.cn-partners__logos{display:flex;gap:1rem;flex:1;flex-wrap:wrap;}
.cn-partners__logos span{height:34px;flex:1;min-width:90px;max-width:150px;border-radius:8px;background:#f0f2f7;}

/* ===== Section-Head ===== */
.cn-sectionhead{text-align:center;max-width:640px;margin-inline:auto !important;margin-bottom:clamp(30px,4vw,48px) !important;}

/* ===== Stats ===== */
.cn-stats>.cn-inner{padding-block:clamp(52px,8vw,92px);}
.cn-stats__cols{gap:1.25rem !important;}
.cn-stat{background:var(--cn-tint);border-radius:var(--cn-radius);padding:2rem 1.25rem !important;text-align:center;}
.cn-stat__n{display:block;font-size:clamp(1.9rem,3vw,2.5rem);font-weight:800;letter-spacing:-.02em;color:var(--cn-teal-deeper);line-height:1;margin:0;}
.cn-stat__l{display:block;font-size:.92rem;color:var(--cn-slate);margin:.4rem 0 0;}
@media(max-width:781px){.cn-stats__cols{flex-wrap:wrap !important;}.cn-stats__cols>.wp-block-column{flex-basis:calc(50% - .7rem) !important;}}

/* ===== Was wir tun + Charts ===== */
.cn-about>.cn-inner{padding-block:clamp(30px,5vw,60px) clamp(52px,8vw,92px);}
.cn-about__cols{align-items:center;gap:clamp(28px,5vw,60px) !important;}
.cn-checklist{list-style:none !important;margin:1.4rem 0 0 !important;padding:0 !important;display:flex;flex-direction:column;gap:.7rem;}
.cn-checklist li{position:relative;padding-left:1.9rem;color:#2c3b40;font-weight:500;}
.cn-checklist li::before{content:"";position:absolute;left:0;top:.15em;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--cn-tint);}
.cn-checklist li::after{content:"";position:absolute;left:.42rem;top:.42em;width:.38rem;height:.62rem;border:solid var(--cn-teal-deep);border-width:0 2.5px 2.5px 0;transform:rotate(45deg);}
.cn-card{background:var(--cn-surface);border:1px solid var(--cn-line);border-radius:var(--cn-radius);box-shadow:var(--cn-shadow);}
.cn-charts{padding:1.7rem 1.8rem 1.9rem;}
.cn-charts__title{font-weight:700;font-size:.95rem;margin:0 0 1.1rem;color:var(--cn-ink);}
.cn-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.9rem;margin-bottom:.85rem;}
.cn-bar__l{font-size:.9rem;color:var(--cn-slate);white-space:nowrap;}
.cn-bar__track{height:9px;border-radius:999px;background:#eef2f3;overflow:hidden;}
.cn-bar__fill{display:block;height:100%;border-radius:999px;background:var(--cn-teal-deep);}
.cn-charts .cn-bar:nth-of-type(1) .cn-bar__fill{background:var(--cn-teal-deeper);}
.cn-charts .cn-bar:nth-of-type(2) .cn-bar__fill{background:var(--cn-teal);}
.cn-charts .cn-bar:nth-of-type(3) .cn-bar__fill{background:#8fc9d1;}
.cn-bar__v{font-size:.85rem;font-weight:700;color:var(--cn-ink);font-variant-numeric:tabular-nums;}
.cn-cols{display:flex;align-items:flex-end;gap:.7rem;height:120px;margin-top:1.6rem;}
.cn-cols span{flex:1;border-radius:7px 7px 0 0;background:var(--cn-teal);}
.cn-cols span:nth-child(1){background:#bfe0e4;}
.cn-cols span:nth-child(2){background:#8fc9d1;}
.cn-cols span:nth-child(3){background:#4fa6b3;}
.cn-cols span:nth-child(4){background:var(--cn-teal);}
.cn-cols span:nth-child(5){background:var(--cn-teal-deeper);}
.cn-charts__cap{font-size:.8rem;color:#9aa7ab;margin:.7rem 0 0;}

/* ===== Testimonial ===== */
.cn-testi{background:var(--cn-grad);color:#fff;text-align:center;}
.cn-testi>.cn-inner{padding-block:clamp(52px,8vw,84px);}
.cn-quote{font-size:clamp(1.35rem,2.6vw,1.9rem);font-weight:700;line-height:1.3;letter-spacing:-.01em;margin:0 auto;max-width:26ch;color:#fff;}
.cn-testi__by{margin:1.4rem 0 0;color:#e3ecf5;font-size:.95rem;}

/* ===== Join CTA ===== */
.cn-join>.cn-inner{padding-block:clamp(52px,8vw,92px);}
.cn-join__card{background:var(--cn-tint);border-radius:22px;padding:clamp(28px,4vw,52px) !important;}
.cn-join__cols{align-items:center;gap:clamp(28px,4vw,48px) !important;}
.cn-join__box{background:#fff;border-radius:var(--cn-radius);padding:1.8rem !important;box-shadow:var(--cn-shadow);}
.cn-join__box .cn-checklist{margin-top:0 !important;margin-bottom:1.5rem !important;}
.cn-join__box .wp-block-buttons{margin-top:0;}

/* ===== Events + Jobs ===== */
.cn-ej>.cn-inner{padding-block:0 clamp(52px,8vw,92px);}
.cn-ej__cols{gap:1.5rem !important;align-items:stretch;}
.cn-ej .cn-card{padding:1.7rem 1.8rem !important;height:100%;}
.cn-event{display:flex;gap:1.1rem;align-items:center;padding:.9rem 0;border-top:1px solid var(--cn-line);}
.cn-event--first{border-top:none;}
.cn-date{flex:none;width:56px;height:56px;border-radius:12px;background:var(--cn-tint);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;}
.cn-date__m{font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--cn-teal-deep);margin:0;}
.cn-date__d{font-size:1.35rem;font-weight:800;color:var(--cn-teal-deeper);margin:0;}
.cn-event__t{margin:0;font-weight:700;color:var(--cn-ink);}
.cn-event__m{margin:.15rem 0 0;font-size:.9rem;color:var(--cn-slate);}
.cn-ej__jobs .wp-block-buttons{margin-top:1.4rem;}

/* ===== Vorstand ===== */
.cn-board>.cn-inner{padding-block:0 clamp(56px,9vw,100px);}
.cn-board__cols{gap:1.4rem !important;margin-top:1.6rem !important;}
.cn-member__photo{aspect-ratio:1/1;border-radius:14px;background:repeating-linear-gradient(135deg,#e2f0f1 0 16px,#eef7f7 16px 32px);}
.cn-member__n{margin:.9rem 0 0;font-weight:700;color:var(--cn-ink);}
.cn-member__r{margin:.1rem 0 0;font-size:.9rem;color:var(--cn-slate);}
@media(max-width:781px){.cn-board__cols{flex-wrap:wrap !important;}.cn-board__cols>.wp-block-column{flex-basis:calc(50% - .7rem) !important;}}

/* ===== Footer (Template-Part / HTML) ===== */
.cn-footer{background:var(--cn-footer);color:#a9c4c9;}
.cn-footer__row{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between;padding-block:2.2rem;}
.cn-footer__org{margin:0;font-size:.9rem;}
.cn-footer__nav{display:flex;gap:1.5rem;flex-wrap:wrap;}
.cn-footer__nav a{color:#dcebee;text-decoration:none;font-size:.9rem;}
.cn-footer__nav a:hover{color:#fff;}

/* ===== A11y ===== */
a:focus-visible,.wp-block-button__link:focus-visible,.cn-btn:focus-visible{outline:3px solid var(--cn-purple-light);outline-offset:2px;border-radius:4px;}
@media(prefers-reduced-motion:reduce){*{transition:none !important;}}
